html, body {
    margin: 0;
    padding: 0;
}

IMG {
    border-width: 0;
}

* {
    list-style-type: none;
    margin: 0;
    padding: 0;
    font-family:"HarmonyOS";
}
@font-face{
    font-family:"HarmonyOS";
    src: url(../font/HarmonyOS_Sans_SC_Regular.ttf)
}
@font-face{
    font-family:"HarmonyOS_light";
    src: url(../font/HarmonyOS_Sans_SC_Light.ttf);
}
a {
    text-decoration: none !important;
    color: #555
}

a:hover {
    text-decoration: none;
}

.banner{width: 100%;margin:0 auto}
.banner img{display: block;width: 100%;height: auto}
.clear{clear:both}
.banner .swiper-pagination-bullet-active {
    background: #fff!important;
}

.banner .swiper-pagination-clickable .swiper-pagination-bullet {
    background: #fff;width: 10px;height: 10px;
}

.banner .swiper-button-next:after, .pck .swiper-button-prev:after {
    color: #fff!important;
}

@media (min-width: 768px) {
    .language{font-size:1rem;text-align: right;width: 95%;margin:15px  auto 0;font-family:  "HarmonyOS_light"}
    .navbar-nav{font-size: 1.125rem;
        display: flex;justify-content: space-between;width: 100%;margin-left:2rem;align-items: center}
    .navbar-nav a{color:#333}
    .navbar-nav .nav-item{display: flex;}
    .dropdown-menu {font-size: 1rem;
        --bs-dropdown-link-active-bg:#fff!important;}
    .logo{height: 4rem;max-width: 100%;margin-left: 5%}
    .nav-item .dropdown-menu li{text-align: center;
    a{display: block}
    }
    .navbar-nav li:last-child{margin-right: 3.5rem}
    .search-width{width: 350px}

    .navbar-nav .dropdown li{font-size: .9rem;font-family:  "HarmonyOS_light";background: #fafafa;margin-bottom: 2px;
    a{padding: 3px 0}
    }
    .navbar-nav .dropdown li:last-child{margin-right: 0}

    .search-box{border-radius:50px;padding-left: 10px;width: 100%;
        background: #efefef;overflow: hidden;height: 2.5rem;justify-content: space-between;align-items: center}
    .search-box img{width: 20px;height: auto}
    .search-box input{width: calc(100% - 115px);border: none;background: transparent;font-size: .85rem;line-height: 1.9rem;outline: none;padding: .25rem 0}
    .search-button{width: 80px;font-size: .85rem;background: #547f6c;border-radius: 50px;line-height: 2.5rem;border: none;
        text-align: center;color: #fff;float: right;}
    /*product*/
    .category{max-width: 1200px;padding:0 1rem;margin:80px auto}
    .category-head{font-size: 2rem;color: #141414;font-weight: bold;text-align: center;margin-bottom: 1rem}
    .category-subhead{font-size: 1rem;color:#333;text-align: center}
    .category .info{transition: all .3s;
    .ctz{margin-top:1rem;display: block}
    }
    .category ul{display: flex;justify-content: space-between;margin:50px auto}
    .category li{width:29%;display:flex;align-content: space-between;flex-wrap: wrap;
    h3{font-size:1.2rem;color: #141414;margin-bottom: 1rem}
        article{font-size: .9rem;line-height: 1.5rem;color: #141414;font-family:"HarmonyOS_light";}
        p{font-family:"HarmonyOS_light";display: inline}
    }
    .category-icon{width: 100%;margin:40px auto;transition: all .3s;
        a{display: flex;justify-content: center;flex-wrap: wrap;align-items: center;text-align: center;flex-direction: column}
        img{width: 80px;height: auto;display: block;margin:0 auto}
        .title{font-size: 1rem;display: inline-flex;padding: .2rem 1rem;
            text-align: center;line-height:1.6rem;margin:10px auto;background: #537F6C;border-radius: 50px;color: #fff}
    }
    /*.category li:hover{*/
    /*    .info{transform: translateY(5px)}*/
    /*    h3{color: #0f5132;font-weight: bold}*/
    /*.category-icon{transform: translateY(-5px);*/
    /*.title{background: #537F6C;}*/
    /*}*/
    /*}*/
    /*Industrial lights*/
    .industrial-box{background:#ededed;overflow: hidden;}
    .industrial{max-width: 1200px;margin:80px auto 60px;overflow: hidden;display: flex;justify-content: space-between;align-items: stretch;padding: 0 1rem;
        .left{width: 25%;float: left;display: flex;align-content: space-between;flex-direction: column;justify-content: space-around;
            .left-title{font-size: 2rem;color: #537F6C;line-height: 2.8rem;font-weight: 700;margin-bottom: 20px;
            span{display: block}
            }
            .left-subtitle{font-size: 1rem;color:#141414;line-height: 1.5rem;font-family:"HarmonyOS_light";margin-top: 1.5rem}
        }
        .right{width: 70%;float: right}
        .right ul{padding: 0}
    }
    .more{border: solid 1px #A79D93;overflow: hidden;display: flex;width: 170px;margin-bottom: 20px;align-items: center;transition: all .3s}
    .more-l{background: #B7AEA5;color: #fff;font-size: 1rem;border-right: solid 1px #A79D93;padding: 10px 0;font-family:"HarmonyOS_light";
        width: 135px;text-align: center;text-transform: uppercase}
    .more-r{text-align: center;width: 35px;color:#A79D93; }
    .more:hover{background: #A79D93;transform: translateX(5px);
        .more-r{color: #fff;}
    }
    .img-box{overflow: hidden}
    .img-box img{transition: all .3s}
    .pro-bg{background: #fff;position: relative;padding-bottom: 3px;margin-bottom: 15px;height:365px;border:1px solid #ffffff}
    .pro-bg a{color: #537f6c}
    .pro-more{padding:2px;border-radius: 2rem;position: absolute;transition:all .3s;
        right: 5%;bottom: -10px;z-index: 9;background: #0f5132;display: flex;align-items: center;justify-content: space-between}
    .pro-more-r{width: 2.1rem;height: 2.1rem;background: #fff;border-radius: 4rem;background: #fff;display: flex;justify-content: center;font-size: 1.4rem}
    .pro-more-l{color: #fff;padding-left: 10px;font-size: .9rem;display: none;transition:all .3s;}

    .por-title{width: 90%;margin:10px auto 25px;
        .title{font-size: 1.1rem;color: #141414;width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
        .subtitle{font-size:.9rem;color: #141414;font-family:  "HarmonyOS_light";width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
        .subtitle:after{width:2rem;height: 3px;background: #547f6c;content: "";display: block;margin: 5px 0}
    }
    .industrial .right li:hover{
        .img-box img{transform:scale(1.1)}
        .por-title .title{color: #0f5132}
        .pro-more{
            width: 110px;
            .pro-more-l {
                display: block;
                font-size: 1rem;
            }
        }
    }
    .ufo-box{max-width: 1200px;padding:0 15px;margin:60px auto;display: flex;justify-content: space-between}
    .ufo-box-l{width:56%;padding: 30px;
        float: left;background: url("../images/ufo-bg.jpg") no-repeat center center;position: relative;
        img{float: right;margin-top: 15px;height: auto}

    }
    .ufo-box-r{width: 40%;display: flex;flex-direction: column;justify-content: center;padding-left: 3rem}
    .ufo-box-title{font-size: 2rem;color: #537F6C;line-height: 2.5rem;font-weight: 700;margin-bottom: 20px;
            span{display: block}}
    .ufo-box-subtitle{font-size: 1rem;color:#141414;line-height: 1.5rem;font-family:"HarmonyOS_light";margin-top: 1.5rem}
    .ufo-box-r  .more{margin-top: 50px}
    .popular{background:#ededed;padding: 50px 0;width: 100%;margin:90px auto 0}
    .popular-head{font-size: 2rem;color: #547f6c;font-weight: 700;text-align: center;text-transform: uppercase;margin-top: 15px}
    .popular-box{max-width: 1200px;padding: 0 15px;overflow: hidden;margin:50px auto 20px}
    .popular ul{padding: 0}
    .popular-box li:hover{
        .img-box img{transform:scale(1.1)}
        .por-title .title{color: #0f5132}
        .pro-more{
            width: 110px;
            .pro-more-l {
                display: block;
                font-size: 1rem;
            }
        }
    }
    .popular-more{margin:3rem auto 0;overflow: hidden;
    .more{margin:0 auto}
    }
    .office-box{width: 100%;overflow: hidden;position: relative}
    .office-content{position: absolute;width: 100%;top:0;bottom: 0}
    .office-font{width: 1200px;margin:0 auto;height: 65%;
        .office-l{ max-width: 700px;padding-left: 2rem;height: 100%;display: flex;align-content: space-between;flex-wrap:wrap;
        .left{height: 100%;display: flex;align-content: space-between;flex-wrap:wrap;}
        .office-nav{width: 100%;margin: 3rem auto 4rem;overflow: hidden}
        .office-nav ul{padding: 0}
        .office-nav li{width: 30%;float: left;font-size: 1.1rem;}
        .office-nav li a{color: #537F6C}
        .left-h2{font-size: 2rem;color: #537F6C;font-weight: 700;width: 100% }
        .left-article{font-size: 1rem;line-height: 1.5rem;color:#141414;width: 100%;margin:3rem auto;padding-right: 40%;font-family: "HarmonyOS_light"}
    }

    }


    .office-r{width: 42%;float: right}
    .office-r img{width: 100%;max-height:900px;object-fit: cover}
    .bottom-box{background:#537F6C;overflow: hidden;padding: 7rem 1rem;position: relative}
    .box{max-width: 1200px;margin:0 auto;padding: 0 1rem}
    .bottom-l{max-width: 40%;float: left;padding-left: 1rem}
    .bottom-r{width: 42%;float: right;position: absolute;right:0;top:0;bottom: 0;padding-top: 7rem}
    .bottom-h2{font-size: 1.5rem;color: #fff;margin:1rem auto}
    .bottom-li{font-size: .9rem;color: #fff;line-height: 1.5rem;font-family: "HarmonyOS_light";
    span{display: block;font-family: "HarmonyOS_light";}
    }
/*    inner-page*/
    .inne-position{width: 100%;background:#547f6c37;overflow: hidden;margin:1rem auto;
    .position{max-width: 1200px;margin:0 auto;padding: 10px 1rem;color: #396c56;font-size: .95rem;display: flex;align-items: center;
        img{height: 25px;width: auto;margin-right:10px}
        a{color: #396c56;margin:0 3px; }
    }
    }
    .list-pro{margin:4rem auto;max-width: 1200px;padding: 0 1rem;min-height: 500px;
        display: flex;justify-content: space-between}
    .list-pro .left{width:300px;padding-right: 25px;border-right: solid 1px #eee}
    .list-pro .right{width: calc(100% - 320px)}
    .list-pro .right img{transition: all .3s}
    .list-pro-bg{border-radius: 10px;border:solid 1px #eee;width: 98%;margin:5px auto;overflow:hidden;

    }
    .list-pro .right-title{
        width:92%;font-size: 1rem;margin:5px auto 2rem;
        h2{font-size: 1rem;color: #141414;line-height: 1.8rem;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-weight:bold}
        .subtitle{font-size: .9rem;color: #555;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-family: "HarmonyOS_light";}
    }
    .list-pro li{margin-bottom:1rem}

    .list-pro .right li:hover {
        img{transform:scale(1.1)}
        .right-title h2{color: #396c56}
    }
    .pro-category{width: 100%}
    .pro-category ul{padding-left: 0}
    .pro-category li{font-size: 1rem;}
    .pro-category li a{display: flex;justify-content: space-between;align-items: center;padding:10px 0 10px 20px;color: #141414;}
    .pro-category .name{width: 92%}
    .pro-category li a.active{color: #537F6C;background: linear-gradient(to right,#dcdcdc,#fff);border-radius: 35px;padding:10px 0 10px 20px;}
    .pro-category li:hover a{color: #537F6C;background: linear-gradient(to right,#dcdcdc,#fff);border-radius: 35px;padding:10px 0 10px 20px;}
    .pro-box{max-width: 1200px;padding: 0 1rem;margin:40px auto;overflow: hidden}
    .scroll-box{width:48%;float: left}
    .scroll-box .swiper-slide {
        text-align: center;
        font-size: 14px;
        background: #fff;
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
        flex-wrap:wrap;
        margin-top:10px

    }
    .scroll-box .mySwiper2{margin-bottom: 30px}
    .mySwiper .swiper-slide {
      /*  width: 25%;*/
        opacity: 1;
        cursor: pointer;
    }

    .mySwiper .swiper-slide-thumb-active {
        opacity: 1;
    }
    .mySwiper .swiper-slide-thumb-active img {
       border:solid #537f6c63 1px;
    }
    .swiper-slide img {
        display: block;
        width: 99%;
        height: 100%;
        object-fit: cover;
        border: solid 1px #eee;
    }
    .swiper-thumbs img{border: solid 1px #eee;}
    .swiper-thumbs {}
    .scroll-box .swiper-button-next:after{color: #000}
    .scroll-box .swiper-button-prev:after{color: #000}
    .detail-r{width:46%;float: right}
    .detail-subtitle{font-size: 1rem;color: #8e8e8e;margin-top: 35px}
    .detail-title{font-size: 2rem;color: #537F6C;margin:10px auto 25px}
    .detail-summary{font-size: 1rem;color: #333;line-height: 1.6rem;}
    .color-head{font-size: 1.2rem;color:#111;line-height: 1.5rem;margin-top: 40px }
    .pro-color{background: #efefef;width: 75%;padding: 25px 15px 15px 25px;margin-top: 25px}
    .color-title{color: #000;font-size: 1rem;}
    .color-box{width: 100%;overflow: hidden;margin:20px auto;}
    .color-box li{width: 20%;float: left}
    .color-group{display: inline-block}
    .color-block{width:50px;height: 50px;border-radius: 50px;border: solid 2px #000;overflow:hidden;}
    .color-block img{width:50px;height:50px;}
    .color-box p{font-size: .9rem;color: #333;text-align: center;margin-top:10px}
    .temperature100{width: 98%;margin:10px 0}
    .temperature100 ul{padding: 0;}
    .temperature100 li{text-align: center;padding: 3px 5px;margin: 2px 0}
    .temperature100 li span{background: #fff;line-height: 2rem;width: 100%;display: block;font-size: .85rem}
    .detail-content{margin:25px auto;font-size:1rem;line-height: 1.8rem;
        overflow: hidden;max-width: 1200px;padding: 0 1rem}
    .detail-content h2{margin:20px auto 15px;font-size: 1.2rem;}
    .detail-content img{max-width: 100%;}
    .detail-content table{width: 100% !important;margin: 10px auto 15px;display: inline-table}
    .detail-content table tr td{border: solid 1px #999;text-align: center;padding: 3px 0 }
    .detail-content table tr:nth-child(odd){background: #E8EAE9}
    .detail-content table tr td:first-child{border-left: none}
    .detail-content table tr td:last-child{border-right: none}
    .syp {
        width: 100%;
        font-size: 15px;
        color: #333;
        background: #fafafa;
        padding: 5px 0
    }

    .syp a {
        color: #555
    }

    .syp ul {
        overflow: hidden;
        max-width: 1200px;
        margin: 15px auto;
        padding: 0 1rem;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap
    }

    .syp li {
        width: 48%;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        overflow: hidden
    }

    .syp li:nth-child(2) {
        width: 48%;
        text-align: right
    }
/*about us*/
    .about-banner{width: 100%;display: flex;padding:0 !important;}
    .banner-l{width: 50%;display: flex;
       img{width: 100%;height: auto;object-fit: cover}}
    .banner-r{width: 100%;background: #dbdbdb;display: flex;align-items: center;
        .title-box{width:430px;padding-left: 68px;box-sizing: border-box;
        .title{font-size: 1.5rem;font-weight: 700;margin-bottom: 2rem}
            .article{font-size: 1rem;
            span{display: block;margin: 1rem auto}
            }
        }
    }
    .about-choose{max-width: 1200px;padding:0 1rem;margin:60px auto}
    .choose-title{font-size: 1.2rem;font-weight: bold;margin-bottom: 1rem}
    .choose-box{width: 100%;margin:10px auto;display: flex;justify-content: space-between}
    .choose-box li{width: 41%;font-size: 1rem;line-height: 1.6rem;text-align: justify}
    .choose-box li:last-child{width: 37%}
    .factory-title{text-align: center;font-size: 2rem;font-weight: bold;margin: 25px auto 10px;color: #537f6c}
    .factory-box{max-width: 92%;margin:40px auto;}
    .factory-box .swiper-button-prev::after{color:#fff }
    .factory-box .swiper-button-next::after{color:#fff }
    .about-bottom{width: 100%;display: flex;}
    .about-l{width: 50%;
        img{width: 100%;object-fit: cover}

    }
    .about-r{width:50%;background: #537f6c;display: flex;align-items: center;
        .title-box{width:100%;box-sizing: border-box;
            .title{font-size: 2.5rem;font-weight: 700;margin-bottom: 2rem;text-align: center;color: #fff;line-height: 2.8rem;
                span{display: block;}
            }
            .article{font-size: 1.2rem;width: 45%;margin:25px auto;font-family:"HarmonyOS_light";color: #fff;text-align: center;
            }
        }
    }

/*表单*/
.lxbdk{margin:60px auto;}
.nybt h1{margin: 0;font-size: 2rem;color: #141414;font-weight: bold;line-height:80px;text-align: center;}
.nybt{margin: 50px auto;}
.lxk{margin:40px auto;overflow: hidden;}
.srky{width: 30%; float:left;margin-right:5%;}
.srk0{width: 30%; float:left;}
.srky input,.srk0 input{width: 100%;height:54px;background: #f7f7f7;border: 1px solid #f3f3f3;padding:0 5px;margin-bottom:30px;border-radius: 5px;}
.lyk{width: 100%;float: left;}
.lyk textarea{width: 100%;min-height:80px;background:#f7f7f7;border: 1px solid #f3f3f3;padding:0 5px;margin-bottom:30px;}
.yzm{width: 65%;float: left;}
.tjan{width:30%;line-height: 56px;text-align: center;font-size: 14px;background:#547f6c;border-radius: 5px;color: #fff}
.tjan a{color: #fff;cursor: pointer;}
.lxkn input:focus,.lxkn textarea:focus {
    border:none; /* 2px宽，实线，红色 */
    border: 1px solid #547f6c;
}
.lxkn input:focus,.lxkn textarea:focus {outline: none;}
/*联系我们*/
.joink{width: 100%;background:#dbdbdb;padding:5px 0 40px;}
.lxwmk{width: 80%;margin: 15px auto;overflow: hidden;}
.lxleft{width: 50%;float: left;border-right: 1px solid #c7c7c7;}
.lxleft h1,.lxright h1{font-size: 1.8rem;line-height: 40px;color: #333;text-align: center;}
.lxleft article{font-size: 1.2rem;font-family:"HarmonyOS_light";color: #555;text-align: center;}
.lxleft ul{display: flex;align-items: center;justify-content:center;margin-top: 20px;}
.lxleft ul li{margin: 0 10px;}
.lxleft ul li img{border-radius: 100px;}
.lxright{width: 50%;float: right;}
.dhyxk{text-align: center;}
.lxright .dhyxk a{font-size: 1.2rem;font-family:"HarmonyOS_light";color: #555;text-align: center;margin-right: 15px; }
.lxan{width: 148px;margin: 15px auto;line-height: 42px;text-align: center;border: 1px solid #333;color: #333;}
.lxan a{color: #333;}

.zbgd{padding: 0 !important;box-sizing: border-box;background: #547f6c;}
.zbgd img{flex-shrink: 0;
    max-height: 100%;
    object-fit: cover;}
.ybgdt{box-sizing: border-box;padding: 0 !important;}
.ybgdt .swiper-slide img{border: none; object-fit: cover;flex-shrink: 0;width: 100%;}
.banner{--bs-gutter-x:0;margin: 0 !important;}





}
@media (max-width: 1024px) {
    .navbar-nav{font-size: 1rem;
        display: flex;justify-content: space-between;}
    .navbar-nav  li{width: 100%;text-align: center}
    .indbg .container-xxl{padding: 0}
    .indbg{width: 100%;background: rgba(255,255,255);display: flex}
    .indbg.xz{background:rgba(255,255,255);}
    .indbg.xz .topnav{background: #fff}
    .navbar-toggler{padding-right: 1.5rem}
    .logo{width: 100%;height: auto;margin: 0}
    /*product*/
    .category{max-width: 1200px;padding:0 1rem;margin:50px auto 20px}
    .category-head{font-size: 1.5rem;color: #141414;font-weight: bold;text-align: center;margin-bottom: .5rem}
    .category-subhead{font-size: 1rem;color:#333;text-align: center}
    .category .info{transition: all .3s;}
    .category ul{margin:30px auto 10px;display: block;overflow: hidden}
    .category li{
        h3{font-size:1.2rem;color: #141414;margin-bottom: .5rem}
        article{font-size: .85rem;line-height: 1.3rem;color: #141414;font-family:"HarmonyOS_light";}
    }
    .category li{width: 100%;margin-bottom: 2rem}
    .category li .info{width: 75%;float: left;
    .ctz{display: inline;font-family:"HarmonyOS_light";}
    }
    .category li .category-icon{width: 20%;float:right}
    /*.category li{width: 45%;float: left}*/
    /*.category li .info{width: 100%;}*/
    /*.category li .info{width: 100%;}*/
    .category-icon{margin:0 auto;transition: all .3s;display: block;float:left;
        a{display: flex;justify-content: center;flex-wrap: wrap;align-items: center;text-align: center;flex-direction: column}
        img{width: 80px;height: auto;display: block;margin:0 auto}
        .title{font-size: .85rem;display: inline-flex;padding: .2rem 1rem;
            text-align: center;line-height:1.6rem;margin:10px auto;background: #537F6C;border-radius: 50px;color: #fff}
    }


    .category li:hover{
        .info{transform: translateY(5px)}
        h3{color: #0f5132;font-weight: bold}
        .category-icon{transform: translateY(-5px);
            .title{background: #537F6C;}
        }
    }
    /*Industrial lights*/
    .industrial-box{background:#ededed;overflow: hidden;}
    .industrial{max-width: 1700px;margin:80px auto 60px;overflow: hidden;display: flex;justify-content: space-between;align-items: stretch;padding: 0 1rem;
        .left{width: 25%;float: left;display: flex;align-content: space-between;flex-direction: column;justify-content: space-around;
            .left-title{font-size:1.5rem;color: #537F6C;font-weight: 700;margin-bottom: 20px;line-height: 1.8rem;
                span{display: block}
            }
            .left-subtitle{font-size: .9rem;color:#141414;line-height: 1.2rem;font-family:"HarmonyOS_light";margin-top: 1.5rem}
        }
        .right{width: 70%;float: right}
    }
    .more{border: solid 1px #A79D93;overflow: hidden;display: flex;width: 170px;margin-bottom: 20px;align-items: center;transition: all .3s}
    .more-l{background: #B7AEA5;color: #fff;font-size: .9rem;border-right: solid 1px #A79D93;padding: 7px 0;font-family:"HarmonyOS_light";
        width: 135px;text-align: center;text-transform: uppercase}
    .more-r{text-align: center;width: 35px;color:#A79D93; }
    .more:hover{background: #A79D93;transform: translateX(5px);
        .more-r{color: #fff;}
    }
    .img-box{overflow: hidden}
    .img-box img{transition: all .3s}
    .pro-bg{background: #fff;position: relative;padding-bottom: 3px;margin-bottom: 15px;height:280px;border: 1px solid #ffffff;}
    .pro-bg a{color: #537f6c}
    .pro-more{padding:2px;border-radius: 2rem;position: absolute;transition:all .3s;
        right: 5%;bottom: -10px;z-index: 9;background: #0f5132;display: flex;align-items: center;justify-content: space-between}
    .pro-more-r{width: 2rem;height: 2rem;background: #fff;border-radius: 2.4rem;background: #fff;display: flex;justify-content: center;font-size: 1.3rem}
    .pro-more-l{color: #fff;padding-left: 10px;font-size: 1rem;display: none;transition:all .3s;}

    .por-title{width: 90%;margin:10px auto 25px;
        .title{font-size: 1rem;color: #141414;width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
        .subtitle{font-size:.9rem;color: #141414;font-family:  "HarmonyOS_light";width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
        .subtitle:after{width:2rem;height: 3px;background: #547f6c;content: "";display: block;margin: 5px 0}
    }
    .industrial .right li:hover{
        .img-box img{transform:scale(1.2)}
        .por-title .title{color: #0f5132}
        .pro-more{
            width: 110px;
            .pro-more-l {
                display: block;
                font-size: 1rem;
            }
        }
    }
    .ufo-box{max-width: 1200px;padding:0 15px;margin:60px auto;display: flex;justify-content: space-between}
    .ufo-box-l{width:56%;padding: 5px;
        float: left;background: url("../images/ufo-bg.jpg") no-repeat center center;background-size:cover;
        position: relative;
        img{float: right;max-width: 420px;height: auto;margin: 0}

    }
    .ufo-box-r{width: 40%;display: flex;flex-direction: column;justify-content: center}
    .ufo-box-title{font-size:1.5rem;color: #537F6C;line-height: 2.8rem;font-weight: 700;margin-bottom: 20px;
        span{display: inline}}
    .ufo-box-subtitle{font-size: .9rem;color:#141414;line-height: 1.3rem;font-family:"HarmonyOS_light";margin-top: 1.5rem}
    .ufo-box-r  .more{margin-top: 50px}

    .popular{background:#ededed;padding: 50px 0;width: 100%;margin:90px auto 0;overflow: hidden}
    .popular-head{font-size: 1.5rem;color: #547f6c;font-weight: 700;text-align: center;text-transform: uppercase;margin-top: 15px}
    .popular-box{max-width: 1200px;padding: 0 15px;overflow: hidden;margin:50px auto 20px}
    .popular ul{padding: 0}
    .popular-box li:hover{
        .img-box img{transform:scale(1.2)}
        .por-title .title{color: #0f5132;font-size:1.2rem}
        .pro-more{
            width: 110px;
            .pro-more-l {
                display: block;
                font-size: 1rem;
            }
        }
    }
    .popular-more{margin:3rem auto 0;overflow: hidden;
        .more{margin:0 auto}
    }
    .office-box{width: 100%;overflow: hidden;position: relative}
    .office-content{position: absolute;width: 100%;top:0;bottom: 0}
    .office-font{max-width: 1200px;margin:0 auto;height: 65%;
        .office-l{ max-width: 550px;padding-left: 2rem;height: 100%;display: flex;align-content: space-between;flex-wrap:wrap;
            .left{height: 80%;display: flex;align-content: space-between;flex-wrap:wrap;}
            .office-nav{width: 100%;margin: 3rem auto 3rem;overflow: hidden}
            .office-nav ul{padding: 0}
            .office-nav li{width: 30%;float: left;font-size: 1.1rem;}
            .office-nav li a{color: #537F6C}
            .left-h2{font-size: 1.5rem;color: #537F6C;font-weight: 700;width: 100% }
            .left-article{font-size: .9rem;line-height: 1.5rem;color:#141414;width: 100%;margin:3rem auto;padding-right: 30%;font-family: "HarmonyOS_light"}
        }

    }

    .office-r{width: 42%;}
    .office-r img{width: 100%;max-height:900px;object-fit: cover}
    .bottom-box{background:#537F6C;overflow: hidden;padding: 3rem 1rem}
    .box{max-width: 1200px;margin:0 auto;padding: 0 15px}
    .bottom-l{width: 40%;float: left}
    .bottom-r{width: 55%;float: right;padding-top: 3rem}
    .bottom-h2{font-size: 1.5rem;color: #fff;margin:1rem auto}
    .bottom-li{font-size: 1rem;color: #fff;line-height: 1.5rem;font-family: "HarmonyOS_light";
        span{display: block;font-family: "HarmonyOS_light";}
    }
    /*    inner-page*/
    .inne-position{width: 100%;background:#547f6c37;overflow: hidden;margin:1rem auto;
        .position{max-width: 1200px;margin:0 auto;padding: 10px 1rem;color: #396c56;font-size: 1rem;display: flex;align-items: center;
            img{height: 25px;width: auto;margin-right:10px}
            a{color: #396c56;margin:0 3px }
        } }
    .list-pro{margin:4rem auto;max-width: 1200px;padding: 0 1rem;display: flex;justify-content: space-between;min-height: 450px}
    .list-pro .left{width:280px;padding-right: 25px;border-right: solid 1px #eee}
    .list-pro .right{width: calc(100% - 30px)}
    .list-pro .right img{transition: all .3s}
    .list-pro-bg{border-radius: 10px;border:solid 1px #eee;width: 100%;margin:5px auto;overflow:hidden;

    }
    .list-pro .right-title{
        width:92%;font-size: 1rem;margin:5px auto 1rem;
        h2{font-size: 1rem;color: #141414;line-height: 1.5rem;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-weight:bold}
        .subtitle{font-size: .9rem;color: #555;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-family: "HarmonyOS_light";}
    }
    .list-pro li{margin-bottom:1rem}
    .list-pro .right li:hover {
        img{transform:scale(1.1)}
        .right-title h2{color: #396c56}
    }
    .pro-category{width: 100%}
    .pro-category ul{margin:0;padding: 0}

    .pro-box{max-width: 1200px;padding: 0 1rem;margin:40px auto;overflow: hidden}
    .scroll-box{width:48%;float: left}
    .scroll-box .swiper-slide {
        text-align: center;
        font-size: 14px;
        background: #fff;
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
        flex-wrap:wrap;
        margin-top:10px

    }
    .scroll-box .mySwiper2{margin-bottom: 30px}
    .mySwiper .swiper-slide {
        width: 25%;
        opacity: 1;
        cursor: pointer;
    }

    .mySwiper .swiper-slide-thumb-active {
        opacity: 1;
    }
    .mySwiper .swiper-slide-thumb-active img {
        border:solid #537f6c63 1px;
    }
    .swiper-slide img {
        display: block;
        width: 99%;
        height: 100%;
        object-fit: cover;
        border: solid 1px #eee;
    }
    .swiper-thumbs img{border: solid 1px #eee;}
    .swiper-thumbs {}
    .scroll-box .swiper-button-next:after{color: #000}
    .scroll-box .swiper-button-prev:after{color: #000}
    .detail-r{width:46%;float: right}
    .detail-subtitle{font-size: 1rem;color: #8e8e8e;margin-top: 35px}
    .detail-title{font-size:1.8rem;color: #537F6C;margin:10px auto 15px}
    .detail-summary{font-size: .9rem;color: #333;line-height: 1.5rem}
    .color-head{font-size: 1.3rem;color:#111;line-height: 1.5rem;margin-top: 15px }
    .pro-color{background: #efefef;width: 100%;padding: 25px 15px 5px 25px;margin-top: 20px}
    .color-title{color: #000;font-size: 1rem;}
    .color-box{width: 100%;overflow: hidden;margin:0px auto;}
    .color-box li{width: 20%;float: left}
    .color-group{display: inline-block}
    .color-block{width:50px;height: 50px;border-radius: 50px;border: solid 2px #000;overflow:hidden;}
    .color-block img{width:50px;height:50px;}
    .color-box p{font-size: .9rem;color: #333;text-align: center;margin-top:10px}
    .temperature100{width: 98%;margin:10px 0}
    .temperature100 ul{padding: 0;}
    .temperature100 li{text-align: center;padding: 3px 5px;margin: 2px 0}
    .temperature100 li span{background: #fff;line-height: 2rem;width: 100%;display: block;font-size: .85rem}
    .detail-content{margin:25px auto;font-size:1rem;line-height: 1.8rem;
        overflow: hidden;max-width: 1200px;padding: 0 1rem}
    .detail-content h2{margin:20px auto 15px;font-size: 1.2rem;}
    .detail-content img{max-width: 100%;}
    .detail-content table{margin: 10px auto 15px;display:block;overflow-x:scroll;}
    .detail-content table tbody{width:850px;display:block;}
    .detail-content table tr td{border: solid 1px #999;text-align: center;padding: 3px 0 }
    .detail-content table tr:nth-child(odd){background: #E8EAE9}
    .detail-content table tr td:first-child{border-left: none}
    .detail-content table tr td:last-child{border-right: none}
    /*about us*/
    .about-banner{width: 100%;display: flex;padding:0 !important}
    .banner-l{width: 50%;display: flex}
    .banner-r{width: 100%;background: #dbdbdb;display: flex;align-items: center;
        .title-box{width:90%;padding-left: 68px;box-sizing: border-box;
            .title{font-size: 1.2rem;font-weight: 700;margin-bottom: 2rem}
            .article{font-size: .95rem;line-height: 1.5rem;
                span{display: block;margin: 1rem auto}
            }
        }
    }
    .about-choose{max-width: 1200px;padding:0 1rem;margin:60px auto}
    .choose-title{font-size: 1rem;font-weight: bold;margin-bottom: 1rem}
    .choose-box{width: 100%;margin:10px auto;display: flex;justify-content: space-between}
    .choose-box li{width: 45%;font-size:.85rem;line-height: 1.3rem;text-align: justify}
    .choose-box li:last-child{width: 45%}
    .factory-title{text-align: center;font-size: 1.5rem;font-weight: bold;margin: 25px auto 10px;color: #537f6c}
    .factory-box{max-width: 92%;margin:40px auto;}
    .factory-box .swiper-button-prev::after{color:#fff }
    .factory-box .swiper-button-next::after{color:#fff }
    .about-bottom{width: 100%;display: flex;}
    .about-l{width: 50%;
        img{width: 100%;object-fit: cover}

    }
    .about-r{width:50%;background: #537f6c;display: flex;align-items: center;
        .title-box{width:100%;box-sizing: border-box;
            .title{font-size: 2rem;font-weight: 700;margin-bottom: 2rem;text-align: center;color: #fff;line-height: 2.3rem;
                span{display: block;}
            } .banner-r
            .article{font-size: .95rem;width: 80%;margin:25px auto;font-family:"HarmonyOS_light";color: #fff;text-align: center;
            }
        }
    }

}
@media (max-width: 767.98px) {
    .zbgd{padding: 0 !important;box-sizing: border-box;background: #547f6c;}
    .zbgd img{flex-shrink: 0;
        max-height: 100%;
        object-fit: cover;}
    .ybgdt{box-sizing: border-box;padding: 0 !important;}
    .ybgdt .swiper-slide img{border: none; object-fit: cover;flex-shrink: 0;width: 100%;}
    .banner{--bs-gutter-x:0;margin: 0 !important;}
    /*联系我们*/
    .joink{width: 100%;background:#dbdbdb;padding:5px 0 20px;}
    .joink .nybt{display: none;}
    .lxwmk{width: 100%;margin: 15px auto;overflow: hidden;}
    .lxleft{width:100%;border-bottom: 1px solid #c7c7c7;padding-bottom: 20px;}
    .lxleft h1,.lxright h1{font-size: 1.4rem;line-height: 40px;color: #333;text-align: center;}
    .lxleft article{font-size: 1.2rem;font-family:"HarmonyOS_light";color: #555;text-align: center;}
    .lxleft ul{display: flex;align-items: center;justify-content:center;margin-top: 20px;padding: 0;}
    .lxleft ul li{margin: 0 10px;}
    .lxleft ul li img{border-radius: 100px;}
    .lxright{width: 100;padding-top: 15px;}
    .dhyxk{text-align: center;}
    .lxright .dhyxk a{font-size: 1.2rem;font-family:"HarmonyOS_light";color: #555;text-align: center;margin-right:5px;width: 100%;display: block;margin-bottom: 15px; }
    .lxan{width:260px;margin: 15px auto;line-height: 42px;text-align: center;border: 1px solid #333;color: #333;}
    .lxan a{color: #333;cursor: pointer;}
    /*表单*/
    .lxbdk{margin:10px auto;}
    .nybt h1{margin: 0;font-size:1.5rem;color: #141414;font-weight: bold;line-height:40px;text-align: center;}
    .nybt{margin: 10px auto;}
    .lxk{margin:10px auto;overflow: hidden;}
    .srky{width:50%; margin-bottom: 15px;float: left}
    .srk0{width: 100%; margin-bottom: 15px;}
    .srky input,.srk0 input{width: 100%;height:54px;background: #f7f7f7;border: 1px solid #f3f3f3;padding:0 5px;margin-bottom:0px;border-radius: 5px;}
    .lyk{width: 100%;float: left;}
    .lyk textarea{width: 100%;min-height:80px;background:#f7f7f7;border: 1px solid #f3f3f3;padding:0 5px;margin-bottom:30px;}
    .yzm{width:45%;float: right;}
    .tjan{width:100%;line-height: 56px;text-align: center;font-size: 14px;background:#547f6c;border-radius: 5px;color: #fff}
    .tjan a{color: #fff;}
    .lxkn input:focus,.lxkn textarea:focus {
        border:none; /* 2px宽，实线，红色 */
        border: 1px solid #547f6c;
    }
    .lxkn input:focus,.lxkn textarea:focus {outline: none;}

    .title{font-size: 1.4rem;line-height: 1.5rem;text-align: center;margin:1.5rem auto;font-weight: 700}
    .navbar-expand-lg{padding-right: 1rem}
    .navbar-toggler{margin-right: 1rem}
    .navbar-collapse{background: #fafafa;padding: 1rem 0}
    .navbar-nav{align-items: center;text-align: center}
    .navbar-nav  li{width: 100%}
    .nav-item .dropdown-menu {
        li{background: #fafafa;margin-bottom: 3px}
        a{color: #555;font-family:"HarmonyOS_light";padding:5px 0;width: 100%;display: block;font-size:.9rem}}



    .nav-item {border-bottom: solid 1px #eee;font-size:.9rem}
    .logo{max-width:100%;height: auto;float: left;margin-left: 0}

    .search-box{border-radius:50px;padding-left: 10px;
        background: #efefef;overflow: hidden;height: 2.5rem;display: block}
    .search-box img{width: 20px;height: auto}
    .search-box input{width: calc(100% - 115px);border: none;background: transparent;font-size: .85rem;line-height: 1.9rem;padding: .25rem 0;
        outline: none}
    .search-button{width: 80px;font-size: .85rem;background: #547f6c;border-radius: 50px;line-height: 2.5rem;border: none;
        text-align: center;color: #fff;float: right;}
    /*product*/
    .category{max-width: 1200px;padding:0 1rem;margin:30px auto}
    .category-head{font-size:1.2rem;color: #141414;font-weight: bold;text-align: center;margin-bottom: 1rem;line-height: 2rem}
    .category-subhead{font-size: .85rem;color:#333;text-align: center}
    .category li{margin-bottom: 1rem;display: block;overflow: hidden}
    .category li .info{transition: all .3s;width: 100%;
        span{margin-top:1rem;display: inline}
    }
    .category ul{display: block;;margin:20px auto 0;padding: 0}
    .category li{width:100%;display: block;
        h3{font-size:1em;color: #141414;margin-bottom: .8rem}
        article{font-size: .8rem;line-height: 1.1rem;color: #141414;font-family:"HarmonyOS_light";   display: -webkit-box;
            overflow: hidden;
            -webkit-line-clamp: 3;
            text-overflow: ellipsis;
            -webkit-box-orient: vertical;}
        p{font-family:"HarmonyOS_light";margin: 0;display: inline}
    }
    .category-icon{width: 100%;margin:10px auto 30px;transition: all .3s;
        a{display: flex;justify-content: center;flex-wrap: wrap;align-items: center;text-align: center;flex-direction: column}
        img{width: 70px;height: auto;display: block;margin:0 auto}
        .title{font-size: .85rem;display: block;padding: .2rem 0;font-family:"HarmonyOS_light";width: 99%;
            text-align: center;line-height:1.6rem;margin:0px auto;background: #537F6C;border-radius: 50px;color: #fff}
    }
    .category li:hover{
        .info{transform: translateY(5px)}
        h3{color: #0f5132;font-weight: bold}
        .category-icon{transform: translateY(-5px);
            .title{background: #537F6C;}
        }
    }
    .phone-icon{display: flex;align-items: center;justify-content: space-between}
    /*Industrial lights*/
    .industrial-box{background:#ededed;overflow: hidden;}
    .industrial{max-width: 1700px;margin:40px auto;overflow: hidden;display: block;padding: 0 1rem;
        .left{width: 100%;display: block;
            .left-title{font-size: 1.2rem;color: #537F6C;line-height: 2rem;font-weight: 700;margin-bottom:0;text-align: center;
                span{display: inline}
            }
            .left-subtitle{font-size: .8rem;color:#141414;line-height: 1.2rem;font-family:"HarmonyOS_light";margin: 0 0 1.8rem;text-align: center}
        }
        .right{width: 100%;margin:0 auto 1rem}
        .right ul{padding: 0}
        .right li:last-child{display: none}
    }
    .more{border: solid 1px #A79D93;overflow: hidden;display: flex;width: 170px;margin-bottom: 20px;align-items: center;transition: all .3s}
    .more-l{background: #B7AEA5;color: #fff;font-size: .85rem;border-right: solid 1px #A79D93;padding: 3px 0;font-family:"HarmonyOS_light";
        width: 135px;text-align: center;text-transform: uppercase}
    .more-r{text-align: center;width: 35px;color:#A79D93; }
    .more:hover{background: #A79D93;transform: translateX(5px);
        .more-r{color: #fff;}
    }
    .img-box{overflow: hidden}
    .img-box img{transition: all .3s}
    .pro-bg{background: #fff;position: relative;padding-bottom: 3px;margin-bottom: 15px;height:280px;border:1px solid #ffffff}
    .pro-bg a{color: #537f6c}
    .pro-more{padding:2px;border-radius: 2rem;position: absolute;transition:all .3s;
        right: 5%;bottom: -10px;z-index: 9;background: #0f5132;display: flex;align-items: center;justify-content: space-between}
    .pro-more-r{width: 2.3rem;height: 2.3rem;background: #fff;border-radius: 2.4rem;background: #fff;display: flex;justify-content: center;font-size: 1.5rem}
    .pro-more-l{color: #fff;padding-left: 10px;font-size: 1rem;display: none;transition:all .3s;}

    .por-title{width: 90%;margin:10px auto 25px;
        .title{font-size: 1rem;color: #141414;width: 100%;overflow: hidden;text-align: left;
            text-overflow: ellipsis;white-space: nowrap;margin:.2rem auto}
        .subtitle{font-size:.85rem;color: #141414;font-family:  "HarmonyOS_light";width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
        .subtitle:after{width:2rem;height: 3px;background: #547f6c;content: "";display: block;margin: 5px 0}
    }
    .industrial .right li:hover{
        .img-box img{transform:scale(1.2)}
        .por-title .title{color: #0f5132}
        .pro-more{
            width: 110px;
            .pro-more-l {
                display: block;
                font-size: 1rem;
            }
        }
    }
    .ufo-box{max-width: 1200px;padding:0 15px;margin:10px auto;display: block;}
    .ufo-box-l{width:98%;margin:1rem auto;padding: 10px;height: auto;overflow: hidden;display: block;
       background: url("../images/ufo-bg.jpg") no-repeat center bottom;background-size: cover;
        img{width:100%;height: auto}

    }
    .ufo-box-r{width: 100%;}
    .ufo-box-title{font-size:1.2rem;color: #537F6C;line-height:2.5rem;font-weight: 700;padding: 15px 0 0 0;margin:1rem 0 0 0;
        span{display: inline}}
    .ufo-box-subtitle{font-size: .9rem;color:#141414;line-height: 1.3rem;font-family:"HarmonyOS_light";margin-top: 0}
    .ufo-box-r  .more{margin-top: 1rem}
    .popular{background:#ededed;padding: 30px 0;width: 100%;margin:20px auto 0}
    .popular-head{font-size: 1.2rem;color: #547f6c;font-weight: 700;text-align: center;text-transform: uppercase;margin-top: 5px}
    .popular-box{max-width: 1200px;padding: 0 15px;overflow: hidden;margin:10px auto 20px}
    .popular ul{padding: 0}
    .popular li{margin-top: 1rem}
    .popular-box li:hover{
        .img-box img{transform:scale(1.2)}
        .por-title .title{color: #0f5132}
        .pro-more{
            width: 110px;
            .pro-more-l {
                display: block;
                font-size: 1rem;
            }
        }
    }
    .popular-more{margin:1.5rem auto 0;overflow: hidden;
        .more{margin:0 auto}
    }
    .office-box{width: 100%;overflow: hidden;}
    .office-content{display:block;width: 100%;top:0;bottom: 0;position: relative}
    .office-font{max-width: 1200px;margin:0 auto;height: 65%;
        .office-l{ max-width: 550px;padding-left: 1rem;height: 100%;display: flex;align-content: space-between;flex-wrap:wrap;
            .left{height: 80%;display: flex;align-content: space-between;flex-wrap:wrap;}
            .office-nav{width: 100%;margin: 3rem auto 3rem;overflow: hidden}
            .office-nav ul{padding: 0}
            .office-nav li{width: 30%;float: left;font-size: 1rem;}
            .office-nav li a{color: #537F6C}
            .left-h2{font-size: 1.2rem;color: #537F6C;font-weight: 700;width: 100% }
            .left-article{font-size: .9rem;line-height: 1.3rem;color:#141414;width: 100%;margin:1rem auto;padding-right: 10%;font-family: "HarmonyOS_light"}
        }

    }
    .office-r{width: 100%;margin:1rem  0}
    .office-r img{width: 100%;height:80vw;object-fit: cover}
    .bottom-box{background:#537F6C;overflow: hidden;padding: 2.5rem 1rem}
    .box{max-width: 1200px;margin:0 auto;padding: 0 15px}
    .bottom-l{width: 100%;}
    .bottom-r{width: 100%;}
    .bottom-h2{font-size: 1.2rem;color: #fff;margin:1rem auto .5rem}
    .bottom-li{font-size: .9rem;color: #fff;line-height: 1.4rem;font-family: "HarmonyOS_light";
        span{display: block;font-family: "HarmonyOS_light";}
    }
    /*    inner-page*/
    .inne-position{width: 100%;background:#547f6c37;overflow: hidden;margin:1rem auto;
        .position{max-width: 1200px;margin:0 auto;padding: 10px 1rem;color: #396c56;font-size: .9rem;display: flex;align-items: center;
            img{height: 25px;width: auto;margin-right:10px}
            a{color: #396c56;margin:0 3px }
        } }
    .list-pro{margin:1.5rem auto;max-width: 1200px;padding: 0 1rem;display: block;min-height: 100vw}
    .list-pro .left{width:100%;border:none}
    .list-pro .right{width:100%}
    .list-pro .right .col-6{padding: 3px}
    .list-pro .right img{transition: all .3s}
    .list-pro-bg{border-radius: 10px;border:solid 1px #eee;width: 100%;margin:5px auto;overflow:hidden;

    }
    .list-pro .right-title{
        width:92%;font-size: 1rem;margin:5px auto 1rem;
        h2{font-size: 1rem;color: #141414;line-height: 1.2rem;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-weight:bold}
        .subtitle{font-size: .85rem;color: #555;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-family: "HarmonyOS_light";}
    }
    .list-pro  ul{margin:0;padding:0 }
    .list-pro li{margin-bottom:1rem}
    .list-pro .right li:hover {
        img{transform:scale(1.1)}
        .right-title h2{color: #396c56}
    }
    .pro-category{width: 100%;overflow: hidden}
    .pro-category ul{margin:0;padding:0 }
    .pro-category li{background: linear-gradient(to right,#dcdcdc,#fff);font-size:.95rem;padding:10px 0;width: 49%;float: left;margin-right: 1%;
        border-radius: 35px;margin-bottom:15px}
    .pro-category li a{display: flex;justify-content: space-between;align-items: center;padding: 0 0 0 20px;color: #141414}
    .pro-category .name{width: 92%}
    .pro-category li a.active{color: #537F6C}

    .pro-box{max-width: 1200px;padding: 0 1rem;margin:15px auto 20px;overflow: hidden}
    .scroll-box .swiper-button-next{right:0;}
    .scroll-box .swiper-button-prev{left:0;}
    .scroll-box .swiper-button-next:after{color: #000;font-size:1.5rem;}
    .scroll-box .swiper-button-prev:after{color: #000;font-size:1.5rem}
    .scroll-box{width:100%;}
    .detail-r{width:100%;}
    .detail-subtitle{font-size: .85rem;color: #8e8e8e;margin-top: 0}
    .detail-title{font-size:1.3rem;color: #537F6C;margin:10px auto 15px}
    .detail-summary{font-size: .85rem;color: #333;line-height: 1.3rem}
    .color-head{font-size: 1rem;color:#111;line-height: 1.5rem;margin-top: 15px }
    .pro-color{background: #efefef;width: 100%;padding: 25px 15px 5px 25px;margin-top: 10px}
    .color-title{color: #000;font-size:.9rem;}
    .color-box{width: 100%;overflow: hidden;margin:5px auto;}
    .color-box li{width: 20%;float: left}
    .color-group{display: inline-block}
    .color-block{width:50px;height: 50px;border-radius: 50px;border: solid 2px #000;overflow:hidden;}
    .color-block img{width:50px;height:50px;}
    .color-box p{font-size: .8rem;color: #333;text-align: center;margin-top:10px}
    .temperature100{width: 98%;margin:10px 0}
    .temperature100 ul{padding: 0;}
    .temperature100 li{text-align: center;padding: 3px 5px;margin: 2px 0}
    .temperature100 li span{background: #fff;line-height: 2rem;width: 100%;display: block;font-size: .85rem}
    .detail-content{margin:5px auto 25px;font-size:.85rem;line-height: 1.5rem;
        overflow: hidden;max-width: 1200px;padding: 0 1rem}
    .detail-content h2{margin:20px auto 10px;font-size: 1.2em;}
    .detail-content img{max-width: 100%;}
    .detail-content table{margin: 10px auto 15px;display:block;overflow-x:scroll;}
    .detail-content table tbody{width:850px;display:block;}
    .detail-content table tr td{border: solid 1px #999;text-align: center;padding: 3px 0;font-size: .75rem; }
    .detail-content table tr:nth-child(odd){background: #E8EAE9}
    .detail-content table tr td:first-child{border-left: none}
    .detail-content table tr td:last-child{border-right: none}
    .syp {
        width: 100%;
        font-size: .85rem;
        color: #333;
        background: #fafafa;
        padding: 3px 0
    }
    .syp a {
        color: #555
    }
    .syp ul {
        overflow: hidden;
        max-width: 1200px;
        margin: 15px auto;
        padding: 0 1rem;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap
    }

    .syp li {
        width: 100%;
        text-overflow: ellipsis;
        overflow: hidden;
        margin-bottom: .5rem;
        white-space: nowrap;

    }
    /*about us*/
    .about-banner{width: 100%;display: block}
    .banner-l{width: 100%;}
    .banner-r{width: 100%;background: #dbdbdb;display: flex;align-items: center;
        .title-box{width:90%;box-sizing: border-box;padding: 0;margin:1rem auto;
            .title{font-size: 1.2rem;font-weight: 700;margin-bottom: .5rem}
            .article{font-size: .85rem;line-height: 1.5rem;
                span{display: block;margin: .5rem auto}
            }
        }
    }
    .about-choose{max-width: 1200px;padding:0 1rem;margin:2rem auto}
    .choose-title{font-size: 1rem;font-weight: bold;margin-bottom: 1rem}
    .choose-box{width: 100%;margin:10px auto;display: block;justify-content: space-between}
    .choose-box li{width: 100%;font-size:.85rem;line-height: 1.3rem;text-align: justify}
    .choose-box li:last-child{width: 100%}
    .factory-title{text-align: center;font-size: 1.2rem;font-weight: bold;margin: 25px auto 10px;color: #537f6c}
    .factory-box{max-width: 92%;margin:40px auto;}
    .factory-box .swiper-button-prev::after{color:#fff }
    .factory-box .swiper-button-next::after{color:#fff }
    .about-bottom{width: 100%;display: block;}
    .about-l{width: 100%;
        img{width: 100%;object-fit: cover}

    }
    .about-r{width:100%;background: #537f6c;display: flex;align-items: center;
        .title-box{width:100%;box-sizing: border-box;
            .title{font-size: 1.5rem;font-weight: 700;margin-bottom:0;text-align: center;color: #fff;line-height: 1.8rem;
                span{display: block;}
            }
            .article{font-size: .85rem;width: 85%;margin:.5rem auto 1.5rem;font-family:"HarmonyOS_light";color: #fff;text-align: center;
            }
        }
    }
}

/*页码*/
.list-page {
    text-align: center;
    width: 95%;
    margin: 3rem auto .5rem;display: flex;justify-content: center;
}

.pagination a {

    color: #0b112a !important
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 3;
    color: #fff !important;
    cursor: default;
    background-color: #333 !important;
    border-color: #ddd !important;
}

/*顶部*/
.cd-top {
    display: inline-block;
    height: 40px;
    width: 40px;
    position: fixed;
    bottom: 40px;
    right: 10px;
    box-shadow: 0 0 10px rgba(230, 0, 18, 0.05);
    /* image replacement properties */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    border-radius: 5px;
    z-index: 28;
    background: rgba(230, 0, 18) url(../images/cd-top-arrow.svg) no-repeat center 50%;

    opacity: 1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
.cd-top.cd-is-visible {
    /* the button becomes visible */
    visibility: visible;
    opacity: 1;
}
.cd-top.cd-fade-out {
    opacity: .8;
}
.no-touch .cd-top:hover {
    background-color:#06C;
    opacity: 1;
}
@media only screen and (min-width: 768px) {
    .cd-top {
        right: 20px;
        bottom: 20px;
    }
}
@media only screen and (min-width: 1024px) {
    .cd-top {
        height: 55px;
        width: 55px;
        right: 30px;
        bottom: 30px;
        border-radius: 10px;
    }
}