@layer reset, base, components, pages;

@layer reset{

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
}

@layer base{
:root {
  --base-fs: 16px;

  --itsm-font-family-base: 'Jost', 'Noto Sans JP', sans-serif;

  /* Color styles */
  --itsm-color-main: #C91A1D;
  --itsm-color-base: #FAFAFA;
  --itsm-color-base-light: #FFFFFF;
  --itsm-color-base-light-rgb: 255, 255, 255;
  --itsm-color-black: #000000;
  --itsm-color-main-dark: #BE2021;
  --itsm-color-gray-light: #C5C5C5;
  --itsm-color-gray-lighter: #ECECEC;
  --itsm-color-blue: #2FADFF;
  --itsm-color-yellow: #FF9100;
  --itsm-color-purple: #8E5E8B;
  --itsm-color-bluepurple: #7B6EA2;
  --itsm-color-gray: #BBBBBB;

  /* Text-size styles */
  --itsm-title-xxxlarge: 60px;
  --itsm-title-xxlarge: 40px;
  --itsm-title-section-sub: 13px;
  --itsm-text-xlarge: 26px;
  --itsm-text-large: 22px;
  --itsm-text-medium: 20px;
  --itsm-text: 16px;
  --itsm-text-small: 14px;
  --itsm-text-xsmall: 12px;
  --itsm-text-xxsmall: 10px;
  --itsm-text-linewide: 16px;
  --itsm-text-button: 16px;
  --itsm-text-button-small: 14px;
  --itsm-text-label: 14px;
  --itsm-text-label-small: 13px;
  --itsm-text-button-xsmall: 12px;
  --itsm-title-page-sub: 24px;
  --itsm-text-formlabel: 16px;
  --itsm-textlink: 16px;

  --itsm-space-y-container-large: 140px;
  --itsm-space-y-container-medium: 105px;
  --itsm-space-x-container-base: 100px;

  --itsm-gap-large: 210px;
  --itsm-gap-medium: 128px;
  --itsm-gap-base: 64px;
  --itsm-gap-xsmall: 24px;

  --itsm-content-max-width: 1080px;

  /* Z-index layers */
  --itsm-z-kv: 1;
  --itsm-z-content: 2;
  --itsm-z-header: 100;
  --itsm-z-page-transition: 200;
}

  @media (max-width: 768px) {
:root {
    --text-scale: 0.8;
    /* Text-size styles */
    --itsm-title-xxxlarge: calc(60px * var(--text-scale));
    --itsm-title-xxlarge: calc(40px * var(--text-scale));
    --itsm-title-section-sub: calc(13px * var(--text-scale));
    --itsm-text-xlarge: calc(26px * var(--text-scale));
    --itsm-text-large: calc(22px * var(--text-scale));
    --itsm-text: calc(16px * var(--text-scale));
    --itsm-text-small: calc(14px * var(--text-scale));
    --itsm-text-xsmall: calc(12px * var(--text-scale));
    --itsm-text-xxsmall: calc(10px * var(--text-scale));
    --itsm-text-linewide: calc(16px * var(--text-scale));
    --itsm-text-button: calc(16px * var(--text-scale));
    --itsm-text-button-small: calc(14px * var(--text-scale));
    --itsm-text-label: calc(14px * var(--text-scale));
    --itsm-text-label-small: calc(13px * var(--text-scale));
    --itsm-text-button-xsmall: calc(12px * var(--text-scale));
    --itsm-title-page-sub: calc(24px * var(--text-scale));
    --itsm-text-formlabel: calc(16px * var(--text-scale));
    --itsm-textlink: calc(16px * var(--text-scale));

    --itsm-space-y-container-large: 80px;
    --itsm-space-y-container-medium: 40px;
    --itsm-space-x-container-base: 20px;

    --itsm-gap-large: 96px;
    --itsm-gap-medium: 48px;
    --itsm-gap-base: 24px;
    --itsm-gap-xsmall: 12px;

    --itsm-content-max-width: 1080px
}

  }
}

@layer base{

.l-container {
  box-sizing: content-box;
  max-width: var(--itsm-content-max-width);
  margin: 0 auto;
  padding-inline: var(--itsm-space-x-container-base);
}

.l-full-bleed {
  width: 100vw;
  margin-inline: calc(-50vw + 50%);
}

.l-container--medium {
  padding-block: var(--itsm-space-y-container-medium);
}

.l-container--large {
  padding-block: var(--itsm-space-y-container-large);
}

.l-col-1-separate {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--itsm-gap-large);
}

.l-col-1-single {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--itsm-gap-base);
}

.l-col-2 {
  display: grid;
  grid-template-columns: 1fr auto;
}

.l-col-2-wrap {
  display: flex;
  flex-wrap: wrap;
  row-gap: var(--l-col-2-wrap-row-gap, var(--l-col-2-wrap-gap), var(--itsm-gap-medium));
  -moz-column-gap: var(--l-col-2-wrap-col-gap, var(--l-col-2-wrap-gap),var(--itsm-gap-medium));
       column-gap: var(--l-col-2-wrap-col-gap, var(--l-col-2-wrap-gap),var(--itsm-gap-medium));
  align-items: flex-start;
}

.l-col-2-wrap__sub {
  flex: 0 1 var(--l-col-2-wrap-sub, 240px);
}

.l-col-2-wrap__main {
  flex: 1 1 var(--l-col-2-wrap-main, 500px);
}

.justify-items-start {
  justify-items: start;
}

.justify-items-end {
  justify-items: end;
}

#wrapper {
  min-height: 100dvh;
  display: grid;
  align-items: start;
}
}

