@charset "utf-8";

/***************************************************
  top + common
***************************************************/

/* common ----------------------------------------*/

@keyframes fade-in{
  0%{
      opacity: 0;
  }
  100%{
      opacity: 1;
  }
}

@keyframes fade-out{
  0%{
      opacity: 1;
  }
  100%{
      opacity: 0;
  }
}



.shindan-outer,
.shindan-wrap{
  overflow: hidden;
  background-color: #e4e4e4;
  position: relative;
}
.shindan-outer.is-loading{
  max-height: 100vh;
}

.btn-wrap{
  display: flex;
  justify-content: center;
  gap: 2.5vw;
}
.shindan-step[data-num="0"] .btn-wrap{
  margin: 6.25vw 0 9vw 0;
}
.btn-wrap .btn{
  width: 25.8vw;
  height: 10.9375vw;
  background-color: #000;
  border-radius: 100vw;
  box-sizing: border-box;
  color: #fff;
  font-size: 4.0625vw;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  -webkit-appearance: none;
  appearance: none;
  border: none;
  outline: none;
}
.shindan-step[data-num="0"] .btn-wrap .btn{
  width: 53.75vw;
  height: 13.6vw;
}
.btn-wrap .btn.is-invalid{
  background-color: #808080;
  color: #e4e4e4;
  pointer-events: none;
}

.shindan-wrap[data-type="result"] .btn-wrap .btn::after{
  content: "";
  display: block;
  position: absolute;
  top: 0; bottom: 0;
  margin: auto;
  vertical-align: middle;
  width: 0.4em;
  height: 0.4em;
  border-top: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
  transform: rotate(135deg);
}
.shindan-wrap[data-type="result"] .shindan-recommend .btn-wrap .btn::after{
  right: 1.2em;
}
.shindan-wrap[data-type="result"] .btn-wrap[data-type="return"] .btn::after{
  width: 0.48em;
  height: 0.48em;
  left: 1.5em;
  transform: rotate(-45deg);
}


.btn-wrap .btn img{
  width: 51.74%;
}
.btn-wrap .btn:hover{
  background-color: #4e4e4e;
  text-decoration: none;
}




.shindan-step{
  display: none;
  box-sizing: border-box;
  position: relative;
  width: 100%;
  z-index: 1;
}
.shindan-step.is-active{
  display: block;
}
.shindan-step[data-num="0"]{
  padding: 10vw 6.5625vw 24vw 6.5625vw;
}
.shindan-step:not([data-num="0"]){
  padding: 12vw 0 40vw 0;
}

.shindan-step::before{
  content: '';
  /* background-image: url('/sp/ouchi_yakiniku/shindan/img/obj_selected.svg'); */
  background-repeat: no-repeat;
  background-size: 100% auto;
  display: block;
  height: auto;
  position: absolute;
}
.shindan-step::after{
  content: '';
  /* background-image: url('/sp/ouchi_yakiniku/shindan/img/obj_selected.svg'); */
  background-repeat: no-repeat;
  background-size: 100% auto;
  display: block;
  height: auto;
  position: absolute;
}

.shindan-step[data-num="1"]::before{
  aspect-ratio: 74/66;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_bg_01.svg');
  width: 11.56vw;
  top: 44vw;
  right: 18vw;
}
.shindan-step[data-num="1"]::after{
  aspect-ratio: 73/78;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_bg_02.svg');
  width: 11.4vw;
  top: 124vw;
  left: 8vw;
}

.shindan-step[data-num="2"]::before{
  aspect-ratio: 106/97;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q2_bg_01.svg');
  width: 16.56vw;
  top: 50vw;
  right: 17vw;
}
.shindan-step[data-num="2"]::after{
  aspect-ratio: 92/96;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q2_bg_02.svg');
  width: 14.37vw;
  top: 105vw;
  left: 12vw;
}

.shindan-step[data-num="3"]::before{
  aspect-ratio: 82/64;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q3_bg_01.svg');
  width: 12.81vw;
  top: 54vw;
  right: 18vw;
}
.shindan-step[data-num="3"]::after{
  aspect-ratio: 90/90;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q3_bg_02.svg');
  width: 14.06vw;
  top: 112vw;
  left: 4vw;
}

.shindan-step[data-num="5"]::before{
  aspect-ratio: 64/99;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_bg_01.svg');
  width: 10vw;
  top: 16vw;
  right: 5vw;
}
.shindan-step[data-num="5"]::after{
  aspect-ratio: 76/84;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_bg_02.svg');
  width: 11.87vw;
  top: 120vw;
  left: 5vw;
}

.shindan-step[data-num="6"]::before{
  aspect-ratio: 107/55;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q6_bg_01.svg');
  width: 16.72vw;
  top: 40vw;
  right: 8vw;
}
.shindan-step[data-num="6"]::after{
  aspect-ratio: 83/99;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q6_bg_02.svg');
  width: 12.93vw;
  top: 82vw;
  left: 4vw;
}





.shindan-step[data-num="0"] h2{
  margin: 0 0 5.625vw 0;
  text-align: center;
}
.shindan-step[data-num="0"] h2 img{
  width: 69vw;
  margin: 0 auto;
  transform: translate(3vw, 0);
}

.shindan-step[data-num="0"] p{
  font-size: 3.75vw;
  font-weight: 800;
  letter-spacing: 0.15em;
  line-height: 2.16;
  margin: 0 0 5.625vw 0;
}

.swiper-slide .inc-lottie{
  transform: scale(1);
  transition: transform 0.6s;
}
.swiper-slide-active .inc-lottie{
  transform: scale(1.6);
}

