@font-face {
  font-family: "Yomogi";
  src: url("./assets/fonts/yomogi.ttf") format("truetype");
  font-display: swap;
}

:root { color: #33495d; background: #eef7f8; font-family: "Hiragino Sans", "Yu Gothic", sans-serif; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; background: radial-gradient(circle at 12% 9%, #fff 0 5%, transparent 20%), linear-gradient(180deg, #dceff2 0, #f9fbf9 38%, #fffaf2 100%); }
.page-shell { width: min(760px, calc(100% - 32px)); margin: 0 auto; padding: 30px 0 64px; }
.brand { display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.brand img { width: 52px; height: 52px; object-fit: contain; }
.brand strong { font: 28px/1 "Yomogi", "Hiragino Sans", sans-serif; }
main { margin-top: 22px; padding: clamp(24px, 6vw, 46px); border: 1px solid rgba(91, 137, 151, .16); border-radius: 32px; background: rgba(255, 255, 255, .9); box-shadow: 0 15px 42px rgba(74, 118, 129, .12); }
h1, h2 { color: #345f71; }
h1 { margin: 0 0 14px; font: clamp(32px, 7vw, 48px)/1.18 "Yomogi", "Hiragino Sans", sans-serif; }
h2 { margin: 38px 0 12px; font-size: 19px; }
p, li { line-height: 1.9; }
.lead { margin: 0; font-size: 16px; }
.notice { margin: 24px 0 0; padding: 15px 17px; border-radius: 17px; background: #edf6ee; line-height: 1.75; }
.links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.links a { padding: 11px 16px; border-radius: 999px; background: #d8edf1; color: #28576c; font-weight: 700; text-decoration: none; }
a { color: #23718c; }
footer { padding: 22px 6px 0; color: #657986; font-size: 13px; text-align: center; }
footer a { margin: 0 8px; }
@media (max-width: 480px) { .page-shell { width: min(100% - 22px, 760px); padding-top: 18px; } main { border-radius: 25px; } }