@charset "UTF-8";

.swiper {
    height: 100%;
    overflow: hidden;
}

a.more_pic {
    max-width: 14.375vw;
    width: 100%;
    border-radius: 2.813vw;
    position: relative;
    overflow: hidden;
    text-align: center;
    font-size: 1.25vw;
    line-height: 3.333vw;
    color: var(--li);
    font-weight: bold;
    margin-top: 4%;
}

a.more_pic:before {
    content: '';
    background: rgba(255, 255, 255, 0.33);
    backdrop-filter: blur(10px);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
    left: 0;
    top: 0;
    transition: all .5s ease;
}

a.more_pic:hover:before {
    background: var(--li);
}

a.more_pic:hover {
    color: #fff;
}

.banenr_center {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #000;
    line-height: 0;
}

.banenr_center .banner_Ele,
.banenr_center .banenr_gif {
    position: relative;
    width: 100%;
    height: auto;
    transform: perspective(1200px) translate3d(0, 0, 100px);
    opacity: .85;
}

.mySwiper2 .swiper-slide-active .banner_Ele {
    transition: all 5s ease 0s;
    transform: perspective(1200px) translate3d(0, 0, 0px);
}

.ban_text {
    position: absolute;
    z-index: 2;
    left: 50%;
    top: 45%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
}

.ban_text h3 {
    font-size: 2.188vw;
    color: #fff;
    line-height: 130%;
    position: relative;
    font-weight: 600;
    width: 39.063vw;
    text-shadow: 0px 5px 8px rgba(0, 0, 0, 0.29);
}


.ban_text .Public_more {
    --public: rgba(255, 255, 255, 0.35);
    margin-top: 3vw;
}

.mySwiper2 .swiper-slide .ban_text>* {
    transform: translateY(100%);
    opacity: 0;
}

.mySwiper2 .swiper-slide-active .ban_text>* {
    transform: translateY(0);
    opacity: 1;
    transition: transform 1.5s ease .5s, opacity 1.5s ease .5s, background-color .5s ease;
}

.scroll-icon {
    position: absolute;
    z-index: 6;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 2.5vw;
    width: 1.563vw;
    color: #fff;
    border-radius: 1.042vw;
    -webkit-transition: .4s;
    transition: .4s;
    right: 3%;
    bottom: 5%;
    transform: translateX(-50%);
    background: #fff;
}

.scroll-icon::after {
    content: '';
    width: 0.208vw;
    height: 0.313vw;
    background-color: #666;
    border-radius: 50%;
    -webkit-animation: scroll-icon 2.2s infinite cubic-bezier(0.65, 0.05, 0.36, 1);
    animation: scroll-icon 2.2s infinite cubic-bezier(0.65, 0.05, 0.36, 1);
}


/* 产品 */
.h_product {
    background: #F8F8F8;
    padding: 7.292vw 0;
}

.h_product .center {
    position: relative;
}

.h_product h2 {
    font-size: 2.188vw;
    color: #333;
    line-height: 120%;
}

.h_product h2+p {
    font-size: 1.042vw;
    color: #333;
}

.h_pro_tit+a {
    position: absolute;
    right: 3vw;
    color: #9D9D9D;
    font-size: 1.094vw;
    top: 1.5vw;
}


.h_pro_bottom {
    margin-top: 2.083vw;
    display: flex;
    flex-wrap: wrap;
}

.h_pro_bottom .h_pro_left {
    width: 10.417vw;
    display: flex;
    flex-wrap: wrap;
    gap: 0.781vw;
}

.h_pro_bottom .h_pro_right {
    width: calc(100% - 10.417vw);
    position: relative;
}

.tab_toplist {
    background: rgba(0, 0, 0, 0.04);
    border-radius: 2.083vw;
    padding: 1.354vw 1.042vw;
    width: 100%;
    border: 0.208vw solid transparent;
    transition: all .5s ease;
    cursor: pointer;
}

.tab_toplist p {
    font-size: 0.729vw;
    color: #333;
    font-weight: bold;
    line-height: 150%;
    min-height: 2.188vw;
}

.tab_toplist .pro_imgbox {
    height: 1.979vw;
    margin-bottom: 0.365vw;
}

.tab_toplist .pro_imgbox img {
    height: 100%;
    object-fit: contain;
}

