
/* common css */
.mar_top{margin-top: 6%;}
.pad_tb{padding: 6% 0;}
@media only screen and (max-width: 1450px) {
    .mar_top{margin-top: 5%;}
    .pad_tb{padding: 5% 0;}
}
@media only screen and (max-width: 980px) {
    .mar_top{margin-top: 30px;}
    .pad_tb{padding: 30px 0;}
}

.web_main{color: #333;}

.web_th{text-align: center;}
.web_th .title{display: inline-block; font-family: 'SourceHanSansCN-Regular'; font-weight: bold; font-size: 50px; line-height: 1.3; text-transform: uppercase; color: #333;}
.web_th .title span{color: var(--commonColor);}
.web_th a.title:hover{color: var(--commonColor);}
.th_left{text-align: left;}
@media only screen and (max-width: 1620px) {
    .web_th .title{font-size: 46px;}
}
@media only screen and (max-width: 1450px) {
    .web_th .title{font-size: 42px;}
}
@media only screen and (max-width: 1300px) {
    .web_th .title{font-size: 36px;}
}
@media only screen and (max-width: 980px) {
    .web_th .title{font-size: 26px;}
}

/* banner */

.slider_banner .swiper-pagination {
    padding-bottom: 15px;
}

.slide-page-box {
    display: none;
}

.slider_banner .swiper-pagination {
    width: 100%;
    left: 0px;
    bottom: 20px;
}

.slider_banner .slide_img {
    display: block;
    position: relative;
    overflow: hidden;
}

.slider_banner .slide_info {
    background-color: rgb(245, 245, 245);
    padding: 1.8em 0px;
    text-align: center;
}

.slider_banner .slide_info h4,
.slider_banner .slide_info h3 {
    height: 1.5em;
    line-height: 1.5em;
    overflow: hidden;
}

.slider_banner .slide_info h4 {
    font-size: 24px;
    font-weight: normal;
    color: rgb(136, 136, 136);
}

.slider_banner .slide_info h3 {
    font-size: 42px;
    color: rgb(102, 102, 102);
}

.slider_banner .slide_info h3::after {
    content: "ÃƒÆ’Ã‚Â¯ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¾ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¦";
    font-family: fontawesome;
    padding-left: 0.3em;
    font-size: 0.72em;
    font-weight: normal;
}

.slider_banner .slide_info:hover h3::after {
    padding-left: 0.7em;
}

.bannerJt {
    position: absolute;
    bottom: 60px;
    right: 260px;
    display: flex;
    align-items: center;
    z-index: 1;
}

.bannerJt img {
    width: 50px;
    margin-right: 20px;
    transition: all 0.3s ease 0s;
    cursor: pointer;
}

.bannerJt img:last-child {
    margin-right: 0;
}

.bannerJt img:hover {
    transform: scale(1.1);

}

.sj .swiper-slide img{
    width: 100%;
}


.sji {
    width: 100%;
    height: auto;
    display: none; margin-top: 98px;
}

.sji a {
    width: 100%;
    height: auto;
}

.sji a img {
    width: 100%;
    height: 100%;
}


@media only screen and (max-width: 950px) {
    .diannao {
        display: none;
    }

    .sji {
        display: block;
    }
}

/* swiper-prev swiper-next */
.common-next, .common-prev{width: 30px; height: 30px; line-height: 26px; margin-top: -15px; font-size: 28px; border: 2px solid #7C7C7C; color: #7C7C7C; border-radius: 50%; display: none; opacity: 1;}
.common-prev:hover, .common-next:hover{background: var(--commonColor); border-color: var(--commonColor); color: #fff;}
.common-prev{left: -70px;}
.common-next{right: -70px;}
.common-prev::before, .common-next::before{display: block; width: 100%; height: 100%;}
.common-prev::before{content: '\f104';}
.common-next::before{content: '\f105';}

.common-pagination{display: none;}

@media only screen and (max-width: 1620px) {
	.common-prev{left: -60px;}
	.common-next{right: -60px;}
}
@media only screen and (max-width: 1024px) {
	.common-prev{left: -30px;}
	.common-next{right: -30px;}
}
@media only screen and (max-width: 980px) {
	.common-next, .common-prev{display: block;}
}

/* home_class */
.home_class{background: #F7F7F7;}
.home_class .class_tab{margin-top: 4%; position: relative;}
.swiper_tab{overflow: hidden;}

.home_class .class_inner{margin-top: 3%;}

.class_tab .swiper-slide{width: calc((100% - 80px) / 5); margin-right: 20px; height: auto; padding: 2px 0;}
.class_tab .tab_item{font-family: 'SourceHanSansCN-Medium'; font-size: 22px; text-transform: capitalize; border: 1px solid #333; cursor: pointer; margin-right: 0; padding: 12px 14px; transition: 0.5s ease all; text-align: center; display: flex; align-items: center; justify-content: center; height: 100%; line-height: 1.3;}
.class_tab .swiper-slide:last-child .tab_item{margin-right: 0;}
.class_tab .tab_item:hover{border-color: var(--commonColor); color: var(--commonColor);}
.class_tab .active .tab_item{background: var(--commonColor); border-color: var(--commonColor); color: #fff;}

.class_inner .class_con{ animation: fadeInUpA 0.5s; display: none;}
.class_pro_div {align-items: flex-start;}
.home_pro_item{height: 100%; border-radius: 3px; position: relative; width: calc((100% - 45px) / 4); margin-right: 15px;}
.home_pro_item:nth-child(4n){margin-right: 0;}
.home_pro_item:nth-child(n+5){margin-top: 30px;}
.home_pro_item .pic{padding-bottom: 100%; border: 2px solid #F5F5F5; background-color: #fff;}
.home_pro_item .item_icon{display: block; width: 60px; height: 60px;  border-radius: 50%; background: url(../img/icon_plus.png) no-repeat center; opacity: 0; background-size: 20px auto; background-color: rgba(var(--comColorRgb), 0.8); position: absolute; left: 50%; top: 50%; margin: -15px 0 0 -30px;}
.home_pro_item .title{font-family: 'SourceHanSansCN-Medium'; font-size: 22px; line-height: 1.3; margin: 20px 0 0; text-align: center; color: #333; text-transform: capitalize;}

.home_pro_item:hover .item_icon{margin-top: -30px; opacity: 1;}
.home_pro_item:hover .title{color: var(--commonColor);}

@media only screen and (max-width: 1450px) {
    .class_tab .tab_item{font-size: 20px; padding: 10px 12px;}
	.home_pro_item .title{font-size: 20px;}
}
@media only screen and (max-width: 1300px) {
    .class_tab .swiper-slide{width: calc((100% - 48px) / 5); margin-right: 12px;}
	.home_class .class_tab{zoom: 0.9;}
	.home_class .class_inner{zoom: 0.9;}
}
@media only screen and (max-width: 980px) {
    .home_class .class_tab{zoom: 1; margin-top: 20px;}
	.home_class .class_inner{zoom: 1; margin-top: 20px;}

    .class_tab .swiper-slide{width: auto; margin-right: 0;}
    .class_tab .tab_item{font-size: 16px; padding: 10px 16px; min-width: 140px; margin-right: 12px;}
    .class_tab .common-next, .class_tab .common-prev{display: none !important;}
    .class_tab .swiper_class_tab {margin-bottom: 0;}

	.home_pro_item{width: calc(50% - 5px); margin-right: 10px;}
    .home_pro_item:nth-child(2n){margin-right: 0;}
    .home_pro_item:nth-child(n+3){margin-top: 20px;}
	.home_pro_item::before{opacity: 1; height: 12px; bottom: -12px;}
	.home_pro_item:hover::before{opacity: 1; height: 12px;}
	.home_pro_item .title{font-size: 16px; margin-top: 14px;}
    .home_pro_item .item_icon{width: 42px; height: 42px; margin: -8px 0 0 -21px; background-size: 16px auto;}
    .home_pro_item:hover .item_icon{margin-top: -21px;}
}

/* home_about */
.home_about{overflow: hidden;}
.about_inner{position: relative; background-position: center; background-size: cover; background-repeat: no-repeat; z-index: 0;}
.about_inner::before{content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(var(--comColorRgb), 0.1); z-index: 0;}
.home_about .about_left{width: 50%; border-radius: 0 80px 0 0; position: absolute; left: 0; top: 0; height: 100%; overflow: hidden; z-index: 2;}
.home_about .about_left img{display: block; width: 100%; height: 100%; object-fit: cover; transition: all 0.5s ease;}
.home_about .about_left:hover img{transform: scale(1.05);}
.home_about .layout{overflow: hidden;}
.home_about .web_th{width: 46%; float: right; padding: 5% 0; position: relative; z-index: 3;}
.home_about .web_th a.title{border-bottom: 2px solid transparent;}
.home_about .web_th a.title:hover{border-bottom: 2px solid var(--commonColor);}
.home_about .web_th .brief{color: #1B1B1B; font-family: 'SourceHanSansCN-Medium'; font-size: 18px; line-height: 2.25; margin: 4% 0 5%;}
.home_about .web_th .more{display: inline-block; background: var(--commonColor); color: #fff; padding: 10px 32px; font-size: 20px; font-family: 'SourceHanSansCN-Medium'; border: 2px solid var(--commonColor);}
.home_about .web_th .more:hover{background: rgba(var(--comColorRgb), 0.2); color: var(--commonColor);}

.about_img_list{margin-top: 32px;}
.about_img_list .about_item{width: 32.4%; margin-right: 1.4%;}
.about_img_list .about_item:nth-child(3n){margin-right: 0;}
.about_img_list .about_item .pic{padding-bottom: 64%;}

@media only screen and (max-width: 1450px) {
    .home_about .about_left{border-radius: 0 70px 0 0;}
    .home_about .web_th .brief{line-height: 2; font-size: 17px;}
    .home_about .web_th .more{font-size: 18px;}
}
@media only screen and (max-width: 1300px) {
    .home_about{zoom: 0.9;}
    .home_about .about_left{border-radius: 0 60px 0 0;}
    .home_about .web_th{padding: 40px 0;}
    .home_about .web_th .brief{line-height: 1.75; margin: 15px 0 20px;}
}
@media only screen and (max-width: 980px) {
    .home_about{zoom: 1;}
    .home_about .about_left{position: relative; left: unset; width: 100%; border-radius: 0;}
    .home_about .web_th{width: 100%; float: none; text-align: center; padding: 30px 0;}
    .home_about .web_th .brief{text-align: left; font-size: 16px; line-height: 2; margin: 10px 0 20px;}
    .home_about .web_th .more{padding: 8px 26px;}

    .about_img_list{flex-direction: column; margin-top: 5px; padding: 0 15px;}
    .about_img_list .about_item{width: 100%; margin-top: 15px;}

}


/* home_customer */
.home_customer{overflow: hidden; background-repeat: no-repeat; background-position: center bottom; background-size: 100% auto; padding-bottom: 4.5%;}
.customer_div{margin-top: 4%; align-items: unset;}
.customer_div .item_div{width: 32%;}
.customer_div .item_mid{margin: 0 2%;}
.home_cus_item{position: relative;}
.home_cus_item:nth-child(n+2){margin-top: 5.5%;}
.home_cus_item .pic{padding-bottom: 77.5%; border-radius: 20px; background-color: #fff;}
.item_mid .home_cus_item .pic{padding-bottom: 160.5%;}
.home_cus_item .cus_info{position: absolute; left: 0; bottom: 0; right: 0; font-family: 'SourceHanSansCN-Regular'; padding: 30px 26px 18px; background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.8)); border-radius: 0 0 20px 20px;}
.home_cus_item .cus_info .title{color: #fff; font-size: 18px; font-weight: bold;}
.home_cus_item .cus_info .brief{color: #fff; line-height: 20px; margin-top: 5px; font-size: 14px; min-height: 40px;}

@media only screen and (max-width: 1450px) {
    .home_cus_item .pic{border-radius: 16px;}
    .home_cus_item .cus_info{padding: 20px 20px 16px;}
}
@media only screen and (max-width: 980px) {
    .home_customer{padding-bottom: 30px;}
    .customer_div{flex-direction: column;}
    .customer_div .item_div{order: 2; margin-top: 12px; width: 100%;}
    .customer_div .item_mid{order: 1; margin: 0;}
    .home_cus_item:nth-child(n+2){margin-top: 12px;}
    .home_cus_item .pic{border-radius: 14px;}
    .home_cus_item .cus_info .brief{min-height: unset;}
}


/* home_certificate */
.home_certificate{overflow: hidden; background-repeat: no-repeat; background-position: center; background-size: 100% auto; background-color: #F7F7F7; height: 0; padding-bottom: 50.8%; position: relative;}
.home_cer_inner{position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 5% 0;}

.home_cer_ul{width: 47.7%; margin-left: 36.8%; margin-top: 10.2%;}
.home_cer_ul .cer_item{width: calc(100% / 3); background: url(../img/cer_border1.png) no-repeat center; background-size: 100% 100%; padding: 2.75% 2.6%;}
.home_cer_ul .cer_item:nth-child(2){position: relative; z-index: 1; transform: scale(1.16) translateY(-10px);}
.home_cer_ul .cer_item .pic{padding-bottom: 135%;}
.home_cer_ul .cer_item:hover .pic img{transform: scale(1.1);}

@media only screen and (max-width: 1450px) {
    .home_cer_ul{margin-top: 9.8%;}
}
@media only screen and (max-width: 980px) {
    .home_certificate{padding-bottom: 68.6%; background-size: 138% auto;}
    .home_cer_inner{padding: 6% 0;}
    .home_cer_ul{margin-top: 10.6%; margin-left: 31.6%; width: 64.2%;}
    .home_cer_ul .cer_item:nth-child(2){transform: scale(1.16) translateY(-4px)}
}


/* home_news */
.home_news{background: #F8FAFC; padding: 6% 0 5%;}
.home_news_inner{margin-top: 4%; align-items: unset;}
.home_news_item{border: 1px solid #E2E8F0; overflow: hidden; border-radius: 10px; width: 31.5%; margin-right: 2.75%; background: #fff;}
.home_news_item:nth-child(3n){margin-right: 0;}
.home_news_item .pic{padding-bottom: 71%;}
.home_news_item .date{position: absolute; left: 0; bottom: 0; right: 0; padding: 0 24px; line-height: 35px; color: #fff; background-color: rgba(var(--comColorRgb), 0.46);}
.home_news_item .news_info{flex: 1; padding: 24px 24px 30px; align-items: unset;}
.home_news_item .title{font-size: 20px; line-height: 1.5; flex: 1; color: #333;}
.home_news_item .brief{color: #666; line-height: 24px; height: 48px; margin: 12px 0 20px;}
.home_news_item .more{display: inline-block; line-height: 28px; color: var(--commonColor); text-decoration: underline;}

.home_news_item:hover .title{color: var(--commonColor);}
.home_news_item:hover .more{text-decoration: none; background: var(--commonColor); color: #fff; padding: 0 10px;}

@media only screen and (max-width: 1450px) {
    .home_news_item{width: 32%; margin-right: 2%;}
    .home_news_item .date{padding: 0 20px;}
    .home_news_item .news_info{padding: 20px 20px 25px;}
    .home_news_item .title{font-size: 19px;}
}
@media only screen and (max-width: 1300px) {
    .home_news_inner{zoom: 0.9;}
}
@media only screen and (max-width: 980px) {
    .home_news{padding: 30px 0;}
    .home_news_inner{zoom: 1; flex-direction: column; margin-top: 20px;}
    .home_news_item{margin-top: 20px; width: 100%; margin-right: 0;}
    .home_news_item:first-child{margin-top: 0;}
    .home_news_item .date{padding: 0 14px;}
    .home_news_item .news_info{padding: 20px 14px 24px;}
    .home_news_item .brief{margin: 10px 0 18px;}

}

