@charset "utf-8";

/*========================================================================================================================


  ◇◆◇ トップページ ◇◆◇
  
  
========================================================================================================================*/

/*----------------------------------------------------------------------------------------------------

  新着中古車
  
----------------------------------------------------------------------------------------------------*/

.lineup-headline-warp {
  background:url(../image/top/lineup-headline.jpg) no-repeat center bottom;
  background-size:2000px auto;
  position:relative;
}

.lineup-headline-warp:after {
  content:"";
  display:block;
  width:100%;
  height:100%;
  background:url(../image/headline-gr.png) repeat left top;
  position:absolute;
  left:0;
  top:0;
}

.lineup .headline {
  min-height:300px;
  padding-top:70px;
}

@media screen and (max-width:767px) {
  .lineup-headline-warp {
    background-size:auto 275px;
  }
  
  .lineup .headline {
    min-height:250px;
    padding-top:65px;
  }
}

@media screen and (max-width:640px) {
  .lineup-headline-warp {
    background-size:auto 250px;
  }
  
  .lineup .headline {
    min-height:225px;
    padding-top:55px;
  }
}

@media screen and (max-width:500px) {
  .lineup-headline-warp {
    background-size:auto 225px;
  }
  
  .lineup .headline {
    min-height:200px;
    padding-top:50px;
  }
}

@media screen and (max-width:420px) {
  .lineup-headline-warp {
    background-size:auto 200px;
  }
  
  .lineup .headline {
    min-height:175px;
    padding-top:37px;
  }
}


/*-----------------------------------------------------------------------------------
  スライド
-----------------------------------------------------------------------------------*/

.lineup-slide-warp {
  background-color:#e6e6e7;
  padding-bottom:40px;
  padding-top:80px;
  z-index:100;
  position:relative;
}

.lineup-slide {
  width:1112px;
  margin-left:auto;
  margin-right:auto;
  margin-top:-160px;
  position:relative;
}
  
.lineup-slider {
  position:relative;
}

.lineup-slider .l-lineupBlock { margin-top:0 !important; }

@media screen and (max-width:767px) {
  .lineup-slide-warp {
    padding-bottom:30px;
    padding-top:60px;
  }
  
  .lineup-slide {
    width:100%;
    margin-top:-100px;
    padding-left:20px;
    padding-right:20px;
    box-sizing:border-box;
  }
}

@media print {
  .lineup-slider .l-lineupBlock {
    width:278px !important;
  }
  
  .lineup-slider .l-lineupBlock:not(.slick-active) {
    display:none;
  }
}


/*-----------------------------------------------------------------------------------
  arrow
-----------------------------------------------------------------------------------*/

.lineup-arrow .slick-prev:before,
.lineup-arrow .slick-next:before {
  content:"";
}

.lineup-arrow .slick-prev,
.lineup-arrow .slick-next {
  font-size:0;
  color:#fff;
  display:inline-block;
  position:absolute;
  top:50%;
  margin-top:-25px;
	width:50px;
	height:50px;
  background-position:center center;
  background-repeat:no-repeat;
  background-size:auto 22px;
  background-color:#333538;
  transition:opacity 0.2s ease;
	filter:alpha(opacity=100);
	opacity:1;
	-moz-opacity:1;
}

.ua-pc .lineup-arrow .slick-prev:hover,
.ua-pc .lineup-arrow .slick-next:hover {
  filter:alpha(opacity=60);
  opacity:0.6;
  -moz-opacity:0.6;
}

.lineup-arrow .slick-prev { background-image:url(../image/icon/prev-white_b.png); left:-60px; }
.lineup-arrow .slick-next { background-image:url(../image/icon/next-white_b.png); right:-60px; }
.no-backgroundsize .lineup-arrow .slick-prev { background-image:url(../image/icon/prev-white.png); }
.no-backgroundsize .lineup-arrow .slick-next { background-image:url(../image/icon/next-white.png); }

@media screen and (max-width:767px) {
  .lineup-arrow .slick-prev,
  .lineup-arrow .slick-next {
    width:30px;
    height:60px;
    margin-top:-30px;
    background-size:auto 18px;
  }
  
  .lineup-arrow .slick-prev { left:0; }
  .lineup-arrow .slick-next { right:0; }
}


/*----------------------------------------------------------------------------------------------------

  お知らせ
  
----------------------------------------------------------------------------------------------------*/

.info-headline { margin-bottom:19px; margin-top:-4px; line-height:1; }

