@charset "utf-8";

/*公共样式*/
html {
    /*scroll-behavior: smooth;*/
}.banner .banner-title .en-text1{font-size: 40px}
.banner .banner-title .en-text2{font-size: 32px}


body{background: #fff}
.montLight{font-family: 'montLight'; font-weight: lighter}
.montBold{font-family: 'montBold';font-weight: bold}
.montMedium{font-family: 'montMedium';}
.montMR{font-family: 'montMR';}
.montSemBold{font-family: 'montSemBold';}
/*.sy{font-family: 'Source Han Sans Medium ,sans-serif'}*/
.rz{position: relative;}
.z9{z-index: 9}
.toUpper{text-transform: uppercase}
.color28{color: #030dad; margin-bottom: 10px}
.font30{font-size: 28px;font-weight: lighter;}
.font68{font-size: 66px}
.font66{font-size: 66px}
.font34{font-size: 34px;font-weight: lighter; color: #111}
.font28{font-size: 28px;}
.font25{font-size: 25px;}
.font16{font-size: 16px;}
.font40{font-size: 40px;}
.trans{transition:  all .3s cubic-bezier(.61,1,.88,1)}
.none{display: none}
.toBlock{display: block}
.bgcf{background: #fff}
.w90 {
    width: 90%;
    margin: 0 auto;
}
.svg-bg{
    width: 46px;
    height: 46px;
    position: relative;
    background: #030dad;
    border-radius: 50%;
}

.svg-bg img {
    width: 60%;
    height:auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

}
.page-choice{margin-bottom: 50px;width: 75%}
.layui-laypage .layui-laypage-curr .layui-laypage-em{background-color: #030dad !important;}
.layui-laypage a:hover{color: #030dad}
/*头部样式*/
.header-btn .yuyan{ color: #fff;display: flex;margin-right: 40px;position: relative}
.header-btn .yuyan > .nowlang {color: rgba(255, 255, 255, 0.75);cursor: pointer}
.header {display: flex;justify-content: space-between; position: fixed;top: 0;left: 0;align-items: center;
    width: 100%;height: 96px;padding: 0 70px 0 110px;box-sizing: border-box;z-index: 99999999;/*overflow: hidden;*/transition: .5s;}
.header.on{background: #fff; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);}
.header .logo .on{display: none}
.header .logo .mr{display: block}
.header-btn{display: flex;z-index: 9999}
.header-btn .yuyan .boll img{vertical-align: middle}
.header .nav-btn{width: 75px;height: 75px;border: 1px solid #fff;border-radius: 50%;cursor: pointer}
.header-btn .yuyan .boll{margin-right: 10px}
.header .nav-list{display: flex;height: 20px;transition: .5s;overflow: hidden;margin-top: 11px}
.header .nav-list li{width: 150px;text-align: center}
.header .nav-list .nav1{padding-bottom: 29px;color: rgba(255, 255, 255, 0.75);font-size: 20px;transition: .5s;background: linear-gradient(to right, #030dad, #030dad) left bottom no-repeat;background-size: 0 3px; line-height: 1}
.header .nav-list li .item{margin-top: 45px}
.header .nav-list li .item p a{font-size: 16px;color: #666;transition: .5s;padding: 10px 0;width: 100%;text-align: center;display: block}
.header .nav-list li .item p{margin-bottom: 5px}
.header .nav-list,
.header-btn{margin-top: 8px}
       .header .logo img {
        height: clamp(46px, 4vw, 66px);
        width: auto;
        display: block; margin-top: 8px
    }
.header .header-line{
    position: absolute;
    width: 100%;
    height: 1px;
    background: #cccccc;
    top: 82px;
    left: 0;
    display: none;
    z-index: 99;
}
/*.header:hover .header-line{display: block}*/
.header:hover{
    /*height: 366px;*/
    /*background: #fff;*/
}
/*.header:hover .nav-list{
    height: 250px;
}*/
.header .nav-list .nav1:hover{
    color: #030dad !important;
    background-size: 100% 3px;
}
.header:hover .yuyan .nowlang {color: #666}
.header:hover .nav-list .nav1{color: #000}
.header:hover .logo .mr{display: none !important}
.header:hover .logo .on{display: block}
.header:hover .header-btn .yuyan .boll{background: url("../images/yy_black.png") no-repeat}
.header .nav-list li .item p a:hover{color: #030dad;font-weight: bold;background: #fafafa;}

.nav-item{
    width: 100%;
    background: rgba(255,255,255,.95);
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0,0,0,.1);
    position: fixed;
    top: 96px;
    left: 0;
    z-index: 999;
    display: none;
}
.nav-item .nav-main{
    width: 94%;
    margin: 0 auto;
    display: flex;
    padding: 50px 0;
}
.nav-slogan{
    margin-left: 8.7%;
}
.nav-slogan .nav-tit{
    color: #030dad;
    font-size: 56px;
    line-height: 1;
}
.nav-slogan .nav-dsc{
    margin-top: 20px;
   width: 380px;
}
.nav-slogan .nav-dsc p{
    line-height: 24px;
    color: #666;
}
.nav-item .nav-img{
    width: 24%;
}
.nav-item .nav-ul{
    width: 32%;
    margin-left:10%; 
}
.nav-item .nav-ul li{ width: 50%; float: left}



.nav-item .nav-img img {
    width: 100%;
    height: auto;
    border-radius: 10px;
}
.nav-item .nav-ul a{
    position: relative;
    border-bottom: 1px solid #c9c9c8;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 59px;
    transition: .5s;
}
.nav-item .nav-ul a::after{
    content: '';
    position: absolute;
    bottom: -1px; /* 对齐边框 */
    left: 0;
    width: 0;
    height: 1px;
    background: #030dad;
    transition: width .8s;
}
.nav-item .nav-ul a:hover::after {
    width: 100%;
}
.nav-item .nav-ul a .tit{
    margin-left: 20px;
    transition: .3s; font-size: 20px
}
/*--------------------------------------------------------------------------------------------------------------------------------------550--*/
@media all and (max-width:1680px){  
.nav-item .nav-ul a .tit{
    margin-left: 20px;
    transition: .3s; font-size: 16px
}	
	
}
.nav-item .nav-ul a:hover{
    background-size: 100% 1px;
}
.nav-item .nav-ul a:hover .tit{
    color: #030dad;
}
.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    color: #030dad;
}
.nav-item .nav-ul a::before {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    display: block;
    content: "";
    width: 6px;
    height: 6px;
    background: #030dad;
    border-radius: 50%;
}
.nav-btn{position: relative}
.nav-btn div{width: 32px;height: 1px;border-top: 1px solid #fff;position: absolute;transform: translate(-50%, -50%); transition: all .3s cubic-bezier(.61,1,.88,1)}
.nav-btn .top{top: 46%;left: 40%}
.nav-btn .bottom{top: 54%;left: 60%}
.nav-btn.on .top{top: 63%;left: 46%;transform: rotate(30deg)  translate(-50%, -50%)}
.nav-btn.on .bottom{top: 41%;left: 46%;transform: rotate(-30deg)  translate(-50%, -50%)}
.nav-btn:hover div{left: 50%}

/*.header-btn.on .yuyan{color: #343538}*/
/*.header-btn.on .nav-btn {border: 1px solid #343538}*/
/*.header-btn.on .nav-btn div{border-top: 1px solid #343538}*/
/*.header-btn.on .yuyan .boll{background: url("../images/yy_black.png") no-repeat; }*/

.header.on .yuyan .nowlang{color: #666}
.header.on .nav-list .nav1{color: #000 !important;}
.header.on .logo .mr{display: none !important}
.header.on .logo .on{display: block !important}
.header.on .header-btn .yuyan .boll{background: url("../images/yy_black.png") no-repeat; }

.nav-content{
    position: absolute;
    right: 0;
    top: calc(50vh - 162px);
    z-index: 99;
}
.nav-content a{
    display: block;
    width: 123px;
    height: 108px;
    text-align: center;
    color: #fff;
    line-height: 108px;
    font-weight: bold;
    transition: background-color .3s cubic-bezier(.61,1,.88,1);
}
.nav-content .blue{background: #030dad}
.nav-content .black{background: #333538}
.nav-content .gray{background: #47494d}
.nav-content .blue:hover{background: #11549b}
.nav-content .black:hover{background: #212224}
.nav-content .gray:hover{background: #3e3f3f}

.header-btn .yuyan .boll{
    width: 19px;
    height:19px;
    background: url("../images/yy.png") no-repeat;
}

.banner{position: fixed;top: 0;left: 0;z-index: 1;width: 100%}
.moveban{
    animation: moveBanner 5s ease;
}
@keyframes moveBanner {
    0% {
        background-size: 110% 110%;
    }
    100% {
        background-size: 100% 100%;
    }
}
.banner .banner-title{position: absolute;left: 0px;top: 39%;transition: 2s ease;opacity: .5}
.banner .swiper-slide-active .banner-title{left: 110px;opacity: 1}
.banner .banner-title p{color: #fff;}
.banner .banner-title .cn-text{font-size: 80px;letter-spacing: 8px;margin-bottom: 0px}
.banner .banner-title .en-text{font-size: 32.79px;text-transform: uppercase;letter-spacing: 1px;}
.banner .banner-title .en-text .montLight{color: rgba(255, 255, 255, .75);}
.banner .banner-btn{
    display: flex;
    position: absolute;
    bottom: 7.61%;
    right: 6.33%;
    z-index: 9;
    gap: 30px;
}
.banner .banner-btn div{cursor: pointer; transition: .3s}
.banner .banner-btn div:hover{margin-top: -5px}
.banner .pagination{position: absolute;left: 5.6%;bottom: 30px}
.banner .pagination div{
    width: 117px;
    height: 36px;
    border-radius: 25px;
    text-align: center;
    color: #fff;
    line-height: 36px;
    font-size: 14px;
    margin-bottom: 10px;
    cursor: pointer;
    transition: .3s;
}
.banner .pagination div:hover{
    border: 3px solid #fff;
    margin-left: 10px;
}
.banner .pagination div.on{border: 3px solid #fff}
nav{
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    overflow: hidden;
    opacity: 0;
    transition: all .6s ease;
    display: flex;
}
nav .nav-left{
    background: url("../images/nav.jpg") no-repeat;
    background-size: cover;
    height: 100%;
    width: 31.1%;
    padding: 70px 0 120px 95px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transform: translate3d(-100%,0,0);
    transition: transform .4s cubic-bezier(.76,0,.24,1);
}
nav.open{opacity: 1;  z-index: 99}
nav .nav-left .left-text{color: #fff;}
nav .nav-left .left-text .cn-text{font-size: 42px;letter-spacing: 10px}
nav .nav-left .left-text .en-text{text-transform: uppercase;font-size: 15.33px}
nav .nav-left .left-text .en-text .montLight{margin-left: 10px;color: rgba(255, 255, 255, .75);font-size: 17.39px}
nav .nav-right{
    /*background: #fff;*/
    height: 100%;
    flex: 1;
    background: #fff url("../images/nav-bg.png") no-repeat;
    background-position: bottom right;
}
nav .nav-right .nav-list{
    display: flex;
    flex-wrap: wrap;
    margin: 210px 0 0 130px;
    gap: 100px 190px;
}
nav .nav-right .nav-list .nav1{
    display: block;
    color: #333;
    font-weight: bold;
    font-size: 22px;
    margin-bottom: 15px;
    background: linear-gradient(to right, #333, #333) left bottom no-repeat;
    background-size: 0 2px;
    transition: all .6s;
    padding-bottom: 5px;
}
nav .nav-right .nav-list .nav1:hover{
    background-size: 100% 2px;
}
nav .nav-right .nav-list .item p{
    line-height: 30px;
    background: linear-gradient(to right, #1165b5, #1165b5) left bottom no-repeat;
    background-size: 0 1px;
    transition: all .6s;
    width: fit-content;
    width: -webkit-fit-content;
    width: -ms-fit-content;
    width: -moz-fit-content;
}
nav .nav-right .nav-list .item p a{
    font-size: 16px;
    color: #666;
}
nav .nav-right .nav-list .item p:hover{
    background-size: 100% 1px;

}
nav .nav-right .nav-list .item p:hover a{
    color: #1165b5;
}
nav.open .nav-left{  transform: translate3d(0,0,0);}

/*底部样式*/
.footer{
    width: 100%;
    background:#004ea1;
    /*border-top-right-radius: 30px;*/
    /*border-top-left-radius: 30px;*/
}
.bah a{
    font-size: 15px;
    color: rgba(255, 255, 255, .3);
    padding: 10px 0;
   
    transition: .3s;
}
.bah a:hover{color: #fff}
.footer .footer-name {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 100px; margin-bottom: 140px
}
.footer-left{
    flex-shrink: 0;
    width: 38%;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.footer-logo{
    margin-bottom: 28px;
}
.footer .footer-logo img{
    display: block;
    max-width: 350px;
    height: auto;
}
.footer-info-row{
    display: flex;
    align-items: flex-start;
    gap: 28px;
    width: 100%;
}
.footer-qr{
    flex-shrink: 0;
    text-align: left;
}
.footer-qr img{
    display: block;
    width: 100px;
    height: 100px;
    object-fit: cover;
    border: 3px solid rgba(255, 255, 255, .15);
    border-radius: 4px;
    background: #fff;
}
.footer-qr p{
    margin-top: 10px;
    font-size: 12px;
    color: rgba(255, 255, 255, .55);
    line-height: 1.4;
    text-align: center;
}
.footer-contact-info{
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
    min-width: 0;
}
.footer-contact-info li{
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 14px;
    text-align: left;
}
.footer-contact-info li:last-child{
    margin-bottom: 0;
}
.footer-contact-info li .icon{
    flex-shrink: 0;
    width: 18px;
    padding-top: 3px;
}
.footer-contact-info li .icon img{
    display: block;
    width: auto;
    height: 15px;
}
.footer-contact-info li p{
    margin: 0;
    font-size: 16px;
    color: rgba(255, 255, 255, .78);
    line-height: 1.6;
}.footer-contact-info li p a{    color: rgba(255, 255, 255, .78);}
.footer .footer-name .tit-info p{
    color: #fff;
    font-weight: bold;
    font-size: 48px;
    margin-top: 25px;
}
.footer .footer-ls .bottom-item{

}
.footer .footer-ls{
    /*width: 60%;*/
    max-width: 600px;
}
.footer .footer-contact{
    display: flex;
    /*width: 80%;*/
    justify-content: space-around;
}
.bottom-swiper{
    margin: 0;
}

.footer .footer-contact li{text-align: center;margin-bottom: 10px}
.footer .footer-contact li .tit{font-size: 20px;display: flex;gap: 10px;align-items: flex-end}
.footer .footer-contact li .tit p{font-size: 12px;color: #fff;}
/*.footer .footer-contact li .tit .img{height: 15px}*/
.footer .footer-contact li .tit .img img{width: auto;height: 15px}
.footer .footer-wrap .line{width: 100%;border-top: 1px solid rgba(255, 255, 255, .1);margin: 30px 0 80px}
.footer .footer-contact li .num{
    font-size: 22px;
    /*font-weight: bold;*/
}
.footer .footer-wrap .footer-nav{
    display: flex;
    justify-content: space-between;
    width: 52%;
    flex: 1;
}
.footer.enfoot .footer-wrap .footer-nav{
    width: 70%;
}
.footer.enfoot .footer-ls{
    width: 80%;
    max-width: 80%;
}
.footer .footer-wrap .footer-nav .nav1{
    display: block;
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    background: linear-gradient(to right, #fff, #fff) left bottom no-repeat;
    background-size: 0 2px;
    transition: all .6s;
    padding-bottom: 10px;
    margin-bottom: 15px;
}
.footer .footer-wrap .footer-nav .item p{
    line-height: 35px;
    background: linear-gradient(to right,  rgba(255, 255, 255, .41),  rgba(255, 255, 255, .41)) left bottom no-repeat;
    background-size: 0 1px;
    transition: all .6s;
    width: fit-content;
    width: -webkit-fit-content;
    width: -ms-fit-content;
    width: -moz-fit-content;
}
.footer .footer-wrap .footer-nav .item p a{
    color: rgba(255, 255, 255, .41);
    font-size: 16px;
}

.footer .footer-wrap .footer-nav .item p:hover{background-size: 100% 1px}
.footer .footer-wrap .footer-ls{
    display: flex;
}
.footer .bottom {
    /*border-top: 1px solid rgba(255, 255, 255, .1);*/
    margin-top: 15px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
.footer .bottom p{
    font-size: 14px;
    color: #fff;
    /*opacity: .3;*/
    /*line-height: 21px;*/
}
.footer .bottom .apps{
    display: flex;
    gap: 0 25px;
    margin-bottom: 5px;
}
.totop{
    z-index: 999;
    cursor: pointer;
    position: fixed;
    right: 3.5%;
    /*bottom: 6.2%;*/
    /*right: 65px;*/
    bottom: 58px;
}
.totop > img{
    width: 100%;
    opacity: 0;
    transition: .5s;
}
.bottom-nav{
    display: flex;
    margin-top: 20px;
}
.bottom-nav li{
    color: #fff;
    margin-right: 20px;
    cursor: pointer;
    opacity: .4;
    transition: opacity .3s;
    padding-bottom: 10px;
}
.bottom-nav li.on{
    opacity: 1;
    border-bottom: 2px solid #fff;
    font-weight: bold;

}
/*.totop > img.on{
    animation: 5s linear 0s infinite normal none running rotate;
    opacity: 1;

}*/
.wx{
    width: 42px;
    height: 42px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    line-height: 42px;
    text-align: center;
}
@keyframes rotate {
    0%{
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    50%{
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
    }
    100%{
        transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
    }
}
.totop .top_btn{
    width: 42px;
    height: 42px;
    /*border: 1px solid #c4e3ff;*/
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    line-height: 42px;
    transition: .5s;
}
.totop:hover .top_btn{
    /*background: #c4e3ff;*/
}
    .totop:hover .top_btn .hover{
        display: block;
    }
    .totop:hover .top_btn .nohover{
        display: none;
    }
.totop .top_btn img{
    /*animation-delay: 0ms;
    animation-duration: 1500ms;
    animation-iteration-count: infinite;
    animation-name: arrow;
    animation-play-state: running;
    animation-timing-function: linear;
    -webkit-font-smoothing: antialiased;*/
  /*  width: 20px;
    height: auto;*/
}
.totop .top_btn img.hover{
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@keyframes arrow {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0px, 5px, 0px);
    }
    50% {
        opacity: 1;
        -webkit-transform: translate3d(0px, 0px, 0px);
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0px, -5px, 0px);
    }
}
.bah{
    font-size: 15px;
    color: rgba(255, 255, 255, .3);
    /*margin-top: 20px;*/
    padding: 50px 0;
    border-top: 1px solid rgba(255, 255, 255, .1);
}
.cp-wrap{
    margin-top: 100px;
}
.cp-wrap .top-title{
    width: 208px;
    height: 61px;
    border-radius: 15px 0;
    background: linear-gradient(to right, #172390, #0165b5);
    display: flex;
    justify-content: center;
    align-items: center;
}
.cp-wrap .top-title.en-top{
    width: 508px;
}
.cp-wrap .top-title p{
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    margin-left: 10px;
}
.cp-wrap .dsc{
    line-height: 30px;
    color: #666;
    /*font-weight: lighter;*/
    margin: 30px 0 60px;
}
.cp-wrap .no-list{
    display: flex;
    flex-wrap: wrap;
    border-left: 1px solid #d9d9d9;
    /*border-top: 1px solid #d9d9d9;*/
}
.cp-wrap .no-list li {
    /*border-top: 1px solid #d9d9d9;*/
    height: 79px;
    width: 16.66%;
    line-height: 79px;
    text-align: center;
    cursor: pointer;
    border-bottom: 1px solid #d9d9d9;
    border-right: 1px solid #d9d9d9;
    box-sizing: border-box;
    transition: .5s;
}
.cp-wrap .no-list li a{
    display: block;
    width: 100%;
    height: 100%;
    transition: .3s;
}
.cp-wrap .no-list li:hover a{
    color: #fff;
    background: #030dad;
}
 .features{
    margin-top: 160px;
    overflow: hidden;
    background: url("../images/td-bg.png") no-repeat;
    background-position: bottom right;
     padding-bottom: 90px;
}
.features .w80{
    display: flex;
    justify-content: space-between;
}
 .features .cp-line{
    width: 297px;
    height: 1px;
    background: #d9d9d9;
    position: relative;
    margin-top: 200px;
}
 .features .cp-line .cp-blue-line {
    width: 0;
    height: 1px;
    animation: moveLine 5s linear infinite;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9;
    background: #030dad;
}
@keyframes moveLine {
    0%{width: 0}
    100%{width: 100%}
}
 .features .feat-btn{
    display: flex;
    margin-top: 200px;
}
 .features .feat-btn div{cursor: pointer;transition: .5s}
 .features .feat-btn div:hover{margin-top: -20px;}
 .features .feat-btn .feat-prev{
    margin-right: 20px;
}
 .features .feat-right{
    width: 70.35%;
    /*overflow: hidden;*/
}
 .features .feat-right .feat-item{
    width: 31.27%;
    /*margin-right: 30px;*/
    background: url("../images/feat-item-bg.png") center center / cover no-repeat;
    border-radius: 15px;
    height: 480px;
    position: relative;
    transition: .5s;
    margin-top: 30px;
}
 .features .feat-right .feat-item:hover{
    transform: translateY(-20px);
    background: url("../images/feat-on.png") center center / cover no-repeat;
}
 .features .feat-right .feat-item p{color: #fff}
 .features .feat-right .feat-item .num{
    font-size: 48px;
    text-align: right;
    margin: 30px 48px 0 0;
}
 .features .feat-right .feat-item .text{
    font-size: 26px;
    position: absolute;
    bottom: 90px;
    left: 26px;
     padding-right: 20px;
}
 .features .feat-right .swiper-slide-next{
    margin-top: 120px;
}
.appli{
    display: flex;
    margin-top: 110px;
    padding-bottom: 110px;
}
.appli .appli-right{
    margin-left: 80px;
}
.appli .appli-right .content{margin-top: 40px}
.appli .appli-right .content p{
    line-height: 30px;
}
/*.appli-lift img{
    width: 450px;
    height: auto;
}*/
    /*首页样式*/
.home-mask{height: 100vh;width: 100%}
.home-about{
    position: relative;
    z-index: 9;
    padding: 6vw 0;
    background: #fff url("../images/home-about-bg.jpg") center center no-repeat;
    background-size: contain;
}
.home-about .about-inner{
    width: 80%;
    margin: 0 auto;
    position: relative; background: url( "../images/map.jpg") no-repeat center top
}
.home-about .about-subTitle{
    width: 100%;
    margin-bottom: 3vw;
}
.home-about .about-title-box{
    width: 100%;
}
.home-about .about-title-box em{
    display: block;
    width: 100%;
    height: 56px;
    margin: 0 auto 42px;
    font-style: normal;
    color: #ebebeb;
    text-transform: uppercase;
    font-size: clamp(48px, 5vw, 72px);
    text-align: left;
    line-height: 56px;
    letter-spacing: 2px;
}
.home-about .about-title-box b{
    display: block;
    font-style: normal;
    text-transform: uppercase;
    font-size: clamp(32px, 3.5vw, 48px);
    color: #000;
    font-weight: bold;
    line-height: 1.2;
}
.home-about .about-tagline{
    line-height: 50px;
    text-align: left;
    font-size: clamp(20px, 2vw, 30px);
    color: #333;
    margin-top: 8px;
}
.home-about .about-factory{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 3vw;
}
.home-about .about-info{
    width: 60%;
    line-height: 2;
    font-size: 16px;
    color: #474747;
}
.home-about .about-info p{
    text-align: left;
}
.home-about .about-enter-btn{
    width: 165px;
    height: 58px;
    border: 1px solid #030dad;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    border-radius: 50px;
    font-size: 16px;
    background: #030dad;
    text-decoration: none;
    position: relative;
    top: -140px;
    transition: all .35s;
    flex-shrink: 0;
}
.home-about .about-enter-btn p{
    line-height: 58px;
    margin: 0;
}
.home-about .about-enter-btn i{
    margin-left: 15px;
    font-style: normal;
}
.home-about .about-enter-btn:hover{
    box-shadow: 0 0 15px rgba(0, 58, 140, 0.35);
    top: -145px;
    color: #fff;
    background: #004da8;
    border-color: #004da8;
}
.home-about .about-factorys{
    width: 100%;
    position: relative;
    margin: 0 auto;
}
.home-about .about-factorys ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    list-style: none;
    margin: 0;
    padding: 0;
}
.home-about .about-factorys ul li{
    width: 23.5%;
    position: relative;
    background: #000;
    height: 190px;
    overflow: hidden;
}
.home-about .about-factorys ul li .thum{
    position: relative;
    overflow: hidden;
}
.home-about .about-factorys ul li .pic{
    height: 190px;
    background-size: cover;
    background-position: center;
    opacity: .8;
    transition: transform .5s cubic-bezier(.23, 1, .32, 1);
}
.home-about .about-factorys ul li .thum::after{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    content: '';
    background: #f5f5f5;
    transition: all .5s cubic-bezier(.23, 1, .32, 1);
}
.home-about .about-factorys ul li .info{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    color: #212121;
    transition: color .5s;
    z-index: 2;
}
.home-about .about-factorys ul li .info .icon .iconfont{
    font-size: clamp(30px, 2.8vw, 42px);
    color: #333;
    line-height: 1;
    display: block;
    transition: color .5s;
}
.home-about .about-factorys ul li .info .des b,
.home-about .about-factorys ul li .info .des p{
    transition: color .5s;
}
.home-about .about-factorys ul li:hover .thum::after{
    height: 0;
}
.home-about .about-factorys ul li:hover .pic{
    transform: scale(1.1);
}
.home-about .about-factorys ul li:hover .info,
.home-about .about-factorys ul li:hover .info .des b,
.home-about .about-factorys ul li:hover .info .des p{
    color: #fff;
}
.home-about .about-factorys ul li:hover .info .icon .iconfont{
    color: #fff !important;
}
.home-about .about-factorys ul li .info .icon{
    position: absolute;
    left: 8%;
    top: 10%;
    line-height: 1;
}
.home-about .about-factorys ul li .info .des{
    position: absolute;
    right: 8%;
    bottom: 10%;
    text-align: right;
}
.home-about .about-factorys ul li .info .des b{
    font-family: 'montMR', 'montBold', Arial, sans-serif;
    font-size: clamp(36px, 4vw, 58px);
    font-weight: bold;
    line-height: 1;
    color: #212121;
    letter-spacing: -1px;
}
.home-about .about-factorys ul li .info .des b .counter{
font-family:DIN-Bold;
    font-size:4rem;
    font-weight: inherit; 
}


@font-face {
font-family:DIN-Bold;
src:url(../fonts/DIN-Bold.otf)
}



.home-about .about-factorys ul li .info .des b span{
    font-size: 16px;
    
    margin-left: 5px;
    font-weight: normal;
    font-family: inherit;
    letter-spacing: 0;
}
.home-about .about-factorys ul li .info .des p{
    font-size: 19px;
    opacity: .7;
    margin-top: 8px;
    color: #212121;
    line-height: 1.4;
}
.clip{
    padding-bottom: 0;
}
.clip .about-video{
    border-radius: 80px;
    overflow: hidden;
    transform: scale(0.7);
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000;
}
.clip .about-video img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.profession{background-color: #fff;padding-top: 50px}
.profession .prof-title *{text-align: center}
.profession .prof-title .cn{
    color: black;
    letter-spacing: 5px; margin-top: 10px
}
.profession .prof-nav{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: clamp(48px, 20vw, 180px);
    width: 100%;
    margin: 80px auto 20px;
    padding: 0; height: 50px
}
.profession .prof-nav li{
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    flex: 0 0 auto;
    text-align: center;
}
.profession .prof-nav li .nav-text{
    font-size: 22px;
    transition: .3s;
    white-space: nowrap;
}
.profession .prof-nav li .nav-text:hover{
    color: #030dad;
    font-weight: bold;
}
.profession .prof-nav li .svg{
    position: absolute;
    right: calc(100% + 10px);
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s;
    display: flex;
    align-items: center;
    justify-content: center;
}
.profession .prof-nav li .svg img{
    max-width: 100%;
    max-height: 100%;
    display: block;
}
.profession .prof-nav li.on .nav-text{
    color: #030dad;
    font-weight: bold;
}
.profession .prof-nav li.on .svg{
    opacity: 1;
}
.profession .prof-line{
    height: 3px;
    background-color: #030dad;
    margin: 0;
}
.prof-swiper .prof-item{
    height: auto;
    min-height: 780px;
    padding-bottom: 60px;
    background-size: cover !important;
    background-position: center center !important;
}.prof-swiper .prof-item .prof-list{
    margin-top: 110px;
    display: block;
    position: relative;
    z-index: 1;
}
/*--------------------------------------------------------------------------------------------------------------------------------------550--*/
@media all and (max-width:1440px){  
.prof-swiper .prof-item{
    height: auto;
    min-height: 680px;
    padding-bottom: 60px;
    background-size: cover !important;
    background-position: center center !important;
}.prof-swiper .prof-item .prof-list{
    margin-top: 70px;
    display: block;
    position: relative;
    z-index: 1;
}
}


.product-grid{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    width: 100%;
}
.product-card{
    display: block;
    border-radius: 15px;
    overflow: hidden;
    border: none;
    background: transparent;
    aspect-ratio: 5 / 4;
    transition: transform .35s ease, box-shadow .35s ease;
}
.product-card:hover{
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .2);
}
.product-card-img{
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 15px;
}
.product-card-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s ease;
}
.product-card:hover .product-card-img img{
    transform: scale(1.08);
}
.product-card-bar{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 22%;
    min-height: 54px;
    background: rgba(3, 13, 173, .75);
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    transition: background .35s ease;
}
.product-card-title{
    font-size: 20px;
    font-weight: 500;
    color: #fff;
    line-height: 1.2;
    margin: 0;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    letter-spacing: 0.5px;
}
.product-card:hover .product-card-bar{
      background: rgba(3, 13, 173, .95);
}
.profession{
    padding-bottom: 0;
}
.prof-swiper{
    width: 100%;
}
.prof-swiper .prof-item .prof-list .list-nav{
    width: 92px;
}
.prof-swiper .prof-item .prof-list .list-nav li {
    width: 80px;
    height: 80px;
    border: 1px solid #fff;
    text-align: center;
    line-height: 80px;
    border-radius: 50%;
    margin-bottom: 24px;
    cursor: pointer;
    transition: all .3s;
}
.prof-swiper .prof-item .prof-list .list-nav li:hover{
    background-color: #16349b;
    border-color: #16349b;
    margin-left: 10px;
}
.prof-swiper .prof-item .prof-list .list-nav li.on{
    background-color: #16349b;
    border-color: #16349b;
}
.prof-swiper .prof-item .prof-list .list-nav li img{
    vertical-align: middle;
}
.prof-swiper .prof-item .prof-list .text-item .img {
    margin-bottom: 30px;
}
.prof-swiper .prof-item .prof-list .text-item .img img{
    /*transform: scale(1.2);*/
}
.prof-swiper .prof-item .prof-list .text-item{
    width: 100%;
    display: none;
}
.prof-swiper .prof-item .prof-list .text{width: 53.58%}
.prof-swiper .prof-item .prof-list .text-item.on{display: block;}
.prof-swiper .prof-item .prof-list .text-item p{
    color: #fff;
    line-height: 26px;
    margin-bottom: 20px;
}
.out{
    position: relative;
    /*height: 100vh;*/
    display: block;
    width: 100%;
}
.prof-wrap .svg-mask{
    height: 100vh;
    width: 100%;
    position: absolute;
    top:0;
    left: 0;
    z-index: 99;
    overflow: hidden;
    background-color: #fff;
    display: block;
}
.ofi{
    object-fit: cover;
    object-position: center;
}
.prof-wrap .svg-mask img{
    display: block;width: 100%;height: 100%;
}
.esg{
    position: relative;
    overflow: hidden;
    height: auto;
    width: 100%;
    margin-top: -14px;
    padding: 103px 0 50px;
    box-sizing: border-box;
}
.esg-bg{
    position: absolute;
    inset: 0;
    z-index: 0;
}
.esg-bg-item{
    position: absolute;
    inset: 0;
    background: center center / cover no-repeat;
    opacity: 0;
    transition: opacity 1s ease;
}
.esg-bg-item.on{
    opacity: 1;
}
.esg-bg::after{
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .45);
    z-index: 1;
    pointer-events: none;
}
.esg > .w80{
    position: relative;
    z-index: 1;
}
.esg .esg-list li{
    cursor: pointer;
}
.esg .esg-top{
    display: flex;
    color:#fff;
    align-items: center;
    justify-content: space-between;  padding-top: 50px
}
.esg .esg-top .title .cn-title{
    line-height: 49px;
   letter-spacing: 1px;
}
.esg .esg-top .des{
    font-size: 18px;
    width: 457px;
    line-height: 28px;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, .7);
}
.esg .esg-list{
    margin-top: 180px;
}
.esg .esg-list li{
    display: flex;
    border-bottom: 1px solid rgba(255, 255, 255, .5);
    height: 128px;
    justify-content: space-between;
    align-items: center;
    font-weight: lighter;
    color: #fff;
    box-sizing: border-box;
    /*background: linear-gradient(to right, #fff, #fff) left bottom no-repeat;*/

    position: relative;
}
.esg .esg-list li::after{
    content: '';
    position: absolute;
    bottom: -1px; /* 对齐边框 */
    left: 0;
    width: 0;
    height: 1px;
    background: #fff;
    transition: width .8s;
}
.esg .esg-list li:hover::after{
    width: 100%;
}
.esg .esg-list li.on::after{
    width: 100%;
}
.esg .esg-list li p,
.esg .esg-list li{
    transition: all .3s;
}
.esg .esg-list li .name .cn{
    font-size: 24px;
    transition: all .3s;
    opacity: .5;
}
.esg .esg-list li .name .montLight{
    font-size: 36px;
    margin-bottom: 10px;
    opacity: 0;
    transition: all .5s
}
.esg .esg-list li .list-des{width: 497px;opacity: 0;transition: all .5s}
.esg .esg-list li .list-des p{margin-top: 10px;line-height:28px;}
.esg .esg-list li.on{
    background-size: 100% 1px;
    opacity: 1;
    height: 208px;
}
.esg .esg-list li.on .name .cn{
     font-size: 48px;
    opacity: 1;
}
.esg .esg-list li.on .none{display: block}
.esg .esg-list li.on .list-des,
.esg .esg-list li.on .name .montLight{opacity: 1}
.esg .svg-mask2{
    position: absolute;
    top:0;left: 0;z-index: 99;overflow: hidden;
    width: 100%;height: 100%;
    opacity: 0;
    transform: scale(100);
    display: none;
   background: #fff;
}
.news{
    background: #fff;
    padding:  88px 0 90px;
}
.news .news-top{
    display: flex;
    justify-content: space-between;
}
.news .news-select .select{
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    background: linear-gradient(to right, #172390, #172390);
    height: 61px;
    width: 155px;
    font-size: 18px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    gap: 20px;
}
.news .news-select .type{
    height: 0;
    position: absolute;
    z-index: 10;
    width: 100%;
    overflow: hidden;
}
.news .news-select .type.on{
    height: 120px;
    border: 1px solid #ccc;
}
.news .news-select .type p{
    color: #999;
    font-size: 18px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    border-top: 1px solid #ccc;
    background: #fff;
}
.news .news-select .type p:nth-child(1){
    border: none;
}
.news .news-select .type p.on{
    color: #030dad;
}
.news .news-list{
    margin-top: 50px;
    padding-bottom: 2px;
}
.news .news-list .news-swiper{
    padding-bottom: 20px;
    /*margin-left: 20px;*/
}
.news .news-list .news-swiper .swiper-wrapper{
    transition-timing-function: linear !important
}
.news .news-list .news-swiper .swiper-wrapper .new-item{
    width: 367px;
    height: 475px;
    border-radius: 15px;
    cursor: pointer;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}
.news .news-list .news-swiper .swiper-wrapper .new-item img{
    width: 100%;
    display: block;
    object-fit: cover;
    height: 314px;
}
.news .news-list .news-swiper .swiper-wrapper .new-item .img{
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    overflow: hidden;
}
.news .news-list .news-swiper .swiper-wrapper .new-item .des{
    box-sizing: border-box;
    padding: 20px;

}
.news .news-list .news-swiper .swiper-wrapper .new-item .des .text{
    font-size: 20px;
    color: #333;
    line-height: 28px;
     display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;  /* 限制显示的行数 */
      overflow: hidden;
      text-overflow: ellipsis;
}
.news .news-list .news-swiper .swiper-wrapper .new-item a{
     position: relative;
     height: 100%;
}
.news .news-list .news-swiper .swiper-wrapper .new-item .time{
    color: #4c4c4c;
    font-size: 14px;
    line-height: 36px;
    position: absolute;
    left: 23px;
    bottom: 30px;
}
.news .news-list .news-swiper .swiper-wrapper .new-item:hover {
    background: #222ee6;
}
.news .news-list .news-swiper .swiper-wrapper .new-item:hover .img img{
    transform: scale(1.15);
}
.news .news-list .news-swiper .swiper-wrapper .new-item:hover p,
.news .news-list .news-swiper .swiper-wrapper .new-item:hover .des p{
    color: #fff;
}
.news-line{
    margin: 30px auto;
}
.news-line .g-line{
    background: #f2f2f2;
    width: 100%;
    position: absolute;
}
.news-line .b-line{
    background: #030dad;
    width: 0;
    position: absolute;
    z-index: 9;
    transition: all 1s;
    animation: progress 74s linear infinite;
}
.news-line div{ height: 2px;}
@keyframes progress {
    from {
        width: 0;
    }

    to {
        width: 100%;
    }
}
.news .news-btn{
    display: flex;
    justify-content: flex-end;
    gap: 30px;

}
.news .news-btn div{
    cursor: pointer;
}
.news .news-btn div:hover{margin-top: -5px;padding-bottom: 10px}
.inside-banner{
    height: 705px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.inside{
    height: 705px;
}

.inside .sp {
    background-color: #f2f5fa;
}

.inside .sp .en-title{
    border-bottom: 188px solid #f2f5fa;
}
.inside-banner .en-title{
    width: 50%;
    position: absolute;
    left: 0;
    bottom: 0;
    padding-left: 9.89%;
    box-sizing: border-box;
    border-right: 140px solid transparent;
    border-bottom: 160px solid #fff;
    height: 160px;
}
.inside-banner .en-title p{
    font-size: 100px;
    padding-top: 30px;
}
.page{
    position: relative;
    z-index: 99999;
}
.page .page-title{
    font-size: 34px;
    font-weight: lighter;
    color: #000
}
.page .page-list{
    display: flex;
    align-items: center;
    padding-top: 10px;
    width: fit-content;
    margin-top: 70px;
    border-top: 1px solid #d9d9d9;
}
.page .page-list > li{height: 82px;}
.page .page-list > li .page-item{
    height: 62px;
    border-right: 1px solid #e6e6e6;
    width: 379.3px;
    padding: 10px 30px;
    box-sizing: border-box;
    font-weight: lighter;
    font-size: 22px;
    color: #000;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    transition: all .5s;

}
.page .page-list > li .page-line{
    height: 10px;
    background: linear-gradient(to right, #030dad, #030dad) left bottom no-repeat;
    background-size: 0 4px;
    width: 100%;
    transition: all .5s;
}
.page .page-wrap{width: fit-content;z-index: 10}
.page .page-wrap .bottom-line{
    border-top: 1px solid #d9d9d9;
    position: absolute;
    bottom: 10px;
    width: 100%;
}
.page .page-list > li .page-svg{transition: all .5s}
.page .page-list > li.on{height: auto}
.page .page-list > li:hover .page-line{background-size: 100% 4px;}
.page .page-list > li:hover .page-svg{transform: rotate(90deg)}
 .page-des{
    width: 100%;
    position: absolute;
    top: 100%;
     height: 0;
     overflow: hidden;
     transition: all .5s;
     box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
     background: #fff;
     z-index: 999;
}
 .page-des > li{
    width: 100%;
    padding-left: 30px;
    box-sizing: border-box;
    height: 66px;
    transition: all .5s;
     background: linear-gradient(to right, #d9d9d9, #d9d9d9) left bottom no-repeat;
     background-size: 0 1px;
}
.page-des.on{
    /*height: 360px;*/
}
 .page-des li a{
    color: #000;
    font-size: 18px;
    font-weight: lighter;
    display: block;
    height: 66px;
    line-height: 66px;
    transition: all .5s;
}
.page-des li:hover{
    background-size: 100% 1px;
}
.page-des li a:hover{
    font-weight: normal;
    color: #030dad;
}

/*关于一郎*/
#produce{margin-top: 100px}
#produce .w80{
    display: flex;
    justify-content: space-between;
}
#produce .w80 div{width: 50%;}
#produce .w80 .produce-right{transform: translateY(200px);opacity: 0;transition: .8s}
#produce .w80 .produce-right p{line-height: 30px;margin-bottom: 30px;text-align: justify}
#produce .w80 .produce-left .font34{
    color: #000;
    line-height: 46px;
    margin: 50px 0 70px;
}
#produce .nums{
    display: flex;
    flex-wrap: wrap;
    width: 413px;
    /*margin-left: 40px;*/
    gap: 90px;
}
#produce .nums li{
    width: 158px;
    opacity: .2;
    transform: translateY(1000px);
}
#produce .nums li:nth-child(1),

#produce .nums li:nth-child(3),

#produce .nums li .color28{font-size: 16.4px}
#produce .nums li .color28 .montMR{font-size: 54.66px}
#produce .nums li .num-dec{font-size: 16.4px;}

#culture{
    display: flex;
    height: 963px;
}
#culture .culture-left .title{padding-left: 88px;}
#culture .culture-left .culture-list{margin: 100px 0 0 68px}
#culture .culture-left .culture-list li {
    font-size: 24px;
    color: #808080;
    width: 212px;
    height: 61px;
    line-height: 61px;
    text-align: center;
    cursor: pointer;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    margin-bottom: 20px;
    overflow: hidden;

}
#culture .culture-left .culture-list li p{
    transition: all .3s ease-in-out;
}
#culture .culture-left .culture-list li .bg{
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, #172390 20%, #0165b5);
    top: 0;
    left: -100%;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    transition: all .3s ease-in-out;
}
#culture .culture-left,
#culture .culture-right{width: 50%}
#culture .culture-right{position: relative;overflow: hidden}

#culture .culture-right img{width: 100%;position: absolute;transition: .5s;right: -100%;height: 100%}
#culture .culture-right img.show{display: block;right: 0}
#culture .culture-left{
    padding-top: 140px;
    background: #f2f5fa;
    box-sizing: border-box;
    overflow: hidden;
}
#culture .culture-left .culture-list li.on .bg{
    left: 0;
}
#culture .culture-left .culture-list li:hover{
    color: #fff;
    /*transition: all .5s ease-in-out;*/
    margin-left: 10px;
}
#culture .culture-left .culture-list li:hover .bg{
    left: 0;
    /*transition: all .5s ease-in-out;*/
}
#culture .culture-left .culture-list li.on{
    background: linear-gradient(to right, #172390 20%, #0165b5);
    color: #fff;
}
#culture .center-box{
    width: 646px;
    height: 455px;
    border-radius: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    background: #fff;
    box-shadow: -5px 5px 10px rgba(0, 0, 0, 0.1);
    text-align: center;
    overflow: hidden;
}
#culture .center-box .center-item{
    position: absolute;
    top: 50%;
    left: -100%;
    transform: translate(0, -50%);
    z-index: 10;
    /*display: none;*/
    width: 100%;
    transition: all .5s ease-in-out;

}
#culture .center-box .center-item.on{
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all .5s ease-in-out;
}
#culture .center-box .img{margin: 0 auto}
#culture .center-box .center-item .center-title{
    font-size: 34px;
    color: #000;
    margin: 35px 0 20px;
}
#culture .center-box .center-item .center-des{
    color: #333;
    width: 70%;
    margin: 0 auto;
}
#culture .culture-left > .montLight{
    color: #fff;
    position: absolute;
    bottom: 0px;
    right: -100%;
    font-size: 232px;
    color: rgba(255, 255, 255, .64);
    z-index: 10;
   transition: .5s;
    opacity: 0;
}
#culture .culture-left > .montLight.on{
    opacity: 1;
    right: 0;
}
#honor{
    padding: 90px 0;
    box-sizing: border-box;
    height: 950px;
}
#honor > p{text-align: center}
.honor-wrap{display: flex;width: 75.44%;margin: 35px auto 0;flex-wrap: wrap;height:568px;justify-content:center}
.honor-wrap .honor-item{
    margin-right: 8%;
    margin-bottom: 60px;
    border: 1px solid #999999;
    padding: 7px;
    overflow: hidden;
   width: 15%;
   max-width: 145px;
   height: fit-content;
}
.honor-wrap .honor-item.on{
    margin-right: 0;
}
.honor-wrap .honor-item img{
    transition: .5s;
    width:100%;
    height: auto;
}
.honor-wrap .honor-item:hover img{
    transform: scale(1.05);
}
#honor .honor-list {
    /*display: flex;*/
    width: 1260px;
    margin: 60px auto 0;
}
#honor .honor-list .honor-item{
    width: auto !important;
    padding: 8px;
    border: 1px solid #a8a8a9;
}
#honor .honor-list  .swiper-wrapper{
    gap: 27px 110px;
    flex-wrap: wrap;
}
#honor .honor-btn{
    display: flex;
    gap: 30px;
    justify-content: center;
    margin-top: 30px;
}
#honor .honor-btn div{cursor: pointer}
#honor .honor-btn div:hover{
    margin-top: -5px;
}

#history{
    box-sizing: border-box;
    background: #fff;
    padding: 70px 0 110px;
    background: url("./img/history-bg.jpg") center center / cover no-repeat;
    /*height: 1564px;*/
    position: relative;
    z-index: 9;
    margin-top: -1px;
}
#history .history-wrap{
    display: flex;
    flex-direction: column;
}
#history .history-left {
    padding-left: 110px;
}
#history .history-wrap .history-left .font34{color: #fff}
#history .history-right{
    position: relative;
    /*width: 56.39%;*/
    width: 1018px;
    margin: 0 auto;
}
#history .history-list{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-left: 30px;
    margin-top: 30px;
}

#history .history-list li {
    width: 342px;
    margin-bottom: 140px;
}
#history .history-list li .right-content .montMedium{
    display: none;
}
#history .history-list li:last-child{
    margin-bottom: 0;
}
#history .history-list li:nth-child(odd) {
   margin-top: -200px;
}
#history .history-list li.no{
    margin-bottom: 60px;
}
#history .history-list li .text{
    margin-top: 40px;
}
#history .history-list li .img{
    overflow: hidden;
    border-radius: 25px;
}
#history .history-list li .img img{
    border-radius: 25px;
    transition: .3s;
    width: 358px;
    height: 211px;
}
#history .history-list li.on .img img{
    transform: scale(1.15);
}
#history .history-list li .text .title{
    color: #fff;
    font-size: 24px;
    font-weight: bold;
}
#history .history-list li .text .des {
    font-size: 16px;
    color: #fff;
    line-height: 22px;
    margin-top: 10px;
}
#history .history-right .center-wrap{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 100%;
}
#history .history-right .center-wrap .dotted{
    border-left: 5px dotted rgba(255, 255, 255, .1);
    height: 100%;
}
#history .history-right .center-wrap .year{
    position: absolute;
    top: 120px;
    left: 50%;
    transform: translateX(-50%);
}
#history .history-right .center-wrap .year li{
    margin-bottom: 75px;
}
#history .history-right .center-wrap .year .year-box{
    width: 149px;
    height: 149px;
    border: 8px solid rgba(255, 255, 255, .2);
    border-radius: 50%;
    transition: .3s;
    position: relative;
    box-sizing: border-box;
}
#history .history-right .center-wrap .year .year-box p{
    transition: .3s;
    color: #fff;
    font-size: 22px;
    width: 82px;
    height: 82px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    line-height: 82px;
    background: rgba(0, 0, 0, .8);
    border-radius: 50%;
}
#history .history-right .center-wrap .year li .year-box img{
    display: block;
    position: absolute;
    top: 50%;
    right: -60px;
    transform: translateY(-50%);
}
#history .history-right .center-wrap .year li .year-box img.hoverjt{
    display: none;
}
#history .history-right .center-wrap .year li:nth-child(even) .year-box img{
    right: auto;
    left: -50px;
    transform: rotate(180deg) translateY(50%);
}
#history .history-right .center-wrap .year .year-box:hover{
    border-color: rgba(80, 108, 181, .4);
}
#history .history-right .center-wrap .year .year-box:hover p{
    background: #030dad;
}
#history .history-right .center-wrap .year li:hover .year-box img{display: none}
#history .history-right .center-wrap .year li:hover .year-box img.hoverjt{
    display: block;
}
.stock{
    padding-top: 100px;
    color: #fff;
    /*height: 100vh;*/
    box-sizing: border-box;
}
.stock .w88{
    padding: 100px 80px;
    background: url("../images/stock.png") left top / cover no-repeat;
    height: 677px;
    border-radius: 12px;
    box-sizing: border-box;
}
.stock .stock-top{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.stock .stock-top .btn{
    font-size: 20px;
    background: #fff;
    width: 171px;
    height: 61px;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    text-align: center;
    line-height: 61px;
    cursor: pointer;
}
.stock .stock-top .btn:hover{
    background: #030dad;
    color: #fff;
}
.stock .stock-dsc{
    font-weight: lighter;
    margin: 60px 0 50px;
}
.stock .stock-list{
    display: flex;
    justify-content: space-between;
}
.stock .stock-list li {
    border: 1px solid #cbccd8;
    height: 220px;
    width: 14.42%;
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;
    position: relative;
    transition: .3s;
}
.stock .stock-list li:hover{
    background: #030dad;
    border: none;
}
.stock .stock-list li .wrap{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: 100%;
}
.stock .stock-list li .info{
    font-size: 20px;
    margin-top: 30px;
}
.stock .stock-list .first-item{
    display: flex;
    width: 47.47%;
    align-items: center;
    padding: 0 80px 0 40px;
    box-sizing: border-box;
    justify-content: space-between;
}
.stock .stock-list .first-item p{
    font-weight: bold;
}
.stock .stock-list .first-item .title{
    font-size: 24px;
}
.stock .stock-list .first-item .num{
    font-size: 50px;
    margin-top: 15px;
}
.stock .stock-list .first-item .right p{line-height: 24px}
.stock .stock-list .first-item .right p span{font-weight: normal}

.structure{
    background: url("../images/stu-bg.jpg") center center /cover no-repeat;
    height: 1098px;
    padding-top: 70px;
    box-sizing: border-box;
}

.structure .title,
.reports .title .cn-title{
    color: #333;
    font-size: 36px;
    font-weight: lighter;
}
.structure .str-wrap{
    width: 83.33%;
    margin: 0 auto;
    height: 100%;
    padding: 0.1px;
}
.structure .str-wrap .item-box{
    width: 159px;
    height: 87px;
    background: #1165b5;
    border-radius: 6px;
}

.structure .str-wrap .item-box.gj{
    position: absolute;
    top: 6%;
    left: 63%;
}
.structure .str-wrap .item-box .white-box{
    border-radius: 6px;
    border: 1px solid #c3c3c3;
    height: 80px;
    background: #f2f5fa;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 153px;
    transition: .5s;
}
.structure .str-wrap .item-box .white-box p{
    font-size: 14px;
    color: #333;
    line-height: 18px;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    transition: .5s;
}
.structure .str-wrap .item-box .white-box:hover{
    background: #1165b5;
    border-color: #1165b5;
}
.structure .str-wrap .item-box .white-box:hover p{
    color: #fff;
}
.structure .item-list{
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin-top: 185px;
    flex-wrap: wrap;
}
.structure .item-list .item-box{
    width: 130px;
    height: 97px;
}
.structure .item-list li{
    position: relative;
    margin-bottom: 10px;
}
.structure .item-list .item-box .white-box{
     width: 130px;
    height: 97px;
    position: absolute;
    right: -5px;
    bottom: -5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.structure .item-list .white-box p{
    position: static !important;
    transform: translate(0, 0) !important;
}
.structure .item-list .white-box .zb{margin-top: 10px}
.structure .str-line1{
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin-top: 20px;
}
.structure .str-line1 div{
    width: 1px;
    height: 55px;
    background: #c3c3c3;
}
.structure .str-line2 {
    width: 100%;
    height: 1px;
    background: #c3c3c3;
}
.structure .str-line3{
    width: 1px;
    height: 45px;
    background: #c3c3c3;
    margin: 0 auto;
}
.structure .item-box2{
    background: #1165b5;
    width: 388px;
    height: 62px;
    border-radius: 6px;
    transition: .5s;
}
.structure .item-box2.center{
    margin: 0 auto;
}
.structure .item-box2 .white-box{
    width: 100%;
    height: 100%;
    border: 1px solid #c3c3c3;
    background: #f2f5fa;
    position: absolute;
    right: -5px;
    bottom: -5px;
    transition: .5s;
    border-radius: 6px;
}
.structure .item-box2 .white-box p{
    text-align: center;
    font-size: 20px;
    color: #333;
    line-height: 62px;
    transition: .5s;
}
.structure .item-box2:hover{
    background: linear-gradient(to right, #172291, #1165b5);
}
.structure .item-box2:hover .white-box{
    border: none;
    background: transparent;
    right: 0px;
    bottom: 0px;
}
.structure .item-box2:hover .white-box p {
    color: #fff;
}
.structure .str-line4{
    width: 514px;
    height: 1px;
    background: #c3c3c3;
    margin: 0 auto;
}
.structure .str-line5{
    display: flex;
    justify-content: space-between;
    width: 514px;
    margin: 0 auto;
}
.structure .str-line5 div{
    height: 20px;
    width: 1px;
    background: #c3c3c3;
}
.structure .str-list{
    display: flex;
    justify-content: center;
    gap: 120px;
}
.structure .str-wrap .dw{
    display: block;
    position: absolute;
    right: 30%;
    top: 40%;
}
.reports .title .cn-title{
    text-align: center;
}
.reports .top{
    display: flex;
    margin-top: 80px;
    justify-content: space-between;
    align-items: center;
}
.reports .top .year{
    width: 218px;
    height: 61px;
    background: linear-gradient(to right, #172390, #0165b5) no-repeat;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    color: #fff;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    cursor: pointer;
    position: relative;
}
.reports .top .year .year-wrap{
    width: 100%;
    position: absolute;
    background: #fff;
    top: 100%;
    left: 0;
    z-index: 99;
    color: #333;
    transition: .5s;
    height: 0;
    overflow: hidden;
}
.reports .top .year .year-wrap.on{height: 200px}
.reports .top .year .year-wrap p{
    font-size: 24px;
    color: #666;
    line-height: 50px;
    background: linear-gradient(to right, #666, #666) left bottom no-repeat;
    background-size: 0 1px;
    transition: .5s;
    padding-left: 30px;
}
.reports .top .year .year-wrap p:hover{
    background-size: 100% 1px;
    color: #030dad;
}
.reports .top .reports-btn{
    display: flex;
    gap: 30px;
}
.reports .top .reports-btn div{
    cursor: pointer;
    transition: all .3s;
}
.reports .top .reports-btn div:hover{
    transform: translateY(-5px);
}
.reports .reports-swiper .reports-item .img img{
    width: 100%;
}
.reports .reports-swiper .reports-item p{
    font-size: 22px;
    color: #050000;
    text-align: center;
    margin-top: 30px;
}
.reports .reports-swiper {
    margin: 80px 0;
}
.swiper-button-lock{display: block}
#contact .comp{
    display: flex;
    position: absolute;
    width: 80%;
    margin: 0 auto;
    bottom: 20%;
    left: 50%;
    transform: translateX(-50%);
    justify-content: space-between;
}
#contact .comp li{
    display: flex;
    align-items: center;
    cursor: pointer;
}
#contact .comp li .icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #030dad;
    position: relative;
    margin-right: 10px;
    transition: .5s;
    opacity: 0;
}
#contact .comp li.on .icon{
    opacity: 1;
}
#contact .comp li .icon img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
#contact .comp li p{
    font-size: 20px;
    flex: 1;
}
#contact .comp.en-comp li p{
    font-size: 16px;
}

