/* ------------------------------------------------------------
  車種ページ（car_list 一覧・詳細）追加スタイル  2026-10
  functions.php から car_list のページだけで読み込む
------------------------------------------------------------ */

/* ===== 一覧：見出し ===== */
.archive__head {
  margin-bottom: 3.2rem;
  text-align: center;
}

.archive__title {
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1.25;
  margin-bottom: 1.2rem;
}

.archive__lead {
  font-size: 1.3rem;
  line-height: 1.6;
  text-align: center;
}

/* ===== 一覧：カード ===== */
.archive__content .unit {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.archive__content .unit > a:first-child {
  flex: 1;
}

/* 順位バッジ */
.archive__content .unit__image {
  position: relative;
}

.archive__content .unit__rank {
  position: absolute;
  top: 0.6rem;
  left: 0.6rem;
  z-index: 1;
  min-width: 3.6rem;
  height: 3.6rem;
  padding: 0 0.6rem;
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.1rem;
  border-radius: 100rem;
  background: rgba(17, 17, 17, 0.75);
  color: #fff;
  font-family: Oswald, sans-serif;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 3.6rem;
}

.archive__content .unit__rank small {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1rem;
}

.archive__content .unit__rank.rank-1 { background: #d4a514; }
.archive__content .unit__rank.rank-2 { background: #8f98a3; }
.archive__content .unit__rank.rank-3 { background: #b06d3b; }
/* ボディタイプで絞ったとき：バッジが「軽自動車 1位」になる */
.archive__content .unit__rankLabel { font-family: "Noto Sans JP", sans-serif; font-size: 1rem; font-weight: 700; margin-right: 0.3rem; }
.archive__content .unit__rankLabel[hidden] { display: none; }
.archive__content .unit__rank.is-body { background: var(--color-blue, #1940a5); }
.archive__content .unit__rank.is-body.rank-1 { background: #d4a514; }
.archive__content .unit__rank.is-body.rank-2 { background: #8f98a3; }
.archive__content .unit__rank.is-body.rank-3 { background: #b06d3b; }
/* カード内：総合◯位／ボディタイプ◯位 */
.archive__content .unit__ranks { display: flex; flex-wrap: wrap; gap: 0.3rem 0.8rem; font-size: 1.05rem; color: #555; margin-top: 0.3rem; }
.archive__content .unit__ranks b { font-family: Oswald, sans-serif; font-size: 1.3rem; color: #222; margin: 0 0.1em; }
.archive__content .unit__rank[hidden], .archive__content .unit__ranks[hidden], .archive__content .unit__ranks span[hidden] { display: none; }
.archive__content .is-filtering .unit__ranks b { color: var(--color-blue, #1940a5); }
/* 詳細ページ：タイトル下の順位 */
.single__ranks { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 0.8rem; }
.single__rank { display: inline-flex; align-items: baseline; gap: 0.1rem; font-size: 1.2rem; font-weight: 700; color: #fff; background: #333; border-radius: 100rem; padding: 0.3rem 1.1rem; line-height: 1.4; text-decoration: none; }
.single__rank b { font-family: Oswald, sans-serif; font-size: 1.7rem; margin: 0 0.15em; }
.single__rank.rank-1 { background: #d4a514; } .single__rank.rank-2 { background: #8f98a3; } .single__rank.rank-3 { background: #b06d3b; }
.single__rank--body { background: var(--color-blue, #1940a5); }


/* 年式・走行距離 */
.archive__content .unit__text .spec {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.archive__content .unit__text .spec span {
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.25;
  padding: 0.2rem 0.8rem;
  border-radius: 0.4rem;
  background: var(--color-gray, #f6f6f6);
  color: var(--color-darkgray, #707070);
}

/* 支払回数の注記 */
.archive__content .unit__terms {
  font-size: 1.1rem;
  line-height: 1.4;
  color: var(--color-darkgray, #707070);
  text-align: right;
  padding: 0 0.8rem 0.6rem;
}

/* 一覧の下のCTA */
.archive .c-cta {
  margin-bottom: 4rem;
}

/* ===== 詳細：価格の下の「この車で仮審査」 ===== */
.hbCarCta {
  margin: 2.4rem 0 4rem;
}
/* 販売価格のすぐ下（シミュレーターの上）に置くCTA */
.hbCarCta--price { margin: 2rem 0 0; }
/* 詳細：サムネイルと販売価格の間を詰める（元の style.css は 8rem） */
.single .slider { margin-bottom: 2.4rem; }

.hbCarCta__btn {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  padding: 1.6rem 3.2rem; /* 右矢印を外したので左右の余白を詰めた（2026-10-18） */
  border-radius: 100rem;
  background: linear-gradient(90deg, #ff9a00 0%, #ff5c00 100%);
  box-shadow: 0 0.4rem 0 #d84a00;
  color: #fff;
  text-align: center;
  transition: transform 0.15s, box-shadow 0.15s;
}

.hbCarCta__btn:hover {
  transform: translateY(0.3rem);
  box-shadow: 0 0.1rem 0 #d84a00;
}

.hbCarCta__sub {
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.25;
  padding: 0.2rem 1rem;
  border-radius: 100rem;
  background: #fff;
  color: #ff5c00;
}

.hbCarCta__main {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.4;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
/* 「車種名」「で仮審査を申し込む」の途中では折り返さない（折り返すなら車種名の後ろでだけ） */
.hbCarCta__car, .hbCarCta__rest { white-space: nowrap; }
.hbCarCta__main.is-long { font-size: 1.8rem; }

.hbCarCta__btn svg {
  position: absolute;
  top: 50%;
  right: 2rem;
  translate: 0 -50%;
  width: 2.4rem;
  height: 2.4rem;
  fill: #fff;
}

.hbCarCta__note {
  margin-top: 1rem;
  font-size: 1.1rem;
  line-height: 1.5;
  color: var(--color-darkgray, #707070);
  text-align: center;
}

@media screen and (max-width: 767px) {
  .hbCarCta__btn {
    padding: 1.4rem 2rem;
  }

  .hbCarCta__main {
    font-size: 1.7rem;
  }
  .hbCarCta__main.is-long { font-size: 1.5rem; }

  .hbCarCta__btn svg {
    right: 1.4rem;
    width: 2rem;
    height: 2rem;
  }
}

/* ===== 車種ページ：来た元のLPに合わせた表示切替（html に hb-form-only / hb-subsc が付く） ===== */
.hb-only-subsc { display: none; }
html.hb-subsc .hb-only-subsc { display: inline; }
html.hb-subsc .hb-only-loan { display: none; }
html.hb-subsc .hb-only-loan-block { display: none; }
.hb-show-form-only { display: none !important; }
html.hb-form-only .hb-show-form-only { display: block !important; }
html.hb-form-only .hb-hide-form-only { display: none !important; }

/* ===== 一覧：絞り込み ===== */
.carFilter { display: flex; flex-direction: column; gap: 1.2rem; margin-bottom: 1.6rem; }
.carFilter__group { display: flex; flex-direction: column; gap: 0.7rem; min-width: 0; border: 0; padding: 0; margin: 0; }
.carFilter__label { font-size: 1.4rem; font-weight: 700; color: #222; padding: 0; }
.carFilter__label small { font-size: 1rem; font-weight: 400; color: #707070; margin-left: 0.2rem; }
.carFilter__label--sub { margin-top: 1.2rem; }
/* 入口の3ボタン */
.carFilter__cats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.8rem; }
.carFilter__cat { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.6rem; min-height: 9rem; padding: 1.2rem 0.4rem 1rem; font: inherit; background: #fff; border: 1.5px solid #222; border-radius: 0.8rem; box-shadow: 0.3rem 0.3rem 0 rgba(0,0,0,.12); cursor: pointer; color: #111; transition: transform .1s, box-shadow .1s; }
.carFilter__cat svg { width: 5.6rem; height: 2.8rem; fill: #111; color: #111; }
.carFilter__cat[data-cat="price"] svg { width: 2.8rem; height: 2.8rem; }
.carFilter__catText { font-size: 1.2rem; font-weight: 700; line-height: 1.3; text-align: center; }
.carFilter__cat.is-open { background: var(--color-blue, #1940a5); border-color: var(--color-blue, #1940a5); color: #fff; transform: translate(0.2rem, 0.2rem); box-shadow: 0.1rem 0.1rem 0 rgba(0,0,0,.12); }
.carFilter__cat.is-open svg { fill: #fff; color: #fff; }
.carFilter__cat.is-open::after { content: ''; position: absolute; left: 50%; bottom: -0.9rem; width: 1.4rem; height: 1.4rem; background: var(--color-blue, #1940a5); transform: translateX(-50%) rotate(45deg); }
.carFilter__catBadge { position: absolute; top: -0.6rem; right: -0.6rem; min-width: 2.2rem; height: 2.2rem; padding: 0 0.6rem; border-radius: 100rem; background: var(--hb-accent); color: #fff; font-family: Oswald, sans-serif; font-size: 1.3rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.carFilter__catBadge[hidden] { display: none; }
/* 検索窓 */
.carFilter__search { display: flex; }
.carFilter__searchInput { flex: 1; min-width: 0; font: inherit; font-size: 1.6rem; padding: 1.2rem 1.4rem; border: 1.5px solid #222; border-right: 0; border-radius: 0.8rem 0 0 0.8rem; background: #fff; }
.carFilter__searchInput:focus { outline: 2px solid var(--color-blue, #1940a5); outline-offset: -2px; }
.carFilter__searchBtn { flex: none; width: 6rem; display: flex; align-items: center; justify-content: center; background: #111; color: #fff; border-radius: 0 0.8rem 0.8rem 0; }
.carFilter__searchBtn svg { width: 2.6rem; height: 2.6rem; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* 開いたパネル */
.carFilter__panel { display: flex; flex-direction: column; gap: 0.8rem; border: 0; margin: 0; padding: 1.6rem; border-radius: 1.2rem; background: var(--color-gray, #f6f6f6); }
.carFilter__panel[hidden] { display: none; }
/* タイル（ボディタイプ・メーカー） */
.carFilter__tiles { display: grid; gap: 0.8rem; }
.carFilter__tiles--3 { grid-template-columns: repeat(3, 1fr); }
.carFilter__tile { position: relative; display: block; cursor: pointer; }
.carFilter__tile input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.carFilter__tileBox { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.4rem; min-height: 7.2rem; padding: 1.8rem 0.4rem 0.8rem; border-radius: 0.8rem; background: #fff; border: 2px solid #fff; box-shadow: 0 1px 2px rgba(0,0,0,.06); transition: border-color .15s, background .15s; }
.carFilter__tileBox::after { content: ''; position: absolute; top: 0.5rem; right: 0.5rem; width: 1.4rem; height: 1.4rem; border-radius: 50%; border: 1.5px solid #c9ced8; background: #fff; }
.carFilter__tile input:checked + .carFilter__tileBox { border-color: var(--color-blue, #1940a5); background: #eef2ff; }
.carFilter__tile input:checked + .carFilter__tileBox::after { border-color: var(--color-blue, #1940a5); background: var(--color-blue, #1940a5) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.5l2.5 2.5 4.5-5' fill='none' stroke='%23fff' stroke-width='1.8'/%3E%3C/svg%3E") center/100% no-repeat; }
.carFilter__tile input:focus-visible + .carFilter__tileBox { outline: 2px solid var(--color-blue, #1940a5); outline-offset: 2px; }
.carFilter__tileBox svg { width: 7.2rem; height: 3rem; fill: #444; }
.carFilter__tile input:checked + .carFilter__tileBox svg { fill: var(--color-blue, #1940a5); }
.carFilter__tileText { font-size: 1.15rem; font-weight: 700; color: #333; line-height: 1.2; text-align: center; white-space: nowrap; }
.carFilter__tileText.is-long { font-size: 1.02rem; letter-spacing: -0.02em; }
/* 台数バッジ（左上） */
.carFilter__tileCount { position: absolute; top: 0.5rem; left: 0.6rem; font-size: 1.05rem; font-weight: 700; color: #666; line-height: 1; }
.carFilter__tileCount small { font-size: 0.8rem; font-weight: 400; margin-left: 0.1em; }
.carFilter__tile input:checked + .carFilter__tileBox .carFilter__tileCount { color: var(--color-blue, #1940a5); }
.carFilter__tile.is-empty .carFilter__tileCount { color: #bbb; }
.carFilter__tile--text .carFilter__tileBox { min-height: 5.6rem; padding: 1.4rem 1.2rem 1rem; }
.carFilter__tile--text .carFilter__tileText { font-size: 1.3rem; }
.carFilter__tile.is-empty .carFilter__tileBox { opacity: .55; }
.carFilter__tile.is-empty input:checked + .carFilter__tileBox { opacity: 1; }
@media screen and (orientation: portrait) and (max-width: 767px) { .carFilter__tile--text .carFilter__tileText { font-size: 1.15rem; } }
/* チップ（月額・駆動） */
.carFilter__chips { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.carFilter__chip { position: relative; cursor: pointer; }
.carFilter__chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.carFilter__chip span { display: block; font-size: 1.25rem; font-weight: 700; line-height: 1.2; padding: 0.8rem 1.2rem; border-radius: 0.8rem; border: 2px solid #fff; background: #fff; color: #333; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.carFilter__chip input:checked + span { border-color: var(--color-blue, #1940a5); background: #eef2ff; color: var(--color-blue, #1940a5); }
.carFilter__chip input:focus-visible + span { outline: 2px solid var(--color-blue, #1940a5); outline-offset: 2px; }
/* 下のバー */
.carFilter__bar { display: grid; grid-template-columns: 1fr 2fr; gap: 0.8rem; }
.carFilter__bar[hidden] { display: none; }
.carFilter__reset { font: inherit; font-size: 1.4rem; font-weight: 700; color: #fff; background: #707070; border: 0; border-radius: 0.8rem; padding: 1.2rem; cursor: pointer; }
.carFilter__reset:disabled { opacity: .45; cursor: default; }
.carFilter__go { display: flex; align-items: center; justify-content: center; gap: 0.3rem; font-size: 1.6rem; font-weight: 700; color: #fff; background: var(--color-blue, #1940a5); border-radius: 0.8rem; padding: 1.2rem; text-decoration: none; }
.carFilter__go [data-count] { font-family: Oswald, sans-serif; font-size: 2.2rem; }
/* 件数と並び替え */
.carSort { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 2rem; scroll-margin-top: 7rem; }
.carSort__count { font-size: 1.3rem; font-weight: 700; }
.carSort__count span { font-family: Oswald, sans-serif; font-size: 2.4rem; color: var(--color-blue, #1940a5); margin-right: 0.2rem; }
.carSort__pills { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.carSort__pill { font: inherit; font-size: 1.15rem; font-weight: 700; padding: 0.6rem 1rem; border-radius: 100rem; border: 1px solid #c9ced8; background: #fff; color: #555; cursor: pointer; }
.carSort__pill.is-active { border-color: var(--color-blue, #1940a5); color: var(--color-blue, #1940a5); background: #eef2ff; }
@media screen and (min-width: 768px) {
  .carFilter__grid--bottom { grid-template-columns: 3fr 2fr; }
}
.carFilter__count { font-size: 1.3rem; font-weight: 700; }
.carFilter__count span { font-family: Oswald, sans-serif; font-size: 2.2rem; color: var(--color-blue, #1940a5); margin-right: 0.2rem; }
.carFilter__empty { text-align: center; font-size: 1.4rem; line-height: 1.7; padding: 3.2rem 1.6rem; margin-bottom: 4rem; border: 1px dashed #c9ced8; border-radius: 1.2rem; }
.archive__content .unit[hidden] { display: none; }

/* ===== プライバシーポリシー等の文書ページ ===== */
.hbDoc { padding: 6rem 2.4rem 8rem; background: #fff; font-size: 1.4rem; line-height: 1.8; }
.hbDoc__title { font-size: 2.4rem; font-weight: 700; margin-bottom: 2.4rem; line-height: 1.4; }
.hbDoc h2 { font-size: 1.6rem; font-weight: 700; margin: 2.8rem 0 0.8rem; padding-left: 1rem; border-left: 4px solid var(--color-blue, #1940a5); }
.hbDoc p { margin-bottom: 1rem; }
.hbDoc ul, .hbDoc ol { margin: 0 0 1rem 2rem; }
.hbDoc ul { list-style: disc; }
.hbDoc ol { list-style: decimal; }
.hbDoc a { color: var(--color-blue, #1940a5); text-decoration: underline; }
.hbDoc__table { overflow-x: auto; margin: 1.6rem 0; }
.hbDoc table { border-collapse: collapse; min-width: 64rem; font-size: 1.2rem; line-height: 1.6; }
.hbDoc th, .hbDoc td { border: 1px solid #d9d9d9; padding: 0.8rem 1rem; text-align: left; vertical-align: top; }
.hbDoc th { background: var(--color-gray, #f6f6f6); }

/* ===== 詳細：似た車種 ===== */
.hbSimilar { margin: 4rem 0; }
.hbSimilar__title { font-size: 1.8rem; font-weight: 700; line-height: 1.4; margin-bottom: 1.6rem; }
.hbSimilar__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.hbSimilar__item { display: flex; flex-direction: column; gap: 0.4rem; padding: 0.8rem; border: 1px solid #e1e4ea; border-radius: 1rem; background: #fff; }
.hbSimilar__image { aspect-ratio: 4/3; overflow: hidden; border-radius: 0.6rem; background: var(--color-gray, #f6f6f6); }
.hbSimilar__image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hbSimilar__maker { font-size: 1rem; color: var(--color-darkgray, #707070); line-height: 1.4; }
.hbSimilar__name { font-size: 1.4rem; font-weight: 700; line-height: 1.3; }
.hbSimilar__price { font-size: 1.1rem; font-weight: 700; }
.hbSimilar__price span { font-family: Oswald, sans-serif; font-size: 1.6rem; color: var(--color-blue, #1940a5); margin: 0 0.1rem; }
.c-cta__agentNote { font-size: 1.1rem; line-height: 1.5; color: #707070; text-align: center; margin-top: 0.8rem; }

/* 見本の注記（一覧・詳細） 2026-10-11 */
.archive__sampleNote, .single__sampleNote { font-size: 1.1rem; line-height: 1.6; color: #707070; }
.archive__sampleNote { margin-top: 0.8rem; text-align: left; }
.single__sampleNote { margin: 1rem 0 0; }

/* もっと見る */
.carMore { display: block; width: 100%; max-width: 32rem; margin: 0 auto 4rem; font: inherit; font-size: 1.5rem; font-weight: 700; color: var(--color-blue, #1940a5); background: #fff; border: 2px solid var(--color-blue, #1940a5); border-radius: 100rem; padding: 1.3rem 2rem; cursor: pointer; }
.carMore:hover { background: var(--hb-blue-soft); }
.carMore[hidden] { display: none; }

/* 月額シミュレーター（車種詳細） */
.hbSim { margin: 2.4rem 0 0; padding: 2rem 1.6rem; border-radius: 1.2rem; background: var(--hb-blue-soft); border: 2px solid var(--hb-blue-line); }
.hbSim__title { font-size: 1.9rem; font-weight: 700; text-align: center; line-height: 1.4; margin-bottom: 1.6rem; }
.hbSim__title span { display: block; font-size: 1.2rem; color: var(--hb-blue); }
.hbSim__inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.hbSim__field { display: flex; flex-direction: column; gap: 0.5rem; min-width: 0; }
.hbSim__field--wide { grid-column: 1 / -1; }
.hbSim__detail div[hidden] { display: none; }
.hbSim__label { font-size: 1.2rem; font-weight: 700; color: #555; }
.hbSim__field select { appearance: none; -webkit-appearance: none; width: 100%; font: inherit; font-size: 1.6rem; font-weight: 700; color: #333; padding: 1rem 2.8rem 1rem 1.1rem; border-radius: 0.8rem; border: 1px solid #e3b98a; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23e65c00' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 1.1rem center; cursor: pointer; }
.hbSim__result { margin-top: 1.6rem; padding: 1.4rem; background: #fff; border-radius: 0.8rem; text-align: center; }
.hbSim__monthly { font-size: 1.6rem; font-weight: 700; }
.hbSim__monthly .num { font-family: Oswald, sans-serif; font-size: 4rem; color: var(--hb-blue); margin: 0 0.4rem; letter-spacing: 0.02em; }
.hbSim__detail { margin-top: 0.8rem; display: flex; flex-direction: column; gap: 0.4rem; font-size: 1.2rem; color: #555; }
.hbSim__detail div { display: flex; justify-content: space-between; gap: 1rem; border-top: 1px dashed var(--hb-blue-line); padding-top: 0.6rem; }
.hbSim__detail dt { white-space: nowrap; }
.hbSim__detail dd { text-align: right; }
.hbSim__detail dd { font-weight: 700; color: #333; }
.hbSim__note { margin-top: 1rem; font-size: 1.05rem; line-height: 1.6; color: #707070; }
.hbSim__total { margin-top: 1rem; font-size: 1.2rem; line-height: 1.6; color: #555; text-align: right; }
.hbSim__total span { font-weight: 700; color: #333; }
.hbSim__total small { display: block; font-size: 1.05rem; color: #707070; }
.totalPrice__breakdown { font-size: 1.1rem; color: #707070; margin-top: 0.4rem; }

/* ボーナス併用払いの表示 2026-10-12（MOTA方式：大きい数字＝ボーナス併用、均等払いは小さく） */
.archive__content .unit__planTag { display: inline-block; font-size: 1rem; font-weight: 700; color: #fff; background: var(--hb-blue); border-radius: 0.4rem; padding: 0.15rem 0.6rem; margin-bottom: 0.4rem; }
.archive__content .unit__plan { font-size: 1.05rem; line-height: 1.5; color: #555; margin: 0.2rem 0 0.6rem; white-space: nowrap; }
.archive__content .unit__plan--even { color: #333; border-top: 1px dashed #e1e4ea; padding-top: 0.5rem; }
.archive__content .unit__plan strong { font-family: Oswald, sans-serif; font-size: 1.4rem; }
.single__price .monthPrice__tag { display: inline-block; font-size: 1rem; font-weight: 700; color: #fff; background: var(--hb-blue); border-radius: 0.4rem; padding: 0.1rem 0.5rem; margin-right: 0.5rem; line-height: 1.5; }
.single__price .monthPrice__plan { font-size: 1.2rem; line-height: 1.6; color: #555; }
.single__price .monthPrice__plan .monthPrice__tag { display: block; width: max-content; margin: 0 0 0.2rem; }
.single__price .monthPrice__plan--even { white-space: nowrap; }
.single__price .monthPrice__plan--even { color: #333; margin-top: 0.3rem; }
.single__price .monthPrice__plan strong { font-family: Oswald, sans-serif; font-size: 1.8rem; }
.hbSimilar__price small { display: block; font-size: 0.95rem; color: #707070; font-weight: 400; }
.hbSim__bonusLine { margin-top: 0.4rem; font-size: 1.3rem; font-weight: 700; color: var(--hb-blue); }
.hbSim__bonusLine[hidden] { display: none; }

/* 価格未定（近日公開） */
.archive__content .unit__price--tba { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.3rem; min-height: 9rem; }
.archive__content .unit__tba { font-size: 1.4rem; font-weight: 700; line-height: 1.4; text-align: center; color: #333; }
.archive__content .unit__tbaSub { font-size: 1.05rem; color: #707070; }
.single__price--tba { display: block; padding: 2rem 1.6rem; border-radius: 1.2rem; background: #f6f6f6; text-align: center; }
.single__tba { font-size: 1.6rem; font-weight: 700; }
.single__tba strong { font-size: 2.2rem; color: var(--hb-blue); margin-left: 0.3em; }
.single__tbaSub { margin-top: 0.6rem; font-size: 1.2rem; color: #555; }

/* 画像スライダーの矢印：白丸に細い黒のシェブロン（2026-10-13 元の青い太矢印から変更） */
/* 矢印は写真の縁に半分はみ出す（左右の余白 2.4rem に収まる 3.6rem の丸を -1.8rem ずらす） */
.single .slider__main .navigation { left: -1.8rem; width: calc(100% + 3.6rem); padding: 0; pointer-events: none; }
.single .slider__main .navigation__button { pointer-events: auto; width: 3.6rem; height: 3.6rem; flex: none; display: flex; align-items: center; justify-content: center; border: 0; border-radius: 50%; background: rgba(255,255,255,.88); color: #222; box-shadow: 0 1px 3px rgba(0,0,0,.18); backdrop-filter: blur(2px); transition: background .15s, transform .15s; }
.single .slider__main .navigation__button.next { scale: 1; }
.single .slider__main .navigation__button svg { width: 1.8rem; height: 1.8rem; }
.single .slider__main .navigation__button:hover { background: #fff; }
.single .slider__main .navigation__button:active { transform: scale(.94); }
.single .slider__main .navigation__button:focus-visible { outline: 2px solid #222; outline-offset: 2px; }

/* 車種ページ: ランキングへ戻るリンク（タイトルの上） */
.single__back { display: inline-flex; align-items: center; gap: 0.3rem; margin: 0 0 1.6rem; font-size: 1.3rem; font-weight: 700; color: #555; text-decoration: none; }
.single__back svg { width: 1.4rem; height: 1.4rem; }
.single__back:hover { color: var(--hb-accent); }
.single { padding-top: 3.2rem; } /* 戻るリンクを置いたので上の空きを詰める（元は8rem） */

/* 燃費 */
.spec__fuelRank { color: var(--hb-accent) !important; white-space: nowrap; }
.single__rank--fuel { background: var(--hb-accent); color: #fff; }
/* 年式セルに世代表記を出すとき（2行・小さめ）、型式は長いので小さめ */
.single__carInfo dl dd .txt--gen { font-size: 1.6rem !important; line-height: 1.35; display: inline-block; }
.single__carInfo dl dd .txt--model { font-size: 1.3rem !important; line-height: 1.35; display: inline-block; word-break: break-all; }
.single__carInfo dl dd .txt--small { font-size: 1.6rem !important; }

/* 現行型／先代型バッジ */
.single__gen, .spec__gen { display: inline-flex; align-items: center; font-size: 1.1rem; font-weight: 700; line-height: 1.4; padding: 0.25rem 0.9rem; border-radius: 0.4rem; letter-spacing: 0.02em; }
.single__gen.is-current, .spec__gen.is-current { background: var(--hb-accent) !important; color: #fff !important; }
.single__gen.is-prev, .spec__gen.is-prev { background: #e3e6ea !important; color: #555 !important; }
.single__gen { font-size: 1.2rem; }

/* もっと詳細な条件（年式・駆動方式・排気量・乗車定員） */
.carFilter__more { margin-top: 1.2rem; }
.carFilter__moreBtn { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 0.6rem; font-size: 1.4rem; font-weight: 700; color: var(--color-blue, #1940a5); padding: 0.4rem 0; }
.carFilter__moreBtn::-webkit-details-marker { display: none; }
.carFilter__moreArrow { width: 0; height: 0; border-left: 0.5rem solid transparent; border-right: 0.5rem solid transparent; border-top: 0.7rem solid currentColor; transition: transform .15s; }
.carFilter__more[open] .carFilter__moreArrow { transform: rotate(180deg); }
.carFilter__catBadge--more { position: static; margin-left: 0.2rem; }
.carFilter__moreBody { margin-top: 1rem; padding: 1.4rem 1.6rem; background: #f4f6f8; border-radius: 1.2rem; display: grid; gap: 1.4rem; }
.carFilter__row .carFilter__label { margin: 0 0 0.6rem; }
.carFilter__range { display: flex; align-items: center; gap: 0.6rem; }
.carFilter__range select { flex: 1; min-width: 0; font-size: 1.4rem; font-weight: 700; padding: 0.9rem 1rem; border-radius: 0.8rem; border: 2px solid #fff; background: #fff; color: #333; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.carFilter__range span { color: #777; font-size: 1.3rem; }
@media (min-width: 768px) { .carFilter__moreBody { grid-template-columns: 1fr 1fr; } }

/* 車種詳細のバッジ列：4つ（世代・総合・ボディ・燃費）を1行に収める（2026-10-18） */
.single__ranks { display: flex; flex-wrap: nowrap; gap: 0.5rem; align-items: center; }
.single__ranks > * { flex: none; white-space: nowrap; }
.single__rank { font-size: 1.1rem; padding: 0.3rem 0.8rem; gap: 0; }
.single__rank b { font-size: 1.5rem; margin: 0 0.1em; }
.single__gen { padding: 0.25rem 0.7rem; }

/* 車種詳細のメーカー表記：ピルをやめて英字見出し（順位バッジと見分けるため）2026-10-18 */
.single__title .category.single__maker { display: inline-flex; align-items: baseline; gap: 0.8rem; padding: 0 0 0 1rem; border: 0; border-left: 0.4rem solid #111; border-radius: 0; background: none; color: #111; line-height: 1; }
.single__maker b { font-family: Oswald, sans-serif; font-weight: 700; font-size: 1.9rem; letter-spacing: 0.08em; }
.single__maker i { font-style: normal; font-size: 1.2rem; font-weight: 700; color: #777; }
/* 一覧カードのメーカー表記も同じスタイル（少し小さめ） */
.archive__content .unit__text .category.single__maker { display: inline-flex; align-items: baseline; gap: 0.6rem; padding: 0 0 0 0.8rem; border: 0; border-left: 0.3rem solid #111; border-radius: 0; background: none; color: #111; line-height: 1; }
.archive__content .single__maker b { font-size: 1.5rem; }
.archive__content .single__maker i { font-size: 1.1rem; }

/* ===== 一覧カードのレイアウト崩れ防止（2026-10-18） ===== */
/* メーカー：長い英字は小さく、折り返さない */
.single__maker { white-space: nowrap; }
.archive__content .single__maker.is-long b { font-size: 1.25rem; letter-spacing: 0.04em; }
.archive__content .single__maker.is-xlong b { font-size: 1.05rem; letter-spacing: 0.02em; }
.archive__content .single__maker.is-xlong i { display: none; }
.single__title .single__maker.is-xlong b { font-size: 1.5rem; letter-spacing: 0.04em; }
/* 総合◯位・ボディ◯位：1行固定 */
.archive__content .unit__ranks { flex-wrap: nowrap; white-space: nowrap; gap: 0.3rem 0.6rem; overflow: hidden; }
/* 年式・走行距離・燃費のチップ：2列グリッドで揃える（燃費◯位は10位以内のときだけ、1行まるごと） */
.archive__content .unit__text .spec { display: grid; grid-template-columns: 1fr 1fr; gap: 0.4rem; }
.archive__content .unit__text .spec span { white-space: nowrap; text-align: center; padding: 0.2rem 0.4rem; overflow: hidden; font-size: 1.05rem; }
.archive__content .unit__text .spec .spec__fuelRank { grid-column: 1 / -1; }
/* 隣のカードと価格ブロックの高さを揃える：価格は常にカードの下端に、スペック欄は3行分を確保 */
.archive__content .unit__price { margin-top: auto; }
.archive__content .unit__text .spec { min-height: 6.1rem; align-content: start; }
/* メーカー行は文字サイズが変わっても高さ固定（隣カードとのズレ防止） */
.archive__content .unit__text .category.single__maker { height: 1.8rem; align-items: center; }
.archive__content .unit__text .category.single__maker b, .archive__content .unit__text .category.single__maker i { line-height: 1; }
/* 順位バッジを角ぎりぎりへ、少し小さく（車に被らないように）2026-10-18 */
.archive__content .unit__rank { top: 0.15rem; left: 0.15rem; min-width: 3.2rem; height: 3.2rem; padding: 0 0.5rem; }
.archive__content .unit__rank { min-width: 2.8rem; height: 2.8rem; padding: 0 0.45rem; align-items: center; line-height: 1; font-size: 1.5rem; }
.archive__content .unit__rank small { font-size: 0.9rem; line-height: 1; align-self: center; margin-top: 0.15rem; }

/* ===== 色の役割分担（2026-10-18 オレンジ3連発を解消）：メーカー=黒 / 現行型=オレンジ / 支払プラン=青 ===== */
.single__title .category.single__maker, .archive__content .unit__text .category.single__maker { border-left-color: #111; }
.archive__content .unit__planTag { background: var(--color-blue, #1940a5); }
/* CTA下の注意書き：中央寄せの半端な折返しをやめ、左寄せ＋「※」ぶら下げインデント（2026-10-18） */
.hbCarCta__note { text-align: left; max-width: 40em; margin-left: auto; margin-right: auto; }
.hbCarCta__note span { display: block; padding-left: 1em; text-indent: -1em; }
/* 「ボーナス月＋45,000円（年2回）」が折り返さないようにフォントを少し小さく＋nowrap（2026-10-18） */
.single__price .monthPrice__plan { font-size: 1.05rem; white-space: nowrap; letter-spacing: -0.01em; }
.single__price .monthPrice__plan--even { font-size: 1.2rem; }
/* CTA下の注意書き2行をそれぞれ1行に収める（2026-10-18 ロロ指示：改行せずフォント縮小） */
.hbCarCta__note { max-width: none; font-size: 0.95rem; letter-spacing: -0.02em; }
.hbCarCta__note span { white-space: nowrap; padding-left: 0; text-indent: 0; }
/* 左揃えのまま、ブロックごと中央に（2026-10-18） */
.hbCarCta__note { width: max-content; max-width: 100%; margin-left: auto; margin-right: auto; }

/* ===== 車種詳細の画像スライダー：横スクロール＋スナップ方式（Google口コミと同じ操作感）2026-10-18 ===== */
.single .slider__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; overscroll-behavior-x: contain; border-radius: 0.8rem; background: #fff; }
.single .slider__track::-webkit-scrollbar { display: none; }
.single .slider__slide { flex: 0 0 100%; width: 100%; scroll-snap-align: start; scroll-snap-stop: always; }
.single .slider__slide img { width: 100%; height: auto; object-fit: contain; aspect-ratio: 436 / 327; display: block; }
/* スライドの端数ずれで隣の画像が1〜2pxのぞく（左の線）のを、各画像の左右端を少し削って防ぐ（2026-10-18） */
.single .slider__slide { overflow: hidden; background: #fff; }
.single .slider__slide img { clip-path: inset(0 2px); }
.single .slider__main .navigation { pointer-events: none; }
.single .slider__main .navigation__button { pointer-events: auto; }
@media (prefers-reduced-motion: reduce) { .single .slider__track { scroll-behavior: auto; } }
/* 右下に「6 / 10」のカウンター（メルカリ風）2026-10-18 */
.single .slider__count { position: absolute; right: 1rem; bottom: 1rem; z-index: 1; margin: 0; padding: 0.4rem 1rem; border-radius: 0.6rem; background: rgba(17,17,17,0.72); color: #fff; font-family: Oswald, sans-serif; font-size: 1.3rem; letter-spacing: 0.08em; line-height: 1; pointer-events: none; }
/* カウンターのフォントを内外で統一（spanが別フォントになってた）＋少し小さく（2026-10-18） */
.single .slider__count, .single .slider__count span { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-size: 1.1rem; letter-spacing: 0.04em; }
.single .slider__count { padding: 0.35rem 0.8rem; right: 0.8rem; bottom: 0.8rem; }