@layer base{

html {
  scroll-padding-top: var(--itsm-header-height, 90px);
}

.page-index {
  overflow-x: clip;
}

body {
  margin: 0;
  font-family: var(--itsm-font-family-base);
  background: var(--itsm-color-base);
}
  @media (max-width: 768px) {

br.pc {
    display: none
}
  }
  @media (min-width: 768.1px) {

br.sp {
    display: none
}
  }

a:link, a:visited, a:hover, a:active {
  color: inherit;
}

.bg-main {
  background: var(--itsm-color-main);
}
.bg-base-light {
  background: var(--itsm-color-base-light);
}
.bg-gray-light {
  background: var(--itsm-color-gray-light);
}
}

@layer base{

@keyframes fadein-up {
  from {
    opacity: 0;
    translate: 0 20px;
  }
  to {
    opacity: 1;
    translate: 0 0;
  }
}

main#main > *:not(.c-page-title) {
  --fadein-delay: 1.3s;
  animation: fadein-up 0.6s ease-out var(--fadein-delay) backwards;
}

.page-index main#main > * {
  animation: none;
}

@media (prefers-reduced-motion: reduce) {
  main#main > *:not(.c-page-title) {
    animation: none;
  }
}
}

@layer components{

/* ==========================================================================
   Typography Component (.c-text)
   ========================================================================== */

.c-text--title-xxxlarge {
  font-size: var(--itsm-title-xxxlarge);
  line-height: 100%;
  font-family: 'Jost', sans-serif;
  letter-spacing: 0.05em;
}

.c-text--title-page-sub {
  font-size: var(--itsm-title-page-sub);
  line-height: 100%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--title-xxlarge {
  font-size: var(--itsm-title-xxlarge);
  line-height: 100%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--title-section-sub {
  font-size: var(--itsm-title-section-sub);
  line-height: 100%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--xlarge {
  font-size: var(--itsm-text-xlarge);
  line-height: 140%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--large {
  font-size: var(--itsm-text-large);
  line-height: 140%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--base {
  font-size: var(--itsm-text);
  line-height: 160%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--small {
  font-size: var(--itsm-text-small);
  line-height: 133%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}
.c-text--xsmall {
  font-size: var(--itsm-text-xsmall);
  line-height: 133%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}
.c-text--xxsmall {
  font-size: var(--itsm-text-xxsmall);
  line-height: 133%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--linewide {
  font-size: var(--itsm-text-linewide);
  line-height: 180%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--button {
  font-size: var(--itsm-text-button);
  line-height: 100%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--button-small {
  font-size: var(--itsm-text-button-small);
  line-height: 100%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--button-xsmall {
  font-size: var(--itsm-text-button-xsmall);
  line-height: 100%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--label {
  font-size: var(--itsm-text-label);
  line-height: 100%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text--label-small {
  font-size: var(--itsm-text-label-small);
  line-height: 100%;
  font-family: var(--itsm-font-family-base);
  letter-spacing: 0.05em;
}

.c-text-color--main {
  color: var(--itsm-color-main);
}

.c-text-bold {
  font-weight: bold;
}

/* ==========================================================================
   Title Component (.c-header)
   ========================================================================== */

.c-sec-title {
  display: grid;
  gap: 14px;
  grid-template-columns: 1fr;
}
  .c-sec-title .c-sec-title--en {
    font-size: var(--itsm-title-xxlarge);
    line-height: 100%;
    font-family: var(--itsm-font-family-base);
  }
  .c-sec-title .c-sec-title--jp {
    font-size: var(--itsm-title-section-sub);
    line-height: 100%;
    font-family: var(--itsm-font-family-base);
  }
}

@layer components{
.c-page-title {
  position: relative;
}

  .c-page-title .c-page-title__wrap {
    display: grid;
    grid-template-columns: 1fr;
    padding-block: calc(var(--itsm-space-y-container-medium) * 1.5 + var(--itsm-header-height)) calc(var(--itsm-space-y-container-medium) * 2);
    gap: 30px;
  }
    @media (max-width: 768px) {

  .c-page-title .c-page-title__wrap {
      padding-block: calc(var(--itsm-space-y-container-medium) * 4 + var(--itsm-header-height)) calc(var(--itsm-space-y-container-medium) * 8)
  }
    }
  .c-page-title .c-page-title__en {
    color: var(--itsm-color-main);
    font-size: var(--itsm-title-xxxlarge);
    font-weight: bold;
    line-height: 1;
  }
  .c-page-title .c-page-title__jp {
    font-size: var(--itsm-title-page-sub);
    line-height: 2;
  }
  .c-page-title .c-page-title__wave {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
  }
}

@layer components{

.c-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--itsm-color-main);
  border-radius: 9999px;
  font-size: var(--itsm-text-label);
  color: var(--itsm-color-main);
  letter-spacing: 0.05em;
  line-height: 1;
  min-width: calc(96px - 1em);
  padding: 5px 1em;
  width: -moz-max-content;
  width: max-content;
}

.c-label--medium {
  width: -moz-max-content;
  width: max-content;
  border: solid 1px var(--itsm-color-main-dark);
  border-radius: 9999px;
  padding: 2px 20px;
  font-size: var(--itsm-text-label);
  color: var(--itsm-color-main-dark);
  display: grid;
  place-content: center;
  height: 28px;
}

.c-label--black {
  border-color: var(--itsm-color-black);
  color: var(--itsm-color-black);
}

.c-label--gray {
  border-color: var(--itsm-color-gray);
  color: var(--itsm-color-black);
  background: var(--itsm-color-base-light);
}
}

@layer components{

/* ==========================================================================
   Header Layout (.l-header)
   ========================================================================== */

.l-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: var(--itsm-z-header);
  font-family: var(--itsm-font-family-base);
  box-sizing: border-box;
  padding: unset;
  max-width: unset;
  margin: unset;

  /* ---------- Logo ---------- */

  /* ---------- Navigation ---------- */



  /* ---------- CTA Actions ---------- */


  /* ---------- Hamburger Button ---------- */

  /* ---------- Responsive ---------- */

  /* ---------- Mobile Menu ---------- */
}
  .l-header * {
    box-sizing: unset;
  }

  @media (min-width: 768.1px) {

.l-header {
    height: 90px
}
  }
  .l-header::before {
    content: '';
    position: absolute;
    inset: 0;
    background-color: rgba(var(--itsm-color-base-light-rgb), 0.4);
    backdrop-filter: blur(10px);
    z-index: -1;
  }

  .l-header .l-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1440px;
    height: 100%;
    margin: 0 auto;
    padding: 0 40px;
  }
    @media (max-width: 768px) {

  .l-header .l-header__inner {
      padding-left: var(--itsm-space-x-container-base);
      padding-right: 0
  }
    }

  .l-header .l-header__logo {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    text-decoration: none;
    transition: opacity 0.3s;
  }
    @media (max-width: 768px) {

  .l-header .l-header__logo {
      width: 35%
  }
    }

  .l-header .l-header__logo:hover {
    opacity: 0.7;
  }

  .l-header .l-header__logo svg {
    display: block;
    width: 149px;
    height: 33px;
  }

  .l-header .l-header__nav {
    flex: 0 1 auto;
    display: flex;
    justify-content: center;
    margin-right: 1em;
    margin-left: auto;

    background: none;
  }
    .l-header .l-header__nav .l-header__nav-list {
      display: flex;
      align-items: center;
      gap: 20px;
      list-style: none;
      margin: 0;
      padding: 0;
      border: none;
      max-width: unset;
    }
      .l-header .l-header__nav .l-header__nav-list .l-header__nav-item {
        all: unset;
      }

    .l-header .l-header__nav .l-header__nav-link {
      position: relative;
      font-size: var(--itsm-text-small);
      font-weight: 600;
      color: var(--itsm-color-black);
      text-decoration: none;
      letter-spacing: 0.05em;
      line-height: 1;
      transition: color 0.3s;
      display: inline;
    }

    .l-header .l-header__nav .l-header__nav-link:hover {
      color: var(--itsm-color-main);
    }

    .l-header .l-header__nav .l-header__nav-link::after {
      content: '';
      position: absolute;
      bottom: -6px;
      left: 0;
      width: 100%;
      height: 2px;
      background-color: var(--itsm-color-main);
      transform: scaleX(0);
      transform-origin: right center;
      transition: transform 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    }

    .l-header .l-header__nav .l-header__nav-link:hover::after {
      transform: scaleX(1);
      transform-origin: left center;
    }

  .l-header .l-header__actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
  }
    @media (max-width: 768px) {

  .l-header .l-header__actions {
      display: grid;
      gap: 1px;
      margin-left: auto;
      flex-shrink: 1;
      min-width: 0;
      align-items: flex-end;
      grid-auto-flow: column;
      background: var(--itsm-color-base-light)
  }
      .l-header .l-header__actions .c-link__cta {
        height: 60px;
        width: 60px;
        border-radius: 0;
        display: grid;
        border-radius: none;
        height: 100%;
        overflow: hidden;
        padding-inline: 12px;
        align-items: center;
      }
        .l-header .l-header__actions .c-link__cta .c-link__icon {
          height: 32px;
        }
        .l-header .l-header__actions .c-link__cta .c-link__text {
          margin-bottom: auto;
          display: none;
        }
    }

  .l-header .l-header__burger {
    display: none;
  }

  @media (max-width: 1079.9px) {
    .l-header .l-header__nav {
      display: none;
    }
  }

  @media (max-width: 768px) {
    .l-header .l-header__burger {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 6px;
      width: 60px;
      height: 60px;
      padding: 0;
      background: none;
      border: none;
      cursor: pointer;
      z-index: 1;
      background: var(--itsm-color-base-light);
    }

    .l-header .l-header__burger-line {
      display: block;
      width: 22px;
      height: 2px;
      background-color: var(--itsm-color-black);
      transition: transform 0.3s, opacity 0.3s;
    }

    .l-header.is-menu-open .l-header__burger-line:nth-child(1) {
      transform: translateY(8px) rotate(45deg);
    }

    .l-header.is-menu-open .l-header__burger-line:nth-child(2) {
      opacity: 0;
    }

    .l-header.is-menu-open .l-header__burger-line:nth-child(3) {
      transform: translateY(-8px) rotate(-45deg);
    }

    .l-header.is-menu-open::before {
      display: none;
    }

    .l-header .l-header__nav.is-menu-open {
      display: flex;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100dvh;
      background-color: rgba(var(--itsm-color-base-light-rgb), 1);
      /* backdrop-filter: blur(10px); */
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
      padding-top: var(--itsm-header-height);
      overflow-y: auto;
      z-index: -1;
    }

    .l-header .l-header__nav.is-menu-open .l-header__nav-list {
      flex-direction: column;
      gap: 0;
      width: 100%;
    }

    .l-header .l-header__nav.is-menu-open .l-header__nav-item {
      width: 100%;
      border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    }

    .l-header .l-header__nav.is-menu-open .l-header__nav-link {
      display: block;
      padding: 20px var(--itsm-space-x-container-base);
      font-size: var(--itsm-text-base);
    }

    .l-header .l-header__nav.is-menu-open .l-header__nav-link::after {
      display: none;
    }
  }

body.is-menu-open {
  overflow: hidden;
}
}

@layer components{
.l-footer {
  position: relative;
  z-index: var(--itsm-z-content);
  background: var(--itsm-color-main);
  min-height: 400px;
  overflow: hidden;
  margin-top: auto;

  text-align: unset;
  color: unset;
  padding-top: unset;
  padding-bottom: unset;
}

  @media (max-width: 768px) {
.l-footer {
    min-height: 300px
}
  }
  .l-footer .l-footer__container {
    max-width: 1280px;
  }
  .l-footer .l-footer__content {
    position: relative;
    z-index: 1;
  }
  .l-footer .l-footer__nav {
    display: inline-flex;
    gap: 20px;
    flex-wrap: wrap;
    max-width: 780px;
    font-size: var(--itsm-text-large);
  }
    @media (min-width: 768.1px) {
  .l-footer .l-footer__nav {
      padding-top: 60px;
      padding-left: 95px
  }
    }
    @media (max-width: 768px) {
  .l-footer .l-footer__nav {
      padding-block: var(--itsm-space-y-container-medium);
      padding-inline: var(--itsm-space-x-container-base)
  }
    }
    .l-footer .l-footer__nav a {
      color: var(--itsm-color-base);
      text-decoration: none;
      line-height: 1;
    }
  .l-footer .l-footer__logo {
    position: absolute;
    left: 40px;
    bottom: -4px;
    z-index: 0;
    max-width: 887px;
  }
  .l-footer small {
    position: absolute;
    right: 20px;
    bottom: 20px;
    color: var(--itsm-color-base);
    z-index: 1;
  }
}

@layer components{

/* ==========================================================================
   Link Component (.c-link)
   ========================================================================== */

.c-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--itsm-color-main);
  border-radius: 9999px;
  cursor: pointer;
  text-decoration: none;
  font-family: var(--itsm-font-family-base);
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1;
  transition: color 0.3s, background-color 0.3s;
  box-sizing: border-box;
  /* button reset */
  background: none;
  padding: 0;
}

/* ---------- Color variants ---------- */

.c-link--primary, a.c-link--primary {
  background-color: var(--itsm-color-main);
  color: var(--itsm-color-base-light);
}

.c-link--primary:hover {
  background-color: var(--itsm-color-base-light);
  color: var(--itsm-color-main);
}

.c-link--secondary, a.c-link--secondary {
  background-color: var(--itsm-color-base-light);
  color: var(--itsm-color-main);
  border: solid 1px var(--itsm-color-main);
}

.c-link--secondary:hover {
  background-color: var(--itsm-color-main);
  color: var(--itsm-color-base-light);
  border: solid 1px var(--itsm-color-base-light);
}

/* ---------- Size variants ---------- */

.c-link--large {
  height: 56px;
  min-width: 274px;
  padding: 0 32px;
  font-size: 14px;
}

  @media (max-width: 768px) {

.c-link--large {
    min-width: auto;
    padding: 0 24px
}
  }

.c-link--medium {
  height: 48px;
  min-width: 212px;
  padding: 0 24px;
  font-size: 14px;
}

  @media (max-width: 768px) {

.c-link--medium {
    min-width: auto;
    padding: 0 20px
}
  }

.c-link--small {
  height: 36px;
  min-width: 187px;
  padding: 0 20px;
  font-size: 12px;
}
  @media (max-width: 768px) {

.c-link--small {
    min-width: auto
}
  }

.c-link--xsmall {
  height: 30px;
  min-width: 140px;
  padding: 0 16px;
  font-size: 12px;
}
  @media (max-width: 768px) {

.c-link--xsmall {
    min-width: auto
}
  }

/* ---------- ----------*/
.c-link--block {
  border-radius: 4px;
}

/* ---------- Page link (large + icon rotated 90deg) ---------- */

.c-link--pagelink {
  height: 56px;
  min-width: 274px;
  padding: 0 32px;
  font-size: 14px;
}

  @media (max-width: 768px) {

.c-link--pagelink {
    min-width: auto;
    padding: 0 24px
}
  }

.c-link--pagelink .c-link__icon {
  transform: rotate(90deg);
}

/* ---------- Icon ---------- */

.c-link__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform 0.3s;
}

.c-link__icon svg {
  display: block;
  width: 1em;
  height: 1em;
  fill: currentColor;
}

/* ---------- CTA ---------- */

.c-link__cta {
  height: 40px;
  min-width: auto;
  padding: 0 24px;
  font-size: var(--itsm-text);
  font-weight: 400;

}

.c-link__cta .c-link__icon svg {
  width: calc(var(--fs-size) * 2px);
  height: calc(var(--fs-size) * 2px);
  fill: none;
}
.c-link__download .c-link__icon svg {
  width: calc(var(--fs-size) * 1.4);
  height: calc(var(--fs-size) * 1.4);
  fill: none;
}


/* ==========================================================================
   LinkText Component (.c-link-text)
   ========================================================================== */

.c-link-text {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--itsm-color-black);
  text-decoration: underline;
  text-underline-offset: 3px;
  font-family: var(--itsm-font-family-base);
  cursor: pointer;
  transition: color 0.3s;
  /* button/link reset */
  background: none;
  border: none;
  padding: 0;
}

.c-link-text:hover {
  color: var(--itsm-color-main);
}

.c-link-text--pdf {
  gap: 8px;
}

.c-link-text__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: color 0.3s;
}

.c-link-text__icon svg {
  display: block;
  width: 1em;
  height: 1em;
  fill: currentColor;
}
}

@layer components{
@layer components {
  .c-bread-menu {
    display: flex;
    flex-direction: column;
  }

    /* 単独リンク項目 */
    .c-bread-menu .c-bread-menu__item {
      display: flex;
      align-items: center;
      padding: 14px 20px;
      border-bottom: 1px solid var(--itsm-color-gray);
      font-family: var(--itsm-font-family-base);
      font-size: var(--itsm-text);
      font-weight: 400;
      line-height: 1.8;
      color: var(--itsm-color-black);
      text-decoration: none;
      transition: background 0.3s;
    }

      .c-bread-menu .c-bread-menu__item:hover {
        background: #f5f5f5;
      }

      .c-bread-menu .c-bread-menu__item.is-current {
        background: var(--itsm-color-black);
        color: var(--itsm-color-base-light);
        pointer-events: none;
      }

    /* アコーディオングループ */
    .c-bread-menu .c-bread-menu__group {
      border-bottom: 1px solid var(--itsm-color-gray);
    }

    /* グループヘッダー（黒背景） */
    .c-bread-menu .c-bread-menu__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      position: relative;
      padding: 14px 20px;
      margin: 0;
      border: none;
      font-family: var(--itsm-font-family-base);
      font-size: var(--itsm-text-small);
      line-height: 1.8;
      color: var(--itsm-color-black);
      cursor: pointer;
      list-style: none;
    }

      .c-bread-menu .c-bread-menu__header::-webkit-details-marker {
        display: none;
      }

      .c-bread-menu .c-bread-menu__header::marker {
        display: none;
        content: "";
      }

    /* トグルアイコン */
    .c-bread-menu .c-bread-menu__toggle {
      display: inline-block;
      position: absolute;
      width: 16px;
      height: 16px;
      flex-shrink: 0;
      right: 14px;
    }

      .c-bread-menu .c-bread-menu__toggle::before,
      .c-bread-menu .c-bread-menu__toggle::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        background: var(--itsm-color-black);
        transition: transform 0.3s;
      }

      /* 横線（常に表示） */
      .c-bread-menu .c-bread-menu__toggle::before {
        width: 14px;
        height: 2px;
        transform: translate(-50%, -50%);
      }

      /* 縦線（閉じ時のみ表示） */
      .c-bread-menu .c-bread-menu__toggle::after {
        width: 2px;
        height: 14px;
        transform: translate(-50%, -50%);
      }

    /* 開いている時：縦線を回転して消す */
    .c-bread-menu .c-bread-menu__group[open] .c-bread-menu__toggle::after {
      transform: translate(-50%, -50%) rotate(90deg);
    }
    .c-bread-menu .c-bread-menu__group[open] .c-bread-menu__header {
      background: var(--itsm-color-gray-light);
    }

    /* サブ項目リスト */
    .c-bread-menu .c-bread-menu__body {
      display: flex;
      flex-direction: column;
    }

    /* サブ項目リンク */
    .c-bread-menu .c-bread-menu__subitem {
      display: flex;
      align-items: center;
      padding: 14px 20px 14px 32px;
      border-bottom: 1px solid var(--itsm-color-gray);
      font-family: var(--itsm-font-family-base);
      font-size: var(--itsm-text-small);
      font-weight: 400;
      line-height: 1.8;
      color: var(--itsm-color-black);
      text-decoration: none;
      transition: background 0.3s;
    }

      .c-bread-menu .c-bread-menu__subitem:last-child {
        border-bottom: none;
      }

      .c-bread-menu .c-bread-menu__subitem:hover {
        background: #f5f5f5;
      }

      /* アクティブページ */
      .c-bread-menu .c-bread-menu__subitem.is-current {
        background: var(--itsm-color-black);
        color: var(--itsm-color-base-light);
        pointer-events: none;
      }

    /* SP パンくず用セパレータ（PCでは非表示） */
    .c-bread-menu .c-bread-menu__separator {
      display: none;
    }


    @media (max-width: 1080px) {
  .c-bread-menu {
      /* display: none; */
      flex-grow: 1
  }
    }
}
}

