@charset "shift_jis";
/* CSS Document */

#contents .pc-none {
  display: block;
}
#contents br.pc-none {
  display: inline;
}
#contents .sp-none {
  display: none;
}

.MB00_sp {
  margin-bottom: 0px !important;
}
.MB10_sp {
  margin-bottom: 10px !important;
}
.MB15_sp {
  margin-bottom: 15px !important;
}
.MB20_sp {
  margin-bottom: 20px !important;
}
.MB25_sp {
  margin-bottom: 25px !important;
}
.MB30_sp {
  margin-bottom: 30px !important;
}
.MB35_sp {
  margin-bottom: 35px !important;
}
.MB40_sp {
  margin-bottom: 40px !important;
}
.MB45_sp {
  margin-bottom: 45px !important;
}
.MB50_sp {
  margin-bottom: 50px !important;
}
.MB55_sp {
  margin-bottom: 55px !important;
}
.MB60_sp {
  margin-bottom: 60px !important;
}
.MB75_sp {
  margin-bottom: 75px !important;
}
.MB80_sp {
  margin-bottom: 80px !important;
}
.MB85_sp {
  margin-bottom: 85px !important;
}
.MB90_sp {
  margin-bottom: 90px !important;
}
.MB95_sp {
  margin-bottom: 95px !important;
}
.MB100_sp {
  margin-bottom: 100px !important;
}

.PLR13 {
  padding: 0 13px;
}

.price_box {
  padding: 15px;
  background-color: #000;
}

.price_box .price_inbox {
  display: block;
  position: relative;
}

.price_img1 {
  width: 23%;
  position: absolute;
  top: 6%;
  left: 0;
}
.price_img2 {
  width: 23%;
  position: absolute;
  top: 6%;
  right: 0;
}

.price_box .price_txt {
  max-width: 400px;
  width: 80%;
  margin: 0 auto 15px;
}

.after {
  width: 56%;
  margin: 0 auto;
}

.btn_buy {
  width: 180px;
}

.btn_mall .btn {
  display: inline-block;
  font-weight: bold;
  line-height: 1.5;
  color: #212529;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 2px solid transparent;
  padding: 0.375rem 2rem;
  font-size: 18px;
  width: 180px;
  border-radius: 6px;
}
.btn_mall .btn.btn-light {
  display: block;
  color: #fff;
  background-color: #ff3095;
  border-color: #ff3095;
}

.btn_mall_box {
  width: 180px;
  margin: 0 auto;
}
.btn_mall_box .btn_mall .btn.btn-light {
  display: block;
  color: #fff;
  background-color: #ff3095;
  border-color: #ff3095;
}

.price_box .btn {
  margin: 0 auto;
}

.movie_area .promo_movie_box:first-of-type {
  margin-bottom: 20px;
}

.movie_area {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}

.promo_movie_box {
  width: 90%;
  max-width: 480px;
  margin: 0 auto;
}

#contents .youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
#contents .youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.youtube_1 {
  opacity: 0;
}
.animate_youtube_1 {
  animation: left_slide_scaleup 0.5s ease forwards;
}
.youtube_2 {
  opacity: 0;
}
.animate_youtube_2 {
  animation: left_slide_scaleup 0.5s ease forwards;
}
/*------------------------*/



#contents .bnr_sp_box {
padding: 20px 0;
background: #fff;
}
#contents .bnr_sp_box a {
display: block;
width: 90%;
max-width: 774px;
margin: 0 auto;
}

#contents .modal_wrap{
  position: fixed;
  top:0;
  right:0;
  bottom:0;
  left:0;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 100000;
}

#contents .modal_inner{
background: #339FDB;
  width: 90%;
max-width: 480px;
max-height: 90vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%);
  transform:translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
border: solid 3px #fff;
}



.ct_box {
  width: 100%;
  margin: 0 auto;
}

.ct_box > .w480 {
  width: 100%;
  max-width: 480px;
  box-sizing: border-box;
  margin: 0 auto;
  overflow: hidden;
}

/* .w480 {
  background: url(../images/bg.webp) repeat fixed;
  background-position: center;
} */

/* @media (min-width: 481px) {
  .ct_box > .w480 {
    border-right: 4px #fdd108 solid;
    border-left: 4px #fdd108 solid;
  }
  min-width: 481px
} */

.bg_box {
  background: url(../images/bg.webp) repeat fixed;
  background-position: center;
}
/*------------------------*/

.main {
  position: relative;
  overflow: hidden;
}

