@charset "utf-8";

#header{position:absolute !important; left:0; top:0; background-color:rgba(255,255,255,0.6) !important; border-bottom:0 !important; z-index:10;}
#header:hover{background-color:#fff !important; border-bottom:1px solid #ccc !important;}


/*¸ÞÀÎ »ó´Ü ¿µ¿ª*/
#main_top{width:100%; height:800px; background-color:#ffd71e; position:relative;}
#main_top:before{width:100%; height:800px; content:""; display:block; position:absolute; top:0; left:0; background:url(/uiff/images/main/main_top_bg.png) no-repeat;  background-position: -30px -55px;}
#main_top .mt_in{width:1790px; margin:0 auto; box-sizing:border-box; padding:160px 0 0 0; font-size:0; text-align:right; position:relative; height:100%;}
#main_top .mt_in > div{display:inline-block; vertical-align:top; text-align:left;}

/*°øÁö»çÇ×*/
#notice{width:500px; margin-right: 300px; margin-top:65px;}
#notice .notice_in{width:100%; padding-right:25px; box-sizing:border-box;}
#notice .notice_in h1{font-size:30px; font-weight:500; margin-bottom:25px; padding-left:0;}
#notice .notice_in .not_list{width:100%; font-size:0; margin-bottom:13px;}
#notice .notice_in > div:last-child.not_list{margin-bottom:0;}
#notice .notice_in .not_list > div{display:inline-block; vertical-align:middle;}
#notice .notice_in .not_list > div.date{width:105px; height:95px; box-sizing:border-box; border:1px solid #000; text-align:center; padding:0 10px;}
#notice .notice_in .not_list > div.date span{display:block; height:50%; box-sizing:border-box; margin:0 auto; line-height:1em;}
#notice .notice_in .not_list > div.date .day{font-size:35px; letter-spacing:-1px; padding-top:15px;}
#notice .notice_in .not_list > div.date .ym{font-size:19px; font-weight:300; padding-top:7px;}
#notice .notice_in .not_list > div.n_con{width:calc(100% - 105px); box-sizing:border-box; padding-left:20px;}
#notice .notice_in .not_list > div.n_con span{width:100%; display:block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#notice .notice_in .not_list > div.n_con .ntitle{font-size:22px;  margin-bottom:15px;}
#notice .notice_in .not_list > div.n_con:hover .ntitle{font-weight:500;}
#notice .notice_in .not_list > div.n_con .content{font-size:16px; font-weight:300;}
#notice .notice_in a.more{display:inline-block; margin-top:30px; transition:0.5s all ease;}
#notice .notice_in a.more:hover{padding-left:175px;}

/*Æ˾÷Á¸*/
#main_top .mt_in #popupz{width:630px; height:620px; position:relative;}
#main_top .mt_in #popupz .ppz_controll{position:absolute; bottom:0; right:0;}
#main_top .mt_in #popupz .ppz_controll ul li{display:inline-block; vertical-align:middle; box-sizing:border-box; position:relative;}
#main_top .mt_in #popupz .ppz_controll ul li span{display:block; text-align:center;  cursor:pointer;}
#main_top .mt_in #popupz .ppz_controll ul li span.state{padding:0 10px; font-weight:300; font-size:17px; cursor:auto; letter-spacing:1px; margin-left:15px;}
#main_top .mt_in #popupz .ppz_controll ul li.pstop{margin:17px 20px 0 20px;}
#main_top .mt_in #popupz .ppz_in{position:relative; width:100%; height:570px;}
#main_top .mt_in #popupz .ppz_in li{position:absolute; width:100%; height:570px;}


