@charset "utf-8";
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/tyo/common/font/NotoSansJP-900.woff2) format('woff2');
}
@font-face {
  font-family: 'Material Symbols Rounded';
  font-style: normal;
  font-weight: 100 700;
  font-display: swap;
  src: url(/tyo/common/font/MaterialSymbolsRounded.woff2) format('woff2');
}
/*★ リセット ★*/
.main {
  div:not([class])::after {
    content: none;
  }
  a {
    text-decoration: none;
  }
  .is-em {
    font-weight: bold;
  }
}
/* #topbuttonApp, */
#searchArea {
  position: relative;
  z-index: 5;
}
/*------------------------------------------------*/
/*★ ページスタイル設定 ★*/
#hisApp {
  position: relative;
  overflow: hidden;
}
:root {
  --default-max-height: 100lvh;
  --default-color-black: #000;
  --default-color-red: #e90000;
  --default-color-red2: #c21500;
  --default-color-yellow: #ffe100;
  --default-color-gradation_red: linear-gradient(#8e1507, #c81d09);
  --default-color-gradation_white: linear-gradient(#fff, #dfe9f3);
  --default-color-bg: #101010;
  --default-font-size-pc-val: 16;
  --default-font-size-pc: 16px;
  --default-font-size-sp: calc(24vw / 7.5);
  --default-font-size: min(var(--default-font-size-sp), var(--default-font-size-pc));
  --default-width-sp-val: 710;
  --default-width-pc-val: 992;
  --default-width-sp: (710vw / 7.5);
  --default-width-pc: 992px;
  --default-width: min(var(--default-width-sp), var(--default-width-pc));
  --default-bg-width-pc: max(100%, 1920px);
  --default-width2: min(100%, var(--default-width-pc));
  --default-bg-width-pc: max(100%, 1920px);
  --default-ff-icon: 'Material Symbols Rounded';
  --default-ico-arrow-r: '\e5e1';
  --default-ico-blank: '\e89e';
  --default-hover-speed: 0.3s;
  --default-hover-opacity: 0.75;
  --default-hover-transition-opacity: opacity var(--default-hover-speed);
  --default-hover-transition-color: color var(--default-hover-speed);
  --default-hover-transition-transform: transform var(--default-hover-speed);
}
.material-symbols-rounded {
  font-family: var(--default-ff-icon);
  font-weight: normal;
  font-style: normal;
  font-size: 1em;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}
.main {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: var(--default-font-size);
  color: var(--ui-static-black);
  line-height: var(--default-font-lh);
  /* overflow: hidden; */ /* 検索ボックスで表示出来なくなる要素があるのでコメントアウト中 */
  padding-bottom: 0 !important;
  /*background: var(--default-color-bg); ★★*/
  a[class*='link'] {
    color: inherit;
  }
}
.is-inline-block {
  display: inline-block;
}
.is-indent-1,
.section [class*='notes--item'] {
  text-indent: -1em;
  padding-left: 1em;
}
.is-sp .is-dsp-pc,
.is-pc .is-dsp-sp {
  display: none !important;
}
.js-accordion-button {
  cursor: pointer;
  + * {
    display: none;
  }
}
.js-toggleControl:not([class*='active']) {
  cursor: pointer;
}
/*.float-button*/
.float-button {
  position: fixed;
  --posi: min((6vw / 7.5), 10px);
  top: var(--posi);
  right: var(--posi);
  z-index: 10;
  transition: var(--default-hover-transition-transform);
  &.is-over,
  &:not(.is-fixed) {
    transform: translateX(120%);
  }
}
.float-button__image {
  display: block;
  width: min((197vw / 7.5), 197px);
  aspect-ratio: 197 / 194;
}
/*button*/
[class*='__button--wrapper'] {
  display: grid;
  gap: min((18vw / 7.5), 12px);
  &.is-column-2 {
    .is-pc & {
      grid-template-columns: repeat(2, 1fr);
    }
  }
}
.base-button {
  color: #fff;
  .ui-static-button {
    border: none;
    &.is-type-blank {
      .ui-static-icon-size-medium {
        font-size: 17px;
      }
    }
  }
  .base-button__link {
    --bth-base-color: var(--default-color-gradation_red);
    --bth-color: var(--bth-base-color);
    background: var(--bth-color);
    position: relative;
    z-index: 1;
    width: 100%;
    line-height: 1.3;
    text-align: center;
    box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.23);
    .is-sp & {
      height: auto;
      min-height: 44px;
      border-radius: calc(20vw / 7.5);
      box-shadow: min((3vw / 7.5), 3px) min((3vw / 7.5), 3px) 0px 0px rgba(0, 0, 0, 0.5);
    }
    &:not([href^='#soldout']) {
      &::before {
        content: '';
        position: absolute;
        inset: 0;
        z-index: -1;
        background: var(--default-color-gradation_white);
        border: 1px solid rgba(0, 0, 0, 0);
        border-radius: 100px;
        opacity: 0;
      }
      .is-sp & {
        &::before {
          content: none;
        }
      }
    }
    &[href^='#soldout'] {
      --bth-base-color: #a8a8a8;
    }
  }
}
/*.base-textlink*/
.base-textlink__texts {
  display: flex;
  align-items: center;
  gap: 0.25em;
  color: var(--ui-static-unleash-blue-100);
  line-height: 1.2;
  .ui-static-icon {
    color: inherit;
  }
}
/*banner*/
.banner__wrapper {
  display: grid;
  justify-items: center;
  gap: var(--gap, min((28vw / 7.5), 15px));
  width: min(var(--default-width-sp), 960px);
  margin: var(--yohaku-top, 0) auto var(--yohaku-btm, 0);
  @media (width >=650px) {
    grid-template-columns: repeat(2, 1fr);
    .banner:only-of-type {
      grid-column: span 2;
    }
    .banner__notes {
      grid-column: span 2;
    }
  }
}
.is-pc .banner__wrapper {
  --gap: 28px;
  .banner.is-size-full {
    grid-column: span 2;
  }
}
.is-sp .banner__wrapper .banner {
  /*max-width: 400px;*/
}
.banner__notes {
  color: #000;
  font-size: min((20vw / 7.5), 12px);
  justify-self: end;
  margin-top: max((-9vw / 7.5), -15px);
}
/*page-top-button*/
#goTop {
  .page-top-button {
    transition: none;
    width: min((132vw / 7.5), 132px);
    height: min((131vw / 7.5), 131px);
    position: relative;
    background: url('../images/go_to_button.webp') no-repeat center center / contain;
    .ui-static-icon {
      display: none;
    }
  }
}

/*------------------------------------------------*/
/*★ ＝＝ hover ＝＝ ★*/
@media (hover: hover) and (pointer: fine) {
  .base-button__link {
    &:not([href^='#soldout']) {
      &:hover {
        transition: var(--default-hover-speed);
        color: var(--default-color-red2) !important;
        &::before {
          transition: var(--default-hover-speed);
          opacity: 1;
        }
        .ui-static-icon {
          transition: var(--default-hover-speed);
          color: var(--default-color-red2) !important;
        }
      }
    }
    &[href^='#soldout'] {
      &:hover {
        transition: var(--default-hover-speed);
        opacity: 0.5;
      }
    }
  }
  .base-textlink__link {
    &:hover {
      .base-textlink__text {
        text-decoration: underline;
        text-underline-offset: 0.2em;
      }
    }
  }
  .banner {
    background: #fff;
  }
  a.banner__link,
  .float-button__link {
    transition: var(--default-hover-speed);
    &:hover {
      opacity: var(--default-hover-opacity);
    }
  }
}