/*
  ローディング画面、Goodsセクションの足跡アニメーション
  src/scss/__config/components/layout/_loading.scss
  src/scss/__config/top/_top-goods.scss
*/
.l-loader, #Goods {
  overflow: hidden;

  .l-loader__sokuseki,
  .goods--comingsoon__sokuseki {
    aspect-ratio: 128 / 680;
  }
  .l-loader__sokuseki > img,
  .goods--comingsoon__sokuseki > img {
    position: absolute;
    inset: 0;
    opacity: 0;
  }
  .l-loader__sokuseki > img {
    animation: sokusekiFadeIn 1s cubic-bezier(0.645, 0.045, 0.355, 1.000) forwards;
    &.sokuseki3 { animation-delay: 0.3s; }
    &.sokuseki2 { animation-delay: 0.6s; }
    &.sokuseki1 { animation-delay: 0.9s; }
  }
  &.is__scrolled .goods--comingsoon__sokuseki > img {
    animation: sokusekiFadeIn 1.2s cubic-bezier(0.645, 0.045, 0.355, 1.000) forwards;
    &.sokuseki3 { animation-delay: 0.4s; }
    &.sokuseki2 { animation-delay: 0.6s; }
    &.sokuseki1 { animation-delay: 0.8s; }
  }
}

/*
  .md-btn__links OFF
*/
.md-btn__links.btn-off {
  pointer-events: none;
  &[data-color="black-off"] {
    background-color: var(--link-color);
    color: var(--blue-gray);
    &::before {
      background-image: inherit;
      background-color: var(--blue-gray);
      mask-image: url(../images/_common/icon/icon_ticket.svg);
      -webkit-mask-image: url(../images/_common/icon/icon_ticket.svg);
      mask-size: contain;
      -webkit-mask-size: contain;
      mask-repeat: no-repeat;
      -webkit-mask-repeat: no-repeat;
    }
    > span::after {
      background-image: inherit;
    }
  }
}

/*
  CONTACT ボタン OFF
*/
#Contact {
  .contact_btn-off {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    aspect-ratio: 312 / 60;
    margin-bottom: calc(12 / 402 * 100vw);
    color: var(--blue-gray);
    font-size: calc(15 / 402 * 100vw);
    font-weight: 600;
    background-color: var(--link-color);
    border-radius: 60px;

    @media screen and (min-width: 769px) {
      width: 49.0566037736%;
      margin-bottom: inherit;
      font-size: 1.25vw;
    }

    @media screen and (min-width: 1200px) {
      font-size: 15px;
    }
  }
}
