@charset "UTF-8";

nav:after, nav ul:after, #sns:after, .movNavBox ul:after, #app ul:after
{ content:"."; display:block; clear:both; height:0; visibility:hidden; }

/* content */
header{ font-size:0px; line-height:0px; text-indent:100%; }
dl.text dt{ color:#8d0b12; margin-bottom:1em; }
dl.text dd{ margin-bottom:1.6em; }
dl.text p{ margin-bottom:1em; }

#entry{ background:no-repeat center center; width:100%; }
#entry .inner{ margin:0 auto; }
#btn_entry{ width:288px; margin:auto; }
#btn_fb, #btn_tw{ background:no-repeat center; }
#btn_fb a, #btn_tw a{ text-indent:-9999px; display:block; font-size:0px; height:100%; }
#topBnr{ margin-top:20px; }

.moviebox{width:912px;margin:0 auto;}
.movNavBox{width:342px;height:90px;margin:10px auto 10px;}
.movNavBox li{ float:left;width:161px;height:91px;margin-right:20px;background-color:#fff;position:relative;}
.movNavBox li:last-child{margin-right:0;}
.movNavBox li a{display:block;width:160px;height:90px;border:1px solid #464646;overflow:hidden; box-sizing:border-box;}
.movNavBox li a:hover{opacity:.7;}
.movNavBox li span{ display:block; width:160px; height:90px; background-color:#000; color:#888; text-align:center; font-size:0.8em; line-height:90px; }
/*.movNavBox li a:after{content:url("../img/movie_btn_play.png");margin-left:-21px;position:absolute;left:50%;top:24px;}*/

#app{ width:930px; margin:0 15px; overflow:hidden; }
#app ul li{ float:left; width:174px; margin:0px 15px 15px 0px; }

#ivent{ width:930px; margin:0 15px; overflow:hidden; }
#ivent ul li{ float:left; width:300px; margin:0px 15px 15px 0px; }
/* by size */
@media screen and ( min-width : 481px )  {
header{ background-image:url(../img/main_visual.jpg); height:440px; }
#entry{ background-image:url(../img/bg_entry.jpg); height:578px; }
#entry .inner{ width:960px; padding-top:210px; }
#btn_entry{ margin-bottom:205px; }
#btn_fb, #btn_tw
{ width:470px; height:72px; }
#btn_fb{ float:left; background-image:url(../img/btn_fb.png); }
#btn_tw{ float:right; background-image:url(../img/btn_tw.png); }
#topBnr a img{ width:622px; }
.movNavBox li a img{ margin-top:-15px; }
#app ul li:last-child{ margin-right:0px; }
#ivent ul li:nth-child(3n+3){ margin-right:0px; }
}
@media screen and ( max-width : 480px )  {
header{ background-image:url(../img/main_visual_s.jpg); height:238px; background-size: contain; }
.blockset h2{ font-size:110%; font-weight:bold; padding:0.8em; }
dl.text dt{ margin-bottom:0.5em; }
dl.text dd{ margin-bottom:0.8em; }
dl.text p{ margin-bottom:0.5em; }
#entry{ background-image:url(../img/bg_entry_s.jpg); height:355px; background-size: contain; }
#entry .inner{ width:300px; padding-top:108px; }
#btn_entry{ margin-bottom:80px; }
#btn_fb, #btn_tw
{ width:300px; height:46px; background-size: contain; margin:auto; }
#btn_fb{ background-image:url(../img/btn_fb_s.png); }
#btn_tw{ background-image:url(../img/btn_tw_s.png); margin-top:10px; }
.moviebox{max-width:100%;padding:16px 0 1px;}
.movNavBox{width:296px;}
.movNavBox li{ width:143px;height:81px;margin-right:10px;}
.movNavBox li a{display:block;width:142px;height:80px;border:1px solid #464646;overflow:hidden; box-sizing:border-box;}
.movNavBox li a img{ margin-top:-15px; }
.movNavBox li span{ width:142px; height:80px; line-height:80px; }
#player{max-width:100%;height:auto;}
#app{ width:300px; margin:0 auto; overflow:hidden; }
#app ul li{ float:left; width:145px; margin:0px 10px 10px 0px; }
#app ul li:nth-child(2n+2){ margin-right:0px; }
#ivent{ width:300px; margin:0 auto; overflow:hidden; }
#ivent ul li{ float:none; width:300px; margin:0px 0px 10px 0px; }
}