body,dd,div,dl,dt,em,fieldset,form,h1,h2,h3,h4,h5,h6,html,i,li,ol,p,span,table,td,textarea,th,ul,a{margin:0;padding:0;font:12px/1.5 Arial;box-sizing:border-box;-webkit-box-sizing:border-box}
b,em,h1,h2,h3,h4,h5,h6,i,p{font-weight:400;font-style:normal}
li{list-style:none}
ul{width: 110%;}
input,textarea{outline:0;-webkit-appearance: none;}
a{text-decoration:none;-webkit-tap-highlight-color:rgba(255,0,0,0);outline:0}
img{border:none;display:block;}
::-webkit-scrollbar-thumb{background-color:#f3c800;height:auto!important;outline-offset:-2px;outline:1px solid #fff;-webkit-border-radius:3px;border:1px solid #fff}
::-webkit-scrollbar-thumb:hover{background-color:#777;-webkit-border-radius:1px}
::-webkit-scrollbar{width:1px}
::-webkit-scrollbar-track-piece{background-color:#fff;-webkit-border-radius:0}
::selection{background:#f3c800;color:#fff}
::-moz-selection{background:#f3c800;color:#fff}
::-webkit-selection{background:#f3c800;color:#fff}
input::-moz-input-placeholder{color:#fff;font-size:12px;}
input::input-placeholder{color:#fff;font-size:12px;}
input::-webkit-input-placeholder{color:#fff;font-size:12px;}
body{background-color: #333;}
#canvas {background:radial-gradient(circle farthest-corner at center top, #383c5a, #000000);width: 100%;height: 100%;position: fixed;top: 0;left: 0;right: 0;bottom: 0;}
.fl{float: left;}
.fr{float: right;}
.pabl{position: absolute;}
.pret{position: relative;}
.none{display: none;}
.fontColr{color: #FE2A47;}
.oh{height: auto;overflow: hidden;}
.centerBox{width: 1200px;margin: auto;}
.container:after,.container:before{display:table;content:""}
.container:after{clear: both;}
.whlitBorder{
	background: rgba(0,0,0,0.35);
	transition: all ease-in-out 0.5s;
	-webkit-transition: all ease-in-out 0.5s;
	position: relative;
}
.whlitBorder:hover{
	box-shadow: 5px 5px 15px #000;
	-webkit-box-shadow: 5px 5px 15px #000;
	overflow: hidden;
	transition: all ease-in-out 0.8s;
	-webkit-transition: all ease-in-out 0.8s;
}

.article-box.whlitBorder:hover{
	background-color:rgba(0,0,0,0.35);
	box-shadow:none;
	-webkit-box-shadow: none;
}
.light{
	box-shadow: 0 0 50px #21ebff;
	-webkit-box-shadow: 0 0 50px #21ebff;
}
.txt-light:hover{
	box-shadow: 0 0 50px #FE2A47;
	-webkit-box-shadow: 0 0 50px #FE2A47;
	transition: all ease-in-out 0.8s;
	-webkit-transition: all ease-in-out 0.8s;
}
.margin_25{margin-top: 25px;}
.margin_50{margin-top: 50px;}
.flexBox{
	display: flex;
	display: -webkit-flex;
	flex-flow: wrap;
	-webkit-flex-flow: wrap;
}
.textOh{
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.opacityImg img{
	width: 100%;
	opacity: 0;
	-webkit-opacity: 0;
}

.nav{width: 80px;height: 100%;position: fixed;left: 0;background-color: rgba(0,0,0,0.2);z-index: 99;
box-shadow: 0 0 50px #000;
-webkit-box-shadow: 0 0 50px #000;
}
.nav>div>a{display: block;width: 100%;height: 45px;line-height: 45px;text-align: center;color: #fff;font-size: 14px;margin: 10px auto;}
.nav .nav_top,.nav .nav_down{width: 100%;height: 280px;left: 0;top: 50%;}
.nav .nav_top{margin-top: -265px;}
.nav .nav_down{margin-top: 50px;}
.navStutas .titleBox,.navStutas .center-title{display: none;}
.N-nav{padding-bottom: 15px;}
.N-nav a{
	display: inline-block;
	font-size: 14px;
	text-align: center;
	color: #fff;
	height: 35px;
	padding: 0 10px;
	line-height: 35px;
	background-color: rgba(33,235,255,0.35);
	margin-right: 10px;
	transition: all 0.5s ease-in;
	-webkit-transition: all 0.5s ease-in;
}

.top{margin-top: 15px;height: 55px;}
.search{border-radius: 50px;width: 254px;height: 39px;background-color: rgba(0,0,0,0.1);}
.search .wrapBox{background-color: rgba(0,0,0,0.25);border-radius: 50px;width: 250px;height: 35px;margin: 2px;}
.search .wrapBox input.keyword{width: 180px;height: 35px;padding: 0px 10px;border: none;background-color: transparent;color: #fff;}
.search .wrapBox input.sub_but{width: 50px;height: 35px;border: none;background-color: transparent;background: url(../img/search.png) no-repeat center;background-size: 25px;cursor: pointer;}

#onload{background: url(../img/onloadBG.jpg) no-repeat center/cover;}
.onload_login{width: 300px;height: 254px;top: 50%;left: 50%;margin-top: -150px;margin-left: -150px;}
.onload_login img{margin:10px auto;}
.onload_login p{color: #fff;text-align: center;font-size: 30px;}
.onload_login .loadwrap{border: solid 1px #fff;width: 300px;height: 40px;padding: 5px;border-radius: 8px;-webkit-border-radius: 8px;}
.onload_login .loadwrap .red-line{height: 100%;animation: onloading 3.5s forwards;-webkit-animation: onloading 3.5s forwards;}
.onload_login .loadwrap .load-title{width: 100%;height: 100%;top: 0;left: 0;text-align: center;line-height: 40px;color: #fff;font-size: 18px;}

.titleBox{height: 25px;line-height: 25px;}
.titleBox span,.titleBox a{font-size: 16px;color: #fff;}
.titleBox a:hover,
.nav>div>a:hover,
.nav>div>a:active,
.center-title a:hover
{
	color: #f3c800;
	text-shadow: 0 0 50px #f3c800;
	-webkit-text-shadow: 0 0 50px #f3c800;
	transition: all ease-in-out 0.8s;
	-webkit-transition: all ease-in-out 0.8s;
}
.titleBox:before,.N-nav:before{
	position: absolute;
	content: "";
	width: 0%;
	height: 2px;
	background-color: #e0fcff;
	bottom: 0;
	transition: width 0.5s ease-out;
	-webkit-transition: width 0.5s ease-out;
}
.titleBox img.pabl,.N-nav img.pabl{
	bottom: -60px;
	left: -250px;
	opacity: 0;
	-webkit-opacity: 0;
	transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
}
.center-title{
	width: 100%;
	height: 65px;
	line-height: 40px;
	text-align: center;
	color: #fff;
	font-size: 20px;
	font-weight: bold;
}
.center-title span{
	display: inline-block;
	margin: 0 10px;
	position: relative;
	top: -2px;
	font-weight: bold;
}
.center-title p a{
	color: #fff;
	font-size: 16px;
	
}
.container:hover .titleBox:before,.container:hover .N-nav:before{
	width: 67%;
	transition: width 0.5s ease-in;
	-webkit-transition: width 0.5s ease-in;
}
.container:hover img.pabl,.container:hover img.pabl{
	left: 550px;
	opacity: 1;
	-webkit-opacity: 1;
	transition: left 0.5s ease-in;
	-webkit-transition: left 0.5s ease-in;
}
/* hover style */
.article-further-reading ul li:hover a,
.right-model .list-img ul li:hover .fr,
.right-model .list-text ul li:hover a{
	color: #f3c800;
	text-shadow: 0 0 5px #f3c800;
	-webkit-text-shadow: 0 0 5px #f3c800;
}

.right_menu ul li:hover,
.N-nav a:hover,
.N-nav a.active{
	height: 35px;
	background:rgba(234,200,0,0.75);
	transition: all ease-in-out 0.3s;
	-webkit-transition: all ease-in-out 0.3s;
	color: #fff;
}
.right_menu ul li:hover{
	height: 50px;
}
/* footer */
.footer{
	text-align: center;
	margin-bottom: 25px;
}
.footer .webinfo{
	font-size: 16px;
	color: #fff;
	font-weight: bold;
}
.footer .webinfo a{
	color: #fff;
}
.footer .webinfo a.disclaimer{
	color: #F3C800;
}

/* right menu */
.right_menu{
	width: 50px;
	height: 180px;
	position: fixed;
	right: 0;
	top: 50%;
	margin-top: -90px;
	z-index: 100;
}

.right_menu ul li{
	width: 50px;
	height: 50px;
	margin-bottom: 10px;
	background: rgba(0,0,0,0.2);
	transition: all ease-in-out 0.3s; 
	-webkit-transition: all ease-in-out 0.3s; 
	position: relative;
}
.right_menu ul li .icon{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 999;
}
.right_menu ul li .massage-box{
	background: rgba(0,0,0,0.25);
	border: #dedede solid 1px;
	width: 145px;
	height: 100px;
	position: absolute;
	top: 50%;
	right: -155px;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	transition: right ease-out 0.3s; 
	-webkit-transition: right ease-out 0.3s;
	z-index: 998;
	box-shadow: 0 0 50px #000;
	-webkit-box-shadow: 0 0 50px #000;
}
.right_menu ul li .massage-box:after{
	position: absolute;
	display: table;
	content: "";
	width: 20px;
	height: 50px;
	top: 50%;
	margin-top: -25px;
	background: transparent;
	right: -10px;
}
.right_menu ul li:hover .massage-box{
	right: 60px;
	transition: right ease-in 0.3s; 
	-webkit-transition: right ease-in 0.3s;
}
.right_menu ul li .QQ .icon{
	background: url(../img/qq_bg.png) no-repeat center;
}
.right_menu ul li .QQ .massage-box{
	margin-top: -50px;
	padding: 0px 15px;
}
.right_menu ul li .QQ .massage-box a{
	display: block;
	width: 100%;
	height: 50px;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
}
.right_menu ul li .QQ .massage-box a img{
	width: 25px;
	height: 25px;
	margin: 12.5px 0;
}
.right_menu ul li .QQ .massage-box a span{
	text-align: center;;
	font-size: 14px;
	line-height: 50px;
	color: #fff;
	padding: 0 5px;
}
.right_menu ul li .TEL .icon{
	background: url(../img/tel_bg.png) no-repeat center;
}
.right_menu ul li .TEL .massage-box{
	margin-top: -50px;
}
.right_menu ul li .TEL .massage-box p{
	font-size: 14px;
	color: #fff;
	text-align: center;
	line-height: 50px;
}
.right_menu ul li .WECHAT .icon{
	background: url(../img/wechat_bg.png) no-repeat center;
}
.right_menu ul li .WECHAT .massage-box{
	width: 120px;
	height: 120px;
	margin-top: -60px;
}
.right_menu ul li .WECHAT .massage-box img{
	margin: 10px;
}

/* go top */
.goTop{
	display: none;
	width: 35px;
	height: 35px;
	position: fixed;
	bottom: 10%;
	right: 15px;
	background: url(../img/goTop.png) no-repeat center;
	background-size: 35px;
	cursor: pointer;
}

/*article*/
.cneter .left{
	width: 790px;
}
.cneter .right{
	width: 390px;
}