/* =========================================================
   BATTA KANSEN GUIDE（幹線便のご利用）
   Scope: .kansen-guide only
   完成イメージ（image (7).png）準拠。本文幅 約770px 前提。
========================================================= */
.kansen-guide {
  container-type:inline-size;
  --kg-navy:#123f6b;
  --kg-blue:#1a6fb3;
  --kg-teal:#21a3a6;
  --kg-text:#1f2d3a;
  --kg-muted:#5d6f7d;
  --kg-border:#d3e0ea;
  width:100%;
  color:var(--kg-text);
  font-size:15px;
  line-height:1.75;
  box-sizing:border-box;
}
.kansen-guide *, .kansen-guide *::before, .kansen-guide *::after { box-sizing:border-box; }
.kansen-guide svg { display:block; }

/* --- サイト共通CSS（style.css / layout.css）の打ち消し --- */
.kansen-guide h2, .kansen-guide h3, .kansen-guide h4 { width:auto; max-width:none; margin:0; padding:0; border:0; text-align:left; scroll-margin-top:80px; }
.kansen-guide table { width:100%; margin:0; border:0; table-layout:auto; border-collapse:collapse; }
.kansen-guide table th, .kansen-guide table td { background:none; color:inherit; }
.kansen-guide p { margin:0; }

