/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Common
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
html {
  overflow-y: scroll;
  font-size: 62.5%;
  height: 100%;
}

:root {
  --PcScale: 0.667;
  /* 500px / 750pxの比率 */

  --BaseFont: "Zen Kaku Gothic New", sans-serif;
  --CommonColorBrown: rgba(52, 0, 0, 1);
  --CommonColorBeige: rgba(151, 100, 28, 1);
  --CommonColorOrange: rgba(248, 90, 38, 1);
  --CommonColorCream: rgba(255, 244, 235, 1);
  --CommonColorGray: rgba(255, 252, 250, 1);
  --CommonColorDarkGray: rgba(117, 117, 117, 1);
  --CommonColorWhite: rgba(255, 255, 255, 1);
  --CommonColorBlack: rgba(0, 0, 0, 1);

  --FontSizeClamp18: min(calc(18px * var(--PcScale)), 2.4vw);
  --FontSizeClamp20: min(calc(20px * var(--PcScale)), 2.66vw);
  --FontSizeClamp24: min(calc(24px * var(--PcScale)), 3.2vw);
  --FontSizeClamp28: min(calc(28px * var(--PcScale)), 3.733vw);
  --FontSizeClamp32: min(calc(32px * var(--PcScale)), 4.26vw);
  --FontSizeClamp34: min(calc(34px * var(--PcScale)), 4.533vw);
  --FontSizeClamp36: min(calc(36px * var(--PcScale)), 4.8vw);
  --FontSizeClamp40: min(calc(40px * var(--PcScale)), 5.33vw);
  --FontSizeClamp42: min(calc(42px * var(--PcScale)), 5.6vw);
  --FontSizeClamp44: min(calc(44px * var(--PcScale)), 5.866vw);
  --FontSizeClamp48: min(calc(48px * var(--PcScale)), 6.4vw);
  --FontSizeClamp52: min(calc(52px * var(--PcScale)), 6.933vw);

  --BaseFontRegular: 400;
  --BaseFontMedium: 500;
  --BaseFontBold: 700;
  --BaseFontBlack: 900;

  --LineHeight20: min(calc(20px * var(--PcScale)), 2.666vw);
  --LineHeight30: min(calc(30px * var(--PcScale)), 4vw);
  --LineHeight40: min(calc(40px * var(--PcScale)), 5.33vw);
  --LineHeight48: min(calc(48px * var(--PcScale)), 6.4vw);
  --LineHeight50: min(calc(50px * var(--PcScale)), 6.66vw);
  --LineHeight64: min(calc(64px * var(--PcScale)), 8.533vw);
  --LineHeight79: min(calc(79px * var(--PcScale)), 10.56vw);
}

body {
  font-family: var(--BaseFont) !important;
  color: var(--CommonColorBrown);
  width: 100%;
  height: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  margin: 0;
  position: relative;
  overflow-x: clip !important;
}

a {
  text-decoration: none;
  text-decoration: none;
}

a:hover {
  cursor: pointer;
}

a:focus,
a:focus-visible {
  outline: 2px solid #005fcc;
  outline-offset: 2px;
}
button:focus,
button:focus-visible {
  outline: 2px solid #005fcc;
  outline-offset: 2px;
}

ol,
ul,
li {
  list-style: none;
  padding: 0;
}

img {
  max-width: 100%;
  width: 100%;
  height: auto;
}

.l ._pc {
  display: block;
}

._pc {
  display: none;
}

.l ._sp {
  display: none;
}

._sp {
  display: block;
}

/* ================================
        Layout
================================ */
#ShiretokoTour {
  position: relative;
}

.BgLayer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: top center;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.8s ease;
}

.s .BgLayer {
  display: none;
}

.BgLayer.isActive {
  opacity: 1;
}

.BgLayer._main {
  background-image: url(../img/main-bg.webp);
}

.BgLayer._about {
  background-image: url(../img/about-bg-pc.webp);
}

.BgLayer._program {
  background-image: url(../img/program-bg-pc.webp);
}

.BgLayer._schedule {
  background-image: url(../img/schedule-bg-pc.webp);
}

.BgLayer._profile {
  background-image: url(../img/profile-bg-pc.webp?r1);
}

.ContentInner {
  width: 500px;
  margin-inline: auto;
  position: relative;
  z-index: 0;
}

.s .ContentInner {
  width: 100%;
  padding: 0;
  box-shadow: none;
}

.CommonArea {
  border-radius: 32px 32px 0 0;
  background-color: var(--CommonColorGray);
  padding: calc(100px * var(--PcScale)) calc(80px * var(--PcScale))
    calc(127px * var(--PcScale));
  position: relative;
  z-index: 1;
  margin-top: -10%;
}

.s .CommonArea {
  padding: 13.33vw 10.66vw 16.93vw;
}

.CommonList li {
  text-indent: -1em;
  padding-left: 1em;
  font-size: var(--FontSizeClamp20);
  line-height: var(--LineHeight40);
}

/* --------------
	Only PC
-----------------*/
.ContentPc {
  display: block;
  position: relative;
  z-index: 10;
}

.s .ContentPc {
  display: none;
}

