main {
  height: 100vh;
  width: 100vw;
  background-position: center;
  background-size: cover;
}

.quiz-container .quiz-title {
  padding: 24px 4% 24px;
  display: flex;
  align-items: center;
  flex-direction: column;
  z-index: 4;
  position: relative;
}

.quiz-container .quiz-title h2 {
  display: inline-block;
  text-align: left;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.4;
  padding: 12px;
}

.quiz-title span {
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  font-size: 48px;
  min-width: 88px;
  text-align: center;
  letter-spacing: -4px;
  line-height: 1.2;
}

.choices {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0%;
  padding: 24px 0 24px 0;
  flex-wrap: wrap;
  position: relative;
  z-index: 4;
  max-width: 478px;
  margin: auto;
}

.choices button {
  padding: 12px 4%;
  min-width: 300px;
  max-width: 92%;
  margin: 0 0 16px 0;
  text-align: center;
  border-radius: 36px;
  border-style: solid;
  border-color: #ffffff;
  color: #ffffff;
  font-weight: bold;
}

.choices button span {
  text-align: left;
  display: inline-block;
}


.quiz-answer {
  display: none;
  max-width: 767px;
  margin: auto;
}

.quiz-result__alert {
  text-align: center;
  padding: 24px 2% 24px;
  font-size: 15px;
  font-weight: bold;
  color: #e21414;
}

.quiz-result__alert {
  z-index: 100;
  width: 100%;
  position: relative;
  }


.quiz-container {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow-y: scroll;
  max-height: 100vh;
}

@media screen and (min-width: 767px) {
  .quiz-container {
    max-width: 575px;
    max-height: 100vh;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  }
}

@media screen and (min-height: 650px) {
  .quiz-container {
    border-radius: 0px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
  }
}

@media screen and (min-width: 767px) and (min-height: 650px) {
  .quiz-container {
    max-width: 575px;
    margin: 0 auto;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
  }
}

.quiz-container--position{position: relative;overflow: hidden;}

.quiz-whole {
  height: 100%;
  position: relative;
  z-index: 5;
}

.quiz-wrap {
  position: relative;
  z-index: 5;
}

.basicinsight__img__upper {
  position: relative;
}

.basicinsight__img__main {
  position: relative;
}

.basicinsight__img__main video {
  width: 100%;
  display: block;
  margin: 0;
}

.basicinsight__img__lower {
  position: relative;
  margin: -2px 0 0 0;
}


.basicinsight__img__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  z-index: -1;
}

/* .basicinsight__img__bg img {
} */

.basicinsight__img__bg video {
  width: 100%;
}

.basicinsight__img__bg--color {
  position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
  /* background-color: #fff; */
  height: 100%;
  z-index: -2;
}


.basicinsight__img__overlay {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
}

.display__parent__1 .display__child__1 {
  display: block;
}

.display__parent__1 .display__child__2,
.display__parent__1 .display__child__3,
.display__parent__1 .display__child__4,
.display__parent__1 .display__child__5,
.display__parent__1 .display__child__6,
.display__parent__1 .display__child__7,
.display__parent__1 .display__child__8,
.display__parent__1 .display__child__9,
.display__parent__1 .display__child__10,
.display__parent__1 .display__child__11,
.display__parent__1 .display__child__12 {
  display: none;
}


.display__parent__2 .display__child__1,
.display__parent__2 .display__child__2 {
  display: block;
}

.display__parent__2 .display__child__3,
.display__parent__2 .display__child__4,
.display__parent__2 .display__child__5,
.display__parent__2 .display__child__6,
.display__parent__2 .display__child__7,
.display__parent__2 .display__child__8,
.display__parent__2 .display__child__9,
.display__parent__2 .display__child__10,
.display__parent__2 .display__child__11,
.display__parent__2 .display__child__12 {
  display: none;
}