@layer components{
.c-cta {
  background: var(--itsm-color-base-light);
}
  .c-cta .c-cta__container {
    position: relative;
    z-index: var(--itsm-z-content);
    padding-top: var(--itsm-space-y-container-medium);
    padding-bottom:  var(--itsm-space-y-container-large);
  }
  .c-cta .c-cta__items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 40px 24px;
  }
    @media (max-width: 768px) {
  .c-cta .c-cta__items {
      grid-template-columns: 1fr
  }
    }
  .c-cta .c-cta__item {
    max-width: 520px;
    min-width: 280px;
    aspect-ratio: 520 / 253;
    border-radius: 8px;
    position: relative;
    overflow: hidden;
    color: var(--itsm-color-main);
    text-decoration: none;
    display: grid;
    place-items: center;
    align-content: center;
    background: var(--itsm-color-base);
    container-type: inline-size;
    transition-duration: 0.3s;
    transition-property: color background;
    border: solid 1px var(--itsm-color-main);
  }
    .c-cta .c-cta__item:hover, .c-cta .c-cta__item:active {
      background: var(--itsm-color-main);
      color: var(--itsm-color-base-light);

    }
    @media (max-width: 768px) {
  .c-cta .c-cta__item {
      width: 100%;
      max-width: none;
      min-width: none
  }
    }
    .c-cta .c-cta__item .c-cta__item--title {
      /* font-size: var(--itsm-text-xlarge); */
      font-size: 6cqw;
      line-height: 1.4;
      margin-bottom: calc(var(--itsm-text) / 1.6);
      font-weight: 700;
    }
    .c-cta .c-cta__item .c-cta__item--text {
      font-size: 4cqw;
      line-height: 1.33;
      text-align: center;
    }
    .c-cta .c-cta__item::before {
      content: '';
      display: block;
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: -1;
      filter: brightness(0.5);
      background-size: cover;
    }
}

