@charset "UTF-8";
.wrap, .wrap div, .wrap span, .wrap iframe, .wrap h1, .wrap h2, .wrap h3, .wrap h4, .wrap h5, .wrap h6, .wrap p, .wrap img, .wrap small, .wrap strong, .wrap b, .wrap dl, .wrap dt, .wrap dd, .wrap ol, .wrap ul, .wrap li,
.wrap form, .wrap label, .wrap legend, .wrap table, .wrap tbody, .wrap tfoot, .wrap thead, .wrap tr, .wrap th, .wrap td, .wrap footer, .wrap header, .wrap menu, .wrap nav, .wrap section, .wrap video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: bottom;
  background: transparent;
}

html {
  touch-action: manipulation;
}

.wrap {
  line-height: 1;
  -webkit-text-size-adjust: 100%;
}

.wrap ul li {
  list-style: none;
}
.wrap a {
  margin: 0;
  padding: 0;
  color: #333;
  text-decoration: none;
  vertical-align: baseline;
}
.wrap a:hover {
  opacity: 0.7;
}
.wrap table {
  border-spacing: 0;
}
.wrap img {
  width: 100%;
}

/* ===================================================================================
  resetここまで
=================================================================================== */
.wrap {
  max-width: 750px;
  margin: 0 auto 40px;
  overflow: hidden;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック Medium", "Yu Gothic Medium", "メイリオ", Meiryo, sans-serif;
  color: #333;
  font-size: 20px;
}
@media screen and (max-width: 750px) {
  .wrap {
    margin: 0 auto 5.3333333333vw;
    font-size: 2.6666666667vw;
  }
}
.wrap .rel {
  position: relative;
}
.wrap .exit_modal {
  display: none;
  width: 100%;
  height: 100%;
  position: fixed;
  inset: 0;
  z-index: 9999;
}
.wrap .exit_modal.active {
  display: block;
}
.wrap .exit_modal .exit_modal_bg {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  position: absolute;
  inset: 0;
}
.wrap .exit_modal .exit_modal_body {
  width: 480px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 750px) {
  .wrap .exit_modal .exit_modal_body {
    width: 64vw;
  }
}
.wrap .exit_modal .exit_modal_body .exit_modal_close {
  width: 42px;
  height: 42px;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
  position: absolute;
  top: -20px;
  right: -15px;
  z-index: 999;
}
@media screen and (max-width: 750px) {
  .wrap .exit_modal .exit_modal_body .exit_modal_close {
    width: 5.6vw;
    height: 5.6vw;
    top: -2.6666666667vw;
    right: -2vw;
  }
}
.wrap .exit_modal .exit_modal_body .exit_modal_content {
  position: relative;
}
.wrap .exit_modal .exit_modal_body .exit_modal_content .exit_modal_timer {
  color: #1A1A1A;
  font-size: 24px;
  text-align: center;
  font-weight: 500;
  letter-spacing: 0.05em;
  position: absolute;
  top: 30px;
  left: 0;
  right: 0;
}
@media screen and (max-width: 750px) {
  .wrap .exit_modal .exit_modal_body .exit_modal_content .exit_modal_timer {
    font-size: 3.2vw;
    top: 4vw;
  }
}
.wrap .exit_modal .exit_modal_body .exit_modal_content .exit_modal_btn {
  width: 400px;
  margin: 0 auto;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 25px;
}
@media screen and (max-width: 750px) {
  .wrap .exit_modal .exit_modal_body .exit_modal_content .exit_modal_btn {
    width: 53.3333333333vw;
    bottom: 3.3333333333vw;
  }
}
.wrap .fv_area {
  background: url(../img/fv_bg01.jpg) no-repeat top center/100%;
  height: 415px;
}
@media screen and (max-width: 750px) {
  .wrap .fv_area {
    height: 55.3333333333vw;
  }
}
.wrap .fv_area .fv_img01 {
  width: 363px;
  position: absolute;
  top: -42px;
  right: 33px;
}
@media screen and (max-width: 750px) {
  .wrap .fv_area .fv_img01 {
    width: 48.4vw;
    top: -5.6vw;
    right: 4.4vw;
  }
}
.wrap .fv_area .fv_img02 {
  position: absolute;
  top: 325px;
  left: 0;
}
@media screen and (max-width: 750px) {
  .wrap .fv_area .fv_img02 {
    top: 43.3333333333vw;
  }
}
.wrap .worries {
  background: url(../img/worries_bg.png) no-repeat top center/100%;
  height: 351px;
  position: relative;
  z-index: 999;
}
@media screen and (max-width: 750px) {
  .wrap .worries {
    height: 46.8vw;
  }
}
.wrap .worries .worries_img02 {
  padding-top: 110px;
  margin-top: -110px;
}
@media screen and (max-width: 750px) {
  .wrap .worries .worries_img02 {
    padding-top: 14.6666666667vw;
    margin-top: -14.6666666667vw;
  }
}
.wrap .power {
  margin-top: -150px;
  background: #000A14;
  position: relative;
  z-index: 9;
}
@media screen and (max-width: 750px) {
  .wrap .power {
    margin-top: -20vw;
  }
}
.wrap .power .vid04 {
  margin-bottom: 146px;
}
@media screen and (max-width: 750px) {
  .wrap .power .vid04 {
    margin-bottom: 19.4666666667vw;
  }
}
.wrap .power .video_frame {
  width: 610px;
  margin: 0 auto;
  position: absolute;
  top: 683px;
  left: 0;
  right: 0;
}
@media screen and (max-width: 750px) {
  .wrap .power .video_frame {
    width: 81.3333333333vw;
    top: 91.0666666667vw;
  }
}
.wrap .power .video_frame .power_video {
  width: 590px;
  height: 343px;
  margin: 0 auto;
  object-fit: cover;
  position: absolute;
  top: 10px;
  left: 0;
  right: 0;
}
@media screen and (max-width: 750px) {
  .wrap .power .video_frame .power_video {
    width: 78.6666666667vw;
    height: 45.7333333333vw;
    top: 1.3333333333vw;
  }
}
.wrap .mechanism {
  background: url(../img/mechanism_bg01.jpg) no-repeat top center/100%, url(../img/mechanism_bg02.jpg) no-repeat bottom center/100%;
  padding: 90px 0 790px;
}
@media screen and (max-width: 750px) {
  .wrap .mechanism {
    padding: 12vw 0 105.3333333333vw;
  }
}
.wrap .mechanism .video_frame {
  width: 610px;
  margin: 57px auto 47px;
  position: relative;
}
@media screen and (max-width: 750px) {
  .wrap .mechanism .video_frame {
    width: 81.3333333333vw;
    margin: 7.6vw auto 6.2666666667vw;
  }
}
.wrap .mechanism .video_frame .mechanism_video {
  width: 590px;
  height: 343px;
  margin: 0 auto;
  position: absolute;
  top: 10px;
  left: 0;
  right: 0;
}
@media screen and (max-width: 750px) {
  .wrap .mechanism .video_frame .mechanism_video {
    width: 78.6666666667vw;
    height: 45.7333333333vw;
    top: 1.3333333333vw;
  }
}
.wrap .mechanism .mechanism_img03 {
  margin-top: -179px;
  padding-top: 179px;
}
@media screen and (max-width: 750px) {
  .wrap .mechanism .mechanism_img03 {
    margin-top: -23.8666666667vw;
    padding-top: 23.8666666667vw;
  }
}
.wrap .offer_area.offer01 {
  background: url(../img/offer01_bg.jpg) no-repeat top center/100%;
  height: 1421px;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area.offer01 {
    height: 189.4666666667vw;
  }
}
.wrap .offer_area.offer02 {
  background: url(../img/offer02_bg.jpg) no-repeat top center/100%;
  height: 1345px;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area.offer02 {
    height: 179.3333333333vw;
  }
}
.wrap .offer_area.offer03 {
  background: url(../img/offer03_bg.jpg) no-repeat top center/100%;
  height: 1510px;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area.offer03 {
    height: 201.3333333333vw;
  }
}
.wrap .offer_area .tab_offer {
  margin-top: 110px;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area .tab_offer {
    margin-top: 14.6666666667vw;
  }
}
.wrap .offer_area .tab_offer .tab_area {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 10px;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area .tab_offer .tab_area {
    gap: 1.3333333333vw;
  }
}
.wrap .offer_area .tab_offer .tab_area .tab {
  width: 185px;
  height: 160px;
  cursor: pointer;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area .tab_offer .tab_area .tab {
    width: 24.6666666667vw;
    height: 21.3333333333vw;
  }
}
.wrap .offer_area .tab_offer .tab_area .tab.active {
  width: 260px;
  height: 200px;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area .tab_offer .tab_area .tab.active {
    width: 34.6666666667vw;
    height: 26.6666666667vw;
  }
}
.wrap .offer_area .tab_offer .tab_area .tab.tab01 {
  background: url(../img/tab_box3.png) no-repeat top left/100%;
}
.wrap .offer_area .tab_offer .tab_area .tab.tab01.active {
  background: url(../img/tab_box3_on.png) no-repeat top left/100%;
}
.wrap .offer_area .tab_offer .tab_area .tab.tab02 {
  background: url(../img/tab_box5.png) no-repeat top left/100%;
}
.wrap .offer_area .tab_offer .tab_area .tab.tab02.active {
  background: url(../img/tab_box5_on.png) no-repeat top left/100%;
}
.wrap .offer_area .tab_offer .tab_area .tab.tab03 {
  background: url(../img/tab_box1.png) no-repeat top left/100%;
}
.wrap .offer_area .tab_offer .tab_area .tab.tab03.active {
  background: url(../img/tab_box1_on.png) no-repeat top left/100%;
}
.wrap .offer_area .tab_offer .panel_area {
  margin-top: -50px;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area .tab_offer .panel_area {
    margin-top: -6.6666666667vw;
  }
}
.wrap .offer_area .tab_offer .panel_area .panel {
  display: none;
  width: 690px;
  margin: 0 auto;
  filter: drop-shadow(10px 10px 20px rgba(7, 7, 7, 0.7));
  position: relative;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area .tab_offer .panel_area .panel {
    width: 92vw;
    filter: drop-shadow(1.3333333333vw 1.3333333333vw 2.6666666667vw rgba(7, 7, 7, 0.7));
  }
}
.wrap .offer_area .tab_offer .panel_area .panel.active {
  display: block;
}
.wrap .offer_area .tab_offer .panel_area .panel .offer_btn {
  width: 580px;
  margin: 0 auto;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 25px;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area .tab_offer .panel_area .panel .offer_btn {
    width: 77.3333333333vw;
    bottom: 3.3333333333vw;
  }
}
.wrap .offer_area .tab_offer .panel_area .panel:last-child .offer_btn {
  bottom: 70px;
}
@media screen and (max-width: 750px) {
  .wrap .offer_area .tab_offer .panel_area .panel:last-child .offer_btn {
    bottom: 9.3333333333vw;
  }
}
.wrap .promise {
  background: url(../img/promise_bg.jpg) no-repeat top center/100%;
  padding-top: 125px;
}
@media screen and (max-width: 750px) {
  .wrap .promise {
    padding-top: 16.6666666667vw;
  }
}
.wrap .promise .promise_img02 {
  margin-top: -128px;
  padding-top: 128px;
}
@media screen and (max-width: 750px) {
  .wrap .promise .promise_img02 {
    margin-top: -17.0666666667vw;
    padding-top: 17.0666666667vw;
  }
}
.wrap .unwanted {
  background: url(../img/unwanted_bg.jpg) no-repeat top center/100%;
  height: 2460px;
  padding-top: 85px;
  box-sizing: border-box;
}
@media screen and (max-width: 750px) {
  .wrap .unwanted {
    height: 328vw;
    padding-top: 11.3333333333vw;
  }
}
.wrap .unwanted h2 {
  margin-bottom: 187px;
}
@media screen and (max-width: 750px) {
  .wrap .unwanted h2 {
    margin-bottom: 24.9333333333vw;
  }
}
.wrap .unwanted .unwanted_img02,
.wrap .unwanted .unwanted_img04 {
  width: 210px;
}
@media screen and (max-width: 750px) {
  .wrap .unwanted .unwanted_img02,
  .wrap .unwanted .unwanted_img04 {
    width: 28vw;
  }
}
.wrap .unwanted .unwanted_img02 {
  margin: 0 auto 0 0;
}
.wrap .unwanted .unwanted_img04 {
  margin: 0 0 84px auto;
}
@media screen and (max-width: 750px) {
  .wrap .unwanted .unwanted_img04 {
    margin: 0 0 11.2vw auto;
  }
}
.wrap .unwanted .unwanted_img03,
.wrap .unwanted .unwanted_img05 {
  width: 500px;
  position: absolute;
  top: 278px;
}
@media screen and (max-width: 750px) {
  .wrap .unwanted .unwanted_img03,
  .wrap .unwanted .unwanted_img05 {
    width: 66.6666666667vw;
    top: 37.0666666667vw;
  }
}
.wrap .unwanted .unwanted_img03 {
  left: 190px;
}
@media screen and (max-width: 750px) {
  .wrap .unwanted .unwanted_img03 {
    left: 25.3333333333vw;
  }
}
.wrap .unwanted .unwanted_img05 {
  right: 190px;
}
@media screen and (max-width: 750px) {
  .wrap .unwanted .unwanted_img05 {
    right: 25.3333333333vw;
  }
}
.wrap .unwanted .unwanted_img07 {
  margin-top: -52px;
  padding-top: 52px;
}
@media screen and (max-width: 750px) {
  .wrap .unwanted .unwanted_img07 {
    margin-top: -6.9333333333vw;
    padding-top: 6.9333333333vw;
  }
}
.wrap .solution {
  background: url(../img/solution_bg.jpg) no-repeat top center/100%;
  padding-top: 17px;
  margin-top: -1px;
}
@media screen and (max-width: 750px) {
  .wrap .solution {
    padding-top: 2.2666666667vw;
  }
}
.wrap .solution .solution_img {
  margin-bottom: 458px;
}
@media screen and (max-width: 750px) {
  .wrap .solution .solution_img {
    margin-bottom: 61.0666666667vw;
  }
}
.wrap .doctor {
  background: url(../img/doctor_bg.jpg) no-repeat top center/100%;
  height: 1541px;
  padding-top: 38px;
  margin-top: -1px;
  box-sizing: border-box;
}
@media screen and (max-width: 750px) {
  .wrap .doctor {
    height: 205.4666666667vw;
    padding-top: 5.0666666667vw;
  }
}
.wrap .doctor .doctor_img01 {
  margin-bottom: 213px;
}
@media screen and (max-width: 750px) {
  .wrap .doctor .doctor_img01 {
    margin-bottom: 28.4vw;
  }
}
.wrap .comment {
  background: url(../img/comment_bg.jpg) no-repeat top center/100%;
  padding: 100px 0 70px;
}
@media screen and (max-width: 750px) {
  .wrap .comment {
    padding: 13.3333333333vw 0 9.3333333333vw;
  }
}
.wrap .comment .comment_box {
  width: 650px;
  margin: 0 auto;
  padding: 55px 0 40px;
  background: #CB8C00;
  background: linear-gradient(135deg, rgba(203, 140, 0, 0.6) 0%, rgba(66, 33, 11, 0.6) 18%, rgba(0, 0, 0, 0.6) 40%, rgba(66, 33, 11, 0.6) 89%, rgba(174, 111, 0, 0.6) 100%);
  border: 6px solid;
  border-image: linear-gradient(to right, #DFCEA0, #D6BA7C, #CCA555) 1;
  filter: drop-shadow(3px 3px 3px rgba(45, 20, 3, 0.4));
  position: relative;
}
@media screen and (max-width: 750px) {
  .wrap .comment .comment_box {
    width: 86.6666666667vw;
    padding: 7.3333333333vw 0 5.3333333333vw;
    border: 0.8vw solid;
    filter: drop-shadow(0.4vw 0.4vw 0.4vw rgba(45, 20, 3, 0.4));
  }
}
.wrap .comment .comment_box h2 {
  width: 564px;
  margin: 0 auto;
  position: absolute;
  top: -70px;
  left: 0;
  right: 0;
}
@media screen and (max-width: 750px) {
  .wrap .comment .comment_box h2 {
    width: 75.2vw;
    top: -9.3333333333vw;
  }
}
.wrap .comment .comment_box .read_content {
  width: 570px;
  height: 200px;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 750px) {
  .wrap .comment .comment_box .read_content {
    width: 76vw;
    height: 26.6666666667vw;
  }
}
.wrap .comment .comment_box .read_content.open {
  height: auto;
}
.wrap .comment .comment_box .read_btn {
  width: 360px;
  height: 56px;
  margin: 45px auto 0;
  background: url(../img/comment_btn_more.png) no-repeat top left/100%;
  cursor: pointer;
}
@media screen and (max-width: 750px) {
  .wrap .comment .comment_box .read_btn {
    width: 48vw;
    height: 7.4666666667vw;
    margin: 6vw auto 0;
  }
}
.wrap .comment .comment_box .read_btn.open {
  background: url(../img/comment_btn_more_close.png) no-repeat top left/100%;
}
.wrap .cosper {
  background: url(../img/cosper_bg.jpg) no-repeat top center/100%, #140905;
  padding-top: 93px;
}
@media screen and (max-width: 750px) {
  .wrap .cosper {
    padding-top: 12.4vw;
  }
}
.wrap .cosper .cosper_img02 {
  margin-bottom: -180px;
}
@media screen and (max-width: 750px) {
  .wrap .cosper .cosper_img02 {
    margin-bottom: -24vw;
  }
}
.wrap .voice .voice01 {
  background: url(../img/voice_bg01.jpg) no-repeat top center/100%;
  height: 1491px;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice01 {
    height: 198.8vw;
  }
}
.wrap .voice .voice01 .voice_vid01 {
  width: 350px;
  height: 610px;
  margin: 58px 0 30px 50px;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice01 .voice_vid01 {
    width: 46.6666666667vw;
    height: 81.3333333333vw;
    margin: 7.7333333333vw 0 4vw 6.6666666667vw;
  }
}
.wrap .voice .voice01 .voice_vid01 video {
  width: 350px;
  height: 610px;
  object-fit: cover;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice01 .voice_vid01 video {
    width: 46.6666666667vw;
    height: 81.3333333333vw;
  }
}
.wrap .voice .voice01 .voice1_img {
  width: 330px;
  position: absolute;
  top: 154px;
  right: 0;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice01 .voice1_img {
    width: 44vw;
    top: 20.5333333333vw;
  }
}
.wrap .voice .voice02 {
  background: url(../img/voice_bg02.jpg) no-repeat top center/100%;
  height: 1690px;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice02 {
    height: 225.3333333333vw;
  }
}
.wrap .voice .voice02 .voice_vid02 {
  width: 400px;
  height: 550px;
  margin: 50px 44px 350px auto;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice02 .voice_vid02 {
    width: 53.3333333333vw;
    height: 73.3333333333vw;
    margin: 6.6666666667vw 5.8666666667vw 46.6666666667vw auto;
  }
}
.wrap .voice .voice02 .voice_vid02 video {
  width: 400px;
  height: 550px;
  object-fit: cover;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice02 .voice_vid02 video {
    width: 53.3333333333vw;
    height: 73.3333333333vw;
  }
}
.wrap .voice .voice02 .voice2_img01 {
  width: 330px;
  position: absolute;
  top: 338px;
  left: 0;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice02 .voice2_img01 {
    width: 44vw;
    top: 45.0666666667vw;
  }
}
.wrap .voice .voice02 .voice2_img02 {
  position: absolute;
  top: 743px;
  left: 0;
  right: 0;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice02 .voice2_img02 {
    top: 99.0666666667vw;
  }
}
.wrap .voice .voice03 {
  background: url(../img/voice_bg03.jpg) no-repeat top center/100%;
  height: 1447px;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice03 {
    height: 192.9333333333vw;
  }
}
.wrap .voice .voice03 .voice_vid03 {
  width: 350px;
  height: 610px;
  margin: 58px 0 30px 50px;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice03 .voice_vid03 {
    width: 46.6666666667vw;
    height: 81.3333333333vw;
    margin: 7.7333333333vw 0 4vw 6.6666666667vw;
  }
}
.wrap .voice .voice03 .voice_vid03 video {
  width: 350px;
  height: 610px;
  object-fit: cover;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice03 .voice_vid03 video {
    width: 46.6666666667vw;
    height: 81.3333333333vw;
  }
}
.wrap .voice .voice03 .voice3_img {
  width: 330px;
  position: absolute;
  top: 149px;
  right: 0;
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice03 .voice3_img {
    width: 44vw;
    top: 19.8666666667vw;
  }
}
.wrap .voice .voice_text {
  filter: drop-shadow(20px 20px 10px rgba(96, 56, 8, 0.2));
}
@media screen and (max-width: 750px) {
  .wrap .voice .voice_text {
    filter: drop-shadow(2.6666666667vw 2.6666666667vw 1.3333333333vw rgba(96, 56, 8, 0.2));
  }
}
.wrap .vid08_area {
  padding-bottom: 100px;
  background: #020000;
}
@media screen and (max-width: 750px) {
  .wrap .vid08_area {
    padding-bottom: 13.3333333333vw;
  }
}
.wrap .quasidrug {
  margin-top: -150px;
  position: relative;
}
@media screen and (max-width: 750px) {
  .wrap .quasidrug {
    margin-top: -20vw;
  }
}
.wrap .secret {
  background: url(../img/secret_bg.jpg) no-repeat top center/100%;
  height: 10458px;
  padding-top: 75px;
  box-sizing: border-box;
}
@media screen and (max-width: 750px) {
  .wrap .secret {
    height: 1394.4vw;
    padding-top: 10vw;
  }
}
.wrap .secret .secret_img02 {
  margin-bottom: 47px;
}
@media screen and (max-width: 750px) {
  .wrap .secret .secret_img02 {
    margin-bottom: 6.2666666667vw;
  }
}
.wrap .secret .secret_vid {
  width: 370px;
  height: 253px;
  position: absolute;
  right: 45px;
  bottom: 157px;
}
@media screen and (max-width: 750px) {
  .wrap .secret .secret_vid {
    width: 49.3333333333vw;
    height: 33.7333333333vw;
    right: 6vw;
    bottom: 20.9333333333vw;
  }
}
.wrap .secret .secret_vid video {
  width: 370px;
  height: 253px;
  object-fit: cover;
}
@media screen and (max-width: 750px) {
  .wrap .secret .secret_vid video {
    width: 49.3333333333vw;
    height: 33.7333333333vw;
  }
}
.wrap .secret .secret_last {
  display: flex;
  justify-content: space-between;
  margin-top: 386px;
}
@media screen and (max-width: 750px) {
  .wrap .secret .secret_last {
    margin-top: 51.4666666667vw;
  }
}
.wrap .secret .secret_last li {
  width: 280px;
}
@media screen and (max-width: 750px) {
  .wrap .secret .secret_last li {
    width: 37.3333333333vw;
  }
}
.wrap .approach {
  background: url(../img/approach_bg.jpg) no-repeat top center/100%;
  height: 1525px;
  padding-top: 390px;
  box-sizing: border-box;
  position: relative;
}
@media screen and (max-width: 750px) {
  .wrap .approach {
    height: 203.3333333333vw;
    padding-top: 52vw;
  }
}
.wrap .approach .approach_img01 {
  width: 200px;
  position: absolute;
  top: 206px;
  left: 35px;
}
@media screen and (max-width: 750px) {
  .wrap .approach .approach_img01 {
    width: 26.6666666667vw;
    top: 27.4666666667vw;
    left: 4.6666666667vw;
  }
}
.wrap .howto {
  background: url(../img/howto_bg.jpg) no-repeat top center/100%;
  height: 1959px;
  padding-top: 83px;
  box-sizing: border-box;
}
@media screen and (max-width: 750px) {
  .wrap .howto {
    height: 261.2vw;
    padding-top: 11.0666666667vw;
  }
}
.wrap .howto .howto_list {
  position: relative;
  margin-bottom: 40px;
}
@media screen and (max-width: 750px) {
  .wrap .howto .howto_list {
    margin-bottom: 5.3333333333vw;
  }
}
.wrap .howto .howto_list li:first-child {
  width: 417px;
  position: relative;
  z-index: 9;
}
@media screen and (max-width: 750px) {
  .wrap .howto .howto_list li:first-child {
    width: 55.6vw;
  }
}
.wrap .howto .howto_list li:last-child {
  width: 365px;
  position: absolute;
  top: 0;
  right: 0;
}
@media screen and (max-width: 750px) {
  .wrap .howto .howto_list li:last-child {
    width: 48.6666666667vw;
  }
}
.wrap .howto .howto_list li .howto_vid01,
.wrap .howto .howto_list li .howto_vid02 {
  overflow: hidden;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  position: absolute;
  top: 18px;
}
@media screen and (max-width: 750px) {
  .wrap .howto .howto_list li .howto_vid01,
  .wrap .howto .howto_list li .howto_vid02 {
    width: 40vw;
    height: 40vw;
    top: 2.4vw;
  }
}
.wrap .howto .howto_list li .howto_vid01 video,
.wrap .howto .howto_list li .howto_vid02 video {
  width: 100%;
}
.wrap .howto .howto_list li .howto_vid01 {
  left: 50px;
}
@media screen and (max-width: 750px) {
  .wrap .howto .howto_list li .howto_vid01 {
    left: 6.6666666667vw;
  }
}
.wrap .howto .howto_list li .howto_vid02 {
  right: 50px;
}
@media screen and (max-width: 750px) {
  .wrap .howto .howto_list li .howto_vid02 {
    right: 6.6666666667vw;
  }
}
.wrap .faq {
  background: url(../img/faq_bg.jpg) no-repeat top center/100%;
  height: 5580px;
  padding-top: 97px;
  box-sizing: border-box;
  position: relative;
}
@media screen and (max-width: 750px) {
  .wrap .faq {
    height: 744vw;
    padding-top: 12.9333333333vw;
  }
}
.wrap .faq .faq_img03 {
  margin-bottom: -33px;
}
@media screen and (max-width: 750px) {
  .wrap .faq .faq_img03 {
    margin-bottom: -4.4vw;
  }
}
.wrap .faq .faq_img04 {
  width: 304px;
  position: absolute;
  top: 376px;
  left: 0;
}
@media screen and (max-width: 750px) {
  .wrap .faq .faq_img04 {
    width: 40.5333333333vw;
    top: 50.1333333333vw;
  }
}

.animation {
  opacity: 0;
  transition: opacity .8s ease, transform .8s ease;
}
.animation.fadeinup {
  transform: translateY(40px);
}
@media screen and (max-width: 750px) {
  .animation.fadeinup {
    transform: translateY(5.3333333333vw);
  }
}
.animation.fadeinright {
  transform: translateX(40px);
}
@media screen and (max-width: 750px) {
  .animation.fadeinright {
    transform: translateX(5.3333333333vw);
  }
}
.animation.fadeinleft {
  transform: translateX(-40px);
}
@media screen and (max-width: 750px) {
  .animation.fadeinleft {
    transform: translateX(-5.3333333333vw);
  }
}
.animation.fadeindown {
  transform: translateY(-40px);
}
@media screen and (max-width: 750px) {
  .animation.fadeindown {
    transform: translateY(-5.3333333333vw);
  }
}
.animation.delay05 {
  transition-delay: .5s;
}
.animation.delay10 {
  transition-delay: 1s;
}
.animation.delay15 {
  transition-delay: 1.5s;
}
.animation.delay20 {
  transition-delay: 2s;
}
.animation.delay25 {
  transition-delay: 2.5s;
}
.animation.delay30 {
  transition-delay: 3s;
}
.animation.active {
  opacity: 1;
  transform: translateY(0);
}

/*# sourceMappingURL=style.css.map */