@charset "UTF-8";

/*
@font-face {
  font-family: "Zen Old Mincho Bold";
  font-display: block;
  src: url("../../../fonts/ZenOldMincho-Bold.ttf") format("TrueType");
}

.text {
  font-family: "Zen Old Mincho Bold";
}
*/

.text {
  color: white;
}

/* ----- */

/* 発売日 */
.text-sale {
  --bottom-text-sale: 45;
  --offset-text-sale: 180;
  --fontsize-sale: 40;

  position: absolute;
  bottom: calc(var(--bottom-text-sale) * 1px);
  left: calc(50% + var(--offset-text-sale) * 1px);

  color: #E66419 !important;
  font-weight: bold;
  font-size: calc(var(--fontsize-sale) * 1px);
}

/* マップ */
.text-map {
  --width-text-map: 350;
  --height-text-map: 300;
  --offset-text-map:  0;

  position: absolute;
  top: 20%;
  left: calc(50% + var(--offset-text-map) * 1px);
  width: calc(var(--width-text-map) * 1px);
  height: calc(var(--height-text-map) * 1px);

  text-align: left;
  color: white;
  font-size: 18px;
}
.text-map .large {
  font-size: 24px;
  font-weight: bold;
}
.text-map .medium {
  font-size: 20px;
}
/*
.text-map {
  --top-text-map: 110;
  --offset-text-map: (-30);
  --width-text-map: 480;

  position: absolute;
  top: calc(var(--top-text-map) * 1px);
  width: calc(var(--width-text-map) * 1px);
  left: calc(50% + var(--offset-text-map) * 1px);
  text-align: left;

border: solid red 0px;
}
.text-map .venue {
  --fontsize-venue: 24;

  text-align: left;
  font-size: calc(var(--fontsize-venue) * 1px);
  font-weight: bold;
}
.text-map .howto {
  --fontsize-howto: 20;
  font-size: calc(var(--fontsize-howto) * 1px);
}
.text-map .address {
  --fontsize-address: 20;
  font-size: calc(var(--fontsize-address) * 1px);
}
.text-map ul {
  --fontsize-address: 20;

  list-style-type: "● ";
  margin-left: 20px;
  font-size: calc(var(--fontsize-address) * 1px);
}
*/

/* FAQ */
/*
.text-faq {
  --width-text-faq: 850;

  margin: 0 auto;
  width: calc(var(--width-text-faq) * 1px);
}
.item {
  --ml-item: 20;

  text-align: left;
  color: white;

  font-size: 14px;
  margin-left: calc(var(--ml-item) * 1px);
}
.item .question {
  --mt-question: 40;

  font-weight: bold;
  margin-top: calc(var(--mt-question) * 1px);
  font-size: 20px;

}
.item .answer {
  --mt-answer: 5;
  margin-top: calc(var(--mt-answer) * 1px);
  font-size: 18px;
}
*/
.text-faq {
  --top-text-faq: 120;
  --width-text-faq: 980;
  --height-text-faq: 1350;

  position: absolute;

  top: calc(var(--top-text-faq) * 1px);
  margin: 0 auto;
  left: 0;
  right: 0;
  width: calc(var(--width-text-faq) * 1px);
  height: calc(var(--height-text-faq) * 1px);

  text-align: left;
  overflow-y: scroll;
  padding-right: 10px;

}
.text-faq .faq {
}
.text-faq .item {
}
.text-faq .item .question {
  --mt-question: 30;
  --fontsize-question: 24;

  margin-top: calc(var(--mt-question) * 1px);
  font-size: calc(var(--fontsize-question) * 1px);
  font-weight: bold;
}
.text-faq .item .answer {
  --fontsize-answer: 20;
  font-size: calc(var(--fontsize-answer) * 1px);
}


/* 1000px未満 */
@media screen and (max-width: 1000px) {
  .text-sale {
    --fontsize-sale: 48;

    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    bottom: 12%;

    color: #E66419 !important;
    font-weight: bold;
    font-size: calc(var(--fontsize-sale) / 1000 * 100vw);
  }
  .text-map {
    --top-text-map: 800;
    --fontsize-venue: 28;

    position: absolute;
    top: calc(var(--top-text-map) / 1000 * 100vw);
    margin: 0 auto;
    left: 0;
    right: 0;
    width: 70vw;
    text-align: left;
    font-size: 2.5vw;
  }

  .text-map .large {
    text-align: left;
    font-size: 3.5vw;
    font-weight: bold;
  }
  .text-map .medium {
    font-size: 3vw;
  }
  .text-faq {
    --top-text-faq: 150;
    --height-text-faq: 1300;

    position: absolute;

    top: calc(var(--top-text-faq) / 1000 * 100vw);
    margin: 0 auto;
    left: 0;
    right: 0;
    width: 75vw;
    height: calc(var(--height-text-faq) / 1000 * 100vw);
    padding-right: 10px;

    text-align: left;
    overflow-y: scroll;
  }
  .text-faq .faq {
  }
  .text-faq .item {
  }
  .text-faq .item .question {
    --mt-question: 30;
    --fontsize-question: 24;

    margin-top: calc(var(--mt-question) / 1000 * 100vw);
    font-size: calc(var(--fontsize-question) / 1000 * 100vw);
    font-weight: bold;
  }
  .text-faq .item .answer {
    --fontsize-answer: 20;
    font-size: calc(var(--fontsize-answer) / 1000 * 100vw);
  }
}