@charset "UTF-8";

.MovieIndex .Wrapper{padding:60px 20px;}
.MovieIndex .announce{margin-bottom:40px;}
.MovieIndex ul{display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;}
.MovieIndex li{width:33.33%;-webkit-box-sizing: border-box;box-sizing: border-box;padding:0 10px;margin-bottom:30px;}
.MovieIndex .video { display:block;width: 100%;position: relative; }
.MovieIndex .video:before{ padding-top: 56.25%;content:"";display: block; }
.MovieIndex .video > .in{ position: absolute;top: 0;left: 0;width: 100%;height: 100%; }
.MovieIndex .video > .in > iframe{width:100%;height:100%;display:block;position:relative;}
.MovieIndex .video > .in > span{width:100%;height:100%;display:block;position:absolute;top:0;left:0;}
.MovieIndex .video > .in > span:hover{cursor:ponter;}
.MovieIndex .title{font-size:18px;font-weight:bold;margin-top:8px;line-height:1.4;display:block;text-align:center;}

.backyeard .close{width: 60px;height: 60px;display: none;position: fixed;top: 0;right: 0;z-index: 999;font-size: 24px;line-height: 1.1;font-size:40px;line-height:60px;color:#fff;font-weight:bold;text-align:center;}
.backyeard.on .close{display:block;}
.backyeard .close:hover{cursor:pointer}

.backyeard .base{position: fixed;width: 100%;height: 100%;background: rgba(0,0,0,0.9);display: none;top:0;left:0;z-index:100;}
.backyeard .base:hover{cursor:pointer}
.backyeard.on .base{display:block;}
.backyeard .v_cont{display:none;max-width:820px;width:65%;width: 65%;position: fixed;top: 50%;left: 50%;transform: translate(-50%,-50%);z-index:120;}
.backyeard .v_cont.on{display:block;}

.backyeard .v_cont:before{ padding-top: 56.25%;content:"";display: block; }
.backyeard .v_cont > .in{ position: absolute;top: 0;left: 0;width: 100%;height: 100%; }
.backyeard .v_cont > .in > *{width:100%;height:100%;display:block;position:relative;}

.interview {max-width: 360px;margin: 40px auto 20px;}
.interview a{display:block;text-align:center;padding: 12px;background: #ca452b;color: #fff;border: none;font-weight: bold;text-decoration:none;
-webkit-border-radius: 100vh; border-radius: 100vh;}

.contact{display: block;height: 110px;background: rgb(202,36,51);background: linear-gradient(135deg, rgba(202,36,51,1) 0%, rgba(203,142,27,1) 100%);-webkit-border-radius: 6px;border-radius: 6px;padding: 4px;margin: 0 auto;    }
.contact .Box{background: #fff;width: 100%;height: 100%;-webkit-border-radius: 3px;border-radius: 3px;text-align: center;justify-content: center;}
.contact .Box a{display: block;width: 100%;height: 100%;pointer-events: none;padding: 20px;}
.contact .Box .Tel{display: block;font-size: 38px;font-weight: bold;font-family: Helvetica, Arial, sans-serif;background: linear-gradient(135deg, rgba(202,36,51,1) 0%, rgba(203,142,27,1) 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;line-height: 27px;height: 32px;margin-top: 11px;}
.contact .Box .Tel::before{content: "";display: inline-block;width: 19px;height: 29px;background: url(../images/home/IconTelBanner.png) no-repeat;margin-right: 4px;margin-bottom: -1px;}
.contact .Box .Tel > span::before,.home_recruit .Contact .Box .Tel > span::after{content: "-";vertical-align: 10%;}
.contact .Box .Title{display: block;font-size: 18px;font-weight: bold;background: linear-gradient(135deg, rgba(202,36,51,1) 0%, rgba(203,142,27,1) 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;line-height: 1;}

/** PC_tablet ****/
@media screen and (min-width:1080px) {
	.MovieIndex li{width:50%}
}

/** SP ****/
@media screen and (max-width:767px) {
	.MovieIndex .announce br{display:none;}
	.MovieIndex .Wrapper{padding:40px 20px;}
	.MovieIndex li{width:100%}
	.contact{max-width: 400px;}
}
/** PC ****/
@media screen and (min-width:768px) {
	.MovieIndex .announce{text-align:center;}
	.contact{width: 400px;}
	.interview a:hover{background:#f38001;}
}

}
