:root { color-scheme: light; }
* { box-sizing: border-box; }
body { margin: 0; background: #f5f9fd; color: #24364b; font: 16px/1.75 "Noto Sans JP", "Noto Sans CJK JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", system-ui, sans-serif; }
.site-header { display: flex; align-items: center; min-height: 80px; padding: 12px max(16px, calc((100vw - 1200px) / 2)); background: #fff; border-bottom: 1px solid #d4e1ed; }
.site-header img { display: block; width: min(216px, 55vw); height: auto; }
main { max-width: 920px; margin: 32px auto; padding: 28px clamp(16px, 4vw, 44px); border: 1px solid #d4e1ed; border-radius: 20px; background: #fff; }
h1, h2 { color: #0f2d5b; line-height: 1.35; }
h1 { margin: 0 0 24px; font-size: clamp(30px, 4vw, 44px); }
h2 { margin: 32px 0 8px; font-size: 24px; }
p { margin: 0 0 14px; }
a { color: #007a89; text-underline-offset: .15em; }
a:focus-visible { outline: 3px solid #175cd3; outline-offset: 3px; }
footer { display: flex; flex-wrap: wrap; gap: 8px 24px; max-width: 920px; margin: 0 auto 32px; padding: 0 16px; font-size: 14px; }
@media (max-width: 767px) { .site-header { min-height: 64px; } main { margin: 16px; padding: 24px 16px; } h2 { font-size: 22px; } }