.chara-1 img {
  transform: translate3d(300px, -220px, 0);
  opacity: 0;
  transition: all 300ms cubic-bezier(0.39, 0.575, 0.565, 1);
  transition-delay: 150ms;
}

body.onload .chara-1 img {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.chara-2 img {
  transform: translate3d(300px, 100px, 0);
  opacity: 0;
  transition: all 300ms cubic-bezier(0.39, 0.575, 0.565, 1);
  transition-delay: 30ms;
}

body.onload .chara-2 img {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.chara-3 img {
  transform: translate3d(320px, 200px, 0);
  opacity: 0;
  transition: all 300ms cubic-bezier(0.39, 0.575, 0.565, 1);
  transition-delay: 90ms;
}

body.onload .chara-3 img {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.chara-4 img {
  transform: translate3d(-280px, -200px, 0);
  opacity: 0;
  transition: all 300ms cubic-bezier(0.39, 0.575, 0.565, 1);
}

body.onload .chara-4 img {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.chara-5 img {
  transform: translate3d(-280px, 100px, 0);
  opacity: 0;
  transition: all 300ms cubic-bezier(0.39, 0.575, 0.565, 1);
  transition-delay: 60ms;
}

body.onload .chara-5 img {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.chara-6 img {
  transform: translate3d(-280px, 320px, 0);
  opacity: 0;
  transition: all 300ms cubic-bezier(0.39, 0.575, 0.565, 1);
  transition-delay: 120ms;
}

body.onload .chara-6 img {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

h1 img {
  transform: scale(2);
  opacity: 0;
  transition: all 300ms cubic-bezier(0.06, 0.82, 0.27, 1.62);
  transition-delay: 400ms;
}

body.onload h1 img {
  transform: scale(1);
  opacity: 1;
}

#pc-btn-pre a {
  transform: translate3d(0, -215px, 0);
  display: block;
  visibility: hidden;
}

body.onload #pc-btn-pre a {
  animation: animePreBtn 800ms linear 1200ms both;
  visibility: visible;
}

#sp-btn-pre a {
  display: block;
  position: relative;
  top: auto;
  transform: scale(0);
  transition: transform 300ms cubic-bezier(0.06, 0.82, 0.27, 1.62);
  transition-delay: 1200ms;
  visibility: hidden;
}

body.onload #sp-btn-pre a {
  animation: none;
  transform: scale(1);
  visibility: visible;
}

@keyframes animePreBtn {
  0% {
    transform: translate3d(0, -215px, 0);
  }
  4.7% {
    transform: translate3d(0, -118.316px, 0);
  }
  9.41% {
    transform: translate3d(0, -25.056px, 0);
  }
  14.11% {
    transform: translate3d(0, 30.295px, 0);
  }
  18.72% {
    transform: translate3d(0, 45.604px, 0);
  }
  24.32% {
    transform: translate3d(0, 32.368px, 0);
  }
  29.93% {
    transform: translate3d(0, 10.232px, 0);
  }
  35.54% {
    transform: translate3d(0, -4.423px, 0);
  }
  41.04% {
    transform: translate3d(0, -8.423px, 0);
  }
  52.15% {
    transform: translate3d(0, -1.89px, 0);
  }
  63.26% {
    transform: translate3d(0, 1.556px, 0);
  }
  85.49% {
    transform: translate3d(0, -0.287px, 0);
  }
  100% {
    transform: translate3d(0, 0px, 0);
  }
}

.release img {
  transition: opacity 400ms linear 700ms;
  opacity: 0;
  visibility: hidden;
}

body.onload .release img {
  opacity: 1;
  visibility: visible;
}

.pc-movie {
  transition: opacity 400ms linear 1000ms;
  opacity: 0;
  visibility: hidden;
}

body.onload .pc-movie {
  opacity: 1;
  visibility: visible;
}

.scrollbar-inner {
  /*height: 280px;
  width: 550px;*/
  height: auto;
  width: 530px;
  margin: 0 auto;
  overflow: hidden;
}

#btn-pagetop {
  display: none;
}