@charset "UTF-8";
/* ========================================================
   カスケードレイヤーの順序定義
   ======================================================== */
/* assets/css/_layer-order.scss */
@layer reset, foundation, base, layout, components, project, utilities;
/* ========================================================
   Reset
   ======================================================== */
/*! modern-normalize v3.0.1 | MIT License | https://github.com/sindresorhus/modern-normalize */
/*
Document
========
*/
/**
Use a better box model (opinionated).
*/
@layer reset {
  *,
  ::before,
  ::after {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  /**
  1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
  2. Correct the line height in all browsers.
  3. Prevent adjustments of font size after orientation changes in iOS.
  4. Use a more readable tab size (opinionated).
  */
  html {
    font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* 1 */
    line-height: 1.15; /* 2 */
    -webkit-text-size-adjust: 100%; /* 3 */
    -moz-tab-size: 4;
      -o-tab-size: 4;
         tab-size: 4; /* 4 */
  }
  /*
  Sections
  ========
  */
  /**
  Remove the margin in all browsers.
  */
  body {
    margin: var(--spacing-0, 0);
  }
  /*
  Text-level semantics
  ====================
  */
  /**
  Add the correct font weight in Chrome and Safari.
  */
  b,
  strong {
    font-weight: bolder;
  }
  /**
  1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
  2. Correct the odd 'em' font sizing in all browsers.
  */
  code,
  kbd,
  samp,
  pre {
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  /**
  Add the correct font size in all browsers.
  */
  small {
    font-size: 80%;
  }
  /**
  Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
  */
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  /*
  Tabular data
  ============
  */
  /**
  Correct table border color inheritance in Chrome and Safari. (https://issues.chromium.org/issues/40615503, https://bugs.webkit.org/show_bug.cgi?id=195016)
  */
  table {
    border-color: currentcolor;
  }
  /*
  Forms
  =====
  */
  /**
  1. Change the font styles in all browsers.
  2. Remove the margin in Firefox and Safari.
  */
  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 1 */
    line-height: 1.15; /* 1 */
    margin: var(--spacing-0, 0); /* 2 */
  }
  /**
  Correct the inability to style clickable types in iOS and Safari.
  */
  button,
  [type=button],
  [type=reset],
  [type=submit] {
    -webkit-appearance: button;
  }
  /**
  Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
  */
  legend {
    padding: var(--spacing-0, 0);
  }
  /**
  Add the correct vertical alignment in Chrome and Firefox.
  */
  progress {
    vertical-align: baseline;
  }
  /**
  Correct the cursor style of increment and decrement buttons in Safari.
  */
  ::-webkit-inner-spin-button,
  ::-webkit-outer-spin-button {
    height: auto;
  }
  /**
  1. Correct the odd appearance in Chrome and Safari.
  2. Correct the outline style in Safari.
  */
  [type=search] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
  }
  /**
  Remove the inner padding in Chrome and Safari on macOS.
  */
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  /**
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Change font properties to 'inherit' in Safari.
  */
  ::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
  }
  /*
  Interactive
  ===========
  */
  /*
  Add the correct display in Chrome and Safari.
  */
  summary {
    display: list-item;
  }
}
/* ========================================================
   Base
   ======================================================== */
