/* LPラフv2 共通CSS（案1〜3で共有）。⛔公開用ではない（ラフ）。
   文字組み：本文16.5px・行間1.95・字間0.05em・palt／見出し 明朝・字間0.04em以下／本文色 #1a1a1a／押せるものは44px以上
   改行：build.py の P() が文節ごとに <span class="k"> で包む＝語の途中では折れない */
:root{
  --paper:#FCFCFC; --sand:#F0ECE4; --ink:#1A1A1A; --sub:#4A4A4A; --rule:#D9D4C8;
  --green:#2F4A3A; --green-d:#243A2D;
  --serif:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  --sans:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16.5px;line-height:1.95;
  letter-spacing:.05em;font-feature-settings:"palt";font-kerning:normal;overflow-wrap:break-word;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
p{margin:0}
.k{display:inline-block;white-space:nowrap}
.blk{display:block}
.wrap{padding:0 24px;max-width:816px;margin:0 auto}
.narrow{padding:0 24px;max-width:720px;margin:0 auto}

/* 見出し（明朝・字間は広げない） */
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:.04em;line-height:1.55;margin:0;color:var(--ink)}
h2{font-size:23px}
h3{font-size:20px}

/* ヘッダー */
.hd{background:var(--paper);border-bottom:1px solid var(--rule)}
.hd .wrap{min-height:56px;display:flex;align-items:center}
.logo{text-decoration:none;display:flex;flex-direction:column;justify-content:center;min-height:48px;line-height:1.5}
.logo .l1{font-family:var(--serif);font-size:15px;letter-spacing:.04em}
.logo .l2{font-size:14px;color:var(--sub);letter-spacing:.04em}

/* ボタン（予約＝深い緑だけ・44px以上） */
.btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 24px;background:var(--green);color:#fff;
  text-decoration:none;font-size:17px;font-weight:500;letter-spacing:.06em;border-radius:2px}
