/* RODEO 車種ページ 1.0（公開ページ） — 文字の大きさ・行間・字間・フォント・色は RODEO Base の変数だけを使う */
.rm{position:relative;max-width:1200px;margin:0 auto;padding-top:26px;box-sizing:border-box}
.rm *,.rm *::before,.rm *::after{box-sizing:border-box}
.rm img{max-width:100%;height:auto}
.rm p{margin:0}
.rm h2,.rm h3{margin:0!important;padding:0!important;border:0!important;background:none!important;color:var(--rodeo-c-text)}
.rm h2::before,.rm h2::after,.rm h3::before,.rm h3::after{content:none!important}

/* メインの写真 */
.rm-hero{display:block;margin:0 0 32px}
.rm-hero img{display:block;width:100%}

/* 題 */
.rm-title{max-width:1050px;margin:0 auto 40px;padding:16px 10px 14px;border-top:1px solid var(--rodeo-c-orange);border-bottom:1px solid var(--rodeo-c-orange);text-align:center}
.rm-title .rodeo-h1{text-align:center}
.rm .rm-sub{margin-top:8px;font-weight:500;color:var(--rodeo-c-text-sub);text-align:center}

/* 段 */
.rm-sec{max-width:1050px;margin:0 auto 48px}
.rm-concept p+p{margin-top:1em}
.rm .rm-h{margin:0 0 20px!important;text-align:center}
.rm .rm-h--line{padding:12px 0!important;border-top:1px solid var(--rodeo-c-orange)!important;border-bottom:1px solid var(--rodeo-c-orange)!important}

/* 基本仕様の箱 */
.rm-box{padding:28px 32px;background:var(--rodeo-c-bg-soft);border:1px solid var(--rodeo-c-border);border-radius:12px}
.rm-dl{margin:0}
.rm-row{display:grid;grid-template-columns:9.5em minmax(0,1fr);column-gap:12px;padding:7px 0;border-bottom:1px solid var(--rodeo-c-border);break-inside:avoid}
.rm-row.rm-row--full{grid-template-columns:minmax(0,1fr)}
.rm-row dt{margin:0;color:var(--rodeo-c-text-sub);white-space:nowrap}
.rm-row dd{margin:0}
.rm .rm-spec-note{margin-top:16px}

/* 製作例 */
.rm-lead{margin:0 0 18px;text-align:center}
.rm-grid{display:grid;gap:12px;grid-template-columns:repeat(var(--rm-pc),minmax(0,1fr))}
.rm-ph{display:block;position:relative;overflow:hidden;border-radius:10px;background:var(--rodeo-c-bg-soft);aspect-ratio:3/2}
.rm-ph img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform .3s}
.rm-ph:hover img{transform:scale(1.03)}
.rm-one{display:block;margin:0 auto;overflow:hidden;border-radius:10px}
.rm-one img{display:block;width:100%}
.rm-more{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;aspect-ratio:3/2;padding:10px;border-radius:10px;background:var(--rodeo-c-btn-bg);color:var(--rodeo-c-btn-text)!important;text-align:center;text-decoration:none!important}
.rm-more:hover{background:var(--rodeo-c-btn-hover)}
.rm .rm-more__en{color:inherit}
.rm-more__jp{font-weight:700}
.rm-btnw{margin:22px 0 0!important;text-align:center}
.rm .rm-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;min-width:300px;padding:10px 24px;border-radius:8px;text-decoration:none!important;color:var(--rodeo-c-btn-text)!important}

/* 追加の段 */
.rm-extra .rm-grid,.rm-extra .rm-one{margin-bottom:16px}
.rm-extra .rm-txt+.rm-one,.rm-extra .rm-txt+.rm-grid{margin:16px auto 0}
.rm-txt p+p{margin-top:1em}
.rm-msg{padding:20px 24px;background:var(--rodeo-c-bg-soft);border-left:3px solid var(--rodeo-c-orange)}

/* 拡大表示 */
.rm-lb{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:16px;background:color-mix(in srgb,var(--rodeo-c-text) 88%,transparent);cursor:zoom-out}
.rm-lb[hidden]{display:none}
.rm-lb img{max-width:100%;max-height:100%;width:auto;height:auto;border-radius:6px}
.rm-lb__x{position:absolute;top:10px;right:14px;padding:0 6px;background:none;border:0;color:var(--rodeo-c-btn-text);font-size:var(--rodeo-fs-h1);cursor:pointer}

/* クレジット */
.rm-credit{padding:24px 0;text-align:center}
.rm-credit img{display:block;width:89px;height:89px;margin:0 auto 8px}

