@charset "utf-8";
/* CSS Document */
@import url("reset.min.1.2.css");
*{margin:0;
  padding:0;
  box-sizing: border-box;}

html,body{width:100%;font-size:16px;height:vh;background-color:#07050b ;color: #FFFFFF;font-family: source-han-sans-cjk-tc,source-han-sans-cjk-sc,sans-serif;font-weight: 500;	font-style: normal;}

img{width:100%; height:auto;border:0px;}

a{width:100%; height:100%;}
a:hover{cursor:pointer;}
ul{list-style-type:none}


.fancybox-opened{overflow: visible!important;}/*fancybox overflow問題*/
.active{display:block;}


.inline{display:inline-block;}
.txt_shadow{text-shadow:0 0 14px rgba(24, 13, 2, 1),0 0 12px rgba(24, 13, 2, 1),0 0 10px rgba(24, 13, 2, 1),0 0 8px rgba(24, 13, 2, 0.9),0 0 4px rgba(24, 13, 2, 1), 0 0 6px rgba(24, 13, 2, 0.9), 0 0 2px rgba(24, 13, 2, 1); }

.txt_blue{color:#00fffc}



/*-----------上方選單---------*/
.topblock{width:100%; position: fixed;top:0;left:0; z-index: 9998;background-color:rgba(31,64,89,0.6);display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/flex-direction:row;/*for all browser*/ -ms-flex-direction:row;/*for ie10*/ justify-content:space-between;/*for all browser*/-ms-flex-pack:space-between;/*for ie10*/align-items: center;}
.toplogo{width:20%;max-width:232px;line-height:0;}
.toplogo a{width:100%;}
.toplogo img{width:100%;transition:all 0.3s ease-out; /*chrome*/-webkit-transition:all 0.3s ease-out;/*firefox*/-moz-transition:all 0.3s ease-out;}
.toplogo img:hover{filter:brightness(120%);}

.topmenu_block{margin-right:5%;display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/justify-content:flex-end;	/*for all browser*/-ms-flex-pack:end;/*for ie10*/flex-wrap:wrap;/*for all browser*/-ms-flex-wrap:wrap;	/*for ie10*/}

.topbtn{width:100%;height:100%;padding-right:0.5rem;position: relative;}
.topbtn ul{position: relative;display:flex;flex-direction:row;justify-content:center;}
.topbtn li{padding:1rem;position: relative;overflow: hidden;}
/* .topbtn li:hover .topbtnbg{animation:topbtnbg 1s forwards;-webkit-animation:topbtnbg 1s forwards;} */
.topbtn li a{width:100%; height:100%; color:#FFFFFF;text-decoration: none;font-size: 18px;position:relative;}
.topbtnbg{width:100%;height:100%;background-color:rgba(0,0,0,0.5);position: absolute;top:0;left:0;z-index: -1;transform: translateY(101%); transition:1s transform;}
.topbtn li:hover .topbtnbg{transform:translateY(0%);}

.topbtn_x{display:none;}

.menu_in {
	animation:fadeRight 1s forwards ease-out; 
  }
  @keyframes fadeRight {
	0% {transform: translateX(100%);}
  
	100% {transform: translateX(0);}
  }


  .menu_out {
	animation:fadeLeft 1s forwards ease-out; 
  }
  @keyframes fadeLeft {
	0% {transform: translateX(0);}
  
	100% {transform: translateX(100%);}
  }  


.topbtnmenu{display:none;text-align: right;font-size: 1.3rem;margin-right: 1rem;}

.topbtn_txt{width:100%;position:relative;z-index: 2;padding:0.7rem 0;}


/*-----------語言選單---------*/
.toplang{position:relative;padding-right:1rem;cursor:pointer;}
.lang_now{width:6rem;position:relative;color:#FFFFFF;cursor:pointer;padding:0 .5rem;display:flex;flex-direction:row;justify-content:center; align-items: center ;flex-wrap:nowrap;white-space:nowrap;}
.lang_box{position:absolute;z-index:2;color:#cacaca;background-color:rgba(0,0,0,0.7);display: none;padding:0 .5em;}
.lang_box ul{position: relative;display:flex;flex-direction:column;justify-content:center;}
.lang_box li{cursor:pointer;padding:.7rem;text-align: center;white-space:nowrap;}
.lang_box li a{width:100%; height:100%; color:#cacaca;text-decoration: none;}
.lang_box li a:hover{ color:#b2e7ff;}


.langmenu_in {
	animation:fadeDown .5s forwards ease-out; 
}
@keyframes fadeDown {
	0% {transform: translateY(-5%);filter:opacity(0%);}
	100% {transform: translateY(2%);filter:opacity(100%);}
}


.langmenu_out {
	animation:fadeUp .5s forwards ease-out; 
}
@keyframes fadeUp {
	0% {transform: translateY(2%);filter:opacity(100%);}
	100% {transform: translateY(-5%);filter:opacity(0%)}
}  

.jsclick{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1;display:none;}
.aopen{display:block;font-size:0.7rem;padding-left: .5rem;}
.aclose{display:none;font-size:0.7rem;padding-left: .5rem;}


/*-----------社群選單---------*/
.snsblock{width:10%;max-width: 50px;position:absolute;bottom:6rem;left:3px;z-index: 99;}
.snsblock>ul{position: relative;display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/flex-direction:column;/*for all browser*/ -ms-flex-direction:column;/*for ie10*/;}
.snsblock>ul>li{margin: 5px;}
.snsblock>ul>li,.snsblock>ul>li a{transition:all 0.5s;display: block;position:relative;}
.snsblock>ul>li a:hover{transform:scale(1.22);}



@keyframes icon_down {
	0% {transform:translateY(0);}
	50% {transform:translateY(-5%);}
	}


/*-----------TOP鈕---------*/
.btn_top{width:12%; max-width:100px; position:fixed; right:1%; bottom:2%; z-index: 999;}
.btn_top,.btn_top a{/*chrome*/-webkit-transition:all 0.5s; /*firefox*/-moz-transition:all 0.2s; transition:all 0.5s;}
.btn_top:hover{transform:translateY(-8%);}



.wrapper{width:100%;/*min-width: 480px;*/margin: 0 auto;position:relative;}


/*-----------封面---------*/

#particles-js{
width: 100%;height: auto;position: absolute;top: 0px;left: 0px;z-index:9;
mix-blend-mode: color-dodge;opacity:0.78;pointer-events: none;
}

.cover_block{width:100%;margin: 0 auto;position: relative;z-index:1; overflow: hidden;}
.cover_main{width:100%;max-width: 800px;position: relative;margin:0 auto;z-index: 7;padding-bottom: 4rem; margin-top: 17vw;/* 首頁高度 */}

.maintxt{width:96%;max-width:700px;position:relative;margin: 0 auto;}



/*背景Video*/
.bg_pvpattern{width:100%; height:100%; position:absolute; left:0; bottom:0; top:0; right:0; background-color:rgba(38,56,87,0.5);z-index:2;}
#video_block{width:100%; height:100%; overflow:hidden;
         display:flex;  display:-ms-flexbox;
		 justify-content:center; -ms-flex-pack:center;
		 align-items:center; -ms-flex-align:center;
         position:absolute; left:0; bottom:0; top:0; right:0; z-index:1;
		 }


iframe#video_iframe,#video_block > iframe{width:1920px; height:1080px; /*width:100%; height:100%;*/ }

.video_in{display: block;}
.video_in_s{width: 100%;height: 100%;background:url(../images/cover_737.jpg);display: none;}


.coverapp_block{width:90%;position:relative;margin: 7rem auto;}

.coverapp_block ul{position: relative;display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/flex-direction:row;/*for all browser*/ -ms-flex-direction:row;/*for ie10*/;justify-content:space-between; }

.coverapp_block ul li{width:33%;max-width:250px;position:relative;margin:3% 3%;} 
.coverapp_block ul li a{transition:all 0.5s;display: block;}
.coverapp_block ul li:hover a{ transform:translateY(-15%);}
	
.icon_down{width:28px;margin: 0 auto;animation:icon_down .7s infinite linear;}	

@keyframes icon_down {
	0% {transform:translateY(0);}
	50% {transform:translateY(-10%);}
	}



.title1{width:100%; max-width:380px;margin: 5rem auto 2rem;position: relative;}
.title2{width:100%; max-width:380px;margin: 5rem auto 2rem;position: relative;}
.title3{width:100%; max-width:380px;margin: 7rem auto 2rem;position: relative;}
.title4{width:100%; max-width:380px;margin: 9rem auto 2rem;position: relative;}
.title5{width:100%; max-width:380px;margin: 5rem auto 2rem;position: relative;}


.ch .title1{background:url(../images/title_1.png) no-repeat center top;background-size:cover;}
.ch .title2{background:url(../images/title_2.png) no-repeat center top;background-size:cover;}
.ch .title3{background:url(../images/title_3.png) no-repeat center top;background-size:cover;}
.ch .title4{background:url(../images/title_4.png) no-repeat center top;background-size:cover;}
.ch .title5{background:url(../images/title_5.png) no-repeat center top;background-size:cover;}

.cn .title1{background:url(../images/title_1.png) no-repeat center top;background-size:cover;}
.cn .title2{background:url(../images/title_2_cn.png) no-repeat center top;background-size:cover;}
.cn .title3{background:url(../images/title_3_cn.png) no-repeat center top;background-size:cover;}
.cn .title4{background:url(../images/title_4.png) no-repeat center top;background-size:cover;}
.cn .title5{background:url(../images/title_5_cn.png) no-repeat center top;background-size:cover;}

.en .title1{background:url(../images/title_1_en.png) no-repeat center top;background-size:cover;}
.en .title2{background:url(../images/title_2_en.png) no-repeat center top;background-size:cover;}
.en .title3{background:url(../images/title_3_en.png) no-repeat center top;background-size:cover;}
.en .title4{background:url(../images/title_4_en.png) no-repeat center top;background-size:cover;}
.en .title5{background:url(../images/title_5_en.png) no-repeat center top;background-size:cover;}

.jp .title1{background:url(../images/title_1_jp.png) no-repeat center top;background-size:cover;}
.jp .title2{background:url(../images/title_2_jp.png) no-repeat center top;background-size:cover;}
.jp .title3{background:url(../images/title_3_jp.png) no-repeat center top;background-size:cover;}
.jp .title4{background:url(../images/title_4_jp.png) no-repeat center top;background-size:cover;}
.jp .title5{background:url(../images/title_5_jp.png) no-repeat center top;background-size:cover;}

.kr .title1{background:url(../images/title_1_kr.png) no-repeat center top;background-size:cover;}
.kr .title2{background:url(../images/title_2_kr.png) no-repeat center top;background-size:cover;}
.kr .title3{background:url(../images/title_3_kr.png) no-repeat center top;background-size:cover;}
.kr .title4{background:url(../images/title_4_kr.png) no-repeat center top;background-size:cover;}
.kr .title5{background:url(../images/title_5_kr.png) no-repeat center top;background-size:cover;}


/*-----------COPYRIGHT---------*/
footer{width:100%; max-width:1920px;font-family: Arial;background:url(../images/footerbg.png) no-repeat center top;background-size:cover;margin:-6rem auto 0;padding-bottom:2rem;position: relative;z-index:4;font-family:'微軟正黑體', sans-serif;}


.footer_content{width:100%;max-width: 990px;margin: 0 auto;display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/flex-direction: column;/*for all browser*/ -ms-flex-direction: column;/*for ie10*/text-shadow:0 0 4px rgba(0, 0, 0, 1), 0 0 3px rgba(0, 0, 0, 1), 0 0 2px rgba(0, 0, 0, 1);}
.footer_snsblock{width:50%;min-width: 360px;margin: 0 auto;display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/flex-direction: row;/*for all browser*/ -ms-flex-direction: row;justify-content:space-around;}
.footer_sns{width:33%;max-width:70px;}

.footer_logoblock{width:70%;margin: 2rem auto 1rem;display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/flex-direction: row;/*for all browser*/ -ms-flex-direction: row;justify-content:space-around;}
.footer_logo{width:50%;max-width:230px;}

.footer_eula{margin:1rem auto;}
.footer_eula a{width:100%; height:100%; color:#FFFFFF;text-decoration: none;}
.footer_eula a:hover{width:100%; height:100%; color:#b2e7ff;text-decoration: underline;}

.footer_lvblock{width:100%;margin-top:1rem;display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/flex-direction: row;/*for all browser*/ -ms-flex-direction: row;/*for ie10*/justify-content:space-between;/*for all browser*/-ms-flex-pack:justify;/*for ie10*/}
.footer_txt{width:50%;color:#FFF; font-size: .7rem;padding-left:1rem;text-align: justify; }
.footer_txt p{padding:.3rem 0;white-space:nowrap;}
.footer_lv{width:50%;margin: 0 auto;display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/flex-direction: row;-ms-flex-direction: row;justify-content:center;-ms-flex-pack:justify;}
.footer_left{width:50px;min-width:50px;}
.footer_right{padding-left:.5rem;}
.footer_txt2{color:#ececec; font-size: .6rem;white-space:nowrap;}



.fancybox-skin{background: none;}


/* lity adj */


.lity-iframe .lity-container, .lity-youtube .lity-container, .lity-vimeo .lity-container, .lity-facebookvideo .lity-container, .lity-googlemaps .lity-container{height: 73%;}
.lity-content,.lity-iframe-container{height: 100%;}


/*-----------RWD---------*/

@media (max-width:1250px){
	.topmenu_block{margin-right:0;}
	.topbtnmenu{width:65%;display:block;}
	.topbtnmenu a{display:block; cursor:pointer;text-decoration:none;color:#FFF;}
	.topbtn{width:10rem; height:100%; background: rgba(0,0,0,0.70); position:fixed;right:0; top:0; z-index:11111;padding-top: 2rem;transform: translateX(100%);}
	/* .en .topbtn{width:12rem; height:100%; background: rgba(0,0,0,0.70); position:fixed;right:0; top:0; z-index:11111;padding-top: 2rem;transform: translateX(100%);} */
	.topbtn ul{position: relative;display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/flex-direction:column;/*for all browser*/ -ms-flex-direction:column;/*for ie10*/ justify-content:center;/*for all browser*/-ms-flex-pack:center;/*for ie10*/}
	.topbtn li{border-bottom: #676e61 1px solid;margin: 5%;padding:5%}
	/* .en .topbtn li{border-bottom: #676e61 1px solid;margin: 5%;padding:2%;} */
	.topbtn_txt{padding:0.4rem 0;}
	.topmenu_pic{display:block;position:absolute;top:-12%;left:0;}
	.topbtn_x{width:20%;max-width: 50px; display:block;position:absolute;top:-1.5rem;right:2px;cursor:pointer;}


}


@media (max-width:1150px){
	.footer_lvblock{margin-top:0;display:flex;/*for all browser*/ display:-ms-flexbox;/*for ie10*/flex-direction: column;/*for all browser*/ -ms-flex-direction: column;}
	.footer_lv,.footer_txt,.footer_logo{width:96%}
	.footer_lv,.footer_logo{margin: 0.5rem auto;}
	.footer_txt p{text-align: center;}

}


@media (max-width:1000px){
	.toplogo{width:25%;}
	.language_box select{height: 2.5rem;}
	
}






@media (max-width:737px){
	.toplogo{width:45%;}
	.toplang{padding-right:0;}
	.cover_block{background:url("../images/cover_737.jpg") no-repeat center top;background-size:cover;}
	.video_in{display: none;}
	.video_in_s{display: block;}
	.bg_pvpattern{display:none;}
	.maintxt{width:88%;padding-top: 15%;}
	.coverapp_block ul{position: relative;display:flex;flex-direction:column;align-items: center;justify-content:center;}
	.coverapp_block ul li{width:50%;} 
	.footer_logoblock{display:flex;flex-direction: column;}

	}

	@media (max-width:640px){
		.snsblock{width:13%;max-width: 70px;bottom:10rem;}
		.btn_top{width:16%;right:1%; bottom:1%;}
		.footer_lv{margin-top:1rem;display:flex;flex-direction: column;align-items: center;justify-content:center;}
		.footer_left{margin:0 auto;}
		.footer_right{padding:0 .5rem;}
	}	


	@media (max-width:550px){
		.footer_lvblock{margin-top:0;}
		.footer_left{margin-bottom:.5rem;}
		.footer_txt2{white-space:normal;}
	}