.mainVisual_v1{
  background: none;
  position: relative;
  overflow: hidden;
}
.mainVisual__img{
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  -webkit- transform: translateX(-50%);
  display: flex;
  flex-wrap: wrap;
  min-width: 1506px;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.mainVisual__img .img{
  min-width: 251px;
  width: calc(100% / 6);
  height: 100%;
  overflow: hidden;
}
.mainVisual__img .img:nth-child(6) {
  z-index: 2;
}
.mainVisual__img .img img{
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  font-family: 'object-fit: cover;'
}
.mainVisual__img .img:nth-child(1) img{
  transform: translateY(-100%);
  -webkit-animation: slidePlus 0.5s ease 0.25s 1 forwards;
  animation: slidePlus 0.5s ease 0.25s 1 forwards;
}
.mainVisual__img .img:nth-child(2) img{
  transform: translateY(100%);
  -webkit-animation: slidePlus 0.5s ease 0.5s 1 forwards;
  animation: slidePlus 0.5s ease 0.5s 1 forwards;
}
.mainVisual__img .img:nth-child(3) img{
  transform: translateY(-100%);
  -webkit-animation: slidePlus 0.5s ease 0.75s 1 forwards;
  animation: slidePlus 0.5s ease 0.75s 1 forwards;
}
.mainVisual__img .img:nth-child(4) img{
  transform: translateY(100%);
  -webkit-animation: slidePlus 0.5s ease 1s 1 forwards;
  animation: slidePlus 0.5s ease 1s 1 forwards;
}
.mainVisual__img .img:nth-child(5) img{
  transform: translateY(-100%);
  -webkit-animation: slidePlus 0.5s ease 1.25s 1 forwards;
  animation: slidePlus 0.5s ease 1.25s 1 forwards;
}
.mainVisual__img .img:nth-child(6) img{
  transform: translateY(100%);
  -webkit-animation: slidePlus 0.5s ease 1.5s 1 forwards;
  animation: slidePlus 0.5s ease 1.5s 1 forwards;
}
.mainVisual__img::before{
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1;
  -webkit-animation: slideLeft 0.7s cubic-bezier(0.79, 0.32, 0.25, 1) 2s 1 forwards;
  animation: slideLeft 0.7s cubic-bezier(0.79, 0.32, 0.25, 1) 2s 1 forwards;
}
@-webkit-keyframes slidePlus {
  100% {
    transform: translateY(0);
  }
}
@keyframes slidePlus {
  100% {
    transform: translateY(0);
  }
}
@-webkit-keyframes slideLeft {
  100% {
    left: 0;
  }
}
@keyframes slideLeft {
  100% {
    left: 0;
  }
}
#svg-animation{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  margin: auto;
  width: 90%;
  text-align: center;
  max-width: 1276px;
  z-index: 5;
}
#svg-animation .mv{
  fill:none;
  stroke:#FFF;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-miterlimit:10;
  stroke-dasharray: 1500;
  stroke-dashoffset:1500;
}
#svg-animation.fill {
  animation: fill_shadow 0.4s both;
}
#svg-animation.fill .mv{
  animation: fill_color 0.4s both;
}
@keyframes fill_shadow {
  0% {
    filter: drop-shadow(1px 1px 0px rgba(51, 51, 51, 0));
  }

  100% {
    filter: drop-shadow(3px 3px 0px rgba(51, 51, 51, 0.3));
  }
}
@keyframes fill_color {
  0% {
    fill:rgba(255, 255, 255, 0);
  }
  100% {
    fill:rgba(255, 255, 255, 1);
  }
}

.mainVisual_v1 .top_main_btn{
  bottom: -100%;
}
.mainVisual_v1 .top_main_btn.active{
  -webkit-animation: up 0.3s ease 0.25s 1 forwards;
  animation: up 0.3s ease 0.25s 1 forwards;
}
@keyframes up {
  0% {
    bottom: -100%;
  }
  100% {
    bottom: 0%;
  }
}
.mainVisual_v1 .start_text{
  opacity: 0;
}
.mainVisual_v1 .start_text.active{
  -webkit-animation: shows 0.3s ease 0.9s 1 forwards;
  animation: shows 0.3s ease 0.9s 1 forwards;
}
@keyframes shows {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.mainVisual_v1 .start_text.active a:after{
  animation: sdl 2s cubic-bezier(1, 0, 0, 1) infinite;
}
@keyframes sdl {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  30% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  70% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}

@media screen and (max-width: 767px){
  .mainVisual_v1{
    height: 113vw;
  }
  .mainVisual__img{
    min-width: 100%;
    height: 89vw;
  }
  .mainVisual__img .img {
    min-width: auto;
    width: calc(100% / 4);
  }
  .spfx{
    position: absolute;
    bottom: 0;
    left: 0;
  }
}


#layer_2{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-83%) translateX(-50%);
  -webkit- transform: translateY(-83%) translateX(-50%);
  margin: auto;
  width: 90%;
  text-align: center;
  max-width: 1276px;
  z-index: 5;
  filter: drop-shadow(3px 3px 0px rgba(51, 51, 51, 0.3));
}
#layer_1{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  margin: auto;
  width: 90%;
  text-align: center;
  max-width: 1276px;
  z-index: 5;
  filter: drop-shadow(3px 3px 0px rgba(51, 51, 51, 0.3));
}
.main_v{
  opacity: 0;
  fill: #FFF;    
}
.main_v.fadein{
  opacity: 1;
}


#topPage .menu_right{
  display:none;
}
#topPage .menu_right_top{
  display:flex;
}