/* 全 LP 共通のスタイル。LP ごとの色は各ページの <style> で --main を上書きする */
:root{--main:#2b6cb0;--main-dark:#1e4e80;--cta:#e8590c;--cta-dark:#c2470a;--text:#222;--muted:#666;--bg:#fff;--sub:#f5f7fa;--line:#e5e7eb}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Hiragino Sans","Noto Sans JP","Yu Gothic",sans-serif;color:var(--text);background:var(--bg);line-height:1.8;-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block}
a{color:var(--main)}
.wrap{max-width:860px;margin:0 auto;padding:0 16px}

/* PR 表記（ステマ規制対応。消さないこと） */
.pr-note{background:#f1f1f1;color:#555;font-size:.78rem;text-align:center;padding:6px 16px}

.site-header{padding:12px 0;border-bottom:1px solid var(--line)}
.logo{font-weight:700;font-size:1rem;color:var(--text);text-decoration:none}

section{padding:48px 0}
section.alt{background:var(--sub)}
h1{font-size:clamp(1.5rem,5.5vw,2.2rem);line-height:1.4;margin-bottom:16px}
h2{font-size:clamp(1.25rem,4.5vw,1.6rem);line-height:1.5;margin-bottom:24px;text-align:center}
h3{font-size:1.1rem;margin-bottom:8px}
p+p{margin-top:12px}

.hero{text-align:center;padding:48px 0 40px;background:linear-gradient(180deg,var(--sub),#fff)}
.hero .lead{font-size:1.05rem}
.hero img{margin:24px auto 0;border-radius:12px}

/* CTA ボタン */
.cta-box{text-align:center;margin-top:28px}
.cta-box .micro{display:block;font-size:.85rem;color:var(--muted);margin-bottom:8px}
.cta{display:block;max-width:460px;margin:0 auto;padding:18px 24px;background:var(--cta);color:#fff;border-radius:999px;text-decoration:none;font-weight:700;font-size:1.1rem;box-shadow:0 4px 0 var(--cta-dark);transition:transform .1s}
.cta:active{transform:translateY(3px);box-shadow:0 1px 0 var(--cta-dark)}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.card{background:#fff;padding:20px;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.checklist{list-style:none;max-width:560px;margin:0 auto}
.checklist li{padding:10px 0 10px 32px;border-bottom:1px dashed var(--line);position:relative}
.checklist li::before{content:"✓";position:absolute;left:4px;color:var(--main);font-weight:700}
.steps{counter-reset:step;list-style:none;display:grid;gap:12px}
.steps li{counter-increment:step;background:#fff;border-radius:12px;padding:16px 16px 16px 60px;position:relative;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.steps li::before{content:counter(step);position:absolute;left:16px;top:16px;width:32px;height:32px;border-radius:50%;background:var(--main);color:#fff;font-weight:700;text-align:center;line-height:32px}

table.compare{width:100%;border-collapse:collapse;font-size:.92rem;background:#fff}
table.compare th,table.compare td{border:1px solid var(--line);padding:10px;text-align:left;vertical-align:top}
table.compare th{background:var(--sub)}
.table-scroll{overflow-x:auto}

.faq details{background:#fff;border-radius:12px;padding:14px 16px;margin-bottom:10px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.faq summary{font-weight:700;cursor:pointer}
.faq details p{margin-top:8px}

.note{font-size:.8rem;color:var(--muted);margin-top:16px}
.tbd{background:#fff3cd;padding:0 4px}

/* 汎用ページ（運営者情報・プライバシーポリシー） */
.doc{padding:40px 0}
.doc h1{font-size:1.5rem}
.doc h2{text-align:left;font-size:1.15rem;margin:32px 0 8px}
.doc table{width:100%;border-collapse:collapse;margin-top:16px}
.doc th,.doc td{border:1px solid var(--line);padding:10px;text-align:left;vertical-align:top}
.doc th{background:var(--sub);width:30%;white-space:nowrap}

.site-footer{padding:24px 0 32px;text-align:center;font-size:.8rem;color:var(--muted);border-top:1px solid var(--line)}
.site-footer nav a{color:var(--muted);margin:0 8px}
.site-footer p{margin-top:8px}

/* スマホで画面下に固定する CTA（不要なら HTML から消す） */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.95);box-shadow:0 -2px 8px rgba(0,0,0,.08);z-index:10}
.sticky-cta .cta{padding:14px 20px;font-size:1rem}
body.has-sticky{padding-bottom:84px}
@media (min-width:768px){.sticky-cta{display:none}body.has-sticky{padding-bottom:0}}
