body {
	font-size: 16px;
	font-family:'微软雅黑',Arial, Helvetica, sans-serif,'Lucida Grande', 'Lucida Sans Unicode',sans-serif;
}

.wrapper {
	/*background: url(../img/wrapper_bg2.jpg) center no-repeat;*/
	background-size: cover;
	width: 100%;
	position: relative;
	/*overflow: hidden;*/
}
.hader{position:fixed; width: 100%; z-index:99; background: rgba(0,0,0,.5); top:0;}
.hader .header{ width: 1200px; margin: 0 auto; }
.wrap .fader{ padding-top:0;}
.wrap .fader img.slide {
    height: 100%;
}
.hader .header .menu_btn{ display: inline-block;width: 25px; margin-top: 3px; display: none; 
width: 25px; text-align: right; position: absolute; right: 60px; top:0;
transition: margin-top .5s;
-webkit-transition:  margin-top .5s}
.hader .header .menu_btn span{display: block; height: 2px;background: #fff;  margin-top: 5px; width: 100%;}
.nav_right {
	margin-top: 14px;
}
.nav_right_ul{ float: left;}
.nav_right_ul li {
	display: inline-block;
}

.nav_right_ul li>a {
	display: block;
	margin-right: 41px;
	color: #fff;
	height: 34px;
	line-height: 34px;
	position: relative;
}
.news{
	width: 420px;
	position: absolute;
	bottom:150px;
	left:50%;
	margin-left: -180px;
	z-index: 3;}
.news .newstitle{
	color:#fff;
}
.news a.newcontent{ 
	margin:0 15px;
	color: #fff;
}
.mouseanim{
	display: block;
	width: 20px;
	height: 40px;
	border: 2px solid #fff;
	border-radius: 10px;
	position: absolute;
	bottom:60px;
	left:50%;
	margin-left: -15px;
	z-index: 3;
	background: rgba(255,255,255,.2);
}
.mouseanim:before{
	content: "";
	display: block;
	width: 2px;
	height: 15px;
	background: #fff;
	position: absolute;
	left: 50%;
	margin-left:-1px ;
	animation: updown 1.5s infinite;
	-webkit-animation: updown 1.5s infinite;
}
@-webkit-keyframes updown{
	from{-webkit-transform:translatey(0px)}
	to{-webkit-transform:translatey(23px);
	opacity: 0;}
}
.nav_right_ul li>a:hover {
	border-bottom: 0px solid #0e6eb8;
}


.nav_right_ul li>a.active{
	border-bottom: 3px solid #fff;
}
.main .appMainwrapper{
	background:url(../img/bg-top.png) bottom center no-repeat ;
}
.main .appMain {
	width: 1200px;
	margin: 0 auto;
	margin-top:86px;
}

.main h2.mainTitle {
	font-size: 50px;
	font-weight: normal;
	text-align: center;
	position: relative;
}
.main h2.mainTitle:before{
	content: "";
	display: block;
	height: 3px;
	width: 50px;
	position: absolute;
	background: #0e6eb8;
	left: 50%;
	margin-left: -25px;
	bottom: -15px;
}

.main h2.mainTitle>span {
	color: #0e6eb8;
}

.main .appMaincontent {
	margin-top: 60px;	
}

.main .appMaincontentLeft {
	width: 480px;
	height: 665px;
	position: relative;
}
.main .appMaincontentLeftimg{
	position: absolute;
	bottom: 0;
}
.main .appMaincontentLeftimg.imgmove{
		animation:mymove 1s 1;
	-webkit-animation:mymove 1s 1;
}
@keyframes mymove
{
from {
	rotate(0deg);
}
to {
	
 rotate(30deg);
}
}

@-webkit-keyframes mymove /*Safari and Chrome*/
{
from {	
	-webkit-transform:translateX(-600px)
	}
to {	
	-webkit-transform:translateX(0px)

	}
}
.main .appMaincontentRight {
	width: 596px;
	padding: 20px 20px 20px 20px;
}

.main .appMaincontentRight p {
	font-size: 18px;
	color: #000;
	line-height: 38px;
}

.main .appMaincontentRight p>span {
	color: #0e6eb8;
	font-size: 24px;
}

.main .appMaincontentRight .appMaincontentRighticon>ul li {
	display: inline-block;
	color: #000;
	font-size: 24px;
	width: 49.1%;
	padding-top: 100px;
	text-align: center;
	margin-top: 36px;
}

.main .appMaincontentRight .appMaincontentRighticon>ul li.RecommendIcon {
	background: url(../img/icon_01.png) top center no-repeat;
}

.main .appMaincontentRight .appMaincontentRighticon>ul li.definitIcon {
	background: url(../img/icon_02.png) top center no-repeat;
}

.main .appMaincontentRight .appMaincontentRighticon>ul li.trackIcon {
	background: url(../img/icon_03.png) top center no-repeat;
}

.main .appMaincontentRight .appMaincontentRighticon>ul li.CommissionIcon {
	background: url(../img/icon_04.png) top center no-repeat;
}
.main .appMaincontentRight .appMaincontentRighticon>ul li.CommissionIcon1 {
	background: url(../img/icon_05.png) top center no-repeat;
}
.main .appMaincontentRight .appMaincontentRighticon>ul li.CommissionIcon2 {
	background: url(../img/icon_06.png) top center no-repeat;
}
.main .appMaincontentRight .appMaincontentRighticon>ul li.CommissionIcon3 {
	background: url(../img/icon_07.png) top center no-repeat;
}
.main .appMaincontentRight .appMaincontentRighticon>ul li.CommissionIcon4 {
	background: url(../img/icon_08.png) top center no-repeat;
}
.main .appMaincontentRight .appMaincontentRighticon>ul li.CommissionIcon5 {
	background: url(../img/icon_09.png) top center no-repeat;
}

.main .appMaincontentRight .appMaincontentRighticon>ul li.CommissionIcon6 {
	background: url(../img/icon_10.png) top center no-repeat;
}

.main .appMaincontentRight .appMaincontentRighticon>ul li.CommissionIcon7{
	background: url(../img/icon_11.png) top center no-repeat;
}

.main .appMaincontentRight .appMaincontentRighticon>ul li.CommissionIcon8 {
	background: url(../img/icon_12.png) top center no-repeat;
}

.main .appMaincontentRight .AppMaincontentRightdown {overflow: hidden; padding-top: 70px; margin-left:30px;}
.main .appMaincontentRight .AppMaincontentRightdown ul{margin-left: 27px; }
.main .appMaincontentRight .AppMaincontentRightdown ul li{ float:left;}
.main .appMaincontentRight .AppMaincontentRightdown>ul li:nth-child(2){margin-left: 70px; }
.main .appMaincontentRight .AppMaincontentRightdown a.downIso,
.main .appMaincontentRight .AppMaincontentRightdown a.downAnd {
	color: #fff;
	display:block;
	width: 169px;
	height: 48px;
	line-height: 48px;
	color: 18px;
	padding-left: 60px;
}

.main .appMaincontentRight .AppMaincontentRightdown a.downIso {
	background:url(../img/down_ios.jpg) no-repeat;
}

.main .appMaincontentRight .AppMaincontentRightdown a.downAnd {
	background:url(../img/down_and.jpg) no-repeat;
}
.productMain{ 
	background: url(../img/product_bg.jpg) bottom no-repeat;
	background-attachment: fixed;
	}
.productMain .productMainul{
	width: 1024px;
	margin: 0 auto;
	padding: 55px 0; 
	overflow: hidden;
}
.productMain .productMainul li{
	color:#fff;
	
	margin-right: 38px;
	
	text-align: center;
}
.productMain .productMainul li>h3{
	font-size: 24px;
	font-weight: normal;
	}
.productMain .productMainul li>p{
	font-size: 18px;	
	margin-top: 30px;
	line-height: 30px;
	}
.aboutUswrapper{
	background:url(../img/bg22.jpg) top  no-repeat;
}
.aboutUs{
	width: 1200px;
	margin: 0 auto;
	padding:86px 0;
	}
.aboutUs .aboutUscontent{
	margin-top: 60px;	
}
.aboutUs .aboutUscontentLeft{
	width: 498px;
	color:#000;
}
.aboutUs .aboutUscontentLeft p{
	font-size: 18px;
	line-height: 38px;
	margin-bottom: 20px;
}
.aboutUs .aboutUscontentLeft p>span{
	color: #0e6eb8;
	font-size: 24px;
	}
.aboutUs .aboutUscontentLeft .aboutIcon{
	background:#0e6eb8 ;
	padding: 10px;
	color: #fff;
}
.aboutUs .aboutUscontentLeft a.aboutIcon:hover{
	  -webkit-animation: bounce 1s infinite;
  animation: bounce 1s infinite;

}
@-webkit-keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
    transform: translate3d(0,-4px,0);
  }
}

@keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
    transform: translate3d(0,-4px,0);
  }
}



.aboutUs .aboutUscontentRight{
	width: 580px;
}
.contactUs{
	width: 1200px;
	margin: 0 auto;
	padding-top:40px;
	}
.contactInformation{
	position: relative;
	margin-top: 60px;
	padding-top: 15px;	
	}
.contactInformation:before{
	content: "";
	display: block;
	width: 50%;
	height: 10px;
	background: #3784e1;
	position: absolute;
	top:0;
}
.contactInformation:after{
	content: "";
	display: block;
	width: 50%;
	height: 10px;
	background: #0e6eb8;
	position: absolute;
	top:0;
	right: 0;
}
.contactInformation ul li{
	float:left;
	width:49.999%;
	height: 100px;
	line-height: 100px;
	background: #f0f0f0;
	position: relative;
	text-align: center;
	
}
.contactInformation ul li:after{
	content:"";
	position: absolute;
	height: 100%;
	width: 1px;
	background: #d0d0d0;
	display: block;
	top:0;
	right: 0;
}

.contactInformation ul li>span{ 
	background: url(../img/sprites.png) no-repeat; display: inline-block; width:22px; height: 22px; margin-right: 10px;vertical-align: middle;
	}
.contactInformation ul li>span.tel{
	background-position: 0px 0px;
	}
