/*
Theme Name: 2026lp
Author: you
Version: 1.0
*/

/* =========================
  Minimal Reset (Safe)
========================= */

/* body のデフォルト余白を消す（←今回の本丸） */
html, body {
  margin: 0;
  padding: 0;
}

/* 画像・SVGの謎の下余白対策 */
img, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

/* small / p / 見出しの余計な上下余白を抑制 */
p, small, h1, h2, h3, h4, h5, h6 {
  margin: 0;
}

/* フォーム系の見た目を揃える（Bootstrapと相性◎） */
button, input, textarea, select {
  font: inherit;
}


/* =========================
  header
========================= */

.site-header{
  width: 100%;
  height: 50px;
  background-color: #f6b800;
  overflow: hidden;
}

/* 左寄せにして、左paddingを小さく（SE3の見え方に寄せる） */
.site-header__inner{
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;   /* ← ここを左寄せに */
  gap: 10px;                     /* ロゴとテキストの間は10px固定 */
  padding: 0 10px 0 6px;         /* ← 左だけ小さく（ここが効く） */
}

.site-header__logo{
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

.site-header__logo img{
  display: block;
  width: auto;
  height: 18px;                  /* xs */
}

@media (min-width: 576px){
  .site-header__logo img{ height: 26px; }  /* sm */
}
@media (min-width: 992px){
  .site-header__logo img{ height: 30px; }  /* lg */
}

.site-header__text{
  color: #1f2774;
  font-weight: 400;
  white-space: nowrap;
  line-height: 1;
  text-align: left;

  flex: 1 1 auto;
  min-width: 0;
  font-size: 10px;               /* xs */
}

@media (min-width: 576px){
  .site-header__text{ font-size: 14px; }   /* sm */
}
@media (min-width: 992px){
  .site-header__text{ font-size: 16px; }   /* lg */
}

@media (max-width: 360px){
  .site-header__logo img{ height: 16px; }
  .site-header__text{ font-size: 9px; }
}





/* =========================
  Footer
========================= */
.site-footer {
  width: 100%;
  height: 150px;
  margin: 0;          /* 念のため */
  padding: 0;         /* 念のため */
  display: block;     /* 念のため */
}

/* ロゴ：xsは小さめ、sm以上で大きく */
.site-footer .footer-logo img {
  display: block;
  width: auto;
  height: 30px;       /* ← スマホはこれくらいに（重く見えない） */
}

@media (min-width: 576px) {
  .site-footer .footer-logo img {
    height: 58px;     /* ← PC/タブレットは少し大きめ */
  }
}

/* コピーライト */
.site-footer .footer-copy {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1;
  color: rgba(0, 0, 0, 0.65);
}



/* =========================
   Footer bottom (logo area)
========================= */

.footer-bottom{
  background: #f6b800; /* 念のため二重に指定 */
  padding: 18px 0 22px;
}

.footer-logo{
  display: flex;
  justify-content: center;
  align-items: center;
}

.footer-logo img{
  display: block;
  margin: 0 auto;
  max-width: 520px; /* PCで横長ロゴが収まる上限 */
  width: min(520px, 90%);
  height: auto;
}

.footer-copy{
  text-align: center;
  color: #111;
  font-size: 14px;
  margin-top: 6px;
}


/* =========================
  Car Card
========================= */
:root{
  --car-border: #cfcfcf;       /* 薄すぎず濃すぎないグレー */
  --car-text: #111111;         /* ほんの少し明るい黒 */
  --car-muted: #9a9a9a;        /* 年式のグレー */
  --car-store-bg: #2b2b2b;     /* 取扱店舗の背景 */
  --car-store-bg2: #00552e;     /* 取扱店舗の背景-濃い緑 */
  --car-danger: #e60012;       /* 赤（価格/ボタン） */
  --car-danger-shadow: #b4000d;/* ボタン影（押し込み表現） */
}

.car-card{
  border: 1px solid var(--car-border);
  border-radius: 10px;
  background: #fff;
  padding: 12px;
}

/* 画像：サイズ/比率が違っても同じ枠で揃える */
.car-card__img{
  width: 100%;
  aspect-ratio: 16 / 12;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-bottom: 10px;
}

.car-card__img img{
  width: 100%;
  height: 100%;
  object-fit: contain;       /* 画像が切れないように */
}

.car-card__store{
  background: var(--car-store-bg2);
  color: #fff;
  border-radius: 5px;

  /* 店舗名が長い時に2行になりにくい＆黒帯を低く */
  font-size: 12px;
  line-height: 1.15;
  padding: 6px 8px;

  text-align: center;
  font-weight: 700;
  margin-bottom: 10px;
}


/* 車名 */
.car-card__name{
  color: var(--car-text);
  font-weight: 700;
  font-size: 18px;
  line-height: 1.25;
  margin-bottom: 2px;
}

/* 年式 */
.car-card__year{
  color: var(--car-muted);
  font-size: 13px;
  line-height: 1.2;
  margin-bottom: 10px;
}

/* 支払い総額ブロック */
.car-card__total{
  margin-bottom: 12px;
}

.car-card__total-label{
  color: #fd7e00;
  font-weight: 700;
  font-size: 15px;
  line-height: 1.2;
  margin-bottom: 0; /* 必ず改行される */
}

.car-card__total-price{
  color: var(--car-danger);
  line-height: 1;
  display: flex;
  align-items: baseline;
  gap: 2px;
}

.car-card__total-num{
  font-size: 44px;           /* 一番大きい */
  font-weight: 800;
  letter-spacing: 0.02em;
}

.car-card__total-unit{
  font-size: 20px;           /* 「万円」は小さく */
  font-weight: 800;
}

/* 詳細ボタン */
.car-card__link{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  background: var(--car-danger);
  color: #fff;
  text-decoration: none;

  border-radius: 5px;
  padding: 14px 12px;

  box-shadow: 0 6px 0 var(--car-danger-shadow);
  transition: transform .08s ease, box-shadow .08s ease, filter .08s ease;
}

.car-card__link:hover{
  filter: brightness(1.03);
}

.car-card__link:active{
  transform: translateY(6px);
  box-shadow: 0 0 0 var(--car-danger-shadow);
}

/* =========================
   もっと見るボタン（詳細を見ると同系統・矢印なし）
========================= */
.car-more-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  background: var(--car-danger);
  color: #fff;
  border: 0;
  border-radius: 10px;

  padding: 18px 40px;
  font-weight: 800;
  font-size: 28px;
  line-height: 1;

  box-shadow: 0 8px 0 var(--car-danger-shadow);
  transition: transform .08s ease, box-shadow .08s ease, filter .08s ease;

  cursor: pointer;
}