/* --- タイトル・導入 --- */
.kansen-guide .kansen-guide__title {
  margin:0 0 18px; padding:0 0 10px;
  color:var(--kg-navy); border-bottom:2px solid var(--kg-teal);
  font-size:34px; font-weight:800; line-height:1.35;
}
.kansen-guide__intro { display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:20px; align-items:center; margin:0 0 30px; }
.kansen-guide__lead { margin:0 0 6px !important; font-size:15px; line-height:1.85; }
.kansen-guide__text { font-size:13px; color:#3d4c58; }
.kansen-guide__hero-note { display:flex; align-items:center; gap:14px; padding:16px; background:#eaf3fb; border-radius:10px; }
.kansen-guide__hero-note svg { flex:0 0 50px; width:50px; height:50px; color:var(--kg-navy); }
.kansen-guide__hero-note strong { color:var(--kg-navy); font-size:14.5px; line-height:1.65; }

/* --- セクション見出し --- */
.kansen-guide__section { margin:0 0 30px; }
.kansen-guide__head { display:flex; justify-content:space-between; align-items:flex-start; gap:8px 16px; flex-wrap:wrap; margin:0 0 4px; }
.kansen-guide__section-title { display:flex; align-items:center; gap:12px; flex:1 1 260px; padding:6px 14px 6px 6px; background:linear-gradient(90deg,#eaf1f7,rgba(234,241,247,0)); border-radius:8px; }
.kansen-guide .kansen-guide__section-title h3 { color:var(--kg-navy); font-size:22px; font-weight:800; line-height:1.4; }
.kansen-guide__number { display:inline-flex; align-items:center; justify-content:center; flex:0 0 36px; width:36px; height:36px; color:#fff; background:var(--kg-blue); border-radius:7px; font-size:20px; font-weight:800; line-height:1; }
.kansen-guide__head-note { flex:0 1 auto; padding-top:4px; color:var(--kg-muted); font-size:11.5px; line-height:1.6; }
.kansen-guide__sub { margin:4px 0 12px 54px !important; font-size:13.5px; }

/* --- 1. 対応ルート --- */
.kansen-guide__route-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:16px; align-items:start; margin-top:12px; }
.kansen-guide__route-map { margin:0; background:#f2f6fa; border-radius:10px; overflow:hidden; }
.kansen-guide__route-map img { display:block; width:100%; height:auto; margin:0; }

.kansen-guide__table-wrap { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--kg-border); border-radius:8px; }
.kansen-guide__table { min-width:560px; background:#fff; }
.kansen-guide__table th, .kansen-guide__table td { padding:9px 12px; border-bottom:1px solid var(--kg-border); vertical-align:middle; }
.kansen-guide__table tr:last-child th, .kansen-guide__table tr:last-child td { border-bottom:0; }
.kansen-guide .kansen-guide__table thead th { color:#fff; background:var(--kg-navy); text-align:center; font-size:13.5px; font-weight:700; line-height:1.4; }
.kansen-guide__table thead small { display:block; font-size:10.5px; font-weight:400; }

.kansen-guide__route-table { min-width:0; }
.kansen-guide__route-table tbody th { width:38%; text-align:center; }
.kansen-guide__route-table tbody td { font-size:14.5px; font-weight:700; }
.kansen-guide__venue { display:block; padding:4px 8px; color:#fff; border-radius:4px; font-size:14px; font-weight:700; text-align:center; line-height:1.5; }
.kansen-guide__venue--kanagawa{background:#1a6fb3}.kansen-guide__venue--saitama{background:#f08a00}.kansen-guide__venue--nagoya{background:#3b914d}.kansen-guide__venue--osaka{background:#d9262e}.kansen-guide__venue--okayama{background:#7d4bb3}.kansen-guide__venue--fukuoka{background:#e0457f}
.kansen-guide__arrow { margin:0 14px 0 4px; color:var(--kg-navy); font-weight:800; }
.kansen-guide__route-note { display:block; margin:2px 0 0 34px; color:var(--kg-muted); font-size:10.5px; font-weight:400; line-height:1.5; }

/* --- 2. 料金 --- */
.kansen-guide__price-table tbody th { width:28%; font-size:14px; font-weight:700; text-align:center; }
.kansen-guide__price-table tbody td { font-size:14px; text-align:center; }
.kansen-guide .kansen-guide__price-table tbody tr:nth-child(even) th,
.kansen-guide .kansen-guide__price-table tbody tr:nth-child(even) td { background:#f6f9fc; }
.kansen-guide__price-old { margin-right:6px; color:#8b979e; text-decoration:line-through; }
.kansen-guide__price-same { margin-left:8px; color:var(--kg-navy); font-size:11.5px; font-weight:700; white-space:nowrap; }
.kansen-guide__badge { display:inline-block; margin-left:6px; padding:1px 8px; color:#fff; background:#e45b2e; border-radius:999px; font-size:10px; font-weight:700; vertical-align:middle; }
.kansen-guide__row-note { display:block; color:var(--kg-muted); font-size:10.5px; font-weight:400; }
.kansen-guide__check-price { color:var(--kg-navy); font-weight:700; }

/* --- 3. ご利用方法 --- */
.kansen-guide__steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-top:12px; }
.kansen-guide__step { position:relative; padding:14px 12px 16px; background:#fff; border:1px solid var(--kg-border); border-radius:10px; box-shadow:0 1px 3px rgba(18,63,107,.06); }
.kansen-guide__step:not(:last-child)::after { content:""; position:absolute; top:50%; right:-14px; transform:translateY(-50%); border-left:8px solid #8dbbe0; border-top:7px solid transparent; border-bottom:7px solid transparent; }
.kansen-guide__step-head { display:flex; align-items:center; gap:8px; min-height:42px; }
.kansen-guide__step-no { display:flex; align-items:center; justify-content:center; flex:0 0 28px; width:28px; height:28px; color:#fff; background:var(--kg-blue); border-radius:50%; font-size:15px; font-weight:800; }
.kansen-guide .kansen-guide__step h4 { color:var(--kg-navy); font-size:14px; font-weight:800; line-height:1.45; }
.kansen-guide__step-icon { width:50px; height:50px; margin:14px auto 12px; color:var(--kg-navy); }
.kansen-guide__step p { font-size:13px; line-height:1.7; }
.kansen-guide__step em { font-style:normal; color:#d8362f; font-weight:700; }
.kansen-guide__important { margin-top:14px; padding:10px 15px; color:var(--kg-navy); background:#eaf3fb; border-left:4px solid var(--kg-blue); border-radius:5px; font-size:14px; }

/* --- 4. 引渡し期限 / 5. 保証期間 --- */
.kansen-guide__two-col { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:22px; }
.kansen-guide__card-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }
.kansen-guide__card { overflow:hidden; background:#fff; border:1px solid var(--kg-border); border-radius:8px; }
.kansen-guide .kansen-guide__card h4 { padding:7px 8px; color:#fff; background:var(--kg-blue); font-size:13px; font-weight:700; text-align:center; }
.kansen-guide .kansen-guide__card--direct h4 { background:#1f9a8e; }
.kansen-guide__card-body { display:flex; gap:10px; align-items:flex-start; padding:12px 10px; }
.kansen-guide__card-body svg { flex:0 0 30px; width:30px; height:30px; color:var(--kg-navy); }
.kansen-guide__card-body p { font-size:12.5px; line-height:1.7; }
.kansen-guide__notes { margin-top:8px; color:var(--kg-muted); font-size:11.5px; line-height:1.65; }

.kansen-guide__warranty-lead { margin:6px 0 12px !important; font-size:13px; }
.kansen-guide__warranty { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.kansen-guide__warranty-card { overflow:hidden; border-radius:10px; text-align:center; }
.kansen-guide__warranty-card span { display:block; padding:7px 6px; color:var(--kg-navy); font-size:13px; font-weight:700; }
.kansen-guide__warranty-card p { padding:8px 6px 0; font-size:14px; font-weight:700; }
.kansen-guide__warranty-card strong { display:block; padding:0 6px 12px; color:var(--kg-navy); font-size:40px; line-height:1.15; }
.kansen-guide__warranty-card strong small { margin-left:2px; font-size:22px; }
.kansen-guide__warranty-card--trunk { background:#eef6fc; }
.kansen-guide__warranty-card--trunk span { background:#d8eaf8; }
.kansen-guide__warranty-card--direct { background:#eef8ea; }
.kansen-guide__warranty-card--direct span { background:#d9efd1; }

/* --- 6. 注意事項 --- */
.kansen-guide__caution-wrap { display:grid; grid-template-columns:230px minmax(0,1fr); gap:16px; align-items:start; }
.kansen-guide__caution { display:flex; gap:16px; align-items:center; padding:14px 18px; background:#eaf3fb; border-radius:10px; }
.kansen-guide__caution-icon { display:flex; align-items:center; justify-content:center; flex:0 0 38px; width:38px; height:38px; color:#fff; background:var(--kg-blue); border-radius:50%; font-size:22px; font-weight:800; }
.kansen-guide__caution ul { margin:0; padding-left:1em; list-style:"・"; font-size:13px; line-height:1.75; }
.kansen-guide__line { display:block; max-width:520px; margin:18px auto 0; padding:12px 18px; color:#fff!important; background:#06c755; border-radius:7px; font-weight:700; text-align:center; text-decoration:none!important; }
.kansen-guide__line:hover { opacity:.88; }

/* --- 幅が狭いとき（セクション自体の幅で切り替え） --- */
@container (max-width:700px){
  .kansen-guide__intro, .kansen-guide__route-grid, .kansen-guide__two-col, .kansen-guide__caution-wrap { grid-template-columns:1fr; }
  .kansen-guide__steps { grid-template-columns:1fr 1fr; }
  .kansen-guide__step::after { display:none; }
  .kansen-guide .kansen-guide__title { font-size:28px; }
}
@container (max-width:480px){
  .kansen-guide__steps, .kansen-guide__card-grid { grid-template-columns:1fr; }
  .kansen-guide__sub { margin-left:0 !important; }
  .kansen-guide .kansen-guide__section-title h3 { font-size:19px; }
}