#contact{
    overflow: hidden;
    height: 1200px;
}
#contact .map{
    position: absolute;
    right: 0;
    top: 0;
}
#contact .map .map-mask{
    position: absolute;
    top: 0;
    left: -480px;
    background: #fff;
    width: 500%;
    height: 500%;
    z-index: 99;
    transition: 3s;
    transform:rotate(30deg)
}
#contact .map .tomap{
    position: absolute;
    top: 39%;
    left: 36%;
    width: 316px;
    height: 153px;
    border-radius: 13px;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
    background: #fff;
    display: flex;
    padding: 0 20px;
    align-items: center;
    justify-content: space-between;
}
#contact .map{display:none;}
#contact .map.show{display: block}
#contact .map .tomap a{
    font-size: 13.8px;
    border-bottom: 1px solid #030dad;
}
#contact .map .tomap .left{
    text-align: center;
}
#contact .map .tomap .left .zb{
    margin-bottom: 10px;
}
#contact .title{
    position: absolute;
    left: 0;
    bottom: 31%;
    font-size: 91px;
    line-height: 92px;
    opacity: 0;
    transition: 1s;
}
#contact .contact-list{
    display: none;
    justify-content: space-between;
    position: absolute;
    bottom: 7%;
    width: 1013px;
    align-items: center;
    margin: 0 auto;
    left: 50%;
    transform: translateX(-50%);
}
#contact .contact-list.show{
    display: flex;
}
#contact .contact-list .name{
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 20px;
    color: #000;
    justify-content: center;
}
#contact .contact-list .summary{
    font-size: 14px;
    color: #000;
    margin-top: 20px;
}
#msg{
    background: url("../images/msg-bg.jpg") center center / cover no-repeat;
    height: 865px;
    padding-top: 220px;
    box-sizing: border-box;
}
#msg .msg-wrap{
    display: flex;
    gap: 230px;
}
#msg .left-title{
    color: #fff;
}
#msg .left-title .font34{
    margin-top: 10px;
}
#msg .left-title .entit{
    margin-top: 10px;
    font-size: 16px;
}
.right-form .form{
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}
.right-form .form input,textarea{
    outline: none;
    border: none;
    background: rgba(255, 255, 255, .7);
}
.right-form .form .bm{
    width: 47.9%;
}
.right-form .form .bm input {
    width: 100%;
    height: 69px;
    border-radius: 9px;
    font-size: 18px;
    color: #333;
    padding-left: 20px;
    box-sizing: border-box;
}
.message{
    width: 100%;}
