@charset "utf-8";

/* ----- */

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

/* メニュー */
.frame-menu {
  --height-frame-menu: 90;

  position: relative;
  height: calc(var(--height-frame-menu) * 1px);
}

/* ストーリー */
#frame-story {
  margin-top: 10px;
}
.story {
}
/* 大糸線謎解きとは？ */
#frame-about {
}
.about {
}
/* 遊び方 */
#frame-howto {
  position: relative;
}
.howto {
}

/* イベント概要 */
#frame-format {
}
.format {
}

/* キット配布観光案内所一覧 */
#frame-kit {
}
.kit {
}

*/
/* 注意事項 */
#frame-notice {
  margin-top: 30px;
}
#button-notice {
  --width-button-notice: 542;
}
.notice {
  display: none;
}
/* よくある質問 */
#frame-faq {
}
.faq {
}
/* フッタ */
#frame-footer {
}
.button-inquiry {
  --width-button-inquiry: 542;
}
.logos {
  margin-top: 30px;
}



/* 1080px未満 */
@media screen and (max-width: 1080px) {
  .kv {
    width: 100vw;
  }
  .frame-menu {
    height: calc(var(--height-frame-menu) / 1080 * 100vw);
  }
  #frame-story {
  }
  .story {
    width: 100vw;
  }
  #frame-about {
  }
  .about {
    width: 100vw;
  }
  #frame-howto {
  }
  .howto {
    width: 100vw;
  }
  #frame-format {
  }
  .format {
    width: 100vw;
  }
  #frame-kit {
  }
  .kit {
    width: 100vw;
  }
  #frame-notice {
  }
  #button-notice {
    width: calc(var(--width-button-notice) / 1080 * 100vw);
  }
  .notice {
    width: 100vw;
  }
  #frame-faq {
  }
  .faq {
    width: 100vw;
  }
  #frame-footer {
  }
  .button-inquiry {
   width: calc(var(--width-button-inquiry) / 1080 * 100vw);
  }
  .logos {
    width: 100vw;
  }
}