@charset "utf-8";
@font-face {
  font-family: 'Niconne';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/tyo/common/font/Niconne-400.woff2) format('woff2');
}
@font-face {
  font-family: 'Zen Kaku Gothic New';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/tyo/common/font/ZenKakuGothicNew-700.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');
}
@font-face {
  font-family: 'Zen Kaku Gothic New';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/tyo/common/font/ZenKakuGothicNew-500.woff2) format('woff2');
}
@font-face {
  font-family: 'Zen Kaku Gothic New';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/tyo/common/font/ZenKakuGothicNew-900.woff2) format('woff2');
}
@font-face {
  font-family: 'Italianno';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/tyo/common/font/Italianno-400.woff2) format('woff2');
}
/*★ リセット ★*/
.main {
  div:not([class])::after {
    content: none;
  }
  a {
    text-decoration: none;
  }
  .is-em {
    font-weight: bold;
  }
  h1, h2, h3, h4, h5, h6, p, ul, ol {
    font-weight: inherit;
  }
}
#topbuttonApp, #searchArea {
  position: relative;
  z-index: 1;
}
/*------------------------------------------------*/
/*★ ページスタイル設定 ★*/
#hisApp {
  position: relative;
  overflow: hidden;
}
:root {
  --default-font-size-pc: 16px;
  --default-font-size-sp: calc(14vw / 3.75);
  --default-font-size: min(var(--default-font-size-sp), var(--default-font-size-pc));
  --default-font-lh: calc(24 / 14);
  --default-width-sp-val: 336;
  --default-width-pc-val: 1104;
  --default-width-sp: (336vw / 3.75);
  --default-width-pc: 1104px;
  --default-width: min(var(--default-width-sp), var(--default-width-pc));
  --default-width2: min(100%, var(--default-width-pc));
  --default-bg-width-pc: max(100%, 1920px);
  --default-ff-icon: "Material Symbols Rounded";
  --default-ff-en: "Niconne", cursive;
  --default-ff-num: "Italianno", cursive;
  --default-ico-arrow-r: "\e5e1";
  --default-ico-arrow-d: "\e313";
  --default-ico-blank: "\e89e";
  --default-color-black: #4E4E4E; /*black*/
  --default-color-brown: #B7A783; /*brown-2*/
  --default-color-brown-light: #ECE5D2; /*bg1*/
  --default-color-brown-dark: #94825B; /*brown-1*/
  --default-color-brown-dark2: #917944; /*brown-3*/
  --default-color-pink: #F06A95; /*pink-2*/
  --default-color-pink-light: #FFF3F4; /*bg6*/
  --default-color-pink-dark: #E02C65; /*pink-1*/
  --default-color-green: #13B29C; /*dom*/
  --default-color-green-light: #D4ECEA; /*bg-dom*/
  --default-color-gray: #737373; /*notice*/
  --default-hover-speed: .3s;
  --default-hover-opacity: .8;
  --default-hover-transition-opacity: opacity var(--default-hover-speed);
  --default-hover-transition-background: background var(--default-hover-speed);
  --default-hover-transition-color: color var(--default-hover-speed);
  --default-hover-transition-scale: scale var(--default-hover-speed);
  --default-hover-transition-box-shadow: box-shadow var(--default-hover-speed);
  --default-shadow: 0px -6px 8px 0px rgba(0, 0, 0, 0.15);
  --default-border: 1px dashed var(--default-color-brown);
  --hisnav-h: 77px;
  --breadcrumb-h: 34px;
  --gnav-h: min((46vw / 3.75), 46px);
  --banner-bg: rgba(0, 0, 0, .2);
  .is-pc {
    --default-font-lh: calc(28 / 16); /*1.75*/
  }
  @media (width > 767px) {
    --hisnav-h: 69px;
  }
}
.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;
}
#pageApp {
  --main-color: var(--default-color-pink);
  --sub-color1: var(--default-color-pink-dark);
  --sub-color2: var(--default-color-pink-light);
  --sec-yohaku1: min((120vw / 3.75), 180px);
  --sec-yohaku2: min((80vw / 3.75), 150px);
  --sec-yohaku3: min((90vw / 3.75), 180px);
  font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  font-size: var(--default-font-size);
  font-weight: bold;
  color: var(--default-color-black);
  line-height: var(--default-font-lh);
  padding-bottom: 0 !important;
  #searchApp {
    font-weight: normal;
    font-family: "Noto Sans JP", sans-serif;
  }
  img:is([class*="photo--item"], [class*="kazari--item"], .article__image) {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
  }
}
.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;
}
.is-sp :is(.js-sp-gnav-open-trigger, .js-sp-gnav-close-trigger), .is-pc .js-pc-gnav-open-trigger {
  cursor: pointer;
}
.ui-static-breadcrumb {
  min-height: var(--breadcrumb-h);
}
/*base-button*/
.base-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: min((8vw / 3.75), 10px);
}
.base-button {
  --btn-bg: #fff;
  /*btn1_ankor*/
  &.is-type-A {
    --btn-bc: #E0D2B2;
    --btn-fc: inherit;
    --btn-fs: min((12vw / 3.75), 14px);
    --bth-lh: 1.2;
    --btn-ic: var(--default-color-brown);
    --bth-yohaku: min((9vw / 3.75), 9px) min((11vw / 3.75), 15px);
    --bth-pr2: min((6vw / 3.75), 8px);
    --bth-gap: min((4vw / 3.75), 4px);
    --bth-gap2: min((8vw / 3.75), 8px);
  }
  /*btn_big2*/
  &.is-type-B {
    --btn-bc: var(--main-color);
    --btn-fc: var(--main-color);
    --bth-lh: 1;
    --btn-ic: inherit;
    --bth-yohaku: min((9vw / 3.75), 11px) min((15vw / 3.75), 31px);
    --bth-pr: min((12vw / 3.75), 28px);
    --bth-pr2: min((8vw / 3.75), 16px);
    --bth-gap: min((6vw / 3.75), 8px);
    --bth-gap2: min((12vw / 3.75), 16px);
    /*btn2*/
    &.is-small {
      --btn-fs: min((12vw / 3.75), 14px);
      --bth-lh: calc(16 / 14);
      --bth-gap: min((4vw / 3.75), 6px);
      --bth-gap2: min((18vw / 3.75), 12px);
    }
  }
  /*btn_big1*/
  &.is-type-C {
    --btn-bg: var(--main-color);
    --btn-bc: var(--main-color);
    --btn-fc: #fff;
    --bth-lh: 1;
    --btn-ic: inherit;
    --bth-yohaku: min((9vw / 3.75), 11px) min((15vw / 3.75), 31px);
    --bth-pr: min((12vw / 3.75), 28px);
    --bth-pr2: min((8vw / 3.75), 16px);
    --bth-gap: min((6vw / 3.75), 8px);
    --bth-gap2: min((12vw / 3.75), 16px);
  }
  .ui-static-button {
    &, &:not(.active):not(:disabled):active, &:focus, &.active, &.focused {
      border: 1px solid var(--btn-bc);
      border-radius: 500px;
      color: var(--btn-fc);
      font-size: var(--btn-fs, min((12vw / 3.75), 16px));
      line-height: var(--bth-lh);
      text-align: center;
      gap: var(--bth-gap);
      padding: var(--bth-yohaku);
      padding-right: var(--bth-pr);
      background: var(--btn-bg);
      margin: auto;
      height: max-content;
      min-width: auto;
      &:not(.is-type-blank) {
        padding-right: var(--bth-pr2);
      }
      &.is-type-blank {
        --bth-gap: var(--bth-gap2);
      }
      .ui-static-icon {
        --wght: 400;
        color: var(--btn-ic);
        font-size: 1.5em;
        line-height: .5;
        position: static;
        transform: translateY(.05em);
        .is-type-blank & {
          font-size: 1em;
        }
      }
    }
  }
}
/*.base-textlink*/
.base-textlink {
  .base-textlink__texts {
    display: flex;
    align-items: center;
    gap: .25em;
    color: var(--ui-static-unleash-blue-100);
    line-height: 1.2;
    .ui-static-icon {
      color: inherit;
    }
  }
}
/*base-banner*/
.base-banner {
  &.mutual-banner {
    width: max-content;
    margin: min((100vw / 3.75), 150px) auto 0;
    .base-banner__link {
      width: min((300vw / 3.75), 600px);
      height: min((80vw / 3.75), 160px);
    }
  }
  .base-banner__link {
    display: block;
    position: relative;
    > :is(.base-banner__text, .base-banner__texts) {
      width: 100%;
      height: 100%;
      display: grid;
      justify-items: center;
      align-items: center;
      position: relative;
      z-index: 1;
      color: #fff;
      line-height: calc(20 / 16);
      text-align: center;
      text-shadow: 0px 0px 4px rgba(0, 0, 0, .7);
      box-shadow: 0px 2px 4px rgba(0, 0, 0, .25);
      background: var(--bg, var(--banner-bg));
      .mutual-banner & {
        font-size: min((14vw / 3.75), 20px);
        line-height: calc(34 / 20);
      }
    }
    .base-banner__texts {
      position: absolute;
      top: 0;
      left: 0;
      padding: .5em;
    }
  }
}
/*notes*/
.notes-lineup--item {
  padding-left: 1em;
  text-indent: -1em;
  font-size: min((12vw / 3.75), 14px);
  line-height: 1.5;
  color: var(--default-color-gray);
  &:not(:first-child) {
    margin-top: min((16vw / 3.75), 16px);
  }
}
/*page-top-button*/
#goTop {
  .page-top-button {
    transition: none;
    --pagetop-icon-size: min((100vw / 3.75), 180px);
    width: var(--pagetop-icon-size);
    height: var(--pagetop-icon-size);
    position: relative;
    background: none;
    &::before, &::after {
      content: "";
      display: block;
      width: 100%;
      height: 100%;
      background: var(--pagetop-icon-bg) no-repeat center center / contain;
      position: absolute;
      top: 0;
      left: 0;
      opacity: var(--pagetop-icon-opacity);
    }
    &::before {
      --pagetop-icon-bg: url("../images/btn_top_on.svg");
      --pagetop-icon-opacity: 0;
    }
    &::after {
      --pagetop-icon-opacity: 1;
      --pagetop-icon-bg: url("../images/btn_top_off.svg");
    }
    /*background: var(--pagetop-icon-bg, url("../images/btn_top_off.svg")) no-repeat center center / contain;*/
    .ui-static-icon {
      display: none;
    }
  }
}
/*slider*/
#pageApp {
  .splide {
    --slider-pagination-bg: var(--default-color-purple);
    --slider-pagination-size: min((10vw / 3.75), 10px);
    --slider-yohaku-btm: min((66vw / 3.75), 74px);
    padding-bottom: var(--slider-yohaku-btm);
  }
  .splide:not(:has(.splide__pagination li:nth-child(2))) {
    --slider-yohaku-btm: 0;
    .splide__list {
      justify-content: center;
    }
    .splide__pagination {
      display: none;
    }
  }
  .is-sp & {
    .splide:not(:has(.splide__pagination li: nth-child(2))) {
      --slider-yohaku-btm: 0;
      .splide__list {
        justify-content: center;
      }
      .splide__pagination {
        display: none;
      }
    }
  }
  .splide__track {
    overflow: visible;
  }
  .splide__list {
    gap: var(--slider-gap);
  }
  .splide__slide {
    width: var(--slider-item-w);
  }
  .splide__arrow {
    --slider-arrow-size: 40px;
    --slider-arrow-icon-size: 40%;
    --slider-arrow-icon-bc: var(--default-color-brown);
    --slider-arrow-icon-posi-y: 50%;
    --slider-arrow-icon-posi-ty: calc(-50% - (var(--slider-yohaku-btm) / 2));
    background: var(--slider-arrow-bg, #fff);
    border: var(--slider-arrow-icon-bc) 1px solid;
    width: var(--slider-arrow-size);
    height: var(--slider-arrow-size);
    opacity: 1;
    transition: opacity .1s, var(--default-hover-transition-background);
    top: var(--slider-arrow-icon-posi-y, );
    transform: translateY(var(--slider-arrow-icon-posi-ty));
    &:disabled {
      opacity: 0;
      cursor: default;
    }
    svg {
      fill: var(--slider-arrow-icon-bc);
      width: var(--slider-arrow-icon-size);
      height: var(--slider-arrow-icon-size);
    }
  }
  .splide__arrow--prev {
    left: 0;
  }
  .splide__arrow--next {
    right: 0;
  }
  .splide__pagination {
    bottom: 0;
    gap: var(--slider-pagination-gap, min((12vw / 3.75), 24px));
    display: flex;
    li {
      line-height: 0;
    }
  }
  .splide__pagination__page {
    opacity: 1;
    margin: 0;
    width: var(--slider-pagination-size);
    height: var(--slider-pagination-size);
    aspect-ratio: 1;
    background: var(--slider-pagination-bg, var(--default-color-brown));
    border-radius: 50%;
    &.is-active {
      --slider-pagination-bg: var(--main-color);
      transform: scale(1);
    }
  }
}
/*------------------------------------------------*/
/*★ ＝＝ hover ＝＝ ★*/
@media (hover : hover) and (pointer : fine) {
  .base-textlink__link {
    &:hover {
      .base-textlink__text {
        text-decoration: underline;
        text-underline-offset: .2em;
      }
    }
  }
  .base-button {
    .ui-static-button {
      &, &:not(.active):not(:disabled):active, &:focus, &.active, &.focused {
        transition: var(--default-hover-transition-color), var(--default-hover-transition-background);
        &:hover {
          .is-type-A & {
            --btn-bg: var(--btn-bc);
          }
          .is-type-B & {
            --btn-bg: var(--btn-bc);
            --btn-fc: #fff;
          }
          .is-type-C & {
            --btn-fc: var(--btn-bc);
            --btn-bg: #fff;
          }
        }
      }
    }
  }
  .base-banner__link {
    .base-banner__text, .base-banner__texts {
      transition: var(--default-hover-transition-background);
    }
    &:hover {
      --bg: transparent;
    }
  }
  .splide__arrow {
    &:hover {
      --slider-arrow-bg: rgba(183, 167, 131, .3);
    }
  }
  #goTop {
    &:hover {
      opacity: 1 !important;
    }
    .page-top-button:hover {
      &::before {
        --pagetop-icon-opacity: 1;
      }
      &::after {
        --pagetop-icon-opacity: 0;
      }
    }
  }
}