.active.tab_toplist {
    border-color: #FFBD1F;
    box-shadow: 0.625vw 0px 0.781vw 0px rgba(16, 16, 16, 0.22);
    background: #fff;
}


.h_tab_left {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.active.h_tab_left {
    opacity: 1;
    visibility: visible;
}

.active.h_tab_left .h_tab_right {
    width: 10.417vw;
    height: 100%;
    background: linear-gradient(180deg, rgba(238, 238, 238, 0.55) 0%, rgba(216, 216, 216, 0) 100%);
    border-radius: 7.656vw;
    padding: 4.167vw 1.302vw 0;
    position: absolute;
    right: 0;
    top: 0;
}

.pro_right_box {
    max-width: 33.854vw;
    margin: 0 auto;
}

.pro_right_box p.pro_right_tit {
    font-size: 1.25vw;
    color: #333;
    text-align: center;
    margin-bottom: 2.604vw;
}

.pro_right_box .Limg_con {
    padding-bottom: 78%;
}

.h_tab_left .swiper {
    width: calc(100% - 10.417vw);
    margin: 0;
}

.active.h_tab_left .h_tab_right .Limg_con {
    padding-bottom: 98%;
}

.active.h_tab_left .h_tab_right ul {
    display: flex;
    flex-wrap: wrap;
    gap: 1.823vw;
    overflow: hidden;
    height: 100%;
}

.active.h_tab_left .h_tab_right ul li {
    width: 100%;
    cursor: pointer;
}

.active.h_tab_left .h_tab_right ul .active {
    display: none;
}

.yuan {
    position: absolute;
    transform-style: preserve-3d;
    width: 43.49vw;
    transform: translate(-50%, 30%) rotateX(65deg);
    left: calc(50% - 5.208vw);
    bottom: 0;
    padding: 0.26vw;
}

.yuan:before {
    content: '';
    background: linear-gradient(to bottom, #f8f8f8, transparent);
    position: absolute;
    width: 100%;
    height: 75%;
    left: 0;
    top: 0;
    z-index: 2;
}

.yuan span {
    position: relative;
    padding-bottom: 100%;
    border: 0.104vw solid #ccc;
    border-radius: 50%;
    animation: orbitRotation 20s linear infinite;
    display: block;
}

@keyframes orbitRotation {
    100% {
        transform: rotate(360deg);
    }
}


.yuan span:before {
    content: '';
    width: 0.625vw;
    height: 0.625vw;
    background: #444444;
    left: 0;
    position: absolute;
    top: 50%;
    border-radius: 50%;
    transform: translate(-6px);
}

.yuan span:after {
    content: '';
    width: 0.625vw;
    height: 0.625vw;
    background: #444444;
    right: 0;
    position: absolute;
    bottom: 50%;
    border-radius: 50%;
    transform: translate(6px);
}


/* 关于我们 */
.h_about {
    padding: 5.208vw 0;
    background: url(/src/image/bj.jpg) top center/cover no-repeat;
}

.h_about h2 {
    font-size: 2.188vw;
    color: #000;
    text-align: center;
    text-transform: uppercase;
}

.h_about h2+p {
    font-size: 0.833vw;
    color: #333;
    max-width: 58.854vw;
    margin: 0 auto;
    text-align: center;
}

.h_about ul {
    width: 42.708vw;
    margin: 1.302vw auto;
    display: flex;
    justify-content: space-between;
}

.h_about ul li {
    max-width: 7.813vw;
    text-align: center;
    font-size: 0.625vw;
    color: #444;
}

.h_about ul li img {
    transition: all .5s ease;
    margin-bottom: 0.417vw;
    width: 3.802vw;
}
.h_about ul li:hover img{
    transform: translateY(-10px) rotateY(180deg);
}
.h_about .banner_Ele {
    width: 54.688vw;
    margin: 0 auto;
    cursor: pointer;
    border-radius: 0.521vw;
    overflow: hidden;
    display: block;
}

a.more_ab {
    width: 20.573vw;
    line-height: 4.167vw;
    background: var(--li);
    border-radius: 0.208vw;
    display: block;
    margin: 3.385vw auto 0;
    text-align: center;
    font-size: 1.25vw;
    color: #fff;
    transition: all .5s ease;
}

a.more_ab svg {
    fill: #fff;
    width: 1.563vw;
    height: auto;
    transition: all .5s ease;
    vertical-align: middle;
}

a.more_ab:hover {
    border-radius: 2.604vw;
}

a.more_ab:hover svg {
    transform: translateX(1.042vw);
}

/* 企业发展 */
.h_development {
    background: url(/src/image/development.jpg) top center / cover no-repeat;
    padding: 10.417vw 0;
}

.h_development div {
    width: 67.188vw;
    margin: 0 auto;
    color: #fff;
}

.h_development h2 {
    font-size: 2.188vw;
}

.h_development h3 {
    font-size: 1.042vw;
    margin: 1.563vw 0 0.26vw;
    font-weight: 500;
}

.h_development p {
    font-size: 1.042vw;
    font-weight: 100;
}

.h_development a.more_ab {
    margin-left: 0;
}

/* 合作客户 */
.h_partner {
    background: #F8F8F8;
    padding: 5.208vw 0 7.292vw;
    text-align: center;
}

.h_partner h2 {
    font-size: 2.188vw;
    color: #000;
}

.h_partner h2:before {
    content: '';
    width: 4.688vw;
    height: 0.313vw;
    background: #E8B211;
    display: block;
    margin: 0 auto 1.042vw;
}

.h_partner h2+p {
    font-size: 0.833vw;
    color: #333;
    width: 65.625vw;
    margin: 0 auto 4.167vw;
}

.h_partner .swiper-wrapper {
    transition-timing-function: linear;
}

.swiper-center_par {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background: #fff;
}

.swiper-center_par img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.h_partner .par_Swiper1 {
    margin-bottom: 2.604vw;
}

/* 新闻 */
.h_news {
    padding: 5.208vw 0 10.417vw;
}

.h_news>div {
    width: 76.302vw;
    margin: 0 auto;
}

.h_news h2 {
    font-size: 2.188vw;
    color: #333;
    text-transform: uppercase;
}

.h_news h2+p {
    font-size: 0.833vw;
    color: #333;
}

ul.news_list {
    display: flex;
    gap: 2vw;
    flex-wrap: wrap;
    margin-top: 3.125vw;
}

ul.news_list li {
    width: calc((100% - 4vw) / 3);
}

ul.news_list .newslist_ts .newbox {
    background: #FFD160;
}

ul.news_list .newslist_ts:nth-of-type(3n - 1) .newbox {
    background: #fff;
}

ul.news_list .newslist_ts:nth-of-type(3n - 1) .newbox * {
    color: #333;
    fill: #333;
}

ul.news_list li:nth-of-type(3n - 1) {
    transform: translateY(3vw);
}

.tab-li .active {
    color: var(--li);
}

ul.news_list li .newbox {
    display: block;
    position: relative;
    box-shadow: 0px 6px 14px 0px rgba(0, 0, 0, 0.15);
    border-radius: 0.521vw;
    overflow: hidden;
}

ul.news_list li>a .Limg_cov {
    padding-bottom: 127%;
}

ul.news_list li:hover img {

    transform: scale(1.1);
}

ul.news_list li .info {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 10% 5% 5%;
    color: #FFF;
    font-size: 1.25vw;
    font-weight: 500;
    line-height: 150%;
    transition: all .5s ease;
    background: linear-gradient(0, #000000 0%, rgba(0, 0, 0, 0) 100%);
}

ul.news_list .newslist_ts .info {
    background: none;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #333;
    padding: 10%;
}

ul.news_list .newslist_ts .info .newssum {
    line-clamp: 6;
    -webkit-line-clamp: 6;
    font-size: 0.938vw;
    line-height: 180%;
    margin: 5% 0;
    font-weight: normal;
}

ul.news_list li .info .tit {
    font-size: 0.938vw;
    line-height: 150%;
    font-weight: 700;
    margin-top: 3%;
    transition: all .5s ease;
    fill: #fff;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

ul.news_list .newslist_ts .info .tit {
    fill: #333;
}

ul.news_list li .info .tit svg {
    margin: 0 0 0 0.521vw;
    width: 1.354vw;
    height: auto;
}


@media only screen and (min-width:769px) {}

@media only screen and (max-width:768px) {
    .banenr_center {
        height: 350px;
    }
    .banenr_center img.banner_Ele {
        height: 100%;
        object-fit: cover;
    }
    .ban_text h3 {
        font-size: 20px;
        width: 90%;
    }

    .h_product {
        padding: 50px 0;
    }

    .h_product h2 {
        font-size: 20px;
    }

    .h_product h2+p {
        font-size: 14px;
    }

    .h_pro_tit+a {
        font-size: 14px;
    }

    .h_pro_bottom {
        margin-top: 30px;
    }

    .h_pro_bottom .h_pro_left {
        width: 100%;
        gap: 10px;
        margin-bottom: 30px;
    }

    .tab_toplist {
        background: rgba(0, 0, 0, 0.04);
        border-radius: 10px;
        padding: 10px;
        width: calc((100% - 10px) / 2);
        display: flex;
        align-items: center;
    }

    .h_pro_bottom .h_pro_right {
        width: 100%;
        height: 55vw;
    }

    .tab_toplist .pro_imgbox {
        height: 38px;
        margin-bottom: 0;
        width: 38px;
    }

    .tab_toplist p {
        font-size: 12px;
        color: #333;
        font-weight: 500;
        line-height: 120%;
        min-height: 0;
        width: calc(100% - 38px);
        padding-left: 10px;
    }

    .pro_right_box p.pro_right_tit {
        font-size: 14px;
    }

    .pro_right_box {
        max-width: 60vw;
    }

    .active.h_tab_left .h_tab_right {
        position: absolute;
        right: 0;
        top: 0;
        width: 16vw;
        padding: 20px 10px;
    }

    .h_tab_left .swiper {
        width: calc(100% - 16vw);
        margin: 0 auto 0 0;
    }

    .h_tab_left .h_tab_right ul {
        height: 100%;
    }

    .yuan {
        width: 68vw;
        left: calc(50% - 8vw);
    }

    .yuan span:before {
        width: 8px;
        height: 8px;
        transform: translate(-4px);
    }

    .yuan span:after {
        width: 8px;
        height: 8px;
        transform: translate(4px);
    }

    .h_about {
        padding: 50px 0;
    }

    .h_about h2 {
        font-size: 20px;
    }

    .h_about h2+p {
        font-size: 14px;
        max-width: 90vw;
    }

    .h_about ul {
        width: 90vw;
        margin: 20px auto;
        flex-wrap: wrap;
        gap: 5px;
    }

    .h_about ul li {
        max-width: 50%;
        width: calc((100% - 5px) / 2);
        text-align: center;
        font-size: 12px;
        color: #444;
        background: #eee;
        padding: 10px;
    }

    .h_about ul li img {
        width: 50px;
    }

    .h_about .banner_Ele {
        width: 90vw;
    }

    a.more_ab {
        width: 120px;
        line-height: 35px;
        font-size: 12px;
    }

    a.more_ab svg {
        width: 15px;
    }

    .h_development div {
        width: 90vw;
    }

    .h_development h2 {
        font-size: 18px;
    }

    .h_development h3 {
        font-size: 12px;
        margin: 12px 0 5px;
    }

    .h_development p {
        font-size: 12px;
        line-height: 200%;
    }

    .h_partner {
        padding: 50px 0;
    }

    .h_partner h2 {
        font-size: 20px;
    }

    .h_partner h2:before {
        width: 50px;
        height: 3px;
    }

    .h_partner h2+p {
        font-size: 14px;
        width: 90vw;
    }

    .h_news>div {
        width: 90vw;
    }

    .h_news h2 {
        font-size: 20px;
    }

    .h_news h2+p {
        font-size: 14px;
    }

    ul.news_list {
        gap: 10px;
    }

    ul.news_list li {
        width: calc((100% - 10px) / 2);
    }

    ul.news_list li:nth-of-type(3n - 1) {
        transform: none;
    }

    .h_news {
        padding: 50px 0;
    }

    ul.news_list li .info {
        font-size: 14px;
    }

    ul.news_list .newslist_ts .info .newssum {
        display: none;
    }

    ul.news_list li .info .tit {
        font-size: 14px;
    }

    ul.news_list li .info .tit svg {
        margin: 0 0 0 10px;
        width: 14px;
    }

}