@charset "UTF-8";
/*
**************************************************************************
*	fields ULTRAMAN style.css
**************************************************************************/
:root {
  --fonts-notosansjp: "Noto Sans JP", sans-serif;
  --fonts-notoserifjp: "Noto Serif JP", serif;
  --fonts-notoserifkr: "Noto Serif KR", serif;
  --fonts-notoserifsc: "Noto Serif SC", serif;
  --fonts-notoseriftc: "Noto Serif TC", serif;
  --color-black: #000;
  --color-white: #fff;
  --color-red: #C4272A;
  --color-gray1: #191919;
  --color-gray2: #666;
  --color-base: var(--color-black);
  --color-footer: var(--color-black);
  --color-complete1: var(--color-black);
  --color-complete2: var(--color-black);
  --text-shadows1: 0 0 5px rgba(0, 0, 0, 0.8);
  --text-shadows2: 0 0 14px rgba(0, 0, 0, 0.8);
  --btn-shadows: 0 0 6px rgba(255, 55, 0, 0.92);
  --easing-cubic1: cubic-bezier(0, 0, .2, 1);
}

/* --------------------------------------------------
		共通
-------------------------------------------------- */
.complete-limit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
  z-index: 1;
  position: relative;
      flex-wrap: wrap;
  padding: 24px 20px;
  gap: 8px 24px;
  background-color: var(--color-complete1);
}
.l-footer .complete-limit {
  padding: 48px 20px 6px;
  background-color: var(--color-complete2);
}
.complete-limit__text {
  color: var(--color-white);
  font-weight: 700;
  font-size: calc(28 / 10 * 1rem);
  line-height: 1.3928571429;
  letter-spacing: calc(200 / 1000 * 1em);
}
.l-footer .complete-limit__text {
  line-height: 1.2580645161;
}
[lang=ko] .complete-limit__text, [lang=zh-Hans] .complete-limit__text, [lang=zh-Hant-TW] .complete-limit__text, [lang=en] .complete-limit__text {
  letter-spacing: calc(0 / 1000 * 1em);
}
.l-footer [lang=ko] .complete-limit__text, .l-footer [lang=zh-Hans] .complete-limit__text, .l-footer [lang=zh-Hant-TW] .complete-limit__text, .l-footer [lang=en] .complete-limit__text {
  letter-spacing: calc(0 / 1000 * 1em);
}
.complete-limit__notice {
  color: var(--color-white);
  font-weight: 400;
  font-size: calc(14 / 10 * 1rem);
  line-height: 1.7142857143;
  letter-spacing: calc(25 / 1000 * 1em);
}

.c-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  z-index: 3;
  position: sticky;
  top: 80px;
  left: 0;
          justify-content: center;
  width: 100%;
  background: url("../img/bg-section-ttl_pc.svg") left top repeat-x;
}

.separate {
  z-index: 1;
  position: relative;
  width: 100%;
  height: 450px;
}
.separate img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

/* --------------------------------------------------
		MARK:MOVIE
-------------------------------------------------- */
.movie {
  z-index: 1;
  position: relative;
  min-height: 100dvh;
  background-color: var(--color-gray1);
}
.movie__bg {
  display: block;
  z-index: 0;
  position: sticky;
  top: 80px;
  left: 0;
  width: 100%;
  height: calc(100vh - 80px);
  margin-bottom: calc(-100vh + 80px);
  background-image: url("../img/bg-point1_pc.png"), url("../img/bg-point2_pc.png");
  background-position: top right, left bottom;
  background-size: 426px 326px, 452px 250px;
  background-repeat: no-repeat;
  background-color: var(--color-gray1);
}
.movie__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
  z-index: 1;
  position: relative;
          align-items: center;
  max-width: 1065px;
  margin-inline: auto;
  padding-inline: 20px;
  padding-block: 80px 130px;
  gap: 64px;
}
.movie__contents {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: 16px;
}
.movie__contents--inner {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: 262px;
}
.movie__subttl {
  z-index: 1;
  position: relative;
  color: var(--color-white);
  font-weight: 700;
  font-size: calc(54 / 10 * 1rem);
  line-height: 1.15;
  letter-spacing: calc(-18 / 1000 * 1em);
}
.movie__subttl .is-en {
  margin-left: 0.25em;
}
.movie__block {
  z-index: 1;
  position: relative;
  max-width: 680px;
  margin-top: 56px;
  padding: 24px 26px 26px;
}
.movie__block::after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  content: "";
}
.movie__block--ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
  z-index: 1;
  position: absolute;
  top: -55px;
  left: 0;
          justify-content: flex-start;
  width: 100%;
  max-width: 488px;
  height: 56px;
  padding-top: 22px;
  padding-left: 26px;
  gap: 8px;
}
.movie__block--ttl::after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 56px;
  background-color: rgba(0, 0, 0, 0.5);
  content: "";
  clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 100%, 0% 100%);
}
.movie__block--ttl .is-mainlabel {
  z-index: 1;
  position: relative;
  font-weight: 700;
  font-size: calc(32 / 10 * 1rem);
  line-height: 1.1;
  letter-spacing: calc(-18 / 1000 * 1em);
}
.movie__block--ttl .is-sublabel {
  z-index: 1;
  position: relative;
  font-weight: 700;
  font-size: calc(16 / 10 * 1rem);
  line-height: 1.1;
  letter-spacing: calc(-18 / 1000 * 1em);
}
.movie__block--inner {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  z-index: 1;
  position: relative;
  grid-template-columns: 1fr;
  gap: 16px;
}
.movie__block--text {
  font-weight: 700;
  font-size: calc(20 / 10 * 1rem);
  line-height: 1.3;
  letter-spacing: calc(5 / 1000 * 1em);
}
.movie__block--thumbnail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.movie__block--embed {
  position: relative;
}
.movie__block--embed .is-play {
  z-index: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  pointer-events: none;
}
.movie__block--trigger {
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  -webkit-transition: -webkit-filter 0.6s var(--easing-cubic1);
  transition: -webkit-filter 0.6s var(--easing-cubic1);
  transition: filter 0.6s var(--easing-cubic1);
  transition: filter 0.6s var(--easing-cubic1), -webkit-filter 0.6s var(--easing-cubic1);
}
.movie__block--trigger img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.movie__block--trigger:hover {
  -webkit-filter: brightness(0.5);
          filter: brightness(0.5);
}

/* --------------------------------------------------
	MARK:Concept
-------------------------------------------------- */
.concept {
  z-index: 1;
  position: relative;
  min-height: 100vh;
  overflow: clip;
  background-color: var(--color-gray1);
}
.concept__img {
  display: block;
  z-index: 0;
  position: sticky;
  top: 80px;
  left: 0;
  width: 100%;
  height: calc(100vh - 80px);
  margin-bottom: calc(-100vh + 80px);
}
.concept__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top center;
     object-position: top center;
}
.concept__contents {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  z-index: 1;
  position: relative;
  grid-template-columns: 1fr;
  max-width: 1025px;
  margin-inline: auto;
  padding-block: 80px 88px;
  gap: 64px;
}
.concept__block {
  position: relative;
  width: 100%;
  max-width: 546px;
  margin-left: auto;
  padding: 32px 54px 32px 32px;
}
.concept__block::after {
  display: block;
  width: 100%;
  height: 100%;
  backdrop-filter: blur(5px);
  content: "";
  --webkit-backdrop-filter: blur(5px);
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.4);
}
.concept__text {
  z-index: 1;
  position: relative;
  color: var(--color-white);
  font-weight: 700;
  font-size: calc(15 / 10 * 1rem);
  line-height: 2;
  letter-spacing: calc(5 / 1000 * 1em);
}