textarea{
    width: 100%;
    border-radius: 9px;
    font-size: 18px;
    color: #333;
    padding: 20px 0 0 20px;
    box-sizing: border-box;
    height: 215px;
}
.submit{
    width: 218px;
    height: 61px;
    background: linear-gradient(to right, #172390, #0165b5) no-repeat !important;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    transition: .3s;
}
.submit:hover{
    background: #172390;
}
#join{
    padding: 100px 0 90px;
}
#join .join-line{
    width: 100%;
    height: 1px;
    background: #d9d9d9;
    margin-top: 140px;
}
#join .join-line .active-line{
    background: #030dad;
    width: 50%;
    position: absolute;
    top: 0;
    left: 0;
    height: 2px;
    transition: .5s;
}
#join .zp{display: flex}
#join .zp .zp-item{
    width: 50%;
    height: 174px;
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: center;
    box-sizing: border-box;
    transition: .5s;
    cursor: pointer;
}
#join .zp .zp-item:hover{
    background: #fafafa;
}
#join .zp .zp-item:hover img{
    filter: grayscale(0);
}
#join .zp .zp-item img{
    filter: grayscale(100%);
    transition: .5s;
}
#join .zp .zp-item p{
    font-weight: lighter;
    color: #333333;
    font-size: 40px;
}
#join .zp .zp-item.on{
    background: #fafafa;
}
#join .zp .zp-item.on img{
    filter: grayscale(0);
}
#join .zp .tozp{
    width: 190px;
    height: 190px;
    border-radius: 50%;
    background: linear-gradient(to right, #172390, #0165b5) no-repeat;
    position: absolute;
    top: 30px;
    left: 50%;
    transform: translateX(-50%);
    font-weight: lighter;
    font-size: 25px;
    line-height: 190px;
    color: #fff;
    text-align: center;
    cursor: pointer;
    transition: .3s;
    opacity: 0;
}
#join .w88 > p{
    text-align: center;
}
#join .zp .tozp:hover{
    background: linear-gradient(to right, #172390, #172390) no-repeat;
}
#join .positions{
    display: flex;
    margin: 40px 0;
    justify-content: space-between;
    flex-wrap: wrap;

}
#join .positions li {
    width: 19%;
    margin-bottom: 20px;
}
#join .positions li a{
    /*margin-right: 20px;*/
    display: block;
    width:100%;
    height: 160px;
    line-height: 160px;
    font-size: 22px;
    transition: .5s;
    color: #666;
    border: 1px solid #ccc;
    border-radius: 15px;
    position: relative;
    overflow: hidden;
    text-align: center;
}
#join .positions.en-position li a {
    font-size: 16px;
}
#join .positions li a .posi-mask{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: -100%;
    background: linear-gradient(to right, #172390, #0165b5) no-repeat;
    border-radius: 15px;
    transition: .5s;
}
#join .positions li a:hover{color:#fff}
#join .positions li a:hover .posi-mask{
    left: 0;
}
.post-wrap{
    margin: 40px auto;
}
.post-wrap > p{
    font-weight: bold;
    color: #333;
}
.post-wrap .post_zz{
    font-size: 24px;
    margin: 20px 0 10px;
}
.post-wrap  .content p{
    font-size: 18px;
    line-height: 30px;
    color: #666;
}
.subsidiary {
    width: 100%;
}

.subsidiary .entitle {
    margin: 100px auto 0;
    text-align: center;
    line-height: 1;
}

.subsidiary .cntitle {
    color: #333333;
    margin: 10px 0 48px;
    text-align: center;
}

.subsidiary .show-main{
    width: 100%;
    height: 545px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 110px;
}

.subsidiary .show-main .mask {
    width: 48.5%;
    height: 100%;
    position: relative;
}

.subsidiary .show-main .part {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-bottom: 2px solid #ededed;
    position: relative;
}

.subsidiary .show-main .part .img-put {
    width: 100%;
    height: 76.8%;
    overflow: hidden;
}

.subsidiary .show-main .part:hover img {
    transform: scale(1.05);
}
.subsidiary .show-main .part:hover .info .info-text{
    color: #030dad;
}

.subsidiary .show-main .part .img-put img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: all .5s;
}

.subsidiary .show-main .part .info {
    width: 100%;
    height: 20%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.subsidiary .show-main .part .comp{
    padding-bottom: 20px;
    line-height: 28px;
}

.subsidiary .show-main .part .info .info-text {
    color: #333333;
    transition: .5s;
}

.subsidiary .show-main .part .info .info-button {
    --degs:57deg;
    width: 65px;
    height: 30px;
    border-radius: 30px;
    background: linear-gradient(var(--degs),#172390,#0165b5);
    transition: all 0.5s;
    position: relative;
    display: block;
}

.subsidiary .show-main .part .info .info-button::after{
    position: absolute;
    content: "";
    background: url(img/arrowhead-toright.svg);
    background-size: contain;
    background-repeat: no-repeat;
    top: 50%;
    left: 50%;
    width: 30px;
    height: 30px;
    transform: translate(-50%,-50%);
}

.subsidiary .show-main .part .info .info-button:hover{
    background-size: 300% 100%;
    animation: gradientAnimation 2s linear infinite;
    animation-direction: alternate;
    transition: all 0.5s;
}

@keyframes gradientAnimation {
    0% {
      background-position: 0;
    }
    to {
      background-position: 100%;
    }
  }

.center {
    width: 100%;
    height: 934px;
    display: flex;
    justify-content: space-between;
    position: relative;
}

.center .left-part {
    width: 50%;
    height: 100%;
    background: url(img/center-left.png);
    background-repeat: no-repeat;
    background-size: cover;
    flex-shrink: 0;
    padding-left: 102px;
    box-sizing: border-box;
}

.center .left-part .entitle {
    margin: 134px 0 32px;
    color: #ffffff;
    line-height: 1;
}

.center .left-part .cntitle {
    line-height: 1;
    color: #ffffff;
}

.center .right-part {
    width: 50%;
    height: 100%;
    flex-shrink: 0;
}

.center .right-part img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.center .circle-put {
    position: absolute;
    z-index: 3;
    width: 100%;
    height: 100%;
}

.center .circle-put .circle-1 {
    position: absolute;
    width: 132px;
    height: 132px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) scale(0);
    background: #1165b5;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 3;
}
#strategy .strategy-wrap .strategy-left{
    overflow: hidden;
    border-radius: 20px;
}
#strategy .strategy-wrap .strategy-left img{
    transition: .3s;
}
#strategy .strategy-wrap .strategy-left img:hover{
    transform: scale(1.15);
}
#strategy .strategy-wrap .strategy-right{
    flex: 1;
}
.center .circle-put .circle-1 img {
    width: 18%;
    object-fit: contain;
    cursor: pointer;
}

.center .circle-put .circle-2 {
    position: absolute;
    width: 132px;
    height: 132px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) scale(0);
    border-radius: 50%;
    border: 2px solid #ffffff40;
}

.center .circle-put .circle-3 {
    position: absolute;
    width: 226px;
    height: 226px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) scale(0);
    border-radius: 50%;
    border: 2px solid #ffffff40;
}

.center .circle-put .circle-4 {
    position: absolute;
    width: 764px;
    height: 764px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) scale(0);
    border-radius: 50%;
    border: 2px solid #ffffff40;
}
.center .circle-put .circle-4.en-4{
    width: 564px;
    height: 564px;
}

.center .circle-put .circle-4 .show-info {
    position: absolute;
    width: 1px;
    height: 1px;
    font-size: 22px;
    line-height: 1;
    color: #ffffff60;
    transition: all 0.5s;
    cursor: pointer;
}


.center .circle-put .circle-4 .show-info span {
    position: absolute;
    width: max-content;
    right: 0px;
    padding-right: 65px;
    transform: translate(0, -50%);

}

.center .circle-put .circle-4 .sp {
    color: #ffffff!important;
}

.center .circle-put .circle-4 .show-info::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #ffffff;
    transform: translate(-50%, -50%) scale(0);
    transition: all 0.5s;
}

.center .circle-put .circle-4 .show-info::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid #ffffff;
    transform: translate(-50%, -50%) scale(0);
    transition: all 0.5s;
}

.center .circle-put .circle-4 .sp::before {
    transform: translate(-50%, -50%) scale(1)!important;
    transition: all 0.5s;
}

.center .circle-put .circle-4 .sp::after {
    transform: translate(-50%, -50%) scale(1)!important;
    transition: all 0.5s;
}

.center .circle-put .circle-4 .depart-1 {
    left: 21%;
    top: 9%;
}

.center .circle-put .circle-4 .depart-2 {
    left: 7.1%;
    top: 24%;
}

.center .circle-put .circle-4 .depart-3 {
    left: 1%;
    top: 39%;
}

.center .circle-put .circle-4 .depart-4 {
    left: 0%;
    top: 54%;
}
.center .circle-put .circle-4 .depart-5 {
    left: 4%;
    top: 69%;
}
.center .circle-put .circle-4 .depart-6 {
    left: 12%;
    top: 83%;
}
.center .circle-put .circle-4 .depart-7 {
    left: 26%;
    top: 94%;
}

.center .depart-info {
    position: absolute;
    left: 102px;
    top: 50%;
    transform: translate(0,-50%);


}

.center .depart-info .part {
    width: 300px;
    position: absolute;
    opacity: 0;
    transition: all 0.5s;
}

.center .depart-info .sp {
    opacity: 1;
}


.center .depart-info .part .bg-title{
  color: #fff;
  line-height: 1;
}

.center .depart-info .part .sm-title{
    color: #fff;
    line-height: 1;
  }

.center .depart-info .part .trims-line{
    margin: 24px 0 40px;
    width: 40px;
    height: 4px;
    border-radius: 2px;
    background: #fff;
}

#factory {
    width: 100%;
    height: 880px;
    position: relative;
    overflow: hidden;
}

#factory .trims-circle {

    width: var(--circle-size);
    height: var(--circle-size);
    border-radius: 50%;
    background: linear-gradient(-144deg,#0684f3,#295da5);
    position: absolute;
    z-index: 2;
    transform: scale(0);
    transition: all 1s;
}

#factory .trims-circle::after{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) scale(var(--scale));
    background: #fff;
    border-radius: 50%;
    z-index: 3;
    width: var(--circle-size);
    height: var(--circle-size);
}

#factory .trims-circle-2 {

    width: var(--circle-size);
    height: var(--circle-size);
    border-radius: 50%;
    background: #f8f9fd;
    position: absolute;
    z-index: 2;
    transform: scale(0);
    transition: all 1s;
}

#factory .trims-circle-2::after{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) scale(var(--scale));
    background: #fff;
    border-radius: 50%;
    z-index: 3;
    width: var(--circle-size);
    height: var(--circle-size);
}

#factory .position-1 {
    left: 5%;
    top: -18%;
}

#factory .position-2 {
    right: 5%;
    top: 15%;
}

#factory .position-3 {
    right: 25%;
    bottom: -18%;
}

#factory .entitle {
    margin: 240px auto 70px;
    /*text-transform: capitalize;*/
    text-align: center;
    /*text-transform: uppercase;*/
}