.shindan-wrap::after{
  content: '';
  display: block;
  width: 100%;
  height: 31.25vw;
  background: url('../img/btm_wave_0.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
  bottom: -0.06vw;
  position: absolute;
  left: 0;
  z-index: 0;
  animation: scroll_anim_R 60s linear infinite;
}
.shindan-wrap[data-type="result"]::after{
  bottom: -14vw;
}
/* step毎の色変更 ----------------------------------------*/
.shindan-wrap[data-step="1"]::after{
  background: url('../img/btm_wave_1.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-step="2"]::after{
  background: url('../img/btm_wave_2.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-step="3"]::after{
  background: url('../img/btm_wave_3.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-step="4"]::after{
  background: url('../img/btm_wave_4.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-step="5"]::after{
  background: url('../img/btm_wave_5.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-step="6"]::after{
  background: url('../img/btm_wave_6.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-step="7"]::after{
  background: url('../img/btm_wave_7.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}


/* resultでの色変更 ----------------------------------------*/
.shindan-wrap[data-result="1"]::after{
  background: url('../img/btm_wave_1.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-result="2"]::after{
  background: url('../img/btm_wave_2.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-result="3"]::after{
  background: url('../img/btm_wave_6.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-result="4"]::after{
  background: url('../img/btm_wave_3.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-result="5"]::after{
  background: url('../img/btm_wave_5.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-result="6"]::after{
  background: url('../img/btm_wave_4.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-result="7"]::after{
  background: url('../img/btm_wave_7.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}
.shindan-wrap[data-result="8"]::after{
  background: url('../img/btm_wave_0.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
}


.shindan-outer::after{
  content: '';
  display: block;
  width: 100%;
  height: 16vw;
  background: url('../img/scroll_label.png') left bottom repeat-x;
  background-size: auto 16vw;
  bottom: 1vw;
  position: absolute;
  left: 0;
  z-index: 0;
  animation: scroll_anim_L 150s linear infinite;
}


@keyframes scroll_anim_R{
  100%{
    background-position: -500% 0;
  }
}

@keyframes scroll_anim_L{
  100%{
    background-position: 500% 0;
  }
}



.question-ttl{
  margin: 0 0 6vw 0;
  text-align: center;
  position: relative;
}
.question-num{
  aspect-ratio: 1/1;
  position: absolute;
  top: -7vw;
  left: 3.75vw;
  width: 18.28vw;
  height: auto;
}
.question-txt,
.question-txt span{
  font-size: 5.3125vw;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.8;
  margin: 0 0 6vw 0;
  text-align: center;
}




/* q4のみ ----------------------------------------*/
.question-wrap{
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  margin: 0 auto 9.6875vw auto;
  height: 87vw;
  position: relative;
}
.question-wrap > p{
  font-size: 4.375vw;
  font-weight: 800;
  letter-spacing: 0.1em;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
}
.question[data-num="4"][data-type="1"] .question-wrap > p{
  top: 12%;
}
.question[data-num="4"][data-type="2"] .question-wrap > p{
  top: 26%;
}
.question[data-num="4"][data-type="3"] .question-wrap > p{
  top: 25%;
}

.question[data-num="4"][data-type="1"] .question-wrap{
  aspect-ratio: 538/557;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_obj_01.svg');
  width: 84.06vw;
}
.question[data-num="4"][data-type="2"] .question-wrap{
  aspect-ratio: 589/520;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_obj_02.svg');
  width: 92.03vw;
}
.question[data-num="4"][data-type="3"] .question-wrap{
  aspect-ratio: 530/500;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_obj_03.svg');
  width: 82.8vw;
}

.question-wrap::after{
  content: '';
  background-repeat: no-repeat;
  background-size: 100% auto;
  display: block;
  height: auto;
  position: absolute;
  top: -2vw;
  right: -4vw;
}
.question[data-num="4"][data-type="1"] .question-wrap::after{
  aspect-ratio: 102/107;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_icon_01.svg');
  width: 15.94vw;
  top: -8.5vw;
  right: 1vw;
}
.question[data-num="4"][data-type="2"] .question-wrap::after{
  aspect-ratio: 114/99;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_icon_02.svg');
  width: 17.8vw;
  top: -4vw;
  right: 8vw;
}
.question[data-num="4"][data-type="3"] .question-wrap::after{
  aspect-ratio: 113/124;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_icon_03.svg');
  width: 17.66vw;
  top: -5vw;
  right: 4vw;
}




.question:not([data-num="4"]) .question-select{
  height: 103.125vw;
  position: relative;
}
.question[data-num="4"][data-type="1"] .question-select[data-num="2"],
.question[data-num="4"][data-type="1"] .question-select[data-num="3"],
.question[data-num="4"][data-type="2"] .question-select[data-num="1"],
.question[data-num="4"][data-type="2"] .question-select[data-num="3"],
.question[data-num="4"][data-type="3"] .question-select[data-num="1"],
.question[data-num="4"][data-type="3"] .question-select[data-num="2"]{
    display: none;
}




.question-select li{
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
}

/* question1 ----------------------------------------*/
.question[data-num="1"] .question-select li:nth-of-type(1){
  aspect-ratio: 238/254;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_obj_01.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 37vw;
  top: 7vw;
  left: 16vw;
  z-index: 1;
}
.question[data-num="1"] .question-select li:nth-of-type(2){
  aspect-ratio: 228/254;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_obj_02.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 35.625vw;
  top: 18vw;
  right: 6.25vw;
  z-index: 1;
}
.question[data-num="1"] .question-select li:nth-of-type(3){
  aspect-ratio: 230/267;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_obj_03.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 35.9375vw;
  top: 40.625vw;
  left: 6.25vw;
  z-index: 1;
}
.question[data-num="1"] .question-select li:nth-of-type(4){
  aspect-ratio: 242/248;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_obj_04.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 37.8125vw;
  top: 55.47vw;
  right: 14vw;
}

/* question2 ----------------------------------------*/
.question[data-num="2"] .question-select li:nth-of-type(1){
  aspect-ratio: 296/346;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q2_obj_01.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 46.25vw;
  top: 9vw;
  left: 5.25vw;
  z-index: 1;
}
.question[data-num="2"] .question-select li:nth-of-type(2){
  aspect-ratio: 298/335;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q2_obj_02.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 46.5625vw;
  top: 36.375vw;
  right: 5.25vw;
}

/* question3 ----------------------------------------*/
.question[data-num="3"] .question-select li:nth-of-type(1){
  aspect-ratio: 300/275;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q3_obj_01.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 46.875vw;
  top: 4.6875vw;
  left: 7.8125vw;
}
.question[data-num="3"] .question-select li:nth-of-type(2){
  aspect-ratio: 302/211;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q3_obj_02.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 46.875vw;
  top: 37.5vw;
  right: 4.6875vw;
  z-index: 1;
}
.question[data-num="3"] .question-select li:nth-of-type(3){
  aspect-ratio: 273/298;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q3_obj_03.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 42.66vw;
  top: 50vw;
  left: 15.3125vw;
}


/* question4 ----------------------------------------*/
.question[data-num="4"] .question-select{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  column-gap: 1.25vw;
  row-gap: 2.19vw;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 63.75vw;
}
.question[data-num="4"][data-type="1"] .question-select{
  top: 25%;
}
.question[data-num="4"][data-type="2"] .question-select{
  top: 42%;
}
.question[data-num="4"][data-type="3"] .question-select{
  top: 42%;
}

.question[data-num="4"] .question-select li{
  width: calc(50% - 0.625vw);
  position: relative;
}
.question[data-num="4"] .question-select li::after{
  display: none;
}

.question[data-num="4"] .question-select li label{
  width: 100%;
  height: 10.9375vw;
  background-color: #fff;
  border-radius: 100vw;
  box-sizing: border-box;
  font-size: 4.0625vw;
  font-weight: 800;
  display: flex;
  justify-content: center;
  align-items: center;
}
.question[data-num="4"] .question-select li input[type=checkbox]:checked + label{
  background-color: #000;
  color: #fff;
}
.question[data-num="4"] .question-select li input{
  display: none;
}

/* question5 ----------------------------------------*/
.question[data-num="5"] .question-select li:nth-of-type(1){
  aspect-ratio: 248/257;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_01.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 38.75vw;
  top: -3vw;
  left: 10.625vw;
}
.question[data-num="5"] .question-select li:nth-of-type(2){
  aspect-ratio: 82/75;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_02.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 40.16vw;
  top: -1.5vw;
  right: 13.625vw;
}
.question[data-num="5"] .question-select li:nth-of-type(3){
  aspect-ratio: 302/202;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_03.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 47.18vw;
  top: 31vw;
  left: 4.3125vw;
  z-index: 1;
}
.question[data-num="5"] .question-select li:nth-of-type(4){
  aspect-ratio: 219/245;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_04.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 34.22vw;
  top: 28.5vw;
  right: 9vw;
}
.question[data-num="5"] .question-select li:nth-of-type(5){
  aspect-ratio: 288/265;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_05.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 45vw;
  top: 54vw;
  left: 10vw;
}
.question[data-num="5"] .question-select li:nth-of-type(6){
  aspect-ratio: 235/250;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_06.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 36.72vw;
  top: 60vw;
  right: 7vw;
}

/* question6 ----------------------------------------*/
.question[data-num="6"] .question-select li:nth-of-type(1){
  aspect-ratio: 289/278;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q6_obj_01.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 45.15vw;
  top: 3.6875vw;
  left: 7.8125vw;
}
.question[data-num="6"] .question-select li:nth-of-type(2){
  aspect-ratio: 318/310;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q6_obj_02.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 49.68vw;
  top: 15.5vw;
  right: 4.6875vw;
  z-index: 1;
}
.question[data-num="6"] .question-select li:nth-of-type(3){
  aspect-ratio: 11/10;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/q6_obj_03.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 45.94vw;
  top: 53vw;
  left: 17.3125vw;
}






.question-select li::after{
  content: '';
  aspect-ratio: 142/81;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/obj_selected.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  display: block;
  width: 22.1875vw;
  height: auto;
  position: absolute;
  top: -2vw;
  right: -4vw;
  z-index: 2;
  transition: all 0.2s;
  transform: scale(0);
}
.question-select li.is-active::after{
  transform: scale(1);
}

/* question2 ----------------------------------------*/
.question[data-num="2"] .question-select li:nth-of-type(1)::after{
  top: 1vw;
  right: 1vw;
}
.question[data-num="2"] .question-select li:nth-of-type(2)::after{
  top: -4vw;
  right: 2vw;
}

/* question3 ----------------------------------------*/
.question[data-num="3"] .question-select li:nth-of-type(1)::after{
  top: 2vw;
  right: 3vw;
}
.question[data-num="3"] .question-select li:nth-of-type(2)::after{
  top: -6vw;
  right: 9vw;
}
.question[data-num="3"] .question-select li:nth-of-type(3)::after{
  top: 6vw;
  right: 1vw;
}

/* question5 ----------------------------------------*/
.question[data-num="5"] .question-select li:nth-of-type(1)::after{
  top: -2vw;
  right: 4vw;
}
.question[data-num="5"] .question-select li:nth-of-type(2)::after{
  top: -4vw;
  right: 1vw;
}
.question[data-num="5"] .question-select li:nth-of-type(3)::after{
  top: -4vw;
  right: 5vw;
}
.question[data-num="5"] .question-select li:nth-of-type(4)::after{
  top: -3.5vw;
  right: 1vw;
}
.question[data-num="5"] .question-select li:nth-of-type(5)::after{
  top: 0vw;
  right: 1vw;
}
.question[data-num="5"] .question-select li:nth-of-type(6)::after{
  top: -2vw;
  right: 5vw;
}

/* question6 ----------------------------------------*/
.question[data-num="6"] .question-select li:nth-of-type(1)::after{
  top: -3vw;
  right: 5vw;
}
.question[data-num="6"] .question-select li:nth-of-type(2)::after{
  top: 4vw;
  right: 2vw;
}
.question[data-num="6"] .question-select li:nth-of-type(3)::after{
  top: -1vw;
  right: 8vw;
}




.question-select li p{
  font-size: 4.0625vw;
  font-weight: 800;
  letter-spacing: 0.1em;
  line-height: 1.54;
  text-align: center;
}
/* question1 ----------------------------------------*/
.question[data-num="1"] .question-select li:nth-of-type(2) p{
  margin: 1em 0.5em 0 0;
}
.question[data-num="1"] .question-select li:nth-of-type(3) p{
  margin: 1em 0 0 0;
}
.question[data-num="1"] .question-select li:nth-of-type(4) p{
  margin: 1.6em 0.5em 0 0;
}

/* question2 ----------------------------------------*/
.question[data-num="2"] .question-select li:nth-of-type(1) p{
  margin: 0 0.2em 0 0;
}
.question[data-num="2"] .question-select li:nth-of-type(2) p{
  margin: -0.8em 0 0 0;
}

/* question3 ----------------------------------------*/
.question[data-num="3"] .question-select li:nth-of-type(2) p{
  margin: -1em 0 0 -0.8em;
  text-indent: -0.5em;
}
.question[data-num="3"] .question-select li:nth-of-type(3) p{
  margin: 1.2em 0 0 2em;
}

/* question6 ----------------------------------------*/
.question[data-num="5"] .question-select li:nth-of-type(6) p{
  margin: -0.3em 0 0 -0.6em;
}

/* question6 ----------------------------------------*/
.question[data-num="6"] .question-select li:nth-of-type(1) p{
  margin: -1em 0 0 0;
}
.question[data-num="6"] .question-select li:nth-of-type(2) p{
  margin: -0.4em 0 0 0.5em;
}



/***************************************************
  result
***************************************************/

.result-wrap{
  padding: 7.8vw 5.47vw 36vw 5.47vw;
  position: relative;
}
.result-wrap h2{
  aspect-ratio: 212/54;
  margin: 0 auto;
  width: 33.125vw;
  height: auto;
  position: relative;
}
.result-wrap h2 img{
  width: 100%;
  height: auto;
}
.result-wrap h2::after{
  content: '';
  aspect-ratio: 74/28;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_title_obj.svg');
  background-repeat: no-repeat;
  background-size: 100% auto;
  display: block;
  width: 11.56vw;
  height: auto;
  position: absolute;
  bottom: -8vw;
  right: 0;
  left: 0;
  margin: auto;
}



.result-wrap .shindan-result{
  background-repeat: no-repeat;
  background-size: 100% auto;
  box-sizing: border-box;
  height: auto;
  margin: 3vw auto 0 auto;
}
.shindan-wrap[data-result="1"] .result-wrap .shindan-result{
  aspect-ratio: 549/1084;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_01.svg');
  width: 85.78vw;
  padding-top: 46vw;
}
.shindan-wrap[data-result="2"] .result-wrap .shindan-result{
  aspect-ratio: 549/1005;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_02.svg');
  background-position: 0 8vw;
  width: 85.78vw;
  padding-top: 46vw;
  padding-bottom: 22vw;
}
.shindan-wrap[data-result="3"] .result-wrap .shindan-result{
  aspect-ratio: 549/986;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_03.svg');
  background-position: 0 10vw;
  width: 85.78vw;
  padding-top: 50vw;
  padding-bottom: 16vw;
}
.shindan-wrap[data-result="4"] .result-wrap .shindan-result{
  aspect-ratio: 549/1089;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_04.svg');
  width: 85.78vw;
  padding-top: 46vw;
}
.shindan-wrap[data-result="5"] .result-wrap .shindan-result{
  aspect-ratio: 549/1067;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_05.svg');
  background-position: 0 3vw;
  width: 85.78vw;
  padding-top: 46vw;
  padding-bottom: 24vw;
}
.shindan-wrap[data-result="6"] .result-wrap .shindan-result{
  aspect-ratio: 549/1084;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_06.svg');
  background-position: 0 9vw;
  width: 85.78vw;
  padding-top: 42vw;
}
.shindan-wrap[data-result="7"] .result-wrap .shindan-result{
  aspect-ratio: 574/1017;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_07.svg');
  background-position: 0 9vw;
  width: 89.69vw;
  padding-top: 44vw;
  padding-bottom: 16vw;
}
.shindan-wrap[data-result="8"] .result-wrap .shindan-result{
  aspect-ratio: 549/1084;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_08.svg');
  background-position: 0 9vw;
  width: 85.78vw;
  padding-top: 44vw;
}




.result-wrap .shindan-result h3{
  margin: auto;
  height: auto;
  position: absolute;
  left: 0;
  right: 0;
}
.shindan-wrap[data-result="1"] .result-wrap .shindan-result h3{
  aspect-ratio: 349/168;
  width: 54.53vw;
  top: 43vw;
}
.shindan-wrap[data-result="2"] .result-wrap .shindan-result h3{
  aspect-ratio: 357/168;
  width: 55.78vw;
  top: 42vw;
}
.shindan-wrap[data-result="3"] .result-wrap .shindan-result h3{
  aspect-ratio: 308/168;
  width: 48.125vw;
  top: 44vw;
}
.shindan-wrap[data-result="4"] .result-wrap .shindan-result h3{
  aspect-ratio: 292/168;
  width: 45.625vw;
  top: 44vw;
}
.shindan-wrap[data-result="5"] .result-wrap .shindan-result h3{
  aspect-ratio: 284/168;
  width: 44.375vw;
  top: 44vw;
}
.shindan-wrap[data-result="6"] .result-wrap .shindan-result h3{
  aspect-ratio: 311/168;
  width: 48.59vw;
  top: 42vw;
}
.shindan-wrap[data-result="7"] .result-wrap .shindan-result h3{
  aspect-ratio: 376/168;
  width: 58.75vw;
  top: 42vw;
}
.shindan-wrap[data-result="8"] .result-wrap .shindan-result h3{
  aspect-ratio: 263/168;
  width: 41.09vw;
  top: 42vw;
}


.result-wrap .shindan-result h3 img{
  width: 100%;
  height: auto;
}

.result-wrap .shindan-result #js-lottie-result{
  aspect-ratio: 283.06/288.56;
  width: 88%;
  margin: 0 auto;
  position: relative;
}

/* comment ----------------------------------------*/
.result-wrap .shindan-result #js-lottie-result::before{
  content: '';
  background-repeat: no-repeat;
  background-size: 100% auto;
  display: block;
  height: auto;
  position: absolute;
  top: 0;
  right: 0;
  margin: auto;
}
.shindan-wrap[data-result="1"] .result-wrap .shindan-result #js-lottie-result::before{
  aspect-ratio: 67/162;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_01.svg');
  width: 12vw;
  top: 8vw;
  right: 1vw;
}
.shindan-wrap[data-result="2"] .result-wrap .shindan-result #js-lottie-result::before{
  aspect-ratio: 78/160;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_02.svg');
  width: 12.18vw;
  top: 6vw;
  right: 0vw;
}
.shindan-wrap[data-result="3"] .result-wrap .shindan-result #js-lottie-result::before{
  aspect-ratio: 93/170;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_03.svg');
  width: 14.53vw;
  top: 19vw;
  right: 0vw;
}
.shindan-wrap[data-result="4"] .result-wrap .shindan-result #js-lottie-result::before{
  aspect-ratio: 81/150;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_04.svg');
  width: 12.66vw;
  top: 16vw;
  right: 1vw;
}
.shindan-wrap[data-result="5"] .result-wrap .shindan-result #js-lottie-result::before{
  aspect-ratio: 67/162;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_05.svg');
  width: 12vw;
  top: 25vw;
  right: 4vw;
}
.shindan-wrap[data-result="6"] .result-wrap .shindan-result #js-lottie-result::before{
  aspect-ratio: 67/162;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_06.svg');
  width: 11vw;
  top: 22vw;
  right: 3vw;
}
.shindan-wrap[data-result="7"] .result-wrap .shindan-result #js-lottie-result::before{
  aspect-ratio: 67/162;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_07.svg');
  width: 12vw;
  top: 11vw;
  right: 6vw;
}
.shindan-wrap[data-result="8"] .result-wrap .shindan-result #js-lottie-result::before{
  aspect-ratio: 92/174;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_08.svg');
  width: 14.375vw;
  top: 9vw;
  right: 6vw;
}


/* parts ----------------------------------------*/
.result-wrap .shindan-result #js-lottie-result::after{
  content: '';
  background-repeat: no-repeat;
  background-size: 100% auto;
  display: block;
  height: auto;
  position: absolute;
  top: 0;
  right: 0;
  margin: auto;
}
.shindan-wrap[data-result="1"] .result-wrap .shindan-result #js-lottie-result::after{
  aspect-ratio: 32/83;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_01.svg');
  width: 5vw;
  top: 48vw;
  right: 2vw;
}
.shindan-wrap[data-result="2"] .result-wrap .shindan-result #js-lottie-result::after{
  aspect-ratio: 32/83;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_02.svg');
  width: 5vw;
  top: 48vw;
  right: 2vw;
}
.shindan-wrap[data-result="3"] .result-wrap .shindan-result #js-lottie-result::after{
  aspect-ratio: 32/83;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_03.svg');
  width: 5vw;
  top: 48vw;
  right: 6vw;
}
.shindan-wrap[data-result="4"] .result-wrap .shindan-result #js-lottie-result::after{
  aspect-ratio: 32/83;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_01.svg');
  width: 5vw;
  top: 48vw;
  right: 2vw;
}
.shindan-wrap[data-result="5"] .result-wrap .shindan-result #js-lottie-result::after{
  aspect-ratio: 32/83;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_04.svg');
  width: 5vw;
  top: 48vw;
  right: 6vw;
}
.shindan-wrap[data-result="6"] .result-wrap .shindan-result #js-lottie-result::after{
  aspect-ratio: 32/83;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_02.svg');
  width: 5vw;
  top: 48vw;
  right: 6vw;
}
.shindan-wrap[data-result="7"] .result-wrap .shindan-result #js-lottie-result::after{
  aspect-ratio: 32/83;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_01.svg');
  width: 5vw;
  top: 36vw;
  right: 4vw;
}
.shindan-wrap[data-result="8"] .result-wrap .shindan-result #js-lottie-result::after{
  aspect-ratio: 23/81;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_05.svg');
  width: 4vw;
  top: 36vw;
  right: 5vw;
}

