main {
  height: 100dvh;
  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;
}

.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: 0px 2% 24px;
  font-size: 15px;
  font-weight: bold;
  color: #e21414;
}

.quiz-result__alert {
  z-index: 100;
  position: absolute;
  bottom: 0;
  width: 100%;
}


.quiz-container {
  /* width: 100%; */
  /* position: absolute; */
  /* left: 0; */
  /* overflow-y: hidden; */
  /* height: 178vw; */
  /* top: 0%; */
  /* transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%); */
}

@media screen and (min-width: 767px) {
  .quiz-container {
    max-width: 575px;
    height: 1023px;
    /* left: 50%; */
    max-height: 90vh;
    /* transform: translateX(-50%); */
    /* -webkit-transform: translateX(-50%); */
    -ms-transform: translateX(-50%);
    /* position: absolute; */
    /* left: 50%; */
    /* top: 50%; */
    /* transform: translate(-50%, -50%); */
    /* -webkit-transform: translate(-50%, -50%); */
  }
}

@media screen and (min-height: 670px) {
  .quiz-container {
    width: 92%;
    /* margin: 0 4%; */
    height: 96%;
    max-height: 162vw;
    border-radius: 12px;
    /* top: 50%; */
    /* transform: translateY(-50%); */
    /* -webkit-transform: translateY(-50%); */
    -ms-transform: translateY(-50%);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    overflow-y: hidden;
  }
}

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

.quiz-container--position {
  position: absolute;
  height: 100%;
  width: 100%;
}

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

.quiz-wrap {
  position: relative;
  z-index: 5;
  padding: 0 0 3.2vh;
}




.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: 8px;
  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);
}



.block_section_a {
  z-index: 100;
  position: absolute;
  overflow-y: scroll;
  width: 100%;
  height: 100%;
}

.block_section_last .basicinsight__img__bg{
  z-index: -1;
}


.quiz-result__btn{
position: absolute;
top:0;
width: 100%;
height: 20%;
background-color: #fff;
color: #000;
z-index: 99;
}


.block_section__btn_next{
  display: block;
  width: 80%;
  text-align: center;
  padding: 12px 4%;
  margin: 24px auto 24px;
  background-color: #606060db;
  color: #ffffff;
  font-weight: bold;
  border-radius: 16px;
  border-width: 0px;
  height: 24vw;
  max-height: 60px;
  /* border-color: #363636; */
}

.display__none__ .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;
  overflow: hidden;
}
.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 追加*/
  .quiz-wrap {
    min-height: 100%;
  }
  .block_section_last .basicinsight__img__bg img{
    position: fixed;
    }