/* --------------------------------------------------
		MARK:Point
-------------------------------------------------- */
.point {
  z-index: 1;
  position: relative;
  min-height: 100dvh;
  background-color: var(--color-gray1);
}
.point__bg {
  display: block;
  z-index: 0;
  position: sticky;
  top: 80px;
  left: 0;
  width: 100%;
  height: calc(100vh - 80px);
  margin-bottom: calc(-100vh + 80px);
  background-image: url("../img/bg-point1_pc.png"), url("../img/bg-point2_pc.png");
  background-position: top right, left bottom;
  background-size: 426px 326px, 452px 250px;
  background-repeat: no-repeat;
  background-color: var(--color-gray1);
}
.point__container {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 1fr;
  z-index: 1;
  position: relative;
  grid-template-columns: auto 1fr;
  max-width: 1065px;
  margin-inline: auto;
  padding-inline: 20px;
  padding-block: 32px 64px;
  gap: 64px;
}
.point__case {
  max-width: 284px;
}
.point__case img {
  position: sticky;
  top: 160px;
  left: 0;
  -webkit-filter: drop-shadow(0px 10px 10px rgba(0, 0, 0, 0.7));
          filter: drop-shadow(0px 10px 10px rgba(0, 0, 0, 0.7));
}
.point__contents {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: 16px;
}
.point__contents--inner {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: 262px;
}
.point__subttl {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
  z-index: 1;
  position: relative;
          align-items: center;
  color: var(--color-white);
  font-weight: 700;
  font-size: calc(54 / 10 * 1rem);
  line-height: 1.15;
  letter-spacing: calc(-18 / 1000 * 1em);
}
.point__subttl .is-sublabel {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.point__subttl .is-sublabel::after {
  content: "：";
}
.point__subttl .is-mainlabel {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.point__block {
  z-index: 1;
  position: relative;
  max-width: 680px;
  margin-top: 70px;
  padding: 36px 26px 26px;
}
.point__block::after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  content: "";
}
.point__block--ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
  z-index: 1;
  position: absolute;
  top: -69px;
  left: 0;
          justify-content: flex-start;
  width: 100%;
  max-width: 488px;
  height: 70px;
  padding-top: 35px;
  padding-left: 26px;
  gap: 8px;
}
.is-climax .point__block--ttl {
  padding-top: 24px;
}
.point__block--ttl::after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 70px;
  background-color: rgba(0, 0, 0, 0.5);
  content: "";
  clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 100%, 0% 100%);
}
.point__block--ttl .is-mainlabel {
  z-index: 1;
  position: relative;
  font-weight: 700;
  font-size: calc(32 / 10 * 1rem);
  line-height: 1.1;
  letter-spacing: calc(-18 / 1000 * 1em);
}
.point__block--ttl .is-sublabel {
  z-index: 1;
  position: relative;
  font-weight: 700;
  font-size: calc(18 / 10 * 1rem);
  line-height: 1.1;
  letter-spacing: calc(-18 / 1000 * 1em);
}
.point__block--inner {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  z-index: 1;
  position: relative;
  grid-template-columns: 1fr;
  gap: 16px;
}
.point__block--text {
  font-weight: 700;
  font-size: calc(18 / 10 * 1rem);
  line-height: 1.4444444444;
  letter-spacing: calc(5 / 1000 * 1em);
}
.point__block--thumbnail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.point__block--embed {
  position: relative;
}
.point__block--embed .is-play {
  z-index: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  pointer-events: none;
}
.point__block--trigger {
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  -webkit-transition: -webkit-filter 0.6s var(--easing-cubic1);
  transition: -webkit-filter 0.6s var(--easing-cubic1);
  transition: filter 0.6s var(--easing-cubic1);
  transition: filter 0.6s var(--easing-cubic1), -webkit-filter 0.6s var(--easing-cubic1);
}
.point__block--trigger img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.point__block--trigger:hover {
  -webkit-filter: brightness(0.5);
          filter: brightness(0.5);
}

.machine {
  z-index: 1;
  position: relative;
  padding: 40px 20px 80px;
  overflow: clip;
}
.machine::before {
  width: 120%;
  height: 140%;
  background-color: #0E0E0E;
  content: "";
  -webkit-filter: blur(13px);
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
          filter: blur(13px);
}
.machine__container {
  z-index: 1;
  position: relative;
  max-width: 1126px;
  margin-inline: auto;
}
.machine__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-margin-after: 32px;
  z-index: 1;
  position: relative;
          margin-block-end: 32px;
}
.machine__list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[3];
  grid-template-columns: repeat(3, 1fr);
  gap: 4.0995607613vw;
}
.machine__img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-margin-after: 20px;
          margin-block-end: 20px;
}
.machine__img img {
  width: 100%;
  height: auto;
  border: 1px solid #707070;
  border-radius: 4px;
}
.machine__inner {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: 25px;
}
.machine__text {
  font-weight: 700;
  font-size: calc(15 / 10 * 1rem);
  line-height: 2;
  letter-spacing: calc(5 / 1000 * 1em);
}
.machine__notice {
  font-weight: 700;
  font-size: calc(10 / 10 * 1rem);
  line-height: 1.6;
  letter-spacing: calc(50 / 1000 * 1em);
}

/* --------------------------------------------------
		MARK:Flow
-------------------------------------------------- */
.flow {
  z-index: 1;
  position: relative;
  background: url("../img/bg-flow_pc.jpg") center top no-repeat;
  background-size: cover;
}
.flow__container {
  padding-inline: 20px;
  padding-block: 20px 80px;
}
.is-fan .flow__container {
  padding-block: 40px 0;
}
.flow__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  max-width: 1260px;
  margin-inline: auto;
  -webkit-margin-after: 32px;
          margin-block-end: 32px;
}
.flow__img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  max-width: 1260px;
  margin-inline: auto;
}
.flow__img img {
  width: 100%;
  height: auto;
}

