/* 公共手机导航 */
.headMob {
    display: none;
    background: #fff;
    box-shadow: 0 2px 10px 0 rgb(0 0 0 / 10%);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 5;
}

.headMob .mob-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
}
.headMob .mob-box .box-left .logo-white{
    width: 150px;
}
.headMob .box-right img {
    width: 30px;
}
.headMob .logo{
    display: none;
}
.headMob .box-right .cd2{
    display: none;
}

.mob-bg {
    background-color: rgba(0, 0, 0, 0.5);
    height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 7;
    left: 0;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    opacity: 0;
    visibility: hidden;
}
.headMob.headMob-active .mob-bg {
    opacity: 1;
    visibility: inherit;
}
.mob-list {
    position: fixed;
    background: rgba(255, 255, 255);
    backdrop-filter: blur(10px);
    width: 75%;
    top: 0;
    right: -100%;
    z-index: 8;
    padding: 30px 20px;
    height: 100vh;
    transition: all 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -webkit-transition: all 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -moz-transition: all 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -ms-transition: all 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -o-transition: all 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    box-shadow: 0 -8px 16px 0 rgb(0 0 0 / 16%);
    opacity: 0;
    visibility: hidden;
    overflow-y: auto;
}
.headMob.headMob-active .mob-list {
    right: 0;
    opacity: 1;
    visibility: inherit;
}
.mob-list .list-top{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.mob-list .top-left {
    float: left;
}

.mob-list .top-right {
    float: right;
}
.mob-list .top-right .clone {
    display: inline-block;
    background: url(../images/icon-phone-guanbi-white.svg) no-repeat center;
    background-size: contain;
    width: 18px;
    height: 18px;
}
.mob-list .list-cent {
    margin-top: 30px;
}
.mob-list .box-list>li {
    padding: 12px 0;
    position: relative;
}
.mob-list .box-list>li:not(:last-child) {
    border-bottom: 1px solid #818181;
}
.mob-list .box-list > li > a {
    font-family: 'PingFang SC';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    color: #252931;
}
.mob-list .list-cent .con-laug{
    margin-top: 30px;
}
.mob-list .list-cent .laug-box{
    margin-top: 20px;
}
.mob-list .list-cent .laug-box a {
    font-size: 14px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #383C45;
    opacity: .5;
    line-height: 20px;
    vertical-align: middle;
}
.mob-list .list-cent .laug-box a.active {
    opacity: 1;
}

.mob-list.mob-listEn .box-list .two-list>li {
    width: 100%;
    float: left;
}

.mob-list .box-list .icon-bottom{
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url(../images/phone-icon-bottom.svg) no-repeat center;
    background-size: contain;
    position: absolute;
    right: 0;
    top: 16px;
}
.mob-list .box-list > li.active .icon-bottom {
    background: url(../images/phone-icon-top.svg) no-repeat center;
    background-size: contain;
}
.mob-list .box-list .two-list {
    margin: 10px 0;
    display: none;
}
.mob-list .box-list .two-list>li {
    width: 100%;
}
.mob-list .box-list .two-list>li>a {
    font-family: 'PingFang SC';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    color: #252931;
}
.mob-list.mob-listEn .box-list .two-list>li {
    width: 100%;
    float: left;
}

.business-item{
    padding: 0;
}

@media screen and (max-width: 1750px){
    .develop{
        height: 900px;
    }
}

@media screen and (max-width: 1500px) {
    .marquee-list {
        width: 200%;  
    }

    .marquee-item {
        width: 20vw;  
    }
}

@media screen and (max-width: 1400px){
    .head-pc{
       width: 90%;
    }
    .about,.culture-box,.concept-box,.responsibility-box{
        width: 85%;
    }
    .develop-dialog{
        max-width: 700px;
    }
    .develop-img img{
        height: 500px;
        object-fit: cover;
    }
    .news-list .thumb{
        width: 45%;
    }
    .news-list .news-details{
        width: 55%;
    }
    .about_honor{
        width: 95%;
    }
}

@media screen and (max-width: 1300px) and (min-width:1024px) {
    .business-item{
        flex: 0 0 50%;
        max-width: 50%;
    }
}

@media screen and (max-width: 1200px) {
    .footer-top{
        flex-direction: column;
        gap: 60px;
    }
    .footer-info{
        display: flex;
        justify-content: space-between;
    }
    .develop-dialog{
        max-width: 600px;
    }
    .develop-img img{
        height: 500px;
        object-fit: cover;
    }
     .common-banner-title h1{
        font-size: 36px;
        margin-bottom: 0px;
    }

}



@media screen and (max-width: 1024px) {
    .head-pc{
        width: 100%;
        justify-content: space-around;
    }
    .develop-dialog{
        max-width: 500px;
    }
    .develop-img img{
        width: 500px;
        height: 500px;
        object-fit: cover;
    }
    .develop{
        height: 950px;
    }
    .develop-box{
        width: 90%;
    }
    .feature-list,.advantage-item{
        width: 85%;
    }
    .business-container{
        padding: 90px 10% 120px;
    }
    .news-list .thumb,.news-list .news-details,.hot .thumb,.hot .news-details{
        width: 50%;
    }
    .news-container,.case-container,.contact-info,.form-container{
        width: 90%;
    }
   .case-list {
        grid-template-columns: repeat(2, 49%);
        grid-column-gap: 2%;
    }
    .unit-list {
        grid-template-columns: repeat(3, 32%);
        grid-column-gap: 2%;
    }
    .form-container{
     
        flex-direction: column;
    }
    .intro,.contact-form{
        width: 100%;
    }
}

@media screen and (max-width: 950px) {
    header{
        display: none;
    }
    .headMob{
        display: block;
    }
}

@media screen and (max-width: 850px) {
    .foot-nav-list{
        display: grid;
        grid-template-columns: repeat(3, 32%);
        grid-column-gap: 2%;
        grid-row-gap: 20px;
    }
    .foot-nav{
        height: auto;
    }
     .footer-info{
        display: block;
        
    }
}

@media screen and (max-width: 768px) {
    .common-banner-img img{
        min-height: 50vh;
        
    }
    .marquee-list {
        width: 300%; 
    }

    .marquee-item {
        width: 30vw;  
    }
    .banner-title{
        width: 85%;
    }
    .banner-title p{
        font-size: 22px;
    }
    
    .business-icon{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .business-info{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .business-icon img{
        width: 54px;
        height: 54px;
    }
    
    .business-info h2{
        font-size: 18px;
        margin-bottom: 5px;
    }
    
    .business-info p{
         font-size: 16px;
    }
      .footer-bottom{
        height: 120px;
        padding: 0 40px;
    }
    .partner-title h2{
        font-size: 22px;
    }
    .partner-title p{
        font-size: 18px;
    }
    .common-banner-title h1{
        font-size: 24px;
    }
    .common-banner-title p{
        font-size: 12px;
    }
    .about{
        padding: 0 0 80px 0;
    }
    .about-list,
    .culture-cards{
         flex-wrap: wrap;
    }
    .culture-box{
        top: 0;
        transform: translate(-50%,0);
    }
    .about-title{
        padding-top: 60px;
    }
    .about-title h2{
        font-size: 22px;
    }
    .card-title h3{
        font-size: 20px;
    }
    .culture-bg,.culture-bg img{
        height: 1080px;
    }
    .about-item,.culture-card,.concept-box div,.responsibility-box div{
        width: 100%;
    }
    .concept,.responsibility,.develop{
        padding: 0;
    }
    .concept-box,.responsibility-box{
        justify-content: center;
        flex-direction: column;
        gap:0px;
    }
    
    .responsibility .about-title{
        margin-bottom: 0px;
    }
    .concept-details article p,.responsibility-left article p{
        font-size: 18px;
    }
    
    .feature-list{
        flex-direction: column;
        gap: 53px;
    }
    .advantage-item{
         flex-direction: column;
         gap: 10px;
    }
    .advantage-img,.advantage-content,
    .feature-item{
        width: 100%;
    }
    
    .develop-dialog{
        max-width: 330px;
        top: 80px;
        left: 30px;
        padding: 40px 30px;
    }
   .develop-box{
        width: 100%;
    }
    .develop-img{
        justify-content: flex-end;    
    }
    .develop-lump{
        width: 80px;
        height: 80px;
        top: 40px;
        left: 15px;
    }
    .develop-img img{
        width: 60vw;
        height: 450px;
        object-fit: cover;
    }
    .develop-dialog h3{
        font-size: 18px;
    }
    .develop-dialog p{
        font-size: 14px;
    }
    .develop{
        margin-top: 60px;
        height: 800px;
        
    }
    .develop-dialog button{
        width: 140px;
        height: 40px;
        margin-top: 30px;
        font-size: 12px;
    }
    .news-list .news-date div{
        display: none;
    }
    .hot{
        flex-direction: column;
    }

    .hot .news-details{
        padding: 30px 40px;
    }
    .hot .news-details button{margin-top: 30px;}
    .hot .news-details button,.news-list .news-details button{
        width: 140px;
        height: 40px;
        
        font-size: 16px;
    }
    .hot .news-details .title{
        margin-top: 15px;
        font-size: 22px;
    }
   .news-list li{
       flex-direction: column;
        padding: 20px;
        gap: 0px;
   }
    .hot .thumb,.hot .news-details,.news-list .thumb,.news-list .news-details,.intro,.contact-form{
        width: 100%;
    }
    .news-list .news-details{
        padding: 20px 0 0px;
    }
    .news-list .news-details .description {
        margin: 8px 0 20px;
    }
    .case-list {
        grid-template-columns: repeat(1, 100%);
        grid-column-gap: 0;
    }
    .unit-list {
        grid-template-columns: repeat(2, 48%);
        grid-column-gap: 4%;
    }
     .form-container{
        flex-direction: column;
        gap: 30px;
    }
    .contact-list{
         grid-template-columns: repeat(1, 100%);
    }
    .contact-item{
        margin-bottom: 30px;
    }
    .contact-info{
        margin: 30px auto;
    }
    .business-title{
        font-size: 22px;
    }
    .business-container{
        padding: 60px 10%;
    }
    .business-description,.advantage-content p{
        font-size: 16px;
    }
    .features,.advantages{
        padding: 60px 0;
    }
    .feature-content h3,.advantage-content h3{
        font-size: 22px;
    }
    .hot .news-details .date{
        font-size: 24px;
    }
    .news-list .news-details .title{
        font-size: 20px;
    }
    .unit-container{
        width: 90%;
        padding: 60px 0;
    }
    .contact-item p{
        font-size: 22px;
    }
    .intro h2{
        font-size: 26px;
    }
    .intro p{
        font-size: 16px;
    }
    .form_row{
        flex-direction: column;
        gap: 0px;
    }
    .form_row .form-group{
        width: 100%;
    }
    .form-bg{
        padding: 60px 0;
    }
    .about_honor{
        padding: 0;
        padding-bottom: 60px;
    }
    
    .menu_box{
    padding: 30px 25px;
    }
}