.ContentPcLeft {
  opacity: 0;
  position: fixed;
  left: calc(50% - 680px);
  top: 175px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  transition:
    opacity 0.4s ease,
    transform 0.4s ease,
    top 0.4s ease;
}

.ContentPcLeft.isShow {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.ContentPcLeft:not(.isShow) .ContentPcList a {
  visibility: hidden;
}

.ContentPcLogo {
  width: min(182px, 20.22vh);
  padding-bottom: 59px;
}

.ContentPcList li {
  width: 360px;
  text-align: center;
  padding-bottom: 29px;
  position: relative;
}

.ContentPcList li::after {
  content: "";
  position: absolute;
  left: 0;
  width: 360px;
  background: url(../img/menu-line-w.webp) bottom center no-repeat;
  background-size: 100%;
  min-height: 1px;
}

.ContentPcList li:last-child:after {
  content: none;
}

.ContentPcList li a {
  color: var(--CommonColorWhite);
  font-size: 1.6rem;
  font-weight: var(--BaseFontBold);
  display: flex;
  align-items: center;
  text-decoration: none;
  position: relative;
  z-index: 100;
  margin-bottom: 29px;
  padding-left: 28px;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
  position: relative;
}

.ContentPcList li a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 14px;
  height: 16px;
  background: url(../img/icon-arrow-list.webp) center no-repeat;
  background-size: 100%;
  opacity: 0;
  transition: 0.4s;
}

.ContentPcList li a:hover::before {
  opacity: 1;
}
.ContentPcList li a:focus::before {
  opacity: 1;
}

.ContentPcList li a span {
  font-size: 1.4rem;
  padding-right: 10px;
}

.ContentPcList li a:focus,
.ContentPcList li a:focus-visible {
  outline: 2px solid #005fcc;
  outline-offset: 2px;
}

.ContentPcRight {
  position: fixed;
  left: calc(50% + 275px);
  bottom: 118px;
}

/* ================================
			Fadein
================================ */

/* .FadeIn {
	position: relative;
	opacity: 0;
	transform: translate(0, 30px);
}

.FadeIn.ScrollIn {
	opacity: 1;
	transform: translate(0, 0);
	transform: scale(1);
	transition: all 1000ms;
} */

/* ================================
        Title
================================ */
h2 {
  font-family: var(--BaseFont) !important;
  font-size: var(--FontSizeClamp44);
  font-weight: var(--BaseFontBold);
  line-height: var(--LineHeight79);
  color: var(--CommonColorWhite);
  position: relative;
}

h2 span {
  font-size: var(--FontSizeClamp34);
}

h3 {
  font-family: var(--BaseFont) !important;
  font-size: var(--FontSizeClamp24);
  font-weight: var(--BaseFontMedium);
  writing-mode: vertical-rl;
  color: var(--CommonColorBrown);
}

h4 {
  font-family: var(--BaseFont) !important;
  font-size: var(--FontSizeClamp42);
  color: var(--CommonColorBrown);
  font-weight: var(--BaseFontMedium);
  line-height: var(--LineHeight64);
}

h5 {
  font-family: var(--BaseFont) !important;
  font-size: var(--FontSizeClamp34);
  color: var(--CommonColorBrown);
  font-weight: var(--BaseFontMedium);
  padding-bottom: calc(40px * var(--PcScale));
}

.s h5 {
  padding-bottom: 5.33vw;
}

/* ================================
        Button
================================ */
/* --------------
	Active
-----------------*/
.CommonBtn a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  background: var(--CommonColorOrange);
  color: var(--CommonColorWhite);
  font-weight: var(--BaseFontBold);
  border-radius: 50vw;
  transition: 0.4s;
  width: 420px;
  height: 90px;
  font-size: 2rem;
  line-height: 1.2;
}

.CommonBtn ._inner {
  transform: translateX(-14px);
}

.CommonBtn ._small {
  font-size: 1.6rem;
}

.CommonBtn a:hover {
  text-decoration: none;
  transform: scale(0.95);
  opacity: 1;
}

.CommonBtn a::after {
  position: absolute;
  display: block;
  content: "";
  width: 56px;
  height: 56px;
  background: url(../img/icon-arrow-btn.webp) no-repeat center center;
  background-size: contain;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 20px;
}

.CommonBtnText {
  font-size: var(--FontSizeClamp24);
  text-align: center;
  color: var(--CommonColorWhite);
  font-weight: bold;
  margin-bottom: 10px;
}

.s .CommonBtnText {
  margin-bottom: 1.33vw;
}

/* --------------
	Disabled
-----------------*/
.CommonBtn div {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  background: var(--CommonColorDarkGray);
  color: var(--CommonColorWhite);
  font-weight: var(--BaseFontBold);
  border-radius: 50vw;
  transition: 0.4s;
  width: 420px;
  height: 90px;
  font-size: 2rem;
  line-height: 1.4;
}

.CommonBtn > div ._small {
  font-size: 1.6rem;
}

.CommonBtn div::after {
  position: absolute;
  content: "";
  width: 56px;
  height: 56px;
  background: url(../img/icon-arrow-btn-off.webp) no-repeat center center;
  background-size: contain;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 20px;
  margin: auto;
}

