/* PC用 */
@charset "UTF-8";

.for-pc {
  display: block;
}
.for-sp {
  display: none;
}

/* ---------- */

/* --- メニュー --- */
#frame-menu {
}
.menu {
}
.menu-point {
  --width-menu-point: 119;
}
.menu-format {
  --width-menu-format: 149;
}
.menu-tokyo {
  --width-menu-tokyo: 163;
}
.menu-osaka {
  --width-menu-osaka: 163;
}
.menu-fee {
  --width-menu-fee: 115;
}
.menu-goods {
  --width-menu-goods: 118;
}
.menu-map {
  --width-menu-map: 119;
}
.menu-about {
  --width-menu-about: 119;
}
.menu-faq {
  --width-menu-faq: 167;
}

/* --- キービジュアル --- */
#frame-kv {
}
.kv {
}

/* --- キャッチ --- */
#frame-catch {
}
.catch {
  margin-top: 220px;
}
.button-ticket {
  width: calc(var(--width-button-ticket) * 1px);
}

#button-ticket-1 {
  top: 8%;
}

/* --- カルーセル --- */
#frame-scenes {
  --width-frame-scenes: 1200;
  --height-frame-scenes: 290;
  width: calc(var(--width-frame-scenes) * 1px);
  height: calc(var(--height-frame-scenes) * 1px);

  margin: 30px auto 0;

border: solid white 0px;
}
.slider-scenes {
  --width-slider-scenes: 1200;
  --height-slider-scenes: 290;

  width: calc(var(--width-slider-scenes) * 1px); 
  height: calc(var(--height-slider-scenes) * 1px); 

}
.scene {
  --width-scene: 399;

  width: calc(var(--width-scene) * 1px);

}

/* --- ストーリー --- */
#frame-story {
  --height-frame-story: 1300;

  height: calc(var(--height-frame-story) * 1px);
border: solid red 0px;
}
.story {
}
.text-story {
  --width-text-story: 1100;

  width: calc(var(--width-text-story) * 1px);

  font-size: 28px;
  line-height: 150%;
border: solid white 0px;
}
.illust-story {
}

/* --- 動画 --- */
#frame-movie {
}
.movie-title {
}
.movie {
  --width-movie: 1200;

  width: calc(var(--width-movie) * 1px);
}

/* --- ポイント --- */
#frame-point {
}
.point {

}

/* --- リピーター --- */
#frame-repeater {
}
.repeater {
}
.text-repeater {
}
.text-repeater-1 {
 --width-text-repeater-1: 1100;

  width: calc(var(--width-text-repeater-1) * 1px);
  line-height: 150%;

  top: 43%;
}
.text-repeater-1 .large {
  font-size: 36px;
}
.text-repeater-1 .medium {
  font-size: 30px;
}
.text-repeater-1 .small {
  font-size: 22px;
}
.text-repeater-2 {
  --offset-text-repeater-2: (-50);

  left: calc(50% + var(--offset-text-repeater-2) * 1px);
  font-size: 30px;
}
.text-repeater-3 {
  --width-text-repeater-3: 900;
  --offset-text-repeater-3: (-420);

  width: calc(var(--width-text-repeater-3) * 1px);
  left: calc(50% + var(--offset-text-repeater-3) * 1px);
  font-size: 22px;
}

.text-repeater-4 {
  --width-text-repeater-4: 890;
  --offset-text-repeater-4: 330;

  width: calc(var(--width-text-repeater-4) * 1px);
  left: calc(50% - var(--offset-text-repeater-4) * 1px);
  bottom: 4%;
  line-height: 150%;
  font-size: 28px;
}
.text-repeater-4 .caution {
}
#button-repeater {
  --offset-button-repeater: (-50);

  margin: 0 auto;
  left: 0;
  right:0;
  width: calc(var(--width-button-repeater) * 1px);
}

/* --- プレイタイプ --- */
#frame-format {
}
.format {
}

/* --- 参加方法 --- */
#frame-howto {
}
.howto {
}

