
html, body {
  width: auto
  !important; 
  overflow-x: 
  hidden!important
} 

body {
  background-color: #0d1057;
  margin: 0;
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  overflow-x: hidden; 
 
}
main {
  /* 60.3125 */
  position: relative;
  background-image: url("../img/pc_bg_v.jpg");
  background-repeat: no-repeat, no-repeat;
  background-size:cover;
  background-position: center center;
  min-width: 1920px;
  min-height: 705px;
}
img {
  width: 100%;
}

a {
  display: block;
}

.pc-model .button-big {
  width: 14.27%;
}

.pc-model .button-small {

  width: 5.104%;
}

.pc-model .btn-b {
  width: 20%;
  position: absolute;
  left: 13%;
  top: 62.7%;
  z-index: 5;
  background-size: 100%;
  animation-name: zoominout;
  animation-duration:1.5s;
  animation-iteration-count:infinite;
  z-index: 5;
}

@-webkit-keyframes zoominout {
  0% {
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
  }
  20% {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
  }
  30% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  35% {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes zoominout {
  0% {
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(1);

  }
  20% {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
  }
  30% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  35% {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

.pc-model .btn-b:hover {
  transform: scale(1.05);
  filter: brightness(1.1);
  animation-name: zoominout;
  animation-duration:2s;
  animation-iteration-count:infinite;
}

.pc-model .btn-c {
  width: 12%;
  position: absolute;
 right: 33.35%;
  top: 64.7%;
  z-index: 5;
background-size: 100%;
animation-name: zoominout;
animation-duration:1.5s;
animation-iteration-count:infinite;
z-index: 5;
}

@-webkit-keyframes zoominout {
0% {
  -webkit-transform: scale(2);
  -moz-transform: scale(2);
  -ms-transform: scale(2);
  -o-transform: scale(2);
  transform: scale(2);
}
20% {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05);
}
30% {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
35% {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05);
}
100% {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
}
@keyframes zoominout {
0% {
  -webkit-transform: scale(2);
  -moz-transform: scale(2);
  -ms-transform: scale(2);
  -o-transform: scale(2);
  transform: scale(1);

}
20% {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05);
}
30% {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
35% {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05);
}
100% {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
}

.pc-model .btn-c:hover {
transform: scale(1.05);
filter: brightness(1.1);
animation-name: zoominout;
animation-duration:2s;
animation-iteration-count:infinite;
}

 .container {
  width: auto;
 
}

.spin-model {
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center center;
  position: absolute;
  left: 37%;
  top: 19%;
  z-index: 4;
  width: 52%;
  align-items: center;
}

.spin-logo {
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center center;
  position: absolute;
  left: 18%;
    top: 26%;
  z-index: 4;
  width: 17%;
  align-items: center;
}

.header-textbox {

  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center center;
  position: absolute;
  left: 28%;
  top: 26%;
  z-index: 4;
  width: 45%;
  align-items: center;

}

.footer-Title {
  position:absolute;
  top: 90%;
  right: 41%;
  text-align:center;
  font-size:16px;
  color:white;
  font-family:arial; 
}
.footer {

    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
    position: absolute;
    right: 6px;
    top: 90%;
    z-index: 4;
    width: 99.2%;
  align-items: center;
}
.mb-model { 
  display: none;
}
.header_mb-textbox {
  width: 45%;
}
.header_mb-textbox .header-Title {
  position: absolute;
  top: 21.5%;
  text-align: center;
  font-size: 14px;
  color: white;
  font-family: arial;
  left: 0%;
  width: 100%;
  z-index: 6;
}
.mb-bg-container {
  position: relative;
  background-image: url("../img/mb_bg_v.jpg");
  background-repeat: no-repeat, no-repeat;
  background-size: contain;
  width: 100vw;
  height: calc(97vw * 2.31481);
  max-width: 1080px;
  overflow: hidden;
 }

 .spin-model_group{
background-repeat: no-repeat;
background-size: 100%;
background-position: center center;
position: absolute;
top: 26%;
z-index: 4;
width: 100%;
align-items: center;

 }

.mb-button {
  position: absolute;
  width: 80%;
    top: 100px;
    left: 9.8%; 
  background-size: 100%;
  animation-name: zoominout;
  animation-duration:1.5s;
  animation-iteration-count:infinite;
  z-index: 5;
}

@-webkit-keyframes zoominout {
  0% {
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
  }
  20% {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
  }
  30% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  35% {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes zoominout {
  0% {
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(1);

  }
  20% {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
  }
  30% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  35% {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

.mb-button :hover {
  transform: scale(1.05);
  filter: brightness(1.1);
  animation-name: zoominout;
  animation-duration:2s;
  animation-iteration-count:infinite;
}
.btn-a {
  top: 62.8%;
}
.btn-b {
  top: 83.8%;
}

/* RWD */
@media (max-width: 1080px) {
  body {
    overflow: auto;
  }
  .pc-model {
    display: none;
  }
  .mb-model {
    display: block;
  }
}

.container {
  width: auto;
 
}

.header-mb {

  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center center;
  position: absolute;
  left: 25%;
    top: 4%;
    z-index: 4;
    width: 50%;
  align-items: center;

}


.footer-Title_mb {
  position:absolute;
  left: -1%;
  top: 86%;
  width: 100%;
  text-align:center;
  font-size:16px;
  padding-bottom: 10%;
  padding-top: 5%;
  color:white;
  font-family:arial;
}

