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


.ct_box {
background: url(../images/bg.jpg) top center no-repeat;
background-attachment: fixed;
background-size: cover;
}

.ct_inbox {
width: 100%;
max-width: 1200px;
margin: 0 auto;
}




.mainimg_box {
background: url(../images/mainimg_bg.jpg) top center no-repeat;
background-size: cover;
margin: 0 auto;
}

.mainimg_box h1 {
display: block;
max-width: 1394px;
width: 100%;
margin: 0 auto;
padding: 20px 0;
}



.price_box {
background: url(../images/price_bg.png) center center repeat-x;
background-size: auto 100%;
padding: 20px 0;
margin-bottom: 40px;
}

.price_box .price_inbox{
width: 90%;
max-width: 1100px;
margin: 0 auto;

display: -webkit-flex;
display: flex;
-webkit-justify-content: space-around;
justify-content: space-around;

align-items: center;

}
.price_box .price_inbox .price_txt{
max-width: 418px;
width: 70%;
}

.price_box .btn_mall {
display: block;
width: 60%;
max-width: 371px;
}

/* .price_box .price_inbox .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: 1px solid transparent;
padding: .375rem 2rem;
font-size: 18px;
width: 180px;
border-radius: 6px;
}
.price_box .price_inbox .btn_mall .btn.btn-light {
display: block;
color: #fff;
background-color: #FF8811;
border-color: #FF8811;
} */




#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;
}


.movie_area {
max-width: 980px;
width: 100%;
margin:0 auto 40px;
border: solid 3px #FF592D;
}


.promo_movie_box {
width: 100%;
max-width: 980px;
margin: 0 auto;
}




.ct_inbox section {
margin-bottom: 80px;
}


.ct_inbox section .sec_ttl {
margin-bottom: 40px;
}


.ct_inbox section .sec_ttl.slidein {
opacity: 0;
transition: 0.5s;
}


.ct_inbox section .sec_ttl.slidein.is-show {
  animation: slideIn 0.5s cubic-bezier(0.25, 1, 0.5, 1) 0.3s forwards;
}

@keyframes slideIn {
  0% {
    transform: translateX(70%);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
  }
  40%,100% {
    opacity: 1;
  }
}

.fadeup {
opacity: 0;
transition: 0.7s;
}

.fadeup.is-show {
  animation: fadeUp 0.7s cubic-bezier(0.25, 1, 0.5, 1) .3s forwards;
}

@keyframes fadeUp {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
  }
  40%,100% {
    opacity: 1;
  }
}




.sec01_movie_area {
width: 100%;
margin: 0 auto 30px;

display: -webkit-flex;
display: flex;
-webkit-justify-content: space-around;
justify-content: space-around;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}

.sec01_movie_area .sec01_movie_box {
width: 32%;
}

.sec01_pc {
position: relative;
}

.sec01pc_over {
position: absolute;
z-index: 100;
top:0;
left:0;
}
.sec01pc_cap {
position: absolute;
z-index: 50;
top:0;
left:0;
}

.sec01pc_1_kid {
position: absolute;
z-index: 11;
width:17.58%; height:40.87%; left:20.42%; top:7.40%;
animation: sec01kid1 1.5s ease 0s infinite normal forwards;
}
@keyframes sec01kid1 {
  0%{
    transform: translate(0,0);
    animation-timing-function: cubic-bezier(0,.5,.5,1);
  }
  15%{
    transform: translate(0,-10%);
    animation-timing-function: cubic-bezier(.5,0,1,.5);
  }
  30%{
    transform: translate(0,0);
  }
  100%{
    transform: translate(0,0);
  }
}

.sec01pc_1_txt {
position: absolute;
z-index: 61;
width:27.92%; height:12.44%; left:15.75%; top:25.57%;
/* animation: sec01kid1 0.6s ease 0.3s infinite normal forwards; */
}

