* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    list-style: none;
    text-decoration: none;
}

img {
    width: 100%;
    transition: 0.5s;
}

a {
    color: black;
}

/* 匠心优品 */
.starproducts {
    width: 100%;
    max-width: 1920px;
    margin: auto;
    text-align: center;
    padding: 30px 0;
    padding-bottom: 0;
    font-size: 1.4em;
    position: relative;
}

.starproducts h1 {
    margin-bottom: 30px;
}

.starproducts h1::after {
    content: '';
    display: block;
    width: 50px;
    height: 3px;
    background: rgb(15, 119, 51);
    margin: 10px auto;
}

.starproducts-mySwiper,
.sp_starproductsbox {
    display: none;
}

.photoshow {
    width: 1200px;
    margin: 30px auto;
}

/* 1行 注意：类名line和i 作用为desc的样式和显示不用再重复定义 */
.photoshow .line .i::before {
    content: "";
    height: 200px;
    width: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.25) 100%);
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
}

.photoshow .line1 {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 30px;
}

.photoshow .line1 .i1 {
    width: 790px;
    height: 380px;
    margin-right: 30px;
    position: relative;
    overflow: hidden;
}

.photoshow .line1 .i1:hover img {
    transform: scale(1.2);
}

.photoshow .line .i .desc {
    position: absolute;
    z-index: 2;
    left: 0;
    bottom: -18%;
    width: 500px;
    height: 150px;
    text-align: start;
    line-height: 1.5em;
    padding-left: 3%;
    transition: 0.5s;
}

.photoshow .line .i .desc .desc1 {
    color: white;
    font-size: 0.8em;
    font-weight: bold;
}

.photoshow .line .i .desc .desc2 {
    color: white;
    font-weight: bolder;
}