.result-wrap .shindan-result #js-result-text{
  font-size: 3.75vw;
  font-weight: 700;
  line-height: 2.1;
  margin: -2.5em auto 0 auto;
  width: 64.22vw;
}




/* recommend ----------------------------------------*/
.result-wrap .shindan-recommend{
  background-color: #fff;
  box-sizing: border-box;
  border: 4px solid #000;
  border-radius: 44.92vw 44.92vw 0 0;
  box-shadow: 1vw 1vw 1px #000;
  margin: 16vw auto 0 auto;
  padding: 23.44vw 6.25vw 18.75vw;
  position: relative;
  width: 91.41vw;
}
.result-wrap .shindan-recommend h3{
  aspect-ratio: 339/120;
  width: 52.97vw;
  margin: 0 auto;
}
.result-wrap .shindan-recommend h3 img{
  width: 100%;
  height: auto;
}

.result-wrap .shindan-recommend .shindan-recipe{
  margin: 10vw 0 0 0;
}

.result-wrap .shindan-recommend .shindan-recipe #js-recipe-img{
  border: 4px solid #000;
}

.result-wrap .shindan-recommend .shindan-recipe #js-recipe-title{
  font-size: 4.7vw;
  font-weight: 800;
  letter-spacing: 0.05em;
  margin: 1em 0 0.5em 0;
}

.result-wrap .shindan-recommend .shindan-recipe #js-recipe-text{
  font-size: 3.75vw;
  font-weight: 500;
  line-height: 1.67;
}
.result-wrap .shindan-recommend .shindan-recipe .btn-wrap{
}

.result-wrap .shindan-recommend .shindan-recipe .btn-wrap a#js-recipe-link.btn{
}
.result-wrap .shindan-recommend .shindan-recipe .btn-wrap a#js-recipe-link.btn span{
}


.result-wrap .shindan-recommend .shindan-sauce{
  background-color: #f1d521;
  box-sizing: border-box;
  border: 4px solid #000;
  border-radius: 10vw;
  margin: 10vw auto 0 auto;
  padding: 8vw 0 6.5vw 0;
  position: relative;
}
.result-wrap .shindan-recommend .shindan-sauce h4{
  aspect-ratio: 236/34;
  width: 36.875vw;
  margin: 0 auto 6.5vw auto;
}
.result-wrap .shindan-recommend .shindan-sauce h4 img{
  width: 100%;
  height: auto;
}

.result-wrap .shindan-recommend .shindan-sauce ul{
  display: flex;
  position: relative;
}
.result-wrap .shindan-recommend .shindan-sauce ul::after{
  content: '';
  display: block;
  background-color: #000;
  width: 0.625vw;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  margin: auto;
}


.result-wrap .shindan-recommend .shindan-sauce ul li{
  width: 50%;
}

.result-wrap .shindan-recommend .shindan-sauce ul li .sauce-img{
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: auto;
  overflow: hidden;
}
.result-wrap .shindan-recommend .shindan-sauce ul li .sauce-img img{
  width: auto;
  height: 100%;
  object-fit: contain;
}
.result-wrap .shindan-recommend .shindan-sauce ul li .sauce-img img[data-type="square"]{
  height: 60%;
  margin: 36% 0 0 0;
}

.result-wrap .shindan-recommend .shindan-sauce ul li p{
  font-size: 3.75vw;
  font-weight: 700;
  margin: 0.5em 0 0 0;
  line-height: 1.42;
  text-align: center;
}


.result-wrap .shindan-sns{
  margin: 13.44vw 0 0 0;
}
.result-wrap .shindan-sns h3{
  background-color: #fff;
  border-radius: 10vw;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 51.25vw;
  height: 10.625vw;
  margin: 0 auto 3.75vw auto;
}
.result-wrap .shindan-sns h3 span{
  font-size: 4.2vw;
  font-weight: 700;
  text-align: center;
}


.result-wrap .shindan-sns ul{
  display: flex;
  justify-content: center;
  gap: 5.3vw;
  width: 42vw;
  margin: 0 auto;
}
.result-wrap .shindan-sns ul li{
  width: 100%;
}
.result-wrap .shindan-sns ul li a{
}
.result-wrap .shindan-sns ul li a img{
  width: 100%;
  height: auto;
}
.result-wrap .shindan-sns ul li:nth-of-type(1) a img{
  transform: scale(0.8);
}

.result-wrap .shindan-recommend .btn-wrap{
  margin: 7vw 0 0 0;
}
.result-wrap .shindan-recommend .btn-wrap a.btn{
  font-size: 3.75vw;
  font-weight: 700;
  width: 65.625vw;
  height: 14.84vw;
  letter-spacing: 0.1em;
  line-height: 1.25;
  text-align: center;
}


.result-wrap .shindan-sns + .btn-wrap{
  margin: 10vw 0 0 0;
}
.result-wrap .shindan-sns + .btn-wrap a.btn{
  /* font-size: 3.75vw; */
  font-size: 4.7vw;
  font-weight: 700;
  width: 76.25vw;
  height: 14.84vw;
  letter-spacing: 0.1em;
  line-height: 1.25;
  text-align: center;
}

.result-wrap .result-bg div{
  position: absolute;
  display: block;
  height: auto;
  position: absolute;
}
.result-wrap .result-bg div[data-num="1"]{
  aspect-ratio: 188/192;
  width: 29.375vw;
  top: -8vw;
  left: -10vw;
  z-index: 0;
}
.result-wrap .result-bg div[data-num="2"]{
  aspect-ratio: 118/118;
  width: 18.44vw;
  top: 24vw;
  right: -4vw;
  z-index: 0;
}
.result-wrap .result-bg div[data-num="3"]{
  aspect-ratio: 220/204;
  width: 34.375vw;
  top: 182vw;
  right: -22vw;
  z-index: 0;
}
.result-wrap .result-bg div[data-num="4"]{
  aspect-ratio: 151/165;
  width: 23.6vw;
  top: 225vw;
  left: -10vw;
  z-index: 0;
}
.result-wrap .result-bg div[data-num="5"]{
  aspect-ratio: 109/109;
  width: 17vw;
  top: 336vw;
  right: -6vw;
  z-index: 0;
}
.result-wrap .result-bg div[data-num="6"]{
  aspect-ratio: 113/100;
  width: 17.65vw;
  top: 506vw;
  left: -9vw;
  z-index: 0;
}



