.about-warp{position:relative;color:#fff;height:100vh;padding:0;display:flex;align-items:center}
.about-warp img{width:100%}
.slide-bg{height:100vh;display:flex;align-items:center;color:#000;}
.int-wrap{display:flex;position:relative;height:433px;top:-114px}
.integration{width:100%;background:#f5f5f5 url(../images/index/bg_2.webp) no-repeat center;background-size:120%;box-shadow:-1px 0px 11px 1px #a0a0a0;position:relative}
.integration .int-img{height:100%;overflow:hidden;position:relative}
.integration .int-img img{width:406px}
.integration .int-content{flex:1;display:flex;align-items:center;padding-top:113px;font-size:28px}
.integration .int-content p{padding:2px}
.integration .int-content h4{font-size:3vw;font-weight:bold}
.integration .int-content h4::after{content:"";height:8px;width:70px;background:#dd2233;display:block;margin-top:20px;border-radius:12px}
.integration .int-content .subtitle{font-size:33px;font-weight:bold;padding-top:30px}
.integration .int-content .subtag{font-size:22px;padding-top:15px}
.integration .int-content .subdesc{font-size:20px;padding-top:50px}
.tab-content>.active .int-content{opacity:1}
.tab-content>.tab-pane{width:100%;height:319px}
.swiper-slide{position:relative}
.int-tabs{width:100%;display:flex}
.int-tabs li a{width:100%;height:100%;background-size:88%;background-repeat:no-repeat;display:block;background-position:center;overflow:hidden;border:1px solid #ff4a5900}
.int-tabs li img{width:100%;transition:all 0.3s linear}
.int-tabs li{flex:1;height:200px;overflow:hidden;background:#60606a;border-right:1px solid #6e6e6e;opacity:0.8;transition:all 0.3s linear}
.int-tabs li:hover img{opacity:1;transform:scale(1.05)}
.int-tabs li:hover a,.int-tabs .active a{border:1px solid #eed6d6;box-shadow:inset 0 0 10px rgb(255 255 255 / 90%)}
.int-tabs .active{opacity:1}
.int-tabs .active img{opacity:1;transform:scale(1.05)}
.team-title{top:-85px;position:absolute;font-size:39px;left:0px;font-weight:bold}
.integration .int-position{position:relative;top:204px;left:20px;width: 150px;}
.integration  .name{font-size:50px;padding-top:12px;font-weight:bold}
.integration .post{font-size:22px;white-space: nowrap;}
.integration .int-content .int-desc{padding-right:180px;padding-left:30px}


.corporate-img{text-align: center;height: calc(100vh - 100px);margin-top:80px}
.corporate-img {background: url(../images/about/about.webp) no-repeat center;background-size: contain;}



.about-img{position:relative;width: 100%;}
.about-img img{width:88%}
.about-img .about-title{font-size:39px;font-weight:bold;position:absolute;top:30px}
.about-img .global-buttom{padding-bottom:20px;position:relative;top:0px}

.about-img .iframe{text-align: center;position: relative; }
.about-img .iframe iframe{width:500px;height:500px;margin: auto;border: 0px;}
.about-img .com-img{position:absolute;width: 100%;text-align: center;    z-index: 1;}
.about-img .com-img img{width:1130px;transform: translateX(67px);}
.about-img .com-p {font-size: 18px;line-height: 35px; padding-top: 20px;    font-weight: bold;}
.about-img .iframe::after{content: "";width: 100px;height: 120px;background:url(../images/about/about_icon.webp) no-repeat center;background-size: 100%;position: absolute;bottom: 0;right: 0}

.about-img .com-cont {text-align: left;font-size: 16px; position: absolute;top: 90px;display: none;}
.about-img .com-cont p{margin-top:12px ;}
.about-img .com-cont span{font-weight: bold;color:#cb0000}



.about-warps{margin-top:40px;height:(100vh - 80px);display:flex;align-items:center;}
.boxlist{display:grid;grid-template-columns: repeat(3, 1fr);grid-auto-rows: auto;grid-column-gap: 1.3rem;grid-row-gap: 1.3rem;width: 90%;margin: auto;margin-top:2rem;}
.boxlist .boxli{box-shadow:0 1px 3px rgba(34, 25, 25, 0.2);position:relative;text-align:center;border-radius: 0.8rem;overflow: hidden;display: flex;align-items: center;justify-content: center;color:#000}
.boxlist  img{width: 100%; transition: transform 2s;}
.boxlist .boxli:hover img{transform: scale(1.05);}
.boxlist h4 {font-size: 2.5rem;font-weight: bold;color:#fff}
.boxlist p{font-size: 1.2rem;text-transform: uppercase; font-weight: 100;color:#fff}
.boxlist  .boxli-describe{margin-top:2rem;font-size: 1rem;line-height: 1.8rem;color:#fff}
.swiper-bottom{text-align: center;margin-top: 1rem;}
.swiper-bottom .md-desc{padding: 0;} 
.flip-card { perspective: 1000px; }
.global-m .mimg{display: none;}
/* 内部容器 */
.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.6s; /* 添加动画过渡 */
    transform-style: preserve-3d; /* 保持 3D 效果 */
}

/* 鼠标悬停时翻转 */
.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg); /* 沿 Y 轴翻转 180 度 */
}

/* 正面和背面样式 */
.flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden; /* 隐藏背面 */
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
}

/* 正面样式 */
.flip-card-front {
    background: linear-gradient(126deg, #f9606e 0%, #e53245 50%, #dd2235 100%);box-shadow:0 1px 3px rgba(34, 25, 25, 0.2);
}

/* 背面样式 */
.flip-card-back {
    background: linear-gradient(126deg, #ef5836 0%, #f0603d 50%, #f0603d 100%);box-shadow:0 1px 3px rgba(34, 25, 25, 0.2);
    transform: rotateY(180deg); /* 初始状态为背面 */
    color: #fff;
}



.flip-card-back h4{color:#fff}   
.flip-card-back p{color:#fff}   
.flip-card-back .boxli-describe{color:#fff} 






@media screen and (max-width:1024px){
.integration .int-content .int-desc{padding-left:0px;padding-right:30px}
.integration .int-img img{width:345px;}
.int-tabs li{height:170px}
.about-img .com-img img { width: 990px;transform: translateX(0px);}
.about-img .iframe iframe {transform: scale(0.8) translateX(-90px) translateY(-101px);}
}

.tab-wrap ul{display:flex}
.tab-wrap li{flex:1;text-align:center;transition:all 0.3s linear}
.tab-wrap li:hover,.tab-wrap .active{transform:scale(1.1)}
.tab-wrap li a{display:inline-block;font-size:30px;padding:16px 0px;width:210px;line-height:50px;border-radius:7px;box-shadow:-1px -1px 7px 0px #fff;transition:all 0.3s linear}
.tab-wrap li a::after{content:"";height:2px;width:50px;background:#dd2233;display:block;margin-top:20px;border-radius:12px;margin:auto}
.tab-wrap .active a::after{height:6px}
.tab-wrap .active a{font-weight:bold;box-shadow:-1px -1px 7px 0px #a0a0a0}
.slide-bg .container{background:url(../images/index/bg_2.webp) no-repeat center;background-size:120%;margin-top: 80px;}
.tab-business{width:100%;}
.tab-business .business-wrap{display:flex;align-items:center;position:relative;width:100%;border-radius:22px;box-shadow:-1px -1px 9px 0px #a0a0a0;margin-top:30px;padding:30px 50px;color:#000;overflow:hidden;background:url(../images/about/tongling.webp) no-repeat center;background-size:cover}
.tab-business .shenzhen{background:url(../images/about/shenzhen.jpg) no-repeat center;background-size:cover}
.tab-business .shanghai{background:url(../images/about/shanghai.jpg) no-repeat center;background-size:cover}
.tab-business .business-top{width:70%;position:relative;z-index:1}
.tab-business .business-top h4{font-size:46px;font-weight:bold;line-height:65px;margin:0}
.tab-business .business-top p{font-size:20px;padding-top:30px}
.tab-business .business-code{width:30%;text-align:center;font-size:20px;line-height:25px;position:relative;z-index:1}
.tab-business .business-code img{width:151px}
.tab-business .business-code p{padding-top:12px}
.company-wrap{display:flex;margin:2vw 0;gap:2.5vw}
.company-wrap .company-img{flex:1;text-align:center}
.company-wrap .company-img img{width:100%;border-radius:20px}
.tab-business .tab-pane{display:none}
.tab-business .active{display:block}

@media screen and (min-width:2000px){
    .tab-business .business-wrap{margin-top: 50px;}
    .about-img .iframe{transform: scale(1.1);}
}

@media screen and (max-width:1920px){
    .about-img .a-img{width: 80%;}
.about-img img{width:100%;display:block;margin:auto}
.about-img .about-title{font-size:29px;position:absolute}
.about-img .global-buttom{position: relative;}
.about-img{position:relative;margin-top:70px}
.company-wrap {margin: 1vw 0;}
.tab-wrap li a{padding:2px 0px;font-size:26px}
.integration{margin-top:160px}
.team-title{font-size:29px}
.tab-business .business-top h4{font-size:27px;line-height:40px}
.tab-business .business-top p{font-size:16px;padding-top:10px}
.tab-business .business-wrap{padding:7px 26px;width:92%;margin:auto;margin-top:40px}
.tab-business .business-top{width:80%}
.company-wrap .company-img img{width:76%;border-radius:20px}
.company-wrap{margin:1vw 0;gap:0;margin-top: 36px;}
.tab-business .business-code img{width:100px}
.tab-business .business-code{width:20%;font-size:15px;line-height:13px}
.integration .int-content .int-desc{padding-right: 90px;}

}
@media screen and (max-width:1500px){
.tab-business .business-top h4{font-size:37px;line-height:50px}
.tab-wrap{margin-top:30px}
.tab-wrap li a{font-size:25px;padding:0;line-height:51px;padding-bottom:10px}
}@media screen and (max-width:1024px){.tab-business .business-wrap{padding:15px}
.tab-business .business-top h4{font-size:37px;line-height:50px}
.tab-business .business-top p{font-size:16px;padding-top:15px}
.tab-business .business-code{width:30%;font-size:18px}
}
@media screen and (max-width:768px){
    .int-wrap{display:block;height:100%;top:-70px}
    .int-tabs li{height:69px}
    .integration .int-content{padding-top:96px;font-size:16px}
    .integration .int-content .int-desc{padding-right:0}
    .tab-content>.tab-pane{height:91vw}
    .integration .int-img{text-align:right}
    .integration .int-img img{width:80%}
    .team-title{top:-57px;font-size:27px}
    .integration .int-position{top:127px;left:13px;width: 100%;}
    .integration .name{font-size:34px;padding-top:0px}
    .integration .post{font-size:15px}
    .about-img .com-img img{display: none;}
    .about-img .com-cont{display:block;}
    .about-img .com-p {font-size: 15px;line-height: 35px; padding-top: 20px;position: absolute;top: 383px;}
    .about-img .iframe::after{ bottom: 117px;}
    }

@media screen and (max-width:768px){
.about-img .about-title{font-size:19px;position:relative;top: -29px;}
.team-title{font-size:19px}
.tab-business .business-top{width:100%}
.integration{margin-top:0}
.about-img img{width:100%}
.about-img .a-img{width: 100%;}
.tab-business .business-wrap{display:block}
.tab-business .business-code{width:100%;font-size:17px;margin-top:24px}
.tab-business .business-code img{width:60%}
.tab-business .business-top h4{font-size:6vw;line-height:9vw}
.tab-wrap li a{font-size:20px;padding:0px 26px;width:100%;padding-bottom:13px}
.tab-business .business-wrap{margin-top:34px;border-radius:12px}
.company-wrap{margin-top:6vw;}
.company-wrap .company-img img{border-radius:12px;width: 92%;}
.tab-wrap{margin-top:0}
.boxlist{grid-template-columns: repeat(1, 1fr);}
.flip-card{height: 170px;}
.boxlist .boxli{display:none;}
.global-m{margin-top:10px;top: 0;}
.global-m .about-title{top: 0;}
.global-m img{display:none;}
.global-m .mimg{display:block;width:91%;border-radius: 15px;}

}










.tab-business .business-wrap,.company-wrap,.int-position,.int-desc,.integration .int-img img{opacity:1;transform:translateY(0%);animation:up 1s;will-change:transform,opacity}
@-webkit-keyframes up{from{opacity:0;-webkit-transform:translateY(20%)}
to{opacity:1;-webkit-transform:translateY(0%)}
}@-moz-keyframes up{from{opacity:0;-moz-transform:translateY(20%)}
to{opacity:1;-moz-transform:translateY(0%)}
}@-o-keyframes up{from{opacity:0;-o-transform:translateY(20%)}
to{opacity:1;-o-transform:translateY(0%)}
}


.about-img .iframe::after{-webkit-animation:goldmine_gold 2000ms 0s infinite normal;-moz-animation:goldmine_gold 2000ms 0s infinite normal;-ms-animation:goldmine_gold 2000ms 0s infinite normal;-o-animation:goldmine_gold 2000ms 0s infinite normal;animation:goldmine_gold 2000ms 0s infinite normal;animation-timing-function:linear;-webkit-animation-timing-function:linear;-moz-animation-timing-function:linear;-ms-animation-timing-function:linear;-o-animation-timing-function:linear;}
@keyframes goldmine_gold{from{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);}
2%{-webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-ms-transform:rotate(10deg);-o-transform:rotate(10deg);transform:rotate(10deg);}
4%{-webkit-transform:rotate(20deg);-moz-transform:rotate(20deg);-ms-transform:rotate(20deg);-o-transform:rotate(20deg);transform:rotate(20deg);}
6%{-webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-ms-transform:rotate(10deg);-o-transform:rotate(10deg);transform:rotate(10deg);}
8%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);}
10%{-webkit-transform:rotate(-10deg);-moz-transform:rotate(-10deg);-ms-transform:rotate(-10deg);-o-transform:rotate(-10deg);transform:rotate(-10deg);}
12%{-webkit-transform:rotate(-20deg);-moz-transform:rotate(-20deg);-ms-transform:rotate(-20deg);-o-transform:rotate(-20deg);transform:rotate(-20deg);}
14%{-webkit-transform:rotate(-10deg);-moz-transform:rotate(-10deg);-ms-transform:rotate(-10deg);-o-transform:rotate(-10deg);transform:rotate(-10deg);}
16%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);}
18%{-webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-ms-transform:rotate(10deg);-o-transform:rotate(10deg);transform:rotate(10deg);}
20%{-webkit-transform:rotate(20deg);-moz-transform:rotate(20deg);-ms-transform:rotate(20deg);-o-transform:rotate(20deg);transform:rotate(20deg);}
22%{-webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-ms-transform:rotate(10deg);-o-transform:rotate(10deg);transform:rotate(10deg);}
24%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);}
26%{-webkit-transform:rotate(-10deg);-moz-transform:rotate(-10deg);-ms-transform:rotate(-10deg);-o-transform:rotate(-10deg);transform:rotate(-10deg);}
28%{-webkit-transform:rotate(-20deg);-moz-transform:rotate(-20deg);-ms-transform:rotate(-20deg);-o-transform:rotate(-20deg);transform:rotate(-20deg);}
30%{-webkit-transform:rotate(-10deg);-moz-transform:rotate(-10deg);-ms-transform:rotate(-10deg);-o-transform:rotate(-10deg);transform:rotate(-10deg);}
32%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);}
100%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);}
}



.zoomlevel .about-warps{transform: scale(0.8);}