/* スマホ（767px 以下） */
@media (max-width:767px){
.rm{padding-top:22px}
.rm-hero{margin-bottom:22px}
.rm-title{margin-bottom:28px;padding:12px 6px 10px}
.rm-sec{margin-bottom:36px}
.rm-box{padding:20px 16px}
.rm-row{column-gap:10px;padding:6px 0}
.rm-grid{gap:8px;grid-template-columns:repeat(var(--rm-sp),minmax(0,1fr))}
.rm .rm-btn{min-width:0;width:100%}
.rm-msg{padding:16px}
}

/* 準備中（非表示の車種） */
.rm-wait{margin-top:8px;text-align:center}
.rm-wait p+p{margin-top:10px}
.rm .rm-wait .rm-btnw{margin-top:18px!important}
.rm .rodeo-btn-line.rm-btn{color:var(--rodeo-c-line-text)!important}

/* PC の空き枠を埋める札（スマホでは出さない） */
.rm-fill{display:flex;align-items:center;justify-content:center;aspect-ratio:3/2;padding:10px;border-radius:10px;background:var(--rodeo-c-bg-soft);border:1px solid var(--rodeo-c-border);color:var(--rodeo-c-text)!important;font-weight:700;text-align:center;text-decoration:none!important}
a.rm-fill:hover{border-color:var(--rodeo-c-orange)}
@media (max-width:767px){.rm-fill{display:none}}
/* 基本仕様の表：縦1列・注意書きの大きさで詰める */
.rm-spec{padding:20px 24px}
.rm .rm-spec .rm-h{margin-bottom:12px!important}
.rm-spec .rm-dl{font-size:var(--rodeo-fs-note);line-height:var(--rodeo-lh-note)}
.rm-spec .rm-row{padding:2px 0}
.rm .rm-spec-note{margin-top:10px}
@media (max-width:767px){.rm-spec{padding:14px 12px}}

/* 基本仕様：変更したい項目の□ */
.rm-dl--chk .rm-row{grid-template-columns:1.3em 9.5em minmax(0,1fr)}
.rm-dl--chk .rm-row.rm-row--full{grid-template-columns:1.3em minmax(0,1fr)}
.rm-chk{-webkit-appearance:none;appearance:none;width:11px;height:11px;margin:0;align-self:center;border:1px solid var(--rodeo-c-text-muted);border-radius:2px;background:var(--rodeo-c-btn-text);cursor:pointer}
.rm-chk:checked{background:var(--rodeo-c-text-sub);border-color:var(--rodeo-c-text-sub);box-shadow:inset 0 0 0 2px var(--rodeo-c-btn-text)}
.rm-chk:focus-visible{outline:2px solid var(--rodeo-c-orange);outline-offset:1px}
.rm-ico{display:inline-block;width:11px;height:11px;margin:0 2px;vertical-align:-1px;border:1px solid var(--rodeo-c-text-muted);border-radius:2px;background:var(--rodeo-c-btn-text);box-sizing:border-box}
.rm-row label{display:block;cursor:pointer}
.rm-row:has(.rm-chk:checked){background:var(--rodeo-c-bg-soft)}
.rm-ask{margin-top:14px;text-align:center}
.rm-ask .rodeo-note{text-align:left}
.rm .rm-ask .rm-btnw{margin:10px 0 0!important}
.rm .rm-ask__btn{border:0;cursor:pointer;font-family:var(--rodeo-font);font-size:var(--rodeo-fs-body)}
.rm-wish{grid-column:2 / -1;margin:4px 0 2px!important}
.rm-wish__in,.rm-wish__sel{display:block;width:100%;box-sizing:border-box;padding:6px 8px;border:1px solid var(--rodeo-c-border);border-radius:6px;background:var(--rodeo-c-btn-text);font-family:var(--rodeo-font);font-size:var(--rodeo-fs-input);line-height:var(--rodeo-lh-head);color:var(--rodeo-c-text)}

/* 表の上の説明（操作の前に置く） */
.rm .rm-guide{margin:0 0 8px!important;text-align:center;font-weight:700;font-size:var(--rodeo-fs-body);line-height:var(--rodeo-lh-body);color:var(--rodeo-c-text)}
.rm-wish__sel+.rm-wish__in{margin-top:4px}