.sec01pc_2_kid {
position: absolute;
z-index: 12;
width:21.67%; height:36.03%; left:38.75%; top:-0.30%;
animation: sec01kid2 1s ease 0s infinite normal forwards;
}
@keyframes sec01kid2 {
  0.0%{
    transform: translate(0,0) rotate(5deg);
    animation-timing-function: cubic-bezier(0,.5,.5,1);
  }
  100%{
    transform: translate(0,0) rotate(5deg);
  }
  50%{
    transform: translate(-10%,5%) rotate(-5deg);
    animation-timing-function: cubic-bezier(.5,0,1,.5);
  }
}
.sec01pc_2_txt {
position: absolute;
z-index: 62;
width:21.92%; height:12.73%; left:40.83%; top:14.02%;
/* animation: sec01kid2 1s ease 0.3s infinite normal forwards; */
}

.sec01pc_3_kid {
position: absolute;
z-index: 13;
width:15.42%; height:24.09%; left:69.08%; top:1.58%;
animation: sec01kid3 1.2s ease 0s infinite normal forwards;
}
/* Copy this @keyframes block to your CSS*/
@keyframes sec01kid3 {
  0.0%{
    transform: translate(0,0);
    animation-timing-function: cubic-bezier(0,.5,.5,1);
  }
  100%{
    transform: translate(0,0);
  }
  25%{
    transform: translate(-10%,-5%);
    animation-timing-function: cubic-bezier(.5,0,1,.5);
  }
  50%{
    transform: translate(0,0);
    animation-timing-function: cubic-bezier(0,.5,.5,1);
  }
  75%{
    transform: translate(10%,-5%);
    animation-timing-function: cubic-bezier(.5,0,1,.5);
  }
}
.sec01pc_3_txt {
position: absolute;
z-index: 63;
width:23.08%; height:15.20%; left:68.00%; top:15.99%;
/* animation: sec01kid3 1.2s ease 0.4s infinite normal forwards; */
}
.sec01pc_4_kid {
position: absolute;
z-index: 14;
width:23.50%; height:30.21%; left:53.25%; top:27.94%;
animation: sec01kid4 2s linear 0s infinite normal forwards;
}
/* Copy this @keyframes block to your CSS*/
@keyframes sec01kid4 {
  0.0%{
    transform: translate(0,0);
  }
  100%{
    transform: translate(0,0);
  }
  12.5%{
    transform: translate(4%,2%);
  }
  25%{
    transform: translate(5%,5%);
  }
  37.5%{
    transform: translate(4%,7%);
  }
  50%{
    transform: translate(0,10%);
  }
  62.5%{
    transform: translate(-4%,7%);
  }
  75%{
    transform: translate(-5%,5%);
  }
  87.5%{
    transform: translate(-4%,2%);
  }
}

.sec01pc_4_txt {
position: absolute;
z-index: 64;
width:19.75%; height:13.33%; left:64.92%; top:41.46%;
/* animation: sec01kid4 2s linear 0.5s infinite normal forwards; */
}


.sec_img2　{
max-width: 1002px;
width: 96%;
}

h3.sec03_ttl {
display: block;
width: 100%;
}

.sec03_box01 {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-bottom: 30px;
}
.sec03_box01>div {
width: 32%;
max-width: 385px;
}

.sec03_box04 {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-around;
justify-content: space-around;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-bottom: 20px;
}
.sec03_box04>div {
width: 50%;
max-width: 448px;
}

.sec03_img09 {
max-width: 963px;
width: 96%;
margin: 0 auto;
}

.sec05_img01 {
max-width: 1080px;
width: 100%;
margin: 0 auto 30px;
}

.bnr_get_monsterball_go {
display: block;
width: 80%;
max-width: 507px;
margin: 0 auto 30px;
}

.btn_box {
max-width: 371px;
width: 80%;
margin: 0 auto 30px;
}
.btn_box a {
display: block;
margin-bottom: 30px;
}

.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;
}
.btn_manual_box a {
max-width: 371px;
display: block;
margin-bottom: 30px;
}



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