.bg-main {
  top: 600px; }

.top-main {
  position: relative;
  width: 100%;
  position: relative;
  background: #090d66; }
  .top-main__title {
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 5%;
    z-index: 2; }
  .top-main__wrap {
    width: 100%;
    position: relative;
    opacity: 0;
    filter: alpha(opacity=0); }
    .top-main__wrap p {
      position: absolute; }
      .top-main__wrap p img {
        width: 100%;
        position: relative; }
  .top-main__bg {
    top: 0;
    position: relative !important; }
  .top-main__base {
    width: 100%;
    left: 0;
    top: 0; }
  .top-main__step {
    width: 100%;
    left: 0;
    top: 0; }
  .top-main__planet1 {
    width: 5.3%;
    top: 69.1%;
    left: 8.2%; }
  .top-main__planet2 {
    width: 9.8%;
    top: 60%;
    left: 20.8%; }
  .top-main__planet3 {
    width: 10.9%;
    top: 55%;
    left: 86.6%; }
  .top-main__dayon {
    width: 9.3%;
    top: 60.5%;
    left: 4%; }
  .top-main__chara img {
    opacity: 0;
    filter: alpha(opacity=0); }
  .top-main__chara1 {
    width: 7.7%;
    top: 31.6%;
    left: 64.6%; }
  .top-main__chara2 {
    width: 8.5%;
    top: 34.7%;
    left: 60%; }
  .top-main__chara3 {
    width: 9%;
    top: 38.2%;
    left: 55.2%; }
  .top-main__chara4 {
    width: 9.3%;
    top: 42.2%;
    left: 49.8%; }
  .top-main__chara5 {
    width: 9.8%;
    top: 46.1%;
    left: 44%; }
  .top-main__chara6 {
    width: 10.4%;
    top: 50.4%;
    left: 36.9%; }

.top-topics {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 42px;
  background: #00012d; }
  .top-topics__scroll {
    margin-right: 80px;
    overflow: hidden;
    height: 42px; }
    .top-topics__scroll ul {
      position: relative;
      left: 20px;
      top: 0; }
  .top-topics__item {
    text-align: left;
    float: left;
    margin-right: 50px; }
    .top-topics__item a {
      display: block; }
      .top-topics__item a:hover {
        animation-play-state: paused;
        -webkit-animation-play-state: paused; }
  .top-topics__date {
    width: 50px;
    font-size: 12px;
    line-height: 42px;
    float: left;
    color: #fdd23e; }
  .top-topics__title {
    font-size: 12px;
    line-height: 42px;
    float: left;
    white-space: nowrap; }
  .top-topics__btn {
    width: 80px;
    height: 42px;
    position: absolute;
    right: 0;
    top: 0; }
.limited {
  position: relative;
  width: 100%;
}
.limited img {
  width: 100%;
}
.top-schedule {
  width: 100%;
  background: #ee7b67;
  position: relative;
  padding-top: 39px;
  padding-bottom: 2px; }
  .top-schedule ul {
    letter-spacing: -.40em; }
    .top-schedule ul li {
      letter-spacing: normal;
      width: 42.6%;
      display: inline-block;
      vertical-align: top;
      margin: 0 9px 37px 9px; }

.top-ticket {
  position: relative;
  padding-top: 89px;
  padding-bottom: 94px; }
  .top-ticket__title {
    width: 34.6%;
    margin: 0 auto 38px auto; }
  .top-ticket__schedule {
    width: 92%;
    margin: 0 auto; }
    .top-ticket__schedule li {
      width: 100%;
      margin-bottom: 37px; }
  .top-ticket__btn {
    position: relative;
    z-index: 5;
    width: 64%;
    margin: 0 auto;
    display: block; }

.top-movie {
  position: relative;
  padding-top: 89px;
  padding-bottom: 94px; }
  .top-movie__title {
    width: 34.6%;
    margin: 0 auto 38px auto; }

  .top-movie__wrap {
    width: 92%;
    height: auto;
    margin: 0 auto;
    background: url(../image/top/bg_movie.png) no-repeat top center;
    background-size: 100% auto; }
/*     .top-movie__wrap div {
      width: 95%;
      height: auto;
      padding: 2.5% 0 4%;
      margin: 0 auto;
      position: relative; } */
      .top-movie__wrap div {
      position: relative;
      width: 95%;
      /* height: auto; */
      padding-bottom: 56.25%;
      padding-top: 2.5%;
      margin: 0 auto;
      height:0; }
        .top-movie__wrap div iframe {
          position: absolute;
          top: 4%;
          left: 0;
          width: 100%;
          height: 90%; }
      .top-movie__wrap .icon img {
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -36px 0 0 -30px; }
        .top-movie__wrap .icon:hover {
          text-decoration: none; }

.colorseparate {
  position: relative;
  overflow: hidden; }
  .colorseparate .color-bg {
    position: absolute;
    width: 100%;
    height: 100%; }