/*弹跳*/
#content{width:100%;position:relative;}
.stage{ width:100%; height:580px; display:block;position: relative;overflow: hidden; background-color:#fff;}
.stage_box{width:900px;height:580px;margin:auto;position:relative;text-align:center;overflow:hidden;}

.fe_flag{position:absolute;width: 140px;height:86px;right: 80px;bottom: 60px; background:url(../images/fe_flag.png) no-repeat;}
#guider .bg{
	z-index:0;
	width:100%;
	height:182px;
	background:url(../images/guider_bg.png) no-repeat center center;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src="../images/guider_bg.png");
	_background-image: none;
	position:absolute;
	top:0px;
	left:0px;
}
#guider{
	width:30px;
	height:182px;
	position:absolute;
	z-index:999;
	top:380px;
	left:30px;
}

.guider_link{ position:relative; z-index:1; width:100%;height:20px;display:block;cursor:pointer;}
#guider_link1{ z-index:1; height:31px;}
#guider_link2.select{ background:url(../images/guider_select.jpg) no-repeat center center;}
#guider_link3.select{ background:url(../images/guider_select.jpg) no-repeat center center;}
#guider_link4.select{ background:url(../images/guider_select.jpg) no-repeat center center;}
#guider_link5.select{ background:url(../images/guider_select.jpg) no-repeat center center;}
#guider_link6.select{ background:url(../images/guider_select.jpg) no-repeat center center;}
#guider_link7.select{ background:url(../images/guider_select.jpg) no-repeat center center;}
#guider_link8.select{ background:url(../images/guider_select.jpg) no-repeat center center;}
#warplogo {position: absolute; top:2px; left:2px;}

.btn_down{width:80px;height:80px;position:absolute;bottom:0px; margin-left: -10px; left: 48.5%;cursor:pointer;}

.sign {position:absolute; width: 32px;height:12px;left:24px;}
#sign1_1{background: url(../images/sign1.png) no-repeat ; bottom: 30px;}
#sign2_1{background: url(../images/sign2.png) no-repeat ; bottom: 38px;}
#sign3_1{background: url(../images/sign3.png) no-repeat ; bottom: 46px;}
.signImg1{background: url(../images/sign_1.png) no-repeat ; bottom: 30px;}
.signImg2{background: url(../images/sign_2.png) no-repeat ; bottom: 38px;}
.signImg3{background: url(../images/sign_3.png) no-repeat ; bottom: 46px;}