@layer base {
  html {
    scroll-behavior: smooth;
    scroll-padding-top: var(--header-height);
  }
  body {
    color: var(--semantic-text);
    font-family: var(--semantic-font-family-body-text);
    font-size: var(--semantic-font-size-body-fluid, var(--font-size-md));
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-lg);
    background-color: var(--semantic-bg-surface);
    container-type: inline-size;
    line-break: strict;
    text-rendering: optimizeLegibility;
    -webkit-text-size-adjust: 100%;
  }
  a {
    color: var(--semantic-link-fg, var(--color-teal-400));
    text-decoration: underline;
    text-underline-offset: 0.16em;
    text-decoration-thickness: 0.08em;
    -webkit-transition: color 0.15s ease, text-decoration-color 0.15s ease;
    transition: color 0.15s ease, text-decoration-color 0.15s ease;
  }
  a:visited {
    color: var(--semantic-link-fg-visited, var(--color-teal-500));
  }
  a:hover {
    color: var(--semantic-link-fg-hover, var(--color-teal-600));
    text-decoration-color: var(--semantic-link-fg-hover, currentColor);
  }
  a:active {
    color: var(--semantic-link-fg-active, var(--color-teal-700));
  }
  a:focus-visible {
    border-radius: 0.25rem;
    outline: none;
    -webkit-box-shadow: 0 0 0 0.2rem color-mix(in oklab, var(--semantic-focus-ring, #2684ff), transparent 60%);
            box-shadow: 0 0 0 0.2rem color-mix(in oklab, var(--semantic-focus-ring, #2684ff), transparent 60%);
  }
  img,
  svg,
  video,
  canvas {
    display: block;
    max-width: 100%;
    height: auto;
  }
  picture,
  figure {
    display: block;
  }
  [lang=ja] :is(h1, h2, h3, h4, h5, h6) {
    text-wrap: balance;
    -webkit-margin-before: var(--spacing-0);
            margin-block-start: var(--spacing-0);
  }
  @media (prefers-reduced-motion: reduce) {
    a {
      -webkit-transition: none;
      transition: none;
    }
  }
}
/* ========================================================
   Foundation
   ======================================================== */
.c-definition-list--stack {
  display: grid;
  grid-auto-rows: auto;
  gap: var(--spacing-md);
  margin-bottom: var(--spacing-md);
}
.c-definition-list--stack > .c-definition-list__group {
  display: grid;
  grid-template-columns: 1fr;
  grid-column: 1/-1;
  row-gap: var(--spacing-xs);
  -webkit-column-gap: 0;
     -moz-column-gap: 0;
          column-gap: 0;
  -webkit-border-after: var(--semantic-border-style-subtle);
          border-block-end: var(--semantic-border-style-subtle);
  padding-block: var(--definition-row-pad, var(--spacing-sm));
}
.c-definition-list--stack > .c-definition-list__group:last-child {
  -webkit-border-after: 0;
          border-block-end: 0;
}
.c-definition-list--stack > .c-definition-list__term,
.c-definition-list--stack > .c-definition-list__desc,
.c-definition-list--stack .c-definition-list__group > .c-definition-list__term,
.c-definition-list--stack .c-definition-list__group > .c-definition-list__desc {
  grid-column: 1;
  margin: var(--spacing-0);
  padding: var(--spacing-md) var(--spacing-2xl);
  text-align: left;
}
.c-definition-list--stack .c-definition-list__desc--primary,
.c-definition-list--stack .c-definition-list__desc--secondary {
  display: block;
  font-size: inherit;
  line-height: inherit;
  text-align: left;
  grid-area: auto;
}

@container item-list (max-width: 42rem) {
  .c-definition-list {
    display: grid;
    grid-auto-rows: auto;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
  }
  .c-definition-list > .c-definition-list__group {
    display: grid;
    grid-template-columns: 1fr;
    grid-column: 1/-1;
    row-gap: var(--spacing-xs);
    -webkit-column-gap: 0;
       -moz-column-gap: 0;
            column-gap: 0;
    -webkit-border-after: var(--semantic-border-style-subtle);
            border-block-end: var(--semantic-border-style-subtle);
    padding-block: var(--definition-row-pad, var(--spacing-sm));
  }
  .c-definition-list > .c-definition-list__group:last-child {
    -webkit-border-after: 0;
            border-block-end: 0;
  }
  .c-definition-list > .c-definition-list__term,
  .c-definition-list > .c-definition-list__desc,
  .c-definition-list .c-definition-list__group > .c-definition-list__term,
  .c-definition-list .c-definition-list__group > .c-definition-list__desc {
    grid-column: 1;
    margin: var(--spacing-0);
    padding: var(--spacing-md) var(--spacing-2xl);
    text-align: left;
  }
  .c-definition-list .c-definition-list__desc--primary,
  .c-definition-list .c-definition-list__desc--secondary {
    display: block;
    font-size: inherit;
    line-height: inherit;
    text-align: left;
    grid-area: auto;
  }
  .c-definition-list--arrow-right .c-definition-list__term::after {
    right: 50%;
    -webkit-transform: translate(50%, 0);
            transform: translate(50%, 0);
    content: "keyboard_double_arrow_down";
  }
}
@layer foundation {
  :root {
    --cq-item-list-1col: 42rem;
    --cq-item-list-2col: 76.5rem;
  }
}
@layer foundation {
  :root {
    --color-gray-100: #f5f5f5;
    --color-gray-200: #ebebeb;
    --color-gray-300: #d6d6d6;
    --color-gray-400: #c2c2c2;
    --color-gray-500: #adadad;
    --color-gray-600: #999999;
    --color-gray-700: #7b7b7b;
    --color-gray-800: #404040;
    --color-gray-900: #050505;
    --color-gray-100-rgb: 245 245 245;
    --color-gray-200-rgb: 235 235 235;
    --color-gray-300-rgb: 214 214 214;
    --color-gray-400-rgb: 194 194 194;
    --color-gray-500-rgb: 173 173 173;
    --color-gray-600-rgb: 153 153 153;
    --color-gray-700-rgb: 123 123 123;
    --color-gray-800-rgb: 64 64 64;
    --color-gray-900-rgb: 5 5 5;
    --color-magenta-100: #feeaf1;
    --color-magenta-200: #fdd4e3;
    --color-magenta-300: #fcbfd5;
    --color-magenta-400: #f87fab;
    --color-magenta-500: #f42a73;
    --color-magenta-600: #c3225c;
    --color-magenta-700: #921945;
    --color-magenta-800: #62112e;
    --color-magenta-900: #490d23;
    --color-magenta-100-rgb: 254 234 241;
    --color-magenta-200-rgb: 253 212 227;
    --color-magenta-300-rgb: 252 191 213;
    --color-magenta-400-rgb: 248 127 171;
    --color-magenta-500-rgb: 244 42 115;
    --color-magenta-600-rgb: 195 34 92;
    --color-magenta-700-rgb: 146 25 69;
    --color-magenta-800-rgb: 98 17 46;
    --color-magenta-900-rgb: 73 13 35;
    --color-yellow-100: #fef9e6;
    --color-yellow-200: #fdf4cc;
    --color-yellow-300: #fbe999;
    --color-yellow-400: #f9dd66;
    --color-yellow-500: #f5c700;
    --color-yellow-600: #c49f00;
    --color-yellow-700: #937700;
    --color-yellow-800: #625000;
    --color-yellow-900: #312800;
    --color-yellow-100-rgb: 254 249 230;
    --color-yellow-200-rgb: 253 244 204;
    --color-yellow-300-rgb: 251 233 153;
    --color-yellow-400-rgb: 249 221 102;
    --color-yellow-500-rgb: 245 199 0;
    --color-yellow-600-rgb: 196 159 0;
    --color-yellow-700-rgb: 147 119 0;
    --color-yellow-800-rgb: 98 80 0;
    --color-yellow-900-rgb: 49 40 0;
    --color-orange-100: #fef3e6;
    --color-orange-200: #fde7cc;
    --color-orange-300: #fbd099;
    --color-orange-400: #f9b866;
    --color-orange-500: #f58900;
    --color-orange-600: #c46e00;
    --color-orange-700: #935200;
    --color-orange-800: #623700;
    --color-orange-900: #311b00;
    --color-orange-100-rgb: 254 243 230;
    --color-orange-200-rgb: 253 231 204;
    --color-orange-300-rgb: 251 208 153;
    --color-orange-400-rgb: 249 184 102;
    --color-orange-500-rgb: 245 137 0;
    --color-orange-600-rgb: 196 110 0;
    --color-orange-700-rgb: 147 82 0;
    --color-orange-800-rgb: 98 55 0;
    --color-orange-900-rgb: 49 27 0;
    --color-green-100: #f3fde6;
    --color-green-200: #e8facd;
    --color-green-300: #d1f69c;
    --color-green-400: #b9f16a;
    --color-green-500: #8be807;
    --color-green-600: #6fba06;
    --color-green-700: #538b04;
    --color-green-800: #385d03;
    --color-green-900: #1c2e01;
    --color-green-100-rgb: 243 253 230;
    --color-green-200-rgb: 232 250 205;
    --color-green-300-rgb: 209 246 156;
    --color-green-400-rgb: 185 241 106;
    --color-green-500-rgb: 139 232 7;
    --color-green-600-rgb: 111 186 6;
    --color-green-700-rgb: 83 139 4;
    --color-green-800-rgb: 56 93 3;
    --color-green-900-rgb: 28 46 1;
    --color-blue-100: #e6f3fc;
    --color-blue-200: #cde7f8;
    --color-blue-300: #9ccff1;
    --color-blue-400: #6ab6eb;
    --color-blue-500: #399ee4;
    --color-blue-600: #0786dd;
    --color-blue-700: #066bb1;
    --color-blue-800: #045085;
    --color-blue-900: #033658;
    --color-blue-100-rgb: 230 243 252;
    --color-blue-200-rgb: 205 231 248;
    --color-blue-300-rgb: 156 207 241;
    --color-blue-400-rgb: 106 182 235;
    --color-blue-500-rgb: 57 158 228;
    --color-blue-600-rgb: 7 134 221;
    --color-blue-700-rgb: 6 107 177;
    --color-blue-800-rgb: 4 80 133;
    --color-blue-900-rgb: 3 54 88;
    --color-purple-100: #f3eefb;
    --color-purple-200: #e7dcf7;
    --color-purple-300: #cfbaef;
    --color-purple-400: #b697e8;
    --color-purple-500: #9e75e0;
    --color-purple-600: #8652d8;
    --color-purple-700: #6b42ad;
    --color-purple-800: #513182;
    --color-purple-900: #362158;
    --color-purple-100-rgb: 243 238 251;
    --color-purple-200-rgb: 231 220 247;
    --color-purple-300-rgb: 207 186 239;
    --color-purple-400-rgb: 182 151 232;
    --color-purple-500-rgb: 158 117 224;
    --color-purple-600-rgb: 134 82 216;
    --color-purple-700-rgb: 107 66 173;
    --color-purple-800-rgb: 81 49 130;
    --color-purple-900-rgb: 54 33 88;
    --color-white: #ffffff;
    --color-black: #000000;
    --color-white-rgb: 255 255 255;
    --color-black-rgb: 0 0 0;
    /* --------------------------------------------------------
       Gradients：クラデーション
    -------------------------------------------------------- */
    --gradient-blue-teal: linear-gradient(var(--gradient-angle-brand-primary) in hsl, var(--color-blue-500) 0%, var(--color-teal-500) 50%);
    --gradient-blue-teal-vivid: linear-gradient(var(--gradient-angle-brand-primary), #0c9ff5 10%, #11c0f1 25%, var(--color-teal-300) 45%, var(--color-teal-400) 70%);
    --gradient-white-teal: linear-gradient(var(--gradient-angle-brand-primary) in hsl, var(--color-gray-200) 0%, var(--color-teal-400) 100%);
    --gradient-blue-teal-pale: linear-gradient(var(--gradient-angle-brand-primary) in hsl, var(--color-teal-300) 20%, var(--color-blue-400) 70%);
    --gradient-glass-blue: linear-gradient(var(--gradient-angle-brand-primary) in hsl, var(--color-blue-300) 10%, var(--color-gray-600) 80%);
    --gradient-gray-pale: linear-gradient(var(--gradient-angle-vertical-top-to-bottom), var(--color-gray-200) 20%, var(--color-gray-300) 70%);
    --gradient-gray-pale-left-to-right: linear-gradient(var(--gradient-angle-horizontal-left-to-right), var(--color-gray-200) 20%, var(--color-gray-300) 70%);
    /* --------------------------------------------------------
       Alpha（rgb() / slash 構文）
    -------------------------------------------------------- */
    --color-white-alpha-70: rgb(var(--color-white-rgb) / var(--opacity-70));
    --color-black-alpha-20: rgb(var(--color-black-rgb) / var(--opacity-20));
    --color-black-alpha-40: rgb(var(--color-black-rgb) / var(--opacity-40));
    --color-black-alpha-70: rgb(var(--color-black-rgb) / var(--opacity-70));
    --color-gray-400-alpha-20: rgb(var(--color-gray-40-rgb) / var(--opacity-20));
    --color-gray-500-alpha-50: rgb(var(--color-gray-500-rgb) / var(--opacity-50));
    --color-teal-300-alpha-70: rgb(var(--color-teal-300-rgb) / var(--opacity-70));
    --color-teal-400-alpha-70: rgb(var(--color-teal-400-rgb) / var(--opacity-70));
    --color-blue-400-alpha-70: rgb(var(--color-blue-400-rgb) / var(--opacity-70));
    --color-blue-500-alpha-70: rgb(var(--color-blue-500-rgb) / var(--opacity-70));
    --color-blue-900-alpha-20: rgb(var(--color-blue-900-rgb) / var(--opacity-20));
    /* --------------------------------------------------------
       Gradients ＋ Alpha（rgb() / slash 構文）
    -------------------------------------------------------- */
    --gradient-glass-blue-alpha-30: linear-gradient(var(--gradient-angle-glass-blue), rgb(var(--color-white-rgb) / var(--opacity-30)) 10%, rgb(var(--color-blue-200-rgb) / var(--opacity-30)) 30%, rgb(var(--color-teal-200-rgb) / var(--opacity-30)) 80%);
    --gradient-glass-gray-alpha-20: linear-gradient(var(--gradient-angle-glass-blue), rgb(var(--color-white-rgb) / var(--opacity-20)) 10%, rgb(var(--color-blue-200-rgb) / var(--opacity-20)) 30%, rgb(var(--color-gray-200-rgb) / var(--opacity-20)) 80%);
    --gradient-blue-teal-pale-alpha-70: linear-gradient(var(--gradient-angle-brand-primary), rgb(var(--color-blue-300-rgb) / var(--opacity-70)) 20%, rgb(var(--color-teal-400-rgb) / var(--opacity-70)) 70%);
  }
}
@layer foundation {
  :root {
    --font-family-ibm-plex-sans-jp: "IBM Plex Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Meiryo", sans-serif;
    --font-family-sarabun: "Sarabun", sans-serif;
    --font-icon: "Material Symbols Outlined";
  }
}
@layer foundation {
  :root {
    --font-size-2xs: 0.625rem;
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-md: 1.0625rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 2rem;
    --font-size-4xl: 2.5rem;
    --font-size-5xl: 3rem;
    --font-size-6xl: 3.5rem;
    --font-size-7xl: 4rem;
    --font-size-8xl: 5rem;
    --font-size-9xl: 6rem;
    --font-size-10xl: 8rem;
    --line-height-3xs: 0.8;
    --line-height-2xs: 1;
    --line-height-xs: 1.3;
    --line-height-sm: 1.4;
    --line-height-md: 1.75;
    --line-height-lg: 1.8;
    --line-height-xl: 2;
    --line-height-2xl: 2.5;
    --line-height-3xl: 3;
    --line-height-4xl: 4;
    --line-height-5xl: 6;
    --letter-spacing-2xs: -0.2em;
    --letter-spacing-xs: -0.05em;
    --letter-spacing-sm: -0.025em;
    --letter-spacing-md: 0em;
    --letter-spacing-lg: 0.05em;
    --letter-spacing-xl: 0.1em;
    --letter-spacing-2xl: 0.15em;
    --font-weight-thin: 100;
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;
    --font-weight-black: 900;
    --font-style-normal: normal;
    --font-style-italic: italic;
    --font-style-oblique: oblique;
    --font-style-oblique-angle: 10deg;
    --fluid-min-width: 360px;
    --fluid-max-width: 1440px;
    --fluid-range: 1080;
    --fluid-range-inv: calc(1 / var(--fluid-range));
    --fluid-min-w: 360;
    --fluid-max-w: 1440;
    --_fluid-range-w: 1080;
    --fluid-amp-primitives: 1;
    --fs-2xs-min: var(--font-size-2xs);
    --fs-2xs-max: var(--font-size-xs);
    --fs-2xs-intercept-rem: 0.5833333333rem;
    --fs-2xs-slope-vw: 0.1851851852vw;
    --font-size-2xs-fluid: clamp(var(--fs-2xs-min), calc(var(--fs-2xs-intercept-rem) + var(--fs-2xs-slope-vw) * var(--fluid-amp-primitives)), var(--fs-2xs-max));
    --fs-xs-min: var(--font-size-xs);
    --fs-xs-max: var(--font-size-sm);
    --fs-xs-intercept-rem: 0.7083333333rem;
    --fs-xs-slope-vw: 0.1851851852vw;
    --font-size-xs-fluid: clamp(var(--fs-xs-min), calc(var(--fs-xs-intercept-rem) + var(--fs-xs-slope-vw) * var(--fluid-amp-primitives)), var(--fs-xs-max));
    --fs-sm-min: var(--font-size-sm);
    --fs-sm-max: var(--font-size-md);
    --fs-sm-intercept-rem: 0.8125rem;
    --fs-sm-slope-vw: 0.2777777778vw;
    --font-size-sm-fluid: clamp(var(--fs-sm-min), calc(var(--fs-sm-intercept-rem) + var(--fs-sm-slope-vw) * var(--fluid-amp-primitives)), var(--fs-sm-max));
    --fs-md-min: var(--font-size-md);
    --fs-md-max: var(--font-size-lg);
    --fs-md-intercept-rem: 1.0416666667rem;
    --fs-md-slope-vw: 0.0925925926vw;
    --font-size-md-fluid: clamp(var(--fs-md-min), calc(var(--fs-md-intercept-rem) + var(--fs-md-slope-vw) * var(--fluid-amp-primitives)), var(--fs-md-max));
    --fs-lg-min: var(--font-size-lg);
    --fs-lg-max: var(--font-size-xl);
    --fs-lg-intercept-rem: 1.0833333333rem;
    --fs-lg-slope-vw: 0.1851851852vw;
    --font-size-lg-fluid: clamp(var(--fs-lg-min), calc(var(--fs-lg-intercept-rem) + var(--fs-lg-slope-vw) * var(--fluid-amp-primitives)), var(--fs-lg-max));
    --fs-xl-min: var(--font-size-xl);
    --fs-xl-max: var(--font-size-2xl);
    --fs-xl-intercept-rem: 1.1666666667rem;
    --fs-xl-slope-vw: 0.3703703704vw;
    --font-size-xl-fluid: clamp(var(--fs-xl-min), calc(var(--fs-xl-intercept-rem) + var(--fs-xl-slope-vw) * var(--fluid-amp-primitives)), var(--fs-xl-max));
    --fs-2xl-min: var(--font-size-2xl);
    --fs-2xl-max: var(--font-size-3xl);
    --fs-2xl-intercept-rem: 1.3333333333rem;
    --fs-2xl-slope-vw: 0.7407407407vw;
    --font-size-2xl-fluid: clamp(var(--fs-2xl-min), calc(var(--fs-2xl-intercept-rem) + var(--fs-2xl-slope-vw) * var(--fluid-amp-primitives)), var(--fs-2xl-max));
    --fs-3xl-min: var(--font-size-3xl);
    --fs-3xl-max: var(--font-size-4xl);
    --fs-3xl-intercept-rem: 1.8333333333rem;
    --fs-3xl-slope-vw: 0.7407407407vw;
    --font-size-3xl-fluid: clamp(var(--fs-3xl-min), calc(var(--fs-3xl-intercept-rem) + var(--fs-3xl-slope-vw) * var(--fluid-amp-primitives)), var(--fs-3xl-max));
    --fs-4xl-min: var(--font-size-4xl);
    --fs-4xl-max: var(--font-size-5xl);
    --fs-4xl-intercept-rem: 2.3333333333rem;
    --fs-4xl-slope-vw: 0.7407407407vw;
    --font-size-4xl-fluid: clamp(var(--fs-4xl-min), calc(var(--fs-4xl-intercept-rem) + var(--fs-4xl-slope-vw) * var(--fluid-amp-primitives)), var(--fs-4xl-max));
    --fs-5xl-min: var(--font-size-5xl);
    --fs-5xl-max: var(--font-size-6xl);
    --fs-5xl-intercept-rem: 2.8333333333rem;
    --fs-5xl-slope-vw: 0.7407407407vw;
    --font-size-5xl-fluid: clamp(var(--fs-5xl-min), calc(var(--fs-5xl-intercept-rem) + var(--fs-5xl-slope-vw) * var(--fluid-amp-primitives)), var(--fs-5xl-max));
    --fs-6xl-min: var(--font-size-6xl);
    --fs-6xl-max: var(--font-size-7xl);
    --fs-6xl-intercept-rem: 3.3333333333rem;
    --fs-6xl-slope-vw: 0.7407407407vw;
    --font-size-6xl-fluid: clamp(var(--fs-6xl-min), calc(var(--fs-6xl-intercept-rem) + var(--fs-6xl-slope-vw) * var(--fluid-amp-primitives)), var(--fs-6xl-max));
    --fs-7xl-min: var(--font-size-7xl);
    --fs-7xl-max: var(--font-size-8xl);
    --fs-7xl-intercept-rem: 3.6666666667rem;
    --fs-7xl-slope-vw: 1.4814814815vw;
    --font-size-7xl-fluid: clamp(var(--fs-7xl-min), calc(var(--fs-7xl-intercept-rem) + var(--fs-7xl-slope-vw) * var(--fluid-amp-primitives)), var(--fs-7xl-max));
    --fs-8xl-min: var(--font-size-8xl);
    --fs-8xl-max: var(--font-size-9xl);
    --fs-8xl-intercept-rem: 4.6666666667rem;
    --fs-8xl-slope-vw: 1.4814814815vw;
    --font-size-8xl-fluid: clamp(var(--fs-8xl-min), calc(var(--fs-8xl-intercept-rem) + var(--fs-8xl-slope-vw) * var(--fluid-amp-primitives)), var(--fs-8xl-max));
    --fs-9xl-min: var(--font-size-9xl);
    --fs-9xl-max: var(--font-size-10xl);
    --fs-9xl-intercept-rem: 5.3333333333rem;
    --fs-9xl-slope-vw: 2.962962963vw;
    --font-size-9xl-fluid: clamp(var(--fs-9xl-min), calc(var(--fs-9xl-intercept-rem) + var(--fs-9xl-slope-vw) * var(--fluid-amp-primitives)), var(--fs-9xl-max));
    --fs-10xl-min: var(--font-size-10xl);
    --fs-10xl-max: var(--font-size-10xl);
    --fs-10xl-intercept-rem: 8rem;
    --fs-10xl-slope-vw: 0vw;
    --font-size-10xl-fluid: clamp(var(--fs-10xl-min), calc(var(--fs-10xl-intercept-rem) + var(--fs-10xl-slope-vw) * var(--fluid-amp-primitives)), var(--fs-10xl-max));
    --font-size-ui-14to16-fluid: clamp(0.875rem, calc(0.8333333333rem + 0.1851851852vw * var(--fluid-amp-ui)), 1rem);
    --font-size-ui-17to20-fluid: clamp(1.0625rem, calc(1rem + 0.2777777778vw * var(--fluid-amp-ui)), 1.25rem);
    --font-size-ui-24to28-fluid: clamp(1.5rem, calc(1.4166666667rem + 0.3703703704vw * var(--fluid-amp-ui)), 1.75rem);
    --font-size-ui-32to36-fluid: clamp(2rem, calc(1.9166666667rem + 0.3703703704vw * var(--fluid-amp-ui)), 2.25rem);
    --font-size-20to24-fluid: clamp(1.25rem, calc(1.1666666667rem + 0.3703703704vw * var(--fluid-amp-top-hero)), 1.5rem);
    --font-size-20to40-fluid: clamp(1.25rem, calc(0.8333333333rem + 1.8518518519vw * var(--fluid-amp-top-hero)), 2.5rem);
    --font-size-24to32-fluid: clamp(1.5rem, calc(1.3333333333rem + 0.7407407407vw * var(--fluid-amp-top-hero)), 2rem);
    --font-size-24to64-fluid: clamp(1.5rem, calc(0.6666666667rem + 3.7037037037vw * var(--fluid-amp-top-hero)), 4rem);
    --font-size-48to64-fluid: clamp(3rem, calc(2.6666666667rem + 1.4814814815vw * var(--fluid-amp-top-hero)), 4rem);
    --font-size-64to96-fluid: clamp(4rem, calc(3.3333333333rem + 2.962962963vw * var(--fluid-amp-top-hero)), 6rem);
    --font-size-64to187-fluid: clamp(4rem, calc(1.4375rem + 11.3888888889vw * var(--fluid-amp-top-hero)), 11rem);
    --font-size-96to144-fluid: clamp(6rem, calc(5rem + 4.4444444444vw * var(--fluid-amp-top-hero)), 9rem);
    --font-size-top-bg-96to160-fluid: clamp(6rem, calc(4.6666666667rem + 5.9259259259vw * var(--fluid-amp-top-hero)), 10rem);
    --spacing-0: 0rem;
    --spacing-2xs: 0.125rem;
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 2.5rem;
    --spacing-3xl: 4rem;
    --spacing-4xl: 5rem;
    --spacing-5xl: 8rem;
    --spacing-6xl: 16rem;
    --spacing-7xl: 20rem;
    --spacing-8xl: 24rem;
    --spacing-9xl: 32rem;
    --spacing-neg-2xs: -0.125rem;
    --spacing-neg-xs: -0.25rem;
    --spacing-neg-sm: -0.5rem;
    --spacing-neg-md: -1rem;
    --spacing-neg-lg: -1.5rem;
    --spacing-neg-xl: -2rem;
    --spacing-neg-2xl: -2.5rem;
    --spacing-neg-3xl: -4rem;
    --spacing-neg-4xl: -5rem;
    --spacing-neg-5xl: -8rem;
    --spacing-neg-6xl: -16rem;
    --spacing-neg-7xl: -20rem;
    --spacing-neg-8xl: -24rem;
    --spacing-neg-9xl: -32rem;
    --radius-0: 0;
    --radius-xs: 4px;
    --radius-sm: 8px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --radius-xl: 40px;
    --radius-full: 9999px;
    --container-max: 1220px;
    --container-gutter: 2rem;
    --layout-columns-gap: 3rem;
    --layout-columns-cols: 1;
    --layout-cards-gap: 1.5rem;
    --layout-cards-cols: 1;
    --breakpoint-sm: 480px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 1024px;
    --breakpoint-xl: 1280px;
    /* RGBA色成分（プリミティブ値） */
    --shadow-color-black-opacity-08: 0 0 0 / var(--opacity-8);
    --shadow-color-black-opacity-10: 0 0 0 / var(--opacity-10);
    --shadow-color-black-opacity-12: 0 0 0 / var(--opacity-12);
    /* シャドウプリセット（長さ＋色の組み合わせ） */
    --shadow-default: var(--spacing-0) var(--spacing-2xs) var(--spacing-xs) rgb(var(--shadow-color-black-opacity-08));
    --shadow-card: var(--spacing-0) var(--spacing-2xs) var(--spacing-2xs) rgb(var(--shadow-color-black-opacity-12));
    --z-index-base: 0;
    --z-index-under: -1;
    --z-index-layer-low: 10;
    --z-index-layer-mid: 20;
    --z-index-layer-high: 30;
    --z-index-header: 100;
    --z-index-modal: 1000;
    --z-index-overlay: 2000;
    --transition-default: all 0.3s ease;
    --transition-fast: all 0.15s ease;
    --transition-slow: all 0.5s ease;
    --duration-fast: 150ms;
    --duration-base: 300ms;
    --duration-slow: 500ms;
    --opacity-0: 0;
    --opacity-8: 0.08;
    --opacity-10: 0.1;
    --opacity-12: 0.12;
    --opacity-20: 0.2;
    --opacity-30: 0.3;
    --opacity-40: 0.4;
    --opacity-50: 0.5;
    --opacity-60: 0.6;
    --opacity-70: 0.7;
    --opacity-80: 0.8;
    --opacity-90: 0.9;
    --opacity-100: 1;
    --border-width-hairline: 0.5px;
    --border-width-thin: 1px;
    --border-width-bold: 2px;
    --border-width-heavy: 4px;
    --aspect-ratio-1x1: 1 / 1;
    --aspect-ratio-16x9: 16 / 9;
    --aspect-ratio-4x3: 4 / 3;
    --blur-sm: 4px;
    --blur-md: 8px;
    --blur-lg: 16px;
    --blur-xl: 20px;
    --max-lines-1: 1;
    --max-lines-2: 2;
    --max-lines-3: 3;
    --max-lines-5: 5;
    --gradient-angle-glass-blue: 144deg;
    --gradient-angle-brand-primary: 120deg;
    --gradient-angle-horizontal-left-to-right: 90deg;
    --gradient-angle-horizontal-right-to-left: 270deg;
    --gradient-angle-vertical-top-to-bottom: 180deg;
    --gradient-angle-vertical-bottom-to-top: 0deg;
    --ui-height-4xs: 0.5rem;
    --ui-height-3xs: 1rem;
    --ui-height-2xs: 1.25rem;
    --ui-height-xs: 1.5rem;
    --ui-height-sm: 2rem;
    --ui-height-md: 2.5rem;
    --ui-height-lg: 3rem;
    --ui-height-xl: 3.5rem;
    --ui-height-2xl: 4rem;
    --ui-height-touch-min: 2.75rem;
    --ui-block-size-4xs: var(--ui-height-4xs);
    --ui-block-size-3xs: var(--ui-height-3xs);
    --ui-block-size-2xs: var(--ui-height-2xs);
    --ui-block-size-xs: var(--ui-height-xs);
    --ui-block-size-sm: var(--ui-height-sm);
    --ui-block-size-md: var(--ui-height-md);
    --ui-block-size-lg: var(--ui-height-lg);
    --ui-block-size-xl: var(--ui-height-xl);
    --ui-block-size-2xl: var(--ui-height-2xl);
    --ui-inset-offset-2xs: var(--spacing-2xs);
    --ui-inset-offset-xs: var(--spacing-xs);
    --ui-inset-offset-sm: var(--spacing-sm);
    --ui-inset-offset-md: var(--spacing-md);
    --ui-inset-offset-lg: var(--spacing-lg);
    --ui-inset-block-start-default: var(--ui-inset-offset-sm);
    --ui-inset-inline-end-default: var(--ui-inset-offset-sm);
    --ui-pad-inline-micro: 0.5em;
    --ui-pad-block-micro: 0.25em;
    --ui-pad-inline-compact: 0.75em;
    --ui-pad-block-compact: 0.375em;
    --ui-pad-inline-regular: 1em;
    --ui-pad-block-regular: 0.5em;
    --ui-pad-inline-comfortable: 1.25em;
    --ui-pad-block-comfortable: 0.625em;
    --container-fill-default: 0.95;
    --container-cap-default: 999rem;
    --container-gutter-min: 1rem;
    --container-gutter-max: 2rem;
    --container-gutter-fluid: clamp(var(--container-gutter-min), 4vw, var(--container-gutter-max));
    --container-max-default-min: 64rem;
    --container-max-default-max: 76.25rem;
    --container-max-default-fluid: clamp(var(--container-max-default-min), calc(var(--container-max-default-min) + (var(--container-max-default-max) - var(--container-max-default-min)) * (100vw - var(--fluid-min-width)) * var(--fluid-range-inv)), var(--container-max-default-max));
    --container-max-narrow-min: 64rem;
    --container-max-narrow-max: 82rem;
    --container-max-narrow-fluid: clamp(var(--container-max-narrow-min), calc(var(--container-max-narrow-min) + (var(--container-max-narrow-max) - var(--container-max-narrow-min)) * (100vw - var(--fluid-min-width)) * var(--fluid-range-inv)), var(--container-max-narrow-max));
    --container-max-lead-min: 37.5rem;
    --container-max-lead-max: 45rem;
    --container-max-lead-fluid: clamp(var(--container-max-lead-min), calc(var(--container-max-lead-min) + (var(--container-max-lead-max) - var(--container-max-lead-min)) * (100vw - var(--fluid-min-width)) * var(--fluid-range-inv)), var(--container-max-lead-max));
    --container-max-wide-min: 76.25rem;
    --container-max-wide-max: 90rem;
    --container-max-wide-fluid: clamp(var(--container-max-wide-min), calc(var(--container-max-wide-min) + (var(--container-max-wide-max) - var(--container-max-wide-min)) * (100vw - var(--fluid-min-width)) * var(--fluid-range-inv)), var(--container-max-wide-max));
    --figure-max-inline-narrow: var(--container-max-narrow-fluid);
    --figure-max-inline-default: var(--container-max-default-fluid);
    --figure-max-inline-wide: var(--container-max-wide-fluid);
    --figure-min-inline: 20rem;
    --section-gap-min: 3rem;
    --section-gap-max: 8rem;
    --section-gap-fluid: clamp(var(--section-gap-min), calc(2rem + 4vw), var(--section-gap-max));
  }
  @media (min-width: 768px) {
    :root :root {
      --font-size-top-bg-96to160-fluid: 2rem;
    }
  }
}
@layer foundation {
  :root {
    --semantic-text: var(--color-gray-900);
    --semantic-text-subtle: var(--color-gray-500);
    --semantic-text-inverse: var(--color-white);
    --semantic-text-caption-lead: var(--color-teal-400);
    --semantic-text-accent: var(--color-teal-400);
    --semantic-bg-surface: var(--color-gray-100);
    --semantic-bg-muted: var(--color-gray-200);
    --semantic-bg-figure: var(--color-white);
    --semantic-bg-info-box: var(--color-gray-200);
    --semantic-bg-overlay-top-movie: var(--color-black-alpha-40);
    --semantic-bg-overlay-dialog: var(--color-black-alpha-70);
    --semantic-bg-accent: var(--color-teal-400);
    --semantic-border-color: var(--color-gunmetal-teal);
    --semantic-border-color-subtle: var(--color-gray-300);
    --semantic-border-color-neutral: var(--color-gray-400);
    --semantic-border-color-strong: var(--color-gray-500);
    --semantic-border-color-stronger: var(--color-gray-700);
    --semantic-border-color-strongest: var(--color-gray-900);
    --semantic-border-color-inverse: var(--color-white);
    --semantic-border-color-accent-teal: var(--color-teal-400);
    --semantic-border-color-accent-blue: var(--color-blue-500);
    --semantic-border-style-subtle: 1px solid var(--semantic-border-color-subtle);
    --semantic-border-style-neutral: 1px solid var(--semantic-border-color-neutral);
    --semantic-border-style-strong: 1px solid var(--semantic-border-color-strong);
    --semantic-border-style-stronger: 1px solid var(--semantic-border-color-stronger);
    --semantic-border-style-strongest: 1px solid var(--semantic-border-color-strongest);
    --semantic-border-style-inverse: 1px solid var(--semantic-border-color-inverse);
    --semantic-border-style-brand: 1px solid var(--semantic-border-color-accent-teal);
    --semantic-text-sub-page-hero-catch: var(--color-gray-700);
    --semantic-link-fg: var(--color-teal-300);
    --semantic-link-fg-visited: var(--color-teal-300);
    --semantic-link-fg-hover: var(--color-teal-500);
    --semantic-link-fg-active: var(--color-teal-500);
    --semantic-link-current-color: var(--color-teal-500);
    --semantic-focus-ring: var(--color-teal-500);
    --semantic-text-global-nav: var(--color-gray-800);
    --semantic-bg-global-nav: var(--gradient-glass-blue-alpha-30);
    --semantic-border-style-global-nav: 1px solid var(--gradient-glass-gray-alpha-20);
    --semantic-border-color-global-nav: var(--gradient-glass-gray-alpha-20);
    --semantic-shadow-global-nav: var(--shadow-default);
    --semantic-text-global-nav-sub-menu-hover: var(--color-teal-500);
    --semantic-bg-global-nav-sub-menu-hover: var(--gradient-blue-teal-vivid);
    --semantic-bg-hamburger-nav-ber: var(--color-green-500);
    --semantic-bg-anchor-nav: var(--gradient-glass-blue-alpha-30);
    --semantic-border-color-anchor-nav: 1px solid var(--color-gray-500-alpha-50);
    --semantic-border-style-anchor-nav: var(--color-gray-500-alpha-50);
    --semantic-text-color-anchor-nav: var(--color-gunmetal-teal);
    --semantic-text-color-anchor-nav-icon: var(--color-teal-300);
    --semantic-bg-cta-card: var(--color-blue-900-alpha-20);
    --semantic-border-color-cta-card: 1px solid var(--gradient-glass-blue);
    --semantic-border-style-cta-card: 1px solid var(--semantic-border-color-cta-card);
    --semantic-button-child-page-link-bg: var(--color-gray-300);
    --semantic-button-child-page-link-bg--hover: var(--gradient-blue-teal-pale);
    --semantic-button-primary-bg: var(--color-teal-300);
    --semantic-button-primary-text: var(--color-green-500);
    --semantic-button-primary-text--hover: var(--color-teal-400);
    --semantic-button-primary-border--hover: var(--color-teal-400);
    --semantic-button-secondary-bg: var(--gradient-white-teal);
    --semantic-button-secondary-text: var(--color-white);
    --semantic-button-cta-bg: var(--gradient-blue-teal-vivid);
    --semantic-button-cta-text: var(--color-white);
    --semantic-bg-button-floating--default: var(--color-black);
    --semantic-bg-button-floating--hover: var(--gradient-glass-gray-alpha-20);
    --semantic-bg-button-floating--active: color-mix(in oklab, var(--color-gray-900) 88%, white);
    --semantic-text-button-floating: var(--color-white);
    --semantic-bg-button-floating: var(--gradient-glass-blue-alpha-30);
    --semantic-border-style-button-floating: 1px solid var(--gradient-glass-gray-alpha-20);
    --semantic-border-color-button-floating: var(--gradient-glass-gray-alpha-20);
    --semantic-shadow-button-floating: var(--shadow-default);
    --semantic-bg-table-thead_th--default: var(--color-blue-400);
    --semantic-bg-table-tbody-th--default: var(--color-gray-300);
    --semantic-bg-table-tbody-td--default: var(--semantic-bg-surface);
    --semantic-bg-table-row--stripe: var(--color-gray-100);
    --semantic-bg-table-row--hover: var(--color-gray-300);
    --semantic-bg-table-emphasis: var(--color-red-100);
    --semantic-bg-table-emphasis-hover: var(--color-red-200);
    --semantic-bg-table-thead-th--scroll-fade: var(--color-blue-400-alpha-70);
    --semantic-bg-table-tbody-td--scroll-fade: var(--color-white-alpha-70);
    --semantic-color-table-scroll-hint: var(--color-white);
    --semantic-bg-table-scroll-hint: var(--color-black-alpha-70);
    --semantic-text-list-label: var(--color-teal-400);
    --semantic-bg-list: var(--color-gray-200);
    --semantic-color-annotation-list: var(--semantic-text-subtle);
    --semantic-bg-definition-term--default: var(--color-blue-400);
    --semantic-bg-definition-desc--default: var(--color-white);
    --semantic-bg-definition-term--accent-teal: var(--color-teal-400);
    --semantic-bg-definition-term--accent-gradient-blue: var(--gradient-blue-teal-pale);
    --semantic-bg-definition-desc--muted: var(--color-gray-100);
    --semantic-text-point-label: var(--color-teal-500);
    --semantic-text-point-icon-arrow: var(--color-teal-500);
    --semantic-text-label: var(--color-white);
    --semantic-bg-label-primary: var(--color-teal-400);
    --semantic-bg-label-secondary: var(--color-blue-400);
    --semantic-bg-label-gradient-teal: var(--gradient-blue-teal-vivid);
    --semantic-bg-label-primary--hover: var(--color-teal-300);
    --semantic-bg-label-secondary--hover: var(--color-blue-300);
    --semantic-bg-dialog-window-header: var(--color-teal-400);
    --semantic-text-dialog-window-header-title: var(--color-white);
    --semantic-bg-dialog-window-help-button-hover: var(--color-teal-400);
    --semantic-bg-legend: var(--color-gray-300);
    --semantic-icon-color--default: var(--color-teal-500);
    --semantic-icon-color--inverse: var(--color-white);
    --semantic-font-color-caption-title: var(--semantic-text-subtle);
    --semantic-font-color-caption-notion: var(--semantic-text-subtle);
    --semantic-font-color-notion: var(--semantic-text-subtle);
    --semantic-font-color-notion-footer: var(--semantic-text-inverse);
  }
}
@layer foundation {
  :root {
    --semantic-radius-none: 0;
    --semantic-radius-xs: var(--radius-xs);
    --semantic-radius-sm: var(--radius-sm);
    --semantic-radius-md: var(--radius-md);
    --semantic-radius-lg: var(--radius-lg);
    --semantic-radius-xl: var(--radius-xl);
    --semantic-radius-2xl: var(--radius-2xl);
    --semantic-radius-full: var(--radius-full);
    --semantic-border-width-hairline: var(--border-width-hairline);
    --semantic-border-width-thin: var(--border-width-thin);
    --semantic-border-width-regular: var(--border-width-regular);
    --semantic-border-width-thick: var(--border-width-thick);
    --semantic-border-style-solid: solid;
    --semantic-border-style-dashed: dashed;
    --semantic-outline-width: var(--border-width-regular);
    --semantic-outline-offset: 2px;
    --semantic-outline-style: solid;
    --semantic-radius-button: var(--radius-sm);
    --semantic-border-width-button: var(--border-width-thin);
    --semantic-border-style-button: solid;
    --semantic-radius-dialog-window: var(--semantic-radius-xl);
    --semantic-radius-card: var(--radius-xl);
    --semantic-border-width-card: var(--border-width-hairline);
    --semantic-border-style-card: solid;
    --semantic-radius-global-nav: var(--radius-full);
    --semantic-border-width-global-nav: var(--border-width-hairline);
    --semantic-radius-global-nav-off-canvas-bg: var(--radius-xl);
    --semantic-radius-table: 0;
    --semantic-border-width-table: var(--border-width-hairline);
    --semantic-border-style-table: solid;
    --semantic-list-indent: 1.25em;
    --semantic-list-nesting-step: 1em;
    --semantic-list-pad-block: var(--spacing-3xl);
    --semantic-list-pad-inline: var(--spacing-2xl);
    --semantic-list-pad-block--dense: var(--spacing-xl);
    --semantic-list-pad-inline--dense: var(--spacing-lg);
    --semantic-list-pad-block--loose: var(--spacing-5xl);
    --semantic-list-pad-inline--loose: var(--spacing-4xl);
    --semantic-list-item-gap: var(--spacing-lg);
    --semantic-radius-list: var(--semantic-radius-xl);
    --semantic-radius-label: var(--radius-md);
    --semantic-border-width-label: var(--border-width-thin);
    --semantic-border-style-label: solid;
    --semantic-pad-inline-label: var(--ui-pad-inline-regular);
    --semantic-pad-block-label: var(--ui-pad-block-regular);
    --semantic-border-radius-label--shape-square: var(--radius-sm);
  }
}
@layer foundation {
  :root {
    --semantic-font-family-body-text: var(--font-family-ibm-plex-sans-jp);
    --semantic-font-weight-body-text: var(--font-weight-regular);
    --semantic-line-height-body-text: var(--line-height-md);
    --semantic-letter-spacing-body-text: var(--letter-spacing-md);
    --semantic-font-weight-top-hero-shoulder: var(--font-weight-bold);
    --semantic-font-size-top-hero-shoulder: var(--font-size-24to32-fluid);
    --semantic-line-height-top-hero-shoulder: var(--line-height-4xl);
    --semantic-letter-spacing-top-hero-shoulder: var(--letter-spacing-md);
    --semantic-font-family-top-hero-catch-en: var(--font-family-sarabun);
    --semantic-font-weight-top-hero-catch-en: var(--font-weight-bold);
    --semantic-font-size-top-hero-catch-en: var(--font-size-64to96-fluid);
    --semantic-line-height-top-hero-catch-en: var(--line-height-6xl);
    --semantic-letter-spacing-top-hero-catch-en: var(--letter-spacing-md);
    --semantic-font-family-top-hero-h1-title: var(--font-family-ibm-plex-sans-jp);
    --semantic-font-weight-top-hero-h1-title: var(--font-weight-bold);
    --semantic-font-size-top-hero-h1-title: var(--font-size-24to64-fluid);
    --semantic-line-height-top-hero-h1-title: var(--line-height-5xl);
    --semantic-letter-spacing-top-hero-h1-title: var(--letter-spacing-md);
    --semantic-font-size-top-introduction: var(--font-size-xl-fluid);
    --semantic-font-size-top-introduction-bg-text: var(--font-size-7xl-fluid);
    --semantic-line-height-top-introduction: var(--line-height-2xl);
    --semantic-font-family-top-main-h2-title-en: var(--font-family-sarabun);
    --semantic-font-weight-top-main-h2-title-en: var(--font-weight-bold);
    --semantic-font-size-top-main-h2-title-en: var(--font-size-7xl-fluid);
    --semantic-line-height-top-main-h2-title-en: var(--line-height-4xl);
    --semantic-letter-spacing-top-main-h2-title-en: var(--letter-spacing-md);
    --semantic-font-weight-top-main-h2-title: var(--font-weight-regular);
    --semantic-font-size-top-main-h2-title: var(--font-size-2xl-fluid);
    --semantic-line-height-top-main-h2-title: var(--line-height-4xl);
    --semantic-letter-spacing-top-main-h2-title: var(--letter-spacing-md);
    --semantic-font-size-top-product-card-category: var(--font-size-xl-fluid);
    --semantic-font-weight-top-product-card-category: var(--font-weight-bold);
    --semantic-font-size-top-product-card-lead-title: var(--font-size-xl-fluid);
    --semantic-line-height-top-product-card-lead-title: var(--line-height-xl);
    --semantic-font-size-top-product-card__features-title: var(--font-size-xl-fluid);
    --semantic-font-weight-top-product-card__features-title: var(--font-weight-bold);
    --semantic-font-family-footer-title: var(--font-family-ibm-plex-sans-jp);
    --semantic-font-weight-footer-title: var(--font-weight-regular);
    --semantic-font-size-footer-title: var(--font-size-2xl-fluid);
    --semantic-line-height-footer-title: var(--line-height-3xl);
    --semantic-letter-spacing-footer-title: var(--letter-spacing-md);
    --semantic-font-family-footer-message: var(--font-family-ibm-plex-sans-jp);
    --semantic-font-weight-footer-message: var(--font-weight-regular);
    --semantic-font-size-footer-message: var(--font-size-sm-fluid);
    --semantic-line-height-footer-message: var(--line-height-md);
    --semantic-letter-spacing-footer-message: var(--letter-spacing-md);
    --semantic-font-weight-footer-company-name: var(--font-weight-bold);
    --semantic-font-weight-footer-address__label: var(--font-weight-bold);
    --semantic-font-family-footer-copyright: var(--font-family-sarabun);
    --semantic-font-weight-footer-copyright: var(--font-weight-regular);
    --semantic-line-height-footer-copyright: var(--line-height-xl);
    --semantic-letter-spacing-footer-copyright: var(--letter-spacing-md);
    --semantic-font-size-footer-marquee-track: var(--font-size-9xl);
    --semantic-font-family-breadcrumbs-link: var(--font-family-ibm-plex-sans-jp);
    --semantic-font-weight-breadcrumbs-link: var(--font-weight-regular);
    --semantic-font-size-breadcrumbs-link: var(--font-size-ui-14to16-fluid);
    --semantic-line-height-breadcrumbs-link: var(--line-height-4xl);
    --semantic-letter-spacing-breadcrumbs-link: var(--letter-spacing-md);
    --semantic-font-family-global-nav-link: var(--font-family-ibm-plex-sans-jp);
    --semantic-font-weight-global-nav-link: var(--font-weight-regular);
    --semantic-font-size-global-nav-link: var(--font-size-ui-14to16-fluid);
    --semantic-line-height-global-nav-link: var(--line-height-4xl);
    --semantic-letter-spacing-global-nav-link: var(--letter-spacing-md);
    --semantic-font-family-global-nav-contact: var(--font-family-ibm-plex-sans-jp);
    --semantic-font-weight-global-nav-contact: var(--font-weight-bold);
    --semantic-font-size-global-nav-contact: var(--font-size-ui-17to20-fluid);
    --semantic-line-height-global-nav-contact: var(--line-height-4xl);
    --semantic-letter-spacing-global-nav-contact: var(--letter-spacing-md);
    --semantic-font-family-button-inner: var(--font-family-ibm-plex-sans-jp);
    --semantic-font-weight-button-inner: var(--font-weight-regular);
    --semantic-line-height-button-inner: var(--line-height-md);
    --semantic-letter-spacing-button-inner: var(--letter-spacing-md);
    --semantic-font-family-box-title: var(--font-family-ibm-plex-sans-jp);
    --semantic-font-weight-box-title: var(--font-weight-bold);
    --semantic-font-size-box-title: var(--font-size-2xl-fluid);
    --semantic-line-height-box-title: var(--line-height-md);
    --semantic-letter-spacing-box-title: var(--letter-spacing-md);
    --semantic-font-family-caption-default: var(--font-family-ibm-plex-sans-jp);
    --semantic-font-weight-caption-default: var(--font-weight-bold);
    --semantic-line-height-caption-default: var(--line-height-md);
    --semantic-letter-spacing-caption-default: var(--letter-spacing-md);
    --fluid-amp-global: 1.3;
    --fluid-amp-body: var(--fluid-amp-global);
    --fluid-amp-heading: var(--fluid-amp-global);
    --fluid-amp-top-hero: var(--fluid-amp-global);
    --fluid-amp-caption: var(--fluid-amp-global);
    --fluid-amp-list: var(--fluid-amp-global);
    --fluid-amp-ui: 1;
    --fs-body-max: 1.25rem;
    --fs-h2-max: 2.25rem;
    --fs-h3-max: 2.75rem;
    --fs-h4-max: 1.75rem;
    --fs-h5-max: 1.5rem;
    --fs-hero-prim-max: 4.5rem;
    --fs-hero-sec-max: 3rem;
    --fs-caption-max: 1.125rem;
    --fs-notion-max: 1.0625rem;
    --fs-list-max: 1.5rem;
    --fs-list-label-max: 3rem;
    --semantic-font-size-body-fluid: var(--font-size-md-fluid);
    --semantic-font-size-heading-title-section-primary-fluid: var(--font-size-lg-fluid);
    --semantic-font-size-heading-title-section-en-fluid: var(--font-size-3xl-fluid);
    --semantic-font-size-heading-title-section-secondary-fluid: var(--font-size-3xl-fluid);
    --semantic-font-size-heading-title-section-tertiary-fluid: var(--font-size-xl-fluid);
    --semantic-font-size-heading-title-section-quaternary-fluid: var(--font-size-xl-fluid);
    --semantic-font-size-heading-title-info-box-primary-fluid: var(--font-size-lg-fluid);
    --semantic-line-height-heading-title-section-primary: var(--line-height-sm);
    --semantic-line-height-heading-title-section-en: var(--line-height-3xs);
    --semantic-font-weight-heading-title-section-en: var(--font-weight-bold);
    --semantic-font-family-heading-title-section-en: var(--font-family-sarabun);
    --semantic-font-size-copy-fluid: var(--font-size-2xl-fluid);
    --semantic-font-size-footer-fluid: var(--font-size-xs-fluid);
    --semantic-font-size-footer-one-column-fluid: var(--font-size-sm-fluid);
    --semantic-font-size-footer-label-fluid: var(--font-size-xs-fluid);
    --semantic-font-family-footer-cta-channel-type: var(--font-family-sarabun);
    --semantic-letter-spacing-footer-cta-channel-type: var(--letter-spacing-xl);
    --semantic-letter-spacing-footer-cta-channel-value: var(--letter-spacing-2xl);
    --semantic-line-height-footer-fluid: var(--line-height-md);
    --semantic-font-size-page-title-top-hero-fluid: var(--font-size-64to187-fluid);
    --semantic-font-size-page-title-top-hero-main-copy-fluid: var(--font-size-24to64-fluid);
    --semantic-letter-spacing-page-title-top-hero: var(--spacing-neg-sm);
    --semantic-font-weight-page-title-top-hero-main-copy: var(--font-weight-regular);
    --semantic-font-size-sub-page-hero-title-en-fluid: var(--font-size-64to96-fluid);
    --semantic-font-size-sub-page-hero-title-fluid: var(--font-size-24to32-fluid);
    --semantic-font-size-sub-page-hero-copy-fluid: var(--font-size-20to40-fluid);
    --semantic-font-weight-sub-page-hero-copy: var(--font-weight-regular);
    --semantic-font-size-caption-fluid: var(--font-size-md-fluid);
    --semantic-font-size-caption-notion-fluid: var(--font-size-sm-fluid);
    --semantic-font-size-notion-fluid: var(--font-size-sm-fluid);
    --semantic-font-size-notion-table-fluid: var(--font-size-xs);
    --semantic-font-size-caption-quote: var(--font-size-sm-fluid);
    --semantic-font-size-btn: var(--font-size-md);
    --semantic-font-size-btn-label: var(--font-size-sm);
    --semantic-font-size-btn-icon: var(--font-size-md);
    --semantic-font-size-btn-icon--lg: var(--font-size-3xl);
    --semantic-font-size-btn-icon--target-blank: var(--font-size-sm);
    --semantic-font-size-button-floating-icon: var(--font-size-md);
    --semantic-font-size-button: var(--font-size-ui-14to16-fluid);
    --semantic-font-size-button-back-to-top-icon-fluid: var(--font-size-ui-32to36-fluid);
    --semantic-line-height-btn: var(--line-height-2xs);
    --semantic-font-weight-icon: var(--font-weight-thin);
    --semantic-font-size-global-nav: var(--font-size-xs);
    --semantic-font-size-global-nav-cta: var(--font-size-sm);
    --semantic-font-size-table-head: var(--font-size-sm);
    --semantic-font-size-table-cell: var(--font-size-md);
    --semantic-font-size-label-point: var(--font-size-md);
    --semantic-font-size-anchor-nav: var(--font-size-sm);
    --semantic-font-size-anchor-nav-icon: var(--font-size-3xl);
    --semantic-font-size-anchor-nav-fluid: var(--font-size-ui-14to16-fluid);
    --semantic-font-size-anchor-nav-icon-fluid: var(--font-size-ui-32to36-fluid);
    --semantic-font-size-list-fluid: var(--font-size-xl-fluid);
    --semantic-font-size-list-group-term-deco-fluid: var(--font-size-md-fluid);
    --semantic-font-size-list-group-desc-deco-fluid: var(--font-size-md-fluid);
    --semantic-font-size-list-label-fluid: var(--font-size-4xl-fluid);
    --semantic-line-height-list-content-title: var(--line-height-md);
    --semantic-font-weight-list: var(--font-weight-regular);
    --semantic-font-size-list-annotation-fluid: var(--font-size-xs-fluid);
    --semantic-font-size-label-icon: var(--font-size-xs);
    --semantic-font-size-label-sm-fluid: var(--font-size-xs-fluid);
    --semantic-font-size-label-md-fluid: var(--font-size-ui-14to16-fluid);
    --semantic-font-size-label-lg-fluid: var(--font-size-lg-fluid);
    --semantic-font-size-label-xl-fluid: var(--font-size-xl-fluid);
    --semantic-font-size-label-2xl-fluid: var(--font-size-2xl-fluid);
    --semantic-font-size-label-3xl-fluid: var(--font-size-3xl-fluid);
    --semantic-font-size-label-4xl-fluid: var(--font-size-4xl-fluid);
    --semantic-font-size-label-icon-fluid: var(--font-size-xs-fluid);
    --semantic-font-size-dialog-window: var(--font-size-sm-fluid, var(--font-size-sm));
    --semantic-font-size-dialog-window-icon-help-fluid: var(--font-size-2xl-fluid, var(--font-size-2xl));
    --semantic-font-size-button-dialog-window-close-fluid: var(--font-size-ui-24to28-fluid);
    --semantic-line-height-dialog-window: var(--line-height-md);
    --semantic-font-size-legend: var(--font-size-sm);
    --semantic-font-size-legend-fluid: var(--font-size-xs-fluid);
    --semantic-font-family-body: var(--font-family-noto-sans-jp);
    --semantic-font-family-heading-en: var(--font-family-alumni-sans-pinstripe);
    --semantic-font-family-hero-bg-text: var(--font-family-alumni-sans-pinstripe);
    --semantic-font-family-product-name: var(--font-family-barlow);
    --semantic-font-family-copy: var(--font-family-alumni-sans-pinstripe);
    --semantic-font-family-icon: var(--font-icon);
  }
}
/* ========================================================
   Layout
   ======================================================== */
@layer layout {}
/* ===================================================================
   Layout: .l-card-block
   =================================================================== */
@layer layout {
  .l-card-block__inner {
    display: grid;
    grid-template-columns: repeat(var(--layout-cards-cols), 1fr);
    gap: var(--layout-cards-gap);
  }
}
@layer layout {
  .l-chart-container {
    width: 100%;
    height: 400px;
    margin: 2rem 0;
  }
}
/* ===================================================================
   Layout: .l-column-block
   =================================================================== */
@layer layout {
  .l-column-block__inner {
    display: grid;
    grid-template-columns: repeat(var(--layout-cards-cols), 1fr);
    gap: var(--layout-columns-gap);
  }
}
@layer components {
  .l-comparison-block {
    max-width: 96vw;
    margin: 0 auto;
    container-name: comparison;
    container-type: inline-size;
  }
  .l-comparison-block--2col {
    display: grid;
    grid-template-columns: 1fr auto 1fr; /* 左画像・矢印・右画像 */
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    justify-items: center;
    margin: var(--spacing-0, 0);
  }
}
/* Layout: Container（padding 方式・シンプル版） : layout/_container.scss */
@layer layout {
  .l-container {
    --container-pad-inline: clamp(var(--spacing-md), 3cqi, var(--spacing-2xl));
    --container-fill: var(--container-fill-default);
    --container-cap: var(--container-cap-default);
    --container-max-current: var(--container-max-default-fluid);
    container-type: inline-size;
    inline-size: min(100% * var(--container-fill), var(--container-cap));
    margin-inline: auto;
    padding-inline: var(--container-pad-inline);
  }
  .l-container--narrow {
    --container-cap: var(--container-max-narrow-fluid);
    --container-fill: 1;
    --container-pad-inline: clamp(var(--spacing-sm), 2.5cqi, var(--spacing-xl));
  }
  .l-container--medium {
    --container-cap: var(--container-max-default-fluid);
    --container-fill: 1;
    --container-pad-inline: clamp(var(--spacing-md), 3cqi, var(--spacing-2xl));
  }
  .l-container--wide {
    --container-cap: var(--container-max-wide-fluid);
    --container-fill: 1;
    --container-pad-inline: clamp(var(--spacing-lg), 4cqi, var(--spacing-3xl));
  }
  #process-flow.l-container,
  #shape.l-container {
    overflow: visible;
  }
  .l-container--full {
    --container-fill: 1;
    --container-cap: 999rem;
  }
  @container (max-width: 40rem) {
    .l-container {
      --container-pad-inline: clamp(0rem, 0.5cqi, var(--spacing-2xs));
      padding-inline: var(--container-pad-inline);
    }
  }
}
/* ===================================================================
   Layout: _header-area.scss
   =================================================================== */
@layer layout {
  .l-header-area {
    position: sticky;
    top: 0;
    z-index: var(--z-index-layer-header, 100);
    isolation: isolate;
    width: 100vw;
    backdrop-filter: blur(0);
    -webkit-transition: backdrop-filter 0.4s ease;
    transition: backdrop-filter 0.4s ease;
  }
  .l-header-area::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--semantic-bg-surface, #fff);
    opacity: 0;
    -webkit-transition: opacity 0.4s ease;
    transition: opacity 0.4s ease;
    pointer-events: none;
    content: "";
  }
  .l-header-area.is-solid::before {
    opacity: var(--opacity-80);
  }
  .l-header-area.is-solid {
    backdrop-filter: blur(12px);
  }
  .l-header__inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--spacing-lg, 2rem);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 100%;
    container: header-nav/inline-size;
    padding-inline: var(--spacing-lg);
  }
  .l-header__logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    min-width: 160px;
  }
  .l-header__logo .c-logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-decoration: none;
  }
  .l-header__logo .c-logo img {
    display: block;
    width: auto;
    max-width: 180px;
    height: 32px;
    -o-object-fit: contain;
       object-fit: contain;
  }
  .is-header-hidden:not(.is-nav-open) .l-header-area {
    pointer-events: none;
  }
  .is-nav-open .l-header-area {
    pointer-events: auto;
  }
  @media (max-width: 1199.98px) {
    .l-header-area,
    .c-header {
      pointer-events: none;
    }
    .l-header__logo,
    .c-hamburger,
    .c-global-nav-shell {
      pointer-events: auto;
    }
    .c-hamburger {
      position: relative;
      z-index: 1500;
    }
  }
  /* インデックス：デスクトップに戻ったら通常どおり */
  @media (min-width: 1200px) {
    .l-header-area,
    .c-header {
      pointer-events: auto;
    }
  }
  @media (max-width: 1199.98px) {
    .l-header-area {
      position: fixed;
      inset: 0 0 auto 0;
      z-index: 1200;
      width: 100%;
      block-size: var(--header-height);
    }
  }
}
@layer layout {}
@layer components {
  .l-label-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: var(--spacing-sm);
  }
}
@layer layout {
  .l-legend-block {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@layer layout {
  .l-main-contents-area {
    overflow: hidden;
  }
}
@layer layout {
  .l-concluding-remarks__heading-secondary {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
  }
}
@layer layout {
  .l-section-head {
    display: grid;
  }
  .l-section-head:not(:last-child) {
    -webkit-margin-after: var(--spacing-4xl);
            margin-block-end: var(--spacing-4xl);
  }
}
@layer layout {
  .l-section-lead {
    display: block;
    max-width: var(--container-max-lead-fluid, 37.5rem);
    -webkit-margin-end: 0;
            margin-inline-end: 0;
    -webkit-margin-start: auto;
            margin-inline-start: auto;
  }
  .l-section-lead:not(:last-child) {
    -webkit-margin-after: var(--spacing-4xl);
            margin-block-end: var(--spacing-4xl);
  }
  .l-section-lead > .c-lead-sentence:last-child {
    -webkit-margin-after: 0;
            margin-block-end: 0;
  }
}
@layer layout {
  .l-stack {
    display: grid;
    row-gap: var(--spacing-2xl);
  }
}
/* ========================================================
   Components
   ======================================================== */
@layer components {
  .c-back-to-top {
    position: fixed;
    right: var(--spacing-xl, 2rem);
    bottom: var(--spacing-2xl, 2rem);
    z-index: var(--z-fixed-ui, 1000);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: clamp(var(--ui-height-touch-min), 2em, 3.75em);
    height: clamp(var(--ui-height-touch-min), 2em, 3.75em);
    color: var(--semantic-text-button-floating);
    font-size: var(--semantic-font-size-button-back-to-top-icon-fluid);
    line-height: 1;
    background-color: var(--semantic-bg-button-floating--default);
    border: var(--semantic-border-style-button-floating);
    border-radius: var(--radius-md);
    opacity: 0;
    -webkit-box-shadow: var(--semantic-shadow-button-floating);
    box-shadow: var(--semantic-shadow-button-floating);
    -webkit-transition: var(--transition-default);
    transition: var(--transition-default);
    pointer-events: none;
    cursor: pointer;
  }
  .c-back-to-top:hover {
    -webkit-box-shadow: 0 12px 24px rgba(0, 0, 0, 0.25);
            box-shadow: 0 12px 24px rgba(0, 0, 0, 0.25);
  }
  .c-back-to-top:focus-visible {
    outline: 2px solid var(--color-green-500);
    outline-offset: 2px;
  }
  .c-back-to-top.is-visible {
    opacity: 1;
    pointer-events: auto;
  }
}
@layer components {
  .c-button-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    row-gap: var(--spacing-md);
    -webkit-column-gap: var(--spacing-md);
       -moz-column-gap: var(--spacing-md);
            column-gap: var(--spacing-md);
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-margin-before: var(--spacing-3xl);
            margin-block-start: var(--spacing-3xl);
  }
  .c-button-item {
    display: grid;
    grid-template-rows: auto auto;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
    justify-items: center;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
  }
  .c-button {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: var(--spacing-md);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    min-width: 176px;
    padding: var(--spacing-md) var(--spacing-2xl) var(--spacing-md) var(--spacing-lg);
    color: var(--semantic-button-primary-text);
    font-size: var(--semantic-font-size-button);
    overflow-wrap: break-word;
    text-decoration: none;
    background: var(--semantic-button-primary-bg);
    border: var(--semantic-border-style-brand);
    border-radius: var(--semantic-radius-button);
    -webkit-transition: var(--transition-default);
    transition: var(--transition-default);
  }
  .c-button::after {
    position: absolute;
    color: var(--semantic-button-primary-text);
    font-family: var(--semantic-font-family-icon);
    font-size: var(--semantic-font-size-btn-icon--lg);
    font-weight: var(--semantic-font-weight-icon);
    line-height: var(--line-height-2xs);
    -webkit-transform: translate(0, -50%);
            transform: translate(0, -50%);
    -webkit-transition: color var(--transition-default), -webkit-transform var(--transition-default);
    transition: color var(--transition-default), -webkit-transform var(--transition-default);
    transition: transform var(--transition-default), color var(--transition-default);
    transition: transform var(--transition-default), color var(--transition-default), -webkit-transform var(--transition-default);
    content: "chevron_right";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 32;
    inset-block-start: 50%;
    inset-inline-end: var(--spacing-sm);
  }
  .c-button:hover::after, .c-button:focus-visible::after {
    -webkit-transform: translate(6px, -50%);
            transform: translate(6px, -50%);
  }
  .c-button[target=_blank] .c-button__label::after, .c-button[href^="mailto:"] .c-button__label::before {
    display: inline-block;
    font-family: var(--semantic-font-family-icon);
    font-weight: var(--semantic-font-weight-icon);
    line-height: var(--line-height-2xs);
    -webkit-transition: color var(--transition-default);
    transition: color var(--transition-default);
    -webkit-margin-start: var(--spacing-xs);
            margin-inline-start: var(--spacing-xs);
    vertical-align: -0.125em;
  }
  .c-button[href^="mailto:"] .c-button__label::before {
    -webkit-margin-end: var(--spacing-md);
            margin-inline-end: var(--spacing-md);
  }
  .c-button[target=_blank] .c-button__label::after {
    font-size: var(--semantic-font-size-btn-icon);
    content: "open_in_new";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 16;
    vertical-align: middle;
  }
  .c-button[href$=".pdf" i] .c-button__label::after {
    font-size: var(--semantic-font-size-btn-icon--lg);
    content: "picture_as_pdf";
  }
  .c-button[href^="mailto:"] {
    -webkit-padding-start: calc(var(--spacing-lg) + var(--semantic-font-size-btn-icon) + var(--spacing-sm));
            padding-inline-start: calc(var(--spacing-lg) + var(--semantic-font-size-btn-icon) + var(--spacing-sm));
  }
  .c-button[href^="mailto:"]::before {
    position: absolute;
    font-family: var(--semantic-font-family-icon);
    font-size: var(--semantic-font-size-btn-icon);
    font-weight: var(--semantic-font-weight-icon);
    line-height: var(--line-height-2xs);
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    content: "mail";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 32;
    inset-block-start: 50%;
    inset-inline-start: var(--spacing-lg);
  }
  .c-button[href^="mailto:"]::after {
    content: none;
  }
  .c-button--primary {
    color: var(--semantic-button-primary-text);
    background: var(--color-gray-800, #404040);
    border: 1px solid var(--color-gray-700, #7b7b7b);
  }
  .c-button--primary:hover, .c-button--primary:focus-visible {
    color: var(--semantic-text);
    background: var(--color-green-500);
    -webkit-box-shadow: inset 0 0 0 2px var(--semantic-button-primary-border--hover);
            box-shadow: inset 0 0 0 2px var(--semantic-button-primary-border--hover);
  }
  .c-button--primary:hover::after, .c-button--primary:focus-visible::after {
    color: var(--semantic-button-primary-text--hover);
  }
  .c-button--cta {
    color: var(--semantic-button-cta-text);
    background: var(--semantic-button-cta-bg);
    background-position: 1% 50%;
    background-size: 200% auto;
  }
  .c-button--cta:hover {
    background-position: 99% 50%;
    opacity: var(--opacity-100);
  }
  .c-button-note {
    display: block;
    width: 100%;
    max-width: 100%;
    color: var(--semantic-text);
    font-size: var(--font-size-sm);
  }
  .c-button-note--cta {
    color: var(--semantic-text-inverse);
  }
}
@layer components {
  .c-callout-box {
    padding: var(--spacing-4xl) var(--spacing-3xl);
    text-align: justify;
    background-color: var(--semantic-bg-info-box);
    border-radius: var(--radius-xl);
  }
  .c-callout-box:not(:last-child) {
    margin-block: var(--spacing-0) var(--spacing-4xl);
  }
  .c-callout-box__title {
    margin: 0 0 var(--spacing-3xl) 0;
    font-size: var(--font-size-xl);
    font-weight: bold;
    text-align: center;
  }
  .c-callout-box__title-bar::after {
    display: block;
    width: 80px;
    height: 1px;
    margin: auto;
    margin-top: var(--spacing-md);
    background-color: var(--semantic-bg-accent);
    content: "";
  }
  .c-callout-box__text {
    margin: 0 0 var(--spacing-3xl) 0;
    text-align: center;
  }
  @container (max-width: 40rem) {
    .c-callout-box {
      padding: var(--spacing-xl) var(--spacing-sm);
    }
    .c-callout-box__text {
      text-align: justify;
    }
  }
  @container (min-width: 72rem) {
    .c-callout-box {
      padding: var(--spacing-2xl) var(--spacing-xl);
    }
  }
  @container (min-width: 72rem) {}
}
@layer components {
  .c-caption {
    font-size: var(--semantic-font-size-caption-title);
    font-weight: var(--font-weight-bold);
    text-align: center;
  }
  .c-caption--table {
    margin-bottom: var(--spacing-md);
  }
  .c-caption--table-disclaimer {
    font-weight: var(--font-weight-medium);
    text-align: left;
    caption-side: bottom;
  }
  .c-caption--figure {
    -webkit-margin-before: var(--spacing-md);
            margin-block-start: var(--spacing-md);
  }
  .c-caption--quote {
    font-size: var(--semantic-font-size-caption-quote);
    font-weight: normal;
    text-align: right;
    -webkit-margin-before: var(--spacing-xl);
            margin-block-start: var(--spacing-xl);
  }
  .c-caption-note {
    display: block;
    color: var(--semantic-text-subtle);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-regular);
  }
}
/* ===================================================================
   Component: .c-card
   汎用カード（背景薄色・角丸）
   =================================================================== */
@layer components {
  .c-card {
    padding: 2rem;
    color: var(--semantic-text);
    line-height: 1.7;
    background: var(--semantic-bg-muted);
    border-radius: var(--radius-lg, 1rem);
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    -webkit-transition: -webkit-transform 0.2s;
    transition: -webkit-transform 0.2s;
    transition: transform 0.2s;
    transition: transform 0.2s, -webkit-transform 0.2s;
  }
  .c-card:hover {
    -webkit-transform: translateY(-2px);
            transform: translateY(-2px);
  }
  .c-card__title {
    font-family: var(--font-family-alumni-sans-pinstripe);
    font-size: 1.25rem;
    -webkit-margin-after: 1rem;
            margin-block-end: 1rem;
  }
  .c-card__text {
    font-size: 1rem;
    -webkit-margin-after: 1rem;
            margin-block-end: 1rem;
  }
}
@property --p {
  inherits: false;
  initial-value: 0turn;
  syntax: "<angle>";
}
@layer components {
  .c-modal {
    max-width: var(--container-max-narrow-fluid, 37.5rem);
    margin: auto;
    padding: var(--spacing-0, 0);
    font-size: var(--semantic-font-size-dialog-window);
    border: none;
    border-radius: var(--semantic-radius-dialog-window);
  }
  .c-modal::-ms-backdrop {
    background: transparent;
  }
  .c-modal::backdrop {
    background: transparent;
  }
  .c-modal__inner {
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: var(--spacing-md);
    block-size: 100%;
    min-block-size: 0;
  }
  .c-modal__header {
    position: sticky;
    top: 0;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: var(--spacing-lg);
    background-color: var(--semantic-bg-dialog-window-header);
  }
  .c-modal__header form {
    position: absolute;
    top: 50%;
    margin: 0;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    inset-inline-end: var(--spacing-lg);
  }
  .c-modal__footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: var(--spacing-lg);
  }
  .c-modal__body {
    padding-inline: var(--spacing-lg);
  }
  .c-modal__body .c-modal__section-title {
    display: block;
    text-align: center;
  }
  .c-modal__body .c-modal__section-title span::after {
    display: block;
    width: 80px;
    height: 1px;
    margin: 0 auto;
    margin-top: 16px;
    background-color: var(--semantic-bg-accent);
    content: "";
  }
  .c-modal__title {
    margin: var(--spacing-0, 0);
    color: var(--semantic-text-dialog-window-header-title);
    font-size: var(--font-size-md);
    text-align: center;
  }
  .c-modal__close {
    padding: 0.25rem;
    background: transparent;
    border: 0;
    cursor: pointer;
    block-size: 2rem;
    inline-size: 2rem;
  }
  .c-modal__close:focus-visible {
    outline: 2px solid var(--color-teal-400);
    outline-offset: 2px;
  }
  .c-modal-backdrop {
    position: fixed;
    inset: 0;
    background: var(--semantic-bg-overlay-dialog);
    opacity: 0;
    -webkit-transition: opacity 0.25s ease;
    transition: opacity 0.25s ease;
    pointer-events: none;
  }
  .c-modal-backdrop.is-visible {
    opacity: 1;
  }
  .c-chart-help-block {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-margin-after: var(--spacing-sm);
            margin-block-end: var(--spacing-sm);
  }
  .c-help-button {
    --pad-x: var(--spacing-md);
    --icon-size: var(--semantic-font-size-dialog-window-icon-help-fluid);
    --gap-icon: var(--spacing-xs);
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: var(--spacing-xs);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: var(--ui-height-sm);
    font-size: var(--font-size-sm);
    line-height: var(--semantic-line-height-btn);
    background: var(--semantic-bg-button, transparent);
    border: none;
    border-radius: var(--radius-full);
    -webkit-transition: var(--transition-default);
    transition: var(--transition-default);
    cursor: pointer;
    -webkit-padding-end: var(--pad-x);
            padding-inline-end: var(--pad-x);
    -webkit-padding-start: calc(var(--pad-x) + var(--icon-size) + var(--gap-icon));
            padding-inline-start: calc(var(--pad-x) + var(--icon-size) + var(--gap-icon));
  }
  .c-help-button::before {
    position: absolute;
    color: var(--semantic-icon-color--default);
    font-family: var(--semantic-font-family-icon, "Material Symbols Outlined");
    font-size: var(--semantic-font-size-dialog-window-icon-help-fluid);
    font-weight: var(--semantic-font-weight-icon);
    content: "help";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 24;
    inset-inline-start: var(--pad-x);
  }
  .c-help-button::after {
    --ring: 2px;
    --p: 0turn;
    --start-base: 315deg;
    --start-tweak: -27deg;
    position: absolute;
    inset: 0;
    padding: var(--ring);
    background: conic-gradient(from calc(var(--start-base) + var(--start-tweak)), currentColor var(--p), transparent 0) border-box;
    border-radius: inherit;
    opacity: 0;
    transition: opacity 0.25s ease-out, --p 0.45s ease-out;
    pointer-events: none;
    content: "";
    -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #000)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #000));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #000)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #000));
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
  }
  .c-help-button:hover, .c-help-button:focus-visible {
    color: var(--semantic-bg-dialog-window-help-button-hover);
    background: transparent;
  }
  .c-help-button:hover::after, .c-help-button:focus-visible::after {
    --p: 1turn;
    opacity: 1;
  }
  .c-button {
    border: var(--semantic-border-style-brand);
  }
  .c-modal.is-animating-in {
    -webkit-animation: modal-slide-in 0.28s ease-out forwards;
            animation: modal-slide-in 0.28s ease-out forwards;
  }
  .c-modal.is-animating-out {
    -webkit-animation: modal-slide-out 0.22s ease-in forwards;
            animation: modal-slide-out 0.22s ease-in forwards;
  }
  .c-modal.is-animating-in::-ms-backdrop {
    animation: backdrop-fade-in 0.28s ease-out forwards;
  }
  .c-modal.is-animating-in::backdrop {
    -webkit-animation: backdrop-fade-in 0.28s ease-out forwards;
            animation: backdrop-fade-in 0.28s ease-out forwards;
  }
  .c-modal.is-animating-out::-ms-backdrop {
    animation: backdrop-fade-out 0.22s ease-in forwards;
  }
  .c-modal.is-animating-out::backdrop {
    -webkit-animation: backdrop-fade-out 0.22s ease-in forwards;
            animation: backdrop-fade-out 0.22s ease-in forwards;
  }
  @container (min-width: 180px) {
    .c-help-button {
      --start-tweak: -4deg;
    }
  }
  @container (max-width: 179px) and (min-width: 150px) {
    .c-help-button {
      --start-tweak: -2deg;
    }
  }
  @container (max-width: 149px) {
    .c-help-button {
      --start-tweak: 0deg;
    }
  }
  @-webkit-keyframes modal-slide-in {
    from {
      opacity: 0;
      -webkit-transform: translateY(-1.5rem);
              transform: translateY(-1.5rem);
    }
    to {
      opacity: 1;
      -webkit-transform: translateY(0);
              transform: translateY(0);
    }
  }
  @keyframes modal-slide-in {
    from {
      opacity: 0;
      -webkit-transform: translateY(-1.5rem);
              transform: translateY(-1.5rem);
    }
    to {
      opacity: 1;
      -webkit-transform: translateY(0);
              transform: translateY(0);
    }
  }
  @-webkit-keyframes modal-slide-out {
    from {
      opacity: 1;
      -webkit-transform: translateY(0);
              transform: translateY(0);
    }
    to {
      opacity: 0;
      -webkit-transform: translateY(-1.5rem);
              transform: translateY(-1.5rem);
    }
  }
  @keyframes modal-slide-out {
    from {
      opacity: 1;
      -webkit-transform: translateY(0);
              transform: translateY(0);
    }
    to {
      opacity: 0;
      -webkit-transform: translateY(-1.5rem);
              transform: translateY(-1.5rem);
    }
  }
  @-webkit-keyframes backdrop-fade-in {
    from {
      background: rgba(0, 0, 0, 0);
    }
    to {
      background: rgba(0, 0, 0, 0.4);
    }
  }
  @keyframes backdrop-fade-in {
    from {
      background: rgba(0, 0, 0, 0);
    }
    to {
      background: rgba(0, 0, 0, 0.4);
    }
  }
  @-webkit-keyframes backdrop-fade-out {
    from {
      background: rgba(0, 0, 0, 0.4);
    }
    to {
      background: rgba(0, 0, 0, 0);
    }
  }
  @keyframes backdrop-fade-out {
    from {
      background: rgba(0, 0, 0, 0.4);
    }
    to {
      background: rgba(0, 0, 0, 0);
    }
  }
}
@layer utilities {
  @media (prefers-reduced-motion: reduce) {
    .c-modal::-ms-backdrop {
      animation: none !important;
    }
    .c-modal,
    .c-modal::backdrop {
      -webkit-animation: none !important;
              animation: none !important;
    }
  }
}
@layer components {
  .c-chart-area {
    position: relative;
  }
  .c-chart img,
  .c-corrosion-images img {
    max-width: 900px;
  }
  .c-chart:not(:last-child) {
    margin-bottom: var(--spacing-2xl);
  }
  .highcharts-exporting-group {
    position: absolute;
    top: 0;
    right: 20px;
  }
  @container (max-width: 40rem) {
    .c-chart {
      margin-inline: var(--spacing-0) var(--spacing-0);
    }
    .p-corrosion__immersion-test-data {
      padding: var(--spacing-0) !important;
    }
  }
}
@layer components {
  .c-child-page-link-block a {
    color: var(--semantic-text);
  }
  .c-child-page-link__list {
    margin: var(--spacing-0, 0);
    padding: 0 var(--spacing-xl);
    list-style: none;
  }
  .c-child-page-link__item {
    border-bottom: solid 1px var(--semantic-bg-muted);
  }
  .c-child-page-link__link {
    position: relative;
    z-index: 0;
    display: grid;
    display: inline-block;
    grid-template-columns: auto 1fr auto;
    grid-template-areas: "number title en";
    width: 100%;
    padding: var(--spacing-xl);
    overflow: hidden;
    text-decoration: none;
    border-radius: var(--radius-full);
    -webkit-transition: border-radius 0.3s ease, opacity 0.3s ease;
    transition: border-radius 0.3s ease, opacity 0.3s ease;
  }
  .c-child-page-link__link::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--semantic-button-child-page-link-bg);
    opacity: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    content: "";
  }
  .c-child-page-link__link::after {
    position: absolute;
    top: 50%;
    right: 5%;
    display: inline-block;
    color: var(--semantic-text-accent);
    font-family: var(--semantic-font-family-icon);
    font-size: var(--font-size-3xl);
    font-weight: bold;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    content: "chevron_right";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 24;
    vertical-align: middle;
  }
  .c-child-page-link__link:hover {
    border-radius: var(--radius-full);
  }
  .c-child-page-link__link:hover::before {
    background: var(--semantic-button-child-page-link-bg--hover);
    opacity: 1;
  }
  .c-child-page-link__link:hover .c-child-page-link__title,
  .c-child-page-link__link:hover .c-number-label,
  .c-child-page-link__link:hover .c-deco-label--child-page-link {
    color: var(--semantic-text-inverse);
  }
  .c-child-page-link__link:hover::after {
    color: var(--semantic-text-inverse);
  }
  .c-child-page-link__link .c-number-label {
    align-self: start;
    justify-self: start;
    grid-area: number;
  }
  .c-child-page-link__link .c-deco-label--child-page-link {
    color: var(--semantic-text-accent);
    font-family: var(--font-family-barlow);
    letter-spacing: var(--letter-spacing-lg);
    grid-area: en;
  }
  .c-child-page-link__link .c-child-page-link__title {
    align-self: center;
    justify-self: start;
    font-size: var(--font-size-2xl);
    grid-area: title;
  }
}
@layer components {
  .c-column__inner {
    padding: var(--spacing-2xl) var(--spacing-xl);
  }
  .c-column-list_lead {
    -webkit-margin-after: var(--spacing-3xl);
            margin-block-end: var(--spacing-3xl);
  }
  .c-column > .u-cq-frame {
    container-name: columns;
  }
  .c-column .l-column-block {
    container-name: column-grid;
    --column-stage: one-column;
  }
  @container columns (min-width: 56rem) {
    .c-column .l-column-block {
      --column-stage: two-column;
    }
  }
  @container columns (min-width: 72rem) {
    .c-column .l-column-block {
      --column-stage: wide;
    }
  }
  @container column-grid style(--column-stage: two-column) {
    .c-column .l-column-block__inner {
      grid-template-columns: repeat(2, 1fr);
    }
    .c-item-list__item {
      -webkit-padding-start: var(--spacing-0) !important;
              padding-inline-start: var(--spacing-0) !important;
    }
  }
  @container column-grid style(--column-stage: wide) {
    .c-column .l-column-block__inner {
      grid-template-columns: repeat(2, 1fr);
      gap: var(--spacing-5xl);
    }
    .c-item-list__item {
      -webkit-padding-start: var(--spacing-0) !important;
              padding-inline-start: var(--spacing-0) !important;
    }
  }
}
@layer components {
  .c-comparison {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    max-width: 600px;
    margin: 0 0 var(--spacing-lg);
  }
  .c-comparison__inner {
    display: grid;
    grid-template-rows: 100px auto;
  }
  .c-comparison--column-01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .c-img {
    max-width: 800px;
  }
  .c-img--comparison {
    width: 100%;
    height: auto;
    margin-bottom: var(--spacing-lg);
    background: var(--color-white, #fff);
  }
  .c-comparison__arrow {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    height: 100%;
  }
  .c-comparison__arrow-icon {
    position: relative;
    top: -1.8rem;
    display: inline-block;
    color: #08b5a7;
    font-family: var(--semantic-font-family-icon);
    font-size: var(--font-size-6xl);
    line-height: 1;
    opacity: 0.8;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
  }
}
:root {
  --figure-min-h: 220px;
}

@layer components {
  .c-figure__inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--spacing-3xl) var(--spacing-xl);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .c-figure__inner:has(.u-absolute-bs--neg-3xl) {
    gap: var(--spacing-5xl) var(--spacing-xl);
  }
  .c-figure-wrapper {
    position: relative;
  }
  .c-figure__media {
    display: block;
    overflow: hidden;
    border-radius: var(--radius-xs);
  }
  .c-figure {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: var(--spacing-xs);
    margin: var(--spacing-0);
  }
  .c-figure__media > img.c-img {
    display: block;
    -o-object-fit: var(--figure-fit, cover);
       object-fit: var(--figure-fit, cover);
    -o-object-position: var(--figure-pos, 50% 50%);
       object-position: var(--figure-pos, 50% 50%);
    border-radius: var(--radius-xs);
    block-size: 100%;
    inline-size: 100%;
    max-inline-size: none;
  }
  .c-figure__media > img.c-img--padded {
    padding: var(--spacing-2xl);
  }
  .c-figure__media > img.c-img--no-bg {
    background-color: transparent;
  }
  .c-figure-block:not(:last-child) {
    -webkit-margin-after: var(--spacing-5xl);
            margin-block-end: var(--spacing-5xl);
  }
  .c-figure-block--column-01 {
    --figure-max-inline: var(--figure-max-inline-default);
  }
  .c-figure-block--column-01 .c-figure__inner {
    display: grid;
    grid-template-columns: auto;
    row-gap: var(--spacing-sm);
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .c-figure-block--column-01 .c-figure {
    aspect-ratio: auto;
    inline-size: min(100%, clamp(var(--figure-min-inline, 20rem), 80vw, var(--figure-max-inline, var(--figure-max-inline-default))));
  }
  .c-figure-block--column-01 .c-figure__media {
    aspect-ratio: auto;
  }
  .c-figure-block--column-01 .c-figure__media > img.c-img {
    -o-object-fit: contain;
       object-fit: contain;
    block-size: auto;
    inline-size: 100%;
  }
  .c-figure-block--column-01.c-figure-block--max-narrow {
    --figure-max-inline: var(--figure-max-inline-narrow);
  }
  .c-figure-block--column-01.c-figure-block--max-default {
    --figure-max-inline: var(--figure-max-inline-default);
  }
  .c-figure-block--column-01.c-figure-block--max-wide {
    --figure-max-inline: var(--figure-max-inline-wide);
  }
  .c-figure-block--column-02 .c-figure__inner {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .c-figure-block--column-02 .c-figure picture > img.c-img {
    max-inline-size: none;
  }
  .c-figure-block--column-03 .c-figure__inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }
  .c-figure-block--column-03 .c-figure__media > img.c-img {
    max-inline-size: none;
  }
  .c-figure-block--column-04 .c-figure__inner {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }
  .c-figure-block--column-04 .c-figure-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: var(--spacing-md) var(--spacing-xl);
    background-color: var(--semantic-bg-figure);
    border-radius: var(--radius-xl);
  }
  .c-figure-block--column-04 .c-figure {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    min-block-size: var(--figure-min-h);
  }
  .c-figure-block--column-04 .c-figure__media > img.c-img {
    max-inline-size: none;
  }
  .c-figure-block--column-04-02 .c-figure__inner {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
  .c-figure-block--column-04-02 .c-figure__media > img.c-img {
    max-inline-size: none;
  }
  .c-figure--ratio-1x1 {
    --figure-ratio: 1 / 1;
  }
  .c-figure--ratio-4x3 {
    --figure-ratio: 4 / 3;
  }
  .c-figure--ratio-16x9 {
    --figure-ratio: 16 / 9;
  }
  .c-figure--ratio-3x2 {
    --figure-ratio: 3 / 2;
  }
  .c-figure--fit-contain {
    --figure-fit: contain;
  }
  .c-figure--fit-cover {
    --figure-fit: cover;
  }
  .c-figure--shrink-80 {
    --figure-inset: 10%;
    --figure-bg: var(--gradient-gray-pale);
    --figure-radius: var(--radius-xl);
  }
  .c-figure--caption-top {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .c-figure--caption-top .c-caption--figure {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
    text-align: center;
    -webkit-margin-after: var(--spacing-0);
            margin-block-end: var(--spacing-0);
  }
  .c-figure-block--height-320 .c-img {
    width: auto;
    max-height: 320px;
  }
  .c-figure-block--column-02.c-figure--with-arrow {
    position: relative;
  }
  .c-figure-block--column-02.c-figure--with-arrow .c-figure__inner {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    row-gap: var(--spacing-xl);
    -webkit-column-gap: 0;
       -moz-column-gap: 0;
            column-gap: 0;
  }
  .c-figure-block--column-02.c-figure--with-arrow .c-figure__inner::after {
    grid-row: 3;
    grid-column: 1;
    align-self: center;
    justify-self: center;
    color: var(--semantic-text-point-icon-arrow);
    font-family: var(--semantic-font-family-icon);
    font-size: var(--font-size-6xl);
    line-height: 1;
    pointer-events: none;
    content: "keyboard_double_arrow_down";
  }
  .c-figure-block--column-02.c-figure--with-arrow .c-figure-wrapper,
  .c-figure-block--column-02.c-figure--with-arrow .c-figure {
    display: contents;
  }
  .c-figure-block--column-02.l-bleed .c-img {
    display: block;
    block-size: auto;
    inline-size: 100%;
    max-inline-size: none;
  }
  @container comparison (min-width: 56rem) {
    .c-figure-block--column-02.c-figure--with-arrow .c-figure__inner {
      grid-template-rows: auto auto;
      grid-template-columns: 1fr auto 1fr;
      row-gap: 0;
      -webkit-column-gap: var(--spacing-xl);
         -moz-column-gap: var(--spacing-xl);
              column-gap: var(--spacing-xl);
    }
    .c-figure-block--column-02.c-figure--with-arrow .c-figure__inner::after {
      grid-row: 1;
      grid-column: 2;
      align-self: center;
      justify-self: center;
      content: "keyboard_double_arrow_right";
    }
    .c-figure-block--column-02.c-figure--with-arrow .c-figure-wrapper:nth-child(1) .c-figure__media {
      grid-row: 1;
      grid-column: 1;
    }
    .c-figure-block--column-02.c-figure--with-arrow .c-figure-wrapper:nth-child(1) .c-caption {
      grid-row: 2;
      grid-column: 1;
      text-align: center;
    }
    .c-figure-block--column-02.c-figure--with-arrow .c-figure-wrapper:nth-child(2) .c-figure__media {
      grid-row: 1;
      grid-column: 3;
    }
    .c-figure-block--column-02.c-figure--with-arrow .c-figure-wrapper:nth-child(2) .c-caption {
      grid-row: 2;
      grid-column: 3;
      text-align: center;
    }
    .c-legend.c-legend--inline.c-legend--boxed {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(10ch, -webkit-max-content));
      grid-template-columns: repeat(auto-fit, minmax(10ch, max-content));
      gap: var(--spacing-md) var(--spacing-xl);
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
    }
  }
  @media (min-width: 768px) {
    .c-figure-block--column-02 .c-figure__inner {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  @container (max-width: 40rem) {
    .c-figure-copy {
      -webkit-margin-after: var(--spacing-0);
              margin-block-end: var(--spacing-0);
    }
    .c-figure {
      margin-inline: var(--spacing-0);
    }
    .p-home-product-card-info-box_lead {
      -webkit-margin-after: var(--spacing-3xl);
              margin-block-end: var(--spacing-3xl);
    }
    .c-figure-block--column-02 .c-figure__inner {
      grid-template-columns: 1fr;
    }
  }
}
@layer components {
  .c-footer {
    position: relative;
    height: 100%;
    background: var(--color-gray-400, #c2c2c2);
    -webkit-padding-after: var(--spacing-5xl);
            padding-block-end: var(--spacing-5xl);
  }
  .c-footer a.c-footer__link {
    color: var(--color-white);
    text-decoration: none;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
  }
  .c-footer a.c-footer__link:hover {
    text-decoration: underline;
  }
  .c-footer-cta {
    position: relative;
    z-index: 100;
    margin: 0 auto;
    color: var(--color-white);
    background: var(--color-gray-800, #404040);
  }
  .c-footer-cta__channels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 40px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    justify-items: center;
  }
  .c-footer-cta__channel-value .c-link {
    color: var(--color-green-500, #8be807);
  }
  .c-footer__main {
    font-size: var(--semantic-font-size-footer-one-column-fluid);
  }
  .c-footer__main .c-definition-list__term,
  .c-footer__main .c-definition-list__desc {
    padding: var(--spacing-2xs) var(--spacing-md) !important;
  }
  .c-footer__inner {
    -webkit-margin-before: var(--spacing-4xl);
            margin-block-start: var(--spacing-4xl);
  }
  .c-footer__logo {
    -webkit-margin-after: var(--spacing-2xl);
            margin-block-end: var(--spacing-2xl);
  }
  .c-footer__company-name {
    font-weight: var(--semantic-font-weight-footer-company-name);
    -webkit-margin-before: var(--spacing-xl);
            margin-block-start: var(--spacing-xl);
  }
  .c-footer__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin: var(--spacing-0);
    padding: var(--spacing-0);
    list-style: none;
  }
  .c-footer__list--sub {
    -webkit-margin-after: var(--spacing-xs);
            margin-block-end: var(--spacing-xs);
    -webkit-margin-start: var(--spacing-lg);
            margin-inline-start: var(--spacing-lg);
  }
  .c-footer__item {
    -webkit-margin-end: var(--spacing-md);
            margin-inline-end: var(--spacing-md);
  }
  .c-footer__address,
  .c-footer__copyright {
    font-style: normal;
    line-height: var(--semantic-line-height-footer-fluid);
  }
  .c-footer__address .c-link {
    color: var(--semantic-text);
  }
  .c-address:last-child {
    -webkit-margin-after: var(--spacing-md);
            margin-block-end: var(--spacing-md);
  }
  .c-footer__address .c-address__label {
    -webkit-margin-after: var(--spacing-0);
            margin-block-end: var(--spacing-0);
  }
  .c-address__label {
    font-size: var(--semantic-font-size-footer-label-fluid);
    font-weight: var(--semantic-font-weight-footer-address__label);
  }
  .c-address__postal,
  .c-address__line {
    margin: var(--spacing-0);
  }
  .c-contact__row {
    display: grid;
    grid-template-columns: 5ch 1fr;
    gap: 0.5rem 1rem;
  }
  .c-contact__term {
    font-weight: 600;
  }
  .c-contact__desc {
    margin: 0;
  }
  .c-footer__copyright {
    display: block;
    margin: auto;
    text-align: right;
    background: var(--color-gray-400, #c2c2c2);
    -webkit-padding-after: var(--spacing-4xl);
            padding-block-end: var(--spacing-4xl);
  }
  .c-footer-marquee {
    position: absolute;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100vw;
    min-height: 92px;
    overflow: hidden;
  }
  .c-footer-marquee__track {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    will-change: transform;
  }
  .c-footer-marquee__text {
    display: inline-block;
    padding: 0 4vw;
    color: var(--color-blue-300);
    font-size: var(--semantic-font-size-footer-marquee-track);
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.03em;
    white-space: nowrap;
    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
  }
  @-webkit-keyframes marquee-loop {
    0% {
      -webkit-transform: translateX(100%);
              transform: translateX(100%);
    }
    100% {
      -webkit-transform: translateX(-100%);
              transform: translateX(-100%);
    }
  }
  @keyframes marquee-loop {
    0% {
      -webkit-transform: translateX(100%);
              transform: translateX(100%);
    }
    100% {
      -webkit-transform: translateX(-100%);
              transform: translateX(-100%);
    }
  }
  .c-footer__inner.u-cq-frame {
    container-name: footer;
  }
  .c-footer__grid {
    container-name: footer-grid;
    --footer-stage: one-column;
  }
  .c-footer__grid-inner {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas: "footer-logo" "footer-info-company" "footer-info-sitemap";
    gap: var(--spacing-lg);
    align-self: start;
  }
  .c-footer__logo {
    grid-area: footer-logo;
  }
  .c-footer__info-company {
    grid-area: footer-info-company;
  }
  .c-footer__info-sitemap {
    grid-area: footer-info-sitemap;
  }
  @container footer (min-width: 64rem) {
    .c-footer__grid {
      --footer-stage: two-column;
    }
  }
  @container footer (min-width: 72rem) {
    .c-footer__grid {
      --footer-stage: wide;
    }
  }
  @container footer-grid style(--footer-stage: two-column) {
    .c-footer__grid-inner {
      grid-template-columns: repeat(2, 1fr);
      grid-template-areas: "footer-logo footer-logo" "footer-info-company footer-info-sitemap";
      gap: var(--spacing-xl);
      font-size: var(--semantic-font-size-footer-fluid);
    }
    .c-footer__list {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      gap: var(--spacing-sm);
    }
    .c-footer__list--sub {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-margin-before: var(--spacing-sm);
              margin-block-start: var(--spacing-sm);
    }
    .c-link {
      display: inline-block;
      width: -webkit-max-content;
      width: -moz-max-content;
      width: max-content;
    }
  }
  @container footer-grid style(--footer-stage: wide) {
    .c-footer__grid-inner {
      grid-template-columns: repeat(2, 1fr);
      grid-template-areas: "footer-logo footer-logo" "footer-info-company footer-info-sitemap";
      gap: var(--spacing-2xl);
      font-size: var(--semantic-font-size-footer-fluid);
    }
    .c-footer__list {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      gap: var(--spacing-sm);
      justify-self: end;
    }
    .c-footer__list--sub {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-margin-before: var(--spacing-sm);
              margin-block-start: var(--spacing-sm);
    }
    .c-link {
      display: inline-block;
      width: -webkit-max-content;
      width: -moz-max-content;
      width: max-content;
    }
  }
  .c-cta-new-design .l-container > .u-cq-frame {
    container-name: footer-new-design;
  }
  @container footer-new-design (max-width: 40rem) {
    .c-cta-new-design .u-br--sm {
      display: inline !important;
    }
  }
}
@layer components {
  .c-hamburger {
    position: fixed;
    inset: 0.5rem 1rem auto auto;
    z-index: 9999;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 0;
    background: var(--semantic-bg-button-floating--default, #000);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 999px;
    -webkit-box-shadow: var(--semantic-shadow-button-floating, none);
            box-shadow: var(--semantic-shadow-button-floating, none);
    backdrop-filter: blur(var(--blur-xl));
    -webkit-transition: -webkit-transform 0.15s ease;
    transition: -webkit-transform 0.15s ease;
    transition: transform 0.15s ease;
    transition: transform 0.15s ease, -webkit-transform 0.15s ease;
    cursor: pointer;
    block-size: 3rem;
    inline-size: 3rem;
  }
  .c-hamburger:active {
    -webkit-transform: scale(0.96);
            transform: scale(0.96);
  }
  .c-hamburger__bars,
  .c-hamburger__bars::before,
  .c-hamburger__bars::after {
    position: relative;
    display: block;
    background: var(--semantic-bg-hamburger-nav-ber);
    border-radius: 1px;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    block-size: 2px;
    content: "";
    inline-size: 1.5rem;
  }
  .c-hamburger__bars::before,
  .c-hamburger__bars::after {
    position: absolute;
    inset-inline-start: 0;
  }
  .c-hamburger__bars::before {
    inset-block-start: -0.4rem;
  }
  .c-hamburger__bars::after {
    inset-block-start: 0.4rem;
  }
  body.is-nav-open .c-hamburger__bars {
    background: transparent;
  }
  body.is-nav-open .c-hamburger__bars::before {
    -webkit-transform: translateY(0.4rem) rotate(45deg);
            transform: translateY(0.4rem) rotate(45deg);
  }
  body.is-nav-open .c-hamburger__bars::after {
    -webkit-transform: translateY(-0.4rem) rotate(-45deg);
            transform: translateY(-0.4rem) rotate(-45deg);
  }
  @media (max-width: 1199.98px) {
    .c-global-nav-shell {
      position: fixed !important;
      inset: 0 !important;
      z-index: 1100;
      visibility: hidden;
      padding: clamp(16px, 4vw, 32px);
      overflow: auto;
      -ms-scroll-chaining: none;
          overscroll-behavior: contain;
      background: var(--semantic-bg-global-nav, #fff);
      border: 0;
      border-radius: 0;
      opacity: 0;
      -webkit-box-shadow: none;
              box-shadow: none;
      -webkit-transform: translateY(-8px);
              transform: translateY(-8px);
      will-change: opacity, transform;
      -webkit-transition: none;
      transition: none;
      pointer-events: none;
      block-size: 100dvh;
      inline-size: 100vw;
      -webkit-overflow-scrolling: touch;
    }
    body.is-nav-open .c-global-nav-shell {
      visibility: visible;
      opacity: 1;
      -webkit-transform: translateY(0);
              transform: translateY(0);
      -webkit-animation: navFadeDown 0.25s ease both;
              animation: navFadeDown 0.25s ease both;
      pointer-events: auto;
    }
    body.is-nav-open .c-global-nav-list {
      display: block;
    }
    body.is-nav-open .c-global-nav__item {
      position: relative;
    }
    body.is-nav-open .c-global-nav__item:last-child {
      -webkit-padding-before: var(--spacing-xl);
              padding-block-start: var(--spacing-xl);
    }
    body.is-nav-open .c-global-nav__link::before {
      display: inline-block;
      font-family: "Material Symbols Outlined";
      content: "chevron_right";
      font-variation-settings: "FILL" 0, "wght" 200, "GRAD" 0, "opsz" 24;
      speak: none;
    }
    .c-global-nav-list {
      display: grid;
      gap: var(--spacing-xl);
      margin: 0;
      padding: 0;
      list-style: none;
    }
    body.is-nav-open {
      height: 100vh;
      overflow: hidden;
      -ms-touch-action: none;
          touch-action: none;
    }
    .c-global-nav-list {
      display: grid;
      gap: var(--spacing-xl);
      margin: 0;
      padding: 0;
      list-style: none;
    }
    .c-global-nav__item {
      margin-block: var(--spacing-lg) var(--spacing-0);
    }
    .c-global-nav__item--child {
      display: block;
      padding: 0;
    }
    .c-global-nav__item--child .c-global-nav__link {
      position: relative;
      font-size: var(--semantic-font-size-global-nav);
      border-radius: var(--radius-full);
      -webkit-transition: var(--transition-default);
      transition: var(--transition-default);
      padding-block: var(--spacing-md);
      -webkit-padding-start: calc(var(--spacing-lg) + var(--spacing-md));
              padding-inline-start: calc(var(--spacing-lg) + var(--spacing-md));
    }
    .c-global-nav__item--child .c-global-nav__link::before {
      position: absolute;
      opacity: 0.5;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      content: "–";
      inset-block-start: 50%;
      inset-inline-start: var(--spacing-md);
    }
    .c-other-nav-list {
      list-style: none;
    }
    .c-other-nav__link {
      color: var(--semantic-text-global-navi);
      font-size: var(--semantic-font-size-global-nav);
      text-decoration: none;
    }
    @-webkit-keyframes navFadeDown {
      from {
        opacity: 0;
        -webkit-transform: translateY(-8px);
                transform: translateY(-8px);
      }
      to {
        opacity: 1;
        -webkit-transform: translateY(0);
                transform: translateY(0);
      }
    }
    @keyframes navFadeDown {
      from {
        opacity: 0;
        -webkit-transform: translateY(-8px);
                transform: translateY(-8px);
      }
      to {
        opacity: 1;
        -webkit-transform: translateY(0);
                transform: translateY(0);
      }
    }
    @keyframes navFadeDown {
      from {
        opacity: 0;
        -webkit-transform: translateY(-8px);
                transform: translateY(-8px);
      }
      to {
        opacity: 1;
        -webkit-transform: translateY(0);
                transform: translateY(0);
      }
    }
  }
  @media (min-width: 1200px) {
    .c-hamburger {
      display: none;
    }
    .c-global-nav-shell {
      position: static !important;
      inset: auto;
      visibility: visible;
      padding: 0;
      overflow: visible;
      background: transparent;
      -webkit-transform: none !important;
              transform: none !important;
      pointer-events: auto;
      block-size: auto;
      -webkit-border-start: 0;
              border-inline-start: 0;
      inline-size: auto;
    }
    .c-global-nav-list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }
    .c-other-nav-list-block {
      display: none;
    }
  }
}
/* ===================================================================
   Component: .c-global-nav
   ─ グローバルナビの水平リスト + サブパネル
   =================================================================== */
@layer components {
  .c-global-nav-shell {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
    margin-left: auto;
    background: none;
  }
  .c-global-nav-shell .c-global-nav-off-canvas {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
  }
  .c-global-nav-list-block {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
  }
  .c-global-nav-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--spacing-md);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .c-global-nav__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
  }
  .c-global-nav__link {
    position: relative;
    display: block;
    padding: var(--spacing-lg) var(--spacing-md);
    font-size: var(--font-size-sm);
    text-decoration: none;
  }
  .c-global-nav__link::after {
    position: absolute;
    bottom: calc(var(--spacing-xs, 0.5rem));
    bottom: var(--spacing-md);
    display: block;
    height: 2px;
    background-color: var(--color-black, #111);
    border-radius: 999px;
    opacity: 0;
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transition: opacity 0.2s ease, -webkit-transform 0.2s ease;
    transition: opacity 0.2s ease, -webkit-transform 0.2s ease;
    transition: opacity 0.2s ease, transform 0.2s ease;
    transition: opacity 0.2s ease, transform 0.2s ease, -webkit-transform 0.2s ease;
    content: "";
    inset-inline: var(--spacing-md);
  }
  .c-global-nav__link:hover::after, .c-global-nav__link:focus-visible::after {
    opacity: 1;
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
  }
  .c-button--cta {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 0.5em;
    padding: var(--spacing-md) var(--spacing-md);
    color: #fff !important;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: 700;
    text-decoration: none;
    background: var(--color-orange-500, #f58900);
    border: none;
    border-radius: var(--radius-sm);
    -webkit-transition: background 0.16s, color 0.16s, border-bottom-color 0.16s;
    transition: background 0.16s, color 0.16s, border-bottom-color 0.16s;
    -webkit-margin-start: var(--spacing-2xl);
            margin-inline-start: var(--spacing-2xl);
  }
  .c-button--cta:hover, .c-button--cta:focus-visible {
    color: #fff;
    background: var(--color-yellow-500);
  }
  .c-button--cta .c-global-nav__icon {
    margin-left: 0.5em;
    font-size: 1.2em;
    vertical-align: -0.1em;
  }
  .c-global-nav__close {
    display: none;
  }
  @container (max-width: 1135.98px) {
    .c-global-nav-shell {
      position: fixed !important;
      inset: 0 !important;
      z-index: 12;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: var(--spacing-2xl, 1.5rem);
      width: min(84vw, 320px);
      margin-left: 0;
      padding: clamp(16px, 4vw, 32px);
      overflow-y: auto;
      -ms-scroll-chaining: none;
          overscroll-behavior: contain;
      background: var(--semantic-bg-surface, #fff);
      -webkit-box-shadow: -12px 0 32px rgba(10, 10, 10, 0.18);
              box-shadow: -12px 0 32px rgba(10, 10, 10, 0.18);
      block-size: 100dvh;
      inline-size: 100vw;
    }
    .c-global-nav__close {
      position: absolute;
      top: clamp(16px, 4vw, 32px);
      right: clamp(16px, 4vw, 32px);
      display: none;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      padding: 0.5em 0.8em;
      color: inherit;
      background: none;
      border: none;
      border-radius: var(--radius-full);
      -webkit-transition: background-color 0.2s ease;
      transition: background-color 0.2s ease;
      cursor: pointer;
    }
    .c-global-nav__close:hover, .c-global-nav__close:focus-visible {
      background-color: color-mix(in srgb, currentColor 12%, transparent);
    }
    .c-global-nav__close:focus-visible {
      outline: 2px solid color-mix(in srgb, currentColor 50%, transparent);
      outline-offset: 2px;
    }
    .c-global-nav__close .c-global-nav__close-bars {
      position: relative;
      display: block;
      width: 28px;
      height: 3px;
      background: transparent;
    }
    .c-global-nav__close .c-global-nav__close-bars::before, .c-global-nav__close .c-global-nav__close-bars::after {
      position: absolute;
      inset: 0;
      display: block;
      width: 100%;
      height: 3px;
      background: currentColor;
      border-radius: 999px;
      content: "";
    }
    .c-global-nav__close .c-global-nav__close-bars::before {
      -webkit-transform: rotate(45deg);
              transform: rotate(45deg);
    }
    .c-global-nav__close .c-global-nav__close-bars::after {
      -webkit-transform: rotate(-45deg);
              transform: rotate(-45deg);
    }
    .c-global-nav-off-canvas {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: var(--spacing-xl, 1.25rem);
      -webkit-box-align: start;
          -ms-flex-align: start;
              align-items: flex-start;
      width: 100%;
      -webkit-margin-before: var(--spacing-3xl);
              margin-block-start: var(--spacing-3xl);
    }
    .c-global-nav-list-block {
      display: block;
      width: 100%;
    }
    .c-global-nav-list {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-align: stretch;
          -ms-flex-align: stretch;
              align-items: stretch;
    }
    .c-global-nav__link,
    .c-button--cta {
      -webkit-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
      width: 100%;
      font-size: var(--font-size-md);
      padding-inline: 1.2em;
    }
    .c-global-nav__link {
      position: relative;
    }
    .c-global-nav-backdrop {
      display: block;
      visibility: hidden;
      opacity: 0;
      -webkit-transition: opacity 0.28s ease;
      transition: opacity 0.28s ease;
      pointer-events: none;
    }
    .c-global-nav-backdrop.is-active {
      visibility: visible;
      opacity: 1;
      pointer-events: auto;
    }
  }
  .is-nav-open .l-header__logo {
    position: fixed;
    top: calc(var(--header-height) / 2);
    z-index: 20;
    margin: 0;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
:root {
  --header-height: clamp(72px, 6vw, 144px);
}

@layer components {
  .c-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 100%;
    min-height: var(--header-height);
  }
}
@layer components {
  .c-material-symbols {
    display: inline-block;
    font-family: var(--semantic-font-family-icon, "Material Symbols Outlined");
    font-weight: var(--semantic-font-weight-icon);
    vertical-align: middle;
  }
  .c-material-symbols--contact {
    margin-bottom: var(--spacing-xs);
    font-size: var(--font-size-2xl);
  }
  .c-material-symbols--menu {
    color: var(--semantic-icon-color--default);
    font-size: var(--font-size-lg);
    content: "mail";
    margin-inline: var(--spacing-xs);
    vertical-align: top;
  }
  .c-material-symbols--back-to-top {
    font-size: var(--semantic-font-size-button-floating-icon-fluid);
  }
  .c-material-symbols--close {
    color: var(--semantic-icon-color--inverse);
    font-size: var(--semantic-font-size-button-dialog-window-close-fluid);
  }
}
@layer components {
  .c-img-svg {
    width: 100%;
    height: auto;
  }
}
@layer components {
  .c-img {
    display: block;
    width: 100%;
    height: auto;
    -o-object-fit: contain;
       object-fit: contain;
  }
  .c-img--fit-td-cell {
    display: block;
    margin: 0;
    border-radius: var(--radius-0);
    block-size: auto;
    inline-size: 100%;
  }
  .c-img--edge-safe {
    display: block;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: var(--img-safe-pad, var(--spacing-md));
    -o-object-fit: contain;
       object-fit: contain;
    -o-object-position: center;
       object-position: center;
    background-clip: padding-box;
    border-radius: var(--radius-lg);
    block-size: auto;
    inline-size: 100%;
  }
  .c-img .c-img--edge-safe-sm {
    --img-safe-pad: var(--spacing-sm);
  }
  .c-img .c-img--edge-safe-md {
    --img-safe-pad: var(--spacing-md);
  }
  .c-img .c-img--edge-safe-lg {
    --img-safe-pad: var(--spacing-lg);
  }
}
@layer components {
  .c-introduction {
    text-align: center;
  }
}
@layer components {
  .c-deco-label {
    display: inline-grid;
    place-items: center;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  .c-deco-label--en-alumni-pinstripe {
    color: var(--semantic-text-point-label);
    font-family: var(--semantic-font-family-label-alumni-sans-pinstripe);
    font-weight: var(--semantic-font-weight-label-bold);
    font-style: var(--semantic-font-style-label-text-italic);
  }
  .c-deco-label--en-barlow {
    color: var(--semantic-text-point-label);
    font-family: var(--semantic-font-family-label-barlow);
    font-size: var(--semantic-font-size-label-sm);
    font-weight: var(--semantic-font-weight-label-regular);
  }
  .c-deco-label--shape-circle {
    color: var(--deco-color, var(--color-teal-400));
    background: transparent;
    border: var(--deco-stroke, 1px) solid var(--deco-color, var(--color-teal-400));
    border-radius: 50%;
    block-size: var(--deco-size, 3.5rem);
    inline-size: var(--deco-size, 3.5rem);
  }
  .c-deco-label--shape-circle-bg-brand {
    color: var(--semantic-text-label);
    background: var(--semantic-text-point-label);
    border: var(--deco-stroke, 1px) solid var(--deco-color, var(--color-teal-400));
    border-radius: 50%;
    block-size: var(--deco-size, 3.5rem);
    inline-size: var(--deco-size, 3.5rem);
  }
  .c-deco-label--shape-square {
    background: transparent;
    border: var(--deco-stroke, 1px) solid var(--deco-color, var(--color-teal-400));
    border-radius: var(--radius-sm);
    block-size: var(--deco-size, 3.5rem);
    inline-size: var(--deco-size, 3.5rem);
  }
  .c-deco-label--shape-square-rotate-45 {
    position: relative;
    display: inline-grid;
    isolation: isolate;
    place-items: center;
    aspect-ratio: 1/1;
    color: var(--color-teal-300);
    background: transparent;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    inline-size: -webkit-max-content;
    inline-size: -moz-max-content;
    inline-size: max-content;
    /* 調整用トークン */
    --deco-blend: screen;
    --bg-inset: 20%;
    --bg-scale: 0.9;
  }
  .c-deco-label--shape-square-rotate-45::before {
    position: absolute;
    inset: var(--bg-inset);
    z-index: -1;
    background: var(--color-yellow);
    border-radius: var(--radius-sm);
    mix-blend-mode: var(--deco-blend);
    content: "";
  }
  .c-deco-label--shape-square-rotate-45 .c-deco-label--content-text {
    display: grid;
    row-gap: 0.2em;
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
  }
  .c-deco-label--shape-pill {
    display: inline-grid;
    place-items: center;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    background: transparent;
    border: var(--deco-stroke, 1px) solid var(--deco-color, var(--color-teal-400));
    border-radius: 9999px;
    block-size: auto;
    inline-size: -webkit-max-content;
    inline-size: -moz-max-content;
    inline-size: max-content;
    padding-block: var(--deco-pad-block, 0.25em);
    padding-inline: var(--deco-pad-inline, 0.75em);
  }
  .c-deco-label--shape-diamond {
    display: grid;
    place-items: center;
    border: var(--deco-stroke, 1px) solid var(--deco-color, var(--color-teal-400));
    border-radius: var(--radius-xs);
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    block-size: var(--deco-size, 3.5rem);
    inline-size: var(--deco-size, 3.5rem);
  }
  .c-deco-label__inner {
    display: grid;
    place-items: center;
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
    block-size: 100%;
    inline-size: 100%;
  }
  .c-deco-label--content-num {
    font-size: var(--semantic-font-size-label-3xl, clamp(0.9rem, 1.6vw, 1.1rem));
    line-height: var(--line-height-2xs);
    letter-spacing: var(--letter-spacing-2x);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }
  .c-deco-label--content-text {
    display: grid;
    grid-auto-flow: row;
    row-gap: var(--deco-line-gap, 0.2em);
    place-content: center;
    justify-items: center;
    text-align: center;
    text-wrap: balance;
    padding-inline: var(--deco-pad-inline, 0.35em);
  }
  .c-deco-label__line {
    display: block;
    line-height: 1.15;
  }
  .c-deco-label__line--title-sub {
    font-size: var(--semantic-font-size-label-md, clamp(0.85rem, 1.4vw, 1.05rem));
    font-weight: var(--font-weight-bold);
  }
  .c-deco-label__line--title-main {
    font-size: var(--semantic-font-size-label-3xl, clamp(0.75rem, 1.2vw, 0.95rem));
    font-weight: var(--font-weight-thin);
  }
  .c-deco-label__line--title-figure {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    color: var(--semantic-text-point-label);
    font-size: var(--semantic-font-size-label-4xl, clamp(0.75rem, 1.2vw, 0.95rem));
    font-weight: var(--font-weight-bold);
  }
  .c-deco-label--size-lg {
    --deco-size: 4.5rem;
  }
  .c-deco-label--size-xl {
    --deco-size: 5.5rem;
  }
  .c-deco-label--size-2xl {
    --deco-size: 6.5rem;
  }
  .c-deco-label--size-3xl {
    --deco-size: 7.5rem;
  }
  .c-deco-label--size-4xl {
    --deco-size: 8.5rem;
  }
  .c-deco-label--style-filled {
    color: var(--color-white);
    background: var(--deco-color, var(--color-teal-400));
    border-color: transparent;
  }
  .c-deco-label--style-outline {
    color: var(--deco-color, var(--color-teal-400));
    background: transparent;
    border: var(--deco-stroke, 1px) solid currentColor;
  }
  .c-figure__overlay-label {
    --deco-color: var(--color-teal-400);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: var(--spacing-md);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .c-figure__overlay-label-text {
    color: var(--color-teal-400);
    font-size: var(--semantic-font-size-label-2xl-fluid);
    font-style: italic;
    line-height: var(--line-height-xs);
    letter-spacing: var(--semantic-letter-spacing-label-text);
    white-space: nowrap;
  }
  .c-deco-label--with-leader::after {
    display: block;
    background: currentColor;
    block-size: 1px;
    content: "";
    inline-size: clamp(60px, 10vw, 140px);
    -webkit-margin-start: var(--spacing-md);
            margin-inline-start: var(--spacing-md);
  }
  .c-caption--bar-bottom {
    -webkit-padding-after: var(--spacing-md);
            padding-block-end: var(--spacing-md);
  }
  .c-caption--bar-bottom::after {
    display: block;
    margin: 16px auto 0;
    background-color: var(--semantic-bg-accent);
    block-size: 1px;
    content: "";
    inline-size: 80px;
  }
}
@layer components {
  .c-number-label {
    display: block;
    color: var(--semantic-text-accent);
    font-family: "Alumni Sans";
    font-size: var(--font-size-xl);
    font-weight: 300;
    font-style: italic;
  }
}
@layer components {
  .c-label-list {
    margin: var(--spacing-0, 0);
    padding: var(--spacing-0, 0);
    list-style: none;
  }
  .c-label {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    color: var(--semantic-text-label);
    font-size: var(--semantic-font-size-label);
    line-height: var(--semantic-line-height-label);
    text-decoration: none;
    min-block-size: 2rem;
  }
  .c-label--sm {
    height: var(--semantic-height-label-sm);
    padding: var(--spacing-0) var(--spacing-md);
    font-size: var(--semantic-font-size-label-sm);
    border-radius: var(--radius-sm);
  }
  .c-label--md {
    height: var(--semantic-height-label-md);
    padding: var(--spacing-0) var(--spacing-lg);
    border-radius: var(--radius-md);
  }
  .c-label--primary {
    background-color: var(--semantic-bg-label-primary);
  }
  .c-label--secondary {
    background-color: var(--semantic-bg-label-secondary);
  }
  a.c-label {
    position: relative;
    -webkit-transition: var(--transition-default);
    transition: var(--transition-default);
  }
  a.c-label--primary:hover {
    background-color: var(--semantic-bg-label-primary--hover);
  }
  a.c-label--secondary:hover {
    background-color: var(--semantic-bg-label-secondary--hover);
  }
  a.c-label:active {
    -webkit-transform: translateY(1px);
            transform: translateY(1px);
  }
  a.c-label:focus-visible {
    outline: none;
    -webkit-box-shadow: 0 0 0 2px var(--color-white), 0 0 0 4px var(--semantic-focus-ring, var(--color-teal-400));
            box-shadow: 0 0 0 2px var(--color-white), 0 0 0 4px var(--semantic-focus-ring, var(--color-teal-400));
  }
  a.c-label::after {
    right: var(--spacing-sm);
    font-family: var(--semantic-font-family-icon);
    font-size: var(--semantic-font-size-label-icon);
    font-weight: var(--semantic-font-weight-icon);
    -webkit-transition: color var(--transition-default), -webkit-transform var(--transition-default);
    transition: color var(--transition-default), -webkit-transform var(--transition-default);
    transition: transform var(--transition-default), color var(--transition-default);
    transition: transform var(--transition-default), color var(--transition-default), -webkit-transform var(--transition-default);
    content: "chevron_right";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 32;
  }
  a.c-label[target=_blank]::after {
    content: "open_in_new";
  }
  a.c-label--md {
    padding: var(--spacing-0) var(--spacing-lg) var(--spacing-0) var(--spacing-md);
  }
}
@layer components {
  .c-legend {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: var(--spacing-sm, 0.5rem) var(--spacing-lg, 1rem);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 0;
    padding: 0;
    font-size: var(--semantic-font-size-legend-fluid);
    list-style: none;
  }
  .c-legend--inline {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }
  .c-legend--boxed {
    padding: var(--spacing-md, 0.75rem) var(--spacing-lg, 1rem);
    line-height: var(--line-height-2xs);
    background-color: var(--semantic-bg-legend);
    border-radius: var(--radius-xl, 12px);
  }
  .c-legend__item {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 0.5em;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    white-space: nowrap; /* ラベルの途中折返しを防ぐ */
  }
  .c-legend__swatch {
    background: var(--legend-color, #000);
    border-radius: 50%;
    block-size: 0.9em;
    inline-size: 0.9em;
  }
  .c-legend__label {
    font: inherit;
    line-height: 1;
  }
}
@layer components {
  .c-link {
    position: relative;
    text-decoration: underline;
    text-underline-offset: 0.4em;
    -webkit-transition: color 0.15s ease, text-decoration-color 0.15s ease;
    transition: color 0.15s ease, text-decoration-color 0.15s ease;
  }
  .c-link:hover {
    text-decoration: none;
  }
  .c-link--arrow::after {
    display: inline-block;
    font-family: "Material Symbols Outlined";
    line-height: 1;
    text-decoration: none;
    content: "chevron_right";
    font-variation-settings: "FILL" 0, "wght" 200, "GRAD" 0, "opsz" 24;
    speak: none;
  }
  .c-link--arrow-before {
    text-decoration: none;
  }
  .c-link--arrow-before::before {
    display: inline-block;
    font-family: "Material Symbols Outlined";
    line-height: 1;
    content: "chevron_right";
    font-variation-settings: "FILL" 0, "wght" 200, "GRAD" 0, "opsz" 24;
    speak: none;
  }
  .c-link[target=_blank]::after {
    display: inline-block;
    font-family: var(--semantic-font-family-icon, "Material Symbols Outlined");
    font-size: var(--semantic-font-size-btn-icon--target-blanc, 1em);
    font-weight: var(--semantic-font-weight-icon, 400);
    line-height: 1;
    text-decoration: none;
    content: "open_in_new";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 16;
    -webkit-margin-start: var(--spacing-xs);
            margin-inline-start: var(--spacing-xs);
    speak: none;
    vertical-align: -0.125em;
  }
  .c-link[href^="mailto:"] {
    -webkit-padding-start: calc(var(--spacing-0) + var(--semantic-font-size-btn-icon) + var(--spacing-sm));
            padding-inline-start: calc(var(--spacing-0) + var(--semantic-font-size-btn-icon) + var(--spacing-sm));
  }
  .c-link[href^="mailto:"]::before {
    position: absolute;
    font-family: var(--semantic-font-family-icon);
    font-size: var(--semantic-font-size-btn-icon);
    font-weight: var(--semantic-font-weight-icon);
    line-height: var(--line-height-2xs);
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    content: "mail";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 32;
    inset-block-start: 50%;
    inset-inline-start: var(--spacing-neg-2xs);
  }
  .c-link--no-border {
    text-decoration: none;
  }
  .c-link--no-border:hover, .c-link--no-border:focus-visible {
    text-decoration: underline;
  }
  .c-link--text-inverse {
    color: var(--semantic-text-inverse);
  }
}
@layer components {
  .c-annotation-list__list {
    color: var(--semantic-color-annotation-list);
    font-size: var(--semantic-font-size-list-annotation-fluid);
    list-style: none;
  }
}
@layer components {
  .c-definition-list-block {
    margin-bottom: var(--spacing-lg);
  }
  .c-definition-list-block__title {
    margin-bottom: var(--spacing-lg);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
  }
  .c-definition-list {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .c-definition-list__term {
    position: relative;
  }
  .c-definition-list__term--color-point {
    color: var(--semantic-text-list-label);
  }
  .c-definition-list--inline {
    display: grid;
    grid-template-columns: fit-content(var(--dl-term-col-max, 24ch)) 1fr;
    gap: var(--spacing-xs);
    row-gap: var(--spacing-xs);
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    margin: var(--spacing-0, 0);
  }
  .c-definition-list--inline .c-definition-list__term {
    padding: var(--spacing-md) var(--spacing-2xl);
    font-weight: var(--font-weight-bold);
    text-align: center;
  }
  .c-definition-list--inline .c-definition-list__desc {
    padding: var(--spacing-md) var(--spacing-2xl);
  }
  .c-definition-list--inline > .c-definition-list__group {
    display: contents;
  }
  .c-definition-list--inline > .c-definition-list__term {
    grid-column: 1;
  }
  .c-definition-list--inline > .c-definition-list__desc {
    grid-column: 2;
  }
  .c-definition-list--inline .c-definition-list__term,
  .c-definition-list--inline .c-definition-list__desc {
    margin: var(--spacing-0, 0);
  }
  .c-definition-list--inline:not(:has(.c-definition-list__group)) {
    row-gap: var(--spacing-2xs);
  }
  .c-definition-list--inline .c-definition-list__desc-title {
    font-weight: var(--font-weight-bold);
  }
  .c-definition-list--inline .c-deco-label,
  .c-definition-list--inline .c-deco-labe--lg {
    margin-right: var(--spacing-0);
  }
  .c-definition-list--stack {
    display: grid;
    grid-auto-rows: auto;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
  }
  .c-definition-list--stack > .c-definition-list__group {
    display: grid;
    grid-template-columns: 1fr;
    grid-column: 1/-1;
    row-gap: var(--spacing-xs);
    -webkit-column-gap: 0;
       -moz-column-gap: 0;
            column-gap: 0;
    -webkit-border-after: var(--semantic-border-style-subtle);
            border-block-end: var(--semantic-border-style-subtle);
    padding-block: var(--definition-row-pad, var(--spacing-sm));
  }
  .c-definition-list--stack > .c-definition-list__group:last-child {
    -webkit-border-after: 0;
            border-block-end: 0;
  }
  .c-definition-list--stack > .c-definition-list__term,
  .c-definition-list--stack > .c-definition-list__desc,
  .c-definition-list--stack .c-definition-list__group > .c-definition-list__term,
  .c-definition-list--stack .c-definition-list__group > .c-definition-list__desc {
    grid-column: 1;
    margin: var(--spacing-0);
    padding: var(--spacing-md) var(--spacing-2xl);
    text-align: left;
  }
  .c-definition-list--stack .c-definition-list__desc--primary,
  .c-definition-list--stack .c-definition-list__desc--secondary {
    display: block;
    font-size: inherit;
    line-height: inherit;
    text-align: left;
    grid-area: auto;
  }
  .c-definition-list--border-bottom > .c-definition-list__term,
  .c-definition-list--border-bottom > .c-definition-list__desc,
  .c-definition-list--border-bottom > .c-definition-list__group > .c-definition-list__term,
  .c-definition-list--border-bottom > .c-definition-list__group > .c-definition-list__desc {
    padding: var(--spacing-md) var(--spacing-2xl);
    border: var(--semantic-border-style-subtle);
    border-width: 0 0 1px 0;
  }
  .c-definition-list--border-bottom > .c-definition-list__group:last-of-type > .c-definition-list__term,
  .c-definition-list--border-bottom > .c-definition-list__group:last-of-type > .c-definition-list__desc {
    border: none;
  }
  .c-definition-list--arrow-right .c-definition-list__term::after {
    position: absolute;
    top: 50%;
    right: var(--spacing-neg-sm);
    color: var(--semantic-text-point-icon-arrow);
    font-family: var(--semantic-font-family-icon);
    font-size: var(--font-size-3xl);
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    content: "keyboard_double_arrow_right";
  }
  .c-definition-list--term-border-right .c-definition-list__term {
    border: var(--semantic-border-style-brand);
    border-width: 0 1px 0 0;
  }
  .c-definition-list--desc-vcenter .c-definition-list__desc {
    grid-column: 2;
    align-self: center;
  }
  .c-definition-list--arrow-down .c-definition-list__term {
    position: relative;
    padding: 0 var(--spacing-xl);
  }
  .c-definition-list--arrow-down .c-definition-list__term::after {
    position: absolute;
    right: 50%;
    bottom: -48px;
    color: var(--semantic-text-point-icon-arrow);
    font-family: var(--semantic-font-family-icon);
    font-size: var(--font-size-3xl);
    font-weight: var(--semantic-font-weight-icon);
    content: "keyboard_double_arrow_down";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 24;
  }
  .c-definition-list--term-bg-color .c-definition-list__term {
    color: var(--semantic-text-inverse);
    font-weight: var(--font-weight-medium);
    background-color: var(--semantic-bg-definition-term--default);
    border: var(--semantic-border-style-inverse);
    border-width: 0 0 1px 0;
  }
  .c-definition-list--desc-bg-color .c-definition-list__desc {
    background-color: var(--semantic-bg-definition-desc--default);
  }
  .c-definition-list--term-emphasis .c-definition-list__term {
    font-size: var(--font-size-xl);
  }
  .c-definition-list--term-emphasis .c-definition-list__desc {
    font-size: var(--font-size-xl);
  }
  .c-definition-list--term-radius .c-definition-list__sub-title {
    padding: var(--spacing-md) var(--spacing-xl);
    color: var(--semantic-text-inverse);
    background: var(--semantic-bg-definition-term--accent-gradient-blue);
    border-radius: var(--radius-full);
  }
  .c-definition-list-block:has(.c-definition-list--term-deco-label) {
    margin-bottom: var(--spacing-0);
  }
  .c-definition-list--border-under {
    border: var(--semantic-border-style-default);
    border-width: 0 0 1px 0;
  }
  .c-definition-list--term-deco .c-definition-list__group .c-definition-list__term {
    -ms-flex-line-pack: center;
        align-content: center;
    color: var(--semantic-bg-definition-term--accent-teal);
    font-size: var(--semantic-font-size-list-group-term-deco);
    text-align: right;
  }
  .c-definition-list--term-deco .c-definition-list__group .c-definition-list__desc {
    font-size: var(--semantic-font-size-list-group-desc-deco);
  }
  .c-definition-list--row-line {
    display: grid;
    grid-template-columns: -webkit-max-content 1fr;
    grid-template-columns: max-content 1fr;
    row-gap: var(--definition-row-gap, var(--spacing-sm));
    -webkit-column-gap: var(--spacing-md);
       -moz-column-gap: var(--spacing-md);
            column-gap: var(--spacing-md);
  }
  .c-definition-list--row-line .c-definition-list__group {
    display: grid;
    grid-template-columns: subgrid;
    grid-column: 1/-1;
    -webkit-column-gap: var(--spacing-md);
       -moz-column-gap: var(--spacing-md);
            column-gap: var(--spacing-md);
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
    border-width: 0 0 1px 0;
    -webkit-border-after: var(--semantic-border-style-subtle);
            border-block-end: var(--semantic-border-style-subtle);
    padding-block: var(--definition-row-pad, var(--spacing-sm));
  }
  .c-definition-list--row-line .c-definition-list__group:last-child {
    -webkit-border-after: 0;
            border-block-end: 0;
  }
  .c-definition-list--row-line .c-definition-list__term {
    grid-column: 1;
    white-space: nowrap;
  }
  .c-definition-list--row-line .c-definition-list__desc {
    grid-column: 2;
  }
  .c-definition-list--term-text-right .c-definition-list__term {
    font-weight: var(--font-weight-regular);
  }
  .c-definition-list--term-text-right .c-definition-list__term {
    text-align: right;
    -webkit-margin-end: var(--spacing-md);
            margin-inline-end: var(--spacing-md);
  }
  .c-definition-list-block {
    container: def-list/inline-size;
  }
  @container def-list (max-width: 42rem) {
    .c-definition-list {
      display: grid;
      grid-auto-rows: auto;
      gap: var(--spacing-md);
      margin-bottom: var(--spacing-md);
    }
    .c-definition-list > .c-definition-list__group {
      display: grid;
      grid-template-columns: 1fr;
      grid-column: 1/-1;
      row-gap: var(--spacing-xs);
      -webkit-column-gap: 0;
         -moz-column-gap: 0;
              column-gap: 0;
      -webkit-border-after: var(--semantic-border-style-subtle);
              border-block-end: var(--semantic-border-style-subtle);
      padding-block: var(--definition-row-pad, var(--spacing-sm));
    }
    .c-definition-list > .c-definition-list__group:last-child {
      -webkit-border-after: 0;
              border-block-end: 0;
    }
    .c-definition-list > .c-definition-list__term,
    .c-definition-list > .c-definition-list__desc,
    .c-definition-list .c-definition-list__group > .c-definition-list__term,
    .c-definition-list .c-definition-list__group > .c-definition-list__desc {
      grid-column: 1;
      margin: var(--spacing-0);
      padding: var(--spacing-md) var(--spacing-2xl);
      text-align: left;
    }
    .c-definition-list .c-definition-list__desc--primary,
    .c-definition-list .c-definition-list__desc--secondary {
      display: block;
      font-size: inherit;
      line-height: inherit;
      text-align: left;
      grid-area: auto;
    }
    .c-definition-list__group {
      -webkit-border-after: none !important;
              border-block-end: none !important;
    }
    .c-definition-list__term {
      text-align: center !important;
      background-color: var(--color-gray-200);
      border: none !important;
    }
    .c-definition-list__desc {
      border: none !important;
    }
    /* 1) 列定義を 1 列へ。暗黙列の保険に grid-auto-columns も */
    .c-definition-list--inline {
      display: grid; /* 念のため */
      grid-template-columns: 1fr; /* ← これが最重要 */
      grid-auto-columns: 1fr; /* 暗黙列が出ても 1fr 扱いに（保険） */
    }
    /* 2) 子の列割り当てをリセット（dd が grid-column:2 を持っているため） */
    .c-definition-list--inline > .c-definition-list__term,
    .c-definition-list--inline > .c-definition-list__desc {
      grid-column: 1;
    }
    .c-definition-list--arrow-right .c-definition-list__term::after {
      right: 50%;
      -webkit-transform: translate(50%, 0);
              transform: translate(50%, 0);
      content: "keyboard_double_arrow_down";
    }
  }
  @container (max-width: 42rem) {
    .c-definition-list-block {
      margin-bottom: var(--spacing-3xl);
    }
  }
}
@layer components {
  .c-disclaimer {
    padding-top: var(--spacing-md);
  }
  .c-disclaimer__list {
    margin: var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-md);
    padding-left: var(--spacing-md);
    color: var(--semantic-text-subtle);
    font-size: var(--font-size-xs);
    text-align: justify;
    border-left: var(--border-width-heavy) solid var(--semantic-text-subtle);
    list-style: none;
  }
  .c-disclaimer__item {
    margin-bottom: var(--spacing-xs);
  }
}
@layer components {
  .c-item-list__list {
    display: grid;
    row-gap: var(--spacing-xs);
    -webkit-column-gap: var(--spacing-lg);
       -moz-column-gap: var(--spacing-lg);
            column-gap: var(--spacing-lg);
    margin: var(--spacing-0);
    padding: var(--spacing-md);
    font-size: var(--semantic-font-size-list);
    list-style: disc;
    list-style-position: outside;
  }
  .c-item-list__item::marker {
    color: var(--color-purple-700);
  }
}
@layer components {
  .c-logo {
    display: block;
    max-width: 100%;
  }
}
@layer layout {
  .c-main-sub-page {
    padding-top: var(--spacing-4xl);
    background-color: var(--semantic-bg-surface);
  }
}
@layer components {
  .c-note {
    display: list-item; /* ← これで ::marker が使える */
    font-size: var(--semantic-font-size-notion);
    line-height: var(--line-height-sm);
    list-style-position: outside;
    -webkit-margin-start: 1.25em;
            margin-inline-start: 1.25em; /* マーカーぶんの余白 */
  }
  .c-note::marker {
    font-weight: 700;
    content: "※";
  }
  .c-note--cta-card {
    color: var(--semantic-font-color-notion-footer);
  }
  .c-note--table {
    font-size: var(--semantic-font-size-notion-table-fluid);
    font-weight: normal;
  }
}
@layer components {
  .c-horizontal-scroll {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-color: #07a989 transparent; /* 一部サポート Firefox用  */
  }
  .c-horizontal-scroll::-webkit-scrollbar-thumb {
    background-color: #07a989;
  }
  .c-horizontal-scroll::-webkit-scrollbar-track {
    background: transparent;
  }
  .c-process-flow__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 64px;
  }
  .c-process-flow__item {
    position: relative;
    display: grid;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    grid-auto-rows: auto; /* 中身の高さに合わせる */
    grid-auto-columns: auto; /* 中身の高さに合わせる */
    width: 721px;
    grid-column-gap: var(--spacing-lg);
    grid-row-gap: var(--spacing-lg);
  }
  .c-process-flow__item::after {
    position: absolute;
    top: 50%;
    right: -40px;
    display: inline-block;
    height: 2px;
    margin-top: 8px;
    color: var(--semantic-text-accent);
    font-family: var(--semantic-font-family-icon);
    font-size: var(--font-size-3xl);
    font-weight: var(--semantic-font-weight-icon);
    content: "chevron_right";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 24;
    vertical-align: middle;
  }
  .c-process-flow__title {
    grid-area: 1/1/2/3;
  }
  .c-process-flow__image {
    grid-area: 2/1/3/2;
  }
  .c-process-flow__text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    grid-area: 2/2/3/3;
  }
  .c-process-flow__mountain-climbing {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding-top: var(--spacing-lg);
    text-align: center;
    border: solid var(--semantic-text-subtle);
    border-width: 1px 0 0 0;
    grid-area: 3/1/4/3;
  }
  .c-process-flow__illust {
    border-radius: var(--radius-lg);
  }
  .c-process-flow__icon {
    margin-right: var(--spacing-lg);
    fill: #08b5a7;
  }
}
@layer components {
  .c-prose :where(a):not(.c-button, .c-nav-link, .c-card__link) {
    overflow-wrap: anywhere;
    text-underline-offset: 0.18em;
  }
  .c-prose :where(a):not(.c-button, .c-nav-link, .c-card__link):is([target=_blank], [rel~=external], [data-external=true])::after {
    color: currentColor;
    font-family: "Material Symbols Outlined";
    font-size: 0.95em;
    line-height: 1;
    content: "open_in_new";
    font-variation-settings: "FILL" 0, "wght" 200, "GRAD" 0, "opsz" 24;
    -webkit-margin-start: 0.25em;
            margin-inline-start: 0.25em;
    speak: none;
    vertical-align: -0.1em;
  }
  .c-prose :where(a):not(.c-button, .c-nav-link, .c-card__link)[href^="mailto:"] {
    position: relative;
    -webkit-padding-start: 1.4em;
            padding-inline-start: 1.4em;
  }
  .c-prose :where(a):not(.c-button, .c-nav-link, .c-card__link)[href^="mailto:"]::before {
    position: absolute;
    color: currentColor;
    font-family: "Material Symbols Outlined";
    font-size: 1em;
    line-height: 1;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    content: "mail";
    font-variation-settings: "FILL" 0, "wght" 200, "GRAD" 0, "opsz" 24;
    inset-block-start: 50%;
    inset-inline-start: 0;
    speak: none;
  }
  .c-prose :where(a):not(.c-button, .c-nav-link, .c-card__link)[href^="tel:"]::before {
    color: currentColor;
    font-family: "Material Symbols Outlined";
    font-size: 1em;
    content: "call";
    font-variation-settings: "FILL" 0, "wght" 200, "GRAD" 0, "opsz" 24;
    -webkit-margin-end: 0.25em;
            margin-inline-end: 0.25em;
    speak: none;
    vertical-align: -0.1em;
  }
  .c-prose :where(a):not(.c-button, .c-nav-link, .c-card__link)[download]::after {
    color: currentColor;
    font-family: "Material Symbols Outlined";
    font-size: 0.95em;
    content: "download";
    font-variation-settings: "FILL" 0, "wght" 200, "GRAD" 0, "opsz" 24;
    -webkit-margin-start: 0.25em;
            margin-inline-start: 0.25em;
    speak: none;
    vertical-align: -0.1em;
  }
  .c-prose :where(a):not(.c-button, .c-nav-link, .c-card__link)[href$=".pdf" i]::after {
    color: currentColor;
    font-family: "Material Symbols Outlined";
    font-size: 0.95em;
    content: "picture_as_pdf";
    font-variation-settings: "FILL" 0, "wght" 200, "GRAD" 0, "opsz" 24;
    -webkit-margin-start: 0.25em;
            margin-inline-start: 0.25em;
    speak: none;
    vertical-align: -0.1em;
  }
  .c-prose .u-link-no-icon::before,
  .c-prose .u-link-no-icon::after {
    content: none !important;
  }
}
.p-zero3-scroll-section {
  position: relative;
  height: 500vh; /* ←ステップ数を明示！ */
  margin: 0 !important; /* ← ここで不要な余白を消すのも有効 */
  padding: 0 !important;
}

.c-scroll-step {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; /* ★ 中央寄せ */
  justify-items: center; /* ★ 中央寄せ */
  opacity: 0;
  -webkit-transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}
.c-scroll-step.is-active {
  z-index: 10;
  opacity: 1;
  pointer-events: auto;
}

.c-scroll-step__image {
  grid-area: 1/1/3/2;
}

.c-scroll-step__title {
  align-self: end;
  justify-self: start;
  font-size: var(--font-size-xl);
  font-weight: bold;
  grid-area: 1/2/2/3;
}

.c-scroll-step__text {
  align-self: start;
  justify-self: start;
  color: var(--color-gray-800);
  font-size: var(--font-size-md);
  grid-area: 2/2/3/3;
}

.c-scroll-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}

@layer components {
  .c-section-head {
    display: block;
  }
  .c-section-head:not(:last-child) {
    -webkit-margin-after: var(--spacing-4xl);
            margin-block-end: var(--spacing-4xl);
  }
  .c-heading-en {
    display: block;
    font-family: var(--font-family-alumni-sans-pinstripe);
    font-size: var(--semantic-font-size-heading-title-section-en-fluid);
    font-weight: var(--semantic-font-size-weight-title-section-en);
    font-style: var(--font-style-italic);
    line-height: var(--semantic-line-height-heading-title-section-en);
    margin-block: 0 var(--spacing-md);
  }
  .c-heading-jp {
    margin: 0 0 1rem;
    color: var(--semantic-text-accent);
    font-size: var(--semantic-font-size-heading-title-section-primary-fluid);
    line-height: 1.4;
  }
  .c-lead-sentence {
    word-break: auto-phrase;
    text-align: justify;
  }
  .c-section-head .c-heading-en {
    -webkit-margin-after: var(--spacing-md);
            margin-block-end: var(--spacing-md);
  }
  .c-section-head .c-heading-jp {
    -webkit-margin-after: var(--spacing-sm);
            margin-block-end: var(--spacing-sm);
  }
  .c-section-head .c-subtitle {
    -webkit-margin-after: var(--spacing-0);
            margin-block-end: var(--spacing-0);
  }
}
@layer components {
  .c-introduction {
    display: block;
    text-align: center;
    -webkit-margin-after: var(--spacing-5xl);
            margin-block-end: var(--spacing-5xl);
  }
  .c-introduction .c-heading-en {
    display: block;
    -webkit-margin-after: var(--spacing-2xl);
            margin-block-end: var(--spacing-2xl);
  }
  .c-introduction .c-heading-jp {
    display: block;
    -webkit-margin-after: var(--spacing-3xl);
            margin-block-end: var(--spacing-3xl);
  }
  .c-introduction .c-subtitle {
    display: block;
    font-weight: var(--font-weight-medium);
    text-align: justify;
    -webkit-margin-after: var(--spacing-xl);
            margin-block-end: var(--spacing-xl);
  }
  .c-introduction .c-lead-sentence {
    display: block;
    text-align: center;
    inline-size: min(100%, var(--container-max-narrow-fluid, 56rem));
    -webkit-margin-after: var(--spacing-4xl);
            margin-block-end: var(--spacing-4xl);
    margin-inline: auto;
  }
  @container (max-width: 40rem) {
    .c-lead-sentence {
      -moz-text-align-last: left;
           text-align-last: left;
    }
  }
}
/* ===================================================================
   Layout: .c-section（上下の間隔）
   =================================================================== */
@layer components {
  .c-section:not(:last-child) {
    margin-block: var(--spacing-0) var(--spacing-5xl);
  }
  main > .c-section:not(:has(~ .c-section)) {
    -webkit-padding-after: var(--spacing-6xl);
            padding-block-end: var(--spacing-6xl);
  }
  .c-section-header {
    text-align: center;
  }
  .c-section-header__subtitle {
    font-family: var(--semantic-font-family-heading-title-section-en);
    font-size: var(--semantic-font-size-heading-title-section-en-fluid);
    font-weight: var(--semantic-font-weight-heading-title-section-en);
    line-height: var(--line-height-2xs);
    -webkit-margin-after: var(--spacing-md);
            margin-block-end: var(--spacing-md);
  }
  .c-section-header__title {
    color: var(--color-blue-600);
    font-size: var(--semantic-font-size-heading-title-section-primary-fluid);
  }
  .c-section-body {
    text-align: justify;
    padding-inline: var(--spacing-sm);
  }
}
@layer components {
  .c-sub-hero-anchor-navi-block {
    position: absolute;
    right: 4rem;
    bottom: 4rem;
  }
  .c-sub-hero-anchor-navi {
    position: relative;
    z-index: var(--z-index-layer-high);
    padding: var(--spacing-md, 32px) var(--spacing-lg, 64px);
    background: var(--semantic-bg-anchor-nav);
    border: 1px solid rgba(174, 179, 181, 0.6);
    border-radius: var(--radius-lg);
    backdrop-filter: blur(var(--blur-xl));
    margin-block: var(--spacing-0) var(--spacing-2xl);
  }
  .c-sub-hero-anchor-navi__list {
    width: 200px;
    margin: var(--spacing-0, 0);
    padding: var(--spacing-0, 0);
    list-style: none;
  }
  .c-sub-hero-anchor-navi__item {
    position: relative;
    padding-left: 1.5em;
  }
  a.c-sub-hero-anchor-navi__link {
    position: relative;
    display: inline-block;
    color: var(--semantic-text-color-anchor-nav);
    font-size: var(--semantic-font-size-anchor-nav);
    line-height: 1.4;
    text-decoration: none;
    margin-block: 0.5em;
  }
  a.c-sub-hero-anchor-navi__link::before {
    position: absolute;
    top: 50%;
    left: var(--spacing-neg-xl);
    color: var(--semantic-text-color-anchor-nav-icon);
    font-family: var(--semantic-font-family-icon);
    font-size: var(--semantic-font-size-anchor-nav-icon);
    font-style: normal;
    line-height: 1;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    content: "chevron_right";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 32;
  }
  a.c-sub-hero-anchor-navi__link:last-child {
    padding-bottom: var(--spacing-0);
  }
  a.c-sub-hero-anchor-navi__link:hover {
    color: var(--color-teal-300);
  }
}
@layer components {
  .c-sub-hero {
    block-size: clamp(480px, 70dvh, 720px);
  }
  .c-sub-hero > .l-container,
  .c-sub-hero .u-cq-frame,
  .c-sub-hero .u-h-full,
  .c-sub-hero__inner {
    block-size: inherit;
  }
  .c-sub-page-hero {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    width: 100vw;
    overflow: hidden;
    background: var(--semantic-bg-surface);
    -webkit-margin-after: var(--spacing-5xl);
            margin-block-end: var(--spacing-5xl);
  }
  .c-sub-page-hero__inner {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 22px;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: 100%;
    min-height: 60vh;
    -webkit-padding-before: var(--spacing-5xl);
            padding-block-start: var(--spacing-5xl);
  }
  .c-sub-page-hero__en {
    margin-bottom: 0.18em;
    color: #836ae6;
    font-family: var(--semantic-font-family-top-hero-catch-en);
    font-size: var(--semantic-font-size-sub-page-hero-title-en-fluid);
    font-weight: 800;
    line-height: var(--line-height-2xs);
  }
  .c-sub-page-hero__ja {
    margin-top: 0;
    margin-bottom: 0;
    font-size: var(--semantic-font-size-sub-page-hero-title-fluid);
    font-weight: 800;
  }
  .c-sub-page-hero-lead {
    width: 100%;
  }
  .c-sub-page-hero-catch {
    position: absolute;
    right: 0;
    bottom: 0;
    display: block;
    color: var(--semantic-text-sub-page-hero-catch);
    font-size: var(--semantic-font-size-sub-page-hero-copy-fluid);
    font-weight: var(--semantic-font-weight-sub-page-hero-copy);
    line-height: var(--line-height-sm);
    text-align: right;
  }
  .c-sub-page-hero .l-container > .u-cq-frame {
    container-name: sub-hero;
  }
  @container sub-hero (max-width: 40rem) {
    .c-sub-hero-anchor-navi-block {
      display: none;
    }
    .c-sub-hero__text {
      text-align: left;
    }
    .u-br--sm {
      display: inline !important;
    }
  }
  @container sub-hero (min-width: 72rem) {
    .c-sub-hero-anchor-navi__list {
      gap: var(--spacing-2xl);
    }
  }
}
@layer components {
  .c-table-block:not(:last-child) {
    margin-bottom: var(--spacing-4xl);
  }
  .c-table-scroll {
    position: relative;
    overflow: auto;
    overscroll-behavior-x: contain;
    background: -webkit-gradient(linear, left top, right top, color-stop(60%, var(--cap-color)), to(transparent)) 0 0/var(--cap-size) 100% no-repeat, -webkit-gradient(linear, right top, left top, color-stop(60%, var(--cap-color)), to(transparent)) 100% 0/var(--cap-size) 100% no-repeat, -webkit-gradient(linear, left top, right top, from(var(--shadow-color)), to(transparent)) 0 0/var(--shadow-size) 100% no-repeat, -webkit-gradient(linear, right top, left top, from(var(--shadow-color)), to(transparent)) 100% 0/var(--shadow-size) 100% no-repeat;
    background: linear-gradient(to right, var(--cap-color) 60%, transparent) 0 0/var(--cap-size) 100% no-repeat, linear-gradient(to left, var(--cap-color) 60%, transparent) 100% 0/var(--cap-size) 100% no-repeat, linear-gradient(to right, var(--shadow-color), transparent) 0 0/var(--shadow-size) 100% no-repeat, linear-gradient(to left, var(--shadow-color), transparent) 100% 0/var(--shadow-size) 100% no-repeat;
    background-color: transparent;
    background-attachment: local, local, scroll, scroll;
    background-origin: content-box, content-box, padding-box, padding-box;
    background-clip: content-box, content-box, padding-box, padding-box;
    container-name: table-scroll;
    container-type: inline-size;
    -webkit-overflow-scrolling: touch;
    --cap-color: var(--semantic-bg-table-tbody-td--default);
    --shadow-color: var(--color-black-alpha-20);
    --cap-size: var(--spacing-lg);
    --shadow-size: var(--spacing-md);
  }
  .c-table {
    min-width: 100%;
    background: transparent;
    border-collapse: collapse;
  }
  .c-table thead {
    background-color: var(--semantic-bg-table-thead-th--scroll-fade);
  }
  .c-table-scroll__hint {
    position: absolute;
    inset: 50% auto auto 50%;
    z-index: 1200;
    padding: 0.55em 0.9em;
    color: var(--semantic-color-table-scroll-hint);
    font-size: var(--font-size-sm, 0.875rem);
    line-height: 1.25;
    white-space: nowrap;
    background: var(--semantic-bg-table-scroll-hint);
    border-radius: var(--semantic-radius-sm, 8px);
    opacity: 0;
    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
            box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    -webkit-transition: opacity 0.25s ease, -webkit-transform 0.25s ease;
    transition: opacity 0.25s ease, -webkit-transform 0.25s ease;
    transition: opacity 0.25s ease, transform 0.25s ease;
    transition: opacity 0.25s ease, transform 0.25s ease, -webkit-transform 0.25s ease;
    pointer-events: none;
  }
  .c-table-scroll__hint::before {
    color: var(--semantic-icon-color--inverse);
    font-family: var(--semantic-font-family-icon, "Material Symbols Outlined");
    font-size: var(--semantic-font-size-btn-icon--lg);
    font-weight: var(--semantic-font-weight-icon);
    content: "swipe";
    font-variation-settings: "FILL" 0, "wght" 100, "GRAD" 0, "opsz" 16;
    vertical-align: middle;
  }
  .c-table-scroll.is-revealed .c-table-scroll__hint {
    opacity: 0.98;
    -webkit-animation: blinkTwice 2.4s ease-in-out 0s 1, fadeOut 0.6s ease 3.2s 1 forwards;
            animation: blinkTwice 2.4s ease-in-out 0s 1, fadeOut 0.6s ease 3.2s 1 forwards;
  }
  .c-table-scroll.is-scrolled .c-table-scroll__hint {
    opacity: 0;
    -webkit-transform: translate(-50%, calc(-50% + 6px));
            transform: translate(-50%, calc(-50% + 6px));
  }
  .c-table-scroll.is-expired .c-table-scroll__hint {
    display: none;
  }
  .c-table thead {
    background-color: var(--semantic-bg-table-thead_th--default);
  }
  .c-table thead th {
    padding: var(--spacing-md) var(--spacing-sm);
    color: var(--semantic-text-inverse);
    font-size: var(--font-size-sm);
    text-align: center;
    border: var(--semantic-border-style-inverse);
    border-width: 0 0 1px 1px;
  }
  .c-table tbody th {
    color: var(--semantic-text);
    font-size: var(--font-size-sm);
    text-align: center;
    background-color: var(--semantic-bg-table-tbody-th--default);
    border: var(--semantic-border-style-inverse);
    border-width: 0 0 1px 1px;
  }
  .c-table tbody td {
    padding: var(--spacing-md) var(--spacing-sm);
    font-size: var(--font-size-sm);
    text-align: center;
    border: var(--semantic-border-style-subtle);
    border-width: 0 1px 1px 0;
  }
  .c-table tbody tr:hover td {
    background-color: var(--color-orange-200) !important;
  }
  .c-table tbody tr:hover td.u-table-cell-bg--emphasis {
    background-color: var(--semantic-bg-table-emphasis-hover) !important;
  }
  .c-table--row-border thead th {
    border: var(--semantic-border-style-default);
    border-width: 0 0 1px 0;
  }
  .c-table--row-border tbody td {
    border: var(--semantic-border-style-subtle);
    border-width: 0 0 1px 0;
    padding-inline: var(--spacing-md);
  }
  .c-table--odd tbody tr:nth-child(odd) {
    background-color: var(--semantic-bg-table-row--stripe);
  }
  .c-table--td-bg-color tbody td {
    color: var(--semantic-text);
    background-color: var(--semantic-bg-muted);
  }
  .c-table--align-left tbody td {
    text-align: left;
  }
  .c-img--fit-td-cell {
    display: block;
    block-size: auto;
    inline-size: 100%;
    max-inline-size: none;
  }
  .c-table--media-grid {
    --table-media-label: clamp(6.5rem, 11vw, 12rem);
    --table-media-thumb: clamp(6.5rem, 11vw, 12rem);
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    min-width: -webkit-max-content;
    min-width: -moz-max-content;
    min-width: max-content;
    table-layout: auto;
  }
  @supports (display: grid) {
    .c-table--media-grid thead tr,
    .c-table--media-grid tbody tr {
      display: grid;
      grid-template-columns: minmax(var(--table-media-label), -webkit-max-content) repeat(var(--img-cols, 6), minmax(var(--table-media-thumb), -webkit-max-content));
      grid-template-columns: minmax(var(--table-media-label), max-content) repeat(var(--img-cols, 6), minmax(var(--table-media-thumb), max-content));
    }
    .c-table--media-grid thead tr > *,
    .c-table--media-grid tbody tr > * {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      text-align: center;
      min-inline-size: 0;
    }
  }
  .c-table__col {
    width: auto;
  }
  .c-table__col--label {
    width: var(--table-media-label);
  }
  .c-table__col--media {
    width: var(--table-media-thumb);
  }
  .c-table__cell--label {
    padding: var(--spacing-md) var(--spacing-sm);
    text-align: center;
  }
  .c-table__cell--media {
    padding: 0;
  }
  .c-table__media-frame {
    position: relative;
    display: inline-grid;
    place-items: center;
    aspect-ratio: 1;
    overflow: hidden;
    inline-size: var(--table-media-thumb);
  }
  .c-table__media-frame img {
    -o-object-fit: cover;
       object-fit: cover;
    block-size: 100%;
    inline-size: 100%;
  }
  @container (max-width: 40rem) {
    .c-table-block {
      min-inline-size: 0;
    }
    .c-table tbody td {
      padding: var(--spacing-md) var(--spacing-xs);
    }
    .c-table--media-grid {
      --table-media-label: clamp(5.5rem, 36vw, 8.5rem);
      --table-media-thumb: clamp(5.5rem, 36vw, 8.5rem);
    }
    .c-table--product-lineup th:last-child,
    .c-table--product-lineup td:last-child {
      min-inline-size: clamp(16rem, 60vw, 24rem);
    }
    .u-table-column-evenly {
      width: -webkit-max-content !important;
      width: -moz-max-content !important;
      width: max-content !important;
    }
  }
  @container table-scroll (min-width: 64rem) {
    .c-table-scroll {
      overflow: visible;
      background: none;
      padding-inline: 0;
    }
    .c-table {
      width: 100%;
      min-width: 100%;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .c-table-scroll .c-table-scroll__hint {
      -webkit-animation: none !important;
              animation: none !important;
    }
  }
  @-webkit-keyframes blinkTwice {
    0% {
      opacity: 0.98;
    }
    20% {
      opacity: 0.35;
    }
    40% {
      opacity: 0.98;
    }
    60% {
      opacity: 0.35;
    }
    80% {
      opacity: 0.98;
    }
    100% {
      opacity: 0.98;
    }
  }
  @keyframes blinkTwice {
    0% {
      opacity: 0.98;
    }
    20% {
      opacity: 0.35;
    }
    40% {
      opacity: 0.98;
    }
    60% {
      opacity: 0.35;
    }
    80% {
      opacity: 0.98;
    }
    100% {
      opacity: 0.98;
    }
  }
  @-webkit-keyframes fadeOut {
    0% {
      opacity: 0.98;
    }
    100% {
      opacity: 0;
    }
  }
  @keyframes fadeOut {
    0% {
      opacity: 0.98;
    }
    100% {
      opacity: 0;
    }
  }
}
@layer components {
  .c-section-header {
    text-align: center;
    -webkit-margin-after: var(--spacing-3xl);
            margin-block-end: var(--spacing-3xl);
  }
  .c-subtitle {
    display: block;
    font-size: var(--semantic-font-size-heading-title-section-secondary-fluid, 32px);
    font-weight: normal;
    line-height: 1.4;
    text-align: right;
    margin-block: 0 var(--spacing-2xl);
  }
  .c-subtitle-secondary__shoulder {
    color: var(--semantic-text-accent);
    font-family: "Alumni Sans";
    font-size: var(--font-size-xl);
    font-weight: 300;
    font-style: italic;
    letter-spacing: var(--letter-spacing-lg);
    text-align: right;
  }
  .c-subtitle-secondary__shoulder-number {
    display: block;
  }
  .c-process-flow__title {
    color: var(--semantic-color-brand-light);
    letter-spacing: var(--letter-spacing-lg);
  }
  .c-section-title {
    margin-bottom: var(--spacing-4xl);
  }
  .c-item-list__title {
    display: block;
    margin: 0 0 var(--spacing-3xl) 0;
    font-size: var(--font-size-2xl);
    font-weight: bold;
    text-align: center;
  }
  .c-subtitle-tertiary {
    margin-left: var(--spacing-2xl);
    font-size: var(--font-size-xl);
  }
  @container (max-width: 40rem) {
    .c-section-head.c-section-head:not(:last-child) {
      -webkit-margin-after: var(--spacing-2xl);
              margin-block-end: var(--spacing-2xl);
    }
    .c-section-head .c-heading-jp {
      -webkit-margin-after: var(--spacing-3xl);
              margin-block-end: var(--spacing-3xl);
    }
    .c-subtitle {
      text-align: left;
    }
    .u-absolute-is {
      inset-inline-start: var(--spacing-0) !important;
    }
    .u-br--sm {
      display: inline !important;
    }
  }
  @container sub-main (min-width: 72rem) {}
}
/* ========================================================
   Project
   ======================================================== */
@layer project {
  .c-main-sub-page {
    container-name: cq-sub-page-main;
    container-type: inline-size;
  }
  .c-main-sub-page .l-container > .u-cq-frame {
    container-name: cq-sub-page-section;
  }
}
/* ===================================================================
   Project: .p-cta-card
   フッター CTA 専用（半透明＋ブラー・中央揃え）
   =================================================================== */
@layer project {
  .c-card-glass--footer {
    color: var(--semantic-text-inverse);
    background: var(--color-gray-800, #404040);
    border: var(--semantic-border-style-cta-card);
    border-radius: var(--radius-xl);
    backdrop-filter: blur(var(--blur-md));
  }
  .c-footer-cta__inner {
    padding: var(--spacing-3xl) var(--spacing-xl);
  }
  .c-footer-cta__heading {
    margin-top: var(--spacing-0);
    font-size: var(--font-size-xl);
    text-align: center;
  }
  .c-footer-cta__lead {
    font-size: var(--font-size-md);
    line-height: var(--line-height-lg);
    text-align: center;
    -webkit-margin-after: var(--spacing-3xl);
            margin-block-end: var(--spacing-3xl);
  }
  .c-footer-cta__channels {
    display: grid;
    gap: var(--spacing-lg);
  }
  @container cta-cards-grid style(--cta-cards-stage: two-column) {
    .c-footer-cta__channels {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  .c-footer-cta__channel-type {
    margin: 0;
    color: var(--semantic-link-current-color);
    font-family: var(--semantic-font-family-footer-cta-channel-type);
    font-size: clamp(var(--font-size-md), 1.1vw, var(--font-size-lg));
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--semantic-letter-spacing-footer-cta-channel-type);
  }
  .c-footer-cta__channel-value {
    margin: var(--spacing-2xs) 0;
    font-family: var(--semantic-font-family-footer-title);
    font-size: clamp(var(--font-size-xl), 2vw, var(--font-size-3xl));
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--semantic-letter-spacing-footer-cta-channel-value);
  }
  .c-footer-cta__channel-value a {
    text-decoration: none;
  }
  .c-footer-cta__channel-note {
    margin: 0;
    color: rgba(255, 255, 255, 0.7);
    font-size: var(--font-size-sm);
  }
  @container (max-width: 40rem) {
    .c-footer-cta__inner {
      padding: var(--spacing-3xl) var(--spacing-sm);
    }
    .c-footer-cta__channels {
      justify-items: left;
    }
  }
}
@layer project {
  /* =========================================================
   * Project: Home Page Layout & Components
   * ======================================================= */
  /* ------------------------------------------------------- */
  /* Hero                                                    */
  /* ------------------------------------------------------- */
  .p-home-hero-area {
    position: relative;
    display: block;
    width: 100vw;
    height: 100svh;
    min-height: 100vh;
    overflow: hidden;
    block-size: 100svh;
  }
  .p-home-hero__inner {
    width: 100vw;
    min-height: 720px;
    -webkit-margin-before: var(--spacing-2xl);
            margin-block-start: var(--spacing-2xl);
  }
  .p-home-hero__content-media-wrapper {
    position: relative;
    display: grid; /* ← Grid で中央寄せ */
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; /* 縦方向センター */
    justify-items: start; /* 横は左寄せのままにしたい場合 */
    min-block-size: 100%;
  }
  .p-home-hero__content {
    z-index: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 28px;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-margin-before: var(--spacing-2xl);
            margin-block-start: var(--spacing-2xl);
  }
  .p-home-hero__shoulder {
    display: block;
    padding: var(--font-size-md) var(--font-size-2xl);
    font-size: 1.1rem;
    font-weight: 600;
    line-height: var(--line-height-2xs);
    letter-spacing: 0.02em;
    background-color: var(--semantic-bg-surface);
    border-radius: var(--spacing-sm);
  }
  .p-home-hero__title {
    display: block;
    padding: var(--font-size-md) var(--font-size-2xl);
    font-size: 2.14rem;
    font-weight: 700;
    line-height: var(--line-height-2xs);
    letter-spacing: 0.01em;
    background-color: var(--semantic-bg-surface);
    border-radius: var(--spacing-sm);
  }
  .p-home-hero__catch-en {
    display: block;
    margin-top: var(--spacing-0);
    padding: var(--font-size-md) var(--font-size-2xl);
    font-family: var(--semantic-font-family-top-hero-catch-en);
    font-size: var(--semantic-font-size-top-hero-catch-en);
    font-weight: 800;
    line-height: 1.11;
    background-color: var(--semantic-bg-surface);
    border-radius: var(--spacing-sm);
  }
  .p-home-hero__media {
    position: absolute;
    inset: 0;
    z-index: 1;
    height: 68vh;
    padding-left: 20%;
  }
  .p-home-hero__img {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: right center;
       object-position: right center;
    border-radius: 40px 0 0 40px;
  }
  .p-home-scroll-down {
    position: absolute;
    right: 72px;
    bottom: 10%;
    z-index: 10;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 120px;
    height: 120px;
    color: #222;
    font-size: 1.14rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    text-align: center;
    background: #fff;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 16px 0 rgba(60, 60, 60, 0.13);
            box-shadow: 0 2px 16px 0 rgba(60, 60, 60, 0.13);
    pointer-events: auto;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
  }
  .p-home-scroll-down::after {
    display: block;
    margin-top: 9px;
    font-family: var(--semantic-font-family-icon);
    font-size: var(--semantic-font-size-btn-icon);
    font-weight: var(--semantic-font-weight-icon);
    content: "keyboard_double_arrow_down";
  }
  .p-home-scroll-down__link {
    -ms-flex-line-pack: center;
        align-content: center;
    width: 100%;
    height: 100%;
    line-height: 1;
    text-decoration: none;
    vertical-align: middle;
  }
  /* ------------------------------------------------------- */
  /* Introduction                                            */
  /* ------------------------------------------------------- */
  .p-home-introduction {
    background: var(--color-gray-300, #d6d6d6);
    -webkit-margin-after: var(--spacing-5xl);
            margin-block-end: var(--spacing-5xl);
  }
  .p-home-introduction__content {
    position: relative;
    display: grid;
    gap: clamp(var(--spacing-md), 2vw, var(--spacing-2xl));
    color: var(--semantic-text);
    margin-block: clamp(var(--spacing-3xl), 10vw, var(--spacing-4xl));
  }
  .p-home-introduction__lead {
    display: block;
    max-width: var(--container-max-narrow-fluid, 37.5rem);
    font-size: var(--semantic-font-size-top-introduction);
    line-height: var(--semantic-line-height-top-introduction);
    -webkit-margin-end: auto;
    margin-inline-end: auto;
    margin-inline-start: 0;
    -webkit-margin-start: 0;
  }
  .p-home-lead-sentence {
    word-break: auto-phrase;
  }
  .p-home-introduction__bg {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translate(0, -50%);
            transform: translate(0, -50%);
  }
  .p-home-introduction__bg-text {
    display: inline-block;
    color: rgba(5, 5, 5, 0.08);
    font-family: var(--semantic-font-family-top-main-h2-title-en);
    font-size: var(--semantic-font-size-top-introduction-bg-text);
    font-weight: var(--semantic-font-weight-top-main-h2-title-en);
    font-style: italic;
    line-height: 1.1;
    letter-spacing: calc(var(--letter-spacing-lg) * 2);
    text-align: right;
  }
  /* ------------------------------------------------------- */
  /* Product & Stock                                         */
  /* ------------------------------------------------------- */
  .p-home-product {
    background: var(--semantic-bg-surface);
    padding-block: clamp(var(--spacing-10xl), 12vw, var(--spacing-14xl));
  }
  .p-home-product__header {
    text-align: center;
    -webkit-margin-after: clamp(var(--spacing-6xl), 8vw, var(--spacing-9xl));
            margin-block-end: clamp(var(--spacing-6xl), 8vw, var(--spacing-9xl));
  }
  .p-home-product__heading-en {
    margin: 0;
    color: var(--semantic-text);
    font-family: var(--semantic-font-family-top-main-h2-title-en);
    font-size: var(--font-size-7xl-fluid);
    font-weight: var(--semantic-font-weight-top-main-h2-title-en);
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  .p-home-product__heading-ja {
    margin: var(--spacing-md) 0 0;
    color: var(--semantic-link-current-color);
    font-family: var(--semantic-font-family-top-main-h2-title);
    font-size: var(--font-size-lg-fluid);
    font-weight: var(--semantic-font-weight-top-main-h2-title);
    letter-spacing: 0.1em;
  }
  .p-home-product-card__makers .c-definition-list__term {
    padding: var(--spacing-md) var(--spacing-md) var(--spacing-md) var(--spacing-0);
    font-size: var(--font-size-sm);
  }
  .p-home-product-card__makers .c-definition-list__desc {
    padding: var(--spacing-md) var(--spacing-xs);
    font-size: var(--font-size-sm);
  }
  .p-home-product-card__makers .c-link {
    text-decoration: none;
    -webkit-margin-end: var(--spacing-md);
            margin-inline-end: var(--spacing-md);
  }
  .p-home-product__item {
    position: relative;
    -webkit-margin-before: var(--spacing-4xl);
            margin-block-start: var(--spacing-4xl);
  }
  .p-home-product-card__header {
    position: relative;
    -webkit-margin-after: var(--spacing-3xl);
            margin-block-end: var(--spacing-3xl);
  }
  .p-home-product-card__header-content {
    position: relative;
    z-index: var(--z-index-layer-high);
  }
  .p-home-product-card__category {
    display: inline-block;
    font-family: var(--semantic-font-family-top-main-h2-title);
    font-size: var(--semantic-font-size-top-product-card-category);
    font-weight: var(--semantic-font-weight-top-product-card-category);
    -webkit-margin-after: var(--spacing-sm);
            margin-block-end: var(--spacing-sm);
  }
  .p-home-product-card__name {
    margin: 0;
    font-family: var(--semantic-font-family-top-main-h2-title);
    font-size: clamp(var(--font-size-2xl), 3vw, var(--font-size-3xl));
    font-weight: var(--semantic-font-weight-top-main-h2-title);
  }
  .p-home-product__makers {
    display: grid;
    gap: var(--spacing-xs);
    margin: var(--spacing-md) 0 0;
    padding: 0;
    list-style: none;
  }
  .p-home-product__makers a {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
  }
  .p-home-product__tagline {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: var(z-index-layer-low);
    margin: 0;
    color: var(--color-purple-200);
    font-family: var(--semantic-font-family-top-main-h2-title-en);
    font-size: var(--semantic-font-size-top-main-h2-title-en);
    font-weight: 800;
    font-style: italic;
    line-height: var(--line-height-xs);
    text-align: right;
  }
  .p-home-product-card-info-box {
    display: grid;
    gap: clamp(var(--spacing-lg), 4vw, var(--spacing-5xl));
    padding: var(--spacing-5xl) var(--spacing-4xl);
    overflow: hidden;
    color: var(--semantic-text-inverse);
    background: linear-gradient(135deg, rgba(5, 5, 5, 0.92) 0%, rgb(var(--color-gray-800-rgb)/85%) 100%);
    border-radius: var(--spacing-sm);
    -webkit-margin-after: var(--spacing-2xl);
            margin-block-end: var(--spacing-2xl);
  }
  .p-home-product-card-info-box__lead-title {
    display: block;
    font-size: var(--semantic-font-size-top-product-card-lead-title);
    line-height: var(--semantic-line-height-top-product-card-lead-title);
    text-align: center;
    text-wrap: balance;
    -webkit-margin-after: var(--spacing-3xl);
            margin-block-end: var(--spacing-3xl);
  }
  .p-home-product-card__deco {
    justify-self: end;
    margin: 0;
    color: rgba(255, 255, 255, 0.6);
    font-size: var(--font-size-sm);
  }
  .p-home-product-card-info-box__gallery .c-figure--column-02 .c-img {
    width: auto;
    max-height: 350px;
  }
  .p-home-product-card-info-box__gallery .c-figure__media .c-img {
    width: 90%;
    height: auto;
    margin: auto;
    -o-object-fit: contain;
       object-fit: contain;
  }
  .p-home-product-card__features-title {
    font-size: var(--semantic-font-size-top-product-card__features-title);
    font-weight: var(--semantic-font-weight-top-product-card__features-title);
    -webkit-margin-after: var(--spacing-md);
            margin-block-end: var(--spacing-md);
  }
  .p-home-product-card-info-box__links {
    padding: var(--spacing-lg);
    background: var(--color-gray-200, #ebebeb);
    border-radius: 8px;
  }
  .p-home-product-card-info-box__links .c-button-list {
    -webkit-padding-start: var(--spacing-0);
            padding-inline-start: var(--spacing-0);
  }
  .p-home-product-card-info-box__links-title {
    color: var(--semantic-text);
    font-weight: var(--font-weight-bold);
    text-align: center;
  }
  .p-home-product-card__download {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0 40px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    justify-items: center;
    width: 100%;
    margin: 0 auto;
    padding: var(--spacing-3xl) var(--spacing-2xl);
    background: var(--color-gray-300, #ebebeb);
    border-radius: var(--spacing-sm);
  }
  .p-home-product-card__download .c-button-list {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-margin-before: var(--spacing-0);
            margin-block-start: var(--spacing-0);
  }
  .p-home-product-card__download-title {
    justify-self: end;
    color: var(--semantic-text);
    font-weight: bold;
  }
  @container (max-width: 40rem) {
    .p-home-hero-area {
      height: 100svh;
      min-height: 100svh;
    }
    .p-home-hero__inner {
      position: relative;
      height: 100%;
      min-height: 100svh;
      -webkit-margin-before: 0;
              margin-block-start: 0;
    }
    .p-home-hero__content-media-wrapper {
      min-height: 100%;
    }
    .p-home-hero__media {
      position: absolute;
      inset: 0;
      height: 100%;
      padding: 0;
    }
    .p-home-hero__img {
      width: 100%;
      height: 100%;
      -o-object-position: 82%;
         object-position: 82%;
      border-radius: 0;
    }
    .p-home-hero__content {
      inset: auto 0 clamp(var(--spacing-6xl), 12svh, var(--spacing-8xl)) 0;
      bottom: 15%;
      left: var(--spacing-neg-lg);
      gap: var(--spacing-xl);
    }
    .p-home-hero__shoulder,
    .p-home-hero__catch-en,
    .p-home-hero__title {
      -webkit-padding-start: var(--spacing-xl);
              padding-inline-start: var(--spacing-xl);
    }
    .p-home-hero__shoulder {
      font-size: var(--font-size-xs);
    }
    .p-home-hero__catch-en {
      font-size: var(--font-size-5xl);
    }
    .p-home-hero__title {
      font-size: var(--font-size-lg);
    }
    .p-home-scroll-down {
      right: 50%;
      bottom: var(--spacing-4xl);
      -webkit-transform: translateX(50%);
              transform: translateX(50%);
    }
    .p-home-scroll-down {
      display: none;
    }
    .p-home-product__tagline {
      top: 0;
      line-height: var(--line-height-2xs);
    }
    .p-home-product-card__spec,
    .p-home-product-card__features {
      -webkit-margin-after: var(--spacing-3xl);
              margin-block-end: var(--spacing-3xl);
    }
    .p-home-product-card__makers .c-link {
      display: inline-block;
    }
    .p-home-product-card__download {
      grid-template-columns: 1fr;
      padding: var(--spacing-xl) var(--spacing-sm);
    }
    .p-home-product-card__download-title {
      display: block;
      justify-self: center;
      -webkit-margin-after: var(--spacing-xl);
              margin-block-end: var(--spacing-xl);
    }
    .p-home-product-card-info-box {
      padding: var(--spacing-3xl) var(--spacing-md);
    }
    .p-home-product-card-info-box > * {
      min-inline-size: 0;
    }
    .p-home-product-card-info-box__lead-title {
      text-align: left;
    }
    .p-home-product-card-info-box__gallery .c-figure__media .c-img {
      width: 100%;
    }
    .c-footer-cta__channels {
      grid-template-columns: 1fr;
    }
  }
  @container (min-width: 72rem) {
    .c-callout-box {
      padding: var(--spacing-2xl) var(--spacing-xl);
    }
  }
  @container (min-width: 72rem) {}
}
@layer project {}
/* ========================================================
   utility
   ======================================================== */
@layer utilities {
  /* スクリーンリーダー専用（視覚的に隠すけど読み上げ対象にする） */
  .u-sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: var(--spacing-0, 0);
    overflow: hidden;
    clip: rect(0, 0, 0, 0); /* 旧仕様のフォールバック */
    clip-path: inset(50%); /* 現行ブラウザ向け */
    white-space: nowrap;
    border: 0;
  }
  /* 解除用（必要なら） */
  .u-not-sr-only {
    position: static !important;
    width: auto;
    height: auto;
    margin: var(--spacing-0, 0);
    overflow: visible;
    clip: auto;
    clip-path: none;
    white-space: normal;
    border: 0;
  }
}
@layer utilities {
  .u-bg-text {
    position: absolute;
    z-index: 100;
    color: var(--semantic-text-accent);
    font-family: "Alumni Sans Pinstripe", sans-serif;
    font-size: 128px;
    font-weight: 400;
    font-style: italic;
    line-height: 1.2;
    text-align: right;
  }
}
@layer utilities {
  .u-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .u-center-x {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .u-center-y {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .u-abs-center {
    position: absolute;
    inset-block-start: var(--center-block, 50%);
    inset-inline-start: var(--center-inline, 50%);
    translate: var(--center-translate-x, -50%) var(--center-translate-y, -50%);
  }
  .u-abs-center-x {
    position: absolute;
    inset-inline-start: var(--center-inline, 50%);
    translate: var(--center-translate-x, -50%) 0;
  }
  .u-abs-center-y {
    position: absolute;
    inset-block-start: var(--center-block, 50%);
    translate: 0 var(--center-translate-y, -50%);
  }
  .u-abs-center-before::before {
    position: absolute;
    inset-block-start: var(--center-block, 50%);
    inset-inline-start: var(--center-inline, 50%);
    translate: var(--center-translate-x, -50%) var(--center-translate-y, -50%);
  }
  .u-abs-center-after::after {
    position: absolute;
    inset-block-start: var(--center-block, 50%);
    inset-inline-start: var(--center-inline, 50%);
    translate: var(--center-translate-x, -50%) var(--center-translate-y, -50%);
  }
  .u-abs-center-before-x::before,
  .u-abs-center-after-x::after {
    position: absolute;
    inset-inline-start: var(--center-inline, 50%);
    translate: var(--center-translate-x, -50%) 0;
  }
  .u-abs-center-before-y::before,
  .u-abs-center-after-y::after {
    position: absolute;
    inset-block-start: var(--center-block, 50%);
    translate: 0 var(--center-translate-y, -50%);
  }
}
@layer layout {
  .u-cq-frame {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: 0;
    container-type: inline-size;
  }
}
@layer utilities {
  .u-cq-style {
    container-type: style;
  }
}
@layer utilities {
  .u-layer-low {
    z-index: var(--z-index-layer-low);
  }
  .u-layer-mid {
    z-index: var(--z-index-layer-mid);
  }
  .u-layer-high {
    z-index: var(--z-index-layer-high);
  }
}
@layer utilities {
  .u-list-style-none {
    list-style: none !important;
  }
  .u-list-style-horizontal {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .u-mb-0-last:last-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  .u-debug-boxes *:not(html):not(body) {
    outline: 1px dashed rgba(255, 0, 0, 0.35);
    outline-offset: -1px;
  }
}
@layer utilities {
  .u-cover {
    position: absolute;
    inset: 0;
  }
  .u-screen-fixed {
    position: fixed;
    inset: 0;
  }
  .u-isolate {
    isolation: isolate;
  }
  .u-pe-none {
    pointer-events: none;
  }
  .u-absolute--xs {
    --u-absolute-pin: var(--spacing-xs);
    --u-pin: var(--spacing-xs);
  }
  .u-absolute--sm {
    --u-absolute-pin: var(--spacing-sm);
    --u-pin: var(--spacing-sm);
  }
  .u-absolute--md {
    --u-absolute-pin: var(--spacing-md);
    --u-pin: var(--spacing-md);
  }
  .u-absolute--lg {
    --u-absolute-pin: var(--spacing-lg);
    --u-pin: var(--spacing-lg);
  }
  .u-absolute--xl {
    --u-absolute-pin: var(--spacing-xl);
    --u-pin: var(--spacing-xl);
  }
  .u-absolute--neg-2xl {
    --u-absolute-pin: var(--spacing-neg-2xl, calc(-1 * var(--spacing-2xl)));
    --u-pin: var(--spacing-neg-2xl, calc(-1 * var(--spacing-2xl)));
  }
  .u-absolute-bs--xs {
    --u-absolute-bs: var(--spacing-xs);
  }
  .u-absolute-bs--sm {
    --u-absolute-bs: var(--spacing-sm);
  }
  .u-absolute-bs--md {
    --u-absolute-bs: var(--spacing-md);
  }
  .u-absolute-bs--lg {
    --u-absolute-bs: var(--spacing-lg);
  }
  .u-absolute-bs--xl {
    --u-absolute-bs: var(--spacing-xl);
  }
  .u-absolute-bs--2xl {
    --u-absolute-bs: var(--spacing-2xl);
  }
  .u-absolute-bs--3xl {
    --u-absolute-bs: var(--spacing-3xl);
  }
  .u-absolute-bs--4xl {
    --u-absolute-bs: var(--spacing-4xl);
  }
  .u-absolute-bs--5xl {
    --u-absolute-bs: var(--spacing-5xl);
  }
  .u-absolute-bs--6xl {
    --u-absolute-bs: var(--spacing-6xl);
  }
  .u-absolute-bs--neg-xs {
    --u-absolute-bs: var(--spacing-neg-xs);
  }
  .u-absolute-bs--neg-sm {
    --u-absolute-bs: var(--spacing-neg-sm);
  }
  .u-absolute-bs--neg-md {
    --u-absolute-bs: var(--spacing-neg-md);
  }
  .u-absolute-bs--neg-lg {
    --u-absolute-bs: var(--spacing-neg-lg);
  }
  .u-absolute-bs--neg-xl {
    --u-absolute-bs: var(--spacing-neg-xl);
  }
  .u-absolute-bs--neg-2xl {
    --u-absolute-bs: var(--spacing-neg-2xl);
  }
  .u-absolute-bs--neg-3xl {
    --u-absolute-bs: var(--spacing-neg-3xl);
  }
  .u-absolute-bs--neg-4xl {
    --u-absolute-bs: var(--spacing-neg-4xl);
  }
  .u-absolute-bs--neg-5xl {
    --u-absolute-bs: var(--spacing-neg-5xl);
  }
  .u-absolute-bs--neg-6xl {
    --u-absolute-bs: var(--spacing-neg-6xl);
  }
  .u-absolute-be--xs {
    --u-absolute-be: var(--spacing-xs);
  }
  .u-absolute-be--sm {
    --u-absolute-be: var(--spacing-sm);
  }
  .u-absolute-be--md {
    --u-absolute-be: var(--spacing-md);
  }
  .u-absolute-be--lg {
    --u-absolute-be: var(--spacing-lg);
  }
  .u-absolute-be--xl {
    --u-absolute-be: var(--spacing-xl);
  }
  .u-absolute-be--2xl {
    --u-absolute-be: var(--spacing-2xl);
  }
  .u-absolute-be--3xl {
    --u-absolute-be: var(--spacing-3xl);
  }
  .u-absolute-be--4xl {
    --u-absolute-be: var(--spacing-4xl);
  }
  .u-absolute-be--5xl {
    --u-absolute-be: var(--spacing-5xl);
  }
  .u-absolute-be--6xl {
    --u-absolute-be: var(--spacing-6xl);
  }
  .u-absolute-be--neg-xs {
    --u-absolute-be: var(--spacing-neg-xs);
  }
  .u-absolute-be--neg-sm {
    --u-absolute-be: var(--spacing-neg-sm);
  }
  .u-absolute-be--neg-md {
    --u-absolute-be: var(--spacing-neg-md);
  }
  .u-absolute-be--neg-lg {
    --u-absolute-be: var(--spacing-neg-lg);
  }
  .u-absolute-be--neg-xl {
    --u-absolute-be: var(--spacing-neg-xl);
  }
  .u-absolute-be--neg-2xl {
    --u-absolute-be: var(--spacing-neg-2xl);
  }
  .u-absolute-be--neg-3xl {
    --u-absolute-be: var(--spacing-neg-3xl);
  }
  .u-absolute-be--neg-4xl {
    --u-absolute-be: var(--spacing-neg-4xl);
  }
  .u-absolute-be--neg-5xl {
    --u-absolute-be: var(--spacing-neg-5xl);
  }
  .u-absolute-be--neg-6xl {
    --u-absolute-be: var(--spacing-neg-6xl);
  }
  .u-absolute-is--xs {
    --u-absolute-is: var(--spacing-xs);
  }
  .u-absolute-is--sm {
    --u-absolute-is: var(--spacing-sm);
  }
  .u-absolute-is--md {
    --u-absolute-is: var(--spacing-md);
  }
  .u-absolute-is--lg {
    --u-absolute-is: var(--spacing-lg);
  }
  .u-absolute-is--xl {
    --u-absolute-is: var(--spacing-xl);
  }
  .u-absolute-is--2xl {
    --u-absolute-is: var(--spacing-2xl);
  }
  .u-absolute-is--3xl {
    --u-absolute-is: var(--spacing-3xl);
  }
  .u-absolute-is--4xl {
    --u-absolute-is: var(--spacing-4xl);
  }
  .u-absolute-is--5xl {
    --u-absolute-is: var(--spacing-5xl);
  }
  .u-absolute-is--6xl {
    --u-absolute-is: var(--spacing-6xl);
  }
  .u-absolute-is--neg-xs {
    --u-absolute-is: var(--spacing-neg-xs);
  }
  .u-absolute-is--neg-sm {
    --u-absolute-is: var(--spacing-neg-sm);
  }
  .u-absolute-is--neg-md {
    --u-absolute-is: var(--spacing-neg-md);
  }
  .u-absolute-is--neg-lg {
    --u-absolute-is: var(--spacing-neg-lg);
  }
  .u-absolute-is--neg-xl {
    --u-absolute-is: var(--spacing-neg-xl);
  }
  .u-absolute-is--neg-2xl {
    --u-absolute-is: var(--spacing-neg-2xl);
  }
  .u-absolute-is--neg-3xl {
    --u-absolute-is: var(--spacing-neg-3xl);
  }
  .u-absolute-is--neg-4xl {
    --u-absolute-is: var(--spacing-neg-4xl);
  }
  .u-absolute-is--neg-5xl {
    --u-absolute-is: var(--spacing-neg-5xl);
  }
  .u-absolute-is--neg-6xl {
    --u-absolute-is: var(--spacing-neg-6xl);
  }
  .u-absolute-ie--xs {
    --u-absolute-ie: var(--spacing-xs);
  }
  .u-absolute-ie--sm {
    --u-absolute-ie: var(--spacing-sm);
  }
  .u-absolute-ie--md {
    --u-absolute-ie: var(--spacing-md);
  }
  .u-absolute-ie--lg {
    --u-absolute-ie: var(--spacing-lg);
  }
  .u-absolute-ie--xl {
    --u-absolute-ie: var(--spacing-xl);
  }
  .u-absolute-ie--2xl {
    --u-absolute-ie: var(--spacing-2xl);
  }
  .u-absolute-ie--3xl {
    --u-absolute-ie: var(--spacing-3xl);
  }
  .u-absolute-ie--4xl {
    --u-absolute-ie: var(--spacing-4xl);
  }
  .u-absolute-ie--5xl {
    --u-absolute-ie: var(--spacing-5xl);
  }
  .u-absolute-ie--6xl {
    --u-absolute-ie: var(--spacing-6xl);
  }
  .u-absolute-ie--neg-xs {
    --u-absolute-ie: var(--spacing-neg-xs);
  }
  .u-absolute-ie--neg-sm {
    --u-absolute-ie: var(--spacing-neg-sm);
  }
  .u-absolute-ie--neg-md {
    --u-absolute-ie: var(--spacing-neg-md);
  }
  .u-absolute-ie--neg-lg {
    --u-absolute-ie: var(--spacing-neg-lg);
  }
  .u-absolute-ie--neg-xl {
    --u-absolute-ie: var(--spacing-neg-xl);
  }
  .u-absolute-ie--neg-2xl {
    --u-absolute-ie: var(--spacing-neg-2xl);
  }
  .u-absolute-ie--neg-3xl {
    --u-absolute-ie: var(--spacing-neg-3xl);
  }
  .u-absolute-ie--neg-4xl {
    --u-absolute-ie: var(--spacing-neg-4xl);
  }
  .u-absolute-ie--neg-5xl {
    --u-absolute-ie: var(--spacing-neg-5xl);
  }
  .u-absolute-ie--neg-6xl {
    --u-absolute-ie: var(--spacing-neg-6xl);
  }
  .u-absolute--xs {
    --u-absolute-pin: var(--spacing-xs);
    --u-pin: var(--spacing-xs);
  }
  .u-absolute--sm {
    --u-absolute-pin: var(--spacing-sm);
    --u-pin: var(--spacing-sm);
  }
  .u-absolute--md {
    --u-absolute-pin: var(--spacing-md);
    --u-pin: var(--spacing-md);
  }
  .u-absolute--lg {
    --u-absolute-pin: var(--spacing-lg);
    --u-pin: var(--spacing-lg);
  }
  .u-absolute--xl {
    --u-absolute-pin: var(--spacing-xl);
    --u-pin: var(--spacing-xl);
  }
  .u-absolute--neg-2xl {
    --u-absolute-pin: var(--spacing-neg-2xl, calc(-1 * var(--spacing-2xl)));
    --u-pin: var(--spacing-neg-2xl, calc(-1 * var(--spacing-2xl)));
  }
}
@layer utilities {
  .u-absolute {
    position: absolute;
    inset: auto;
  }
  .u-absolute-bs-is, .u-absolute-tl {
    inset-block-start: var(--u-absolute-pin, var(--u-pin, var(--spacing-sm)));
    inset-inline-start: var(--u-absolute-pin, var(--u-pin, var(--spacing-sm)));
  }
  .u-absolute-bs-ie, .u-absolute-tr {
    inset-block-start: var(--u-absolute-pin, var(--u-pin, var(--spacing-sm)));
    inset-inline-end: var(--u-absolute-pin, var(--u-pin, var(--spacing-sm)));
  }
  .u-absolute-be-is, .u-absolute-bl {
    inset-block-end: var(--u-absolute-pin, var(--u-pin, var(--spacing-sm)));
    inset-inline-start: var(--u-absolute-pin, var(--u-pin, var(--spacing-sm)));
  }
  .u-absolute-be-ie, .u-absolute-br {
    inset-block-end: var(--u-absolute-pin, var(--u-pin, var(--spacing-sm)));
    inset-inline-end: var(--u-absolute-pin, var(--u-pin, var(--spacing-sm)));
  }
  .u-absolute-bs {
    inset-block-start: var(--u-absolute-bs, var(--spacing-sm));
  }
  .u-absolute-be {
    inset-block-end: var(--u-absolute-be, var(--spacing-sm));
  }
  .u-absolute-is {
    inset-inline-start: var(--u-absolute-is, var(--spacing-sm));
  }
  .u-absolute-ie {
    inset-inline-end: var(--u-absolute-ie, var(--spacing-sm));
  }
  .u-absolute-center {
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    inset-block-start: 50%;
    inset-inline-start: 50%;
  }
  .u-absolute-center-x {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    inset-inline-start: 50%;
  }
  .u-absolute-center-y {
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    inset-block-start: 50%;
  }
}
@layer utilities {
  .u-relative--xs {
    --u-relative-offset: var(--spacing-xs);
  }
  .u-relative--sm {
    --u-relative-offset: var(--spacing-sm);
  }
  .u-relative--md {
    --u-relative-offset: var(--spacing-md);
  }
  .u-relative--lg {
    --u-relative-offset: var(--spacing-lg);
  }
  .u-relative--xl {
    --u-relative-offset: var(--spacing-xl);
  }
  .u-relative--neg-2xl {
    --u-relative-offset: var(--spacing-neg-2xl, calc(-1 * var(--spacing-2xl)));
  }
  .u-relative-bs--xs {
    --u-relative-bs: var(--spacing-xs);
  }
  .u-relative-bs--sm {
    --u-relative-bs: var(--spacing-sm);
  }
  .u-relative-bs--md {
    --u-relative-bs: var(--spacing-md);
  }
  .u-relative-bs--lg {
    --u-relative-bs: var(--spacing-lg);
  }
  .u-relative-bs--xl {
    --u-relative-bs: var(--spacing-xl);
  }
  .u-relative-bs--2xl {
    --u-relative-bs: var(--spacing-2xl);
  }
  .u-relative-bs--3xl {
    --u-relative-bs: var(--spacing-3xl);
  }
  .u-relative-bs--4xl {
    --u-relative-bs: var(--spacing-4xl);
  }
  .u-relative-bs--5xl {
    --u-relative-bs: var(--spacing-5xl);
  }
  .u-relative-bs--6xl {
    --u-relative-bs: var(--spacing-6xl);
  }
  .u-relative-bs--neg-xs {
    --u-relative-bs: var(--spacing-neg-xs);
  }
  .u-relative-bs--neg-sm {
    --u-relative-bs: var(--spacing-neg-sm);
  }
  .u-relative-bs--neg-md {
    --u-relative-bs: var(--spacing-neg-md);
  }
  .u-relative-bs--neg-lg {
    --u-relative-bs: var(--spacing-neg-lg);
  }
  .u-relative-bs--neg-xl {
    --u-relative-bs: var(--spacing-neg-xl);
  }
  .u-relative-bs--neg-2xl {
    --u-relative-bs: var(--spacing-neg-2xl);
  }
  .u-relative-bs--neg-3xl {
    --u-relative-bs: var(--spacing-neg-3xl);
  }
  .u-relative-bs--neg-4xl {
    --u-relative-bs: var(--spacing-neg-4xl);
  }
  .u-relative-bs--neg-5xl {
    --u-relative-bs: var(--spacing-neg-5xl);
  }
  .u-relative-bs--neg-6xl {
    --u-relative-bs: var(--spacing-neg-6xl);
  }
  .u-relative-be--xs {
    --u-relative-be: var(--spacing-xs);
  }
  .u-relative-be--sm {
    --u-relative-be: var(--spacing-sm);
  }
  .u-relative-be--md {
    --u-relative-be: var(--spacing-md);
  }
  .u-relative-be--lg {
    --u-relative-be: var(--spacing-lg);
  }
  .u-relative-be--xl {
    --u-relative-be: var(--spacing-xl);
  }
  .u-relative-be--2xl {
    --u-relative-be: var(--spacing-2xl);
  }
  .u-relative-be--3xl {
    --u-relative-be: var(--spacing-3xl);
  }
  .u-relative-be--4xl {
    --u-relative-be: var(--spacing-4xl);
  }
  .u-relative-be--5xl {
    --u-relative-be: var(--spacing-5xl);
  }
  .u-relative-be--6xl {
    --u-relative-be: var(--spacing-6xl);
  }
  .u-relative-be--neg-xs {
    --u-relative-be: var(--spacing-neg-xs);
  }
  .u-relative-be--neg-sm {
    --u-relative-be: var(--spacing-neg-sm);
  }
  .u-relative-be--neg-md {
    --u-relative-be: var(--spacing-neg-md);
  }
  .u-relative-be--neg-lg {
    --u-relative-be: var(--spacing-neg-lg);
  }
  .u-relative-be--neg-xl {
    --u-relative-be: var(--spacing-neg-xl);
  }
  .u-relative-be--neg-2xl {
    --u-relative-be: var(--spacing-neg-2xl);
  }
  .u-relative-be--neg-3xl {
    --u-relative-be: var(--spacing-neg-3xl);
  }
  .u-relative-be--neg-4xl {
    --u-relative-be: var(--spacing-neg-4xl);
  }
  .u-relative-be--neg-5xl {
    --u-relative-be: var(--spacing-neg-5xl);
  }
  .u-relative-be--neg-6xl {
    --u-relative-be: var(--spacing-neg-6xl);
  }
  .u-relative-is--xs {
    --u-relative-is: var(--spacing-xs);
  }
  .u-relative-is--sm {
    --u-relative-is: var(--spacing-sm);
  }
  .u-relative-is--md {
    --u-relative-is: var(--spacing-md);
  }
  .u-relative-is--lg {
    --u-relative-is: var(--spacing-lg);
  }
  .u-relative-is--xl {
    --u-relative-is: var(--spacing-xl);
  }
  .u-relative-is--2xl {
    --u-relative-is: var(--spacing-2xl);
  }
  .u-relative-is--3xl {
    --u-relative-is: var(--spacing-3xl);
  }
  .u-relative-is--4xl {
    --u-relative-is: var(--spacing-4xl);
  }
  .u-relative-is--5xl {
    --u-relative-is: var(--spacing-5xl);
  }
  .u-relative-is--6xl {
    --u-relative-is: var(--spacing-6xl);
  }
  .u-relative-is--neg-xs {
    --u-relative-is: var(--spacing-neg-xs);
  }
  .u-relative-is--neg-sm {
    --u-relative-is: var(--spacing-neg-sm);
  }
  .u-relative-is--neg-md {
    --u-relative-is: var(--spacing-neg-md);
  }
  .u-relative-is--neg-lg {
    --u-relative-is: var(--spacing-neg-lg);
  }
  .u-relative-is--neg-xl {
    --u-relative-is: var(--spacing-neg-xl);
  }
  .u-relative-is--neg-2xl {
    --u-relative-is: var(--spacing-neg-2xl);
  }
  .u-relative-is--neg-3xl {
    --u-relative-is: var(--spacing-neg-3xl);
  }
  .u-relative-is--neg-4xl {
    --u-relative-is: var(--spacing-neg-4xl);
  }
  .u-relative-is--neg-5xl {
    --u-relative-is: var(--spacing-neg-5xl);
  }
  .u-relative-is--neg-6xl {
    --u-relative-is: var(--spacing-neg-6xl);
  }
  .u-relative-ie--xs {
    --u-relative-ie: var(--spacing-xs);
  }
  .u-relative-ie--sm {
    --u-relative-ie: var(--spacing-sm);
  }
  .u-relative-ie--md {
    --u-relative-ie: var(--spacing-md);
  }
  .u-relative-ie--lg {
    --u-relative-ie: var(--spacing-lg);
  }
  .u-relative-ie--xl {
    --u-relative-ie: var(--spacing-xl);
  }
  .u-relative-ie--2xl {
    --u-relative-ie: var(--spacing-2xl);
  }
  .u-relative-ie--3xl {
    --u-relative-ie: var(--spacing-3xl);
  }
  .u-relative-ie--4xl {
    --u-relative-ie: var(--spacing-4xl);
  }
  .u-relative-ie--5xl {
    --u-relative-ie: var(--spacing-5xl);
  }
  .u-relative-ie--6xl {
    --u-relative-ie: var(--spacing-6xl);
  }
  .u-relative-ie--neg-xs {
    --u-relative-ie: var(--spacing-neg-xs);
  }
  .u-relative-ie--neg-sm {
    --u-relative-ie: var(--spacing-neg-sm);
  }
  .u-relative-ie--neg-md {
    --u-relative-ie: var(--spacing-neg-md);
  }
  .u-relative-ie--neg-lg {
    --u-relative-ie: var(--spacing-neg-lg);
  }
  .u-relative-ie--neg-xl {
    --u-relative-ie: var(--spacing-neg-xl);
  }
  .u-relative-ie--neg-2xl {
    --u-relative-ie: var(--spacing-neg-2xl);
  }
  .u-relative-ie--neg-3xl {
    --u-relative-ie: var(--spacing-neg-3xl);
  }
  .u-relative-ie--neg-4xl {
    --u-relative-ie: var(--spacing-neg-4xl);
  }
  .u-relative-ie--neg-5xl {
    --u-relative-ie: var(--spacing-neg-5xl);
  }
  .u-relative-ie--neg-6xl {
    --u-relative-ie: var(--spacing-neg-6xl);
  }
  .u-relative-ie--neg-7xl {
    --u-relative-ie: var(--spacing-neg-7xl);
  }
  .u-relative-ie--neg-8xl {
    --u-relative-ie: var(--spacing-neg-8xl);
  }
}
@layer utilities {
  .u-relative {
    position: relative;
  }
  .u-relative-bs-is {
    inset-block-start: var(--u-relative-offset, 0);
    inset-inline-start: var(--u-relative-offset, 0);
  }
  .u-relative-bs-ie {
    inset-block-start: var(--u-relative-offset, 0);
    inset-inline-end: var(--u-relative-offset, 0);
  }
  .u-relative-be-is {
    inset-block-end: var(--u-relative-offset, 0);
    inset-inline-start: var(--u-relative-offset, 0);
  }
  .u-relative-be-ie {
    inset-block-end: var(--u-relative-offset, 0);
    inset-inline-end: var(--u-relative-offset, 0);
  }
  .u-relative-bs {
    inset-block-start: var(--u-relative-bs, 0);
  }
  .u-relative-be {
    inset-block-end: var(--u-relative-be, 0);
  }
  .u-relative-is {
    inset-inline-start: var(--u-relative-is, 0);
  }
  .u-relative-ie {
    inset-inline-end: var(--u-relative-ie, 0);
  }
}
/* -----------------------------------------------
     utility / responsive
  ------------------------------------------------ */
@layer utilities {
  .u-h-full {
    min-height: -webkit-fill-available;
    min-block-size: 100%;
  }
  .u-bsize-full {
    block-size: 100%;
  }
  .u-fill-grid {
    display: grid;
    min-height: -webkit-fill-available;
    overflow: visible;
    min-block-size: 100%;
  }
}
@layer utilities {
  .u-table-cell-text--emphasis {
    color: #e61e62;
    font-weight: var(--font-weight-bold);
  }
  .u-table-cell-text--emphasis a {
    color: #e61e62;
    -webkit-transition: var(--transition-default);
    transition: var(--transition-default);
  }
  .u-table-column-evenly {
    width: 100%;
    table-layout: fixed;
  }
  .u-table-cell-pad-0 {
    padding: 0 !important;
  }
  .u-table-cell-bg--emphasis {
    background-color: rgb(from var(--semantic-bg-table-emphasis) r g b/0.5);
  }
  .u-col-th {
    text-align: center;
  }
  .u-table-notion {
    display: block;
    margin-top: var(--spacing-sm);
    font-size: var(--font-size-xs);
  }
  .c-img-size--pc-50 {
    display: block;
    block-size: auto;
    inline-size: 100%;
  }
  .u-table-cols-6 {
    --img-cols: 6;
  }
}
@layer utilities {
  .u-text-uppercase {
    text-transform: uppercase;
  }
  .u-text-lowercase {
    text-transform: lowercase;
  }
  .u-text-capitalize {
    text-transform: capitalize;
  }
  .u-text-left {
    text-align: left;
  }
  .u-text-center {
    text-align: center;
  }
  .u-text-right {
    text-align: right;
  }
  .u-text-nowrap {
    white-space: nowrap;
  }
  .u-text-pre-line {
    white-space: pre-line;
  }
  .u-font-normal {
    font-weight: 400;
  }
  .u-font-bold {
    font-weight: 700;
  }
  .u-font-italic {
    font-style: italic;
  }
  .u-text-underline {
    text-decoration: underline;
  }
  .u-text-line-through {
    text-decoration: line-through;
  }
  .u-text-sup {
    font-size: var(--font-size-2xs);
  }
  .u-block {
    display: block;
  }
  .u-br--sm {
    display: none;
  }
  @media (width <= 48rem) {
    .u-center--sm {
      text-align: center;
    }
  }
  @supports (word-break: auto-phrase) {
    [lang=ja] .u-wrap-auto-phrase {
      word-break: auto-phrase;
    }
  }
}
@layer utilities {
  .u-screen {
    min-block-size: 100vh;
    min-block-size: 100dvh;
  }
  .u-screen-grid {
    display: grid;
    overflow: visible;
    min-block-size: 100vh;
    min-block-size: 100dvh;
  }
  .u-grid {
    display: grid;
  }
  .u-overflow-visible {
    overflow: visible;
  }
}
/* ========================================================
   Responsive Tokens
   ======================================================== */
@layer foundation {
  :root {
    --bp-phone: 48rem;
    --bp-tablet: 64rem;
    --bp-desktop: 76.5rem;
    --bp-wide: 96rem;
    --bp-phone-xs: 30rem;
    --cq-1col-max: 40rem;
    --cq-2col-min: 56rem;
    --cq-wide-min: 72rem;
  }
  @property --device {
    inherits: true;
    initial-value: "phone";
    syntax: "*";
  }
  :root {
    --device: "phone";
  }
  @media (min-width: 64rem) {
    :root {
      --device: "tablet";
    }
  }
  @media (min-width: 76.5rem) {
    :root {
      --device: "desktop";
    }
  }
  @media (min-width: 96rem) {
    :root {
      --device: "wide";
    }
  }
  @property --phone-size {
    inherits: true;
    initial-value: "base";
    syntax: "*";
  }
  :root {
    --phone-size: "base";
  }
  @media (width < 30rem) {
    :root {
      --phone-size: "xs";
    }
  }
  @media (min-width: 48rem) {
    :root {
      --container-gutter-fluid: clamp(1rem, 3vw, 2rem);
      --container-max-lead-fluid: 37.5rem;
      --container-max-narrow-fluid: 56rem;
      --container-max-default-fluid: 72rem;
      --container-max-wide-fluid: 84rem;
    }
  }
  @media (min-width: 64rem) {
    :root {
      --container-gutter-fluid: clamp(1rem, 2.8vw, 2rem);
      --container-max-lead-fluid: 40rem;
      --container-max-narrow-fluid: 58rem;
      --container-max-default-fluid: 74rem;
      --container-max-wide-fluid: 88rem;
    }
  }
  @media (min-width: 76.5rem) {
    :root {
      --container-gutter-fluid: clamp(1rem, 2.5vw, 2rem);
      --container-max-lead-fluid: 42rem;
      --container-max-narrow-fluid: 60rem;
      --container-max-default-fluid: 76rem;
      --container-max-wide-fluid: 90rem;
    }
  }
  @media (min-width: 96rem) {
    :root {
      --container-gutter-fluid: clamp(1rem, 1.8vw, 2rem);
      --container-max-lead-fluid: 48rem;
      --container-max-narrow-fluid: 68rem;
      --container-max-default-fluid: 88rem;
      --container-max-wide-fluid: 104rem;
    }
  }
}/*# sourceMappingURL=main.css.map */