/*¹Ù·Î°¡±â*/
#main_top .mt_in > div#direct_go{position:absolute; display:flex; flex-wrap:wrap; left:0; bottom:-55px; z-index:9;}
#direct_go > dl{display:inline-block; vertical-align:top; width:350px; height:210px; margin-right:20px; box-sizing:border-box; padding:15px 30px; transition:0.4s all ease;}
#direct_go > dl.app_info{background-color:#6b6b6b;}
#direct_go > dl.rule_info{background-color:#4b4b4b;}
#direct_go > dl.ss_info{background-color:#3b3b3b; margin-right:0;}
#direct_go > dl.app_info dt{background:url(/uiff/images/main/drgo1.png) no-repeat; background-position:20px 0;}
#direct_go > dl.rule_info dt{background:url(/uiff/images/main/drgo2.png) no-repeat; background-position:28px 13px}
#direct_go > dl.ss_info dt{background:url(/uiff/images/main/drgo3.png) no-repeat; background-position:15px 0;}
#direct_go > dl dt{font-size:21px; color:#fff; font-weight:300; padding-top:53px; margin-bottom:5px; position:relative; padding-bottom:5px;}
#direct_go > dl dt:after{display:block; content:""; position:absolute; width:80px; height:1px; left:0; bottom:-1px; background-color:#fff;}
#direct_go > dl dd{font-size:15px; color:#fff; font-weight:300; word-break:keep-all;}
#direct_go > dl dd a{display:block; font-size:15px; background-color:#fff; border-radius:50px; width:190px; height:40px; line-height:40px; text-align:center; margin-top:15px; transition:0.3s all ease; box-sizing:border-box;}
#direct_go > dl dd a:hover{color:#fff; font-weight:500; border:1px solid #fff; line-height:36px;}
#direct_go > dl.app_info dd a:hover{background-color:#6b6b6b;}
#direct_go > dl.rule_info dd a:hover{background-color:#4b4b4b;}
#direct_go > dl.ss_info dd a:hover{background-color:#3b3b3b;}

/*Áß°£¿µ¿ª*/
#main_mid{width:100%; position:relative; background-color:#f2f2f2;}
#main_mid:before{width:100%; height:100%; display:block; content:""; position:absolute; top:0; left:0; background:url(/uiff/images/main/main_visual.png) repeat; background-position:84% -60px;}


/*»ó¿µÀÛ*/
#main_movie{width:100%; position:relative; padding-top:100px; padding-bottom:55px;}
#main_movie h1{font-family: 's-core_dream5_medium'; font-size:30px; text-align:center; font-weight:normal; margin-bottom:40px;}
#main_movie h1 span{font-size:36px; display:block;}

