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

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

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

/* --- ヘッダ --- */

#frame-header {
  display: none;
}
.title {
}

/* --- キービジュアル --- */
#frame-kv {
}
.kv {
  width: 100vw;
}

/* --- ストーリー・キャッチ --- */
#frame-story {
  --mt-frame-story: 50;
  --height-frame-story: 3247;

  margin-top: calc(var(--mt-frame-story) / 1000 * 100vw);
  height: calc(var(--height-frame-story) / 1000 * 100vw * 0.5);
  background-image: url('../../../images/dej/2505amethyst/sp/background/story.png');
}
.catch {
  --top-catch: 20;
  --width-catch: 2016;
  top: calc(var(--top-catch) / 1000 * 100vw);
/*  width: calc(var(--width-catch) / 1000 * 100vw); */
  width: 90vw;
}
.story {
  --top-story: 370;

  top: calc(var(--top-story) / 1000 * 100vw);
  width: 100vw;
}

/* --- インフォメーション --- */
#frame-information {
  --mt-frame-information: 50;
  --height-frame-information: 6236;

  margin-top: calc(var(--mt-frame-information) / 1000 * 100vw);
  height: calc(var(--height-frame-information) / 1000 * 100vw * 0.5);
  background-image: url('../../../images/dej/2505amethyst/sp/background/information.png');
  background-size: 100vw;
}
.information {
  --height-information: 6236;

  width: 100vw;
}
.button-dej {
  --top-button-dej: 830;
  --width-button-dej: 450;

  top: calc(var(--top-button-dej) / 1000 * 100vw);
  width: calc(var(--width-button-dej) / 1000 * 100vw);
}

/* --- プレイタイプ --- */
#frame-format {
  --mt-frame-format: 0;
  --height-frame-format: 2373;

  margin-top: calc(var(--mt-frame-format) / 1000 * 100vw);
  height: calc(var(--height-frame-format) / 1000 * 100vw * 0.5);
  background-image: url('../../../images/dej/2505amethyst/sp/background/format.png');
}
.format {
  --top-format: 50;

  top: calc(var(--top-format) / 1000 * 100vw);
  width: 100vw;
}

/* --- スケジュール --- */
#frame-schedule {
  --mt-frame-schedule: 0;
  --height-frame-schedule: 3341;

  margin-top: calc(var(--mt-frame-schedule) / 1000 * 100vw);
  height: calc(var(--height-frame-schedule) / 1000 * 100vw * 0.5);
  background-image: url('../../../images/dej/2505amethyst/sp/background/schedule.png?1');
}
.schedule {
  --top-schedule: 150;
  --width-schedule: 2044;

  top: calc(var(--top-schedule) / 1000 * 100vw);
  width: 90vw;
}
.calendar {
  --top-calendar: 580;
  --width-calendar: 1931;

  top: calc(var(--top-calendar) / 1000 * 100vw);
  width: 75vw;

}

/* --- マップ --- */
#frame-map {
  --mt-frame-map: 0;
  --height-frame-map: 3174;

  margin-top: calc(var(--mt-frame-map) / 1000 * 100vw);
  height: calc(var(--height-frame-map) / 1000 * 100vw * 0.5);
  background-image: url('../../../images/dej/2505amethyst/sp/background/map.png');
}
.map {
  --top-map: 30;
  --width-map: 2044;

  top: calc(var(--top-map) / 1000 * 100vw);;
  width: 95vw;
}
.text-map {
  --width-text-map: 700;
  --left-text-map: 100;

  margin: 0 auto;
  left: 0;
  right: 0;
  top: 58%;
  width: calc(var(--width-text-map) / 1000 * 100vw);
  font-size: 3vw;
  line-height: 140%;
border: solid yellow 0px;
}

.text-map .large {
  font-size: 4vw;
  line-height: 100%;
}

/* --- よくある質問 --- */
#frame-faq {
  --mt-frame-faq: 0;
  --height-frame-faq: 3893;

  margin-top: calc(var(--mt-frame-faq) / 1000 * 100vw);
  height: calc(var(--height-frame-faq) / 1000 * 100vw * 0.5);
  background-image: url('../../../images/dej/2505amethyst/sp/background/faq.png');
}
.faq {
  --top-faq: 100;
  --width-faq: 822;

  top: calc(var(--top-faq) / 1000 * 100vw);
  width: 80vw;
}
.text-faq {
  --width-text-faq: 800;
  --height-text-faq: 2800;

  top: 20%;
  width: calc(var(--width-text-faq) / 1000 * 100vw);
  height: calc(var(--height-text-faq) / 1000 * 100vw * 0.5);
  font-size: 3vw;
border: solid white 0px;
}
.item {
  --ml-item: 20;

  margin-left: calc(var(--ml-item) / 1000 * 100vw);
  padding: 10px;
}
.item .question {
  --mt-question: 50;
  margin-top: calc(var(--mt-question) / 1000 * 100vw);
  font-size: 120%;
}
.item .answer {
  --mt-answer: 10;
  margin-top: calc(var(--mt-answer) / 1000 * 100vw);
}

/* --ｰ フッタ --- */
#frame-footer {
  --height-footer: 500;
  height: calc(var(--height-footer) / 1000 * 100vw * 0.5);
}
.footer {
}
.logo {
  --width-logo: 407;

  bottom: 25%;
  width: calc(var(--width-logo) / 1000 * 100vw);
}