:root{
  --text:#263238;--muted:#607078;--line:#d8e3e7;--bg:#f7fbfc;--surface:#fff;
  --soft:#edf7f8;--accent:#267b87;--accent-dark:#175963;--warm:#fff7e8;
  --danger:#fff0f0;--danger-line:#d97a7a;--success:#eef9f1;--shadow:0 8px 24px rgba(30,75,84,.08)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Sans","Yu Gothic",sans-serif;
  color:var(--text);
  line-height:1.85;
  background-color:var(--bg);
  background-image:
    linear-gradient(rgba(247,251,252,.34),rgba(247,251,252,.58)),
    url("assets/images/city-background-soft.webp");
  background-size:cover;
  background-position:center top;
  background-repeat:no-repeat;
  background-attachment:fixed;
}
a{color:var(--accent-dark);text-underline-offset:3px}
header,main,footer{width:min(1040px,calc(100% - 32px));margin:0 auto}
header{
  margin-top:14px;
  padding:22px 24px 16px;
  border:1px solid rgba(216,227,231,.88);
  border-radius:0 0 18px 18px;
  background:rgba(255,255,255,.80);
  -webkit-backdrop-filter:blur(5px);
  backdrop-filter:blur(5px);
  box-shadow:0 8px 26px rgba(30,75,84,.07);
}
.site-name{margin:0;font-size:1.85rem;line-height:1.35}.site-name a{color:inherit;text-decoration:none}
.site-tagline{margin:7px 0 0;color:var(--muted)}
nav{margin-top:18px;display:flex;flex-wrap:wrap;gap:9px}
nav a,.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 14px;border:1px solid var(--line);color:var(--text);text-decoration:none;border-radius:10px;background:#fff;font-weight:650}
nav a:hover,.button:hover{border-color:var(--accent);transform:translateY(-1px)}
.button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.button.primary:hover{background:var(--accent-dark)}
.button.secondary{background:#fff;color:var(--accent-dark);border-color:var(--accent)}
.button.full{width:100%}.button-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
main{padding:28px 0 72px}.breadcrumb{font-size:.92rem;color:var(--muted);margin-bottom:16px}.breadcrumb a{color:var(--muted)}
.hero,.box,.cta,.card,.notice,.route-card,.ad-disclosure{border:1px solid var(--line);border-radius:16px;padding:22px;background:var(--surface);box-shadow:var(--shadow)}
.hero{margin-bottom:26px;background:linear-gradient(135deg,rgba(255,255,255,.97) 0%,rgba(237,247,248,.93) 100%)}
.hero h2{font-size:clamp(1.65rem,4vw,2.35rem);line-height:1.45;margin:0 0 12px}.hero p:last-child{margin-bottom:0}
.lead{font-size:1.08rem}.section{margin-top:38px}.section>h2,.box>h2{margin:0 0 14px;font-size:1.5rem;line-height:1.5}.section h3,.box h3{line-height:1.55}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.card h3,.route-card h3{margin-top:0}.card p:last-child,.route-card p:last-child{margin-bottom:0}
.route-card{position:relative;border-top:6px solid var(--accent)}.route-label{display:inline-block;font-size:.82rem;font-weight:800;letter-spacing:.04em;background:var(--soft);color:var(--accent-dark);padding:3px 9px;border-radius:999px;margin-bottom:8px}
.step-list{counter-reset:step;list-style:none;padding:0;margin:0}.step-list li{counter-increment:step;position:relative;padding:0 0 24px 52px}.step-list li:before{content:counter(step);position:absolute;left:0;top:1px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#fff;font-weight:800}.step-list li:not(:last-child):after{content:"";position:absolute;left:16px;top:37px;bottom:3px;width:2px;background:var(--line)}
.check-list,.cross-list{list-style:none;padding-left:0}.check-list li,.cross-list li{position:relative;padding-left:1.75em;margin:.45em 0}.check-list li:before{content:"✓";position:absolute;left:0;color:var(--accent);font-weight:900}.cross-list li:before{content:"—";position:absolute;left:0;color:var(--muted);font-weight:900}
.decision{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:stretch}.decision-or{display:grid;place-items:center;font-weight:900;color:var(--muted)}
.table-wrap{overflow-x:auto;border-radius:12px}.table-like{width:100%;border-collapse:collapse;background:#fff}.table-like th,.table-like td{border:1px solid var(--line);padding:13px;text-align:left;vertical-align:top}.table-like th{background:var(--soft);white-space:nowrap}
.notice{background:var(--warm);box-shadow:none}.notice.danger{background:var(--danger);border-color:var(--danger-line)}.notice.success{background:var(--success)}
.ad-disclosure{padding:12px 15px;background:#f5f6f7;box-shadow:none;font-size:.92rem;color:var(--muted);margin-bottom:18px}.ad-disclosure strong{color:var(--text)}
.cta{margin-top:26px;background:var(--soft);border-color:#b9d9dd}.cta h2,.cta h3{margin-top:0}.cta .small{margin-bottom:0}
.kicker{font-size:.86rem;font-weight:800;color:var(--accent-dark);letter-spacing:.05em;text-transform:uppercase}.price-note{font-size:1.15rem;font-weight:800}.badge{display:inline-block;background:var(--soft);border:1px solid var(--line);border-radius:999px;padding:3px 10px;margin:2px;font-size:.9rem}
.toc{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 20px}.toc strong{display:block;margin-bottom:6px}.toc ol{margin:0}.toc li{margin:.3em 0}
.small,.meta{color:var(--muted);font-size:.92rem}.source-list{font-size:.9rem;color:var(--muted)}
.form-row{margin-bottom:14px}label{display:block;font-weight:700;margin-bottom:6px}input,textarea,select{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:9px;font:inherit;background:#fff}textarea{min-height:140px}
hr{border:none;border-top:1px solid var(--line);margin:28px 0}code{background:var(--soft);padding:2px 6px;border-radius:6px}footer{
  margin-bottom:22px;
  padding:22px 24px 38px;
  border:1px solid rgba(216,227,231,.88);
  border-radius:18px;
  color:var(--muted);
  background:rgba(255,255,255,.80);
  -webkit-backdrop-filter:blur(5px);
  backdrop-filter:blur(5px);
  box-shadow:0 8px 26px rgba(30,75,84,.06);
}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:9px 16px;display:none}.sticky-cta-inner{width:min(760px,100%);margin:auto;display:flex;gap:10px}.sticky-cta .button{flex:1}
@media(max-width:720px){
  header,main,footer{width:min(100% - 22px,1040px)}body{background-attachment:scroll;background-position:42% top}header{margin-top:8px;padding:18px 16px 14px}.site-name{font-size:1.55rem}nav{flex-wrap:nowrap;overflow-x:auto;padding-bottom:7px}nav a{white-space:nowrap;font-size:.9rem}.hero,.box,.cta,.card,.notice,.route-card{padding:18px;border-radius:13px}.grid.two,.grid.three,.decision{grid-template-columns:1fr}.decision-or{padding:0}.button-row{flex-direction:column}.button-row .button{width:100%}.table-like th,.table-like td{padding:10px;font-size:.94rem}.sticky-cta{display:block}main{padding-bottom:110px}
}
@media print{nav,.sticky-cta,.button-row{display:none!important}body{background:#fff!important}header,footer{background:#fff;box-shadow:none;backdrop-filter:none}.hero,.box,.card,.notice,.route-card{box-shadow:none}}


/* stand.fm・音声コンテンツ */
.voice-hero{background:linear-gradient(135deg,#fff 0%,#f4f0ff 100%)}
.voice-box{display:flex;gap:18px;align-items:flex-start;margin:22px 0 30px;padding:20px;border:1px solid #d8ccef;border-radius:16px;background:#faf7ff;box-shadow:var(--shadow)}
.voice-box[hidden]{display:none!important}.voice-icon{flex:0 0 48px;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#eee6ff;font-size:1.5rem}
.voice-box-content{flex:1}.voice-box h2{font-size:1.3rem;line-height:1.5;margin:2px 0 8px}.voice-box p{margin-top:0}
.voice-button{background:#6f4ca0;color:#fff;border-color:#6f4ca0}.voice-button:hover{background:#563879;border-color:#563879;color:#fff}
.voice-label{display:inline-block;font-size:.82rem;font-weight:800;background:#f1ebfa;color:#563879;border-radius:999px;padding:3px 9px;margin-bottom:8px}
.voice-card{border-top:5px solid #8b68b5}.voice-card h3{margin-top:4px}.voice-grid{align-items:stretch}
.button-row.compact{margin-top:14px}.button-row.compact .button{font-size:.92rem;padding:8px 12px}
.section-heading-row{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:8px}.section-heading-row h2{margin:0}.section-heading-row .kicker{margin:0 0 4px}.text-link{font-weight:700;white-space:nowrap}
@media(max-width:720px){.voice-box{padding:17px;gap:12px}.voice-icon{flex-basis:42px;width:42px;height:42px}.voice-box h2{font-size:1.15rem}.section-heading-row{align-items:flex-start;flex-direction:column;gap:6px}.button-row.compact{flex-direction:column}.button-row.compact .button{width:100%}}


/* 実体験記事・A8.net広告リンク（既存デザインへ影響しない追加クラス） */
.article-body{padding:clamp(20px,4vw,34px)}
.article-body>.lead{font-size:1.12rem;font-weight:650}
.article-body .section{scroll-margin-top:18px}
.thought-chain{text-align:center;background:var(--soft);box-shadow:none;margin:20px auto;max-width:520px}
.thought-chain p{margin:.35em 0;font-weight:700}
.affiliate-section{border:1px solid #d8c6a0;border-radius:16px;padding:22px;background:#fffaf0;box-shadow:var(--shadow)}
.affiliate-section h2,.affiliate-section h3{margin-top:0}
.affiliate-link-box{margin:18px 0 12px}
.affiliate-link-box>a{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 18px;border:1px solid var(--accent);border-radius:10px;background:var(--accent);color:#fff;text-decoration:none;font-weight:750;line-height:1.5}
.affiliate-link-box>a:hover{background:var(--accent-dark);border-color:var(--accent-dark);transform:translateY(-1px)}
.affiliate-link-box>img{display:block;width:1px;height:1px}
@media(max-width:720px){.article-body{padding:18px}.affiliate-section{padding:18px}.affiliate-link-box>a{width:100%;text-align:center}}