.shindan-bnr{
  background: #ffffff;
  padding: 0 4.45vw 22vw 4.45vw;
  position: relative;
}
.shindan-bnr li:nth-of-type(n+2){
  margin: 3vw 0 0 0;
}




.loading{
  display: none;
  background-color: #e4e4e4;
  height: 100vh;
  overflow: hidden;
  position: fixed;
  left: 0;
  width: 100%;
  z-index: 1;
}
.loading.is-active{
  display: block;
}
.loading::before{
  content: '';
  display: block;
  width: 100%;
  height: 31.25vw;
  background: url('../img/btm_wave_7.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
  background-size: auto 31.25vw;
  bottom: -0.06vw;
  position: absolute;
  left: 0;
  z-index: 0;
  animation: scroll_anim_R 60s linear infinite;
}
.loading::after{
  content: '';
  display: block;
  width: 100%;
  height: 16vw;
  background: url('../img/scroll_label.png') left bottom repeat-x;
  background-size: auto 16vw;
  bottom: 1vw;
  position: absolute;
  left: 0;
  z-index: 0;
  animation: scroll_anim_L 150s linear infinite;
}



.loading .loading-inner{
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 38vw;
}
.loading .loading-inner .loading-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 50.625vw;
  margin: 0 auto;
}
.loading .loading-inner .loading-head .loading-head-text{
  aspect-ratio: 203/71;
  width: 31.72vw;
}
.loading .loading-inner .loading-head .loading-head-text img{
  width: 100%;
  height: auto;
}
.loading .loading-inner .loading-head .loading-head-icon{
  display: flex;
  align-items: center;
  gap: 3vw;
}
.loading .loading-inner .loading-head .loading-head-icon p{
  aspect-ratio: 13/17;
  width: 2.03vw;
  transform: scale(0);
}
.loading.is-active .loading-inner .loading-head .loading-head-icon p:nth-of-type(1){
  animation: loading_anim_icon 5s linear infinite;
}
.loading.is-active .loading-inner .loading-head .loading-head-icon p:nth-of-type(2){
  animation: loading_anim_icon 5s linear 1s infinite;
}
.loading.is-active .loading-inner .loading-head .loading-head-icon p:nth-of-type(3){
  animation: loading_anim_icon 5s linear 2s infinite;
}

.loading .loading-inner .loading-head .loading-head-icon p img{
  width: 100%;
  height: auto;
}

.loading .loading-inner .loading-img{
  width: 35.3125vw;
  margin: 0 auto 38vw auto;
  position: relative;
}

.loading .loading-inner .loading-img .loading-baroon{
  aspect-ratio: 210/150;
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 23vw;
  position: absolute;
  top: -20vw;
  right: -4vw;
}
.loading.is-active .loading-inner .loading-img .loading-baroon{
  animation: loading_anim_baroon 2.25s step-end infinite;
}
.loading.is-end .loading-inner .loading-img .loading-baroon{
  aspect-ratio: 150/100;
  animation: loading_anim_baroon_end 1.5s linear forwards;
  background-image: url('/sp/ouchi_yakiniku/shindan/img/loading_baroon_04.svg');
}
.loading .loading-inner .loading-img .loading-baroon img{
  width: 100%;
  height: auto;
}

.loading .loading-inner .loading-img .loading-obj{
  aspect-ratio: 95/140;
  width: 14.84vw;
  position: absolute;
  top: -5vw;
  right: -5vw;
}
.loading.is-active .loading-inner .loading-img .loading-obj{
  animation: loading_anim_obj 1.5s ease-in-out infinite;
}
.loading.is-end .loading-inner .loading-img .loading-obj{
  animation: loading_anim_obj_end 1.5s linear forwards;
}
.loading .loading-inner .loading-img .loading-obj img{
  width: 100%;
  height: auto;
}

.loading .loading-inner .loading-img .loading-door-2{
  aspect-ratio: 226/241;
  width: 35.3125vw;
  position: absolute;
  bottom: 0;
  left: 0;
}
.loading.is-active .loading-inner .loading-img .loading-door-2{
  animation: loading_anim_door 1.5s ease-in-out infinite;
}
.loading.is-end .loading-inner .loading-img .loading-door-2{
  animation: loading_anim_door_end 1.5s linear forwards;
}
.loading .loading-inner .loading-img .loading-door-2 img{
  width: 100%;
  height: auto;
}




@keyframes loading_anim_icon{
  0%{
    transform: scale(0);
  }
  10%{
    transform: scale(1);
  }
  50%{
    transform: scale(1);
  }
  60%{
    transform: scale(0);
  }
  100%{
    transform: scale(0);
  }
}

@keyframes loading_anim_door{
  0%{
    transform: rotateY(20deg) translate(-3vw, 0);
  }
  50%{
    transform: rotateY(35deg) translate(-4vw, 0);
  }
  100%{
    transform: rotateY(35deg) translate(-4vw, 0);
  }
}

@keyframes loading_anim_door_end{
  0%{
    transform: rotateY(35deg) translate(-4vw, 0);
  }
  100%{
    transform: rotateY(0deg) translate(0, 0);
  }
}

@keyframes loading_anim_obj{
  0% {
    transform: translate(-2vw, 2vw) rotate(0deg);
  }

  10% {
    transform: translate(-2vw, 2vw) rotate(0deg);
  }

  20% {
    transform: translate(-2vw, 2vw) rotate(0deg);
  }

  40% {
    transform: translate(-2vw, 2vw) rotate(3deg);
  }

  80% {
    transform: translate(-2vw, 2vw) rotate(-3deg);
  }

  100% {
    transform: translate(-2vw, 2vw) rotate(0deg);
  }
}

@keyframes loading_anim_obj_end{
  0% {
    transform: translate(-2vw, 2vw) rotate(0deg);
  }

  100% {
    transform: translate(-10vw, 10vw) rotate(0deg);
  }
}

@keyframes loading_anim_baroon{
  0%{
    background-image: url('/sp/ouchi_yakiniku/shindan/img/loading_baroon_01.svg');
  }
  40%{
    background-image: url('/sp/ouchi_yakiniku/shindan/img/loading_baroon_02.svg');
  }
  80%{
    background-image: url('/sp/ouchi_yakiniku/shindan/img/loading_baroon_03.svg');
  }
}
@keyframes loading_anim_baroon_end{
  0%{
    transform: scale(1.1);
  }
  80%{
    transform: scale(1.1);
  }
  100%{
    transform: scale(0);
  }
}

/*
@keyframes loading_anim_door{
  0%{
    transform: rotateY(0deg) translate(0, 0);
  }
  30%{
    transform: rotateY(35deg) translate(-4vw, 0);
  }
  60%{
    transform: rotateY(35deg) translate(-4vw, 0);
  }
  80%{
    transform: rotateY(0deg) translate(0, 0);
  }
  100%{
    transform: rotateY(0deg) translate(0, 0);
  }
}

@keyframes loading_anim_obj{
  0%{
    transform: translate(-10vw, 10vw);
  }
  30%{
    transform: translate(0, 0);
  }
  60%{
    transform: translate(0, 0);
  }
  80%{
    transform: translate(-10vw, 10vw);
  }
  100%{
    transform: translate(-10vw, 10vw);
  }
}

@keyframes loading_anim_baroon{
  0%{
    transform: scale(0);
  }
  30%{
    transform: scale(1);
  }
  60%{
    transform: scale(1);
  }
  80%{
    transform: scale(0);
  }
  100%{
    transform: scale(0);
  }
}

*/