/*首页banner*/
#banner-box{ width:100%; margin-top:115px}
#banner-bigbox{ width:300%; height:500px; margin-left:0%; transition:all .8s}
.banner{ float:left; width:33.33%;}
.banner .bleft,.banner .bright{ float:left;}
.banner img{ width:100%}
#banner1 .bleft{ margin-left:160px;}
#banner1 .bright{ margin-top:127px; margin-left:123px;}
#banner2 .bleft{ margin-top:160px; margin-left:290px;}
#banner2 .bright{ margin-top:20px; margin-left:0px;}
#banner3 .bleft{ margin-left:130px;margin-top:70px;}
#banner3 .bright{ margin-top:180px; margin-left:70px;}
.banner-list{ position:absolute; z-index:2; width:180px; clear:both; top:50%; margin-left:15px;  }
.banner-list li{ width:14px; height:14px; border-radius:100%; background:#ccc; margin:7px 0; cursor:pointer}
.banner-list li.on{ background:#00ccff}



/*第二个板块背景*/
#canvas{
	width:100%;
	overflow: hidden;
	position:absolute;
	top:0;
	left:0;
	background:#0093FF;
}
.canvas-wrap{
	position:relative;
	
}
canvas{ opacity:.5}

.indexmain{ position:relative; z-index:9}
/*第三个板块背景*/
iframe{ width:100%; height:100%; position:absolute; background:none; border:none}

/*首页大标题*/
h1.title1{ margin-top:120px}


/*小图标*/
.icon{ width:129px; height:107px; margin:0 auto; margin-bottom:30px}
.icon.icon1{ background:url(../images/icon1.png)}
.icon.icon2{ background:url(../images/icon2.png)}
.icon.icon3{ background:url(../images/icon3.png)}
.icon.icon4{ background:url(../images/icon4.png)}
.icon.icon5{ background:url(../images/icon5.png)}
.icon.icon6{ background:url(../images/icon6.png)}
.icon.icon7{ background:url(../images/icon7.png); margin:25px auto; margin-bottom:20px }
.icon.icon8{ background:url(../images/icon8.png); margin:25px auto; margin-bottom:20px }
.icon.icon9{ background:url(../images/icon9.png); margin:25px auto; margin-bottom:20px }

/*蓝色背景框*/
.centermain{ width:90%; margin:0 auto; padding-top:11%;}
.centermain dl{ width:33%; float:left; text-align:center; transition:all .5s; height:400px;}
.centermain dl:hover{ margin-top:-40px;}
.centermain dl dd{ width:60%; margin:0 auto}

/*stage63*/
#stage3 .left{ background:url(../images/stage3img.jpg); width:50%; height:100%; background-size:cover}
#stage3 .right{ width:50%; height:100%; overflow:hidden}
#stage3 .right .right-box{ width:auto; height:100%; transition:all .8s}
#stage3 .right .rtreturn{ float:left; width:100%; padding-top:140px;}
#stage3 .right p{ width:60%; margin:150px auto; height:150px; margin-bottom:50px; color:#666}

.rtreturn-list{ z-index:2; width:210px; clear:both; margin:0 auto; margin-top:-100px;}
.rtreturn-list li{ float:left; width:60px; height:6px;  background:#00cc33; margin:0 5px; cursor:pointer;}
.rtreturn-list li.on{ background:#00ccff}


/*stage5*/
.stage5main-box{ width:1210px; height:375px; background:url(../images/stage5imgbg.png); margin:120px auto; }
.stage5main{ width:1210px; height:375px; background:url(../images/stage5img1.png);}
.stage5main dl{ width:350px; position:relative; }
.stage5main dt{ color:#333; font-size:20px; font-weight:400; cursor:pointer; }
.stage5main dt:hover{ color:#00ccff; }
.stage5main dd{ font-size:12px; color:#999}
.stage5main dd .color666{ color:#333; font-weight:400} 
.stage5main dl.smian5dl1{ margin-left:10px; top:20px;}
.stage5main dl.smian5dl3{ margin-left:150px; margin-top:130px}
.stage5main dl.smian5dl2{ margin-left:1020px; margin-top:35px}



/*stage6*/
.stage6bg{ width:100%; height:100%; background:url(../images/stage6bg.jpg); background-size:cover; position:absolute; z-index:1; opacity:.2; filter:Alpha(opacity=20)}
.stage6main{ position:relative; z-index:2; }
.s6mian-box{ width:1590px; margin:180px auto; height:240px;}
.s6mian-box dl{ width:508px; height:248px; margin:0 10px; border:1px solid #999; float:left; overflow:hidden; transition:all .3s}
.s6mian-box dl dt,.s6mian-box dl dd{ transition:all .5s}
.s6mian-box dl dd p{ color:#666; width:85%; margin:0 auto; margin-top:40px; font-weight:100; line-height:24px; font-size:14px; transition:all .2s; }
h2.title1,h2.title2{ transition:all .2s}
.s6mian-box dl:hover h2.title1,.s6mian-box dl:hover h2.title2{  color:#fff}
.s6mian-box dl:hover{ border:1px solid #00ccff; background:#00ccff}
.s6mian-box dl:hover dt{ margin-top:-220px;}
.s6mian-box dl:hover dd{ padding-top:120px; color:#fff}
.s6mian-box dl:hover p{ color:#fff}


/*stage7*/
.casenav{ width:246px; margin:0 auto}
.casenav li{ float:left; width:80px; height:30px; margin:20px 1px; color:#999; font-weight:100; text-align:center; line-height:30px; cursor:pointer;}
.casenav li:hover{ color:#fff; background:#00ccff}
.casenav li.on{ color:#fff; background:#00ccff}
.stage7main{ width:1600px; margin:0 auto; clear:both; margin-bottom:40px;}
.stage7main:after{ content:"."; display:block; clear:both; visibility:hidden; height:0px;}
.stage7main dl,.stage7main dt,.stage7main dt img{ width:380px; height:250px}
.stage7main dl{ float:left; margin:0 10px; overflow:hidden; margin-bottom:20px; height:250px; transition:all .3s}
.stage7main dd{ background:#fff; height:40px; padding:20px 0; }
.stage7main h3{ margin-left:20px;}
.stage7main dd .right{ margin-top:2px; margin-right:20px;}

.stage7maindt{ transition:all 0.5s; position:relative; top:0px; z-index:1}
.stage7maindd{ transition:all 0.5s; position:relative; top:0px; z-index:2}
.stage7main dd{ box-shadow:none}
.stage7main dl:hover{ box-shadow:3px 3px 10px 0px #ddd}
.stage7main dl:hover .stage7maindt{ top:-40px}
.stage7main dl:hover .stage7maindd{ top:-80px}


/*stage8*/
#stage8{ background:#f8f8f8}
.lastpage{ width:1140px; margin:0 auto; margin-top:7%}
.ltpage,gtpage{ width:570px;}
.footleftul{ margin-left:100px;}
.footleftul li{ font-size:14px; color:#999; line-height:24px;}
.footleftul .title{ font-size:20px; color:#00ccff; margin-top:50px; margin-bottom:40px;}

.otherimg{ width:150px; margin-left:100px; margin-top:20px;position:relative;}
.otherimg li{ float:left; width:40px; height:40px; border-radius:100%; background-color:#ccc; margin-right:10px; transition:all .5s; cursor:pointer}
.otherimg .qqimg{ background-image:url(../images/indexqqimg.png)}
.otherimg .wcimg{ background-image:url(../images/indexwcimg.png)}
.otherimg .snimg{ background-image:url(../images/indexsnimg.png)}
.otherimg li:hover{ background-color:#00ccff}
.pk-erweima{
	width: 160px;
	
                position: absolute;
                top: 40px;
                left: -9px;
	overflow: hidden;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
	height:0px;
}
.pk-erweima img{
	width:100%;
	display:block;
}
.wcimg:hover .pk-erweima{height:160px;}
p.pk-erweima:hover{height:160px;}
#indexform{ width:570px; height:350px; background:#fff; font-family:"微软雅黑"; padding:50px 0}
#indexform span{ display:block; overflow:hidden;}
#indexform input{
	padding-left:15px;
	width:340px;
	height:50px;
	line-height:50px;
	display:block;
	margin:0 auto;
	border:none;
	border-bottom:1px solid #ccc;
	font-family:"微软雅黑";
	color:#999;
}
#indexform textarea{
	padding-left:15px;
	width:342px;
	height:100px;
	line-height:20px;
	padding-top:15px;
	display:block;
	margin:0 auto;
	border:none;
	border-bottom:1px solid #ccc;
	font-family:"微软雅黑";
	color:#999;
}
#indexform button{
	width:357px;
	height:50px;
	line-height:50px;
	display:block;
	margin:0 auto;
	border:none;
	background:#00ccff;
	font-size:18px;
	font-family:"微软雅黑";
	color:#fff;
	cursor:pointer;
	font-weight:100;
}

#indexform button:hover{ background:#00cc33; }

.dxicon{ width:20px; height:20px; background:url(../images/dx.png) 0px 0px; position:absolute; margin-left:440px; margin-top:-35px; transition:all .3s}
#titleform{ width:350px; margin:0 auto; font-size:12px; height:20px; line-height:20px; color:#f00}

#footerbottom{ position:absolute; bottom:0}

@media screen and (max-width: 1600px){
.banner .bleft{ width:50%;}
.banner .bright{ width:50%;}

#banner1 .bleft{ margin-left:120px; width:32%}
#banner1 .bright{ margin-top:72px; margin-left:73px;width:32%}
#banner2 .bleft{ margin-top:160px; margin-left:200px;width:32%}
#banner2 .bright{ margin-top:50px; margin-left:0px;width:45%}
#banner3 .bleft{ margin-left:110px;margin-top:80px;width:40%}
#banner3 .bright{ margin-top:140px; margin-left:80px;width:36%}
.banner-list{ position:absolute; z-index:2; width:180px; clear:both; top:50%; margin-left:15px;  }
.banner-list li{ width:14px; height:14px; border-radius:100%; background:#ccc; margin:7px 0; cursor:pointer}
.banner-list li.on{ background:#00ccff}
	
	
h6.title1{ font-size:50px; color:#fff; text-align:center; font-weight:400; margin-top:45%; }
h6.title2{ font-size:22px; color:#fff; text-align:center; font-weight:100; margin-top:0px; }
	
h1.title1{ margin-top:90px}
#stage3 .right .rtreturn{ float:left; width:100%; padding-top:20px;}
.centermain{ width:90%; margin:0 auto; padding-top:7%;}
.centermain dl{ width:33%; float:left; text-align:center; transition:all .5s; height:400px;}
.stage5main-box{ width:1210px; height:375px; background:url(../images/stage5imgbg.png); margin:70px auto; }


/*stage6*/
.stage6bg{ width:100%; height:100%; background:url(../images/stage6bg.jpg); background-size:cover; position:absolute; z-index:1; opacity:.2; filter:Alpha(opacity=20)}
.stage6main{ position:relative; z-index:2; }
.s6mian-box{ width:98%; margin:120px auto; height:240px;}
.s6mian-box dl{ width:32%; max-width:508px; height:248px; margin:0 .5%; border:1px solid #999; float:left; overflow:hidden; transition:all .3s}
.s6mian-box dl dt,.s6mian-box dl dd{ transition:all .5s}
.s6mian-box dl dd p{ color:#666; width:85%; margin:0 auto; margin-top:40px; font-weight:100; line-height:24px; font-size:14px; transition:all .2s; }
h2.title1,h2.title2{ transition:all .2s}
.s6mian-box dl:hover h2.title1,.s6mian-box dl:hover h2.title2{  color:#fff}
.s6mian-box dl:hover{ border:1px solid #00ccff; background:#00ccff}
.s6mian-box dl:hover dt{ margin-top:-220px;}
.s6mian-box dl:hover dd{ padding-top:120px; color:#fff}
.s6mian-box dl:hover p{ color:#fff}


/*stage7*/


.stage7main{ width:100%; margin-bottom:10px;}

.stage7main dl{ width:21%; max-width:380px; height:200px;}
.stage7main dt,.stage7main dt img{ width:100%; }
.stage7main dl{ float:left; margin:0 2%; overflow:hidden;  margin-bottom:20px; transition:all .3s}
.stage7main dt img{ height:auto}.stage7main dd{ background:#fff; height:40px; padding:20px 0; }
.stage7main dd{ background:#fff; height:40px; padding:0px 0; }
.stage7main h3{ margin-left:20px;}
.stage7main dd .right{ margin-top:2px; margin-right:20px;}
.stage7main dl:hover .stage7maindt{ top:-60px}
.stage7main dl:hover .stage7maindd{ top:-100px}

}

@media screen and (max-width: 1450px){
.banner .bleft{ width:50%;}
.banner .bright{ width:50%;}

#banner1 .bleft{ margin-left:120px; width:32%}
#banner1 .bright{ margin-top:72px; margin-left:73px;width:32%}
#banner2 .bleft{ margin-top:160px; margin-left:200px;width:32%}
#banner2 .bright{ margin-top:50px; margin-left:0px;width:45%}
#banner3 .bleft{ margin-left:110px;margin-top:80px;width:40%}
#banner3 .bright{ margin-top:140px; margin-left:80px;width:36%}
.banner-list{ position:absolute; z-index:2; width:180px; clear:both; top:50%; margin-left:15px;  }
.banner-list li{ width:14px; height:14px; border-radius:100%; background:#ccc; margin:7px 0; cursor:pointer}
.banner-list li.on{ background:#00ccff}
	
	
h6.title1{ font-size:50px; color:#fff; text-align:center; font-weight:400; margin-top:45%; }
h6.title2{ font-size:22px; color:#fff; text-align:center; font-weight:100; margin-top:0px; }
	
h1.title1{ margin-top:90px}
#stage3 .right .rtreturn{ float:left; width:100%; padding-top:20px;}
.centermain{ width:90%; margin:0 auto; padding-top:7%;}
.centermain dl{ width:33%; float:left; text-align:center; transition:all .5s; height:400px;}
.stage5main-box{ width:1210px; height:375px; background:url(../images/stage5imgbg.png); margin:70px auto; }


/*stage6*/
.stage6bg{ width:100%; height:100%; background:url(../images/stage6bg.jpg); background-size:cover; position:absolute; z-index:1; opacity:.2; filter:Alpha(opacity=20)}
.stage6main{ position:relative; z-index:2; }
.s6mian-box{ width:98%; margin:120px auto; height:240px;}
.s6mian-box dl{ width:32%; max-width:508px; height:248px; margin:0 .5%; border:1px solid #999; float:left; overflow:hidden; transition:all .3s}
.s6mian-box dl dt,.s6mian-box dl dd{ transition:all .5s}
.s6mian-box dl dd p{ color:#666; width:85%; margin:0 auto; margin-top:40px; font-weight:100; line-height:24px; font-size:14px; transition:all .2s; }
h2.title1,h2.title2{ transition:all .2s}
.s6mian-box dl:hover h2.title1,.s6mian-box dl:hover h2.title2{  color:#fff}
.s6mian-box dl:hover{ border:1px solid #00ccff; background:#00ccff}
.s6mian-box dl:hover dt{ margin-top:-220px;}
.s6mian-box dl:hover dd{ padding-top:120px; color:#fff}
.s6mian-box dl:hover p{ color:#fff}


/*stage7*/


.stage7main{ width:100%; margin-bottom:10px;}

.stage7main dl{ width:21%; max-width:380px; height:200px;}
.stage7main dt,.stage7main dt img{ width:100%; }
.stage7main dl{ float:left; margin:0 2%; overflow:hidden;  margin-bottom:20px; transition:all .3s}
.stage7main dt img{ height:auto}.stage7main dd{ background:#fff; height:40px; padding:20px 0; }
.stage7main dd{ background:#fff; height:40px; padding:0px 0; }
.stage7main h3{ margin-left:20px;}
.stage7main dd .right{ margin-top:2px; margin-right:20px;}
.stage7main dl:hover .stage7maindt{ top:-60px}
.stage7main dl:hover .stage7maindd{ top:-100px}

}


@media screen and (max-width: 1300px){
#stage3 .right p {
    width: 60%;
    margin: 100px auto;
    height: 100px;
    margin-bottom: 50px;
    color: #666;

}
h6.title1 {
    font-size: 30px;
    color: #fff;
    text-align: center;
    font-weight: 400;
    margin-top: 55%;
}
.centermain dl{ height:300px;}

.s6mian-box{ margin:60px auto;}
}

/*-----------------------------------*/
.clear-after:after{
    display: block;
    height: 0;
    visibility: hidden;
    content: "";
    clear:both;
}