@charset "UTF-8";
/* ==========================================================================
   utility.css — u-系（単体タグで完結するもの）（SPD-v2）
   ========================================================================== */

.u-inner {
  inline-size: 100%;
  max-inline-size: calc(var(--inner-max) + var(--inner-pad) * 2);
  margin-inline: auto;
  padding-inline: var(--inner-pad);

  &._min {
    max-inline-size: calc(var(--inner-min) + var(--inner-pad) * 2);
  }
}

.u-only-sp {
  @media print, screen and (min-width: 640px) {
    display: none;
  }
}

.u-only-pc {
  display: none;

  @media print, screen and (min-width: 640px) {
    display: revert;
  }
}

.u-sr {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.u-mt-xs { margin-block-start: var(--sp-xs); }
.u-mt-s { margin-block-start: var(--sp-s); }
.u-mt-m { margin-block-start: var(--sp-m); }
.u-mt-l { margin-block-start: var(--sp-l); }

/* スクロールで見えたときに、ふわっと出す（iv-）
   common.js が html に is-ivReady を付けたときだけ隠す＝JSが動かなければ最初から見えている。
   _stagger は子要素を順番に出す（カードの並びなど）
   ========================================================================== */
.is-ivReady .iv-fade:not(._stagger),
.is-ivReady .iv-fade._stagger > * {
  opacity: 0;
  translate: 0 2.4rem;
  transition: opacity 0.9s ease, translate 1s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.is-ivReady .iv-fade.is-inview:not(._stagger),
.is-ivReady .iv-fade._stagger.is-inview > * {
  opacity: 1;
  translate: none;
}

.iv-fade._stagger > :nth-child(2) { transition-delay: 0.1s; }
.iv-fade._stagger > :nth-child(3) { transition-delay: 0.2s; }
.iv-fade._stagger > :nth-child(4) { transition-delay: 0.3s; }
.iv-fade._stagger > :nth-child(5) { transition-delay: 0.4s; }
.iv-fade._stagger > :nth-child(n + 6) { transition-delay: 0.5s; }

/* stylelint-disable declaration-no-important -- SPD-v2 で許可された例外（印刷） */
@media print {
  .iv-fade,
  .iv-fade > *,
  .c-hero-body > * {
    opacity: 1 !important;
    translate: none !important;
    animation: none !important;
  }
}
/* stylelint-enable declaration-no-important */