.dazi {
    /* 本例12个文字(加标点符号)；有多少个文字，width就是多少个em */
    width: 10em;
    /* 加上两个动画，一个是打字动画，使用steps让字一个一个的出现，
     注意step和字数保持一致，光标动画也是同理，*/
    animation: typingWords 5s steps(20), cursor 0.5s steps(1);
    /* 要设置不允许换行，且溢出隐藏 */
    white-space: nowrap;
    overflow: hidden;
    /* 使用右边框作为打印的指针光标 */
    /* border-right: 1px solid #000; */
}

@keyframes typingWords {
    0% {
        width: 0;
    }
}

@keyframes cursor {
    50% {
        border-color: transparent;
    }
}

#factory .cntitle {
    margin:0 auto 100px ;
    line-height: 55px;
    text-align: center;
    color: #000;
    position: relative;
    z-index: 5;
}

#factory .sumary {
    line-height: 28px;
    color: #666666;
    text-align: center;
}

.slideshow {
    width: 100%;
    height: 265px;
    margin: 0 0 10px;
}

.slideshow2 {
    width: 100%;
    height: 265px;
    margin: 0 0 130px;
}


.slide-main {
    height: 100%;
    position: relative;
}

.slide-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
}

.slide-main .text {
    position: absolute;
    bottom: 0;
    z-index: 2;
    width: 100%;
    height: 35px;
    background-color: #00000060;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ffffff;
}

#news .bg-title {
    margin: 0 0 100px;
    font-weight: lighter;
    color: #000;
    line-height: 1;
}

.news-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.news-main .left-main {
    width: 16%;
    display: flex;
    flex-direction: column;
    position: sticky;
    height: 345px;
}

.news-main .left-main .entitle {
    font-size: 22px;
    color: #000;
    font-weight: bold;
    margin: 25px 0 35px;
}

.news-main .left-main .trims-line {
    width: 100%;
    height: 2px;
    background: #ebebeb;
}

.news-main .left-main .choice-list {
    width: 100%;
    display: flex;
    flex-direction: column;
    padding-top: 50px;
    box-sizing: border-box;
}

.news-main .left-main .choice-list .choice-item {
    margin-bottom: 45px;
    width: 100%;
    font-size: 20px;
    color: #333333;
    cursor: pointer;
}

.news-main .left-main .choice-list .choice-item input {
    cursor: pointer;
    width: 18px;
    height: 18px;
}

.news-main .left-main .choice-list .choice-item span {
    margin: 0 0 0 20px;
      cursor: pointer;
}

.news-main .right-main {
    width: 75%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    display: none;
}
.news-main .right-main.show{display: block;}
.not-show {
    display: none!important;
}

.news-main .right-main .top-show {
    width: 100%;
    height: 528px;
    display: flex;
    align-items: center;
    position: relative;
    border-radius: 20px;
    overflow: hidden;
}

.news-main .right-main .top-show:hover .right-part img {
    transform: scale(1.05);
}

.news-main .right-main .top-show .left-part {
    width: 40%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.news-main .right-main .top-show .left-part img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: blur(12px);
    transform: scale(1.1);
}

.news-main .right-main .top-show .left-part::after {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    content: "";
    background: #030dad;
    z-index: 3;
}

.news-main .right-main .top-show .left-part .interlayer {
    position: absolute;
    z-index: 4;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    padding-left: 36px;
    box-sizing: border-box;
    top: 0;
    left: 0;
}

.news-main .right-main .top-show .left-part .interlayer .first {
    margin: 67px 0 40px;
    width: 110px;
    height: 35px;
    border-radius: 18px;
    background-color: #fcfefe33;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ffffff;
    font-size: 14px;
}
.main-pages.swiper-pagination{
    text-align: left;
    bottom: 7%;
    left: 2%;
}
.main-pages .swiper-pagination-bullet {
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    color: #fff;
    opacity: .4;
    background: rgba(0, 0, 0, 0.2);
}

.main-pages .swiper-pagination-bullet-active {
    color: #fff;
    background: transparent;
    opacity: 1;
}
.news-main .right-main .top-show .left-part .interlayer .second {
    width: 90%;
    font-size: 22px;
    line-height: 36px;
    color: #ffffff;
}

.news-main .right-main .top-show .left-part .interlayer .third {
    margin: 60px 0 0;
    width: 95%;
    font-size: 16px;
    font-weight: lighter;
    line-height: 28px;
    color: #ffffffd9;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4; /* 限制显示的行数 */
    overflow: hidden;
    text-overflow: ellipsis;
}

.news-main .right-main .top-show .left-part .interlayer .more {
    position: absolute;
    right: 10%;
    bottom: 7%;
    color: #ffffff;
    font-size: 14px;
    line-height: 1;

}

.news-main .right-main .top-show .left-part .interlayer .more::after {
    position: absolute;
    content: "";
    top: 130%;
    left: 0;
    width: 100%;
    height: 1px;
    background: #ffffff;

}
.news-main .right-main .top-show .right-part {
    width: 60%;
    height: 100%;
    overflow: hidden;
}

.news-main .right-main .top-show .right-part img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 1s;

}

.news-main .right-main .normal-show {
    width: 100%;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 116px;
    position: relative;
    transition: .5s;
}

.news-main .right-main .normal-show .right-part {
    height: 152px;
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
    transition: .5s;
    position: relative;
    right: 0;
    width: 225px;
    top: 0;
}

.news-main .right-main .normal-show .left-part {
    height: 100%;
    display: flex;
    flex-direction: column;
    width: 74%;
}

.news-main .right-main .normal-show .left-part .tips {
    margin: 50px 0 0;
    display: flex;
    align-items: center;
}

.news-main .right-main .normal-show .left-part .tips span {
    font-size: 18px;
    color: #4c4c4c;
    line-height: 1;
    margin: 0 35px 0 15px;
}

.news-main .right-main .normal-show .left-part .tips .news-type {
    width: 110px;
    height: 35px;
    border-radius: 18px;
    border: 1px solid #b7b7b7;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #333333;
    font-size: 14px;
    transition: .5s;
}
.news-main .right-main .normal-show:hover .left-part  .tips .news-type{
    background: #1164b5;
    border-color: #1164b5;
    color: #fff;
}
.news-main .right-main .normal-show:hover .right-part{
   top: -30px;
}
.news-main .right-main .normal-show .left-part .cntitle {
    margin: 30px 0 0 15px;
    font-size: 22px;
    line-height: 28px;
    color: #000;
    transition: .5s;
}
.news-main .right-main .normal-show:hover .left-part .cntitle{
    color: #1164b5;
}
.news-main .right-main .normal-show::before {
    position: absolute;
    content: "";
    bottom: -58px;
    left: 0;
    width: 100%;
    height: 3px;
    background: #d9d9d9;
}

.news-main .right-main .normal-show::after {
    position: absolute;
    content: "";
    bottom: -58px;
    left: -100%;
    width: 100%;
    height: 3px;
    background: #1164b5;
    transition: all 1s;
}

.news-main .right-main .normal-show:hover::after {
    left: 0%;
}

.news-main .right-main .page-choice {
    width: 100%;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 0 110px;
}

.news-main .right-main .page-choice .left-btn {
    width: 50px;
    height: 69px;
    background: url(img/to-left-grey.png);
    background-repeat: no-repeat;
    background-size: cover;
    transition: all 0.3s;
    position: relative;
    top: 0px;
    margin-right: 34px;
}

.news-main .right-main .page-choice .left-btn:hover {
    background: url(img/to-left-blue.png);
    top: -5px;
}
.news-main .right-main .page-choice .current.left-btn {
    background: url(img/to-left-grey.png)!important;
    top: 0px!important;
}

.news-main .right-main .page-choice .current.right-btn {
    background: url(img/to-right-grey.png)!important;
    top: 0px!important;
}

.news-main .right-main .page-choice .right-btn {
    width: 50px;
    height: 69px;
    background: url(img/to-right-grey.png);
    background-repeat: no-repeat;
    background-size: cover;
    transition: all 0.3s;
    position: relative;
    top: 0px;
    margin-left: 34px;
}

.news-main .right-main .page-choice .right-btn:hover {
    background: url(img/to-right-blue.png);
    top: -5px;
}

.news-main .right-main .page-choice .circle-choice {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    outline: 1px solid #d2d2d2;
    margin: 0 8px 0;
    color: #999999;
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    top: 0px;
    transition: all 0.3s;

}

.news-main .right-main .page-choice .circle-choice:hover {
    outline: 0px;
    background: #030dad;
    color: #ffffff;
    top: -5px;
}

.news-main .right-main .page-choice .circle-choice.now {
    outline: 0px;
    background: #030dad;
    color: #ffffff;
    /*top: -5px;*/
}

.news-info-main {
    width: 100%;
    background: #f2f5fa;
    padding-bottom: 110px;
}

.news-info-main .cntitle {
    margin: 0px 0 50px;
    font-size: 34px;
    font-weight: lighter;
    color: #000000;
}

.news-info-main .news-put {
    width: 100%;
    background-color: #fff;
    padding-top: 160px;
    box-sizing: border-box;

}

.news-info-main .news-put .title-put {
    width: 90%;
    margin: 0 auto;
    border-bottom: 1px solid #d2d5d9;


}

.news-info-main .news-put .title-put .bg-title {
    font-size: 34px;
    color: #333333;
    font-weight: lighter;
    text-align: center;
    position: relative;
    width: fit-content;
    margin: 0 auto 70px;
    line-height: 50px;
}

.news-info-main .news-put .title-put .bg-title .sm-title {
    /*position: absolute;*/
    /*left: 0%;*/
    /*top: 0;*/
    font-size: 14px;
    color: #333333;
    font-weight: lighter;
}

/* .news-info-main .news-put .mian-info {

} */

.news-info-main .news-put .w90 {
    display: grid;
}

.news-info-main .news-put .w90 p{
    /* text-indent: 2em; */
    font-size: 16px;
    line-height: 28px;
    font-family: 'Source Han Sans Medium ,sans-serif';
    display: contents;
}

.news-info-main .news-put .w90 div{
     font-size: 16px;
    line-height: 28px;
    font-family: 'Source Han Sans Medium ,sans-serif';
    /*display: contents;*/
   text-indent: 2em;
   margin-bottom: 4px;
}

.news-info-main .news-put .w90 img {
    margin: 60px auto;
    display: block;
    max-width: 100%;
    height: auto;
}

.news-info-main .news-put .w90 strong {
    /*line-height: 90px;*/
    position: relative;
    /*top: 10px;*/
    font-weight: bold;

}

.news-info-main .page-choice {
    width: 70%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto 85px;
    overflow: hidden;
}

.news-info-main .page-choice .choice-item {
    font-size: 16px;
    line-height: 28px;
    width: 100%;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    font-weight: bold;
    color: #333333;
    text-decoration: none;

}

.news-info-main .page-choice .choice-item::after{
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #e6e6e6;
    z-index: 1;
}

.news-info-main .page-choice .choice-item::before{
    position: absolute;
    content: "";
    left: -100%;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #030dad;
    transition: all 1s;
    z-index: 2;
}

.news-info-main .page-choice .choice-item:hover:before{
    left: 0%;
}

.news-info-main .page-choice .choice-item:hover {
    color: #030dad;
}

.news-info-main .back-button {
    font-size: 24px;
    width: 212px;
    height: 61px;
    line-height: 61px;
    text-align: center;
    cursor: pointer;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    margin:  88px auto 105px;
    overflow: hidden;
    background: linear-gradient(to right, #172390 20%, #0165b5);
    color: #fff;
    text-indent: 0;
}

.product-info {
    width: 100%;
    padding-left: 81px;
    box-sizing: border-box;
}

.product-info .cntitle {
    margin: 155px 0 0;
    line-height: 1;
    color: #030dad;


}

.product-info .entitle {
    color: #333333;
    margin: 25px 0 90px;
}

.product-info .product-info-main {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;

}

.product-info .product-info-main .left-part {
    width: 16.5%;
    display: flex;
    flex-direction: column;
    border-top: 2px solid #ebebeb;
    border-left: 2px solid #ebebeb;
    border-right: 2px solid #ebebeb;
}

.product-info .product-info-main .left-part .system-choice {
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 2px solid #ebebeb;
    font-weight: normal;
    line-height: 1;
    color: #888888;
    transition: all 0.3s;
}

.product-info .product-info-main .left-part .sp {
    color: #030dad!important;
    transition: all 0.3s;
}

.product-info .product-info-main .left-part .system-choice span {
    position: relative;
    transition: all 0.3s;
}

.product-info .product-info-main .left-part .sp span {
    font-weight: bold;
}

.product-info .product-info-main .left-part .system-choice span::after {
    position: absolute;
    content: "";
    width: 10px;
    height: 3px;
    background: #030dad;
    top: 50%;
    left: -22px;
    transform: translate(0,-50%) scale(0);
    transition: all 0.3s;
}

.product-info .product-info-main .left-part .sp span::after {
    position: absolute;
    content: "";
    width: 10px;
    height: 3px;
    background: #030dad;
    top: 50%;
    left: -22px;
    transform: translate(0,-50%) scale(1);
    transition: all 0.3s;
}

.product-info .product-info-main .left-part .system-choice:first-child {
    background: #fafafa;
}

.product-info .product-info-main .right-part {
    width: 75%;
    display: flex;
    flex-direction: column;
}

.product-info .product-info-main .right-part .system-item {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.product-info .product-info-main .right-part .system-item .item-left {
    position: relative;
}

.product-info .product-info-main .right-part .system-item .item-left .number {
    width: 90px;
    height: 90px;
    outline: 1px solid #030dad;
    position: relative;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #030dad;
    font-weight: bold;
    background-color: #fff;
    z-index: 5;
}

.product-info .product-info-main .right-part .system-item .item-left .trims-line {
    position: absolute;
    width: 1px;
    height: 99%;
    left: 50%;
    bottom: 0px;
    background: #d9d9d9;
    z-index: 2;
}

.product-info .product-info-main .right-part .system-item .item-right {
    width: 985px;
    margin: 0 0 72px;
}

.product-info .product-info-main .right-part .system-item .item-right .title {
    color: #333;
    font-weight: lighter;
    margin: 0 0 27px;
}

.product-info .product-info-main .right-part .system-item .item-right .table-1 {
    width: 100%;
    border-spacing: 0px;
}

.product-info .product-info-main .right-part .system-item .item-right .table-1 th:first-of-type {
    background: #030dad;
    width: 150px;
    height: 55px;
}

.product-info .product-info-main .right-part .system-item .item-right .table-1 th {
    background: #030dad;
    width: 75px;
    height: 55px;
    text-align: center;
    vertical-align: middle;
    font-family: 'Source Han Sans Medium ,sans-serif';
    font-size: 16px;
    color: #ffffff;
}

.product-info .product-info-main .right-part .system-item .item-right .table-1 thead tr {
    border-bottom: 1px solid #447fbf;
}

.product-info .product-info-main .right-part .system-item .item-right .table-1 tbody tr td{
    background: #ebebef;
    width: 75px;
    height: 55px;
    text-align: center;
    vertical-align: middle;
    font-family: 'Source Han Sans Medium ,sans-serif';
    font-size: 16px;
    color: #666666;
}

.product-info .product-info-main .right-part .system-item .item-right .table-1 tbody tr td[colspan="1"]{
    background: #030dad;
    text-align: center;
    vertical-align: middle;
    font-family: 'montMedium';
    font-size: 16px;
    color: #fff;
    font-weight: bold;
}

.product-info .product-info-main .right-part .system-item .item-right .table-1 tbody tr:nth-of-type(2n) td {
    background: #add3ea;
    width: 75px;
    height: 55px;
    text-align: center;
    vertical-align: middle;
    font-family: 'Source Han Sans Medium ,sans-serif';
    font-size: 16px;
    color: #666666;
}


.product-info .product-info-main .right-part .system-item .item-right .table-2 {
    width: 100%;
    border-spacing: 0px;
}

.product-info .product-info-main .right-part .system-item .item-right .table-2 th {
    background: #030dad;
    width: 20%;
    height: 55px;
    text-align: center;
    vertical-align: middle;
    font-family: 'Source Han Sans Medium ,sans-serif';
    font-size: 16px;
    color: #ffffff;
    border-right: 1px solid #fff;
}

.product-info .product-info-main .right-part .system-item .item-right .table-2 thead tr {
    border-bottom: 1px solid #447fbf;
}

.product-info .product-info-main .right-part .system-item .item-right .table-2 tbody tr td{
    background: #ebebef;
    width: 20%;
    height: 55px;
    text-align: center;
    vertical-align: middle;
    font-family: 'Source Han Sans Medium ,sans-serif';
    font-size: 16px;
    color: #666666;
    border-right: 1px solid #fff;
}

.product-info .product-info-main .right-part .system-item .item-right .table-2 tbody tr td[rowspan="2"] {
    background: #add3ea;
}

.product-info .product-info-main .right-part .system-item .item-right .table-2 tbody tr:nth-of-type(2n) td {
    background: #add3ea;
    width: 75px;
    height: 55px;
    text-align: center;
    vertical-align: middle;
    font-family: 'Source Han Sans Medium ,sans-serif';
    font-size: 16px;
    color: #666666;
    border-right: 1px solid #fff;
}


.product-info .product-info-main .right-part .system-item .item-right .table-3 {
    width: 100%;
    border-spacing: 0px;
}

.product-info .product-info-main .right-part .system-item .item-right .table-3 th {
    background: #030dad;
    width: 33%;
    height: 55px;
    text-align: center;
    vertical-align: middle;
    font-family: 'Source Han Sans Medium ,sans-serif';
    font-size: 16px;
    color: #ffffff;
}

.product-info .product-info-main .right-part .system-item .item-right .table-3 th:first-of-type {
    padding-left: 10%;
    box-sizing: border-box;
}

.product-info .product-info-main .right-part .system-item .item-right .table-3 th:last-of-type {
    padding-right: 10%;
    box-sizing: border-box;
}

.product-info .product-info-main .right-part .system-item .item-right .table-3 thead tr {
    border-bottom: 1px solid #447fbf;
}

.product-info .product-info-main .right-part .system-item .item-right .table-3 tbody tr td{
    background: #ebebef;
    width: 33%;
    height: 55px;
    text-align: center;
    vertical-align: middle;
    font-family: 'Source Han Sans Medium ,sans-serif';
    font-size: 16px;
    color: #666666;
}

.product-info .product-info-main .right-part .system-item .item-right .table-3 tbody tr td:first-of-type{
    padding-left: 10%;
    box-sizing: border-box;
}

.product-info .product-info-main .right-part .system-item .item-right .table-3 tbody tr td:last-of-type{
    padding-right: 10%;
    box-sizing: border-box;
}


.product-info .product-info-main .right-part .system-item .item-right .table-3 tbody tr:nth-of-type(2n) td {
    background: #add3ea;
    width: 75px;
    height: 55px;
    text-align: center;
    vertical-align: middle;
    font-family: 'Source Han Sans Medium ,sans-serif';
    font-size: 16px;
    color: #666666;
}

.product-info .product-info-main .right-part .system-item .item-right .features-item {
    width: 100%;
    height: 135px;
    padding: 0 35px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    line-height: 1;
    color: #333333;
    position: relative;
    overflow: hidden;
}

.product-info .product-info-main .right-part .system-item .item-right .features-item::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    content: "";
    background: #f7f7f7;
}

.product-info .product-info-main .right-part .system-item .item-right .features-item::after {
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 3px;
    content: "";
    background: #3461d1;
    transition: all 2s;
}

.product-info .product-info-main .right-part .system-item .item-right .features-item:hover:after {
    left: 0%;
}

.product-info .product-info-main .right-part .system-item .item-right .features-item .point {
    background: #3461d1;
    box-shadow: #cedeff;
    height: 25px;
    width: 25px;
    border-radius: 50%;
    animation: breath-light 2.6s infinite;
}

@keyframes breath-light {
    0% {
        transform: scale(0.60);
        /* 注意rgba中的a的设置 */
        box-shadow: 0 0 0 0 #cedeff99;
    }

    60% {
        transform: scale(1);
        box-shadow: 0 0 0 22px #cedeff00;
    }

    100% {
        transform: scale(0.60);
        box-shadow: 0 0 0 0 #cedeff00;
    }
}
.product-info-button {
    width: 100%;
    padding-left: 81px;
    box-sizing: border-box;
    background: #0d1526;
    overflow: hidden;
}

.product-info-button .product-info-main-button {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.product-info-button .product-info-main-button .left-part {
    width: 16.5%;
    display: flex;
    flex-direction: column;
    border-top: 2px solid #b0b2b5;
    border-left: 2px solid #b0b2b5;
    border-right: 2px solid #b0b2b5;
    margin: -411px 0 0;
}

.product-info-button .product-info-main-button .left-part .system-choice {
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 2px solid #b0b2b5;
    font-weight: normal;
    line-height: 1;
    color: #888888;
    transition: all 0.3s;
    background: #0d1526;
}

.product-info-button .product-info-main-button .left-part .sp {
    color: #ffffff!important;
    transition: all 0.3s;
}

.product-info-button .product-info-main-button .left-part .system-choice span {
    position: relative;
    transition: all 0.3s;
}

.product-info-button .product-info-main-button .left-part .sp span {
    font-weight: bold;
}

.product-info-button .product-info-main-button .left-part .system-choice span::after {
    position: absolute;
    content: "";
    width: 10px;
    height: 3px;
    background: #030dad;
    top: 50%;
    left: -22px;
    transform: translate(0,-50%) scale(0);
    transition: all 0.3s;
}

.product-info-button .product-info-main-button .left-part .sp span::after {
    position: absolute;
    content: "";
    width: 10px;
    height: 3px;
    background: #ffffff;
    top: 50%;
    left: -22px;
    transform: translate(0,-50%) scale(1);
    transition: all 0.3s;
}

.product-info-button .product-info-main-button .left-part .system-choice:last-of-type {
    background: #3c4350;
}

.product-info-button .product-info-main-button .right-part {
    width: 70.8%;
    display: flex;
    flex-direction: column;
}

.product-info-button .product-info-main-button .right-part .system-item {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.product-info-button .product-info-main-button .right-part .system-item .item-left {
    position: relative;
}

.product-info-button .product-info-main-button .right-part .system-item .item-left .number {
    width: 90px;
    height: 90px;
    outline: 1px solid #fff;
    position: relative;
    top: 15%;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-weight: bold;
    background-color: #0d1526;
    z-index: 5;
}

.product-info-button .product-info-main-button .right-part .system-item .item-left .trims-line {
    position: absolute;
    width: 1px;
    height: 20%;
    left: 50%;
    top: 0px;
    background: #d9d9d9;
    z-index: 2;
}

.product-info-button .product-info-main-button .right-part .system-item .item-right {
    width: 985px;
    margin: 0 0 72px;
}

.product-info-button .product-info-main-button .right-part .system-item .item-right .title {
    color: #fff;
    font-weight: lighter;
    margin: 125px 0 130px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.product-info-button .product-info-main-button .right-part .system-item .item-right .title .sumary {
    width: 50%;
    font-size: 16px;
    line-height: 26px;
    color: #fff;
}

.product-info-button .product-info-main-button .right-part .system-item .item-right .slideshow3 {
    width: 1200px;
    height: 454px;
}

.product-info-button .product-info-main-button .right-part .system-item .item-right .slideshow3 .slide-main {
    position: relative;

}

.product-info-button .product-info-main-button .right-part .system-item .item-right .slideshow3 .slide-main .text {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #00000080;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    font-size: 26px;
    color: #ffffff;
    z-index: 3;
    opacity: 0;
    transition: all 0.3s;
}

.product-info-button .product-info-main-button .right-part .system-item .item-right .slideshow3 .slide-main:hover .text {
    opacity: 1;
    transition: all 0.3s;
}


.product-info-button .product-info-main-button .right-part .system-item .item-right .slideshow3 .slide-main .text .cn-title {
    line-height: 30px;
    color: #fff;
    text-align: center;
}

.product-info-button .product-info-main-button .right-part .system-item .item-right .slideshow3 .slide-main .text .en-title {
    font-size: 16px;
    line-height: 10px;
    color: #fff;
    text-transform: capitalize;
    text-align: center;
    font-weight: 100;
    margin: 15px 0 0;
}
#structure{
    padding-top: 80px;
}
#structure .w88{width: 1500px;overflow: hidden;}
#structure .w88 .ceo{
    width: 226px;
    height: 77px;
    text-align: center;
    line-height: 77px;
    background: linear-gradient(to right, #172291, #1165b5);
    border-radius: 6px;
    margin: 20px auto;
    color: #fff;
}
 #structure .mac-img img{width: 100%;height: auto}
#structure .w88 .ceo:nth-child(2){
    line-height: 30px;
    padding-top: 10px;
    box-sizing: border-box;
    margin-bottom: 0;
}
#structure .w88 .positions .l{
    width: 80.5%;
    height: 1px;
    background: #535353;
    margin-left: 80px;
}
#structure .w88 .positions .pment{
    display: flex;
    margin-left: 28px;
}
#structure .w88 .positions .pment .pment-item,
.pment2 .pment-item,
.pment3 .pment-item{
    position: relative;
    /*width: 125px;*/
    /*height: 94px;*/
}
#structure .w88 .positions .pment .pment-item:nth-child(1){margin-right: 45px}
#structure .w88 .positions .pment .pment-item:nth-child(2){margin: 30px 450px 0 0}
#structure .w88 .positions .pment .pment-item:nth-child(3){margin-right: 331.5px}
#structure .w88 .positions .pment .pment-item .pment-bg,
#structure .w88 .positions .pment2 .pment-item .pment-bg,
#structure .w88 .positions .pment3 .pment-item .pment-bg{
    width: 105px;
    height: 74px;
    background: #1165b5;
    border-radius: 6px;
}
#structure .w88 .positions .pment .pment-item:nth-child(2) .s-line{
    position: absolute;
    top: -30px;
    left:69%;
    transform: translateX(-50%);
}
#structure .w88 .positions .pment .pment-item p,
.pment2 .pment-item p,
.pment3 .pment-item p{
    width: 105px;
    height: 74px;
    font-size: 14.8px;
    line-height: 74px;
    border-radius: 6px;
    background: #f2f5fa;
    position: absolute;
    top: 4px;
    left: 4px;
    text-align: center;
    transition: .3s;
}
.s-line{
    height: 30px;
    width: 1px;
    background: #535353;
}
.auto{
    margin: 0 auto;
}
.h-line{
    height: 1px;
    width: 65px;
    background: #535353;
}
#structure .w88 .positions .pment .pment-wrap{
    display: flex;
    align-items: center;
}
.pment2,.pment3{
    display: flex;
}
.pment2 .pment-item:nth-child(1),
.pment2 .pment-item:nth-child(2){
    margin-right: 20px;
}
.pment2 .pment-item:nth-child(3){
    margin-right: 92px;
}
.pment2 .pment-item:nth-child(2){
    margin-top: 30px;
}
.pment2 .pment-item:nth-child(6){
    margin-right: 15px;
}
.pment2 .pment-item:nth-child(7){
    margin-right: 74px;
}
.pment2 .pment-item:nth-child(2) .s-line{
    position: absolute;
    left: 50%;
    top: -99px;
    height: 99px;
    transform: translateX(-50%);
}
.pment2 .pment-line{
    width: 84px;
    height: 1px;
    background: #535353;
    margin-top: 82.5px;
}
.line2{
    display: flex;
    margin: 0 0 0 52px;
}
.line2 .left-line2{
    width: 251px;
    height: 1px;
    background: #535353;
    margin-right: 385px;
}
.line2 .right-line2{
    width: 300px;
    height: 1px;
    background: #535353;
}
.pment3{
    margin-left: 389px;
}
.pment3 .pment-item{
    margin-right: 10px;
}
.pment3 .pment-item:nth-child(1),
.pment3 .pment-item:nth-child(2),
.pment3 .pment-item:nth-child(5),
.pment3 .pment-item:nth-child(6){
    margin-top: -2px;
}
.pment3 .pment-item:nth-child(2){
    margin-right: 25px;
}
.pment3 .pment-item:nth-child(6){
    margin-right: 35px;
}
.line3{
    margin-left: 441px;
}
.line3 .left-line3{
    width: 116px;
    height: 1px;
    background: #535353;
}
.line3 .center-line3{
    width: 116px;
    height: 1px;
    background: #535353;
    margin-left: 475px;
}
.line3 .right-line3{
    width: 232px;
    height: 1px;
    background: #535353;
    margin-left: 730px;
}
.dc-line{
    position: absolute;
    top: 83%;
    left: 50%;
    transform: translateX(-50%);
    height: 58px;
    width: 1px;
    background: #535353;
}
.sy-line{
    position: absolute;
    top: calc(100% - 27px);
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    background: #535353;
    height: 164px;
}
 .pment-item .pment-bg p:hover{
    background: #1165b5 !important;
    color: #fff;
}
.wrap1, .wrap2{
    height: 100vh;
    width: 100%;
    box-sizing: border-box;
}
.mb-pro-btn{
    position: absolute;
    bottom: 80px;
    display: none;
    justify-content: center;
    z-index: 99;
    gap: 30px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
}
.wrap1 .wrap1-item{
    height: 100vh;
    padding-top: 330px;
    box-sizing: border-box;
    color: #fff;
}
.wrap1 .wrap1-item .pro-title{
    font-size: 45px;
    font-weight: lighter;
}
.wrap1 .wrap1-item .pro-dsc{
    line-height: 30px;
    margin-top: 20px;
    width: 48%;
}
.wrap1 .btn-list{
    position: absolute;
    display: flex;
    bottom: 0;
    color: #fff;
    align-items: center;
    justify-content: center;
    left: 50%;
    transform: translateX(-50%);
    width: 1440px;
}
 .mb-pro-btn{display: none}
