:root {
  --font-sans: "Noto Sans JP", "Yu Gothic", Meiryo, system-ui, sans-serif;
  --font-serif: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  --navy: #163953;
  --navy-dark: #0f2d45;
  --paper: #fff8f1;
  --paper-deep: #f5e9de;
  --white: #fff;
  --ink: #4f4a45;
  --muted: #6b655f;
  --line: #dfd2c5;
  --red: #b84935;
  --line-green: #087a38;
  --gold: #8d765f;
  --shadow: 0 18px 44px rgb(80 64 46 / 10%);
  --radius: 18px;
  --wrap: 1180px;
}

*, *::before, *::after { box-sizing: border-box; }
html { max-width: 100%; overflow-x: clip; scroll-behavior: smooth; }
body { max-width: 100%; margin: 0; overflow-wrap: anywhere; color: var(--ink); background: var(--white); font-family: var(--font-sans); font-size: 16px; line-height: 1.8; }
body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3 { overflow-wrap: normal; word-break: keep-all; color: var(--navy-dark); font-family: var(--font-serif); line-height: 1.45; text-wrap: balance; }
h1 { font-size: clamp(2rem, 4.2vw, 4rem); }
h2 { margin: 0 0 1rem; font-size: clamp(1.65rem, 3vw, 2.75rem); }
h3 { font-size: 1.18rem; }
p { margin: 0 0 1.2em; }
:focus-visible { outline: 3px solid var(--red); outline-offset: 4px; }
.wrap { width: min(calc(100% - 40px), var(--wrap)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 999; top: 8px; left: 8px; padding: .7rem 1rem; color: var(--white); background: var(--navy); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.eyebrow { margin-bottom: .65rem; color: var(--gold); font-size: .78rem; font-weight: 800; letter-spacing: .16em; }
.notice { padding: .75rem 1rem; border-left: 4px solid var(--gold); background: var(--paper); font-size: .9rem; }

@media (max-width: 420px) {
  h1 { font-size: clamp(1.75rem, 9vw, 2.35rem); }
  h2 { font-size: clamp(1.45rem, 7.5vw, 2rem); }
}

@media (max-width: 720px) {
  h1, h2, h3 { overflow-wrap: anywhere; line-break: strict; word-break: normal; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
}