.display__parent__3 .display__child__1,
.display__parent__3 .display__child__2,
.display__parent__3 .display__child__3 {
  display: block;
}

.display__parent__3 .display__child__4,
.display__parent__3 .display__child__5,
.display__parent__3 .display__child__6,
.display__parent__3 .display__child__7,
.display__parent__3 .display__child__8,
.display__parent__3 .display__child__9,
.display__parent__3 .display__child__10,
.display__parent__3 .display__child__11,
.display__parent__3 .display__child__12 {
  display: none;
}

.display__parent__4 .display__child__1,
.display__parent__4 .display__child__2,
.display__parent__4 .display__child__3,
.display__parent__4 .display__child__4 {
  display: block;
}

.display__parent__4 .display__child__5,
.display__parent__4 .display__child__6,
.display__parent__4 .display__child__7,
.display__parent__4 .display__child__8,
.display__parent__4 .display__child__9,
.display__parent__4 .display__child__10,
.display__parent__4 .display__child__11,
.display__parent__4 .display__child__12 {
  display: none;
}

.display__parent__5 .display__child__1,
.display__parent__5 .display__child__2,
.display__parent__5 .display__child__3,
.display__parent__5 .display__child__4,
.display__parent__5 .display__child__5 {
  display: block;
}

.display__parent__5 .display__child__6,
.display__parent__5 .display__child__7,
.display__parent__5 .display__child__8,
.display__parent__5 .display__child__9,
.display__parent__5 .display__child__10,
.display__parent__5 .display__child__11,
.display__parent__5 .display__child__12 {
  display: none;
}

.display__parent__6 .display__child__1,
.display__parent__6 .display__child__2,
.display__parent__6 .display__child__3,
.display__parent__6 .display__child__4,
.display__parent__6 .display__child__5,
.display__parent__6 .display__child__6 {
  display: block;
}

.display__parent__6 .display__child__7,
.display__parent__6 .display__child__8,
.display__parent__6 .display__child__9,
.display__parent__6 .display__child__10,
.display__parent__6 .display__child__11,
.display__parent__6 .display__child__12 {
  display: none;
}


.display__parent__7 .display__child__1,
.display__parent__7 .display__child__2,
.display__parent__7 .display__child__3,
.display__parent__7 .display__child__4,
.display__parent__7 .display__child__5,
.display__parent__7 .display__child__6,
.display__parent__7 .display__child__7 {
  display: block;
}

.display__parent__7 .display__child__8,
.display__parent__7 .display__child__9,
.display__parent__7 .display__child__10,
.display__parent__7 .display__child__11,
.display__parent__7 .display__child__12 {
  display: none;
}


.display__parent__8 .display__child__1,
.display__parent__8 .display__child__2,
.display__parent__8 .display__child__3,
.display__parent__8 .display__child__4,
.display__parent__8 .display__child__5,
.display__parent__8 .display__child__6,
.display__parent__8 .display__child__7,
.display__parent__8 .display__child__8 {
  display: block;
}

.display__parent__8 .display__child__9,
.display__parent__8 .display__child__10,
.display__parent__8 .display__child__11,
.display__parent__8 .display__child__12 {
  display: none;
}


.display__parent__9 .display__child__1,
.display__parent__9 .display__child__2,
.display__parent__9 .display__child__3,
.display__parent__9 .display__child__4,
.display__parent__9 .display__child__5,
.display__parent__9 .display__child__6,
.display__parent__9 .display__child__7,
.display__parent__9 .display__child__8,
.display__parent__9 .display__child__9 {
  display: block;
}

.display__parent__9 .display__child__10,
.display__parent__9 .display__child__11,
.display__parent__9 .display__child__12 {
  display: none;
}


.display__parent__10 .display__child__1,
.display__parent__10 .display__child__2,
.display__parent__10 .display__child__3,
.display__parent__10 .display__child__4,
.display__parent__10 .display__child__5,
.display__parent__10 .display__child__6,
.display__parent__10 .display__child__7,
.display__parent__10 .display__child__8,
.display__parent__10 .display__child__9,
.display__parent__10 .display__child__10 {
  display: block;
}

