/*
 * 【はじめに】
 * 最終的には可能な限り、コメントは削除してください。
 * ここに記載しているコメントもほぼ不要です(auPay start / ecd は必要)
 * 変数の使い方
 * $ec_dir ･･･ それぞれ各ECの絶対パス(現状)
 * $ec_id ･･･ それぞれ各ECのID(CSVで設定している分)
 *
 * 例：background-image: url($ec_dir + '/img/bn_main_background_sp.jpg');
 *
 * SCSSについて
 * 例：if制御
 *  @if $shop == 1 {
 * 		#pc_header.ac img {
 *			width: initial;
 *		}
 *	}
 *
 * 今分かっている問題
 * 1.rgb()について
 *   rgba()を利用してください。うまく変換されません
 */
/* auPayについては、figureタグ等利用できないタグがあり、変換して利用する事になる
 * その変換されたタグ用にCSSを設定する必要があるので、下記コメントタグを利用し、
 * 開始・終了で閉じる事
 * また、if制御を利用して切り替えると楽
 * @if $shop == 5 {
 *	.studless .recommend > h3 > img {
 *		width: 100%;
 *	}
 * } @else {
 *	.studless .recommend > div img {
 *		width: 100%;
 *	}
 * }
 */
/*common*/
@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@400;500;700;900&display=swap');
.davanti {
  background-color: #000;
  color: #fff;
  font-size: 16px; }

.davanti * {
  font-family: 'M PLUS 1p', sans-serif; }

.davanti figure {
  margin: 0; }

.davanti img {
  display: block;
  max-width: 100%;
  height: auto; }

.davanti .bestcar_link {
  position: fixed;
  bottom: 90px;
  right: 0px;
  width: 240px;
  height: auto;
  z-index: 999; }

.davanti .bestcar_link img {
  width: 100%; }

.davanti .top_link {
  position: fixed;
  bottom: 5px;
  right: 10px;
  font-weight: 700;
  font-size: 14px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: #888;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  z-index: 999;
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5); }

.davanti .top_link a {
  color: #fff;
  display: block;
  text-align: center; }

.davanti .top_link span {
  width: 100%;
  display: block; }

.davanti .top_link .arrow {
  font-size: 16px;
  /**動画レスポンシブ**/ }

.davanti .video_size {
  margin: 0 20px; }

.davanti .video {
  margin-bottom: 10px;
  position: relative;
  padding-top: 56.25%;
  width: 100%; }

.davanti .video iframe, .davanti .video video {
  height: 100% !important;
  position: absolute;
  right: 0;
  top: 0;
  width: 100% !important;
  /*header*/ }

.davanti header .bread_crumb {
  font-size: 12px;
  padding: 0.5em; }

.davanti header .bread_crumb a {
  color: #fff;
  font-weight: 500;
  text-decoration: underline;
  margin-right: 0.5em; }

.davanti header .bread_crumb span {
  margin-right: 0.5em; }

.davanti h1 img {
  width: 100%; }

.davanti .aw_header {
  background-color: #000;
  display: block;
  height: 32px;
  padding: 20px 0 5px;
  text-align: center; }

.davanti .aw_header img {
  width: 160px;
  position: relative;
  z-index: 1;
  margin: 0 auto; }

.davanti header h1 {
  position: absolute;
  /* padding-top: 24%; キャンペーンアイコン用*/
  top: 0; }

.davanti header .video {
  /*82.25%　キャンペーンアイコン用*/
  padding-top: 67.25%; }

.davanti header .video > a.new_size {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 97%;
  margin: 0 auto;
  display: block;
  right: 0; }

.davanti header .video > a.new_size img {
  display: block;
  width: 100%; }

.davanti header .video nav {
  /* display: none; */
  bottom: 0;
  position: absolute;
  width: 100%;
  z-index: 1; }

.davanti header .video nav ul {
  display: flex;
  justify-content: center;
  /*IE10*/
  text-align: center;
  display: -ms-flexbox; }

.davanti header .video nav ul li {
  width: 33%; }

.davanti header .video nav ul li img {
  width: 90%;
  margin: 0 auto 5px;
  /*main*/ }