/* ================================
        Header
================================ */
.HeaderCover {
  width: 100%;
  background-color: rgba(255, 255, 255, 1);
}

.attention_box_area {
  width: 100%;
  background-color: rgba(255, 255, 255, 1);
}

.attention_box {
  font-family:
    YuGothic, "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "Hiragino Sans",
    Meiryo, sans-serif;
  font-weight: 200;
  font-size: 1.2rem;
  line-height: 1.5;
  width: 100%;
  max-width: 1150px;
  margin: 0 auto;
  color: rgba(0, 0, 0, 1);
  background-color: rgba(255, 255, 255, 1);
  padding: 1vw;
}

.attention_box a {
  color: rgba(0, 0, 0, 1);
  text-decoration: underline;
}

@media screen and (max-width: 1000px) {
  .attention_box {
    padding: 20px 2vw;
  }

  .attention_box p {
    width: fit-content;
    margin: 0 auto;
  }
}

.sr-only {
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

.Header {
  width: 100%;
  display: block;
  transition: 0.4s;
}

.HeaderFirstArea {
  background: var(--CommonColorWhite);
  height: min(80px, 10.66vw);
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  padding: 0 100px;
}

.s .HeaderFirstArea {
  padding: 0 5.333vw 0 8vw;
}

.HeaderLogo {
  width: 108px;
  opacity: 1;
  visibility: visible;
  transition:
    opacity 0.4s ease-out,
    visibility 0.4s ease-out;
}

.s .HeaderLogo {
  max-width: 16.8vw;
}

.s .HeaderMainArea.isActive .HeaderLogo {
  opacity: 0;
  visibility: hidden;
}

.HeaderMainArea {
  display: none;
}

.s .HeaderMainArea {
  z-index: 101 !important;
  background: var(--CommonColorWhite);
  height: 10.66vw;
  display: block;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 2;
  padding: 0 5.333vw 0 8vw;
  margin-top: -10.66vw;
  z-index: 100;
  transition: margin-top 0.4s ease;
}

.s .HeaderMainArea.isShow {
  margin-top: 0;
}

.s .HeaderMainArea.isActive {
  background: var(--CommonColorGray);
}

.s .HeaderArea {
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: center;
}

.HeaderHam {
  display: none;
}

.s .HeaderHam {
  display: block;
}

/* --------------
	Menu
-----------------*/
.HeaderHamMenu {
  display: block;
  position: relative;
  height: 8.2vw;
  width: 7.73vw;
}

.HeaderHamMenuLine {
  background: var(--CommonColorBrown);
  width: 7.73vw;
  display: inline-block;
  height: 2px;
  position: absolute;
  border-radius: 10px;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.4s;
}

.HeaderHamMenuLine._top {
  top: 2.4vw;
}

.HeaderHamMenuLine._top.isActive {
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}

.HeaderHamMenuLine._center {
  top: 4.4vw;
}

.HeaderHamMenuLine._center.isActive {
  display: none;
}

.HeaderHamMenuLine._bottom {
  top: 6.4vw;
}

.HeaderHamMenuLine._bottom.isActive {
  top: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* --------------
	Gnav
-----------------*/
.HeaderGnav {
  background: var(--CommonColorGray);
  background-size: 100%;
  display: none;
  top: 0;
  left: 0;
  height: 100%;
  position: fixed;
  width: 100%;
  z-index: 90;
}

.HeaderGnavWrap {
  align-items: center;
  display: flex;
  height: auto;
  justify-content: flex-start;
  flex-direction: column;
  position: absolute;
  top: 20.8vw;
  width: 100%;
}

.HeaderGnavImg {
  width: 30.4vw;
  margin-inline: auto;
  padding-bottom: 13.33vw;
}

.HeaderGnavMenu li {
  width: 100%;
  text-align: center;
  padding-bottom: 6.933vw;
  position: relative;
}

.HeaderGnavMenu li::after {
  content: "";
  position: absolute;
  left: 0;
  aspect-ratio: 1140 / 2;
  width: 100%;
  background: url(../img/menu-line-b.webp) bottom center no-repeat;
  background-size: 100%;
  min-height: 1px;
}

.HeaderGnavMenu li:last-child:after {
  content: none;
}

.HeaderGnavMenu li a {
  color: var(--CommonColorBrown);
  font-size: var(--FontSizeClamp36);
  font-weight: var(--BaseFontBold);
  display: flex;
  align-items: center;
  text-decoration: none;
  transition: 0.4s;
  position: relative;
  z-index: 100;
  margin-bottom: 6.933vw;
}

.HeaderGnavMenu li a span {
  font-size: var(--FontSizeClamp28);
  padding-right: 3.59vw;
}

/* ================================
        Mv
================================ */
.Mv {
  position: relative;
  height: 836px;
  color: var(--CommonColorWhite);
  font-size: var(--FontSizeClamp32);
  font-weight: var(--BaseFontBold);
  line-height: var(--LineHeight48);
}

.s .Mv {
  height: 167.2vw;
}

.MvSticky {
  position: sticky;
  top: 0;
  height: 836px;
  overflow: hidden;
  z-index: 91;
  will-change: transform;
}

.s .MvSticky {
  height: 167.2vw;
}

.MvBg {
  position: absolute;
  inset: 0;
  background-image: url(../img/mv-bg.webp);
  background-position: top center;
  width: 500px;
  height: 836px;
  background-size: 500px 836px;
  background-repeat: no-repeat;
  transform: scale(1);
}

.s .MvBg {
  width: 100vw;
  height: 167.2vw;
  background-size: 100vw 167.2vw;
}

.MvOverlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 170, 255, 0);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  pointer-events: none;
  /* transition: background 0.1s linear; */
  transform: translateZ(0);
  backface-visibility: hidden;
  will-change: backdrop-filter, background;
}

