@font-face {
  font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Black.woff2") format("woff2");
  font-style: normal;
  font-weight: 900;
  font-display: swap;
}

@font-face {
  font-family: "Wako Latin";
  src: url("../fonts/Roboto-Medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Wako Latin";
  src: url("../fonts/Roboto-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  --wako-blue: #2535a2;
  --wako-blue-hover: #004fe5;
  --wako-blue-light: #4d9eed;
  --wako-tint: #e7ecfc;
  --wako-ink: #282828;
  --wako-muted: #6e7183;
  --wako-line: #d6d6d6;
  --wako-white: #fff;
  --wako-danger: #d34747;
  --font-ja: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  --font-latin: "Wako Latin", "Arial Narrow", sans-serif;
  --header-height: 60px;
  --wide: 1100px;
  --narrow: 800px;
  --page-pad: clamp(24px, 5vw, 70px);
  --section-space: clamp(80px, 7.15vw, 120px);
  --radius-small: 10px;
  --shadow-soft: 0 14px 40px rgb(37 53 162 / 10%);
}