@media screen and (min-width : 768px){


  .shindan-cnt{
    width: 450px;
    height: 760px;
    background: linear-gradient(rgb(228, 228, 228) 0%, rgb(228, 228, 228) 60%, rgba(255, 255, 255, 0) 80%, rgba(255, 255, 255, 0) 100%);
    box-sizing: border-box;
    border: 4px solid;
    border-radius: 40px;
    box-shadow: 10px 10px 1px #000;
    /* overflow-x: hidden; */
    /* overflow-y: auto; */
    position: relative;
    z-index: 1;
    transition: scale 0.3s;
  }

  .shindan-inner{
    max-width: 1440px;
    margin: 0 auto;
    position: relative;
  }
  .shindan-wrap{
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100vw;
    padding: 40px 11.39% 120px 0;
    margin: 0 calc(50% - 50vw);
  }

  .shindan-wrap .only-pc{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    gap: 20px;
  }
  .shindan-wrap .only-pc h2{
    aspect-ratio: 378/260;
    margin: min(-2.7vw,-34px) auto 0 auto;
    width: min(24.38vw, 378px);
    transform: translate(5%, 0);
  }
  .shindan-wrap .only-pc h2 img{
    width: 100%;
    height: auto;
  }



  .shindan-outer.is-loading{
    max-height: 100%;
  }
  
  .btn-wrap{
    display: flex;
    justify-content: center;
    gap: 10px;
  }
  .shindan-step[data-num="0"] .btn-wrap{
    margin: 30px 0 36px 0;
  }
  .btn-wrap .btn{
    width: 110px;
    height: 44px;
    background-color: #000;
    border-radius: 100vw;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    font-size: 18px;
    font-family: 'Noto Sans Japanese';
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    -webkit-appearance: none;
    appearance: none;
    border: none;
    outline: none;
  }
  .shindan-wrap[data-type="result"] .btn-wrap .btn::after{
    content: "";
    display: block;
    position: absolute;
    top: 0; bottom: 0;
    margin: auto;
    vertical-align: middle;
    width: 0.4em;
    height: 0.4em;
    border-top: 2px solid #ffffff;
    border-left: 2px solid #ffffff;
    transform: rotate(135deg);
  }
  .shindan-wrap[data-type="result"] .shindan-recommend .btn-wrap .btn::after{
    right: 1.2em;
  }
  .shindan-wrap[data-type="result"] .btn-wrap[data-type="return"] .btn::after{
    width: 0.48em;
    height: 0.48em;
    left: 1.5em;
    transform: rotate(-45deg);
  }
  .only-pc .btn-wrap .btn,
  .shindan-step[data-num="0"] .btn-wrap .btn{
      width: 230px;
    height: 58px;
    cursor: pointer;
  }
  .shindan-wrap:not([data-step="0"]) .only-pc .btn-wrap .btn{
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
  
  
  .btn-wrap .btn img{
    width: 120px;
  }
  .btn-wrap .btn:hover{
    background-color: #4e4e4e;
    text-decoration: none;
  }
  
  
  
  
  #shindan-form{
    width: 442px;
    height: 100%;
  }
  .shindan-step[data-num="0"]{
    height: 100%;
    padding: 48px 35px 0 35px;
    overflow: hidden;
  }
  .shindan-step:not([data-num="0"]){
    padding: 74px 0 40px 0;
  }
  
  .shindan-step[data-num="1"]::before{
    aspect-ratio: 74/66;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_bg_01.svg');
    width: 50px;
    top: 184px;
    right: 84px;
  }
  .shindan-step[data-num="1"]::after{
    aspect-ratio: 73/78;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_bg_02.svg');
    width: 49px;
    top: 533px;
    left: 40px;
  }
  
  .shindan-step[data-num="2"]::before{
    aspect-ratio: 106/97;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q2_bg_01.svg');
    width: 71px;
    top: 200px;
    right: 78px;
  }
  .shindan-step[data-num="2"]::after{
    aspect-ratio: 92/96;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q2_bg_02.svg');
    width: 62px;
    top: 440px;
    left: 68px;
  }
  
  .shindan-step[data-num="3"]::before{
    aspect-ratio: 82/64;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q3_bg_01.svg');
    width: 55px;
    top: 236px;
    right: 84px;
  }
  .shindan-step[data-num="3"]::after{
    aspect-ratio: 90/90;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q3_bg_02.svg');
    width: 60px;
    top: 477px;
    left: 20px;
  }
  
  .shindan-step[data-num="5"]::before{
    aspect-ratio: 64/99;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_bg_01.svg');
    width: 43px;
    top: 80px;
    right: 40px;
  }
  .shindan-step[data-num="5"]::after{
    aspect-ratio: 76/84;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_bg_02.svg');
    width: 51px;
    top: 555px;
    left: 25px;
  }
  
  .shindan-step[data-num="6"]::before{
    aspect-ratio: 107/55;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q6_bg_01.svg');
    width: 72px;
    top: 180px;
    right: 40px;
  }
  .shindan-step[data-num="6"]::after{
    aspect-ratio: 83/99;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q6_bg_02.svg');
    width: 56px;
    top: 350px;
    left: 40px;
  }
  
  
  
  
  
  .shindan-step[data-num="0"] h2{
    aspect-ratio: 372/203.64;
    margin: 0 0 20px 0;
    text-align: center;
  }
  .shindan-step[data-num="0"] h2 img{
    width: 296px;
    margin: 0 auto;
    transform: translate(10px, 0);
  }
  
  .shindan-step[data-num="0"] p{
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0.15em;
    line-height: 2.16;
    margin: 0 0 20px 0;
  }
  
  .swiper-slide .inc-lottie{
    transform: scale(1);
    transition: transform 0.6s;
  }
  .swiper-slide-active .inc-lottie{
    transform: scale(1.6);
  }
  
  .shindan-wrap::after{
    content: '';
    display: block;
    width: 100%;
    height: 210px;
    background: url('../img/btm_wave_0.png') left top repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
    position: absolute;
    bottom: -12px;
    left: 0;
    z-index: 0;
    animation: scroll_anim_R 240s linear infinite;
  }
  .shindan-wrap[data-type="result"]::after{
    bottom: -12px;
  }

  /* step毎の色変更 ----------------------------------------*/
  .shindan-wrap[data-step="1"]::after{
    background: url('../img/btm_wave_1.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-step="2"]::after{
    background: url('../img/btm_wave_2.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-step="3"]::after{
    background: url('../img/btm_wave_3.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-step="4"]::after{
    background: url('../img/btm_wave_4.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-step="5"]::after{
    background: url('../img/btm_wave_5.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-step="6"]::after{
    background: url('../img/btm_wave_6.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-step="7"]::after{
    background: url('../img/btm_wave_7.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  
  
  /* resultでの色変更 ----------------------------------------*/
  .shindan-wrap[data-result="1"]::after{
    background: url('../img/btm_wave_1.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-result="2"]::after{
    background: url('../img/btm_wave_2.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-result="3"]::after{
    background: url('../img/btm_wave_6.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-result="4"]::after{
    background: url('../img/btm_wave_3.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-result="5"]::after{
    background: url('../img/btm_wave_5.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-result="6"]::after{
    background: url('../img/btm_wave_4.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-result="7"]::after{
    background: url('../img/btm_wave_7.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }
  .shindan-wrap[data-result="8"]::after{
    background: url('../img/btm_wave_0.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
  }



  .shindan-outer::after{
    content: '';
    display: block;
    width: 100%;
    height: 90px;
    background: url('../img/scroll_label.png') left bottom repeat-x;
    background-size: auto 90px;
    bottom: 10px;
    position: absolute;
    left: 0;
    z-index: 0;
    animation: scroll_anim_L 400s linear infinite;
  }


  @keyframes scroll_anim_R{
    100%{
      background-position: -8000% 0;
    }
  }
  
  @keyframes scroll_anim_L{
    100%{
      background-position: 8000% 0;
    }
  }
  








  .question-ttl{
    margin: 0 0 24px 0;
    text-align: center;
    position: relative;
  }
  .question-num{
    aspect-ratio: 1/1;
    position: absolute;
    top: -2em;
    left: 2em;
    width: 78px;
    height: auto;
  }
  .question-txt,
  .question-txt span{
    font-size: 23px;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1.8;
    margin: 0 0 1em 0;
    text-align: center;
  }
  
  /* q4のみ ----------------------------------------*/
  .question-wrap{
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    margin: 0 auto 20px auto;
    height: 400px;
    position: relative;
  }
  .question-wrap > p{
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0.1em;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
  }
  .question[data-num="4"][data-type="1"] .question-wrap > p{
    top: 14%;
  }
  .question[data-num="4"][data-type="2"] .question-wrap > p{
    top: 26%;
  }
  .question[data-num="4"][data-type="3"] .question-wrap > p{
    top: 25%;
  }
  
  .question[data-num="4"][data-type="1"] .question-wrap{
    aspect-ratio: 538/557;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_obj_01.svg');
    width: 360px;
  }
  .question[data-num="4"][data-type="2"] .question-wrap{
    aspect-ratio: 589/520;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_obj_02.svg');
    width: 395px;
  }
  .question[data-num="4"][data-type="3"] .question-wrap{
    aspect-ratio: 530/500;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_obj_03.svg');
    width: 355px;
  }
  
  .question-wrap::after{
    content: '';
    background-repeat: no-repeat;
    background-size: 100% auto;
    display: block;
    height: auto;
    position: absolute;
    top: -2vw;
    right: -4vw;
  }
  .question[data-num="4"][data-type="1"] .question-wrap::after{
    aspect-ratio: 102/107;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_icon_01.svg');
    width: 68px;
    top: -23px;
    right: 3px;
  }
  .question[data-num="4"][data-type="2"] .question-wrap::after{
    aspect-ratio: 114/99;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_icon_02.svg');
    width: 76px;
    top: -4px;
    right: 36px;
  }
  .question[data-num="4"][data-type="3"] .question-wrap::after{
    aspect-ratio: 113/124;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q4_icon_03.svg');
    width: 76px;
    top: -8px;
    right: 12px;
  }
  
  
  
  
  .question:not([data-num="4"]) .question-select{
    height: 420px;
    position: relative;
  }
  .question[data-num="5"] .question-select{
    height: 460px;
  }
  .question[data-num="4"][data-type="1"] .question-select[data-num="2"],
  .question[data-num="4"][data-type="1"] .question-select[data-num="3"],
  .question[data-num="4"][data-type="2"] .question-select[data-num="1"],
  .question[data-num="4"][data-type="2"] .question-select[data-num="3"],
  .question[data-num="4"][data-type="3"] .question-select[data-num="1"],
  .question[data-num="4"][data-type="3"] .question-select[data-num="2"]{
      display: none;
  }
  
  
  
  
  .question-select li{
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    cursor: pointer;
  }
  
  /* question1 ----------------------------------------*/
  .question[data-num="1"] .question-select li:nth-of-type(1){
    aspect-ratio: 238/254;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_obj_01.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 160px;
    top: 10px;
    left: 72px;
    z-index: 1;
  }
  .question[data-num="1"] .question-select li:nth-of-type(2){
    aspect-ratio: 228/254;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_obj_02.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 153px;
    top: 52px;
    right: 42px;
    z-index: 1;
  }
  .question[data-num="1"] .question-select li:nth-of-type(3){
    aspect-ratio: 230/267;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_obj_03.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 154px;
    top: 150px;
    left: 34px;
    z-index: 1;
  }
  .question[data-num="1"] .question-select li:nth-of-type(4){
    aspect-ratio: 242/248;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q1_obj_04.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 162px;
    top: 212px;
    right: 72px;
  }
  
  /* question2 ----------------------------------------*/
  .question[data-num="2"] .question-select li:nth-of-type(1){
    aspect-ratio: 296/346;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q2_obj_01.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 198px;
    top: 14px;
    left: 32px;
    z-index: 1;
  }
  .question[data-num="2"] .question-select li:nth-of-type(2){
    aspect-ratio: 298/335;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q2_obj_02.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 198px;
    top: 128px;
    right: 32px;
  }
  
  /* question3 ----------------------------------------*/
  .question[data-num="3"] .question-select li:nth-of-type(1){
    aspect-ratio: 300/275;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q3_obj_01.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 201px;
    top: 0;
    left: 45px;
  }
  .question[data-num="3"] .question-select li:nth-of-type(2){
    aspect-ratio: 302/211;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q3_obj_02.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 202px;
    top: 140px;
    right: 26px;
    z-index: 1;
  }
  .question[data-num="3"] .question-select li:nth-of-type(3){
    aspect-ratio: 273/298;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q3_obj_03.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 183px;
    top: 190px;
    left: 78px;
  }
  
  
  /* question4 ----------------------------------------*/
  .question[data-num="4"] .question-select{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    column-gap: 5px;
    row-gap: 10px;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 76%;
  }
  .question[data-num="4"][data-type="1"] .question-select{
    top: 25%;
  }
  .question[data-num="4"][data-type="2"] .question-select{
    top: 42%;
  }
  .question[data-num="4"][data-type="3"] .question-select{
    top: 42%;
  }
  
  .question[data-num="4"] .question-select li{
    width: calc(50% - 0.625vw);
    position: relative;
  }
  .question[data-num="4"] .question-select li::after{
    display: none;
  }
  
  .question[data-num="4"] .question-select li label{
    width: 100%;
    height: 50px;
    background-color: #fff;
    border-radius: 100vw;
    box-sizing: border-box;
    font-size: 17px;
    font-weight: 800;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .question[data-num="4"] .question-select li input[type=checkbox]:checked + label{
    background-color: #000;
    color: #fff;
  }
  .question[data-num="4"] .question-select li input{
    display: none;
  }
  
  /* question5 ----------------------------------------*/
  .question[data-num="5"] .question-select li:nth-of-type(1){
    aspect-ratio: 248/257;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_01.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 166px;
    top: 0;
    left: 54px;
  }
  .question[data-num="5"] .question-select li:nth-of-type(2){
    aspect-ratio: 82/75;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_02.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 172px;
    top: 1px;
    right: 70px;
  }
  .question[data-num="5"] .question-select li:nth-of-type(3){
    aspect-ratio: 302/202;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_03.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 202px;
    top: 145px;
    left: 26px;
    z-index: 1;
  }
  .question[data-num="5"] .question-select li:nth-of-type(4){
    aspect-ratio: 219/245;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_04.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 147px;
    top: 124px;
    right: 40px;
  }
  .question[data-num="5"] .question-select li:nth-of-type(5){
    aspect-ratio: 288/265;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_05.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 193px;
    top: 245px;
    left: 40px;
  }
  .question[data-num="5"] .question-select li:nth-of-type(6){
    aspect-ratio: 235/250;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q5_obj_06.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 157px;
    top: 270px;
    right: 44px;
  }
  
  /* question6 ----------------------------------------*/
  .question[data-num="6"] .question-select li:nth-of-type(1){
    aspect-ratio: 289/278;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q6_obj_01.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 194px;
    top: 0;
    left: 54px;
  }
  .question[data-num="6"] .question-select li:nth-of-type(2){
    aspect-ratio: 318/310;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q6_obj_02.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 213px;
    top: 54px;
    right: 24px;
    z-index: 1;
  }
  .question[data-num="6"] .question-select li:nth-of-type(3){
    aspect-ratio: 11/10;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/q6_obj_03.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 197px;
    top: 210px;
    left: 80px;
  }
  
  
  
  
  
  
  .question-select li::after{
    content: '';
    aspect-ratio: 142/81;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/obj_selected.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    display: block;
    width: 95px;
    height: auto;
    position: absolute;
    top: -12px;
    right: -20px;
    z-index: 2;
    transition: all 0.2s;
    transform: scale(0);
  }
  .question-select li.is-active::after{
    transform: scale(1);
  }
  
  /* question2 ----------------------------------------*/
  .question[data-num="2"] .question-select li:nth-of-type(1)::after{
    top: 5px;
    right: 5px;
  }
  .question[data-num="2"] .question-select li:nth-of-type(2)::after{
    top: -8px;
    right: 5px;
  }
  
  /* question3 ----------------------------------------*/
  .question[data-num="3"] .question-select li:nth-of-type(1)::after{
    top: 10px;
    right: 10px;
  }
  .question[data-num="3"] .question-select li:nth-of-type(2)::after{
    top: -28px;
    right: 41px;
  }
  .question[data-num="3"] .question-select li:nth-of-type(3)::after{
    top: 24px;
    right: 16px;
  }
  
  /* question5 ----------------------------------------*/
  .question[data-num="5"] .question-select li:nth-of-type(1)::after{
    top: -10px;
    right: 25px;
  }
  .question[data-num="5"] .question-select li:nth-of-type(2)::after{
    top: -16px;
    right: 10px;
  }
  .question[data-num="5"] .question-select li:nth-of-type(3)::after{
    top: -23px;
    right: 18px;
  }
  .question[data-num="5"] .question-select li:nth-of-type(4)::after{
    top: -12px;
    right: 10px;
  }
  .question[data-num="5"] .question-select li:nth-of-type(5)::after{
    top: 0;
    right: 10px;
  }
  .question[data-num="5"] .question-select li:nth-of-type(6)::after{
    top: -10px;
    right: 20px;
  }
  
  /* question6 ----------------------------------------*/
  .question[data-num="6"] .question-select li:nth-of-type(1)::after{
    top: -12px;
    right: 16px;
  }
  .question[data-num="6"] .question-select li:nth-of-type(2)::after{
    top: 16px;
    right: 10px;
  }
  .question[data-num="6"] .question-select li:nth-of-type(3)::after{
    top: -2px;
    right: 30px;
  }
  
  
  
  
  .question-select li p{
    font-size: 17px;
    font-weight: 800;
    letter-spacing: 0.1em;
    line-height: 1.54;
    text-align: center;
  }
  /* question1 ----------------------------------------*/
  .question[data-num="1"] .question-select li:nth-of-type(2) p{
    margin: 1em 0.5em 0 0;
  }
  .question[data-num="1"] .question-select li:nth-of-type(3) p{
    margin: 1em 0 0 0;
  }
  .question[data-num="1"] .question-select li:nth-of-type(4) p{
    margin: 1.6em 0.5em 0 0;
  }
  
  /* question2 ----------------------------------------*/
  .question[data-num="2"] .question-select li:nth-of-type(1) p{
    margin: 0 0.2em 0 0;
  }
  .question[data-num="2"] .question-select li:nth-of-type(2) p{
    margin: -0.8em 0 0 0;
  }
  
  /* question3 ----------------------------------------*/
  .question[data-num="3"] .question-select li:nth-of-type(2) p{
    margin: -1em 0 0 -0.8em;
    text-indent: -0.5em;
  }
  .question[data-num="3"] .question-select li:nth-of-type(3) p{
    margin: 1.2em 0 0 2em;
  }
  
  /* question6 ----------------------------------------*/
  .question[data-num="5"] .question-select li:nth-of-type(6) p{
    margin: -0.3em 0 0 -0.6em;
  }

  /* question6 ----------------------------------------*/
  .question[data-num="6"] .question-select li:nth-of-type(1) p{
    margin: -1em 0 0 0;
  }
  .question[data-num="6"] .question-select li:nth-of-type(2) p{
    margin: -0.4em 0 0 0.5em;
  }
  
  
  
  /***************************************************
    result
  ***************************************************/
  
  .result-wrap{
    background: #e4e4e4;
    border-radius: 35px;
    box-sizing: border-box;
    padding: 70px 30px;
    max-height: 100%;
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .result-wrap::-webkit-scrollbar {
    display:none;
  }
  
  .result-wrap h2{
    aspect-ratio: 212/54;
    margin: 0 auto;
    width: 142px;
    height: auto;
    position: relative;
  }
  .result-wrap h2 img{
    width: 100%;
    height: auto;
  }
  .result-wrap h2::after{
    content: '';
    aspect-ratio: 74/28;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_title_obj.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    display: block;
    width: 50px;
    height: auto;
    position: absolute;
    bottom: -40px;
    right: 0;
    left: 0;
    margin: auto;
  }
  
  
  
  .result-wrap .shindan-result{
    background-repeat: no-repeat;
    background-size: 100% auto;
    box-sizing: border-box;
    height: auto;
    margin: 40px auto 0 auto;
  }
  .shindan-wrap[data-result="1"] .result-wrap .shindan-result{
    aspect-ratio: 549/1084;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_01.svg');
    width: 368px;
    padding-top: 200px;
  }
  .shindan-wrap[data-result="2"] .result-wrap .shindan-result{
    aspect-ratio: 549/1005;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_02.svg');
    background-position: 0 20px;
    width: 368px;
    padding-top: 174px;
    padding-bottom: 98px;
  }
  .shindan-wrap[data-result="3"] .result-wrap .shindan-result{
    aspect-ratio: 549/986;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_03.svg');
    background-position: 0 25px;
    width: 368px;
    padding-top: 200px;
    padding-bottom: 62px;
  }
  .shindan-wrap[data-result="4"] .result-wrap .shindan-result{
    aspect-ratio: 549/1089;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_04.svg');
    width: 368px;
    padding-top: 200px;
    margin-top: 20px;
  }
  .shindan-wrap[data-result="5"] .result-wrap .shindan-result{
    aspect-ratio: 549/1067;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_05.svg');
    background-position: 0 0;
    width: 100%;
    padding-top: 200px;
    padding-bottom: 20px;
  }
  .shindan-wrap[data-result="6"] .result-wrap .shindan-result{
    aspect-ratio: 549/1084;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_06.svg');
    background-position: 0 25px;
    width: 368px;
    padding-top: 190px;
  }
  .shindan-wrap[data-result="7"] .result-wrap .shindan-result{
    aspect-ratio: 594/1017;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_07.svg');
    background-position: 0 25px;
    width: 398px;
    padding-top: 180px;
    padding-bottom: 105px;
  }
  .shindan-wrap[data-result="8"] .result-wrap .shindan-result{
    aspect-ratio: 574/1017;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_obj_08.svg');
    background-position: 0 25px;
    width: 384px;
    padding-top: 180px;
    padding-bottom: 115px;
  }
  
  
  
  
  .result-wrap .shindan-result h3{
    margin: auto;
    height: auto;
    position: absolute;
    left: 0;
    right: 0;
  }
  .shindan-wrap[data-result="1"] .result-wrap .shindan-result h3{
    aspect-ratio: 349/168;
    width: 234px;
    top: 250px;
  }
  .shindan-wrap[data-result="2"] .result-wrap .shindan-result h3{
    aspect-ratio: 357/168;
    width: 239px;
    top: 225px;
  }
  .shindan-wrap[data-result="3"] .result-wrap .shindan-result h3{
    aspect-ratio: 308/168;
    width: 206px;
    top: 240px;
  }
  .shindan-wrap[data-result="4"] .result-wrap .shindan-result h3{
    aspect-ratio: 292/168;
    width: 196px;
    top: 240px;
  }
  .shindan-wrap[data-result="5"] .result-wrap .shindan-result h3{
    aspect-ratio: 284/168;
    width: 190px;
    top: 240px;
  }
  .shindan-wrap[data-result="6"] .result-wrap .shindan-result h3{
    aspect-ratio: 311/168;
    width: 208px;
    top: 240px;
  }
  .shindan-wrap[data-result="7"] .result-wrap .shindan-result h3{
    aspect-ratio: 376/168;
    width: 252px;
    top: 238px;
  }
  .shindan-wrap[data-result="8"] .result-wrap .shindan-result h3{
    aspect-ratio: 263/168;
    width: 176px;
    top: 240px;
  }
  
  
  .result-wrap .shindan-result h3 img{
    width: 100%;
    height: auto;
  }
  
  .result-wrap .shindan-result #js-lottie-result{
    aspect-ratio: 337.91/343.41;
    width: 88%;
    height: auto;
    margin: 0 auto;
    position: relative;
  }
  
  /* comment ----------------------------------------*/
  .result-wrap .shindan-result #js-lottie-result::before{
    content: '';
    background-repeat: no-repeat;
    background-size: 100% auto;
    display: block;
    height: auto;
    position: absolute;
    top: 0;
    right: 0;
    margin: auto;
  }
  .shindan-wrap[data-result="1"] .result-wrap .shindan-result #js-lottie-result::before{
    aspect-ratio: 67/162;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_01.svg');
    width: 45px;
    top: 42px;
    right: 14px;
  }
  .shindan-wrap[data-result="2"] .result-wrap .shindan-result #js-lottie-result::before{
    aspect-ratio: 78/160;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_02.svg');
    width: 52px;
    top: 30px;
    right: 0;
  }
  .shindan-wrap[data-result="3"] .result-wrap .shindan-result #js-lottie-result::before{
    aspect-ratio: 93/170;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_03.svg');
    width: 60px;
    top: 56px;
    right: -6px;
  }
  .shindan-wrap[data-result="4"] .result-wrap .shindan-result #js-lottie-result::before{
    aspect-ratio: 81/150;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_04.svg');
    width: 54px;
    top: 72px;
    right: 6px;
  }
  .shindan-wrap[data-result="5"] .result-wrap .shindan-result #js-lottie-result::before{
    aspect-ratio: 80/150;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_05.svg');
    width: 53px;
    top: 92px;
    right: 14px;
  }
  .shindan-wrap[data-result="6"] .result-wrap .shindan-result #js-lottie-result::before{
    aspect-ratio: 67/162;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_06.svg');
    width: 45px;
    top: 75px;
    right: 8px;
  }
  .shindan-wrap[data-result="7"] .result-wrap .shindan-result #js-lottie-result::before{
    aspect-ratio: 67/162;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_07.svg');
    width: 45px;
    top: 44px;
    right: 38px;
  }
  .shindan-wrap[data-result="8"] .result-wrap .shindan-result #js-lottie-result::before{
    aspect-ratio: 92/174;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_comment_08.svg');
    width: 62px;
    top: 58px;
    right: 36px;
  }
  
  
  /* parts ----------------------------------------*/
  .result-wrap .shindan-result #js-lottie-result::after{
    content: '';
    background-repeat: no-repeat;
    background-size: 100% auto;
    display: block;
    height: auto;
    position: absolute;
    top: 0;
    right: 0;
    margin: auto;
  }
  .shindan-wrap[data-result="1"] .result-wrap .shindan-result #js-lottie-result::after{
    aspect-ratio: 32/83;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_01.svg');
    width: 20px;
    top: 165px;
    right: 15px;
  }
  .shindan-wrap[data-result="2"] .result-wrap .shindan-result #js-lottie-result::after{
    aspect-ratio: 32/83;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_02.svg');
    width: 20px;
    top: 190px;
    right: 5px;
  }
  .shindan-wrap[data-result="3"] .result-wrap .shindan-result #js-lottie-result::after{
    aspect-ratio: 32/83;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_03.svg');
    width: 20px;
    top: 170px;
    right: 10px;
  }
  .shindan-wrap[data-result="4"] .result-wrap .shindan-result #js-lottie-result::after{
    aspect-ratio: 32/83;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_01.svg');
    width: 20px;
    top: 180px;
    right: 10px;
  }
  .shindan-wrap[data-result="5"] .result-wrap .shindan-result #js-lottie-result::after{
    aspect-ratio: 32/83;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_04.svg');
    width: 18px;
    top: 180px;
    right: 10px;
  }
  .shindan-wrap[data-result="6"] .result-wrap .shindan-result #js-lottie-result::after{
    aspect-ratio: 32/83;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_02.svg');
    width: 20px;
    top: 180px;
    right: 10px;
  }
  .shindan-wrap[data-result="7"] .result-wrap .shindan-result #js-lottie-result::after{
    aspect-ratio: 32/83;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_01.svg');
    width: 20px;
    top: 168px;
    right: 14px;
  }
  .shindan-wrap[data-result="8"] .result-wrap .shindan-result #js-lottie-result::after{
    aspect-ratio: 23/81;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/result_parts_05.svg');
    width: 15px;
    top: 168px;
    right: 18px;
  }
  
  .result-wrap .shindan-result #js-result-text{
    font-size: 16px;
    font-weight: 700;
    line-height: 2.1;
    margin: -2.5em auto 0 auto;
    width: 75%;
  }
  
  
  
  
  /* recommend ----------------------------------------*/
  .result-wrap .shindan-recommend{
    background-color: #fff;
    box-sizing: border-box;
    border: 4px solid #000;
    border-radius: 200px 200px 0 0;
    box-shadow: 10px 10px 1px #000;
    margin: 80px auto 0 auto;
    padding: 94px 30px 40px;
    position: relative;
    width: 100%;
  }
  .result-wrap .shindan-recommend h3{
    aspect-ratio: 339/120;
    width: 227px;
    margin: 0 auto;
  }
  .result-wrap .shindan-recommend h3 img{
    width: 100%;
    height: auto;
  }
  
  .result-wrap .shindan-recommend .shindan-recipe{
    margin: 45px 0 0 0;
  }
  
  .result-wrap .shindan-recommend .shindan-recipe #js-recipe-img{
    border: 4px solid #000;
  }
  
  .result-wrap .shindan-recommend .shindan-recipe #js-recipe-title{
    font-size: 20px;
    font-weight: 800;
    letter-spacing: 0.05em;
    margin: 1em 0 0.5em 0;
  }
  
  .result-wrap .shindan-recommend .shindan-recipe #js-recipe-text{
    font-size: 16px;
    font-weight: 500;
    line-height: 1.67;
  }
  .result-wrap .shindan-recommend .shindan-recipe .btn-wrap{
  }
  
  .result-wrap .shindan-recommend .shindan-recipe .btn-wrap a#js-recipe-link.btn{
  }
  .result-wrap .shindan-recommend .shindan-recipe .btn-wrap a#js-recipe-link.btn span{
  }
  
  
  .result-wrap .shindan-recommend .shindan-sauce{
    background-color: #f1d521;
    box-sizing: border-box;
    border: 4px solid #000;
    border-radius: 40px;
    margin: 40px auto 0 auto;
    padding: 40px 0 40px 0;
    position: relative;
  }
  .result-wrap .shindan-recommend .shindan-sauce h4{
    aspect-ratio: 236/34;
    width: 158px;
    margin: 0 auto 30px auto;
  }
  .result-wrap .shindan-recommend .shindan-sauce h4 img{
    width: 100%;
    height: auto;
  }
  
  .result-wrap .shindan-recommend .shindan-sauce ul{
    display: flex;
    position: relative;
  }
  .result-wrap .shindan-recommend .shindan-sauce ul::after{
    content: '';
    display: block;
    background-color: #000;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: auto;
  }
  
  
  .result-wrap .shindan-recommend .shindan-sauce ul li{
    width: 50%;
  }
  
  .result-wrap .shindan-recommend .shindan-sauce ul li .sauce-img{
    aspect-ratio: 1/1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: auto;
    overflow: hidden;
  }
  .result-wrap .shindan-recommend .shindan-sauce ul li .sauce-img img{
    width: auto;
    height: 100%;
    object-fit: contain;
  }
  .result-wrap .shindan-recommend .shindan-sauce ul li .sauce-img img[data-type="square"]{
    height: 60%;
    margin: 36% 0 0 0;
  }
  
  .result-wrap .shindan-recommend .shindan-sauce ul li p{
    font-size: 16px;
    font-weight: 700;
    margin: 0.5em 0 0 0;
    line-height: 1.42;
    text-align: center;
  }
  
  
  .result-wrap .shindan-sns{
    margin: 70px 0 0 0;
  }
  .result-wrap .shindan-sns h3{
    background-color: #fff;
    border-radius: 10vw;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 220px;
    height: 46px;
    margin: 0 auto 30px auto;
  }
  .result-wrap .shindan-sns h3 span{
    font-size: 18px;
    font-weight: 700;
    text-align: center;
  }
  
  
  .result-wrap .shindan-sns ul{
    display: flex;
    justify-content: center;
    gap: 22px;
    width: 180px;
    margin: 0 auto;
  }
  .result-wrap .shindan-sns ul li{
    width: 100%;
  }
  .result-wrap .shindan-sns ul li a{
  }
  .result-wrap .shindan-sns ul li a img{
    width: 100%;
    height: auto;
  }
  .result-wrap .shindan-sns ul li:nth-of-type(1) a img{
    transform: scale(0.8);
  }
  
  .result-wrap .shindan-recommend .btn-wrap{
    margin: 20px 0 0 0;
  }
  .result-wrap .shindan-recommend .btn-wrap a.btn{
    font-size: 16px;
    width: 280px;
    height: 64px;
    letter-spacing: 0.1em;
    line-height: 1.25;
    text-align: center;
  }
  
  
  .result-wrap .shindan-sns + .btn-wrap{
    margin: 45px 0 0 0;
  }
  .result-wrap .shindan-sns + .btn-wrap a.btn{
    font-size: 21px;
    width: 327px;
    height: 76px;
    letter-spacing: 0.1em;
    line-height: 1.25;
    text-align: center;
  }
  
  .result-wrap .result-bg div{
    position: absolute;
    display: block;
    height: auto;
    position: absolute;
  }
  .result-wrap .result-bg div[data-num="1"]{
    aspect-ratio: 188/192;
    width: 126px;
    top: -14px;
    left: -38px;
    z-index: 0;
  }
  .result-wrap .result-bg div[data-num="2"]{
    aspect-ratio: 118/118;
    width: 79px;
    top: 178px;
    right: -24px;
    z-index: 0;
  }
  .result-wrap .result-bg div[data-num="3"]{
    aspect-ratio: 220/204;
    width: 147px;
    top: 870px;
    right: -90px;
    z-index: 0;
  }
  .result-wrap .result-bg div[data-num="4"]{
    aspect-ratio: 151/165;
    width: 101px;
    top: 1032px;
    left: -42px;
    z-index: 0;
  }
  .result-wrap .result-bg div[data-num="5"]{
    aspect-ratio: 109/109;
    width: 73px;
    top: 1480px;
    right: -16px;
    z-index: 0;
  }
  .result-wrap .result-bg div[data-num="6"]{
    aspect-ratio: 113/100;
    width: 75px;
    top: 2190px;
    left: -38px;
    z-index: 0;
  }
  
  
  
  .shindan-bnr{
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 20px;
    position: relative;
    width: 100%;
    padding: 0;
    margin: 40px 0 0 0;
  }
  .shindan-bnr li:nth-of-type(n+2){
    margin: 0;
  }
  .shindan-bnr li img{
    width: 100%;
  }
  

  /* loading ----------------------------------------*/
  .loading{
    display: none;
    background-color: #e4e4e4;
    border-radius: 35px;
    height: 750px !important;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0 !important;
    width: 100%;
    z-index: 1;
  }
  .loading.is-active{
    display: block;
  }
  .loading::before,
  .loading::after{
    display: none;
  }