/* --- スケジュール(東京) --- */
#frame-tokyo {
}
.schedule-tokyo {
}
.text-tokyo {
  top: 7%;
}
/* --- スケジュール(大阪) --- */
#frame-osaka {
}
.schedule-osaka {
}
.text-osaka {
  top: 23%;
}
/* --- スケジュール(共通) --- */
.text-schedule {
  --width-text-schedule: 1100;

  width: calc(var(--width-text-schedule) * 1px);

  line-height: 150%;
border: solid white 0px;
}
.text-schedule .large {
  font-size: 36px;
}
.text-schedule .medium {
  font-size: 30px;
}
.text-schedule .small {
  font-size: 22px;
}

/* --- チケット(料金) --- */
#frame-fee {
  --height-frame-fee: 900;

  height: calc(var(--height-frame-fee) * 1px);
border: solid white 0px;
}
.fee {
}
.text-fee {
  --width-text-fee: 650;

  top: 47%;
  width: calc(var(--width-text-fee) * 1px);

  font-size: 20px;

border: solid white 0px;
}
.notice {
  padding-left: 30px;
  text-indent: -30px;
}
.text-start {
  --width-text-start: 1100;

  bottom: 27%;
  width: calc(var(--width-text-start) * 1px);

  font-size: 42px;

border: solid white 0px;
}
#button-ticket-tokyo {
  --offset-button-ticket-tokyo: 50;

  right: calc(50% + var(--offset-button-ticket-tokyo) * 1px);
  bottom: 8%;
}
#button-ticket-osaka {
  --offset-button-ticket-osaka: 50;

  left: calc(50% + var(--offset-button-ticket-osaka) * 1px);
  bottom: 8%;
}

/* --- グッズ --- */
#frame-goods {
}
.goods{
}

/* --- マップ --- */
#frame-map {
  --height-frame-map: 1300;

  height: calc(var(--height-frame-map) * 1px);

border: solid white 0px;
}
.map {
}
.embed-map {
  --width-embed-map: 425;
  --height-embed-map: 460;

  width: calc(var(--width-embed-map) * 1px);
  height: calc(var(--height-embed-map) * 1px);
}
.embed-map-tokyo {
  --offset-embed-map-tokyo: 60;

  position: absolute;
  top: 15%;
  right: calc(50% + var(--offset-embed-map-tokyo) * 1px);
}
.embed-map-osaka {
  --offset-embed-map-osaka: 60;

  position: absolute;
  top: 55%;
  right: calc(50% + var(--offset-embed-map-osaka) * 1px);
}
iframe-map {
}
.text-map {
  --width-text-map: 550;

  width: calc(var(--width-text-map) * 1px);
  font-size: 20px;
border: solid white 0px;
}
.text-map-tokyo {
  top: 15%;
  left: 50%;
}
.text-map-osaka {
  top: 55%;
  left: 50%;
}
.text-map .large {
  font-size: 32px;
}
.text-map .medium {
  font-size: 28px;
}

/* --- アバウト --- */
#frame-about {
  --height-frame-about: 1500;

  height: calc(var(--height-frame-about) * 1px);
border: solid white 0px;
}
.about {
}
.section-about-1 {
  --width-section-about-1: 1100;

  width: calc(var(--width-section-about-1) * 1px);

}
.about-1 {
  --width-about-1: 181;
  width: calc(var(--width-about-1) * 1px);
}
.text-about-1 {
  --width-text-about-1: 1100;
  width: calc(var(--width-text-about-1) * 1px);

  font-size: 24px;
}
.text-about-1 .large {
  font-size: 32px;
}
.section-about-3 {
  --width-section-about-3: 1100;

  display: flex;
  align-items: center;
  width: calc(var(--width-section-about-3) * 1px);

  margin: 15px auto;
}
.about-3 {
  --width-about-3: 360;
  width: calc(var(--width-about-3) * 1px);
}
.text-about-3 {
  --width-text-about-3: 1000;
  width: calc(var(--width-text-about-3) * 1px);

  font-size: 24px;
}
.text-about-3 .large {
  font-size: 32px;
  font-weight: bold;
}
.illust-about {
}


/* --- よくある質問 --- */
#frame-faq {
  --height-frame-faq: 2600;
  height: calc(var(--height-frame-faq) * 1px);

