﻿/*首页标题*/


.indextit{ margin: 40px auto; display: block;  text-align: center; position: relative;  height: 100px }
.indextit strong{ display: block;  color: #21357c; font-size: 30px;display: block; width: 100%; position: absolute; z-index: 10; 
  text-align: center; padding-top: 70px  }
.indextit span{ display: block; color: #f1f1f1; width: 100%; font-size:90px; font-weight: bold;  position: absolute; z-index: 5; text-align: center;  }




/*关于我们*/

.aboutblock{overflow: hidden; display: block; background: #f6f6f6; padding-top: 100px; position: relative; }
.aboutblock .container{ position: relative; z-index: 2 }
.aboutleft{ float: left; width:555px }
.aboutright{ float: right; width:600px; height:550px; position: relative; margin-top: 50px }

.aboutleft .abtit{ position: relative;  height: 250px}
.aboutleft .abtit em{ font-size:60px; font-weight: bold; display: block; color: #434343;
 line-height: 66px; position: absolute; top: 30px ; background: #f6f6f6; overflow: hidden;}
.aboutleft .abtit em:nth-child(odd){ color: #003f90;  top: 120px }
.aboutleft .abtit i{ border:10px solid #e5e5e5; height: 200px; width: 400px; display: block; position: absolute; left: 100px  }
.abcon{ height: 316px; overflow: hidden; margin-bottom:10px; margin-top:-33px  }
.abcon p{ text-indent:24px; margin-bottom:20px; font-size: 16px; color: #666 }
.opacitytit{ font-size: 200px; color:#ecebeb; font-weight: bold ; display: block; line-height: 150px; position: absolute; bottom: 0; left: 0 ; z-index: 0   }
.aboutright img{  position: absolute;  }
.aboutright img:nth-child(1){ height:420px; width:572px;border:8px solid #fff;left:70px}
.aboutright img:nth-child(2){ height: 358px; width: 322px; left: 0; top:120px; }
.opacitytit:nth-child(2){ position: absolute; top: 0;  text-align: right; z-index: 0 ;  display: block; width: 100%; clear: both; }







/*统计数据*/
.count{overflow: hidden;  display: block; background: url(../images/bg.jpg) no-repeat center top;  width: 100%; margin-top: 50px; background-size: 100% auto }
.count ul{ float: left; }
.count ul li{ float: left; width: 200px; height:80px; text-align: left; padding: 50px 0; color: #264ba5 }

.count ul li img{ display: inline-block; text-align: center; }
.count ul li span{ font-size:16px; display: block; line-height: 50px }
.count ul li span em{ font-size: 45px; font-weight: bold; }
.count ul li  p{ color: #000 }





/*更多*/
*:before,
*:after {
  z-index: -1;
}

.more{  width: 200px;   margin: 0 auto; text-align: center; }

[class^="btn-"] {
  position: relative;
  display: block;
  width: 100%;
  height: 50px;
  max-width:200px;
  text-transform: uppercase;
  overflow: hidden;
  border: 1px solid currentColor;
  line-height: 50px;
  text-align: center;
}


@-webkit-keyframes criss-cross-left {
  0% {
    left: -20px;
  }
  50% {
    left: 50%;
    width: 20px;
    height: 20px;
  }
  100% {
    left: 50%;
    width: 375px;
    height: 375px;
  }
}

@keyframes criss-cross-left {
  0% {
    left: -20px;
  }
  50% {
    left: 50%;
    width: 20px;
    height: 20px;
  }
  100% {
    left: 50%;
    width: 375px;
    height: 375px;
  }
}
@-webkit-keyframes criss-cross-right {
  0% {
    right: -20px;
  }
  50% {
    right: 50%;
    width: 20px;
    height: 20px;
  }
  100% {
    right: 50%;
    width: 375px;
    height: 375px;
  }
}
@keyframes criss-cross-right {
  0% {
    right: -20px;
  }
  50% {
    right: 50%;
    width: 20px;
    height: 20px;
  }
  100% {
    right: 50%;
    width: 375px;
    height: 375px;
  }
}


.btn-11 {
  position: relative;
  color: #003f90;
}
.btn-11:hover {

  color: #fff;
}
.btn-11:before, .btn-11:after {
  position: absolute;
  top: 50%;
  content: '';
  width: 20px;
  height: 20px;
  background: #003f90;
  border-radius: 50%;
}
.btn-11:before {
  left: -20px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  /*     animation: criss-cross-left 0.8s reverse; */
}
.btn-11:after {
  right: -20px;
  -webkit-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
  /*     animation: criss-cross-right 0.8s reverse; */
}
.btn-11:hover:before, .btn-11:hover:after {
  /*       @include size($btn-width); */
}
.btn-11:hover:before {
  -webkit-animation: criss-cross-left 0.8s both;
          animation: criss-cross-left 0.8s both;
}
.btn-11:hover:after {
  -webkit-animation: criss-cross-right 0.8s both;
          animation: criss-cross-right 0.8s both;
}




/*产品展示*/

.pro_block{ background: url(../images/probg.jpg) no-repeat left top fixed; display: block; background-size: 50% 100%; display: block; height: 851px  }


.check_con2{     float: right; width: 881px; background: #fff; padding: 50px 0 0 19px; }



.pro_tit{ border-left: 6px solid #003f90;  color: #003f90; height: 30px; line-height:30px; font-size: 16px; 
  font-weight: bold;padding-left: 10px; margin-bottom: 30px; border-bottom: 1px solid #ccc;  }
.pro_tit em{ color: #ddd; font-size: 12px; margin-left: 10px }
.pro_tit a{ float: right;  font-size: 14px; font-weight: normal; padding; padding-right: 20px }
.proleft{ float: left; width: 300px }



.abtit{ position: relative;    height: 125px;
    margin-top: 20px;}
.abtit em{ font-size:30px; font-weight: bold; display: block; color: #fff;
 line-height: 40px; position: absolute; top: 15px ;  overflow: hidden; background: none}
.abtit em:nth-child(odd){ color: #fff;  top: 50px }
.abtit i{ border:5px solid #7790cf;  height: 100px; width: 150px; display: block; position: absolute; left: 100px  }



.check_con2 li{ float: left; margin-right: 21px; display: block; margin-bottom: 20px;  
  width:412px;border:1px solid #f8f8f8;padding: 8px;   }
.check_con2 li:nth-child(2n){ margin-right: 0   }
.check_con2 li .pimg{height: 292px; overflow: hidden;  }
.check_con2 li img{display: block;width: 100%;height: 100%;transition: all 0.5s; overflow: hidden; }
.check_con2 li:hover{   transition: 0.5s; background: #003f90 }
.check_con2 li:hover a{ color: #fff }
.check_con2 li:hover img {transform: scale(1.1); height: 292px;}
.check_con2 li strong{ height: 40px; line-height: 40px; text-align: center; display: block; }





/*选择我们*/
.check{ background:url(../images/checkbg.jpg) no-repeat center top fixed; display:block; overflow: hidden; padding-bottom: 100px }
.check .indextit{ background: #58be25; margin: 50px auto; width: 500px;  display: block; color: #fff; font-size: 30px; height: 50px; line-height: 50px;transform: skewX(-45deg);  }
.check .indextit p{transform: skewX(45deg);}
.check_title strong{ color: #fff;}
.check_title span{ color: #2f4698;}
.checktit{ text-align: center; margin: 80px 0 }
.checktit p{  font-size:40px; color: #f18847; font-weight: bold; }
.checktit span{  font-size:40px; color: #bdbdbd; font-size:22px; }
.checkcon{ background:url(../images/goodbg.png) no-repeat center top ;   }
.checkcon dl{ display: block; clear:both; overflow: hidden; height:300px;   }
.checkcon dl dt { float: left ; width: 649px; padding-left:50px; margin-right:100px; height: 220px;  overflow: hidden; margin-top: 20px}
.checkcon dl dd{ float: left; width:400px; text-align: right;   }
.checkcon dl dd img{ height: 240px; margin-top: 30px }
.checkcon dl dt div strong{ font-size:22px; font-weight: bold; color: #000; display: block; line-height: 40px   }
.checkcon dl dt div  i{ display: inline-block; color: #fff; background:#264ba5; border-radius: 50%;  font-size: 20px; font-weight: bold; 
 vertical-align: 20px; margin-right:20px; height: 70px; width:70px; text-align: center; line-height: 70px; float: left; }
.checkcon dl dt div{ margin-bottom: 50px; color: #979797; margin-top:20px; }
.checkcon dl dt div span{ font-size:18px;  color: #666; margin-bottom: 12px; display: block;   }
.checkcon dl dt div p{ line-height: 30px; font-size: 14px; max-height: 120px;  overflow: hidden; padding-left: 30px;
 background: url(../images/png.png) no-repeat left 5px; color: #000; display: block; clear: both; }
.checkcon dl:nth-child(2n) dt{ float: right; }

.checkcon dl:nth-child(2n) dd{ text-align: left;   }






.lb{ width: 100%; position: relative; }

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
    font-size: 0;
}

.clearfix {
    *zoom: 1;
}

.Cooldog_container {
    width: 1200px;
    height: 450px;
    margin:0  auto  ;
    position: relative;
    overflow: hidden;
}

.Cooldog_container .Cooldog_content {
    position: absolute;
    width: 750px;
    height: 450px;
    top: 0;
    left: 50%;
    margin-left: -249px;
}

.Cooldog_container .Cooldog_content li {
    position: absolute;
    top: 0;
    left: 0;
    width: 750px;
    height: 450px;
    transition: all 0.3s ease;
}

.Cooldog_container .Cooldog_content li img {
    width: 100%;
    height: 100%;
    vertical-align: middle;
    display: inline-block;
}

.lb .btn_left, .lb .btn_right {

    width: 50px;
    height: 100px;
    position: absolute;
    top: 200px;
    z-index: 50;
    color: #fff;
    line-height: 179px;
    background: #455199;
    font-size:50px;
    line-height:100px; 
    text-align: center;

}

.lb .btn_left {
    text-align: left;
    left: 0;

}

.lb .btn_right {
    text-align: right;
    right: 0;
}

.Cooldog_container i {
    font-size: 50px;
}


.Cooldog_container .btn_close i {
    font-size: 18px;
}

.Cooldog_container .buttons {
    width: 370px;
    height: 5px;
    line-height: 5px;
    position: absolute;
    bottom: 5px;
    left: 50%;
    margin-left: -185px;
    z-index: 80;
}

.Cooldog_container .buttons a {
    float: left;
    width: 40px;
    height: 5px;
    background-color: #fff;
    margin-right: 15px;
}

.Cooldog_container .buttons a.color {
    background-color: #455199;
}

.Cooldog_container .buttons a:last-child {
    margin-right: 0;
}

.p1 {
    transform: translate3d(-670px, 0, 0) scale(0.81);
    opacity: 0.4;
    z-index: 1;
}

.p2 {
    transform: translate3d(-450px, 0, 0) scale(0.81);
    transform-origin: 0 50%;
    opacity: 0.6;
    z-index: 2;
}

.p3 {
    transform: translate3d(-220px, 0, 0) scale(0.81);
    transform-origin: 0 50%;
    opacity: 0.8;
    z-index: 3;
}

.p4 {
    transform: translate3d(-120px, 0, 0) scale(1);
    opacity: 1;
    z-index: 4;
}

.p5 {
    transform: translate3d(130px, 0, 0) scale(0.81);
    transform-origin: 0 50%;
    opacity: 0.8;
    z-index: 3;
}

.p6 {
    transform: translate3d(425px, 0, 0) scale(0.81);
    transform-origin: 0 50%;
    opacity: 0.6;
    z-index: 2;
}

.p7 {
    transform: translate3d(625px, 0, 0) scale(0.81);
    transform-origin: 0 50%;
    opacity: 0.4;
    z-index: 1;
}






.newsblock{ background: url(../images/newsbg.jpg) no-repeat  center top; overflow: hidden; display:  background; background-size: 100% 100%; margin-top: 100px;  padding-bottom: 100px   }
.newsblock ul { margin-bottom: 50px; display: block; overflow: hidden; }
.newsblock li{ float: left; display: inline-block; width: 380px; margin-right: 30px; overflow: hidden;   }
.newsblock li a{ background: #fff; display: block; padding-bottom: 30px }
.newsblock li:nth-child(3n){ margin-right: 0 }
.newsblock li img{ width: 100%; height: 280px }
.newsblock li a:hover{ height: 100%; width: 100%; background: #003f90; color: #fff }
.newsblock li p{ width: 100%; line-height: 50px; font-size: 20px; text-align: center;  }
.newsblock li span{ display: block; text-align: center;  padding: 0 30px; line-height: 25px; height: 75px; overflow: hidden;  }

