/* ============================================================
   ジムニー買取LP スマホ特化スタイル
   実測値: リポジトリ直下の DESIGN-SPEC.md 準拠（PDF 1366pt → モバイル390px基準）
   ============================================================ */

:root{
  --black:#000;
  --gray-dark:#4D4D4D;
  --gray-mid:#808080;
  --gray-label:#B3B3B3;
  --bg-gray:#F2F2F2;
  --cream:#FEF9E9;
  --yellow:#F2C01E;
  --yellow-hero:#E6C520;
  --red:#FF1D25;
  --green-line:#06C555;
  /* Adobe Fonts導入後、各スタックの先頭にAdobe側のfont-familyを追記 */
  --f-goth:"Noto Sans JP",sans-serif;           /* GothicMB101代替 */
  --f-ud:"Noto Sans JP",sans-serif;             /* UD新ゴ代替 */
  --f-round:"fot-seurat-pron","Zen Maru Gothic","Noto Sans JP",sans-serif; /* スーラ本体（Adobe Fonts）。未読込時はZen Maru Gothicへ */
  --f-kozgo:"kozuka-gothic-pr6n","Noto Sans JP",sans-serif; /* 小塚ゴシック */
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--f-goth);color:var(--black);background:#E6E6E6;-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}

.page{max-width:480px;margin:0 auto;background:#fff;position:relative;box-shadow:0 0 24px rgba(0,0,0,.12)}

section{scroll-margin-top:64px}

/* ---------- 共通パーツ ---------- */
.btn-line{
  display:flex;align-items:center;justify-content:center;gap:16px; /* PDF実測: 矢印右端〜文字左端＝16.0px */
  background:var(--green-line);color:#fff;
  font-family:var(--f-round);font-weight:600;font-size:17px; /* スーラBはAdobe Fontsでw600。700だと合成太字がかかる */
  border:none;border-radius:8px;cursor:pointer;
  min-height:54px;padding:10px 18px;width:100%;
  box-shadow:0 3px 0 rgba(0,0,0,.18);
}
/* 矢印はCSSで描画する。以前は content:"›"(U+203A) だったが、ボタンのフォント
   Zen Maru Gothic がこのグリフを持たず、フォールバック先の環境差で字形が変わったり
   豆腐(□)になる不具合があったため（2026-07-25修正）。borderで描くのでフォント非依存 */
/* PDF実測: 矢印は 幅8.0×高さ14.5px・線幅2.0px。8px角＋2px罫を45度回転で再現 */
.btn-line::before{
  content:"";flex:none;
  width:8px;height:8px;
  border-top:2px solid currentColor;border-right:2px solid currentColor;
  transform:translateY(-1px) rotate(45deg);
}
/* 追従しないLINEボタンの注目アニメーション（2026-07-24）: ゆるい鼓動＋光沢スイープ */
.btn-line--attention{position:relative;overflow:hidden;animation:btn-pulse 2s ease-in-out infinite}
.btn-line--attention::after{
  content:"";position:absolute;top:0;left:-80%;width:55%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-20deg);animation:btn-shine 3.2s ease infinite;
}
@keyframes btn-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}
@keyframes btn-shine{0%,55%{left:-80%}100%{left:135%}}
@media (prefers-reduced-motion:reduce){
  .btn-line--attention{animation:none}
  .btn-line--attention::after{content:none}
}
/* .hero__badge の停止指定はPCメディアクエリ側（アニメーション定義の直後）に置く。
   ここに書いても後に来る同詳細度の定義に負けるため */

.sec{padding:40px 20px 48px;background:#fff}
/* 番号ブロック: PDF実測比（ラベル24pt/見出し36pt → モバイル見出し24pxに対し2/3スケール）
   ブロック高130pt→88px・06のみ2行ラベル160pt→108px。幅は画像ごとの比率を維持 */
/* 番号ブロック（2026-07-25に画像1枚 → 数字画像＋ラベルはHTMLテキストへ分離）。
   PDF実測: 数字インク95.5pt高、下に12.5pt空けてラベル（インク高22.5pt・1文字約23.1pt）。
   モバイルは 88/130＝0.677倍 */
.sec__num{margin-bottom:14px}
.sec__num-fig{display:block;height:65px;width:auto}
/* ラベルはPDFではUD新ゴ Medium。w900だと太すぎたため500へ（2026-07-25）。
   インク占有率の実測: PDF 39.6% ／ w500 35.7% ／ w700 43.1% ／ w900 49.4% */
.sec__num-label{display:block;font-family:var(--f-ud);font-size:16px;font-weight:500;line-height:1.3;margin-top:5px}
.sec__title{font-size:24px;font-weight:900;line-height:1.45;margin-bottom:14px}
.sec__title--sub{margin-top:44px;font-weight:700} /* 2026-07-23ユーザー指定で太さ控えめ */
/* 旧名の --center はサイズ/余白の指定として残置。揃えはPDF・PC版と同じ左揃え（2026-07-25ユーザー指定でモバイルも中央→左へ） */
.sec__title--center{font-size:20px;margin-top:48px}
.sec__lead{font-size:15px;line-height:1.75;margin-bottom:22px}
.sec__note{font-size:12px;color:var(--gray-mid);line-height:1.6;margin-top:14px}

/* ---------- Header ---------- */
.header{
  position:sticky;top:0;z-index:100;background:#fff;
  display:flex;align-items:center;justify-content:space-between;
  height:56px;padding:0 14px;
  border-bottom:4px solid var(--yellow-hero);
}
.header__logo img{width:224px;height:auto}
.gnav{display:none} /* PCのみ表示 */
.header__burger{background:none;border:none;padding:8px;cursor:pointer}
.header__burger img{width:40px;height:auto}

.drawer{
  position:fixed;top:0;right:0;z-index:200;height:100vh;width:78%;max-width:340px;
  background:#fff;box-shadow:-6px 0 24px rgba(0,0,0,.25);
  padding:70px 26px 30px;
  transform:translateX(105%);transition:transform .28s ease;
}
.drawer.is-open{transform:translateX(0)}
.drawer__list{margin-bottom:26px}
.drawer__link{
  display:block;padding:15px 4px;font-family:var(--f-ud);
  font-size:15px;font-weight:500;border-bottom:1px solid #E5E5E5;
}
.drawer__cta{font-size:15px}
.drawer-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:150;
  opacity:0;pointer-events:none;transition:opacity .28s ease;
}
.drawer-overlay.is-open{opacity:1;pointer-events:auto}
body.menu-open{overflow:hidden}