.davanti .figure img {
  width: 100%; }

.davanti section h2 {
  background-color: #eb5c05;
  text-align: center;
  margin-bottom: 30px; }

.davanti section h2 img {
  margin: 0 auto; }

.davanti section > p {
  background-color: #000;
  line-height: 1.8em;
  margin: 0 20px 20px;
  position: relative;
  z-index: 1;
  /**lineup**/ }

.davanti .lineup {
  position: relative; }

.davanti .lineup .obj-fit-img {
  font-family: 'object-fit: none; object-position: -3px 0;';
  height: 92px;
  object-fit: none;
  object-position: -3px 0;
  width: 300px; }

.davanti .lineup .video_size {
  margin: 0 0px 40px;
  /**新lineup（2022.7 追加分）**/ }

.davanti .lineup .lineup_nav {
  margin-bottom: 20px;
  /*2024.9.26追加*/ }

.davanti .lineup_bg {
  background: url("/asp/photo/auction/brand/davanti/img/sp_lineup_bg.jpg") top / contain repeat-y;
  margin-bottom: 30px; }

.davanti .lineup_bg section {
  width: 95%;
  max-width: 980px;
  padding: 50px 0;
  margin: 0 auto;
  border-bottom: 1px solid #fff; }

.davanti .lineup_bg section:last-of-type {
  border-bottom: none; }

.davanti .lineup_bg section h3 {
  font-size: 7vw;
  font-weight: 900;
  text-align: center;
  margin-bottom: 50px; }

.davanti .lineup_bg section h3 small {
  display: block;
  font-size: 0.7em;
  font-weight: 700; }

.davanti .lineup_bg section ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start; }

.davanti .lineup_bg section ul li {
  width: 48%;
  margin-bottom: 10vw; }

.davanti .lineup_bg .inch {
  color: #ff7e00;
  font-size: 3.2vw;
  border: 1px solid #ff7e00;
  font-weight: 700;
  text-align: center;
  width: 6.5em;
  line-height: 1.8;
  margin-bottom: 0.5em; }

.davanti .lineup_bg .car {
  font-size: 3.2vw;
  font-weight: 500;
  margin-bottom: 0.5em;
  letter-spacing: -0.03em; }

.davanti .lineup_bg .ptn_img {
  display: block;
  height: 35vw;
  overflow: hidden; }

.davanti .lineup_bg .ptn_img img {
  display: block;
  width: 90%;
  margin: 0 auto; }

.davanti .lineup_bg .ptn_name {
  text-align: center;
  font-size: 4.8vw;
  font-weight: 700;
  height: 4em;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  line-height: 1.3; }

.davanti .lineup_bg .ptn_name small {
  display: block;
  font-size: 0.65em;
  font-weight: 500; }

.davanti .lineup_bg .btn_link {
  display: block;
  font-size: 3.75vw;
  font-weight: 700;
  text-align: center;
  color: #fff;
  background-color: #eb5c05;
  border-radius: 0.5em;
  line-height: 2.5;
  /*フッターナビ*/ }

.davanti .foot_nav h4 {
  font-size: 20px;
  font-weight: 900;
  text-align: center;
  color: #eb5c05; }

.davanti .foot_nav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  width: 95%;
  margin: 0 auto;
  padding-bottom: 30px; }

.davanti .foot_nav ul li {
  width: 100%;
  margin-bottom: 10px; }

.davanti .foot_nav ul li a {
  display: block;
  border: 2px solid #eb5c05;
  background-color: #1e1a1c;
  padding: 5px; }

.davanti .foot_nav ul li a img {
  margin: 0 auto;
  /*フッター*/ }

.davanti footer .partner {
  background-color: #1e1a1c;
  padding: 40px 0; }

.davanti footer .partner a, .davanti footer .partner span {
  display: block;
  text-align: center; }

.davanti footer .partner img {
  margin: 0 auto; }

.davanti footer .partner a:nth-of-type(1) img {
  width: 320px;
  text-align: center;
  margin: 0 auto; }

.davanti footer .partner span img {
  width: 70px;
  margin: 6vw auto; }

