body{-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased}
*,::before,:after{-moz-box-sizing:border-box;box-sizing:border-box}
button,input[type=button],input[type=date],input[type=file],input[type=submit]{cursor:pointer;-webkit-appearance:none}
blockquote,body,button,dd,dl,dt,fieldset,h1,h2,h3,h4,h5,h6,hr,input,lengend,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0}
body,button,input,select,textarea{outline:0}
body{min-width:320px;overflow-x:hidden}
picture{display:block}
li,ol,ul{list-style:none}
a{text-decoration:none}
img{border:none;vertical-align:middle}
.clearfix:after,.clearfix:before{content:"";display:table}
.clearfix:after{clear:both}
.clearfix{zoom:1}
em,h1,h2,h3,h4,h5,h6,i,u{font-style:normal;font-weight:400}
.ib-middle{display:inline-block;vertical-align:middle}
.ib-top{display:inline-block;vertical-align:top}
.ib-bottom{display:inline-block;vertical-align:bottom}
.fixed{position:fixed}
.full{width:100%;height:100%}
.table{display:table;height:100%}
.table-cell{display:table-cell;vertical-align:middle}
.img_scale{overflow:hidden;cursor:pointer}
.img_scale img{transition:transform .6s ease;-ms-transition:transform .6s ease;-o-transition:transform .6s ease;-webkit-transition:transform .6s ease;-moz-transition:transform .6s ease}
.img_scale:hover img{transform:scale(1.05);-ms-transform:scale(1.05);-o-transform:scale(1.05);-webkit-transform:scale(1.05);-moz-transform:scale(1.05)}
.text-left{text-align:left}
.text-right{text-align:right}
.text-center{text-align:center}
.nowrap{white-space:nowrap}
.row{margin-right:-2px;margin-left:-2px}
.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9{position:relative;min-height:1px;padding-right:2px;padding-left:2px}
.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9{float:left}
.col-xs-12{width:100%}
.col-xs-11{width:91.66666667%}
.col-xs-10{width:83.33333333%}
.col-xs-9{width:75%}
.col-xs-8{width:66.66666667%}
.col-xs-7{width:58.33333333%}
.col-xs-6{width:50%}
.col-xs-5{width:41.66666667%}
.col-xs-4{width:33.33333333%}
.col-xs-3{width:25%}
.col-xs-2{width:16.66666667%}
.col-xs-1{width:8.33333333%}
@media (min-width:769px){.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9{float:left}
.col-sm-12{width:100%}
.col-sm-11{width:91.66666667%}
.col-sm-10{width:83.33333333%}
.col-sm-9{width:75%}
.col-sm-8{width:66.66666667%}
.col-sm-7{width:58.33333333%}
.col-sm-6{width:50%}
.col-sm-5{width:41.66666667%}
.col-sm-4{width:33.33333333%}
.col-sm-3{width:25%}
.col-sm-2{width:16.66666667%}
.col-sm-1{width:8.33333333%}
}
@media (min-width:992px){.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9{float:left}
.col-md-12{width:100%}
.col-md-11{width:91.66666667%}
.col-md-10{width:83.33333333%}
.col-md-9{width:75%}
.col-md-8{width:66.66666667%}
.col-md-7{width:58.33333333%}
.col-md-6{width:50%}
.col-md-5{width:41.66666667%}
.col-md-4{width:33.33333333%}
.col-md-3{width:25%}
.col-md-2{width:16.66666667%}
.col-md-1{width:8.33333333%}
}
@media (min-width:1200px){.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9{float:left}
.col-lg-12{width:100%}
.col-lg-11{width:91.66666667%}
.col-lg-10{width:83.33333333%}
.col-lg-9{width:75%}
.col-lg-8{width:66.66666667%}
.col-lg-7{width:58.33333333%}
.col-lg-6{width:50%}
.col-lg-5{width:41.66666667%}
.col-lg-4{width:33.33333333%}
.col-lg-3{width:25%}
.col-lg-2{width:16.66666667%}
.col-lg-1{width:8.33333333%}
}
.visible-lg,.visible-md,.visible-sm,.visible-xs{display:none!important}
.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block{display:none!important}
@media (max-width:768px){.visible-xs{display:block!important}
table.visible-xs{display:table!important}
tr.visible-xs{display:table-row!important}
td.visible-xs,th.visible-xs{display:table-cell!important}
}
@media (max-width:768px){.visible-xs-block{display:block!important}
}
@media (max-width:768px){.visible-xs-inline{display:inline!important}
}
@media (max-width:768px){.visible-xs-inline-block{display:inline-block!important}
}
@media (min-width:769px) and (max-width:991px){.visible-sm{display:block!important}
table.visible-sm{display:table!important}
tr.visible-sm{display:table-row!important}
td.visible-sm,th.visible-sm{display:table-cell!important}
}
@media (min-width:769px) and (max-width:991px){.visible-sm-block{display:block!important}
}
@media (min-width:769px) and (max-width:991px){.visible-sm-inline{display:inline!important}
}
@media (min-width:769px) and (max-width:991px){.visible-sm-inline-block{display:inline-block!important}
}
@media (min-width:992px) and (max-width:1199px){.visible-md{display:block!important}
table.visible-md{display:table!important}
tr.visible-md{display:table-row!important}
td.visible-md,th.visible-md{display:table-cell!important}
}
@media (min-width:992px) and (max-width:1199px){.visible-md-block{display:block!important}
}
@media (min-width:992px) and (max-width:1199px){.visible-md-inline{display:inline!important}
}
@media (min-width:992px) and (max-width:1199px){.visible-md-inline-block{display:inline-block!important}
}
@media (min-width:1200px){.visible-lg{display:block!important}
table.visible-lg{display:table!important}
tr.visible-lg{display:table-row!important}
td.visible-lg,th.visible-lg{display:table-cell!important}
}
@media (min-width:1200px){.visible-lg-block{display:block!important}
}
@media (min-width:1200px){.visible-lg-inline{display:inline!important}
}
@media (min-width:1200px){.visible-lg-inline-block{display:inline-block!important}
}
@media (max-width:768px){.hidden-xs{display:none!important}
}
@media (min-width:769px) and (max-width:991px){.hidden-sm{display:none!important}
}
@media (min-width:992px) and (max-width:1199px){.hidden-md{display:none!important}
}
@media (min-width:1200px){.hidden-lg{display:none!important}
}
.position_center{position:absolute;top:0;left:0;bottom:0;right:0;margin:auto}
.position_left{position:absolute;top:0;left:0;bottom:0;right:auto;margin:auto}
.position_right{position:absolute;top:0;left:auto;bottom:0;right:0;margin:auto}
.position_bottom{position:absolute;top:auto;left:0;bottom:0;right:0;margin:auto}
.middle-left{position:absolute;left:0;top:50%;transform:translate(0,-50%);-webkit-transform:translate(0,-50%);-moz-transform:translate(0,-50%);-ms-transform:translate(0,-50%);-o-transform:translate(0,-50%)}
.middle-right{position:absolute;right:0;top:50%;transform:translate(0,-50%);-webkit-transform:translate(0,-50%);-moz-transform:translate(0,-50%);-ms-transform:translate(0,-50%);-o-transform:translate(0,-50%)}
.middle-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%)}
.middle-bottom{position:absolute;left:50%;bottom:0;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%)}
.transition{transition:.4s;-ms-transition:.4s;-o-transition:.4s;-webkit-transition:.4s;-moz-transition:.4s}
.uppercase{text-transform:uppercase}
.responsive{max-width:100%;width:100%}
#mask-dark{position:fixed;width:100%;height:100%;left:0;top:0;background-color:#000;opacity:.9;z-index:998;display:none}
.container{width:1200px;max-width:100%;margin:0 auto}
.baseColor{color:#022f5d}
body,html{background:#f7f8f8}
div[class*=container],section[class*=container],ul[class*=container]{margin:0 auto;max-width:100%}
@font-face{font-family:DS-digital;src:url(https://cdn.haojue.com/bocweb/products/DN150/font/DS-digital.eot);src:url(https://cdn.haojue.com/bocweb/products/DN150/font/DS-digital.eot?#iefix) format('embedded-opentype'),url(https://cdn.haojue.com/bocweb/products/DN150/font/DS-digital.woff2) format('woff2'),url(https://cdn.haojue.com/bocweb/products/DN150/font/DS-digital.ttf) format('truetype'),url(https://cdn.haojue.com/bocweb/products/DN150/font/DS-digital.svg#DS-digital) format('svg');font-weight:400;font-style:normal}
.page{position:relative}
.more.page{padding-top:10.8333%;padding-bottom:11.979%;color:#fff;position:relative;background:#f2f2f3}
.more.page .bg,.more.page a{position:absolute;width:100%;height:100%;left:0;top:0;z-index:1}
.more.page a{z-index:5}
.more.page .text{position:relative;z-index:3}
.more.page h5{margin-bottom:20px;font-size:30px}
.more.page h2{letter-spacing:0;font-size:50px}
.more.page.move .bg{opacity:1}
.more.page.move h2,.more.page.move p{opacity:1;filter:alpha(opacity=1);transform:none;-ms-transform:none;-o-transform:none;-webkit-transform:none;-moz-transform:none}
@media (max-width:1440px){.more.page h2{font-size:46px}
.more.page h5{margin-bottom:15px}
}
@media (max-width:1366px){.more.page h2{font-size:42px}
.more.page h5{font-size:28px}
}
@media (max-width:1200px){.more.page h5{font-size:24px;margin-bottom:12px}
.more.page h2{font-size:38px}
}
@media (max-width:1080px){.more.page h5{font-size:22px}
.more.page h2{font-size:34px}
}
@media (max-width:992px){.more.page h5{font-size:20px}
.more.page h2{font-size:32px;letter-spacing:0}
}
@media (max-width:880px){.more.page h2{font-size:28px;letter-spacing:0}
}
@media (max-width:768px){.more.page{padding-top:32.67%;padding-bottom:32.67%}
.more.page h5{font-size:18px}
.more.page h2{font-size:24px;letter-spacing:6px}
}
@media (max-width:750px){.more.page h2{font-size:.53rem}
.more.page h5{font-size:.32rem}
}
@media (max-width:480px){.more.page h5{font-size:18px}
.more.page h2{font-size:24px;letter-spacing:2px}
}
@media (max-width:420px){.more.page .more h5{margin-bottom:15px}
.more.page h2{font-size:26px}
.more.page h5{font-size:17px}
}
@media (max-width:375px){.more.page h2{font-size:24px}
.more.page .more h5{margin-bottom:12px}
}
#uc_recommend_ad{display:none!important}
.page{background:#000}
.font18{font-size:18px}
.font25{font-size:.13rem}
.font30{font-size:.16rem}
.font32{font-size:.17rem}
.font36{font-size:.19rem}
.font40{font-size:.21rem}
.font45{font-size:.23rem}
.font50{font-size:.26rem}
.font60{font-size:.31rem;letter-spacing:4px;font-weight:bolder;color:#fff;line-height:1}
.font80{font-size:.42rem;letter-spacing:.04rem;font-weight:bolder;color:#fff;line-height:1}
h2{font-size:.31rem;letter-spacing:4px;font-weight:bolder;color:#fff;line-height:1}
p{font-size:18px;line-height:1.444;margin-top:20px;margin-left:auto;margin-right:auto}
.fontbold{font-weight:700}
.lespacing5{letter-spacing:5px}
.lespacing2{letter-spacing:2px}
.lineH1{line-height:1}
@media (max-width:1440px){.font18{font-size:16px}
.font32{font-size:28px}
p{font-size:16px;margin-top:18px}
.lespacing5{letter-spacing:3px}
.lespacing2{letter-spacing:1px}
}
@media (max-width:1366px){p{margin-top:16px}
.font32{font-size:26px}
}
@media (max-width:1200px){.font18{font-size:14px}
.font32{font-size:24px}
.lespacing5{letter-spacing:2px}
.font40{font-size:24px}
.font30{font-size:22px}
p{font-size:14px;margin-top:12px}
}
@media (max-width:1080px){.font32{font-size:22px}
}
@media (max-width:992px){.font40{font-size:22px}
.font32{font-size:20px}
.font30{font-size:20px}
}
@media (max-width:767px){.more h2{margin-top:2%}
h2{font-size:.533333rem;letter-spacing:.13rem;font-weight:700}
.font18{font-size:.32rem}
.font25{font-size:.32rem}
.font30{font-size:.32rem}
.font32{font-size:.47rem}
.font36{font-size:.47rem}
.font40{font-size:.53rem}
.font45{font-size:.47rem}
.font50{font-size:.53rem}
.font60{font-size:.53rem;letter-spacing:.13rem;font-weight:bolder;color:#fff;line-height:1}
.font80{font-size:.53rem}
p{font-size:.32rem;line-height:1.6667}
}
@media (max-width:750px){.more{padding:32.6667% 0}
.more .bg{background:url(https://cdn.haojue.com/bocweb/products/DN150/images/1/page4-img-2.jpg) center center/cover no-repeat!important}
p{font-size:.32rem;line-height:1.6666;margin-top:20px}
.more h5{margin-bottom:20px}
}
@media (max-width:480px){p{font-size:16px;margin-top:15px}
h2{letter-spacing:3px}
.font30{font-size:20px}
}
@media (max-width:420px){p{font-size:15px;line-height:24px;margin-top:10px}
.more h5{margin-bottom:15px}
h2{letter-spacing:2px}
.font30{font-size:18px}
}
@media (max-width:375px){p{font-size:14px;line-height:22px;margin-top:10px}
.more h5{margin-bottom:12px}
.font25{font-size:14px}
.lespacing2{letter-spacing:0}
.font40{font-size:20px}
.font30{font-size:16px}
}
.padding_68{padding-top:68px}
@media (max-width:992px){.padding_68{padding-top:50px}
}
@media (max-width:768px){.padding_68{padding-top:9.33%}
}
.container_68{width:1200px;margin:0 auto;position:relative}
@media (max-width:1440px){.container_68{width:calc(100% - 136px);width:-webkit-calc(100% - 136px)}
}
@media (max-width:992px){.container_68{width:90%}
}
@media (max-width:768px){.container_68{width:90.6667%}
}
.prompt-txt{position:absolute;font-size:8px;color:#333}
.prompt-txt-white{color:#fff}
.prompt-txt-gary{color:#b6b6b6}
@media (max-width:480px){.prompt-txt{bottom:15px}
}
.icon{overflow:visible}
.icon i{content:"";position:absolute;z-index:99999;width:18px;height:18px;background:#279ed7;-moz-border-radius:50%;border-radius:50%;behavior:url(https://cdn.haojue.com/bocweb/products/DN150/css/iecss3.htc)}
.icon i+i{-webkit-animation:clickwaveII 2s 0s ease infinite;-moz-animation:clickwaveII 2s 0s ease infinite;-o-animation:clickwaveII 2s 0s ease infinite;animation:clickwaveII 2s 0s ease infinite}
.icon i+i+i{-webkit-animation:clickwaveIII 2s 0s ease infinite;-moz-animation:clickwaveIII 2s 0s ease infinite;-o-animation:clickwaveIII 2s 0s ease infinite;animation:clickwaveIII 2s 0s ease infinite}
@keyframes clickwaveII{0%{-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transform:scale(1);opacity:.9}
80%{-moz-transform:scale(2);-o-transform:scale(2);transform:scale(2);-webkit-transform:scale(2);opacity:0}
95%{-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transform:scale(1);opacity:0}
100%{-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transform:scale(1);opacity:.9}
}
@keyframes clickwaveIII{0%{-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transform:scale(1);opacity:.6}
80%{-moz-transform:scale(3.6);-o-transform:scale(3.6);transform:scale(3.6);-webkit-transform:scale(3.6);opacity:0}
95%{-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transform:scale(1);opacity:0}
100%{-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transform:scale(1);opacity:.6}
}
.text-bottom{position:absolute;width:100%;bottom:3.75%;color:#fff;text-align:center;line-height:1}
@media (max-width:750px){.text-bottom{bottom:8%}
}
.btn{font-size:.09rem;margin-top:5.833%}
.btn a{margin:0 20px;color:#fff;border:1px solid #fff;line-height:1;padding:8px 16px;border-radius:20px;transition:all .4s ease;-ms-transition:all .4s ease;-o-transition:all .4s ease;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;display:inline-block;cursor:pointer}
.btn a.cur,.btn a:hover{color:#01b3de;border:1px solid #01b3de}
@media (max-width:1440px){.btn a{padding:5px 12px}
}
@media (max-width:1200px){.btn a{margin:0 15px}
}
@media (max-width:750px){.btn .btn{font-size:.37rem}
.btn .btn a{padding:.21rem .45rem;border-radius:.72rem;margin:0 10px}
}
.fl{float:left}
.fr{float:right}
article,body{transition:all 1s ease;-ms-transition:all 1s ease;-o-transition:all 1s ease;-webkit-transition:all 1s ease;-moz-transition:all 1s ease}
.header-warp{position:absolute;height:118px;font-size:0;top:0;width:100%;left:0;transition:all 1s ease;-ms-transition:all 1s ease;-o-transition:all 1s ease;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;z-index:100}
.header-warp a{color:#fff;display:block}
.header-top{font-size:0;width:100%;padding:0 68px;height:68px;line-height:68px;position:relative;z-index:9;transition:all 1s ease;-ms-transition:all 1s ease;-o-transition:all 1s ease;-webkit-transition:all 1s ease;-moz-transition:all 1s ease}
.center-menu{text-align:center;position:absolute;width:100%;left:0;top:0;height:100%}
.center-menu a{display:inline-block;vertical-align:top;text-align:top;font-size:16px;margin:0 30px;color:#fff;transition:all .4s ease;-ms-transition:all .4s ease;-o-transition:all .4s ease;-webkit-transition:all .4s ease;-moz-transition:all .4s ease}
.center-menu a:hover{color:red}
.right-menu{height:68px;line-height:68px}
.right-menu>div{display:inline-block;vertical-align:top;color:#fff;height:68px;line-height:68px;font-size:0;margin-left:15px}
.right-menu>div.lang{font-size:18px}
.header{width:100%;top:0;left:0;z-index:8;height:50px;line-height:50px;transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-webkit-transition:all .5s cubic-bezier(.28,.11,.32,1);transition:all .5s cubic-bezier(.28,.11,.32,1)}
.header:after{content:"";width:62.5%;height:1px;background:rgba(51,51,51,.2);position:absolute;left:50%;transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);bottom:0}
.header-in{width:62.5%;margin:0 auto;height:50px;line-height:50px}
.header-in .logo{line-height:50px;font-size:20px;font-weight:700}
.header-in .logo a{display:inline-block;vertical-align:middle}
.header-in .logo a:hover{color:#fff}
.header-in .logo a:nth-child(2){margin:0;font-weight:400;font-size:14px;color:#f1f1f1}
.header-in .logo a:nth-child(2):before{content:"|";vertical-align:top;display:inline-block;margin:0 12px}
.header-in .logo span{display:inline-block;vertical-align:top}
.header-in .logo span:first-child+span{margin-left:12px}
.menu{display:block}
.menu li{float:left;font-size:14px;margin-left:24px}
.menu a{color:#fff;transition:all .4s ease;-ms-transition:all .4s ease;-o-transition:all .4s ease;-webkit-transition:all .4s ease;-moz-transition:all .4s ease}
.header-r:hover a,.menu li.cur a,.menu li:hover a{color:red}
.header-r a{transition:all .4s ease;-ms-transition:all .4s ease;-o-transition:all .4s ease;-webkit-transition:all .4s ease;-moz-transition:all .4s ease}
.header-r{font-size:14px}
.header-l{display:none}
.header-black a{color:#000}
.header-black .header-l{color:#000}
.header-black .menu a{color:#000}
.open .header-warp,.open article{margin-top:-68px}
.header.fixed{position:fixed}
.header.fixed.bgChanged{background:rgba(0,0,0,.8)}
.header.fixed.bgChanged:after{width:100%}
.header-black.bgChanged a{color:#fff}
.header-black.bgChanged .header-l{color:#fff}
.header-black.bgChanged .menu a{color:#fff}
.header-black.bgChanged .menu li.cur a,.header-black.bgChanged .menu li:hover a{color:red}
@media (max-width:1680px){.header-in,.header:after{width:76%}
}
@media (max-width:1440px){.header-in,.header:after{width:1000px}
.logo{font-size:18px}
}
@media (max-width:1200px){.header-in,.header:after{width:90%}
.logo{font-size:16px}
.center-menu a{margin:0 20px}
.header-top{padding:0 5%}
}
@media (max-width:768px){.header-warp{height:100px}
.header-in{width:90.67%}
.header-in .logo span:first-child+span{margin-left:5px}
.header-top,.right-menu,.right-menu>div{height:50px;line-height:50px}
.header-black .menu a{color:#fff}
.header-top{z-index:1999999}
.right-menu>div{margin:0 5%}
.nav-btn{width:22px;height:16px;position:relative;cursor:pointer;font-size:0;margin-top:17px}
.nav-btn .line{display:block;width:100%;height:1px;border-radius:0;background-color:#fff;position:absolute;left:0;transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out;-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out}
.nav-btn.hover .line{background:#d7000e}
.nav-btn .line1{transform-origin:center 0 0}
.nav-btn.hover .line1{-webkit-transform:translate3d(0,7.5px,0) rotate(45deg);-moz-transform:translate3d(0,7.5px,0) rotate(45deg);transform:translate3d(0,7.5px,0) rotate(45deg)}
.nav-btn .line2{top:7px}
.nav-btn.hover .line2{opacity:0;-webkit-transform:translate3d(30px,0,0);-moz-transform:translate3d(30px,0,0);transform:translate3d(30px,0,0)}
.nav-btn .line3{bottom:0;transform-origin:center 0 0}
.nav-btn.hover .line3{-webkit-transform:translate3d(0,-9px,0) rotate(-45deg);-moz-transform:translate3d(0,-9px,0) rotate(-45deg);transform:translate3d(0,-9px,0) rotate(-45deg);transform-origin:center 2px 0}
.center{position:absolute;width:100%;top:100%;left:0;background:rgba(0,0,0,.8);padding-bottom:5%;display:none}
.center-menu{position:relative;width:100%;top:100%;left:0;margin-bottom:2%}
.center-menu a{width:100%;height:50px;line-height:50px;margin:0;border-bottom:1px solid rgba(51,51,51,.75);display:block}
.right-menu{float:none;width:100%;text-align:center}
.header-in .logo{font-size:20px}
.header-in .logo span{margin-right:10px}
.header-in .logo span:last-child{margin-left:0}
.menu{width:100%;position:absolute;top:50px;left:0;display:none}
.menu li{width:100%;float:none;line-height:30px;font-size:24px;display:block;margin-right:0;padding:20px 0;text-align:center;margin-left:0;border-bottom:1px solid rgba(51,51,51,.75);background:rgba(0,0,0,.8)}
.menu li:last-child{border-bottom-color:transparent}
.header-l{display: block;
    font-size: 20px;
    line-height: 30px;
    color: #fff;
    padding-top: 10px;
    cursor: pointer;
    z-index: 2;}
.header-l:after{content:'';width:17px;height:9px;background:url(https://cdn.haojue.com/bocweb/products/DN150/images/icon.png) no-repeat;display:inline-block;vertical-align:middle;margin-left:12px;background-size:100% 100%}
.header-black .header-l:after{width:17px;height:9px;background:url(https://cdn.haojue.com/bocweb/products/DN150/images/icon2.png) no-repeat;background-size:100% 100%}
.header-black.bgChanged .header-l:after{background:url(https://cdn.haojue.com/bocweb/products/DN150/images/icon.png) no-repeat;width:17px;height:9px;background-size:100% 100%}
.header-r{font-size:20px;line-height:30px;padding-top:10px}
}
@media (max-width:480px){.header-in .logo{font-size:16px;font-weight:400}
.header-in .logo span{margin-right:5px}
.header-in .logo span:after{margin:0 5px}
.menu li{font-size:16px;padding:14px 0}
.header-l{font-size:16px}
.header-l:after{background-size:14px 7px;margin-left:5px}
.header-black .header-l:after{width:14px;height:7px;background-size:14px 7px;margin-left:5px}
.header-black.bgChanged .header-l:after{background:url(https://cdn.haojue.com/bocweb/products/DN150/images/icon.png) no-repeat;width:14px;height:7px;background-size:14px 7px;margin-left:5px}
.header-r{font-size:16px}
.more.page h5{font-size:16px}
}
@media (max-width:420px){.header-in .logo{font-size:16px}
.header-l:after{width:9px;height:5px;background-size:9px 5px}
.header-black .header-l:after{width:9px;height:5px;background-size:9px 5px}
.header-black.bgChanged .header-l:after{background:url(https://cdn.haojue.com/bocweb/products/DN150/images/icon.png) no-repeat;width:9px;height:5px;background-size:9px 5px}
}
@media (max-width:375px){.header-in .logo{font-size:16px}
.header-l,.header-r{font-size:16px}
.menu li{padding:10px 0}
}
@media (max-width:320px){.header-in .logo{font-size:16px}
.header-l,.header-r{font-size:16px}
.menu li{padding:10px 0}
.header-in .logo {
    font-size: 14px;
}
}

.header2 .sub-menu .sec-list p {
    margin-top: 0px !important;
}
.header2 .sub-menu .ulbox .item {
    color: #333;
}