border: solid yellow 0px;
}
.faq-title {
}
.text-faq {
  --width-text-faq: 1050;
  --height-text-faq: 2500;

  top: 6%;
  width: calc(var(--width-text-faq) * 1px);
  height: calc(var(--height-text-faq) * 1px);
  font-size: 24px;
/*  overflow-y: scroll; */

border: solid white 0px;
}
.item {
  margin-left: calc(var(--ml-item) * 1px);

}
.item .question {
  margin-top: calc(var(--mt-question) * 1px);
}
.item .answer {
  margin-top: calc(var(--mt-answer) * 1px);
}


/* --ｰ フッタ --- */
#frame-footer {
  --height-footer: 250;

  height: calc(var(--height-footer) * 1px);
border: solid white 0px;

}
.footer {
}
.logo {
  --width-logo: 215;
  width: calc(var(--width-logo) * 1px);

  bottom: 11%;
}
.text-copyright {
  font-size: 24px;
}


/* 1201px未満 */
@media screen and (max-width: 1200px) {
  #frame-menu {
  }
  .menu {
  }
  .menu-item {
  }
  .menu-point {
    width: calc(var(--width-menu-point) / 1200 * 100vw);
  }
  .menu-format {
    width: calc(var(--width-menu-format) / 1200 * 100vw);
  }
  .menu-tokyo {
    width: calc(var(--width-menu-tokyo) / 1200 * 100vw);
  }
  .menu-osaka {
    width: calc(var(--width-menu-osaka) / 1200 * 100vw);
  }
  .menu-fee {
    width: calc(var(--width-menu-fee) / 1200 * 100vw);
  }
  .menu-goods {
    width: calc(var(--width-menu-goods) / 1200 * 100vw);
  }
  .menu-map {
    width: calc(var(--width-menu-map) / 1200 * 100vw);
  }
  .menu-about {
    width: calc(var(--width-menu-about) / 1200 * 100vw);
  }
  .menu-faq {
    width: calc(var(--width-menu-faq) / 1200 * 100vw);
  }
  #frame-kv {
  }
  .kv {
    width: 100vw;
  }
  #frame-catch {
  }
  .catch {
    width: 100vw;
  }
  .button-ticket {
    width: calc(var(--width-button-ticket) / 1200 * 100vw);
  }
  #button-ticket-1 {
  }
  #frame-scenes {
    width: calc(var(--width-frame-scenes) / 1200 * 100vw);
    height: calc(var(--height-frame-scenes) / 1200 * 100vw);
  }
  .slider-scenes {
    width: calc(var(--width-slider-scenes) / 1200 * 100vw); 
    height: calc(var(--height-slider-scenes) / 1200 * 100vw); 
  }
  .scene {
    width: calc(var(--width-scene) / 1200 * 100vw);
  }
  #frame-story {
    height: calc(var(--height-frame-story) / 1200 * 100vw);
  }
  .story {
    width: 100vw;
  }
  .text-story {
    width: calc(var(--width-text-story) / 1200 * 100vw);
  }
  .illust-story {
  }
  #frame-movie {
  }
  .movie-title {
    width: 100vw;
  }
  .movie {
    width: calc(var(--width-movie) / 1200 * 100vw);
  }
  #frame-point {
  }
  .point {
    width: 100vw;
  }
  #frame-repeater {
  }
  .repeater {
    width: 100vw;
  }
  .text-repeater {
  }
  .text-repeater-1 {
    width: calc(var(--width-text-repeater-1) / 1200 * 100vw);
    line-height: 2vw;
  }
  .text-repeater-1 .large {
  }
  .text-repeater-1 .medium {
  }
  .text-repeater-1 .small {
  }
  .text-repeater-2 {
    left: calc(50% + var(--offset-text-repeater-2) / 1200 * 100vw);
    font-size: 2.5vw;
  }
  .text-repeater-3 {
    left: calc(50% + var(--offset-text-repeater-3) / 1200 * 100vw);
    font-size: 1.8vw;
  }
  .text-repeater-4 {
    width: calc(var(--width-text-repeater-4) / 1200 * 100vw);
    left: calc(50% - var(--offset-text-repeater-4) / 1200 * 100vw);
    font-size: 2.5vw;
  }
  .text-repeater-4 .caution {
  }

  #button-repeater {
   
    width: calc(var(--width-button-repeater) / 1200 * 100vw);
  }
  #frame-format {
  }
  .format {
    width: 100vw;
  }
  #frame-howto {
  }
  .howto {
    width: 100vw;
  }
  #frame-tokyo {
  }
  .schedule-tokyo {
    width: 100vw;
  }
  .text-tokyo{
  }
  #frame-osaka {
  }
  .schedule-osaka {
    width: 100vw;
  }
  .text-osaka {
  }
  .text-schedule {
    width: calc(var(--width-text-schedule) / 1200 * 100vw);
  }
  .text-schedule .large {
  }
  .text-schedule .medium {
  }
  .text-schedule .small {
  }
  #frame-fee {
    height: calc(var(--height-frame-fee) / 1200 * 100vw);
  }
  .fee {
    width: 100vw;
  }
  .text-fee {
    width: calc(var(--width-text-fee) / 1200 * 100vw);
  }
  .notice {
  }
  .text-start {
    width: calc(var(--width-text-start) / 1200 * 100vw);
  }
  #button-ticket-2 {
  }
  #frame-goods {
  }
  .goods {
    width: 100vw;
  }
  #frame-map {
    height: calc(var(--height-frame-map) / 1200 * 100vw);
  }
  .map {
    width: 100vw;
  }
  .embed-map {
    width: calc(var(--width-embed-map) / 1200 * 100vw);
    height: calc(var(--height-embed-map) / 1200 * 100vw);
  }
  .embed-map-tokyo {
    right: calc(50% + var(--offset-embed-map-tokyo) / 1200 * 100vw);
  }
  .embed-map-osaka {
    right: calc(50% + var(--offset-embed-map-osaka) / 1200 * 100vw);
  }
  iframe-map {
  }
  .text-map {
    line-height: 150%;
    width: calc(var(--width-text-map) / 1200 * 100vw);
  }
  .text-map-tokyo {
  }
  .text-map-osaka {
  }
  .text-map .large {
    font-size: 28px;
  }
  .text-map .medium {
    font-size: 24px;
  }
  #frame-about {
    height: calc(var(--height-frame-about) / 1200 * 100vw);
  }
  .about {
    width: 100vw;
  }
  .section-about-1 {
    width: calc(var(--width-section-about-1) / 1200 * 100vw);
  }
  .about-1 {
    width: calc(var(--width-about-1) / 1200 * 100vw);
  }
  .text-about-1 {
    width: calc(var(--width-text-about-1) / 1200 * 100vw);
  }
  .text-about-1 .large {
  }
  .section-about-3 {
    width: calc(var(--width-section-about-3) / 1200 * 100vw);
  }
  .about-3 {
    width: calc(var(--width-about-3) / 1200 * 100vw);
  }
  .text-about-3 {
    width: calc(var(--width-text-about-3) / 1200 * 100vw);
  }
  .text-about-3 .large {
  }
  .illust-about {
    width: 100vw;
  }
  #frame-faq {
    height: calc(var(--height-frame-faq) / 1200 * 100vw);
  }
  .faq-title {
    width: 100vw;
  }
  .text-faq {
    width: calc(var(--width-text-faq) / 1200 * 100vw);
    height: calc(var(--height-text-faq) / 1200 * 100vw);
    font-size: 2.1vw;
  }
  .item {
    margin-left: calc(var(--ml-item) / 1200 * 100vw);
  }
  .item .question {
    margin-top: calc(var(--mt-question) / 1200 * 100vw);
  }
  .item .answer {
    margin-top: calc(var(--mt-answer) / 1200 * 100vw);
  }
  #frame-footer {
    height: calc(var(--height-footer) / 1200 * 100vw);
  }
  .footer {
  }
  .logo {
    width: calc(var(--width-logo) / 1200 * 100vw);
  }
  .text-copyright {
  }
}