.davanti footer .partner a:nth-of-type(2) img {
  width: 240px; }

footer nav {
  background-color: #eb5c05;
  text-align: center;
  padding: 20px; }

footer nav a {
  color: #fff;
  text-decoration: none; }

footer nav li {
  display: inline-block;
  margin: 10px 20px; }

footer nav li:first-child {
  padding: 5px 10px;
  background-color: #555559;
  border-radius: 5px; }

footer small {
  display: block;
  background-color: #555559;
  color: #fff;
  padding: 10px 0;
  text-align: center; }

@media screen and (min-width: 768px) {
  .davanti header, .davanti .lineup > .figure, .davanti .lineup > section:nth-of-type(1) {
    max-width: 980px;
    margin: 0 auto;
    /*ヘッダー*/ }
    .davanti header .bread_crumb {
      font-size: 14px; }
    .davanti header h1 {
      padding-top: 2%; }
    .davanti header .video {
      padding-top: 62.25%; }
    .davanti header .video > a.new_size {
      top: auto;
      bottom: 150px;
      width: 71%;
      max-width: 600px; }
    .davanti header .video nav ul {
      background: url("/asp/photo/auction/brand/davanti/img/top_bg_line.png");
      /*IE10*/
      justify-content: center;
      -ms-flex-pack: center; }
    .davanti header .video nav ul li {
      margin: 0 20px;
      width: inherit; }
    .davanti header .video nav ul li img {
      width: inherit;
      /**lineup**/ }
    .davanti .lineup .obj-fit-img {
      font-family: inherit;
      height: inherit;
      object-fit: inherit;
      object-position: inherit;
      width: inherit; }
    .davanti .lineup .video_size {
      display: flex;
      display: -ms-flexbox;
      margin-bottom: 40px; }
    .davanti .lineup .video_size .video {
      width: 50%;
      padding-top: 25%;
      /**新lineup（2022.7 追加分）**/ }
    .davanti .lineup nav ul {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      max-width: 980px;
      margin: 0 auto; }
    .davanti .lineup nav ul li {
      width: 32%; }
    .davanti .lineup .lineup_nav {
      margin-bottom: 40px; }
    .davanti .lineup a .lineup_nav:hover {
      filter: grayscale(100%);
      /*2024.9.26追加*/ }
    .davanti .lineup_bg {
      background: url("/asp/photo/auction/brand/davanti/img/pc_lineup_bg.jpg") top / cover no-repeat; }
    .davanti .lineup_bg section h3 {
      font-size: 32px; }
    .davanti .lineup_bg section ul {
      justify-content: flex-start; }
    .davanti .lineup_bg section ul li {
      width: 230px;
      margin-right: calc(33.3% - 230px + (33.3% - 230px) / 2);
      margin-bottom: 80px; }
    .davanti .lineup_bg section ul li:nth-of-type(3n) {
      margin-right: 0; }
    .davanti .lineup_bg .inch {
      font-size: 14px; }
    .davanti .lineup_bg .car {
      font-size: 16px; }
    .davanti .lineup_bg .ptn_img {
      height: 270px; }
    .davanti .lineup_bg .ptn_img img {
      height: 100%;
      width: auto;
      margin: 0 auto; }
    .davanti .lineup_bg .ptn_name {
      font-size: 22px; }
    .davanti .lineup_bg .btn_link {
      font-size: 16px;
      /*フッターナビ*/ }
    .davanti .foot_nav ul {
      max-width: 980px; }
    .davanti .foot_nav ul li {
      width: 300px;
      margin: 20px; }
    .davanti .foot_nav ul li a {
      padding: 20px;
      /*フッター*/ }
    .davanti #partner {
      padding: 20px 0; }
    .davanti footer .partner {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      padding: 30px 0 30px; }
    .davanti footer .partner img {
      margin: 0 auto; }
    .davanti footer .partner span img {
      margin: 20px 60px; }
    .davanti footer .partner a:nth-of-type(2) img {
      width: 240px; }
    .davanti #partner img:nth-child(2) {
      display: inline-block;
      margin: 0;
      height: 3em; } }