.wrap1 .btn-list li {
    text-align: center;
    height: 153px;
    position: relative;
    width: 25%;
    cursor: pointer;
    overflow: hidden;
}
.wrap1 .btn-list li .icon > img{
    margin: 0 auto;
    height: 40px;
    width: auto;
}
.wrap1 .btn-list li .icon-title{
    font-size: 22px;
    margin-top: 15px;
}
.wrap1 .btn-list li .blue-light{
    position: absolute;
    bottom: -100%;
    width: 100%;
    opacity: 0;
    transition: .5s;
}
.wrap1 .btn-list li.on .blue-light{
    opacity: 0.6;
    bottom: 0;
}
.wrap1 .pro-line{
    position: absolute;
    transition: .5s;
    bottom: 0;
    left: 0;
    height: 6px;
    background: #030dad;
    width: 240px;
    z-index: 10;
}
.wrap2{

    padding-top: 90px;
}
.wrap2  .font66, .wrap2 .font34{
    color: #fff;
    text-align: center;
}
.wrap2 .appli-list{
    color: #fff;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 100px;
    width: 64.5%;
    margin: 100px auto 0;
}
.domUp {
    position: relative;
    animation: upDown ease 1s forwards;
    animation-delay: .6s;
    bottom: -100px;
    opacity: 0;
}
.layui-laypage .layui-laypage-curr,
.layui-laypage > a{
    width: 56px;
    height: 56px;
    border: 1px solid #d9d9d9;
    border-radius: 50%;
    line-height: 56px;
    padding: 0;
    margin: 0 15px 0 0;
}
.layui-laypage > a.layui-laypage-prev,
.layui-laypage > a.layui-laypage-next{
    border: none;
}
.layui-laypage > a.layui-laypage-prev{margin: 0 30px 0 0}
.layui-laypage > a.layui-laypage-next{margin: 0 0 0 15px}
.layui-laypage .layui-laypage-curr .layui-laypage-em{border-radius: 50%}
.wrap2 .appli-list li {
    width: 238px;
    height: 160px;
    border-radius: 15px;
    background: rgba(255, 255, 252, .25);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: .3s;
    position: relative;
    overflow: hidden;
}
@keyframes upDown {
    0%{
        bottom: -100px;
        opacity: 0;
    }
    100%{
        bottom: 0;
        opacity: 1;
    }
}
.page-wrap{
    display: flex;
    justify-content: flex-end;
}
.wrap2 .appli-list li p{text-align: center;line-height: 39px;position: relative;z-index: 10}
.wrap2 .appli-list li .montMedium{
    font-size: 32px;
}
.wrap2 .appli-list li .sm{font-size: 22px}
.wrap2 .appli-list li .appli-mask{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: -100%;
    background: linear-gradient(to right, #172390, #0165b5) no-repeat;
    z-index: 9;
    border-radius: 15px;
    transition: .3s;
}
.wrap2 .appli-list li:hover{
    /*margin-top: -20px;*/
}
.wrap2 .appli-list li:hover .appli-mask{
    left: 0;
}
.wrap3{
    background: url("../images/case-bg.jpg") center center / cover no-repeat;
    padding: 70px 0;
    overflow: hidden;
}
/*.wrap3  .font66{margin-top: 70px}*/
.wrap3  .font66, .wrap3 .font34 {
    color: #fff;
    text-align: center;
}
.wrap3 .case-swiper{
    margin-top: 40px;
}
.wrap3 .case-swiper .case-item{
    display: flex;
    justify-content: space-between;
    align-items: center;
    overflow: hidden;
}
.wrap3 .case-swiper .case-right{
    color: #fff;
    width: 50%;
}
.wrap3 .case-swiper .case-left,
.green-left{
    overflow: hidden;
    border-radius: 25px;
}
.wrap3 .case-swiper .case-left{
    position: relative;
  /*  left: -600px;
    opacity: 0;*/
}
.wrap3 .case-swiper .case-right{
    position: relative;
   /* right: -600px;
    opacity: 0;*/
}
.domLeft{
    animation: domLeft 1s forwards;
    animation-delay: .4s;
}
.domRight{
    animation: domRight 1s forwards;
    animation-delay: .6s;
}
@keyframes domLeft {
    0%{
        left: -600px;
        opacity: 0;
    }
    100%{
        left: 0;
        opacity: 1;
    }
}
@keyframes domRight {
    0%{
        right: -600px;
        opacity: 0;
    }
    100%{
        right: 0;
        opacity: 1;
    }
}
.green-left img,
.wrap3 .case-swiper .case-left img{
    transition: .5s;
}
.wrap3 .case-swiper .case-left img{
    width: 569px;
    height: auto;
}
.wrap3 .case-swiper .case-left img:hover,
.green-left img:hover{
    transform: scale(1.15);
}
.green-right{flex: 1}
.wrap3 .case-swiper .case-right .case-title{
    font-size: 36px;
}
.wrap3 .case-swiper .case-right .case-content{
    margin: 20px 0 30px;
}
.wrap3 .case-swiper .case-right .case-content p{
    line-height: 28px;
    opacity: 0.8;
}
.wrap3 .case-swiper .case-right .use{
    background: linear-gradient(to right, #172390, #0165b5) no-repeat;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    text-align: center;
    width: 143px;
    height: 51px;
    line-height: 51px;
    cursor: pointer;
    transition: .3s;
}
.wrap3 .case-swiper .case-right .use:hover{
    background: #172390;
}
.wrap3 .case-swiper .case-right .case-name{
    margin-top: 30px;
}
.caseBtn-swiper{
    overflow: hidden;
}
.wrap3 .case-btn{
    display: flex;
    justify-content: space-between;
    margin-top: 60px;
    /*overflow-x: scroll;*/
    padding-bottom: 20px;
}
.wrap3 .case-btn li{
    cursor: pointer;
    transition: .5s;
    margin-right: 20px;
    width: fit-content;
}
.wrap3 .case-btn li .img{
    border-radius: 10px;
    overflow: hidden;
}
.wrap3 .case-btn li:hover{
    transform: translateY(-10px);
}

.wrap3 .case-btn li .img > img{
    width: 271px;
    height: auto;
    display: block;
}
.wrap3 .case-btn li .img .icon-mask{
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .6);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9;
    border-radius: 10px;
    opacity: 1;
    transition: .5s;
}
.wrap3 .case-btn li:hover .img .icon-mask{
    opacity: 0;
}
.wrap3 .case-btn li.on .img .icon-mask{
    opacity: 0;
}
.wrap3 .case-btn li p{
    color: #fff;
    text-align: center;
    margin-top: 30px;
    white-space: nowrap;      /* 禁止换行 */
    overflow: hidden;         /* 隐藏溢出内容 */
    text-overflow: ellipsis;  /* 显示省略号 */
    width: 200px;
}

.wrap3 .case-btn li .img .icon-mask img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.coal{
    height: 100vh;
    padding: 90px 0 40px;
    box-sizing: border-box;
}
.coal .coal-list{
    display: flex;
    justify-content: space-between;
    margin-top: 80px;
    opacity: 0;
}
.coal .coal-list li {
    width: 23.38%;
    height: 460px;
    border: 1px solid #fff;
    border-radius: 16px;
    color: #fff;
    display: flex;
    flex-direction: column;
    padding: 0 30px;
    justify-content: center;
    box-sizing: border-box;
    cursor: pointer;
    transition: all .5s;
    position: relative;
    overflow: hidden;
}
.coal .coal-list li:hover{
    background: linear-gradient(to right, #172390, #0165b5) no-repeat;
    border-color: #0165b5;
    transition: all .5s;
    margin-top: -30px;
}
.coal-mask{
    background: linear-gradient(to right, #172390, #0165b5) no-repeat;
    width: 100%;
    height: 100%;
    transition: all .5s;
    position: absolute;
    top: 0;
    left: -100%;
    border-radius: 16px;
}

/*.coal .coal-list li:hover .coal-mask{*/
/*    left: 0;*/
/*}*/
.coal .coal-list li img{
    margin: 0 auto;
}
.coal .w80 > p {
    color: #fff;
    text-align: center;
}
.coal .coal-list li .title{
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    margin: 70px 0 10px;
}
.coal .coal-list li .summary{
    line-height: 24px;
}
.coal .svg{
    position: absolute;top:-2px;left: 0;z-index: 10;overflow: hidden;
    display: block;width: 100%;height: calc(100vh + 10px);
    /*background: #fff;*/
}
.coal .svg img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.ofi{
    object-fit: cover;
    object-position: center;
}
.svg-text{
    position: absolute;
    top: 10%;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}
.svg-text .font34{
    margin-top: 20px;
    line-height: 44px;
}
.svg-text p {
    text-align: center;
}
#strategy{
    padding: 110px 0 80px;
    position: relative;
    left: 0;
    top: 0;
    z-index: 6;
    background-color: #fff;
}
#strategy .w80 > p{text-align: center}
#strategy .strategy-wrap{
    margin-top: 80px;
    display: flex;
    gap: 80px;
    align-items: center;
}
.green .green-wrap,
#strategy .strategy-wrap{
    height: 500px;
}
/*.green .green-wrap .green-left,
.green .green-wrap .green-left img{
    height: 100%;
}*/
.green .green-wrap .green-left img{display: block;object-position: center;object-fit: cover}
#strategy .strategy-right .right-title{
    color: #333;
    font-size: 48px;
}
#strategy .strategy-right .right-title.en-tit,
.green.en .green-wrap .green-right .title{
    font-size: 40px;
}
#strategy .strategy-right .dsc{
    color: #333;
    line-height: 28px;
    margin: 60px 0 30px;
}
#strategy .strategy-right .text-list li{
    display: flex;
    gap: 10px;
    align-items: center;
}
#strategy .strategy-right .text-list li p{color: #666;line-height: 32px}
#strategy .strategy-right .text-list li p span{
    color: #333;
    font-weight: bold;
}

.green{
    background-color: #389036;
    width: 100%;
    padding: 190px 0 ;
    height: 100vh;
    box-sizing: border-box;
}
.green .green-wrap{
    display: flex;
    gap: 80px;
    color: #fff;
    align-items: center;
}
.green .green-wrap .green-right .title{
    font-size: 40px;
    letter-spacing: 5px;
}
.green .green-wrap .green-right .item{
    margin-top: 30px;
}
.green .green-wrap .green-right .item .item-top {
    display: flex;
    gap: 10px;
    font-weight: bold;
    font-size: 22px;
    align-items: center;
}
.green .green-wrap .green-right .item > p{
    line-height: 26px;
    margin-top: 10px;
    margin-left: 26px;
}
.green .bottom-text{
    color: #fff;
    opacity: 0.03;
    font-size: 246px;
    position: absolute;
    right: 0;
    bottom: 0;
    line-height: 185px;
}
.color-wrap .blue{
    background-color: #2a4c70;
}
.color-wrap .white{
    background-color: #fff;
}
.color-wrap .white .green-wrap{
    color: #333;
}
.color-wrap .white .green-wrap .item p{color: #666}
.svg-text p{
    /*opacity: 0;*/
}
.text_box p{
    font-size: 34px;
    font-weight: lighter;
    color: #333;
    line-height: 47px;
}
.text_box.en_box p{
    font-size: 20px;
    line-height: 38px;
}
.text_box p span{
    opacity: 0.3;
}
.esg-page .page-des.on{height: 200px}
.ind-page .page-des.on{height: 140px}

.wellness{
    width: 100%;
    padding: 110px 0 90px;
}
.wellness .w80 > .font34{color: #333;margin:0px 0 30px;font-size: 36px}
.wellness .w80 > .content{font-size: 20px}
.wellness .well-list{
    display: flex;
    justify-content: space-between;
    margin: 70px 0;
}
.wellness .well-list li {
    display: flex;
    gap: 20px;
    align-items: center;
}
.wellness .well-list li .title {
    font-size: 28px;
    color: #333;
}
.wellness .well-list li .summary{
    font-size: 14px;
    margin-top: 10px;
}
.wellness .bg{
    overflow: hidden;
       height: 773px;
    max-height: 773px;
}
.wellness .bg img{
    width: 100%;
}
.wellness .bg img:hover{
    transform: scale(1.1);
}
#charty{
    padding-top: 0;
}
#event{
    padding-bottom: 140px;
}
#event .event-top{
    display: flex;
    justify-content: space-between;
}
#event .event-top .select-year{
    display: flex;
    width: 218px;
    height: 61px;
    background: linear-gradient(to right, #172390, #0165b5) no-repeat;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    align-items: center;
    justify-content: center;
    gap: 20px;
    color: #fff;
    font-size: 18px;
    transition: .3s;
    cursor: pointer;
    z-index: 999;
}
#event .event-top .select-year:hover{
    background: linear-gradient(to right, #172390, #172390) no-repeat;

}
#event .event-top .select-year .year-mask{
    height: 0px;
    transition: .5s;
    width: 100%;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 999;
    overflow: hidden;
    background: #fff;
}
#event .event-top .select-year .year-mask.on{height: 180px}
#event .event-top .select-year .year-mask p{
    padding-left: 20px;
    line-height: 40px;
    font-size: 28px;
    color: #333;
    background: linear-gradient(to right, #333, #333) left bottom no-repeat;
    background-size: 0 1px;
    transition: .5s;
}
#event .event-top .select-year .year-mask p:hover{
    background-size: 100% 1px;
}
#event .event-top .event-btn{
    display: flex;
    gap: 20px;
}
#event .event-top .event-btn div{cursor: pointer}
#event .event-top .event-btn div:hover{
    transform: translateY(-5px);
}
#event .event-swiper{
    margin-top: 60px;
}
#event .event-swiper .img{
    box-shadow: -5px 5px 15px rgba(0, 0, 0, 0.1);
    border-radius: 25px;
}
#event .event-swiper .img img{object-fit:cover;object-position: center;width: 100%;}
#event .event-swiper .event-item{
    /*width: fit-content !important;*/
}
#event .event-swiper .event-item .item-title{
    font-size: 20px;
    color: #050000;
    margin: 40px 0 20px;
}
.inn2{
    height: 630px;
}
.inn .inn-wrap{
    display: flex;
    height: 100%;
    margin-top: 210px;
    justify-content: flex-end;
}
.inn .inn-wrap .inn-left{
    width: 430px;
    height: 100%;
    background: #030dad;
}
.inn .inn-wrap .inn-left .left-wrap{
    display: flex;
    align-items: center;
    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%);
    gap: 70px;
}
.inn .inn-wrap .inn-left .inn-page{
    display: flex;
    color: #fff;
    align-items: center;
    gap: 10px;
}
.inn .inn-wrap .inn-left .inn-btn{
    display: flex;
    gap: 40px;
    color: #fff;
    align-items: center;
}
.inn .inn-wrap .inn-left .inn-btn div{
    cursor: pointer;
}
.inn .inn-wrap .inn-left .inn-btn p{
    font-size: 12px;
}
.inn .inn-wrap .inn-left .inn-page > p{
    opacity: .5;
}
.inn .inn-wrap .inn-left .inn-page > p.on{
    opacity: 1;
}
.inn .inn-wrap .inn-right{
    width: 1114px;
    height: 100%;
    background: #f0f4fa;
    padding: 80px 0 0 189px;
    box-sizing: border-box;
}
.color33{color: #333}
.inn .inn-wrap .inn-right .zz{
    font-weight: bold;
    margin: 50px 0 10px;
}
.inn .inn-wrap .inn-right .des{
    width: 705px;
    line-height: 28px;
}
.inn .inn-wrap .inn-right .des.en-dsc{
    width: 805px;
}
.inn .inn-swiper{
    position: absolute;
    top: -90px;
    left: 0;
    z-index: 9;
}
#fz{
    background: url("../images/fz.jpg") center center / cover no-repeat;
    height: 700px;
    width: 100%;
    margin-top: 80px;
    color: #fff;
    text-align: center;
    padding-top: 200px;
    box-sizing: border-box;
}
#fz .font34{
    margin: 10px 0 40px;
}
#fz .des p{line-height: 28px;text-align: center}

