@charset "utf-8";
/* CSS Document */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td {margin:0; padding:0;}
body {color:#333;overflow-x: hidden;}
td,th,caption {font-size:12px;}
h1, h2, h3, h4, h5, h6 {font-weight:normal;font-size:100%; }
address, caption, cite, code, dfn, em, strong, th, var{ font-style:normal;font-weight:normal;}
a{color:#000;text-decoration:none;}
a:hover {cursor:pointer;text-decoration:none;}
a{blr:expression(this.onFocus=this.blur())}
*:focus{outline:0;}
fieldset,img {border:none;}
ol,ul,li {list-style:none;}
input, textarea, select, button {outline:none;}
table{border-collapse:collapse;border-spacing:0;}
textarea {resize:none;}
i,em{font-style:normal}
/* css common */
.clear{ clear:left;}
.cf:after{clear:both;}
.cf:after,.cf:before{content:" ";display:table}
.fl{ float:left;}
.fr{ float:right;}
/*pccss reset 结束*/
.tips{ font-size:18px; font-family:@DFKai-SB; font-style:italic; text-align:center; color:Fuchsia; margin-top:100px;}
/*公用*/
.center{ width:1400px; margin:0 auto;}


.clearfix:after {content: ".";display: block;height:0;clear:both; visibility:hidden;}
.clearfix {*zoom:1;}
.cf:after{clear:both;}
.cf:after,.cf:before{content:" ";display:table}

/*2017.9.14*/
/*app*/
.app_bn{
    width: 100%;
    height: 714px;
    position: relative;
    z-index: 99;
}
.app_h1 ul{
    display: block;
    width:1400px;
    margin:0 auto;
}
.app_h1 ul li{
    float:left;
    width:25%;
    height:120px;
    text-align: center;
}
.app_h1 ul li a{
    display: block;
}
.app_h1 ul li a p{
    width: 35px;
    height: 35px;
    display:block;
    overflow: hidden;
    margin:0 auto;
    margin-top:20px;
    position: relative;
}
.app_h1 ul li a p img.s1{
    position: absolute;
    top:0;
    left:0;
    transition:all 0.5s;
}
.app_h1 ul li a p img.s2{
    position: absolute;
    top:35px;
    left:0;
    transition:all 0.5s;
}
.app_h1 ul li:hover a p img.s1{
    top:-35px;
}
.app_h1 ul li:hover a p img.s2{
    top:0;
}
.app_h1 ul li a h1{
    display: block;
    line-height: 60px;
    color: #333333;
    font-size: 18px;
    transition:all 0.5s;
}
.app_h1 ul li:hover a h1{
    color:#0ed6cb;
}
.app_h1{
    box-shadow: 0 3px 10px #eee;
    top:0;
    left:0;
    background-color:#fff;
    z-index:1000;
    width:100%;
}
.app_h2 ul{
    width:1400px;
    margin:0 auto;
    padding-bottom: 90px;
}
.app_h2 ul li{
    float:left;
    width:20%;
}
.app_h2 ul li  i{
    display: block;
    margin:0 auto;
    width:100%;
    height:190px;
    text-align: center;
}
.app_h2 ul li  i img{
    margin-top:62px;
    transition:all 0.5s;
}
.app_h2 ul li:hover  i img{
    margin-top:40px;
}
.app_h2 ul li  em{
    display: block;
    text-align: center;
    color: #505050;
    font-size: 24px;
    padding-top: 20px;
}
.app_h2 ul li span{
    display: block;
    text-align: center;
    color: #a3a3a3;
    font-size: 12px;
}
.app_h2 ul li.l1 i{
    background-color:#fa7c9f;
}
.app_h2 ul li.l2 i{
    background-color:#6c96f0;
}
.app_h2 ul li.l3 i{
    background-color:#f0cc4e;
}
.app_h2 ul li.l4 i{
    background-color:#51dc7d;
}
.app_h2 ul li.l5 i{
    background-color:#44e3e0;
}
.app_h2 h2{
    color:#333333;
    font-size:40px;
    text-align: center;
    margin:95px 0 46px 0;
}
.app_h3 h2{
    color:#333;
    font-size:40px;
    text-align: center;
    margin:0 0 95px 0;
}
.app_h3 h2 span,.app_h2 h2 span,.app_h4 h2 span{display: block;width:300px;color: #666;font-size: 14px;border-top: solid #666 1px;font-family: arial;margin:14px auto 0 auto;}
.app_h3 h2 span em,.app_h2 h2 span em,.app_h4 h2 span em{display:inline-block;position: relative;background: #f9f9f9;padding: 0 20px;top: -8px;}
.app_h2 h2 span{width: 213px;}
.app_h2 h2 span em,.app_h4 h2 span em{background: #FFF;}
.app_h4 h2 span{width: 200px;}
.app_h3{
    padding-top:82px;
    background:url(../images/app-bg.jpg) no-repeat;
    padding-bottom: 60px;
    background-size:100% 100%;
}
.app_h3c{
    width:1400px;
    margin:0 auto;

}
.app_h3cl{
    float: left;
    width:305px;
    text-align: center;
}
.app_h3cr{
    float:right;
    width:980px;
}
.app_h3cr li i{
    border-right: 1px dashed #0ed6cb;
    width: 39px;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
}
.app_h3crr{
    float: left;
    width:880px;
    padding-left: 70px;
}
.app_h3cr li{
    overflow: hidden;
    position: relative;
    margin-bottom: 30px;
}
.app_h3cr li h3{
    color: #2a2a2a;
    font-size: 30px;
    line-height: 30px;
}
.app_h3cr li em{
    color: #0ed6cb;
    font-size: 16px;
    font-family: "Arial";
    line-height:30px;
}
.app_h3cr li p{
    color: #2e2e2e;
    font-size: 16px;
    line-height: 25px;
}


.service_case .case_ula,.android_part3 .case_ula{width: 1400px;}
.ser_sale_ul{width: 1200px;margin: 0 auto;border-right: 1px solid #e6e6e6;margin-top: 42px;opacity: 0;visibility: hidden;
    -webkit-transform:translateY(20%);
    -moz-transform:translateY(20%);
    -ms-transform:translateY(20%);
    -o-transform: translateY(20%);
    transform: translateY(20%);
    -webkit-transition: all .8s ease 0.2s;
    -moz-transition: all .8s ease 0.2s;
    -ms-transition: all .8s ease 0.2s;
    -o-transition: all .8s ease 0.2s;
    transition: all .8s ease 0.2s;height: 314px;
}
.ser_sale_ul.animatebox.animate{opacity: 1;visibility: visible;
    -webkit-transform:translateY(0%);
    -moz-transform:translateY(0%);
    -ms-transform:translateY(0%);
    -o-transform: translateY(0%);
    transform: translateY(0%);
}
.ser_sale_ul li{width: 179px;height:198px;border: 1px solid #e6e6e6;background: #fff;float: left;border-right: none;cursor: pointer;text-align: center;font-size: 16px;color: #545454;padding-top: 117px;}
.ser_sale_ul li.this,.ser_sale_ul li:hover{width: 299px;height: 278px;background-color: #ef7a0c;border-color: #ef7a0c;margin-top: -33px;color: #fff;padding-top: 100px;font-size: 18px;}
.ser_sale_ul .sev_sale_p1{font-weight: bold;line-height: 26px;}
.ser_sale_li1 i{width: 40px;height: 40px;background: url(../img/sale1.png) no-repeat center center;}
.ser_sale_li2 i{width: 40px;height: 40px;background: url(../img/sale3.png) no-repeat center center;}
.ser_sale_li3 i{width: 40px;height: 40px;background: url(../img/sale5.png) no-repeat center center;}
.ser_sale_li4 i{width: 40px;height: 40px;background: url(../img/sale4.png) no-repeat center center;}
.ser_sale_li5 i{width: 40px;height: 40px;background: url(../img/sale6.png) no-repeat center center;}
.ser_sale_li6 i{width: 40px;height: 40px;background: url(../img/sale2.png) no-repeat center center;}
.ser_sale_li1.this i,.ser_sale_li1:hover i{width: 58px;height: 55px;background: url(../img/salew1.png) no-repeat center center;}
.ser_sale_li2.this i,.ser_sale_li2:hover i{width: 58px;height: 55px;background: url(../img/salew3.png) no-repeat center center;}
.ser_sale_li3.this i,.ser_sale_li3:hover i{width: 58px;height: 55px;background: url(../img/salew5.png) no-repeat center center;}
.ser_sale_li4.this i,.ser_sale_li4:hover i{width: 58px;height: 55px;background: url(../img/salew4.png) no-repeat center center;}
.ser_sale_li5.this i,.ser_sale_li5:hover i{width: 58px;height: 55px;background: url(../img/salew6.png) no-repeat center center;}
.ser_sale_li6.this i,.ser_sale_li6:hover i{width: 58px;height: 55px;background: url(../img/salew2.png) no-repeat center center;}
.ser_sale_ul li .sev_sale_p2,.ser_sale_ul li span{opacity: 0;visibility: hidden;}
.ser_sale_ul li span{display: inline-block;width: 55px;height:1px;background-color: #fff;}
.ser_sale_ul .sev_sale_p2{font-size: 14px;color: #fff;width: 200px;margin: 0 auto;margin-top: 34px;}
.ser_sale_ul li.this .sev_sale_p2,.ser_sale_ul li:hover .sev_sale_p2,.ser_sale_ul li:hover span,.ser_sale_ul li.this span{opacity: 1;visibility: visible;}
/*case*/
.case{background: url(../img/anlibg.jpg);padding-top: 52px;}
.case_ula{width: 1800px;display: none;}
.case_subnav{text-align: center;padding: 37px 0;}
.case_subnav span{display: inline-block;width: 90px;;height: 30px;line-height:30px;text-align: center;background-color: #fff;border-radius: 15px;color: #999999;cursor: pointer;margin: 0 12px;}
.case_subnav span.this,.case_subnav span:hover{color: #fff;background-color: #ef740c;}
.case_ula li{
    float:left;
    border-radius:3px;
    width:100%;
    margin:0;
    overflow:hidden;
    position:relative;
    width: 440px;
    margin:0 40px 30px 0;
    opacity: 0;
    -webkit-transform:translateY(30%);
    -moz-transform:translateY(30%);
    -ms-transform:translateY(30%);
    -o-transform: translateY(30%);
    transform: translateY(30%);
    -webkit-transition: all .5s ease-in-out 0s;
    -moz-transition: all .5s ease-in-out 0s;
    -ms-transition: all .5s ease-in-out 0s;
    -o-transition: all .5s ease-in-out 0s;
}
.case_ula li.animatebox.animate{opacity: 1;
    -webkit-transform:translateY(0%);
    -moz-transform:translateY(0%);
    -ms-transform:translateY(0%);
    -o-transform: translateY(0%);
    transform: translateY(0%);
}
.case_ula li:nth-child(3n){margin-right: 0;}
.caseimg{width:100%;height:245px;position:relative;display:block;overflow: hidden;}
.caseimg i{position:absolute;opacity:0;display:block;top:0;left:0;width:100%;height:100%;background:rgba(100,174,44,0.8);z-index:10;
    -webkit-transition: all .5s ease-in-out 0s;
    -moz-transition: all .5s ease-in-out 0s;
    -ms-transition: all .5s ease-in-out 0s;
    -o-transition: all .5s ease-in-out 0s;
    transition: all .5s ease-in-out 0s;
}
.case_ula li:hover .caseimg i{opacity:1;}
.case_ula .case_bigimg{width:100%;height:100%;overflow:hidden;display:block;}
.case_ula .ewm{position: absolute;left: 50%;margin-left: -75px;top: 50%;margin-top: -75px;width: 150px;height: 150px;-webkit-transform:translateY(100px); -moz-transform:translateY(100px);-ms-transform:translateY(100px);-o-transform: translateY(100px);transform: translateY(100px);opacity: 0;filter:alpha(opacity = 0);-webkit-transition: all .5s ease-in-out 0s;
    -moz-transition: all .5s ease-in-out 0s;
    -ms-transition: all .5s ease-in-out 0s;
    -o-transition: all .5s ease-in-out 0s;
    transition: all .5s ease-in-out 0s;z-index: 20;}
.case_ula li:hover .ewm{-webkit-transform:translateY(0px); -moz-transform:translateY(0px);-ms-transform:translateY(0px);-o-transform: translateY(0px);transform: translateY(0px);opacity: 1;filter:alpha(opacity = 100);}
.case_ula .case_bigimg img{width:100%;display:block;
    -webkit-transition: all .5s ease-in-out 0s;
    -moz-transition: all .5s ease-in-out 0s;
    -ms-transition: all .5s ease-in-out 0s;
    -o-transition: all .5s ease-in-out 0s;
    transition: all .5s ease-in-out 0s;
}
.case_ula li:hover .case_bigimg img{
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform:scale(1.2);}
.case_lineBox{position:absolute;width:16px;padding:10px;top:50%;left:50%;margin:-20px 0 0 -18px;z-index:20;}
.case_lineBox img{opacity:0;
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform:scale(1.2);
    -webkit-transition: all .5s ease-in-out 0s;
    -moz-transition: all .5s ease-in-out 0s;
    -ms-transition: all .5s ease-in-out 0s;
    -o-transition: all .5s ease-in-out 0s;
    transition: all .5s ease-in-out 0s;
}
.case_ula li:hover .case_lineBox img{opacity:1;margin-top:-1px;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform:scale(1);}
.case_lineBox span{position:absolute;opacity:0;background:#ffffff;}
.case_lineBox span.case_line1,
.case_lineBox span.case_line2,
.case_lineBox span.case_line3,
.case_lineBox span.case_line4{width:0;height:0;}
.case_lineBox span.case_line5,
.case_lineBox span.case_line6,
.case_lineBox span.case_line7,
.case_lineBox span.case_line8{width:10%;height:1px;}
.case_lineBox span.case_line1,.case_lineBox span.case_line5{top:0;left:0;}
.case_lineBox span.case_line2,.case_lineBox span.case_line6{bottom:0;left:0;}
.case_lineBox span.case_line3,.case_lineBox span.case_line7{top:0;right:0;}
.case_lineBox span.case_line4,.case_lineBox span.case_line8{bottom:0;right:0;}
.case_ula li:hover .case_lineBox span.case_line1{
    -webkit-animation:line01  0.4s 0.4s 1 ease-out;
    -ms-animation:line01  0.4s 0.4s 1 ease-out;
    -moz-animation:line01  0.4s 0.4s 1 ease-out;
    -o-animation:line01  0.4s 0.4s 1 ease-out;
    animation:line01  0.4s 0.4s 1 ease-out;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;}
.case_ula li:hover .case_lineBox span.case_line2{
    -webkit-animation:line02  0.4s 0.4s 1 ease-out;
    -ms-animation:line02  0.4s 0.4s 1 ease-out;
    -moz-animation:line02  0.4s 0.4s 1 ease-out;
    -o-animation:line02  0.4s 0.4s 1 ease-out;
    animation:line02  0.4s 0.4s 1 ease-out;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;}
.case_ula li:hover .case_lineBox span.case_line3{
    -webkit-animation:line03  0.4s 0.4s 1 ease-out;
    -ms-animation:line03  0.4s 0.4s 1 ease-out;
    -moz-animation:line03  0.4s 0.4s 1 ease-out;
    -o-animation:line03  0.4s 0.4s 1 ease-out;
    animation:line03  0.4s 0.4s 1 ease-out;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;}
.case_ula li:hover .case_lineBox span.case_line4{
    -webkit-animation:line04  0.4s 0.4s 1 ease-out;
    -ms-animation:line04  0.4s 0.4s 1 ease-out;
    -moz-animation:line04  0.4s 0.4s 1 ease-out;
    -o-animation:line04  0.4s 0.4s 1 ease-out;
    animation:line04  0.4s 0.4s 1 ease-out;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;}
.case_ula li:hover .case_lineBox span.case_line5{
    -webkit-animation:line05  0.4s 0.4s 1 ease-out;
    -ms-animation:line05  0.4s 0.4s 1 ease-out;
    -moz-animation:line05  0.4s 0.4s 1 ease-out;
    -o-animation:line05  0.4s 0.4s 1 ease-out;
    animation:line05  0.4s 0.4s 1 ease-out;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;}
.case_ula li:hover .case_lineBox span.case_line6{
    -webkit-animation:line06  0.4s 0.4s 1 ease-out;
    -ms-animation:line06  0.4s 0.4s 1 ease-out;
    -moz-animation:line06  0.4s 0.4s 1 ease-out;
    -o-animation:line06  0.4s 0.4s 1 ease-out;
    animation:line06  0.4s 0.4s 1 ease-out;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;}
.case_ula li:hover .case_lineBox span.case_line7{
    -webkit-animation:line07  0.4s 0.4s 1 ease-out;
    -ms-animation:line07  0.4s 0.4s 1 ease-out;
    -moz-animation:line07  0.4s 0.4s 1 ease-out;
    -o-animation:line07  0.4s 0.4s 1 ease-out;
    animation:line07  0.4s 0.4s 1 ease-out;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;}
.case_ula li:hover .case_lineBox span.case_line8{
    -webkit-animation:line08  0.4s 0.4s 1 ease-out;
    -ms-animation:line08  0.4s 0.4s 1 ease-out;
    -moz-animation:line08  0.4s 0.4s 1 ease-out;
    -o-animation:line08  0.4s 0.4s 1 ease-out;
    animation:line08  0.4s 0.4s 1 ease-out;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;}
.case_ula li:hover span.fl{color: #64ae2c;}


.casep{width:100%;line-height:54px;height:54px;position:relative; border-bottom:1px solid rgba(255,255,255,0.1);}
.casep a{width:70%;display:block;height:100%;line-height:54px; color:#545454;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap; }
.casep .case_like{opacity:1;position:absolute;color: #64ae2c;right:3px;top:20px;line-height:0;visibility: visible;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition:all 0.5s;
}
.case_ula li:hover .casep .case_like{opacity:0;right: 50px;visibility: hidden;}
.casep .caseadd{opacity:0;position:absolute;display:block;right:20px;top:20px;line-height:0;padding-left:10px;border-left:1px solid #dcdcdc;visibility: hidden;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition:all 0.5s;
}
.case_ul li:hover .casep .caseadd{opacity:1;right:0;visibility: visible;}
.casep i{display:block;width:0%;position:absolute;bottom:0;left:0;height:1px;background:#64ae2c;
    -webkit-transition: all .8s ease 0.2s;
    -moz-transition: all .8s ease 0.2s;
    -ms-transition: all .8s ease 0.2s;
    -o-transition: all .8s ease 0.2s;
    transition: all .8s ease 0.2s;
}
.case_ula li:hover .casep i{width:100%;}
.case_more{width: 100%;height: 58px;padding-top:42px;/*background-color: #f5f5f5;*/text-align: center;}
.case_overflow{width:92px;height: 20px;overflow: hidden;margin: 0 auto;}
.case_more a{color: #ef740c;font-size: 15px;height: 20px;display: block; }
.case_moreBox{-webkit-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    -ms-transition: all .2s ease-in-out 0s;
    -o-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s;}
.case_moreBox:hover{margin-top:-20px;}
.case_more a img{position: relative;top: -3px;margin-left: 5px;}
.case_ula li a{display: block;cursor: auto;}
/*@media screen and (max-width: 1720px) {*/
/*.case .width1720{width: 1200px;}*/
/*.case_ula{width: 1220px;height: 618px;overflow: hidden;}*/
/*.case_ula li{float:left;border-radius:3px;margin:0;overflow:hidden;position:relative;width: 380px;margin-right: 20px;margin-bottom: 30px;}*/
/*.caseimg{width:100%;height:224px;position:relative;display:block;}*/
/*}*/
.case_ula{
    width: 1200px;
    margin: 0 auto;
}

.app_h4 h2{
    color: #333333;
    font-size: 40px;
    text-align: center;
    margin: 75px 0 60px 0;
}





.app_h5{
    padding:50px 0;
    background-color:#f6f6f6;
}
.app_h5n h2{
    text-align: center;
    color:#333333;
    font-size:40px;
}
.app_h5n span{
    text-align: center;
    color:#909090;
    font-size:16px;
    display: block;
    line-height:30px;
    padding-top:4px;
}
.app_h5c{
    text-align: center;
    position: relative;
    width:1400px;
    margin:0 auto;
    padding: 52px 0 34px 0;
}
.app_h5c i{
    display: block;
    margin: 0 auto;
    width:108px;
    height:105px;
    overflow: hidden;
    transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
    -webkit-transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
    -moz-transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
}
.app_h5c li:hover i{
    background-size:100% 100%;
    transform: rotateY(360deg);
}
.app_h5c li{
	float: left;width: 140px;padding: 0 30px;background: url(../images/app-jt.png) no-repeat right 50px;
}
.app_h5c li:nth-child(7){background: none;padding-right: 0;}
.app_h5c li span{
    display: block;
    text-align: center;
    width: 22px;
    line-height: 22px;
    border-radius: 50%;
    margin: 0 auto;
    margin-top: 14px;
    color: #666;
    font-size: 16px;
}
.app_h5c li p{
    display:block;
    text-align: center;
    color:#666;
    font-size:16px;
    margin-top:2px;
}

.app_h5c i .pic1{
    display:block;
}
.app_h5c i .pic2{
    display: none;
}
.app_h5c li:hover .pic2{
    display:block;
}
.app_h5c li:hover .pic1{
    display: none;
}
.app_h5c li .ll{border-left: solid 1px #cacaca;border-right: solid 1px #cacaca;width: 94px;margin:21px auto;}
/*app end*/