.MvViewport {
  height: 836px;
  overflow: hidden;
  position: relative;
}

.s .MvViewport {
  height: 167.2vw;
}

.MvScrollArea {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  will-change: transform;
  transform: translate3d(0, 0, 0);
}

.MvInner {
  padding-top: calc(36px * var(--PcScale));
  height: 836px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
  box-sizing: border-box;
  position: relative;
}

.s .MvInner {
  padding-top: 4.8vw;
  height: 167.2vw;
}

.MvLogo {
  padding-bottom: calc(80px * var(--PcScale));
}

.s .MvLogo {
  padding-bottom: 8.66vw;
}

.MvLogo li {
  margin-inline: auto;
}

.MvLogo li:nth-of-type(1) {
  width: calc(499px * var(--PcScale));
}

.s .MvLogo li:nth-of-type(1) {
  width: 66.53vw;
}

.MvLogo li:nth-of-type(2) {
  width: calc(306px * var(--PcScale));
}

.s .MvLogo li:nth-of-type(2) {
  width: 40.8vw;
}

.Mv h1 {
  max-width: calc(493px * var(--PcScale));
  padding-bottom: calc(35px * var(--PcScale));
}

.s .Mv h1 {
  max-width: 65.73vw;
  padding-bottom: 4.666vw;
}

.MvCopyright {
  font-size: var(--FontSizeClamp24);
  font-weight: var(--BaseFontMedium);
  padding-top: calc(50px * var(--PcScale));
}

.s .MvCopyright {
  padding-top: 5.33vw;
}

/* --------------
	Scroll Down
-----------------*/
.MvScroll {
  position: absolute;
  bottom: calc(40px * var(--PcScale));
  right: calc(24px * var(--PcScale));
  display: flex;
  align-items: flex-start;
  height: calc(164px * var(--PcScale));
}

.s .MvScroll {
  bottom: 5.33vw;
  right: 3.2vw;
  height: 21.86vw;
}

.MvScrollText {
  font-size: var(--FontSizeClamp18);
  font-weight: var(--BaseFontRegular);
  writing-mode: vertical-lr;
  letter-spacing: 2px;
}

.MvScrollBar::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 1px;
  height: calc(164px * var(--PcScale));
  background: var(--CommonColorWhite);
}

.s .MvScrollBar::after {
  height: 21.86vw;
}

.MvScrollBar::before {
  content: "";
  position: absolute;
  left: -4.5px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--CommonColorWhite);
  animation:
    circlemove 3s ease-in-out infinite,
    cirlemovehide 3s ease-out infinite;
}

.s .MvScrollBar::before {
  animation: circlemovesp 3s ease-in-out infinite;
}

@keyframes circlemove {
  0% {
    bottom: calc(150px * var(--PcScale));
  }

  100% {
    bottom: 0px;
  }
}

@keyframes circlemovesp {
  0% {
    bottom: 20vw;
  }

  100% {
    bottom: 0px;
  }
}

@keyframes cirlemovehide {
  0% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  80% {
    opacity: 0.9;
  }

  100% {
    opacity: 0;
  }
}

/* ================================
        Concept
================================ */
.Concept {
  min-height: 836px;
  padding: 0 calc(35px * var(--PcScale));
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  opacity: 0;
  transition:
    opacity 0.4s ease,
    transform 0.4s ease,
    top 0.4s ease;
}

@media screen and (min-width: 500px) and (max-width: 768px) {
  .s .Concept {
    min-height: 167.2vw;
    padding: 0 4.666vw;
    margin-top: -2vw;
  }
}

@media screen and (max-width: 499px) {
  .s .Concept {
    min-height: 167.2vw;
    padding: 0 4.666vw;
    margin-top: -18.4vw;
  }
}

.Concept.isShow {
  opacity: 1;
}

.Concept h2 {
  font-size: var(--FontSizeClamp48);
  font-weight: var(--BaseFontBold);
  padding-bottom: calc(20px * var(--PcScale));
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) !important;
}

.s .Concept h2 {
  padding-bottom: 4.26vw;
}

.Concept h3 {
  color: var(--CommonColorWhite);
  position: absolute;
  top: calc(20px * var(--PcScale));
  left: calc(35px * var(--PcScale));
  line-height: 1;
}

.s .Concept h3 {
  top: 2.666vw;
  left: 4.666vw;
}