/*
  .loading::before{
    content: '';
    display: block;
    width: 100%;
    height: 210px;
    background: url('../img/btm_wave_7.png') left bottom repeat-x, linear-gradient(180deg, #e4e4e4 0%, #e4e4e4 80%, #ffffff 80%, #ffffff 100%);
    background-size: auto 210px;
    bottom: -12px;
    position: absolute;
    left: 0;
    z-index: 0;
    animation: scroll_anim_R 240s linear infinite;
  }
  .loading::after{
    content: '';
    display: block;
    width: 100%;
    height: 90px;
    background: url('../img/scroll_label.png') left bottom repeat-x;
    background-size: auto 90px;
    bottom: 16px;
    position: absolute;
    left: 0;
    z-index: 0;
    animation: scroll_anim_L 150s linear infinite;
  }
*/  

  .loading .loading-inner{
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
  }
  
  .loading .loading-inner .loading-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 216px;
    margin: 70px auto 0 auto;
  }
  .loading .loading-inner .loading-head .loading-head-text{
    aspect-ratio: 203/71;
    width: 136px;
  }
  .loading .loading-inner .loading-head .loading-head-text img{
    width: 100%;
    height: auto;
  }
  .loading .loading-inner .loading-head .loading-head-icon{
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .loading .loading-inner .loading-head .loading-head-icon p{
    aspect-ratio: 13/17;
    width: 9px;
    transform: scale(0);
  }
  .loading.is-active .loading-inner .loading-head .loading-head-icon p:nth-of-type(1){
    animation: loading_anim_icon 5s linear infinite;
  }
  .loading.is-active .loading-inner .loading-head .loading-head-icon p:nth-of-type(2){
    animation: loading_anim_icon 5s linear 1s infinite;
  }
  .loading.is-active .loading-inner .loading-head .loading-head-icon p:nth-of-type(3){
    animation: loading_anim_icon 5s linear 2s infinite;
  }
  
  .loading .loading-inner .loading-head .loading-head-icon p img{
    width: 100%;
    height: auto;
  }
  
  .loading .loading-inner .loading-img{
    width: 152px;
    margin: 180px auto 260px auto;
    position: relative;
  }
  
  .loading .loading-inner .loading-img .loading-baroon{
    aspect-ratio: 150/107;
    width: 100px;
    position: absolute;
    top: -80px;
    right: -20px;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/loading_baroon_01.svg');
    background-repeat: no-repeat;
    transition: background-image 0.3s;
  }
  .loading.is-active .loading-inner .loading-img .loading-baroon{
    animation: loading_anim_baroon 2.25s step-end infinite;
  }
  .loading.is-end .loading-inner .loading-img .loading-baroon{
    aspect-ratio: 150/100;
    animation: loading_anim_baroon_end 1.5s linear forwards;
    background-image: url('/sp/ouchi_yakiniku/shindan/img/loading_baroon_04.svg');
  }
  .loading .loading-inner .loading-img .loading-baroon img{
    width: 100%;
    height: auto;
  }
  
  .loading .loading-inner .loading-img .loading-obj{
    aspect-ratio: 95/140;
    width: 64px;
    position: absolute;
    top: 0;
    right: 0;
    /* transform: translate(-50px, 50px) rotate(-15deg); */
    transform: translate(10px, -10px) rotate(0deg);
  }
  .loading.is-active .loading-inner .loading-img .loading-obj{
    animation: loading_anim_obj 1.5s ease-in-out infinite;
  }
  .loading.is-end .loading-inner .loading-img .loading-obj{
    animation: loading_anim_obj_end 1.5s linear forwards;
  }
  .loading .loading-inner .loading-img .loading-obj img{
    width: 100%;
    height: auto;
  }
  
  .loading .loading-inner .loading-img .loading-door-2{
    aspect-ratio: 226/241;
    width: 152px;
    position: absolute;
    bottom: 0;
    left: 0;
  }
  .loading.is-active .loading-inner .loading-img .loading-door-2{
    animation: loading_anim_door 1.5s ease-in-out infinite;
  }
  .loading.is-end .loading-inner .loading-img .loading-door-2{
    animation: loading_anim_door_end 1.5s linear forwards;
  }
  .loading .loading-inner .loading-img .loading-door-2 img{
    width: 100%;
    height: auto;
  }

  @keyframes loading_anim_door{
    0%{
      transform: rotateY(20deg) translate(-10px, 0);
    }
    50%{
      transform: rotateY(35deg) translate(-20px, 0);
    }
    100%{
      transform: rotateY(35deg) translate(-20px, 0);
    }
  }

  @keyframes loading_anim_door_end{
    0%{
      transform: rotateY(35deg) translate(-20px, 0);
    }
    100%{
      transform: rotateY(0deg) translate(0, 0);
    }
  }


  @keyframes loading_anim_obj{
    0% {
      transform: translate(10px, -10px) rotate(0deg);
    }
  
    20% {
      transform: translate(10px, -10px) rotate(0deg);
    }
  
    40% {
      transform: translate(10px, -10px) rotate(3deg);
    }

    80% {
      transform: translate(10px, -10px) rotate(-3deg);
    }

    100% {
      transform: translate(10px, -10px) rotate(0deg);
    }
  }

  @keyframes loading_anim_obj_end{
    0% {
      transform: translate(10px, -10px) rotate(0deg);
    }
    100% {
      transform: translate(-50px, 50px) rotate(-0deg);
    }
  }


  /* pcのみ背景 ----------------------------------------*/
  .shindan-bg{
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100vw;
    height: 100%;
    padding: 40px 11.39% 120px 0;
    margin: 0 calc(50% - 50vw);
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
  }
  .shindan-bg-wrap{
    position: relative;
    height: 100%;
  }
  .shindan-bg-wrap[data-type="L"]{
    width: calc(100% - 450px);
  }
  .shindan-bg-wrap[data-type="R"]{
    width: 450px;
  }
  .shindan-bg-wrap div{
    position: absolute;
    display: block;
    height: auto;
    position: absolute;
  }
  .shindan-bg-wrap div[data-num="1"]{
    aspect-ratio: 302/376;
    width: clamp(120px, 16.13vw, 250px);
    top: min(3.548vw, 55px);
    left: min(-15vw, -170px);
    z-index: 0;
    transform: rotate(-35deg);
  }
  .shindan-bg-wrap div[data-num="2"]{
    aspect-ratio: 396/388;
    width: clamp(80px, 10.32vw, 160px);
    bottom: min(12vw, 150px);
    left: min(5.8vw, 90px);
    z-index: 0;
    transform: rotate(-23deg);
  }
  .shindan-bg-wrap div[data-num="3"]{
    aspect-ratio: 364/411;
    width: clamp(85px, 10.97vw, 170px);
    top: min(16vw, 248px);
    right: min(-8.9vw, -138px);
    z-index: 0;
    transform: rotate(-25deg);
  }
  .shindan-bg-wrap div[data-num="4"]{
    aspect-ratio: 373/368;
    width: clamp(70px, 9.03vw, 140px);
    top: min(-1.42vw, -22px);
    right: min(-11.61vw, -180px);
    z-index: 0;
    transform: rotate(30deg);
  }
  .shindan-bg-wrap div[data-num="5"]{
    aspect-ratio: 358/405;
    width: clamp(90px, 11.61vw, 180px);
    top: min(-1.8vw, -20px);
    left: min(16vw, 240px);
    z-index: 0;
    transform: rotate(25deg);
  }
  .shindan-bg-wrap div[data-num="6"]{
    aspect-ratio: 332/378;
    width: clamp(75px, 9.68vw, 150px);
    bottom: min(1.29vw, 20px);
    right: min(-11.74vw, -182px);
    z-index: 0;
    transform: rotate(-30deg);
  }
  .shindan-bg-wrap div[data-num="7"]{
    aspect-ratio: 377/392;
    width: clamp(120px, 15.48vw,240px);
    bottom: min(4vw, 40px);
    left: min(-22vw, -180px);
    z-index: 0;
    transform: rotate(25deg);
  }
  .shindan-bg-wrap div[data-num="8"]{
    aspect-ratio: 320/393;
    width: clamp(80px, 10.32vw, 160px);
    top: min(14vw, 200px);
    left: min(-1vw, -15px);
    z-index: 0;
    transform: rotate(-23deg);
  }
  .shindan-bg-wrap div[data-num="9"]{
    width: clamp(90px, 11.61vw, 180px);
    top: min(8vw, 80px);
    left: min(6.4vw, 200px);
    z-index: 1;
  }


  .shindan-bg-wrap div:not([data-num="9"]) img{
    display: block;
    animation: shake_anim 10s step-end infinite;
  }
  .shindan-bg-wrap div[data-num="1"] img{
  }
  .shindan-bg-wrap div[data-num="2"] img{
    animation-delay: 2s;
  }
  .shindan-bg-wrap div[data-num="3"] img{
    animation-delay: 4s;
  }
  .shindan-bg-wrap div[data-num="4"] img{
    animation-delay: 6s;
  }
  .shindan-bg-wrap div[data-num="5"] img{
    animation-delay: 7s;
  }
  .shindan-bg-wrap div[data-num="6"] img{
    animation-delay: 1s;
  }
  .shindan-bg-wrap div[data-num="7"] img{
    animation-delay: 3s;
  }
  .shindan-bg-wrap div[data-num="8"] img{
    animation-delay: 5s;
  }
  @keyframes shake_anim{
    0%{
      transform: rotate(0deg);
    }
    10%{
      transform: rotate(10deg);
    }
    16%{
      transform: rotate(0deg);
    }
    100%{
      transform: rotate(0deg);
    }
  }



}