@layer pages{
/* メインコンテンツのセクション間ギャップを調整 */
.l-col-2-wrap__main.l-col-1-separate {
  --itsm-gap-large: 80px;
}

  @media (max-width: 768px) {
.l-col-2-wrap__main.l-col-1-separate {
    --itsm-gap-large: 48px
}
  }

/* 2カラムレイアウト設定 */
.sec-ir {
  --l-col-2-wrap-sub: 200px;
  --l-col-2-wrap-main: 500px;
  --l-col-2-wrap-col-gap: 80px;
  --l-col-2-wrap-row-gap: 40px;
}
  @media (min-width: 768.1px) {

.l-col-2-wrap__main {
    order: -1
}
  }

.p-title-link {
  margin-top: auto;
}

.ir_calendar_box img {
  width: 100%;
}

.xj_chart_table {
  font-size: var(--itsm-text-xsmall);
}
  @media (max-width: 768px) {

.xj_chart_table {
    font-size: 14px
}
  }
  .xj_chart_table tbody tr:first-of-type,
  .xj_chart_table .xj_chart_header {
    background: #eaeaea;
    width: 3em;
    text-align: center;
  }
  .xj_chart_table td {
    border: solid 1px var(--itsm-color-gray-light);
    padding: 0.5em 0.25em;
  }
  .xj_chart_table td.xj_chart_value {
    text-align: right;
  }

.c-finance_note {
  display: grid;
  gap: 1.5rem;
  font-size: var(--itsm-text-small);
}
  .c-finance_note .c-finance_note_text {
    line-height: 1.33;
    padding-left: 1em;
    text-indent: -1em;
    margin-bottom: 0.25em;
  }
  .c-finance_note .c-finance_note_list {
    font-size: var(--itsm-text);
    line-height: 1.6;
  }
  .c-finance_note .c-finance_note_list_title {
    font-size: var(--itsm-text-large);
    margin-bottom: 0.75rem;
    display: block;

  }
  .sec-milestone .sec-milestone-wrap {
    grid-area: year;
    display: grid;
    grid-template-columns: 6em 2px auto;
    grid-template-areas: "year bar content";
  }
    @media (max-width: 768px) {
  .sec-milestone .sec-milestone-wrap {
      grid-template-columns: 4em 2px auto
  }

    }
  .sec-milestone .sec-milestone-year {
    grid-area: year;
    font-size: var(--itsm-text-xlarge);
  }
  .sec-milestone .bar {
    width: 2px;
    height: 100%;
    background: #000;
    grid-area: bar;
    margin-top: 6px;
  }
  .sec-milestone .dot {
    width: 12px;
    height: 12px;
    background: #000;
    border-radius: 9999px;
    position: absolute;
    left: -7px;
    margin-top: 6px;
  }
  .sec-milestone .sec-milestone-box {
    position: relative;
    grid-area: content;
    display: grid;
    gap: 32px;
  }
  .sec-milestone .sec-milestone-item {
    display: grid;
    grid-auto-flow: column;
    gap: 24px 0;
    padding-left: 30px;
    padding-bottom: 38px;
  }
    @media (max-width: 768px) {
  .sec-milestone .sec-milestone-item {
      grid-template-rows: auto auto;
      grid-template-areas: "top" "bottom";
      padding-left: 20px
  }
    }
  .sec-milestone .sec-milestone-image {
    width: 160px;
    height: auto;
    flex-shrink: 0;
    border-radius: 4px;
    max-height: 220px;
    -o-object-fit: contain;
       object-fit: contain;
    margin-right: 20px;
  }
    @media (max-width: 768px) {
  .sec-milestone .sec-milestone-image {
      grid-area: bottom;
      margin-left: calc(4ch + 16px)
  }
    }
  .sec-milestone .sec-milestone-b {
    display: grid;
    grid-template-columns: 4ch auto;
    grid-template-areas: "month content";
    gap: 16px;

  }
    @media (max-width: 768px) {
  .sec-milestone .sec-milestone-b {
      grid-area: top;
      grid-template-columns: 4ch auto

  }
    }
  .sec-milestone .sec-milestone-month {
    grid-area: month;
    display: inline-block;
    text-align: right;
    line-height: 1.6;
  }
    @media (max-width: 768px) {
  .sec-milestone .sec-milestone-month {
      text-align: left
  }
    }

  .sec-milestone .sec-milestone-content {
    grid-area: content;
    display: flex;
    gap: 16px;
    flex-direction: column;
  }
    .sec-milestone .sec-milestone-content.sec-milestone-content--no-month {
      grid-column: span 2;
    }
  .sec-milestone .sec-milestone-title,
  .sec-milestone .sec-milestone-desc {
    grid-auto-flow: column;
    line-height: 1.6;
  }

.c-docs {
  display: grid;
  gap: calc(var(--itsm-text) * 4);
}
  .c-docs .c-docs__heading {
    font-size: var(--itsm-text-xlarge);
    line-height: 1.4;
  }
  .c-docs .c-docs__section {
    display: grid;
    gap: calc(var(--itsm-text) * 1.5);
  }
  .c-docs .c-docs__text {
    font-size: var(--itsm-text);
    line-height: 1.6;
  }
  .c-docs .c-docs__text--large {
    line-height: 2;
  }
}

