@charset "utf-8";
/*清除网页中个标签的默认属性*/
* { margin:0; padding:0;}
body {background:#fff;font-size:14px; word-break: break-all; font-family:microsoft yahei,Arial,Helvetica,sans-serif; color:#2d374b; }  
input,textarea{font-family:microsoft yahei,Arial,Helvetica,sans-serif; outline: none;}
table { font-size:inherit; border-collapse:collapse; border-spacing:0; }
a{ text-decoration:none;color:#2d374b; cursor:pointer;}
fieldset, img { border:0; }
ul, li { list-style:none }
em,i{ font-style:normal;}
/*关于浮动的样式定义*/
.clear{ clear:both; height:0; overflow:hidden; display:block; }
.left { float:left }
.right { float:right }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { zoom:1; }
.clearfix { display: block; }
a:hover{
	-webkit-transition:all .5s ease;
	-moz-transition:all .5s ease;
	-o-transition:all .5s ease;
	transition:all .5s ease;
	} 

.logo-img{height: 30px; margin-top: 15px; float: left;}
.container{ margin: 0 auto; width: 1250px; }
.menu-login ul{
	float:right;
}
.menu-login ul li{
	float:left;height: 100px;line-height: 100px;margin-left: 20px;
}
.fl{
	float: left;
}

.fr{
	float: right;
}


.menu-login ul li img{ margin-top: 20px;}

.menu-login a:hover{ color: #1073ea;}



.part1{
	float: left;
	width: 100%;
	padding-top: 20px;
	padding-bottom:20px;
	margin-bottom: 77px;

	background:url(../images/bj1.png) bottom right no-repeat  #fff8e6; 
}

.part2{
	float: left;
	width: 100%;
	padding-top: 20px;
	padding-bottom:20px;
	margin-bottom: 77px;
	background:url(../images/bj2.png) bottom right no-repeat  #e0f8ff; 

}

.part3{
	float: left;
	width: 100%;
	padding-top: 20px;
	padding-bottom:20px;
	margin-bottom: 77px;

	background:url(../images/bj3.png) bottom right no-repeat  #e2ffe0; 	
}


.part4{
	float: left;
	width: 100%;
	width: 100%;
	padding-top: 20px;
	padding-bottom:20px;
	background:url(../images/bj4.png) bottom right no-repeat  #ffeedd; 		

}



.left-part1{
	width: 182px;
	height: 300px;
	background: #3ab1ff;
}

.left-part2{
	width: 182px;
	height: 300px;
	background: #52db7f;
}

.left-part3{
	width: 182px;
	height: 150px;
	background: #ffa95c;
}
.left-part3 .icon-1{
	 margin-left:50px;
	 margin-top:20px;
}  

.left-part4{
	width: 182px;
	height: 150px;
	background: #3dbdff;
}

.left-part4 .icon-1{
	 margin-left:50px;
	 margin-top:20px;
} 







.right-part1{
	width: 100%;
	min-height: 100px;
	background: #fff;
/*	border-right:1px solid #f1f1f1;
    border-top:1px solid #f1f1f1;*/
    padding-bottom: 45px;
}

.head-name1{
 width: 100%;
 height: 90px;
 line-height: 90px;
 background: url(../images/title1.png) no-repeat;
color: #f4bb32;

}


.head-name2{
 width: 100%;
 height: 90px;
 line-height: 90px;
 background: url(../images/title2.png) no-repeat;
color: #70bfd8;

}



.head-name3{
 width: 100%;
 height: 90px;
 line-height: 90px;
 background: url(../images/title3.png) no-repeat;
color: #40af39;

}


.head-name4{
 width: 100%;
 height: 90px;
 line-height: 90px;
 background: url(../images/title4.png) no-repeat;
color: #ef8518;

}

.font-title{
	margin-left: 135px;
	float:left;

    font-size: 30px;
}

.right-part1 ul{

margin-left: 120px;
width: 960px;
text-align:left;



}

.right-part1 ul li{
	float:left;
    height: 107px;
    margin-left: 60px;


	text-align: center;
/*	border-bottom:1px solid #f1f1f1;
	border-left:1px solid #f1f1f1;*/
	margin-top: 30px;
}

.right-part1 ul li a img{

}


.right-part1 ul li a{
	font-size: 15px;
}

.right-part1 ul li a p{
	margin-top: 8px;
}

.part1 ul li a :hover{
	color: #3ab1ff;
}

.part2 ul li a :hover{
	color: #0ba06e;
}

.part3 ul li a :hover{
	color: #e17c22;
}

.part4 ul li a :hover{
	color: #1da1e5;
}






.right-part2{
	width: 1030px;
	height: 150px;
	background: #fff;

}

.right-part2  {
	border-top:1px solid #f1f1f1;
	border-right:1px solid #f1f1f1;
}
.right-part2 ul li{
	float:left;
	width: 145.1px;
	height: 148.5px;
	text-align: center;
	border-bottom:1px solid #f1f1f1;
	border-left:1px solid #f1f1f1;
	
}

.right-part2 ul li a img{
	margin-top:25px;
}


.right-part2 ul li a{
	font-size: 15px;
}

.right-part2 ul li a p{
	margin-top: 5px;
}



  .Copyright {
  	float: left;
    width: 100%;
    background-color: #fff;
    height: 77px;
    line-height: 77px;   
    text-align: center;
    font-size: 14px;
    color: #575467;

  }






















#menu { position: fixed; right: 30px; top: 50%; width: 20px; margin: -80px 0 0; padding: 0; list-style-type: none; z-index: 70;}
#menu li { margin-top: 10px; font: 14px "Microsoft Yahei";}
#menu a { width:12px; height:12px; display: block; background:url(../images/page.png) 0 -13px; }
#menu .active a { background:url(../images/page.png) 0 0px;}
.section {width:100%; height:600px; font: 20px "Microsoft Yahei"; color: #fff; position: relative; line-height:40px;}
.section1 { background: url(../images/bg_01.jpg) center no-repeat;}
.section2 { background: url(../images/bg_02.jpg) center no-repeat;}
/*.section3 { background: url(../images/bg_03.jpg) center no-repeat;}
.section4 { background: url(../images/bg_04.jpg) center no-repeat;}
.section5 { background: url(../images/bg_05.jpg) center no-repeat;}
.section6 { background: url(../images/bg_06.jpg) center no-repeat;}
.section7 { background: url(../images/bg_07.png) repeat;} */
.screen-main,.screen-main2 { position: relative; width: 1200px; height:90%; margin: 0 auto;}
.screen-main span { position: absolute;}

.bj1{position: absolute; left: 0%; bottom: 0px; z-index: 1; width:100%;height:100%;background:url(../images/6_img2.png) center repeat;}

/*.down{position: absolute; left: 50%; bottom: 40px; z-index: 100; width:32px;height: 56px; margin-left: -16px;}*/
.down { 
     display: block; 

	 -webkit-animation: animations 2s ease-out infinite;
     -moz-animation: animations 2s ease-out infinite;
     -o-animation: animations 2s ease-out infinite;
     -ms-animation: animations 2s ease-out infinite;
     animation: animations 2s ease-out infinite;
	 }
 
.img1{
	position:absolute;
	
	opacity:0.5;
	-webkit-animation: zoomIn 3s .8s ease-out infinite;
    -moz-animation: zoomIn 3s .8s ease-out infinite;
    -o-animation: zoomIn 3s .8s ease-out infinite;
    -ms-animation: zoomIn 3s .8s ease-out infinite;
    animation: zoomIn 3s .8s ease-out infinite;}
    
.icon-1{
	 margin-left:50px;
	 margin-top:80px;
}    
  
.f18{
	font-size:20px;
	color:#fff;
	text-align: center;
	margin-top: 20px;
} 
  
  
.f18-1{
	font-size:20px;
	color:#fff;
	text-align: center;
	margin-top: 5px;
} 
    
  
    


/*2*/

.button{ 

	 -webkit-transition:all .5s ease .01s;
	 -moz-transition:all .5s ease .01s;
	 -o-transition:all .5s ease .01s;
	 transition:all .5s ease .01s;
	 -webkit-animation: animations 2s ease-out infinite;
     -moz-animation: animations 2s ease-out infinite;
     -o-animation: animations 2s ease-out infinite;
     -ms-animation: animations 2s ease-out infinite;
     animation: animations 2s ease-out infinite;
	 }
	 
	 

.img3{
	left:480px;
	top:1300px;
	opacity: 0;
	-webkit-transition:all .5s ease .1s;
	-moz-transition:all .5s ease .1s;
	-o-transition:all .5s ease .1s;
	transition:all .5s ease .1s;
	}
.btn{
	left:380px;
	top:1300px;
	opacity: 0;
	-webkit-transition:all .5s ease .3s;
	-moz-transition:all .5s ease .3s;
	-o-transition:all .5s ease .3s;
	transition:all .5s ease .3s;
	-webkit-animation: animations 2s ease-out infinite;
	-moz-animation: animations 2s ease-out infinite;
	-o-animation: animations 2s ease-out infinite;
	-ms-animation: animations 2s ease-out infinite;
	animation: animations 2s ease-out infinite;
	}
.zhuyi{
	left:480px;
	top:2300px;
	opacity: 0;
	-webkit-transition:all .5s ease .3s;
	-moz-transition:all .5s ease .3s;
	-o-transition:all .5s ease .3s;
	transition:all .5s ease .3s;
	}
	 
.img4{
	left:40px;
	top:1300px;
	opacity: 0;
	-webkit-transition:all .5s ease .1s;
	-moz-transition:all .5s ease .1s;
	-o-transition:all .5s ease .1s;
	transition:all .5s ease .1s;
	}
.img5{
	left:380px;
	top:1300px;
	opacity: 0;
	-webkit-transition:all .5s ease .3s;
	-moz-transition:all .5s ease .3s;
	-o-transition:all .5s ease .3s;
	transition:all .5s ease .3s;
	}
.img6{
	left:720px;
	top:1300px;
	opacity: 0;
	-webkit-transition:all .5s ease .5s;
	-moz-transition:all .5s ease .5s;
	-o-transition:all .5s ease .5s;
	transition:all .5s ease .5s;
	}

.active .img2{ opacity: 1;}
.active .img3{opacity: 1; }
.active .btn{opacity: 1;  }
.active .zhuyi{opacity: 1;}
.active .img4{opacity: 1; }
.active .img5{opacity: 1;}
.active .img6{opacity: 1;}

.footer{
	font-size: 14px;
	position: absolute;
	left: 50%;
	width: 320px;
	height: 30px;
	margin-left: -160px;
	color: #444;

}
.mobile{
	background:url(../images/bj2.jpg);
	width:100%;
	height:1750px;
}
.mobile .section {width:100%; height:100%; font: 20px "Microsoft Yahei"; color: #fff; position: relative; line-height:45px;}
.mobile .screen-main{ position: relative; width:640px; height:90%; margin: 0 auto;}
.mobile .screen-main2 { position: relative; width:640px; height:90%; margin: 0 auto;}
.mobile .screen-main span { position: absolute;}
.mobile .down{position: absolute; left: 50%; bottom: 40px; z-index: 100; width:32px;height: 56px; margin-left: -16px;}
.mobile .down span{ 
     display: block; 
	 width: 32px; 
	 height: 56px;
	 z-index:99; 
	 background: url(../images/pagenext.png) center center no-repeat;
	 -webkit-animation: animations 2s ease-out infinite;
     -moz-animation: animations 2s ease-out infinite;
     -o-animation: animations 2s ease-out infinite;
     -ms-animation: animations 2s ease-out infinite;
     animation: animations 2s ease-out infinite;
	 }
 
.mobile .screen-main .img1{
	position:absolute;
	left: 15px; top: -30px; z-index: 4;
	opacity:0;
	-webkit-animation: zoomIn 3s .8s ease-out infinite;
    -moz-animation: zoomIn 3s .8s ease-out infinite;
    -o-animation: zoomIn 3s .8s ease-out infinite;
    -ms-animation: zoomIn 3s .8s ease-out infinite;
    animation: zoomIn 3s .8s ease-out infinite;}
.mobile .logo{ left:-1019px; top:-359px;z-index:6;}
.mobile .btn1{ display:inline-block; width:198px; height:60px; background-image:url(../images/btn1.png); margin-right:20px;}
.mobile .btn1:hover{background-image:url(../images/btn1_hover.png); }
.mobile .zhuyi{ font-size:18px; z-index: 9;}
.mobile .m-title1{color: #0c549d; font-size: 30px; font-weight: bold;}
.mobile .m-title2{color: #e4ff00; font-size: 35px; font-weight: bold;height: 50px; overflow: hidden;}
.mobile .m-title3{color: #FFF; font-size: 35px; font-weight: bold;}
.mobile .txt1{ font-size:24px; width:510px; height:auto; color:#4e4d4c;  }
.mobile .txt2{ font-size:24px; width:510px; height:auto;   }
.mobile .txt3{ font-size:24px; width:580px; height:auto;  line-height:35px; }
.mobile .footer{
	font-size: 20px;
	position: absolute;
	left: 50%;
	width: 460px;
	height: 30px;
	margin-left: -226px;
	color: #444;

}


/*
.mobile .section1 { background: url(../images/bg_01.jpg) center top no-repeat;}
.mobile .section2 { background: url(../images/bg_02.jpg) center top no-repeat;}
.mobile .section3 { background: url(../images/bg_03.jpg) center top no-repeat;}
.mobile .section4 { background: url(../images/bg_04.jpg) center top no-repeat;}
.mobile .section5 { background: url(../images/bg_05.jpg) center bottom no-repeat;}
.mobile .section6 { background: url(../images/bg_06.jpg) center no-repeat;}
.mobile .section7 { background: url(../images/bg_07.png) repeat;} */


/*css3*/

@-webkit-keyframes animations {
	0% {
	-webkit-transform:translate(0);
}
20% {
	-webkit-transform:translate(0,5px);
}
50% {
	-webkit-transform:translate(0,12px);
}
80% {
	-webkit-transform:translate(0,5px);
}
100% {
	-webkit-transform:translate(0,0);
}
}@-moz-keyframes animations {
	0% {
	-moz-transform:translate(0);
}
20% {
	-moz-transform:translate(0,5px);
}
50% {
	-moz-transform:translate(0,12px);
}
80% {
	-moz-transform:translate(0,5px);
}
100% {
	-moz-transform:translate(0,0);
}
}@-o-keyframes animations {
	0% {
	-o-transform:translate(0);
}
20% {
	-o-transform:translate(0,5px);
}
50% {
	-o-transform:translate(0,12px);
}
80% {
	-o-transform:translate(0,5px);
}
100% {
	-o-transform:translate(0,0);
}
}@-ms-keyframes animations {
	0% {
	-ms-transform:translate(0);
}
20% {
	-ms-transform:translate(0,5px);
}
50% {
	-ms-transform:translate(0,12px);
}
80% {
	-ms-transform:translate(0,5px);
}
100% {
	-ms-transform:translate(0,0);
}
}@keyframes animations {
	0% {
	transform:translate(0);
}
20% {
	transform:translate(0,5px);
}
50% {
	transform:translate(0,12px);
}
80% {
	transform:translate(0,5px);
}
100% {
	transform:translate(0,0);
}
}

@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
  
  100% {
    opacity: 0;
  }
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
  
  100% {
    opacity: 0;
  }
}

/*@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }
  
  20% {
    opacity: 1;
	-webkit-transform: scale3d(1.3, 1.3, 1.3);
    transform: scale3d(1.3, 1.3, 1.3);
  }

  50% {
    opacity: 0;
	-webkit-transform: scale3d(1.3, 1.3, 1.3);
    transform: scale3d(1.3, 1.3, 1.3);
  }
  
  80% {
    opacity: 1;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }
  
  100% {
    opacity: 1;
 
  }
}
@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }
  
  20% {
    opacity: 1;
	-webkit-transform: scale3d(1.3, 1.3, 1.3);
    transform: scale3d(1.3, 1.3, 1.3);
  }

  50% {
    opacity: 0;
	-webkit-transform: scale3d(1.3, 1.3, 1.3);
    transform: scale3d(1.3, 1.3, 1.3);
  }
  
  80% {
    opacity: 1;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }
  
  100% {
    opacity: 1;
 
  }
}*/

.grays{

-webkit-filter: grayscale(1);/* Webkit */ 
filter:gray;/* IE6-9 */ 
filter: grayscale(1);/* W3C */ 


}
 
