﻿/*daotu*/
.daotu{margin-top:100px;*margin-top:20px;}
.daotu img{margin:0 auto;width:100%;height:auto;}
/*ourserve*/
.ourserve {background: #fff; padding: 60px 0px 80px 0px; overflow: hidden; }
.warp {margin: 0px auto; clear: both; }
.servetitle {text-align: center; margin-bottom: 30px; }
.ourserve .servetitle{margin-bottom: 0; padding-bottom: 50px; }
.servetitle p {font-size: 30px; color: #333; font-weight: bold; line-height: 30px; margin-bottom:16px; }
.ourserve .servetitle .line {width: 500px; margin: 20px auto; height: 1px; background: #999; text-align: center; }
.servetitle span {font-size: 30px; color: #666; line-height: 30px; }
.ourserve .servetitle span{font-size: 14px; line-height: 24px; }
.ourserve a { display:block; float:left; width:25%; overflow:hidden;  text-align:center; cursor:pointer; }
.ourserve a .ons_div { width:130px; height:130px; border-radius:65px; background:#00a1ff url(../images/j_ourserve.png) no-repeat 30px 30px; margin:0 auto;-webkit-transition:all .8s ease-in-out;-moz-transition:all .8s ease-in-out;transition:all .8s ease-in-out}
.ourserve a h1 { font-size:18px; font-weight:normal; color:#000; margin:20px 0 6px;}
.ourserve a p { font-size:14px; color:#999;}
.ourserve a:hover { text-decoration:none;}
.ourserve a .ons_div2 { background-color:#f90; background-position: 33px -110px}
.ourserve a .ons_div3 { background-color:#fb7e71; background-position: 30px -274px}
.ourserve a .ons_div4 { background-color:#73b400; background-position: 28px -410px}
.ourserve a:hover .ons_div{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}
/*ourgood*/
.ourgood {padding-top: 70px;  overflow: hidden;  background-color: #f4f4f4; }
.ourgood_t {font-size: 30px; text-align: center; margin-bottom: 15px; color: #000; }
.ourgood_n {font-size: 14px; color: #646464; text-align: center; }
.ourgood ul {overflow: hidden; margin: 70px 0px; width:100%;  }
.ourgood ul li {float: left; width: 25%; overflow: hidden; position: relative; padding-top: 160px; transition: all .5s ease;}
.ourgood ul li.on {padding-top: 140px; transition: all .5s ease; }
i {font-style: normal; }
.ourgood ul li .i {margin:0 auto;width:120px; }
.ourgood ul li i {position: absolute; width:120px;height: 120px; background: url(../images/j_ourgood.png) no-repeat; background-repeat: no-repeat; top: 0px;}
.ourgood ul li.on i {background-image: url(../images/j_ourgood_now.png); transition: all .5s ease; transform: rotateY(180deg); }
.ourgood ul li dd {font-size: 20px; text-align: center; height:40px;}
.ourgood ul li ol {font-size: 14px; color: #8b8b8b;}
.ourgood ul li.ys2 i {background-position: -121px 0px; }
.ourgood ul li.ys3 i {background-position: -242px 0px; }
.ourgood ul li.ys4 i {background-position: -363px 0px; }
/*ourpro*/
.ourpro { margin: 0 auto; overflow: hidden; background: #fff; padding: 40px 0px; }
.ourpro_con {width:100%; margin: 0 auto; text-align: center; }
.general_title {font-size: 34px; font-family: "微软雅黑"; text-align: center; margin: 0 auto; line-height: 40px; margin-top:70px;}
.ourpro li {list-style: none; float: left; width:12%; height: 100px; overflow: hidden; }
.ourpro li p {font-size: 14px; margin-top: 5px; }
.ourpro li.biaoqian {background: url(../images/j_cooperation_shape.png) no-repeat 0 16px; width:9%; }
@media screen and (max-width: 770px) {
.warp,.main{width:100%;}.ourserve a {width:50%;margin-top: 50px;}.ourserve .servetitle {padding-bottom:0px}.ourgood ul li {width:50%}
.ourgood ul li ol {display:none;}
.ourgood ul li.on {padding-top:160px;}
.ourpro li.biaoqian {display:none;}
.ourpro li {width:20%;height:auto;}
}