/*
    Adaptive css, Tested Browser:
        Chrome (Desktop / Mobile)
        Firefox (Desktop / Mobile)
        IE (6-8: as desktop, 9-11: adaptive)
        Edge (Desktop / Mobile)
        Safari (Desktop / Mobile)
*/
html{
	/*overflow-y: scroll;*/
	/*filter: gray progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);*/
	/*-webkit-filter: grayscale(100%);*/
}
body{
	font-family:sans-serif;
	margin:0;
	-webkit-text-size-adjust:none;
}
#page{
	height:auto;
	width:100%;
	background:url("../../Asset/images/desktop.gif") repeat-x;
	margin:0 auto;
	display:table;
	background-size:100% 118px;
}
a:link{
	color:#FFFFFF;
	text-decoration:none;
}
a:visited{
	text-decoration:none;
}
a:hover{
	text-decoration:none;
}
#SetLang{
	margin-top:10px;
}
#SetLang a:link{
	text-decoration:none;
}
#contact{
	float:right;
	height:118px;
	display:table;
}
#contact_table{
	color:#FFFFFF;
	font-size:10pt;
	margin-top:7px;
	text-shadow:#333333 0 2px 2px;
}
.contact_pic{
	width:37px;
	height:26px;
}
#box{
	width:100%;
	height:auto;
	margin:125px 0 0 0;
}
.menu{
	height:24px;
	display:block;
}
.manual_1{
	position:absolute;
	right:50px;
	top:0;
	background-image:url("../../Asset/images/manual_bg_mobile.gif");
	background-repeat:no-repeat;
	width:68px;
	height:40px;
	text-align:center;
	display:table;
}
.manual_1 a:visited{
	color:#FFFFFF;
}
.manual_1 a:hover{
	color:#FFFFFF;
}
.manual_2{
	right:130px;
}
.manual_3{
	right:210px;
}
.manual_text{
	display:table-cell;
	vertical-align:middle;
	font-size:12pt;
	text-shadow:#333333 0 2px 2px;
}
.app_svg{
	width:120px;
	height:40px;
}
.app{
	width:120px;
	height:40px;
	float:left;
	margin:0 10px 10px 0;
}
.foot{
	width:100%;
	margin:10px 0;
	color:#a8a8a8;
	text-align:center;
	font-size:9pt;
}
.foot a{
	color:#a8a8a8;
	text-decoration:underline;
}
.foot a:hover{
	color:#6a6a6a;
	text-decoration:underline;
}
.content{
	width:960px;
	margin:0 auto 0 auto;
	display:table;
	padding:0 0 0 0;
	height:auto;
}
.graybox{
	clear:both;
	background-color:#f2f2f2;
	margin:5px 0 0 0;
	padding:40px 50px;
	position:relative;
}
.game_info_left{
	width:50%;
	float:left;
	margin-top:-10px;
}
.game_info_right{
	width:46%;
	float:right;
	right:70px;
}
.apps{
	width:260px;
	float:right;
}
.apps .app{
	float:left;
}
.game_info_right p{
	font-size:11pt;
}
h2{
	color:#a10000;
	font-size:24px;
}
.game_main{
	width:100%;
}
#logo{
	width:260px;
	height:118px;
	float:left;
	display:table;
	margin:0;
}
.logo_svg{
	width:260px;
	height:118px;
}
.news_date{
	position:absolute;
	right:50px;
	top:40px;
	background-image:url("/Asset/images/menu/news_date.gif");
	background-repeat:no-repeat;
	width:87px;
	height:27px;
	vertical-align:middle;
	display:table;
}
.news_date_text{
	font-size:10pt;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
	color:#FFFFFF;
}
.new_title{
	color:#6A6A6A;
	font-size:16pt;
	font-weight:600;
	max-width:700px;
}
.new_content{
	margin-top:10px;
	color:#6A6A6A;
	font-size:12pt;
	font-weight:500;
	margin-bottom:10px;
}
.new_content a{
	color:#a8a8a8;
	text-decoration:underline;
}
.new_content a:hover{
	color:#6a6a6a;
	text-decoration:underline;
}
.manual_title{
	margin-bottom:20px;
	color:#6A6A6A;
	font-size:16pt;
	font-weight:600;
}
.manual_content{
	color:#6A6A6A;
	font-size:12pt;
	font-weight:500;
	margin:10px 0;
	text-indent:2em;
}
.manual_content_title{
	color:#6A6A6A;
	font-size:16pt;
	font-weight:600;
	height:35px;
}
.manual_content a{
	color:#a8a8a8;
	text-decoration:underline;
}
.manual_content a:hover{
	color:#6a6a6a;
	text-decoration:underline;
}
.video_button_svg{
	width:120px;
	height:40px;
}
.jobBox{
	clear:both;
	width:860px;
	height:auto;
	background-color:#FFFFFF;
	margin:5px 0 0 0;
	padding:0 50px 25px 50px;
	overflow:hidden;
	position:relative;
}
.jobpost_text{
	font-size:13pt;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
	color:#FFFFFF;
}
.job_title{
	color:#6A6A6A;
	font-size:13pt;
	font-weight:500;
	height:40px;
	vertical-align:middle;
}
.job_detail{
	color:#6A6A6A;
	font-size:10pt;
	font-weight:500;
	line-height:22px;
}
.job_button{
	width:64px;
	height:35px;
	top:-50px;
	position:relative;
}
.app_title{
	color:#a10000;
	width:670px;
	font-size:20px;
	text-shadow:#cccccc 0 2px 2px;
	font-weight:bold;
}
.time_width{
	width:90px;
	height:128px;
}
.page_width{
	margin:0 auto;
	width:960px;
}
.share{
	width:160px;
	height:35px;
	float:right;
	position:relative;
	top:80px;
}
.thumbnail{
	padding:3px;
	border:1px solid #6a6a6a;
	float:left;
	margin-right:10px;
	margin-bottom:10px;
}
.picbox{
	width:380px;
	height:auto;
	float:left;
	clear:left;
	margin:10px 0 0 30px;
}
.piclist{
	width:400px;
	float:left;
	height:auto;
	overflow:hidden;
}
.tiny_screen_short{
	border:1px solid #6a6a6a;
	padding:4px 3px 0 3px;
	width:100px;
}
.img_screen_shot{
	width:100px;
	border:0;
}
.horizontal_scrolling{
	display:-webkit-box;
	white-space:nowrap;
	overflow:hidden;
	-webkit-backface-visibility:hidden;
	-webkit-overflow-scrolling:touch;
	text-align:justify;
	overflow-x:initial;
}
.img_full{
	width:730px;
}
.more_button{
	width:120px;
	height:40px;
}
.more_button_div{
	width:120px;
	height:40px;
}
.img_board{
	margin-top:6px;
}
.switch_main_intro a:link{
	color:#6A6A6A;
	text-decoration:underline;
}
.switch_main_intro a:visited{
	color:#6A6A6A;
	text-decoration:underline;
}
.switch_main_intro a:hover{
	color:#6A6A6A;
	text-decoration:underline;
}
.addthis_share{
	float:left;
	position:absolute;
	top:0;
}
.addthis_icon{
	margin-right:4px;
	float:left;
}
#showmore{
	margin-top:10px;
}
.__block{
	display:none;
}
.select{
	width:120px;
	height:36px;
	float:right;
	margin-top:18px;
}
.nav{
	width:70%;
	margin:18px 0;
	padding:0;
	float:left;
}
.nav li{
	display:inline;
	margin-top:2px;
	float:left;
}
.nav li a{
	float:left;
	color:#6A6A6A;
	padding:5px 10px;
	margin-right:1px;
	text-decoration:none;
	background-color:#ECECEC;
	font-size:9pt;
	line-height:14px;
}
#menu_news a{
	float:left;
	background:#FFFFFF url("/Asset/images/menu/left.gif") no-repeat;
	color:#6A6A6A;
	font-size:9pt;
	line-height:14px;
}
#current a{
	background:#ae1000;
	color:#FFFFFF;
}
.nav li a:hover{
	background:#ae1000;
	color:#FFFFFF;
}
#menu_news_current a{
	background:#FFFFFF url("/Asset/images/menu/left_hover.gif") no-repeat;
	color:#FFFFFF;
}
#menu_news a:hover{
	background:#FFFFFF url("/Asset/images/menu/left_hover.gif") no-repeat;
	color:#FFFFFF;
}
.nav .box a{
	float:left;
	color:#6A6A6A;
	padding:5px 10px;
	margin-right:1px;
	text-decoration:none;
	background-color:#ECECEC;
	font-size:9pt;
	line-height:14px;
}
.nav .box_news a{
	float:left;
	color:#6A6A6A;
	padding:5px 10px;
	margin-right:1px;
	text-decoration:none;
	font-size:9pt;
	line-height:14px;
	background:#FFFFFF url("/Asset/images/menu/left.gif") no-repeat;
	width:24px;
}
.nav .box_sel a{
	color:#FFFFFF;
	background-color:#A10000;
}
.nav .box a:hover{
	color:#FFFFFF;
	background-color:#A10000;
}
.nav .box_news_sel a, .nav .box_news_sel a:hover{
	color:#FFFFFF;
	background:#FFFFFF url("/Asset/images/menu/left_hover.gif") no-repeat;
}
.nav .box_news a:hover{
	color:#FFFFFF;
	background:#FFFFFF url("/Asset/images/menu/left_hover.gif") no-repeat;
}
#subscribe_email{
	width:570px;
	height:300px;
	background-color:#FFFFFF;
	background-size:100% 100%;
	position:fixed;
	left:0;
	right:0;
	top:0;
	bottom:0;
	margin:auto;
	z-index:10;
	display:none
}
.close{
	width:30px;
	height:30px;
	position:absolute;
	right:12px;
	top:10px;
	border:0;
	padding:0;
	background:url(/Asset/images/subscribe/close.png);
	background-size:100% 100%;
	cursor:pointer
}
.inputBox{
	padding:0 0 0 70px;
	background:url(/Asset/images/subscribe/input.png);
	background-size:100% 100%;
	border:0;
	width:410px;
	height:60px;
	font-size:16pt;
	cursor:text;
	color:#615b51;
	text-align:center;
}
.submit{
	border:0;
	width:160px;
	height:50px;
	background-color:#AE1000;
	background-size:100% 100%;
	color:#FFFFFF;
	font-size:20pt;
	font-family:none, serif;
	cursor:pointer
}
#mail_result{
	height:22px;
	margin:4px auto;
	font-size:12pt;
	text-align:center;
}
.mail_incorrect{
	color:#C8582C;
}
.mail_normal{
	color:#DDD3DF;
}
.text{
	letter-spacing:3px;
	color:#fff3df;
}
.subscribe_top{
	width:100%;
	height:50px;
	background-color:#AE1000;
}
.input_mail_icon{
	position:absolute;
	margin:11px 0 0 11px;
}
.subscribe_text{
	height:75px;
	margin:15px 20px 10px 20px;
	text-align:left;
	font-size:12pt;
	text-indent:2em
}
.follow_pic{
	width:32px;
	height:32px;
}
.video_bg{
	position:absolute;
	left:50%;
	transform:translateX(-50%);
}
.video{
	width:85%;
	height:390px;
	position:absolute;
	left:50%;
	top:25px;
	transform:translateX(-50%);
}
.video_title{
	max-width:100%;
	text-align:center;
	position:absolute;
	left:50%;
	top:90%;
	transform:translateX(-50%);
}
#tip{
	position:fixed;
	top:50px;
	left:50%;
	display:none;
	z-index:9999;
	width:210px;
	text-align:center;
	word-wrap:break-word;
}
/************************************************************************************
smaller than 960
*************************************************************************************/
@media screen and (max-width:960px){
	#page{
		background-size:100% 90px;
	}
	#contact{
		height:90px;
	}
	#contact_table{
		margin-top:1px;
	}
	.contact_pic{
		width:30px;
		height:21px;
	}
	#box{
		margin:95px 0 0 0;
	}
	.manual_1{
		right:5px;
	}
	.manual_2{
		right:75px;
	}
	.manual_3{
		right:145px;
	}
	.content{
		width:98%;
	}
	.graybox{
		padding:40px 10px;
	}
	.game_info_left{
		margin-left:2%;
		margin-right:1%;
	}
	.game_info_right{
		width:43%;
		margin-left:1%;
		margin-right:2%;
	}
	.apps{
		width:260px;
		margin-right:30px;
	}
	h2{
		font-size:20px;
	}
	.game_main{
		width:96%;
	}
	#logo{
		width:190px;
		height:90px;
	}
	.logo_svg{
		width:190px;
		height:90px;
	}
	.new_title{
		max-width:80%;
	}
	.news_date{
		right:2%;
		top:32px
	}
	.jobBox{
		width:98%;
		padding:0 1% 30px 1%;
	}
	.job_button{
		top:0;
	}
	.page_width{
		width:100%;
	}
	.img_full{
		width:95%;
	}
	.addthis_share{
		left:5px;
	}
	.addthis_icon{
		margin-right:2px;
	}
	.show{
		display:none;
	}
}
@media screen and (max-width:850px){
	.apps{
		width:auto;
		margin-right:2%
	}
}
/************************************************************************************
iPhone 6 / 6 Plus
*************************************************************************************/
@media screen and (max-width:570px){
	.nav{
		width:66%;
	}
	.graybox{
		width:96%;
		background-color:#f2f2f2;
		margin:5px auto;
		padding:30px 2% 1% 2%;
	}
	.game_info_left{
		width:100%;
		margin:auto;
		float:none;
		padding:0;
	}
	.game_main{
		width:96%;
	}
	.game_info_right{
		width:90%;
		margin:0;
		padding:0 5% 0 5%;
		float:none;
	}
	.apps{
		width:260px;
		margin-right:30px;
	}
	.jobBox{
		clear:both;
		width:96%;
		height:auto;
		background-color:#FFFFFF;
		margin:5px 0 0 0;
		padding:0 2% 30px 2%;
		overflow:hidden;
		position:relative;
	}
	.job_button{
		width:64px;
		height:35px;
		top:0;
		position:relative;
	}
	#subscribe_email{
		width:98%;
		height:45%;
	}
	.inputBox{
		width:70%;
		height:60px;
	}
	.subscribe_text{
		margin-top:5px;
		height:90px;
	}
	.video{
		top:15px;
	}
	.video_title{
		max-width:100%;
		margin:10px;
		top:80%
	}
}
/************************************************************************************
iPhone 4 / 5
*************************************************************************************/
@media screen and (max-width:320px){
	.content{
		width:312px;
		margin:0 auto 0 auto;
		display:table;
		padding:0 0 0 0;
		height:auto;
	}
	.graybox{
		width:312px;
		height:auto;
		background-color:#f2f2f2;
		margin:5px 0 0 0;
		padding:30px 4px 30px 4px;
		overflow:hidden;
		position:relative;
	}
	.jobBox{
		clear:both;
		width:312px;
		height:auto;
		background-color:#FFFFFF;
		margin:5px 0 0 0;
		padding:0 4px 30px 4px;
		overflow:hidden;
		position:relative;
	}
}