.rd{
    background: #0060af;
    border-bottom-left-radius: 25px;
    border-bottom-right-radius: 25px;
    height: auto;
    display: flex;
    justify-content: space-between;
    color: #fff;
    padding: 70px 90px 60px;
    box-sizing: border-box;
}
.rd .rd-left .font34{
    margin: 10px 0 0 0;
}
.rd .rd-left .pt-list{
    display: flex;
    margin-top: 80px;
    gap: 20px;
}
.rd .rd-left .pt-list li {
    font-size: 14px;
    text-align: center;
    width: 91px;
    height: 91px;
    border-radius: 50%;
    transition: .5s;
    line-height: 91px;
}
.mainNews-swiper{width: 100%;  margin: 0 0 75px;}
.rd .rd-left .pt-list li:nth-child(1){background: #034175}
.rd .rd-left .pt-list li:nth-child(2){background: #035394}
.rd .rd-left .pt-list li:nth-child(3){background: #076cc0}
.rd .rd-left .pt-list li:hover{background: #030dad}
.rd .rd-left .pt-list li:nth-child(3):hover{background: #034175}
.rd .rd-right{
    width: 717px;
}
.rd .rd-right .rd-item{
    border-bottom: 1px solid rgba(255, 255, 255, .4);
    padding-bottom: 40px;
    margin-bottom: 50px;
}
.rd .rd-right .rd-item .item-title{
    font-size: 18px;
    font-weight: lighter;
}
.rd .rd-right .rd-item .item-des{
    font-size: 22px;
    line-height: 30px;
    margin-top: 10px;
}
#platform{
    margin-top: 180px;
}
#platform .w80{
    display: flex;
    justify-content: space-between;
}
#platform .w80 .plat-right{
    width: 923px;
}
#platform .w80 .plat-right li{
    display: flex;
    border-top: 1px solid #d9d9d9;
    justify-content: space-between;
    align-items: center;
    height: 250px;
    padding-left: 20px;
    /*background: linear-gradient(to right, #030dad, #030dad) left bottom no-repeat;*/
    /*background-size: 0 1px;*/
    transition: .5s;
    position: relative;
}
#platform .w80 .plat-right li::after{
    content: '';
    position: absolute;
    bottom: -1px; /* 对齐边框 */
    left: 0;
    width: 0;
    height: 1px;
    background: #030dad;
    transition: width .8s;
    z-index: 989;
}
#platform .w80 .plat-right li:hover::after {
    width: 100%;
}
#platform .w80 .plat-right li:last-child{
    border-bottom: 1px solid #d9d9d9;
}
#platform .w80 .plat-right li:hover{
    background-size: 100% 1px;
}
#platform .w80 .plat-right li .title{
    font-weight: bold;
    font-size: 22px;
    margin-bottom: 20px;
}
#platform .w80 .plat-right li .summary{
    line-height: 28px;
}
#platform .w80 .plat-right li .num{
    font-size: 54px;
    font-weight: bold;
}
#platform .w80 .plat-right li .text{
    width: 76%;
}
#goal{margin: 120px 0 0}
#goal .w80{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#goal .w80 .des{
    font-size: 34px;
    line-height: 56px;
    font-weight: lighter;
    margin: 40px 0;
}
#goal.en-goal .w80 .des{
    font-size: 24px;
    line-height: 30px;
}
#goal .w80 .text-list li{
    display: flex;
    gap: 10px;
    font-size: 16px;
    line-height: 30px;
}
#strategy .strategy-right .text-list.en-list li{
    align-items: flex-start;
}
#strategy .strategy-right .text-list.en-list li .icon img{margin-top: 8px}
#mean{
    color: #fff;
    background:#1165b5;
    width: 100%;
    padding: 80px 0 130px 190px;
    display: flex;
    gap: 260px;
}
#mean .mean-left{
    white-space: nowrap;
}
#mean  .mean-btn{
    display: flex;
    gap: 30px;
    margin-top: 60px;
}
#mean .mean-btn div{cursor: pointer}
#mean .mean-btn div:hover{
    transform: translateY(-5px);
}
#mean .mean-swiper .mean-item .num{
    font-size: 54px;
}
#mean .mean-swiper .mean-item .title{
    font-size: 22px;
    font-weight: bold;
    margin: 20px 0;
}
#mean .mean-swiper .mean-item{
    width: 356px !important;
}
#mean .mean-swiper .mean-item .summary{
    line-height: 28px;
    opacity: .8;
}
#mean .mean-line{
    height: 6px;
    background: linear-gradient(to right, #1769b7, #347bbf);
    position: absolute;
    bottom: 50px;
    left: 577px;
    width: 1325px;
}
#cooperation{
    margin: 140px 0 125px;
}
#cooperation .w80 > p {text-align: center}
#cooperation .w80 > .content{
    margin: 30px 0 80px;
}
#cooperation .w80 > .content p{
    line-height: 27px;
    text-align: center;
    width: 1070px;
    margin: 0 auto;
}
#cooperation .img .next{
    position: absolute;
    opacity: 0;
    transition: opacity .3s;
}
#cooperation .img .next.on{
    opacity:1
}
#cooperation .img .hz-list{
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 1300px;
    display: flex;
    justify-content: space-between;
}
#cooperation .img .hz-list li{
    width: 365px;
    color: #fff;
    cursor: pointer;
}
#cooperation .img .hz-list li .hz-line{
    width: 100%;
    height: 1px;
    background: #9ebcd8;
}
#cooperation .img .hz-list li .hz-name{
    opacity: .4;
    font-size: 22px;
    font-weight: bold;
    margin-top: 10px;
    transition: .5s;
}
#cooperation .img .hz-list li .active{
    margin-bottom: 30px;
    opacity: 0;
    transition: .5s;
}
#cooperation .img .hz-list li.on .active{
    opacity: 1;
}
#cooperation .img .hz-list li.on .hz-name{
    opacity: 0;
}
#cooperation .img .hz-list li .active .des{
    line-height: 24px;
}
#cooperation .img .hz-list li .active .ac-name{
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 10px;
}
#cooperation .img .hz-list li.on .white-line{
    animation: line 5s ease-in-out;
}
#cooperation .img{
    cursor: url('../images/next-btn.png') 50 38, auto;
}
.white-line{
    position: absolute;
    top: 0;
    left: 0;
    height: 1px;
    background: #fff;
    width: 0;
}
@keyframes line {
    from{
        width: 0;
    }
    to{width: 100%}
}

#cooperation .img .hz-next{
    width: 93px;
    height: 93px;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    line-height: 93px;
    background: #008ee6;
    border-radius: 50%;
    position: absolute;
    bottom: 140px;
    right: 40px;
    transition: .5s;
    color: #fff;
    cursor: pointer;
}
#cooperation .img .hz-next:hover{
    background: #172390;
}
#laboratory{
    height: 100vh;
    width: 100%;
    overflow: hidden;
}
#laboratory .lab-bottom{
    width: 650px;
    height: 650px;
    border-radius: 50%;
    position: absolute;
    bottom: -325px;
    left: 50%;
    transform: translateX(-50%);
    border: 1px solid rgba(164, 164, 164, .6);
    z-index: 99;
}
#laboratory .lab-bottom .text{
    width: 550px;
    height: 550px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #1e528a;
    color: #fff;
    text-align: center;
    padding-top: 140px;
    box-sizing: border-box;
}
#laboratory .lab-bottom .lab-img{
    position: absolute;
    background: rgba(0, 0, 0, .6);
    width: 69px;
    height: 69px;
    border-radius: 50px;
    line-height: 69px;
    cursor: pointer;
    transition: .3s;
}
#laboratory .lab-bottom .lab-img img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#laboratory .lab-bottom .left{
    top: 10%;
    left: 11%;
}
#laboratory .lab-bottom .center{
    top: -38px;
    left: 47%;
    transform: translateX(-50%);
}
#laboratory .lab-bottom .right{
    top: 10%;
    right: 11%;
}
#laboratory .lab-bottom .lab-img:hover{
    background: #1165b5;
}
#laboratory .lab-bottom .lab-img.on{
    background: #1165b5;
}
#laboratory .lab-swiper{
    margin-top: 300px;
    overflow: visible !important;
}
#laboratory .lab-swiper .lab-item{
    width: 550px !important;
    height: 220px;
    opacity: .2;
    background: #fff;
    padding: 70px 0 0 40px;
    border-radius: 20px;
    transition: .5s;
}
#laboratory .lab-swiper .lab-item:nth-child(2){
    width: 616px !important;
}
#laboratory .lab-swiper .lab-item.swiper-slide-active{
    opacity: 0.74;
    transform: translateY(-170px);
}
#laboratory .lab-swiper .lab-item .item-title{
    font-size: 22px;
    font-weight: bold;
}
#laboratory .lab-swiper .lab-item .des{
    font-size: 13.5px;
    line-height: 23px;
    transition: .3s;
    margin-top: 20px;
}
#laboratory .lab-swiper .lab-item .des span{
    color: #333;
}
#laboratory .lab-swiper .lab-item.swiper-slide-active .des{
    font-size: 16px;
}
#laboratory .lab-btn{
    display: flex;
    width: 845px;
    justify-content: space-between;
    position: absolute;
    top: 250px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99;
}
#laboratory .lab-btn div{
    cursor: pointer;
    transition: .3s;
}
#laboratory .lab-btn div:hover{
    transform: translateY(-5px);
}
.wr3{
    background: url("../images/pt-bg.jpg") top center / cover no-repeat;
    height: auto;
    width: 100%;
    padding: 0.1px 0.1px 50px;
}
.wr3 .text{
    font-weight: lighter;
    font-size: 36px;
    line-height: 54px;
    text-align: center;
    margin-top: 60px;
    color: #fff;
}
.wr3 .boll{
    width: 588px;
    height: 588px;
    border-radius: 50%;
    border: 3px solid rgba(94, 96, 97, .4);
    border-top: 3px solid #207cec;
    margin: 50px auto 0;
    animation: spin 5s linear infinite;
    overflow: hidden;
}
@keyframes spin {
    0% { transform: rotate(0deg); } /* 动画开始时，旋转角度为 0 度 */
    100% { transform: rotate(360deg); } /* 动画结束时，旋转角度为 360 度 */
}
.wr3 .boll-wrap img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: .3s;
}
.wr3 .boll-wrap img:hover{
    transform: translate(-50%, -50%) scale(1.05);
}
.wr-svg{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow: visible;

}
.wr-svg .progress{
    animation: rotateCycle 5000ms linear both;
    transition: revert;
}
#product{
    display: flex;
    width: 100%;
}
#product .product-left{
    width: 50.13%;
}
#product .product-left img{width: 100%;height: auto}
#product .product-right{
    padding: 115px 0 0 75px;
    width: 49.87%;
}
#product .product-right.en-r{
    padding: 20px 0 0 75px;
}
#product .product-right .des-list{
    margin-top: 80px;
}
#product .product-right .des-list li{
    display: flex;
    gap: 28px;
    width: 686px;
    margin-bottom: 40px;
}
#product .product-right .des-list li .num{
    width: 77px;
    height: 61px;
    line-height: 61px;
    text-align: center;
    background: linear-gradient(to right, #172390, #0165b5);
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    color: #fff;
    font-size: 28px;
}
#product .product-right .des-list li .text{flex: 1}
#product .product-right .des-list li .title{
    font-size: 28px;
}
#product .product-right .des-list li .summary{
    line-height: 26px;
    margin-top: 10px;
}

#center{
    height: 100vh;
    width: 100%;
    color: #fff;
    padding-top: 140px;
}
#center .center-wrap{
    display: flex;
    gap: 60px;
    margin-top: 40px;
}
#center .center-wrap .center-swiper{
    width: 100%;
    margin-left: 0;
}
#center .center-wrap .center-swiper .wrap-item{
    width: 453px;
    cursor: grab;
}
#center .center-wrap .text-item {
    display: none;
    height: 150px;
}
#center .center-wrap .text-item.on{
    display: block;
}
#center .center-wrap .text-item .title{
    font-weight: bold;
    font-size: 28px;
}
#center .center-wrap .text-item .summary{
    line-height: 28px;
    margin-top: 30px;
}
#center .center-wrap .left-wrap{width: 51.15%}
#center .center-wrap .right-wrap{
    padding: 0px 70px 0 0;
    width: calc(48.85% - 60px);
}
#center .center-wrap .selects{
    background: rgba(0, 0, 0, 0.12);
    display: flex;
    margin-top: 202px;
    width: 100%;
}
#center .center-wrap .selects li{
    width: 25%;
    height: 169px;
    border-radius: 6px;
    transition: .5s;
    cursor: pointer;
}
#center .center-wrap .selects li.on{
    background: linear-gradient(to right, #172390, #0165b5);
}
#center .center-wrap .selects li:hover{
    background: linear-gradient(to right, #172390, #0165b5);
}
#center .center-wrap .selects li .select-item{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    text-align: center;

}
#center .center-wrap .selects li .select-title{
    line-height: 40px;
}
#technology{
    padding: 110px 0;
}
#technology .technology-wrap{
    width: 83.7%;
    margin: 0 auto;
}
#technology .technology-wrap > p{
    text-align: center;
}
#technology .technology-wrap .tech-content{
    display: flex;
    margin-top: 78px;
    gap: 80px;
}
#technology .technology-wrap .tech-content .tech-left{
    width: 830px;
}
#technology .technology-wrap .tech-content .tech-left li{
    display: flex;
    border-bottom: 1px solid #d9d9d9;
    padding: 40px 0;
    align-items: center;
    gap: 70px;
    transition: .5s;
    position: relative;
}
#technology .technology-wrap .tech-content .tech-left li::after{
     content: '';
    position: absolute;
    bottom: -1px; /* 对齐边框 */
    left: 0;
    width: 0;
    height: 1px;
    background: #030dad;
    transition:  .5s;
}
#technology .technology-wrap .tech-content .tech-left li:hover::after{
    width: 100%;
}
#technology .technology-wrap .tech-content .tech-left li:first-child{
    border-top: 1px solid #d9d9d9;
}
#technology .technology-wrap .tech-content .tech-left li:hover{
    background-size: 100% 1px;
}
#technology .technology-wrap .tech-content .tech-left li .num{
    font-size: 54px;
}
#technology .technology-wrap .tech-content .tech-left li .text{
    width: 73.3%;
}
#technology .technology-wrap .tech-content .tech-left li .text .title{
    font-size: 22px;
}
#technology .technology-wrap .tech-content .tech-left li .text .summary{
    line-height: 26px;
    margin-top: 20px;
}
#technology .technology-wrap .tech-content .tech-right{
    display: flex;
    gap: 10px;
}
#technology .technology-wrap .tech-content .tech-right .img{
    margin-bottom: 5px;
    overflow: hidden;
}
#technology .technology-wrap .tech-content .tech-right .img img{
    transition: .3s;
}
#technology .technology-wrap .tech-content .tech-right .img img:hover{
    transform: scale(1.15);
}
#technology .technology-wrap .tech-content .tech-right .right-img{
    height: 510px;
}
#talent{
    height: 855px;
    padding-top: 110px;
    box-sizing: border-box;
}
#talent > p{
    text-align: center;
}
#talent .jr{
    width: 81.5%;
    height: 390px;
    border-radius: 195px;
    background: linear-gradient(to right, rgba(205, 228, 255, .4),  rgba(231, 240, 253, .4),  rgba(204, 229, 255, .4));
    margin: 70px auto 0;
    padding: 30px;
}
.jr-bor{
    width: 100%;
    height: 100%;
    border-radius: 195px;
    border: 3px dotted  #1165b5;
}
#talent .jr .jr-bor .jr-list{
    display: flex;
    align-items: center;
    gap: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 97%;
}
#talent .jr .jr-bor .jr-list .dotted{
    width: 240px;
    height: 240px;
    border-radius: 50%;
    border: 3px dotted  #1165b5;
    background: #fff;
    transition: .5s;
}
#talent .jr .jr-bor .jr-list .dotted .dotted-item{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}
#talent .jr .jr-bor .jr-list .dotted .dotted-item .w{
    display: none;
}
#talent .jr .jr-bor .jr-list .dotted .dotted-item img{
    display: block;
    margin: 0 auto;
}
#talent .jr .jr-bor .jr-list .dotted p {
    text-align: center;
    color: #333;
    font-size: 18px;
    line-height: 26px;
    margin-top: 20px;
    transition: .5s;
}
#talent .jr .jr-bor .jr-list.en-jr .dotted p{
    font-size: 14px;
}
#talent .jr .jr-bor .jr-list .line{
    width: 17.93%;
    flex: 1;
    border-top: 3px dotted  #1165b5;
}
#talent .jr .jr-bor .jr-list .dotted:hover{
    background: linear-gradient(to right, #112b95, #1165b5);
    border-style: solid;
}
#talent .jr .jr-bor .jr-list .dotted:hover .w{
    display: block;
}
#talent .jr .jr-bor .jr-list .dotted:hover .b{
    display: none;
}
#talent .jr .jr-bor .jr-list .dotted:hover p{
    color: #fff;
}
#facility > div{
    width: 100%;
    height: 450px;
}
#facility .white-block{
    padding-top: 50px;
    box-sizing: border-box;
    background: #fff;
}
#facility .white-block > p{
    text-align: center;
}
#facility .blue-block{
    background: #175cb0;
    padding-top: 280px;
    box-sizing: border-box;
}
#facility .blue-block .fac-list{
    display: flex;
    justify-content: center;
    gap: 130px;
}
#facility .blue-block .fac-list li{
    display: flex;
    color: #fff;
    gap: 20px;
    align-items: center;
}
#facility .blue-block .fac-list li .title{
    font-weight: bold;
    font-size: 22px;
    margin-bottom: 10px;
}
#facility .swiper-wrap{
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}
#facility .fac-swiper{
    width: 89.4%;
    margin-right: 0;
}
#facility .fac-swiper .fac-item{
    width: fit-content;
    cursor: grab;
}
#patent{
    margin: 150px 0;
}
#patent .font34{
    line-height: 44px;
    margin-top: 80px;
    border-bottom: 1px solid #d7d7d9;
    padding-bottom: 20px;
}
#patent .patent-list{
    display: flex;
    flex-wrap: wrap;
    margin-top: 60px;
}
#patent .patent-list li{
    overflow: hidden;
    border: 1px solid #d7d7d9;
    width: 15%;
    padding: 5px;
    box-sizing:border-box;
    margin-bottom: 70px;
    margin-right: 6%;
}
#patent .patent-list li.on{
    margin-right:0;
}
#patent .patent-list li img{
    /*position: absolute;*/
    /*top: 50%;*/
    /*left: 50%;*/
    /*transform: translate(-50%, -50%);*/
    transition: .3s;
    width:100%;
    height: auto;
}
#patent .patent-list li img:hover{
    transform: scale(1.05);
}
#patent .page{
    margin-top: 60px;
    justify-content: center;
    gap: 30px;
}
#patent .page div{
    font-size: 18px;
    transition: .5s;
    width: 60px;
    height: 84px;
    color: #bfbfbf;
    text-align: center;
    line-height: 84px;
    cursor: pointer;
}
#patent .page .left{
    background: url("../images/news-prev.png") no-repeat;
}
#patent .page .right{
    background: url("../images/news-next.png") no-repeat;
}
#patent .page div:hover{
    transform: translateY(-5px);
}
#patent .page div *{
    height: 100%;
    width: 100%;
    display: block;
}
.footer .footer-wrap{
    height: 100%;
    padding-top: 90px;
}
.wrap2 .appli-list a{color: #fff}
.last{
    color: #999 !important;
}
.mob-header{display: none;box-shadow: 5px 0px 15px rgba(0, 0, 0, 0.2)}
.mb-nav-btn{
    display: flex;
    gap: 10px;
    align-items: center;
    position: relative;
}
.mb-line div{
    width: 31px;
    height: 2px;
    background: #666;
    margin-bottom: 10px;
    transition: .5s;
}
.mb-line.on .center-line{
    opacity: 0;
}
.mb-line.on .top-line{
    transform: rotate(-45deg) translateY(0px);
    transform-origin: right bottom;
}
.mb-line.on .b-line{
    transform: rotate(43deg) translateY(-1px);
    transform-origin: right top;
}
.mb-nav{
    height: 0;
    width: 100%;
    background: #fff;
    transition: .5s;
    overflow: hidden;
    position: fixed;
    top: 96px;
    left: 0;
    z-index: 999999;
}
.mb-nav{padding: 0 50px;box-sizing: border-box;}
.mb-nav-item {
    border-bottom: 1px solid #333;
    overflow: hidden;
    height: 152px;
    transition: .5s;
}
.mb-nav-item .mb-nav1{
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: .5s;
}
.mb-nav-item.on{
    height: 450px;
}
.mb-nav-item .img img{transition: .5s}
.mb-nav-item.on .img img{
    transform: rotate(90deg);
}
.mb-nav .mb-nav-item .mb-nav1 > a{
    color: #333;
    font-size: 34px;
    height: 152px;
    line-height: 152px;
}
.mb-nav.on{
    height: 100vh;
    overflow: auto;
}
.mb-nav .mb-nav-item .mb-nav2 .nav2-item{line-height: 60px}
.mb-nav .mb-nav-item .mb-nav2 .nav2-item a{font-size: 24px;color: #666}

.event-item .img{
    overflow: hidden;
}
.event-item .img img{
    transition: .3s;
}
.event-item .img img:hover{transform: scale(1.05)}

.progress{
    width: 588px;
    height: 588px;
    position: relative;
    box-sizing: border-box;
    margin: 30px auto 0;
}
.prog:before{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    /*border: 1px solid rgba(255, 255, 255, .5);*/
    border-radius: 100%;
    content: "";
}
.progress .progress-left{
    left: 0;
}
.progress .progress-right{
    right: 0;
}
.progress > span{
    position: absolute;
    top: 0;
    width: 50%;
    height: 100%;
    z-index: 1;
    overflow: hidden;
}
.progress .progress-left .progress-bar{
    left: 100%;
    border-top-right-radius: 588px;
    border-bottom-right-radius: 588px;
    border-left: 0;
    -webkit-transform-origin: center left;
    transform-origin: center left;
}
.progress .progress-bar{
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    border: 2px solid #030dad;
    box-sizing: border-box;
}
.progress .progress-right .progress-bar{
    left: -100%;
    border-top-left-radius: 588px;
    border-bottom-left-radius: 588px;
    border-right: 0;
    -webkit-transform-origin: center right;
    transform-origin: center right;

}
.progress.on .progress-right .progress-bar{
    animation: loading-1 2.5s linear forwards;
}
.progress.on .progress-left .progress-bar {
    animation: loading-2 2.5s linear forwards 2.5s;
}
@keyframes loading-2 {
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}
@keyframes loading-1 {
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}
.staff{
    margin-top: -212px;
}
.staff .ceo{
    width: 100%;
    height: 652px;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: center;
    gap: 65px;
    align-items: center;
}
.staff .ceo .img{
    border-radius: 20px;
}
.staff .ceo .img,
.staff .staff-list li .pic{overflow: hidden}
.staff .ceo .img img,
.staff .staff-list li .pic img{transition: .5s;display: block}
.staff .ceo .staff-info{
    width: 39.93%;
    color: #333;
}
.staff .ceo .staff-info .name{
    font-size: 42px;
    font-weight: lighter;
}
.staff .ceo .staff-info .posi{
    font-weight: bold;
    font-size: 22px;
    border-bottom: 1px solid #d9d9d9;
    background: linear-gradient(to right, #1365b5, #1365b5) left bottom no-repeat;
    background-size:  0 1px;
    transition: .5s;
    margin-top: 20px;
    padding-bottom: 15px;
    border-radius: 0;
}

.staff .ceo .staff-info .posi span{
    color: #1365b5;
}
.staff .ceo .staff-info .staff-content{
    line-height: 28px;
    margin-top: 20px;
    color: #666;
}
.staff .ceo:hover .staff-info .posi{
    background-size: 100% 1px;
}
.staff .ceo:hover img{
    transform: scale(1.05);
}
.staff .staff-list{
    display: flex;
    justify-content: space-between;
    margin-top: 70px;
}
.staff .staff-list li{
    width: 260px;
    height: 373px;
    border: 1px solid #d9d9d9;
    padding: 13px 0 0 13px;
    box-sizing: border-box;
    transition: .5s;
}
.staff .staff-swiper{
    display: none;
    margin-top: 40px;
}
.staff .staff-swiper .staff-item{
    width: auto !important;
    border: 1px solid #d9d9d9;
    box-sizing: border-box;
    padding: 10px;
}
.staff .staff-list li p,
.staff .staff-swiper .staff-item p{
    text-align: center;
}
.staff .staff-list li .name,
.staff .staff-swiper .staff-item .name{
    font-weight: bold;
    font-size: 22px;
    color: #333;
    margin: 15px 0 5px;
}
.staff .staff-list li .posi,
.staff .staff-swiper .staff-item .posi{
    color: #666;
    font-size: 14px;
}
.staff .staff-list li:hover{
    border-color: #1365b5;
}
.staff .staff-list li:hover .pic img{
    transform: scale(1.05);
}
.staff .staff-list li .pic{width: fit-content}
.center-box .detali-btn{
    width: 218px;
    height: 61px;
    color: #fff;
    background: linear-gradient(to right, #172390, #0165b5);
    font-size: 20px;
    line-height: 61px;
    text-align: center;
    display: block;
    margin: 40px auto;
    border-radius: 15px 0 15px 0;
    transition: .3s;
}
.center-box .detali-btn:hover{
    background: linear-gradient(to right, #0165b5, #0165b5);
}
.detali-content{
    background: #fff;
    padding: 75px 0 60px 65px;
    margin-top: 53px;

}
.detali-content .title{
    font-size: 34px;
    font-weight: lighter;
    margin-top: 35px;
    padding-bottom: 30px;
    border-bottom: 1px solid #d2d5d9;
}
.detali-content .content{
    width: 87.46%;
    margin: 50px 0 0 0;
    justify-content: space-between;
}
.detali-content .content p{
    line-height: 28px;
    justify-content: space-between;
    color: #333;
}
.back{
    width: 218px;
    height: 61px;
    color: #fff;
    background: linear-gradient(to right, #172390, #0165b5);
    font-size: 20px;
    line-height: 61px;
    text-align: center;
    display: block;
    margin: 60px 0 0 0;
    border-radius: 15px 0 15px 0;
    transition: .3s;
}
.back:hover{
    background: linear-gradient(to right, #0165b5, #0165b5);
}
.read-wrap{
    margin-top: 80px;
    padding-bottom: 40px;
}
.read-wrap .title{
    font-size: 28px;
    color: #333;
}
.read-wrap .dsc{
    margin-top: 20px;
}
.read-wrap .dsc p{
    font-size: 18px;
    line-height: 30px;
    color: #666;
}
.radius{
border-radius: 25px;
}
.layui-laypage .layui-laypage-spr{
    width: 58px;
    height: 58px;
    border-radius: 50%;
    padding: 0;
    line-height: 58px;
    margin: 0 15px 0 0;
}
.footer .bottom .apps .wx {
    position: relative;
}
.footer .bottom .apps .wx .code{
    width: 120px;
    height: 120px;
    line-height: 120px;
    position: absolute;
    left: 50%;
    top: -128px;
    transform: translateX(-50%);
    border-radius: 5px;
    background: rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: .3s;
}
.footer .bottom .apps .wx.show .code{opacity: 1;}
.footer .bottom .apps .wx .code img {
    width: 75%;
    height: auto;
}
.footer .bottom .apps .wx .code .code-jt{
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid rgba(0, 0, 0, 0.3);
    margin: 0 auto;
}

#speech{
    margin: 90px 0 60px;
}
#speech .font34{
    color: #333;
}
.speech-box{
    display: flex;
    margin-top: 35px;
}
.speech-box .img{
    width: 46.44%;
    margin-right: 80px;
    border-radius: 19px;
    overflow: hidden;
}
.speech-box .img img{
    display: block;
    width: 100%;
    height: auto;
    transition: .5s;
}
.speech-box .text{
    width: 39.93%;

}
.speech-box .text .name{
    font-size: 42px;
    color: #333;
    margin-bottom: 10px;

}
.speech-box .text .ther{
    font-size: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid #d9d9d9;
    transition: .5s;
    position: relative;
}
.speech-box .text .ther::after{
    content: '';
    position: absolute;
    bottom: -1px; /* 对齐边框 */
    left: 0;
    width: 0;
    height: 1px;
    background: #206db7;
    transition: width .8s;
}
.speech-box .text .ther:hover::after{
      width: 100%;
}
.speech-box .text .cont{
    margin-top: 40px;
}
.speech-box .text .cont p{
    color: #666;
    line-height: 28px;
}
.speech-box:hover .img img{
    transform: scale(1.1);
}
.speech-box:hover .ther{
    background-size: 100% 1px;
}
#manage{
    background: #f1f6f9;
    padding: 95px 0 70px;
    width: 100%;
}
#manage .man-top{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#manage .man-top .slogn p{
    font-size: 36px;
    line-height: 45px;
    color: #333;
    font-weight: lighter;

}
#manage .dsc{
    color: #333;
    font-weight: lighter;
    text-align: right;
    margin-top: 30px;
}
#manage .man-nav{
    display: flex;
    margin-top: 60px;
}
#manage .man-nav li{
    color: #999;
    margin-right: 50px;
    cursor: pointer;
    padding-bottom: 10px;
    transition: .5s;
}
#manage .man-nav li.on{
    color: #004ea2;
    border-bottom: 1px solid #004ea2;
}
#manage .man-swiper{
    margin-top: 18px;
    display: none;
}
#manage .man-swiper.on{
    display: block;
}
#manage .man-swiper .man-item{
    background: #fff;
    border: 1px solid #d9d9d9;
    padding: 13px;
    width: 15.37% !important;
}
#manage .man-swiper .man-item .img{
    width: 100%;
}
#manage .man-swiper .man-item .img img{
    display: block;
    object-position: center;
    object-fit: cover;
    width: 100%;
    height: 314px;
    max-height: 314px;
}
.reai-img{
    position: relative;
}
.reai-img .reai-tit{
    font-size: 36px;
    font-weight: lighter;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
}
.reai-box{
    background: #fff;
    margin-top: -185px;
    position: relative;
    z-index: 9;
    padding-top: 60px;
}
.reai-box .no .no-tit{
    font-size: 25px;
    color: #333;
    text-align: center;
}
.reai-box .no{
    margin-bottom: 50px;
}
.reai-box .no p{
    line-height: 30px;
    text-align: center;
    margin: 20px auto 0;
    width: 67.1%;
}
.reai-box .no p.lastp{
    margin-top: 0;
}
.reai-box .no .no-tit i{
    color: #004ea2;
}
.reai-box .zw-swiper{
    padding: 0 50px 105px;
    box-sizing: border-box;
}
.reai-box .zw-swiper .zw-item{
    width: 30.784%;
}
.reai-box .zw-swiper .zw-item img{
    width: 100%;
    height: auto;
}
#manage .man-swiper .man-item .man-text{
    margin-top: 20px;
}
#manage .man-swiper .man-item .man-text p{
    text-align: center;
}
#manage .man-swiper .man-item .man-text .tit{
    font-size: 22px;
    color: #333;
}
#manage .man-swiper .man-item .man-text .sum {
    font-size: 14px;
    color: #666;
}
#story2 > p{
    text-align: center;
}
#story2 > .font34{
    font-size: 36px;
    color: #333;
}
.story2-box{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 50px 0 30px;
     background: url('../images/store-bg.png') no-repeat right top;
}
.story2-box .img{
    width: 49.355%;
       max-height: 424px;
       overflow: hidden;
}
.story2-box .img img {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
}
.story2-box .text{
    width: 45.38%;

}
.story2-box .text .tit{
    font-size: 25px;
    line-height: 35px;
    color: #333;
}
.story2-box .text .cont{
    margin-top: 40px;
}
.story2-box .text .cont p {
    line-height: 30px;
}
.story2-swiper .st-item{
    /*width: 22.138%;*/
    width: 340px;
    margin-bottom: 90px;
}
.story2-swiper .st-item img{
   width: 100%;
   height: 227px;
}
.en-str .w88 * {font-size: 9px !important;}
.en-str.w88 .positions .pment .pment-item p,.en-str .pment2 .pment-item p, .pment3 .pment-item p{
    width: 120px !important;
}
.lang-wrap{
    overflow: hidden;
    background: #fff;
    height: 0;
    transition: .5s;
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
    /*padding: 10px 20px;*/

}

