@charset "utf-8";




/*----------------------------------------
	for PC
----------------------------------------*/


@media screen and (min-width: 641px){


#content{background:#000;background-size:cover;background-position:center top;padding:0px 0 0;background-attachment:fixed;}

.iframe_box{width:100%;padding-top:40%;position:relative;box-shadow:0px 0px 3px rgba(0,0,0,0.5),4px 4px 3px rgba(0,0,0,0.3);}
/* .iframe_box{width:100%;padding-top:56.25%;position:relative;box-shadow:0px 0px 3px rgba(0,0,0,0.5),4px 4px 3px rgba(0,0,0,0.3);} */
.iframe_box iframe{position:absolute;top:0;width:100%;height:100%;border-radius:8px;overflow:hidden;}

	.iframe_box.new:before{content:'NEW';color:#373320;background-image:url(../img/common/new_bg.jpg);padding:2px 13px;box-shadow:0px 0px 6px rgba(0, 0, 0, 0.8);background-size:100%;border-radius:20px;font-size:16px;font-weight:800;font-family: 'Work Sans', cursive;display:inline-block;position:absolute;top:-7px;left:-7px;z-index:50;line-height:1.2;}

.channel_btn{display:block;background-color:#fff;padding:15px 20px 10px;margin-top:0px;text-align:center;}

.centering{text-align:center;}

#main_movie{padding-top:450px;overflow:hidden;position:relative;z-index:0!important;background:#000 url(../img/top/visual_img.jpg) no-repeat;background-size:100%;}
#tubular-container{top:0;left:0;position:absolute!important;}

#main_movie .playmark{display:block;position:absolute;top:50%;left:50%;width:112px;height:112px;margin-left:-56px;margin-top:-76px;z-index:15;box-shadow:3px 3px 15px rgba(0,0,0,0.8);border-radius:300px;}

#main_movie .caption{display:block;position:absolute;top:50%;left:50%;height:132px;margin-left:-300px;margin-top:50px;width:600px;color:#fff;z-index:15;font-size:24px;text-align:center;}
#main_movie .click_area{position:absolute;height:100%;width:100%;background-color:rgba(0,0,0,0.5);top:0;left:0;z-index:10;display:block;transition:all 0.5s;}

#main_movie .click_area:hover{background-color:rgba(0,0,0,0.7);top:0;left:0;z-index:10;display:block;}

#main_movie.new .caption:before{content:'NEW';color:#373320;background-image:url(../img/common/new_bg.jpg);padding:2px 13px;box-shadow:0px 0px 6px rgba(0, 0, 0, 0.8);background-size:100%;border-radius:20px;font-size:15px;font-weight:800;font-family: 'Work Sans', cursive;display:inline-block;line-height:1.2;text-shadow:none;margin-right:8px;margin-top:-5px;}


.movie_bg{background:#fff url(../img/movie/bg.jpg) center top no-repeat;background-size:100%; padding:80px 0 120px;box-shadow: 0px -2px 12px rgba(0,0,0,0.5);position:relative;z-index:10;}

h3{color:#226079;width:100%;border-bottom:1px solid #226079;margin-bottom:20px;font-size:23px;}

.flexbox{display:flex;justify-content:space-between;margin-bottom:40px;flex-wrap: wrap;}
.flexbox .thum {width:32.4%;display:block;position:relative;margin-bottom:20px;}
.flexbox .thum .image{width:100%;display:block;border-radius:8px;overflow:hidden;position:relative;box-shadow:0 0 8px rgba(0,0,0,0.5);transition:all 0.5s;background-color:#000;}
.flexbox .thum .image:hover{box-shadow:3px 3px 10px rgba(50,50,50,0.8);}
.flexbox .thum .image img{width:100%;display:block;transition:all 0.5s;}
.flexbox .thum .image:after{display:block;content:'';width:80px;height:80px;background-image:url(../img/common/playbtn.png);position:absolute;top:50%;left:50%;margin-left:-40px;margin-top:-40px;background-size:100%;border-radius:80px;box-shadow:3px 3px 14px rgba(0,0,0,0.9);transition:all 0.5s;}
.flexbox .thum .image:hover:after{display:block;content:'';width:80px;height:80px;background-image:url(../img/common/playbtn.png);position:absolute;top:50%;left:50%;margin-left:-40px;margin-top:-40px;background-size:100%;border-radius:80px;box-shadow:3px 3px 10px rgba(50,50,50,1);}
.image:hover img{opacity:0.5;}

.thum .caption{color:#226079;text-align:center;padding-top:6px;}

.thum.nofunc{opacity:0;}

.thum.new:before{content:'NEW';color:#373320;background-image:url(../img/common/new_bg.jpg);padding:2px 13px;box-shadow:0px 0px 6px rgba(0, 0, 0, 0.8);background-size:100%;border-radius:20px;font-size:15px;font-weight:800;font-family: 'Work Sans', cursive;display:inline-block;line-height:1.2;text-shadow:none;margin-right:10px;position:absolute;z-index:10;top:-5px;left:-5px;}



}




/*----------------------------------------
	for SP
----------------------------------------*/


@media screen and (max-width: 640px) {

	#content{background-size:cover;background-position:center top;padding:0px 0 0;}

	#main_movie{padding-top:70%;overflow:hidden;position:relative;z-index:0!important;background-image:url(../img/top/visual_sp.gif);background-size:100%;}
	#tubular-container{top:0;left:0;position:absolute!important;}
	#tubular-player{top:0!important;}
	#main_movie .playmark{display:block;position:absolute;top:50%;left:50%;width:80px;height:80px;margin-left:-40px;margin-top:-65px;z-index:15;box-shadow:3px 3px 15px rgba(0,0,0,0.8);border-radius:300px;}

	#main_movie .caption{display:block;position:absolute;top:50%;left:50%;height:132px;margin-left:-300px;margin-top:20px;width:600px;color:#fff;z-index:15;font-size:15px;text-align:center;}
	#main_movie .click_area{position:absolute;height:100%;width:100%;background-color:rgba(0,0,0,0.5);top:0;left:0;z-index:10;display:block;transition:all 0.5s;}


	#main_movie.new .caption:before{content:'NEW';color:#373320;background-image:url(../img/common/new_bg.jpg);padding:2px 10px;box-shadow:0px 0px 6px rgba(0, 0, 0, 0.8);background-size:100%;border-radius:20px;font-size:13px;font-weight:800;font-family: 'Work Sans', cursive;display:inline-block;line-height:1.2;text-shadow:none;margin-right:8px;margin-top:-5px;}


	.movie_bg{background:#fff url(../img/movie/bg.jpg) center top no-repeat;background-size:200%; padding:40px 0 30px;box-shadow: 0px -2px 12px rgba(0,0,0,0.5);position:relative;z-index:10;}


	h3{color:#226079;width:100%;border-bottom:1px solid #226079;margin-bottom:20px;font-size:18px;}

	.flexbox{display:flex;justify-content:space-between;margin-bottom:40px;flex-wrap:wrap;}
	.flexbox .thum {width:48%;display:block;position:relative;}
	.flexbox .thum .image{width:100%;display:block;border-radius:8px;overflow:hidden;position:relative;box-shadow:0 0 8px rgba(0,0,0,0.5);transition:all 0.5s;background-color:#000;}
	.flexbox .thum .image:hover{box-shadow:3px 3px 10px rgba(50,50,50,0.8);}
	.flexbox .thum .image img{width:100%;display:block;transition:all 0.5s;}
	.flexbox .thum .image:after{display:block;content:'';width:40px;height:40px;background-image:url(../img/common/playbtn.png);position:absolute;top:50%;left:50%;margin-left:-20px;margin-top:-20px;background-size:100%;border-radius:80px;box-shadow:3px 3px 14px rgba(0,0,0,0.9);transition:all 0.5s;}
	.flexbox .thum{margin-bottom:10px;}

	.image:hover img{opacity:0.5;}

	.thum .caption{color:#226079;text-align:center;padding-top:6px;font-size:12px;}

	.thum.nofunc{opacity:0;}

	.thum.new:before{content:'NEW';color:#373320;background-image:url(../img/common/new_bg.jpg);padding:2px 10px;box-shadow:0px 0px 6px rgba(0, 0, 0, 0.8);background-size:100%;border-radius:20px;font-size:13px;font-weight:800;font-family: 'Work Sans', cursive;display:inline-block;line-height:1.2;text-shadow:none;margin-right:10px;position:absolute;z-index:10;top:-5px;left:-5px;}


	.channel_btn{display:block;background-color:#fff;padding:15px 20px 10px;text-align:center;}

	.centering{text-align:center;}

	.caption{text-align:center;padding:10px 0 0px;font-size:16px;color:#052958;}


}