@charset "utf-8";

/* base------------------------ */
#pan { padding:5px 0 0; }
#pan li { display:inline-block; font-size:13px; }
#pan li:not(:first-child):before { content:">"; padding:0 5px; color:#888; }

/* common ------------------------ */
section > .txt { margin-bottom:20px; }

/* title------------------------ */
.pageTitle { padding:45px 0; font-size:30px; text-align:center; background:#f7f3e9; }
.pageTitle .fontEn { display:block; font-size:14px; color:#f28f00; }


/* common 共通------------------------ */
.con_box { margin:50px 0; }
.con_box > .lBox, .con_box > .rBox { width:48%; }
.con_box > .lBox { margin-right:4%; }
.con_box .btn a { max-width:220px; margin-left:auto; }

.con_lead { position:relative; margin:40px 0 10px; padding:14px 220px 11px 100px; font-size:20px; text-align:center; background-color:#f5d825; }
.con_lead::before { content:""; position:absolute; width:68px; height:88px; right:130px; bottom:0; background:url(../img/service/chara_question.png) center / 100% no-repeat; }
.con_lead + .con_box { margin-top:35px; }

.link_li { margin-top:35px; }
.link_li > li + li { margin-left:35px; }
.link_li > li > a { position:relative; padding-left:20px; }
.link_li > li > a::before { content:""; position:absolute; top:4px; left:3px; width:5px; height:5px; border-top:2px solid #0c5395; border-right:2px solid #0c5395; -webkit-transform:rotate(135deg); transform:rotate(135deg); }

.shareBox { padding: 5% 5% 7%; background-color: #f7f3e9; }
.shareBox .ttl { margin: 0; font-size: 18px; font-weight: bold; text-align: center; color: #f4652f; }
.shareList { margin-top: 2%; }
.shareList li { width: 49%; font-size: 13px; }
.shareList li a { display: block; padding: 5% 2%; border: 1px solid #fff; background-color: #fff; text-align: center; }
.shareList li:nth-child(n+3) { margin-top: 2%; }
.shareList li a:hover { border: 1px solid #f4652f; }
.shareList li a span { padding-left: 25px; position: relative; }
.shareList li a span::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; margin: auto;
	width: 20px; height: 80px; background: no-repeat center / contain; }
.shareList li.mail a span::before { background-image: url("../img/icon_mail.png"); }
.shareList li.fb a span::before { background-image: url("../img/icon_fb.png"); }
.shareList li.twitter a span::before { background-image: url("../img/icon_twitter.png"); }
.shareList li.line a span::before { background-image: url("../img/icon_line.png"); }

.bnr_newyear, .bnr-corporate { margin: 2em auto;}


/* usedcar 在庫車情報
================================================================== */
.sec_read { margin-bottom:30px; padding:20px; font-size:16px; font-weight:bold; color:#0c5395; border:2px solid #0c5395; background-image:url(../img/pattern.png); }



/* reason 選ばれる理由
================================================================== */
.price_list { margin-top:40px; padding:12px; background:url(../img/pattern.png); }
.price_list .box { width:48%; background: #f7f3e9; border-radius: 0 0 10px 10px; }
.price_list .box + .box { margin-left:4%; }
.price_list .box li { padding:12px; }
.price_list .box li + li { border-top: 1px dotted #3f392a; }
.price_list .box_title { padding: 10px; background: #f1153b; font-size: 16px; text-align: center; color: #fff; border-radius: 10px 10px 0 0; }
.price_list .cheap .box_title { background: #f4652f; }

.price_list .list_title { margin:0 0 3px; padding-left: 25px; font-size: 18px; position: relative; }
.price_list .list_title::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; margin: auto;
	display: block; width: 20px; height: 20px;
background: url("../img/reason/icon_check_red.svg") no-repeat center / contain;}
.price_list .cheap .list_title::before { background: url("../img/reason/icon_check_org.svg") no-repeat center / contain; }


.price .txt { margin:0; }
.price .img_list li { width:50%; }

.price_box { display: inline-block; width: 90%; background: rgba(255,255,255,.8); padding: 10px 40px 0; margin: -60px 5% 0; }
.price_box .copy { font-size: 20px; font-weight: bold; }
.price_box .copy span { font-size: 30px; color: #f1153b; background: linear-gradient(transparent 60%, #ffff66 60%); }

.tcs_box { margin-top: 40px; }
.tcs_box > div { padding: 30px; background: #f7f3e9; border-radius: 10px; }
.tcs_box > div + div { margin-top: 40px; }
.tcs_box .lead { width: 55%; margin-right: 5%; }
.tcs_ttl { position: relative; padding: 0 0 10px 45px; font-size: 1.5em; border-bottom:2px solid #f1153b; }
.bankin .tcs_ttl { border-bottom: 2px solid #3876cb; }
.hoken .tcs_ttl { border-bottom: 2px solid #f4652f; }
.tcs_ttl::before { content: ""; position: absolute; top: 0; left: 0; width: 35px; height: 35px; background: center / 100% no-repeat; }
.syaken .tcs_ttl::before { background-image: url(../img/reason/ico_support01.svg); }
.bankin .tcs_ttl::before { background-image: url(../img/reason/ico_support02.svg); }
.hoken .tcs_ttl::before { background-image: url(../img/reason/ico_support03.svg); }

.tcs_box .slider-service { width: 40%; }
.tcs_box .bnr a { display: block; padding: 15px; border: 2px solid #f1153b; background: #fff; position: relative; }
.tcs_box .bnr a::before,
.tcs_box .bnr a::after { content: ""; position: absolute; top: 0; bottom: 0; right: 15px; margin: auto; vertical-align: middle; }
.tcs_box .bnr a::before { width: 30px; height: 30px; -webkit-border-radius: 50%; border-radius: 50%; background: #f1153b; }
.tcs_box .bnr a::after { right: 27px; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg); transform: rotate(45deg); }

.hoken_bnr { padding: 15px; border: 1px solid #cfcfcf; background: #fff; }

.safty-list { margin-top: 2em; gap: 1.5em;}

.info_ttl { position:relative; padding:0 0 10px 45px; font-size:25px; }
.info_ttl::before { content:""; position:absolute; width:35px; height:35px; top:0; left:0; background:center / 100% no-repeat; }
.syaken .info_ttl::before { background-image:url(../img/icon_syaken.png); }
.bankin .info_ttl::before { background-image:url(../img/icon_bankin.png); }
.hoken .info_ttl::before { background-image:url(../img/icon_hoken.png); }

.tcs_box .box_title { margin-top:30px; }
.charm_list { counter-reset:number 0; margin-bottom:40px; }
.charm_list > li { position:relative; padding:12px 12px 12px 45px; font-size:14px; }
.charm_list > li:nth-child(odd) { background-image:url(../img/pattern.png); }
.charm_list > li::before { counter-increment:number 1; content:counter(number) " "; position:absolute; width:26px; height:26px; top:11px; left:11px; font-size:15px; text-align:center; border-radius:50%; color:#FFF; background-color:#058127; }
.charm_list > li em { margin-right:10px; font-size:15px; }

.tcs_box .syaken .img_list > li { width:49%; }
.tcs_box .syaken .img_list > li + li { margin-left:2%; }

.hoken_bnr { margin-top:20px; }
.hoken_bnr > li + li { margin-top:10px; }

.slick-dots > li:only-child { display:none; }

.bnr-voice { margin-top: 60px; }
.bnr-voice a+a{margin-left: 10px;}

.bnr-premier {margin-bottom: 25px;}


/* about 軽未使用車とは
================================================================== */
.about_list { margin-top: 40px; }
.about_list > li { width: 48%; margin-bottom: 5%; }
.about_list .ttl { position: relative;
    margin: 0;
    padding: 10px 0;
    text-align: center;
    color: #fff;
    font-size: 1.25em;
    background: #ffc11e;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px; }
.about_list li:nth-child(2) .ttl { background: #f4652f; }
.about_list li:nth-child(3) .ttl { background: #3876cb; }
.about_list li:nth-child(4) .ttl { background: #f1153b; }
.about_list .ttl::before { content: ""; position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 50%) rotate(135deg);
width: 0; height: 0; border-left: 15px solid transparent; border-right: 1px solid transparent; border-top: 15px solid #e8be3d; z-index: 1; }
.about_list li:nth-child(2) .ttl::before { border-top: 15px solid #f4652f; }
.about_list li:nth-child(3) .ttl::before { border-top: 15px solid #3876cb; }
.about_list li:nth-child(4) .ttl::before { border-top: 15px solid #f1153b; }


.melitTtl li { width: 430px; position:relative; font-size: 21px; font-weight: bold; text-align: center; }
.melitTtl li::before{ position:absolute; content:""; bottom:-0.4em; left:calc(50% - 10px);
	width: 0; height: 0; border-style: solid;
	border-width: 10px 10px 0 10px;
	border-color: #b0b0b0 transparent transparent transparent; }
.melitTtl li.used { padding: 5px; background: #b0b0b0; color: #fff; }
.melitTtl li.unused { padding: 5px; background: #f1153b; color: #fff; }
.melitTtl li.unused::before{ border-color: #e72c22 transparent transparent transparent; }
.melitList li { margin-top: 18px; position: relative; }
.melitList .ttlType { position: absolute; top: 0; left: 50%; width: 110px; height: 110px;
	text-align: center; line-height: 1; z-index: 1; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.melitList .ttlType figure { width: 100%; }
.melitList .ttlType .txt { position: absolute; top:0; left: 0; width: 100%; margin: 0;
	font-size: 18px; font-weight: 600; }
/*.melitList [class^="mTxt-"] { width: 430px; min-height: 110px; padding: 15px; position: relative; }*/
.melitList [class^="mTxt-"] { width: 43%; padding: 15px; position: relative; }
.melitList .mTxt-unused { padding-left: 105px; background:#f1153b; }
.melitList .mTxt-used { padding-right: 105px; margin-left: 140px; background:#b0b0b0; }
.melitList [class^="mTxt-"] p { height: 100%; margin: 0; padding: 15px; font-size: 14px; background: #fff; border-radius: 5px; }
.melitList [class^="mTxt-"]:before { content: ""; position: absolute; top: 50%; width: 80px; height: 80px; -webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%); transform: translateY(-50%); border-radius: 50%; }
.melitList .mTxt-unused:before { left: 13px;
	background: #fff url("../img/about/ico_car_new.svg") no-repeat center / 60px; }
.melitList .mTxt-used:before { right: 13px;
	background: #fff url("../img/about/ico_car_old.svg") no-repeat center / 60px; }



/* company 会社紹介
================================================================== */
.accessList { margin: 10px 0 20px; }
.accessList li { width: 49%; text-align: center; border: 2px solid #f1153b; }
.accessList li:last-child { border: 2px solid #f4652f; }
.accessList li h3 { padding: 5px 0; font-size: 17px; background: #f1153b; color: #fff; }
.accessList li:last-child h3 { background: #f4652f; }

.access_box + .access_box { margin-top:60px; }
.access_box .slider-access { width: 49%; }
.access_box .addr_dtl { width: 49%; }

.greeting_box { margin-bottom: 40px; }
.greeting_box > div { padding: 30px 40px; background: #f7f3e9; border-radius: 10px; }
.greeting_box .lead { width: 65%; }
.greeting_box .copy { margin: 0; font-size: 1.3em; font-weight: bold; color: #f1153b; }
.greeting_box .img { width: 30%; }


/* お客様の声・納車式
================================================================== */
#enquete .box_area,
#nousya .box_area { margin-top: 60px; }
.enquete_list li,
.nousya_list li { width: 23.5%; margin-bottom: 2%; }
.enquete_list::before,
.enquete_list::after,
.nousya_list::before,
.nousya_list::after { order: 1; display: block; width: 23.5%; content: '';}

/* 納車式 */
.nousya_list { margin-bottom: 30px; }
.nousya_list .date { margin: 0; padding: 5px 0; background: #f1153b; border-radius: 5px 5px 0 0; text-align: center; color: #fff; }
.nousya_list .image { margin: 0; }
.nousya_list .image a { display: block; padding: 10px; background: #f7f3e9; border-radius: 0 0 5px 5px; }

/* お客様の声 */
.enquete_list li a { display: block; padding: 10px; background: #f7f3e9; border-radius: 5px 5px 0 0;}
.enquete_list li .image { margin: 0; }

.tanto_area { padding: 5px 15px 15px; background: #f7f3e9; border-radius: 0 0 5px 5px; }
.tanto_area .staff { margin: 0; width: 30%; height: 100%; background: #fff;
border-radius: 50%; overflow: hidden; }
.tanto_area .data { width: 65%; }
.tanto_area .data .date,.tanto_area .data .tanto { margin: 0; }
.tanto_area .data .tanto { font-size: 1.2em; }
.tanto_area .data .tanto span { padding: 4px 8px; margin-right: 10px; background: #f4652f; color: #fff; font-size: .8em; }

.tab_nav {
    overflow: hidden;
    max-width: 600px;
    margin: 2rem auto 2rem;
    border: 3px solid #f1153b;
    border-radius: 5px;
}
.tab_btn {
    -webkit-box-flex: 1;
    flex-grow: 1;
}
.tab_btn a {
    display: block;
    padding: 0.5em 1em;
    color: #f1153b;
    text-align: center;
    font-weight: bold;
    text-decoration: none;
		font-size: 1.2em;
}
.tab_btn.active a {
    color: #fff;
    background: #f1153b;
}
.tab_btn a:hover {
    background: #fcd5dc;
}
#voice .secTtl2 {  margin-top: 1.5em; }
.coco-review-widget3_headingTitle {
    margin-bottom: 15px;
    padding: 10px 20px;
    background: #f7f3e9;
    font-size: 1.3em;
    position: relative;
}
.coco-review-widget3_headingTitle:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: -webkit-gradient(top bottom, #fec516, #f1153b);
    background: -moz-linear-gradient(top bottom, #fec516, #f1153b);
    background: linear-gradient(to bottom, #fec516, #f1153b);
}
#voice #coco-review-widget3 .coco-review-widget3_readMoreBtnWrap .coco-review-widget3_readMoreBtn {
    display: inline-block;
    min-width: 200px;
    padding: 1em;
    background: #f1153b;
    color: #fff;
    font-size: 1em;
    text-align: center;
    vertical-align: middle;
    border: 2px solid #f1153b;
		border-radius: 0;
}
#voice #coco-review-widget3 .coco-review-widget3_readMoreBtnWrap .coco-review-widget3_readMoreBtn:hover {
    border: 2px solid #f1153b;
    background: #fff;
    color: #f1153b;
}

/* pageNav */
.pageNav { margin-bottom:2em; border:2px solid #f1153b; }
.pageNav li { width:50%; float:left; }
.pageNav li a {
	position:relative; display:block; padding:10px;
	text-align:center; font-size:16px; font-weight:bold; text-decoration:none;
	transition:all .3s; -webkit-transition:all .3s;
}
.pageNav li a:hover { background:#eeeeed; }
.pageNav li a.active { background:#f1153b; color:#fff; }


/* プライバシーポリシー------------------------ */
#policy .add_box { margin:40px 0 0; padding:20px; background: #f7f3e9; }
#policy .add_box h4 { font-size: 18px; margin: 0 0 8px; color: #f1153b; }
#policy .subTitle { margin:40px 0 15px; padding-bottom:8px; font-size:20px; font-weight:bold; border-bottom:2px solid #f28f00; }
#policy article section { padding-top:60px; }


/* contact お問い合わせ
================================================================== */
#contact .telBox { max-width:680px; margin:0 auto 2em; border:2px solid #f4652f; }
#contact .telBox > h2 { padding:.3em 1em; font-size:1.1em; color:#fff; text-align:center; background:#f4652f; }
#contact .telList { margin:1.5em; }
#contact .telList > li { width:48%; text-align:center; }
#contact .telList .name { padding:.3em 1em; color:#fff; background:#f1153b }
#contact .telList .tel { margin:.5em 0 0; font-size:1.3em; font-weight:bold; }

#contact .thanks,
#reserve .thanks { padding:20px; border:2px solid #f4652f; background-image: url(../img/pattern.png); }
#contact .thanks h3,
#reserve .thanks h3 { margin-top:20px; margin-bottom:10px; padding-top:18px; font-size:16px; font-weight:bold; border-top:1px dashed #eeeeee; }
#contact .thanks .info,
#reserve .thanks .info { margin:0; }
#contact .thanks .info p,
#reserve .thanks .info p { margin:5px 0; }
#contact .cmt_radio { margin:5px 0 10px; width:97%; }
#contact .cmt_radio label { display:block; margin-bottom:3px; padding:3px 5px; border-radius:3px; background:rgba(255,255,255,0.7); }
#contact .cmt_radio input[type="radio"] { margin:5px; }

.reserve-alert { margin-inline: auto; padding: 1em; max-width: 800px; background: #ffeded; border: 2px solid #be1118;}
.reserve-alert-ttl { font-size: 1.3em; text-align: center; font-weight: 700;}
.reserve-alert-txt .big { font-weight: 700;}

/* sitemap サイトマップ
================================================================== */
.sitemap li { padding:10px 0 7px; border-bottom:1px solid #e3e3e3;}
.sitemap + .sitemap { margin-left:80px; }
.sitemap a { position:relative; display:inline-block; text-decoration:none; font-weight:bold; font-size:15px; }
.sitemap > li > a { padding:0 20px; }
.sitemap > li > a:before { content:""; position:absolute; top:8px; left:0; width:7px; height:7px; background:#f28f00; }
.sitemap ul { margin:6px 0 0 26px; }

/* flyer チラシ
================================================================== */
#flyer .flyer_img figure { position: relative; }
#flyer .image-container { position: relative; width: 100%; max-width: 1000px; /* お好みで調整 */ }
#flyer .image-container img { width: 100%; height: 100%; display: block; }
#flyer .hover-overlay { position: absolute; border: 3px solid #fff; pointer-events: none; display: none; z-index: 2; }
.flyer_img figure { width: 100%;}
.flyer_img figure img { height: 100%;}
.flyer_img figure + figure { margin-top: 5em;}