.photoshow .line .i .desc .desc3 {
    color: #fff;
    font-weight: bolder;
    font-size: 0.8em;
    width: 70%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.photoshow .line .i .desc .desc4 {
    color: white;
    font-weight: bolder;
    font-size: 0.8em;
    margin-top: 21px;
}

.photoshow .line .i .desc .desc4 span {
    color: darkorange;
    transition: 0.5s;
}

.photoshow .line .i .desc .desc4:hover span {
    margin-left: 15px;
}

.photoshow .line .i .m {
    position: absolute;
    z-index: 1;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: url('../static/index/mask_grad.png');
    background-size: cover;
    visibility: hidden;
}

.photoshow .line1 .i1:hover .desc {
    bottom: -5%;
}

.photoshow .line1 .i1:hover .m {
    visibility: visible;
}

.photoshow .line1 .i2 {
    width: 380px;
    height: 380px;
    position: relative;
    overflow: hidden;
    transition: 0.5s;
}

.photoshow .line1 .i2:hover img {
    transform: scale(1.2);
}

.photoshow .line1 .i2:hover .desc {
    bottom: -5%;
}

.photoshow .line1 .i2:hover .m {
    visibility: visible;
}

/* 2行 */
.photoshow .line2 {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 30px;
}

.photoshow .line2 .i1 {
    width: 380px;
    height: 380px;
    margin-right: 30px;
    position: relative;
    overflow: hidden;
    transition: 0.5s;
}

.photoshow .line2 .i1:hover img {
    transform: scale(1.2);
}

.photoshow .line2 .i1:hover .desc {
    bottom: -5%;
}

.photoshow .line2 .i1:hover .m {
    visibility: visible;
}

/* end */
.photoshow .line2 .i2 {
    width: 790px;
    height: 380px;
    position: relative;
    overflow: hidden;
    transition: 0.5s;
}

.photoshow .line2 .i2:hover img {
    transform: scale(1.2);
}

.photoshow .line2 .i2:hover .desc {
    bottom: -5%;
}

.photoshow .line2 .i2:hover .m {
    visibility: visible;
}

/* 3行 */
.photoshow .line3 {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 30px;
}

.photoshow .line3 .i1 {
    width: 380px;
    height: 268px;
    position: relative;
    overflow: hidden;
    transition: 0.5s;
}

.photoshow .line3 .i1:hover img {
    transform: scale(1.2);
}

.photoshow .line3 .i1:hover .desc {
    bottom: -5%;
}

.photoshow .line3 .i1:hover .m {
    visibility: visible;
}

.photoshow .line3 .i2 {
    width: 380px;
    height: 268px;
    margin: 0 30px;
    position: relative;
    overflow: hidden;
    transition: 0.5s;
}

.photoshow .line3 .i2:hover img {
    transform: scale(1.2);
}

.photoshow .line3 .i2:hover .desc {
    bottom: -5%;
}

.photoshow .line3 .i2:hover .m {
    visibility: visible;
}

.photoshow .line3 .i3 {
    width: 380px;
    height: 268px;
    position: relative;
    overflow: hidden;
    transition: 0.5s;
}
/* 后期需求修改 time:1680505214 */
.photoshow .line3 .i .desc {
    position: absolute;
    z-index: 2;
    left: 0;
    bottom: -25%;
    width: 500px;
    height: 150px;
    text-align: start;
    line-height: 1.5em;
    padding-left: 3%;
    transition: 0.5s;
}
/* end */
.photoshow .line3 .i3:hover img {
    transform: scale(1.2);
}

.photoshow .line3 .i3:hover .desc {
    bottom: -5%;
}

.photoshow .line3 .i3:hover .m {
    visibility: visible;
}

/*适配≥≥≥≥≥≥≥ 匠心优品的手机端适配 */
@media screen and (max-width: 1200px) {

    /* 匠心优品 */
    .starproducts {
        width: 100%;
        text-align: center;
        position: relative;
        padding: 30px 3%;
    }

    .starproducts h1 {
        font-size: 1.2em;
    }

    .photoshow {
        display: none;
    }

    .starproducts-mySwiper,
    .sp_starproductsbox {
        display: block;
    }

    .sp_starproductsbox .line1,
    .sp_starproductsbox .line2 {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 15px;
    }

    .sp_starproductsbox .sp_box {
        height: auto;
        width: 43vw;
        background: rgb(245, 245, 245);
    }

    .sp_starproductsbox .content {
        padding: 4%;
        /* padding-bottom: 20%; */
    }

    .sp_starproductsbox .content .text1 {
        font-size: 0.6em;
        font-weight: bold;
        color: rgb(105, 105, 105);
        text-align: start;
    }

    .sp_starproductsbox .content .text2 {
        font-size: 0.7em;
        font-weight: bold;
        color: black;
        text-align: start;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

/* 新闻中心 */
.news_section {
    width: 100%;
    max-width: 1920px;
    margin: auto;
    text-align: center;
    padding: 30px 0;
    font-size: 1.4em;
    position: relative;
}

.news_section h1 {
    margin-bottom: 30px;
}

.news_section h1::after {
    content: '';
    display: block;
    width: 50px;
    height: 3px;
    background: rgb(15, 119, 51);
    margin: 10px auto;
}

.boxshow {
    width: 1200px;
    margin: 30px auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.boxshow .box {
    width: 380px;
    height: 450px;
    background: rgb(248, 248, 248);
    overflow: hidden;
    position: relative;
    transition: 0.5s;
}

.boxshow .box .tab {
    position: absolute;
    z-index: 9;
    left: 0;
    top: 0;
    width: 90px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    font-size: 0.8em;
    color: white;
    background: #00000080;
}

.boxshow .box .img {
    width: 380px;
    height: 240px !important;
    overflow: hidden;
}

.boxshow .box .content {
    padding: 2% 5% 5% 5%;
}

.boxshow .box .title {
    font-weight: bold;
    font-size: 0.7em;
    width: 100%;
    text-align: start;
    margin-bottom: 15px;
}

.boxshow .box .address {
    font-weight: bold;
    font-size: 0.7em;
    width: 100%;
    text-align: start;
    position: relative;
    padding-left: 7%;
}

.boxshow .box .address::before {
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    left: 0;
    background: url('../static/index/address.png');
    background-size: contain;
}

.boxshow .box .date {
    font-weight: bold;
    font-size: 0.7em;
    width: 100%;
    text-align: start;
    position: relative;
    padding-left: 7%;
}

.boxshow .box .date::before {
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    left: 0;
    background: url('../static/index/rl.png');
    background-size: contain;
}

.boxshow .box .text {
    font-weight: bold;
    font-size: 0.7em;
    width: 100%;
    text-align: start;
    color: rgb(102, 102, 102);
    margin-top: 10px;
}

.boxshow .box .img {
    transition: all 0.5s;
}

.boxshow .box:hover img {
    transform: scale(1.2);
}

.boxshow .box:hover {
    background: rgb(230, 230, 230);
}

.boxshow .box .list {
    margin-top: 40px;
    padding: 0% 6% 16% 6%;
    height: 100%;
    overflow: hidden;
    overflow-y: scroll;
}

.boxshow .box .list .listitem {
    display: block;
    margin-bottom: 20px;
}

.boxshow .box .list h2 {
    font-size: 0.7em;
    text-align: start;
}

.boxshow .box .list .time {
    font-size: 0.7em;
    font-weight: bold;
    text-align: start;
    color: rgb(102, 102, 102);
}

.boxshow .box .list .listitem:hover {
    color: darkred;
}

.news_section .more {
    margin-top: 30px;
    width: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.news_section .more .more_huodong,
.news_section .more .more_xinwen {
    width: 170px;
    height: 40px;
    border: 1px solid black;
    text-align: center;
    line-height: 40px;
    font-size: 0.8em;
    font-weight: bold;
    display: block;
}

.news_section .morebtn:hover {
    background: rgb(214, 35, 36);
    color: white;
}

/*适配≥≥≥≥≥≥≥ 新闻中心的手机端适配 */
@media screen and (max-width: 1200px) {

    /* 新闻中心 */
    .news_section {
        width: 100%;
        text-align: center;
        padding: 30px 6%;
        position: relative;
    }

    .news_section h1 {
        margin-bottom: 30px;
        font-size: 1.2em;
    }

    .news_section h1::after {
        content: '';
        display: block;
        width: 50px;
        height: 3px;
        background: rgb(15, 119, 51);
        margin: 10px auto;
    }

    .boxshow {
        width: 100%;
        margin: 30px auto;
        display: block;
    }

    .boxshow .box {
        display: block;
        width: 100%;
        height: auto;
        background: rgb(248, 248, 248);
        overflow: hidden;
        position: relative;
        transition: 0.5s;
        margin-bottom: 15px;
    }

    .boxshow .box3 {
        height: 300px;
    }

    .boxshow .box .img {
        width: 100% !important;
        height: auto;
    }

    .news_section .more {
        justify-content: center;
    }

    .news_section .more .more_huodong,
    .news_section .more .more_xinwen {
        margin-right: 0px;
        width: 120px;
        height: 40px;
    }

    .boxshow .box .address,
    .boxshow .box .date {
        padding-left: 9%;
    }
}

/* 公司简介 */
.aboutus_section {
    width: 100%;
    max-width: 1920px;
    margin: auto;
    margin-bottom: 30px;
}

.aboutus_section_h1 {
    text-align: center;
    font-size: 2em;
    margin-bottom: 30px;
}

.aboutus_section_h1::after {
    content: '';
    display: block;
    width: 50px;
    height: 3px;
    background: rgb(15, 119, 51);
    margin: 10px auto;
}

.aboutus_section .allbox {
    display: flex;
    justify-content: center;
    align-items: center;
}

.aboutus_section .leftbox {
    padding: 5%;
    padding-top: 4%;
    width: 50%;
    height: 380px;
    background: rgb(241, 244, 249);
}

.aboutus_section .leftbox h1 {
    color: rgb(214, 35, 36);
    font-size: 2em;
    font-weight: 400;
}

.aboutus_section .leftbox p {
    color: rgb(90, 93, 110);
    font-size: 1em;
    font-weight: bold;
    margin: 20px 0;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 7;
}


.aboutus_section .rightbox::before {
    content: '';
    background: rgb(38, 129, 101);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
}

/* .aboutus_section .rightbox .img{
    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
} */
.aboutus_section .rightbox h1 {
    font-size: 2em;
}

.aboutus_section .rightbox h2 {
    margin: 30px 0;
}

@media screen and (min-width: 2000px) {
    .aboutus_section .leftbox {
        padding-left: 8%;
    }

    .aboutus_section .leftbox p {
        height: auto;
    }

}

/*适配≥≥≥≥≥≥≥ 公司简介的手机端适配 */
@media screen and (max-width: 1200px) {
    .aboutus_section {
        padding-bottom: 0px;
        margin-bottom: 0px;
    }

    .aboutus_section_h1 {
        font-size: 1.5em;
        margin-bottom: 30px;
    }

    .aboutus_section .allbox {
        display: flex;
        flex-direction: column;
    }

    .aboutus_section .leftbox {
        padding: 3%;
        width: 100%;
        height: auto;
        min-height: auto;
        order: 2;
    }

    .aboutus_section .leftbox h1 {
        font-size: 1.5em;
    }

    .aboutus_section .rightbox h1 {
        font-size: 1.5em;
    }

    .aboutus_section .rightbox h2 {
        margin: 5px 0;
        font-size: 1.5em;
        padding-left: 20px;
    }

    .aboutus_section .rightbox span {
        padding-left: 20px;
    }

    .aboutus_section .rightbox .img {
        width: 100%;
    }

    .divbtn {
        transform: scale(0.8);
    }
}

.sp_swiper_solution_section {
    display: none;
}

.solution_section_h1 {
    text-align: center;
    font-size: 2em;
    margin-bottom: 20px;
    color: white;
}

.solution_section_h1::after {
    content: '';
    display: block;
    width: 50px;
    height: 3px;
    background: rgb(15, 119, 51);
    margin: 10px auto;
}

.solution_section .swiper_solution_section {
    width: 80%;
    /* height: 63%; */
}

.solution-swiper-slide {
    /* background: transparent!important; */
    width: 277px;
    height: 240px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: linear-gradient(-45deg, transparent 20px, #fff 0) !important;
}

.solution-swiper-slide::before {
    content: '';
    height: 200px;
    width: 100%;
    background: transparent !important;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
}

.solution-swiper-slide .img {
    height: 180px;
    overflow: hidden;
    box-shadow: 0 -9px 15px black;
}

.solution-swiper-slide .img img {
    transition: 0.5s;
}

.solution-swiper-slide .subtext {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: 60px;
}

.solution-swiper-slide:hover img {
    transform: scale(1.2);
}

.solution-swiper-slide:hover .subtext {
    color: rgb(214, 35, 36);
}

/* 后期修改 */
.subtext span {
    width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp_swiper_solution_section .swiper-pagination,
.swiper_solution_section .swiper-pagination {
    visibility: hidden;
}

/*适配≥≥≥≥≥≥≥ 解决方案的手机端适配 */
@media screen and (max-width: 1200px) {

    .sp_swiper_solution_section {
        display: block;
    }

    .solution_section h1 {
        font-size: 1.5em;
        margin-bottom: 30px;
    }

    .solution_section .subtext {
        display: flex;
        flex-direction: column;
    }

    .swiper_solution_section {
        display: none;
        height: 63%;
    }

    .sp_solution-swiper-slide {
        background: transparent !important;
        width: 217px;
        height: 228px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        background: linear-gradient(-45deg, transparent 20px, #fff 0) !important;
    }

    .sp_solution-swiper-slide::before {
        content: '';
        height: 200px;
        width: 100%;
        background: transparent !important;
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
    }
    .solution_section .img {
        width: 280px;
        max-height: 220px;
    }
}




/* 公用的按钮效果 */
.divbtn {
    border: 1px solid rgb(191, 193, 193);
    border-radius: 30px;
    color: rgb(90, 93, 110);
    width: 180px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    position: relative;
    display: block;
}

.divbtn::before {
    content: '';
    width: 0px;
    height: 0px;
    background: rgb(15, 119, 51);
    position: absolute;
    left: 0%;
    right: 0%;
    bottom: 0;
    top: 0;
    margin: auto;
    border-radius: 30px;
    transition: 0.5s;
}

.divbtn:hover::before {
    width: 100%;
    height: 100%;
}

.divbtn::after {
    content: '了解更多';
    position: absolute;
    left: 0%;
    right: 0%;
    bottom: 0;
    top: 0;
    margin: auto;
    transition: 0.5s;
}

.divbtn:hover::after {
    width: 100%;
    height: 100%;
    color: white;
}