.ConceptText {
  font-size: var(--FontSizeClamp24);
  font-weight: var(--BaseFontBold);
  line-height: var(--LineHeight32);
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
}

.s .ConceptText {
  padding-bottom: 0;
}

.ConceptText p {
  padding-bottom: calc(40px * var(--PcScale));
}

.s .ConceptText p {
  padding-bottom: 4.333vw;
}

/* --------------
	Active
-----------------*/
.Concept .CommonBtn a {
  position: relative;
  width: calc(580px * var(--PcScale));
  height: calc(120px * var(--PcScale));
  margin-inline: auto;
  font-size: var(--FontSizeClamp32);
}

.Concept:not(.isShow) .CommonBtn a {
  visibility: hidden;
}

.s .Concept .CommonBtn a {
  width: 77.33vw;
  height: 16vw;
}

.Concept .CommonBtn ._inner {
  transform: translateX(calc(-26px * var(--PcScale)));
}

.s .Concept .CommonBtn ._inner {
  transform: translateX(-3.46vw);
}

.Concept .CommonBtn ._small {
  font-size: var(--FontSizeClamp20);
}

.Concept .CommonBtn a::after {
  width: calc(50px * var(--PcScale));
  height: calc(50px * var(--PcScale));
  right: calc(39px * var(--PcScale));
}

.s .Concept .CommonBtn a::after {
  width: 6.66vw;
  height: 6.66vw;
  right: 5.2vw;
}

/* --------------
	Disabled
-----------------*/
.Concept .CommonBtn div {
  position: relative;
  width: calc(580px * var(--PcScale));
  height: calc(120px * var(--PcScale));
  margin-inline: auto;
  font-size: var(--FontSizeClamp32);
}

.s .Concept .CommonBtn div {
  width: 77.33vw;
  height: 16vw;
}

.Concept .CommonBtn div._inner {
  transform: translateX(calc(-26px * var(--PcScale)));
}

.s .Concept .CommonBtn div ._inner {
  transform: translateX(-2.2vw);
}

.Concept .CommonBtn div ._small {
  font-size: var(--FontSizeClamp20);
}

.Concept .CommonBtn div::after {
  width: calc(50px * var(--PcScale));
  height: calc(50px * var(--PcScale));
  right: calc(30px * var(--PcScale));
}

.s .Concept .CommonBtn div::after {
  width: 6.66vw;
  height: 6.66vw;
  right: 3.2vw;
}

/* ================================
        About
================================ */
.About {
  position: relative;
}

.AboutInner {
  position: sticky;
  top: 0;
  z-index: 0;
  aspect-ratio: 1500 / 2884;
  padding-top: calc(100px * var(--PcScale));
  text-align: center;
  color: var(--CommonColorWhite);
  clip-path: inset(0);
  width: 100%;
}

.s .AboutInner {
  top: 10.66vw;
  padding-top: 13.33vw;
}

.AboutInner::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url(../img/about-bg.webp);
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
  transform: scale(1);
}

.AboutInner::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%) scaleY(0);
  transform-origin: top;
  width: 1px;
  height: calc(80px * var(--PcScale));
  background-color: var(--CommonColorWhite);
  z-index: 2;
  transition: transform 0.3s ease;
}

.AboutInner.isActive::after {
  transform: translateX(-50%) scaleY(1);
}

.s .AboutInner::after {
  height: 10.66vw;
}

.About h2 {
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
}

.AboutQuote {
  font-size: var(--FontSizeClamp18);
  position: absolute;
  bottom: 7%;
  right: 3.06%;
}

.About h3 {
  position: absolute;
  top: calc(120px * var(--PcScale));
  left: calc(24px * var(--PcScale));
}

.s .About h3 {
  top: 16vw;
  left: 3.2vw;
}

.About h4 {
  font-size: var(--FontSizeClamp40);
  font-weight: var(--BaseFontBold);
  text-align: center;
  padding-bottom: calc(49px * var(--PcScale));
}

.s .About h4 {
  padding-bottom: 6.53vw;
}

.AboutBoxInner {
  font-size: var(--FontSizeClamp24);
  line-height: var(--LineHeight48);
  padding-bottom: calc(80px * var(--PcScale));
}

.s .AboutBoxInner {
  padding-bottom: 10.66vw;
  letter-spacing: -0.2px;
}

.About .AboutBoxInner:last-child {
  padding-bottom: 0;
}

.AboutBoxInner ._dot {
  text-decoration: underline dotted var(--CommonColorBrown);
  text-underline-offset: 4px;
}

.AboutBoxLead {
  padding-bottom: calc(36px * var(--PcScale));
}

.s .AboutBoxLead {
  padding-bottom: 4.8vw;
}

.AboutBoxText {
  padding-bottom: calc(18px * var(--PcScale));
}

.s .AboutBoxText {
  padding-bottom: 2.4vw;
}

.AboutBoxImg {
  padding-bottom: calc(36px * var(--PcScale));
}

.s .AboutBoxImg {
  padding-bottom: 4.8vw;
}

.About .AboutBoxImg:last-child {
  padding-bottom: 0;
}

