@charset "utf-8";
/* CSS Document */

html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul, dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object, a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, kbd, q, samp, small, span, strong, sub, sup, tt, var, legend, fieldset form, input, textarea, blockquote, button { padding: 0; margin: 0; }
fieldset { border: 0; }
/* ????????????????????????, li ????????? */
ol,ul {list-style:none;}
/* set image max width to 100% */
/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, table { display: block; }
.cm { text-align: center; vertical-align: middle; }
.mag { margin: 5%; }
a { text-decoration: none; outline: none; /* for Firefox */ }
.clear { clear : both; }
.wordcenter20 { line-height: 20px; }
.word32 { font-size: 32px; font-family: "???????????????", "Heiti TC"; line-height: 42px; }
.word24 { font-size: 24px; font-family: "???????????????", "Heiti TC"; line-height: 32px; }
.word20 { font-size: 20px; font-family: "???????????????", "Heiti TC"; line-height: 28px; }
.word18 { font-size: 18px; font-family: "???????????????", "Heiti TC"; line-height: 30px; }
.word16 { font-size: 16px; font-family: "???????????????", "Heiti TC"; line-height: 24px; }
.word14 {
	font-size: 14px;
	font-family: "???????????????", "Heiti TC";
	height: 20px;
	width: 580px;
	padding-left: 5px;
}
.word30 {
	font-size: 30px;
	font-family: "???????????????", "Heiti TC";
	font-weight: 900;
}
.word10 { font-size: 10px; font-family: "???????????????", "Heiti TC"; line-height: 16px; }
.bold { font-weight: bold; }
.white { color: #FFF; }
.yellow { color: #ffe752; }
.blue { color: #00C; }
.lightblue { color: #00b7ee; }
.orange { color: #F90; }
.red { color: red; }
.green { color: #356; }
.purple { color: #F0F; }
.gray { color: #999; }
.black { color: #000; }
.lightblack { color: #999; }
.golden { color: #c78a2f; }
.line { border: 1px solid #CCC; margin-top: 5px; margin-bottom: 10px; }
/*??????*/
.br:focus, .br:active, .br:link, .br:visited { text-decoration: none; color: #000; }
.br:hover { text-decoration: none; color: #B06A00; }
.ser:focus, .ser:active, .ser:link, .ser:visited { text-decoration: none; color: #FFF; }
.ser:hover { text-decoration: none; color: #FF0; }
.fot:focus, .fot:active, .fot:link, .fot:visited {text-decoration: none; }
.fot:hover {
	text-decoration: underline;;
}
img { vertical-align: middle; border: 0; text-align: center; height: auto; max-width: 100%; }
.wordleft { text-align: left; }
.wordcenter { text-align: center; }
.wordline30 { line-height: 30px; }
/*150309???*/
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
img, fieldset { border: 0 none; }
ul, ol, li { list-style: none; }
em, address { font-style: normal; }
table { border-collapse: collapse; }
em, i { font-style: normal; }
strong, b { font-weight: normal; }
img { border: none; }
img { vertical-align: middle; outline: none; }
/*,textarea{-webkit-tap-highlight-color: rgba(0, 0, 0, 0);-webkit-appearance: none;border:0;border-radius:0;}
*/textarea:focus { outline: 0; }
a { text-decoration: none; cursor: pointer }
.clearfix:after { display: block; clear: both; visibility: hidden; height: 0; content: " "; font-size: 0; }
.clearfix { *zoom:1;
}
/* Scrollbar styles */
::-webkit-scrollbar {
width: 12px;
height: 12px;
}

::-webkit-scrollbar-track {
background: #f5f5f5;
border-radius: 10px;
}

::-webkit-scrollbar-thumb {
border-radius: 10px;
background: #ccc;  
}

::-webkit-scrollbar-thumb:hover {
background: #999;  
}

/*---------------------------------------------------------------------------------------------------------------------*/

/*?????????*/

.top_bar {
	background-color: rgba(0,0,0,0.8);
	height: 42px;
	width: 100%;
	position: absolute;
	z-index: 999;
	display: block;
}
.top_bar .top_conter {
	display: block;
	height: 42px;
	width: 1200px;
	margin-right: auto;
	margin-left: auto;
	/* [disabled]overflow: hidden; */
}
.top_bar .top_conter .top_muen {
	height: 42px;
	width: 1200px;
	display: block;
}
.top_bar .top_conter .top_muen .top_muenlist {
	float: left;
	height: 42px;
	color: #FFF;
	overflow: hidden;
	/* [disabled]background-color: #39C; */
	display: block;
	font-size: 14px;
	text-decoration: none;
	font-family: "Heiti TC", "???????????????";
	text-shadow: -1px -1px rgba(255, 254, 254, 0.3),2px 2px 2px rgba(30%,30%,36%,0.6);
}
.top_bar .top_conter .top_muen .backhome {
	height: 40px;
	width: 100px;
	cursor: pointer;
	display: block;
}
.top_bar .top_conter .top_muen .goin {
	height: 30px;
	width: 400px;
	overflow: hidden;
	padding-right: 10px;
	padding-left: 10px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #000;
	line-height: 30px;
	text-align: right;
	box-sizing:border-box;
}

.top_bar .top_conter .top_muen .login {
	height: 30px;
	width: 50px;
	line-height: 30px;
	padding-right: 10px;
	padding-left: 10px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #000;
	box-sizing:border-box;
}
.top_bar .top_conter .top_muen .fb_go {
	height: 30px;
	width: 100px;
	text-align: right;
	line-height: 30px;
	padding-right: 10px;
	padding-left: 10px;
	background-image: url(../png/top_fbbtn.png);
	background-repeat: no-repeat;
	background-position: 10px center;
	box-sizing:border-box;

}
.top_bar .top_conter .top_muen .fb_plug {
	height: 42px;
	width: 110px;
	padding: 10px;
	box-sizing:border-box;

}
.top_bar .top_conter .top_muen .no {
	height: 42px;
	width: 440px;
	display: block;
	padding-right: 10px;
	padding-left: 10px;
	/* [disabled]background-color: #F30; */
	overflow: hidden;
	box-sizing:border-box;

}
.mgto {
	margin-top: 5px;
}


/*?????????*/

body{
	background-image: url(img/bg.jpg);
	overflow-x: hidden;
	background-repeat: no-repeat;
	background-position: center top;
	background-color:#000;
	margin: 0 ;
	}

.warp {
	width: 100%;
	position: relative;
	}

.center{
	margin-left: auto;
	margin-right: auto;
	width: 1200px;
	}	

.warp .center .top {
	height: 550px;
	width: 1200px;
	}

.warp .center .a1 {
	position: relative;
	height: 400px;
	width: 1200px;
/*	background-color:#DBC094;*/
	}

.warp .center .a2 {
	position: relative;
	height: 360px;
	width: 1200px;
	z-index: 0;
	margin-top: 20px;
	}

.warp .center .a3 {
	height: 260px;
	width: 1200px;
	margin-bottom: 10px;
		margin-top: 30px;
	}

/*?????????*/

iframe#mainframe{
	position: fixed;
	z-index: 999;
	height: 42px;
}

/*??????*/

.dynamic {
	position: absolute;
	overflow: hidden;
	z-index: -99;
	width: 1920px;
	height:1700px;
	left: 50%;
	margin-left:-960px;
}

.light{
	position: absolute;
	background-image: url(../jpg/bg2.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	z-index: -98;
	width: 1920px;	
	height: 1700px;
}

.flash-light{
  animation: 5s flash infinite;
  animation-delay: 1s;
  -webkit-animation-name: flash;
  animation-name: flash;  
	
}
@-webkit-keyframes flash {
  from, 50%, to { opacity: 1;}

  25%, 75% { opacity: 0.0;}
}

@keyframes flash {
  from, 50%, to {opacity:1; }

  25%, 75% {opacity:0.0;}
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/*???????????????*/
.b01-an {
  opacity: 0;
  animation: 1s bounceInRight forwards;
}

.b01-lihgt {
  position: absolute;
  z-index: 8;
	top:1.3%;
  left: 32.5%;
  width: 66%;
  opacity: 0;
  animation: 3s pulse 3s infinite;/*infinite*/
}
@-webkit-keyframes pulse {
  from {
    opacity: 0;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
	
60%	{
    opacity: 0;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }	
	
75%	{
    opacity: 0.9;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }	
	
88%{
	 opacity: 0.4;
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(3, 3, 3);
    transform: scale3d(3, 3, 3);
  }
}

@keyframes pulse {
from {
    opacity: 0;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
	
60%{
    opacity: 0;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }	
	
75%	{
    opacity: 0.9;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }	
	
88%{
	 opacity: 0.4;
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
	
  to {
    opacity: 0;
    -webkit-transform: scale3d(3, 3, 3);
    transform: scale3d(3, 3, 3);
  }

}
.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}




/*------------------LOGO SLOGAN------------------*/	

.top .logo {
	float: left;
	width: 247px;
	height: 102px;
	background-image: url(../png/logo.png);
	margin: 30px 0 0 495px;
}

.top .slogan{
		float: left;
	width: 604px;
	height: 210px;
    background-image: url(../png/slogan.png)	;
	margin: 80px 0 0 0;
	
}


/*-----------------------a1----------------------*/	
.a1 .a1_left{
	float: left;
	width: 390px;	
}

.a1_left .start_btn{
	float: left;
    width: 250px;
    height: 179px;
    background-image: url(img/start_btn.png);
    background-position: 0px 0px;	
	margin-left: 75px;
	    margin-top: 80px;

}

.a1_left .start_btn:hover{
	background-position: 0px -179px;	
}

.a1_left .login_box{
	float: left;
	width: 240px;
	/*height: 115px;*/
	margin-left: 76px;
	background-image: url(img/login_btn6692.png?t=11);
	background-position: 0px -147px;
	    /*margin-top: 20px;*/
}
	
.login_box #download_btn{
	float: left;
	width: 120px;
    height: 49px;
    background-image: url(img/login_btn6692.png?t=11);
    background-position: 0px -49px;
	display: block;
}

.login_box #download_btn:hover{
	background-position: 0px -98px;
}

.login_box #login_btn{
	float: left;
	width: 120px;
    height: 49px;
    background-image: url(img/login_btn6692.png?t=11);
    background-position: 120px -49px;
}

.login_box #login_btn:hover{
	background-position: 120px -98px;
}

.login_box #Signedin_btn{
	float: left;
	width: 120px;
	height: 49px;
	background-image: url(img/login_btn6692.png?t=11);
    background-position: -120px 0px;
	
}

.sever {
	float: left;
	width: 240px;
	height: 31px;
	font-size: 12px;
	font-family: "Heiti TC", "???????????????";
	
}

.sever ul li{
	float: left;
	width: 120px;
	height: 31px;
	text-align: center;
	line-height: 31px;	
}

.sever a{
	color:#d3d3d3;	
}
.sever a:hover{
	color:#dc0331;	
}

.sever_icon{
	float: right;
	width: 10px;
	height: 10px;
	margin-top: 10px;
    margin-right: 10px;
	background-image:url(img/sever_icon.png);
	background-position: 0px 0px;
}
.sever_icon:hover{
	background-position: 10px 0px;
}

#new_sever_word{
	width: 240px;
	height: 31px;
	text-align: center;
	line-height: 35px;	
}

.menu_box{
	float:left;
	width: 692px;
	height: 82px;
	margin-top: 80px;
}
.menu_box ul li{
	float: left;
	width: 173px;
	height: 82px;
}

#menu_btn01{
	width: 173px;
	height: 82px;
	background-image: url(img/a1_menubtn.png);
	background-position: 0px 0px;
	display: block;
}

#menu_btn02{
	width: 173px;
	height: 82px;
	background-image: url(img/a1_menubtn.png);
	background-position: -173px 0px;
	display: block;
}
#menu_btn03{
	width: 173px;
	height: 82px;
	background-image: url(img/a1_menubtn.png);
	background-position: -345px 0px;
	display: block;
	
}
#menu_btn04{
	width: 173px;
	height: 82px;
	background-image: url(img/a1_menubtn.png);
	background-position: -518px 0px;
	display: block;
}

#menu_btn01:hover{
	background-image: url(img/a1_menubtn.png);
	background-position: 0px -82px;
}
#menu_btn02:hover{
	background-image: url(img/a1_menubtn.png);
	background-position: -173px -82px;
}
#menu_btn03:hover{
	background-image: url(img/a1_menubtn.png);
	background-position: -345px -82px;
}
#menu_btn04:hover{
	background-image: url(img/a1_menubtn.png);
	background-position: -518px -82px;
}


/*--------------------???BTN---------------------*/	

.a2_left{
	float: left;
	width: 240px;
	height: 342px;
	margin-left:75px; 
	clear: both;
}

.new_a2_left{
	float: left;
	width: 240px;
	height: 342px;
	margin-left:75px; 
	margin-top: 25px;
	clear: both;
}

.a2_btn{
	width: 240px;
	height: 114px;
}

.facebook{
	width:240px ;
	height:114px;

}

/*--------------------c1 ????????????---------------------*/

/*C1 ????????????NEW*/

.c1{
	float:left;
	width: 804px;
	min-height: 600px;
	height: auto;
	overflow: auto;	
	margin-top: 20px;
}


.c1_top{
	width: 789px;
	height: 46px;
	background-color: #2f2f3d;
	font-size: 12px;
	font-family: "Heiti TC", "???????????????";
	color: #9eb0db;
	line-height: 46px;
	padding-left:15px;
}

.c1_top a {
	color:#9eb0db;
}
.c1_top a:hover {
	color:#dc0331;
}
.c1_top .link {
	color:#FFDD00;
}

.c1_content_scroll{
	width: 100%;
	height:auto;
	padding: 20px 50px;
	font: 12px/30px "???????????????";
	color:#d3d3d3 ;
	box-sizing: border-box;
	margin-top: 10px;
}

.c1_top a {
	color:#9eb0db;
}
.c1_top a:hover {
	color:#dc0331;
}
.c1_top .link {
	color:#FFDD00;
}

.c1_list_content{
	width: 700px;
	margin: 20px auto;
}

.c1_list_bg{
	width: 100%;
	height: auto;
	min-height: 760px;
	overflow: auto;
	background-color: #222225;
	margin-bottom: 40px;
}


.c1_list_bg ul li{
	color:#d3d3d3;
	font: 14px/46px "???????????????";
	border-bottom: 1px dashed #ddd;
}

.c1_list_bg ul li a{
	color:#d3d3d3;
}
.c1_list_bg ul li a:hover{
	color:#dc0331;
}

ul li .date {
	margin-left: 10px;
	width: 90px;
	float: right;
	color:#8f8f8f;
	font: 14px/46px "???????????????";
}

ul li .list_word{
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*------------news??????--------------*/
.c1 .new-list-page {
	text-align: center;
	clear: both;
	height: 30px;
	width: 800px;
	margin: 50px 0;
}
.c1  .new-list-page a {
	display: inline-block;
	height: 28px;
	font: 12px/28px "???????????????";
	color: #fff;
	min-width: 12px;
	text-align: center;
	padding: 0 5px;
	margin: 0 2px;
}
.c1 .new-list-page a.cur {
	text-decoration: none;
	background: #333333;
	color: #fff;
}
.c1 .new-list-page a:hover {
	color:#FFD100;
	
	}

/*-----------------????????????---------------------*/	
.news_a1{
	float: left;
	min-height: 800px;
	width: 390px;	
}

.content_title{
	font: 20px/30px "???????????????";
	color: #f11212;
	text-align: center;	
	margin-top: 30px;
}

.content_date{
	font: 12px/30px "???????????????";
	color: #989898;
	text-align: center;	
}




/*-----------------???????????????---------------------*/	

.sever_page{
	width: 700px;
	height: 500px;
	margin: 50px auto;	

}
.s_title{
	font: 14px/30px "???????????????";
	color: #d3d3d3;
	margin-top: 10px;
}

.s_title_pic{
	width: 691px;
	height: 5px;
	background-image: url(img/s_title_pic.png);
}

.server_btn {
	width: 120px;
	height: 30px;
	float: left;
	margin: 10px 15px;
	background-color: #406494;
	color: #FFF;
	text-align: center;
	font-family: "???????????????";
	font-size: 14px;
	line-height: 30px;
}
.server_btn:hover {
	background-color: #5b99ec;

}
.sever_page ul li{
	border: none;		
}

.s_a1 {
	width: 690px;
	height: 100px;
	padding: 10px 0px;
	margin: 15px 0 0 0;
	overflow:auto;
}
.s_a2 {
	width: 690px;
	height: 100px;
	padding: 10px 0;
	margin: 15px 0;
	overflow:auto;
}

.s_a3 {
	width: 690px;
	height: 200px;
	padding: 10px 0;
	margin: 15px 0 0 0;
	overflow:auto;
}

/*-----------------????????????---------------------*/	

.game_list_bd {
	 width: 700px;
    margin: 50px auto;
    overflow: hidden;
}

.game_list_bd ul li {
	border: none;
}
.game_list_bd .list_tittle{
	padding: 3px;
	width: 124px;
	height: 26px;
	background-color: #2f2f3d;
	font:16px "???????????????";
	font-weight: 600;
	line-height:26px;
	color: #9eb0db;
	text-align: center;
}
.game_list_bd .list_box{
	width: 700px;
    height: 100px;
    overflow: auto;
    margin: 20px 20px;
}
.game_list_bd .list_box ul li{
	text-align: center;
	width: 95px;
	height: 30px;
	line-height: 30px;
	border-right: 1px solid #9eb0db;
	margin: 12px 0px;
	float: left;
	font-family: "???????????????", Arial;
	font-size: 16px;
}	
.game_list_bd .list_box ul li a{
	color: #d3d3d3;
}	
.game_list_bd .list_box ul li a:hover{
	text-decoration: underline;	
}	


/*-----------------???footer---------------------*/	
	
.footer {
	clear: both;

	width:100%;
	background-color: #121212;
	margin-top:340px;
}

.footer a{
	color: #fff;
	font: 12px/18px "???????????????";
}
.footer a:hover{
	color:#dc0331;
	
}

.footer .top_text {
	line-height: 20px;
	color: #fff;
	text-align: center;
	height: 20px;
	margin-left: 350px;
}
.footer .footer-con {
	width: 1200px;
	height:230px;
	margin: 0 auto;
	text-align: center;
}
.footer .footer-img {
	float: right;
}

.footer .footer-logo-img {
	float:left;
}

.footer .footer-con p {
	font: 12px/18px "???????????????";
	color: #fff;
	text-align:center;	
}