﻿@charset "UTF-8";
/* CSS Document */

footer { margin-top: 0; }

/*slide*/
/*#slide { background: #fbb726; }*/
/*#slide .slick-initialized .slick-slide:not(.slick-current){ opacity: .5; }*/

/*slide矢印ボタン*/
#slide .slide-arrow { display: inline-block; position: absolute; top: 50%;
    transform: translate(0, -50%); -webkit-transform: translate(0, -50%);
    width:auto; height: 140px;
    border: none; background:none;
    z-index: 5; outline: none; cursor: pointer; }
#slide .prev-arrow { left: 30px; }
#slide .next-arrow { right: 70px; }

#slide .slide-arrow::before { content: '';
    display: block;
    position: absolute; top: 0;
    border-top: 60px solid transparent;
    border-bottom: 60px solid transparent;
}
#slide .prev-arrow::before {  border-right: 40px solid #ffffff; }
#slide .next-arrow::before {  border-left: 40px solid #ffffff; }



#maker { padding-top: 0; }
#maker .img { background-color: #eee; border-radius: 10px; padding:40px; text-align: center; }
#maker.test { padding: 25px 0; }
.infinityslider .slick-slide { padding: 0 5px; }


.zozeibox { margin-top: 40px; }


/*インフォメーション*/
.information .scroll { overflow-y:auto; max-height: 250px; background: #fff;}


/* medama 今週の目玉車
================================================================== */
#medama { padding: 0 0 50px; background: #ffcda3; }
#medama .secttl { margin-bottom: 30px; padding:.5em 1em; color:#fff; font-family:'Kosugi Maru', sans-serif; font-size:27px; text-align:center; background:#f7841e; }
#medama .secttl .medama-date { font-size: 1.5em;}
#medama .secttl .medama-date .small { font-size: .75em;}
#medama .secttl .txt { position:relative; display:inline-block; padding:0 .5em 0 2.3em; }
#medama .secttl .txt:before { content:""; position:absolute; top:-.3em; left:0; width:2em; height:2em; background:no-repeat center / 100%; }
#medama .secttl.medama .txt:before { background-image:url(../img/top/ico_medama.svg)  }

#medama { padding-top: 60px; padding-bottom:50px; }
.medamaBox #data > li { width:24%; background-color:#fff; }
.medamaBox #data > li:nth-child(n+5) { margin-top: 10px; }
.medamaBox #data > li:not(:nth-child(4n+1)) { margin-left:1.3%; }
.medamaBox #data > li > a { display: block; opacity: 1; color: #000; text-decoration:none; -webkit-transition: all .3s; transition: all .3s; position: relative; }

.medamaBox .name {
  height:4em; margin:0 0 -1px; text-align:center; line-height:1.2;
  color:#FFF; background:#f7841e; position:relative;
}
.medamaBox .name em {
  display:block; padding:0 .5em; position:absolute; top:50%; left:50%; width:100%;
  transform:translateY(-50%) translateX(-50%);
  -webkit-transform:translateY(-50%) translateX(-50%);
}
.medamaBox .image { padding-top:75%; position:relative; overflow:hidden; }
.medamaBox .image > img { position:absolute; top:0; left:0; }
.medamaBox .gentei {
  position:absolute; top:0; left:0;
  display: block; width:3rem; height:3rem; padding-top:.4rem; text-align:center;
  font-size:.8em; line-height:1.1;
  color:#fff; background:#f7841e; border-radius:50%;
}
.medamaBox .gentei > em { font-size:2em; }
.medamaBox .period {
  position:absolute; bottom:25%; right:0;
  display:inline-block; padding:5px; line-height:1.3; text-align:right;
  font-size:10px; background:#fbb726; border-radius:5px 0 0 5px;
}
.medamaBox .period > em { display:block; color:#3687c3; }


.medamaBox .price { margin:10px; text-align:right; line-height:1.4; }
.medamaBox .price > span { margin-left:12px; font-weight:bold; }
.medamaBox .price > span em { font-size:38px; letter-spacing:.01em; }
.medamaBox .data { margin:0 10px; overflow:hidden; }
.medamaBox .info { margin:10px 0; }
.medamaBox .info dt, .medamaBox .info dd { margin-bottom:5px; padding:5px; }
.medamaBox .info dt { width:26%; background-color: #f7841e; color: #ffffff; }
.medamaBox .info dd { width:74%; background-color: #fff2e7;}

#medama .bnr { margin-top: 30px; }


/*チラシ*/
#flyer .inner_s { position: relative; padding-bottom: 20px; min-height: 280px; }
#flyer .inner_s .staff { position: absolute; bottom: -40px; right:0; width: 320px; }
#flyer .flyerList { max-width: 460px; }
#flyer .flyerList li { width: 48%; }
#flyer .flyerList li img { border-radius: 5px; border:3px solid #fff; transition:all .3s; -webkit-transition:all .3s; }
#flyer .flyerList li a:hover img { border-color:#fbb726; }


/*黄色ストライプ背景*/
.bg_stripe { z-index: 0; position: relative; padding:10px 0 40px;
    background: -webkit-repeating-linear-gradient(-45deg,#fff2cc 0,#fff2cc 5px,#fff 5px,#fff 10px);
    background: -o-repeating-linear-gradient(-45deg,#fff2cc 0,#fff2cc 5px,#fff 5px,#fff 10px);
    background: repeating-linear-gradient(-45deg,#fff2cc 0,#fff2cc 5px,#fff 5px,#fff 10px);
}
.bg_stripe::before { content: ""; z-index: -1; position: absolute; top: 0; left: 0;
    width: 100%; min-height: 940px;
    background: linear-gradient(to top left, rgba(255,255,255,0) 50%, #fff2cc 50%) no-repeat top left/100% 100%;}


#btnList { padding-bottom: 0; }
#btnList li { position: relative; }
#btnList li:before { position: absolute; content: ""; top: 50%; right: -10px; transform: translateY(-50%); -webkit-transform: translateY(-50%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/arrow_bu.png); width: 30px; height: 30px; display: inline-block; transition:all .5s; -webkit-transition:all .5s; }
#btnList li:hover:before { right: -17px; }

#infoBox .conttl1 { font-size: 22px; }
#infoBox .scroll { overflow-y:auto; max-height: 250px; background: #fff;}
#infoBox .scroll p { padding: 17px 20px; line-height: 1.8; }
#infoBox .scroll p:nth-child(odd) { background-color: #eff8ff; }
#infoBox .scroll em { font-family: 'Kosugi Maru', sans-serif; padding-right: 1em; color: #3687c3; }
#infoBox .information .scroll a { text-decoration: underline; color: #f7841e; }
#infoBox > div { margin-bottom:40px; }
#infoBox .box_center { margin:0 auto; }

/* スズキのリコールお知らせ */
.guidance { background: #eff8ff; margin-top: 50px; }
.guidance .innerBox { padding: 0 2em; }
.guidance .txt { margin-bottom: 20px; }
.guidance .contact { margin-bottom: 30px; }
.guidance .contact span { font-size: 20px; font-weight: bold; color: #3687c3; }
.guidance .button a { display: block; max-width: 320px; padding: 1em 0; margin: 0 auto; background: #3687c3; text-align: center; color: #fff; }
.guidance .button a:hover { background: #f7841e; }

.bnr_contact { text-align: center; }

/*おすすめカー-----------------------------------------------------*/
#osusumecar {padding: 0 0 50px; background: #fd5c2b;} 
 #osusumecar .inner {position: relative; margin: 0 auto;}
 #osusumecar h2 { margin: 0 auto; }

 #osusumecar .osusumecar_con li{width:32%; padding;5px 0.5%; margin: 0 auto; box-sizing:border-box; justify-content: center;}
 #osusumecar .osusumecar_con li img{max-width:100%; margin: 0 auto;border:solid 1px #ccc;}
/*
 #osusumecar .osusumecar_con li:not(:nth-child(3n)) { margin: 0 auto; }
 #osusumecar .osusumecar_con li a {display: block; border-radius: 6px; overflow: hidden;}
*/


/*初売り*/
.hatsuuri { margin:50px auto 10px; }