.car-more-btn:hover{
  filter: brightness(1.03);
  color: #fff;
}

.car-more-btn:active{
  transform: translateY(8px);
  box-shadow: 0 0 0 var(--car-danger-shadow);
}

@media (max-width: 575.98px){
  .car-more-btn{
    font-size: 22px;
    padding: 14px 28px;
    box-shadow: 0 6px 0 var(--car-danger-shadow);
  }
}


.car-card__icon{
  display: inline-flex;
  align-items: center;
}

/* 画像・文字バランス（スマホで詰まりすぎ防止） */
@media (max-width: 575.98px){
  .car-card{
    padding: 10px;
  }
  .car-card__name{
    font-size: 16px;
  }
  .car-card__total-num{
    font-size: 38px;
  }
  .car-card__total-unit{
    font-size: 18px;
  }
  .car-card__link{
    padding: 5px 10px;
  }
}

/* カードを列の中で縦方向に伸ばす（ボタン位置揃えに効く） */
.car-grid > [class*="col-"] {
  display: flex;
}

.car-grid .car-card {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.car-grid .car-card__link {
  margin-top: auto; /* ボタンを下に寄せる */
}


/* =========================
   Car detail (minimum)
========================= */
.car-gallery__main img{
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid #eee;
}
.car-gallery__placeholder{
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #eee;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.car-gallery__thumbs{
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
@media (max-width: 575.98px){
  .car-gallery__thumbs{ grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

.car-thumb{
  border: 2px solid transparent;
  padding: 2px;
  background: transparent;
  overflow: hidden;
  border: 1px solid #eee;
}
.car-thumb img{ width:100%; height:auto; display:block; }
.car-thumb.is-active{ border-color: #0d6efd; }

.car-grade{ color:#666; }

/* 価格ブロック（詳細ページ）：外枠borderなし */
.car-pricebox{
  border: none;
  border-radius: 0;
  padding: 0;
  background: transparent;
}

/* SPは縦、PCは横（カンプ寄せ） */
.car-pricebox__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

@media (min-width: 992px){
  .car-pricebox__grid{
    grid-template-columns: 1fr 1fr; /* PC：横並び */
    gap: 22px;
    align-items: start;
  }
}

/* 車名＋グレード：同サイズ・太字（色は現状のまま） */
.car-title{ font-weight: 800; }
.car-title__name,
.car-title__grade{ font-weight: 800; }

/* 取扱店舗（黒帯）：カードの帯デザイン流用 */
.car-store-badge{
  background: var(--car-store-bg2);
  color: #fff;
  border-radius: 10px;
  font-size: 14px;
  line-height: 1.15;
  padding: 12px 8px;
  text-align: center;
  font-weight: 700;
}


/* 1ブロック＝1段（ラベル→価格 の縦積み） */
.car-pricebox__row{
  padding: 0;
  border-bottom: none;
}


/* タイトル：必ず改行 */
.car-pricebox__label{
  color:#555;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 6px; /* この時点で改行が確定 */
}
.car-pricebox__tax{
  font-size: .82em;   /* （税込）だけ小さく */
  font-weight: 700;
}

/* 価格：○○ と 万円 を分離 */
.car-pricebox__val{
  display: flex;
  align-items: baseline;
  gap: 4px;
  line-height: 1;
}
.car-pricebox__num{
  font-weight: 800;   /* 数字は太字 */
  font-size: 1.9em;   /* 少し大きめ */
}
.car-pricebox__unit{
  font-weight: 400;   /* 万円は通常 */
  font-size: 1.0em;   /* 少し小さめ（numより） */
}

/* 支払い総額は赤（一覧カードと同じ変数） */
.car-pricebox__val--total{
  color: var(--car-danger);
}

/* 本体価格は黒（一覧カードの黒：--car-text） */
.car-pricebox__val--vehicle{
  color: var(--car-text);
}

/* 諸費用注記 */
.car-pricebox__note{
  color:#555;
  font-size: .85em;
  line-height: 1.2;
}

/* SP：支払い総額の横で改行しない（文字サイズで吸収） */
@media (max-width: 991.98px){
  .car-pricebox__note{
    font-size: .78em;
    white-space: nowrap;
  }
}


/* =========================
   Car detail: spec table（カンプ寄せ・確実版）
   th：暗い赤 + 白文字、borderなし
   td：下線だけ（薄グレー）
   thとtdの間：tdの左paddingで空ける
========================= */
.car-spec__table{
  width: 100%;
  border-collapse: collapse;
  border: 0;
}


/* 行の下線： */
.car-spec__table tr > td{
  border-bottom: 1px solid rgba(0,0,0,.18) !important; /* 薄グレー */
}

.car-spec__table tr > th{
  border-bottom: 4px solid #fff !important; /* 白 */
  font-weight: normal;
}

/* セルの余白 */
.car-spec__table th,
.car-spec__table td{
  padding: 12px 12px;
  vertical-align: middle;
}

/* th：暗い赤、白文字、borderなし */
.car-spec__th{
  background: #e60012 !important;
  color: #fff !important;
  font-weight: 700;
  width: 34%;                      /* カンプの“左が細め”に寄せる */
  border: 0 !important;
}

/* td：間隔（thとの隙間）を作る */
.car-spec__td{
  background: #fff !important;
  border-left: 0 !important;
  padding-left: 18px !important;              /* ←ここが「thとtdの間隔」 */
}

/* PCはthを少し広げてもOK（好みで） */
@media (min-width: 992px){
  .car-spec__th{ width: 38%; }
  .car-spec__td{ padding-left: 22px; }
}


/* =========================
   Car detail: CTA buttons
   SP: 縦 / PC: 横
   - メールも電話も「黄色＋暗い赤影」で統一
========================= */
.car-cta-wrap{
  margin-top: 8px;
}

.car-cta{
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

@media (min-width: 992px){
  .car-cta{
    grid-template-columns: 1fr 1fr; /* PC：横並び */
    align-items: stretch;
    gap: 18px;
  }
}

.car-cta__btn{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  border-radius: 12px;
  padding: 16px 14px;
  text-decoration: none;
  line-height: 1;

  background: #f6b800;      /* ←メールも黄色に統一 */
  color: #000;

  box-shadow: 0 6px 0 #7a0000; /* ←ドロップシャドウを暗い赤に */
  transition: transform .08s ease, box-shadow .08s ease, filter .08s ease;
}

.car-cta__btn:hover{
  filter: brightness(1.03);
  color: #000;
}

.car-cta__btn:active{
  transform: translateY(6px);
  box-shadow: 0 0 0 #7a0000;
}

/* メール文言画像 */
.car-cta__mailtext{
  width: min(320px, 92%);
  height: auto;
  display: block;
}

/* 電話：上段テキスト画像 */
.car-cta__teltext{
  width: min(320px, 92%);
  height: auto;
  display: block;
  margin-bottom: 10px; /* 改行後の余白 */
}

.car-cta__telrow{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.car-cta__telicon{
  width: 28px;
  height: auto;
  display: block;
}

/* 電話番号：大きめ、太字にしない */
.car-cta__telnum{
  font-size: clamp(24px, 2.8vw, 36px);
  font-weight: 400;     /* ←太字解除 */
  color: #000;
  text-decoration: none;
}

/* iOS等の tel リンク青/下線対策（念のため） */
a.car-cta__tel,
a.car-cta__tel:visited,
a.car-cta__tel:hover{
  color: #000;
  text-decoration: none;
}

.car-store__card{
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 12px;
  padding: 12px;
  background: rgba(255,255,255,.92);
}

/* =========================
   Car detail: Store card (use store-list design)
========================= */
.car-store-card{
  border-radius: 10px;
  overflow: hidden;
}

/* =========================
   Car detail store card: only (detail page overrides)
========================= */

/* 店舗情報の外枠：border 1px、下だけ角丸10px（カンプ） */
.car-store-card{
  border: 1px solid rgba(0,0,0,.18);
  border-radius: 0 0 10px 10px;
  overflow: hidden;
}

/* 店舗名：詳細ページだけセンタリング */
.car-store-card .store-head{
  justify-content: center;
}
.car-store-card .store-head__name{
  width: 100%;
  text-align: center;
}

/* アイコン：詳細ページだけ少し大きく */
.car-store-card .store-ico{
  width: 22px;
  max-height: 22px;
}

/* 在庫ボタン：アイコン色を店舗一覧と同じ＆テキスト画像のサイズ */
.car-store-card .store-stock-btn__icon{
  color: #7a0000; /* 店舗一覧と同じ */
}
.car-store-card .store-stock-btn__text img{
  height: 18px;  /* 店舗一覧の調整値を踏襲 */
  width: auto;
  display: block;
}

/* PCだけ：地図を縦長（詳細ページだけ） */
@media (min-width: 992px){
  .car-store-card .store-map iframe,
  .car-store-card__map iframe{
    height: 230px !important; /* いま180pxなので縦長へ */
  }
}


/* =========================
   Car detail: store card は常時表示（SPでも閉じない）
   store-list のアコーディオンを無効化
========================= */
.car-store-card .store-body{
  max-height: none !important;
  opacity: 1 !important;
  transition: none !important;
}


/* 店舗一覧と同じ見た目にする（矢印は詳細では不要なら消す） */
.car-store-card .store-head__icon{
  display: none !important;
}

/* 情報＋地図：SPは縦、PCは横 */
.car-store-card__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

@media (min-width: 992px){
  .car-store-card__grid{
    grid-template-columns: 1fr 1.2fr; /* カンプっぽく地図を少し広め */
    align-items: start;
    gap: 14px;
  }
}

/* FAX文字（リンクじゃないので黒） */
.store-fax{
  color: #000;
  text-decoration: none;
}

/* 地図の高さ（店舗一覧より大きめに） */
.car-store-card__map iframe{
  width: 100%;
  height: 220px;
  display: block;
}

@media (min-width: 992px){
  .car-store-card__map iframe{
    height: 180px;
  }
}



.car-store__name{ font-weight: 700; margin-bottom: 6px; }
.car-store__map iframe{ width:100%; height: 260px; }



/* ****************************************************** */

/* =========================
   LP section frame
========================= */
.lp-sec{
  position: relative;

  /* SP基準（現状の見え方を優先） */
  padding: 30px 0 60px 0;

  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;

  /* ラインを“外側”に逃がすので、見切れ防止 */
  overflow: visible;
}

/* PCだけ上下余白を増やして、ラインの被りを回避 */
@media (min-width: 992px){
  .lp-sec{
    padding: 60px 0 70px 0;
  }
}


.lp-sec__title{
  display: block;
  margin: 0 auto 14px;
  max-width: 980px;
}

.lp-sec__title img{ width:100%; height:auto; display:block; }

/* ---- 見出しを横幅100%にしたい時（特選車用）---- */
.lp-sec__title--full{
  max-width: none;

  /* container の幅制限を突破して「画面幅100%」にする */
  width: 100vw;
  margin-left: 50%;
  transform: translateX(-50%);
}


/* ---- セクション上のライン（透過PNG：レイアウト余白を作らず“上に被せる”）---- */
/* 重要：line画像は上側の透明余白が大きいので「bottom基準」で置く */
.lp-sec{
  overflow: visible; /* 上に被せたラインが切れないようにする */
}

.lp-sec--lined{
  position: relative;

  /* SP基準（現状の見え方を優先） */
  --lp-line-h: clamp(34px, 10vw, 72px);
}

/* ラインは「次セクションの上」に被せる（= セクション外に逃がす） */
.lp-sec--lined::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;

  width: 100%;
  height: var(--lp-line-h);

  /* ★下端基準で表示（透明余白の影響を受けにくい） */
  background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/line_pc.png");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 100% auto;

  /* ★セクションの上に被せる（SPはこの値がベストだった） */
  transform: translateY(-80%);

  pointer-events: none;
  z-index: 5;
}

/* コンテンツはラインより上 */
.lp-sec--lined > .container{
  position: relative;
  z-index: 10;
}

/* SPは line_sp に切替 */
@media (max-width: 767.98px){
  .lp-sec--lined::before{
    background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/line_sp.png");
  }
}

/* PCだけ：line_pc の上側が切れないように「高さ↑＆持ち上げ量↓」 */
@media (min-width: 992px){
  .lp-sec--lined{
    --lp-line-h: clamp(150px, 4vw, 92px);
  }
  .lp-sec--lined::before{
    transform: translateY(-80%);
  }
}


/* ---- メインビジュアル ---- */
.lp-mv img{
  width: 100%;
  height: auto;
  display: block;
}

/* ---- 初売り期間：背景2枚（bg1の上にbg2）、メイン画像はPHP側で出す ---- */
.lp-sec--kikan{
  background-image:
  url("/2026ny/wp-content/themes/2026lp/assets/img/kikan_bg_1.jpg"),url("/2026ny/wp-content/themes/2026lp/assets/img/kikan_bg_2.png");
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  background-position: top left, left;
}

/* ---- ご成約特典（背景切替）---- */
.lp-sec--seiyaku{ background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/seiyaku_bg_pc.jpg"); }

/* ---- 抽選会（背景切替）---- */
.lp-sec--tyusen{ background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/tyusen_bg_pc.jpg"); }

/* ---- 特選車（背景切替）---- */
.lp-sec--tokusen{ background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/tokusen_bg_pc.gif");
  background-size: contain;
  background-repeat: repeat; }
  @media (max-width: 767.98px){
    .lp-sec--tokusen{ background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/tokusen_bg_sp.gif");
      background-size: contain;
      background-repeat: repeat; }
    }

/* ---- コミコミ（背景切替：30/40/50まとめて1セクション）---- */
.lp-sec--komikomi{ background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/komikomi_bg_pc.gif");
  background-size: contain;
  background-repeat: repeat;}

  @media (max-width: 767.98px){
    .lp-sec--komikomi{ background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/komikomi_bg_sp.gif");
      background-size: contain;
      background-repeat: repeat;
    }
  }

/* ---- 特集（背景なしでOK）---- */
.lp-sec--feature{ background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/tokusyu_bg_pc.gif");
  background-size: contain;
  background-repeat: repeat;}

  @media (max-width: 767.98px){
    .lp-sec--feature{ background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/tokusyu_bg_sp.gif");
      background-size: contain;
      background-repeat: repeat;
    }
  }



/* ---- 店舗一覧（SP:1カラム / PC:2カラム）---- */
.store-list{
  padding: 22px 0;
  background-image: url("/2026ny/wp-content/themes/2026lp/assets/img/shop_bg.jpg");
  background-repeat: repeat;
}

.stores{
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr; /* SPは1カラム */
}

@media (min-width: 992px){
  .stores{ grid-template-columns: repeat(2, minmax(0, 1fr)); } /* PCは2カラム */
}

/* 1店舗 */
.store-item{
  border-radius: 10px;
  overflow: hidden; /* 上下の角丸を効かせる */
}

/* 店舗名（グラデーション、角丸10px、矢印） */
.store-head{
  width: 100%;
  border: none;
  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 12px 14px;
  border-radius: 10px;

  background: linear-gradient(90deg, #f6b800 0%, #ffe18a 100%);
  color: #000;
  font-weight: 700;
}

.store-head__icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* 開閉アイコン切替 */
.store-head .icon-open{ display:none; }
.store-item.is-open .store-head .icon-open{ display:inline-flex; }
.store-item.is-open .store-head .icon-closed{ display:none; }

/* 店舗情報 */
.store-body{
  background: #fff;
  border-radius: 0 0 10px 10px; /* 下だけ角丸 */
  overflow: hidden;
}

/* SPはアコーディオン（ぬるっと） */
@media (max-width: 991.98px){
  .store-body{
    max-height: 0;
    opacity: 0;
    transition: max-height .25s ease, opacity .25s ease;
  }
  .store-item.is-open .store-body{
    max-height: 1200px; /* 十分大きく */
    opacity: 1;
  }
}

/* PCは常に開いてる（クリック無効にするのはJS側） */
@media (min-width: 992px){
  .store-body{
    max-height: none;
    opacity: 1;
  }
}

.store-body__inner{
  padding: 12px 14px 14px;
}

.store-line{
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}
.store-line:first-child{ margin-top: 0; }

/* 住所の下に出す「（定休:xxx）」 */
.store-holiday{
  margin-top: 0;
  margin-bottom: 8px;  /* 次の.store-lineのmargin-top(8px)と合わせて1行分あける */
  color: #6c757d;      /* Bootstrapのtext-muted相当 */
  font-size: 14px;
}

.store-ico{
  width: 18px;
  height: auto;         /* 比率を維持 */
  max-height: 18px;     /* 行の高さからはみ出さない */
  flex: 0 0 auto;
  display: block;
}

/* リンク類 */
.store-tel{
  color: #000;
}
.store-mail{
  color: #0d6efd;
  text-decoration: underline;
}

/* 地図 */
.store-map iframe{
  width: 100%;
  height: 180px;
  display: block;
  margin-top: 10px;
}

/* 在庫検索ボタン（黄色＋濃い影、押し込み） */
.store-stock{ margin-top: 12px; }

.store-stock-btn{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  background: #f6b800;
  color: #000;
  text-decoration: none;

  border-radius: 10px;
  padding: 14px 12px;

  box-shadow: 0 6px 0 #c58f00; /* 濃い黄色の影 */
  transition: transform .08s ease, box-shadow .08s ease, filter .08s ease;
}

.store-stock-btn:hover{ filter: brightness(1.03); }

.store-stock-btn:active{
  transform: translateY(6px);
  box-shadow: 0 0 0 #c58f00;
}

.store-stock-btn__icon{
  display: inline-flex;
  align-items: center;
  color: #7a0000; /* 暗めの赤 */
}

/* =========================
  Store list / Footer banner (LP)
========================= */

/* 上部ライン（背景なしで画像のみ表示） */
.store-list-line{
  background: transparent !important;
  padding: 0;
  margin: 0;
}

.store-list-line img{
  width: 100%;
  height: auto;
  display: block;
}


/* バナー：中央寄せ＋最大幅（横幅いっぱい崩れ防止） */
.footer-banner{
  padding: 18px 0 8px;
}
.footer-banner__inner{
  width: min(980px, 100%);
  margin: 10px auto;
  padding: 0 12px;
}
.footer-banner__link{
  display: block;
}
.footer-banner__link img{
  width: 100%;
  height: auto;
}

/* 店舗一覧：背景の上に白→透過のグラデを重ねる */
.store-list{
  position: relative;
}
.store-list::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 120px;          /* まずはこのくらい。後で微調整OK */
  background: linear-gradient(to bottom, rgba(255,255,255,0.95), rgba(255,255,255,0));
  pointer-events: none;
  z-index: 1;
}
.store-list > *{
  position: relative;
  z-index: 2;
}

/* 「お正月はお近くのショールームへ！」画像 */
.store-leadtext{
  width: min(980px, 100%);
  margin: 0 auto 14px;
  padding: 0 12px;
}
.store-leadtext img{
  width: 100%;
  height: auto;
}

/* 矢印：色を白に */
.store-head__icon{
  color: #fff;
}

/* PCでは矢印を表示しない */
@media (min-width: 992px){
  .store-head__icon{
    display: none !important;
  }
}

/* SPでは矢印を“左側”へ */
@media (max-width: 991.98px){
  .store-head{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
  }
  .store-head__icon{ order: 0; }
  .store-head__name{ order: 1; }
}

/* ボタン内テキスト画像の見た目調整 */
.store-stock-btn__text img{
  height: 18px;     /* まずは仮。大きければ上げる */
  width: auto;
  display: block;
}

/* 在庫リンクが無い店舗でも高さズレしにくくする */
.store-stock--empty{
  min-height: 54px;   /* .store-stock-btn の高さに合わせて後で調整 */
}


/* おすすめ車（詳細ページ） */
.car-recommend-sec .car-grid{
  margin-top: 6px;
}

/* タブレッド・PCだけ：おすすめ車セクションを下げて、ライン画像の被りを回避 */
@media (min-width: 768px){
  .car-recommend-sec{
    margin-top: 6rem;
    padding-bottom: 10rem;
  }
}

