/*首页样式*/
.caseWrap {
  width: 100%;
  height: auto;
  padding-top: 20px;
}

.caseTop {
  width: 100%;
  text-align: center;
}

.case {
  margin-top: 40px;
}

.case li {
  float: left;
  width: 50%;
  cursor: pointer;
}

.case li:nth-of-type(2n) .case_div {
  margin-right: 0;
  margin-left: 30px;
}

.case li .case_div {
  border: 1px solid #e6e5e5;
  background: #ffffff;
  padding-bottom: 30px;
  margin-right: 30px;
  margin-bottom: 60px;
  position: relative;
}

.case li .case_tp {
  width:568px;
  height: 300px;
  text-align: center;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 100% 100%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.case li .case_tp::before {
  position: absolute;
  left: 0;
  top: 0;
  content: '';
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
}

.case li .case_tp .img {
  z-index: 1;
}

.case li .case_tp .img h3 {
  color: #fff;
  font-size: 34px;
  font-weight: bold;
}

.case li .case_tp .img img {
  width: 80px;
}

.case li h2 {
  font-size: 22px;
  color: #201818;
  text-align: center;
  margin-top: 10px;
  position: relative;
}

.case li h2::before {
  position: absolute;
  left: 50%;
  bottom: -12px;
  margin-left: -20px;
  content: '';
  width: 40px;
  height: 4px;
  display: block;
  background-color: #fe8d17;
}

.case li p {
  font-size: 16px;
  color: #333;
  line-height: 30px;
  width: 90%;
  margin: 18px auto 10px;
  text-align: center;
}

.case li .case_arrow {
  position: absolute;
  left: 50%;
  bottom: -22px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #0097f4;
  color: #fff;
  border-radius: 20px;
  padding: 0 10px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.case li .case_arrow .text {
  font-size: 20px;
  padding: 0 15px;
  display: none;
}

.case li .case_arrow .ico {
  display: inline-block;
  width: 20px;
  height: 40px;
  background: url("img/ico_arrcow_r.png") no-repeat right;
}

.case li:hover .case_arrow .text {
  display: inline-block;
}

.case li:hover .case_div {
  border: 3px solid #0097f4;
  padding-bottom: 26px;
}

.case li:hover .case_tp::before {
  background-color: rgba(0, 151, 244, 0.86);
}

.casepic1 {
  background-image: url("images/casepic1.jpg");
}

.casepic2 {
  background-image: url("images/casepic2.jpg");
}

.casepic3 {
  background-image: url("images/casepic3.jpg");
}

.casepic4 {
  background-image: url("images/casepic4.jpg");
}

/*技术*/
.serviceDivbox{width:100%;background-color: #EFEFEF;}
.serviceDiv {
    min-width: 1200px;   
    color: #888888;
}
.serviceDiv ul{flex-wrap:wrap;}
.serviceDiv h1 {
    font-size: 24px;text-align:center;display:block;padding-top:30px;
}
.contentInfo {
    font-weight: 100;text-align:center;display:block;margin-top:5px;
}
.serviceDiv ul {
    width: 1200px;
    overflow: hidden;
}
.serviceDiv li {
    display: inline-block;
    width: 25%;
    margin: 30px auto;
    border: 0px solid #333;
    text-align: center;
    line-height: 2.1em;
}
.serviceDiv li img {
    width: 128px;
}
/*技术优势*/
.commonWrap {
    width: 100%;
    height: auto;
    padding-top: 20px;
}
.commonTop {
    width: 100%;
    text-align: center;
}
.TopTilte {
    font-size:24px;
    color: #333;
    display: inline-block;
    padding: 0 5%;
}
.TopTilte span {
    position: relative;
}
.TopTilte em {
    font-size: 16px;
    display: block;
    color: #666;
    font-family: "Adobe Garamond Pro";
    position: relative;
    margin-top: 15px;
}
.TopTilte span::after {
    position: absolute;
    left: 50%;
    bottom: -10px;
    margin-left: -10px;
    content: '';
    width: 0;
    height: 0;
    border: 10px solid;
    border-color: transparent transparent #f8ae29;
}
.tsbox {    
    margin-top: 60px;
	flex-wrap:wrap;
}
.tsbox li{width:25%;text-align:center;margin-bottom:30px;}
.tsbox li span {
    display: inline-block;
    width: 100px;
    height: 100px;
    background: url(images/icon0.png) no-repeat;
    text-align: center;
}
.tsbox li h3 {
    font-size: 24px;
    padding: 5px 0 10px;
}
.tsbox .iconimg{display:inline-block;width:56px;height:56px;margin-top:24px;background-size:56px 56px;}
.tsbox li:nth-of-type(1) i{
background-image:url(images/ts01.png);
}
.tsbox li:nth-of-type(1) i{
background-image:url(images/ts01.png);
}
.tsbox li:nth-of-type(2) i{
background-image:url(images/ts02.png);
}
.tsbox li:nth-of-type(3) i{
background-image:url(images/ts03.png);
}
.tsbox li:nth-of-type(4) i{
background-image:url(images/ts04.png);
}
.tsbox li:nth-of-type(5) i{
background-image:url(images/ts05.png);
}
.tsbox li:nth-of-type(6) i{
background-image:url(images/ts06.png);
}
.tsbox li:nth-of-type(7) i{
background-image:url(images/ts07.png);
}
.tsbox li:nth-of-type(8) i{
background-image:url(images/ts08.png);
}