.btn .arr{width:9px;height:9px;border-top:2px solid #fff;border-right:2px solid #fff;transform:rotate(45deg);margin-left:2px}
.btn-note{display:block;margin-top:10px;font-size:14px;line-height:1.7;color:var(--sub);letter-spacing:.04em}
.line-btn{display:flex;align-items:center;justify-content:center;min-height:52px;padding:0 20px;margin-top:22px;border:1px solid currentColor;
  text-decoration:none;font-size:16px;letter-spacing:.05em;border-radius:2px}
.line-note{margin-top:10px;font-size:14px;line-height:1.7;letter-spacing:.04em}
.cta-block{margin-top:44px}
.cta-block .pre{margin-bottom:16px}

/* 最初の画面 */
.hero .pic{height:372px;overflow:hidden;background:var(--sand)}
.hero .pic img{width:100%;height:100%;object-fit:cover;object-position:30% 50%}
.hero .in{padding:30px 24px 40px;max-width:816px;margin:0 auto}
.hero h1{font-size:40px;line-height:1.4;letter-spacing:.04em}
.hero .sub{margin-top:18px;font-size:16.5px;line-height:1.95}
.hero .btn{margin-top:26px}

/* 区切り共通 */
.sec{padding:76px 0 80px}
.sec.alt{background:var(--sand)}
.sec h2{margin-bottom:22px}
.lead{margin-bottom:8px}

/* ② 星のや型：写真→明朝見出し1行→本文2〜3行 */
.scene{margin-top:56px}
.scene .ph{margin:0}
.scene .ph img{width:100%;aspect-ratio:4/3;object-fit:cover}
.scene h3{margin-top:22px}
.scene p.t{margin-top:10px}
.sec .scenes{margin-top:8px}
.sec.s2 .wrap{max-width:816px}

/* ③ */
.reasons{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid var(--rule)}
.reasons li{padding:20px 0;border-bottom:1px solid var(--rule)}
.reasons b{display:block;font-family:var(--serif);font-weight:500;font-size:18px;letter-spacing:.04em;line-height:1.6}
.reasons span.d{display:block;margin-top:6px}
.story{margin-top:36px;padding:22px 20px;background:var(--sand);border-radius:2px}
.story b{display:block;font-family:var(--serif);font-weight:500;font-size:18px;letter-spacing:.04em}
.tbd{display:inline-block;padding:2px 8px;background:#fff;border:1px solid #8a8577;color:#333;font-size:14px;line-height:1.7;letter-spacing:.03em;border-radius:2px}
.tbd-line{margin-top:8px}

/* ③ Day表記（オートバーン型：「Day N｜出発地 → 着地」＋縦の細線） */
.days{margin-top:56px}
.days .eyebrow{font-size:14px;color:var(--sub);letter-spacing:.06em;margin-bottom:6px}
.day{margin-top:44px;padding-left:20px;border-left:1px solid var(--green);position:relative}
.day::before{content:"";position:absolute;left:-5px;top:7px;width:9px;height:9px;border-radius:50%;background:var(--green)}
.day .ph img{width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:16px}
.day h3{font-size:19px;line-height:1.6}
.day h3 .n{color:var(--green);font-weight:500;margin-right:2px}
.day h3 .bar{color:#9a9588;margin:0 4px;font-weight:400}
.day p.t{margin-top:8px}

/* ③ 実形地図（案2） */
.mapbox{margin-top:48px}
.map{position:relative;width:100%;aspect-ratio:1311/1279;background:#FAF9F5;border:1px solid var(--rule);overflow:hidden}
.map img.base{position:absolute;inset:0;width:100%;height:100%}
.map svg{position:absolute;inset:0;width:100%;height:100%}
.map .dot{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#fff;border:3px solid var(--green)}
.map .dot.start{width:18px;height:18px;margin:-9px 0 0 -9px;background:var(--green);border-color:#fff;box-shadow:0 0 0 2px var(--green)}
.map .tag{position:absolute;transform:translateY(-50%);margin-left:16px;padding:3px 9px;background:#fff;border:1px solid var(--green);color:var(--green-d);
  font-size:14.5px;line-height:1.5;letter-spacing:.04em;white-space:nowrap;font-weight:500}
.map .tag.start{background:var(--green);color:#fff}
.map .tag.l{transform:translate(-100%,-50%);margin-left:-16px}
.map-src{margin-top:10px;font-size:14px;line-height:1.75;color:var(--sub);letter-spacing:.03em}
.dests{margin-top:30px;border-top:1px solid var(--rule)}
.dest{display:grid;grid-template-columns:5.6em 1fr;align-items:baseline;gap:8px;padding:14px 0;border-bottom:1px solid var(--rule)}
.dest b{font-family:var(--serif);font-weight:500;font-size:18px}
.route-line{margin-top:26px}

/* ④ 車 */
.carline{margin-top:18px;font-family:var(--serif);font-size:19px;letter-spacing:.04em;line-height:1.6}
.carline b{font-weight:500}
.car .main{margin-top:26px}
.car .main img{width:100%;aspect-ratio:4/3;object-fit:cover}
.car .inside{display:grid;grid-template-columns:1fr;gap:22px;margin-top:26px}
.car .inside img{width:100%;aspect-ratio:4/3;object-fit:cover}
.car .inside figcaption{margin-top:8px;font-size:15px;letter-spacing:.05em}
.car figure{margin:0}
.spec{width:100%;border-collapse:collapse;margin-top:34px}
.spec th,.spec td{text-align:left;vertical-align:top;padding:14px 0;border-bottom:1px solid var(--rule);font-weight:400;font-size:16px;line-height:1.8}
.spec th{width:7.5em;color:var(--sub);font-size:15px;padding-right:12px;white-space:nowrap}
.equip{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.equip span{padding:4px 12px;border:1px solid #8a8577;font-size:15px;line-height:1.7;border-radius:2px;letter-spacing:.04em}
.src{margin-top:14px;font-size:14px;line-height:1.8;color:var(--sub);letter-spacing:.03em}

/* ⑤ 写真 */
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:20px 12px;margin-top:28px}
.gallery figure{margin:0}
.gallery img{width:100%;aspect-ratio:1/1;object-fit:cover}
.gallery figcaption{margin-top:6px;font-size:14px;line-height:1.6;color:var(--sub);letter-spacing:.03em}
.ig-note{margin-top:22px;font-size:15px;line-height:1.85}

/* ⑥ 流れ */
.flow{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid var(--rule)}
.flow li{display:flex;gap:18px;padding:20px 0;border-bottom:1px solid var(--rule)}
.flow .n{font-family:var(--serif);font-size:20px;color:var(--green);min-width:2em;line-height:1.5}
.flow b{display:block;font-family:var(--serif);font-weight:500;font-size:18px;line-height:1.6;letter-spacing:.04em}
.flow p{margin-top:2px}

/* ⑦ FAQ */
.faq{margin-top:26px;border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;min-height:56px;padding:16px 36px 16px 0;position:relative;font-family:var(--serif);font-size:17.5px;line-height:1.65;letter-spacing:.04em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:25px;width:9px;height:9px;border-right:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(45deg)}
.faq details[open] summary::after{transform:rotate(-135deg);top:30px}
.faq .a{padding:0 0 20px}

/* ⑧ */
.about .ph img{width:100%;aspect-ratio:4/3;object-fit:cover;margin-top:26px}
.about p{margin-top:16px}
.about .local{margin-top:22px;padding-top:18px;border-top:1px solid var(--rule);font-size:15.5px}

/* ⑨ */
.final{position:relative;color:#fff;overflow:hidden;background:#1d2420}
.final .bg{position:absolute;inset:0}
.final .bg img{width:100%;height:100%;object-fit:cover}
.final .scrim{position:absolute;inset:0;background:linear-gradient(rgba(14,20,17,.62),rgba(14,20,17,.78))}
.final .in{position:relative;padding:88px 24px 92px;max-width:720px;margin:0 auto}
.final h2{color:#fff;font-size:27px}
.final p.l{margin-top:14px}
.final .btn{margin-top:30px;background:#fff;color:var(--green-d)}
.final .btn .arr{border-color:var(--green-d)}
.final .btn-note,.final .line-note{color:#E8E8E8}
.final .line-btn{color:#fff;border-color:#fff}

.ft{padding:36px 0 110px;background:var(--paper);font-size:14.5px;line-height:1.85;color:var(--sub);letter-spacing:.04em}
.ft .fl{font-family:var(--serif);font-size:17px;color:var(--ink);margin-bottom:6px}
.ft p+p{margin-top:2px}
.ft .note{margin-top:10px}

.sp-bar{position:fixed;left:0;right:0;bottom:0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(252,252,252,.96);border-top:1px solid var(--rule);display:none}
.sp-bar.on{display:block}
.sp-bar a{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;background:var(--green);color:#fff;text-decoration:none;font-size:16px;letter-spacing:.06em;border-radius:2px}
.sp-bar a .arr{width:8px;height:8px;border-top:2px solid #fff;border-right:2px solid #fff;transform:rotate(45deg)}

/* 案3：役割の小ラベル（アマネム型＝写真1枚につき1つの役割） */
.role{display:block;margin:0 0 10px;font-size:14px;line-height:1.5;color:var(--sub);letter-spacing:.08em}
.role::before{content:"";display:inline-block;width:18px;height:1px;background:var(--sub);vertical-align:middle;margin-right:8px}

/* 本番（公開前確認用）：⑤ お客様の写真の空き枠（AI画像は置かない） */
.gallery .slot{width:100%;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;padding:14px;text-align:center;background:#fff;border:1px dashed #8a8577}
.gallery .slot span{font-size:14px;line-height:1.7;color:#333;letter-spacing:.04em}

@media (min-width:768px){
  body{font-size:17px}
  h2{font-size:32px}
  h3{font-size:24px}
  .hero .pic{height:400px}
  .hero .in{padding:36px 24px 64px}
  .hero h1{font-size:52px}
  .hero h1 .blk{display:inline}
  .hero .sub{font-size:18px}
  .hero .btn{max-width:420px}
  .btn{max-width:420px}
  .sec{padding:112px 0 116px}
  .scene .ph img,.car .main img,.about .ph img{aspect-ratio:16/9}
  .day .ph img{aspect-ratio:16/9}
  .car .inside{grid-template-columns:1fr 1fr;gap:16px}
  .car .inside img{aspect-ratio:4/3}
  .gallery{grid-template-columns:1fr 1fr 1fr}
  .final h2{font-size:38px}
  .sp-bar{display:none !important}
  .map{max-width:640px}
}
