.accessSect {
  display: grid;
  margin: 0 auto;
}
@media print, screen and (min-width: 768px) {
  .accessSect {
    grid-template-columns: 36rem 4rem 36rem 4rem 36rem;
    grid-template-rows: 11rem 49rem 11rem;
    width: 116rem;
  }
}
@media screen and (max-width: 768px) {
  .accessSect {
    grid-template-columns: 28fr 122fr 43fr 11fr 165fr 21fr;
    grid-template-rows: 5rem 24.7rem 3.3rem 5rem auto;
    width: 100%;
  }
}
.accessSect__item {
  position: relative;
}
.accessSect__item .photo,
.accessSect__item .photo__pic {
  display: block;
  height: 100%;
  width: 100%;
}
.accessSect__item .photo__image {
  display: block;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}
@media print, screen and (min-width: 768px) {
  .accessSect__item:nth-child(1) {
    grid-column: 1/2;
    grid-row: 1/3;
  }
}
@media screen and (max-width: 768px) {
  .accessSect__item:nth-child(1) {
    grid-column: 2/4;
    grid-row: 1/5;
  }
}
@media print, screen and (min-width: 768px) {
  .accessSect__item:nth-child(2) {
    grid-column: 3/4;
    grid-row: 2/4;
  }
}
@media screen and (max-width: 768px) {
  .accessSect__item:nth-child(2) {
    grid-column: 5/6;
    grid-row: 2/4;
  }
}
.accessSect__item[data-sai^=curtain][data-sai] {
  clip-path: none;
}
.accessSect__item[data-sai^=curtain][data-sai] .photo__image {
  clip-path: inset(0 0 100% 0);
}
.accessSect__item[data-sai^=curtain][data-sai] .photo__caption {
  opacity: 0;
  transition: opacity 0.4s ease;
}
.accessSect__item[data-sai^=curtain][data-sai].sai-animate {
  clip-path: none;
}
.accessSect__item[data-sai^=curtain][data-sai].sai-animate .photo__image {
  clip-path: inset(0 0 0 0);
  transition: clip-path 1.1s cubic-bezier(0.3, 1.03, 0.64, 0.97) 0s;
}
.accessSect__item[data-sai^=curtain][data-sai].sai-animate .photo__caption {
  opacity: 1;
  transition-delay: 1.1s;
}
.accessSect__item[data-sai^=curtain][data-sai][data-sai-delay="200"].sai-animate .photo__image {
  clip-path: inset(0 0 0 0);
  transition: clip-path 1.1s cubic-bezier(0.3, 1.03, 0.64, 0.97) 0.2s;
}
.accessSect__item[data-sai^=curtain][data-sai][data-sai-delay="200"].sai-animate .photo__caption {
  transition-delay: 1.3s;
}
@media screen and (max-width: 768px) {
  .accessSect .photo__caption {
    top: 0;
    right: auto;
    bottom: auto;
    left: 0;
  }
}
.accessSect__panel {
  align-items: center;
  display: flex;
  justify-content: center;
  z-index: 2;
  backdrop-filter: blur(3rem);
  background: linear-gradient(180deg, rgba(64, 78, 118, 0.5) 0%, rgba(0, 0, 0, 0.2) 100%);
}
@media print, screen and (min-width: 768px) {
  .accessSect__panel {
    grid-column: 5/6;
    grid-row: 1/3;
    padding: 8rem 0;
  }
}
@media screen and (max-width: 768px) {
  .accessSect__panel {
    backdrop-filter: blur(1.275rem);
    grid-column: 3/7;
    grid-row: 3/6;
    padding: 4rem 0 3.2rem;
  }
}
.accessSect__inner {
  text-align: center;
}
@media print, screen and (min-width: 768px) {
  .accessSect .comingSoon {
    margin-top: 6.4rem;
  }
}
@media screen and (max-width: 768px) {
  .accessSect .comingSoon {
    margin-top: 3.2rem;
  }
}
.accessSect__en {
  color: #d9d9d9;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  line-height: 1.5;
  text-box: trim-both cap alphabetic;
}
@media print, screen and (min-width: 768px) {
  .accessSect__en {
    font-size: 4rem;
    letter-spacing: 0.12em;
    margin-right: -0.12em;
  }
}
@media screen and (max-width: 768px) {
  .accessSect__en {
    font-size: 2.8rem;
    letter-spacing: 0.12em;
    margin-right: -0.12em;
  }
}
@media print, screen and (min-width: 768px) {
  .accessSect__txts {
    margin-top: 5.6rem;
  }
}
@media screen and (max-width: 768px) {
  .accessSect__txts {
    margin-top: 3.2rem;
  }
}
.accessSect__txt {
  color: #fff;
  font-family: "Zen Old Mincho", serif;
  font-feature-settings: "palt";
  font-weight: 400;
  letter-spacing: 0.05em;
  margin-right: -0.05em;
}
@media print, screen and (min-width: 768px) {
  .accessSect__txt {
    font-size: 1.7rem;
    line-height: 2.1;
  }
}
@media screen and (max-width: 768px) {
  .accessSect__txt {
    font-size: 1.3rem;
    line-height: 2;
  }
}
@media print, screen and (min-width: 768px) {
  .accessSect__txt + .accessSect__txt {
    margin-top: 1.2rem;
  }
}
@media screen and (max-width: 768px) {
  .accessSect__txt + .accessSect__txt {
    margin-top: 1.2rem;
  }
}
.areaIntro {
  color: #fff;
  font-feature-settings: normal;
  line-break: strict;
  position: relative;
  text-spacing-trim: space-all;
}
@media print, screen and (min-width: 768px) {
  .areaIntro {
    margin-top: -20rem;
    padding: 17.2rem 0 17.1rem;
  }
}
@media screen and (max-width: 768px) {
  .areaIntro {
    margin-top: -20rem;
    padding: 8rem 0 10.6rem;
  }
}
.areaIntro__inner {
  display: flex;
  flex-direction: column;
}
@media print, screen and (min-width: 768px) {
  .areaIntro__inner {
    gap: 12rem;
    margin: 0 auto;
    width: 120.35rem;
  }
}
@media screen and (max-width: 768px) {
  .areaIntro__inner {
    gap: 8rem;
  }
}
.areaIntro__main {
  display: flex;
}
@media print, screen and (min-width: 768px) {
  .areaIntro__main {
    align-items: center;
    gap: 8rem;
  }
}
@media screen and (max-width: 768px) {
  .areaIntro__main {
    flex-direction: column;
    gap: 5.6rem;
    margin: 0 2rem;
  }
}
.areaIntro__txts {
  display: flex;
  flex-direction: column;
  gap: 4.2rem;
}
@media print, screen and (min-width: 768px) {
  .areaIntro__txts {
    width: 53.1rem;
  }
}
.areaIntro__ttl {
  font-family: "Zen Old Mincho", serif;
  font-size: 2.2rem;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 2;
  text-box: trim-both cap alphabetic;
}
.areaIntro__txt {
  font-family: "Zen Old Mincho", serif;
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 2;
}
.areaIntro__map {
  flex: none;
}
@media print, screen and (min-width: 768px) {
  .areaIntro__map {
    width: 59rem;
  }
}
@media screen and (max-width: 768px) {
  .areaIntro__map {
    margin: 0 -2rem;
  }
}
@media screen and (max-width: 768px) {
  .areaIntro__map .photo__caption {
    padding-right: 2rem;
  }
}
@media print, screen and (min-width: 768px) {
  .areaIntro__list {
    gap: 2.2rem;
  }
}
.areaIntro__item {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
@media print, screen and (min-width: 768px) {
  .areaIntro__item {
    width: 28.4rem;
  }
}
@media screen and (max-width: 768px) {
  .areaIntro__item {
    width: 26rem;
  }
}
.areaIntro__spot {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.areaIntro__name {
  font-family: "Zen Old Mincho", serif;
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 2;
  text-box: trim-both cap alphabetic;
}
.areaIntro__dist {
  color: rgba(255, 255, 255, 0.8);
  font-family: "Zen Old Mincho", serif;
  font-size: 1.2rem;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 2;
  text-box: trim-both cap alphabetic;
}
.areaIntro__pagination {
  --swiper-pagination-bullet-horizontal-gap: 0;
  --swiper-pagination-bullet-inactive-color: #fff;
  --swiper-pagination-bullet-inactive-opacity: .5;
  --swiper-pagination-bullet-size: .8rem;
  --swiper-pagination-color: #fff;
  display: flex;
  gap: 0.9rem;
  justify-content: center;
  margin-top: 2.4rem;
  position: static;
}
@media print, screen and (min-width: 768px) {
  .areaIntro__pagination {
    display: none;
  }
}
.areaSect {
  display: flex;
}
@media print, screen and (min-width: 768px) {
  .areaSect {
    align-items: flex-start;
    flex-direction: row-reverse;
    gap: 3.1rem;
    text-shadow: 0 0 0.5rem #fff, 0 0 1.5rem #fff, 0 0 0.8rem #fff;
  }
}
@media screen and (max-width: 768px) {
  .areaSect {
    align-items: center;
    flex-direction: column;
    gap: 3.2rem;
    text-shadow: 0 0 1rem #fff, 0 0 1.5rem #fff;
  }
}
.areaSect__ttl {
  color: #000;
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  letter-spacing: 0.25em;
  white-space: nowrap;
  writing-mode: vertical-rl;
}
@media print, screen and (min-width: 768px) {
  .areaSect__ttl {
    font-size: 4rem;
    height: 15.7rem;
    line-height: 1.2;
    padding-top: 0.7rem;
  }
}
@media screen and (max-width: 768px) {
  .areaSect__ttl {
    font-size: 3.2rem;
    height: 12rem;
    line-height: 0.96875;
    padding-top: 0.6rem;
  }
}
.areaSect__lead {
  align-items: flex-start;
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
}
@media print, screen and (min-width: 768px) {
  .areaSect__lead {
    gap: 1.2rem;
    margin-top: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .areaSect__lead {
    gap: 1rem;
  }
}
.areaSect__line {
  color: #000;
  font-family: "Zen Old Mincho", serif;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.5625;
  white-space: nowrap;
  writing-mode: vertical-rl;
}
@media print, screen and (min-width: 768px) {
  .areaSect__line {
    letter-spacing: 0.35em;
    margin-bottom: -0.35em;
  }
}
@media screen and (max-width: 768px) {
  .areaSect__line {
    letter-spacing: 0.3em;
    margin-bottom: -0.3em;
  }
}
.conceptSect {
  overflow: hidden;
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .conceptSect {
    background: linear-gradient(180deg, #637180 0%, #c9c9cb 100%);
    display: flex;
    min-height: max(90rem, 100vh);
  }
}
@media screen and (max-width: 768px) {
  .conceptSect {
    background: linear-gradient(180deg, #637180 0%, #afb3bb 100%);
  }
}
.conceptSect__object {
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__object {
    width: 72rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__object {
    min-height: calc(100svh - (6.4rem + env(safe-area-inset-bottom, 0px)));
    min-height: calc(100svh - calc(6.4rem + env(safe-area-inset-bottom, 0px)));
  }
}
.conceptSect__mark {
  height: auto;
  opacity: 0.1;
  position: absolute;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__mark {
    left: 0;
    top: 0;
    width: 59.57rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__mark {
    left: -0.4rem;
    top: 0.01rem;
    width: 43.49rem;
  }
}
.conceptSect__canvas {
  position: absolute;
  touch-action: none;
  transform: translateY(-50%);
}
@media print, screen and (min-width: 768px) {
  .conceptSect__canvas {
    height: 49.7rem;
    left: 5rem;
    top: calc(50% + 3.75rem);
    width: 62.1rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__canvas {
    height: 32.7rem;
    left: -0.9rem;
    top: calc(50% + 0.96rem);
    width: 40.863rem;
  }
}
.conceptSect__canvas canvas {
  display: block;
  height: 100%;
  touch-action: none;
  width: 100%;
}
.conceptSect__suggest {
  height: auto;
  opacity: 1;
  pointer-events: none;
  position: absolute;
  transform: translateY(-50%);
  transition: opacity 0.6s ease;
  width: 9rem;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__suggest {
    left: 31.5rem;
    top: calc(50% + 2.25rem);
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__suggest {
    left: 15rem;
    top: calc(50% - 0.89rem);
  }
}
.conceptSect__panel {
  align-items: center;
  backdrop-filter: blur(3rem);
  background: linear-gradient(180deg, rgba(64, 78, 118, 0.5) 0%, rgba(0, 0, 0, 0.2) 100%);
  display: flex;
  justify-content: center;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__panel {
    width: 72rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__panel {
    min-height: calc(100svh - (6.4rem + env(safe-area-inset-bottom, 0px)));
    min-height: calc(100svh - calc(6.4rem + env(safe-area-inset-bottom, 0px)));
    padding: 8rem 0 12.6rem;
  }
}
.conceptSect__inner {
  align-items: center;
  display: flex;
  flex-direction: column;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__inner {
    gap: 6rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__inner {
    gap: 5.6rem;
  }
}
.conceptSect__en {
  color: #d9d9d9;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.5;
  margin-right: -0.1em;
  text-box: trim-both cap alphabetic;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__en {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__en {
    font-size: 1.3rem;
  }
}
.conceptSect__body {
  align-items: center;
  display: flex;
  flex-direction: column;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__body {
    gap: 12rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__body {
    gap: 8rem;
  }
}
.conceptSect__lead {
  align-items: flex-start;
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__lead {
    gap: 1.8rem;
    height: 17.1rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__lead {
    gap: 1.4rem;
    height: 14.4rem;
  }
}
.conceptSect__line {
  color: #fff;
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  white-space: nowrap;
  writing-mode: vertical-rl;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__line {
    font-size: 2rem;
    letter-spacing: 0.31em;
    line-height: 1.25;
    margin-bottom: -0.31em;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__line {
    font-size: 1.6rem;
    letter-spacing: 0.35em;
    line-height: 1.5625;
    margin-bottom: -0.35em;
  }
}
.conceptSect__logo {
  height: auto;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__logo {
    width: 16.95rem;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__logo {
    width: 14.74rem;
  }
}
.conceptSect__caption {
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.5;
  padding: 1rem;
  position: absolute;
  text-box: trim-both cap alphabetic;
}
@media print, screen and (min-width: 768px) {
  .conceptSect__caption {
    bottom: 0;
    left: 0;
  }
}
@media screen and (max-width: 768px) {
  .conceptSect__caption {
    display: none;
  }
}
.conceptSect.is-grabbed .conceptSect__suggest {
  opacity: 0;
}
@media (prefers-reduced-motion: reduce) {
  .conceptSect__suggest {
    transition: none;
  }
}
.infoSect__head {
  text-align: center;
}
.infoSect__head .photo--infoTxt {
  margin: 0 auto;
}
@media print, screen and (min-width: 768px) {
  .infoSect__head .photo--infoTxt {
    margin-top: 5.6rem;
    width: 85.1rem;
  }
}
@media screen and (max-width: 768px) {
  .infoSect__head .photo--infoTxt {
    margin-top: 3.2rem;
    width: 100%;
  }
}
.infoSect__head .photo--infoTxt .photo__image {
  height: auto;
  width: 100%;
}
.infoSect__head .usableList {
  justify-content: center;
}
@media print, screen and (min-width: 768px) {
  .infoSect__head .usableList {
    gap: 4rem;
    margin-top: 8rem;
  }
}
@media screen and (max-width: 768px) {
  .infoSect__head .usableList {
    align-items: center;
    flex-direction: column;
    gap: 1.6rem;
    margin-top: 4rem;
  }
}
.infoSect__ttl {
  letter-spacing: 0.12em;
  line-height: 1.3333333333;
}
.infoSect__ttl:before {
  content: "";
  margin-top: calc((1 - 1.3333333333) * 0.5em);
}
.infoSect__ttl:after {
  margin-bottom: calc((1 - 1.3333333333) * 0.5em);
}
.infoSect__ttl:before, .infoSect__ttl:after {
  content: "";
  display: block;
  height: 0;
  width: 0;
}
@media print, screen and (min-width: 768px) {
  .infoSect__ttl {
    font-size: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .infoSect__ttl {
    font-size: 7.4666666667vw;
  }
}
@media print, screen and (min-width: 768px) {
  .infoSect__ttl .small {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 768px) {
  .infoSect__ttl .small {
    font-size: 4.2666666667vw;
  }
}
@media print, screen and (min-width: 768px) {
  .enTtl + .infoSect__ttl {
    margin-top: 5.6rem;
  }
}
@media screen and (max-width: 768px) {
  .enTtl + .infoSect__ttl {
    margin-top: 10.6666666667vw;
  }
}
.infoSect__heading {
  letter-spacing: 0.12em;
  line-height: 1.6;
}
.infoSect__heading:before {
  content: "";
  margin-top: calc((1 - 1.6) * 0.5em);
}
.infoSect__heading:after {
  margin-bottom: calc((1 - 1.6) * 0.5em);
}
.infoSect__heading:before, .infoSect__heading:after {
  content: "";
  display: block;
  height: 0;
  width: 0;
}
@media print, screen and (min-width: 768px) {
  .infoSect__heading {
    font-size: 2rem;
  }
}
@media screen and (max-width: 768px) {
  .infoSect__heading {
    font-size: 4.2666666667vw;
  }
}
@media print, screen and (min-width: 768px) {
  .infoSect__ttl + .infoSect__heading {
    margin-top: 4.8rem;
  }
}
@media screen and (max-width: 768px) {
  .infoSect__ttl + .infoSect__heading {
    margin-top: 5.3333333333vw;
  }
}
@media print, screen and (min-width: 768px) {
  .infoSect__head + .infoSect__cont {
    margin-top: 6.4rem;
  }
}
@media screen and (max-width: 768px) {
  .infoSect__head + .infoSect__cont {
    margin-top: 10.6666666667vw;
  }
}
.infoSect__bnr {
  margin: 0 auto;
  max-width: 60rem;
}
@media print, screen and (min-width: 768px) {
  .infoSect__bnr:not(:first-child) {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 768px) {
  .infoSect__bnr:not(:first-child) {
    margin-top: 5.3333333333vw;
  }
}
.mainVisual {
  --mv-total: 1.45s;
  background: linear-gradient(92.3deg, #171a2b 0%, #395068 100%);
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
  z-index: 3;
}
@media print, screen and (min-width: 768px) {
  .mainVisual {
    height: 100vh;
    max-height: 90rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual {
    --mv-total: 1.32s;
    height: calc(100svh - (6.4rem + env(safe-area-inset-bottom, 0px)));
    height: calc(100svh - calc(6.4rem + env(safe-area-inset-bottom, 0px)));
    max-height: 67.7rem;
  }
}
.mainVisual__scene {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  transition: opacity 1.2s ease;
  z-index: 0;
}
.mainVisual__scene .areaSect {
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: opacity 1.2s ease;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__scene .areaSect {
    margin-top: -3rem;
  }
}
.mainVisual__scene .areaSect__lead {
  opacity: 0;
  transition: opacity 1.2s ease;
}
.mainVisual__scenePhoto {
  height: calc(100% + 1rem);
  transform: scale(1.1);
  transform-origin: center bottom;
  transition: transform 7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: filter, transform;
}
.mainVisual__list {
  display: grid;
  height: 100%;
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__list {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__list {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
  }
}
.mainVisual__item {
  --mv-delay: 0s;
  opacity: 0;
  overflow: hidden;
  position: relative;
  will-change: opacity;
}
.mainVisual__item .photo,
.mainVisual__item .photo__pic {
  display: block;
  height: 100%;
  width: 100%;
}
.mainVisual__item .photo {
  overflow: hidden;
  transform: translateY(-100%);
  will-change: transform;
}
.mainVisual__item .photo__pic {
  transform: translateY(100%);
  will-change: transform;
}
.mainVisual__item .photo__image {
  display: block;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__item:nth-child(1) {
    --mv-delay: .45s;
  }
  .mainVisual__item:nth-child(2) {
    --mv-delay: .36s;
  }
  .mainVisual__item:nth-child(3) {
    --mv-delay: .27s;
  }
  .mainVisual__item:nth-child(4) {
    --mv-delay: .18s;
  }
  .mainVisual__item:nth-child(5) {
    --mv-delay: .09s;
  }
  .mainVisual__item:nth-child(6) {
    --mv-delay: 0s;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__item:nth-child(1) {
    --mv-delay: .23s;
  }
  .mainVisual__item:nth-child(2) {
    --mv-delay: .12s;
  }
  .mainVisual__item:nth-child(3) {
    --mv-delay: 0s;
  }
  .mainVisual__item:nth-child(4) {
    --mv-delay: .32s;
  }
  .mainVisual__item:nth-child(5) {
    --mv-delay: .21s;
  }
  .mainVisual__item:nth-child(6) {
    --mv-delay: .08s;
  }
  .mainVisual__item:nth-child(n+4) .photo {
    transform: translateY(100%);
  }
  .mainVisual__item:nth-child(n+4) .photo__pic {
    transform: translateY(-100%);
  }
}
.mainVisual__shade {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
  bottom: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  transition: opacity 1s ease 0.4s;
  width: 100%;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__shade {
    height: 69rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__shade {
    height: 33.8rem;
  }
}
.mainVisual__captions {
  display: grid;
  height: 100%;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  transition: opacity var(--mv-total) cubic-bezier(0.61, 1, 0.88, 1);
  width: 100%;
  z-index: 3;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__captions {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__captions {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
  }
}
.mainVisual__caption {
  align-self: end;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__caption {
    padding: 0 1.5rem 1.2rem 0;
    text-align: right;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__caption:nth-child(-n+3) {
    padding-bottom: 10.35rem;
  }
}
.mainVisual__num {
  align-items: center;
  background: rgba(0, 0, 0, 0.3);
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1rem;
  justify-content: center;
  letter-spacing: 0;
  line-height: 1;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__num {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__num {
    display: flex;
    height: 1.7rem;
    width: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__capTxt {
    display: none;
  }
}
.mainVisual__band {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__band {
    padding-top: 6rem;
  }
}
.mainVisual__bandInner {
  position: relative;
}
.mainVisual__bandInner::before {
  box-shadow: 0 0.6rem 2rem rgba(0, 0, 0, 0.1);
  content: "";
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__bandInner {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 4rem;
    padding-top: 6rem;
  }
  .mainVisual__bandInner::before {
    background: linear-gradient(to right, rgba(0, 4, 17, 0.36) 0%, rgba(0, 4, 17, 0.45) 50%, rgba(0, 4, 17, 0.36) 100%);
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__bandInner {
    display: grid;
    grid-gap: 3.2rem 0;
    gap: 3.2rem 0;
    grid-template-columns: repeat(3, 1fr);
  }
  .mainVisual__bandInner::before {
    background: linear-gradient(to right, rgba(0, 4, 17, 0.4) 0%, rgba(0, 4, 17, 0.58) 50%, rgba(0, 4, 17, 0.4) 100%);
  }
}
.mainVisual__catch {
  color: #fff;
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  line-height: 2;
  position: relative;
  text-align: center;
  text-box: trim-both cap alphabetic;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__catch {
    font-size: 4.2rem;
    letter-spacing: 0.3em;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__catch {
    font-size: 3.2rem;
    grid-column: 1/-1;
    letter-spacing: 0.35em;
    order: 2;
  }
}
@media print, screen and (min-width: 768px) {
  .mainVisual__points {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__points {
    display: contents;
  }
}
.mainVisual__point {
  align-items: center;
  display: flex;
  justify-content: center;
  position: relative;
}
.mainVisual__point::before {
  background: rgba(0, 4, 17, 0.33);
  content: "";
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
}
.mainVisual__point .txt {
  color: #fff;
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  letter-spacing: 0.08em;
  position: relative;
  text-align: center;
  text-box: trim-both cap alphabetic;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__point {
    padding: 1.6rem 1.2rem;
  }
  .mainVisual__point .txt {
    font-size: 1.6rem;
    line-height: 1.5;
    white-space: nowrap;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__point {
    height: 6rem;
    order: 1;
  }
  .mainVisual__point:nth-child(n+4) {
    order: 3;
  }
  .mainVisual__point .txt {
    font-size: 1.3rem;
    line-height: 1.35;
  }
}
.mainVisual__logo {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 4;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__logo {
    width: 25.8rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__logo {
    width: 16.96rem;
  }
}
.mainVisual__logo img {
  display: block;
  height: auto;
  width: 100%;
}
.mainVisual__copy {
  filter: blur(0.6rem);
  opacity: 0;
  position: absolute;
  transition: filter var(--mv-total) cubic-bezier(0.61, 1, 0.88, 1), opacity var(--mv-total) cubic-bezier(0.61, 1, 0.88, 1);
  z-index: 3;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__copy {
    bottom: 6.2rem;
    left: 4.9rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__copy {
    bottom: 2.5rem;
    left: 2.4rem;
  }
}
.mainVisual__logotype {
  display: block;
  height: auto;
}
@media print, screen and (min-width: 768px) {
  .mainVisual__logotype {
    width: 22.4rem;
  }
}
@media screen and (max-width: 768px) {
  .mainVisual__logotype {
    width: 19.5rem;
  }
}
.mainVisual__char {
  display: inline-block;
  filter: blur(1.2rem);
  margin-right: 0;
  margin-right: var(--kern, 0);
  opacity: 0;
  transition: filter var(--mv-total) cubic-bezier(0.61, 1, 0.88, 1), opacity var(--mv-total) cubic-bezier(0.61, 1, 0.88, 1);
  will-change: filter, opacity;
}
.mainVisual__bandInner::before, .mainVisual__point::before {
  filter: blur(0.6rem);
  opacity: 0;
  transition: filter var(--mv-total) cubic-bezier(0.61, 1, 0.88, 1), opacity var(--mv-total) cubic-bezier(0.61, 1, 0.88, 1);
  will-change: filter, opacity;
}
.mainVisual__pchar {
  display: inline-block;
  filter: blur(0.6rem);
  opacity: 0;
}
.mainVisual.is-reveal .mainVisual__item {
  opacity: 1;
  transition: opacity 1s linear var(--mv-delay);
}
.mainVisual.is-reveal .mainVisual__item .photo,
.mainVisual.is-reveal .mainVisual__item .photo__pic {
  transform: none;
  transition: transform 1s cubic-bezier(0.37, 0, 0.63, 1) var(--mv-delay);
}
.mainVisual.is-reveal .mainVisual__shade {
  opacity: 1;
}
.mainVisual.is-scene .mainVisual__logo {
  opacity: 0;
  transition: opacity 1.8s ease-out;
}
.mainVisual.is-scene .mainVisual__scene {
  opacity: 1;
}
.mainVisual.is-scene .mainVisual__scenePhoto {
  transform: scale(1);
}
.mainVisual.is-reveal .mainVisual__scenePhoto {
  filter: blur(0.4rem);
  transition: filter var(--mv-total) ease, transform 7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.mainVisual.is-sceneTxt .mainVisual__scene .areaSect,
.mainVisual.is-sceneTxt .mainVisual__scene .areaSect__lead {
  filter: blur(0);
  opacity: 1;
}
.mainVisual.is-reveal .mainVisual__scene .areaSect,
.mainVisual.is-reveal .mainVisual__scene .areaSect__lead {
  opacity: 0;
  transition: opacity var(--mv-total) cubic-bezier(0.61, 1, 0.88, 1);
}
.mainVisual.is-catch .mainVisual__char {
  filter: blur(0);
  opacity: 1;
  transition: filter 0.8s cubic-bezier(0.61, 1, 0.88, 1) calc(var(--mv-total) * 0.28 + var(--i) * 0.07s), opacity 0.8s cubic-bezier(0.61, 1, 0.88, 1) calc(var(--mv-total) * 0.28 + var(--i) * 0.07s);
}
.mainVisual.is-complete .mainVisual__bandInner::before, .mainVisual.is-complete .mainVisual__point::before {
  filter: blur(0);
  opacity: 1;
  transition: filter calc(1.15s + var(--mv-total) * 0.18) cubic-bezier(0.45, 0.1, 0.3, 1) calc(var(--mv-total) * 0.1), opacity calc(1.15s + var(--mv-total) * 0.18) cubic-bezier(0.45, 0.1, 0.3, 1) calc(var(--mv-total) * 0.1);
}
.mainVisual.is-complete .mainVisual__pchar {
  filter: blur(0);
  opacity: 1;
  transition: filter calc(1.15s + var(--mv-total) * 0.18) cubic-bezier(0.45, 0.1, 0.3, 1) calc(var(--mv-total) * 0.1), opacity calc(1.15s + var(--mv-total) * 0.18) cubic-bezier(0.45, 0.1, 0.3, 1) calc(var(--mv-total) * 0.1);
}
@media screen and (max-width: 768px) {
  .mainVisual.is-complete .mainVisual__pchar {
    opacity: 0.8;
  }
}
.mainVisual.is-complete .mainVisual__copy {
  filter: blur(0);
  opacity: 1;
}
.mainVisual.is-complete .mainVisual__captions {
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .mainVisual__item, .mainVisual.is-reveal .mainVisual__item {
    transition: none;
  }
  .mainVisual__item .photo,
  .mainVisual__item .photo__pic, .mainVisual.is-reveal .mainVisual__item .photo,
  .mainVisual.is-reveal .mainVisual__item .photo__pic {
    transform: none;
    transition: none;
  }
  .mainVisual__shade, .mainVisual__copy, .mainVisual__char, .mainVisual__bandInner::before, .mainVisual__point::before, .mainVisual__pchar, .mainVisual__captions, .mainVisual__logo, .mainVisual__scene, .mainVisual__scenePhoto, .mainVisual__scene .areaSect, .mainVisual__scene .areaSect__lead {
    transition: none;
  }
}
@media screen and (max-width: 768px) {
  .is-uspScrollFade {
    --usp-in: max(0, min(calc((var(--usp-progress, 0) - .3) / .2), 1));
    --usp-out: max(0, min(calc((var(--usp-progress, 0) - .2) / .2), 1));
  }
}
.uspArea {
  color: #fff;
}
@media screen and (max-width: 768px) {
  .uspArea {
    padding-top: 4rem;
  }
  .uspArea.is-scrollFade {
    --usp-screen: calc(100svh - calc(6.4rem + env(safe-area-inset-bottom, 0px)));
    --usp-stage: min(var(--usp-screen), 49.4rem);
    height: calc(min(calc(100svh - (6.4rem + env(safe-area-inset-bottom, 0px))), 49.4rem) + (100svh - (6.4rem + env(safe-area-inset-bottom, 0px))) * 1.2);
    height: calc(min(calc(100svh - calc(6.4rem + env(safe-area-inset-bottom, 0px))), 49.4rem) + calc(100svh - calc(6.4rem + env(safe-area-inset-bottom, 0px))) * 1.2);
    height: calc(var(--usp-stage) + var(--usp-screen) * 1.2);
    padding-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .uspArea.is-scrollFade .uspArea__stage {
    display: grid;
    height: var(--usp-stage);
    position: sticky;
    top: calc((var(--usp-screen) - var(--usp-stage)) / 2);
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__row {
    padding: 4rem 0 2rem;
  }
  .uspArea__row + .uspArea__row {
    padding: 1.6rem 0 4rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__row {
    padding-bottom: 3.3rem;
  }
  .uspArea__row + .uspArea__row {
    padding: 3.2rem 0 2.4rem;
  }
  .uspArea.is-scrollFade .uspArea__row {
    display: flex;
    flex-direction: column;
    grid-area: 1/1;
    justify-content: center;
    opacity: calc(1 - var(--usp-out));
    padding: 2.4rem 0;
    transform: translate3d(0, calc(var(--usp-out) * -2rem), 0);
    will-change: opacity, transform;
  }
  .uspArea.is-scrollFade .uspArea__row + .uspArea__row {
    opacity: var(--usp-in);
    padding: 2.4rem 0;
    transform: translate3d(0, calc((1 - var(--usp-in)) * 2rem), 0);
  }
}
.uspArea__inner {
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .uspArea.is-scrollFade .uspArea__inner {
    padding: 0 2rem;
    width: 100%;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__inner {
    width: 121rem;
  }
  .uspArea__row + .uspArea__row .uspArea__inner {
    width: 129.3rem;
  }
}
.uspArea__list {
  display: flex;
}
@media print, screen and (min-width: 768px) {
  .uspArea__list {
    gap: 6.5rem;
    justify-content: center;
  }
  .uspArea__row + .uspArea__row .uspArea__list {
    gap: 4.1rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__list {
    flex-direction: column;
    gap: 3.3rem;
  }
  .uspArea.is-scrollFade .uspArea__list {
    gap: 8.1rem;
  }
}
.uspArea__item {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  text-align: center;
}
@media print, screen and (min-width: 768px) {
  .uspArea__item {
    width: 36rem;
  }
  .uspArea__row + .uspArea__row .uspArea__item {
    width: 38rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item:not(:first-child):before {
    background: rgba(255, 255, 255, 0.2);
    bottom: 0;
    content: "";
    left: -3.3rem;
    position: absolute;
    top: 0;
    width: 0.1rem;
  }
  .uspArea__row + .uspArea__row .uspArea__item:not(:first-child):before {
    left: -2.1rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item[data-sai][data-sai] {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .uspArea__item:not(:last-child):after {
    background: rgba(255, 255, 255, 0.1);
    bottom: -1.7rem;
    content: "";
    height: 0.1rem;
    left: 0;
    opacity: 0.5;
    position: absolute;
    width: 100%;
  }
  .uspArea.is-scrollFade .uspArea__item:not(:last-child):after {
    bottom: -4.1rem;
  }
}
.uspArea__eyebrow {
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
  margin-right: -0.05em;
  position: relative;
  text-box: trim-both cap alphabetic;
}
@media print, screen and (min-width: 768px) {
  .uspArea__eyebrow {
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__eyebrow {
    font-size: 1.2rem;
  }
}
.uspArea__line {
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
  position: relative;
  text-box: trim-both cap alphabetic;
  white-space: nowrap;
}
@media print, screen and (min-width: 768px) {
  .uspArea__line {
    font-size: 1.9rem;
    margin-top: calc(3.8rem - 0.726em);
  }
}
@media screen and (max-width: 768px) {
  .uspArea__line {
    font-size: 1.8rem;
    margin-top: calc(3rem - 0.726em);
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__eyebrow + .uspArea__line {
    margin-top: 2.304rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__eyebrow + .uspArea__line {
    margin-top: 2.123rem;
  }
}
.uspArea__name {
  letter-spacing: 0.05em;
  margin-right: -0.05em;
}
@media print, screen and (min-width: 768px) {
  .uspArea__name + .uspArea__unit {
    margin-left: 0.4rem;
  }
}
.uspArea__unit {
  letter-spacing: 0.1em;
  margin-right: -0.1em;
}
@media print, screen and (min-width: 768px) {
  .uspArea__unit {
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__unit {
    font-size: 1.3rem;
  }
}
.uspArea__num {
  background: linear-gradient(180deg, #f9ff80 26.9%, #d1a700 76.9%);
  -webkit-background-clip: text;
          background-clip: text;
  color: transparent;
  font-family: "EB Garamond", serif;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 0;
}
@media print, screen and (min-width: 768px) {
  .uspArea__num {
    margin: 0 0.5rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__num {
    margin: 0 0.3rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__num {
    font-size: 4.6rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__num {
    font-size: 3.4rem;
  }
}
.uspArea__big, .uspArea__en {
  font-family: "EB Garamond", serif;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 0;
}
@media print, screen and (min-width: 768px) {
  .uspArea__big {
    font-size: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__big {
    font-size: 3.2rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__en {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__en {
    font-size: 2rem;
  }
}
.uspArea__enSmall {
  font-size: 0.84em;
}
.uspArea__note {
  left: 100%;
  letter-spacing: 0.05em;
  line-height: 1;
  margin-left: 0;
  margin-left: var(--note-x, 0);
  position: absolute;
  text-box: trim-both cap alphabetic;
  top: 0;
  top: var(--note-y, 0);
  white-space: nowrap;
}
@media print, screen and (min-width: 768px) {
  .uspArea__note {
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__note {
    font-size: 0.8rem;
  }
}
.uspArea__item--station {
  display: grid;
  justify-items: start;
  align-content: center;
  justify-content: center;
  place-content: center;
  text-align: left;
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--station .uspArea__line + .uspArea__line {
    margin-top: calc(4.5rem - 0.726em);
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--station .uspArea__line + .uspArea__line {
    margin-top: calc(3.8rem - 0.726em);
  }
}
.uspArea__item--station .uspArea__eyebrow {
  letter-spacing: 0.1em;
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--station .uspArea__eyebrow {
    font-size: 1.2rem;
    padding-left: 1.9rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--station .uspArea__eyebrow {
    padding-left: 1.4rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--station .uspArea__eyebrow + .uspArea__line {
    margin-top: 2.378rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--station .uspArea__eyebrow + .uspArea__line {
    margin-top: 1.823rem;
  }
}
.uspArea__item--station .uspArea__name {
  letter-spacing: 0.1em;
  margin-right: -0.1em;
}
.uspArea__item--station .uspArea__name + .uspArea__unit {
  margin-left: -1rem;
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--station .uspArea__name {
    font-size: 2.8rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--station .uspArea__name {
    font-size: 2.4rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--station .uspArea__unit {
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--station .uspArea__unit {
    font-size: 1.6rem;
  }
}
.uspArea__item--station .uspArea__num {
  margin: 0 0.5rem 0 1rem;
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--station .uspArea__num {
    font-size: 5rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--station .uspArea__num {
    font-size: 4rem;
    margin-left: 0.4rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--headline .uspArea__eyebrow {
    font-size: 1.6rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--headline .uspArea__eyebrow + .uspArea__line {
    margin-top: 1.397rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--headline .uspArea__eyebrow + .uspArea__line {
    margin-top: 1.278rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--headline .uspArea__line {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--headline .uspArea__line {
    font-size: 2rem;
  }
}
.uspArea__item--headline .uspArea__num {
  margin: 0 0.8rem 0 0;
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--headline .uspArea__num {
    font-size: 5.6rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--headline .uspArea__num {
    font-size: 3.6rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--headline .uspArea__note {
    --note-x: 0;
    --note-y: -.26rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--headline .uspArea__note {
    --note-x: 0;
    --note-y: -.35rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--spec .uspArea__eyebrow {
    font-size: 1.6rem;
    margin-top: 0.4rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--spec .uspArea__eyebrow {
    margin-top: 0.3rem;
  }
}
.uspArea__item--spec .uspArea__eyebrow .uspArea__num {
  font-size: 2.4rem;
  font-weight: 500;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .uspArea__item--spec .uspArea__eyebrow .uspArea__num {
    font-size: 1.8rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--spec .uspArea__eyebrow + .uspArea__line {
    margin-top: 2.858rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--spec .uspArea__eyebrow + .uspArea__line {
    margin-top: 2.248rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--spec .uspArea__line {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--spec .uspArea__line {
    font-size: 2rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--spec .uspArea__big:first-child {
    margin-right: 0.5rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--spec .uspArea__big:first-child {
    margin-right: 0.4rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--spec .uspArea__en + .uspArea__big,
  .uspArea__item--spec .uspArea__unit {
    margin-left: 0.8rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--spec .uspArea__en + .uspArea__big,
  .uspArea__item--spec .uspArea__unit {
    margin-left: 0.6rem;
  }
}
.uspArea__item--spec .uspArea__unit {
  letter-spacing: 0;
  margin-right: 0;
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--spec .uspArea__unit {
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--spec .uspArea__unit {
    font-size: 1.5rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__row + .uspArea__row .uspArea__item--park {
    width: 45.1rem;
  }
  .uspArea__item--park .uspArea__name + .uspArea__unit {
    margin-left: -0.5rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--park .uspArea__eyebrow + .uspArea__line {
    margin-top: 3.005rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--park .uspArea__eyebrow + .uspArea__line {
    margin-top: 3.823rem;
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--park .uspArea__eyebrow + .uspArea__line .uspArea__seg + .uspArea__unit {
    margin: 0 -0.3rem;
  }
  .uspArea__item--park .uspArea__eyebrow + .uspArea__line .uspArea__cap {
    left: 1.1rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--park .uspArea__seg {
    display: block;
    margin: 0 auto;
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
  }
  .uspArea__item--park .uspArea__seg + .uspArea__unit {
    display: none;
  }
  .uspArea__item--park .uspArea__seg ~ .uspArea__seg {
    margin-top: calc(3rem - 1em);
  }
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--park .uspArea__line:last-child {
    margin-top: calc(4.5rem - 0.726em);
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--park .uspArea__line:last-child {
    margin-top: calc(4.7rem - 0.726em);
  }
}
.uspArea__item--park .uspArea__cap {
  letter-spacing: 0.05em;
  line-height: 1;
  position: absolute;
  text-box: trim-both cap alphabetic;
}
@media print, screen and (min-width: 768px) {
  .uspArea__item--park .uspArea__cap {
    bottom: calc(100% + 0.92rem);
    font-size: 1rem;
    left: 1.2rem;
  }
}
@media screen and (max-width: 768px) {
  .uspArea__item--park .uspArea__cap {
    bottom: calc(100% + 0.9rem);
    font-size: 1.1rem;
    left: 0.9rem;
  }
}
.uspArea__item--access .uspArea__unit:first-child + .uspArea__name,
.uspArea__item--access .uspArea__name + .uspArea__unit {
  margin-left: -0.7rem;
}
.uspArea__item--access .uspArea__num {
  margin: 0 0.5rem 0 0.4rem;
}
@media screen and (max-width: 768px) {
  .top-mvNotes {
    display: flex;
    flex-wrap: wrap;
    gap: 0 0.4rem;
    margin: 0 2rem;
    padding-top: 2rem;
  }
}
.top-mvNotes__item {
  align-items: center;
  display: flex;
  gap: 0.1rem;
}
.top-mvNotes__num {
  align-items: center;
  background: rgba(0, 0, 0, 0.3);
  color: #fff;
  display: flex;
  flex: none;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1rem;
  height: 1.1rem;
  justify-content: center;
  letter-spacing: 0;
  line-height: 1;
  width: 1.1rem;
}
.top-mvNotes__txt {
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1rem;
  letter-spacing: 0.1em;
  line-height: 1.5;
}
.top-information {
  color: #fff;
}
@media print, screen and (min-width: 768px) {
  .top-information {
    padding: 7.2rem 0 12rem;
  }
}
@media screen and (max-width: 768px) {
  .top-information {
    padding: 5.6rem 0 18.6666666667vw;
  }
}
.top-conceptReveal {
  position: relative;
  z-index: 1;
}
@media print, screen and (min-width: 768px) {
  .top-conceptReveal {
    margin-top: -100vh;
  }
}
@media screen and (max-width: 768px) {
  .top-conceptReveal {
    margin-top: -100svh;
  }
}
.top-conceptReveal:after {
  content: "";
  display: block;
}
@media print, screen and (min-width: 768px) {
  .top-conceptReveal:after {
    height: 100vh;
  }
}
@media screen and (max-width: 768px) {
  .top-conceptReveal:after {
    height: 100svh;
  }
}
.top-concept.is-covered,
.top-area__hero.is-covered {
  visibility: hidden;
}
.top-concept {
  position: sticky;
  top: 0;
}
.top-concept:after {
  backdrop-filter: blur(calc((1 - 1) * 1.2rem));
  backdrop-filter: blur(calc((1 - var(--reveal, 1)) * 1.2rem));
  background: rgba(0, 0, 0, 0);
  content: "";
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
  position: absolute;
  z-index: 3;
}
@supports (color: rgb(0, 0, 0, 0)) {
.top-concept:after {
  background: rgb(0, 0, 0, calc((1 - var(--reveal, 1)) * 62%));
}
}
@media print, screen and (min-width: 768px) {
  .conceptSect [data-sai=blurfade][data-sai] {
    filter: none;
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .top-conceptReveal {
    margin-top: 0;
  }
  .top-conceptReveal:after {
    content: none;
  }
  .top-concept {
    position: relative;
  }
  .top-concept:after {
    content: none;
  }
}
.top-lead {
  z-index: 2;
}
.top-area {
  position: relative;
  z-index: 0;
}
@media print, screen and (min-width: 768px) {
  .top-area {
    margin-top: -100vh;
  }
}
@media screen and (max-width: 768px) {
  .top-area {
    margin-top: -100svh;
  }
}
.top-area__bg {
  overflow: hidden;
  position: sticky;
  top: 0;
}
.top-area__bg .photo {
  transform: translateY(calc(0 * 4%)) scale(1.1);
  transform: translateY(calc(var(--area-shift, 0) * 4%)) scale(1.1);
  will-change: transform;
}
@media print, screen and (min-width: 768px) {
  .top-area__bg {
    height: 100vh;
    margin-bottom: -100vh;
  }
}
@media screen and (max-width: 768px) {
  .top-area__bg {
    height: 100svh;
    margin-bottom: -100svh;
  }
}
.top-area__dim {
  backdrop-filter: blur(3rem);
  background: linear-gradient(180deg, rgba(64, 78, 118, 0.8) 0%, rgba(0, 0, 0, 0.5) 100%);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  opacity: var(--dim, 0);
  position: absolute;
}
.top-area__reveal {
  position: relative;
}
.top-area__reveal:after {
  content: "";
  display: block;
}
@media print, screen and (min-width: 768px) {
  .top-area__reveal:after {
    height: 100vh;
  }
}
@media screen and (max-width: 768px) {
  .top-area__reveal:after {
    height: 100svh;
  }
}
.top-area__hero {
  position: sticky;
  top: 0;
}
@media print, screen and (min-width: 768px) {
  .top-area__hero {
    height: 86.6rem;
  }
}
@media screen and (max-width: 768px) {
  .top-area__hero {
    height: 81rem;
  }
}
.top-area__hero:after {
  backdrop-filter: blur(calc((1 - 1) * 1.2rem));
  backdrop-filter: blur(calc((1 - var(--reveal, 1)) * 1.2rem));
  background: rgba(0, 0, 0, 0);
  content: "";
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 3;
}
@supports (color: rgb(0, 0, 0, 0)) {
.top-area__hero:after {
  background: rgb(0, 0, 0, calc((1 - var(--reveal, 1)) * 62%));
}
}
@media print, screen and (min-width: 768px) {
  .top-area__hero:after {
    height: 100vh;
  }
}
@media screen and (max-width: 768px) {
  .top-area__hero:after {
    height: 100svh;
  }
}
@media (prefers-reduced-motion: reduce) {
  .top-area {
    margin-top: 0;
  }
  .top-area__reveal:after,
  .top-area__hero:after {
    content: none;
  }
  .top-area__hero {
    position: relative;
  }
}
.top-guide {
  position: relative;
  z-index: 1;
}
@media print, screen and (min-width: 768px) {
  .top-guide {
    padding: 12rem 0;
  }
}
@media screen and (max-width: 768px) {
  .top-guide {
    padding: 10rem 0;
  }
}
@media print, screen and (min-width: 768px) {
  .top-guide__item:not(:first-child) {
    margin-top: 16rem;
  }
}
@media screen and (max-width: 768px) {
  .top-guide__item:not(:first-child) {
    margin-top: 10rem;
  }
}
/*# sourceMappingURL=style.css.map */