/* --------------------------------------------------
		MARK:staging
-------------------------------------------------- */
.staging {
  z-index: 1;
  position: relative;
  background-color: #050100;
}
.staging__bg {
  display: block;
  z-index: 0;
  aspect-ratio: 1366/872;
  width: 100%;
  height: 100%;
  margin-top: -80px;
  background: url("../img/bg-staging_pc.jpg") center top no-repeat;
  background-size: contain;
}
.staging__container img {
  width: 100%;
  height: auto;
}
.staging__ttl {
  z-index: 2;
  position: absolute;
  top: 8.4187408492vw;
  left: 50%;
  width: 77.7452415813vw;
  height: auto;
  translate: -50% 0;
}
.staging__ttl.is-view {
  -webkit-animation-delay: 0.1s !important;
          animation-delay: 0.1s !important;
}
.staging__img1 {
  z-index: 1;
  position: absolute;
  top: 12.3718887262vw;
  left: 5.1244509517vw;
  width: 32.3572474378vw;
  height: auto;
}
.staging__img1.is-view {
  -webkit-animation-delay: 0.25s !important;
          animation-delay: 0.25s !important;
}
.staging__img2 {
  z-index: 1;
  position: absolute;
  top: 13.9824304539vw;
  right: 3.074670571vw;
  width: 32.7232796486vw;
  height: auto;
}
.staging__img2.is-view {
  -webkit-animation-delay: 0.35s !important;
          animation-delay: 0.35s !important;
}
.staging__img3 {
  z-index: 1;
  position: absolute;
  top: 37.4084919473vw;
  left: 5.1244509517vw;
  width: 34.0409956076vw;
  height: auto;
}
.staging__img3.is-view {
  -webkit-animation-delay: 0.45s !important;
          animation-delay: 0.45s !important;
}
.staging__img4 {
  z-index: 1;
  position: absolute;
  top: 36.5300146413vw;
  right: 3.074670571vw;
  width: 42.2401171303vw;
  height: auto;
}
.staging__img4.is-view {
  -webkit-animation-delay: 0.55s !important;
          animation-delay: 0.55s !important;
}
.staging__mode {
  position: relative;
  aspect-ratio: 1366/872;
  background: url("../img/bg-mode_pc.jpg") center top no-repeat;
  background-size: contain;
}
.staging__mode img {
  width: 100%;
  height: auto;
}
.staging__mode--ttl {
  z-index: 1;
  position: absolute;
  top: 0.0732064422vw;
  left: 50%;
  width: 60.9077598829vw;
  height: auto;
  translate: -50% 0;
}
.staging__mode--ttl.is-view {
  -webkit-animation-delay: 0.2s !important;
          animation-delay: 0.2s !important;
}
.staging__mode--logo {
  z-index: 1;
  position: absolute;
  top: 20.4978038067vw;
  left: 50%;
  width: 18.4480234261vw;
  height: auto;
  translate: -50% 0;
}
.staging__mode--logo.is-view {
  -webkit-animation-delay: 0.3s !important;
          animation-delay: 0.3s !important;
}
.staging__mode--subttl1 {
  z-index: 1;
  position: absolute;
  top: 10.4685212299vw;
  left: 0;
  width: 18.5944363104vw;
  height: auto;
}
.staging__mode--subttl1.is-view {
  -webkit-animation-delay: 0.3s !important;
          animation-delay: 0.3s !important;
}
.staging__mode--img1 {
  z-index: 1;
  position: absolute;
  top: 36.82284041vw;
  left: 27.8916544656vw;
  width: 19.1800878477vw;
  height: auto;
}
.staging__mode--img1.is-view {
  -webkit-animation-delay: 0.4s !important;
          animation-delay: 0.4s !important;
}
.staging__mode--subttl2 {
  z-index: 1;
  position: absolute;
  top: -2.3426061493vw;
  right: 0;
  width: 17.4963396779vw;
  height: auto;
}
.staging__mode--subttl2.is-view {
  -webkit-animation-delay: 0.5s !important;
          animation-delay: 0.5s !important;
}
.staging__mode--img2 {
  z-index: 1;
  position: absolute;
  top: 36.82284041vw;
  right: 27.8916544656vw;
  width: 19.1800878477vw;
  height: auto;
}
.staging__mode--img2.is-view {
  -webkit-animation-delay: 0.5s !important;
          animation-delay: 0.5s !important;
}
.staging__mode--notice {
  z-index: 1;
  position: absolute;
  top: 53.953147877vw;
  right: 2.0497803807vw;
  width: 56.0029282577vw;
  height: auto;
}

/* --------------------------------------------------
		MARK:演出（ファンサイト）
-------------------------------------------------- */
.direction {
  z-index: 1;
  position: relative;
  background-color: #222;
  text-align: center;
}
.direction__bg {
  width: 100%;
  height: 100vh;
  background: url("../img/img-directioneva1_pc.png") center top no-repeat, url("../img/bg-direction1_pc.jpg") center top no-repeat;
  background-size: 100% auto;
  -webkit-margin-after: -100vh;
  z-index: 0;
  position: sticky;
  top: 0;
  left: 0;
          margin-block-end: -100vh;
}
.direction .is-ttlbg {
  z-index: 2;
  position: absolute;
  left: 0;
  width: 100%;
  translate: 0 55%;
  mix-blend-mode: color-dodge;
}
.direction .is-ttlbg.is-st {
  translate: 0 72%;
}
.direction .is-ttlbg.is-normalcustom {
  translate: 0 100%;
}
[lang=zh-Hans] .direction .is-ttlbg.is-normalcustom {
  translate: 0 120%;
}
[lang=zh-Hant-TW] .direction .is-ttlbg.is-normalcustom {
  translate: 0 120%;
}
.direction__title {
  -webkit-padding-after: 88px;
  z-index: 5;
  position: relative;
          padding-block-end: 88px;
}
.direction__featured {
  display: -ms-grid;
  display: grid;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
  z-index: 1;
  position: relative;
          flex-direction: column;
  padding: 64px 20px 40px;
}
.direction__featured--img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 24px;
}
.direction__normalreach {
  z-index: 1;
  position: relative;
  padding: 64px 20px 80px;
}
.direction__normalreach--block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
  position: relative;
          flex-direction: column;
  overflow: clip;
  gap: 24px;
}
.direction__normalreach--block + .direction__normalreach--block {
  -webkit-margin-before: 40px;
          margin-block-start: 40px;
}
.direction__normalreach--img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 16px 24px;
}
[lang=en] .direction__normalreach--img.is-story picture {
  display: block;
}
[lang=en] .direction__normalreach--img.is-story picture:nth-of-type(1) {
  -webkit-margin-start: 55px;
          margin-inline-start: 55px;
}
[lang=en] .direction__normalreach--img.is-story picture:nth-of-type(2) {
  -webkit-margin-start: -15px;
          margin-inline-start: -15px;
}
[lang=zh-Hans] .direction__normalreach--img.is-story picture {
  display: block;
}
[lang=zh-Hans] .direction__normalreach--img.is-story picture:nth-of-type(1) {
  -webkit-margin-start: 50px;
          margin-inline-start: 50px;
}
[lang=zh-Hant-TW] .direction__normalreach--img.is-story picture {
  display: block;
}
[lang=zh-Hant-TW] .direction__normalreach--img.is-story picture:nth-of-type(1) {
  -webkit-margin-start: 30px;
          margin-inline-start: 30px;
}
[lang=zh-Hant-TW] .direction__normalreach--img.is-story picture:nth-of-type(2) {
  -webkit-margin-end: -12px;
          margin-inline-end: -12px;
}
.direction__normalreach--img2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 16px 8px;
}
.direction__st {
  z-index: 1;
  position: relative;
  padding: 96px 20px 0;
}
.direction__st .direction__title {
  -webkit-padding-after: 58px;
          padding-block-end: 58px;
}
.direction__st::after {
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../img/bg-direction2_pc.jpg") center top repeat-y;
  background-size: 100% auto;
  content: "";
}
.direction__st--block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
  z-index: 1;
  position: relative;
          flex-direction: column;
  gap: 24px;
}
.direction__st--block + .direction__st--block {
  -webkit-margin-before: 64px;
          margin-block-start: 64px;
}
.direction__impactmode {
  border-top: 5px solid #8F161E;
  -webkit-margin-before: 120px;
  z-index: 1;
  position: relative;
  margin-inline: -20px;
          margin-block-start: 120px;
  padding: 72px 20px 120px;
}
.direction__impactmode::before {
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../img/bg-direction3_pc.jpg") center top no-repeat;
  background-size: cover;
  content: "";
}
.direction__impactmode .direction__subtitle {
  position: absolute;
  top: 0;
  left: 50%;
  width: 100%;
  translate: -50% -50%;
}
.direction__impactmode--text {
  z-index: 1;
  position: relative;
}
.direction__impactmode--hgroup {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4px;
  -webkit-margin-before: 16px;
  z-index: 1;
  position: relative;
          margin-block-start: 16px;
}
.direction__impactmode--title {
  z-index: 1;
  position: relative;
}
.direction__impactmode--sublabel {
  z-index: 1;
  position: relative;
}
.direction__impactmode--img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
  -webkit-margin-before: 16px;
  z-index: 1;
  position: relative;
          margin-block-start: 16px;
}
.direction__impactmode--img + .direction__impactmode--img {
  -webkit-margin-before: 24px;
          margin-block-start: 24px;
}
.direction__impactmode--img2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
  -webkit-margin-before: 40px;
  z-index: 1;
  position: relative;
          margin-block-start: 40px;
}
.direction__impactmode--img2 + .direction__impactmode--img2 {
  -webkit-margin-before: 24px;
          margin-block-start: 24px;
}
.direction__impactmode--img3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0;
  -webkit-margin-before: -20px;
  z-index: 1;
  position: relative;
          margin-block-start: -20px;
}
.direction__impactmode--img3 picture:last-of-type {
  -webkit-margin-before: -16px;
          margin-block-start: -16px;
}
.direction__impactmode--img4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
  -webkit-margin-before: 10px;
  z-index: 1;
  position: relative;
          margin-block-start: 10px;
}
.direction__impactmode--img4 + .direction__impactmode--img4 {
  -webkit-margin-before: 24px;
          margin-block-start: 24px;
}
.direction__runaway {
  border-top: 5px solid #8F161E;
  -webkit-margin-before: 120px;
  z-index: 1;
  position: relative;
  margin-inline: -20px;
          margin-block-start: 120px;
  padding: 72px 20px 90px;
}
.direction__runaway::before {
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../img/bg-direction4_pc.jpg") center top no-repeat;
  background-size: cover;
  content: "";
}
.direction__runaway .direction__subtitle {
  position: absolute;
  top: 0;
  left: 50%;
  width: 100%;
  translate: -50% -50%;
}
.direction__runaway--text {
  z-index: 1;
  position: relative;
}
.direction__runaway--img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
  -webkit-margin-before: 0;
  z-index: 1;
  position: relative;
          margin-block-start: 0;
}
.direction__runaway--img + .direction__runaway--img {
  -webkit-margin-before: 0;
          margin-block-start: 0;
}
.direction__runaway--img2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
  -webkit-margin-before: -32px;
  z-index: 1;
  position: relative;
          margin-block-start: -32px;
}
[lang=ko] .direction__runaway--img2, [lang=zh-Hans] .direction__runaway--img2, [lang=zh-Hant-TW] .direction__runaway--img2, [lang=en] .direction__runaway--img2 {
  -webkit-margin-before: 32px;
          margin-block-start: 32px;
}
.direction__runaway--img2 + .direction__runaway--img2 {
  -webkit-margin-before: 0;
          margin-block-start: 0;
}
.direction__runaway--img3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
  -webkit-margin-before: -18px;
  z-index: 1;
  position: relative;
          margin-block-start: -18px;
}
[lang=ko] .direction__runaway--img3, [lang=zh-Hans] .direction__runaway--img3, [lang=zh-Hant-TW] .direction__runaway--img3, [lang=en] .direction__runaway--img3 {
  -webkit-margin-before: 32px;
          margin-block-start: 32px;
}
.direction__runaway--img3 + .direction__runaway--img3 {
  -webkit-margin-before: 0;
          margin-block-start: 0;
}
.direction__special {
  border-top: 5px solid #8F161E;
  -webkit-margin-before: 120px;
  z-index: 1;
  position: relative;
  margin-inline: -20px;
          margin-block-start: 120px;
  padding: 72px 20px 80px;
}
.direction__special::before {
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../img/bg-direction5_pc.jpg") center top no-repeat;
  background-size: cover;
  content: "";
}
.direction__special .direction__subtitle {
  position: absolute;
  top: 0;
  left: 50%;
  width: 100%;
  translate: -50% -50%;
}
.direction__special--text {
  z-index: 1;
  position: relative;
}
.direction__special--img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
  -webkit-margin-before: 48px;
  z-index: 1;
  position: relative;
          margin-block-start: 48px;
}
.direction__special--img + .direction__special--img {
  -webkit-margin-before: 0;
          margin-block-start: 0;
}
.direction__normalcustom {
  z-index: 1;
  position: relative;
  padding: 140px 20px 120px;
}
.direction__normalcustom::before {
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../img/img-directioneva2_pc.png") center top no-repeat, url("../img/bg-direction6_pc.jpg") center top no-repeat;
  background-size: 100% auto;
  content: "";
}
.direction__normalcustom--block {
  z-index: 1;
  position: relative;
}