.AboutBoxTextArea {
  max-width: calc(440px * var(--PcScale));
  padding: calc(27px * var(--PcScale)) calc(20px * var(--PcScale));
  background-color: var(--CommonColorGray);
  margin-top: -20%;
  z-index: 1;
  position: relative;
}

.s .AboutBoxTextArea {
  max-width: 58.66vw;
  padding: 3.59vw 2.66vw;
}

/* ================================
        Program
================================ */
.Program {
  background-color: var(--CommonColorGray);
  position: relative;
  padding-bottom: calc(76px * var(--PcScale));
}

.s .Program {
  padding-bottom: 10.13vw;
}

.Program .CommonArea {
  padding: calc(100px * var(--PcScale)) calc(80px * var(--PcScale))
    calc(38px * var(--PcScale));
}

.s .Program .CommonArea {
  padding: 13.33vw 10.66vw 5.06vw;
}

.ProgramInner {
  position: sticky;
  top: 0;
  z-index: 0;
  aspect-ratio: 1500 / 2854;
  padding-top: calc(100px * var(--PcScale));
  text-align: center;
  color: var(--CommonColorWhite);
  clip-path: inset(0);
  width: 100%;
}

.s .ProgramInner {
  top: 10.66vw;
  padding-top: 13.33vw;
}

.ProgramInner::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url(../img/program-bg.webp);
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
  transform: scale(1);
}

.ProgramInner::after {
  content: "";
  position: absolute;
  top: 0%;
  left: 50%;
  transform: translateX(-50%) scaleY(0);
  transform-origin: top;
  width: 1px;
  height: calc(80px * var(--PcScale));
  background-color: var(--CommonColorWhite);
  z-index: 2;
  transition: transform 0.3s ease;
}

.ProgramInner.isActive::after {
  transform: translateX(-50%) scaleY(1);
}

.s .ProgramInner::after {
  height: 10.66vw;
}

.Program h2 {
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
}

.Program h3 {
  position: absolute;
  top: calc(85px * var(--PcScale));
  left: calc(24px * var(--PcScale));
}

.s .Program h3 {
  top: 11.33vw;
  left: 3.2vw;
}

.Program h4 {
  font-size: var(--FontSizeClamp42);
  font-weight: var(--BaseFontBold);
  text-align: center;
  padding-bottom: calc(49px * var(--PcScale));
}

.s .Program h4 {
  padding-bottom: 6.53vw;
}

.Program h4 span {
  font-size: var(--FontSizeClamp40);
  padding: 0 1em;
}

.ProgramBoxLead {
  font-size: var(--FontSizeClamp28);
  padding-bottom: calc(40px * var(--PcScale));
  line-height: var(--LineHeight50);
}

.s .ProgramBoxLead {
  padding-bottom: 5.33vw;
}

.ProgramBoxImg {
  position: relative;
  padding-bottom: calc(20px * var(--PcScale));
}

.s .ProgramBoxImg {
  padding-bottom: 2.666vw;
}

.ProgramBoxInfo {
  position: absolute;
  width: calc(211px * var(--PcScale));
  top: 0;
  right: 0;
}

.s .ProgramBoxInfo {
  width: 28.1vw;
}

.ProgramBoxInfo._even {
  left: 0;
}

.ProgramBoxText {
  font-size: var(--FontSizeClamp28);
  padding-bottom: calc(52px * var(--PcScale));
  line-height: var(--LineHeight50);
}

.s .ProgramBoxText {
  padding-bottom: 6.933vw;
}

/* --------------
	Slider
-----------------*/
.ProgramSliderArea {
  padding-bottom: calc(146px * var(--PcScale));
  background-color: var(--CommonColorGray);
  position: relative;
  z-index: 1;
}

.s .ProgramSliderArea {
  padding-bottom: 21.9vw;
}

.screenreader_abs {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}

.ProgramSlider li {
  cursor: pointer;
  margin: 0 calc(20px * var(--PcScale));
}

.s .ProgramSlider li {
  margin: 0 2.666vw;
}

.ProgramSlider img {
  width: 100%;
  display: block;
}

.ProgramSliderText {
  height: calc(380px * var(--PcScale));
  padding: calc(50px * var(--PcScale)) calc(46px * var(--PcScale)) 0
    calc(46px * var(--PcScale));
  background: var(--CommonColorWhite);
  color: var(--CommonColorBrown);
  font-size: var(--FontSizeClamp28);
  line-height: var(--LineHeight50);
  letter-spacing: -0.5px;
}

.s .ProgramSliderText {
  height: 50.66vw;
  padding: 6.66vw 6.133vw 0 6.133vw;
}

.ProgramSlider .slick-slide {
  box-shadow: 0px 12px 26px 0px rgba(25, 12, 0, 0.12);
  margin-bottom: calc(80px * var(--PcScale));
  cursor: default;
  outline: none;
}

.s .ProgramSlider .slick-slide {
  margin-bottom: 10.66vw;
}

.ProgramSlider .slick-prev,
.ProgramSlider .slick-next {
  position: absolute;
  bottom: 0;
  z-index: 2;
  background: none;
  border: none;
  padding: 0;
}

