:root { color:#20314d; font-family:"Yu Gothic","Hiragino Kaku Gothic ProN","Meiryo",sans-serif; font-synthesis:none; }
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:radial-gradient(ellipse at 90% 4%,#e9f6d8,transparent 48%),linear-gradient(160deg,#f0f1ff,#fffdf7 75%); line-height:1.8; }
h1,h2,p,figure { margin:0; }
a { color:inherit; }
.site-header { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; backdrop-filter:blur(12px); }
.site-home-brand { display:flex; align-items:center; gap:10px; color:#243b5a; text-decoration:none; }
.site-home-brand img { width:34px; height:34px; border-radius:7px; }
.site-home-brand span { font:600 17px/1.3 Arial,sans-serif; letter-spacing:.16em; }
.site-home-brand small { display:block; margin-top:4px; font:500 9px/1.4 Arial,sans-serif; letter-spacing:.12em; color:#576782; }
.skip-link { position:fixed; z-index:100; top:8px; left:16px; padding:12px 20px; background:#20314d; color:#fff; transform:translateY(-160%); }
.skip-link:focus { transform:none; }
a:focus-visible { outline:3px solid #3446ae; outline-offset:4px; }
.home-main { max-width:1120px; margin:0 auto; padding:42px 24px 48px; }
.home-intro { margin-bottom:30px; }
.home-kicker { margin-bottom:12px; color:#4050ae; font-size:13px; font-weight:700; }
.home-intro h1 { font-size:clamp(28px,3.1vw,42px); line-height:1.4; letter-spacing:.03em; }
.home-intro>p:last-child { margin-top:14px; font-size:15px; color:#50617a; }
.home-doors { display:grid; grid-template-columns:1.2fr 1fr; gap:24px; align-items:stretch; }
.home-door { min-width:0; display:flex; flex-direction:column; padding:30px; background:#fffef8; border:2px solid #6674bf; border-radius:24px; box-shadow:0 6px 0 #c8d4ee; }
.home-door-faq { background:#f7fcff; border-color:#8eb9cd; box-shadow:0 6px 0 #d2e5ec; }
.home-door-label { align-self:flex-start; padding:4px 10px; margin-bottom:16px; border-radius:99px; background:#d9f59c; color:#29426c; font-size:12px; font-weight:700; }
.home-door-faq .home-door-label { background:#e1f2fa; }
.home-door h2 { margin-bottom:12px; font-size:27px; line-height:1.5; }
.home-door p { color:#4a5d75; font-size:15px; line-height:1.9; }
.home-door .site-characters { justify-content:flex-start; margin:22px 0; gap:12px; }
.home-door .site-characters figure,.home-door .site-characters img { width:58px; }
.home-door .site-characters img { height:58px; }
.home-door .site-characters figcaption { font-size:11px; }
.home-door .site-navigation-cta { margin-top:auto; }
.home-door-faq .site-navigation-cta { margin-top:24px; background:#256382; border-color:#174860; box-shadow:0 3px 0 #174860; }
.home-topics { display:flex; flex-wrap:wrap; gap:8px; margin:22px 0; padding:0; list-style:none; }
.home-topics li { padding:4px 9px; border:1px solid #bfd8e5; border-radius:8px; color:#365b70; background:#fff; font-size:13px; }
.home-note { margin-top:30px; color:#52657d; font-size:13px; }
.home-footer { display:flex; justify-content:space-between; align-items:center; gap:16px; max-width:1120px; margin:0 auto; padding:22px 24px; border-top:1px solid #cbd6e5; color:#56657c; font-size:12px; }
.home-footer a { display:inline-flex; align-items:center; min-height:44px; color:#364ba2; text-underline-offset:4px; }
@media(max-width:820px) {
 .home-main { padding-top:30px; }
 .home-door { padding:24px; }
 .home-door h2 { font-size:23px; }
 .home-door .site-characters { gap:8px; }
 .home-door .site-characters figure,.home-door .site-characters img { width:46px; }
 .home-door .site-characters img { height:46px; }
}
@media(max-width:650px) {
 .home-main { padding:28px 16px 32px; }
 .home-intro { margin-bottom:22px; }
 .home-intro h1 { font-size:29px; }
 .home-intro>p:last-child { font-size:14px; }
 .home-doors { grid-template-columns:minmax(0,1fr); gap:22px; }
 .home-door { padding:22px 20px; border-radius:20px; }
 .home-door h2 { font-size:23px; margin-bottom:8px; }
 .home-door p { font-size:14px; }
 .home-door-label { margin-bottom:12px; }
 .home-door .site-characters { margin:16px 0 20px; gap:10px; }
 .home-door .site-characters figure,.home-door .site-characters img { width:40px; }
 .home-door .site-characters img { height:40px; }
 .home-door .site-navigation-cta { font-size:14px; }
 .home-topics { margin:16px 0; }
 .home-door-faq .site-navigation-cta { margin-top:4px; }
 .home-footer { padding-inline:16px; flex-wrap:wrap; }
}