.lang-wrap p {
    color: #666;
    padding: 10px 30px;
    cursor: pointer;
}
.md-lang-wrap.on{
    height: 118px;
}
.nav-list.big5-nav{display: none}
.layui-layer-ico{
    background: url("https://www.zhbs.net/js/layer/skin/default/icon.png") no-repeat;
}
@media screen and (max-width: 1880px){
    .product-info-button .product-info-main-button .right-part{
        width: 71.8%;
    }
}
@media screen and (max-width: 1850px){
    .product-info-button .product-info-main-button .right-part{width: 72.2%}
    .inn .inn-wrap .inn-right{
        width: 58%;}
    .inn-swiper img{width: 820px;height: 550px;object-fit: cover;object-position: center}
    .inn .inn-wrap .inn-right{padding: 80px 20px 0 220px}
    #cooperation .img > img.toBlock{width: 100%;height: auto}
    #cooperation .img .hz-list li{
        width: 32%;}
    #cooperation .img .hz-list{width: 90%}
    #cooperation .img .next{display: none}
    .right-form .form .bm{
        width: 46%;
    }
}
@media screen and (max-width: 1800px){
    .product-info-button .product-info-main-button .right-part{width: 73.5%}

    .strategy-wrap .strategy-left img,
    .green-left > img{
        width: 550px;
    }
}
@media screen and (max-width: 1740px){
    .honor-wrap{width: 84.44%}
    .history-swiper .history-item:hover .right-content .history-content .img{width: 250px}
    .history-swiper .history-item .right-content .history-content .img{width: 220px}
    .product-info-button .product-info-main-button .right-part{width: 75%}
    .news .news-list .news-swiper .swiper-wrapper .new-item{width: 23%}
    .page .page-list > li .page-item{width: 300px}
    #goal .w80 .des{font-size: 28px;line-height: 38px;}
    .inn .inn-wrap .inn-right .des{width: auto}
    .staff{margin-top: -120px}
    .center .circle-put .circle-4{
        width: 480px;
        height: 480px;
    }
    #contact .map .map-mask{display: none}
    #contact .map{width: 85%}
    #contact .map{text-align: center}
    .strategy-wrap .strategy-left img{width: 100%;height: 100%;object-fit: cover;object-position: center}
    .strategy-wrap .strategy-left img,
    .green-left > img{
        width: 550px;
    }
        .inside-banner .en-title p{font-size: 85px;}
    #fz .des p{font-size: 14px;}
  /*  .green-left{width: 45%}
    .green-left img{width: 100%;height: auto}*/
}
@media screen and (max-width: 1650px){
    .clip .about-video{height: 910px}
    .green .green-wrap .green-right .title{font-size: 28px;letter-spacing: 3px}
    #strategy .strategy-right .right-title.en-tit, .green.en .green-wrap .green-right .title{font-size: 28px;letter-spacing: 3px}
    #honor .honor-btn{margin-top: 0px;}
    .news-main .right-main .normal-show .left-part .cntitle{font-size: 18px;}
    #event .event-swiper .event-item .item-title{font-size: 18px;}
    #factory .position-2{
        transform: scale(0.7) !important;
    }
    .subsidiary .show-main .mask{height: 80%;}
     #product .product-right{padding: 80px 30px 0 40px}
    #product .product-right .des-list li .title{font-size: 22px}
    #product .product-right .des-list li .summary{font-size: 14px;line-height: 22px}
    #product .product-right .des-list{margin-top: 60px}
    #product .product-right .des-list li .text{padding-right: 20px}
    .appli .appli-right{width: 60%;}
    .appli .appli-lift{width: 40%;}
    .appli .appli-lift img{width: 100%;}
    .appli .appli-right .content p{font-size: 16px; line-height: 24px;}
    .footer .footer-contact{width: 100%}
    .honor-wrap{margin: 68px auto 0;width: 91%;}
    .product-info-button .product-info-main-button .right-part .system-item .item-right,
    .product-info .product-info-main .right-part .system-item .item-right{width: 88%}
    .product-info .product-info-main .right-part .system-item .item-right{flex: 1}
    .product-info .product-info-main .right-part .system-item .item-left{margin-right: 40px}
    .history-swiper .history-item:hover .right-content .history-content .img{width: 180px}
    .history-swiper .history-item .right-content .history-content .img{width: 180px}
    .history-swiper .history-item{height: auto}
    .font66{font-size: 48px}
    .font34{font-size: 28px}
    #history .history-list li .line-left{margin-right: 25px}
    #produce .w80 .produce-left .font34{line-height: 36px;}

}
@media screen and (max-width: 1550px) {
    .speech-box .text{
        width: 44%;
    }
    .story2-box .text .tit{font-size:22px;}
}
/*笔记本 / 1440px 等中等桌面屏 */
@media screen and (max-width: 1480px){
    .header{
        padding: 0 clamp(40px, 4.17vw, 60px);
        align-items: center;
        justify-content: flex-start;
    }
    .header .logo{
        flex-shrink: 0;
        margin-right: clamp(24px, 2.5vw, 40px);
    }
    .header .logo img{
        height: clamp(46px, 4vw, 56px);
        width: auto;
        display: block;
    }
    .header .nav-list{
        flex: 1;
        justify-content: center;
        gap: clamp(32px, 3vw, 52px);
        margin-top: 8px;
        margin-left: 0;
        margin-right: clamp(16px, 1.2vw, 24px);
        padding-right: clamp(12px, 1.5vw, 24px);
    }
    .header .nav-list li{
        width: auto;
        margin: 0;
        flex-shrink: 0;
    }
    .header .nav-list .nav1{
        font-size: clamp(16px, 1.05vw, 18px);
    }
    .header .header-btn{
        margin-left: 0;
        flex-shrink: 0;
    }
    .header-btn .yuyan{
        margin-right: 0;
    }
      .honor-wrap .honor-item{margin-right: 8%;width:10%}
    .story2-box{
        flex-direction: column;
    }
    .story2-box .img{max-height: max-content;}
    .story2-box .text{margin: 20px 0}
    .story2-box .img,
    .story2-box .text {width: 100%}
      #structure{
        overflow-x: scroll;
        overflow-y: hidden;
        padding: 80px 40px 50px;
    }
    #laboratory .lab-swiper{margin-top: 200px}

    .news .news-list .news-swiper .swiper-wrapper .new-item img{
        height: 180px;
        object-fit: cover;
        object-position: center;
    }
    .news .news-list .news-swiper .swiper-wrapper .new-item{height: 400px}
    .news .news-list .news-swiper .swiper-wrapper .new-item .des .text{font-size: 16px;line-height: 22px}
    .wellness .well-list{gap: 40px}
    #strategy .strategy-right .dsc{margin: 40px 0 20px}
    #factory .position-2{display: none}
    .center .depart-info{
        top: 73%;
        left: 79px;
    }
    #goal .w80 .goal-right{width: 45%}
    #goal .w80 .goal-right img{width: 100%;height: auto}
    #contact .title{display: none}
    #contact{height: 900px}
    .center .left-part .entitle{margin: 134px 0 10px}
    .center .depart-info .part .bg-title.font40{font-size: 26px}
    .center .circle-put .circle-4 .show-info::before{
        width: 15px;
        height: 15px;
    }
    .center .circle-put .circle-4 .show-info::after{
        width: 36px;
        height: 36px;
    }
    .inside-banner .en-title p{font-size:100px;}
    .staff .staff-list li{
        width: 208px;
        height: 330px;
    }
    .staff .staff-list li .pic img{
        width: 180px;
        height: auto;
    }
    .staff .ceo{gap: 30px;}
    .staff .ceo .img img{width: 550px;height: auto;}

    .structure .item-list{justify-content: flex-start;flex-wrap: wrap;}
    .structure .item-list li {margin: 0 40px 20px 0;}
    .stock .stock-list .first-item{width: 480px;padding: 0 30px}
    .stock .stock-list li{width: 190px}
    .inn .inn-wrap .inn-right .des{width: auto}
    .inn .inn-wrap .inn-right{padding: 80px 20px 0 189px}

    .esg{padding-top: 80px}
    .esg .esg-list li.on{height: 150px}
    .esg .esg-list{margin-top: 80px}
    .inside-banner .en-title{
        border-bottom: 130px solid #fff;
        /*padding-left: 145px;*/
        width: auto;
        height: 158px;
        font-size: 68px;
    }
    #contact .map{width: 100%}
    #contact .map img{width: 100%;height: auto}
    #contact .contact-list{
        width: 70%;}
    .wrap2 .appli-list{width: 72.5%}
    .wrap3 .case-swiper .case-item{gap: 40px}
    .wrap3 .case-btn li{width: 19%}
    .wrap3 .case-btn li .img > img{width: 100%}
    /*.case-btn-img{width: 100%;height: auto}*/
    .ofito{
        height: 100vh;
        width: 100%;
        background: #fff;
    }
    #strategy .strategy-right .right-title{font-size: 34px}
    #strategy .strategy-wrap,
    .green .green-wrap{gap: 60px}

    .green .green-wrap .green-right .title{font-size: 34px}
    .event-item img{width: 95%;height: auto}
    #event .event-swiper .event-item .item-title{font-size: 18px}
    .event-item .img{box-shadow: none !important;}
    .inn .inn-wrap .inn-right{width: 58%}
    .inn .inn-wrap .inn-left{width: 22.3%}
    .inn .inn-wrap .inn-left .left-wrap{gap: 10%;left: 47%}
    .inn-swiper img{
        width: 720px;
    }
    /*#structure .w88,*/
    /*#structure .w80{display: none}*/


    .rd .rd-right{width: 50.1%}
    #platform .w80 .plat-right{width: 65%}
    #goal .w80 .des{font-size: 26px;line-height: 34px}

    .wr3 .text{margin-top: 80px}
    #product .product-left{
        width: 60%;
    }
    #product .product-left img {
        width: 100%;
        height: auto;
    }
    #center{
        height: auto;
        padding-bottom: 40px;
    }
    #center .center-wrap{
        flex-direction: column;
        align-items: center;
        gap: 0;
    }
    #center .center-wrap .selects{
        margin-top: 20px;
    }
    #technology .technology-wrap .tech-content .tech-right img{
        width: 208px;
        height: auto;
    }
    #patent .patent-list{
        justify-content: center;
    }
    #center .center-wrap{}
    #center .center-wrap .left-wrap,
    #center .center-wrap .right-wrap{width: 79%}
}
@media screen and (max-width: 1300px){
    .wrap3 .case-btn{overflow:hidden}
    .history-swiper .history-item .right-content .history-content,
    .history-swiper .history-item{gap: 15px}
    .page .page-list > li .page-item{width: 240px}
    #contact{height: 800px}
    .banner .swiper-slide{background-size: cover !important}
    .structure .item-box2 .white-box p{
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
    .stock .stock-list .first-item{width: 100%}
    .stock .stock-list{flex-wrap: wrap;justify-content: flex-start}
    .stock .stock-list li .info{font-size: 16px;margin-top: 10px}
    .stock .stock-list li{width: 32%}
    .stock .stock-list .first-item{width: 100%;}
    .stock .stock-list .first-item{flex-direction: column;justify-content: center}
    .stock{height: auto;margin-bottom: 30px}
    .stock .w88{height: auto;}
    .staff{margin-top: 50px}
    .center .depart-info{
        top: 73%;
        left: 79px;
    }
    #technology .technology-wrap .tech-content .tech-left li{gap: 30px}
    #technology .technology-wrap .tech-content .tech-left li .text .summary{font-size: 14px;line-height: 22px}
    #technology .technology-wrap .tech-content .tech-left li .text .title{font-size: 18px}
    #product{flex-direction: column}
    #product .product-left{width: 100%}
    #msg{
        padding-top: 100px;
    }

    .inn .inn-wrap .inn-left{width: 30.3%}
    .inn-swiper img{width: 580px;}
    #msg .msg-wrap{
        flex-direction: column;
        gap: 50px;
    }
}@media screen and (max-width: 1680px){

    #honor{height: 880px}
    #history .history-wrap{
        flex-direction: column;
    }
    #culture .culture-left > .montLight{
        font-size: 130px;
    }
    .banner .banner-title .cn-text{font-size: 56px}
    .news-main .right-main .normal-show .left-part .cntitle{
        font-size: 18px;
        margin: 30px 0 0 0
	}.banner .banner-title .en-text1{font-size: 32px}
