@charset "utf-8";
/* CSS Document */

*{margin:0; padding:0;}
*:focus{outline:none;}
html,body{height:100%;}
body,input{font-family:"微软雅黑", "宋体", "新宋体", "幼圆", Arial;}
body{background: no-repeat center top; background-size:cover; font-size:16px; color:#666666; -moz-user-select:none; -webkit-user-select:none; -ms-user-select:none; -khtml-user-select:none; user-select:none}
a,a:link,a:active,a:visited{color:#333; text-decoration:none;}
a:hover,.nav li a:hover{color:#ff6c00; text-decoration:none;}
a:focus{-moz-outline-style:none;}
ul{list-style:none;}
i,em{font-style:normal;}
img{border:none;}

@font-face {
  font-family: 'iconfont';  /* project id 952531 */
  src: url('//at.alicdn.com/t/font_952531_41bzkzzutkw.eot');
  src: url('//at.alicdn.com/t/font_952531_41bzkzzutkw.eot?#iefix') format('embedded-opentype'),
  url('//at.alicdn.com/t/font_952531_41bzkzzutkw.woff') format('woff'),
  url('//at.alicdn.com/t/font_952531_41bzkzzutkw.ttf') format('truetype'),
  url('//at.alicdn.com/t/font_952531_41bzkzzutkw.svg#iconfont') format('svg');
}
.ift,.ift:before,.ift:after,.lisa li:before,.close:before,.lisf li:before,.liser li i,.fxpst i{font-family:'iconfont'; display: inline-block;}
.anmt10{transition:all 1s ease; -moz-transition:all 1s ease; -webkit-transition:all 1s ease;}
.anmt5,.lic li p,.listvd li img,.imenu,.imenu:after,.imenu:before,.fxpst{transition:all 0.5s ease; -moz-transition:all 0.5s ease; -webkit-transition:all 0.5s ease;}
.anmt3,a,img,.lisa li,.lisa li p,.listvd li i:before,.boxvideo,.vdplay,.lic li img,.lisa li:before,.lisf li:before,.lisf li:hover p,.liser li *,.nav{transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}
.anmt2{transition:all 0.2s ease; -moz-transition:all 0.2s ease; -webkit-transition:all 0.2s ease;}
.boximg{max-width:100%!important; height:auto!important;}
.boximg,.listvd li img,.lisf li img{width:100%; display: block;}
.oohid{opacity:0;visibility: hidden;}
.box{width:100%; max-width:1200px; margin:0 auto;}
.nmain{padding:100px 0; background:url("../images/bk_show.jpg") no-repeat center center; background-size:cover; background-attachment:fixed;}
.nmain .ps1{color:#fff;}

.font2h{text-overflow:-o-ellipsis-lastline; overflow:hidden; text-overflow:ellipsis; display:-webkit-box!important; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.fontovdd{display:block; overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap; }
.nbk{background: none!important;}
.boxflex{display:-webkit-flex; display: flex; flex-wrap:wrap;}
.boxflex li{-webkit-flex:1; flex:1; float: left; white-space:nowrap;}
.amod{position: relative; top:-179px;}

.boxb1{background: url("../images/bk_b1.jpg") no-repeat center bottom;}
.boxb2{background: url("../images/bk_b2.png");}
/*.ivr{display:inline-block; background: url("../images/ico_vr.png") no-repeat center center; width:7%; background-size:contain; text-indent: -888px; overflow: hidden; vertical-align: bottom; margin-right:1%;}*/

/* head */
.head{background:rgba(0,0,0,0.70); position:absolute; top:0; right:0; left:0; height:100px; z-index: 9; color:#fff;}
.head .logo{background: url("../images/logo.png") no-repeat; background-size:contain; width:189px; height:51px; display: block; float: left; margin:20px 0 0 20px;}

.nav,.htel{float: right; margin-right:20px;}
.nav li{line-height:100px; float:left; margin-right:30px;}
.nav li.close{display: none;}
.nav li a{color:#fff;}

.htel{margin-top:26px; padding-right:46px;}
.htel:before{content:'\e609'; display: inline-block; float: left; background-color:#ff6c00; color:#fff; border-radius:50%; width: 40px; height:40px; line-height:46px; font-size:24px; margin-right:6px; text-align: center;}
.htel em{font-size:12px; display: block; margin-top:2px;}
.htel b{display:block; font-size:20px; line-height:22px; white-space: nowrap;}

.hvd{position: relative; width:100%; height:100%; background-color: #000; overflow: hidden; z-index:1; color:#fff; text-align: center;}
.hvd:before,.hvd div,.hvd video{position: absolute; top:0;right:0; left:0; bottom:0;}
.hvd:before{content:''; display: block; background: url('/images/bk_vd.png') repeat center center; z-index: 2;}
.hvd div{z-index: 3; top:auto; bottom:10%; text-shadow:0 0 100px #000,0 0 200px #000,0 0 30px #000;} /*top:50%; transform: translate(0,-50%);*/
.hvd div b{font-size:60px; letter-spacing:5px;}
.hvd div strong{font-weight: normal; font-size:46px; display: block; padding:10px 0; letter-spacing:6px;}
.hvd div em{font-weight: bold; font-style: normal; color: #ff6c00;}
.hvd div span{display: block; font-size:26px; font-weight: lighter;}
.hvd video{width:100%; height:100%; z-index: 1; object-fit: cover; object-position:center center;}

/* title */
.titsa{text-align: center; padding:80px 0 0; letter-spacing:3px; padding-left:3px;}
.titsa b{font-size:34px;line-height:70px; color:#ff6c00; display: block;}
.titsa b:after{content:''; display: block; width:100px; height:4px; background-color: #ffe53e; margin:0 auto 10px; border-radius:5px;}
.titsa span,.titsa p{color:#999; font-weight: lighter; text-transform: uppercase; padding:0 20px;}

/* 服务领域 */
.lisa{padding:60px 20px 80px; overflow: hidden;}
.lisa li{float: left; width:30.3%; margin:0 .5%; text-align: center; padding:40px 1%; background-color: rgba(255,255,255,0.00); box-shadow:0 0 0 rgba(0,0,0,0); border-radius:10px;}
.lisa li:before{color:#ff6c00; font-size:100px; display:block;}
.lisa li:nth-child(1):before{content:'\e600';}
.lisa li:nth-child(2):before{content:'\e612';}
.lisa li:nth-child(3):before{content:'\e68e';}
.lisa li p{letter-spacing:2px; padding-left:2px;}
.lisa li b{font-size:18px; line-height:36px; display: block;}
.lisa li:hover{box-shadow:0 0 20px rgba(0,0,0,0.2); background-color: rgba(255,255,255,0.6); margin:0 1%; padding:40px .5%;}
.lisa li:hover p,.lisa li:hover b{color:#ff6c00}
.lisa li:hover:before{ transform: scale(1.1)}

/* video list */
.listvd,.lisf{padding:50px 0 70px; overflow: hidden;}
.listvd li{position: relative; float: left; color:#fff; background-color: #000; margin:0 14px 14px 0; width:calc(33.36% - 10px); overflow: hidden;}
.listvd li:before{content:''; display:block; position: absolute; top:0; right:0; bottom:0; left:0; background:url("../images/bk_vd.png"); z-index:1;}
.listvd li img{opacity:1; transform: scale(1.1)}
.listvd li b{color:#ff6c00; background-color:rgba(0,0,0,0.74); border-radius:0 0 10px 0; position: absolute; top:0; left:0; z-index:2; padding:4px 15px;}
.listvd li i{position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); z-index:2; font-size:12px;}
.listvd li i:before{content:'\e630'; font-family:iconfont; display:block; text-align: center; font-size:40px; padding-bottom:5px;}
.listvd li:hover{cursor: pointer;}
.listvd li:hover i:before{transform: scale(1.3)}
.listvd li:hover img{opacity:.6; transform: scale(1)}
.listvd li:nth-child(1),.listvd li:nth-child(2){width:calc(50% - 7px);}
.listvd li:nth-child(2),.listvd li:last-of-type{margin-right:0;}

.boxvideo{position: fixed; top:0; right:0; bottom:0; left:0; visibility: hidden;  background-color: rgba(0,0,0,0.70); opacity:0; z-index:9;}
.boxvideo.on{visibility:visible; opacity: 1;}
.boxvideo.on .vdplay{top:50%;}
.vdplay{position: absolute; top:40%; left:50%; z-index:11; box-shadow:0 0 60px #000; transform: translate(-50%,-50%); width:80%; max-width:900px;}
.vdplay video{display: block; width:100%; height:100%;}
.boxvideo .close{position: absolute; top:-30px; right:0;}
.close{cursor: pointer; color:#fff; font-size:20px;}
.close:before{content:'\e693';}
.close:hover{color:#ff6c00;}

/* vr消防设备 */
.lic{padding:20px 0 50px; overflow: hidden;}
.lic li{float: left; width:30%; margin:0 1.5%; text-align: center; position: relative;}
.lic li p{position: absolute; top:45%; left:15px; right:15px; transform: translate(0,-50%); visibility: hidden; opacity:0; font-size:14px; color:#fff; border-radius:7px; background-color:rgba(255,132,54,.9); padding:40px 20px; text-align: left; line-height:24px;}
.lic li img{display: block; max-width:100%; margin:0 auto 20px;}
.lic li span{display: block;}
.lic li:hover p{visibility: visible; opacity:1; top:50%;}
.lic li:hover span{color:#ff6c00;}
.lic li:hover img{transform: scale(1.1)}

/* vr消防应用 */
.lisf{padding:120px 0;}
.lisf li{}
.lisf li:before{font-size:100px; width:150px; height:150px; line-height:150px; position: absolute; top:-44%; left:50%; transform: translate(-50%,0); z-index:1; background-color: #fff; color:#ff6c00; border-radius:50%;}
.lisf li:nth-child(1):before{content:'\e600';}
.lisf li:nth-child(2):before{content:'\e612';}
.lisf li:nth-child(3):before{content:'\e626';}
.lisf li,.lins li{float:left; position: relative; width:calc(33.33% - 10px); margin-right:15px; background-color: #ff6c00; text-align: center;}
.lisf li div{overflow: hidden;}
.lisf li:last-of-type,.lins li:last-of-type{margin-right:0;}
.lisf li p{position:absolute; left:20px; right:20px; z-index: 2; top:40%; font-size:14px; line-height:30px; color:#fff;}
.lisf li:hover:before{top:50%; transform: translate(-50%,-50%); background-color:#ff6c00; color:#fff; opacity:.3;}
.lisf li:hover img{transform: scale(1.1); opacity:.2}
.lisf li:hover p{top:50%; transform: translate(0,-50%)}

/*  */
.boxb3{background: url("../images/bk_3.jpg") no-repeat center center; background-size: cover; background-attachment:fixed;}
.vrvs{padding:100px 0;}
.vrvs img{max-width:822px; width:100%; margin:0 auto; display:block;}
.bkbtmf{background-color: rgba(255,255,255,0.85)}
.bkbtmf .titsa p{color: #333;}
.titsa.abt p{color:#ffffff; text-indent:2em; padding:30px 20px 120px; text-align: left; max-width:810px; margin:0 auto;}
.lins{overflow: hidden; padding:50px 0 100px;}
.lins li{overflow: hidden;}
.lins li img{display:block; width:100%;}
.lins li:hover img{transform: scale(1.1)}
.lins li p{position: absolute; left:0; right:0; bottom:0; font-size:12px; background-color: rgba(0,0,0,0.66); text-align: left; color:#fff; padding:10px 15px; min-height:32px;}

/* service */
.liser{padding:50px 0 0; overflow: hidden;}
.liser li{float: left; width:25%; position:relative; min-height:150px;}
.liser li i{display: block; text-align: center; color: #ff6c00; font-size:70px;}
.liser li p{padding:0 20px; font-size:14px; line-height:18px; text-indent:2em; z-index:2; position: relative;}
.liser li:after{content:''; display: block; position: absolute; top:0; right:0; bottom:0; border-right:1px solid #e5e5e5;}
.liser li:last-of-type:after{display: none;}
.liser li:hover i{transform:translate(0,50%) scale(1.6); color:#f2f2f2;}
.liser li:hover p{transform:translate(0,-50%); color:#ff6c00; line-height:22px;}

.imghb{padding:50px 0 70px;}

/* show */
.ps1{max-width:600px; margin:0 auto 0;}
.cntsa{text-align: center; font-size:16px;  padding:60px 20px;}
.cntsa img{display: block; margin:10px auto; max-width:100%;}
.cntsa p{padding-bottom:20px;}

/* footer */
.footer{min-height:220px; clear:both; background:url("../images/bk_footer.jpg") #333333 no-repeat center center;}
.footer .ftlogo{background: url("../images/logo_ft.png") no-repeat center center; width:300px; height:117px; float: left; margin-top:46px;}
.footer .info{float: left; margin-top:46px;}
.footer .info span{font-size:20px; color:#fff; display: block;}
.footer .info p{padding:10px 0; color:#cccccc; font-weight: lighter; line-height:26px;}
.footer .ft2wm{float: right; margin:30px 20px 0 0;}

.fxpst{display: none;}
@media screen and (min-width:1000px) {
.fxpst{display:block; visibility: hidden; opacity:0; position: fixed; top:60%; right:1%; transform: translate(0,-50%); z-index:8;}
.fxpst.on{visibility: visible; top:50%; opacity:1;}
.fxpst li{margin-bottom:6px; cursor: pointer; position: relative; width:50px; height:50px; line-height:54px; }
.fxpst a{border:1px solid #dddddd; text-align: center; background-color: #fff; color: #848484; display: block; position:absolute; top:0; right:0; width:100%; height:100%; display: block; overflow: hidden;}
.fxpst a:hover{background-color: #ff6c00; color:#ffffff; border-color:#ff6c00;}
.fxpst i{font-size:30px;display: block; float: left; width:50px;}
.fxpst .m{}
    .fxpst .m.onlinesv a:hover{width:190px;}
    .fxpst .m.tel a:hover{width: 170px;}
.fxpst .m span,.fxpst .m span{position: absolute; top:0; left:50px; bottom:0; line-height:50px;}
.fxpst .wx2wm a{overflow: visible;}
    .fxpst .wx2wm img{position: absolute; top:-100%; left:-170px; opacity:0; visibility: hidden;}
    .fxpst .wx2wm:hover img{opacity: 1; visibility:visible; left: -160px;}
}
@media screen and (max-width:1000px) {
    .head{height:60px;}
    .head .logo{width: 140px; height:40px; margin-top:10px; position: relative; z-index:9;}
    .htel{float:right; margin:10px 20px 0 0; position: relative; z-index:9;}
    .imenu{float:right; width:30px; height:15px; position: relative; z-index:9; margin:20px 20px 0 0; border-top:3px solid #999; border-bottom:3px solid #999; cursor: pointer;}
    .imenu:after,.imenu:before{position: absolute; top:50%; margin-top:-2px; right:0; left:0; border-top:3px solid #999; content: ''; display: block;}
    .head.on .imenu{border:none;}
    .head.on .imenu:after{-moz-transform:rotate(45deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);-moz-transform-origin:50% 50%;-webkit-transform:rotate(45deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);-webkit-transform-origin:50% 50%;-o-transform:rotate(45deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);-o-transform-origin:50% 50%;transform:rotate(45deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);transform-origin:50% 50%}
    .head.on .imenu:before{-moz-transform:rotate(-45deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);-moz-transform-origin:50% 50%;-webkit-transform:rotate(-45deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);-webkit-transform-origin:50% 50%;-o-transform:rotate(-45deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);-o-transform-origin:50% 50%;transform:rotate(-45deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);transform-origin:50% 50%}
    .nav{position: fixed; top:-20px; left:0; right:0; bottom:0; margin:0; padding:70px 0 0; visibility: hidden; opacity:0; background-color: rgba(0,0,0,0.9);}
    .head.on .nav{visibility: visible; top:0; opacity:1;}
    .nav li{width:100%; text-align: center; line-height:240%; font-size:20px;}
    
    .hvd{height:700px; max-height:100%;}
    .hvd div b{font-size:40px;}
    .hvd div strong{font-size:26px;}
    .hvd div span{font-size:16px;}
    
}
@media screen and (max-width:760px) {
    body{font-size:12px;}
    .htel{display: none;}
    .hvd{height:300px;}
    .hvd div b,.hvd div strong{letter-spacing:0; padding:0;}
    .hvd div b{font-size:26px;}
    .hvd div strong{font-size:20px;}
    .hvd div span{font-size:12px;}
    
    .titsa{padding:40px 0 0;}
    .titsa b{font-size:26px; line-height:50px; letter-spacing:0;}
    .lisa{padding-top:20px; padding-bottom:30px;}
    .lisa li{width:100%; padding:20px 1%!important;}
    .listvd,.lisf,.lins{padding:30px 20px;}
    .listvd li,.lisf li, .lins li{width:100%!important;}
    .lic li{width:80%; margin:0 auto; float: none;}
    .lic li:hover img{transform: scale(1)}
    .lisf li:before{opacity:0;}
    .lisf li,.lins li{margin:10px 0 0;}
    .lisf li p{top:25%;}
    .liser li{width:50%; min-height:180px; margin-bottom:10px;}
    .liser li:nth-child(2n):after{display:none;}
    .footer .ftlogo{display: none;}
    .footer .info{margin-left:30px;}
    .footer .ft2wm{display:block; margin:0 auto; float: none; text-align: center;}
}




