@charset "UTF-8";
/*jquery.modal.css*/
.blocker,.modal{box-sizing:border-box}.blocker{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:auto;z-index:1;padding:20px;background-color:#000;background-color:rgba(0,0,0,.75);text-align:center}.blocker:before{content:"";display:inline-block;height:100%;vertical-align:middle;margin-right:-.05em}.blocker.behind{background-color:transparent}.modal{display:none;vertical-align:middle;position:relative;z-index:2;max-width:500px;width:90%;background:#fff;padding:15px 30px;-webkit-border-radius:8px;-moz-border-radius:8px;-o-border-radius:8px;-ms-border-radius:8px;border-radius:8px;-webkit-box-shadow:0 0 10px #000;-moz-box-shadow:0 0 10px #000;-o-box-shadow:0 0 10px #000;-ms-box-shadow:0 0 10px #000;box-shadow:0 0 10px #000;text-align:left}.modal-spinner{display:none;position:fixed;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);padding:12px 16px;border-radius:5px;background-color:#111;height:20px}.modal-spinner>div{border-radius:100px;background-color:#fff;height:20px;width:2px;margin:0 1px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}.modal-spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.modal-spinner .rect3{-webkit-animation-delay:-1s;animation-delay:-1s}.modal-spinner .rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}@-webkit-keyframes sk-stretchdelay{0%,100%,40%{-webkit-transform:scaleY(.5)}20%{-webkit-transform:scaleY(1)}}@keyframes sk-stretchdelay{0%,100%,40%{transform:scaleY(.5);-webkit-transform:scaleY(.5)}20%{transform:scaleY(1);-webkit-transform:scaleY(1)}}

/* movie css */
.ttl {
 background-image: url("../img/movie/ttl-bg.png");
}
.movie_box {
width: calc(25% - 90px / 4);
margin-right: 30px;
margin-bottom: 30px;
}
.movie_box:nth-child(4n) {
margin-right: 0px;
}
.movie_box:hover {
opacity: 0.8;
}
.movie_title {
font-family: source-han-serif-japanese, serif;
font-weight: 400;
font-size: 1.4rem;
line-height: 145%;
display: block;
text-align: center;

}
.movie_wrap_box {
width: 100%;
display: flex;
flex-wrap: wrap;
}



/* youtube video */
.vdo-unit {
width: 100%;
margin-right: 20px;
}

.vdo-base {
margin-bottom: 15px;
position: relative;
}
.modal-open {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 6;
}
.vdo-body {
max-width: 100%;
height: auto;
padding-bottom: 56.25%;
position: relative;
overflow: hidden;
}
.vdo-body iframe {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}

/* modal */
.blocker {
z-index: 11;
}
.modal {
background-color: #242424;
border-radius: 4px;
max-width: 1200px;
padding: 10px;
color: #fff;
}
.modal-window .vdo-txt {
 margin-left: 2%;
}
.modal-window .vdo-txt .txt-ttl {
	margin-bottom: 6px;
}
.modal-window .vdo-txt .txt-txt {
margin-bottom: .4rem;
font-size: 1.3rem;
}
.modal a.close-modal {
background-color: #000;
border: 2px solid #242424;
border-radius: 50%;
display: block;
width: 26px;
height: 26px;
padding: 30px 30px 0 0;
overflow: hidden;
position: absolute;
top: -13px;
right: -13px;
}
.modal a.close-modal:hover {
background-color: #424242;
}
.modal a.close-modal::before,
.modal a.close-modal::after {
background-color: #999;
content: '';
display: block;
width: 2px;
height: 24px;
margin-left: -1px;
position: absolute;
top: 3px;
left: 50%;
}
.modal a.close-modal::before {
transform: rotate(-45deg);
}
.modal a.close-modal::after {
transform: rotate(45deg);
}

@media all and (max-width : 1280px ){
.movie_box {
width: calc(33.3333333% - 40px / 3);
margin-right: 20px;
margin-bottom: 30px;
}
.movie_box:nth-child(4n) {
margin-right: 20px;
}
.movie_box:nth-child(3n) {
margin-right: 0px;
}

}

@media all and (max-width : 767px ){
.breadcrumb {
display: none;
}
.movie_box {
width: calc(50% - 15px / 2);
margin-right: 15px;
margin-bottom: 20px;
}
.movie_box:nth-child(3n) {
margin-right: 15px;
}
.movie_box:nth-child(2n) {
margin-right: 0px;
}

.movie_title {
font-size: 1.1rem;

line-height: 145%;
display: block;
}
}