.contactInformation ul li>span.fax{
	background-position: -67px 0px;
	}
.contactInformation ul li>span.email{
	background-position: -43px 0px;
	}
.contactInformation ul li>span.address{
	background-position: -21px 0px;
	}
.footwrapper{
	background:#333333;
	}
.foot{
	width: 1200px;
	margin: 0px auto 0px auto;  
	padding: 20px 0px 20px 0px;
	}
.foot .copyright{
	 font-size: 14px;  color:#fff; margin-left: 15px; 
	}
#topbtn{
	position: fixed;
	width: 80px;
	height: 80px;
	bottom:0px;
	right: 0px;
	background: rgba(255,255,255,.3);
	color:#000;
	line-height: 80px;
	text-align: center;
	display: none;
}
#topbtn .topIcon{
	margin-top: 15px;
}
#topbtn:hover{
	opacity: .5;
}

@media screen and (max-width:960px) {
	
	body{ position: relative;}
	.main h2.mainTitle{ font-size: 32px;}
	.hader .header{ width: 100%; }
	.hader .header .logo>img{ width: 100px;}
	.hader .header .menu_btn{ display:block; float: right; margin-right: 10px; margin-top: 20px;}
	
	.nav_right {
	margin-top: 0px;
	position: fixed;
	right: -999px;
	height: 100%;
	width: 50%;
	background: rgba(0,0,0,.8);
	top:0;
		}
	.news{display: none;}
	.nav_right_ul{ float: none; margin-top: 30px;}
	.nav_right_ul li {
		text-align: center;
	display: block;
	}
	.nav_right_ul li>a{
	display: block;
	margin-right: 0px;
	color: #fff;
	height: 50px;
	line-height: 50px;
	position: relative;
	text-align: center;
	}
  .mouseanim{
	
	border: 1px solid #fff;
	
}
    .main .appMain {
	width: 100%;
	margin: 0 auto;
	margin-top:30px;
}
.main .appMaincontentLeft{ width: 100%; height: auto;}
.main .appMaincontentRight{ width: auto;}
.main .appMaincontentLeftimg{ width: 100%; position: relative;}
.main .appMaincontentRight .appMaincontentRighticon>ul li {
	font-size: 16px;
}
.main .appMaincontentRight p{ font-size: 16px; line-height: 35px;}
.main .appMaincontentRight .AppMaincontentRightdown>img{
	width: 30%;
}
.main .appMaincontentRight .AppMaincontentRightdown ul{
	width:100%;
}
.main .appMaincontentRight .AppMaincontentRightdown ul li{
	margin-left:60px;
}
.productMain .productMainul{
	width: auto;
	margin: 0 auto;
	padding: 20px 0; 
	overflow: hidden;
}
.productMain .productMainul li{
	color:#fff;
	float: none;
	margin-right:auto;
	width: auto;
	text-align: center;
	margin: 30px 10px;
}
.productMain .productMainul li>h3{
	font-size: 18px;
	font-weight: normal;
	}
.productMain .productMainul li>p{
	font-size: 14px;	
	margin-top: 10px;
	line-height: 25px;
	}
.aboutUs{
	width: 100%;
	margin: 0 auto;
	padding:36px 0;
	}
	.aboutUs .aboutUscontent{
		margin-top: 20px;
	}
.aboutUs .aboutUscontentLeft{
	 width: auto;
	 padding: 20px;
}
.aboutUs .aboutUscontentRight{
	width: auto;
	padding: 20px;
}
.aboutUs .aboutUscontentRight>img{
	width:auto ;
	display: none;
}
.aboutUs .aboutUscontentLeft p{
	font-size: 16px;
}
.productMain{ 
	background-attachment: inherit;
	}
	.contactUs{
	width: 100%;
	margin: 0 auto;
	padding-top:30px;
	}
	.foot{
	width: 100%;
	margin: 0px auto 0px auto;  
	padding: 20px 0px 20px 0px;
	}
	.contactInformation ul li{
		width: 100%;
	}
}