/*! Yaku Han JP v4.1.1 (OFL-1.1 AND MIT) by Qrac */
@font-face { font-family: "YakuHanJPs"; font-style: normal; font-weight: 300; font-display: swap; src: url("../fonts/YakuHanJPs-Light.woff2?v=20261010") format("woff2"); unicode-range: U+3008, U+3009, U+300A, U+300B, U+300C, U+300D, U+300E, U+300F, U+3010, U+3011, U+3014, U+3015, U+FF08, U+FF09, U+FF3B, U+FF3D, U+FF5B, U+FF5D; }
@font-face { font-family: "YakuHanJPs"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/YakuHanJPs-Regular.woff2?v=20261010") format("woff2"); unicode-range: U+3008, U+3009, U+300A, U+300B, U+300C, U+300D, U+300E, U+300F, U+3010, U+3011, U+3014, U+3015, U+FF08, U+FF09, U+FF3B, U+FF3D, U+FF5B, U+FF5D; }
@font-face { font-family: "YakuHanJPs"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/YakuHanJPs-Medium.woff2?v=20261010") format("woff2"); unicode-range: U+3008, U+3009, U+300A, U+300B, U+300C, U+300D, U+300E, U+300F, U+3010, U+3011, U+3014, U+3015, U+FF08, U+FF09, U+FF3B, U+FF3D, U+FF5B, U+FF5D; }
@font-face { font-family: "YakuHanJPs"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/YakuHanJPs-Bold.woff2?v=20261010") format("woff2"); unicode-range: U+3008, U+3009, U+300A, U+300B, U+300C, U+300D, U+300E, U+300F, U+3010, U+3011, U+3014, U+3015, U+FF08, U+FF09, U+FF3B, U+FF3D, U+FF5B, U+FF5D; }

@layer ds-base, ds-layout, ds-sections;

@layer ds-base {
  /* #region MARK:tokens */
  :root {
    --ds-navy: #004ea2;
    --ds-navy-deep: #003b7c;
    --ds-steel: #80a6d0;
    --ds-steel-deep: #4175af;
    --ds-orange: #f5a200;
    --ds-orange-tint: #fad07f;
    --ds-ink: #3e3a39;
    --ds-ink-soft: #6b6766;
    --ds-ink-mute: #595757;
    --ds-band: #e5ecf5;
    --ds-label: #150301;
    --ds-label-accent: #f19f00;
    --ds-paper: #f3f5f8;
    --ds-night: #0a0e17;
    --ds-white: #ffffff;
    --ds-rule: rgba(62, 58, 57, 0.16);
    --ds-glass-rgb: 247 249 252;
    --ds-shade-rgb: 14 18 26;
    --ds-glow-rgb: 120 170 255;

    --ds-focus-outer: var(--ds-navy-deep);
    --ds-focus-inner: var(--ds-white);
    --ds-focus-width: 2px;
    --ds-focus-offset: 3px;
    --ds-tap-min: 44px;
    --ds-tap-pad: 0px;

    --ds-font-ja: "YakuHanJPs", "Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
    --ds-font-en: "Inter", "YakuHanJPs", "Helvetica Neue", Arial, "Zen Kaku Gothic New", sans-serif;

    --ds-max: 1200px;
    --ds-gutter: clamp(16px, 5vw, 80px);
    --ds-frame: 2000px;
    --ds-edge: max(var(--ds-gutter), calc(50% - var(--ds-frame) / 2 + var(--ds-gutter)));
    --ds-section-y: clamp(72px, 12vw, 200px);
    --ds-header-h: clamp(64px, 6.4vw, 96px);

    --ds-fs-body: 14px;
    --ds-fs-heading: clamp(26px, 2.6vw, 42px);
    --ds-ls-heading: 0.22em;
    --ds-lh-heading: 1.9;

    --ds-ease: cubic-bezier(0.16, 1, 0.3, 1);

    --ds-hex-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 86.6' preserveAspectRatio='none'%3E%3Cpath d='M25 0H75L100 43.3L75 86.6H25L0 43.3Z'/%3E%3C/svg%3E");
  }

  @media (min-width: 640px) {
    :root {
      --ds-fs-body: 15px;
    }
  }

  @supports (padding: round(up, 1lh, 1px)) {
    :root {
      --ds-tap-pad: max(0px, round(up, (var(--ds-tap-min) - 1lh) / 2, 1px));
    }
  }
  /* #endregion */

  /* #region MARK:reset */
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  body {
    margin: 0;
    min-height: 100vh;
    background: var(--ds-paper);
    color: var(--ds-ink);
    font-family: var(--ds-font-ja);
    font-size: var(--ds-fs-body);
    font-weight: 400;
    line-height: 2;
    letter-spacing: 0.08em;
    font-kerning: normal;
    text-rendering: optimizeLegibility;
  }

  h1,
  h2,
  h3,
  p,
  figure,
  ol,
  ul,
  address,
  small {
    margin: 0;
  }

  h1,
  h2,
  h3 {
    font-size: inherit;
    font-weight: inherit;
  }

  ol,
  ul {
    padding: 0;
    list-style: none;
  }

  img,
  svg {
    display: block;
    max-width: 100%;
    height: auto;
  }

  address {
    font-style: normal;
  }

  small {
    font-size: inherit;
  }

  mark {
    background: none;
    color: inherit;
  }

  a {
    color: inherit;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
  }

  :focus-visible {
    outline: var(--ds-focus-width) solid var(--ds-focus-outer);
    outline-offset: var(--ds-focus-offset);
    box-shadow: 0 0 0 var(--ds-focus-offset) var(--ds-focus-inner);
  }
  /* #endregion */

  /* #region MARK:utility */
  .ds-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }

  .ds-nobr {
    display: inline-block;
  }

  .ds-br-pc {
    display: none;
  }

  @media (min-width: 1024px) {
    .ds-br-pc {
      display: inline;
    }

    .ds-nobr-pc {
      display: inline-block;
    }
  }

  @media (min-width: 1300px) {
    .ds-nobr-wide {
      display: inline-block;
    }
  }
  /* #endregion */

  /* #region MARK:hex */
  .ds-hex {
    display: grid;
    place-items: center;
    aspect-ratio: 1 / 0.866;
    padding-inline-start: 0.12em;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.12em;
    text-align: center;
    -webkit-mask: var(--ds-hex-mask) center / 100% 100% no-repeat;
    mask: var(--ds-hex-mask) center / 100% 100% no-repeat;
  }

  .ds-hex--steel {
    background: var(--ds-steel);
    color: var(--ds-white);
  }

  .ds-verb__title .ds-hex--steel {
    background: var(--ds-steel-deep);
  }

  .ds-hex--navy {
    background: var(--ds-navy);
    color: var(--ds-orange-tint);
  }
  /* #endregion */

  /* #region MARK:heading */
  .ds-hero__catch,
  .ds-features__title,
  .ds-flow__title,
  .ds-flow__closing {
    font-size: var(--ds-fs-heading);
    font-weight: 300;
    line-height: var(--ds-lh-heading);
    letter-spacing: var(--ds-ls-heading);
  }
  /* #endregion */
}