@layer pages{
  /* メインコンテンツのセクション間ギャップを調整 */
  .page-ir .l-col-2-wrap__main.l-col-1-separate {
    --itsm-gap-large: 80px;
    width: 100%;
  }

    @media (max-width: 768px) {
  .page-ir .l-col-2-wrap__main.l-col-1-separate {
      --itsm-gap-large: 48px
  }
    }

  /* 2カラムレイアウト設定 */
  .page-ir .sec-ir {
    --l-col-2-wrap-sub: 200px;
    --l-col-2-wrap-main: 500px;
    --l-col-2-wrap-col-gap: 80px;
    --l-col-2-wrap-row-gap: 80px;
  }
    @media (max-width: 768px) {
  .page-ir .sec-ir {
      --l-col-2-wrap-row-gap: var(--itsm-gap-large)
  }
    }

  .page-ir .l-col-2-wrap__main {
    order: -1;
  }

  .page-ir .p-title-link {
    margin-top: auto;
  }

  .page-ir .sec-ir-top-links {
    font-size: var(--itsm-text);
    gap: 24px 48px;
    display: flex;
    flex-wrap: wrap;
  }
    .page-ir .sec-ir-top-links .sec-ir-top-link {
      flex: 1 1 min(376px, 100%);
      width: 100%;
      display: grid;
      gap: 13px;
      text-decoration: none;
      color: var(--itsm-color-black);
     }
      @media (min-width: 768.1px) {
    .page-ir .sec-ir-top-links .sec-ir-top-link {
        flex: 0 1 min(376px, 100%)
     }
      }
    .page-ir .sec-ir-top-links .thumb {
      width: 100%;
    }
      .page-ir .sec-ir-top-links .thumb img {
        border-radius: 7px;
        width: 100%;
        -o-object-fit: contain;
           object-fit: contain;
      }

  /* ── itsumo. in Numbers ── */
  .page-ir .sec-ir-numbers__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
  }

    @media (max-width: 768px) {
  .page-ir .sec-ir-numbers__grid {
      grid-template-columns: 1fr;
      gap: 16px
  }
    }

  .page-ir .sec-ir-numbers__card {
    display: grid;
    gap: 8px;
    padding-block: 20px;
    background: var(--itsm-color-base);
    /* border-radius: 8px; */
    border-bottom: 1px solid var(--itsm-color-gray);
    flex: 1 1 min(calc(250/800*100%), 250px);
  }

  .page-ir .sec-ir-numbers__card-label {
    font-size: var(--itsm-text);
    line-height: 1.6;
    color: var(--itsm-color-black);
    margin-inline: auto;
  }

  .page-ir .sec-ir-numbers__card-image {
    width: 92px;
    aspect-ratio: 1 / 1;
    border-radius: 4px;
    margin-inline: auto;
  }
    .page-ir .sec-ir-numbers__card-image img {
      -o-object-fit: contain;
         object-fit: contain;
      width: 100%;
      height: 100%;
    }

  .page-ir .sec-ir-numbers__card-value {
    font-size: var(--itsm-text-large);
    line-height: 1;
    display: flex;
    align-items: flex-end;
    gap: 0.25em;
    justify-content: center;
  }

  .page-ir .sec-ir-numbers__num-unit {
    font-size: calc(var(--itsm-title-xxlarge) * 0.9);
  }
  .page-ir .sec-ir-numbers__num {
    font-family: 'Jost', sans-serif;
    font-weight: 600;
    color: var(--itsm-color-main);
    font-size: var(--itsm-title-xxlarge);
    line-height: 0.85;
    letter-spacing: -0.02em;
  }

  .page-ir .sec-ir-numbers__card-value svg {
    flex-shrink: 0;
  }

  .page-ir .sec-ir-numbers__employee {
    display: flex;
    align-items: baseline;
    gap: 16px;
    padding-block: 20px;
  }

    @media (max-width: 768px) {

  .page-ir .sec-ir-numbers__employee {
      flex-direction: column;
      gap: 8px
  }
    }

  .page-ir .sec-ir-numbers__employee-label {
    font-size: var(--itsm-text);
    line-height: 1.6;
    white-space: nowrap;
  }

  .page-ir .sec-ir-numbers__employee-value {
    font-size: var(--itsm-text-large);
    font-weight: 600;
    color: var(--itsm-color-main);
  }

  .page-ir .sec-ir-numbers__market {
    display: grid;
    grid-template-columns: repeat(2, auto);
    gap: 16px;
    padding: 24px;
    background: var(--itsm-color-base);
    border: 1px solid var(--itsm-color-black);
    justify-content: space-between;

    flex: 1 1 min(calc(470/800*100%), 520px);
  }

    @media (max-width: 768px) {

  .page-ir .sec-ir-numbers__market {
      padding: 20px
  }
    }
    .page-ir .sec-ir-numbers__market a {
      margin-top: auto;
      color: var(--itsm-color-black);
      display: inline;
    }

  .page-ir .sec-ir-numbers__market-title {
    font-size: var(--itsm-text);
    line-height: 1.6;
  }

  .page-ir .sec-ir-numbers__market-value {
    font-size: calc(var(--itsm-title-xxlarge) * 0.9);
    font-weight: 600;
    line-height: 1.2;
  }

  .page-ir .sec-ir-numbers__market-value small {
    font-size: var(--itsm-text-small);
    font-weight: 400;
    color: var(--itsm-color-black);
  }

  .page-ir .sec-ir-numbers__market-source {
    font-size: var(--itsm-text-link);
    line-height: 1.6;
  }

  /* ── IR News ── */
  .page-ir .sec-ir-news__list {
    display: grid;
    gap: 0;
  }

  .page-ir .sec-ir-news__item {
    display: grid;
    grid-template-rows: auto auto;
    gap: 16px;
    align-items: start;
    padding-block: 20px;
    border-bottom: 1px solid var(--itsm-color-gray);
  }

    .page-ir .sec-ir-news__item:first-child {
      border-top: 1px solid var(--itsm-color-gray);
    }

    @media (max-width: 768px) {

  .page-ir .sec-ir-news__item {
      grid-template-columns: auto auto;
      gap: 8px 12px
  }
    }

  .page-ir .sec-ir-news__head {
    /* たいとる横リンクの調整をする */
    display: flex;
    gap: 1em;
  }

  .page-ir .sec-ir-news__date {
    font-size: var(--itsm-text-small);
    line-height: 1.8;
    white-space: nowrap;
  }

  .page-ir .sec-ir-news__title {
    font-size: var(--itsm-text);
    line-height: 1.8;
    grid-column: 1 / 4;
  }


    @media (max-width: 768px) {

  .page-ir .sec-ir-news__title {
      grid-column: 1 / -1
  }
    }

  .page-ir .sec-ir-news__title a {
    color: var(--itsm-color-black);
    text-decoration: none;
    display: inline;
    align-items: center;
  }
    .page-ir .sec-ir-news__title a svg {
      display: inline-block;
      margin-left: 0.5em;
      margin-bottom: -0.25em;
    }

    .page-ir .sec-ir-news__title a:hover {
      text-decoration: underline;
    }

  /* ── IR Materials ── */
  .page-ir .sec-ir-materials__list {
    display: grid;
    gap: 0;
  }

  .page-ir .sec-ir-materials__item {
    padding-block: 16px;
    border-bottom: 1px solid var(--itsm-color-gray);
  }

    .page-ir .sec-ir-materials__item:first-child {
      border-top: 1px solid var(--itsm-color-gray);
    }

  .page-ir .sec-ir-materials__actions {
    display: flex;
    justify-content: center;
    padding-top: 32px;
  }

  /* ── IR Calendar ── */
    .page-ir .sec-ir-calendar__timeline img {
      width: 100%;
    }

  .page-ir .sec-ir-calendar__quarters {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    text-align: center;
  }

  .page-ir .sec-ir-calendar__quarter {
    padding: 8px;
    font-size: var(--itsm-text-small);
    font-weight: 600;
    border-bottom: 2px solid var(--itsm-color-main);
  }

  .page-ir .sec-ir-calendar__months {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0;
    text-align: center;
  }

  .page-ir .sec-ir-calendar__month {
    padding: 8px 4px;
    font-size: var(--itsm-text-xsmall);
    border-right: 1px solid var(--itsm-color-gray);
  }

    .page-ir .sec-ir-calendar__month:last-child {
      border-right: none;
    }

  .page-ir .sec-ir-calendar__events {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0;
    margin-top: 8px;
  }

  .page-ir .sec-ir-calendar__event {
    font-size: var(--itsm-text-xxsmall);
    text-align: center;
    padding: 4px 2px;
    line-height: 1.4;
    color: var(--itsm-color-main);
  }

  .page-ir .sec-ir-calendar__schedule {
    display: grid;
    gap: 0;
  }

  .page-ir .sec-ir-calendar__schedule-item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 24px;
    padding-block: 16px;
    border-bottom: 1px solid var(--itsm-color-gray);

  }

  .page-ir .sec-ir-calendar__schedule-date {
    font-size: var(--itsm-text-small);
    line-height: 1.8;
    white-space: nowrap;
  }

  .page-ir .sec-ir-calendar__schedule-title {
    font-size: var(--itsm-text);
    line-height: 1.8;
  }

  /* ── フッターリンク（3カラム） ── */
  .page-ir .sec-ir-links {
    display: grid;
    border: 1px solid var(--itsm-color-black);
    padding: 48px;
    gap: 105px;
    margin-top: 210px;
  }
  .page-ir .sec-ir-links__container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;

  }
    @media (max-width: 768px) {
  .page-ir .sec-ir-links__container {
      grid-template-columns: 1fr;
      gap: 32px

  }
    }

  .page-ir .sec-ir-links__arrow {
    margin-left: auto;
  }
  .page-ir .sec-ir-links__icon {
    height: -moz-fit-content;
    height: fit-content;
    aspect-ratio: 19 / 20;
  }

  .page-ir .sec-ir-links__group {
    display: grid;
    gap: 0;
    align-content: start;
  }

  .page-ir .sec-ir-links__heading {
    display: grid;
    gap: 8px;
    padding-bottom: 16px;
    margin-bottom: 0;
  }

  .page-ir .sec-ir-links__heading-en {
    font-size: var(--itsm-text-medium);
    font-weight: 600;
    line-height: 1.4;
  }

  .page-ir .sec-ir-links__heading-jp {
    font-size: var(--itsm-text-xsmall);
    line-height: 1;
  }

  .page-ir .sec-ir-links__list {
    list-style: none;
  }
  .page-ir .sec-ir-links__list--cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-content: space-between;
    gap: 24px 48px;
  }
    @media (max-width: 768px) {
  .page-ir .sec-ir-links__list--cols {
      gap: 12px 24px
  }

    }

  .page-ir .sec-ir-links__list li {
    border-bottom: 1px solid var(--itsm-color-gray);
  }
  .page-ir .sec-ir-links__list li:empty {
    border: none;
    height: calc(28px + 1.8em);
  }
  @media (max-width: 768px) {
    .page-ir .sec-ir-links__list li:empty:not(last-of-type) {
      display: none;
    }
    .page-ir .sec-ir-links__list:last-of-type {
      margin-top: calc(28px + 1em);
    }
  }

  .page-ir .sec-ir-links__list a {
    display: flex;
    align-items: center;
    padding: 14px 0;
    font-size: var(--itsm-text-small);
    line-height: 1.8;
    color: var(--itsm-color-black);
    text-decoration: none;
  }

    .page-ir .sec-ir-links__list a:hover {
      color: var(--itsm-color-main);
    }
}