/* ---------- 追従CTA（2026-07-24） ---------- */
.header__cta{display:none} /* PC(≥1000px)のみヘッダー内に表示 */
/* スマホ: 画面下部に固定。ヒーローのウィジェットを通過したら表示（js/main.js） */
.fixed-cta{
  position:fixed;left:50%;bottom:0;z-index:90;
  width:100%;max-width:480px;
  padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.95);box-shadow:0 -4px 16px rgba(0,0,0,.15);
  transform:translate(-50%,110%);transition:transform .3s ease;
}
.fixed-cta.is-visible{transform:translate(-50%,0)}
.fixed-cta .btn-line{min-height:48px;font-size:16px}

/* ---------- Hero（メインビジュアルはデザインどおり画像で表示） ---------- */
.hero{
  position:relative;background:#E6C520; /* 指定カラーコード */
  padding:0;overflow:hidden;
}
.hero__main-wrap{margin:0;line-height:0}
.hero__main{width:100%;height:auto;display:block}
/* PC専用オーバーレイ（CTAボタン＋バッジのまとまり／流れリンク）。モバイルはウィジェット側のボタンを使うので出さない */
.hero__cta-group,.hero__flow{display:none}

/* ---------- ウィジェット（外枠上部はデザインスクショの画像） ---------- */
.widget{margin:0;padding:16px 0 32px;background:var(--bg-gray)} /* 上下は01と同じグレー */
/* 外枠画像(jimnykaiyor02_sp・395×515・透過): カード=画像幅いっぱい x0-394/y26-514
   上110px（見出し＋仕切り線y94）だけ表示し、下はHTMLフォームが続く（PC共用） */
.widget__head{position:relative;overflow:hidden;padding-top:27.848%} /* =110/395 */
.widget__frame{position:absolute;top:0;left:0;display:block;width:100%;height:auto}
.widget__form{
  margin:-1px 0 0; /* headの小数px丸めで背景が透ける隙間を防ぐ */
  background:#F2F2F2;
  border-radius:0 0 18px 18px;padding:10px 24px 24px;
  box-shadow:0 14px 24px -10px rgba(0,0,0,.16);
}
/* 2026-08-05にラベル横並び（132px固定）から縦積みへ変更（ユーザー選択）。
   横並びだと選択欄の表示可能幅が158pxしかなく、JA11の「ワイルドウインド リミテッド」185.1px や
   既存の「ノーマル（カスタムなし）」168.0px が枠に収まらなかった。
   縦積みなら390px時で298px確保でき、全選択肢が1行に収まる。
   selectの中で2行に折り返す案はChromiumでは動くがiOS Safariで効くか保証できないため採らなかった */
