@charset "utf-8";



.en li {
    position: absolute;
    /*top: 102px;*/
    top: 300px;
    left: 50%;
    z-index: 1;
    animation-delay: .1s;
    animation-name: enAnime;
    animation-duration: 1.2s;
    animation-fill-mode:both;
}


@keyframes enAnime {
    0% {
        opacity: 0;
        transform: scale(5,5);
    }
    40%{
      opacity: 1;
      transform: scale(1,1);
    }
    50%{
      top: 300px;
    }
    80%{
      top: 102px;
      opacity: 1;
    }
    100% {
      opacity: 0.1;
      top: 102px;
    }
  }

.jp{
    opacity: 0;
    animation-delay: 2s;
    animation-name: jpAnime;
    animation-duration: 1s;
    animation-fill-mode:both;
    position: relative;
  }
  

@keyframes jpAnime {
    0% {
        opacity: 0;
        left: -100px;
    }
    100% {
      opacity: 1;
      left: 0px;
    }
  }


  .mv-img_01 {
    width: 235px;
    top: 275px;
    margin-left: -351px;
    animation-delay: 1.2s;
    animation-name: st01Anime;
    animation-duration: .8s;
    animation-fill-mode:both;
  }
  .mv-img_02 {
    width: 320px;
    top: 272px;
    margin-left: -175px;
    animation-delay: 1.4s;
    animation-name: st02Anime;
    animation-duration: .8s;
    animation-fill-mode:both;
  }
  .mv-img_03 {
    width: 260px;
    top: 213px;
    margin-left: 84px;
    animation-delay: 1.6s;
    animation-name: st03Anime;
    animation-duration: .8s;
    animation-fill-mode:both;
  }
/*   
  .mv-img_04 {
    width: 260px;
    top: 225px;
    margin-left: 194px;
    animation-delay: 1.8s;
    animation-name: st04Anime;
    animation-duration: .8s;
    animation-fill-mode:both;
  } */

  @keyframes st01Anime {
    0% {
      opacity: 0;
      margin-left: -451px;
      top: 325px;
      
    }
    100% {
      opacity: 1;
      margin-left: -351px;
      top: 275px;
    }
  }
  
  @keyframes st02Anime {
    0% {
      opacity: 0;
      margin-left: -275px;
      top: 322px;
    }
    100% {
      opacity: 1;
      margin-left: -175px;
      top: 272px;
    }
  }
  
  @keyframes st03Anime {
    0% {
      opacity: 0;
      margin-left: -16px;
      top: 263px;
    }
    100% {
      opacity: 1;
      margin-left: 84px;
      top: 213px;
    }
  }
/*   
  @keyframes st04Anime {
    0% {
      opacity: 0;
      margin-left: 94px;
      top: 275px;
    }
    100% {
      opacity: 1;
      margin-left: 194px;
      top: 225px;
    }
  } */

  
  @media only screen and (max-width: 768px) {  
    .mv-img_01 {
      width: 110px;
      top: 86px;
      margin-left: -51% !important;
      z-index: 10;
    }
    .mv-img_02 {
      width: 174px;
      top: 85px;
      margin-left: -108px;
    }
    .mv-img_03 {
      width: 142px;
      top: 65px;
      margin-left: -22px;
    }
    .mv-img_04 {
      width: 126px;
      top: 70px;
      margin-left: 22% !important;
    }

    @keyframes enAnime {
      0% {
          opacity: 0;
          transform: scale(5,5);
      }
      40%{
        opacity: 1;
        transform: scale(1,1);
      }
      50%{
        top: 100px;
      }
      80%{
        top: 0px;
        opacity: 1;
      }
      100% {
        opacity: 0.1;
        top: 0px;
      }
    }

    @keyframes st01Anime {
      0% {
        opacity: 0;
        margin-left: -267px;
        top: 116px;
        
      }
      100% {
        opacity: 1;
        margin-left: -227px;
        top: 86px;
      }
    }
    
    @keyframes st02Anime {
      0% {
        opacity: 0;
        margin-left: -178px;
        top: 115px;
      }
      100% {
        opacity: 1;
        margin-left: -138px;
        top: 85px;
      }
    }
    
    @keyframes st03Anime {
      0% {
        opacity: 0;
        margin-left: -72px;
        top: 95px;
      }
      100% {
        opacity: 1;
        margin-left: -22px;
        top: 65px;
      }
    }
    
    @keyframes st04Anime {
      0% {
        opacity: 0;
        margin-left: 25px;
        top: 110px;
      }
      100% {
        opacity: 1;
        margin-left: 75px;
        top: 80px;
      }
    }
  
  }