/* 個別調整部分 */
@media screen and (min-width: 769px) and (max-width: 1379px){
  .shindan-bg-wrap div[data-num="3"]{
    right: min(-8vw, -100px);
  }
  .shindan-bg-wrap div[data-num="4"]{
    right: min(-12vw, -160px);
  }
  .shindan-bg-wrap div[data-num="6"]{
    right: min(-12vw, -155px);
  }
  .shindan-bg-wrap div[data-num="7"]{
    left: min(-20vw, -180px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px){
  .shindan-cnt{
    scale: 0.9;
  }

  .shindan-bg-wrap div[data-num="5"]{
    left: min(15vw, 240px);
  }

  .shindan-bg-wrap div[data-num="3"]{
    right: min(-7vw, -90px);
  }
  .shindan-bg-wrap div[data-num="4"]{
    right: min(-11vw, -140px);
  }
  .shindan-bg-wrap div[data-num="6"]{
    right: min(-11vw, -140px);
  }
  .shindan-bg-wrap div[data-num="7"]{
    left: min(-20vw, -180px);
  }


}

@media screen and (min-width: 769px) and (max-width: 1079px){
  .shindan-cnt{
    scale: 0.85;
  }

  .shindan-bg-wrap div[data-num="5"]{
    left: min(14vw, 240px);
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px){

  .shindan-wrap > .only-pc{
    display: none;
  }
  .shindan-bg-wrap div[data-num="9"]{
    display: none;
  }

  .shindan-wrap{
    padding: 40px 0 120px 0;
  }


  .shindan-cnt{
    transform: translate(10px, 0);
    scale: 0.8;
  }


  .shindan-bg{
    justify-content: space-between;
    padding: 40px 0 120px 0;
  }
  .shindan-bg-wrap[data-type="L"],
  .shindan-bg-wrap[data-type="R"]{
    width: calc(50% - (450px / 2));
  }

  .shindan-bg-wrap div[data-num="1"]{
    top: min(24vw, 240px);
    left: min(-18vw, -600px);
  }

  .shindan-bg-wrap div[data-num="3"]{
    width: clamp(85px, 12vw, 170px);
    top: min(16vw, 160px);
    right: 0;
    left: min(-1vw, -10px);
  }

  .shindan-bg-wrap div[data-num="4"]{
    width: clamp(70px, 14vw, 140px);
    top: min(-1.42vw, -22px);
    right: min(-1vw, -10px);
  }

  .shindan-bg-wrap div[data-num="6"]{
    width: clamp(75px, 12vw, 150px);
    bottom: min(1.29vw, 20px);
    right: min(-1vw, -10px);
  }

  .shindan-bg-wrap div[data-num="7"]{
    width: clamp(120px, 18vw, 240px);
    bottom: min(24vw, 240px);
    left: min(4vw, 40px);
  }

}

@media screen and (min-width: 769px) and (max-width: 959px){
  .shindan-cnt{
    scale: 0.75;
  }
}

@media screen and (min-width: 1520px){

  .shindan-wrap{
    padding: 40px calc((100vw - 1200px) / 2) 120px 0; 
  }
  .shindan-bg{
    padding: 40px calc((100vw - 1200px) / 2) 120px 0; 
  }

}


@media screen and (min-width: 1681px){

  .shindan-bg-wrap[data-type="R"]{
    transform: translate(2.5vw, 0);
  }

  .shindan-bg-wrap div:not([data-num="1"]):not([data-num="7"]){
    scale: 1.1;
  }

  .shindan-bg-wrap div[data-num="1"]{
    width: clamp(120px, 20vw, 300px);
    top: min(3.548vw, 55px);
    left: min(-15vw, -170px);
  }

  .shindan-bg-wrap div[data-num="3"]{
    width: clamp(100px, 14vw, 200px);
    top: min(16vw, 248px);
    right: min(-8.9vw, -138px);
    left: unset;
  }

  .shindan-bg-wrap div[data-num="4"]{
    width: clamp(80px, 12vw, 160px);
    top: min(-1.42vw, -22px);
    right: min(-10.61vw, -180px);
  }

  .shindan-bg-wrap div[data-num="5"]{
  }

  .shindan-bg-wrap div[data-num="6"]{
    width: clamp(75px, 9.68vw, 150px);
    bottom: min(1.29vw, 20px);
    right: min(-10vw, -182px);
  }

  .shindan-bg-wrap div[data-num="7"]{
    width: clamp(140px, 20vw, 280px);
    bottom: min(2vw, 20px);
    left: min(-24vw, -200px);
  }

  .shindan-bg-wrap div[data-num="8"]{
  }

}
