@charset "UTF-8";

/* --- キービジュアル --- */
#frame-kv {
  position: relative;
  height: calc(var(--height-frame-kv) * 1px);
}
.kv {

  position: absolute;
  top: 0;
  margin: 0 auto;
  left: 0;
  right: 0;
}
.title {
  position: absolute;
  top: 0;
  margin: 0 auto;
  left: 0;
  right: 0;

  opacity: 0;
  animation: ease-in 1s appear 2s forwards;
}

/* --- キャッチ --- */
#frame-catch {
  position: relative;
}
.catch {
}
.text-catch {
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;

  font-family: 'GenEiLateMin', sans-serif;
  font-weight: bold;
  color: #F5E79A;
}

/* --- ポイント --- */
#frame-point {
  position: relative;
}
.point {
}
.text-point {

  color: white;
  font-weight: bold;
border: solid white 0px;
}
.text-point-1 {
}
.text-point-2 {
}
.text-point-3 {
}

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

  position: relative;
  height: calc(var(--height-frame-story) * 1px);
	overflow-x: hidden;
}
.story {
  position: absolute;
  top: 0;
}

#button-size {
  --width-button-size: 236;

  position: absolute;
}
.text-story {
  position: absolute;

  color: white;
  font-weight: bold;
border: solid white 0px;
}
.text-story-latter {
  display: none;
}


/* --- キャラクター --- */
#frame-character {
  position: relative;
}
.character {
}
.text-character {
  position: absolute;

  color: white;
  font-weight: bold;

border: solid white 0px;
}

/* --- 参加方法 --- */
#frame-howto{
  position: relative;
}
.howto {
}
.frame-calendar {
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;
border: solid red 0px;
}
.slider-calendar {
}
.calendar {
}
.text-schedule {
  position: absolute;

  font-weight: bold;
  color: white;
  text-align: left;
}
.text-schedule .large {
}
.text-schedule .medium {
}
.text-schedule .small {
}
.text-fee {
  position: absolute;

  color: white;
  text-align: left;
}
.text-start {
  position: absolute;

  color: #FFFF71;
  text-align: left;
}
.text-start .large {
}
#button-ticket {
  --width-button-ticket: 250;
}

/* --- ビギナーズガイド --- */
#frame-beginner {
  position: relative;
}
.beginner {
}
.text-beginner {
  position: absolute;
  color: white;
  text-align: left;
}
.text-beginner-1 {
}
.text-beginner-2 {
}
.text-beginner .yellow {
  color: #FFFF71;
}

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

/* --- マップ --- */
#frame-map {
  position: relative;
}
.map {
}
.embed-map {
  position: absolute;
}
.iframe-map {
  width: 100%;
  height: 100%;
}
.text-map {
  position: absolute;
  text-align: left;
  color: white;
  line-height: 180%;
}
.text-map .large {
  font-weight: bold;
}

/* --- アバウト --- */
#frame-about {
  margin-top: 30px;
  position: relative;
}
.about-title {
}
.section-about-1 {
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;

  display: flex;
  align-items: center;
  margin: 15px auto;
}
.image-about-1 {
}
.text-about-1 {
  padding-right: 10px;
  text-align: left;
  color: white;
  line-height: 180%;
}
.text-about-1 .large {
  font-weight: bold;
}
.section-about-2 {
position: absolute;
}
.text-about-2 {
}
.text-about-2 .large {
}
.section-about-3 {
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;

}
.text-about-3 {
  padding-right: 10px;
  text-align: left;
  color: white;
  line-height: 180%;
}
.image-about-3 {
}

/* --- FAQ --- */
#frame-faq {
  position: relative;
}
.faq-title {
}
.text-faq {
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;
  padding-right: 5px;
}
.item {
  --ml-item: 20;

  text-align: left;
  color: white;
}
.item .question {
  --mt-question: 40;
  font-weight: bold;
}
.item .answer {
  --mt-answer: 5;
}

/* --ｰ フッタ --- */
#frame-footer {
  margin-top: 20px;
}
.footer {
}
.logo {
}
.text-copyright {
  margin: 20px auto;

  color: white;
  line-height: 140%;
}

/* --- 妖怪 --- */
.yokai-wrapper {
}

.yokai {
  position: absolute;
  animation: ease-in infinite fuwafuwa;
}

.yokai-A {
  --width-yokai-A: 109;

  animation-duration: 1.4s;
  animation-delay: 0.3s;
}
.yokai-B {
  --width-yokai-B: 167;

  animation-duration: 1.5s;
  animation-delay: 0.6s;
}
.yokai-C {
  --width-yokai-C: 174;

  animation-duration: 1.7s;
  animation-delay: 0.6s;
}
.yokai-D {
  --width-yokai-D: 149;

  animation-duration: 1.7s;
  animation-delay: 0.6s;
}