.banner .banner-title .en-text2{font-size: 22px}


}
@media screen and (max-width: 1367px){

    #honor{height: 880px}
    #history .history-wrap{
        flex-direction: column;
    }
    #culture .culture-left > .montLight{
        font-size: 130px;
    }
    .banner .banner-title .cn-text{font-size: 56px}
    .news-main .right-main .normal-show .left-part .cntitle{
        font-size: 18px;
        margin: 30px 0 0 0
    }
    .news-main .right-main .normal-show .left-part .tips span{margin: 0 30px 0 0}
    .wrap3 .case-btn{margin-top: 40px}
    .coal .coal-list li{height: 400px}
    .wrap1 .pro-line{display: none}

    #cooperation .img .hz-list li{width: 30%}

}
@media screen and (max-width: 1360px) {
    .speech-box .text .name{
        font-size: 30px;
    }
    .speech-box .text .ther{
        font-size: 20px;
    }
    .header{
        display: none;
    }
    .mob-header{
        background: #fff;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 999999999;
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        padding: 30px 50px;
        box-sizing: border-box;
    }
}
@media screen and (max-width: 1280px) {
    .honor-wrap{height:540px;}
    .wrap1 .wrap1-item .pro-dsc{width:65%}
    .bottom-nav{margin-top: 60px}
    #history .history-list li{width: 34.23%}
    #history .history-list li img{width: 100%}
    #history .history-right{width: 85%}
    .appli .appli-lift,
    .appli .appli-right{width: 100%;}
    .rd .rd-right .rd-item .item-des{font-size: 18px}
    .footer .footer-ls{width: 100%}
    .footer .bottom .apps{justify-content: flex-end}

    .footer-nav{display: none !important}
    .footer .footer-name{justify-content: flex-start}
    .footer-left{
        width: 100%;
        min-width: 0;
    }
    .footer-info-row{
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
    .appli .appli-right{margin-left: 0}
    .appli{flex-direction: column}
    .features .w80{
        flex-direction: column;
    }
    .appli-lift img{
        margin: 0 auto 20px;
    }
    .features .feat-right{width: 100%;margin-top: 30px;}
    .features .feat-btn{margin-top: -50px;justify-content: flex-end}
    .detali-content .title{font-size: 26px}
    #culture .culture-left .culture-list li{font-size: 18px;width: 168px}
    #culture .culture-left > .montLight{font-size: 70px}
    #culture .center-box .center-item .center-title{font-size: 26px;margin: 25px 0 10px}
    #culture .center-box .center-item .center-des{font-size: 14px}
    #history {padding-bottom: 50px}
    .history-swiper .history-item .right-content .history-content .text .title{font-size: 22px}
    .history-swiper .history-item .right-content .history-content .text .dsc p{font-size: 16px}
    .history-swiper .history-item .right-content .history-content .img,
    .history-swiper .history-item:hover .right-content .history-content .img{width: 90%}
    .history-swiper .history-item .right-content .history-content .text{width: 95%;padding-bottom: 20px}
    .history-swiper .history-item .right-content .history-content{flex-direction: column}
    .wrap1 .btn-list{display: none}
    .product-info-button .product-info-main-button .right-part .system-item .item-right{width: 84%}
    .news .news-list .news-swiper .swiper-wrapper .new-item{height: 360px}
    #strategy .strategy-right .dsc{font-size: 14px;line-height: 22px;margin: 20px 0 10px}
    #cooperation .w80 > .content p{width: auto}
    .wrap3 .case-swiper .case-right{width: 100%}
    .wrap2 .appli-list{
        gap: 20px;
        width: 74.5%;
    }
    .wrap2 .appli-list li{width: 205px;height: 120px;}
    .wrap2 .appli-list li .montMedium{font-size: 22px}
    .wrap2 .appli-list li .sm{font-size: 18px}
    .wrap3 .case-swiper .case-item{
        flex-direction: column;
    }
    .wrap3 .case-swiper .case-right .case-title{font-size: 28px}
    .wrap1 .mb-pro-btn{display: flex}
    .wrap3 .mb-pro-btn{
        display: flex;
    }
    .wrap3 .case-btn{display: none}
    .reports-item .img{text-align: center}
    .staff .ceo{height: auto;flex-direction: column;padding: 0px 0 20px}
    .staff .ceo .staff-info{width: 90%}
    .staff .ceo .img img,
    .staff .ceo .img{width: 100%}
    .subsidiary .show-main{height: 432px}
    .subsidiary .show-main .part .info .font28{font-size: 22px;}
    .subsidiary .show-main .mask{height: 82%}
    #strategy .strategy-right .text-list li p{font-size: 14px;line-height: 24px}
}
@media screen and (max-width: 980px){
    #factory .position-3{display: none}
    .coal .coal-list li .title{margin: 20px 0 10px}
    .coal .coal-list{
        opacity: 1;}
      .honor-wrap .honor-item{margin-right: 6%;width:13%}
    .story2-box .text{
        margin-top: 20px;
    }
    .story2-box .img,
    .story2-box .text{
        width: 100%;
    }
    .story2-box{
        flex-direction: column;
    }
    .reai-box .no p{
        width: 94%;
    }
    .reai-img .reai-tit{
        width: 100%;
        text-align: center;
        font-size: 24px;
    }
    #manage .man-top .slogn p{
        font-size: 28px;
        line-height: 35px;
    }
    .speech-box{
        flex-direction: column;
    }
    .speech-box .img{
        border-radius: 10px;
        width: 100%;
        margin-bottom: 20px;
    }
    #manage .man-nav li{margin-right: 20px}
    .speech-box .text{width: 100%}
    .bottom-nav{flex-wrap: wrap;}
    .bottom-nav li {margin-bottom: 15px;}
    .footer .bottom{flex-direction: column;margin-right: 0;align-items:flex-start}
    .footer .bottom .apps{margin-top: 20px;}
    #join .positions li a{
        font-size: 18px;
        height: 120px;
        line-height: 120px;
    }
    .history-left p{text-align: center}
    #history .history-right{width: 95%}
    #history .history-list li .right-content .montMedium{
        display: block;
        font-size: 32px;
        font-weight: bold;
        color: #fff;
        margin-bottom: 20px;
    }
    #history .history-list li{margin-top: 0 !important;width: 48%;margin-bottom: 40px}
    #history .history-right .center-wrap {
     display: none;
    }
    #history .history-list{
        margin-top: 50px;
        /*flex-direction: column;*/
    }
    #history .history-list li.no{display: none}
    .event-item{text-align: center}
    .event-item .img{margin: 0 auto}
    .news-main .right-main .normal-show:hover .right-part{right: 0;}
    .coal{height: auto;}
    .rd{padding: 50px 40px}
    .rd .rd-left .font66 {font-size: 40px}
    .rd .rd-right .rd-item .item-des{font-size: 16px}
    /*.footer-contact{margin-top: 30px}*/
    .features .feat-right .feat-item{height: 380px}
    .totop{display: none}
    .footer-nav{display: none !important}
    .history-swiper .history-item{
        width: 50%;
    }
    .history-swiper .history-item .right-content{width: 100%}
    .history-swiper .history-item .right-content .montMedium{color: #030dad}
    .history-swiper .history-item:hover .right-content .montMedium{
        font-size: 66px;
    }
    .product-info .product-info-main .right-part,
    .product-info-button .product-info-main-button .right-part{width: 100%}
    .product-info .product-info-main{flex-direction: column;}
    .product-info-button .product-info-main-button .left-part{display: none}
    .product-info .product-info-main .left-part{
        width: 100%;
        justify-content: space-between;
        flex-direction: row;
        border: 2px solid #ebebeb;
        padding: 0 5px;
        margin-bottom: 20px;
    }
    .product-info .product-info-main .left-part .system-choice{
        border-bottom:  none;
    }
    .honor-wrap{width: 95.44%}
    .news-main .left-main .choice-list{flex-direction: row}
    .news-main .right-main,
    .news-main .left-main{width: 100%}
    .news-main .left-main{height: auto}
    .news-main{flex-direction: column}
    .green .green-wrap, #strategy .strategy-wrap{height: auto}
    .subsidiary .cntitle{margin: 10px 0 30px}
    .inn-swiper img{
        width: 520px;
        height: 380px;
    }
    .inn .inn-swiper{top: 0}
    .page .page-list > li .page-item{width: 200px;font-size: 18px}
    .page-des li a{font-size: 16px;height: 50px;line-height: 50px}

    .clip .about-video{
        transform: scale(1);
        border-radius: 0;
    }
    #produce .w80 .produce-right{margin: 20px 0}
    #produce .nums{width: 100%;gap: 0;justify-content: space-between}
    #produce .w80{flex-direction: column}
    #produce .w80 div{width: 100%}
    .profession .prof-nav li .nav-text{font-size: 18px}
    .home-about .about-inner{width: 90%}
    .home-about .about-factory{flex-direction: column; align-items: flex-start}
    .home-about .about-info{width: 100%}
    .home-about .about-enter-btn{top: 0; margin-top: 30px}
    .home-about .about-enter-btn:hover{top: -5px}
    .home-about .about-factorys ul li{width: 48%; margin-bottom: 16px}
    .subsidiary .show-main{
        margin: 0 0 60px;
        flex-direction: column;
    }
    .subsidiary .show-main .part .info .font28{font-size: 18px}
    .subsidiary .show-main .mask{height: auto;width: 100%}
    .subsidiary .show-main{height: auto}
    #contact{height: 650px}

    #laboratory{height: 900px}
    #cooperation .img .hz-list li .active{margin-bottom: 20px}
    #cooperation .img .hz-list li .active .des{font-size: 14px;line-height: 20px}
    #cooperation .img .hz-list li .hz-name{font-size: 18px}
    #goal .w80 .goal-right{display: none}
    .green-left{width: 100%}
    .coal .svg,.pc-box{display: none}

    .subsidiary .show-main .mask{height: 70%}
    #center .center-wrap .selects li{width: 25%}
    #center .center-wrap .text-item{
        margin-left: 30px;
        width: auto;
    }
    #technology .technology-wrap .tech-content{flex-direction: column-reverse}
    #technology .technology-wrap .tech-content .tech-right img{width: auto}
    #laboratory .lab-swiper .lab-item{height: 215px}
    #technology .technology-wrap .tech-content .tech-left{width: 100%}
    #laboratory .lab-bottom{width: 680px;height: 680px;bottom: -345px}
    #laboratory .lab-bottom .text{
        width: 450px;
        height: 450px;
    }
    #laboratory .lab-bottom .text .font66{font-size: 36px}
    #goal .goal-right img{width: 100%}
    #mean{gap: 130px}
    #goal .w80{flex-direction: column;align-items: flex-start}
    .rd,
    #platform .w80 .plat-right li{height: auto}
    #platform .w80 .plat-right li{padding: 20px 0}
    .green{padding: 80px 0 180px; height: auto}
    #strategy .strategy-wrap,
    .green .green-wrap{flex-direction: column;}
    .strategy-wrap .strategy-left img, .green-left > img{
        width: 100%;
    }
    .coal .coal-list{
        flex-wrap: wrap;
        justify-content: center;
        gap: 40px;
    }
    .coal .coal-list li{
        width: 250px;
        height: 350px;
    }
    #culture .center-box{
        width: 380px;
        height: 340px;
    }
    #join .zp .tozp{
        width: 100px;
        line-height: 100px;
        height: 100px;
        font-size: 18px;
    }
    .structure .str-wrap .dw{right: 10%}


    .staff .staff-swiper{display: block;padding-bottom: 10px}
    .staff .staff-list{display: none}


    .nav-content,.wrap3 .case-btn{
        display: none;
    }

}
@media screen and (max-width: 768px){
    .layui-layer{z-index: 999999999999999999999999999 !important;}
    .news-info-main .news-put .w90 div{line-height: 30px}
    #factory .cntitle{line-height: 45px}
    #patent{margin-top: 50px}
    #patent .patent-list li{margin-right: 20px}
    #facility .blue-block .fac-list{
        flex-wrap: wrap;
        width: 90%;
        margin: 0 auto;
        justify-content: space-between;
    }
    #facility .blue-block .fac-list li{
        width: 49%;
        margin-bottom: 20px;
    }
    #center .center-wrap .selects li{height: 120px}
    #center .center-wrap .left-wrap, #center .center-wrap .right-wrap{
        margin: 0 auto;
        padding: 50px 0 0 0;
        width: 90%;
    }
    .page.inn .page-wrap .page-list{flex-wrap: wrap;border: none;margin: 40px 0}
    .page.inn .page-wrap .page-list > li {
        border: 1px solid #d9d9d9;
        /*border-top: 1px solid #d9d9d9;*/
        width: 32%;
    }
    .page.inn .page-wrap .bottom-line{display: none}
    .page.inn .page-list > li .page-line{display: none}
    .page.inn .page-list > li .page-item{border: none}
    .page.inn .page-list > li{height: auto}

    .wellness .bg{height: auto;max-height: 400px}
    .cp-wrap .no-list li{width: 50%}
    .wrap2{padding-top: 250px}
    .wrap1 .wrap1-item{
        background-size: cover !important;
    }
    #history .history-left{padding-left: 0}
    .footer .bottom .apps{
        margin-bottom: 10px;
    }
    .prof-swiper .prof-item .prof-list{
        margin-top: 40px;
    }
    .profession .prof-nav{
        justify-content: center;
        gap: 24px;
    }
    .profession .prof-nav li {width: auto}
    .prof-swiper .prof-item{
        height: auto !important;
        min-height: 0;
        padding-bottom: 50px;
    }
    .product-grid{
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
    #contact .comp li .icon{
        width: 30px;
        height: 30px;
    }
    #contact .comp li .icon img{
        width: 50%;
    }
    #contact .comp li{margin-right: 10px;margin-bottom: 10px}
    #contact .comp{flex-wrap: wrap;width: 95%;justify-content: flex-start;margin: 20px 0}
    .i-product .i-product-nav li{font-size: 16px}
    #patent .patent-list li{width: 29%;margin-bottom:40px;}
    .honor-wrap .honor-item{width:12%;}
    .wrap1 .wrap1-item .pro-dsc{width: 92%}
    #manage .man-swiper .man-item{
        width: 49% !important;
    }
    #laboratory .lab-swiper .lab-item:nth-child(2){width: 580px !important}
    /*.progress{*/
    /*    width: 85%;*/
    /*    height: 85%;*/
    /*}*/
    .wr3 .text{
        font-size: 26px;
        line-height: 38px;
    }
    #product .product-right .des-list li{width: 100%}
    #honor{
        padding-bottom: 50px;
    }
    .structure .item-list li{margin: 0 20px 20px 0}
    .structure .str-wrap .dw{right: 0}
    .reports .top .year{display: none}
    .reports .top .reports-btn{display: none}
    .reports .top{justify-content: center}
    .inside-banner .en-title{padding-left: 9.89%}
    .inside-banner .en-title > p{font-size: 80px}


}
@media screen and (max-width: 750px){
    #culture .center-box .center-item .center-des{
        font-size: 18px;
    }
    #culture .center-box{
        width: 88%;
        height: 450px;
    }
    #culture .center-box .center-item{
        padding-top: 30px;
    }
    #culture .center-box .center-item .center-des{
        width: 500px;
    }
    #culture .center-box .center-item
    .profession .prof-line{display: none}
    .banner{
        height: 600px;
        position: static;
    }
    .banner .swiper-slide{
        height:  100% !important;
    }
    .home-mask{
        display: none;
    }
    .center .circle-put .circle-4.en-4{
        width: 300px;
        height: 300px;
    }
    /*.page.inn .page-list > li .page-item{width: 160px}*/
    .wrap3{
        padding: 120px 0 0 !important;
    }
    #manage .man-swiper .man-item{
        width: 41% !important;
    }
    #manage .man-nav{flex-wrap: wrap}
    #manage .man-nav li {margin-bottom: 15px;margin-right: 30px}
    #manage .man-top .slogn p{font-size: 22px;line-height: 30px}
    #manage .man-top{
        flex-direction: column;
        align-items: flex-start;
    }
    .slogn{
        margin-top: 20px;
    }
    /*.story2-swiper .st-item{width: 49%}*/
    .reai-box .zw-swiper .zw-item{
        width: 54%;
    }
    .bottom-nav li{margin-right: 10px}
    .honor-wrap{width: 98.44%}
    #produce .nums li{width:25%;}
    #produce .nums li .color28 .montMR{font-size: 46px;}
    .clip .about-video{height: auto;}
    .features .feat-right .feat-item{margin-right: 10px !important}
    .features .feat-right .feat-item .text{font-size: 22px}
    .features .feat-right .feat-item{height: 350px}
    .page-choice{width: 100%}
    .news .news-list .news-swiper .swiper-wrapper .new-item{height: 400px}
    .prof-swiper .prof-item .prof-list .text{width: 100%}
    .structure{height: auto;padding-bottom: 50px}

    .footer .footer-contact{gap: 40px}

    .home-about .about-inner{width: 92%; padding: 0 10px; box-sizing: border-box}
    .home-about .about-title-box em{height: auto; line-height: 1.2; margin-bottom: 20px}
    .home-about .about-tagline{line-height: 1.5}
    .home-about .about-factorys ul li{width: 100%; margin-bottom: 12px; height: 160px}
    .home-about .about-factorys ul li .info .des b{font-size: 42px}
    .home-about .about-factorys ul li .info .des b span{font-size: 14px}
    .home-about .about-factorys ul li .info .des p{font-size: 16px}
    .home-about .about-factorys ul li .info .icon .iconfont{font-size: 28px}
    .banner .banner-title .cn-text{font-size: 48px}
    .banner .banner-title .en-text{font-size: 22px}
    .nav-content,
    .profession .prof-nav li .svg{display: none}
    .profession .prof-nav{width: 90%}
    .product-grid{
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    .product-card{
        border-radius: 12px;
        aspect-ratio: 4 / 3;
    }
    .product-card-img{
        border-radius: 12px;
    }
    .product-card-title{
        font-size: 16px;
    }
    .product-card-bar{
        min-height: 46px;
        padding: 0 14px;
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
    }
    .prof-swiper .prof-item .prof-list{gap: 0;flex-direction: column}
    .prof-swiper .prof-item .prof-list .list-nav{
        display: flex;
        justify-content: space-evenly;
        width: auto;
    }
    .prof-swiper .prof-item .prof-list .text-item{
        width: auto;
        margin-top: 30px;
    }
    .out{
        height: auto;
    }
    .esg .esg-list{margin-top: 150px}
    /*.esg .esg-list li .list-des{display: none}*/
    .esg .esg-top{flex-direction: column;align-items: flex-start}
    .esg .esg-top .des{margin-top: 20px}
    .esg .esg-list li {flex-direction: column;align-items: flex-start;padding-bottom: 20px}
    .esg .esg-list li.on{height: 240px}
    .esg .esg-list li .list-des{width: 100%}
    .inside-banner .en-title p{font-size: 75px;padding-top: 40px}
    /*.inside-banner{height: 691px}*/
    #produce .w80{flex-direction: column}
    #produce .w80 div{width: 100%}
    #produce .w80 .produce-right{margin: 50px 0}
    #culture .culture-left > .montLight{display: none}
    #culture{height: 1080px}
    #culture .culture-left{width: 100%;}
    #culture .culture-right{display: none}
    .inside-banner .en-title{padding-left: 77px}
    .inside-banner .en-title{bottom: -1px}
    #culture .culture-left .culture-list{display: flex}
    #culture .center-box{top: 65%}
    #honor .honor-list .swiper-wrapper{gap: 27px 80px;justify-content:center;}
    #honor .honor-list{width: 100%;}

    #history{padding: 70px 0 145px 20px}
    .history-swiper .history-item{padding-right: 0}

    #contact .map .tomap{
        width: 265px;
        height: 150px;
    }
    /*#contact{height: 550px}*/
    #contact .contact-list{width: 80%}
    #msg{
        height: auto;
        padding-bottom: 50px;
    }
    #msg .msg-wrap{
        flex-direction: column;
        gap: 50px;
    }
    #join .zp .zp-item p{font-size: 22px}
    .wrap1 .btn-list,
    .wrap1 .pro-line{display: none}
    .wrap2 .appli-list{
        width: 100%;
        gap: 40px;
    }

    .wrap3 .case-btn{display: none}
    .page .page-list > li .page-item{width: 200px}
    .product-info .product-info-main{flex-direction: column;gap: 50px}

    .product-info-button .product-info-main-button .left-part{
        width: 100%;
        justify-content: space-between;
        border: none;
        flex-direction: row;
    }
    .product-info .product-info-main .right-part{
        width: 100%;
    }
    .product-info-button .product-info-main-button{flex-direction: column-reverse}
    /*.product-info-button .product-info-main-button .right-part .system-item .item-right{width: 530px}*/
    .product-info-button .product-info-main-button .left-part{margin: 80px 0 0 }
    .product-info-button{padding:0 0 80px 30px}
    .product-info-button .product-info-main-button .left-part .sp span::after{left: -19px}
    .product-info{padding-left: 45px}
    .product-info .product-info-main .right-part .system-item .item-left .number{
        width: 60px;
        height: 60px;
    }
    .pc-box{display: none}

    .green .bottom-text{font-size: 126px}
    .wellness .w80 > .content{font-size: 18px}
    .font34{font-weight: normal}
    .wellness .well-list{flex-direction: column;}
    .wellness .well-list li{margin-bottom: 20px}

    #event .event-top{flex-wrap: wrap}
    #event .event-top .select-year{margin-right: 200px}
    #event .event-top .title,
    #event .event-top .event-btn{margin-top: 30px}
    .inn{height: auto}
    .inn .inn-swiper{position: static}
    .inn .inn-wrap{margin: 0;height: 600px;justify-content: flex-start}
    .inn-swiper img{width: 100%}
    .inn .inn-wrap .inn-left{width: 40.3%}
    .inn .inn-wrap .inn-right{width: 59.7%;padding: 80px 40px 0 }
    .inn .inn-wrap .inn-right .des{width: 100%}
    .rd{padding: 40px 20px 0}
    .rd .rd-right .rd-item .item-des{font-size: 18px}
    #platform .w80{flex-direction: column;}
    #platform .w80 .plat-right{width: 100%;margin-top: 50px}
    #goal .w80{flex-direction: column;gap: 50px;justify-content: flex-start;align-items: flex-start}
    #mean{padding: 80px 40px 130px;gap: 150px}
    .rd .rd-left .pt-list{gap: 10px}
    #cooperation .img .hz-list{display: none}
    #laboratory .lab-bottom .lab-img{width: 90px;height: 90px}
    #laboratory .lab-swiper{margin-top: 350px}
    #laboratory .lab-swiper .lab-item .item-title{font-size: 28px}
    #laboratory .lab-swiper .lab-item.swiper-slide-active .des{font-size: 16px;line-height: 22px}
    #product .product-right{padding: 65px 20px 40px 40px;width: 100%;box-sizing: border-box}
    #center .center-wrap .selects{
        width: 98%;
        margin: 100px auto 0;
    }
    #center .center-wrap .selects li{width: 25%}

    #talent .jr .jr-bor .jr-list .dotted{
        width: 180px;
        height: 180px;
    }
    #talent .jr .jr-bor .jr-list{gap: 10px}
    #talent .jr .jr-bor .jr-list .line{width: 15px}
    #talent .jr{width: 92%}
    #facility .blue-block .fac-list{gap: 0}
    #facility .fac-swiper{width: 100%}
    .news-main{flex-direction: column}
    .news-main .right-main,
    .news-main .left-main{width: 100%}
    .news-info-main .news-put .title-put .bg-title{line-height: 30px;font-size: 24px;margin: 0 auto 30px}
    .news-info-main .news-put .title-put .bg-title .sm-title{margin-top: 20px}
    .news-info-main .news-put .title-put{width: 90%;margin-bottom: 30px}
    .news-info-main .news-put{padding-top: 60px}
    .news-info-main .news-put .w90{display: block}
    .news-info-main .news-put .w90 img{width: 100%;height: auto}
    .news-info-main .news-put .w90 strong{top: 0}
    .news-main .right-main .normal-show::before,
    .news-main .right-main .normal-show::after{bottom: -70px}
    .news-info-main .page-choice{width: 80%}
    .subsidiary .show-main .mask{width: 100%}
    .subsidiary .show-main{flex-direction: column;height: auto;gap: 30px}
    .subsidiary .show-main .part{gap: 20px}
    .subsidiary .show-main .part .info{height: 50px}
    .center .circle-put .circle-4{
        width: 350px;
        height: 350px;
    }
    .center .depart-info{top: 73%;left: 79px}
    #factory .position-3{display: none}
    #factory{padding: 0 20px; box-sizing: border-box}
    #contact .map .tomap .left .zb{margin: 0 auto 10px; width: 40px}
    .inside-banner .en-title{width: 638px}

    .stock .w88{height: auto}
    .staff{margin-top: 60px}
    .staff .ceo{flex-direction: column;height: auto;padding-top: 50px}
    .staff .ceo .staff-info{width: 85%}
    .structure .item-list li{margin: 0 25px 10px 0;}

    .structure .str-line5,
    .structure .str-line4{width: 405px}
    .staff .staff-swiper{display: block}
    .staff .staff-list{display: none}

    .reports-swiper .img img{
        margin: 0 auto;
        display: block;
    }
    .banner .swiper-slide{background-size: cover !important}
    .structure .str-wrap .dw{
        right: 0;
        top: 42%;
    }
}
@media screen and (max-width: 550px){
    .honor-wrap .honor-item{margin-right:4%;margin-bottom:0;}
    #mean{flex-direction: column}

    .right-form .form .bm{width: 47%}
    .right-form .form{gap: 20px 10px}
    #join .zp .zp-item{gap: 0;justify-content: flex-start}
    #join .zp .zp-item:nth-child(2){justify-content: flex-end}
    #contact .map .tomap{
        width: fit-content;
        height: 70px;
    }
    #contact .map .tomap .right{display: none}
    #contact .map .tomap .left .zb{width: 20px}
    #contact .contact-list{flex-direction: column;align-items: flex-start;bottom: 0%}
    #contact .contact-list .name{align-items: flex-start;justify-content: flex-start}
    #contact .contact-list .summary{margin-top: 0px}
    #contact .contact-list li{margin-bottom: 40px}

    .structure .item-list li{margin: 0 15px 10px 0}
    .structure{padding-bottom: 40px}
    .staff .ceo{padding: 0}
    .footer .footer-wrap .footer-nav li .item{display: none}
    .footer .footer-wrap .footer-nav .nav1{font-size: 16px}
    .honor-wrap{margin: 117px auto 0}
}
@media screen and (max-width: 480px){
    .structure{height: auto}
    .structure .str-wrap .item-box .white-box p{font-size: 12px}
    .structure .item-list .item-box .white-box,
    .structure .item-list .item-box {width: 115px}
    .structure .item-list li{margin: 0 8px 10px 0}
    .structure .str-wrap .dw{display: none}
    .footer .footer-wrap .footer-nav{padding: 0;}
    .footer .footer-wrap .footer-nav .nav1{font-weight: normal;font-size: 14px}
}