.mmv_area{width:100%; position:relative; z-index:1; clear:both; box-sizing:border-box;}
.mmv_go{width:1470px; margin:0 auto 35px auto; text-align:right;}
.mmv_go a.mv_viewall{display:inline-block; font-size:22px; font-weight:500; background:url(/uiff/images/main/view_all.png) no-repeat; padding: 0 28px 10px 0; background-position: right bottom;}
.mmv_go a.mv_viewall:hover{color:#ed493a;}

.mmv_list{width:1470px; margin:0 auto; height:520px;}
.mmv_list ul{font-size:0; width:100%; transition:0.3s all ease;}
.mmv_list ul li{display:inline-block; vertical-align:top; /*width:470px !important;*/ margin-right:30px;}

.mmv_list ul li a:hover .pic_box:before{display:block; content:""; position:absolute; width:100%; height:100%; top:0; left:0; background-color:#000; z-index:1; opacity:0.6;}
.mmv_list ul li a:hover .pic_box:after{display:block; content:""; position:absolute; width:100%; height:100%; top:0; left:0; background:url(/uiff/images/main/movie_more.png) no-repeat; background-position:center; z-index:1;}

.mmv_list ul li .pic_box{width:100%; height:345px; text-align:center; overflow:hidden; background-color:#000; position:relative; transition:0.3s all ease;}
.mmv_list ul li .pic_box img{width: 150%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.mmv_list ul li .info_box{width:100%; box-sizing:border-box; padding:20px;}
.mmv_list ul li .info_box .tit{font-weight:900; font-size:26px; margin-bottom:15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition:0.3s all ease;}
.mmv_list ul li .info_box .tit span.sectioni{display:block; font-size:15px; font-weight:500;}
.mmv_list ul li .info_box .tit span.coms{color:#333;}
.mmv_list ul li .info_box .tit span.comn{color:#a21d1d;}
.mmv_list ul li .info_box .tit span.inv{color:#07727c;}
.mmv_list ul li .info_box .tit span.ctz{color:#2e3b68;}
.mmv_list ul li a:hover .info_box .tit{color:#ed493a;}
.mmv_list ul li .info_box .drt{font-size:20px; font-weight:500; margin-bottom:15px;}
.mmv_list ul li .info_box .etc > span{display:inline-block; vertical-align:middle; font-size:15px; color: #7f7f7f; padding-left:25px; position:relative;}
.mmv_list ul li .info_box .etc > span:before{display:block; content:""; position:absolute; top:7px; left:13px; width:1px; height:10px; background-color:#7f7f7f; border-radius:50%;}
.mmv_list ul li .info_box .etc > span:first-child{padding-left:0;}
.mmv_list ul li .info_box .etc > span:first-child:before{display:none;}

/*.mmv_list ul li.nothing{display:inline-block; width:100% !important; max-width:1485px; margin-right:0;}
.mmv_list ul li.nothing .not_box{width:100%; padding:30px; box-sizing:border-box; text-align:center; font-size:16px;}*/
.mmv_list ul li.nothing .pic_box{background:none;}
.mmv_list ul li.nothing .info_box{padding:31px 20px;}

.mv_controll{width:100%; position:absolute; top:50%; transform:translateY(-50%); left:0; height:105px; clear:both; z-index:-1;}
.mv_controll span{width:95px; height:105px; box-sizing:border-box; text-align:center; border:1px solid #d1d1d1; background-color:#fff; line-height:95px;}
.mv_controll span a{display:block; width:100%; height:100%; box-sizing:border-box;}
.mv_controll span:nth-child(1){float:left;}
.mv_controll span:nth-child(1) a{padding-right:20px;}
.mv_controll span:nth-child(2){float:right;}
.mv_controll span:nth-child(2) a{padding-left:20px;}

/*¼½¼Ç ³ëÃâ*/
.section_list{max-width:1470px; width:100%; margin: 0 auto; font-size:0;}
.section_list li{display:inline-block; vertical-align:top; text-align:center; margin-bottom:75px; width:25%; box-sizing:border-box; padding:0 15px; position:relative; z-index:1;}
.section_list li:before{display:block; content:""; width:75px; height:75px; background-color:#ffd71e; z-index:-1; position:absolute; left:50%; top:-15px; border-radius:47%; transform:translateX(-50%);}
.section_list li:after{display:block; content:""; width:40px; height:40px; border:1px solid #bbb; z-index:-1; position:absolute; left:56%; bottom:-10px; border-radius:50%; transform:translateX(-50%);}
.section_list li a{display:inline-block; position:relative; z-index:1;}
.section_list li a:hover span{color:#fc5204;}
.section_list li span{display:block; letter-spacing:-1.5px; word-break:keep-all; line-height: 1.3em;}
.section_list li span.tit{font-size:21px; font-weight:700;}
.section_list li span.eng{font-size:17px; font-weight:500; color:#4d4d4d;}



/*sns*/
.mb_sns_box{width:100%; height:290px; background:url(/uiff/images/main/main_sns_bg.jpg) no-repeat; background-position:0 -620px; text-align:center; box-sizing:border-box; padding:70px 15px;}
.mb_sns_box h1{color:#fff; font-family: 's-core_dream5_medium'; font-size:35px; font-weight:normal; margin-bottom:45px;}
.mb_sns_box ul li{display:inline-block; vertical-align:middle; padding:0 38px; line-height:60px; height:60px; transition:0.5s all ease;}
.mb_sns_box ul li:hover{line-height:40px;}


/*¹è³ÊÁ¸*/
#bannerzone{width:100%; box-sizing:border-box; height:75px; margin-top:50px;}
#bannerzone .banner_in{width:1200px; box-sizing:border-box; height:75px; margin:0 auto; font-size:0;}
#bannerzone .banner_in > div{display:inline-block; vertical-align:middle;}
#bannerzone .b_list{width:calc(100% - 290px); height:75px; box-sizing:border-box; padding:10px 0; overflow: hidden;}
#bannerzone .b_list ul li{display:inline-block; vertical-align:top; margin-right:40px;}
#bannerzone .b_list ul li:after{display:block; content:""; clear:both;}
#bannerzone .b_controll{width:290px; height:75px; text-align:center; box-sizing:border-box; padding:5px 12px 14px 0;}
#bannerzone .b_controll p{font-family: 's-core_dream5_medium'; font-size:23px; width:90px; display:inline-block; vertical-align:middle;}
#bannerzone .b_controll p span.bt_top{font-size:16px; display:block; margin:0 auto;}
#bannerzone .b_controll ul{display:inline-block; vertical-align:middle; width:calc(100% - 90px); box-sizing: border-box; padding-left: 25px; margin-top:10px;}
#bannerzone .b_controll ul li{float:left;}
#bannerzone .b_controll ul li:after{display:block; content:""; clear:both;}
#bannerzone .b_controll ul li span{display:inline-block; vertical-align:middle; width:60px; height:15px; box-sizing:border-box;  text-align:center; line-height:15px;}
#bannerzone .b_controll ul li.stop span{width:40px; margin-top:7px;}


/*ǪÅÍ¿µ¿ª*/
#footer{border-top:none !important;}
#footer .inner{width:1200px !important;}



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

/*¸ÞÀÎ »ó´Ü ¿µ¿ª*/
#main_top{height:auto;}
#main_top:before{height:100%; background:url(/uiff/images/main/main_top_bg.png) repeat; background-position:-160px -55px;}

#main_top .mt_in{width:100%; padding:155px 65px 50px 65px; text-align:center;}

/*°øÁö»çÇ×*/
#notice{margin-right: 0; width: calc(100% - 550px); box-sizing: border-box; padding-right: 275px; margin-top:15px;}
#notice .notice_in a.more{margin-top:20px;}

/*Æ˾÷Á¸*/
#main_top .mt_in #popupz{width:550px; height:550px;}
#main_top .mt_in #popupz .ppz_in{position:relative; width:100%; height:500px;}
#main_top .mt_in #popupz .ppz_in li{position:absolute; width:100%; height:500px;}


/*¹Ù·Î°¡±â*/
#main_top .mt_in > div#direct_go{position:relative; left:auto; width:100%; margin-top:50px; text-align:center;}
#direct_go > dl{width:calc((100% - 51px)/3); height:210px; margin-right:25px; text-align:left;}

}

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

/*°øÁö»çÇ×*/
#notice{padding-right: 150px;}

/*»ó¿µÀÛ*/
.mmv_area{width:100%;}
.mmv_go{width:calc(100% - 190px);}

.mmv_list{width:970px;}


/*sns*/
.mb_sns_box{height:auto; padding:50px 15px;}
.mb_sns_box h1{margin-bottom:30px;}


}

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

/*°øÁö»çÇ×*/
#notice{padding-right: 120px;}

}

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

/*°øÁö»çÇ×*/
#notice{width: calc(100% - 500px); padding-right: 60px;}

/*Æ˾÷Á¸*/
#main_top .mt_in #popupz{width:500px; height:500px;}
#main_top .mt_in #popupz .ppz_in{height:450px;}
#main_top .mt_in #popupz .ppz_in li{height:450px;}

}



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

/*¹è³ÊÁ¸*/
#bannerzone .banner_in{width:100%; padding:0 10px;}

/*ǪÅÍ¿µ¿ª*/
#footer .inner{width:100% !important;}

}

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

#main_mid:before {background-size: cover;}

/*»ó¿µÀÛ*/
.mmv_go{width:100%; box-sizing: border-box; padding: 0 20px;}
.mmv_list{width:470px;}
.mv_controll{height:72px;}
.mv_controll span{width:65px; height:72px; line-height:67px;}
.mv_controll span a img{width:20px;}
.mv_controll span:nth-child(1) a{padding-right:5px;}
.mv_controll span:nth-child(2) a{padding-left:5px;}


}




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

/*¸ÞÀÎ »ó´Ü ¿µ¿ª*/
#main_top .mt_in{width:100%; padding:155px 15px 50px 15px; text-align:center;}

/*¹Ù·Î°¡±â*/
#direct_go > dl{width:calc((100% - 21px)/3); height:auto; margin-right:10px; padding:15px;}


}

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

#main_top .mt_in{padding:100px 15px 50px 15px;}

#main_top .mt_in > div{display:block;}

/*°øÁö»çÇ×*/
#notice{width:100%; padding:0 30px; margin-bottom:60px;}

/*Æ˾÷Á¸*/
#main_top .mt_in #popupz{margin:0 auto;}

/*¼½¼Ç ³ëÃâ*/
.section_list li{width:calc(100% / 3);}


}


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


}

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

/*»ó¿µÀÛ*/
#main_movie h1{font-size:25px;}
#main_movie h1 span{font-size:32px;}
.mmv_go a.mv_viewall{font-size:18px;}

}

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

/*¹Ù·Î°¡±â*/
#direct_go > dl dd a{width:100%;}

/*¼½¼Ç ³ëÃâ*/
.section_list li{width:50%;}


}

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

#notice .notice_in a.more:hover{padding-left:30%;}

/*¹Ù·Î°¡±â*/
#direct_go > dl{display:block; width:100%; height:auto; margin-right:0;}
#direct_go > dl.app_info dt{background-position:0 0; background-size:30px;}
#direct_go > dl.rule_info dt{background-position:0 7px; background-size:30px;}
#direct_go > dl.ss_info dt{background-position:0 0; background-size:30px;}
#direct_go > dl dt{padding-left:40px; padding-top:0; margin-bottom:7px;}
#direct_go > dl dt:after{display:none;}
#direct_go > dl dd a{width:190px; float:right; margin-top:13px;}


/*»ó¿µÀÛ*/
.mmv_list ul li{width:inherit;}
.mmv_list ul li a:hover .pic_box:after{display:block; content:""; position:absolute; width:100%; height:100%; top:0; left:0; background:url(/uiff/images/main/movie_more.png) no-repeat; background-position:center; z-index:1; transition:0.3s all ease;}
.mv_controll{height:44px;}
.mv_controll span{width:40px; height:44px; line-height:40px;}
.mv_controll span a img{width:12px;}
.mv_controll span:nth-child(1) a{padding-right:0;}
.mv_controll span:nth-child(2) a{padding-left:0;}



/*sns*/
.mb_sns_box h1{font-size:30px;}
.mb_sns_box ul li{padding:0 20px;}

}


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

/*»ó¿µÀÛ*/
.mmv_list{width:calc(100% - 80px); height:auto;}
.mmv_list ul li .pic_box{height:300px;}

}

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

/*°øÁö»çÇ×*/
#notice{padding:0 5px;}
#notice .notice_in{padding-right: 0;}

/*Æ˾÷Á¸*/
#main_top .mt_in #popupz{width:100%; height:auto; padding-bottom:50px;}
#main_top .mt_in #popupz .ppz_in{height:auto;}
#main_top .mt_in #popupz .ppz_in li{height:auto; width:100%;}


}


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


/*°øÁö»çÇ×*/
#notice .notice_in h1 {font-size: 28px; margin-bottom: 15px; padding-left: 0;}
#notice .notice_in .not_list > div.date{width:80px; height:75px; padding:5px 10px;}
#notice .notice_in .not_list > div.date .day{font-size:30px; padding-top: 5px;}
#notice .notice_in .not_list > div.date .ym{font-size:17px;}
#notice .notice_in .not_list > div.n_con{width:calc(100% - 80px);}
#notice .notice_in .not_list > div.n_con .ntitle{font-size:20px;  margin-bottom:8px;}
#notice .notice_in .not_list > div.n_con .content{font-size:15px;}
#notice .notice_in a.more{margin-top:25px;}


/*Æ˾÷Á¸*/
#main_top .mt_in #popupz .ppz_controll ul li span{max-width:70px; overflow:hidden;}
#main_top .mt_in #popupz .ppz_controll ul li:nth-child(3) span img{margin-left: -65px;}

/*¹Ù·Î°¡±â*/
#direct_go > dl{text-align:center;}
#direct_go > dl dt{display:inline-block; font-size:20px; margin-bottom:3px;}
#direct_go > dl dd a{float:none; margin:13px auto 0 auto;}

/*»ó¿µÀÛ*/
.mmv_list ul li .info_box{padding:20px 10px 20px 0;}
.mmv_list ul li .info_box .tit{font-size:23px;}
.mmv_list ul li .info_box .drt{font-size:18px;}

/*¼½¼Ç ³ëÃâ*/
.section_list li{padding:0 10px; margin-bottom:55px;}
.section_list li span.tit{font-size:19px;}
.section_list li span.eng{font-size:15px;}



/*sns*/
.mb_sns_box{padding:30px 15px;}
.mb_sns_box h1{margin-bottom:10px; font-size:27px;}
.mb_sns_box ul li{padding:0 13px;}
.mb_sns_box ul li:nth-child(1) a img{width:15px;}
.mb_sns_box ul li:nth-child(2) a img{width:30px;}
.mb_sns_box ul li:nth-child(3) a img{width:27px;}
.mb_sns_box ul li:nth-child(4) a img{width:30px;}
.mb_sns_box ul li:nth-child(5) a img{width:27px;}

/*¹è³ÊÁ¸*/
#bannerzone{height:auto; margin-top:25px;}
#bannerzone .banner_in{height:auto;}
#bannerzone .banner_in > div{display:block;}
#bannerzone .b_list{width:100%; padding:10px; border-bottom:1px solid #ccc;}
#bannerzone .b_controll{width:100%; height:75px; text-align:left; padding:5px 10px; border-bottom:1px dashed #ccc;}
#bannerzone .b_controll ul{width:auto; padding-left:0; float:right;}

}

@media  screen and (max-width:400px) {
.mmv_list ul li .pic_box{height:200px;}

}