*{margin:0;padding:0}
body{background:#fff; font-size:1rem; color:#000; font-family: "宋体";}
a{color: inherit;text-decoration:none}
img{border:0}
li{list-style:none}
.none{text-align:center;}
.fl{float:left;}
.fr{float:right;}


@media(min-width:1200px)and (max-width:30000px){
.w94{ width:98%; margin:auto;}

#header-index{z-index:999; background:#fff; height:100px; position:absolute; position:fixed; width:100%;}
#header-index .logo{overflow:hidden;display:block; position:absolute; left:0; right:0; height:100px; display: flex; flex-wrap:wrap; align-items:center; justify-content: center; font-size:26px;}
#header-index #Menu-btn{overflow:hidden;display:block; position:absolute; left:1%; height:100px; display: flex; flex-wrap:wrap; align-items:center;}
#header-index #Menu-btn dl{}
#header-index #Menu-btn dl p{width:28px; height:1px; background:#333; margin:7px 0px;}
#header-index #Menu-btn-h{display:none; background: none; position:absolute; left:1%; z-index:9999; background:#FFF;}
#header-index #Menu-btn-h img{width:20px; height:20px; overflow:hidden;overflow:hidden; margin-top:39px;}
#header-index #menu{display:none;}
#header-index #menu .daohang{overflow:hidden; background-color:#fff; height:100px; position:absolute; left:1%; z-index:999 !important; padding-left:20px;}
#header-index #menu .daohang li{float:left; line-height:100px; margin-left:40px; font-size:19px;}

#header{z-index:999; background:#fff; height:100px; position:absolute; position:fixed; width:100%;}
#header .logo{overflow:hidden;display:block; position:absolute; left:0; right:0; height:100px; display: flex; flex-wrap:wrap; align-items:center; justify-content: center; font-size:26px;}
#header #Menu-btn{overflow:hidden;display:block; position:absolute; left:1%; height:100px; display: flex; flex-wrap:wrap; align-items:center;}
#header #Menu-btn dl{}
#header #Menu-btn dl p{width:28px; height:1px; background:#333; margin:7px 0px;}
#header #Menu-btn-h{background:#fff; position:absolute; left:1%; z-index:9999; background:#FFF;}
#header #Menu-btn-h img{width:20px; height:20px; overflow:hidden;overflow:hidden; margin-top:39px;}
#header #menu{}
#header #menu .daohang{overflow:hidden; background-color:#fff; height:100px; position:absolute; left:1%; z-index:999 !important; padding-left:20px}
#header #menu .daohang li{float:left; line-height:100px; margin-left:40px; font-size:19px; color:#999;}

.active{ color:#000;}

.hrang{ height:100px; overflow:hidden;}

/* banner */
.focusBox { position: relative; width:98%; margin:auto; height:100vh; overflow: hidden;}
.focusBox .pic{ position:relative; height:95vh; z-index:0;}
.focusBox .pic img {width:100%; height:95vh; display: block; object-fit: cover;}
.focusBox .pic p{ font-size:16px; color:#000; line-height:5vh;}
.focusBox .pic p span{ margin-left:60px; color:#999;}
.focusBox .pic p span:hover{color:#000;}
.focusBox .hd { width:100%; position: absolute; bottom:8vh; text-align: center; z-index:1; display: flex; flex-wrap:wrap; align-items:center; justify-content: center;}
.focusBox .hd li{height:5px; overflow: hidden; width:100px; background: rgba(100%,100%,100%,0.4); margin:0px 5px;}
.focusBox .hd .on{ background:#000;}

.index1{overflow:hidden; width:60%; margin:auto; margin-top:140px;}
.index1 dl{ width:100%;}
.index1 dl dt{ position:relative; padding-bottom:60%;}
.index1 dl dt img{ position:absolute; width:100%; height:100%; object-fit: cover;}
.index1 dl p{ margin-top:15px;}
.index1 dl p span{margin-left:60px; color:#999;}
.index1 dl p span:hover{color:#000;}

.index2{overflow:hidden; width:98%; margin:auto;}
.index2 dl{ width:100%; margin-top:140px;}
.index2 dl dt{ position:relative; padding-bottom:60%;}
.index2 dl dt img{ position:absolute; width:100%; height:100%; object-fit: cover;}
.index2 dl p{ margin-top:15px;}
.index2 dl p span{margin-left:60px; color:#999;}
.index2 dl p span:hover{color:#000;}
.index2 dl:nth-child(1){ width:75%; margin:auto; margin-top:140px;}
.index2 dl:nth-child(3), .index2 dl:nth-child(5){ width:61%; margin:auto; margin-top:140px;}

.index3{overflow:hidden; width:100%; margin:auto;}
.index3 dl{ width:100%; margin-top:140px;}
.index3 dl dt{ position:relative; padding-bottom:60%;}
.index3 dl dt img{ position:absolute; width:100%; height:100%; object-fit: cover;}
.index3 dl p{width:98%; margin:auto; margin-top:15px;}
.index3 dl p span{margin-left:60px; color:#999;}
.index3 dl p span:hover{color:#000;}

.foot{width:98%; overflow:hidden; display: flex; flex-wrap:wrap; align-items:center; margin-left:1%; margin-top:10vh; margin-bottom:2vh; font-size:14px;}
.foot dl{ margin-right:50px;}
.foot ul{display: flex; flex-wrap:wrap; align-items:center;}
.foot ul li{ font-size:14px; margin-right:30px;}
.foot ul li:hover{ opacity:0.4;}

.about-txt{display: flex; flex-wrap:wrap; align-items:center;width:88%; margin:auto;}
.about-txt dl{ margin-right:40px; color:#999;}

.aboutus{overflow:hidden; width:950px; margin:auto; margin-top:80px; display: flex; flex-wrap:wrap; align-items:center; justify-content: space-between;}
.aboutus .fl{ width:350px;}
.aboutus .fl img{ width:100%;}
.aboutus .fr{width:550px;}
.aboutus .fr dt{ font-size:30px;}
.aboutus .fr dd{ font-size:16px; margin-top:30px; line-height:30px;}

.about{width:600px; margin:auto; margin-top:80px;}
.about p{font-size:1rem; line-height:30px; margin-bottom:20px;}
.about h6{ font-size:1rem; margin-bottom:10px;}
.about h5{ font-size:1.1rem; margin-bottom:10px;}
.about h4{ font-size:1.2rem; margin-bottom:10px;}
.about h3{ font-size:1.3rem; margin-bottom:15px;}
.about h2{ font-size:1.4rem; margin-bottom:15px;}
.about h1{ font-size:1.5rem; margin-bottom:15px;}
.about img{ width:100%;}

.newslist {column-count:2;column-gap:10rem; margin-left:3rem; margin-right:3rem;}
.newslist dl {break-inside: avoid-column; padding-top:2.5rem;}
.newslist dl dt{ position:relative;}
.newslist dl dt img{width: 100%;  display: block;}
.newslist dl dd{margin-top:15px;}
.newslist dl p{color:#999; margin-top:15px;}
.newslist dl p:hover{color:#000;}

.productlist {column-count:3;column-gap:5rem; margin-left:3rem; margin-right:3rem;}
.productlist dl {break-inside: avoid-column; padding-top:2.5rem;}
.productlist dl dt{ position:relative;}
.productlist dl dt img{width: 100%;  display: block;}
.productlist dl dd{margin-top:15px;}
.productlist dl p{color:#999; margin-top:15px;}
.productlist dl p:hover{color:#000;}

.news{ width:98%; margin:auto; overflow:hidden; margin-top:0px; display: flex; flex-wrap:wrap; justify-content: space-between;}
.news .fl{ width:100%;}
.news .fl dt{width:900px; margin:auto;}
.news .fl dt img{ width:100%;}
.news .fl li{width:900px; margin:auto; margin-top:15px; font-size:20px;}
.news .fl li span{ margin-left:10px; color:#666;}
.news .fl dd{ width:900px; margin:auto; margin-top:30px;}
.news .fl dd p{ margin-bottom:20px; line-height:30px;}
.news .fl video{ width:100%; height:100%;}
.news .img {width:90%; column-count:3; column-gap:5rem; margin:auto;}
.news .img dl {break-inside: avoid-column; padding-top:3rem;}
.news .img dl dt{ position:relative;}
.news .img dl dt img{width: 100%;  display: block;}

.product{width:98%; margin:auto; overflow:hidden; margin-top:40px;}
.product .txt dt{ font-size:20px;}
.product .txt dt span{ color:#666; margin-left:10px;}
.product .txt dd{ width:1000px; margin-top:20px;}
.product .txt dd p{ margin-bottom:20px; line-height:26px;}
.product .txt dd video{ width:100%; height:100%;}

.gallery {max-width:98%;margin: 0 auto; column-count:3;column-gap:5rem;}
.thumbnail {width: 100%;object-fit: cover;transition: transform 0.3s; break-inside: avoid-column; margin-top:3rem;}
.thumbnail:hover {transform: scale(1.03);}
.modal {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(255,255,255,1);z-index: 100;align-items: center;justify-content: center; z-index:9999999999999999999999999999999;}
.modal-content {max-width: 90%;max-height:90%;}
.modal-img {max-width:1000px;max-height:90vh;display: block;margin: 0 auto;}
.close {position: absolute;top:20px;right: 30px;color:#000;font-size:30px;cursor: pointer;}
.prev, .next {position: absolute;top: 50%;width: auto;padding: 16px;margin-top: -22px;color: white;font-weight: bold;font-size: 24px;cursor: pointer;user-select: none; color:#000; border-radius: 50%;}
.next {right: 20px; transition:0.5s all;}
.next:hover{right:10px; transition:0.5s all;}
.prev {left: 20px; transition:0.5s all;}
.prev:hover{left: 10px; transition:0.5s all;}
.caption { color: white;text-align: center;padding: 10px;font-size: 18px;}

.toolbar {width:45px;position:fixed; right:1%; bottom:3vh; z-index:999;}
.toolbar dd {width:45px; height:45px; margin-bottom:3px; position:relative; background:#000; text-align:center; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; color:#FFF; font-size:14px; border-radius:100%;}
}

@media only screen and (max-width:1200px){
.w94{ width:94%; margin:auto;}

#header-index{z-index:999; background:#fff; height:3rem; position:absolute; position:fixed; width:100%;}
#header-index .logo{overflow:hidden;display:block; position:absolute; left:0; right:0; height:3rem; display: flex; flex-wrap:wrap; align-items:center; justify-content: center; font-size:1.3rem;}
#header-index #Menu-btn{overflow:hidden;display:block; position:absolute; left:3%; height:3rem; display: flex; flex-wrap:wrap; align-items:center;}
#header-index #Menu-btn dl{}
#header-index #Menu-btn dl p{width:1.5rem; height:1px; background:#333; margin:7px 0px;}
#header-index #Menu-btn-h{display:none; background: none; position:absolute; left:3%; width:3rem; z-index:9999; background:#FFF;}
#header-index #Menu-btn-h img{width:1.4rem; height:1.4rem; overflow:hidden;overflow:hidden; margin-top:0.8rem;}
#header-index #menu{display:none;}
#header-index #menu .daohang{overflow:hidden; background-color:#fff; position:absolute; top:3rem; left:0; right:0; z-index:999 !important; padding-bottom:1rem;}
#header-index #menu .daohang li{float:none; line-height:2.5rem; font-size:1.1rem; width:94%; margin:auto;}

#header{z-index:999; background:#fff; height:3rem; position:absolute; position:fixed; width:100%;}
#header .logo{overflow:hidden;display:block; position:absolute; left:0; right:0; height:3rem; display: flex; flex-wrap:wrap; align-items:center; justify-content: center; font-size:1.2rem;}
#header #Menu-btn{overflow:hidden;display:block; position:absolute; left:3%; height:3rem; display: flex; flex-wrap:wrap; align-items:center;}
#header #Menu-btn dl{}
#header #Menu-btn dl p{width:1.5rem; height:1px; background:#333; margin:7px 0px;}
#header #Menu-btn-h{background:#fff; position:absolute; left:3%; width:3rem; z-index:9999; background:#FFF;}
#header #Menu-btn-h img{width:1.4rem; height:1.4rem; overflow:hidden;overflow:hidden; margin-top:0.8rem;}
#header #menu{display:none;}
#header #menu .daohang{overflow:hidden; background-color:#fff; position:absolute; top:3rem; left:0; right:0; z-index:999 !important; padding-left:3%; padding-bottom:1rem;}
#header #menu .daohang li{float:none; line-height:2.5rem; font-size:1.1rem; color:#999;}

.active{ color:#000;}

.hrang{ height:3rem; overflow:hidden;}

/* banner */
.focusBox {overflow: hidden; width:94%; padding-left:3%;}
.focusBox .pic{z-index:0; }
.focusBox .pic img { width:100%; height:25rem; display: block; object-fit: cover;}
.focusBox .pic p{ font-size:1rem; color:#000; line-height:3rem;}
.focusBox .pic p span{ margin-left:60px; color:#999;}
.focusBox .pic p span:hover{color:#000;}
.focusBox .hd { width:100%; text-align: center; z-index:1; display: flex; flex-wrap:wrap; align-items:center; justify-content: center;}
.focusBox .hd li{height:8px; overflow: hidden; width:8px; background:#999; margin:0px 5px; border-radius:100%;}
.focusBox .hd .on{ background:#000;}

.index1{overflow:hidden; width:94%; margin:auto; margin-top:4rem;}
.index1 dl{ width:100%;}
.index1 dl dt{ position:relative; padding-bottom:60%;}
.index1 dl dt img{ position:absolute; width:100%; height:100%; object-fit: cover;}
.index1 dl p{ margin-top:1rem;}
.index1 dl p span{margin-left:60px; color:#999;}
.index1 dl p span:hover{color:#000;}

.index2{overflow:hidden; width:94%; margin:auto;}
.index2 dl{ width:100%; margin-top:4rem;}
.index2 dl dt{}
.index2 dl dt img{width:100%;}
.index2 dl p{ margin-top:1rem;}
.index2 dl p span{margin-left:60px; color:#999;}
.index2 dl p span:hover{color:#000;}

.index3{overflow:hidden; width:100%; margin:auto;}
.index3 dl{ width:100%; margin-top:4rem;}
.index3 dl dt{}
.index3 dl dt img{width:100%; height:100%;}
.index3 dl p{width:94%; margin:auto; margin-top:1rem;}
.index3 dl p span{margin-left:2rem; color:#999;}
.index3 dl p span:hover{color:#000;}

.foot{width:94%; overflow:hidden; display: flex; flex-wrap:wrap; align-items:center; margin-left:3%; margin-top:4rem; margin-bottom:2vh; font-size:14px;}
.foot dl{ margin-right:2rem; width:100%; margin-bottom:1rem;}
.foot ul{display: flex; flex-wrap:wrap; align-items:center; width:100%;}
.foot ul li{font-size:14px; margin-right:1rem;}
.foot ul li:hover{ opacity:0.4;}

.toolbar {width:2.5rem;position:fixed; right:1%; bottom:1rem; z-index:999;}
.toolbar dd {width:2.5rem; height:2.5rem; margin-bottom:3px; position:relative; background:#fff; text-align:center; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; color:#000; font-size:0.9rem; border-radius:100%;}

.about-txt{display: flex; flex-wrap:wrap; align-items:center;width:94%; margin:auto;}
.about-txt dl{margin-right:1.5rem; color:#999; margin-bottom:0.6rem; font-size:0.9rem;}

.aboutus{overflow:hidden; width:94%; margin:auto; margin-top:1rem; display: flex; flex-wrap:wrap; align-items:center; justify-content: space-between;}
.aboutus .fl{ width:100%;}
.aboutus .fl img{ width:100%;}
.aboutus .fr{width:100%; margin-top:1rem;}
.aboutus .fr dt{ font-size:1.2rem;}
.aboutus .fr dd{ font-size:0.9rem; margin-top:1rem; line-height:1.6rem;}

.about{width:94%; margin:auto; margin-top:2rem;}
.about p{font-size:0.9rem; line-height:1.6rem; margin-bottom:1rem;}
.about h6{ font-size:1rem; margin-bottom:1rem;}
.about h5{ font-size:1.1rem; margin-bottom:1rem;}
.about h4{ font-size:1.2rem; margin-bottom:1rem;}
.about h3{ font-size:1.3rem; margin-bottom:1rem;}
.about h2{ font-size:1.4rem; margin-bottom:1rem;}
.about h1{ font-size:1.5rem; margin-bottom:1rem;}
.about img{ width:100%;}

.newslist { width:94%; margin:auto;}
.newslist dl{ margin-top:1rem;}
.newslist dl dt{}
.newslist dl dt img{width: 100%;  display: block;}
.newslist dl dd{margin-top:1rem;}
.newslist dl p{color:#999; margin-top:0.7rem;}
.newslist dl p:hover{color:#000;}

.news{ width:94%; margin:auto; overflow:hidden; margin-top:1rem; display: flex; flex-wrap:wrap; justify-content: space-between;}
.news .fl{ width:100%;}
.news .fl dt{width:100^; margin:auto;}
.news .fl dt img{ width:100%;}
.news .fl li{width:100%; margin:auto; margin-top:1rem; font-size:1.2rem;}
.news .fl li span{ margin-left:1rem; color:#666;}
.news .fl dd{ width:100%; margin:auto; margin-top:1rem;}
.news .fl dd p{ margin-bottom:1rem; line-height:1.6rem;}
.news .fl video{ width:100%; height:100%;}

.gallery {max-width:100%}
.thumbnail {width: 100%;transition: transform 0.3s; margin-bottom:2rem;}
.thumbnail:hover {transform: scale(1.03);}
.modal {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(255,255,255,1);z-index: 100;align-items: center;justify-content: center; z-index:9999999999999999999999999999999;}
.modal-content {max-width:94%;max-height:90%;}
.modal-img {max-width:100%;max-height:90vh;display: block;margin: 0 auto;}
.close {position: absolute;top:1rem;right: 1rem;color:#000;font-size:30px;cursor: pointer;}
.prev, .next {position: absolute;top: 50%;width: auto;padding: 16px;margin-top: -22px;font-weight: bold;font-size: 24px;cursor: pointer;user-select: none; color:#fff; border-radius: 50%;}
.next {right:0.5rem; transition:0.5s all;}
.next:hover{right:0rem; transition:0.5s all;}
.prev {left:0.5rem; transition:0.5s all;}
.prev:hover{left:0rem; transition:0.5s all;}
.caption { color: white;text-align: center;padding: 10px;font-size: 18px;}

.productlist { width:94%; margin:auto;}
.productlist dl { margin-bottom:2rem;}
.productlist dl dt{ position:relative;}
.productlist dl dt img{width: 100%;  display: block;}
.productlist dl dd{margin-top:1rem;}
.productlist dl p{color:#999; margin-top:0.7rem;}
.productlist dl p:hover{color:#000;}

.product{width:94%; margin:auto; overflow:hidden; margin-top:2rem;}
.product .txt dt{ font-size:20px;}
.product .txt dt span{ color:#666; margin-left:10px;}
.product .txt dd{ width:1000px; margin-top:20px;}
.product .txt dd p{ margin-bottom:20px; line-height:26px;}
.product .txt dd video{ width:100%; height:100%;}
}