@charset "utf-8";
/* CSS Document */

body{ font:14px Microsoft YaHei;}
*{ margin:0; padding:0; list-style:none;}
a{ text-decoration:none;}


.cotent-banner{ width:100%; height:450px; background: url(../../images/faceprint/banner.jpg);}
.banner-container{ width:1180px; height:100%; margin:0 auto; color:#fff; padding-top:60px;}

.banner-title{ font-size:48px; font-weight:normal;}
.banner-info{ width:630px; margin-top:30px; line-height:27px; font-size:16px;}
.banner-hot{  margin:20px 0; line-height:24px; background:url(../../images/faceprint/broadcast.png) 0 center no-repeat; padding-left:40px;}
.banner-hot a{color:#faad15;}
.banner-hot span{ color:#d0021b; display:block;}
.button{ display:block; width:130px; line-height:38px; background:#006fef; text-align: center; margin-top:40px; color:#fff; font-size:16px;}

.summary{ margin:80px auto;}
.summary .container{width:1180px; margin:0 auto;} 
.summary p{ margin:50px auto; line-height:25px;}
.summary img{ width:100%;}

.nav-container-bg{ width:100%; height:60px;    background: #fff; -webkit-box-shadow: 0 2px 10px 0 rgba(0,0,0,.1); -moz-box-shadow: 0 2px 10px 0 rgba(0,0,0,.1); box-shadow: 0 2px 10px 0 rgba(0,0,0,.1);}

.nav-container{ width:1000px; margin:0 auto;}
.nav-container li{ float:left; margin:0 38px;font-size:18px;line-height: 60px; text-align:center;}
.nav-container li a{ color:#333}
.nav-container li a:hover{ color:#006fef;}
.sever-list{ margin:20px 0;}
.case-img{display:inline-block;}


.module-section{ width:1180px; margin:0 auto;}
.module-container{ padding-top:100px;}
h2{ font-size:32px; text-align:center; color:#333; font-family:"PingFangSC-Regular"; font-weight:normal;}
.add-title{ text-align:center; color:#666;}

.sever-dp{display:inline-block; float:left;}
.solution-items{ padding-top:10px;}
.solution-item{width:300px;margin-right: 14px;padding: 10px 0 10px 14px; border: 1px solid #e6e6e6; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float:left;}
.solution-items img{ width:90px;}
.solution-item-info{ float:right; width:60%;}
.con-ggh .solution-item-info .item-name{ padding:0}

.tc{ text-align:center}  .fl{ float:left; width:94%;} .fr{ float:right}
.clear{clear:both;}   .clearfix:after{content:"."; display:block; visibility:hidden; height:0; clear:both}
.main-page{margin:50px auto;width:1180px; border:1px solid #eaeaea}
.main-page .left{ width:15%; border-right: 1px #eaeaea solid;}
.main-page .left, .main-page .right{float:left;}
.main-page .nav-back{height:300px;}
.main-page .nav{position:relative;margin-top:-300px;width:100%;text-align:center;font-size:18px;color:#333;}
.main-page .nav div{height:70px;line-height:80px; margin-bottom: 8px; border-radius: 2px; cursor: pointer; font-size:16px; font-weight:bold;}
.main-page .nav div.on{background:#006fef; color:#fff;}
.main-page .right{width:1000px;height:470px;}
.main-page .content{position:relative; width:1000px; height:470px; overflow:hidden;}
.main-page .content .con-ggh{ width:1000px; height:450px;}

.con-ggh{ display:block} 
.con-ggh li{ padding-top:20px;  float:left}

.con-ggh .item-name{ padding:0; width:100%; font-size:20px; color: #333; font-weight:700; line-height:50px; text-overflow: ellipsis; white-space: nowrap;}
.b-intro{ margin-top:20px}
.b-intro span{ font-size:16px; margin-bottom:12px; color:#333}
.b-intro p{ width:95%; line-height:24px; overflow:hidden; color:#666; font-size:13px}
.ck-m{ width:123px; height:36px; line-height:36px; border:1px #fff solid; margin-top:25px; background:#006fef; color:#fff;}
.zcinfo{ margin:0% 0 1% 5%;}
.togglebox{ display:none;}
.b-intro a{ color:#117cec; display:inline-block; margin-right:20px;}
.value{ width:65%; float:left;}
.value-img{ width:30%; float: right}
.value-img img{ width:100%}
.ptpic-dl{ padding:0 50px;}

.b-intro{ width:100%;}

.flow-container{ width:1180px; margin:0 auto; padding-top:50px; height:450px;}
.flow-list{ margin-top:50px;}
.flow-title{ background:#006fef; height:120px;text-align:center;}
.flow-title img{ margin:0 auto; display:block;}
.flow-title span{ font-size:18px; color:#fff; line-height:40px;}
.flow-list li{ width:220px; height:300px; border:1px solid #eaeaea; float:left;margin-right:17px;}
.flow-list li:last-child{ margin-right:0;}
.flow-list li p{ text-align:center; line-height:36px; margin-top:20px; color:#6E6E6E}


.demo{
    padding: 1em 0;
}
.box{
    position: relative;
    perspective: 1000px;
	height:340px;
	border:1px solid #D6D6D6;
}
.box .box-img{
    transform: rotateY(0);
    transition: all 0.50s ease-in-out 0s;}
.box .box-img p{ padding:0 10px; color:#999;}	
.box .box-img span{ font-size:16px; display:block; line-height:40px; color:#333; margin-top:10px;}
.box:hover .box-img{
    transform: rotateY(-90deg);
}
.box .box-img img{
    width: 100%;
    height: auto;
}
.box .box-content{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    padding: 40px 20px;
    text-align: center;
    background: rgba(0,0,0,0.7);
    transform: rotateY(90deg);
    transition: all 0.50s ease-in-out 0s;
}
.box:hover .box-content{
    transform: rotateY(0);
}
.box .title{
    font-size:18px;
    color: #fff;
    text-transform: uppercase;
}
.box .description{
    font-size: 14px;
    line-height: 24px;
    color: #fff;
}
.box .title:after,
.box .description:after{
    content: "";
    width: 80%;
    display: block;
    margin: 15px auto;
}

@media only screen and (max-width: 990px) {
    .box{  margin-bottom:20px;}
	.box .box-img img{ height:18rem;}
}
@media only screen and (max-width: 479px) {
    .box .box-content{ padding: 20px; }
}




.dvantage-container{ width:1180px; height:450px; margin:0 auto; padding-top:50px;}
.dvantage-list{ margin-top:50px;}
.dvantage-list li{ float:left; width:260px; height:280px;-webkit-box-shadow: 0 2px 6px 0 rgba(0,0,0,.1); -moz-box-shadow: 0 2px 6px 0 rgba(0,0,0,.1); box-shadow: 0 2px 6px 0 rgba(0,0,0,.1); margin:10px 35px 15px 0;}
.dvantage-list li:hover .img{ background:url(../../images/faceprint/icon01h.png) center no-repeat;}
.dvantage-list li:hover .img2{ background:url(../../images/faceprint/icon02h.png) center no-repeat;}
.dvantage-list li:hover .img3{ background:url(../../images/faceprint/icon03h.png) center no-repeat;}
.dvantage-list li:hover .img4{ background:url(../../images/faceprint/icon04h.png) center no-repeat;}

.dvantage-list li p{text-align:center;  padding:0 20px;color:#999; line-height:25px;}
.dvantage-list li p span{ font-size:16px; display:block; line-height:40px;color:#666;}
.dvantage-list li .img{ width:100px; height:100px; margin:10px auto 0; display:block; background:url(../../images/faceprint/icon01.png) center no-repeat;}
.dvantage-list li .img2{background:url(../../images/faceprint/icon02.png) center no-repeat;}
.dvantage-list li .img3{background:url(../../images/faceprint/icon03.png) center no-repeat;}
.dvantage-list li .img4{background:url(../../images/faceprint/icon04.png) center no-repeat;}

.offer-container{ height:600px;}
.offer-container .add-title,.programme .add-title{ margin:20px auto;}
.offer-container li p{color:#333;text-align:left;}
.offer-container p a,.programme .add-title a{ color:#d0021b; }
.offer-container li{ background:#f4f5f7; box-shadow:none; padding:20px 0; height:350px;width:270px;margin:10px 25px 15px 0;}
.offer-container li p span{ text-align:left; font-size:20px;color:#333;}
.offer-container li p e{ display:block; }
.offer-container li .configure{ margin:10px 0; height:100px;}
.offer-container li .configure p{ display:inline-block; line-height:30px;}
.offer-container li .price{ margin:40px 0 0px; height:80px;}
.offer-container li b{ color:#d0021b; font-size:24px; margin-right:10px;}
.offer-container li .button{ margin:20px auto;}
.offer-container li .price-title{ margin-bottom:10px;}
.offer-container li select{ outline:none; border:1px solid #D6D6D6; padding: 5px 32px 5px 10px;}


.programme{ margin:80px auto;}
.programme .relation{ text-align:center; font-size:18px;}
.programme .relation a{color:#d0021b}
.programme .button{ margin:50px auto;}

.correlation-container{ width:1180px; height:100%; margin:0 auto; padding-top:50px;}
.correlation-list{ margin-top:50px; height:420px;}
.correlation-list li{ float:left; width:320px; margin:10px 100px 50px 0;}
.correlation-list li p{ color:#6E6E6E}
.correlation-list li:nth-child(3),.correlation-list li:last-child{ margin-right:0;}
.correlation-title{ font-size:18px; line-height:30px; margin-bottom:15px; color:#333;}
.correlation-container .button{  clear:both;}
.correlation-container a:hover .correlation-title{ color:#006fef;}


@media (max-width:780px){
h2{ font-size:24px;}
.cotent-banner{ width:100%; height:450px; background:url(../../images/faceprint/banner.jpg) -850px center no-repeat;}
.banner-container{width:100%; padding-top:80px; text-align:center;}
.banner-hot{ text-align:left; width:80%; margin: 0 auto;}
.banner-title{ font-size:24px;}	
.banner-info{ width:90%; margin:20px auto; line-height:24px; font-size:14px;}
.button{ margin:30px auto}

.summary{margin: 50px auto; width:95%;}
.summary .container{ width:100%;}
.summary p{ margin:30px auto 10px;}


.nav-container-bg,.module-section{ display:none;}

@font-face {
  font-family: 'FontAwesome';
  src: url('../../fonts/fontawesome-webfont.eot?v=4.2.0');
  src: url('../../fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('../../fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('../../fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('../../fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

.togglebox { display:block;
  width:92%;
  margin:20px auto;
  background: #fff;
  transform: translateZ(0);
}

.togglebox h2{ line-height:80px;}
input[type="radio"] {
  position: absolute;
  opacity: 0;
}

label {
  position: relative;
  display: block;
  height: 60px;
  line-height: 60px;
  padding: 0 20px;
  font-size:0.96rem;
  font-weight: 700;
  border-top: 1px solid #ddd;
  background:#f6f6f6;
  cursor: pointer;
  color:#333;
 font-weight:normal;
}

label[for*='1'] {
  border: 0;
}

label:after {
  content: '\f078';
  position: absolute;
  top: 0px;
  right: 20px;
  font-family: fontawesome;
  transform: rotate(90deg);
  transition: .3s transform;
}

section {
  height: 0;
  transition: .3s all;
  overflow: hidden;
}

#toggle1:checked ~ label[for*='1']:after,
#toggle2:checked ~ label[for*='2']:after,
#toggle3:checked ~ label[for*='3']:after,
#toggle4:checked ~ label[for*='4']:after,
#toggle5:checked ~ label[for*='5']:after,
#toggle6:checked ~ label[for*='6']:after {
  transform: rotate(0deg);
}

#toggle1:checked ~ #content1,
#toggle2:checked ~ #content2,
#toggle3:checked ~ #content3,
#toggle4:checked ~ #content4,
#toggle5:checked ~ #content5,
#toggle6:checked ~ #content6 {
  height:400px;
}
  
.togglebox p {
  margin: 15px 0;
  padding: 0 20px;
  font-size: 12px;
  line-height: 2;
  color:#666;
  clear:both;
}

.solution-item-title{ font-size:18px; line-height:30px;}
.solution-content .case{ display:inline-block; margin:10px 10px 10px 0;}
.solution-content{ padding:0 20px; margin:10px auto;}
.solution-item-img{ width:100%; height:150px; display:block; margin:20px auto;}
.solution-item-title p{ margin:0 ; padding:0; overflow:hidden;}
.solution-sever a{ color:#006fef; display:inline-block; margin:0 10px;}

.flow-container{ width:92%;  padding-top:30px; height:500px;}
.flow-list{ margin-top:10px;}
.flow-title{ height:90px;}
.flow-title img{ margin:0 auto; display:block; width:50%}
.flow-title span{line-height:20px; font-size:16px;}
.flow-list li{ width:31%; height:205px;  float:left;margin:2.6% 2.6% 0 0;}
.flow-list li:last-child,.flow-list li:nth-child(3){ margin-right:0;}
.flow-list li p{ line-height:25px; margin-top:10px;  font-size:12px;}

.dvantage-container{ width:92%; height:840px;  padding-top:30px;}
.dvantage-list{ margin-top:20px;}
.dvantage-list li{ float:left; width:100%; height:180px;margin:2.5% 2.5% 0px 0;}

.dvantage-list li p{ line-height:20px;padding:0 10px;}
.dvantage-list li .img,.dvantage-list li:hover .img{ width:85px; height:60px; background-size:75%;}	

.offer-container li p span{text-align:center;}
.offer-container li .configure p{ width:94%;}
.offer-container li .configure p e{ width:36%; display:inline-block;text-align:center; }
.offer-container li .configure p e:last-child{ width:24%;}
.offer-container{ height:1200px}
.offer-container li{height:235px;}
.offer-container li .configure{ height:auto;}
.offer-container li .price{ margin:10px auto; height:60px;}
.offer-container li .button{ margin:0 auto;}
.dvantage-list li p{ text-align:center;}
.dvantage-list li .last-price{ display:none;}
.offer-container li:last-child .configure p{ width:40.5%; float:left;}
.offer-container li:last-child .configure p e{ width:100%;}
.offer-container li .button{ clear:both;}
.offer-container li:last-child .configure{ height:130px;}

.programme{ width:95%;}



.correlation-container{ width:92%; height:100%; margin:0 auto; padding-top:0px;}
.correlation-list{ margin-top:20px; height:1080px;}
.correlation-list li{ float: none; width:92%; padding:10px 4%; margin:10px 0; background:#F6F6F6}
.correlation-title{ font-size:16px; line-height:28px; margin-bottom:5px; }
.correlation-list li p{font-size:12px; line-height:22px;}
.correlation-container .button{ width:150px; height:40px; line-height:40px; margin: 20px auto 10px;}

.bdproduct-footers{ display:none;}


	}