:root{
  --accent:#1f6a4d;
  --accent-deep:#123f2e;
  --accent-soft:#e7f1e8;
  --surface:#fff;
  --surface-soft:#f3f6f2;
  --text:#1c231d;
  --muted:#5b6a58;
  --line:#d9e2d5;
  --shadow:0 12px 30px rgba(16,32,22,.09);
}
*{box-sizing:border-box}
html{font-size:16px}
body{margin:0;background:#f5f7f3;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.85}
a{color:var(--accent-deep)}
a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.guide-site-header{background:#fff;border-bottom:1px solid var(--line)}
.guide-site-header-inner{max-width:980px;min-height:60px;margin:0 auto;padding:8px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.guide-brand{font-weight:700;text-decoration:none;color:var(--accent-deep)}
.guide-header-link{min-height:44px;display:inline-flex;align-items:center;padding:8px 13px;border:1px solid var(--accent);border-radius:999px;text-decoration:none;font-weight:600}
.guide-header-link:hover,.guide-cta:hover{background:var(--accent-deep);color:#fff}
.guide-main{max-width:900px;margin:0 auto;padding:18px 18px 48px}
.breadcrumb{font-size:.82rem;color:var(--muted);margin:2px 0 14px}
.breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0}
.breadcrumb li:not(:last-child)::after{content:"›";margin-left:6px;color:#81907d}
.operationDisclosure{font-size:.78rem;color:var(--muted);margin:0 0 14px}
.guide-document{max-width:760px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);overflow:hidden}
.guide-title{padding:30px 28px 26px;background:linear-gradient(180deg,#fff,var(--surface-soft));border-bottom:1px solid var(--line)}
.eyebrow{margin:0 0 7px;color:var(--accent);font-size:.78rem;font-weight:700;letter-spacing:.09em}
h1{font-size:clamp(1.55rem,4vw,2.15rem);line-height:1.45;margin:0 0 12px}
.guide-title p{margin:0 0 18px;color:var(--muted)}
.guide-cta{min-height:46px;display:inline-flex;align-items:center;justify-content:center;padding:9px 18px;border-radius:12px;background:var(--accent);color:#fff;text-decoration:none;font-weight:700;box-shadow:0 2px 8px rgba(18,63,46,.2)}
.guide-section{padding:24px 28px;border-bottom:1px solid var(--line)}
h2{font-size:1.28rem;line-height:1.5;margin:0 0 12px;color:var(--accent-deep)}
h3{font-size:1.02rem;margin:18px 0 6px}
p{margin:.6em 0}
ul,ol{padding-left:1.4em}
.note{padding:12px 14px;background:var(--accent-soft);border-left:4px solid var(--accent);border-radius:0 10px 10px 0}
.example{padding:14px 16px;background:var(--surface-soft);border:1px solid var(--line);border-radius:12px}
.faq details{border-top:1px solid var(--line);padding:12px 0}
.faq details:first-of-type{border-top:0}
.faq summary{cursor:pointer;font-weight:700;color:var(--accent-deep)}
.guide-document-footer{padding:26px 28px;text-align:center;background:var(--surface-soft)}
.guide-document-footer p{font-size:.88rem;color:var(--muted);margin-top:14px}
@media(max-width:600px){
  .guide-site-header-inner,.guide-main{padding-left:12px;padding-right:12px}
  .guide-site-header-inner{gap:8px}
  .guide-brand{font-size:.9rem}
  .guide-header-link{font-size:.82rem;padding:7px 10px}
  .guide-title,.guide-section,.guide-document-footer{padding-left:18px;padding-right:18px}
  .guide-document{border-radius:14px}
}
