* {margin: 0;padding: 0;}
img {border: 0;max-width: 100%;vertical-align: top;}
body { color: #0d1018;font-family: Microsoft YaHei,PingFang SC,Helvetica,sans-serif,Arial,Microsoft JhengHei,Helvetica Neue!important;font-size: 14px;line-height: 26px;}
a{text-decoration: none;color: #0d1018;}
a:hover{color: rgba(0,102,255,1);}
li{list-style: none;}
.flex{display: flex;justify-content: space-between;}
.clear{clear: both;}
.left{text-align: left;}
.w1440{max-width: 1440px;margin: 0 auto;}
.center{text-align: center;}

.load{position: fixed;background: #fff;left: 0;top: 0;height: 100%;width: 100%;z-index: 999;display: flex;align-items: center;
animation: load 2s forwards;}
@keyframes load {
from { display: flex;}  
to { display: none; }
}

.top{background: rgba(255, 255, 255, 0.8);position: fixed;top: 0;left: 0;width: 100%;z-index: 9;backdrop-filter: blur(100px);}
.top:hover{backdrop-filter: initial;}
.top_n{align-items: center;}
.nav{font-size: 14px;line-height: 50px;}
.nav ul li a{padding: 0 25px;cursor: pointer;display: block;}
.nav ul li a .iconfont{font-size: 22px;vertical-align: middle;font-weight: normal;}
.nav ul li.on > a{color:rgba(0,102,255,1);font-weight: bold;}
.nav ul li:hover > a{font-weight: bold;}

.language .iconfont{font-size: 12px;padding-left: 6px;}
.language{cursor: pointer;line-height: 50px;}
.language:hover{color: rgba(0,102,255,1);}
.language_n{position: absolute;background: #fff;border-radius: 0 0 4px 4px;max-height: 0;transition: 0.5s;overflow: hidden;margin-left: -15px;box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);}
.language_n a{display: block;line-height: 30px;padding: 0 15px;}
.language:hover .language_n{max-height: 1000px;}
.language_n a:hover{background:#f2f3f7;color:rgba(0,102,255,1);}
.nav ul li .subtitle{position: absolute;left: 0;width: 100%;background: #fff;top: 0;z-index: -1;max-height: 0;overflow: hidden;transition: 1s;}
.nav ul li:hover .subtitle{max-height: 2000px;}
.nav ul li .subtitle::after{content: "";height: 0vh;transition: 1s;display: block;backdrop-filter: blur(10px);position: fixed;width: 100%;pointer-events: none;}
.nav ul li:hover .subtitle::after{height: 100vh;}
.nav ul li .subtitle .w1440{padding-top: 50px;}
.nav ul li .subtitle a{padding: 0 0px;font-weight: normal;}
.nav ul li .subtitle h2{font-size: 20px;font-weight: bold !important;margin-top: 40px;}
.nav ul li .subtitle h2 a{font-weight: bold !important;}
.nav ul li .subtitle h2 i{font-size: 30px;font-weight: normal;vertical-align: sub;}
.nav ul li .subtitle h2 input{outline: 0;font-size: 20px;border: 0;line-height: 30px;padding: 0 10px;}
.subtitle_n li a{display: block;line-height: 36px;font-size: 14px;color: #666;}
.subtitle_n li h3 a{font-size: 20px;font-weight: bold !important;color: #0d1018;}
.subtitle_n li h3{margin-bottom: 10px;margin-top: 5px;}
.subtitle_n li{width: 20%;}
.subtitle_n ul{justify-content: flex-start;}
.subtitle_n{padding-bottom: 100px;}
.subtitle_n li a:hover{color:rgba(0,102,255,1);}
.qlink{color: #666;margin-top: 40px;}
.qlink a{margin-left: 10px;    display: inline-block !important;}

.video{margin-top: 50px;position: relative;color: #fff;}
.video video{width: 100%;object-fit: cover;height: 900px;}

.ptitle{position: absolute;width: 100%;top: 0;left: 0;z-index: 1;height: 100%;}
.ptitle a{color: #fff;}
.ptitle .flex{flex-wrap: wrap;align-content: space-between;height: 100%;}
.title{text-align: center;margin-top: 110px;width: 100%;}
.title h4{font-size: 56px;font-weight: bold;line-height: 60px;}
.title p{font-weight: normal;font-size: 30px;line-height: 36px;margin-top: 10px;}
.title em{font-style: normal;margin-top: 10px;display: block;}

.title.black h4{color: #0d1018;}
.title.black p{color: #0d1018;}
.title.black em{color: #0d1018;}

.button{width: 100%;display: flex;justify-content: center;margin-bottom: 50px;}
.button a{margin: 0 10px;padding: 0 25px;height: 40px;line-height: 40px;border-radius: 40px;transition: all 0.5s;}
.button a.liaoj{background:rgba(0,102,255,1);border: 1px solid rgba(0,102,255,1);}
.button a.gou{border: 1px solid rgba(0,102,255,1);color:rgba(0,102,255,1);}
.button a:first-child{background:rgba(0,102,255,1);border: 1px solid rgba(0,102,255,1);color: #fff;}
.button a:hover{background:rgba(0,102,255,1);color: #fff;transform: scale(1.1);-ms-transform: scale(1.1);}
.button a.vdp{background: rgba(215, 222, 227, 1);color: #0d1018;border: 1px solid rgba(215, 222, 227, 1);}
.button a .iconfont{vertical-align: bottom;margin-right: 5px;}

.products{margin-top: 0.8%;position: relative;overflow: hidden;}
.products .ptitle{height: auto;}
.products .title{margin-top: 70px;}
.products .title h4 {font-size: 40px;line-height: 40px;}
.products .title p{margin-bottom: 30px;font-size: 26px;}
.products img{transition: all 0.5s;height: 714px;object-fit: cover;object-position: center;width: 100vw;}
.products:hover img{transform: scale(1.1);-ms-transform: scale(1.1);cursor: pointer;}
.white{color: #fff;}
.db_products .products{margin:0.8% 0 0 0;width: 49.6%;}
.db_products .products:nth-child(2n){margin-right: 0;}
.db_products{flex-wrap: wrap;}

.foot{background: #f2f3f7;padding: 88px 0 0;margin-top: 0.8%;position: relative;z-index: 8;}
.media i{font-size: 24px;}
.media_n{margin-top: 30px;}
.media_n a{margin-right: 25px;color: #333;display: inline-block;cursor: pointer;}
.media_n a:hover{color:rgba(0,102,255,1);}
.media_n a div{margin-top: 8px;margin-left: -45px;color: #0d1018;line-height: 14px;background: #fff;border-radius: 4px;box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);font-size: 12px;text-align: center;padding: 5px;position: absolute;display: none;}
.media_n a div img{width: 110px;}
.media_n a:hover div{display: block;}
.menu h3{font-size: 14px;font-weight: bold;margin-bottom: 15px;}
.menu a{font-size: 12px;opacity: 0.5;display: block;margin-top: 10px;}
.menu a:hover{opacity: 1;color: #0d1018;}
.copyright{padding: 30px 0;border-top: 1px solid rgb(174, 174, 174);font-size: 12px;opacity: 0.5;margin-top: 88px;}
.copyright .flex div{margin-right: 25px;}
.copyright .flex div a{border-left:1px solid #aeaeae;padding-left: 25px;margin-right: 25px;}

#topBtn {position: fixed;bottom: 30px;right: 30px;padding: 15px 15px;background: #666;color: white;border: none;cursor: pointer;display: none;z-index: 9;border-radius: 50px;}
#topBtn i{transform: rotate(180deg);display: block;}
#topBtn:hover{background: rgba(0,102,255,1);}

.nav_m{display:none;margin-right: 10px;}
.nav_mb{display: none;line-height: 50px;margin-left: 14px;}
.nav_mb i{font-size: 22px;}
.navz .close{display: none;}

@media screen and (max-width: 1450px) {
.w1440{max-width: 90%;}
}
@media screen and (max-width: 1110px) {
.nav ul li a {padding: 0 1.5vw;}
}
@media screen and (max-width: 880px) {
.nav ul li a {padding: 0 1vw;}
}
@media screen and (max-width: 768px) {
.navz{position: fixed;left: -100%;height: 100%;background: #fff;top: 0;width: 100%;z-index: 9;overflow: hidden;transition: all 0.5s;font-size: 18px;font-weight: bold;display: block;line-height: 46px;}
.navz ul li .subtitle{display: none;}
.navz ul{display: block;margin-left: 60px;}
.navz ul li a.serach{display: none;}
.navz ul li a .iconfont {font-size: 26px;}
.navz .close{display: block;}
.nav_m{display: block;}
.nav_mb{display: block;}
.nav_xs .navz{left: 0;}
.close{text-align: right;margin-right: 5%;}
.close .iconfont{font-weight: normal;font-size: 20px;}
.foot .w1440{display: block;}
.button a {margin: 0 5px;padding: 0 15px;}
.db_products .products{width: 100%;}
.title h4 {font-size: 36px;}
.title p{font-size: 20px;}
.video video{height: 90vh;}
.products img{height: 75vh;}
.menu div{max-height: 0;overflow: hidden;transition: 0.5s;}
.menu.on div{max-height: 500px;}
.media{display: flex;justify-content: space-between;margin-bottom: 30px;}
.media img{height: 25px;}
.media_n {margin-top: 0px;}
.media_n a {margin-right: 0;margin-left: 10px;}
.copyright .flex{flex-wrap: wrap;justify-content: center;}
.foot .copyright {padding: 20px 0;margin-top: 30px;line-height: 22px;display: flex;flex-wrap: wrap;justify-content: center;    border-top: 0;}
.copyright .flex div a{padding-left: 15px;margin-right: 15px;}
.copyright .flex div a:first-child{border-left: 0;}
.copyright .flex div{margin: 0 5px;}
#topBtn {bottom: 20px;right: 15px;padding: 10px 10px;}
.foot{padding: 48px 0 0;}
.media_n a div img {width: 100px;height: auto;}
.menu h3{margin-bottom: 10px;}
.menu a{margin-top: 0px;margin-bottom: 10px;}
.menu{border-bottom: 1px solid #eee;margin-bottom: 10px;}
}