.display__parent__10 .display__child__11,
.display__parent__10 .display__child__12 {
  display: none;
}


.display__parent__11 .display__child__1,
.display__parent__11 .display__child__2,
.display__parent__11 .display__child__3,
.display__parent__11 .display__child__4,
.display__parent__11 .display__child__5,
.display__parent__11 .display__child__6,
.display__parent__11 .display__child__7,
.display__parent__11 .display__child__8,
.display__parent__11 .display__child__9,
.display__parent__11 .display__child__10,
.display__parent__11 .display__child__11 {
  display: block;
}

.display__parent__11 .display__child__12 {
  display: none;
}


.display__parent__12 .display__child__1,
.display__parent__12 .display__child__2,
.display__parent__12 .display__child__3,
.display__parent__12 .display__child__4,
.display__parent__12 .display__child__5,
.display__parent__12 .display__child__6,
.display__parent__12 .display__child__7,
.display__parent__12 .display__child__8,
.display__parent__12 .display__child__9,
.display__parent__12 .display__child__10,
.display__parent__12 .display__child__11,
.display__parent__12 .display__child__12 {
  display: block;
}


.basicinsight__display__unselected {
  display: none;
}


.basicinsight__display__text .quiz-title {
  display: flex;
}

.basicinsight__display__text .lowertext {
  display: flex;
}

.basicinsight__display__text img {
  display: none;
}

.basicinsight__display__photo .quiz-title {
  display: none;
}

.basicinsight__display__photo .lowertext {
  display: none;
}

.basicinsight__display__photo img {
  display: flex;
}


.lowertext {
  text-align: left;
  padding: 24px 12% 24px 12%;
  align-items: center;
  flex-direction: column;
  z-index: 4;
  position: relative;
}


::-webkit-scrollbar {
  width: 0px;
  border-radius: 0 12px 12px 0;
  background: rgb(178 178 178 / 8%);
}

::-webkit-scrollbar-thumb {
  border-radius: 12px 12px 12px 12px;
  background: rgba(129, 129, 129, 0.20);
}

@media screen and (min-width: 767px) {
  ::-webkit-scrollbar {
    width: 8px;
  }
}

.block_section_last{
  position: relative;
  }
  .block_section_last .basicinsight__img__bg{
    position: absolute;
    z-index: -1;
  }

  .block_section__btn_next{
    display: none;
  }

  .choices .pic__option__size {
    padding: 0;
    min-width: 160px;
    max-width: 92%;
    margin: 0 0 16px 0;
    text-align: center;
    border-radius: 0px;
    border-style: none;
    border-color: #ffffff;
    font-weight: bold;
    background: none;
  }
  

  /* .choices .selected img{
    filter: brightness(1.4);
  outline: 8px solid #939393c7;
  outline-offset: -8px;
  } */




  .quiz-wrap {
    display: flex;
    flex-direction: column;
  }
  .quiz-wrap .basicinsight__img__upper{
    order : 2;
    }
    .quiz-wrap .basicinsight__img__main{
        order : 3;
    }
    .quiz-wrap .basicinsight__img__lower{
        order : 4;
    }
    .quiz-wrap .choices{
        order : 5;
    }
    .quiz-wrap .choices_submit--order{
      order : 6;
    }

    .quiz-wrap .basicinsight__img__order__1{
      order : 2;
    }
    .quiz-wrap .basicinsight__img__order__2{
      order : 3;
    }
    .quiz-wrap .basicinsight__img__order__3{
      order : 4;
    }

    .quiz-wrap .basicinsight__img__keyvisual{
      order : 1;
    }


/*2024 07 02 追加*/
.block_section_last .basicinsight__img__bg{
    height: 100%;
  }