@charset "UTF-8";
/* CSS Document */

@import url("smartphone.css");

#contents {
    background-color: black;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: -25px auto 0;
}

#eyecatch {
    display: block;
    width: 90%;
    height: 46%;
    margin:  auto ;
    margin-top: 50px;
    max-width: 480px;
    /*background: url(../images/movies/kumo_2.jpg) center center no-repeat;*/
    background-size: 90vw;
}
#eyecatch img {
    width: 90%;
}
body #contents #eyecatch .bg-slider {
    margin-top: 20px;
    margin: auto;
    width: 90%;
    height: 44vw;
    display: block;
    background-size: 100%;
    z-index: 10;
}

#footlogo {
    background-color: black;
    padding-top: 50px;
}
footer {
    margin: 0;
}

#moviecontents {
    display: block;
    width: 80%;
    margin:  0 auto 10%;
    background-color: black;
    text-align: center;
}
.movies {
    width: 100%;
    background-color: black;
    text-align: center;
    margin: 20% auto 10%;
    display: grid;
    grid-row-gap: 20px;
}

.moviepic {
    display: block;
    width: 100%;
    margin: 0;
    grid-area: 1 / 1 / 2 / 2;
}
.moviepic img {
    display: block;
    width: 100%;
    margin: 0;
}
.movielink {
    display: flex;
    width: 30vw;
    margin: 0;
    justify-content: center;
    align-items: center;
    grid-area: 1 / 2 / 2 / 3;
}
.movielinktext {
    display: block;
}
.movielinktext a {
    display: block;
    margin: 30px auto;
    width: 20vw;
    height: auto;
}
.mlt6600v a {
    display: block;
    margin: 22px auto;
    width: 15vw;
    height: auto;
}
.movielinktext a img {
    display: block;
    height: 2.5vw;
}

.movietext {
    display: block;
    width: 80vw;
    grid-area: 2 / 1 / 3 / 3;
}
.movietext p {
font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;    color: #fff;
    text-align: left;
    font-size: calc(100%);
    font-weight: 700;
}
.text1{
    font-size: calc(200%);
    font-style: normal;
}
.text2{
    font-size: calc(130%);
    font-style: normal;
    
}

.movielink img {
    margin: auto;
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: block;
    margin-top: 3%;
}

.movielink a :hover {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
}
*/
	/*-webkit-transform:	rotateX(360deg);
	transform:		rotateX(360deg);*/

.movielink a :hover {
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.event {
    display: block;
    width: 100%;
    background-color: #ED6E46;
    margin: auto;
}
.event img {
    width: 95%;
    margin: 20px auto;
}