#aprilTop {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 200;
}
#aprilTop .starbg {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -455px 0 0 -685px;
  opacity: 0;
}
#aprilTop .chara {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -411px 0 0 -35%;
  opacity: 0;
  width: 70%;
}
#aprilTop .chara.moveLoop {
  -webkit-animation: topCharaLoop 10s cubic-bezier(0.4, 0, 0.4, 1) infinite;
  animation: topCharaLoop 10s cubic-bezier(0.4, 0, 0.4, 1) infinite;
}
#aprilTop .logo {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 68px 0 0  -401px;
  opacity: 0;
}
#aprilTop .btn {
  position: absolute;
  opacity: 0;
}
#aprilTop .btn p {
  position: absolute;
  top: 0;
  cursor: pointer;
}
#aprilTop .btn .off {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
#aprilTop .btn .off:hover {
  opacity: 0;
}
#aprilTop .btn.tw {
  left: 50%;
  top: 50%;
  margin: -266px 0 0 273px;
}
#aprilTop .btn.tw.moveLoop {
  -webkit-animation: topCharaLoop 10s cubic-bezier(0.4, 0, 0.4, 1) infinite;
  animation: topCharaLoop 10s cubic-bezier(0.4, 0, 0.4, 1) infinite;
}
#aprilTop .btn.voice {
  left: 50%;
  top: 50%;
  margin: -146px 0 0 356px;
}
#aprilTop .btn.voice.moveLoop {
  -webkit-animation: topCharaLoop 10s cubic-bezier(0.4, 0, 0.4, 1) infinite;
  animation: topCharaLoop 10s cubic-bezier(0.4, 0, 0.4, 1) infinite;
}
#aprilTop .btn.close {
  left: 50%;
  margin-left: -128px;
  bottom: 90px;
}
#aprilTop .catch1 {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -387px 0 0 -308px;
  opacity: 0;
}
#aprilTop .catch2 {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -339px 0 0 -363px;
  opacity: 0;
}

@-webkit-keyframes topCharaLoop {
  0% {
    -webkit-transform: translate3d(0, 0px, 0);
    transform: translate3d(0, 0px, 0);
  }

  50% {
    -webkit-transform: translate3d(0, 10px, 0) scale3d(1.01, 1.01, 1);
    transform: translate3d(0, 10px, 0) scale3d(1.01, 1.01, 1);
  }

  100% {
    -webkit-transform: translate3d(0, 0px, 0);
    transform: translate3d(0, 0px, 0);
  }
}
@keyframes topCharaLoop {
  0% {
    -webkit-transform: translate3d(0, 0px, 0);
    transform: translate3d(0, 0px, 0);
  }

  50% {
    -webkit-transform: translate3d(0, 10px, 0) scale3d(1.01, 1.01, 1);
    transform: translate3d(0, 10px, 0) scale3d(1.01, 1.01, 1);
  }

  100% {
    -webkit-transform: translate3d(0, 0px, 0);
    transform: translate3d(0, 0px, 0);
  }
}
