@charset "utf-8";
/* CSS Document */
html{ font-size: 62.5%;}
header,section{ background:#fff;}
.ie8tips{ position: fixed; width: 100%; font-size: 1em;display: none; background-color: #f2dede; z-index: 999; color: #000; padding: 5px 0; text-indent: 2em;}
.container{width: 100%; max-width: 1150px; margin: 0 auto; position:relative;}
.banner .owl-carousel .owl-carousel-control,.banner .toDownBtn,section .superiorityWrap .superiority .item .lgicon{ background:url(../images/icon.png) no-repeat;}
.banner{width: 100%; position:relative;}
.banner .owl-carousel .owl-carousel-control{  display:inline-block; top:40%; width:28px; height:28px; opacity:0; transition:opacity 0.5s; -webkit-transition:opacity 0.5s;-moz-transition:opacity 0.5s;-ms-transition:opacity 0.5s;}
.banner .owl-carousel .owl-carousel-control.left{ background-position:-95px -10px; left:10%;}
.banner .owl-carousel .owl-carousel-control.right{right:10%;background-position:-5px -10px;}
.banner .owl-carousel .owl-carousel-control.left:hover{background-position:-140px -10px; }
.banner .owl-carousel .owl-carousel-control.right:hover{background-position:-50px -10px;}
.banner .owl-carousel:hover .owl-carouselcontrol{ opacity:1;}
.banner .toDownBtn{ position:absolute; bottom:-23px; width:45px; height:46px; background-position: -200px -10px; left:50%; margin-left:-23px; cursor:pointer;}
.Xeaernav{ position:absolute; top:4%;width: 100%;}
.navbar{ width:100%; background:none; border-radius:0; border:none;}
.navbar .navbar-header a.logo{  display:inline-block;}
.navbar .navbar-text{ margin:0; font-size:20px;margin-top:5px;}
.navbar .navbar-text+.navbar-text{ margin-left:5px;}
.navbar .navbar-header .navbar-toggle .icon-barBox{ padding: 6px 7px;  border: 1px solid #ddd;border-radius: 4px;}
.Xeaernav ul.navbar-nav li a{border-bottom:2px solid transparent; transition:all 0.3s; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;}
.Xeaernav ul.navbar-nav li a.Xactive{border-bottom:2px solid #e74e3e; color:#e74e3e;}
.Xeaernav ul.navbar-nav li a:hover{border-bottom:2px solid #e74e3e;}
.Xeaernav .nav > li > a{ padding:5px;}
.Xeaernav .navbar-nav > li+li{ margin-left:20px;}
.Xeaernav .navbar-nav > li.login{margin-left:0;}
.Xeaernav .navbar-nav > li.line{ margin:0 10px;padding:5px; color:#fff;}
.Xeaernav .navbar-nav > li.Xjoin{padding:3px 0;}
.Xeaernav .navbar-nav > li button.btn{ background:none; color:#fff; padding:0 5px;}


section .module{ padding:80px 0; border-bottom:1px solid #e2dfdf;}
section .modulesm{ padding:60px 0; border-bottom:1px solid #e2dfdf;}
section .superiorityWrap{}
section .superiorityWrap .superiority{ text-align:center;}
section .superiorityWrap .superiority .item .desc h1,section .applayProdWrap .content h1,section .applayScrenWrap .desc h1,section .feedbackWrap h1,section .parnerWrap h1,section .cooperationWrap h1,section article.howuseWrap .Waycontent h1{font-weight:bold;font-size:18px; }

section .superiorityWrap .superiority .item .desc h1 .smicon{ display: inline-block;width: 10%; height: 10%;vertical-align: middle;margin-right:1%; }
section .superiorityWrap .superiority .item .lgicon{display:none;width:69px; height:69px; float:left; margin-right:5%;transition: transform 0.5s;-webkit-transition: -webkit-transform 0.5s;-moz-transition: -moz-transform 0.5s;-ms-transition: -ms-transform 0.5s;-o-transition: -o-transform 0.5s;}
section .superiorityWrap .superiority .item.technology .lgicon{ background-position:-5px -60px; }
section .superiorityWrap .superiority .item .desc{ overflow:hidden;}
section .superiorityWrap .superiority .item .desc h1{ margin-bottom:10px;}
section .superiorityWrap .superiority .item .desc .detail{ color:#929da8;}
section .superiorityWrap .superiority .item.service .lgicon{ background-position:-95px -60px;}
section .superiorityWrap .superiority .item.tecknow .lgicon{ background-position:-180px -60px;}
section .superiorityWrap .superiority .item.profit .lgicon{ background-position:-270px -60px;}
section .superiorityWrap .superiority .item>div{ width:90%; display:inline-block; text-align:left; perspective:200000px;-webkiit-perspective:200000px;-moz-perspective:200000px;-ms-perspective:200000px;-o-perspective:200000px;}
section .superiorityWrap .superiority .item+.item,section .superiorityWrap .superiority+.superiority{ margin-top:20px; }
section .superiorityWrap .superiority .item>div:hover .lgicon{ transform:rotateY(180deg);-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-ms-transform:rotateY(180deg);-o-transform:rotateY(180deg);}
section .applayProdWrap .applayshowIcon .photoWrap{ width:100%;  display: inline-block;margin-right:12%;}
section .applayProdWrap .applayshowIcon{ text-align:right; font-size:0;}
section .applayProdWrap .applayshowIcon img{ }
section .applayProdWrap .content{ padding-left:10%;}
section .applayProdWrap .content h1{ border-left:2px solid #e74e3e; padding: 5px;}
section .applayProdWrap .content p,section .applayScrenWrap .desc p{color:#929da8;margin-top:20px;}
section .applayProdWrap .content .understantMore{ background-color:#e74e3e; color:#fff; border:none;margin-top:40px;}
section .applayScrenWrap{ background-color:#202020;}
section .applayScrenWrap .desc{ text-align:right; /* margin:3% 0 0; */}
section .applayScrenWrap .desc .content{/*  display:inline-block; margin-right:20%;  */}
section .applayScrenWrap .desc .content .tablec{ display: table-cell; vertical-align: middle;}
section .applayScrenWrap .desc .content .tablec .tcChildren{display: inline-block;text-align: right; margin-right:10%; }
section .applayScrenWrap .desc h1{ color:#fff;border-right:2px solid #e74e3e; padding-right:20px; }
section .applayScrenWrap .desc p{ color:#8a96a2;}
section .applayScrenWrap .photo{ font-size:0;}
section .applayScrenWrap .photo img{ border:0;}
section .feedbackWrap h1,section .feedbackWrap p.icon,section .cooperationWrap h1,section article.howuseWrap .Waycontent h1,section .parnerWrap h1,section .parnerWrap p.icon,section .cooperationWrap p.icon,section article.howuseWrap .Waycontent p.icon{ text-align:center;}
section .feedbackWrap h1,section .parnerWrap h1,section .cooperationWrap h1,section article.howuseWrap .Waycontent h1{ color:#585858; margin-bottom:20px;}
section .feedbackWrap p.icon,section .parnerWrap p.icon,section .cooperationWrap p.icon,section article.howuseWrap .Waycontent p.icon{ font-size:0; margin-bottom:20px;}
section .feedbackWrap .content .item{background-color:#e74e3e;width:100%; float:left; position: relative;}
section .feedbackWrap .content .item+.item{ margin-top:0.5%; }
section .feedbackWrap .content .item .photoWrap,section .feedbackWrap .content .item .introWrap{ }
section .feedbackWrap .content .item .photoWrap{ font-size:0;}
section .feedbackWrap .content .item .introWrap{ color:#fff;}
section .feedbackWrap .content .item .introWrap .intro{ display:table-cell;text-align:center; vertical-align:middle; position:relative;}
section .feedbackWrap .content .item .introWrap .intro .children{ display:inline-block;  width:80%;}
section .feedbackWrap .content .item .introWrap .intro h2{ font-size:14px; font-weight:bold; margin-bottom:10px; text-align:left;}
section .feedbackWrap .content .item .introWrap .intro h3{ font-size:14px;margin-bottom:10px;text-align:left;}
section .feedbackWrap .content .item .introWrap .intro hr{ width:15%;margin:0 0 20px; color:#fff; height:2px; border-top:2px solid #FFF;text-align:left;}
section .feedbackWrap .content .item .introWrap .intro p{ font-size:12px;text-align:left;}
section .feedbackWrap .content .item .introWrap .intro .leftIcon{ z-index:2;width:0; height:0;border-top:20px solid transparent; border-right:15px solid #e74e3e;border-bottom:20px solid transparent; display:inline-block; position:absolute; top:40%; left:-15px; }
section .feedbackWrap .content.contentSecond .item .introWrap .intro .rightIcon{z-index:2;width:0; height:0;border-top:20px solid transparent; border-left:15px solid #e74e3e;border-bottom:20px solid transparent; display:inline-block; position:absolute; top:40%; right:-15px;}
section .feedbackWrap .content+.content{ margin-top:0.5%;}
section .parnerWrap{ text-align:center;}
section .parnerWrap .parnerBox{ margin:0 auto;}
section .parnerWrap .parnerBox .parnerItem{ display:inline-block; }
section .parnerWrap .parnerBox a{ cursor:pointer; font-size:0; display:inline-block;width:15%;}
section .cooperationWrap h1{}
section .cooperationWrap .contentBox .title{ margin-bottom:5%;}
section .cooperationWrap .contentBox .title .enterprise{ text-align:right; padding-right:5%;}
section .cooperationWrap .contentBox .title .developer{padding-left:5%;}
section .cooperationWrap .contentBox .title a{ color:#8a96a2; display:inline-block;border-bottom:2px solid transparent; font-weight:bold; transition:all 0.3s; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;}
section .cooperationWrap .contentBox .title a:hover,section .cooperationWrap .contentBox .title a.active{  border-bottom:2px solid #e74e3e;color:#e74e3e;}
section .cooperationWrap .contentBox .showWrap{ text-align:center; }
section .cooperationWrap .contentBox .showWrap>div{display:none;}
section .cooperationWrap .contentBox .showWrap div img{ max-width:680px;}
section .cooperationWrap .contentBox .showWrap .on{ display:block;}
section article.howuseWrap .Waycontent{ display: none; color: #000; padding: 40px 5%;}
section article.howuseWrap .Waycontent p+p{ margin-top: 20px;}
section .joinWrap{ background:url(../images/footer_bg.jpg) no-repeat center center; background-size:cover;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='../images/footer_bg.jpg',
    sizingMethod='scale'); padding:3% 0;}
section .joinWrap .desc{ font-size:16px; margin-bottom:20px;}
section .joinWrap .desc,section .joinWrap .joinbtnBox{ text-align:center; color:#fff;}
section .joinWrap .joinbtnBox .joinBtn{ background-color:#e74e3e; border:none;color:#fff;}
footer{ color:#8e8e8e; background-color:#000; text-align:center; padding:15px 0;}
footer .bottomNav .breadcrumb{ background:#000; padding:0; margin-bottom:10px;}
footer .bottomNav .breadcrumb li a,footer .copyright a.RecordNumber,footer .copyright .contactBox span.Email a{color:#8e8e8e; opacity:0.7;}
footer .bottomNav .breadcrumb li a:hover,footer .copyright a.RecordNumber:hover,footer .copyright .contactBox span.Email a:hover{opacity:1;}
footer .copyright .contactBox{ margin-top:5px;}
footer .copyright .contactBox span+span{ margin-left:10px;}
footer .copyright{opacity:0.7;}
.toTop{ display:none; position:fixed; bottom:1%; right:1%; width:4%; opacity:0.5;}
.toTop img{transition:all 0.3s; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;}
.toTop:hover{ opacity:1;}

@media screen and (min-width: 768px) {
  section .superiorityWrap .superiority .item .desc h1 .smicon{ display: none;}
  section .superiorityWrap .superiority .item .lgicon{ display: block;}
  section .superiorityWrap .superiority+.superiority{ margin-top:6%;}
  section .superiorityWrap .superiority .item+.item{ margin-top:0px; }
  section .feedbackWrap .content .item{width:49.75%;}
  section .feedbackWrap .content .item+.item{ margin-left:0.5%; margin-top:0; }
  section .applayProdWrap .applayshowIcon .photoWrap{ width:100%; max-width:60%;}

}
@media screen and (max-width: 767px) {	
.owl-buttons{ display: none;}
.navbar .navbar-header a.logo{ width: 35%;}
.Xeaernav nav .main{ background-color: rgba(0,0,0,0.9);}
.Xeaernav .navbar-nav > li+li{ margin-left: 0;margin-top: 10px;}
.Xeaernav .navbar-nav > li.line{ display: none;}
.navbar-default .navbar-collapse, .navbar-default .navbar-form{ border: none;}
.Xeaernav .navbar-nav > li{ text-align: center;}
.navbar{ z-index: 10;padding-left: 4%;}
.Xeaernav ul.navbar-nav li a:hover{border-bottom:2px solid transparent; color: #fff;}
.Xeaernav ul.navbar-nav li a.Xactive:hover{border-bottom:2px solid #e74e3e; color: #e74e3e;}
.Xeaernav nav .main{ width: 33%; float: right;}
section .applayScrenWrap .photo{ display: none;}
.Xeaernav .nav > li > a{padding: 10px 5px;font-size: 16px;}
section article.howuseWrap .Waycontent{ display: block;}
section article.howuseWrap>img{ display: none;}
section article.howuseWrap{border-bottom: 1px solid #e2dfdf;}
section article.parnerWrap{ padding:40px 0;}
section .applayScrenWrap .desc .content .tablec{ display: inline-block;}
section .applayScrenWrap .desc{ padding: 5% 0;}
.RecordNumber{ display: block;}
}

@media screen and (max-width: 380px) {
.feedbackWrap .content .item>div.col-xs-6{ width: 100%;}
.feedbackWrap .content .item>div.introWrap .intro{  padding: 10px 0px;}
section .feedbackWrap .content.contentSecond .item .introWrap .intro .rightIcon,section .feedbackWrap .content .item .introWrap .intro .leftIcon{ display: none;}
.feedbackWrap .content .item{ position: relative;}
.feedbackWrap .content .item .introWrap { position: absolute; bottom: 0; background-color: rgba(0,0,0,0.6); z-index: 10;}
section .feedbackWrap .content .item .introWrap .intro p{ font-size: 16px;}
section .feedbackWrap .content .item .introWrap .intro hr{ margin-bottom: 10px;}
}

@media screen and (max-width: 460px) {
section .applayProdWrap .container>div.col-xs-6{ width: 100%;  padding: 5%;}
section .applayProdWrap .content{ padding-left: 0;}
section .applayProdWrap .content .understantMore{margin-top:20px;}
section .applayProdWrap .container>div.applayshowIcon.col-xs-6{ padding:0 5% 5%;}
section .applayProdWrap .applayshowIcon .photoWrap { margin-right: 0;}
section .applayProdWrap .applayshowIcon .photoWrap{ text-align: center;}
section .applayProdWrap .applayshowIcon .photoWrap img{ width: 75%;}
}

@media screen and (max-width: 500px)and (min-width: 461px){
section .applayProdWrap .content .understantMore{margin-top:10px;}
}
@media screen and (max-width: 500px){
section .applayScrenWrap .desc p{ margin-top:10px; }
}
@media screen and (max-width: 600px) and (min-width: 501px){
section .applayProdWrap .content p{margin-top:10px;}
section .applayProdWrap .content .understantMore{margin-top:20px;}
}
@media screen and (max-width: 400px){
.toTop{ width:13%;}
}
@media screen and (max-width: 600px)and (min-width: 401px){
.toTop{ width:10%; }
}
@media screen and (max-width: 1085px)and (min-width: 901px) {
section .applayScrenWrap .desc p{ margin-top:15px; }
.toTop{ width:5%; }
}
@media screen and (max-width: 900px)and (min-width: 501px) {
section .applayScrenWrap .desc p{ margin-top:8px; }
}
@media screen and (max-width: 900px)and (min-width: 601px) {
.toTop{ width:6%; }
}
@media screen and (min-width: 460px) and (max-width:767px){
section .parnerWrap .parnerBox a{width: 25%;}
}
@media screen and (min-width: 300px) and (max-width:459px){
section .parnerWrap .parnerBox a{width: 35%;}
}
@media screen and (max-width:299px){
section .parnerWrap .parnerBox a{width: 60%;}
}