/* --------------------------------------------------
		MARK:CONTENTS
-------------------------------------------------- */
.overview {
  z-index: 1;
  position: relative;
  height: 1150px;
  background: url("../img/bg-overview_pc.jpg") center no-repeat;
  background-size: cover;
}
.overview img {
  width: 100%;
  height: auto;
}
.overview__container {
  padding: 16px 20px 72px;
}
.overview__contents {
  position: relative;
  max-width: 1126px;
  margin-inline: auto;
}
.overview__unit {
  z-index: 0;
  position: absolute;
  top: -2.3426061493vw;
  left: calc(50% + 72px);
  width: 39.0922401171vw;
  max-width: 534px;
  height: auto;
  -webkit-filter: blur(100px);
          filter: blur(100px);
  -webkit-transition: opacity 0.3s var(--easing-cubic1), -webkit-filter 0.3s var(--easing-cubic1);
  transition: opacity 0.3s var(--easing-cubic1), -webkit-filter 0.3s var(--easing-cubic1);
  transition: opacity 0.3s var(--easing-cubic1), filter 0.3s var(--easing-cubic1);
  transition: opacity 0.3s var(--easing-cubic1), filter 0.3s var(--easing-cubic1), -webkit-filter 0.3s var(--easing-cubic1);
}
.overview__unit img {
  -webkit-filter: drop-shadow(20px 33px 36px #362e38);
          filter: drop-shadow(20px 33px 36px #362e38);
}
.overview__unit.is-view {
  opacity: 1;
  -webkit-filter: blur(0px);
          filter: blur(0px);
}
.overview__eva {
  z-index: 1;
  position: absolute;
  top: 160px;
  left: -22px;
  width: 46.4128843338vw;
  max-width: 634px;
  height: auto;
  opacity: 0;
  -webkit-filter: blur(100px);
          filter: blur(100px);
  -webkit-transition: opacity 0.3s var(--easing-cubic1), -webkit-filter 0.3s var(--easing-cubic1);
  transition: opacity 0.3s var(--easing-cubic1), -webkit-filter 0.3s var(--easing-cubic1);
  transition: opacity 0.3s var(--easing-cubic1), filter 0.3s var(--easing-cubic1);
  transition: opacity 0.3s var(--easing-cubic1), filter 0.3s var(--easing-cubic1), -webkit-filter 0.3s var(--easing-cubic1);
}
.overview__eva.is-view {
  opacity: 1;
  -webkit-filter: blur(0px);
          filter: blur(0px);
}
.overview__subttl1 {
  z-index: 1;
  position: absolute;
  top: 30px;
  left: 0;
  width: 36.4568081991vw;
  max-width: 498px;
}
.overview__subttl2 {
  z-index: 2;
  position: absolute;
  top: 686px;
  left: 204px;
  width: 21.2298682284vw;
  max-width: 290px;
  height: auto;
}
.overview__subttl2.is-view {
  -webkit-animation-delay: 0.2s !important;
          animation-delay: 0.2s !important;
}
.overview__img1 {
  z-index: 1;
  position: absolute;
  top: 404px;
  left: 0;
  width: 23.3528550512vw;
  max-width: 319px;
}
.overview__img2 {
  z-index: 1;
  position: absolute;
  top: 404px;
  left: 307px;
  width: 23.4260614934vw;
  max-width: 320px;
}
.overview__img3 {
  z-index: 1;
  position: absolute;
  top: 678px;
  left: 0;
  width: 30.8199121523vw;
  max-width: 421px;
}
.overview__img4 {
  z-index: 1;
  position: absolute;
  top: 662px;
  left: 448px;
  width: 27.3792093704vw;
  max-width: 374px;
}

/* --------------------------------------------------
		MARK:搭載楽曲
-------------------------------------------------- */
.music {
  z-index: 1;
  position: relative;
  background: url("../img/bg-music_pc.jpg") center top no-repeat;
  background-size: cover;
}
.music__container {
  padding-block: 80px 60px;
}
.music__lineup {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 52px;
}

/* --------------------------------------------------
		MARK:SPEC
-------------------------------------------------- */
.spec {
  z-index: 1;
  position: relative;
  min-height: 100dvh;
  background: url("../img/bg-spec_pc.jpg") center top no-repeat var(--color-black);
  background-size: cover;
}
.spec img {
  width: 100%;
  height: auto;
}
.spec__eva {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100vw;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  z-index: 0;
  position: absolute;
  bottom: 0;
  left: 50%;
          justify-content: center;
  translate: -50% 0;
  opacity: 0;
  -webkit-filter: blur(100px);
          filter: blur(100px);
  -webkit-transition: opacity 0.6s var(--easing-cubic1), -webkit-filter 0.6s var(--easing-cubic1);
  transition: opacity 0.6s var(--easing-cubic1), -webkit-filter 0.6s var(--easing-cubic1);
  transition: opacity 0.6s var(--easing-cubic1), filter 0.6s var(--easing-cubic1);
  transition: opacity 0.6s var(--easing-cubic1), filter 0.6s var(--easing-cubic1), -webkit-filter 0.6s var(--easing-cubic1);
}
.spec__eva.is-view {
  opacity: 1;
  -webkit-filter: blur(0px);
          filter: blur(0px);
}
.spec__container {
  padding-inline: 20px;
  padding-block: 24px 420px;
}
.spec__case {
  width: 16.2518301611vw;
  max-width: 222px;
  height: auto;
  margin-inline: auto;
  -webkit-margin-after: -1.1713030747vw;
  z-index: 2;
  position: relative;
          margin-block-end: -1.1713030747vw;
}
.spec__case img {
  -webkit-filter: drop-shadow(0px 0px 99px rgba(255, 255, 255, 0.7));
          filter: drop-shadow(0px 0px 99px rgba(255, 255, 255, 0.7));
}
.spec__contents {
  display: -ms-grid;
  display: grid;
      grid-template-areas: "zugara zugara" "graph notice";
  -ms-grid-columns: 1fr 75px auto;
  grid-template-columns: 1fr auto;
  -ms-grid-rows: auto 24px 1fr;
  position: relative;
  grid-template-rows: auto 1fr;
  max-width: 1132px;
  margin-inline: auto;
  padding: 50px 50px 4.6852122987vw;
  gap: 24px 75px;
}
.spec__contents::after {
  display: block;
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backdrop-filter: blur(12px);
  background-color: rgba(0, 0, 0, 0.44);
  content: "";
  pointer-events: none;
}
.spec__list {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 3;
  display: -ms-grid;
  display: grid;
  grid-area: zugara;
  -ms-grid-columns: (1fr)[3];
  z-index: 1;
  position: relative;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px 16px;
}
.spec__graph {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 1;
  position: relative;
  grid-area: graph;
  gap: 48px;
}
.spec__notice {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  grid-area: notice;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  z-index: 1;
  position: relative;
          justify-content: center;
  gap: 40px;
}

/* --------------------------------------------------
		MARK:モーダル
-------------------------------------------------- */
.modal {
  display: none;
}
.modal.is-open {
  display: block;
}
.modal__overlay {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
  z-index: 40;
  position: fixed;
  top: 0;
  left: 0;
          justify-content: center;
  width: 100%;
  height: 100dvh;
  padding: 60px 40px;
  background-color: rgba(0, 0, 0, 0.8);
  -webkit-overflow-scrolling: touch;
}
[aria-hidden=false] .modal__overlay {
  -webkit-animation: fadeIn 0.3s ease-out;
          animation: fadeIn 0.3s ease-out;
}
[aria-hidden=true] .modal__overlay {
  -webkit-animation: fadeOut 0.3s ease-out;
          animation: fadeOut 0.3s ease-out;
}
.modal__close {
  display: block;
  width: 70px;
  height: 70px;
  margin-bottom: 20px;
  margin-left: auto;
  padding: 0;
  translate: 10px 0;
  border: none;
  background: none;
  cursor: pointer;
  pointer-events: all;
  -webkit-transition: opacity 0.3s ease-out, rotate 0.3s ease-out;
  position: relative;
  transition: opacity 0.3s ease-out, rotate 0.3s ease-out;
}
.modal__close::before, .modal__close::after {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 2px;
  translate: -50% -50%;
  border-radius: 10px;
  background-color: var(--color-white);
  content: "";
}
.modal__close::before {
  rotate: 45deg;
}
.modal__close::after {
  rotate: -45deg;
}
.modal__container {
  width: 100%;
  max-width: 840px;
  margin-right: auto;
  margin-left: auto;
  translate: 0 -70px;
}
.modal__embed {
  position: relative;
}
.modal__embed--inner {
  width: 100%;
  height: 100%;
}
.modal__frame {
  aspect-ratio: 16/9;
  width: 100%;
  height: 100%;
}

/* --------------------------------------------------
		MARK:コンテンツ表示アニメーション
-------------------------------------------------- */
[data-contsup] {
  opacity: 0;
}
[data-contsup].is-view {
  -webkit-animation: slideUp 0.6s var(--easing-cubic1) forwards;
          animation: slideUp 0.6s var(--easing-cubic1) forwards;
}

[data-fadein] {
  opacity: 0;
}
[data-fadein].is-view {
  -webkit-animation: fadeIn 0.6s var(--easing-cubic1) forwards;
          animation: fadeIn 0.6s var(--easing-cubic1) forwards;
}

[data-slideup] {
  opacity: 0;
}
[data-slideup].is-view {
  -webkit-animation: slideUp 0.6s var(--easing-cubic1) forwards;
          animation: slideUp 0.6s var(--easing-cubic1) forwards;
}

[data-slidedown] {
  opacity: 0;
}
[data-slidedown].is-view {
  -webkit-animation: slideDown 0.6s var(--easing-cubic1) forwards;
          animation: slideDown 0.6s var(--easing-cubic1) forwards;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@-webkit-keyframes slideUp {
  from {
    opacity: 0;
    -webkit-transform: translateY(30px);
            transform: translateY(30px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes slideUp {
  from {
    opacity: 0;
    -webkit-transform: translateY(30px);
            transform: translateY(30px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes slideDown {
  from {
    opacity: 0;
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes slideDown {
  from {
    opacity: 0;
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@media screen and (max-width: 13660px){
  .spec__contents {
    gap: 24px 5.4904831625vw;
  }
  .spec__graph {
    gap: 3.513909224vw;
  }
  .spec__notice {
    gap: 2.9282576867vw;
  }
}
@media screen and (max-width: 1366px){
  .overview {
    height: 86.383601757vw;
  }
  .overview__unit {
    left: 49.9267935578vw;
  }
  .overview__eva {
    top: 11.7130307467vw;
    left: -16px;
  }
  .overview__subttl1 {
    top: 2.196193265vw;
  }
  .overview__subttl2 {
    top: 50.2196193265vw;
    left: 14.934114202vw;
  }
  .overview__img1 {
    top: 29.5754026354vw;
  }
  .overview__img2 {
    top: 29.5754026354vw;
    left: 22.4743777452vw;
  }
  .overview__img3 {
    top: 49.6339677892vw;
  }
  .overview__img4 {
    top: 48.4626647145vw;
    left: 32.7964860908vw;
  }
}
@media screen and (max-width: 1220px){
  .staging__ttl {
    top: 12.5915080527vw;
  }
  .staging__img1 {
    top: 13.8360175695vw;
  }
  .staging__img2 {
    top: 16.0322108346vw;
  }
  .staging__img3 {
    top: 38.9458272328vw;
  }
  .staging__img4 {
    top: 38.7262079063vw;
  }
  .staging__mode--subttl2 {
    top: -1.1713030747vw;
  }
}
@media screen and (max-width: 977px){
  .complete-limit {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    text-align: center;
  }
  .complete-limit__text {
    font-size: clamp(20px, 2.4564994882vw, 28px);
    letter-spacing: calc(0 / 1000 * 1em);
  }
  .l-footer .complete-limit__text {
    font-size: clamp(20px, 2.4564994882vw, 28px);
  }
  [lang=ko] .complete-limit__text, [lang=zh-Hans] .complete-limit__text, [lang=zh-Hant-TW] .complete-limit__text, [lang=en] .complete-limit__text {
    letter-spacing: calc(0 / 1000 * 1em);
  }
  .movie__bg {
    background-image: url("../img/bg-point1_sp.png"), url("../img/bg-point2_sp.png");
    background-position: top right, left bottom;
    background-size: 375px 194px, 375px 306px;
  }
  .movie__container {
    padding-block: 80px;
    gap: 42px;
  }
  .movie__contents {
    max-width: 680px;
    margin-inline: auto;
  }
  .movie__contents--inner {
    gap: 114px;
  }
  .movie__subttl {
    font-size: calc(44 / 10 * 1rem);
  }
  .movie__subttl .is-en {
    margin-left: 0;
    font-size: calc(48 / 10 * 1rem);
    letter-spacing: calc(50 / 1000 * 1em);
  }
  .movie__block {
    padding: 4px 22px 22px;
  }
  .movie__block--ttl {
    max-width: 240px;
    padding-top: 22px;
  }
  .movie__block--ttl::after {
    clip-path: polygon(0 0, calc(100% - 32px) 0, 100% 100%, 0% 100%);
  }
  .movie__block--ttl .is-mainlabel {
    font-size: calc(24 / 10 * 1rem);
  }
  .movie__block--inner {
    gap: 8px;
  }
  .movie__block--text {
    font-size: calc(15 / 10 * 1rem);
    line-height: 2;
  }
  .concept::after {
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 90.6666666667vw;
    height: 62.4vw;
    background: url("../img/bg-concept2_sp.png") no-repeat;
    background-size: contain;
    content: "";
  }
  .concept__img {
    position: absolute;
    top: 0;
    height: auto;
    margin-bottom: calc(-100vh + 63px);
  }
  .concept__contents {
    padding-block: 109.3333333333vw 160px;
  }
  .concept__block {
    max-width: calc(100% - 11.7333333333vw);
    padding: 32px 20px 32px 26px;
  }
  .concept__block:nth-of-type(even) {
    margin-right: auto;
    margin-left: 0;
  }
  .concept__text {
    font-size: calc(14 / 10 * 1rem);
    line-height: 2.1428571429;
  }
  .point__bg {
    background-image: url("../img/bg-point1_sp.png"), url("../img/bg-point2_sp.png");
    background-position: top right, left bottom;
    background-size: 375px 194px, 375px 306px;
  }
  .point__container {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    padding-block: 32px 56px;
    gap: 42px;
  }
  .point__case {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    max-width: 100%;
  }
  .point__case img {
    position: static;
  }
  .point__contents {
    max-width: 680px;
    margin-inline: auto;
  }
  .point__contents--inner {
    gap: 114px;
  }
  .point__subttl {
    font-size: calc(48 / 10 * 1rem);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .point__subttl .is-sublabel {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
    font-size: calc(34 / 10 * 1rem);
  }
  .point__subttl .is-sublabel::after {
    display: none;
  }
  .point__subttl .is-mainlabel {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
  }
  .point__block {
    padding: 24px 22px 22px;
  }
  .point__block.is-climax {
    padding-top: 58px;
  }
  .point__block--ttl {
    max-width: 240px;
    padding-top: 14px;
    padding-left: 22px;
  }
  .is-climax .point__block--ttl {
    padding-top: 14px;
  }
  .is-impact .point__block--ttl {
    padding-top: 28px;
  }
  .point__block--ttl::after {
    clip-path: polygon(0 0, calc(100% - 32px) 0, 100% 100%, 0% 100%);
  }
  .point__block--ttl .is-mainlabel {
    font-size: calc(24 / 10 * 1rem);
    line-height: 1.4583333333;
  }
  .point__block--text {
    font-size: calc(15 / 10 * 1rem);
    line-height: 2;
  }
  .machine__list {
    max-width: 576px;
    margin-inline: auto;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .flow {
    background: url("../img/bg-flow_sp.jpg") center top no-repeat;
    background-size: cover;
  }
  .flow__container {
    padding-block: 20px 40px;
  }
  .is-fan .flow__container {
    padding-inline: 0;
    padding-block: 20px 0;
  }
  .flow__title {
    -webkit-margin-after: 12px;
            margin-block-end: 12px;
  }
  .staging__bg {
    aspect-ratio: 375/502;
    background: url("../img/bg-staging_sp.jpg") center top no-repeat;
    background-size: contain;
  }
  .staging__container {
    display: -ms-grid;
    display: grid;
    -ms-grid-rows: auto 10px auto 10px auto 10px auto;
        grid-template-areas: "img1" "img2" "img3" "img4";
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    padding-inline: 10px;
    gap: 10px;
    -webkit-margin-before: -12.8vw;
            margin-block-start: -12.8vw;
  }
  .staging__ttl {
    top: 21.3333333333vw;
    width: 76.5333333333vw;
  }
  .staging__img1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    grid-area: img1;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
    position: static;
            justify-content: center;
    width: 100%;
  }
  .staging__img2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    grid-area: img3;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
    position: static;
            justify-content: center;
    width: 100%;
  }
  .staging__img3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    grid-area: img2;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
    position: static;
            justify-content: center;
    width: 100%;
  }
  .staging__img4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    grid-area: img4;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
    position: static;
            justify-content: center;
    width: 100%;
  }
  .staging__img1 {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .staging__img2 {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
  }
  .staging__img3 {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .staging__img4 {
    -ms-grid-row: 7;
    -ms-grid-column: 1;
  }
  .staging__mode {
    aspect-ratio: 375/495;
    background: url("../img/bg-mode_sp.jpg") center top no-repeat;
    background-size: contain;
  }
  .staging__mode--ttl {
    top: 3.2vw;
    width: 97.8666666667vw;
  }
  .staging__mode--logo {
    top: 43.7333333333vw;
    width: 30.6666666667vw;
  }
  .staging__mode--subttl1 {
    top: 17.6vw;
    width: 19.4666666667vw;
  }
  .staging__mode--img1 {
    top: 74.6666666667vw;
    left: 5.3333333333vw;
    width: 43.4666666667vw;
  }
  .staging__mode--subttl2 {
    top: 18.1333333333vw;
    width: 18.6666666667vw;
  }
  .staging__mode--img2 {
    top: 74.6666666667vw;
    right: 5.3333333333vw;
    width: 43.4666666667vw;
  }
  .staging__mode--notice {
    top: 112vw;
    right: 5.3333333333vw;
    width: 89.0666666667vw;
  }
  .direction__bg {
    background: url("../img/bg-direction1_sp.jpg") left top no-repeat;
    background-size: 100% auto;
  }
  .direction__title {
    -webkit-padding-after: 56px;
            padding-block-end: 56px;
  }
  .direction__featured {
    padding: 16px 20px 24px;
  }
  .direction__featured--img {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .direction__normalreach {
    padding: 40px 20px 32px;
  }
  .direction__normalreach .direction__title {
    -webkit-margin-after: 20px;
            margin-block-end: 20px;
  }
  .direction__normalreach--block {
    gap: 16px;
  }
  .direction__normalreach--block.is-1st {
    -webkit-margin-before: 20px !important;
            margin-block-start: 20px !important;
  }
  .direction__normalreach--block + .direction__normalreach--block {
    -webkit-margin-before: 20px;
            margin-block-start: 20px;
  }
  .direction__normalreach--text.is-fixed {
    position: absolute;
    top: -62px;
    left: calc(50% - 182px);
  }
  .direction__normalreach--text.is-fixed img {
    width: 402px;
    max-width: none;
    height: auto;
  }
  [lang=en] .direction__normalreach--text.is-fixed {
    position: static;
  }
  [lang=en] .direction__normalreach--text.is-fixed img {
    width: auto;
    max-width: 100%;
  }
  [lang=ko] .direction__normalreach--text.is-fixed {
    position: static;
  }
  [lang=ko] .direction__normalreach--text.is-fixed img {
    width: auto;
    max-width: 260px;
  }
  [lang=zh-Hans] .direction__normalreach--text.is-fixed {
    position: static;
  }
  [lang=zh-Hans] .direction__normalreach--text.is-fixed img {
    width: auto;
    max-width: 218px;
  }
  [lang=zh-Hant-TW] .direction__normalreach--text.is-fixed {
    position: static;
  }
  [lang=zh-Hant-TW] .direction__normalreach--text.is-fixed img {
    width: auto;
    max-width: 236px;
  }
  [lang=en] .direction__normalreach--img.is-story picture {
    display: block;
  }
  [lang=en] .direction__normalreach--img.is-story picture:nth-of-type(1) {
    -webkit-margin-start: 0;
            margin-inline-start: 0;
  }
  [lang=en] .direction__normalreach--img.is-story picture:nth-of-type(2) {
    -webkit-margin-start: 0;
            margin-inline-start: 0;
  }
  [lang=zh-Hans] .direction__normalreach--img.is-story picture {
    display: block;
  }
  [lang=zh-Hans] .direction__normalreach--img.is-story picture:nth-of-type(1) {
    -webkit-margin-start: 0;
            margin-inline-start: 0;
  }
  [lang=zh-Hant-TW] .direction__normalreach--img.is-story picture {
    display: block;
  }
  [lang=zh-Hant-TW] .direction__normalreach--img.is-story picture:nth-of-type(1) {
    -webkit-margin-start: 0;
            margin-inline-start: 0;
  }
  [lang=zh-Hant-TW] .direction__normalreach--img.is-story picture:nth-of-type(2) {
    -webkit-margin-end: 0;
            margin-inline-end: 0;
  }
  .direction__normalreach--img {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 16px;
  }
  .direction__normalreach--img.is-evareach picture {
    display: block;
    -webkit-margin-after: -20px;
            margin-block-end: -20px;
  }
  .direction__normalreach--img.is-story picture {
    display: block;
    -webkit-margin-after: -24px;
            margin-block-end: -24px;
  }
  .direction__normalreach--img.is-story picture:last-of-type {
    -webkit-margin-after: -5px;
            margin-block-end: -5px;
  }
  .direction__normalreach--img.is-fixed {
    -webkit-padding-before: 56px;
            padding-block-start: 56px;
  }
  [lang=ko] .direction__normalreach--img.is-fixed, [lang=zh-Hans] .direction__normalreach--img.is-fixed, [lang=zh-Hant-TW] .direction__normalreach--img.is-fixed, [lang=en] .direction__normalreach--img.is-fixed {
    -webkit-padding-before: 0;
            padding-block-start: 0;
  }
  .direction__normalreach--img2 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0;
  }
  .direction__normalreach--img2 picture:first-of-type {
    display: block;
    -webkit-margin-after: -10px;
            margin-block-end: -10px;
  }
  .direction__normalreach--img2.is-fixed {
    -webkit-padding-before: 56px;
            padding-block-start: 56px;
  }
  .direction__st {
    padding: 96px 2px 0;
  }
  .direction__st .direction__title {
    -webkit-padding-after: 32px;
            padding-block-end: 32px;
  }
  .direction__st::before {
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    width: 214px;
    height: 264px;
    translate: 0 -66%;
    background: url("../img/img-directioneva1_sp.png") center top repeat-y;
    background-size: contain;
    content: "";
  }
  .direction__st::after {
    background: url("../img/bg-direction2_sp.jpg") top center repeat-y;
    background-size: 100% auto;
  }
  .direction__st--block + .direction__st--block {
    -webkit-margin-before: 40px;
            margin-block-start: 40px;
  }
  .direction__impactmode {
    padding: 0;
    -webkit-margin-before: 56px;
            margin-block-start: 56px;
  }
  .direction__impactmode::before {
    display: block;
    height: 100vh;
    -webkit-margin-after: -100vh;
    position: sticky;
            margin-block-end: -100vh;
    background: url("../img/bg-direction3_sp.jpg") center top no-repeat;
    background-size: cover;
  }
  .direction__impactmode--text {
    padding: 40px 0 0;
  }
  .direction__impactmode--hgroup {
    gap: 0;
    -webkit-margin-before: 16px;
            margin-block-start: 16px;
  }
  .direction__impactmode--sublabel {
    -webkit-margin-before: -10px;
            margin-block-start: -10px;
  }
  [lang=ko] .direction__impactmode--sublabel {
    -webkit-margin-before: 0;
            margin-block-start: 0;
  }
  .direction__impactmode--img {
    gap: 12px;
  }
  .direction__impactmode--img2 {
    gap: 5px;
  }
  [lang=ko] .direction__impactmode--img2, [lang=zh-Hans] .direction__impactmode--img2, [lang=zh-Hant-TW] .direction__impactmode--img2, [lang=en] .direction__impactmode--img2 {
    gap: 40px;
  }
  .direction__impactmode--img3 {
    gap: 0px;
    -webkit-margin-before: -16px;
            margin-block-start: -16px;
  }
  .direction__impactmode--img3 picture:last-of-type {
    -webkit-margin-before: -16px;
            margin-block-start: -16px;
  }
  [lang=ko] .direction__impactmode--img3, [lang=zh-Hans] .direction__impactmode--img3, [lang=zh-Hant-TW] .direction__impactmode--img3, [lang=en] .direction__impactmode--img3 {
    -webkit-margin-before: 20px;
            margin-block-start: 20px;
  }
  [lang=ko] .direction__impactmode--img3 picture:last-of-type, [lang=zh-Hans] .direction__impactmode--img3 picture:last-of-type, [lang=zh-Hant-TW] .direction__impactmode--img3 picture:last-of-type, [lang=en] .direction__impactmode--img3 picture:last-of-type {
    -webkit-margin-before: 20px;
            margin-block-start: 20px;
  }
  .direction__impactmode--img4 {
    gap: 5px;
    -webkit-margin-before: 4px;
            margin-block-start: 4px;
  }
  .direction__runaway {
    padding: 34px 20px 64px;
    -webkit-margin-before: 64px;
            margin-block-start: 64px;
  }
  [lang=ko] .direction__runaway, [lang=zh-Hans] .direction__runaway, [lang=zh-Hant-TW] .direction__runaway {
    -webkit-padding-before: 40px;
            padding-block-start: 40px;
  }
  .direction__runaway::before {
    background: url("../img/bg-direction4_sp.jpg") center no-repeat;
    background-size: cover;
  }
  .direction__runaway--img {
    -webkit-margin-before: 16px;
            margin-block-start: 16px;
  }
  .direction__runaway--img + .direction__runaway--img {
    -webkit-margin-before: 34px;
            margin-block-start: 34px;
  }
  .direction__runaway--img2 {
    -webkit-margin-before: 16px;
            margin-block-start: 16px;
  }
  .direction__runaway--img2 + .direction__runaway--img2 {
    -webkit-margin-before: 34px;
            margin-block-start: 34px;
  }
  .direction__runaway--img3 {
    -webkit-margin-before: 16px;
            margin-block-start: 16px;
  }
  .direction__runaway--img3 + .direction__runaway--img3 {
    -webkit-margin-before: 34px;
            margin-block-start: 34px;
  }
  .direction__special {
    padding: 54px 20px 16px;
    -webkit-margin-before: 64px;
            margin-block-start: 64px;
  }
  .direction__special::before {
    background: url("../img/bg-direction5_sp.jpg") center no-repeat;
    background-size: cover;
  }
  .direction__special--img {
    -webkit-margin-before: 10px;
            margin-block-start: 10px;
  }
  .direction__normalcustom {
    padding: 56px 0 16px;
  }
  .direction__normalcustom::before {
    background: url("../img/bg-direction6_sp.jpg") top center repeat-y;
    background-size: contain;
  }
  .overview {
    height: 386.1333333333vw;
    background: url("../img/bg-overview_sp.jpg") center no-repeat;
    background-size: cover;
  }
  .overview__container {
    padding: 20px 20px 48px;
  }
  .overview__unit {
    position: static;
    width: 85.8666666667vw;
    margin-inline: auto;
  }
  .overview__eva {
    top: 74.6666666667vw;
    left: -4.8vw;
    width: 99.2vw;
    max-width: 100%;
  }
  .overview__subttl1 {
    top: 147.2vw;
    width: 83.2vw;
    max-width: 100%;
  }
  .overview__subttl2 {
    top: 238.4vw;
    left: 0.2666666667vw;
    width: 61.3333333333vw;
    max-width: 100%;
  }
  .overview__img1 {
    top: 171.7333333333vw;
    left: -2.6666666667vw;
    width: 48.2666666667vw;
    max-width: 100%;
  }
  .overview__img2 {
    top: 197.8666666667vw;
    left: 28.8vw;
    width: 65.3333333333vw;
    max-width: 100%;
  }
  .overview__img3 {
    top: 253.8666666667vw;
    left: -2.6666666667vw;
    width: 96.8vw;
    max-width: 100%;
  }
  .overview__img4 {
    top: 296vw;
    left: 28.5333333333vw;
    width: 65.6vw;
    max-width: 100%;
  }
  .music {
    background: url("../img/bg-music_sp.jpg") center top no-repeat;
    background-size: cover;
  }
  .music__container {
    padding-block: 60px 40px;
  }
  .music__lineup {
    gap: 18px;
  }
  .spec {
    background: url("../img/bg-spec_sp.jpg") center top no-repeat var(--color-black);
    background-size: cover;
  }
  .spec__container {
    padding-block: 4px 50.6666666667vw;
  }
  .spec__case {
    width: 37.3333333333vw;
    -webkit-margin-after: -33.0666666667vw;
            margin-block-end: -33.0666666667vw;
  }
  .spec__contents {
        grid-template-areas: "zugara" "graph" "notice";
    gap: 40px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: auto 40px 1fr;
    grid-template-rows: auto 1fr;
    padding: 38.4vw 10px 15.4666666667vw;
  }
  .spec__list {
    -ms-grid-rows: auto 12px auto 12px auto;
        grid-template-areas: "spec1 spec4" "spec2 spec3" "spec5 spec6";
    -ms-grid-columns: 1fr 6px 1fr;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px 6px;
  }
  .spec__list .is-spec1 {
    grid-area: spec1;
  }
  .spec__list .is-spec2 {
    grid-area: spec2;
  }
  .spec__list .is-spec3 {
    grid-area: spec3;
  }
  .spec__list .is-spec4 {
    grid-area: spec4;
  }
  .spec__list .is-spec5 {
    grid-area: spec5;
  }
  .spec__list .is-spec6 {
    grid-area: spec6;
  }
  .spec__list .is-spec1 {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .spec__list .is-spec2 {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .spec__list .is-spec3 {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
  .spec__list .is-spec4 {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .spec__list .is-spec5 {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
  }
  .spec__list .is-spec6 {
    -ms-grid-row: 5;
    -ms-grid-column: 3;
  }
  .spec__graph {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding-inline: 8px;
    gap: 24px;
  }
  .spec__graph--img1 {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
  }
  .spec__graph--img2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
  }
  .spec__list {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
  }
  .spec__graph {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .spec__notice {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
  }
  .spec__notice {
    padding-inline: 10px;
    gap: 8.5333333333vw;
  }
  .spec__notice--img1 {
    width: 56.5333333333vw;
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
  }
  .spec__notice--img2 {
    width: 73.3333333333vw;
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
  }
}
@media screen and (max-width: 767px){
  .complete-limit {
    min-height: 60px;
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .l-footer .complete-limit {
    padding-top: 20px;
    padding-bottom: 8px;
  }
  .c-title {
    top: 63px;
    background: url("../img/bg-section-ttl_sp.svg") left top repeat-x;
  }
  .separate {
    height: 240px;
  }
  .movie__bg {
    top: 63px;
    height: calc(100vh - 63px);
    margin-bottom: calc(-100vh + 62px);
  }
  .movie__container {
    -webkit-padding-before: 28px;
            padding-block-start: 28px;
  }
  .point__bg {
    top: 63px;
    height: calc(100vh - 63px);
    margin-bottom: calc(-100vh + 62px);
  }
  .staging__bg {
    margin-top: -63px;
  }
}
@media screen and (max-width: 576px){
  .direction .is-ttlbg {
    translate: 0 56%;
  }
  .direction .is-ttlbg.is-normal {
    translate: 0 90%;
  }
  [lang=en] .direction .is-ttlbg.is-normal {
    translate: 0 160%;
  }
  .direction .is-ttlbg.is-st {
    translate: 0 170%;
  }
  .direction .is-ttlbg.is-normalcustom {
    translate: 0 120%;
  }
  .direction__title {
    -webkit-padding-after: 32px;
            padding-block-end: 32px;
    background-size: 116vw auto;
  }
  .modal__overlay {
    padding: 40px 20px;
  }
  .modal__close {
    width: 50px;
    height: 50px;
    margin-bottom: 10px;
  }
  .modal__container {
    translate: 0 -50px;
  }
}
@media screen and (max-width: 375px){
  .direction .is-ttlbg {
    translate: 0 60%;
  }
  [lang=ko] .direction .is-ttlbg, [lang=zh-Hans] .direction .is-ttlbg, [lang=zh-Hant-TW] .direction .is-ttlbg, [lang=en] .direction .is-ttlbg {
    translate: 0 80%;
  }
  .direction .is-ttlbg.is-normal {
    translate: 0 100%;
  }
  [lang=en] .direction .is-ttlbg.is-normal {
    translate: 0 200%;
  }
  [lang=ko] .direction .is-ttlbg.is-normal {
    translate: 0 120%;
  }
  [lang=zh-Hans] .direction .is-ttlbg.is-normal {
    translate: 0 160%;
  }
  [lang=zh-Hant-TW] .direction .is-ttlbg.is-normal {
    translate: 0 160%;
  }
  .direction .is-ttlbg.is-st {
    translate: 0 200%;
  }
  .direction .is-ttlbg.is-normalcustom {
    translate: 0 140%;
  }
  [lang=en] .direction .is-ttlbg.is-normalcustom {
    translate: 0 190%;
  }
  [lang=zh-Hans] .direction .is-ttlbg.is-normalcustom, [lang=zh-Hant-TW] .direction .is-ttlbg.is-normalcustom, [lang=ko] .direction .is-ttlbg.is-normalcustom {
    translate: 0 170%;
  }
}
@media screen and (max-width: 360px){
  .complete-limit {
    padding-right: 10px;
    padding-left: 10px;
  }
  .movie__container {
    -webkit-padding-after: 64px;
    padding-inline: 10px;
            padding-block-end: 64px;
  }
  .concept__block {
    max-width: calc(100% - 6.6666666667vw);
  }
  .point__container {
    padding-inline: 10px;
    padding-block: 32px 56px;
  }
  .flow__container {
    padding-inline: 10px;
  }
  .is-fan .flow__container {
    padding-inline: 0;
  }
  [lang=en] .direction .is-ttlbg.is-normal {
    translate: 0 230%;
  }
  .direction__featured {
    padding-inline: 10px;
  }
  .direction__normalreach {
    padding-inline: 10px;
  }
  .direction__st {
    padding-inline: 2px;
  }
  .direction__impactmode {
    padding-inline: 0;
  }
  .direction__runaway {
    margin-inline: -10px;
    padding-inline: 10px;
  }
  .direction__special {
    margin-inline: -10px;
    padding-inline: 10px;
  }
  .overview__container {
    padding-inline: 10px;
  }
  .overview__eva {
    left: -2.6666666667vw;
  }
  .spec__container {
    padding-inline: 10px;
  }
}
@media (any-hover: hover){
  .modal__close:hover {
    opacity: 0.5;
  }
}
/*# sourceMappingURL=style.css.map */