:root{
  --ink:#241409;
  --ink-2:#1c0f07;
  --dark:#26160c;
  --dark-2:#2f1d10;
  --cream:#f8f3ea;
  --cream-2:#fdfaf4;
  --paper:#f4ecdd;
  --red:#c2401d;
  --red-deep:#a83618;
  --gold:#c9a06a;
  --gold-soft:#e5cfa8;
  --tan:#8a7357;
  --line-green:#06C755;
  --serif:"Shippori Mincho","Hiragino Mincho ProN",serif;
  --sans:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--cream);line-height:1.8;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}

/* ---------- stamp ---------- */
.stamp{position:absolute;pointer-events:none}
.stamp svg{width:100%;height:100%;display:block}

/* ---------- shared design assets ---------- */
/* 吹き出しキッカー: 単色塗りつぶしのピル＋下向きしっぽ */
.maru-wrap{text-align:center;margin-bottom:22px}
.maru{position:relative;display:inline-block;background:var(--red);color:#fff;font-weight:700;font-size:14px;letter-spacing:.1em;padding:9px 24px;border-radius:999px}
.maru::after{content:"";position:absolute;left:50%;bottom:-7px;transform:translateX(-50%);border:8px solid transparent;border-top:9px solid var(--red);border-bottom:0}
/* マーカー強調: 朱の下線（ヒーロー見出しの.accentと同系統） */
.marker{position:relative;padding:0 1px 4px;white-space:nowrap}
.marker::after{content:"";position:absolute;left:1px;right:1px;bottom:0;height:3px;background:#ff5a30;border-radius:2px}
/* 結果チップ: 差額→得られる体験を矢印で示す */
.reward{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;background:#fdf6ec;border:1.5px dashed #dcbf92;border-radius:999px;padding:7px 14px;font-size:11.5px;font-weight:700;color:var(--red-deep);letter-spacing:.02em}
.reward .arw{color:var(--gold);font-family:var(--serif);font-weight:700;font-size:14px;flex:0 0 auto}
.reward .pre{font-weight:600;color:var(--tan);flex:0 0 auto;font-size:11px}

/* ---------- hero ---------- */
.hero{position:relative;color:var(--cream);overflow:hidden;background:#1a0f08}
.hero::before{content:"";position:absolute;inset:0;background:url("images/hero.jpg") center/cover no-repeat;opacity:.85}
.hero::after{content:"";position:absolute;inset:0;background:
  linear-gradient(100deg,rgba(20,10,4,.92) 0%,rgba(24,12,5,.72) 42%,rgba(26,13,5,.35) 75%,rgba(30,16,6,.55) 100%),
  linear-gradient(to bottom,rgba(18,9,3,.55) 0%,rgba(18,9,3,0) 30%,rgba(16,8,3,.6) 100%)}
.hero>.wrap{position:relative;z-index:2}
.header{display:flex;align-items:center;padding:26px 0 0}
.logo{display:flex;align-items:center;gap:12px}
.logo-mark{width:44px;height:44px;flex:0 0 auto}
.logo-text .en{font-family:var(--serif);font-weight:700;font-size:21px;letter-spacing:.34em;line-height:1.1}
.logo-text .ja{font-size:10px;letter-spacing:.52em;color:var(--gold-soft);margin-top:3px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;grid-template-areas:"copy visual" "ctas visual";gap:0 48px;align-items:center;padding:64px 0 30px}
.hero-copy{grid-area:copy;align-self:end}
.hero-ctas{grid-area:ctas;align-self:start}
.hero-copy h1{font-family:var(--serif);font-weight:700;font-size:clamp(30px,4vw,46px);line-height:1.6;letter-spacing:.05em}
.hero-copy h1 .accent{color:inherit;position:relative;padding:0 2px 6px}
.hero-copy h1 .accent::after{content:"";position:absolute;left:2px;right:2px;bottom:-2px;height:3px;background:#ff5a30;border-radius:2px}
.hero-lead{margin-top:26px;font-size:15.5px;color:#efe4d2;letter-spacing:.05em}
.hero-sub{margin-top:22px;font-size:13px;color:#c9b79c;letter-spacing:.08em}
.hero-sub strong{color:#e9dcc4;font-weight:600}
/* ---------- iPhone mockup (hero visual) ---------- */
.hero-visual{grid-area:visual;justify-self:center;position:relative;z-index:2;perspective:1400px}
/* 原案の完全体プロポーションのまま、ベゼルだけ11px→5pxに細く */
.phone{position:relative;width:322px;background:linear-gradient(155deg,#5c5c68 0%,#38383f 38%,#232328 70%,#141417 100%);border-radius:46px;padding:5px;box-shadow:0 30px 70px rgba(0,0,0,.6),0 0 0 1.5px rgba(255,255,255,.22),inset 0 1px 1px rgba(255,255,255,.3),inset 0 -1.5px 2px rgba(0,0,0,.5);font-family:-apple-system,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;transform-style:preserve-3d;transition:transform .4s ease}
.phone .screen{position:relative;background:#101014;border-radius:41px;overflow:hidden;color:#e8e8e8}
.phone .home-bar{width:96px;height:4px;border-radius:2px;background:rgba(255,255,255,.42);margin:2px auto 9px}
.phone .notch{position:absolute;top:6px;left:50%;transform:translateX(-50%);width:118px;height:26px;background:#0d0d0f;border-radius:0 0 16px 16px;z-index:5}
.phone .statusbar{display:flex;align-items:center;justify-content:space-between;padding:12px 22px 6px;font-size:13px;font-weight:600;color:#fff}
.phone .statusbar .icons{display:flex;align-items:center;gap:5px}
.phone .statusbar .icons svg{height:12px;width:auto;display:block}
.phone .ln-topbar{display:flex;align-items:center;gap:8px;padding:6px 14px 12px;color:#ededed}
.phone .ln-topbar .back{font-size:20px;color:#cfcfcf;line-height:1}
.phone .ln-topbar .shield{width:19px;height:19px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.phone .ln-topbar .shield svg{width:19px;height:19px}
.phone .ln-topbar .name{font-size:15px;font-weight:700;white-space:nowrap}
.phone .ln-topbar .tools{margin-left:auto;display:flex;gap:13px;color:#cfcfcf}
.phone .ln-topbar .tools svg{width:17px;height:17px;display:block}
.phone .ln-chat{padding:8px 10px 16px}
.phone .ln-sender-head{display:flex;align-items:center;gap:8px;margin-bottom:9px;padding:0 3px}
.phone .ln-avatar{width:28px;height:28px;border-radius:8px;background:#c2401d;flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.phone .ln-avatar svg{width:22px;height:22px}
/* LINE notification bubble (line-preview.html移植・.phone配下にスコープ) */
.phone .bubble{width:100%;border-radius:16px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.4);background:#fff}
.phone .bub-header{background:#06C755;color:#fff;font-size:12px;font-weight:700;padding:9px 14px}
.phone .bub-body{background:#FBF5EA;padding:15px 15px 13px}
.phone .ln-mini{text-align:center;font-size:11px;color:#b06a3a;font-weight:700}
.phone .ln-head{text-align:center;margin-top:6px;line-height:1.35;color:#241409;font-weight:700}
.phone .ln-head .l1{font-size:16px}
.phone .ln-head .big{font-size:29px;color:#d6491e;letter-spacing:-.01em}
.phone .ln-head .l2{font-size:16px}
.phone .ln-head .l3{font-size:15px}
.phone .ln-hotel{display:block;text-align:center;margin-top:12px;padding-top:12px;border-top:1px solid #ecdfc8}
.phone .ln-hotel .site{display:inline-block;font-size:10px;font-weight:700;color:#0C447C;background:#E6F1FB;border-radius:999px;padding:2px 9px}
.phone .ln-hotel h3{font-size:14px;font-weight:700;color:#241409;margin-top:6px;line-height:1.4}
.phone .ln-hotel .plan{font-size:11px;color:#8A7C6B;margin-top:3px}
.phone .ln-cmp{margin-top:13px;background:#fff;border:1px solid #ecdfc8;border-radius:11px;padding:12px;display:flex;align-items:center;gap:8px}
.phone .ln-cmp .col{flex:1;text-align:center}
.phone .ln-cmp .lbl{font-size:10px;color:#8A7C6B;font-weight:600}
.phone .ln-cmp .lbl.new{color:#c2401d}
.phone .ln-cmp .yen{font-size:17px;font-weight:800;color:#3a2b1a;margin-top:3px}
.phone .ln-cmp .yen.new{color:#d6491e}
.phone .ln-cmp .arrow{color:#c9ab7c;font-size:17px;font-weight:700;flex:0 0 auto}
.phone .ln-diff{display:flex;align-items:center;gap:9px;margin-top:12px;padding:10px 13px;background:#fbe9df;border-radius:10px}
.phone .ln-diff .chip{background:#c2401d;color:#fff;font-size:11px;font-weight:700;border-radius:6px;padding:3px 9px}
.phone .ln-diff .amt{font-size:19px;font-weight:800;color:#c2401d}
.phone .ln-diff .otoku{font-size:12px;font-weight:700;color:#c2401d}
.phone .ln-note{font-size:10px;color:#a89880;margin-top:11px;text-align:center}
.phone .bub-foot{background:#FBF5EA;padding:0 15px 15px}
.phone .ln-btn{display:block;background:#d6491e;color:#fff;text-align:center;font-size:14px;font-weight:700;padding:12px;border-radius:10px}
/* hero ctas */
.hero-ctas{display:grid;grid-template-columns:1fr;max-width:400px;gap:20px;margin-top:34px;position:relative;z-index:2}
.btn{display:flex;align-items:center;justify-content:center;gap:12px;border-radius:999px;padding:19px 30px;font-size:16.5px;font-weight:700;letter-spacing:.08em;transition:transform .2s,box-shadow .2s;position:relative}
.btn:hover{transform:translateY(-2px)}
.btn .arrow{margin-left:auto;font-family:var(--serif)}
.btn-line{background:linear-gradient(180deg,#1fd268,#06b64d);color:#fff;box-shadow:0 14px 34px rgba(6,199,85,.35)}
.btn-line:hover{box-shadow:0 18px 40px rgba(6,199,85,.45)}
.btn-ghost{background:rgba(248,243,234,.9);color:var(--ink);box-shadow:0 10px 26px rgba(0,0,0,.3)}
.line-badge{width:34px;height:34px;flex:0 0 auto}
/* hero trust badges + site list */
.hero-trust{position:relative;z-index:2;padding:6px 0 64px}
.trust-badges{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.trust-badge{display:flex;align-items:center;gap:8px;border:1px solid rgba(201,160,106,.4);border-radius:999px;padding:9px 18px;color:#e9dcc4;font-size:13.5px;font-weight:600;letter-spacing:.04em;background:rgba(255,255,255,.03)}
.trust-badge svg{width:17px;height:17px;color:var(--gold);flex:0 0 auto}
.trust-sites{text-align:center;margin-top:18px;font-size:12.5px;letter-spacing:.06em;color:#c9b79c}
/* mobile hamburger */
.hero .header .menu{margin-left:auto;display:none;background:none;border:none;cursor:pointer;padding:6px;color:var(--cream)}
.hero .header .menu svg{width:26px;height:26px;display:block}
.hero-nav{display:none}

/* ---------- section base ---------- */
section{position:relative}
.sec-pad{padding:96px 0}
.sec-title{font-family:var(--serif);font-weight:700;text-align:center;letter-spacing:.08em;line-height:1.9}

/* ---------- know (did you know) ---------- */
.know{background:var(--cream)}
.know .sec-title{font-size:clamp(22px,3vw,30px)}
.know .sec-title .red{color:var(--red)}
.know-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px}
.know-card{background:var(--cream-2);border:1px solid #eadfc9;border-radius:16px;padding:28px 18px 24px;text-align:center;box-shadow:0 12px 30px rgba(120,90,50,.08)}
.know-card .icon{width:64px;height:64px;margin:0 auto 16px}
.know-card h3{font-size:14.5px;font-weight:700;letter-spacing:.03em;line-height:1.7}
.know-card .desc{margin-top:8px;font-size:12px;line-height:1.75;color:#6d5a41;letter-spacing:.01em;text-align:left}
.know-foot{text-align:center;margin-top:40px;font-size:16px;letter-spacing:.06em;font-weight:500;color:#4c3c28}
.know-quote{text-align:center;margin-top:20px;font-family:var(--serif);font-weight:700;font-size:clamp(19px,2.3vw,24px);letter-spacing:.08em;line-height:1.8;color:var(--ink)}
.sp-br{display:none}

/* ---------- cases ---------- */
.cases{background:linear-gradient(180deg,#241409,#2a1810);color:var(--cream)}
.cases .sec-title{font-size:clamp(22px,3vw,29px);color:#f3ead9}
.cases-sub{text-align:center;margin-top:10px;font-size:13px;color:#f3ead9;letter-spacing:.06em;line-height:1.9}
.cases-sub b{font-weight:700;position:relative;padding-bottom:3px;letter-spacing:.1em}
.cases-sub b::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:#ff5a30;border-radius:2px}
.case-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:48px}
.case-card{background:linear-gradient(170deg,#faf4e7,#f0e5cf);border-radius:16px;overflow:hidden;color:var(--ink);box-shadow:0 24px 50px rgba(0,0,0,.4)}
.case-card .photo{aspect-ratio:16/11;background:#3a281a center/cover no-repeat;position:relative}
.case-card .body{padding:20px 22px 24px}
.case-card h3{font-family:var(--serif);font-weight:700;font-size:16.5px;letter-spacing:.03em}
.case-card .meta{font-size:11.5px;color:var(--tan);margin-top:2px;letter-spacing:.06em}
.case-price{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}
.case-price .chip{background:#f7e7dd;color:var(--red);border:1px solid #ecc9b6;font-size:10.5px;letter-spacing:.12em;border-radius:6px;padding:2px 8px;font-weight:700}
.case-price .yen{font-family:var(--serif);font-weight:800;font-size:27px;color:var(--red);letter-spacing:.01em}
.case-price .otoku{width:42px;height:42px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;border:1.6px solid var(--red);border-radius:50%;color:var(--red);font-size:11.5px;font-weight:700;letter-spacing:.06em;transform:rotate(8deg);box-shadow:inset 0 0 0 2.5px transparent,inset 0 0 0 3.5px rgba(194,64,29,.25);margin-left:auto}
.case-was{margin-top:10px;padding-top:12px;border-top:1px dashed #ddcbab;font-size:13.5px;letter-spacing:.04em;color:#6d5a41}
.case-was s{color:#9c8664}
.case-was b{font-family:var(--serif);font-size:16px;color:var(--ink);font-weight:700}
.case-card .reward{display:flex;width:100%;margin-top:12px}
.case-card.featured{transform:scale(1.05);z-index:2;box-shadow:0 30px 60px rgba(0,0,0,.55);border:1px solid rgba(201,160,106,.55)}
.case-card.featured .crown{position:absolute;top:14px;left:14px;z-index:3;background:var(--red);color:#fff;font-size:10.5px;font-weight:700;letter-spacing:.16em;border-radius:999px;padding:5px 13px;box-shadow:0 6px 16px rgba(0,0,0,.35)}
.case-card{position:relative}
.cases-note{text-align:center;margin-top:36px;font-size:11.5px;color:#a08a68;letter-spacing:.1em}

/* ---------- watch ---------- */
.watch{background:#1d1008;color:var(--cream);overflow:hidden}
.watch::before{content:"";position:absolute;inset:0;background:url("images/monitor-bg.jpg") left center/cover no-repeat;opacity:.5}
.watch::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,10,4,.3) 0%,rgba(20,10,4,.82) 46%,rgba(20,10,4,.95) 100%)}
.watch .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.watch-copy .maru-wrap{text-align:left;margin-bottom:16px}
.watch-copy h2{font-family:var(--serif);font-weight:700;font-size:clamp(21px,2.3vw,28px);line-height:1.85;letter-spacing:.05em;margin-top:18px;color:#f6efe0}
.watch-copy .foot{margin-top:24px;font-size:14.5px;color:#cdb794;letter-spacing:.08em}
.watch-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.watch-card{background:rgba(58,38,22,.72);border:1px solid rgba(201,160,106,.22);backdrop-filter:blur(4px);border-radius:14px;padding:28px 12px;text-align:center}
.watch-card .icon{width:44px;height:44px;margin:0 auto 16px;color:var(--gold)}
.watch-card p{font-size:13px;font-weight:500;letter-spacing:.03em;line-height:1.9;color:#eee2cc}
.watch-card .zero{font-family:var(--serif);font-weight:800;font-size:30px;color:#ff6a3d}

/* ---------- steps (how to) ---------- */
.steps{background:var(--cream)}
.steps-kicker{text-align:center;font-size:13px;letter-spacing:.3em;color:var(--tan);font-weight:600;margin-bottom:14px}
.step-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:52px;counter-reset:step}
.step-card{position:relative;background:var(--cream-2);border:1px solid #eadfc9;border-radius:16px;padding:44px 26px 34px;text-align:center;box-shadow:0 12px 30px rgba(120,90,50,.08)}
.step-card .step-num{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--gold-soft);font-size:11px;letter-spacing:.22em;font-weight:600;border-radius:999px;padding:5px 16px;font-family:var(--serif)}
.step-card .icon{width:84px;height:84px;margin:0 auto 20px}
.step-card h3{font-family:var(--serif);font-weight:700;font-size:16.5px;letter-spacing:.05em;line-height:1.7}
.step-card p{margin-top:10px;font-size:13px;color:#6d5a41;letter-spacing:.03em;line-height:1.95}
.step-card:not(:last-child)::after{content:"›";position:absolute;top:50%;right:-19px;transform:translateY(-50%);font-family:var(--serif);font-size:26px;color:#c9ab7c;z-index:2}

/* ---------- cta ---------- */
.cta{background:#180c05;color:#fdf6ea;text-align:center;overflow:hidden}
.cta::before{content:"";position:absolute;inset:0;background:url("images/beach-cta.jpg") center/cover no-repeat;opacity:.75}
.cta::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 100% at 50% 0%,rgba(30,12,4,.25),rgba(20,8,3,.72))}
.cta .wrap{position:relative;z-index:2;padding-top:110px;padding-bottom:110px}
.cta h2{font-family:var(--serif);font-weight:700;font-size:clamp(28px,4vw,40px);line-height:1.8;letter-spacing:.1em;text-shadow:0 4px 30px rgba(0,0,0,.5)}
.cta .sub{margin-top:20px;font-size:14.5px;letter-spacing:.14em;color:#f2e2ca}
.cta .btn-line{max-width:420px;margin:0 auto}
.cta .note{margin-top:18px;font-size:11.5px;color:#d9c3a4;letter-spacing:.1em}
.cta .stamp{width:150px;height:150px;right:8%;top:60px;color:#f3e3c8;opacity:.85;transform:rotate(8deg)}

/* ---------- waitlist (メールログイン希望者の需要計測用) ---------- */
.wl{margin-top:24px;text-align:center}
.wl .wl-pill{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.06);border:1px solid rgba(229,207,168,.3);border-radius:999px;padding:7px 16px;font-size:11px;color:#d9c3a4;letter-spacing:.04em;cursor:pointer;transition:background .2s}
.wl .wl-pill:hover{background:rgba(255,255,255,.1)}
.wl .wl-pill.hidden{display:none}

.wl-panel{display:none;margin:16px auto 0;max-width:400px}
.wl-panel.open{display:block}

/* 一体型ピルフォーム: 左=透明入力欄、右=クリーム色ボタンが同じ丸ピルの中に内包される */
.wl-subscribe{display:flex;align-items:center;background:rgba(255,255,255,.05);border:1px solid rgba(229,207,168,.25);border-radius:999px;padding:4px;box-shadow:0 12px 28px rgba(0,0,0,.35)}
.wl-subscribe input[type=email]{flex:1;min-width:0;background:transparent;border:none;padding:12px 8px 12px 18px;font-family:var(--serif);font-style:italic;font-size:13.5px;color:#f5ead6;letter-spacing:.02em}
.wl-subscribe input[type=email]::placeholder{color:rgba(245,234,214,.5);font-style:italic}
.wl-subscribe input[type=email]:focus{outline:none}
.wl-subscribe button[type=submit]{flex:0 0 auto;display:flex;align-items:center;gap:7px;background:var(--gold-soft);color:var(--ink);border:none;border-radius:999px;padding:12px 22px;font-size:11px;font-weight:700;letter-spacing:.06em;cursor:pointer;transition:background .2s,transform .2s;font-family:var(--sans)}
.wl-subscribe button[type=submit] .en{font-family:var(--sans);font-style:normal;letter-spacing:.02em}
.wl-subscribe button[type=submit]:hover{background:#f0ddb8;transform:translateY(-1px)}
.wl-subscribe button[type=submit]:disabled{opacity:.6;cursor:default}

.wl-fine{margin-top:10px;font-size:10.5px;color:#a89880;letter-spacing:.03em;text-align:center;line-height:1.6}
.wl-done{font-size:11px;color:#c9b79c;text-align:center;padding:14px 0}

/* ---------- faq ---------- */
.faq{background:var(--cream);overflow:hidden}
.faq .sec-title{font-size:clamp(20px,2.6vw,26px)}
.faq-list{max-width:820px;margin:44px auto 0;position:relative;z-index:2}
.faq-item{background:var(--cream-2);border:1px solid #eadfc9;border-radius:12px;margin-bottom:14px;overflow:hidden}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:18px;padding:20px 24px;font-size:14.5px;font-weight:600;letter-spacing:.05em}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary .q{font-family:var(--serif);font-weight:700;color:var(--red);font-size:17px;flex:0 0 auto}
.faq-item summary .plus{margin-left:auto;color:#b09265;font-size:20px;font-weight:400;transition:transform .25s;flex:0 0 auto;line-height:1}
.faq-item[open] summary .plus{transform:rotate(45deg)}
.faq-item .a{padding:0 24px 22px 59px;font-size:13.5px;color:#5d4c37;letter-spacing:.03em}
.skyline{position:absolute;bottom:0;left:0;right:0;height:130px;color:#e4d5b8;opacity:.55;pointer-events:none}
.skyline svg{width:100%;height:100%;display:block}

/* ---------- footer ---------- */
footer{background:#1b100a;color:#cbb590;padding:64px 0 0}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px;padding-bottom:52px}
.foot-brand .logo-text .en{color:#f1e7d3}
.foot-tagline{margin-top:20px;font-size:12px;line-height:2.1;letter-spacing:.06em;color:#a68e69}
.foot-col h4{font-size:11.5px;letter-spacing:.22em;color:#8a7150;font-weight:600;margin-bottom:18px}
.foot-col a{display:block;font-size:13px;color:#d6c19b;padding:6px 0;letter-spacing:.06em;transition:color .2s}
.foot-col a:hover{color:#fff}
.copyright{border-top:1px solid rgba(201,160,106,.15);text-align:center;padding:22px 0;font-size:11px;letter-spacing:.14em;color:#7a6448}

/* ---------- sticky cta ---------- */
.sticky-cta{position:fixed;left:14px;right:14px;bottom:14px;z-index:60;display:none;align-items:center;justify-content:center;gap:10px;background:linear-gradient(180deg,#1fd268,#06b64d);color:#fff;border-radius:999px;padding:15px 22px;font-size:14.5px;font-weight:700;letter-spacing:.06em;box-shadow:0 14px 34px rgba(0,0,0,.35);transform:translateY(140%);transition:transform .35s ease}
.sticky-cta.show{transform:none}
.sticky-cta .line-badge{width:26px;height:26px}
@media(max-width:900px){.sticky-cta{display:flex}}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media(max-width:1024px){
  .watch .wrap{grid-template-columns:1fr;gap:44px}
  .watch-copy{text-align:center}
  .watch-copy .maru-wrap{text-align:center}
  .watch-copy .foot{max-width:480px;margin-left:auto;margin-right:auto}
  .watch-grid{max-width:560px;margin-left:auto;margin-right:auto}
}
@media(max-width:900px){
  .hero .header{padding:12px 0 0}
  .hero .logo-mark{width:36px;height:36px}
  .hero .logo-text .en{font-size:17px}
  .hero-grid{grid-template-columns:1fr;grid-template-areas:"copy" "visual" "ctas";gap:10px;padding:10px 0 8px;text-align:center}
  .hero-copy h1{font-size:clamp(22px,6.2vw,27px);line-height:1.42}
  .hero-lead{display:none}
  .hero-sub{margin-left:auto;margin-right:auto;margin-top:8px}
  .hero-ctas{grid-template-columns:1fr;width:100%;max-width:400px;margin-left:auto;margin-right:auto;margin-top:0;align-self:center}
  .hero-ctas .btn{padding:15px 30px}
  .phone{zoom:.75;transform:rotateY(-10deg) rotateX(4deg) rotate(-2deg);box-shadow:16px 46px 60px rgba(0,0,0,.55),0 0 0 1.5px rgba(255,255,255,.22),inset 0 1px 1px rgba(255,255,255,.3),inset 0 -1.5px 2px rgba(0,0,0,.5)}
  .phone .notch,.phone .statusbar,.phone .ln-note,.phone .ln-hotel .plan,.phone .ln-mini,.phone .ln-diff{display:none}
  .phone .ln-topbar{padding-top:14px}
  .hero-trust{padding:0 0 8px}
  .trust-badges{display:none}
  .hero .header .menu{display:block}
  .hero-nav.open{display:flex;flex-direction:column;gap:2px;margin-top:14px;padding:14px 4px;border-top:1px solid rgba(201,160,106,.2);border-bottom:1px solid rgba(201,160,106,.2)}
  .hero-nav a{color:#e9dcc4;font-size:15px;font-weight:600;padding:10px 4px;letter-spacing:.06em}
  .hero-nav .nav-cta{color:#37d67a}
  .know-cards{grid-template-columns:repeat(2,1fr);gap:12px;max-width:520px;margin-left:auto;margin-right:auto}
  .know-card{padding:20px 14px 18px}
  .know-card .icon{width:50px;height:50px;margin:0 auto 10px}
  .know-card h3{font-size:13px}
  .know-card .desc{font-size:11px}
  .case-cards{grid-template-columns:1fr;max-width:460px;margin-left:auto;margin-right:auto}
  .watch .wrap{grid-template-columns:1fr}
  .step-cards{grid-template-columns:1fr;max-width:460px;margin-left:auto;margin-right:auto;gap:34px}
  .step-card:not(:last-child)::after{content:"›";top:auto;bottom:-31px;right:auto;left:50%;transform:translateX(-50%) rotate(90deg)}
  .case-card.featured{transform:none}
  .sp-br{display:inline}
  .foot-grid{grid-template-columns:1fr;gap:32px}
  .cta .stamp{width:110px;height:110px;right:4%;top:26px}
  .sec-pad{padding:72px 0}
  .subhead .wrap{flex-direction:row}
  .page-title{font-size:clamp(24px,7vw,32px)}
}

/* ---------- subpage header (company / contact) ---------- */
.subhead{position:relative;background:#1a0f08;color:var(--cream);overflow:hidden}
.subhead::before{content:"";position:absolute;inset:0;background:url("images/hero.jpg") center/cover no-repeat;opacity:.35}
.subhead::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,9,3,.75),rgba(18,9,3,.92))}
.subhead .wrap{position:relative;z-index:2;padding:26px 24px 46px;display:flex;flex-direction:column}
.subhead .back{align-self:flex-end;font-size:13px;color:#d9c5a4;letter-spacing:.05em;display:flex;align-items:center;gap:4px}
.subhead .back:hover{color:#fff}
.page-title{font-family:var(--serif);font-weight:700;font-size:clamp(26px,3.6vw,36px);letter-spacing:.06em;margin-top:36px}
.page-lead{margin-top:14px;font-size:14px;color:#d9c5a4;letter-spacing:.04em}

/* ---------- subpage content ---------- */
.subpage{background:var(--cream)}
.info-card{background:var(--cream-2);border:1px solid #eadfc9;border-radius:16px;padding:8px 32px;box-shadow:0 12px 30px rgba(120,90,50,.08);max-width:720px;margin:0 auto}
.info-row{display:flex;gap:24px;padding:22px 0;border-bottom:1px solid #eadfc9}
.info-row:last-child{border-bottom:none}
.info-row dt{flex:0 0 120px;font-size:13px;font-weight:700;color:var(--tan);letter-spacing:.08em}
.info-row dd{flex:1;font-size:14.5px;line-height:1.9;letter-spacing:.02em}
.info-row dd a{color:var(--red-deep);text-decoration:underline;text-underline-offset:2px}
@media(max-width:600px){
  .info-card{padding:6px 20px}
  .info-row{flex-direction:column;gap:4px;padding:18px 0}
  .info-row dt{flex:none}
}

.contact-grid{max-width:720px;margin:0 auto;display:grid;gap:20px}
.contact-card{background:var(--cream-2);border:1px solid #eadfc9;border-radius:16px;padding:32px 28px;text-align:center;box-shadow:0 12px 30px rgba(120,90,50,.08)}
.contact-card .icon{width:52px;height:52px;margin:0 auto 16px;color:var(--red)}
.contact-card h3{font-family:var(--serif);font-weight:700;font-size:18px;letter-spacing:.04em}
.contact-card p{margin-top:10px;font-size:13.5px;color:#6d5a41;line-height:1.85}
.contact-card .btn{margin:20px auto 0;max-width:280px;font-size:15px;padding:15px 26px}
.contact-note{max-width:640px;margin:36px auto 0;text-align:center;font-size:12.5px;color:#a08a68;line-height:1.9;letter-spacing:.03em}

/* ---------- legal article (privacy / terms) ---------- */
.legal{max-width:720px;margin:0 auto}
.legal .enacted{font-size:13px;color:#a08a68;letter-spacing:.06em;margin-bottom:32px}
.legal .intro{font-size:14px;line-height:1.95;color:#5a4e40;letter-spacing:.02em;padding-bottom:28px;border-bottom:1px solid #eadfc9;margin-bottom:32px}
.legal-sec{margin-bottom:34px}
.legal-sec h2{font-family:var(--serif);font-weight:700;font-size:17px;letter-spacing:.04em;color:var(--ink);margin-bottom:12px}
.legal-sec p{font-size:14px;line-height:1.95;color:#5a4e40;letter-spacing:.02em;white-space:pre-line}
.legal-sec p+p{margin-top:14px}
.legal-sec.bizinfo{background:var(--cream-2);border:1px solid #eadfc9;border-radius:14px;padding:24px 26px;margin-top:44px}
.legal-sec.bizinfo h2{font-size:15px}

/* ---------- hero bubble（提案機能の吹き出し・LINEボタン直上） ---------- */
/* デスクトップ: しっぽ下向き（LINEボタンを指す）／モバイル: しっぽ上向き（phoneを指す） */
.hero-bubble{position:relative;background:rgba(253,250,244,.95);color:var(--ink);border-radius:14px;padding:11px 18px;font-size:12.5px;font-weight:600;letter-spacing:.04em;line-height:1.75;text-align:center;box-shadow:0 12px 30px rgba(0,0,0,.35)}
.hero-bubble::before{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:8px solid transparent;border-top:8px solid rgba(253,250,244,.95);border-bottom:0}
.hero-bubble strong{color:var(--red);font-weight:700}
@media(max-width:900px){
  .hero-bubble{margin-top:6px;font-size:12px}
  .hero-bubble::before{top:-8px;border-bottom:8px solid rgba(253,250,244,.95);border-top:0}
}