@charset "utf-8";
/* CSS Document */
body,ol,table,tr,td,dt,dd,dl,h1,h2,h3,h4,h5,h6,form,input,select,textarea{margin:0;padding:0; font-family: "微软雅黑"; font-size:12px; font-weight:normal;}
ul,li{margin:0;padding:0; font-family:"微软雅黑";font-weight:normal;}
html{ overflow-x:hidden;}
body{font-size:12px !important;color:#474747; margin:0; padding:0; _overflow:hidden;  background:#fff;}
.red{ color:red;}
input,button,select,textarea{outline:none}
p{ margin:0; padding:0;}
img{border:none;}
li{list-style-type:none;}
a{text-decoration:none;color:#000;
-webkit-transition:all .3s linear 0s;
-moz-transition:all .3s linear 0s;
-o-transition:all .3s linear 0s;
transition:all .3s linear 0s;
}
input{vertical-align:middle;font-family:"微软雅黑";}
table{border-collapse:collapse;font-family:"微软雅黑";}
a:hover{cursor:pointer; text-decoration:none;}
a,area { blr:expression(this.onFocus=this.blur()) } /* for IE */
:focus { -moz-outline-style: none; } /* for Firefox */
a{ outline:none; } /* for FF Chrome */
.dis{display:none;}
.clear{ clear:both;}
html{  -webkit-text-size-adjust:none;  /*解决chrome浏览器下字体不能小于12px*/}
@media screen and (-webkit-min-device-pixel-ratio:0){ /* chrome*/
	.justify:after{
		content:".";
		display: inline-block;
		width:100%;
		overflow:hidden;
		height:0;
	}
}
/*----- clearfix///给容器清除浮动-----*/
.clearfix{*zoom:1;}
.clearfix:before,.clearfix:after{display:table; content:"";line-height:0;}
.clearfix:after{clear:both;}
/******************************************************************common/////**********************************************************************/
header{ display:table; width:100%; position:relative; left:50%; margin-left:-50%; top:0; z-index:1;}
.logo{ position:absolute; top:45px; left:58px; z-index:999;}

#fp-nav{ width:66px; height:100%; background-color:#fff;}
#fp-nav ul{ width:33px; height:400px; position:absolute; top:50%; margin-top:-200px; left:50%; margin-left:-17px;}
#fp-nav ul li{ width:33px !important; height:33px !important; margin:40px auto 0 !important;}
#fp-nav ul li span{ width:33px !important; height:33px !important;}
#fp-nav ul li.cn1 span{ background:url(../img/home-icon.png) no-repeat center center;}
#fp-nav ul li.cn2 span{ background:url(../img/user.png) no-repeat center center;}
#fp-nav ul li.cn3 span{ background:url(../img/vidoe-icon.png) no-repeat center center;}
#fp-nav ul li.cn4 span{ background:url(../img/move-icon.png) no-repeat center center;}
/*#fp-nav ul li.cn5 span{ background:url(../img/page3-icon.png) no-repeat center center;}*/
#fp-nav ul li.cn5 span{ background:url(../img/pos-icon.png) no-repeat center center;}

#fp-nav ul li.cn1 .active span{ background:url(../img/home-icon_1.png) no-repeat center center;}
#fp-nav ul li.cn2 .active span{ background:url(../img/user_1.png) no-repeat center center;}
#fp-nav ul li.cn3 .active span{ background:url(../img/vidoe-icon_1.png) no-repeat center center;}
#fp-nav ul li.cn4 .active span{ background:url(../img/move-icon_1.png) no-repeat center center;}
/*#fp-nav ul li.cn5 .active span{ background:url(../img/page3-icon.png) no-repeat center center; background-color:#DD1A20;}*/
#fp-nav ul li.cn5 .active span{ background:url(../img/pos-icon_1.png) no-repeat center center;}

.nav-menu,
.nav-menu1, 
.nav-menu2{
  z-index: 99999;height: 86px; position: fixed; top:50px;right:10px;
}
.nav-menu.show{opacity: 1;-webkit-opacity: 1;-moz-opacity: 1;}
.nav-menu img{ position:absolute; left:-1px; top:40px;}
.gh{
float:right;
	height:34px;
	width:29px;
	margin-right:10px;
	position:relative;
	transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-webkit-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-ms-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	cursor:pointer;
}
.gh.selected {
	transform: rotate(90deg);
}
.gh a {
	background-color: #dd1a20;
	display: block;
	height: 4px;
	margin-top: -2px;
	position: relative;
	top: 50%;
	transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	width: 100%;
}
.nav-menu2 .gh a {
	background-color: #fff;
	}
.gh:hover a:before {
	transform: translateY(-2px) rotate(0deg);
	-webkit-transform: translateY(-2px) rotate(0deg);
	-ms-transform: translateY(-2px) rotate(0deg);
}
.gh:hover a:after {
	transform: translateY(2px) rotate(0deg);
	-webkit-transform: translateY(2px) rotate(0deg);
	-ms-transform: translateY(2px) rotate(0deg);
}
.gh.selected:hover a:before {
	transform: translateY(0px) rotate(-55deg);
	-webkit-transform: translateY(0px) rotate(-55deg);
	-ms-transform: translateY(0px) rotate(-55deg);
}
.gh.selected:hover a:after {
	transform: translateY(0px) rotate(55deg);
	-webkit-transform: translateY(0px) rotate(55deg);
	-ms-transform: translateY(0px) rotate(55deg);
}
.gh a:after, .gh a:before {
	background-color: #dd1a20;
	content: "";
	display: block;
	height: 4px;
	left: 0;
	position: absolute;
	transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	width:100%;
	
}
.nav-menu2 .gh a:after, .nav-menu2 .gh a:before{
		background-color: #fff;
	}
.gh a:after {
	top:10px;
}
.gh a:before {
	top:-10px;
}
.gh.selected a:after, .gh.selected a:before {
	top: 0;
}
.gh.selected a:before {
	transform: translateY(0px) rotate(-45deg);
	-webkit-transform: translateY(0px) rotate(-45deg);
	-ms-transform: translateY(0px) rotate(-45deg);
}
.gh.selected a:after {
	transform: translateY(0px) rotate(45deg);
	-webkit-transform: translateY(0px) rotate(45deg);
	-ms-transform: translateY(0px) rotate(45deg);
}
.gh.selected a {
	background-color: transparent !important;
}
.nav-big{ position:fixed; top:0%; left:-100%; width:100%; height:100%; background-color:#fff; background-color:rgba(193,193,193,0.7); z-index:999;}
.sub-nav{ width:818px; height:184px; position:absolute; top:64%; margin-top:-92px; left:50%; margin-left:-400px;}
.sub-nav ul{ width:100%; display:table;}
.sub-nav ul li{ float:left; width:102px; height:144px; background-color:#fff; background-color:rgba(255,255,255,0.8); margin-right:12px; text-align:right; padding:20px 22px 0 0;
-webkit-transition:all .5s linear 0s;
-moz-transition:all .5s linear 0s;
-ms-transition:all .5s linear 0s;
transition:all .5s linear 0s;
cursor:pointer;
}
.sub-nav ul li h3{ font-size:46px; font-family:"Arial"; color:#D6181F;}
.sub-nav ul li p{ font-size:16px; color:#D6181F; margin-top:15px;}
.sub-nav ul li span{ display:block; margin-top:15px; width:22px; border-bottom:3px solid #D6181F; float:right;}
.sub-nav ul li:hover{
	transform:scale(1.05,1.05);
	-webkit-transform:scale(1.05,1.05);
	-moz-transform:scale(1.05,1.05);
	-ms-transform:scale(1.05,1.05);
	 background-color:rgba(255,255,255,1);
}



.supper-con{ width:100%; height:100%; position:absolute; left:0; top:0; background:url(../img/yf-bg.jpg) no-repeat center center; background-size: cover;}
.supper-con .sur-nei{ width:676px; height:534px; position:absolute; left:50%; margin-left:-338px; top:50%; margin-top:-267px;}
.supper-con .super-logo{ width:120px; height:115px; position:absolute; left:46%; margin-left:-45px;}
.sub-nav2{ width:818px; margin-left:-400px;}
.supper-con .wen-mk{ width:156px; position:absolute; left:50%; margin-left:-78px; bottom:0;}
.supper-con .wen-mk h4{ font-size:17px; color:#DD1F26; font-weight:bold; margin-top:2px;}

@media only screen and ( max-width:680px ){
	.supper-con .sur-nei{ width:90%; height:420px; margin-top:-210px; margin-left:-45%;}
    .sub-nav2{ width:100%; margin-left:-50%;}
	.sub-nav2 ul li{ width:14%; height:90px; margin-right:2%; padding:4% 2% 0 2%; text-align:center;}
	.sub-nav2 ul li h3{ font-size:24px;}
	.sub-nav2 ul li p{ font-size:14px;}
 

}