:root{
  --sky:#cfeefa; --sky2:#eaf9ff; --mint:#bff0e0; --sun:#ffd23f; --sun2:#ffe98a; --coral:#ff6a45; --ink:#16465a; --ink2:#4d8a9b;
  --blue:#2a8fe0; --purple:#6a52d8; --green:#14976a; --orange:#e0701c; --white:#fff; --paper:#fffdf6;
  --r:28px; --shadow:0 10px 0 rgba(10,60,80,.16),0 22px 40px rgba(10,60,80,.18);
  --font:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Yu Gothic UI",system-ui,sans-serif; --latin:"Fredoka","Zen Maru Gothic",system-ui,sans-serif;
}
*{box-sizing:border-box} html{scroll-behavior:smooth;overflow-x:clip} body{margin:0;font-family:var(--font);color:var(--ink);background:var(--paper);line-height:1.8;font-weight:500;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block} a{color:inherit} button{font:inherit}
:focus-visible{outline:4px solid var(--blue);outline-offset:3px;border-radius:12px}
.wrap{width:min(1120px,100% - 40px);margin:0 auto}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:10px 16px;border-radius:12px;z-index:100} .skip:focus{left:8px}

/* ---- ナビ ---- */
.nav{position:fixed;inset:14px 0 auto 0;z-index:50;pointer-events:none}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px 10px 20px;border-radius:999px;background:rgba(255,255,255,.78);backdrop-filter:blur(14px);box-shadow:0 8px 24px rgba(10,60,80,.14);pointer-events:auto;width:min(1120px,100% - 28px)}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:900;font-size:18px;letter-spacing:.06em}
.logo img{display:block;height:44px;width:auto} @media(max-width:760px){.logo img{height:40px}}
.nav ul{display:flex;gap:6px;list-style:none;margin:0;padding:0}
.nav ul a{display:block;padding:8px 14px;border-radius:999px;text-decoration:none;font-weight:700;font-size:15px;transition:background .2s} .nav ul a:hover{background:rgba(42,143,224,.12)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 28px;border-radius:999px;border:0;background:linear-gradient(180deg,#ffe98a,#ffc22e);color:#4a3200;font-weight:900;font-size:18px;letter-spacing:.05em;text-decoration:none;cursor:pointer;box-shadow:0 7px 0 #c98f12,0 16px 26px rgba(150,100,0,.3);transition:transform .15s cubic-bezier(.2,1.6,.4,1),box-shadow .15s}
.btn:hover{transform:translateY(-3px)} .btn:active{transform:translateY(5px);box-shadow:0 2px 0 #c98f12,0 6px 10px rgba(150,100,0,.3)}
.btn.sm{padding:10px 20px;font-size:15px;box-shadow:0 5px 0 #c98f12} .btn.ghost{background:#fff;color:var(--ink);box-shadow:0 7px 0 rgba(10,60,80,.18),0 16px 26px rgba(10,60,80,.12)}
.btn svg{width:22px;height:22px}
@media(max-width:760px){.nav ul{display:none}}

footer{background:var(--ink);color:#d7f1f7;padding:44px 0 56px;font-size:14px;font-weight:700}
footer .wrap{display:flex;flex-wrap:wrap;gap:20px 40px;justify-content:space-between;align-items:center} footer a{text-decoration:none;opacity:.9} footer a:hover{text-decoration:underline}
footer ul{display:flex;gap:22px;list-style:none;margin:0;padding:0;flex-wrap:wrap}

/* ---- 本文ページ ---- */
.page{padding:140px 0 90px;background:linear-gradient(180deg,#d7f1fb 0,#eef9ff 260px,var(--paper) 520px);min-height:70vh}
.page .wrap{width:min(820px,100% - 40px)}
.page h1{font-size:clamp(34px,5.4vw,56px);margin:6px 0 10px;line-height:1.2;letter-spacing:.03em}
.page .lede{font-weight:700;color:var(--ink2);margin:0 0 36px}
.card{background:#fff;border-radius:var(--r);padding:clamp(24px,4vw,44px);box-shadow:var(--shadow)}
.card h2{font-size:clamp(20px,2.6vw,26px);margin:38px 0 10px;padding-left:16px;border-left:8px solid var(--sun);line-height:1.4} .card h2:first-child{margin-top:0}
.card p,.card li{font-weight:500;font-size:16.5px} .card ul{padding-left:1.3em;margin:8px 0 14px} .card li{margin:4px 0}
.card a{color:var(--blue);font-weight:700}
.meta{margin-top:30px;font-size:14px;color:var(--ink2);font-weight:700}
.formbtn{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:24px 0 4px}
.soonbox{padding:18px 20px;border-radius:18px;background:var(--sky2);font-weight:700}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
[hidden]{display:none!important}
.eyebrow{font-family:var(--latin);font-weight:600;letter-spacing:.2em;font-size:14px;color:var(--blue);text-transform:uppercase;margin:0}