@charset "utf-8";

/* s0 */

#s0 {
    position: relative;
    width: 100%;
}
#tp {
    position: relative;
    width: 100%;
    min-width: 2000px;
    left: 50%;
    margin-left: -1000px;
    pointer-events: none;
    overflow-x: hidden;
}
.tp { position: relative;  }
.tp img { width: 100%; display: block; }
#s0 h1 { position: absolute; width: 75.68%; left: 12.2%; top: 0; margin-top: 12.1%; }

#topmovie { position: absolute; width: 62.59%; left: 19.23%; top: 0; margin-top: 67.77%; }
#topmovie p {
    width: 70%;
    left: 15%;
}
#topmovie .movie_pic {
    margin-top: 6.04%;
}
/* s1 */
#s1 {
    background: url(../images/top/s1/s1_bg_bottom.png) center bottom repeat-x #005deb;
    background-size: auto 544px;
    padding-bottom: 8.39%;
}
#s1:before {
    content: "";
    display: block;
    position: absolute;
    left: -4%;
    top: 0px;
    width: 108%;
    height: 0;
    padding-top: 500px;
    transform: rotate(-15deg) translateY(-54.8%);
    background: url(../images/top/s1/s1_bg_rot.png) center top repeat-x;
    background-size: auto 100%;
}
#s1 h2 { position: relative; width: 43.65%; margin: 6.93% 0 5.46% 28.22%; }

#s1_1 .box_main:before {
    content: "";
    display: block;
    padding-top: 1.26%;
}
#s1_1_tx_p1 { position: absolute; width: 14.07%; left: 71.06%; top: 0; margin-top: 2.56%; }
#s1_1_tx_p2 { position: absolute; width: 11.95%; left: 84.8%; top: 0; margin-top: 11.95%; }

#s1_1_ss .pic {
    margin-bottom: 7.83%;
}

/* spec */

#spec {
    background: url(../images/top/spec/spec_bg.png) center bottom repeat-x #009af5;
    background-size: auto 484px;
    padding-bottom: 8.39%;
}
#spec h2 {
    position: relative;
    padding-top: 1.95%;
    width: 74.9%;
    margin: 0 0 0 12.59%;
}
#spec_main {
    position: relative;
    width: 100%;
    margin: 0 auto;
}
#spec_pic { position: absolute; width: 36.23%; left: 3.61%; top: 0; margin-top: 27.14%; }
#spec_tx  { position: absolute; width: 56.15%; left: 43.06%; top: 0; margin-top: 0.78%; }

@media screen and (min-width:2001px) {
    #tp {
        left: auto;
        margin-left: 0;
    }
    #s0 .contents {
        width: 51.2%;
    }
}
@media screen and (max-width:1023px) {
    #tp {
        width: 200%;
        left: 0;
        margin-left: -50%;
        min-width: unset;
    }
    #s1 {
        background-size: 6.34% auto;
    }
    #s1:before {
        padding-top: 48.82%;
    }
    #spec {
        background-size: 6.34% auto;
    }
}
@media (orientation: portrait) and (max-width: 767px){
}

#topmovie { margin-top: 64.77%; }
#topmovie.movie p { bottom: 5%; }
#topmovie.movie:before { padding-top: 65.9%; }