.field{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
.field__label{
  display:flex;align-items:center;gap:5px;flex-wrap:wrap;
  font-family:var(--f-ud);font-size:14px;font-weight:700;line-height:1.25;
}
.req{
  flex:none;background:#fff;color:var(--red);border:1px solid var(--red);
  font-size:10px;font-weight:700;border-radius:999px;padding:1px 8px;
}
.field select{
  flex:none;width:100%;min-width:0;appearance:none;-webkit-appearance:none;
  font-family:var(--f-ud);font-size:14px;color:var(--black);
  border:1px solid #CCC;border-radius:6px;background:#fff;
  padding:11px 30px 11px 12px;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23666' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
  /* 縦積み化で全選択肢が収まるようになったため通常は発動しないが、
     将来さらに長い選択肢が入ったときに字の途中で切れないよう保険で残す */
  text-overflow:ellipsis;
}
.field select:invalid{color:#777}
.field.is-error select{border-color:var(--red);background-color:#FFF3F3}
/* 「375px未満はラベル132px確保のぶん選択肢を12.5pxへ縮小」という指定があったが、
   2026-08-05の縦積み化でその前提が消えたため削除（320px端末でも表示可能幅230pxあり、
   最長の185.1pxが14pxのまま収まる） */
.widget__submit{margin-top:6px}
.widget__foot{font-family:var(--f-ud);font-size:11px;color:var(--gray-mid);line-height:1.7;margin-top:12px}
.widget__flow{
  display:block;text-align:center;font-family:var(--f-ud);
  font-size:14px;font-weight:700;margin-top:14px;
}
.widget__flow .arrow{margin-left:4px}

/* ---------- 20年帯 ---------- */
/* 20年帯（2026-07-25に画像1枚 → 盾ロゴ画像＋HTMLテキストへ）。
   PDF実測(PC): 盾 111×125.5pt / 1行目インク高34.0pt・幅573.5pt /
   2行目は「シーエルリンク」約34.5pt・「による」約24pt・「ジムニー買取」約43pt の3段サイズ */
.band20{
  background:#fff;padding:30px 20px;
  display:flex;align-items:center;justify-content:center;gap:16.5px; /* PDF: 盾右端452.5→テキスト左端469 */
}
/* 盾とテキストの2枚とも支給画像（2026-07-25ユーザー指定でテキスト化から画像へ戻し）。
   PDF実測の原寸を width に置き、狭い画面では flex-shrink が基準幅に比例して
   両方を同率で縮小する（＝PDFの比率を保ったまま収まる） */
.band20__badge{width:111px;height:auto;min-width:0}
.band20__text{width:573.5px;height:auto;min-width:0}

/* ---------- 01 動画 ---------- */
.sec01{background:var(--bg-gray)}
.sec01__heading{width:330px;max-width:100%;margin-bottom:14px}
/* サムネイル画像を置かないため、高さはPDFの動画枠 590×340 の比率で確保する */
.video{position:relative;border-radius:10px;overflow:hidden;background:#E6E6E6;aspect-ratio:590/340}
.video__soon{
  position:absolute;right:10px;bottom:10px;
  background:rgba(0,0,0,.82);color:#fff;
  font-family:var(--f-ud);font-size:12px;font-weight:500;
  padding:5px 12px;border-radius:99px;
}

/* ---------- 02 不満 ---------- */
.br-pc{display:none} /* PC専用改行 */
/* .br-sp はモバイル専用改行（PCで非表示） */
/* 不満リスト: jimnykaiyori04 フレーム（539×270・バー4行＋アイコン込み）を
   モバイルは幅100%スケーリング、PCは原寸540pxで表示しテキストを重ねる */
.worry{
  position:relative;margin-bottom:26px;
  height:0;padding-top:50.09%; /* =270/539 */
  background:url(../img/pc/worry-frame.webp) 0 0/100% 100% no-repeat;
  font-size:calc((min(100vw, 480px) - 40px)*.034); /* バー縮小率に追従 */
}
.worry__item{
  position:absolute;left:11.3%;margin:0;padding:0;
  white-space:nowrap;font-weight:900;line-height:1.3;transform:translateY(-50%);
}
.worry__item:nth-child(1){top:10%}
.worry__item:nth-child(2){top:34.8%}
.worry__item:nth-child(3){top:64.1%;left:9.6%}
.worry__item:nth-child(4){top:90.4%}
.worry__icon{display:none} /* アイコンはフレーム画像に含まれる */
/* LP準拠: 白背景に黒文字＋黄マーカー（#F2C01E） */
.solve{
  font-size:19px;font-weight:900;line-height:1.7;text-align:center;
  margin-top:6px;
}
.solve__hl{background:linear-gradient(transparent 58%,var(--yellow) 58%);padding:0 4px}

/* ---------- 03 タイル ---------- */
/* PDF実測: セクション背景#F2F2F2、タイルは#E6E6E6カード＋白の写真ブロックがインセット */
.sec03{background:var(--bg-gray)}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tile{background:#E6E6E6;border-radius:8px;overflow:hidden;padding:6px 6px 10px}
.tile img{width:100%;aspect-ratio:3/2;object-fit:cover;background:#fff;border-radius:4px}
.tile__name{
  display:block;font-size:11px;font-weight:900;line-height:1.45;
  padding:8px 2px 0;
}
/* バッジはテキストより前に置き右上へフロート＝常に1行目に載る */
.tile__up{
  float:right;background:var(--red);color:#fff;
  font-size:8.5px;font-weight:700;border-radius:3px;padding:1.5px 5px;
  margin:1px 0 2px 4px;
}
.tile__sub{font-family:var(--f-ud);font-size:10px;color:var(--gray-mid);padding:3px 2px 0;line-height:1.5;clear:both}

/* ---------- 見積書 ---------- */
/* 見積書の太字は700（2026-07-25）。PDFはMB101 DeBold相当で、900は太すぎた。
   インク占有率の実測 — 「車両情報」PDF53.1/w700 57.0/w900 64.7、
   「車両買取見積書」PDF54.4/w700 55.3/w900 62.2、「¥2,000,000」PDF37.5/w700 36.4/w900 40.1 */
.sec-estimate{background:var(--bg-gray)}
/* PDF実測: 白シートはダークバーと同じ幅で、左右・下の枠は無い。
   影は右下に寄ったドロップシャドウ（シート端から右16pt/下15pt/左6ptまで、最濃176@背景242） */
.estimate{background:var(--gray-dark);border-radius:14px;overflow:hidden;margin-bottom:8px;
  /* 影は右下のみ。左に出さないため水平オフセット(10px)をぼかし半径(16/2=8px)より大きく取る。
     実測: 左端の暗さ −6（PDFは−9）でほぼ無し、右方向はPDF比の平均誤差4.4/255 */
  box-shadow:10px 8px 16px rgba(0,0,0,.32)}
.estimate__head{display:flex;flex-direction:column;gap:4px;padding:16px 18px}
.estimate__title{color:#fff;font-size:19px;font-weight:700}
.estimate__meta{color:#fff;font-size:11px}
.estimate__sheet{background:#fff;margin:0;border-radius:0;padding:18px 14px} /* 角丸は親の overflow:hidden で処理 */
.estimate__cap{font-size:14px;font-weight:700;color:#555;margin:20px 0 10px}
.estimate__cap:first-child{margin-top:0}
.carinfo__row{
  display:flex;justify-content:space-between;gap:10px;
  border-bottom:1px solid #E5E5E5;padding:9px 2px;
}
.carinfo__row dt{font-size:12px;color:var(--gray-label)}
.carinfo__row dd{font-size:12px;color:var(--gray-mid);text-align:right}
.detail{width:100%;border-collapse:collapse;font-size:12px}
.detail thead th{
  background:var(--yellow);color:#4D4D4D;font-weight:700;
  text-align:left;padding:8px 8px;
}
.detail thead .detail__price{text-align:right}
.detail tbody td{padding:10px 8px;border-bottom:1px solid #EEE;color:var(--gray-mid)}
.detail tbody td:first-child{color:var(--gray-label);width:26px}
.detail tbody td:last-child{text-align:right;white-space:nowrap}
.detail tbody tr:nth-child(even){background:#FBF6EA}
.totals{margin-top:12px}
.totals__row{display:flex;justify-content:space-between;padding:6px 2px;font-size:12px;color:var(--gray-mid)}
.totals__row dd{font-size:13px}
.prices{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.prices__box{background:var(--bg-gray);text-align:center;padding:18px 12px;border-radius:6px}
.prices__box--up{background:var(--cream)}
.prices__up{color:var(--red);font-size:16px;font-weight:700;margin-bottom:4px}
.prices__label{font-size:13px;font-weight:700}
.prices__value{font-size:26px;font-weight:700;letter-spacing:.01em}
.prices__note{font-size:11px;color:var(--gray-mid);margin-top:4px}
.notes li{font-size:11px;color:var(--gray-mid);line-height:1.7;margin-bottom:4px}

/* ---------- ブランドピル ---------- */
.brands{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.brands li{
  background:var(--red);color:#fff;
  font-size:13px;font-weight:700;
  border-radius:99px;padding:8px 16px;
}

/* ---------- 04 比較表 ---------- */
/* モバイルは横スクロールなしで全幅に収める（2026-07-23ユーザー指定） */
.compare-wrap{margin:0;padding:0}
.compare{width:100%;table-layout:fixed;border-collapse:collapse;font-size:10px}
.compare th,.compare td{border:1px solid #E0E0E0;padding:7px 3px;text-align:center;vertical-align:middle;color:var(--gray-dark);word-break:break-word}
.compare thead th{font-size:10.5px;font-weight:900;background:#fff}
.compare thead th:first-child{width:27%}
.compare tbody th{text-align:left;font-weight:400;background:var(--bg-gray);padding-left:5px} /* 項目列はグレー地（2026-07-26ユーザー指定。PDFは白） */
.compare .compare__cl{background:var(--cream);font-weight:700}
.compare th.compare__cl{background:#E6C520} /* 見出し「シーエルリンク」セルのみブランド黄（2026-07-23ユーザー指定） */
.compare .mark{display:block;font-size:14px;line-height:1.2}

/* ---------- 05 理由 ---------- */
.reason{display:flex;gap:14px;margin-bottom:26px}
.reason__badge{
  flex:none;width:69px;height:69px;border:2px solid var(--black);
  background:#fff; /* 円内は白（2026-07-23ユーザー指定） */
  border-radius:50%; /* 丸バッジ（2026-07-23ユーザー指定・PDF比2/3スケール） */
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-size:17px;font-weight:700;line-height:1.2;
}
.reason__badge span{font-size:13px}
.reason__title{font-size:18px;font-weight:700;line-height:1.5;margin-bottom:8px}
.sec05 .sec__title{font-weight:700} /* 2026-07-23ユーザー指定で太さ控えめ */
.sec05{background:var(--bg-gray)} /* PDF実測 #F2F2F2 */
.sec05 .sec__lead{margin-bottom:36px} /* リード〜根拠の余白 */
.reason__body p{font-size:14px;line-height:1.75}
.routes{display:flex;flex-direction:column;gap:12px;margin-top:8px}
.routes__card{background:#fff;border:1px solid var(--black);padding:16px 16px 14px;text-align:center}
.routes__card h3{font-size:16px;font-weight:900;margin-bottom:8px}
.routes__card p{font-size:12px;line-height:1.75;text-align:left}

/* ---------- 06 流れ ---------- */
.sec06{background:var(--bg-gray);padding-bottom:0}
/* ステップ枠は jimnykaiyori07 準拠: 黒ハイライン枠クリーム地＋白丸チェブロン連結＋白ピルバッジ */
.steps{counter-reset:step;margin-bottom:16px}
.steps__item{
  position:relative;background:var(--cream);border:1.5px solid var(--black);
  padding:16px 16px 14px 16px;margin-bottom:26px;
}
.steps__item:not(:last-child)::after{
  content:"";position:absolute;left:50%;bottom:-28px;
  transform:translateX(-50%) rotate(90deg); /* 下向きチェブロン */
  width:30px;height:30px;border-radius:50%;box-sizing:border-box;
  border:1.5px solid var(--black);z-index:1;
  /* シェブロンは jimnykaiyori07 実測形状（線幅2.8・45°・端は角） */
  background:#fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 16'%3E%3Cpath d='M1.5 1l7 7-7 7' fill='none' stroke='%23000' stroke-width='2.8'/%3E%3C/svg%3E") no-repeat;
  background-position:calc(50% + 1px) 50%;background-size:8px 13px;
}
.steps__badge{
  position:absolute;top:-11px;right:12px;z-index:2;
  background:#fff;color:var(--black);border:1.5px solid var(--black);
  font-size:11px;font-weight:700;border-radius:99px;
  padding:3px 12px;line-height:1.3;
}
.steps__name{font-size:14px;font-weight:700;margin-bottom:6px}
.sec06 .sec__title{font-weight:700} /* 2026-07-23ユーザー指定で太さ控えめ */
.sec06 .sec__lead{margin-bottom:44px} /* リード〜買取の流れの余白（PDF66pxの2/3） */
/* 番号丸（①〜⑤）は2026-07-24ユーザー指定で廃止 */
.steps__text{font-size:12px;line-height:1.7;color:#333}
.steps__note{font-size:13px;font-weight:900;text-align:center;line-height:1.7;margin-bottom:34px}
.linemock{background:#fff;margin:0 -20px;padding:40px 14px 48px}
/* 2026-08-05に3枚並べる構成から、3画面が横並びになった支給の1枚へ変更。
   端末間の余白は画像に含まれるのでCSSのgapは不要 */
.linemock__row{display:flex;justify-content:center}
.linemock__row img{width:100%}

/* ---------- 07 事例 ---------- */
.sec07{background:var(--bg-gray)}
.cases{display:flex;flex-direction:column;gap:18px}
.case{background:#fff;border:1px solid var(--black);border-radius:14px;overflow:hidden;padding-bottom:18px} /* PDF実測: 黒1px枠・角丸14px・影なし（2026-07-24外枠追加） */
.case__photo{width:100%;aspect-ratio:4/3;object-fit:cover}
.case__name{font-size:16px;font-weight:900;padding:14px 16px 0}
.case__spec-strong{font-size:12px;font-weight:900;padding:4px 16px 0}
.case__spec{font-family:var(--f-ud);font-size:12px;color:var(--gray-mid);padding:2px 16px 0}
.case__price{display:flex;align-items:baseline;gap:6px;padding:10px 16px 0}
.case__price-label{
  background:var(--yellow);color:var(--black);border-radius:50%;
  font-size:10px;font-weight:700;width:38px;height:38px;
  display:inline-flex;align-items:center;justify-content:center;
  align-self:center;
}
.case__price strong{font-size:28px;font-weight:700}
.case__price-unit{font-size:12px;font-weight:900}
.case__custom{font-size:12px;font-weight:900;padding:6px 16px 0}
/* 顧客名行はお客様名の入稿がないため非掲載（2026-07-24実データ反映）。仕切り線は★行へ移設 */
.case__stars{color:var(--black);font-size:17px;letter-spacing:2px;padding:12px 16px 0;border-top:1px solid #EEE;margin-top:12px} /* 星は黒（2026-07-24ユーザー指定） */
.sec07 .sec__title{font-weight:700} /* 2026-07-24ユーザー指定で太さ控えめ */
.case__voice{font-size:14px;line-height:1.75;padding:8px 16px 0}

/* ---------- 08 査定メニュー ---------- */
.menus{display:flex;flex-direction:column;gap:26px;margin-bottom:10px}
/* PDF準拠: 黒ハイライン枠・左揃え・タグは丸ピル・引用はMedium */
.menu{position:relative;border:1.5px solid var(--black);padding:30px 18px 20px;margin-top:14px}
.menu__tag{
  position:absolute;top:-14px;left:50%;transform:translateX(-50%);
  background:#fff;border:1.5px solid var(--black);border-radius:99px;
  font-size:13px;font-weight:700;white-space:nowrap;
  padding:4px 18px;
}
.menu__name{font-size:24px;font-weight:700;text-align:left;margin-bottom:8px}
.menu__quote{font-size:14px;font-weight:500;text-align:left;margin-bottom:14px}
.menu__list li{
  font-family:var(--f-kozgo);font-size:14px;line-height:1.7;
  position:relative;padding-left:1.2em;margin-bottom:7px;
}
.menu__list li::before{content:"•";position:absolute;left:.15em}
.privacy{
  background:var(--cream);border-radius:99px;
  text-align:center;padding:22px 24px;margin-bottom:26px;
}
.privacy__title{font-size:22px;font-weight:700;margin-bottom:6px}
.privacy__text{font-size:12px;font-weight:700;line-height:1.8}
.features{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.feature{border:1px solid var(--black);padding:14px 12px} /* PDF: 黒枠 */
.feature__check{
  display:block;width:34px;height:34px;margin-bottom:8px;
  background:url(../img/badge/feature-check.webp) no-repeat center/contain;
}
.feature__name{font-size:13px;font-weight:700;line-height:1.5;margin-bottom:5px}
.feature__sub{font-size:11px;color:var(--black);line-height:1.6}

/* ---------- 09 FAQ ---------- */
.faq__item{margin-bottom:12px}
.faq__q button{
  display:flex;align-items:center;gap:12px;width:100%;
  background:#fff;border:1.5px solid var(--black);border-radius:30px;
  font-family:var(--f-goth);font-size:14px;font-weight:900;text-align:left;
  padding:15px 46px 15px 18px;cursor:pointer;position:relative;line-height:1.5;
}
.faq__mark{font-size:19px;font-weight:900;flex:none}
.faq__plus{position:absolute;right:18px;top:50%;width:16px;height:16px;transform:translateY(-50%)}
.faq__plus::before,.faq__plus::after{
  content:"";position:absolute;background:var(--black);top:50%;left:50%;
}
.faq__plus::before{width:16px;height:2.4px;transform:translate(-50%,-50%)}
.faq__plus::after{width:2.4px;height:16px;transform:translate(-50%,-50%);transition:transform .2s}
.faq__item.is-open .faq__plus::after{transform:translate(-50%,-50%) scaleY(0)}
.faq__a{
  display:none;font-size:14px;line-height:1.75;
  padding:14px 20px 6px 20px;
}
.faq__item.is-open .faq__a{display:block}

/* ---------- 最終CTA（PC版と同様の横構成：黄背景に人物＋テキストを一体化） ---------- */
/* 背景ビジュアルは jimnykaiyori23（#E6C520補正済）。モバイルはテキスト→画像の縦積み */
.cta{
  position:relative;overflow:hidden;
  background:#E6C520;
  padding:44px 20px 0;text-align:center;
}
.cta__copy{position:relative;z-index:2}
.cta__title{font-size:20px;font-weight:900;line-height:1.55;margin-bottom:14px}
.cta__title span{display:block}
.cta__text{font-size:12px;font-weight:500;line-height:1.9;margin-bottom:20px}
.cta__btn{max-width:340px;margin:0 auto}
.cta__person{display:block;width:100%;height:auto;margin:26px auto 0}

/* ---------- Footer ---------- */
.footer{padding:36px 20px 96px;background:#fff} /* 下96px=スマホ追従CTAで隠れないための余白（PCで打消し） */
.footer__logo{width:200px;margin-bottom:24px} /* ロゴ画像はインクのみにクロップ済（534×70@2x） */
.footer__nav{border-bottom:1px solid #E8E8E8;margin-bottom:24px}
.footer__nav ul{display:grid;grid-template-columns:1fr 1fr;column-gap:12px;margin-bottom:18px}
/* フッターの文字色はPDF実測: 見出し/コピーライト=#000、ナビ/本文=#4D4D4D（モバイル・PC共通） */
.footer__nav a{
  display:block;font-size:12px;font-weight:500;color:var(--gray-dark);
  padding:6px 0;
}
.footer__block{margin-bottom:22px}
.footer__block h3{font-size:14px;font-weight:900;margin-bottom:6px}
.footer__block p{font-size:12px;font-weight:500;color:var(--gray-dark);line-height:1.9}
/* 社名はモバイル・PC共通で太字（黒）。サイズ・行送り・余白はPC側で別途上書き（2026-07-25ユーザー指定でモバイルも太字化） */
.footer__block .footer__company{font-weight:900;color:var(--black)}
.footer__block a{text-decoration:underline}
.footer__copy{
  text-align:center;font-size:11px;font-weight:500;color:var(--black);
  border-top:1px solid #E8E8E8;padding-top:18px;margin-top:26px;
}

/* ============================================================
   モバイル専用（〜999px）: 一列表示の可変フォント（2026-07-24ユーザー指定）
   480pxカラムで最適サイズ、狭幅では自動縮小して1行を維持。
   基準は min(100vw,480px)（481〜999pxでは480pxカラム幅に固定）。
   各値は Playwright で 390px/480px の1行収まり実測から算出。PCは別ブロックで上書き。
   ============================================================ */
@media (max-width:999px){
  /* --- 見出しの左揃え（2026-07-25ユーザー指定）。PCはPDFどおり中央のまま --- */
  .routes__card{text-align:left} /* 車両再販/パーツ再販/ベース車として。本文が左揃えなので見出しも揃える */
  /* --- セクション見出しの一列化 --- */
  .sec02 .sec__title{font-size:clamp(21px, calc(min(100vw,480px) * 0.02222 + 13.33px), 24px)}
  .sec03 .sec__title{font-size:clamp(18.5px, calc(min(100vw,480px) * 0.04444 + 2.67px), 24px)}
  .sec-estimate .sec__title:not(.sec__title--sub){font-size:clamp(20px, calc(min(100vw,480px) * 0.03333 + 8px), 24px)}
  .sec06 .sec__title{font-size:clamp(16px, calc(min(100vw,480px) * 0.06667 - 8px), 24px)}
  .linemock .sec__title{font-size:clamp(17px, calc(min(100vw,480px) * 0.05556 - 2.67px), 24px)}
  /* --- 06 ステップ本文の一列化 --- */
  .steps__text{font-size:clamp(11px, calc(min(100vw,480px) * 0.00556 + 9.33px), 12px)}
  .sec08 .sec__title--center{font-size:clamp(16px, calc(min(100vw,480px) * 0.03333 + 4px), 20px)}
  /* --- 08 査定メニュー --- */
  .menu__quote{font-size:clamp(12.5px, calc(min(100vw,480px) * 0.01111 + 8.667px), 14px)}
  .menu__list li{font-size:clamp(9px, calc(min(100vw,480px) * 0.02778 - 0.83px), 12.5px)} /* 最長項目「車検証…（名前・住所は伏せてOK）」31字が1行に収まるサイズ（2026-07-24） */
  /* --- 08 個人情報不要ボックス --- */
  .privacy__text{font-size:clamp(8.5px, calc(min(100vw,480px) * 0.02778 - 1.33px), 12px)}
  /* --- 08 特徴タイル（名前は説明より大きく保つ） --- */
  .feature__name{font-size:clamp(8px, calc(min(100vw,480px) * 0.03889 - 5.67px), 13px)}
  .feature__sub{font-size:clamp(8px, calc(min(100vw,480px) * 0.03333 - 4px), 12px)}
  /* --- 09 FAQ --- */
  /* FAQ見出しは2026-07-25の設問差し替え（最長33文字）で1行化が不可能になったため、
     縮小clampを撤去してベースの14px/19pxに戻し、2行折り返しを許容する。
     1行に収めるには7〜8pxが必要で可読性を損なうため */
  /* --- ご査定の前に: ブランドは5行表示＋横スクロール --- */
  .brands{
    display:grid;grid-auto-flow:column;
    grid-template-rows:repeat(5,auto);grid-auto-columns:max-content;
    gap:8px 10px;margin:8px -20px 0;padding:2px 20px 10px;
    overflow-x:auto;-webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
  }
  .brands li{scroll-snap-align:start}
}

/* ============================================================
   PC版（1000px以上）: 元PDF 1366pt幅デザインをHTMLテキストで再現
   モバイルと同一DOMにレイアウトのみ上書き（座標・サイズはPDF実測値 1pt=1px）
   画像はテキスト再現不可の要素のみ（ヒーロー・ロゴ・番号・写真・LINEモック等）
   ============================================================ */
@media (min-width:1000px){
  .page{max-width:none;width:1366px}
  section{scroll-margin-top:96px}

  /* ---- Header: ロゴ＋テキストナビ＋ハンバーガー ---- */
  .header{height:80px;padding:0 26px 0 44px;border-bottom:none}
  .header__logo img{width:298px}
  .gnav{display:flex;gap:26px;margin-left:auto;margin-right:26px}
  .gnav a{font-family:var(--f-ud);font-size:15px;font-weight:500}
  .header__burger img{width:46px}
  /* 追従CTA: PCはヘッダー内ボタン（stickyヘッダーごと追従）、スマホ下部バーは非表示 */
  .header__cta{
    display:flex;width:auto;min-height:44px;
    font-size:14px;padding:8px 16px;margin-right:20px;
    border-radius:6px;box-shadow:0 2px 0 rgba(0,0,0,.18);
  }
  .header__cta::before{width:6px;height:6px;border-width:1.6px} /* 矢印を約0.8倍に（旧 font-size:16px 相当） */
  .fixed-cta{display:none}

  /* ---- Hero: 全幅ビジュアル画像＋HTMLのCTAボタン（v02） ---- */
  .hero{padding:0;height:620px}
  .hero__main{width:1366px}
  /* v02で「かんたん入力で当日査定」ウィジェットはPCのみ廃止（2026-08-04ユーザー指定）。
     スマホは従来どおり使うのでDOMは残し、PCだけ隠す */
  .widget{display:none}
  /* ボタンとバッジを1つのまとまりとして拡縮する（2026-08-04ユーザー指定）。
     別々にscale(1.03)すると、ボタンは幅348pxで約10.4px、バッジは幅76pxで約2.3pxしか変わらず
     動きの大きさが揃わないため。グループ範囲＝ボタン(x732-1080/y427-492)とバッジ(x1063-1139/y421-497)の外接。
     グループ全体が拡縮するのでバッジは中心から外側へ少し移動するが、ボタンの右端も同率で動くため
     2つの位置関係は保たれる。この動きに追従させるため、ヒーロー画像側からはバッジを消してある */
  .hero__cta-group{
    display:block;position:absolute;left:732px;top:421px;width:407px;height:76px;
    animation:btn-pulse 2s ease-in-out infinite;
  }
  /* CTAボタン: PDF実測 x732/y427・348×65・角丸なし・影なし（グループ内では left:0/top:6）。中身は左から
     アイコン39×50（x748-786）→ 矢印9×16（x796-804）→ テキスト（x820-1053・幅234）。
     間隔は回転後の見た目で合わせているため margin は実測レンダリング結果からの逆算値 */
  .hero__cta{
    display:flex;position:absolute;left:0;top:6px;
    width:348px;height:65px;min-height:0;
    animation:none; /* 拡縮はグループ側で行う。ここでも動かすと二重にかかる */
    padding:0 0 2px 16px;gap:0;justify-content:flex-start;
    border-radius:0;box-shadow:none;z-index:1;
    /* palt（プロポーショナルメトリクス）はPDFの約物詰めを再現するため。無いと（LINE）が全角送りになり
       文字列が約20px伸びる。font-sizeはこの状態で実測幅234pxに合わせた値 */
    font-size:19.5px;font-feature-settings:"palt" 1;
  }
  .hero__cta-icon{order:-1;flex:none;width:39px;height:50px;margin-right:5px}
  /* 矢印はPDF実測9×16。45度回転で描くので対角が高さになる。ベースの8px角より大きい10px角＋1.95px罫、
     translateYはこのボタンでは不要（padding-bottomで既に1px上げているため） */
  .hero__cta::before{
    width:10px;height:10px;border-top-width:1.95px;border-right-width:1.95px;
    margin-right:16.1px;transform:rotate(45deg);
  }
  /* バッジ（PDF実測 x1063/y421・76×76 → グループ内では left:331/top:0）。
     デザインではボタンの右端17pxに重なるので、ボタンより上のz-indexに置く。
     拡縮はグループ側なので、ここには animation を持たせない */
  .hero__badge{
    display:block;position:absolute;left:331px;top:0;width:76px;height:76px;z-index:2;
    border-radius:50%;overflow:hidden; /* 光沢を丸の中だけに収める */
  }
  .hero__badge img{display:block;width:100%;height:100%}
  /* 光沢はボタンとバッジで別要素になるため、%基準の btn-shine では位置が揃わない。
     px基準の hero-shine に差し替え、開始位置(left)だけを各要素の左端からのオフセットにすることで
     どの時点でもページ上の同じx座標を通る＝1本の光が両方を横切って見える。
     バッジのオフセット差 -331px = バッジ左端1063 − ボタン左端732 */
  .hero__cta::after{left:-278.4px;width:191.4px;animation:hero-shine 3.2s ease infinite}
  .hero__badge::after{
    content:"";position:absolute;top:0;left:-609.4px;width:191.4px;height:100%;
    background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);
    animation:hero-shine 3.2s ease infinite;
  }
  /* 移動量748.2px＝旧btn-shineの -80%→135%（ボタン幅348px換算）と同じ。傾きも同じ-20度 */
  @keyframes hero-shine{
    0%,55%{transform:translateX(0) skewX(-20deg)}
    100%{transform:translateX(748.2px) skewX(-20deg)}
  }
  @media (prefers-reduced-motion:reduce){
    .hero__cta-group{animation:none}
    .hero__badge::after{content:none}
  }
  /* 画像に焼き込まれた「かんたん査定の流れを見る」の当たり判定（PDF実測 x737-957/y555-571） */
  .hero__flow{display:block;position:absolute;left:732px;top:549px;width:230px;height:29px;z-index:1}

  /* ---- 20年帯（PDF実測: 盾 111×125.5px、テキスト 573.5×88px、間隔16.5px） ---- */
  .band20{padding:46px 20px}

  /* ---- 共通: コンテンツ幅1118（x124-1242）・番号ブロック左上 ---- */
  .sec{padding:44px 124px 70px;position:relative}
  .sec__num{position:absolute;left:124px;top:44px}
  .sec__num-fig{height:95.5px} /* PDF: 数字インク高 */
  .sec__num-label{font-size:23.1px;line-height:1.25;margin-top:15px} /* PDF: ラベル幅138.5px(6字)・数字下端からインク12.5px */
  .sec__title{font-size:36px;line-height:1.45;margin:0 0 20px 200px}
  .sec__lead{font-size:16px;line-height:1.75;margin:0 0 34px 200px}
  .sec__note{font-size:12px}

  /* ---- 01 動画: 左=見出し＋リード／右=動画（PDF座標で固定配置） ---- */
  /* 動画枠は絶対配置(top130+高340=下端470)で高さに寄与しないため min-height で確保。
     470＋padding-bottom56＝526px。PDFの715pxはキャプション・説明文があった時の値で、
     2026-07-25にそれらを削除したため詰めた */
  .sec01{min-height:526px;padding:32px 124px 56px}
  .sec01 .sec__num{top:32px}
  .sec01__heading{margin-top:208px;width:485px}
  .sec01 .sec__lead{margin:22px 0 0;width:500px;font-size:13px}
  .video{position:absolute;left:660px;top:130px;width:590px} /* 高さは aspect-ratio 590/340 で340px */

  /* ---- 02 不満: 中央揃え・カード540px・黄マーカー見出し ---- */
  .br-pc{display:inline}
  .br-sp{display:none}
  .sec02{text-align:center;padding-bottom:130px}
  .sec02 .sec__title{margin-left:0}
  .sec02 .sec__lead{margin:0 0 34px 289px;text-align:left} /* PDF: リード左端412(=124+289)=リスト左端に揃う。幅は制限しない */
  /* 不満リストはPC原寸540×270。PDF実測: 文字18.6pt、行左端61px（行3のみ52px）、行中心y=27/94/173/244 */
  .worry{width:540px;height:270px;padding-top:0;margin:0 auto 26px;text-align:left}
  .worry__item{left:61px;font-size:18.6px}
  .worry__item:nth-child(1){top:27px}
  .worry__item:nth-child(2){top:94px}
  .worry__item:nth-child(3){top:173px;left:52px}
  .worry__item:nth-child(4){top:244px}
  .solve{margin:50px 0 0;font-size:34px;padding:0}

  /* ---- 03 タイル: 4列 ---- */
  .tiles{grid-template-columns:repeat(4,1fr);gap:20px}
  .tile__name{font-size:14px}
  .tile__up{font-size:10px;padding:2px 7px;margin-top:2px}
  .tile__sub{font-size:11px}

  /* ---- 見積書 ---- */
  .sec-estimate .sec__title,.sec-estimate .sec__lead{margin-left:0}
  /* Noto代替でPDF(36pt・描画幅約1030pt)より広く出るため実測合わせ */
  .sec-estimate .sec__title{font-size:33.5px}
  /* 04: PDF実測合わせ（タイトル描画幅792pt・リードはPDF同様2行に収める） */
  .sec04 .sec__title{font-size:34.5px}
  .sec04 .sec__lead{font-size:14.5px}
  .estimate{border-radius:16px;margin-bottom:0}
  .estimate__head{flex-direction:row;justify-content:space-between;align-items:center;padding:22px 30px}
  .estimate__title{font-size:25px}
  .estimate__meta{font-size:13px}
  .estimate__sheet{margin:0;padding:28px 30px;border-radius:0}
  .estimate__cap{font-size:16px}
  .carinfo{display:grid;grid-template-columns:1fr 1fr;column-gap:44px}
  .carinfo__row dt,.carinfo__row dd{font-size:13px}
  .detail{font-size:13px}
  .totals__row{font-size:13px}
  .prices{flex-direction:row;gap:22px;margin-top:24px}
  .prices__box{flex:1;padding:26px 20px}
  .prices__up{font-size:20px}
  .prices__label{font-size:14px}
  .prices__value{font-size:24px}
  .prices__note{font-size:12px}
  .notes li{font-size:12px}
  .sec__title--sub{margin-top:64px}
  .brands{gap:14px}
  .brands li{font-size:15px;padding:10px 22px}

  /* ---- 04 比較表 ---- */
  .compare-wrap{margin:0;padding:0;overflow:visible}
  .compare{min-width:0;table-layout:auto;font-size:14px}
  .compare thead th{font-size:17px;padding:16px 8px}
  .compare thead th:first-child{width:auto}
  .compare th,.compare td{padding:13px 10px}
  .compare tbody th{font-size:14px;min-width:220px;padding-left:14px}
  .compare .mark{font-size:21px}

  /* ---- 05 理由 ---- */
  /* PDF実測: バッジ円Ø103(x124-227)・タイトル左端253.7・見出し36ptは描画幅合わせで34.5px */
  .sec05 .sec__title{font-size:34.5px}
  .sec05 .sec__lead{margin-bottom:56px} /* リード〜根拠の余白（ユーザー調整） */
  .reason{gap:27px;margin-bottom:44px}
  .reason__badge{width:103px;height:103px;font-size:26px}
  .reason__badge span{font-size:21px}
  .reason__title{font-size:34.5px;line-height:1.3;margin-bottom:12px}
  .reason__body p{font-size:16px;line-height:1.75}
  .routes{flex-direction:row;gap:16px}
  .routes__card{flex:1;padding:26px 22px 22px}
  .routes__card h3{font-size:21px;margin-bottom:12px}
  .routes__card p{font-size:12px}

  /* ---- 06 流れ: ステップ5列横並び・矢印は右向き ---- */
  .sec06{background:#fff;padding-bottom:0}
  .sec06 .sec__lead{margin-bottom:66px} /* PDF実測: リード下端y6978〜カード上端y7045 */
  .steps{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-bottom:34px}
  .steps__item{margin-bottom:0;padding:18px 15px 16px}
  .steps__item:not(:last-child)::after{
    left:auto;right:-27px;bottom:auto;top:50%;
    transform:translateY(-50%); /* 右向きチェブロン（回転なし） */
    width:36px;height:36px;background-size:9px 15px;
  }
  .steps__badge{font-size:13px;padding:4px 14px;top:-13px;right:20px}
  .steps__name{font-size:15.5px}
  .steps__text{font-size:12px}
  .steps__note{font-size:16px;margin-bottom:48px}
  .linemock{margin:0 -124px;padding:56px 124px 72px}
  .linemock .sec__title{margin-left:0}
  /* 1枚構成のため幅指定は不要（.linemockの内側1118px＝1366−左右padding124px×2 に合わせて100%）。
     端末1台あたり330pxとなり、3枚構成時の325pxとほぼ同じ大きさになる */
  .linemock__row{margin-top:40px}

  /* ---- 07 事例: カード3列 ---- */
  .cases{display:grid;grid-template-columns:repeat(3,1fr);gap:21px}
  .case__voice{font-size:15px}
  .case__price{justify-content:flex-end;padding-right:18px}
  .sec07 .sec__note{margin-top:18px}

  /* ---- 08 査定メニュー ---- */
  /* PDF実測: カード見出し36pt左揃え(インセット24)・引用19pt Medium・タグ20pt丸ピル */
  .sec08 .sec__title{font-size:34.5px;font-weight:700}
  .menus{flex-direction:row;gap:38px;margin-bottom:24px}
  .menu{flex:1;padding:42px 26px 30px;margin-top:16px}
  .menu__tag{font-size:20px;padding:6px 28px}
  .menu__name{font-size:34.5px}
  .menu__quote{font-size:19px;margin-bottom:22px}
  .menu__list li{font-size:15.5px} /* 最長項目が1行に収まるサイズ（2026-07-24ユーザー指定） */
  /* PDF: 36pt・x123から1行（Noto幅補正で32.5px）。直後のリードも左端揃え */
  .sec08 .sec__title--center{font-size:32.5px;margin:64px 0 22px;line-height:1.45}
  .sec08 .sec__title--center br{display:none}
  .sec08 .sec__title--center + .sec__lead{margin-left:0}
  /* PDF: クリームのピル帯にラベル大＋太字2行を横並び */
  .privacy{
    display:flex;align-items:center;justify-content:center;gap:30px;
    margin:0 0 44px;padding:20px 40px;text-align:left;
  }
  .privacy__title{font-size:26px;margin:0}
  .privacy__text{font-size:16px;line-height:1.6}
  .features{grid-template-columns:repeat(3,1fr);gap:20px}
  .feature{display:grid;grid-template-columns:44px 1fr;column-gap:9px;align-items:start;padding:20px 18px}
  .feature__check{grid-row:1/3;width:44px;height:44px;margin:0}
  .feature__name{font-size:18px;margin-bottom:6px}
  .feature__sub{font-size:12px}

  /* ---- 09 FAQ: PDFの行デザイン（幅1118/高83/角丸18/黒枠1px/ピッチ106.6） ---- */
  .sec09{background:var(--bg-gray)}
  .sec09 .sec__num{position:static;margin-bottom:38px}
  .faq{padding-top:0}
  .faq__item{margin-bottom:23px}
  .faq__q button{
    min-height:83px;border:1px solid var(--black);border-radius:18px;
    font-size:20px;gap:22px;padding:15px 90px 15px 31px;
  }
  .faq__mark{font-size:26px}
  .faq__plus{right:30px;width:28px;height:28px}
  .faq__plus::before{width:28px;height:3px}
  .faq__plus::after{width:3px;height:28px}
  .faq__a{font-size:15px;padding:16px 78px 4px}

  /* ---- 最終CTA: 全体ビジュアルを背景に、テキスト＋ボタン中央 ---- */
  /* PDF実測: セクション=y12058〜12655(597px)。コピーはスマホ右のエリアに配置
     タイトルL1左端=727/L2左端=552.6、本文中央=x899、ボタン=x720.5〜1054(334×62) */
  .cta{
    padding:102px 124px 184px;
    background:#E6C520 url(../img/photo/cta-bg.webp?v=2) no-repeat center bottom;
    background-size:1366px auto; /* 1365×509を下端合わせ・上部は地色 */
  }
  .cta__copy{width:748px;margin-left:428px} /* 左端=124+428=552(=L2左端) */
  .cta__title{font-size:44px;line-height:1.35;margin-bottom:16px;text-align:left}
  .cta__title span{white-space:nowrap}
  .cta__title-l1{padding-left:174px} /* L1左端=552+174=726 */
  .cta__text{font-size:18px;line-height:1.55;margin-bottom:30px;margin-right:55px} /* 中央=899 */
  .cta__btn{width:334px;max-width:none;margin:0 0 0 168px;min-height:62px;font-size:19px} /* 左端=720 */
  .cta__person{display:none}

  /* ---- Footer: 4カラム（PDF実測。フッター上端=12566.5pt を原点とした相対値） ---- */
  .footer{
    display:grid;column-gap:0;row-gap:0;
    grid-template-columns:321px 301px 299px 1fr; /* 列開始=82/403/704/1003px（PDFの各列テキスト左端） */
    grid-template-rows:74px auto auto; /* 1行目=74px固定。b3/navの縦長に引きずられず「古物営業法」見出しをPDF位置(155.5px)に置く */
    grid-template-areas:"logo nav b1 b3" "logo nav b2 b3" "copy copy copy copy";
    align-content:start;align-items:start;
    padding:77.5px 84px 39px 82px; /* 左右はPDFのロゴ左端82px／本文右端1282.5pxに一致（コピーライトの中央=683pxもこれで揃う）。全高432.5px */
    /* PDF: 列間の縦罫線3本。x=382/683/982px、上端72px・高さ240px、#B3B3B3・幅1px */
    background-image:
      linear-gradient(var(--gray-label),var(--gray-label)),
      linear-gradient(var(--gray-label),var(--gray-label)),
      linear-gradient(var(--gray-label),var(--gray-label));
    background-repeat:no-repeat;
    background-size:1px 240px;
    background-origin:border-box;
    background-position:382px 73px, 683px 73px, 982px 73px;
  }
  .footer__logo{grid-area:logo;width:270px;margin:98px 0 0} /* PDF: ロゴインク x82..350 / y176..208.5px（画像は左右1pxずつ透明） */
  .footer__nav{grid-area:nav;border-bottom:0;margin:-2px 0 0}
  .footer__nav ul{display:block;margin:0}
  .footer__nav a{font-size:12px;padding:0;line-height:24.2px} /* PDF: 行ピッチ24.2px（色はベース側で共通指定） */
  .footer__block{margin:0}
  .footer__block:nth-of-type(1){grid-area:b1}
  .footer__block:nth-of-type(2){grid-area:b2}
  .footer__block:nth-of-type(3){grid-area:b3}
  .footer__block h3{font-size:15px;line-height:22px;margin-bottom:4px}
  .footer__block p{font-size:12px;line-height:21px} /* PDF: 本文行ピッチ21px */
  .footer__block:nth-of-type(2) h3{margin-bottom:6px}  /* PDF: 古物営業法の見出し下だけ少し広い */
  .footer__block:nth-of-type(3) p{line-height:22.2px}  /* PDF: お問い合わせ列だけ行送りが広い */
  /* 社名はPDFで見出しと同サイズ。太さ・色はベース側で共通指定 */
  .footer__block .footer__company{font-size:15px;line-height:22px;margin:9.5px 0 4px}
  .footer__copy{grid-area:copy;margin-top:82px;font-size:12px;border-top:0;padding-top:0} /* PDF: インク y377.5..388px */
}