@charset "utf-8";
/* CSS Document */

*{ 
	margin:0px; 
	padding:0px;
	border:none;
	color:#333;
	font-size:14px;
	font-family:"Microsoft YaHei",SimSun;
	list-style-type:none;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
a{ color:#333; text-decoration:none;}
a:hover{ color:#FF6600; text-decoration:none;}
body{ padding:66px 0 0 0;}


.Head{ width:100%; height:66px; float:left; position:fixed; top:0; left:0; z-index:9; background:#FFF; box-shadow:4px 4px 6px rgba(0,0,0,0.10);}
/*.Head .niu{ width:100%; height:1px; float:left; position:absolute; bottom:-1px; left:0; background:rgba(0,0,0,0.06);}*/
.Head .mian{ width:1100px; height:66px; margin:0 auto; background:#FFF;}
.Head .mian .logo{ height:38px; float:left; padding:14px 0;} 
.Head .mian .logo img{ height:38px;}
.Head ul.nav{ height:66px; float:right;}
.Head ul.nav li{ width:106px; height:18px; float:left; margin:24px 0; position:relative;border-right:1px dashed rgba(0,0,0,0.10);}
.Head ul.nav li a.a{ width:60px; height:60px; float:left; line-height:60px; text-align:center; margin:auto; position:absolute; top:-21px; left:0; right:0; text-align:center;}
.Head ul.nav li a.a.show{ color:#C21C1F;}
.Head ul.nav li .li_main{ display:none;}
.Head ul.nav li.show a.a,
.Head ul.nav li a.a:hover{ color:#C21C1F; border-bottom:3px solid #C21C1F; -webkit-transition: all 0s;-moz-transition: all 0s; transition: all 0s;}
.Head ul.nav li.hover a.a{ color:#C21C1F; border-bottom:3px solid #C21C1F; -webkit-transition: all 0s;-moz-transition: all 0s; transition: all 0s;}
.Head ul.nav li.show .li_main{ width:337px; display:block; position:absolute; top:42px; left:0; padding:20px 0; background:#FFF; box-shadow:2px 2px 4px rgba(0,0,0,0.30);}
.Head ul.nav li.show .li_main a{ width:168px; float:left; line-height:20px; text-align:center; font-size:12px; color:#666; padding:46px 0 0 0;}
.Head ul.nav li.show .li_main a.cp1{ background:url(../Images/st_01.png) top no-repeat; background-size:auto 36px;}
.Head ul.nav li.show .li_main a.cp2{ background:url(../Images/st_02.png) top no-repeat; background-size:auto 36px; border-left:1px dashed #E7E7E7;}
.Head ul.nav li.show .li_main a:hover{ color:#C21C1F;}


.banner{ width:100%; height:460px; float:left; overflow:hidden; position:relative; background:#01228B url(../Images/banner.png) center no-repeat;}
.banner a{ width:186px; height:46px; margin:auto; line-height:46px; text-align:center; color:#FFF; z-index:2; position:absolute; bottom:140px; left:0; right:0; background:#FF6600; box-shadow:6px 6px 8px rgba(0,0,0,0.36);} 

.texie{ width:940px; height:280px; float:left; position:absolute; bottom:-100px; left:50%; margin:0 0 0 -470px;}
.texie span{ height:200px; float:left; position:absolute; bottom:0;}
.texie span img{ height:200px; float:left;}
.texie span.on1{ left:0;}
.texie span.on2{ left:180px; z-index:1;}
.texie span.on3{ left:360px; z-index:2;}
.texie span.on4{ left:540px; z-index:3;}
.texie span.on5{ left:720px; z-index:4;}




.Footer{ width:100%; float:left; position:relative; z-index:1; background:#1F3237;}
.Footer .link{ width:1000px; height:40px; margin:0 auto; padding:10px 0; position:relative; border-bottom:1px solid #203B42;}
.Footer .link .link_mian{ height:40px; float:left;}
.Footer .link .link_mian u{ height:40px; float:left; line-height:40px; font-size:12px; color:#FFF; text-decoration:none;}
.Footer .link .link_mian a{ height:12px; float:left; line-height:100%; font-size:12px; color:#FFF; margin:14px 0; padding:0 25px; border-right:1px solid #3D5D64;}
.Footer .link .kefu{ width:138px; height:45px; margin:auto; position:absolute; top:0; bottom:0; right:0;}
.Footer p{ width:100%; height:60px; float:left; line-height:60px; text-align:center; font-size:12px; color:#ADB8BB;}



.first{ width:100%; height:500px; float:left; position:relative; background-size:100% auto;}
.first .muke{ width:1200px; height:398px; position:absolute; top:50%; left:50%; margin:-199px 0 0 -600px;}
.first .muke span.pic{ width:464px; height:291px; float:right; padding:26px 85px 81px 83px; background:url(../Images/pic_1.png);}
.first .muke span.pic img{ height:291px; float:left; border-radius:3px;}
.first .muke .text{ width:468px; display:block; overflow:hidden; padding:0 50px; position:absolute; top:50%; left:0; margin:-134px 0 0 0;}
.first .muke .text h2{ width:100%; font-size:32px; line-height:100%; color:#FF6600; font-weight:lighter;}
.first .muke .text p{ width:100%; float:left; color:#666; line-height:24px; padding:40px 0 66px 0; text-align:justify;}
.first .muke .text a{ height:42px; float:left; line-height:42px; color:#FFF; padding:0 46px; background:#C21C1F; box-shadow:0 -4px 6px rgba(194,28,31,0.38);}


.problem{ width:100%; height:560px; float:left; position:relative; background:#F2F7FF;}
.problem .mian{ width:1200px; height:100%; box-sizing:border-box; text-align:center; position:absolute; top:0; left:50%; margin:0 0 0 -600px;}
.problem .mian .text h2{ width:100%; font-size:32px; line-height:100%; color:#FF6600; padding:76px 0 80px 0; font-weight:lighter; position:relative;}
.problem .mian .text h2 i{ width:100px; height:4px; float:left; position:absolute; bottom:54px; left:0; right:0; margin:0 auto; border-radius:6px; background:#FF6600;}


.problem .mian .text ul{ width:1100px; height:300px; display:block; margin:0 auto;}
.problem .mian .text ul li{ width:170px; height:300px; float:left; overflow:hidden; position:relative; padding:0 15px; margin:0 10px;
 box-shadow:0 8px 8px #DFE9F8;
}

.problem .mian .text ul li.m01{ background:#FFF url(../images/problem01.png) center 38px no-repeat;}
.problem .mian .text ul li.m02{ background:#FFF url(../images/problem02.png) center 38px no-repeat;}
.problem .mian .text ul li.m03{ background:#FFF url(../images/problem03.png) center 38px no-repeat;}
.problem .mian .text ul li.m04{ background:#FFF url(../images/problem04.png) center 38px no-repeat;}
.problem .mian .text ul li.m05{ background:#FFF url(../images/problem05.png) center 38px no-repeat;}	

.problem .mian .text ul li span{ width:100%; height:40px; float:left; line-height:40px; font-size:16px; margin:100px 0 0 0;}
.problem .mian .text ul li p{ width:100%; height:88px; float:left; line-height:22px; color:#888; text-align:justify; font-size:12px;}
.problem .mian .text ul li a{ width:128px; height:32px; display:inline-block; line-height:32px; color:#888; border:1px solid #FFF;}

.problem .mian .text ul li:hover{ margin-top:-20px; background-color:#FBFCFF; box-shadow:8px 8px 8px #C3D7F4;}
.problem .mian .text ul li:hover span{ color:#C21C1F;}
.problem .mian .text ul li:hover a{ color:#C21C1F; border:1px solid #C21C1F; box-shadow:4px 4px 6px rgba(194,28,31,0.38);}



.plan{ width:100%; height:637px; float:left; position:relative;/* background:url(../images/bg.jpg) center no-repeat; background-size:auto 100%;*/}
.plan .mian{ width:1200px; height:409px; box-sizing:border-box; text-align:center; position:absolute; top:0; left:50%; margin:0 0 0 -600px;}
.plan .mian .text h2{ width:100%; font-size:32px; line-height:100%; position:relative; color:#FF6600; padding:70px 0 66px 0; font-weight:lighter;}
.plan .mian .text h2 i{ width:100px; height:4px; float:left; position:absolute; bottom:40px; left:50%; border-radius:6px; margin:0 0 0 -50px; background:#FF6600;}
.plan .mian ul{ width:1180px; display:block; margin:0 auto 40px auto; overflow:hidden;}
.plan .mian ul li{ width:203px; height:158px; float:left; padding:45px 0 0 0; position:relative; margin:0 45px; border-radius:100%; border:1px solid #FF6600;}
.plan .mian ul li span{ width:100%; height:50px; float:left; padding:78px 0 0 0; font-size:16px; line-height:50px;}
.plan .mian ul li span.wz01{ background: url(../Images/wz_01.png) center top no-repeat;}
.plan .mian ul li span.wz02{ background: url(../Images/wz_02.png) center top no-repeat;}
.plan .mian ul li span.wz03{ background: url(../Images/wz_03.png) center top no-repeat;}
.plan .mian ul li span.wz04{ background: url(../Images/wz_04.png) center top no-repeat;}
.plan .mian ul li p{ width:149px; height:149px; float:left; border:2px solid #FFF; position:absolute; top:0; left:0; line-height:25px; color:#FFF; padding:50px 25px 0 25px; text-align:justify; display:none; border-radius:199px;}
.plan .mian ul li:hover{ 
	display:block; 
	background:rgba(255,102,0,0.80);
	animation:piao .6s;
	-moz-animation:piao .6s;	/* Firefox */
	-webkit-animation:piao .6s;	/* Safari 和 Chrome */
	-o-animation:piao .6s;	/* Opera */
}
.plan .mian ul li:hover p{
	display:block;
	background:rgba(255,102,0,0.80);
	animation:piao .6s;
	-moz-animation:piao .6s;	/* Firefox */
	-webkit-animation:piao .6s;	/* Safari 和 Chrome */
	-o-animation:piao .6s;	/* Opera */
}


@keyframes piao {
	0% { 
		display:none;
		background:rgba(255,102,0,0.00);
		transform:rotate(0) scale(0.5);
		-webkit-transform:rotate(0) scale(0.5);
		-moz-transform:rotate(0) scale(0.5);
		-o-transform:rotate(0) scale(0.5);
		-ms-transform:rotate(0) scale(0.5);
	}
	25% { 
		display: block;
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	50% { 
		left:-10px;
		display: block;
		background:rgba(255,102,0,1);
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	75% { 
		left:10px;
		display: block;
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	100% { 
		left:0;
		display:block;
		background:rgba(255,102,0,0.80);
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
}

@-moz-keyframes piao {  /* Firefox */
	0% { 
		display:none;
		background:rgba(255,102,0,0.00);
		transform:rotate(0) scale(0.5);
		-webkit-transform:rotate(0) scale(0.5);
		-moz-transform:rotate(0) scale(0.5);
		-o-transform:rotate(0) scale(0.5);
		-ms-transform:rotate(0) scale(0.5);
	}
	25% { 
		display: block;
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	50% { 
		left:-10px;
		display: block;
		background:rgba(255,102,0,1);
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	75% { 
		left:10px;
		display: block;
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	100% { 
		left:0;
		display:block;
		background:rgba(255,102,0,0.80);
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
}

@-webkit-keyframes piao { /* Safari 和 Chrome */
	0% { 
		display:none;
		background:rgba(255,102,0,0.00);
		transform:rotate(0) scale(0.5);
		-webkit-transform:rotate(0) scale(0.5);
		-moz-transform:rotate(0) scale(0.5);
		-o-transform:rotate(0) scale(0.5);
		-ms-transform:rotate(0) scale(0.5);
	}
	25% { 
		display: block;
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	50% { 
		left:-10px;
		display: block;
		background:rgba(255,102,0,1);
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	75% { 
		left:10px;
		display: block;
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	100% { 
		left:0;
		display:block;
		background:rgba(255,102,0,0.80);
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
}

@-o-keyframes piao { /* Opera */
	0% { 
		display:none;
		background:rgba(255,102,0,0.00);
		transform:rotate(0) scale(0.5);
		-webkit-transform:rotate(0) scale(0.5);
		-moz-transform:rotate(0) scale(0.5);
		-o-transform:rotate(0) scale(0.5);
		-ms-transform:rotate(0) scale(0.5);
	}
	25% { 
		display: block;
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	50% { 
		left:-10px;
		display: block;
		background:rgba(255,102,0,1);
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	75% { 
		left:10px;
		display: block;
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
	100% { 
		left:0;
		display:block;
		background:rgba(255,102,0,0.80);
		transform:rotate(360deg) scale(1);
		-webkit-transform:rotate(360deg) scale(1);
		-moz-transform:rotate(360deg) scale(1);
		-o-transform:rotate(360deg) scale(1);
		-ms-transform:rotate(360deg) scale(1);
	}
}

.plan .huodong{ width:100%; float:left; margin:409px 0 0 0; text-align:center;}
.plan .huodong h3{ width:100%; font-size:26px; line-height:100%; position:relative; color:#FF6600; padding:20px 0; font-weight:lighter; border-bottom:1px solid #E8E8E8;}
.plan .huodong h3 i{ width:100px; height:3px; float:left; position:absolute; bottom:-2px; left:50%; border-radius:6px; margin:0 0 0 -50px; background:#FF6600;}
.plan .huodong span{ width:100%; float:left; line-height:30px; padding:30px 0 0 0;}


.light{ width:100%; height:637px; float:left; position:relative; overflow:hidden; background:#F2F7FF;}
.light .mian{ width:1200px; height:100%; box-sizing:border-box; position:absolute; top:0; left:50%; margin:0 0 0 -600px;}
.light .mian .tab{ width:76%; height:60px; float:left; margin:60px 12%; text-align:center;}
.light .mian .tab em{ width:25%; height:60px; float:left; cursor:pointer; position:relative; text-align:center;}
.light .mian .tab em i{ display:inline-block; overflow:hidden; font-size:16px; color:#666; line-height:60px; font-style:normal; padding:0 0 0 40px;}
.light .mian .tab em i.w01{ background:url(../Images/w01.png) left no-repeat;}
.light .mian .tab em i.w02{ background:url(../Images/w02.png) left no-repeat;}
.light .mian .tab em i.w03{ background:url(../Images/w03.png) left no-repeat;}
.light .mian .tab em i.w04{ background:url(../Images/w04.png) left no-repeat;}

.light .mian .tab em.current{ background:#C21C1F; border-radius:60px; box-shadow:5px 4px 5px rgba(0,0,0,0.20);}
.light .mian .tab em.current i{ color:#FFF; font-weight:bold;}
.light .mian .tab em.current i.w01{ background:url(../Images/w01-show.png) left no-repeat;}
.light .mian .tab em.current i.w02{ background:url(../Images/w02-show.png) left no-repeat;}
.light .mian .tab em.current i.w03{ background:url(../Images/w03-show.png) left no-repeat;}
.light .mian .tab em.current i.w04{ background:url(../Images/w04-show.png) left no-repeat;}

/*
.light .mian .tab em.current b{ width:100%; height:2px; float:left; background:#FF6000; position:absolute; bottom:0; left:0; border-radius:5px;}
*/


.light .mian .anliu{ width:475px; height:309px; float:left; position:absolute; bottom:0; left:50%; margin:0 0 0 -360px; background: url(../Images/anliu.png) center no-repeat; padding:48px 123px 81px 122px;}
.light .mian .anliu .list{ width:100%; height:309px; float:left; display:none;}
.light .mian .anliu .list img{ width:475px; height:309px; float:left; position:absolute; bottom:81px; left:122px; border-radius:4px;}
.light .mian .anliu .list .shumi{ width:180px; height:280px; float:left; padding:20px 20px 0 20px; position:absolute; top:60px; left:-45px; border-radius:4px; background:#FF6000;}
.light .mian .anliu .list .shumi em{ width:100%; float:left; font-size:16px; font-style:normal; font-weight:bold; line-height:24px; color:#FFF;  padding:0 0 10px 0;}
.light .mian .anliu .list .shumi p{ width:100%; float:left; font-size:12px; line-height:20px; text-align:justify; color:#FFF; opacity:0.8;}
.light .mian .anliu .list.show{ display:block;}
.light .mian .anliu .list.show .shumi{
	animation:fong .6s;
	-moz-animation:fong .6s;	/* Firefox */
	-webkit-animation:fong .6s;	/* Safari 和 Chrome */
	-o-animation:fong .6s;	/* Opera */
	animation-delay:.6s;
	animation-fill-mode:both;
}
.light .mian .anliu .list.show img{
	animation:imgpic .6s;
	-moz-animation:imgpic .6s;	/* Firefox */
	-webkit-animation:imgpic .6s;	/* Safari 和 Chrome */
	-o-animation:imgpic .6s;	/* Opera */
}


@keyframes fong {
	0% { 
		left:-1500px;
		opacity:0;
		transform:scale(0);
		-webkit-transform:scale(0);
		-moz-transform:scale(0);
		-o-transform:scale(0);
		-ms-transform:scale(0);
	}
	100% { 
		left:-45px;
		opacity:1;
		transform:scale(1);
		-webkit-transform:scale(1);
		-moz-transform:scale(1);
		-o-transform:scale(1);
		-ms-transform:scale(1);
	}
}
@-moz-keyframes fong {  /* Firefox */
	0% { 
		left:-1500px;
		opacity:0;
		transform:scale(0);
		-webkit-transform:scale(0);
		-moz-transform:scale(0);
		-o-transform:scale(0);
		-ms-transform:scale(0);
	}
	100% { 
		left:-45px;
		opacity:1;
		transform:scale(1);
		-webkit-transform:scale(1);
		-moz-transform:scale(1);
		-o-transform:scale(1);
		-ms-transform:scale(1);
	}
}
@-webkit-keyframes fong { /* Safari 和 Chrome */
	0% { 
		left:-1500px;
		opacity:0;
		transform:scale(0);
		-webkit-transform:scale(0);
		-moz-transform:scale(0);
		-o-transform:scale(0);
		-ms-transform:scale(0);
	}
	100% { 
		left:-45px;
		opacity:1;
		transform:scale(1);
		-webkit-transform:scale(1);
		-moz-transform:scale(1);
		-o-transform:scale(1);
		-ms-transform:scale(1);
	}
}

@-o-keyframes fong { /* Opera */
	0% { 
		left:-1500px;
		opacity:0;
		transform:scale(0);
		-webkit-transform:scale(0);
		-moz-transform:scale(0);
		-o-transform:scale(0);
		-ms-transform:scale(0);
	}
	100% { 
		left:-45px;
		opacity:1;
		transform:scale(1);
		-webkit-transform:scale(1);
		-moz-transform:scale(1);
		-o-transform:scale(1);
		-ms-transform:scale(1);
	}
}
@keyframes imgpic {
	0% { opacity:0; left:1500px;}
	100% { opacity:1; left:122px;}
}
@-moz-keyframes imgpic {  /* Firefox */
	0% { opacity:0; left:1500px;}
	100% { opacity:1; left:122px;}
}

@-webkit-keyframes imgpic { /* Safari 和 Chrome */
	0% { opacity:0; left:1500px;}
	100% { opacity:1; left:122px;}
}

@-o-keyframes imgpic { /* Opera */
	0% { opacity:0; left:1500px;}
	100% { opacity:1; left:122px;}
}