.info-headline .en {
  font-family:Geneva, Verdana, sans-serif;
  font-weight:bold;
  font-size:200.0%;
  display:inline-block;
}

.info-headline .jp {
  font-weight:normal;
  display:inline-block;
  font-weight:100;
  margin-left:10px;
}

.info-block {
  background-color:#fff;
  border-top:1px solid #e7e7e8;
  padding:20px;
  box-sizing:border-box;
}

.info-block.first { border-top:0; }

.info-block:after,
.info-block a:after {
  content:"";
  display:block;
  height:0;
  clear:both;
}

.info-block a,
.info-block a:visited,
.info-block a:hover {
  color:inherit;
  text-decoration:none;
}

.info-block a {
  display:block;
  position:relative;
  padding-bottom:20px;
}

@media screen and (max-width:767px) {
  .info-headline { margin-top:0; margin-bottom:1rem; }
  
  .info-block { padding:1rem; }
  .info-block a { padding-bottom:2rem; }
}

/* 画像 */
.info_photo {
  width:250px;
  display:inline-block;
  float:left;
  transition:opacity 0.2s ease
}

.ua-pc .info-block a:hover .info_photo {
  filter:alpha(opacity=60);
   opacity:0.6;
  -moz-opacity:0.6;
}

@media screen and (max-width:767px) {
  .info_photo { width:200px; }
}

@media screen and (max-width:640px) {
  .info_photo { width:35%; }
}

.info_head { padding-left:270px; padding-bottom:5px; }
.info-block.img-none .info_head { padding-left:0; margin-left:0 !important; }

@media screen and (max-width:767px) {
  .info_head { padding-left:200px; margin-left:1rem; padding-bottom:0.25rem; }
}

@media screen and (max-width:640px) {
  .info_head { padding-left:35%; }
}

@media screen and (max-width:500px) {
  .info_head { padding-bottom:0; }
}

/* カテゴリ */
.info_head .cate {
  display:inline-block;
  background-color:#ff9b00;
  color:#fff;
  padding:0.5em;
  line-height:1;
  font-size:81.3%;
  vertical-align:middle;
  margin-right:1em;
  margin-bottom:10px;
}

/* 日付 */
.info_head .date {
  display:inline-block;
  color:#85868a;
  vertical-align:top;
}

/* タイトル */
.info_head .title {
  display:inline-block;
  font-size:118.8%;
  line-height:1.4;
  transition:color 0.1s ease
}

.ua-pc .info-block a:hover .title {
  color:#e60012;
  text-decoration:underline;
}

.ua-pc .info-block a .info_head .title.glink:after {
  content:url(../image/icon/glink-red.png);
  display:inline-block;
  vertical-align:top;
  margin-left:8px;
  margin-top:-5px;
}
  

@media screen and (max-width:767px) {
  .info_head .cate {
    margin-bottom:0.5rem;
  }
}

/* コメント */
.info_body { padding-left:270px; }
.info-block.img-none .info_body { padding-left:0; margin-left:0 !important; }

@media screen and (max-width:767px) {
  .info_body { padding-left:200px; margin-left:1rem; }
}

@media screen and (max-width:640px) {
  .info_body { padding-left:35%; }
}

@media screen and (max-width:500px) {
  .info_body { padding-left:0; margin-left:0; clear:both; padding-top:0.75rem; }
  .info-block.img-none .info_body { padding-top:0.25rem; }
}

/* リンク矢印 */
.info_link { display:none; }
.info-block a .info_link {
  display:block;
  position:absolute;
  right:0;
  bottom:-5px;
}
.info-block a .info_link > div {
  position:relative;
}

.info_link span:before {
  content:"";
  display:inline-block;
  width:45px;
  height:1px;
  border-top:solid 1px #939496;
  position:absolute;
  right:5px;
  top:50%;
  transition:right 0.2s ease, width 0.2s ease, border-color 0.2s ease;
}

.info_link span:after {
  content:"";
  display:inline-block;
  width:8px;
  height:1px;
  border-top:solid 1px #939496;
  -ms-transform:rotate(45deg);
  -webkit-transform:rotate(45deg);
  transform:rotate(45deg);
  position:absolute;
  right:5px;
  top:50%;
  margin-top:-3px;
  margin-left:-0.5px;
  transition:right 0.2s ease, border-color 0.2s ease;
}

.lte-ie8 .info_link span:before,
.lte-ie8 .info_link span:after { display:none; }