.ProgramSliderBtn {
  display: flex;
  justify-content: center;
  gap: calc(420px * var(--PcScale));
  transform: translateY(calc(-10px * var(--PcScale)));
}

.s .ProgramSliderBtn {
  gap: 56vw;
  transform: translateY(0);
}

.ProgramSliderPrev,
.ProgramSliderNext {
  pointer-events: auto;
  z-index: 2;
  width: calc(80px * var(--PcScale));
  cursor: pointer;
}

.s .ProgramSliderPrev,
.s .ProgramSliderNext {
  width: 10.66vw;
}

.ProgramPager {
  display: flex;
  justify-content: center;
  position: relative;
  align-items: center;
  transform: translateY(calc(90px * var(--PcScale)));
}

.s .ProgramPager {
  transform: translateY(16vw);
}

.ProgramPager li {
  width: calc(40px * var(--PcScale));
  height: 4px;
  margin: 0;
  background: rgba(32, 0, 0, 0.2);
  cursor: pointer;
}

.s .ProgramPager li {
  width: 5.333vw;
  margin: 0;
}

.ProgramPager li:hover,
.ProgramPager li.slick-active {
  background: var(--CommonColorBeige);
}

.ProgramPager li button {
  display: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0;
  border: none;
  background-color: transparent;
}

#movie_controller {
  width: 120px;
  margin: 0 5% 0 auto;
  transform: translateY(calc(-40px * var(--PcScale)));
}

.s #movie_controller {
  width: 32vw;
  transform: translateY(calc(-4vw));
}

#movie_controller a {
  font-size: 1.4rem;
  color: #fff;
  font-weight: var(--BaseFontBold);
  background: rgba(0, 0, 0, 0.4);
  padding: 0.7rem 1rem;
  border-radius: 0.5rem;
  letter-spacing: 1px;
  align-items: center;
  cursor: pointer;
  display: flex;
}

.s #movie_controller a {
  font-size: var(--FontSizeClamp28);
}

#movie_controller img {
  width: 1.643em;
  margin-right: 1rem;
  vertical-align: middle;
  position: relative;
  top: -1px;
}

/* ================================
        Schedule
================================ */
.Schedule {
  position: relative;
}

.ScheduleInner {
  position: sticky;
  top: 0;
  z-index: 0;

  aspect-ratio: 1500 / 2884;
  padding-top: calc(100px * var(--PcScale));
  text-align: center;
  color: var(--CommonColorWhite);
  z-index: 0;
  clip-path: inset(0);
  width: 100%;
}

.s .ScheduleInner {
  top: 10.66vw;
  padding-top: 13.33vw;
}

.ScheduleInner::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url(../img/schedule-bg.webp);
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
  transform: scale(1);
}

.ScheduleInner::after {
  content: "";
  position: absolute;
  top: 0%;
  left: 50%;
  transform: translateX(-50%) scaleY(0);
  transform-origin: top;
  width: 1px;
  height: calc(80px * var(--PcScale));
  background-color: var(--CommonColorWhite);
  z-index: 2;
  transition: transform 0.3s ease;
}

.ScheduleInner.isActive::after {
  transform: translateX(-50%) scaleY(1);
}

.s .ScheduleInner::after {
  height: 10.66vw;
}

.Schedule h2 {
  text-shadow: 0 0 8px rgba(0, 0, 0, 0.65);
}

.Schedule h3 {
  position: absolute;
  top: calc(85px * var(--PcScale));
  left: calc(24px * var(--PcScale));
}

.s .Schedule h3 {
  top: 11.33vw;
  left: 3.2vw;
}

.Schedule h4 {
  padding: 0 calc(25px * var(--PcScale));
}

.s .Schedule h4 {
  padding: 0 3.33vw;
}

.ScheduleBox {
  background: var(--CommonColorCream);
  margin-bottom: calc(91px * var(--PcScale));
}

.s .ScheduleBox {
  margin-bottom: 12.13vw;
}

.Schedule .ScheduleBox:last-of-type {
  margin-bottom: calc(40px * var(--PcScale));
}

.s .Schedule .ScheduleBox:last-of-type {
  margin-bottom: 5.33vw;
}

.ScheduleBoxImg {
  position: relative;
}

.ScheduleBoxInfo {
  position: absolute;
  width: calc(211px * var(--PcScale));
  top: 0;
  right: 0;
}

.s .ScheduleBoxInfo {
  width: 28.1vw;
}

.ScheduleBoxInner {
  padding: calc(21px * var(--PcScale)) calc(25px * var(--PcScale))
    calc(60px * var(--PcScale));
}

.s .ScheduleBoxInner {
  padding: 2.8vw 3.33vw 8vw;
}

.ScheduleBoxList {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  text-align: center;
  gap: calc(10px * var(--PcScale));
  padding-top: calc(28px * var(--PcScale));
}

.s .ScheduleBoxList {
  gap: 1.333vw;
  padding-top: 3.733vw;
}

.ScheduleBoxList li {
  max-width: calc(148px * var(--PcScale));
  font-size: var(--FontSizeClamp20);
  line-height: var(--LineHeight20);
}

.s .ScheduleBoxList li {
  max-width: 19.73vw;
}