.main_logo {
  width: 61.5625%;
  position: absolute;
  z-index: 6;
  top: 9%;
  left: 21%;
  opacity: 0;
  animation: main_logo 0.3s ease forwards;
  animation-delay: 1.8s;
}
@keyframes main_logo {
  0% {
    transform: translateX(50px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
.main_text1 {
  width: 24.770833%;
  position: absolute;
  z-index: 6;
  top: 17%;
  left: 2%;
  opacity: 0;
  animation: main_text1 0.7s ease forwards;
  animation-delay: 0.3s;
}
@keyframes main_text1 {
  0% {
    transform: translateX(-150px) translateY(150px) rotate(-360deg);
    opacity: 0;
  }
  100% {
    transform: translateX(0) translateY(0) rotate(0);
    opacity: 1;
  }
}
.main_copy {
  width: 79.541667%;
  position: absolute;
  z-index: 5;
  bottom: 22%;
  left: 20%;
  opacity: 0;
  animation: main_copy 0.3s ease forwards;
  animation-delay: 2s;
}
@keyframes main_copy {
  0% {
    transform: translateX(-50px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

.main_pokemon {
  width: 100%;
  position: absolute;
  z-index: 4;
  top: 0;
  left: 0;
  opacity: 0;
  animation: main_pokemon 0.8s ease forwards;
  animation-delay: 2.5s;
}
@keyframes main_pokemon {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.main_characters {
  width: 100%;
  position: absolute;
  z-index: 4;
  top: 0;
  left: 0;
  opacity: 0;
  animation: main_characters 0.5s ease forwards;
  transform-origin: left bottom;
  animation-delay: 2.5s;
}
@keyframes main_characters {
  0% {
    transform: translateY(18%) rotate(10deg);
    opacity: 1;
  }
  50% {
    transform: translateY(1%) rotate(-6deg);
    opacity: 1;
  }
  100% {
    transform: translateY(2%) rotate(0deg);
    opacity: 1;
  }
}

.main_c {
  width: 100%;
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  opacity: 0;
  animation: main_c 0.3s ease forwards;
  animation-delay: 2.8s;
}
@keyframes main_c {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.main_rotom1 {
  width: 52.125%;
  position: absolute;
  z-index: 4;
  top: 15.5%;
  left: 1.5%;
  opacity: 0;
  animation: main_rotom1 0.5s ease forwards;
  animation-delay: 0.3s;
  transform-origin: bottom;
}
@keyframes main_rotom1 {
  0% {
    transform: scale(0) rotate(30deg);
  }
  100% {
    transform: scale(1) rotate(0);
    opacity: 1;
  }
}
.main_rotom1_on {
  width: 52.125%;
  position: absolute;
  z-index: 4;
  top: 15.5%;
  left: 1.5%;
  opacity: 0;
  animation: main_rotom1_on 0.7s ease forwards;
  animation-delay: 1s;
}
@keyframes main_rotom1_on {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  55% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

.main_rotom2 {
  width: 49.16666667%;
  position: absolute;
  z-index: 3;
  top: 18.3%;
  right: 8.3%;
  animation: main_rotom2 0.5s ease forwards;
  transform-origin: bottom;
}
@keyframes main_rotom2 {
  0% {
    transform: scale(0) rotate(-30deg);
  }
  100% {
    transform: scale(1) rotate(0);
    opacity: 1;
  }
}
.main_rotom2_on {
  width: 100%;
  position: absolute;
  z-index: 3;
  top: -2.8%;
  right: -0.2%;
}

.gif_fade_delay {
  opacity: 0;
  animation: gif_fade_delay 0.2s forwards;
  animation-delay: 3s;
}

@keyframes gif_fade_delay {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.sec01_title {
  opacity: 0;
}
.animate_sec01_title {
  animation: flipX 0.3s ease forwards;
}
.sec02_title {
  opacity: 0;
}
.animate_sec02_title {
  animation: flipX 0.3s ease forwards;
}
.sec03_title {
  opacity: 0;
}
.animate_sec03_title {
  animation: flipX 0.3s ease forwards;
}
.sec03_title2 {
  opacity: 0;
}
.animate_sec03_title2 {
  animation: flipX 0.3s ease forwards;
}
@keyframes flipX {
  0% {
    transform: scaleY(-1) scaleX(1);
    opacity: 0;
  }
  100% {
    transform: scaleY(1) scaleX(1);
    opacity: 1;
  }
}

.ct_box {
  background: url(../images/bg.png) top center repeat-y;
  background-size: 180% auto;
  padding-bottom: 1px;
}

.ct_box .ct_inbox .pad_eachsec {
  border-radius: 20px;
  border: solid 2px #000;
  background-image: -webkit-linear-gradient(-90deg, #2563af 0, #2563af 20%, #00b9ef 80%, #00b9ef 100%);
  background-image: -moz-linear-gradient(180deg, #2563af 0, #2563af 20%, #00b9ef 80%, #00b9ef 100%);
  background-image: linear-gradient(180deg, #2563af 0, #2563af 20%, #00b9ef 80%, #00b9ef 100%);
  background-position: 50% 50%;
  -webkit-background-origin: padding-box;
  background-origin: padding-box;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  -webkit-background-size: auto auto;
  background-size: auto auto;
  margin: 60px auto 90px;
}
.ct_box .ct_inbox .pad_eachsec2 {
  border-radius: 20px;
  border: solid 2px #000;
  background-image: -webkit-linear-gradient(-90deg, #2563af 0, #2563af 20%, #00b9ef 80%, #00b9ef 100%);
  background-image: -moz-linear-gradient(180deg, #2563af 0, #2563af 20%, #00b9ef 80%, #00b9ef 100%);
  background-image: linear-gradient(180deg, #2563af 0, #2563af 20%, #00b9ef 80%, #00b9ef 100%);
  background-position: 50% 50%;
  -webkit-background-origin: padding-box;
  background-origin: padding-box;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  -webkit-background-size: auto auto;
  background-size: auto auto;
  margin: 60px auto;
}
.ct_box .ct_inbox .pad_eachsec .sec_inbox {
  position: relative;
  border-radius: 20px;
  border: solid 5px #fff;
  background: url(../images/sec_pattern_bg.png) top center repeat-y;
  background-size: 100% auto;
  padding: 0 13px 20px;
}

.ct_box .ct_inbox .pad_eachsec.sec01 {
  border-radius: 20px;
  border: solid 2px #000;
  background-image: -webkit-linear-gradient(-90deg, #ec6c00 0, #fccf00 30%, #fccf00 100%);
  background-image: -moz-linear-gradient(180deg, #ec6c00 0, #fccf00 30%, #fccf00 100%);
  background-image: linear-gradient(180deg, #ec6c00 0, #fccf00 30%, #fccf00 100%);
  background-position: 50% 50%;
  -webkit-background-origin: padding-box;
  background-origin: padding-box;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  -webkit-background-size: auto auto;
  background-size: auto auto;
  margin: 60px auto 90px;
}
.ct_box .ct_inbox .pad_eachsec.sec01 .sec_inbox {
  position: relative;
  border-radius: 20px;
  border: solid 5px #fff;
  background: none;
  padding: 0 13px 20px;
}

.ct_box .ct_inbox .pad_eachsec {
  border-radius: 10px;
  border: solid 1px #000;
}
.ct_box .ct_inbox .pad_eachsec .sec_inbox {
  border-radius: 10px;
  border: solid 3px #fff;
  padding: 0 5px 10px;
}

.ct_box .ct_inbox .pad_eachsec.sec01 {
  border-radius: 10px;
  border: solid 1px #000;
}
.ct_box .ct_inbox .pad_eachsec.sec01 .sec_inbox {
  border-radius: 10px;
  border: solid 3px #fff;
  padding: 0 5px 10px;
}

.ct_box .ct_inbox {
  padding: 30px 0;
}

.ct_box .ct_inbox .pad_eachsec h2 {
  margin-top: -10%;
}

.ct_box .ct_inbox .sec02_gif_box {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  margin-top: -22%;
  margin-bottom: 10px;
}
.sec03_img02 {
  position: relative;
}
.sec02_gif09 {
  margin-top: -58%;
  max-width: 448px;
}
.ct_box .ct_inbox .sec02_gif_box > * {
  width: 46%;
  margin: 0 20px 20px;
}

.ct_box .ct_inbox .sec02_gif_box > * {
  width: 46%;
  margin: 0 auto 10px;
}

.sec02_gif_1 {
  opacity: 0;
}
.animate_sec02_gif_1 {
  animation: wipe_left 0.3s ease forwards;
}
.sec02_gif_2 {
  opacity: 0;
}
.animate_sec02_gif_2 {
  animation: wipe_left 0.3s ease forwards;
}
.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_img_box,
.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_gif06_box {
  margin: 0 auto 10px;
}

.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_img_btn {
  display: block;
  margin: 20px auto 0;
  max-width: 702px;
  width: 90%;
}

.ct_box .ct_inbox .pad_eachsec.sec03 .sec_inbox {
  padding: 0 5px 10px;
}
.ct_box .ct_inbox .pad_eachsec.sec03 .sec03_img01 {
  position: relative;
}

.ct_box .ct_inbox .pad_eachsec.sec03 .sec03_each {
  width: 96%;
  max-width: 515px;
  margin-left: auto;
  margin-right: auto;
}

.ct_box .ct_inbox .pad_eachsec.sec03 .sec03_each.sec03_img02 .gif_box {
  padding: 3px;
  background-color: #fff;
  -webkit-box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.4);
  box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.4);
}

.ct_box .ct_inbox .pad_eachsec.sec06 .sec06_img02 {
  padding: 10px 5px;
}

.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_img_box {
  position: relative;
  margin: 0 auto 20px;
}

.sec02_area1_img1 {
  width: 41.916667%;
  position: absolute;
  z-index: 1;
  top: 1.7%;
  left: 3%;
  opacity: 0;
}
.animate_sec02_area1_img1 {
  animation: scale_up 0.3s ease forwards;
}
.sec02_area1_img2 {
  width: 41.916667%;
  position: absolute;
  z-index: 1;
  top: 3.3%;
  right: 2.5%;
  opacity: 0;
}
.animate_sec02_area1_img2 {
  animation: scale_up 0.5s ease forwards;
}
.sec02_area1_img3 {
  width: 69.458333%;
  position: absolute;
  z-index: 1;
  top: 14.5%;
  left: 2%;
  opacity: 0;
}
.animate_sec02_area1_img3 {
  animation: rotate_down 0.3s ease forwards;
  transform-origin: left bottom;
}
.sec02_area1_img4 {
  width: 37.3125%;
  position: absolute;
  z-index: 2;
  top: 19.7%;
  right: 11.5%;
  opacity: 0;
}
.animate_sec02_area1_img4 {
  animation: rotate_down 0.3s ease forwards;
  transform-origin: right bottom;
}
.sec02_area1_text1 {
  width: 45.833333%;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 2%;
  opacity: 0;
}
.animate_sec02_area1_text1 {
  animation: slide_left 0.3s ease forwards;
}
.sec02_area1_text2 {
  width: 20.6875%;
  position: absolute;
  z-index: 2;
  top: 0.1%;
  right: 22%;
  opacity: 0;
}
.animate_sec02_area1_text2 {
  animation: slide_left 0.3s ease forwards;
}
.sec02_area1_text3 {
  width: 61.854167%;
  position: absolute;
  z-index: 2;
  top: 15%;
  left: 3%;
  opacity: 0;
}
.animate_sec02_area1_text3 {
  animation: scale_up 0.3s ease forwards;
}
.sec02_area1_text4 {
  width: 35.645833%;
  position: absolute;
  z-index: 2;
  top: 27%;
  left: 7%;
  opacity: 0;
}
.animate_sec02_area1_text4 {
  animation: scale_up 0.3s ease forwards;
}
.sec02_area1_arrow1 {
  width: 7.479167%;
  position: absolute;
  z-index: 3;
  top: 11.5%;
  left: 9%;
  opacity: 0;
}
.animate_sec02_area1_arrow1 {
  animation: wipe_down 0.3s ease forwards;
}
.sec02_area1_arrow2 {
  width: 10.5625%;
  position: absolute;
  z-index: 3;
  top: 13.5%;
  right: 25.5%;
  opacity: 0;
}
.animate_sec02_area1_arrow2 {
  animation: wipe_left 0.3s ease forwards;
}
.sec02_area1_arrow3 {
  width: 7.479167%;
  position: absolute;
  z-index: 3;
  top: 13.5%;
  right: 5%;
  opacity: 0;
}
.animate_sec02_area1_arrow3 {
  animation: wipe_down 0.5s ease forwards;
}
.sec02_gif_box2 {
  opacity: 0;
}
.animate_sec02_gif_box2 {
  animation: slide_down 0.4s ease forwards;
}
.sec02_area2_img1 {
  width: 100%;
  position: absolute;
  z-index: 2;
  top: 31.8%;
}
.sec02_area2_img1_2 {
  width: 100%;
  position: absolute;
  z-index: 10;
  top: 35.5%;
}

.sec02_area2_text1 {
  width: 27.60416667%;
  position: absolute;
  z-index: 101;
  top: 41.5%;
  left: 1%;
}
.sec02_area2_text2 {
  width: 25.645833%;
  position: absolute;
  z-index: 101;
  top: 42.5%;
  left: 38%;
}
.sec02_area2_text3 {
  width: 20%;
  position: absolute;
  z-index: 101;
  top: 42%;
  right: 15%;
}
.sec02_area2_text4 {
  width: 37.8125%;
  position: absolute;
  z-index: 101;
  top: 52.5%;
  left: 2%;
}
.sec02_area2_text5 {
  width: 22.91666667%;
  position: absolute;
  z-index: 101;
  top: 63%;
  left: 9%;
}
.sec02_area2_text6 {
  width: 32.60416667%;
  position: absolute;
  z-index: 101;
  top: 60%;
  right: 6%;
}

.sec02_area3_img1 {
  width: 45.729167%;
  position: absolute;
  z-index: 1;
  top: 73.5%;
  left: 7.5%;
  opacity: 0;
}
.animate_sec02_area3_img1 {
  animation: scale_up 0.3s ease forwards;
}
.sec02_area3_img2 {
  width: 40.395833%;
  position: absolute;
  z-index: 1;
  top: 74.5%;
  right: 5%;
  opacity: 0;
}
.animate_sec02_area3_img2 {
  animation: scale_up 0.3s ease forwards;
}
.sec02_area3_img3 {
  width: 48.8125%;
  position: absolute;
  z-index: 1;
  top: 87%;
  left: 8.5%;
  opacity: 0;
}
.animate_sec02_area3_img3 {
  animation: scale_up 0.3s ease forwards;
}
.sec02_area3_img4 {
  width: 35.479167%;
  position: absolute;
  z-index: 1;
  top: 86%;
  right: 4.5%;
  opacity: 0;
}
.animate_sec02_area3_img4 {
  animation: slide_left2 0.3s ease forwards;
}
@keyframes slide_left2 {
  0% {
    transform: translateX(-30px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
.sec02_area3_text1 {
  width: 25.104167%;
  position: absolute;
  z-index: 2;
  top: 72.5%;
  left: 20.5%;
  opacity: 0;
}
.animate_sec02_area3_text1 {
  animation: scale_up 0.3s ease forwards;
}
.sec02_area3_text2 {
  width: 39.104167%;
  position: absolute;
  z-index: 2;
  top: 73%;
  right: 4.5%;
  opacity: 0;
}
.animate_sec02_area3_text2 {
  animation: wipe_circle 0.5s ease forwards;
}
@keyframes wipe_circle {
  0% {
    -webkit-clip-path: circle(0 at 50% 50%);
    clip-path: circle(0 at 50% 50%);
    opacity: 1;
  }

  100% {
    -webkit-clip-path: circle(100% at 50% 50%);
    clip-path: circle(100% at 50% 50%);
    opacity: 1;
  }
}
.sec02_area3_text3 {
  width: 41.5%;
  position: absolute;
  z-index: 2;
  top: 96.5%;
  left: 4%;
  opacity: 0;
}
.animate_sec02_area3_text3 {
  animation: slide_left 0.5s ease forwards;
}
.sec02_area3_text4 {
  width: 35.625%;
  position: absolute;
  z-index: 2;
  top: 96%;
  right: 4.5%;
  opacity: 0;
}
.animate_sec02_area3_text4 {
  animation: sec02_area3_text4 2.5s ease infinite;
  transform-origin: top;
}
@keyframes sec02_area3_text4 {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  10% {
    transform: scale(0);
    opacity: 0;
  }
  20% {
    transform: scale(1.1);
    opacity: 1;
  }
  30% {
    transform: scale(1);
    opacity: 1;
  }
  80% {
    transform: scale(1);
    opacity: 1;
  }
  90% {
    transform: scale(1.1);
    opacity: 1;
  }
  100% {
    transform: scale(0);
    opacity: 1;
  }
}
/* @keyframes sec02_area3_text4 {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  15% {
    transform: scale(0);
  }
  25% {
    transform: scale(1.1);
    opacity: 1;
  }
  35% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: rotate(0) scale(1);
    opacity: 1;
  }
  60% {
    transform: rotate(4deg) scale(1);
    opacity: 1;
  }
  65% {
    transform: rotate(-4deg) scale(1);
    opacity: 1;
  }
  70% {
    transform: rotate(4deg) scale(1);
    opacity: 1;
  }
  75% {
    transform: rotate(0) scale(1);
    opacity: 1;
  }
  80% {
    transform: scale(1.1);
    opacity: 1;
  }
  90% {
    transform: scale(0);
    opacity: 1;
  }
  100% {
    transform: scale(0);
    opacity: 0;
  }
} */

.sec02_area3_arrow1 {
  width: 6.270833%;
  position: absolute;
  z-index: 2;
  top: 72%;
  left: 15%;
  opacity: 0;
}
.animate_sec02_area3_arrow1 {
  animation: wipe_down 0.3s ease forwards;
}
.sec02_area3_arrow2 {
  width: 11.395833%;
  position: absolute;
  z-index: 2;
  top: 80%;
  left: 46.5%;
  opacity: 0;
}
.animate_sec02_area3_arrow2 {
  animation: wipe_left 0.3s ease forwards;
}
.sec02_area3_arrow3 {
  width: 9.041667%;
  position: absolute;
  z-index: 2;
  top: 83.5%;
  right: 37%;
  opacity: 0;
}
.animate_sec02_area3_arrow3 {
  animation: wipe_right 0.3s ease forwards;
}
.sec02_area3_shape {
  width: 14.0625%;
  position: absolute;
  z-index: 2;
  top: 89%;
  left: 46%;
  opacity: 0;
}
.animate_sec02_area3_shape {
  animation: scale_up 0.5s ease forwards;
  transform-origin: left;
}

.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_img_box .sec02_img {
  position: absolute;
  opacity: 0;
}

.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_img_box .sec02_gif01 {
  position: absolute;
  z-index: 11;
  display: block;
  left: 2.4%;
  top: 37%;
  width: 29.63%;
  height: 6.66%;
  transform: rotate(10deg);
}
.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_img_box .sec02_gif02 {
  position: absolute;
  z-index: 12;
  display: block;
  left: 35.37%;
  top: 37.05%;
  width: 29.63%;
  height: 6.66%;
  transform: rotate(-10deg);
}
.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_img_box .sec02_gif03 {
  position: absolute;
  z-index: 13;
  display: block;
  left: 67.69%;
  top: 37.79%;
  width: 29.63%;
  height: 6.66%;
  transform: rotate(10deg);
}
.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_img_box .sec02_gif04 {
  position: absolute;
  z-index: 14;
  display: block;
  left: 5.46%;
  top: 47.37%;
  width: 29.63%;
  height: 6.66%;
  transform: rotate(-10deg);
}
.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_img_box .sec02_gif05 {
  position: absolute;
  z-index: 15;
  display: block;
  left: 5.65%;
  top: 58.07%;
  width: 29.63%;
  height: 6.66%;
  transform: rotate(10deg);
}

.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_gif06_box {
  width: 80%;
  max-width: 800px;
  margin: 0 auto 20px;
}

.ct_box .ct_inbox .gif_box {
  width: 100%;
  padding: 6px;
  background-color: #fff;
  -webkit-box-shadow: 5px 5px 0 0 rgba(0, 0, 0, 0.4);
  box-shadow: 5px 5px 0 0 rgba(0, 0, 0, 0.4);
}

.more_know {
  opacity: 0;
}
.animate_more_know {
  animation: slide_down 0.3s ease forwards;
}
.ct_box .ct_inbox .pad_eachsec.sec02 .sec02_img_btn {
  display: block;
  margin: 90px auto 0;
  max-width: 702px;
  width: 90%;
  opacity: 0;
}
.animate_sec02_img_btn {
  animation: fade_in 0.3s ease forwards;
}
.ct_box .ct_inbox .pad_eachsec.sec03 .sec03_img01 {
  position: relative;
}

.ct_box .ct_inbox .pad_eachsec.sec03 .sec03_each {
  width: 96%;
}
.ct_box .ct_inbox .pad_eachsec.sec03 .sec03_each.sec03_gif_box {
  max-width: 492px;
}

.ct_box .ct_inbox .pad_eachsec.sec03 .sec03_gif_icon {
  display: block;
  max-width: 440px;
}

.sec03_gif_icon1 {
  opacity: 0;
}
.animate_sec03_gif_icon1 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_gif_icon2 {
  opacity: 0;
}
.animate_sec03_gif_icon2 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_gif_icon3 {
  opacity: 0;
}
.animate_sec03_gif_icon3 {
  animation: slide_left 0.3s ease forwards;
}

.gif_box1 {
  opacity: 0;
}
.animate_gif_box1 {
  animation: wipe_left 0.3s ease forwards;
}
.gif_box2 {
  opacity: 0;
}
.animate_gif_box2 {
  animation: wipe_left 0.3s ease forwards;
}
.gif_box3 {
  opacity: 0;
}
.animate_gif_box3 {
  animation: wipe_left 0.3s ease forwards;
}

.ct_box .ct_inbox .pad_eachsec.sec03 .sec03_each.sec03_img02 {
  position: relative;
}

.ct_box .ct_inbox .pad_eachsec.sec03 .sec03_each.sec03_img02 .gif_box {
  position: absolute;
  right: 0;
  bottom: 0;
  max-width: 492px;
}

.ct_box .ct_inbox .pad_eachsec.sec03 .sec03_img06_btn1 {
  display: block;
  width: 100%;
  max-width: 459px;
  margin-left: auto;
  margin-right: auto;
}
.sec03_img06_btn2 {
  display: block;
  width: 100%;
  max-width: 459px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 28%;
}

.ct_box .ct_inbox .pad_eachsec.sec06 {
  margin-bottom: 60px;
}
.ct_box .ct_inbox .pad_eachsec.sec06,
.ct_box .ct_inbox .pad_eachsec.sec06 .sec_inbox {
  overflow: hidden;
}
.ct_box .ct_inbox .pad_eachsec.sec06 .sec_inbox {
  padding: 10px 0 0;
}
.ct_box .ct_inbox .pad_eachsec.sec06 .sec06_img01 {
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
  opacity: 0;
}

.ct_box .ct_inbox .pad_eachsec.sec06 .sec04_area2_box {
  background: #e61728;
  padding: 5px 0 35px;
}

#contents .btn_manual_box {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  max-width: 800px;
  width: 80%;
  margin: 30px auto 0;
}
#contents .btn_manual_box a {
  max-width: 371px;
  display: block;
  margin: 0 auto 30px;
}

.ct_box .copyright {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;

  align-items: center;

  margin-bottom: 40px;

  padding-top: 40px;
}

.ct_box .copyright_img {
  width: 30%;
  max-width: 280px;
}

.ct_box .copyright_txt {
  width: 40%;
  text-align: left;
  font-size: 12px;
  color: #000;
}

.slick-slide {
  transition: transform 0.3s;
  padding: 0 8px; /* スライド間の隙間を確保 */
}

@media (max-width: 375px) {
  .slick-slide {
    padding: 0 4px;
  }
}

.slick-center {
  z-index: 1; /* 拡大時に他のスライドの上に表示 */
}
.slick-list {
  overflow: visible;
  overflow-x: hidden; /* 拡大時にスライドが隠れないようにする */
  width: 100%;
  margin: 0 auto;
}
/* .slider .slick-center.scale-up {
  transform: scale(1.2);
} */

.sec03_area4 {
  position: relative;
  background: url(../images/sec03_area4_bg.webp) no-repeat;
  background-position: center;
  background-size: 86%;
}

.sec03_area4_op0 {
  width: 92.60416667%;
  margin: 0 auto;
  opacity: 0;
}

.sec03_area4_icon {
  width: 18.1875%;
  position: absolute;
  top: 0.1%;
  left: 7%;
  opacity: 0;
}
.animate_sec03_area4_icon {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area4_title {
  width: 33.791667%;
  position: absolute;
  top: 1%;
  left: 27%;
  opacity: 0;
}
.animate_sec03_area4_title {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area4_copy {
  width: 57.520833%;
  position: absolute;
  top: 11%;
  left: 27%;
  opacity: 0;
}
.animate_sec03_area4_copy {
  animation: fade_in 0.3s ease forwards;
}
.sec03_area4_img1 {
  width: 34.27083333%;
  position: absolute;
  z-index: 1;
  top: 22%;
  right: 11%;
  opacity: 0;
}
.animate_sec03_area4_img1 {
  animation: slide_right 0.3s ease forwards;
}
.sec03_area4_img2 {
  width: 42.8125%;
  position: absolute;
  z-index: 1;
  top: 39%;
  left: 6%;
  opacity: 0;
}
.animate_sec03_area4_img2 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area4_img3 {
  width: 42.8125%;
  position: absolute;
  z-index: 1;
  top: 64%;
  right: 5%;
  opacity: 0;
}
.animate_sec03_area4_img3 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area4_arrow1 {
  width: 9.0625%;
  position: absolute;
  z-index: 2;
  top: 30%;
  right: 42%;
  opacity: 0;
}
.animate_sec03_area4_arrow1 {
  animation: wipe_right 0.3s ease forwards;
}
.sec03_area4_arrow2 {
  width: 7.8125%;
  position: absolute;
  z-index: 2;
  top: 71%;
  left: 44%;
  opacity: 0;
}
.animate_sec03_area4_arrow2 {
  animation: wipe_left 0.3s ease forwards;
}
.sec03_area4_text1 {
  width: 29.58333333%;
  position: absolute;
  top: 28%;
  left: 21%;
  opacity: 0;
}
.animate_sec03_area4_text1 {
  animation: scale_up 0.3s ease forwards;
}
.sec03_area4_text2 {
  width: 33.33333333%;
  position: absolute;
  top: 76%;
  left: 17%;
  opacity: 0;
}
.animate_sec03_area4_text2 {
  animation: scale_up 0.3s ease forwards;
}

.sec03_area5 {
  position: relative;
  background: url(../images/sec03_area5_bg.webp) no-repeat;
  background-position: center;
  background-size: 93%;
}
.sec03_area5_op0 {
  width: 99.375%;
  margin: 0 auto;
  opacity: 0;
}

.sec03_area5_icon {
  width: 18.1875%;
  position: absolute;
  top: 0.1%;
  left: 11%;
  opacity: 0;
}
.animate_sec03_area5_icon {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area5_title {
  width: 33.791667%;
  position: absolute;
  top: 1%;
  left: 31%;
  opacity: 0;
}
.animate_sec03_area5_title {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area5_copy {
  width: 56.520833%;
  position: absolute;
  top: 6%;
  left: 31%;
  opacity: 0;
}
.animate_sec03_area5_copy {
  animation: fade_in 0.3s ease forwards;
}
.sec03_area5_img1 {
  width: 34.58333333%;
  position: absolute;
  z-index: 1;
  top: 27%;
  left: 33%;
  opacity: 0;
}
.animate_sec03_area5_img1 {
  animation: scale_up 0.3s ease forwards;
}
.sec03_area5_img2 {
  width: 42.60416667%;
  position: absolute;
  z-index: 1;
  top: 53%;
  left: 7.5%;
  opacity: 0;
}
.animate_sec03_area5_img2 {
  animation: scale_up 0.3s ease forwards;
}
.sec03_area5_img3 {
  width: 42.60416667%;
  position: absolute;
  z-index: 1;
  top: 53%;
  right: 4%;
  opacity: 0;
}
.animate_sec03_area5_img3 {
  animation: scale_up 0.3s ease forwards;
}
.slider2 {
  background-color: #e75504;
  padding: 2% 0;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.4);
  opacity: 0;
}
.animate_slider2 {
  animation: fade_in 0.3s ease forwards;
}
.sec03_area5_arrow1 {
  width: 9.166666667%;
  position: absolute;
  z-index: 2;
  top: 44.5%;
  left: 30%;
  opacity: 0;
}
.animate_sec03_area5_arrow1 {
  animation: wipe_down 0.3s ease forwards;
}
.sec03_area5_arrow2 {
  width: 9.166666667%;
  position: absolute;
  z-index: 2;
  top: 44.5%;
  right: 28%;
  opacity: 0;
}
.animate_sec03_area5_arrow2 {
  animation: wipe_down 0.3s ease forwards;
}
.sec03_area5_arrow3 {
  width: 8.229166667%;
  position: absolute;
  z-index: 2;
  top: 75%;
  left: 8%;
  opacity: 0;
}
.animate_sec03_area5_arrow3 {
  animation: wipe_up 0.3s ease forwards;
}
.sec03_area5_arrow4 {
  width: 8.229166667%;
  position: absolute;
  z-index: 2;
  top: 75%;
  right: 5%;
  opacity: 0;
}
.animate_sec03_area5_arrow4 {
  animation: wipe_up 0.3s ease forwards;
}

.sec03_function_title {
  width: 60.708333%;
  margin: 14% 0 0 5%;
  position: relative;
  z-index: 2;
  opacity: 0;
}
.animate_sec03_function_title {
  animation: flipX 0.3s ease forwards;
}
.sec03_function_rotom {
  width: 47.291667%;
  margin: -55% 3% 0 auto;
  position: relative;
  z-index: 1;
  opacity: 0;
}
.animate_sec03_function_rotom {
  animation: sec03_function_rotom 0.6s ease forwards;
  transform-origin: bottom;
}
@keyframes sec03_function_rotom {
  0% {
    transform: translateX(-100px) rotate(-3deg);
    opacity: 0;
  }
  50% {
    transform: rotate(10deg);
    opacity: 1;
  }
  100% {
    transform: translateX(0) rotate(0);
    opacity: 1;
  }
}

.large_icon {
  display: flex;
  justify-content: center;
  margin-bottom: 3%;
  gap: 3%;
  opacity: 0;
}
.animate_large_icon {
  animation: fade_in 0.3s ease forwards;
}
.large_icon_1,
.large_icon_2,
.large_icon_3,
.large_icon_4 {
  width: 18.75%;
}
.slider {
  opacity: 0;
}
.animate_slider {
  animation: fade_in 0.3s ease forwards;
}
.sec03_area1 {
  position: relative;
}
.sec03_2406_img05 {
  opacity: 0;
}

.sec03_area1_icon1 {
  width: 21.5625%;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 8%;
  opacity: 0;
}
.animate_sec03_area1_icon1 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area1_text1 {
  width: 17.020833%;
  position: absolute;
  z-index: 2;
  top: 4%;
  left: 31%;
  opacity: 0;
}
.animate_sec03_area1_text1 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area1_text2 {
  width: 30.041667%;
  position: absolute;
  z-index: 2;
  top: 60%;
  left: 15%;
  opacity: 0;
}
.animate_sec03_area1_text2 {
  animation: scale_up 0.3s ease forwards;
}
.sec03_area1_text3 {
  width: 44.541667%;
  position: absolute;
  z-index: 2;
  top: 81%;
  left: 4%;
  opacity: 0;
}
.animate_sec03_area1_text3 {
  animation: fade_in 0.3s ease forwards;
}
.sec03_area1_arrow1 {
  width: 7.708333333%;
  width: 16.04166667%;
  position: absolute;
  z-index: 2;
  top: 27.5%;
  left: 30%;
  opacity: 0;
}
.animate_sec03_area1_arrow1 {
  animation: sec03_area1_arrow1 0.6s ease forwards;
  transform-origin: bottom;
}
@keyframes sec03_area1_arrow1 {
  0% {
    transform: scale(0) rotate(-30deg);
    opacity: 0;
  }
  50% {
    transform: scale(1) rotate(10deg);
    opacity: 1;
  }
  100% {
    transform: scale(1) rotate(0);
    opacity: 1;
  }
}
.sec03_area1_img1_1 {
  width: 31.520833%;
  position: absolute;
  z-index: 2;
  top: 70%;
  right: 19%;
  rotate: -10deg;
  opacity: 0;
}
.animate_sec03_area1_img1_1 {
  animation: sec03_area1_img1_1 0.5s ease forwards;
  transform-origin: center;
}
@keyframes sec03_area1_img1_1 {
  0% {
    transform: scale(0.4) rotate(5deg) translateY(-300px);
    opacity: 0;
  }
  70% {
    transform: scale(1) rotate(-13deg) translateY(10px);
    opacity: 1;
  }
  100% {
    transform: scale(1) rotate(-10deg) translateY(0);
    opacity: 1;
  }
}
.sec03_area1_rotom {
  width: 87.520833%;
  position: absolute;
  z-index: 1;
  top: -18%;
  left: 6%;
}
.sec03_area1_rotom_on {
  width: 87.520833%;
  position: absolute;
  z-index: 1;
  top: -18%;
  left: 6%;
  opacity: 0;
}
.animate_sec03_area1_rotom_on {
  animation: sec03_area1_rotom_on 0.7s ease forwards;
}
@keyframes sec03_area1_rotom_on {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  55% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

.sec03_area1_2 {
  position: relative;
  background: url(../images/sec03_area1_bg2.webp) no-repeat;
  background-position: center;
  background-size: 93%;
}
.sec03_2406_img06 {
  opacity: 0;
}

.sec03_area1_icon2 {
  width: 22.5625%;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 7%;
  opacity: 0;
}
.animate_sec03_area1_icon2 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area1_text4 {
  width: 24.229167%;
  position: absolute;
  z-index: 2;
  top: 4%;
  left: 31%;
  opacity: 0;
}
.animate_sec03_area1_text4 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area1_img1 {
  width: 39.520833%;
  position: absolute;
  z-index: 2;
  top: 33%;
  left: 10%;
  rotate: -5deg;
  opacity: 0;
}
.animate_sec03_area1_img1 {
  animation: sec03_area1_imgs 0.4s ease forwards;
  transform-origin: left bottom;
}
.sec03_area1_img3 {
  width: 27.520833%;
  position: absolute;
  z-index: 3;
  top: 56%;
  left: 41%;
  rotate: 5deg;
  opacity: 0;
}
.animate_sec03_area1_img3 {
  animation: sec03_area1_imgs 0.4s ease forwards;
  transform-origin: left bottom;
}
.sec03_area1_img2 {
  width: 46.520833%;
  position: absolute;
  z-index: 2;
  top: 17%;
  right: 5%;
  opacity: 0;
}
.animate_sec03_area1_img2 {
  animation: sec03_area1_imgs 0.4s ease forwards;
  transform-origin: right bottom;
}
@keyframes sec03_area1_imgs {
  0% {
    transform: rotate(-30deg);
    opacity: 0;
  }
  100% {
    transform: rotate(0);
    opacity: 1;
  }
}
.sec03_area1_shape1 {
  width: 4.5%;
  position: absolute;
  z-index: 2;
  top: 10%;
  right: 23%;
  opacity: 0;
}
.animate_sec03_area1_shape1 {
  animation: sec03_area1_shape1_3 1.5s ease infinite;
  transform-origin: bottom;
}
.sec03_area1_shape2 {
  width: 6.854167%;
  position: absolute;
  z-index: 2;
  top: 10%;
  right: 12%;
  opacity: 0;
}
.animate_sec03_area1_shape2 {
  animation: sec03_area1_shape2_4 1.5s ease infinite;
  transform-origin: bottom;
}
.sec03_area1_shape3 {
  width: 6.958333%;
  position: absolute;
  z-index: 2;
  top: 67%;
  right: 21%;
  opacity: 0;
}
.animate_sec03_area1_shape3 {
  animation: sec03_area1_shape1_3 1.5s ease infinite;
  transform-origin: bottom;
}
.sec03_area1_shape4 {
  width: 4.5%;
  position: absolute;
  z-index: 2;
  top: 76%;
  right: 14%;
  opacity: 0;
}
.animate_sec03_area1_shape4 {
  animation: sec03_area1_shape2_4 1.5s ease infinite;
  transform-origin: bottom;
}
@keyframes sec03_area1_shape1_3 {
  0% {
    transform: rotate(10deg);
    opacity: 1;
  }
  50% {
    transform: rotate(-10deg);
    opacity: 1;
  }
  100% {
    transform: rotate(10deg);
    opacity: 1;
  }
}
@keyframes sec03_area1_shape2_4 {
  0% {
    transform: rotate(-10deg);
    opacity: 1;
  }
  50% {
    transform: rotate(10deg);
    opacity: 1;
  }
  100% {
    transform: rotate(-10deg);
    opacity: 1;
  }
}
.sec03_area1_text5 {
  width: 64.791667%;
  position: absolute;
  z-index: 2;
  top: 86%;
  left: 18%;
  opacity: 0;
}
.animate_sec03_area1_text5 {
  animation: fade_in 0.3s ease forwards;
  transform-origin: bottom;
}

.sec03_area2_1 {
  position: relative;
  background: url(../images/sec03_area2_bg1.webp) no-repeat;
  background-position: center;
  background-size: 93%;
}
.sec03_2406_img07 {
  opacity: 0;
}

.sec03_area2_icon1 {
  width: 22.5%;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 7%;
  opacity: 0;
}
.animate_sec03_area2_icon1 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area2_text1 {
  width: 38.604167%;
  position: absolute;
  z-index: 2;
  top: 2%;
  left: 31%;
  opacity: 0;
}
.animate_sec03_area2_text1 {
  animation: slide_left 0.3s ease forwards;
}
.sec04_area2_anime_box {
  opacity: 0;
}
.animate_sec04_area2_anime_box {
  animation: fade_in 0.5s ease forwards;
}
.sec03_area2_img1 {
  width: 25.375%;
  position: absolute;
  z-index: 2;
  top: 1%;
  right: 4%;
  opacity: 0;
}
.animate_sec03_area2_img1 {
  animation: scale_up 0.3s ease forwards;
}
.sec03_area2_text2 {
  width: 82.708333%;
  position: absolute;
  z-index: 4;
  top: 16.5%;
  left: 3.5%;
  opacity: 0;
}
.animate_sec03_area2_text2 {
  animation: left_slide_scaleup 0.4s ease forwards;
}
.sec03_area2_img2 {
  width: 40.020833%;
  position: absolute;
  z-index: 2;
  top: 39%;
  left: 9%;
  opacity: 0;
}
.animate_sec03_area2_img2 {
  animation: slide_rotate_left 0.4s ease forwards;
  transform-origin: bottom;
}
.sec03_area2_rotom1 {
  width: 50.75%;
  position: absolute;
  z-index: 2;
  top: 35.5%;
  right: 3%;
  opacity: 0;
}
.animate_sec03_area2_rotom1 {
  animation: slide_rotate_right 0.4s ease forwards;
  transform-origin: bottom;
}
.sec03_area2_text3 {
  width: 54.5625%;
  position: absolute;
  z-index: 2;
  top: 57.5%;
  left: 5.5%;
  opacity: 0;
}
.animate_sec03_area2_text3 {
  animation: sec03_area2_text3 2.5s ease infinite;
  transform-origin: right;
}
@keyframes sec03_area2_text3 {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  10% {
    transform: scale(0);
    opacity: 0;
  }
  20% {
    transform: scale(1.1);
    opacity: 1;
  }
  30% {
    transform: scale(1);
    opacity: 1;
  }
  80% {
    transform: scale(1);
    opacity: 1;
  }
  90% {
    transform: scale(1.1);
    opacity: 1;
  }
  100% {
    transform: scale(0);
    opacity: 1;
  }
}
.sec03_area2_text4 {
  width: 59.4375%;
  position: absolute;
  z-index: 2;
  top: 78.2%;
  right: 5%;
  opacity: 0;
}
.animate_sec03_area2_text4 {
  animation: fade_in 0.3s ease forwards;
}

.sec03_area2_2 {
  position: relative;
  background: url(../images/sec03_area2_bg2.webp) no-repeat;
  background-position: center;
  background-size: 93%;
}
.sec03_2406_img08 {
  opacity: 0;
}

.sec03_area2_icon2 {
  width: 22.5%;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 4%;
  opacity: 0;
}
.animate_sec03_area2_icon2 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area2_text5 {
  width: 38.604167%;
  position: absolute;
  z-index: 2;
  top: 2%;
  left: 28%;
  opacity: 0;
}
.animate_sec03_area2_text5 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area2_img3 {
  width: 38.145833%;
  position: absolute;
  z-index: 2;
  top: 4%;
  right: 3%;
  opacity: 0;
}
.animate_sec03_area2_img3 {
  animation: scale_up 0.3s ease forwards;
  transform-origin: right;
}
.sec03_area2_text6 {
  width: 89.104167%;
  position: absolute;
  z-index: 4;
  top: 14.5%;
  left: 5%;
  opacity: 0;
}
.animate_sec03_area2_text6 {
  animation: left_slide_scaleup 0.3s ease forwards;
}
.sec03_area2_img4 {
  width: 31.291667%;
  position: absolute;
  z-index: 2;
  top: 59.5%;
  left: 12%;
  opacity: 0;
}
.animate_sec03_area2_img4 {
  animation: slide_right2 0.4s ease forwards;
  animation-delay: 0.01s;
}
.sec03_area2_img5 {
  width: 31.291667%;
  position: absolute;
  z-index: 2;
  top: 42.5%;
  left: 12%;
  opacity: 0;
}
.animate_sec03_area2_img5 {
  animation: slide_right2 0.4s ease forwards;
}
.sec03_area2_rotom2 {
  width: 46.916667%;
  position: absolute;
  z-index: 2;
  top: 37%;
  right: 12%;
  opacity: 0;
}
.animate_sec03_area2_rotom2 {
  animation: slide_rotate_right 0.4s ease forwards;
  transform-origin: bottom;
}
@keyframes slide_rotate_left {
  0% {
    transform: translateX(30px) rotate(30deg);
    opacity: 0;
  }
  100% {
    transform: translateX(0) rotate(0);
    opacity: 1;
  }
}
@keyframes slide_rotate_right {
  0% {
    transform: translateX(-30px) rotate(-30deg);
    opacity: 0;
  }
  100% {
    transform: translateX(0) rotate(0);
    opacity: 1;
  }
}
@keyframes slide_right2 {
  0% {
    transform: translateX(30px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
.sec03_area2_text7 {
  width: 60.583333%;
  position: absolute;
  z-index: 2;
  top: 78%;
  right: 7%;
  opacity: 0;
}
.animate_sec03_area2_text7 {
  animation: fade_in 0.4s ease forwards;
}

.sec_inbox h3 {
  margin-top: -16%;
}

.sec03_ttl2_sp {
  margin-top: 25%;
}

.sec03_area3 {
  position: relative;
  background: url(../images/sec03_area3_bg1.webp) no-repeat;
  background-position: center;
  background-size: 93%;
}
.sec03_img03_2406 {
  opacity: 0;
}

.sec03_area3_icon {
  width: 23.5%;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 6%;
  opacity: 0;
}
.animate_sec03_area3_icon {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area3_text1 {
  width: 49.770833%;
  position: absolute;
  z-index: 2;
  top: 5%;
  left: 31%;
  opacity: 0;
}
.animate_sec03_area3_text1 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area3_text2 {
  width: 47.3125%;
  position: absolute;
  z-index: 2;
  top: 46%;
  opacity: 0;
}
.animate_sec03_area3_text2 {
  animation: scale_up 0.3s ease forwards;
  transform-origin: right;
}
.sec03_area3_img1 {
  width: 54.6875%;
  position: absolute;
  z-index: 2;
  top: 20%;
  left: 45%;
  opacity: 0;
}
.animate_sec03_area3_img1 {
  animation: slide_right 0.3s ease forwards;
}
.sec03_area3_text3 {
  width: 95.25%;
  position: absolute;
  z-index: 2;
  top: 89%;
  left: 2%;
  opacity: 0;
}
.animate_sec03_area3_text3 {
  animation: fade_in 0.3s ease forwards;
}

.sec03_area3_2 {
  position: relative;
  background: url(../images/sec03_area3_bg2.webp) no-repeat;
  background-position: center;
  background-size: 93%;
}
.sec03_img04_2406 {
  opacity: 0;
}

.sec03_area3_img2 {
  width: 54.6875%;
  position: absolute;
  z-index: 2;
  top: 0%;
  left: 9%;
  opacity: 0;
}
.animate_sec03_area3_img2 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area3_icon2 {
  width: 23.5%;
  position: absolute;
  z-index: 2;
  top: 10%;
  right: 9%;
  opacity: 0;
}
.animate_sec03_area3_icon2 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area3_text4 {
  width: 24.854167%;
  position: absolute;
  z-index: 2;
  top: 58%;
  right: 8%;
  opacity: 0;
}
.animate_sec03_area3_text4 {
  animation: slide_left 0.3s ease forwards;
}
.sec03_area3_text5 {
  width: 66.729167%;
  position: absolute;
  z-index: 2;
  top: 87%;
  left: 17%;
  opacity: 0;
}
.animate_sec03_area3_text5 {
  animation: fade_in 0.3s ease forwards;
}

.sec04_area1 {
  position: relative;
  margin-bottom: 13%;
}

.sec04_area1_img1 {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
.animate_sec04_area1_img1 {
  animation: fade_in 0.3s ease forwards;
}
.sec04_area1_img2 {
  width: 100%;
  position: absolute;
  top: 17%;
  left: 1%;
  opacity: 0;
}
.animate_sec04_area1_img2 {
  animation: fade_in 0.3s ease forwards;
}
.sec04_area1_text1 {
  width: 93.104167%;
  position: absolute;
  top: 34%;
  left: 4%;
  opacity: 0;
}
.animate_sec04_area1_text1 {
  animation: slide_left 0.3s ease forwards;
}
.sec04_area1_text2 {
  width: 44.104167%;
  position: absolute;
  z-index: 2;
  top: 56%;
  left: 6%;
  opacity: 0;
}
.animate_sec04_area1_text2 {
  animation: sec04_area1_text2 2.5s ease infinite;
  transform-origin: right;
}
@keyframes sec04_area1_text2 {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  10% {
    transform: scale(0);
    opacity: 0;
  }
  20% {
    transform: scale(1.1);
    opacity: 1;
  }
  30% {
    transform: scale(1);
    opacity: 1;
  }
  80% {
    transform: scale(1);
    opacity: 1;
  }
  90% {
    transform: scale(1.1);
    opacity: 1;
  }
  100% {
    transform: scale(0);
    opacity: 1;
  }
}

.sec04_area1_img3 {
  width: 49.270833%;
  position: absolute;
  top: 55.5%;
  right: 8%;
  opacity: 0;
}
.animate_sec04_area1_img3 {
  animation: scale_up 0.3s ease forwards;
}
.sec04_area1_img4 {
  width: 95.104167%;
  position: absolute;
  top: 69%;
  left: 2%;
  opacity: 0;
}
.animate_sec04_area1_img4 {
  animation: fade_in 0.3s ease forwards;
}
.sec04_area1_img5 {
  width: 90.104167%;
  position: absolute;
  top: 81.5%;
  left: 6%;
  opacity: 0;
}
.animate_sec04_area1_img5 {
  animation: fade_in 0.3s ease forwards;
}

.sec04_area2 {
  position: relative;
}
.sec06_img02_sp {
  opacity: 0;
}

.sec04_area2_text1 {
  width: 98%;
  position: absolute;
  top: 4%;
  left: 1%;
  opacity: 0;
}
.animate_sec04_area2_text1 {
  animation: scale_up 0.4s ease forwards;
}
.sec04_area2_img1 {
  width: 34.75%;
  position: absolute;
  top: 22%;
  left: 12%;
  opacity: 0;
}
.animate_sec04_area2_img1 {
  animation: fade_in 0.4s ease forwards;
}
.sec04_area2_img2 {
  width: 34.291667%;
  position: absolute;
  top: 22%;
  right: 1%;
  opacity: 0;
}
.animate_sec04_area2_img2 {
  animation: fade_in 0.4s ease forwards;
}
.sec04_area2_img3 {
  width: 51.270833%;
  position: absolute;
  top: 52%;
  left: 1.5%;
  opacity: 0;
}
.animate_sec04_area2_img3 {
  animation: fade_in 0.4s ease forwards;
}
.pen_fade_in {
  opacity: 0;
}
.animate_pen_fade_in {
  animation: fade_in 0.4s ease forwards;
}
.sec04_area2_img3_on {
  width: 14.8%;
  position: absolute;
  top: 74.6%;
  left: 15.5%;
  animation: sec04_area2_img3_on 1.5s ease infinite;
}
@keyframes sec04_area2_img3_on {
  0% {
    opacity: 1;
  }
  29% {
    opacity: 0;
  }
  75% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
.sec04_area2_img3_on2 {
  width: 14.8%;
  position: absolute;
  top: 75%;
  left: 21.5%;
  animation: sec04_area2_img3_on2 1.5s ease infinite;
}
@keyframes sec04_area2_img3_on2 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  75% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
.sec04_area2_pen {
  width: 35.208333%;
  position: absolute;
  z-index: 45;
  top: 39%;
  left: 15%;
  animation: sec04_area2_pen 1.5s ease infinite;
}
@keyframes sec04_area2_pen {
  0% {
    transform: translateX(0) translateY(0);
  }
  25% {
    transform: translateX(30%) translateY(-10%);
  }
  50% {
    transform: translateX(25%) translateY(3%);
  }
  75% {
    transform: translateX(55%) translateY(0%);
  }
  100% {
    transform: translateX(55%) translateY(0%);
  }
}
.sec04_area2_arrow {
  width: 22.479167%;
  position: absolute;
  z-index: 3;
  top: 58%;
  left: 47%;
  opacity: 0;
}
.animate_sec04_area2_arrow {
  animation: fade_in 0.4s ease forwards;
}
.sec04_area2_img4 {
  width: 45.854167%;
  position: absolute;
  top: 55%;
  right: 11%;
  opacity: 0;
}
.animate_sec04_area2_img4 {
  animation: fade_in 0.4s ease forwards;
}
.sec04_area2_shape {
  width: 12.958333%;
  position: absolute;
  z-index: 2;
  top: 71%;
  right: 10%;
  opacity: 0;
}
.animate_sec04_area2_shape {
  animation: fade_in 0.4s ease forwards;
}
.sec04_area2_text2 {
  width: 67.375%;
  position: absolute;
  top: 81%;
  left: 8%;
  opacity: 0;
}
.animate_sec04_area2_text2 {
  animation: wipe_left 0.5s ease forwards;
}

@keyframes left_slide_scaleup {
  0% {
    transform: scale(0.8) translateX(-50px);
    opacity: 0;
  }
  60% {
    transform: scale(0.8) translateX(0);
    opacity: 1;
  }
  100% {
    transform: scale(1) translateX(0);
    opacity: 1;
  }
}
@keyframes rotate_down {
  0% {
    transform: rotate(30deg);
    opacity: 0;
  }
  100% {
    transform: rotate(0);
    opacity: 1;
  }
}
@keyframes scale_up {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  50% {
    transform: scale(1.1);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes slide_left {
  0% {
    transform: translateX(-30px);
    opacity: 0;
  }
  70% {
    transform: translateX(10px);
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes slide_right {
  0% {
    transform: translateX(30px);
    opacity: 0;
  }
  70% {
    transform: translateX(-10px);
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes wipe_left {
  0% {
    clip-path: inset(0 100% 0 0);
    opacity: 1;
  }
  100% {
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
@keyframes wipe_right {
  0% {
    clip-path: inset(0 0 100% 0);
    opacity: 1;
  }
  100% {
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
@keyframes wipe_up {
  0% {
    clip-path: inset(100% 0 0 0);
    opacity: 1;
  }
  100% {
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
@keyframes wipe_down {
  0% {
    clip-path: inset(0 0 100% 0);
    opacity: 1;
  }
  100% {
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
@keyframes slide_down {
  0% {
    transform: translateY(-30px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade_in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}