.ua-pc.csstransitions .info-block a:hover .info_link span:before {
  width:30px;
}
    
.ua-pc.csstransitions .info-block a:hover .info_link span:before,
.ua-pc.csstransitions .info-block a:hover .info_link span:after {
  border-color:#e60012;
}

@media screen and (max-width:767px) {
  .info_link span:before {
    width:30px;
  }
  
  .info_link span:before,
  .info_link span:after {
    right:0;
  }
}


/*----------------------------------------------------------------------------------------------------

  side
  
----------------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------
  店舗一覧
-----------------------------------------------------------------------------------*/

.shop_headline {
  font-weight:bold;
  font-size:118.8%;
  color:#fff;
  padding:0.5em;
  text-align:center;
}

.shop-mitsubishi .shop_headline { background-color:#e60012; }
.shop-suzuki .shop_headline { background-color:#0058a8; }

.shop_list {
  background-color:#fff;
  text-align:center;
  padding:20px;
}

.shop__logo { width:120px; display:inline-block; border-bottom-width:1px; border-bottom-style:solid; margin-bottom:15px; }
.shop__logo img { margin-bottom:15px; }

.shop-mitsubishi .shop__logo { border-bottom-color:#e60012; }
.shop-suzuki .shop__logo { border-bottom-color:#0058a8; }

.shop_list ul {
  list-style:none;
  text-align:left;
}

.shop_list ul:after {
  content:"";
  display:block;
  height:0;
  clear:both;
}

.shop_list li {
  position:relative;
}

.shop_list li span {
  display:inline-block;
  position:absolute;
  right:0;
  bottom:0;
}

@media screen and (max-width:767px) {
  .shop_list {
    padding:1rem 0.75rem;
  }
  
  .shop__logo,
  .shop__logo img { margin-bottom:1rem; }
  
  .shop_list ul {
    border-top:1px solid #d4d4d5;
    font-size:93.8%;
  }
  
  .shop_list li {
    width:50%;
    float:left;
    border-bottom:1px solid #d4d4d5;
    border-left:1px solid #d4d4d5;
    border-right:1px solid #d4d4d5;
    box-sizing:border-box;
  }
  
  .shop_list li:nth-child(even) {
    border-left:none;
  }
  
  .shop_list li a {
    display:block;
    padding:0.75em;
  }
  
  .shop_list li span {
    top:0.75em;
    right:0.75em;
    font-weight:bold;
    text-decoration:underline;
  }
}

@media screen and (max-width:640px) {
  .shop_list ul {
    text-align:center;
  }
  
  .shop_list li span {
    display:block;
    position:inherit;
    top:inherit;
    right:inherit;
    text-align:center;
  }
}


/* クリーンカー
=====================================================================================*/

.cleancar { margin-top:20px; margin-bottom:20px; }

@media screen and (max-width:767px) {
  .cleancar img {
    display:none;
  }
  
  .cleancar {
    margin-top:0;
    margin-bottom:0;
    background-color:#fff;
    padding-bottom:0.75rem;
    padding-left:0.75rem;
    padding-right:0.75rem;
  }
  
  .cleancar span {
    display:block;
    background:url(../image/cleancar_sp.gif) no-repeat center top;
    background-size:contain;
    height:0;
    padding-top:9%;
  }
}


/* 三菱保証
=====================================================================================*/

.hosho-m { margin-bottom:20px; }

@media screen and (max-width:767px) {
  .hosho-m img {
    display:none;
  }
  
  .hosho-m {
    margin-bottom:0;
    background-color:#fff;
    padding-bottom:0.25rem;
    padding-left:0.75rem;
    padding-right:0.75rem;
  }
  
  .hosho-m span {
    display:block;
    background:url(../image/hosho-m_sp.gif) no-repeat center top;
    background-size:contain;
    height:0;
    padding-top:13%;
  }
}


/* スズキ保証
=====================================================================================*/

.hosho-s { margin-top:20px; }

@media screen and (max-width:767px) {
  .hosho-s img {
    display:none;
  }
  
  .hosho-s {
    margin-top:0;
    background-color:#fff;
    padding-bottom:0.25rem;
    padding-left:0.75rem;
    padding-right:0.75rem;
  }
  
  .hosho-s span {
    display:block;
    background:url(../image/hosho-s_sp.gif) no-repeat center top;
    background-size:contain;
    height:0;
    padding-top:13%;
  }
}
