.catebanner  .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient( 180deg,rgba(0,0,0,.25) 0%,rgba(0,0,0,0) 100%);
    transform: rotate( -180deg );
}
.catebanner{
    position:relative;
    margin-bottom:10px;
    overflow:hidden;
}
    .catebanner a{
        color:#fff;
    }
    .catebanner img {
        width: 100%;
        -webkit-transition: -webkit-transform .5s;
        transition: -webkit-transform .5s;
        transition: transform .5s;
        transition: transform .5s,-webkit-transform .5s;
    }
    .catebanner:hover img {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
    .catebanner .wrlnk {
        position: absolute;
        left: 15px;
        right: 0;
        bottom: 15px;
    }
    .catebanner .view-more {
        position: absolute;
        bottom: 15px;
        right: 15px;
        display: inline-block;
        border: solid 1px #fff;
        border-radius: 4px;
        padding: 2px 5px;
        transition: .5s;
        color: #fff;
    }
        .catebanner .view-more:hover {
            background-color: var(--maincolor);
        }
        .ulchidlcates li {
            display: inline-block;
        }
    .ulchidlcates li a {
        margin-right: 10px;
        border: solid 1px #fff;
        border-radius: 4px;
        padding: 2px 5px;
        color:#fff;
        font-weight: 500;
        transition:.5s;
    }
        .ulchidlcates li a:hover{
            background-color:var(--maincolor);
        }
.catebanner .maincate a:hover {
    color: var(--maincolor);
}
.ulchidlcates li
.catebanner .wrlnk a {
    color: #fff;
}
        .swiper-button-prev, .swiper-button-next {
            width: 48px !important;
            height: 48px !important;
            border-radius: 50%;
            text-align: center;
            line-height: 48px;
            background-color: #fff;
            color: var(--maincolor) !important;
            border: solid 1px #e4e4e4;
            transition: .5s;
        }
    .swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled{
        opacity:0!important;
    }
    .swiper-button-prev:hover, .swiper-button-next:hover {
        background-color: var(--maincolor);
        color: #fff !important;
    }
    .html-home-page .boxpc .lst-product .product-item {
        width: 100%;
        flex:none;
    }
.html-home-page .boxpc .lst-product{
    display:block;flex-wrap:unset;
}
.swiper-button-prev:after, .swiper-button-next:after {
    font-family: unset !important;
}
.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after, .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after {
    content: unset !important;
}
.box-manufacture {
    margin: 50px 0;
}

    .box-manufacture img {
        max-width: 100%;
        height:150px;
        object-fit:contain;
    }

    .box-manufacture .manufacutre-item {
        padding: 15px 0;
        text-align: center;
        border: solid 1px #e5e5e5;
    }

.homemanufacture {
    margin-top: 30px;
}
.red-line {
    line-height: 1;
    margin: 10px 0 20px;
    position: relative;
    text-align: center;
    width: 100%;
}

    .red-line > span {
        background: var(--maincolor);
        display: block;
        height: 1px;
        left: calc(50% - 35px);
        line-height: 1;
        position: absolute;
        width: 70px;
        text-indent: -10000px;
    }

.banner-item {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 450px;
    position: relative;
    width: 100%;
}
.home-page-category {
    margin: 40px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
    .home-page-category > * {
        width: 100%;
        max-width: 100%;
    }
.category-item {
    width: calc(100%/6 - 12px);
    border: 5px solid #144d29;
    background-color: #fff;
    text-align: center;
    flex: 0 0 auto;
    position: relative;
    border-radius: 10px;
}
    .category-item::before {
        content: '';
        display: block;
        padding-top: 105%;
    }
.category-item-content {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap:wrap;
}
.category-item .wr-img {
    display: block;
    width:100%;
}
    .category-item h2 {
        font-size: 15px;
        font-weight:400;
    }

        .category-item h2 a {
            color: #212121;
        }
.homebanner img{
    width:100%;
}
.cate-info {
    margin-top: -35px;
}

.category-item img {
    width: 160px;
    transition: all .3s ease 0s;
    margin-top:10px;
}
    .category-item:hover a{
        color:var(--maincolor);
    }
    .category-item .viewdetail {
        color: #474747;
        text-decoration: underline;
    }

    .category-item .viewdetail:hover {
        color: var(--maincolor);
    }

.banner-item {
    height: 400px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding-top: 80px;
}

.lst-category {
    margin: 40px 0;
}

    .lst-category ul {
        margin: auto;
        text-align: center;
    }

        .lst-category ul li {
            display: inline-block;
            margin-right: 20px;
        }

            .lst-category ul li h2 button {
                font-size: 24px;
                color: #474747;
                background: none;
                border: none;
            }

                .lst-category ul li h2 button:hover, .lst-category ul li h2 button.active {
                    color: var(--maincolor);
                }


    .news-list-homepage {
        margin: 30px 0;
    }
.news-list-homepage .title{
    border-bottom:solid 1px var(--bordercolor);
}
.news-items {
    background: #fff;
}
.news-item{
    margin:15px;
}
.news-item:hover h3 a{
    color:var(--maincolor);
}
    .news-item .picture img{
        height:250px;
        width:100%;
        object-fit:cover;
        opacity:1;
        transition:all;
        transition-duration:.7s;
    }
    .news-item:hover .picture img{
        opacity:.7;
    }
    .news-item .news-head {
        margin: 0;
    }
        .news-item .news-head h3{
            margin-top:15px;
        }
        .news-item h3 {
            font-size: 18px;
            font-weight:500;
        }
        .news-item h3 a {
            color: #363636;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
            .news-item h3 a:hover {
                color: var(--maincolor);
            }
            .news-date {
                color: var(--maincolor);
            }
.view-detail {
    color: var(--maincolor);
    font-size:13px;
}
.news-list-homepage .title h3 {
    margin-bottom: 15px;
    text-transform: capitalize;
    float: left;
}
.news-list-homepage .title .newscategories {
    float: right;
}
    .news-list-homepage .title .newscategories ul li{
        display:inline-block;
        margin-right:15px;
    }
        .news-list-homepage .title .newscategories ul li a{
            color:#666;
        }
            .news-list-homepage .title .newscategories ul li a:hover{
                color:var(--maincolor);
            }
            .boxpc ul.chidlcates {
                float: right;
                margin-top: 12px;
            }
.boxpc ul.chidlcates li{
    display:inline-block;
    margin-right:20px;
}
    .boxpc ul.chidlcates li a{
        color:var(--maincolor);
        font-size:15px;
    }
    .boxpc ul.chidlcates li a:hover{
        color:var(--maincolor);
    }

@media (max-width: 575px) {
    .swiper-button-prev, .swiper-button-next {
        width: 36px !important;
        height: 36px !important;
        border-radius: 50%;
        text-align: center;
        line-height: 36px;
        background-color: #fff;
        color: var(--maincolor) !important;
        border: solid 1px #e4e4e4;
        transition: .5s;
    }
    .boxpc .heading h3{
        margin-bottom:0;
    }
    .boxpc ul.chidlcates {
        margin-top: 0;
    }
    .news-list-homepage .title h3 {
        margin-bottom: 0;
    }
    .news-list-homepage .title .newscategories ul li{
        display:none;
    }
        .news-list-homepage .title .newscategories ul li:last-child{
            display:inline-block;
        }
        .category-item {
            width: calc(50% - 12px);
        }
    .boxpc ul.chidlcates li{
        display:none;
    }
    .boxpc ul.chidlcates li:last-child{
        display:inline-block;
        margin-right:0;
    }
    .catebanner img {
     min-height:100px;
     object-fit:cover;
    }
    .category-item img{
        width:150px;
    }
    .catebanner .view-more{
        display:none;
    }
}