@charset "utf-8";

/*---------------------------------
  base
---------------------------------*/
body { font-size:14px; }

#wrapper { min-width:inherit; }

.wide_inner,
.inner, .narrow { margin:0 15px; }
.inner { width:auto; margin:0 15px; }

#pan { display:none; }
.pageTitle { font-size:21px; }
.pageTitle .enFont { font-size:12px; }

#contents { padding-top:21px; padding-bottom:21px; }

/* title */
#top .sec_ttl { margin-bottom: 30px; }
#top .sec_ttl .enFont{ font-size: 15px; }
#top .sec_ttl .ttl_txt{ font-size:25px; }
#top .sec_ttl .ttl_txt { padding:0 30px 0 30px; }
#top .sec_ttl .ttl_txt::before, .sec_ttl .ttl_txt::after { width: 60px; height: 40px;}

.section_ttl{ margin-bottom: 0; font-size: 26px; }
.section_ttl2 { width:100%; }

/* btn-def */
.btn-def { display:inline-block; padding:.75em 1em; text-align:center;
    font-size:1.2em; font-weight:bold; color:#fff; line-height:1; background:#ed1c24; border-radius:5px; }

/* template */
.tbl { border-collapse:collapse; width:100%; margin:0 auto; }
.tbl tr > * { display:block; }
.tbl th, .tbl td  { padding:8px 13px; border-bottom:none; }
.tbl th { width:100%; }
.tbl td { background:#f5f5f5; }

/* table */
.conTbl { width:100%; border-collapse:collapse; border-spacing:0; }
.conTbl tr { display:block; }
.conTbl tr > * { width:100%; display:block; padding: 10px 16px; }

/*---------------------------------
  header
---------------------------------*/
#header { padding-top:0; }
#header .sitename { width:150px; padding: 5px 0 10px 10px; }
/*#header .hCopy { margin:0; padding-right: 16%; font-size:12px; line-height:1.2; }*/
.h-reserve { margin:5px 60px 0 0; }
.h-reserve > a { margin:0; padding:.6em .75em; font-size:15px; line-height:1.2; }

/*  gnav */
#gnav { display:none; z-index:999; width:100%; margin:0; padding:0; background-color:#005aaa; }
#gnav .btn-def { display:block; width:80%; margin-inline:auto; }

#gnav > ul > li { width: 100%; border-top:1px solid #fff; }
#gnav > ul > li > a { display:block; padding: 15px 10px 15px 80px; color:#fff; text-align:left; font-size:17px; font-weight:bold; line-height:1; }
#gnav > ul > li > a:before { top: auto; left: 10%; }
#gnav > ul > li > a::after { text-align: left; }

#gnav > ul li a span { display:block; margin-bottom:6px; font-size:9px; text-indent:0.2em; position:relative; }
#gnav > ul li a span:before { content:""; position:absolute; top:8px; left:-30px; width:25px; height:25px; background:url("../img/top/ico_home.svg") no-repeat center / 100% auto; }
#gnav li.stock a span:before { height:30px; background-image:url("../img/top/ico_stock.svg"); }
#gnav li.reason a span:before { background-image:url("../img/top/ico_reason.svg"); }
#gnav li.about a span:before { background-image:url("../img/top/ico_about.svg"); }
#gnav li.staff a span:before { background-image:url("../img/top/ico_staff.svg"); }
#gnav li.company a span:before { background-image:url("../img/top/ico_company.svg"); }

#gnav .sub_gnav { position: static; border-top: 1px solid #fff; }
#gnav .sub_gnav li {  width: 100%; }
#gnav .sub_gnav li a { padding: 15px; display: block; color: #fff; background: #0057a2; }
#gnav .sub_gnav li + li a { border-top: 1px dashed #fff; }

/* menuボタン */
.menu-button,
.menu-button span { display:inline-block; transition:all .5s; -webkit-transition:all .5s; box-sizing:border-box; }
.menu-button { display:block; position:absolute; top:0; right:0; z-index:10; min-width:55px; width:10%; height:65px; }
.menu-button span { position:absolute; left:15%; top:10px; width:70%; height:3px; background-color:#ec1d24; }

.menu-button span:nth-of-type(1) { top:5px; font-size:14px; background:none; color:#ec1d24; font-weight:bold; height:auto; text-align:center; line-height:1.5; }
.menu-button span:nth-of-type(2) { top:30px; }
.menu-button span:nth-of-type(3) { top:40px; }
.menu-button span:nth-of-type(4) { top:50px; }

.menu-button.active span:nth-of-type(2) {
  -webkit-transform:translateY(11px) rotate(-45deg);
  transform:translateY(11px) rotate(-45deg);
}
.menu-button.active span:nth-of-type(3) {
  opacity:0;
}
.menu-button.active span:nth-of-type(4) {
  -webkit-transform:translateY(-9px) rotate(45deg);
  transform:translateY(-9px) rotate(45deg);
}

/*---------------------------------
  footer
---------------------------------*/
.flo_nav {
  position:fixed; right:0; bottom:0; z-index:9999;
  width:100%; display:flex; overflow:hidden;}
.flo_nav > li{ margin-bottom:0; }
.flo_nav .reserve { width:60%; background-color:#ec1d24; }
.flo_nav .contact { background-color:#0075dd; }
.flo_nav .tel { background-color:#f0f0f0; }
.flo_nav .stock { width:26%; background-color:#0075dd; }
.flo_nav > li > a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; color:#fff; font-weight:bold; line-height:1; text-align: center ;}
.flo_nav .stock a { line-height: 1.2em; }
.flo_nav > li > a > span {  }

/*
#flo_contact { width:57.7%; }
#flo_stock { width:27.6%; }
*/
#pagetop { width: 14%; }

#footer .fInfo{ padding:15px 0; }
#footer .flogo { width:70%; margin:0 auto 10px; text-align:center; }
#footer .shopInfo { width:100%; margin-top:15px; text-align:center; }
#footer .siTel { font-size:12px; }
#footer .siTel > a > em { font-size:30px; }

.fNav { padding:15px 0; }
.fNav > ul > li { margin:0 0 8px; font-size:0.9em; }
.fNav > ul > li:nth-child(2n+1) { width:56%; }
.fNav > ul > li:nth-child(2n)   { width:44%; }

.fNav > ul > li > a { margin-right:0; }

.copyright { padding:0.5em 0 5.5em; font-size:0.85em; }
.txt{ text-align:left; }

/* --掲載台数------------------------ */
.carNumList > li { width:100%; }
.carNumList > li:nth-child(n+2) { margin-top:1em; }

/*---------------------------------
  TOP
---------------------------------*/
/* leadBox ------------- */
#top .leadBox .leadBtn{ display:block; width:100%; padding: 6px 0; }

#top #wrapper > section:not(#slide):not(#carSlider) { margin-top:0; margin-bottom:50px; }

#top #slide { margin:0; }
#top #slide .slick-slide img { padding:0; }
#top .allmaker { padding:15px 0; }
#top .allmaker li { width:auto; border-left:none; }
#top .allmaker img { max-height:24px; }
#iSlider .slick-slide img { width: 100px; }
.leadBox { margin-top: 25px!important; }

.bnrList{ margin:0; }
.topnav ul { margin: 1em 0; }
.topnav li a span{ display: block; margin-top: .5em; font-size: .85em; }
.topnav a{ padding:0.5em; line-height: 1.4;}
.topnav span{ padding: 3em 0 0 0;}
.topnav span::before { left: 50%; transform: translateX(-50%); top: 0;}
.topnav .topnav_stock span::before { width: 2.5em; }
.topnav .topnav_unused span::before { width: 3.5em; }
.topnav .topnav_used span::before { width: 3em; }
.topnav .topnav_about span::before { width: 2.5em; }
.info_box{ margin-top:1em; padding:1em 1.5em; }

#top .pickup { margin-top: 40px !important; }
#top .webtokutenCon { margin-bottom:2em; padding:0.5em 0 0.8em; }

#top .flyer { padding: 20px 0 30px; }
#top .flyer ul li { width: 100%; margin-bottom: 25px; }
#top .flyer ul li.common .img figure:nth-child(2) { margin:10px 0 0; }
#top .flyer::before { right: 15px; width: 120px; }
#top .flyer::after { left: 0; width: 150px; }

.medamaBox{ margin: 0; }

.blogList li { width: 48%; height: 165px; margin-bottom: 4%; }
.blogList li:not(:nth-child(4n+1)){ margin-left: 4%; }
.blogList li:nth-child(2n+1) { margin-left: 0; }
.blogList li:nth-child(n+5) { display: none; }

#top .about .txt{ margin:0; }
#top .about .aboutList { margin-top: 50px; }
#top .about .aboutList li { width: 100%; margin-bottom:55px; }
#top .about .aboutList li:nth-child(n + 3){ margin-top:0; }
#top .about .aboutList li:last-child{ margin-bottom:0; }
#top .about .aboutList li .about_ttl { width: 90%; padding: 8px 0; margin: -45px auto 17px; font-size: 17px; }

.medamaBox > #data { margin: 0 auto 30px; font-size: 13px; position:relative; }
.medamaBox > #data > li { width:49%; margin-left:0 !important; margin-bottom:21px; background-color:#FFF; }
.medamaBox > #data > li:nth-child(2n+1) { margin-right:2%; }
.medamaBox > #data > li > a .mImg { min-height:35vw; height:auto; position:relative; }

.medamaBox .name { font-size:13px; }
.medamaBox .name span { margin-left:4px; }
.medamaBox .price span { display:inline-block; }
.medamaBox .price span.soldout { font-size:1.8em;}
.medamaBox .price span em { font-size:28px; }
.medamaBox dl { font-size:12px; }

.group-bnr { margin-bottom:6em; }

/*---------------------------------
  中ページ
---------------------------------*/
#wrapper section{text-align: center;margin-bottom: 50px;}

/* about */
#about .point .aboutList { margin-top: 50px; }
#about .point .aboutList #point1,
#about .point .aboutList #point2,
#about .point .aboutList #point3,
#about .point .aboutList #point4{ width: 100%; margin-bottom:55px; }

#about .point .aboutList #point3,
#about .point .aboutList #point4{ margin-top:0; }

#about .point .aboutList #point4{ margin-bottom:0; }
#about .point .aboutList li .about_ttl { width: 90%; padding: 8px 0; margin: -45px auto 17px; font-size: 17px; }

.melitTtl, .melitList [class^="mTxt-"] p br { display:none; }
.melitList .ttlType { position:static; left:0; width:100%; -webkit-transform:inherit; transform:inherit; }
.melitList .ttlType .txt { text-align: center; }
.melitList .ttlType figure { width:70px;/* margin:0 auto; */}
.melitList li{ margin-bottom:2em; }

.hikaku_list li{ width:48%; }
.hikaku_result .pic{ width:100%; margin:0 0 1em 0; }
.carNumBox{ margin: 3em auto; }


/* reason */
#reason #contents { padding-top:34px; }

#reason .mainBox { border-width:23px; }
#reason .mainBox .ttl img { max-width:178px; }
#reason .pageLead {padding: 0;}
#reason .pageLead, #reason #contents > section .lead { text-align:left; }
#reason .priceBox { margin-top:34px; }
#reason .priceBox li { width:100%; }
#reason .priceBox li + li { margin-top:15px; }
#reason .priceBox dl { height:auto; }
#reason .priceBox dt { background-position:left top .1em; }
#reason .priceBox .ttl{ font-size:1.2em; }
#reason #r_stock .stockBnr { width: 100%; margin: 15px auto 0; }

#reason #contents .price_wrap li,#reason #r_stock li{ margin-top:1em; }

.supportCon_box { margin-top: 25px; }
.supportCon_box .sBox { padding: 20px 20px 40px 20px; }
.supportCon_box .imgBox { width:100%; max-width:380px; }
.supportCon_box .imgBox .img01 { margin-bottom: 54px; }
.supportCon_box .imgBox .last{ margin: 0; }
.supportCon_box .txtBox { width:100%; }
.supportCon_box .ttl { font-size: 21px; }

#reason .btn-def { display: block; background: unset; }
#reason .btn-def a { padding-inline: 1.5em; line-height: 1.1; }


/* company */
#company #access .shopCon .accessBox .tbl { width:100%; margin:auto; }
#company #access .shopCon .acc_con { width: 100%; }
#company #access .shopCon .acc_con dd { margin-bottom: 10px;}

#company .history { width: 100%; }
#company .history dt { float: none; width: 100%; padding: 8px 13px; }
#company .history dd { padding: 13px; margin: 0; border-bottom: none; }
#company .history dd p { margin: 0; padding-left: 75px; }
#company .history dd p+p { margin-top: 10px; }

#company #greeting .conBox { padding: 10px 20px 20px; }
#actionplan .actionBox h3 { font-size: 20px; }


/* contact */
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], select, textarea {
    width: 100%;}

/* contact thanks */
.contactBox_tel { margin: 40px auto 0; padding: 20px 0; text-align: center; background: #e7f4ff; }
.contactBox_tel .ttl { margin: -34px auto 1em; font-size: 16px; font-weight: bold; color: #0057a2; }
.contactBox_tel .tel { display: inline-block; margin: 0 auto; font-size: 26px; font-weight: bold; color: #681916; line-height: 1; }
.contactBox_tel .tel a { color: #333; }

.thanks .intro, .thanks .info { max-width:100%; margin:21px auto; }

/* sitemap */
#sitemap .list { width:100%; }

/* insurance */
#insurance .kpi_box { margin: 0px auto; padding: 0 15px; }

/* privacy */
#privacy .txtBox .policy{ text-aline:left; }

form .pr_txt { padding: 15px;}

.dlCon dt { padding: 0.5em 0 0.2em; }
.dlCon dd p { margin-block: 0.5em; }


/* webtokuten */
.tokutenNotes { text-align:left; }

/* group */
.group-list > div { display: flex; align-items: center; flex-direction: column; gap: .7em; padding-left: unset; padding-bottom: 1.3em; border-bottom: 1px dashed #68514e;}
.group-list > div:not(:last-child) { margin-bottom: 1.5em;}
.group-list > div > dt { width: 100%; text-align: center;}
.group-list .note { display: flex; gap: .5em; font-size: 1.1em;}
.group-list .note :is(dt,dd){ padding-inline: .5em;}
.group-list .note dt { color: #fff; font-weight: bold; background: #005aaa;}
.group-list .note dd { background: #f8f8f8;}


/* 360px 以下 ------------------------ */
@media screen and (max-width:360px) {
  #header .hCopy { display:none; }
  #footer .siTel span { display:none; }
}