.ScheduleBoxList li p:nth-of-type(1) {
  position: relative;
  z-index: 1;
}

.ScheduleBoxList li p:nth-of-type(1)::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(0, -50%);
  width: 100%;
  height: 2px;
  background-color: var(--CommonColorBrown);
  z-index: -1;
}

.ScheduleBoxList li:last-child p:nth-of-type(1)::after {
  content: none;
}

.ScheduleBoxList li p:nth-of-type(2) {
  font-size: var(--FontSizeClamp20);
  line-height: var(--LineHeight20);
  padding-top: calc(15px * var(--PcScale));
  margin: 0 calc(-24px * var(--PcScale));
}

.s .ScheduleBoxList li p:nth-of-type(2) {
  padding-top: 2vw;
  margin: 0 -3.2vw;
}

.ScheduleBoxList li p:nth-of-type(2)._adust {
  transform: translateY(-6px);
}

.ScheduleBoxList li p:nth-of-type(2)._adust span {
  font-size: var(--FontSizeClamp18);
  letter-spacing: -0.3px;
}

.ScheduleBoxText {
  font-size: var(--FontSizeClamp28);
  padding: calc(42px * var(--PcScale)) calc(25px * var(--PcScale)) 0
    calc(25px * var(--PcScale));
  line-height: var(--LineHeight50);
}

.s .ScheduleBoxText {
  padding: 5.6vw 3.33vw 0 3.33vw;
}

/* ================================
        Profile
================================ */
.Profile {
  aspect-ratio: 1500 / 2508;
  padding: calc(94px * var(--PcScale)) calc(35px * var(--PcScale))
    calc(168px * var(--PcScale)) calc(35px * var(--PcScale));
  text-align: center;
  position: relative;
  z-index: 1;
  overflow: hidden;
  width: 100%;
}

.s .Profile {
  padding: 12.53vw 4.666vw 22.4vw 4.666vw;
}

.Profile::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url(../img/profile-bg.webp);
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
  transform: scale(1);
  z-index: -1;
}

.Profile::after {
  content: "";
  position: absolute;
  top: 0%;
  left: 50%;
  transform: translateX(-50%) scaleY(0);
  transform-origin: top;
  width: 1px;
  height: calc(80px * var(--PcScale));
  background-color: var(--CommonColorBrown);
  z-index: 2;
  transition: transform 0.3s ease;
}

.Profile.isActive::after {
  transform: translateX(-50%) scaleY(1);
}

.s .Profile::after {
  height: 10.66vw;
}

.Profile h2 {
  color: var(--CommonColorBrown);
  font-size: var(--FontSizeClamp32);
  font-weight: var(--BaseFontMedium);
  padding-bottom: calc(30px * var(--PcScale));
}

.s .Profile h2 {
  padding-bottom: 2.466vw;
}

.Profile h3 {
  font-size: var(--FontSizeClamp52);
  font-weight: var(--BaseFontBold);
  writing-mode: inherit;
  padding-bottom: calc(28px * var(--PcScale));
}

.s .Profile h3 {
  padding-bottom: 3.333vw;
}

.Profile div {
  font-size: var(--FontSizeClamp24);
  font-weight: var(--BaseFontRegular);
}

.Profile div {
  padding-bottom: calc(20px * var(--PcScale));
  line-height: var(--LineHeight48);
}

.s .Profile div {
  padding-bottom: 5.333vw;
}

.Profile p {
  padding-top: calc(20px * var(--PcScale));
  width: calc(203px * var(--PcScale));
  margin-inline: auto;
}

.s .Profile p {
  padding-top: 0;
  width: 27.06vw;
}

/* ================================
			StickyBanner
================================ */
.StickyBannerBg {
  display: none;
}

.s .StickyBannerBg {
  padding-bottom: 2.66vw;
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 9999;
}

/* --------------
	Active
-----------------*/
.StickyBannerBg .CommonBtn a {
  position: relative;
  margin-inline: auto;
  font-size: var(--FontSizeClamp32);
  width: 77.33vw;
  height: 16vw;
}

.StickyBannerBg .CommonBtn ._inner {
  transform: translateX(-3.46vw);
}

.StickyBannerBg ._small {
  font-size: var(--FontSizeClamp20);
}

.StickyBannerBg a::after {
  width: calc(50px * var(--PcScale));
  height: calc(50px * var(--PcScale));
  right: calc(39px * var(--PcScale));
}

.StickyBannerBg .CommonBtn a::after {
  width: 6.66vw;
  height: 6.66vw;
  right: 5.2vw;
}

/* --------------
	Disabled
-----------------*/
.StickyBannerBg .CommonBtn div {
  position: relative;
  width: 77.33vw;
  height: 16vw;
  margin-inline: auto;
  font-size: var(--FontSizeClamp32);
}

.StickyBannerBg .CommonBtn div._inner {
  transform: translateX(-2.2vw);
}

.StickyBannerBg .CommonBtn div ._small {
  font-size: var(--FontSizeClamp20);
}

.StickyBannerBg .CommonBtn div::after {
  width: 6.66vw;
  height: 6.66vw;
  right: 3.2vw;
}