/* 表の下の「追加」の行 */
.rm .rm-addbox{margin:12px 0 0;padding:8px 12px 6px;border:1px solid var(--rodeo-c-border);border-radius:8px;background:var(--rodeo-c-btn-text)}
.rm .rm-addbox__h{margin:0 0 4px!important;font-weight:700;font-size:var(--rodeo-fs-body);line-height:var(--rodeo-lh-body);color:var(--rodeo-c-text)}
.rm .rm-addbox__h .rodeo-note{margin-left:8px;font-weight:500}
.rm .rm-addbox .rm-row:last-child{border-bottom:0}
.rm .rm-wish .rm-wish__in+.rm-wish__in{margin-top:4px}
.rm .rm-wish__more{display:inline-block;margin-top:4px;padding:2px 10px;border:1px solid var(--rodeo-c-border);border-radius:999px;background:var(--rodeo-c-btn-text);color:var(--rodeo-c-text-sub);font-family:var(--rodeo-font);font-size:var(--rodeo-fs-note);line-height:var(--rodeo-lh-note);cursor:pointer}
.rm .rm-wish__more:hover{border-color:var(--rodeo-c-text-muted)}
/* 押した後の確認の枠 */
.rm .rm-confirm{margin:12px 0 0;padding:14px 16px;border:2px solid var(--rodeo-c-text);border-radius:8px;background:var(--rodeo-c-btn-text);text-align:left}
.rm .rm-confirm__h{margin:0 0 8px!important;font-weight:700;font-size:var(--rodeo-fs-body);line-height:var(--rodeo-lh-body);color:var(--rodeo-c-text)}
.rm .rm-confirm__t{margin:0 0 8px;padding:10px 12px;border-radius:6px;background:var(--rodeo-c-bg-soft);white-space:pre-wrap;overflow-wrap:anywhere;font-family:var(--rodeo-font);font-size:var(--rodeo-fs-body);line-height:var(--rodeo-lh-body);color:var(--rodeo-c-text)}
.rm .rm-confirm__btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:12px 0 0!important}
.rm .rodeo-btn-sub.rm-btn{color:var(--rodeo-c-btn-sub-text)!important;border:0;cursor:pointer;font-family:var(--rodeo-font);font-weight:700}
.rm .rm-confirm .rm-btn{min-width:0;flex:0 1 360px}
.rm .rm-go{border:0;cursor:pointer;font-family:var(--rodeo-font);font-size:var(--rodeo-fs-body)}

/* ほかのラインナップへのタイル（製作例の上）：幅があれば1列、足りなければ3列×3段（空き枠を作らない） */
.rm-nav{max-width:1050px;margin:0 auto 40px;container-type:inline-size}
.rm .rm-nav__h{margin:0 0 10px!important;text-align:center;font-weight:700;font-size:var(--rodeo-fs-h3);line-height:var(--rodeo-lh-head);color:var(--rodeo-c-text)}
.rm .rm-nav__l{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;max-width:480px;margin:0 auto;padding:0;list-style:none}
.rm .rm-nav__l li{display:flex;margin:0;padding:0;list-style:none}
.rm .rm-nav__l li::before{content:none}
.rm .rm-nav__t{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:0;border-radius:8px;overflow:hidden;background:var(--rodeo-c-text);color:var(--rodeo-c-btn-text)!important;font-size:var(--rodeo-fs-note);line-height:var(--rodeo-lh-head);font-weight:700;text-align:center;text-decoration:none!important;white-space:nowrap}
.rm .rm-nav__ph{display:block;width:100%;aspect-ratio:16/10;overflow:hidden;background:var(--rodeo-c-text-sub)}
.rm .rm-nav__ph img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform .3s}
.rm a.rm-nav__t:hover img{transform:scale(1.06)}
.rm .rm-nav__n{display:block;width:100%;padding:4px 2px}
.rm .is-now{box-shadow:inset 0 0 0 3px var(--rodeo-c-orange)}
.rm .is-now .rm-nav__n{background:var(--rodeo-c-orange)}
/* 価格表・中古車：ハーフトーン（2番手のボタンの色）＋黒い文字 */
.rm .rm-nav__t--x{justify-content:center;gap:2px;background:var(--rodeo-c-btn-sub);color:var(--rodeo-c-btn-sub-text)!important}
.rm a.rm-nav__t--x:hover{filter:brightness(.95)}
.rm .rm-nav__en{display:block;font-size:var(--rodeo-fs-note);color:var(--rodeo-c-btn-sub-text)}
.rm .rm-nav__t--x .rm-nav__n{padding:0;font-size:var(--rodeo-fs-body)}
.rm .rm-nav__t--x.is-now .rm-nav__n{background:none}
@container (min-width:960px){.rm .rm-nav__l{grid-template-columns:repeat(var(--rm-nav-n),minmax(0,1fr));max-width:none}}
/* タイルだけを貼ったページ（[rodeo_lineup_nav]） */
.rm.rm--navonly{padding-top:8px}
.rm.rm--navonly .rm-nav{margin-bottom:24px}
