----------------------------------------------------
*
*	  COMMON CSS FILE | by zhanglong | 
*
-----------------------------------------------------*/

.ie-view { position: fixed; background: #FFF url(../images/ie.jpg) no-repeat 50% 50%; width: 100%; height: 100%; z-index: 99999; top: 0; left: 0; }

/*----------------------------------------------------*/

:root {
  --COLOR-PRIMARY: 		#e21e32;
}

/*----------------------------------------------------*/
@font-face {
		font-family: "pf";
		src:	url("fonts/pf.eot"); 
		src:	url("fonts/pf.ttf") format("truetype"),
				url("fonts/pf.eot") format("embedded-opentype");
    font-style: normal; font-weight: normal;
}

html { font-size: 100px !important; }
body { color: #121212; font-size: .14rem !important; line-height: 1.6 !important; font-family: "Microsoft YaHei","pf", "STHeiti","WenQuanYi Micro Hei",SimSun,sans-serif !important; 
	background-color: #FFF; }

/*----------------------------------------------------*/
ul,p 	{ margin: 0; padding: 0; }
li 	{ list-style: none; }
i 		{ font-style: normal; } 
em 	{ font-style: normal; font-weight: bold; } 
cite 	{ font-style: normal; }

a { color: #333; cursor: pointer; }
a:hover, a:focus { text-decoration: none; color: #e21e32; }
.primary { color: #e21e32; }
.npd { padding: 0 !important; }

span.pipe { padding-left: .06rem; padding-right: .06rem; color: #9f9f9f; }
.imo, .imo a, .imo a img { display: block; }
	.imo img { width: 100%; }

.container { width: 1280px; max-width: 1280px; padding: 0;}



/*yours*/
body,  div,  p { margin: 0; padding: 0;}
ul { list-style: none;margin: 0; padding: 0;}
li{list-style-type: none;}
a{text-decoration: none}
.left{float: left;}
.right{float: right;}
.clear{clear: both}
*{font-family: 微软雅黑;}
*{box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing: border-box;}
input{outline: none;}
body{overflow-x:hidden;background: #f3f5f8}
.main{max-width: 1200px;margin:0 auto;width:90%}
img{border:none;}
i {
    display: inline-block;
    vertical-align: middle;
    font-style: normal;
}


/*头部*/
header{width: 100%;position: absolute;top:18px;left:0;z-index: 1000}
.logo{margin-left: 70px;position: relative;width: 214px;height: 55px;float: left;}
.logo2{position: absolute;top:15px;right:0;}
.logo3{position: absolute;top:15px;right:73px;}
.head_right a,.head_right span{color: #fff;cursor: pointer;}
.head_right{margin-top: 7px;height: 40px;line-height: 40px;float: right;margin-right: 60px;overflow: hidden;}
.head_right span{display: inline-block;margin-left: 15px;transition:all 1s;}
.head_right span::after{ margin-left: 15px;content:"|";}
.head_right span:last-child::after{content:"";}
.head_right a{font-size: 16px;font-weight: bold;color:#ffffff;display: inline-block;border-radius: 6px;text-align: center;height: 40px;line-height: 40px;padding: 0 30px 0 54px;}
.head_right a:nth-child(1){background: #5ed2e5 url('../images/denglu.png') no-repeat center left 30px;}
.head_right a:nth-child(2){background: #7679ff url('../images/zhuce.png') no-repeat center left 30px;margin-left: 22px}
.piccon3{text-align: center;}
.head_right span:hover{padding-left: 5px}
/*Banner*/
/*第一屏*/
.flex-active-slide .piccon3 .p1{  -webkit-animation: zoomIn 1.5s;
  animation: zoomIn 1.5s; animation-fill-mode: both;}
.flex-active-slide .piccon3 .p2{  -webkit-animation: fadeInLeft 1.5s;
  animation: fadeInLeft 1.5s; animation-fill-mode: both;}
.flex-active-slide .piccon3 .ban_img1{  -webkit-animation: fadeInUp 1.5s;
  animation: fadeInUp 1.5s;animation-delay:0.1s;
-webkit-animation-delay:0.1s; animation-fill-mode: both;}

.flex-active-slide .piccon3 .pic4{  -webkit-animation: animation:xiaoguo 2s;;
  animation:xiaoguo 2s;animation-delay:0.5s;
-webkit-animation-delay:0.5s; }
/*第二屏*/

.flex-active-slide .item2_1{  -webkit-animation:bounceInDown 1.5s;;
  animation:bounceInDown 1.5s;
  animation-fill-mode: both;
}
.flex-active-slide .item2_2{  -webkit-animation:flipInX 2s;;
  animation:flipInX 2s;
  animation-fill-mode: both;
}

.flex-active-slide .item2_3{
   -webkit-animation: lightSpeedIn 1s;;
    animation:lightSpeedIn 1s;animation-delay:0.7s;
  -webkit-animation-delay:0.7s;
  animation-fill-mode: both;

}
.flex-active-slide .item2_4{
   -webkit-animation: lightSpeedIn 1s;;
    animation:lightSpeedIn 1s;animation-delay:0.9s;
  -webkit-animation-delay:0.9s;
  animation-fill-mode: both;

}
.flex-active-slide .item2_5{
   -webkit-animation: lightSpeedIn 1s;;
    animation:lightSpeedIn 1s;animation-delay:1.1s;
  -webkit-animation-delay:1.1s;
  animation-fill-mode: both;

}

.sec6_active .sec6_left img{ -webkit-animation: fadeInUp 1s;;
    animation:fadeInUp 1s;animation-fill-mode: both;}
.sec6_active .sec6_tit{ -webkit-animation: bounceInDown 1s;animation:bounceInDown 1s;animation-fill-mode: both;}
.sec6_active .sec6_jian{ -webkit-animation: fadeInUp 1s;animation:fadeInUp 1s;animation-delay:0.2s;-webkit-animation-delay:0.2s;animation-fill-mode: both;}
.sec6_active .sec6_right li:nth-child(1){ -webkit-animation: fadeInRight 1s;animation:fadeInRight 1s;animation-delay:0.4s;-webkit-animation-delay:0.4s; animation-fill-mode: both;}
.sec6_active .sec6_right li:nth-child(2){ -webkit-animation: fadeInRight 1s;animation:fadeInRight 1s;animation-delay:0.6s;-webkit-animation-delay:0.6s; animation-fill-mode: both;}
.sec6_active .sec6_right li:nth-child(3){ -webkit-animation: fadeInRight 1s;animation:fadeInRight 1s;animation-delay:0.8s;-webkit-animation-delay:0.8s; animation-fill-mode: both;}

.sec6_item1 ul li:nth-child(1){background: url('../images/kq1.jpg') no-repeat top left;}
.sec6_item1 ul li:nth-child(2){background: url('../images/kq2.jpg') no-repeat top left;}
.sec6_item1 ul li:nth-child(3){background: url('../images/kq3.jpg') no-repeat top left;}

.sec6_item2 ul li:nth-child(1){background: url('../images/xc1.png') no-repeat top left;}
.sec6_item2 ul li:nth-child(2){background: url('../images/xc2.png') no-repeat top left;}
.sec6_item2 ul li:nth-child(3){background: url('../images/xc3.png') no-repeat top left;}

.sec6_item3 ul li:nth-child(1){background: url('../images/zp1.jpg') no-repeat top left;}
.sec6_item3 ul li:nth-child(2){background: url('../images/zp2.jpg') no-repeat top left;}
.sec6_item3 ul li:nth-child(3){background: url('../images/zp3.jpg') no-repeat top left;}

.sec6_item4 ul li:nth-child(1){background: url('../images/zz1.jpg') no-repeat top left;}
.sec6_item4 ul li:nth-child(2){background: url('../images/zz2.jpg') no-repeat top left;}
.sec6_item4 ul li:nth-child(3){background: url('../images/zz3.jpg') no-repeat top left;}

.sec6_item5 ul li:nth-child(1){background: url('../images/px1.jpg') no-repeat top left;}
.sec6_item5 ul li:nth-child(2){background: url('../images/px2.jpg') no-repeat top left;}


.sec6_item6 ul li:nth-child(1){background: url('../images/yuangong1.jpg') no-repeat top left;}
.sec6_item6 ul li:nth-child(2){background: url('../images/yuangong2.jpg') no-repeat top left;}
.sec6_item6 ul li:nth-child(3){background: url('../images/yuangong3.jpg') no-repeat top left;}

.sec6_item7 ul li:nth-child(1){background: url('../images/zizhu1.jpg') no-repeat top left;}
.sec6_item7 ul li:nth-child(2){background: url('../images/zizhu2.jpg') no-repeat top left;}
.sec6_item7 ul li:nth-child(3){background: url('../images/zizhu3.jpg') no-repeat top left;}


.piccon1{ position:absolute; left:12%; top:20%; z-index:10;overflow: hidden;}
.piccon2{ position:absolute; left:25%; top:20%; z-index:10;}
.piccon3{ position:absolute; left:0; top:0; width:100%;}
.piccon3 .p1{font-size: 55px;font-weight: bold;color: #5ed2e5;}
.piccon3 .p2{font-size: 65px;font-weight: bold;color: #fff;margin-bottom:30px}
.contextpic{width: 764px;margin:0 auto;margin-top:3%;}

.item2_1{color: #5ed2e5;font-size: 72px;font-weight: bold;}
.item2_2{color: #ffffff;font-size: 60px;}
.piccon1 ul{margin-top: 30px}
.piccon1 ul li{font-size: 24px;color: #ffffff;margin-bottom: 30px;position: relative;background: url('../images/dui.png') no-repeat top 8px left;padding-left: 38px}
.piccon1 ul li .animate_icon::before,.piccon1 ul li .animate_icon::after {
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  position:absolute;
  height:0;
  width:2px;
  background-color:#fff;
  display:inline-block;
  -moz-transform-origin:left top;
  -ms-transform-origin:left top;
  -o-transform-origin:left top;
  -webkit-transform-origin:left top;
  transform-origin:left top;
  border-radius:5px;
  content:' ';
  -webkit-transition:opacity ease 2;
  -moz-transition:opacity ease 2;
  transition:opacity ease 2;
}
.flex-active-slide .piccon1 ul li .animate_icon::before {
  content: "";
  top:24px;
  left:12px;

  -moz-transform:rotate(-135deg);
  -ms-transform:rotate(-135deg);
  -o-transform:rotate(-135deg);
  -webkit-transform:rotate(-135deg);
  transform:rotate(-135deg);
  -moz-animation:animate_icon2 1s ease 2s forwards;
  -o-animation:animate_icon2 1s ease 2s forwards;
  -webkit-animation:animate_icon2 1s ease 2s forwards;
  animation:animate_icon2 1s ease 2s forwards;
}

.flex-active-slide .piccon1 ul li .animate_icon::after {
  content: "";
  top:17px;
  left:5px;

  -moz-transform:rotate(-45deg);
  -ms-transform:rotate(-45deg);
  -o-transform:rotate(-45deg);
  -webkit-transform:rotate(-45deg);
  transform:rotate(-45deg);
  -moz-animation:animate_icon 0.8s ease 1.5s forwards;
  -o-animation:animate_icon 0.8s ease 1.5s forwards;
  -webkit-animation:animate_icon 1.2s ease 1.5s forwards;
  animation:animate_icon 0.8s ease 1.5s forwards;
}
@-webkit-keyframes animate_icon {
  from {
    height: 0;
  }

  to {
    height:10px;
  }
}

@keyframes animate_icon {
  from {
    height: 0;
  }

  to {
    height:10px;
  }
}

@-webkit-keyframes animate_icon2 {
  from {
    height: 0;
  }

  to {
    height:20px;
  }
}

@keyframes animate_icon2 {
  from {
    height: 0;
  }

  to {
    height:20px;
  }
}

@media (min-width:1000px) and (max-width:1200px)
{
  .piccon1{ left:15%; top:10%;}
  .piccon2{ left:15%; top:10%;}
  .piccon3 .contextpic{ margin-top:8%;}
  .piccon2 .pic1{ font-size:36px; text-align:center;}
}
@media (max-width:1000px)
{
  .piccon1,.piccon2,.contextpic{ display:none;}
}



.search{width: 8.9rem;margin:0 auto;padding: 0.35rem 0;}
.search .search_p{height: 0.6rem;line-height: 0.6rem;color: #666666;font-size: 0.28rem;margin-left: 0.24rem;float: left;}
.search .layui-form{float: right;height: 0.6rem;line-height: 0.6rem;background: #fff;border-radius: 0.1rem;width: 6.6rem;overflow: hidden;}
.ss_bd1{padding-left: 35px;width: 145px;border:0px;color: #333;font-size: 16px;}
.ss_bd2{width: 4.4rem;border:0px;color: #333;font-size: 16px;border-left:1px solid #999999;height: 20px;padding-left: 20px}
.ss_btn{background: url('../images/search.png') no-repeat center;width: 70px;height: 0.6rem;float: right;}

/*AI创新考勤场景*/
.sec1{width: 100%;background: #fff;padding-top: 50px}
.sec1_tit p:nth-child(1){font-size: 0.48rem;color: #000000;font-weight: bold;text-align: center;}
.sec1_tit p:nth-child(2){font-size: 0.24rem;color: #333333;text-align: center;}
.sec1_tit{padding-bottom: 0.85rem}
.sec1_right{float: right;width: 52%}
.sec1_left{width: 48%;float: left;}
.sec1_right img{width: 100%}
.sec1_left li{background: url('../images/dot.png') no-repeat top 0.15rem left;padding-left: 45px;margin-bottom: 30px}
.sec1_left ul{width: 7.2rem;float: right;}
.sec1_li_tit{font-size: 0.32rem;font-weight: bold;color: #333333}
.sec1_li_jian{font-size: 0.18rem;color: #666666;line-height: 50px;}

/*无感知考勤产品对比*/
.sec2{padding:0.75rem 0}
.yuan{width: 2.19rem;height: 2.19rem;background: url('../images/yuan1.png') no-repeat center top;margin:0 auto;}
.sec2 ul{padding: 0 6%}
.sec2 ul li{width: 25%;float: left;text-align: center;}
.sec2 ul li .yuan{color: #ffffff;font-weight: bold;font-size: 0.28rem;position: relative;}
.sec2_jian{color: #333333;font-size: 0.24rem;padding-top: 0.2rem}
.sec2 ul li .yuan i{padding-top: 0.5rem;padding-bottom: 0.15rem}
.sec2 ul li:hover .yuan{background: url('../images/yuan2.png') no-repeat center top;}

.sec2 ul li i,.sec2 ul li p {
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.sec2 ul li:hover i, .sec2 ul li:hover p{
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
}

/*无感知考勤系统*/
.sec3{background: url('../images/sec3.jpg') no-repeat center top;height: 446px;width: 100%;text-align: center;}
.sec3_tit1{font-size: 0.48rem;font-weight: bold;color: #ffffff;padding-top: 0.95rem;padding-bottom: 0.1rem}
.sec3_tit2{font-size: 0.6rem;color: #5ed2e5}
.sec3_tit3{font-size: 0.24rem;color: #ffffff;line-height: 0.5rem;padding-top: 0.2rem}

/*定义HR工作新方式*/
.sec4{background:#fff url('../images/sec4.jpg') no-repeat center bottom;width: 100%;height: 11.1rem;padding-top: 0.8rem;}
.sec4_con{width: 100%;background: url('../images/sec4_pc.png') no-repeat right bottom;height: 7.54rem}
.sec4_con ul{width: 9.23rem;padding-left: 3.5rem;padding-top: 1rem}
.sec4_con li{font-size: 0.24rem;color: #333333;margin-bottom: 0.35rem;height: 0.52rem;line-height: 0.52rem;}
.sec4_con li:nth-child(1){background: url('../images/sec4_1.png') no-repeat left top;padding-left: 0.65rem}
.sec4_con li:nth-child(2){background: url('../images/sec4_2.png') no-repeat left top;padding-left: 0.65rem}
.sec4_con li:nth-child(3){background: url('../images/sec4_3.png') no-repeat left top;padding-left: 0.65rem}
.sec4_con li:nth-child(4){background: url('../images/sec4_4.png') no-repeat left top;padding-left: 0.65rem}
.sec4_con li:nth-child(5){background: url('../images/sec4_5.png') no-repeat left top;padding-left: 0.65rem}
.sec4_con li:nth-child(6){background: url('../images/sec4_6.png') no-repeat left top;padding-left: 0.65rem}

.sec5{padding: 0.8rem 0 1.2rem 0;background: #fff;overflow: hidden;}
.sec5 li{width: 1.98rem;height: 2.52rem;background:#f5f5f5;text-align: center;color: #333333;font-size: 0.24rem;transition:all 1s;float: left;margin:0 0.15rem;position: relative;}
.sec5 ul{padding: 0 7%}
.sec5_icon{width: 111px;height: 111px;margin:0.4rem auto 0.3rem;z-index: 10;position: relative;border-radius: 50%}
.sec5 li p{z-index: 10;position: relative;}
.sec5 li:nth-child(1) .sec5_icon{background:#f5f5f5 url('../images/sec5_1.png') no-repeat center top;}
.sec5 li:nth-child(2) .sec5_icon{background:#f5f5f5 url('../images/sec5_2.png') no-repeat center top;}
.sec5 li:nth-child(3) .sec5_icon{background:#f5f5f5 url('../images/sec5_3.png') no-repeat center top;}
.sec5 li:nth-child(4) .sec5_icon{background:#f5f5f5 url('../images/sec5_4.png') no-repeat center top;}
.sec5 li:nth-child(5) .sec5_icon{background:#f5f5f5 url('../images/sec5_5.png') no-repeat center top;}
.sec5 li:nth-child(6) .sec5_icon{background:#f5f5f5 url('../images/sec5_6.png') no-repeat center top;}
.sec5 li:nth-child(7) .sec5_icon{background:#f5f5f5 url('../images/sec5_7.png') no-repeat center top;}

.sec5_bg {
    position: absolute;
    left: 0;
    bottom: 0%;
    width: 100%;
    height: 0;
    background: #5ed2e5;
    transition: all 0.4s linear;
    -webkit-transition: all 0.4s linear;
}
.sec5 li:hover .sec5_bg{height: 100%;}
.sec5 li:hover{color: #fff;box-shadow: 0 0 20px #CCC;
-moz-box-shadow: 0 0 20px #CCC;
-ms-box-shadow: 0 0 20px #CCC;
-o-box-shadow: 0 0 20px #CCC;transform:scale(1.02);}
.sec5 li:nth-child(1):hover .sec5_icon{background:url('../images/sec5_15.png') no-repeat center top ;
}
.sec5 li:nth-child(2):hover .sec5_icon{background:url('../images/sec5_25.png') no-repeat center top ;
}
.sec5 li:nth-child(3):hover .sec5_icon{background:url('../images/sec5_35.png') no-repeat center top ;
}
.sec5 li:nth-child(4):hover .sec5_icon{background:url('../images/sec5_45.png') no-repeat center top ;
}
.sec5 li:nth-child(5):hover .sec5_icon{background:url('../images/sec5_55.png') no-repeat center top ;
}
.sec5 li:nth-child(6):hover .sec5_icon{background:url('../images/sec5_65.png') no-repeat center top ;
}
.sec5 li:nth-child(7):hover .sec5_icon{background:url('../images/sec5_75.png') no-repeat center top ;color: #fff;}

.sec6{background: #fff;width: 100%}
.sec6_left{float: left;width: 50%;overflow: hidden;}
.sec6_left img{width: 100%}
.sec6_right{float: right;width: 50%}
.sec6_tit{color: #333333;font-size: 0.48rem;padding-top: 0.5rem;background: url('../images/sec6_tit.png') no-repeat left bottom;padding-bottom: 0.05rem}
.sec6_right .sec6_jian{font-size: 0.22rem;color: #333333;padding: 0.15rem 0}
.sec6_right li{font-size: 0.2rem;color: #666666;min-height:0.27rem;line-height: 0.27rem;padding-left: 0.45rem;margin-bottom: 0.3rem}
.sec6_right ul{padding-top: 0.25rem}


.sec7{background: url('../images/sec7.jpg') no-repeat center bottom;height: 599px;overflow: hidden;}
.sec7_tit p:nth-child(1){font-size: 0.48rem;color: #fff;font-weight: bold;text-align: center;}
.sec7_tit p:nth-child(2){font-size: 0.24rem;color: #fff;text-align: center;}
.sec7_tit{padding-bottom: 0.45rem;padding-top: 0.8rem}
.sec7 ul{padding: 0 7%}
.sec7 ul li{height:2.69rem;width: 18%;margin:0 1%;float: left;text-align: center;}
.sort{width:0.8rem;height:0.8rem;background:#0a161f;color: #fff;border-radius: 100%;line-height: 0.8rem;margin:0 auto;font-size: 0.48rem;}
.sec7 ul li p{font-size: 0.24rem;color: #0a161f;padding-top: 0.2rem;line-height: 0.35rem;}


.sec8{width: 100%;background: url('../images/sec8.jpg') no-repeat center bottom;height: 1000px}
.sec8_pc{text-align: center;padding-bottom: 0.45rem}
.sec8 ul{padding: 0 10%}
.sec8 ul li{width: 18%;float: left;margin:0 3.5%;float: left;text-align: center;color: #fff;padding-top: 1.2rem;line-height: 0.27rem;}
.sec8 ul li .sec8_t{font-size: 0.28rem;padding-bottom: 0.15rem}
.sec8_jian{font-size: 0.16rem;}
.sec8 ul li:nth-child(1){background: url('../images/sec8_1.png') no-repeat center top 10px;}
.sec8 ul li:nth-child(2){background: url('../images/sec8_2.png') no-repeat center top 10px;}
.sec8 ul li:nth-child(3){background: url('../images/sec8_3.png') no-repeat center top 15px;}
.sec8 ul li:nth-child(4){background: url('../images/sec8_4.png') no-repeat center top;}

.sec9{width: 100%;background: url('../images/sec9.jpg') no-repeat center bottom;height: 900px;}
.dec10{padding-top: 0.7rem;padding-bottom: 0.9rem;overflow: hidden;}
.dec11{width: 100%;background: url('../images/dec11.jpg') no-repeat center bottom;height: 3.93rem}
.sec11_tit p:nth-child(1){font-size: 0.4rem;color: #fff;font-weight: bold;text-align: center;margin-bottom: 0px}
.sec11_tit p:nth-child(2){font-size: 0.16rem;color: #fff;text-align: center;text-transform: uppercase;}
.sec11_tit{padding-top: 0.85rem}
.sec11_w{font-size: 0.24rem;text-align: center;color: #fff;background: url('../images/sec11_w.png') no-repeat center;margin-top: 0.25rem}
.dec10_btn{width: 2rem;height: 0.45rem;color: #fff;background:#ff8f00;display: block;margin:0 auto;line-height: 0.45rem;text-align: center;border-radius:0.2rem;margin-top: 0.5rem;font-size: 0.2rem;font-weight: bold;}
.dec10_btn:hover{text-decoration: none;color: #fff}
.dec10_video{width: 1200px;margin:0 auto;}
.dec10 .sec1_tit{padding-bottom: 0.55rem}
.sec9_ban{width: 1400px;margin:0 auto;}

.sec9_ban .slide{
    width: 100%;
    overflow: hidden;
    position: relative;
    padding-bottom:0.85rem;

}
.sec9_ban .slide .img{
    border-radius: 10px;
    overflow: hidden;
    position: absolute;
    transition: width 0.4s,height 0.4s,top 0.4s,left 0.4s,z-index 0.4s;
}
.slide .img1{
    width: 20%;
    height: 20%;
    top: 30%;
    left: -50%;
    z-index: 1;
    color: #fff;
    background: #343434;
}
.slide .img2{
    width: 32%;
    height: 360px;
    top: 20px;
    left: 0%;
    z-index: 2;
    color: #fff;
    background: #343434;
}
.slide .img3{
    width: 38%;
    height: 410px;
    top: 0;
    left: 50%;
    z-index: 3;
    transform:translateX(-50%);
    background: #fff;
    color: #333333;
}
.slide .img4{
    width: 32%;
    height: 360px;
    top: 20px;
    left: 68%;
    z-index: 2;
    color: #fff;
    background: #343434;
}
.slide .img5{
    width: 20%;
    height: 20%;
    top: 30%;
    left: 110%;
    z-index: 1;
    color: #fff;
    background: #343434;
}
.slide-bt{
    position: absolute;
    left: 50%;
    bottom: 0;
    z-index: 10;

}
.slide-bt span{
    width: 35px;
    height: 8px;
    background: #8c8b8a;
    float: left;
    margin: 5px;
    border-radius: 4px;
}
.slide .slide-bt .on{
    background: #5ed2e5;
}
button{
    width: 50px;
    margin: 20px;
}

.sec9_logo{width: 106px;margin:0 auto;padding-top: 0.3rem}

.sec9_job{text-align: center;font-size: 0.2rem;}

.sec9_com{font-size: 0.2rem;padding: 0.13rem 0;font-weight: bold;text-align: center;}
.sec9_jian{font-size: 0.13rem;line-height: 2;width: 90%;margin:0 auto;padding-top: 0.2rem;overflow: hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;}

.slide .img3 .sec9_com{font-size: 0.24rem;padding: 0.15rem 0;}
.slide .img3 .sec9_jian{font-size: 0.15rem;overflow: hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;}
.sec11_w span{display: block;}

.piccon3{ perspective:90;-webkit-perspective:90;}
.piccon3 .pic4{
      transform: rotateX(0deg);
       -webkit-transform: rotateX(0deg);}

       @-webkit-keyframes xiaoguo {
         from {
            transform: rotateX(-3deg);
           -webkit-transform: rotateX(-3deg);
          
         }

         to {
          transform: rotateX(0deg);
           -webkit-transform: rotateX(0deg);
         }
       }

       @keyframes xiaoguo {
         from {
            transform: rotateX(-3deg);
           -webkit-transform: rotateX(-3deg);
          
         }

         to {
          transform: rotateX(0deg);
           -webkit-transform: rotateX(0deg);
         }
       }
.sec8_pc{perspective:90;-webkit-perspective:90;}
.sec8_pc img{animation:xiaoguo2 2s;
      transform: rotateX(0deg);
       -webkit-transform: rotateX(0deg);}
 @-webkit-keyframes xiaoguo2 {
   from {
      transform: rotateX(-5deg);
     -webkit-transform: rotateX(-5deg);
    
   }

   to {
    transform: rotateX(0deg);
     -webkit-transform: rotateX(0deg);
   }
 }

 @keyframes xiaoguo2 {
   from {
      transform: rotateX(-5deg);
     -webkit-transform: rotateX(-5deg);
    
   }

   to {
    transform: rotateX(0deg);
     -webkit-transform: rotateX(0deg);
   }
 }

 .qcontainer{-webkit-perspective:400;-moz-perspective:400;}
 .film{width:100%;-webkit-transform-style:preserve-3d;-webkit-transition:1.5s;-moz-transform-style:preserve-3d;-moz-transition:1.5s;}
 .qcontainer:hover .film{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);}
 .face{height: 2.69rem;width: 100%;position:absolute;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;background: url('../images/sec7_1.png') no-repeat  center top;}
 .back{height: 2.69rem;width: 100%;-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);background: url('../images/sec7_2.png') no-repeat  center top;}
.sort{margin-top: 0.5rem}
.back .sort{background:#fff;color:#0a161f;}
.sec7 ul li .back p{color: #fff}

.sec1_left ul li{position: relative;}
/*一闪一闪效果*/
  
 .dott{
  
   border-radius: 100%;
  position: absolute;top:11px;left:-4px;width: 40px;height: 40px;border-radius: 100%;
  
 }


 
 .dott .ring{
  position: absolute;
  width: 40px;
  height: 40px;
  border: 5px solid #cef1f7;
  top: 50%;
  left: 50%;
  margin: -25px 0 0 -25px;
  opacity: 0;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  border-radius: 50px;
  -webkit-animation: trace 1s infinite linear;
  -moz-animation: trace 1s infinite linear;
  -ms-animation: trace 1s infinite linear;
  -o-animation: trace 1s infinite linear;
  animation: trace 1s infinite linear;
 }
 .dott .ring:last-of-type{
  -webkit-animation-delay: .5s;
  -moz-animation-delay: .5s;
  -ms-animation-delay: .5s;
  -o-animation-delay: .5s;
  animation-delay: .5s;
 }
 @-webkit-keyframes trace{
  0%{
    -webkit-transform: scale(0.1);
    opacity: 1;
  }
  100%{
    -webkit-transform: scale(1);
    opacity: 0;
  }
 }

 @-moz-keyframes trace{
  0%{
    -moz-transform: scale(0.1);
    opacity: 1;
  }
  100%{
    -moz-transform: scale(1);
    opacity: 0;
  }
 }
 @-ms-keyframes trace{
  0%{
    -ms-transform: scale(0.1);
    opacity: 1;
  }
  100%{
    -ms-transform: scale(1);
    opacity: 0;
  }
 }
 @-o-keyframes trace{
  0%{
    -o-transform: scale(0.1);
    opacity: 1;
  }
  100%{
    -o-transform: scale(1);
    opacity: 0;
  }
 }
 @keyframes trace{
  0%{
    transform: scale(0.1);
    opacity: 1;
  }
  100%{
    transform: scale(1);
    opacity: 0;
  }
 }

 .btn-5 {
   cursor:pointer;
   /*border: 0 solid;*/
   box-shadow: inset 0 0 20px rgba(255, 255, 255, 0);
   /*outline: 1px solid;*/
   outline-color: rgba(255, 255, 255, 0.5);
   outline-offset: 0px;
   text-shadow: none;
   -webkit-transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);
           transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);
 }

 .btn-5:hover {
   /*border: 1px solid;*/
   box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.5), 0 0 20px rgba(255, 255, 255, 0.2);
   /*outline-color: rgba(255, 255, 255, 0);*/
  /* outline-offset: 15px;*/
   text-shadow: 1px 1px 2px #427388;
 }

 .btn-4 {
     cursor:pointer;
   /*border: 1px solid;*/
   overflow: hidden;
   position: relative;
 }
 .btn-4 span {
   z-index: 20;
 }
 .btn-4:after {
   background: #fff;
   content: "";
   height: 155px;
   left: -75px;
   opacity: .2;
   position: absolute;
   top: -50px;
   -webkit-transform: rotate(35deg);
       -ms-transform: rotate(35deg);
           transform: rotate(35deg);
   -webkit-transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
           transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
   width: 50px;
   z-index: 100;
 }

 .btn-4:hover:after {
   left: 120%;
   -webkit-transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
           transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
 }

.head_right_span{width: 300px}


@media (max-width:1900px){
  .sec5 li{width: 12.28%;margin: 0 1%;}
  .sec4_con{background: url(../images/sec4_pc.png) no-repeat right center;background-size: 50%}
  .contextpic{transform: scale(0.9);}
  .banner .pic4{width: 80%;margin-top: -3%}
  .sec4_con ul{padding-left: 15%;}
  .sec9_ban{transform: scale(0.9)}
  .sec1_tit {
      padding-bottom: 0.55rem;
  }
  .sec4{height: 10rem}
}
@media (max-width:1600px){
 
  .banner .pic4{width: 75%;margin-top: -3%}
   .sec8_pc img{width: 75%}

}
@media (max-width:1500px){
 .sec9_logo img{width: 96px}
 .contextpic{transform: scale(0.8);}
 .banner .pic4{width: 75%;margin-top: -4%}
 .sec1_left ul{width: 89%}
 .sec1_li_jian{font-size: 0.16rem;}
 .sec4_con ul{padding-left: 10%;}
 .sec5 li{height: 2.2rem}
 .sec5_icon {
    transform: scale(0.8);
     margin: 0.2rem auto 0.1rem;
 
 }
 .sec9_ban{width: 1200px;margin:0 auto;}
 .sec9 {
     width: 100%;
     background: url(../images/sec9.jpg) no-repeat center bottom;
     background-size: cover;
     height: 800px;
 }

}
@media (max-width:1400px){
  .sec1_left{width: 50%}
  .sec1_right{width: 50%}
  .sec1_left li{margin-bottom: 0.2rem}
  .sec5 ul{padding: 0 5%}
  .sec6_tit{padding-top: 0}

}
@media (max-width:1380px){ 
  
  .sec8 ul li .sec8_t{font-size: 0.25rem;}
  .sec8_jian{font-size: 0.14rem;}
  .sec1_left ul{width:92%}
 .piccon3 .p2{font-size: 60px;margin-bottom: 20px}
  .piccon3 .p1{margin-bottom: 10px}
  .contextpic{margin-top: 6%}
  .sec4_con ul{padding-top: 0.2rem}
   .sec4{height:9rem}
   .sec4_con{height: 6.5rem}
   .sec8_pc img{width: 75%}
   .sec6_right .sec6_jian{font-size: 0.2rem;}

}

.banner{width:100%;clear:both}
.flexslider{position:relative;height:auto;overflow:hidden;}
.slides{position:relative;z-index:1;}
.slides li{}
.flex-control-nav{position:absolute;bottom:10px;z-index:2;width:100%;text-align:center;}
.flex-control-nav li{display:inline-block;height:24px;margin:0 10px;*display:inline;zoom:1;}
.flex-control-nav a{display:inline-block;width:24px;height:24px;line-height:40px;overflow:hidden;background:url(../images/border2.png) center no-repeat;cursor:pointer; text-indent:-999999px;}
.flex-control-nav .flex-active{background-position:0 -31px;width:24px;height:24px;background:url(../images/border1.png) center no-repeat;}

