@charset "utf-8";
body,div,dl,dt,dd,ol,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,tr,td {margin:0;padding:0; font: 14px/1.5 arial, Microsoft Yahei, tahoma,\\5b8b\4f53,sans-serif; color:#333 } 
body{background:#f5f5f5;}
table {border-collapse:collapse;border-spacing:0;} 
fieldset,img {border:0} 
address,caption,cite,code,dfn,em,th,var {font-style:normal;font-weight:normal} 
ol,ul, li {list-style:none;margin:0;padding:0;} 
caption,th,td{text-align:center} 
h1,h2,h3,h4,h5,h6 {font-size:100%;} 
q:before,q:after {content:''}   
abbr,acronym { border:0}
a{ color:#333;text-decoration:none;}
em,i{ font-style:normal}
.clear:after{content: ".";display: block;height: 0;clear: both;visibility: hidden;}
body{position: relative; font-size: 14px; background: #f7f8fb}
.mt10{margin-top: 10px}
.clear:before,.clear:after {content: " ";display: table;}
.clear:after {clear: both;}
.mt70{margin-top: 70px!important}
.mb60{margin-bottom: 60px!important}
.header{position: fixed; top: 0;left:0;width: 100%; margin: 0 auto; height: 80px;z-index: 9}
.no-fixed{background: #fff;border-bottom: 1px solid #f2f2f2}
.header .logo{margin-top: 22px; float: left;}
.nav{float: right;}
.nav li{ float: left;width: 110px; text-align: center; line-height: 80px;position: relative; }
.nav li.login{ width: auto; }
.nav li a{display: block; color: #fff}
.nav li a:hover,.nav li.cur a{ color: #0077ff;}
.no-fixed li a{color: #333}
.header.no-fixed .logo.blue{display: block;}
.header .blue{display: none;}
.header.no-fixed .logo{display: none}
.am-dropdown-content{display: none;width: 130px;position: absolute;top:80px;left: -10px}
.am-dropdown-content li{line-height: 40px; float: none; text-align: center;margin-right: 0;width: 130px;position: relative;}
.am-dropdown-content li .am-nav-bg{display: block;background: #000;opacity: .5; height: 40px;position: absolute;top: 0;left: 0;width: 130px;    z-index: 8;}
.am-dropdown-content li:first-child .am-nav-bg{border-top-right-radius: 6px;border-top-left-radius: 6px}
.am-dropdown-content li:last-child .am-nav-bg{border-bottom-right-radius:6px;border-bottom-left-radius:6px  }
.am-dropdown-content li a{ color: #fff;position: relative;z-index: 9 }
.ran-cur{display: block}
.banner{ width: 100%; background: url(../images/banner.jpg) center ; height: 900px;  }

.main{width: 1200px; margin: 0 auto; }

/*服务优势*/
.advantage{ height: auto; margin:60px 0; }
.advantage li{ height: 400px;float: left; margin-right: 40px; background: #fff;border-radius: 6px; position: relative;text-align: center; width: 270px  }
.advantage li:before{ content: " ";display: bl;height: 2px; width: 60px; background: #0077ff; left: 39%;position: absolute; }
.advantage li.big-data:before{bottom:0;background: #ea7b90}
.advantage li.big-wx:before{top:0;background: #60bc7d}
.advantage li.big-baidu:before{bottom:0;background: #f08255}
.advantage li.big-uthink:before{top:0;background: #5295ff}
.advantage li img{ margin-top: 40px; margin-bottom: 30px; width: 100px;height: 100px}
.advantage li:hover img{animation:rotateIn .8s 1;-webkit-animation:rotateIn .8s 1;}
.advantage li h1{font-size: 22px; color: #333; line-height: 50px}
.advantage li p{ color: #767676;line-height: 30px;font-size: 14rpx }


.two_banner{height: 360px; width: 100% }
.product_bg{background: url(../images/product.jpg) no-repeat;}
.link_bg{background: url(../images/link_bg.jpg) no-repeat;}
.wx_bg{background: url(../images/wx-bg.jpg) no-repeat;}
.About_bg{background: url(../images/About.jpg) no-repeat;}
.contac_bg{background: url(../images/contac.jpg) no-repeat;}
.Join_us{background: url(../images/About.jpg) no-repeat;}
.two_banner h1{text-align: center;line-height: 360px;color: #fff;font-size: 40px;}

.two-nav{background:#fff; height: 60px;line-height: 60px;text-align: center;-webkit-box-shadow:0 0 1px rgba(226, 226, 226, .4);-moz-box-shadow:0 0 1px rgba(226, 226, 226, .4);box-shadow:0 3px 3px rgba(226, 226, 226, .4);width: 100%; }
.two-nav li{margin:0 40px;display: inline-block;*float: left;}
.two-nav li.current{color: #5381f1;border-bottom: 3px solid #5381f1;line-height: 57px}
.box{background: #fff;padding:40px 40px 60px;margin-top: 20px}
.box .title{text-align: center;margin-bottom: 20px}
.box .title h1{font-size: 30px;color: #333;text-align: center;}
.box .title p{text-align: center;font-size: 15px;color: #333;line-height: 35px}
.box .title h3{color: #999;font-size: 16px;}
.box img{margin:0 auto;display: block;margin-top: 60px;}
.box .btn{width: 160px;line-height: 60px;height: 60px;display: block;background: #5381f1;color: #fff;text-align: center;border-radius: 6px;margin:50px auto 0;}
.box-p,.box-pt{text-indent: 2em;font-size: 15px;line-height: 25px}
.box-pt{margin-bottom: 15px}
.content{position: relative;padding-top: 360px;margin-top: 80px}
.two_banner{position: absolute;top: 0;left: 0}
.wx_line{height: 450px;margin-top: 60px;position: relative;}

.wx_line .wx_txt{width: 50%;padding-top: 200px;}
.wx_line .wx_txt h2{font-size: 22px;padding-left: 10px;position: relative;padding-left: 15px; margin-bottom: 30px}
.wx_line .wx_txt h2 em{display: inline-block; width: 5px;height: 22px;background:#5381f1;position: absolute;left: 0;top: 6px}
.wx_l img{position: absolute;top: 0;right: 0}
.wx_r .wx_txt{margin-left: 50%}
.wx_r img{position: absolute;top: 0;left: 0}
.wx_line .wx_txt p{text-indent: 2em;line-height: 30px}

.enterprise{width: 1145px;margin:20px 0;}
.enterprise_box{width: 550px;display: inline-block;*float: left;margin-right: 20px;padding:20px;text-align: center; background: #5381f1;box-sizing: border-box;}
.enterprise_box h1{font-size: 24px;color: #fff;}
.enterprise_box h2{color: #fff;opacity: .3;}
.enterprise_box .hr{width: 20px;height: 2px;background:#fff;margin:0 auto;}
.enterprise_box p{ color: #fff; }
.ente h1{margin-bottom: 10px}
.enter_r{background: #a677e0}
.values{width: 1140px;margin-bottom: 20px}
.values ul{ float: left;width: 360px;margin-right: 20px;}
.values li{float: left;width: 360px;margin-bottom: 20px;border:1px solid #f2f2f2;padding:20px;box-sizing: border-box;}
.values h1{color: #5381f1;font-size: 18px;text-align: center;}
.values h2{color: #999;font-size: 14px;text-align: center;}
.values p{text-indent: 2em;line-height: 35px;margin-top: 10px}

.course{padding:0 40px; padding-bottom: 200px}
.course-line{margin-left: 170px;border-left: 1px solid #ebf1ff;padding-top: 90px;padding-bottom: 200px}

.years{position: relative;padding-bottom:50px; }
.event{line-height: 28px;height: 28px;position: relative;margin-bottom: 30px}
.event em{width: 70px;height: 28px;border-radius: 14px;background: #5381f1;float: left;margin-right: 20px;text-align:center;color: #fff;font-size: 16px;margin-left: 25px}
.event i{box-sizing: border-box;width: 12px;height: 12px;border:3px solid #5381f1;display: block;position: absolute;left: -6px;top: 7px;border-radius: 6px;background: #fff}
.years-txt{position: absolute;top: -10px;left: -90px;font-size: 32px;}

.slides_container{width: 1180px; text-align: center;}
.slides_container li{ width:202px; display: inline-block; height: 92px;box-sizing: border-box;border:1px solid #f0f2f6;border-radius: 6px;margin-right: 30px}
.slides_container li img{margin:0;border-radius: 6px;}

.box .img-tb{margin:30px auto;}

/*加入我们*/

.work_list{ width: 1230px;padding-bottom: 20px }
.work_list li{float:left;width: 353px; height: 500px; margin-right: 40px; background: #fbfbfb; padding:20px;margin-bottom: 40px;box-sizing: border-box;border:1px solid #f4f4f4;}
.work_list li img{width: 100px; height: 100px; border-radius: 50%;margin: 10px auto 10px; display:block;}
.work_list li h1{font-size: 20px; color: #333;margin-bottom: 10px; text-align: center;}
.work_list li p{color: #777; text-align: center; margin-bottom: 10px}
.work_list li p i{ padding:0 10px; }
.work_list li .hr{height: 1px; width: 100%; background: #f5f5f5;margin-bottom: 15px}
.delivery{line-height: 50px;text-align: center;}
.work_text{ height: 200px; overflow-y: auto;padding: 20px;background: #fff; width: 280px}
.work_text h2{font-size: 14px; font-weight: bold;}
.work_list li .work_text p{color: #333; margin-bottom: 0; line-height: 30px; text-align:left;}
 /*凹槽宽度*/
.work_text::-webkit-scrollbar{width:3px; height: 19px; }
/*拖动条*/
.work_text::-webkit-scrollbar-thumb{background-color:#5381f1;border-radius:0px;margin-top: 10px}
/*背景槽*/
.work_text::-webkit-scrollbar-track{background-color:#f0f2f6;border-radius:0px;}
.work_p{padding-bottom: 50px; color: #333; text-align: center;font-size: 16px}
.work{padding:30px;}


/*联系我们*/
.contact_img{ background-image:url(../i/contact-1.jpg);  }
.retail_list{width: 37%; float: left; margin-right: 30px}
.retail_list li{ margin-bottom: 20px; }
.retail_list li h1,.re-li h1{position: relative; color: #5381f1; font-size: 22px; margin-bottom: 10px;}
.retail_list li p{line-height: 35px; color: #333; font-size: 16px}
.retail_list li p i{padding:0 8px;}
.retail_list li p.retail_p{line-height: 30px}
.box .map_box{ width: 60%; height: 460px; float: left; }
.box .map_box img{margin: 0}
.cooperation{border-top: 2px solid #eee;margin-top:20px; padding-top: 30px}
.cooperation p{font-size: 16px;line-height: 40px}
.cooperation a{ display: block;width: 100px;height: 36px; line-height: 36px; text-align: center; color: #fff;margin-top: 5px;background: #0077ff;border-radius: 4px }


/*底部*/
.foot{ background:#1b1c25;margin-top: 60px }
.foot-t{ height:73px; border-bottom:1px solid #2a2a2a;text-align: center;}

.foot-c{height: 195px;padding-top: 20px}
.foot-c .b-logo{float: left;margin-top: 48px; width:45%;}
.foot-c .b-logo p{display: inline-block;font-size: 15px;color: #fff; line-height: 71px;vertical-align: 28px;
}

.foot-c .b-logo p span{margin-left: 10px}
.foot-c-r{width: 47%;float: right;}
.foot-c-r li{display: inline-block;  width:108px;*float: left;text-align: center;}
.foot-c-r li a{ color:#fff; line-height:50px;}
.foot-c-r li a:hover{ color:#777}
.foot-c .b-txt{width: 70%;float: left;text-align:left;margin-left: 20px}
.foot-c .code{width: 90px;float: right;margin-top: 10px}
.foot-c .code p{text-align: center;color: #bbbcc6;margin-top: 10px;font-size: 12px}
.foot p{ margin-top:18px; color:#999; text-align:center; }
.foot-c .b-txt p{font-size: 14px; color: #fff;text-align:left;}
.foot-c .b-txt p img{margin-right: 10px;vertical-align:-5px}
.black_bg{ background: #111114;  height: 60px}
.black_bg p{line-height: 50px}
.pal50{padding: 50px 0 50px}
.ml20{margin-left: 20px}
.mt20{margin-top: 20px}
.mt50{margin-top: 50px}
.mr20{margin-right: 20px}
.pl20{padding-left: 20px}
@media screen and (min-width: 1201px) { 
.main {width: 1200px} 
.advantage {width: 1240px}
} 
@media screen and (max-width: 1200px) { 
.main {width: 1000px} 
.foot-c .b-logo{width: 30%}
.foot-c-r{width: 60%}
.advantage {width: 1020px}
.advantage li{width: 235px;margin-right: 20px;}
.foot-c .b-logo p span{margin-left: 0;margin-right: 10px}

.box .img{width: 100%}
.box{padding:20px 20px 30px;}
.values{width: 1000px}
.values ul,.values li{width: 307px;}
.enterprise_box {width: 468px;} 
.slides_container{width:980px; }
.slides_container li{margin-right: 20px}
.img10{width: 960px}
.content{overflow: hidden;margin:0 auto;}
.work_list{width: 980px}
.work_list li{width: 306px;margin-right: 20px;margin-bottom: 20px}
.work_text{width: 226px}
}
/*@media screen and (max-width: 901px) { 
.main {width: 200px;} 
} */
@keyframes rotateIn {
  from {
    transform-origin: center;
    transform: rotate3d(0, 0, 1, -200deg);
  /*opacity: 0;*/
  }

  to {
    transform-origin: center;
    transform: none;
    /*opacity: 1;*/
  }
}



@keyframes rubberBand {
  from {
    transform: scale3d(1, 1, 1);
  }

  30% {
    transform: scale3d(1.10, 0.75, 1);
  }

  40% {
    transform: scale3d(0.85, 1.10, 1);
  }

  50% {
    transform: scale3d(1.05, 0.85, 1);
  }

  65% {
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    transform: scale3d(1.05, .95, 1);
  }

  to {
    transform: scale3d(1, 1, 1);
  }
}