@charset "UTF-8";

/* Site foundation. Common components belong in common.css. */
:root {
  --color-ink: #0c2445;
  --color-text: #24364c;
  --color-muted: #667787;
  --color-white: #fff;
  --color-green: #88b925;
  --color-green-dark: #587c1b;
  --color-blue: #149bd5;
  --color-line: #d5e9f3;
  --color-pale: #eff8fd;
  --color-focus: #067db4;
  --font-body: "Yu Gothic", "YuGothic", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
  --font-english: "Bahnschrift Condensed", "Arial Narrow", "Bahnschrift", sans-serif;
  --content-width: 1280px;
  --gutter: clamp(22px, 5.3vw, 80px);
  --section-space: clamp(64px, 7vw, 112px);
  --header-height: 72px;
  --transition: 220ms ease;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-height) + 24px); }
body { margin: 0; color: var(--color-text); background: var(--color-white); font-family: var(--font-body); font-size: 16px; font-weight: 500; line-height: 1.9; -webkit-text-size-adjust: 100%; }
body.is-menu-open { overflow: hidden; }
h1, h2, h3, h4, p, figure { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { color: inherit; cursor: pointer; }
button, input, textarea { border-radius: 0; }
button { -webkit-tap-highlight-color: transparent; }
img { display: block; max-width: 100%; height: auto; }
button:disabled { cursor: default; }
button, a { touch-action: manipulation; }
::selection { background: #d8ecb1; color: var(--color-ink); }
:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 5px; }
[hidden] { display: none !important; }
[id] { scroll-margin-top: calc(var(--header-height) + 30px); }
.u-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.u-text-green { color: var(--color-green-dark); }
.u-text-blue { color: var(--color-blue); }
.u-nowrap { white-space: nowrap; }
.l-container { width: min(calc(100% - var(--gutter) * 2), var(--content-width)); margin-inline: auto; }

@media (min-width: 1100px) { :root { --header-height: 88px; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}