.wow {
    opacity: 0;
}

.mobile {
    width: 100%;
}

.mobile-inner {
    margin-right: auto;
    margin-left: auto;
    background-color: ;
    position: relative;
}

.mobile-inner img {
}

.mobile-inner p {
    color: #676767;
    line-height: 25px;
    font-size: 16px;
    padding-bottom: 30px;
    padding-right: 30px;
    padding-left: 30px;
    margin: 0px;
}

.mobile-inner-header {
    width: 100%;
    height: 50px;
    position: relative;
    top: 0px;
    z-index: 666;
    left: 0px;
    background: url(../images/head.png) repeat-x left center;
    background-size: cover;
}

.mobile-inner-header-icon {
    color: #ffffff;
    height: 50px;
    font-size: 25px;
    text-align: center;
    float: right;
    width: 50px;
    position: relative;
    -webkit-transition: background 0.5s;
    -moz-transition: background 0.5s;
    -o-transition: background 0.5s;
    transition: background 0.5s;
}

.mobile-inner-header-icon:hover {
    background-color: rgba(255,255,255,0.2);
    cursor: pointer;
}

.mobile-inner-header-icon span {
    position: absolute;
    left: calc((100% - 25px) / 2);
    top: calc((100% - 1px) / 2);
    width: 25px;
    height: 1px;
    background-color: #8a8a8a;
}

.mobile-inner-header-icon span:nth-child(1) {
    transform: translateY(4px) rotate(0deg);
}

.mobile-inner-header-icon span:nth-child(2) {
    transform: translateY(-4px) rotate(0deg);
}

.mobile-inner-header-icon-click span:nth-child(1) {
    animation-duration: 0.5s;
    animation-fill-mode: both;
    animation-name: clickfirst;
}

.mobile-inner-header-icon-click span:nth-child(2) {
    animation-duration: 0.5s;
    animation-fill-mode: both;
    animation-name: clicksecond;
}

@keyframes clickfirst {
    0% {
        transform: translateY(4px) rotate(0deg);
    }

    100% {
        transform: translateY(0) rotate(45deg);
    }
}

@keyframes clicksecond {
    0% {
        transform: translateY(-4px) rotate(0deg);
    }

    100% {
        transform: translateY(0) rotate(-45deg);
    }
}

.mobile-inner-header-icon-out span:nth-child(1) {
    animation-duration: 0.5s;
    animation-fill-mode: both;
    animation-name: outfirst;
}

.mobile-inner-header-icon-out span:nth-child(2) {
    animation-duration: 0.5s;
    animation-fill-mode: both;
    animation-name: outsecond;
}

@keyframes outfirst {
    0% {
        transform: translateY(0) rotate(-45deg);
    }

    100% {
        transform: translateY(-4px) rotate(0deg);
    }
}

@keyframes outsecond {
    0% {
        transform: translateY(0) rotate(45deg);
    }

    100% {
        transform: translateY(4px) rotate(0deg);
    }
}

.mobile-inner-nav {
    overflow: auto;
    height: 100vh;
    padding-top: 50px;
}

.mobile-inner-nav {
    background: rgb(107 107 107);
    width: 100%;
    position: absolute;
    top: 0;
    padding-bottom: 0%;
    display: none;
    z-index: 444;
}

.mobile-inner-nav a {
    border-bottom: solid 1px rgba(255,255,255,0.3);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    color: #fff;
    transition: all 0.5s;
}

.mobile-inner-nav dl {
    display: none;
}

.mobile-inner-nav dl dd {
    line-height: 33px;
    text-decoration: none;
    text-indent: 3em;
    font-size: 16px;
    color: #FFFFFF;
    border-bottom: solid 1px rgba(255,255,255,0.3);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    font-weight: 300;
    font-size: 14px;
}

.mobile-inner-nav li {
    border-bottom: solid 1px rgba(255,255,255,0.3);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    line-height: 53px;
    text-indent: 20px;
}

.mobile-inner-nav h2.h2tit {
    line-height: 50px;
    text-decoration: none;
    text-indent: 2em;
    font-size: 16px;
    color: #FFFFFF;
    /* border-bottom:solid 1px rgba(255,255,255,0.3);*/
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    font-weight: 300;
}

.mobile-inner-nav h2.h2tit a {
    color: #FFFFFF;
}

.mobile-inner-nav a {
    border-bottom: none;
}

.mobile-inner-nav li {
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: returnToNormal;
    animation-name: returnToNormal;
}

@-webkit-keyframes resize {
    from,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(0.215,0.610,0.355,1.000);
        animation-timing-function: cubic-bezier(0.215,0.610,0.355,1.000);
    }

    0% {
        opacity: 0;
        -webkit-transform: scale(5,5);
        transform: scale(5,5);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
    }
}

@keyframes resize {
    from,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(0.215,0.610,0.355,1.000);
        animation-timing-function: cubic-bezier(0.215,0.610,0.355,1.000);
    }

    0% {
        opacity: 0;
        -webkit-transform: scale(5,5);
        transform: scale(5,5);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
    }
}

@-webkit-keyframes returnToNormal {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes returnToNormal {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.mobile-inner-nav li:last-child h2.h2tit {
    border-bottom: none;
}

.mobile-inner-nav li .h3tit {
    height: 50px;
    position: relative;
    background: url(../images/51_icon_search@2x.png) no-repeat 30px center;
    background-size: 17px;
}

.mobile-inner-nav li .words {
    display: block;
    width: 100%;
    height: 100%;
    border: none;
    background: none;
    text-indent: 60px;
    font-size: 15px;
    color: #fff;
    background: url(../images/search2.png) no-repeat 30px center;
    background-size: 20px;
}

.mobile-inner-nav li:last-child {
    border-bottom: none;
}

.mobile-inner-nav li form {
    display: block;
    width: 100%;
    height: 100%;
}

@charset "utf-8";@charset "UTF-8";.animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}

.animated.infinite {
    animation-iteration-count: infinite;
}

.animated.hinge {
    animation-duration: 2s;
}

.fadeInUp {
    animation-duration: 1.76s;
    animation-name: fadeInUp;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0,40px,0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

* {
    font-family: "HarmonyOS Sans SC" !important;
}

body,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,th,td,p,blockquote,pre,form,fieldset,legend,input,button,textarea,hr,span {
    margin: 0;
    padding: 0;
}

html {
    font-size: 62.5%;
}

body {
    font-size: calc(14/1920*100vw);
}

html,body {
    -moz-user-select: none;
    -khtml-user-select: none;
    user-select: none;
}

body {
    font-family: "Microsoft YaHei" ! important;
    color: #000000;
    background: #fff;
    margin: 0 auto;
    padding: 0px;
}

body {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

select {
    cursor: pointer;
}

input[type="button"],input[type="submit"],input[type="reset"],input[type="text"] {
    -webkit-appearance: none;
}

input[type="button"],input[type="submit"],input[type="reset"] {
    cursor: pointer;
}

input {
    -webkit-appearance: none;
}

input {
    -webkit-appearance: none!important;
    border-radius: 0;
}

button {
    cursor: pointer;
}

textarea {
    -webkit-appearance: none;
}

a {
    text-decoration: none;
    color: #235aa7;
    outline: none;
}

a:active {
    star: expression(this.onFocus=this.blur());
}

img {
    border: 0px;
    vertical-align: middle;
}

li {
    list-style: none;
}

* {
    outline: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

a:active {
    text-decoration: none;
}

.loading {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 99999;
}

.loadingfa {
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 29px;
    color: #1f8adf;
    position: absolute;
    left: 50%;
    margin-top: -25px;
    margin-left: -25px;
    top: 50%;
}

html {
    -webkit-overflow-scrolling: touch;
    -webkit-tap-highlight-color: none;
}

html {
    -webkit-tap-highlight-color: transparent;
}

body {
    -webkit-overflow-scrolling: touch;
    /* background:#000;*/
    /* color:#fff;*/
    line-height: 1;
}

* {
    padding: 0;
    margin: 0;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: transparent;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    user-select: none;
}

@keyframes rotate {
    from {
        -webkit-transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(360deg)
    }
}

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(360deg)
    }
}

@-moz-keyframes rotate {
    from {
        -moz-transform: rotate(0deg)
    }

    to {
        -moz-transform: rotate(360deg)
    }
}

@-ms-keyframes rotate {
    from {
        -ms-transform: rotate(0deg)
    }

    to {
        -ms-transform: rotate(360deg)
    }
}

@-o-keyframes rotate {
    from {
        -o-transform: rotate(0deg)
    }

    to {
        -o-transform: rotate(360deg)
    }
}

.xuanzhuan {
    animation: 2s linear 0s normal forwards infinite rotate;
    -webkit-animation: 2s linear 0s normal forwards infinite rotate;
    -moz-animation: 2s linear 0s normal forwards infinite rotate;
    -o-animation: 2s linear 0s normal forwards infinite rotate;
}

.xuanzhuan img {
    display: block;
    width: 100%;
}

.pc {
    display: block;
}

.wap {
    display: none;
}

.clearflex:after {
    content: "";
    display: table;
    clear: both;
}

.moveAni {
    animation: move .8s infinite;
    -moz-animation: move .8s infinite;
    -webkit-animation: move .8s infinite;
    -o-animation: move .8s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
    animation-timing-function: cubic-bezier(0.46,0.02,0.97,0.36);
    -webkit-animation-timing-function: cubic-bezier(0.46,0.02,0.97,0.36);
}

.tadaAni {
    animation: tada 2s infinite;
}

.pulseAni {
    animation: pulse 1s infinite;
}

.bounceInAni {
    animation: bounceIn 2s infinite;
}

.flashInAni {
    animation: flash 2s infinite;
}

.swingAni {
    animation: swing 2s infinite;
    transform-origin: right top;
}

.rubberBandAni {
    animation: rubberBand 1s infinite;
}

.bounceAni {
    animation: bounce 1s infinite;
}

.tdAni {
    animation: td .4s infinite;
    -moz-animation: td .4s infinite;
    -webkit-animation: td .4s infinite;
    -o-animation: td .4s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
    animation-timing-function: cubic-bezier(0.46,0.02,0.97,0.36);
    -webkit-animation-timing-function: cubic-bezier(0.46,0.02,0.97,0.36);
}

.heartbeatAni {
    animation: heartbeat 1.4s infinite;
    -moz-animation: heartbeat 1.4s infinite;
    -webkit-animation: heartbeat 1.4s infinite;
    -o-animation: heartbeat 1.4s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
    animation-timing-function: cubic-bezier(0.46,0.02,0.97,0.36);
    -webkit-animation-timing-function: cubic-bezier(0.46,0.02,0.97,0.36);
}

.shing {
    animation: shing 1s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
}

@keyframes shing {
    0% {
        opacity: 1;
    }

    100% {
        opacity: .6;
    }
}

@keyframes move2 {
    0% {
        transform: translate(0%,0px);
    }

    100% {
        transform: translate(0%,10px);
    }
}

.moveAni2 {
    animation: move2 1s infinite;
}

.moveAni {
    animation: move .8s infinite;
    -moz-animation: move .8s infinite;
    -webkit-animation: move .8s infinite;
    -o-animation: move .8s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
    animation-timing-function: cubic-bezier(0.46,0.02,0.97,0.36);
    -webkit-animation-timing-function: cubic-bezier(0.46,0.02,0.97,0.36);
}

@keyframes move {
    from {
        -o-transform: translate(0%,0%);
        -webkit-transform: translate(0%,0%);
        -moz-transform: translate(0%,0%);
        -ms-transform: translate(0%,0%);
        transform: translate(0%,0%);
    }

    to {
        -o-transform: translate(0%,30px);
        -webkit-transform: translate(0%,30px);
        -moz-transform: translate(0%,30px);
        -ms-transform: translate(0%,30px);
        transform: translate(0%,30px);
    }
}

@keyframes td {
    from {
        -o-transform: translate(0%,0%);
        -webkit-transform: translate(0%,0%);
        -moz-transform: translate(0%,0%);
        -ms-transform: translate(0%,0%);
        transform: translate(0%,0%);
    }

    to {
        -o-transform: translate(0%,20px);
        -webkit-transform: translate(0%,20px);
        -moz-transform: translate(0%,20px);
        -ms-transform: translate(0%,20px);
        transform: translate(0%,20px);
    }
}

@keyframes heartbeat {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    14% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    28% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    42% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    70% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes moveAni2 {
    0% {
        transform: translate(0%,0px);
    }

    100% {
        transform: translate(100vw,0px);
    }
}

.moveAni2 {
    animation: moveAni2 5.5s linear infinite;
}

@keyframes scrollAni1 {
    0% {
        transform: translate(0%,0px) rotate(0);
    }

    100% {
        transform: translate(-100%,0px) rotate(-360deg);
    }
}

.scrollAni1 {
    animation: scrollAni1 1.8s infinite;
    -moz-animation: scrollAni1 1.8s infinite;
    -webkit-animation: scrollAni1 1.8s infinite;
    -o-animation: scrollAni1 1.8s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
}

@keyframes scrollAni2 {
    0% {
        transform: translate(30%,0px) rotate(0);
    }

    100% {
        transform: translate(0%,0px);
    }
}

.scrollAni2 {
    animation: scrollAni2 1.8s infinite;
    -moz-animation: scrollAni2 1.8s infinite;
    -webkit-animation: scrollAni2 1.8s infinite;
    -o-animation: scrollAni2 1.8s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
    animation-timing-function: linear;
}

@keyframes scrollAni3 {
    0% {
        transform: translate(0%,-20px);
    }

    100% {
        transform: translate(0%,0%);
    }
}

.scrollAni3 {
    animation: scrollAni3 1.8s infinite;
    -moz-animation: scrollAni3 1.8s infinite;
    -webkit-animation: scrollAni3 1.8s infinite;
    -o-animation: scrollAni3 1.8s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
    animation-timing-function: linear;
}

@keyframes scrollAni4 {
    0% {
        transform: translate(0%,10px);
    }

    100% {
        transform: translate(0%,0%);
    }
}

.scrollAni4 {
    animation: scrollAni4 1.8s infinite;
    -moz-animation: scrollAni4 1.8s infinite;
    -webkit-animation: scrollAni4 1.8s infinite;
    -o-animation: scrollAni4 1.8s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
    animation-timing-function: linear;
}

@keyframes scrollAni5 {
    0% {
        transform: none;
    }

    100% {
        transform: scale(1.35,1.35);
    }
}

.scrollAni5 {
    animation: scrollAni5 1.8s infinite;
    -moz-animation: scrollAni5 1.8s infinite;
    -webkit-animation: scrollAni5 1.8s infinite;
    -o-animation: scrollAni5 1.8s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
    animation-timing-function: linear;
}

@keyframes scrollAni6 {
    0% {
        transform: scale(1.05,1.05);
    }

    100% {
        transform: none;
    }
}

.scrollAni6 {
    animation: scrollAni6 1.8s infinite;
    -moz-animation: scrollAni6 1.8s infinite;
    -webkit-animation: scrollAni6 1.8s infinite;
    -o-animation: scrollAni6 1.8s infinite;
    animation-direction: alternate;
    -webkit-animation-direction: alternate;
    animation-timing-function: linear;
}

@keyframes bubbleMover3 {
    0% {
        -webkit-transform: translateY(0px) translateX(0) rotate(0);
        transform: translateY(0px) translateX(0) rotate(0);
    }

    30% {
        transform: translateY(5px) translateX(4px) rotate(9deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
    }

    50% {
        transform: translateY(-3px) translateX(1px) rotate(-6deg);
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
    }

    80% {
        transform: translateY(-1px) translateX(-5px) rotate(-2deg);
        -webkit-transform-origin: left top;
        transform-origin: left top;
    }

    100% {
        -webkit-transform: translateY(0px) translateX(0) rotate(0);
        transform: translateY(0px) translateX(0) rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
    }
}

@keyframes bubbleMover2 {
    0% {
        -webkit-transform: translateY(0px) translateX(0) rotate(0);
        transform: translateY(0px) translateX(0) rotate(0);
    }

    30% {
        transform: translateY(5px) translateX(4px) rotate(5deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
    }

    50% {
        transform: translateY(-4px) translateX(2px) rotate(-3deg);
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
    }

    80% {
        transform: translateY(-3px) translateX(-3px) rotate(-3deg);
        -webkit-transform-origin: left top;
        transform-origin: left top;
    }

    100% {
        -webkit-transform: translateY(0px) translateX(0) rotate(0);
        transform: translateY(0px) translateX(0) rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
    }
}

@keyframes bubbleMover {
    0% {
        transform: translateY(0px) translateX(0) rotate(0);
    }

    30% {
        transform: translateY(3px) translateX(5px) rotate(5deg);
        -webkit-transform-origin: center center;
        transform-origin: center center;
    }

    50% {
        transform: translateY(5px) translateX(10px) rotate(10deg);
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
    }

    80% {
        transform: translateY(3px) translateX(5px) rotate(4deg);
        -webkit-transform-origin: left top;
        transform-origin: left top;
    }

    100% {
        transform: translateY(0px) translateX(0) rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
    }
}

@keyframes rotateAni {
    0% {
        transform: none;
    }

    100% {
        transform: rotateY(180deg);
    }
}

.rotateAni {
    -webkit-animation: rotateAni linear infinite 2s;
    -moz-animation: rotateAni linear infinite 2s;
    -o-animation: rotateAni linear infinite 2s;
    animation: rotateAni linear infinite 2s;
}

.pfAni1 {
    -webkit-animation: bubbleMover linear infinite 5s;
    -moz-animation: bubbleMover linear infinite 5s;
    -o-animation: bubbleMover linear infinite 5s;
    animation: bubbleMover linear infinite 5s;
}

.pfAni2 {
    -webkit-animation: bubbleMover2 linear infinite 5s;
    -moz-animation: bubbleMover2 linear infinite 5s;
    -o-animation: bubbleMover2 linear infinite 5s;
    animation: bubbleMover2 linear infinite 5s;
}

.pfAni3 {
    -webkit-animation: bubbleMover3 linear infinite 5s;
    -moz-animation: bubbleMover3 linear infinite 5s;
    -o-animation: bubbleMover3 linear infinite 5s;
    animation: bubbleMover3 linear infinite 5s;
}

@keyframes scalc {
    0% {
        -webkit-transform: scale(2.05,2.05);
        -o-transform: scale(2.05,2.05);
        -moz-transform: scale(2.05,2.05);
        -ms-transform: scale(2.05,2.05);
        transform: scale(2.05,2.05);
    }

    100% {
        -webkit-transform: none;
        -o-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        transform: none;
    }
}

.sclani {
    animation: scalc 7s forwards;
    animation-timing-function: ease-out;
}

@keyframes scalc2 {
    0% {
        transform: scale(1.2,1.2);
    }

    100% {
        -webkit-transform: none;
        -o-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        transform: none;
    }
}

.sclani2 {
    animation: scalc2 7s forwards;
    animation-timing-function: ease-out;
}

@keyframes clipAni {
    0% {
        clip: rect(auto,0,auto,auto);
    }

    100% {
        clip: rect(auto,300px,auto,auto);
    }
}

.txtModel i {
    animation: clipAni ease-out infinite 2s alternate;
}

.swingAni {
    transform-origin: top center;
    animation: swing 3s infinite ease-in-out;
}

@keyframes swing {
    0% {
        transform: rotate(-6deg);
    }

    50% {
        transform: rotate(6deg);
    }

    100% {
        transform: rotate(-6deg);
    }
}

.swingAni2 {
    -webkit-animation-name: routate;
    -webkit-animation-duration: 4s;
    -webkit-animation-iteration-count: infinite;
    animation-name: routate;
    animation-duration: 5s;
    animation-iteration-count: infinite;
}

@keyframes routate {
    0% {
        -webkit-transform: rotate(7deg);
        -ms-transform: rotate(7deg);
        transform: rotate(7deg);
    }

    50% {
        -webkit-transform: rotate(-7deg);
        -ms-transform: rotate(-7deg);
        transform: rotate(-7deg);
    }

    100% {
        -webkit-transform: rotate(7deg);
        -ms-transform: rotate(7deg);
        transform: rotate(7deg);
    }
}

.bouncing-ball {
    -webkit-mask: radial-gradient(ellipse at center,rgba(0,0,0,0) 0%,rgba(0,0,0,0) 20%,black 20.1%,black 75%,black 100%);
    mask: radial-gradient(ellipse at center,rgba(0,0,0,0) 0%,rgba(0,0,0,0) 20%,black 20.1%,black 75%,black 100%);
    -webkit-animation: bouncing-ball 1.5s linear infinite;
    animation: bouncing-ball 1.5s linear infinite;
}

@keyframes bouncing-ball {
    0% {
        transform: scale(1,1) translateY(-80%);
    }

    25% {
        transform: scale(1,1.1) translateY(-45%);
    }

    50% {
        transform: scale(1,1.5) translateY(10%);
    }

    66% {
        transform: scale(2,0.75) translateY(25%);
    }

    75% {
        transform: scale(1,1.25) translateY(10%);
    }

    100% {
        transform: scale(1,1) translateY(-80%);
    }
}

.small_Big {
    -webkit-animation: scaleCircles 2s infinite cubic-bezier(0.55,0.15,0.45,0.85) alternate;
    animation: scaleCircles 2s infinite cubic-bezier(0.55,0.15,0.45,0.85) alternate;
}

@keyframes scaleCircles {
    0% {
        z-index: 1;
        transform: scale3d(0,0,0);
    }

    100% {
        z-index: 2;
        transform: scale3d(1,1,1);
    }
}

.index * {
    opacity: 1;
}

.index {
    overflow: hidden;
}

.wrap:after {
    content: "";
    display: table;
    clear: both;
}

.fadeInUpGroup.animated {
    animation-fill-mode: both;
    animation-name: fadeInLeft3;
    opacity: 0;
}

.fadeInUpGroup.animated:nth-child(1) {
    animation-duration: .5s !important;
    animation-delay: .1s !important;
}

.fadeInUpGroup.animated:nth-child(2) {
    animation-duration: 1s !important;
    animation-delay: .6s !important;
}

.fadeInUpGroup.animated:nth-child(3) {
    animation-duration: 1.5s !important;
    animation-delay: .9s !important;
}

.fadeInUpGroup.animated:nth-child(4) {
    animation-duration: 2s !important;
    animation-delay: 1.1s !important
}

.fadeInUpGroup.animated:nth-child(5) {
    animation-duration: 1.5s !important;
    animation-delay: 1.6s !important;
}

/* ================= å¸ƒå±€å®¹å™¨ ================= */
/* ä¸­é—´å†…å®¹åŒº 1400pxï¼ŒåŸºå‡† 1920px */
.container {
    width: calc(1440 / 1920 * 100vw);
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

/* ================= Header ================= */
.header {
    width: 100%;
    height: calc(80 / 1920 * 100vw);
    position: fixed;
    /* æˆ–è€… fixed */
    z-index: 100;
    box-shadow: 0 1px 2px -1px rgba(0,0,0,0.10);
    background: url(../images/head.png) repeat-x left center;
    background-size: cover;
    left: 0;
    top: 0;
    background: rgba(255,255,255,0.80);
    box-shadow: 0 1px 2px -1px rgba(0,0,0,0.10);
    backdrop-filter: blur(15px);
}

.header .container {
    height: 100%;
}

.header-inner {
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo img {
    height: calc(50 / 1920 * 100vw);
    width: auto;
    display: block;
}

.nav ul li dl:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 calc(5 / 1920 * 100vw) calc(5 / 1920 * 100vw) calc(5 / 1920 * 100vw);
    border-color: transparent transparent #fff transparent;
    position: absolute;
    top: calc(-5 / 1920 * 100vw);
    left: 50%;
    -o-transform: translate(-50%,0%);
    -webkit-transform: translate(-50%,0%);
    -moz-transform: translate(-50%,0%);
    -ms-transform: translate(-50%,0%);
    transform: translate(-50%,0%);
}

.nav ul li:hover dl {
    top: calc(40 / 1920 * 100vw);
    visibility: visible;
    opacity: 1;
    z-index: 5;
}

.nav ul li dl {
    position: absolute;
    background: #fff;
    width: calc(310 / 1920 * 100vw);
    left: -50%;
    padding: calc(12/ 1920 * 100vw) 0;
    top: calc(50 / 1920 * 100vw);
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
    visibility: hidden;
    opacity: 0;
    z-index: -1;
    -webkit-box-shadow: 0px 12px 24px 0px rgba(0,0,0,0.09);
    -moz-box-shadow: 0px 12px 24px 0px rgba(0,0,0,0.09);
    -o-box-shadow: 0px 12px 24px 0px rgba(0,0,0,0.09);
    -ms-box-shadow: 0px 12px 24px 0px rgba(0,0,0,0.09);
    box-shadow: 0px 12px 24px 0px rgba(0,0,0,0.09);
    position: absolute;
    left: 50%;
    -o-transform: translate(-50%, 0%);
    -webkit-transform: translate(-50%, 0%);
    -moz-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
}

.nav ul li dl dd a {
    display: block;
    text-align: center;
    line-height: 2.5;
}

.nav ul li {
    position: relative;
}

.nav ul {
    display: flex;
    gap: calc(40 / 1920 * 100vw);
}

.nav a {
    font-size: 16px;
    color: #333;
    font-weight: 500;
    transition: color 0.3s;
    color: #101828;
    font-family: "HarmonyOS Sans SC";
    font-weight: normal;
}

.nav a .fa-house {
    width: calc(16 / 1920 * 100vw);
    height: calc(16 / 1920 * 100vw);
    background: url(../images/home.png) no-repeat center center;
    background-size: 100%;
    display: inline-block;
}

.nav .h2tit {
    position: relative;
    display: flex;
    align-items: center;
    gap: calc(8 / 1920 * 100vw);
}

.mobile-inner-nav .h2tit {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 10px;
}

.mobile-inner-nav .nav-dropdown-icon {
    width: 24px;
    height: 24px;
    background: url(../images/xia.png) no-repeat center center;
    background-size: 100%;
    display: inline-block;
    transition: transform 0.3s;
    transform: rotate(0deg);
}

.mobile-inner-nav li:hover .nav-dropdown-icon,
.mobile-inner-nav li.active .nav-dropdown-icon,
.mobile-inner-nav .nav-dropdown-icon.rotated {
    transform: rotate(180deg);
}

.nav li:hover> a, .nav li.active > a, .nav dl a:hover {
    color: #FF5700;
    /* æ©™è‰² */
}

.lang-switch dl:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 calc(5 / 1920 * 100vw) calc(5 / 1920 * 100vw) calc(5 / 1920 * 100vw);
    border-color: transparent transparent #fff transparent;
    position: absolute;
    top: calc(-5 / 1920 * 100vw);
    left: 50%;
    -o-transform: translate(-50%,0%);
    -webkit-transform: translate(-50%,0%);
    -moz-transform: translate(-50%,0%);
    -ms-transform: translate(-50%,0%);
    transform: translate(-50%,0%);
}

.lang-switch:hover dl {
    visibility: visible;
    opacity: 1;
    z-index: 5;
    top: calc(48/ 1920 * 100vw);
}

.lang-switch dl {
    position: absolute;
    width: 100%;
    background: #fff;
    left: 0;
    top: calc(58/ 1920 * 100vw);
    border-radius: calc(7/ 1920 * 100vw);
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
    visibility: hidden;
    opacity: 0;
    z-index: -1;
    -webkit-box-shadow: 0px 12px 24px 0px rgba(0,0,0,0.09);
    -moz-box-shadow: 0px 12px 24px 0px rgba(0,0,0,0.09);
    -o-box-shadow: 0px 12px 24px 0px rgba(0,0,0,0.09);
    -ms-box-shadow: 0px 12px 24px 0px rgba(0,0,0,0.09);
    box-shadow: 0px 12px 24px 0px rgba(0,0,0,0.09);
}

.lang-switch dl dd a {
    font-size: calc(16/ 1920 * 100vw);
    color: #333;
}

.lang-switch {
    font-size: calc(16 / 1920 * 100vw);
    color: #666;
    padding: calc(2 / 1920 * 100vw) calc(8 / 1920 * 100vw);
    border-radius: 4px;
    cursor: pointer;
    width: calc(38/ 1920 * 100vw);
    line-height: calc(38/ 1920 * 100vw);
    background: #fff;
    padding: 0;
    text-align: center;
    border-radius: calc(8/ 1920 * 100vw);
    position: relative;
}

.mobile-menu-btn {
    display: none;
}

/* ================= Hero Section ================= */
.hero .banner {
    position: relative;
    z-index: 1;
}

.hero .swiper-pagination {
    height: 4px;
    top: auto;
    bottom: 0;
    right: auto;
    height: 4px;
    bottom: 6vw;
    left: auto;
    position: absolute;
    left: 50%;
    -o-transform: translate(-50%,0%);
    -webkit-transform: translate(-50%,0%);
    -moz-transform: translate(-50%,0%);
    -ms-transform: translate(-50%,0%);
    transform: translate(-50%,0%);
    width: calc(1440 / 1920 * 100vw);
    text-align: left;
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    transition: all 0.4s;
}

.hero .swiper-pagination * {
    width: calc(189/ 1920 * 100vw);
    margin: 0 !important;
    height: calc(3/ 1920 * 100vw);
    background: #fff;
    margin-right: calc(20 / 1920 * 100vw) !important;
    border-radius: 0;
}

.hero {
    position: relative;
    width: 100%;
    /* ä¿æŒå…¨å±æˆ–å¤§å›¾é«˜åº¦ */
    /* display:flex;*/
    align-items: center;
}

.hero-bg {
    top: 0;
    left: 0;
    width: 100%;
    height: calc(800/1920*100vw);
    /* æ›¿æ¢ä¸ºå·¥åŽ‚èƒŒæ™¯å›¾ */
    background-image: url('../images/88b4af85e1c343bfa798960ebc6ef81d.gif');
    background-size: cover;
    background-position: center;
    z-index: 0;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* é»‘è‰²é®ç½©ï¼Œè®©ç™½å­—æ¸…æ™° */
    /*background-color: rgba(0,0,0,0.6); */
    z-index: 1;
    /*background: rgba(4,11,18,0.60);*/
    z-index: 2;
}

.relative-z {
    position: relative;
    z-index: 2;
    position: absolute;
    top: 50%;
    left: 50%;
    -o-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    z-index: 6;
}

.hero-content {
    color: #fff;
    width: 60%;
    /* å†…å®¹å å·¦ä¾§ */
    padding-top: calc(90/1920*100vw);
}

.hero-title {
    font-size: calc(60 / 1920 * 100vw);
    font-weight: 900;
    line-height: 1.3;
    margin-bottom: calc(16/ 1920 * 100vw);
}

.hero-title .orange {
    color: #FF7100;
}

.hero-subtitle {
    font-size: calc(24 / 1920 * 100vw);
    font-weight: 400;
    margin-bottom: calc(80/ 1920 * 100vw);
    opacity: 0.9;
}

.hero-line {
    width: calc(100 / 1920 * 100vw);
    height: 4px;
    background-color: #fff;
    /* æˆ–è€…æ©™è‰² */
    margin-bottom: calc(40 / 1920 * 100vw);
}

.btn-hero {
    display: inline-flex;
    align-items: center;
    color: #fff;
    font-size: calc(18 / 1920 * 100vw);
    font-weight: normal;
    border-radius: calc(30 / 1920 * 100vw);
    /* åœ†è§’æŒ‰é’® */
    transition: background 0.3s;
    border-radius: 21104000px;
    background: url(../images/arrow-right-circle.png) no-repeat calc(205/ 1920 * 100vw) center #FF7100;
    width: calc(253/ 1920 * 100vw);
    line-height: calc(56/ 1920 * 100vw);
    padding-left: calc(24/ 1920 * 100vw);
    background-size: calc(36/ 1920 * 100vw);
}

.btn-hero:hover {
    background-color: #e04e00;
}

/* ================= Solutions Section ================= */
.solutions-section {
    padding: calc(160 / 1920 * 100vw) 0 calc(120 / 1920 * 100vw);
    background: #F9F9F9;
    /* æµ…ç°åº•è‰²ï¼Œçªæ˜¾ç™½è‰²å¡ç‰‡ */
}

/* --- Header --- */
.news-section .sec-header {
    align-items: flex-end;
}

.sec-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    /* åº•éƒ¨å¯¹é½ */
    margin-bottom: calc(24/ 1920 * 100vw);
    align-items: center;
}

.sec-title {
    font-size: calc(48 / 1920 * 100vw);
    color: #000;
    margin-bottom: calc(10 / 1920 * 100vw);
}

.sec-en {
    font-size: calc(36/ 1920 * 100vw);
    color: #DBDBDB;
    font-weight: 300;
    font-family: "Instagram Sans";
    line-height: 1.3;
}

.btn-more-text i {
    display: inline-block;
    background: url(../images/more.png) no-repeat center center;
    background-size: 100%;
    w\: calc(16 / 1920 * 100vw);
    width: calc(20/ 1920 * 100vw);
    height: calc(20/ 1920 * 100vw);
}

.btn-more-text {
    font-size: calc(16 / 1920 * 100vw);
    color: #FF5700;
    /* font-weight:bold;*/
    display: flex;
    align-items: center;
    color: #E87011;
    gap: 8px;
}

/* --- Grid --- */
.solutions-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: calc(16/ 1920 * 100vw);
    /* å¡ç‰‡é—´è· */
    display: flex;
}

/* å¡ç‰‡é€šç”¨æ ·å¼ */
.sol-card {
    background-color: #fff;
    /* é«˜åº¦å®šé«˜ï¼Œä¿æŒæ•´é½ï¼Œç›®æµ‹å¤§æ¦‚æ˜¯å®½åº¦çš„ 1.2å€ */
    height: calc(467/ 1920 * 100vw);
    position: relative;
    padding: calc(32 / 1920 * 100vw) calc(16/ 1920 * 100vw);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    /* å†…å®¹æ²‰åº• */
    transition: all 0.3s;
    overflow: hidden;
    /* é˜²æ­¢èƒŒæ™¯å›¾æ ‡æº¢å‡º */
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    flex: 1;
    cursor: pointer;
}

.swiper-slide-active .sol-card,
.sol-card:hover {
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}


.swiper-slide-active .sol-card,
.sol-card:hover,.sol-card.active {
    background: #E87011;
    color: #fff;
    flex: 1.6;
}

.swiper-slide-active .sol-card .card-link,
.sol-card.active .card-link,
.sol-card:hover .card-link {
    color: #fff;
    background: url(../images/more2.png) no-repeat right center;
    background-size: calc(20 / 1920 * 100vw);
}

.swiper-slide-active .sol-card .deco-line,
.sol-card.active .deco-line {
    background-color: #fff;
}


.swiper-slide-active .sol-card  .card-bg-icon .bg,
.sol-card.active .card-bg-icon .bg,
.sol-card:hover .card-bg-icon .bg {
    opacity: 1;
    transform: translate(0%,0%);
}

.card-bg-icon .bg {
    height: 100%;
    position: absolute;
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    transition: all 0.4s;
    opacity: 0;
    transform: translate(10%,0%);
}
.card-bg-icon .bg.default{
    opacity: 1;
}
.card-bg-icon .bg.current{
    opacity: 0;
}









.sol-card:hover .card-bg-icon .bg.default,
.sol-card.active .card-bg-icon .bg.default,
.swiper-slide-active .card-bg-icon .bg.default{
    opacity: 0;
}
.sol-card:hover .card-bg-icon .bg.current,
.sol-card.active .card-bg-icon .bg.current,
.swiper-slide-active .card-bg-icon .bg.current{
    opacity: 1;
}



.card-bg-icon .bg.fa1 {
    left: auto;
    top: calc(119/1920*100vw);
    width: calc(431/1920*100vw);
    height: calc(143/1920*100vw);
    background-size: auto 100% !important;
    right: 0;
}

.card-bg-icon .bg.fa2 {
    left: auto;
    top: calc(-8 / 1920 * 100vw);
    width: calc(306/ 1920 * 100vw);
    height: calc(281/ 1920 * 100vw);
    background-size: auto 100% !important;
    right: 0;
}

.card-bg-icon .bg.fa3 {
    left: auto;
    top: calc(13 / 1920 * 100vw);
    width: calc(397/ 1920 * 100vw);
    height: calc(295 / 1920 * 100vw);
    background-size: auto 100% !important;
    right: calc(13 / 1920 * 100vw);
}

.card-bg-icon .bg.fa4 {
    left: auto;
    top: calc(113 / 1920 * 100vw);
    width: 94%;
    height: calc(169/ 1920 * 100vw);
    background-size: auto 100% !important;
    right: calc(13 / 1920 * 100vw);
}

.card-bg-icon {
    position: absolute;
    top: 0;
    left: 0;
    transform: 0;
    font-size: 0;
    /* å›¾æ ‡è¶…å¤§ */
    /* åŠé€æ˜Žç™½ */
    width: 100%;
    height: 100%;
}

/* å¦‚æžœæ˜¯ç”¨å›¾ç‰‡ */
.card-bg-icon img {
    width: 100%;
    opacity: 0.3;
}

/* å¡ç‰‡å†…å®¹ */
.card-content {
    position: relative;
    z-index: 2;
    color: #000;
    cursor: pointer;
}

.deco-line {
    width: calc(40 / 1920 * 100vw);
    height: 2px;
    background-color: #E87019;
    /* é»˜è®¤æ©™è‰²çº¿ */
    margin-bottom: calc(20 / 1920 * 100vw);
    display: none;
}

.swiper-slide-active .sol-card .card-title,
.sol-card:hover .card-title,.active .card-title {
    color: #fff;
}

.card-title {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: calc(30 / 1920 * 100vw);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.card-link i {
}

.card-link {
    display: inline-block;
    font-size: calc(16 / 1920 * 100vw);
    align-items: center;
    transition: opacity 0.3s;
    color: #E87011;
    padding-right: calc(28/ 1920 * 100vw);
    background: url(../images/more1.png) no-repeat right center;
    background-size: calc(20/ 1920 * 100vw);
    line-height: calc(20/ 1920 * 100vw);
}

.card-link:hover {
    opacity: 0.8;
}

/* ================= About Section ================= */
.about-section {
    padding: calc(137/ 1920 * 100vw) 0 calc(150/ 1920 * 100vw);
    /* æ·±è“é»‘èƒŒæ™¯ */
    color: #fff;
    overflow: hidden;
    background: #0A1623;
}

/* å¤ç”¨æ ‡é¢˜æ ·å¼ï¼Œä½†è¿™å„¿æ˜¯ç™½è‰²çš„ */
.sec-title.white {
    color: #fff;
}

.sec-en.dark {
    color: #666;
    margin-bottom: calc(30 / 1920 * 100vw);
}

.about-top {
    /* display:flex;*/
    justify-content: space-between;
    align-items: center;
    margin-bottom: calc(141/ 1920 * 100vw);
    position: relative;
}

.about-text {
    width: calc(340/ 1920 * 100vw);
    /* æ–‡å­—éƒ¨åˆ†è¾ƒçª„ */
}

.about-desc {
    font-size: calc(16 / 1920 * 100vw);
    line-height: 1.8;
    margin-bottom: calc(40 / 1920 * 100vw);
    text-align: left;
    color: #929292;
}

.btn-more-round {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    /* æ·±ç°åº•æŒ‰é’® */
    font-size: calc(14 / 1920 * 100vw);
    transition: background 0.3s;
    border-radius: 21104000px;
    background: url(../images/more1.png) no-repeat calc(83/ 1920 * 100vw) center rgba(255,113,0,0.10);
    width: calc(111 / 1920 * 100vw);
    line-height: calc(32/ 1920 * 100vw);
    color: #E87011;
    padding-left: calc(12/ 1920 * 100vw);
    background-size: calc(20/ 1920 * 100vw);
}

.btn-more-round:hover {
    background-color: #444;
}

/* --- Map Area (æ ¸å¿ƒäº¤äº’) --- */
.map-wrapper {
    width: calc(1022/ 1920 * 100vw);
    position: relative;
    /* ä¿æŒåœ°å›¾æ¯”ä¾‹ */
    height: calc(513/ 1920 * 100vw);
    position: absolute;
    right: 0;
    top: calc(32/ 1920 * 100vw);
}

.map-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    /* åœ°å›¾ç‚¹é˜µå›¾ï¼ŒåŒ…å«é€æ˜ŽèƒŒæ™¯ */
    opacity: 0.6;
    /* ç¨å¾®æš—ä¸€ç‚¹ï¼Œçªæ˜¾äº®å…‰ç‚¹ */
}

/* äº¤äº’åœ†ç‚¹å®¹å™¨ */
.map-point {
    position: absolute;
    width: calc(10 / 1920 * 100vw);
    height: calc(10 / 1920 * 100vw);
    cursor: pointer;
    z-index: 10;
}

.map-point.point1 {
    left: 13%;
    top: 24%;
}

.map-point.point2 {
    left: 51%;
    top: 26%;
}

.map-point.point3 {
    left: 53%;
    top: 34%;
}

.map-point.point4 {
    left: 61%;
    top: 29%;
}

.map-point.point5 {
    left: 80%;
    top: 31%;
}

.map-point.point6 {
    left: 76%;
    top: 48%;
}

.map-point.point7 {
    left: 85%;
    top: 34%;
}

/* å®žå¿ƒåœ†ç‚¹ */
.point-dot {
    width: 100%;
    height: 100%;
    background-color: #FF7100;
    /* æ©™è‰² */
    border-radius: 50%;
    position: relative;
    z-index: 2;
    box-shadow: 0 0 10px #FF7100;
}

/* å‘¼å¸åŠ¨ç”»åœˆ */
.point-pulse {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 300%;
    height: 300%;
    border: 1px solid #FF7100;
    border-radius: 50%;
    opacity: 0;
    animation: pulse-ring 2s infinite;
    z-index: 1;
    background: #FF7100;
}

@keyframes pulse-ring {
    0% {
        transform: translate(-50%,-50%) scale(0.5);
        opacity: 0;
    }

    50% {
        opacity: 0.5;
    }

    100% {
        transform: translate(-50%,-50%) scale(1.5);
        opacity: 0;
    }
}

/* Tooltip ä¸‹æ‹‰å†…å®¹ */
.map-tooltip {
    position: absolute;
    top: 100%;
    /* åœ¨ç‚¹ä¸‹æ–¹ */
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    background-color: #fff;
    color: #333;
    padding: calc(15 / 1920 * 100vw);
    border-radius: calc(8 / 1920 * 100vw);
    width: calc(200 / 1920 * 100vw);
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    /* é»˜è®¤éšè— */
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s;
    /* å°ä¸‰è§’ç®­å¤´ */
    padding-bottom: calc(13 / 1920 * 100vw);
}

.map-tooltip::before {
    content: '';
    position: absolute;
    top: -6px;
    left: 50%;
    margin-left: -6px;
    border-width: 0 6px 6px;
    border-style: solid;
    border-color: transparent transparent #fff transparent;
}

.map-tooltip h4 {
    font-size: calc(16 / 1920 * 100vw);
    margin-bottom: calc(7/ 1920 * 100vw);
    color: #000;
}

.map-tooltip p {
    font-size: calc(12 / 1920 * 100vw);
    color: #666;
    line-height: 1.4;
}

/* æ‚¬åœæ˜¾ç¤º */
.map-point:hover .map-tooltip,.map-point .map-tooltip.show,.map-spot:hover .map-tooltip,.map-spot .map-tooltip.show {
    /* å…è®¸é€šè¿‡classå¼ºåˆ¶æ˜¾ç¤º */
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(15px);
    /* ç¨å¾®ä¸‹ç§»ä¸€ç‚¹ç‚¹ */
}

/* --- Stats Row --- */
.stats-row {
    display: flex;
    justify-content: space-between;
}

.stat-item:nth-child(1) {
    padding-left: 0px;
}

.stat-item {
    flex: 1;
    border-right: 1px solid rgba(255,255,255,0.1);
    padding-left: calc(32/ 1920 * 100vw);
    border-right: 1px solid rgba(198,198,198,0.30);
}

.stat-item:last-child {
    border-right: none;
}

.stat-num {
    font-size: calc(80 / 1920 * 100vw);
    font-weight: 900;
    color: #E87011;
    line-height: 1;
    margin-bottom: calc(10 / 1920 * 100vw);
    font-family: 'Arial Black',sans-serif;
}

.stat-num .plus,.stat-num .unit {
    font-size: calc(30 / 1920 * 100vw);
    vertical-align: super;
}

.stat-label {
    font-size: calc(30/ 1920 * 100vw);
    color: #fff;
}

/* ================= Service Section ================= */
.service-section {
    padding: calc(231/ 1920 * 100vw) 0 calc(246/ 1920 * 100vw);
    background-color: #fff;
}

.sec-title.black {
    color: #000;
}

.sec-en.light {
    color: #ccc;
    font-weight: 300;
}

.service-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: calc(12 / 1920 * 100vw);
}

/* --- ç¬¬ä¸€åˆ—ï¼šä»‹ç»æ–‡å­— --- */
.service-intro-col {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    /* é¡¶éƒ¨å¯¹é½ï¼Œæˆ–è€… center */
    width: calc(408/ 1920 * 100vw);
    padding-right: calc(97/ 1920 * 100vw);
}

.intro-desc {
    margin-top: calc(126/ 1920 * 100vw);
    font-size: calc(20/ 1920 * 100vw);
    line-height: 1.8;
    color: #929292;
}

/* --- åŽä¸‰åˆ—ï¼šæœåŠ¡å¡ç‰‡ --- */
.service-card {
    background-color: #fff;
    /* transition:transform 0.3s;*/
}

/* .service-card:hover {transform:translateY(-5px);}
*/
.svc-img {
    width: 100%;
    height: calc(210/ 1920 * 100vw);
    /* å›¾ç‰‡é«˜åº¦ */
    overflow: hidden;
    margin-bottom: calc(32/ 1920 * 100vw);
}

.svc-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.service-card:hover .svc-img img {
    transform: scale(1.05);
}

.svc-content {
    padding-right: calc(10 / 1920 * 100vw);
}

.svc-title {
    font-size: 16px;
    color: #0F2B51;
    /* æ·±è“æ ‡é¢˜ */
    margin-bottom: calc(8/ 1920 * 100vw);
    line-height: 1.7;
    font-weight: normal;
    display: block;
}

.svc-sub {
    display: block;
    font-size: 14px;
    color: #6A7282;
    margin-bottom: calc(8/ 1920 * 100vw);
}

.svc-text {
    font-size: calc(14 / 1920 * 100vw);
    color: #4A5565;
    line-height: 1.6;
    margin-bottom: calc(20 / 1920 * 100vw);
    
    /* é™åˆ¶è¡Œæ•°ï¼Œä¿æŒæ•´é½ */
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.svc-link {
    font-size: calc(24 / 1920 * 100vw);
    color: #FF5700;
    /* æ©™è‰²ç®­å¤´ */
    transition: transform 0.3s;
    display: inline-block;
    display: inline-block;
    width: calc(24 / 1920 * 100vw);
    height: calc(24 / 1920 * 100vw);
    background: url(../images/more1.png) no-repeat center center;
    background-size: 100%;
}

.svc-link:hover {
    transform: translateX(5px);
}

/* ================= FAQ Section ================= */
.faq-section {
    padding: calc(160 / 1920 * 100vw) 0;
    /* æµ…ç°èƒŒæ™¯ */
    background: #F9F9F9;
}

.faq-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

/* å·¦ä¾§æ ‡é¢˜ */
.faq-header {
    width: 25%;
}

/* å¤ç”¨ .sec-title.black å’Œ .sec-en.light */
/* å³ä¾§åˆ—è¡¨ */
.faq-list {
    width: calc(949/ 1920 * 100vw);
    display: flex;
    flex-direction: column;
    gap: calc(10 / 1920 * 100vw);
}

.faq-item {
    background-color: #fff;
    border-radius: calc(8 / 1920 * 100vw);
    overflow: hidden;
    transition: all 0.3s;
    /* é»˜è®¤ä¸æ¿€æ´»æ—¶çš„é˜´å½± */
    /* box-shadow:0 2px 5px rgba(0,0,0,0.05);*/
}

.faq-question {
    display: flex;
    align-items: center;
    padding: calc(16 / 1920 * 100vw);
    cursor: pointer;
    color: #0F2B51;
    line-height: calc(34/ 1920 * 100vw);
}

.q-icon {
    font-weight: 900;
    font-size: calc(20 / 1920 * 100vw);
    margin-right: calc(15 / 1920 * 100vw);
    /* é»˜è®¤é»‘è‰² */
}

.faq-question h3 {
    flex: 1;
    /* æ’‘æ»¡ä¸­é—´ */
    font-size: calc(20/ 1920 * 100vw);
    font-weight: 500;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.toggle-icon {
    width: calc(24 / 1920 * 100vw);
    height: calc(24 / 1920 * 100vw);
    border-radius: 50%;
    background-color: #FF7100;
    /* æ©™è‰²åœ†åœˆ */
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(20 / 1920 * 100vw);
}

/* --- æ¿€æ´»çŠ¶æ€ (å±•å¼€) --- */
.faq-item.active,.faq-item:hover {
    background-color: #FF5700;
    /* æ©™è‰²èƒŒæ™¯ */
    color: #fff;
    box-shadow: 0 5px 20px rgb(255 113 0 / 1%);
    background: #FF7100;
}

.faq-item.active .q-icon,.faq-item.active .faq-question h3,.faq-item:hover .q-icon,.faq-item:hover .faq-question h3 {
    color: #fff;
}

.faq-item.active .toggle-icon {
    background-color: #fff;
    /* ç™½è‰²åœ†åœˆ */
    color: #FF5700;
    /* æ©™è‰²å‰å· */
    transform: rotate(45deg);
}

.active .faq-answer {
    display: flex;
}

.faq-answer {
    padding: calc(16/ 1920 * 100vw);
    /* ä¸Š0ï¼Œå·¦å³ä¸‹æœ‰ */
    display: flex;
    /* ä¸ºäº†å¯¹å…¶ A å›¾æ ‡ */
    gap: calc(15 / 1920 * 100vw);
    color: #fff;
    /* æ¿€æ´»æ—¶æ–‡å­—ç™½è‰² */
    font-size: calc(14 / 1920 * 100vw);
    line-height: 1.6;
    padding-top: 0;
    display: none;
    margin-top: calc(-7/ 1920 * 100vw);
}

.a-icon {
    font-weight: 900;
    font-size: calc(20 / 1920 * 100vw);
    opacity: 0.8;
}

/* ================= CTA Banner Section ================= */
.cta-banner {
    position: relative;
    /* é«˜åº¦é€‚ä¸­ */
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding-top: calc(139/ 1920 * 100vw);
    padding-bottom: calc(145/ 1920 * 100vw);
}

.cta-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* æ›¿æ¢èƒŒæ™¯å›¾ */
    background: url(../images/bg.jpg) no-repeat center center;
    background-size: cover;
    background-position: center;
    z-index: 0;
}

.cta-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.4);
    /* åŠé€æ˜Žé®ç½© */
    z-index: 1;
}

.text-center {
    text-align: center;
}

.cta-title {
    font-size: calc(60 / 1920 * 100vw);
    font-weight: 900;
    color: #fff;
    margin-bottom: calc(30 / 1920 * 100vw);
    letter-spacing: calc(4 / 1920 * 100vw);
}

.btn-cta-white {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background-color: #fff;
    background: url(../images/more1.png) no-repeat 97% center #fff;
    /* æ©™è‰²æ–‡å­— */
    color: #E87011;
    font-size: calc(24 / 1920 * 100vw);
    border-radius: calc(40 / 1920 * 100vw);
    /* èƒ¶å›ŠæŒ‰é’® */
    transition: transform 0.3s;
    width: auto;
    line-height: calc(50 / 1920 * 100vw);
    padding-left: calc(24/ 1920 * 100vw);
    background-size: calc(36/ 1920 * 100vw);
    padding-right: calc(52 / 1920 * 100vw);
}

.btn-cta-white:hover {
    transform: scale(1.05);
}

/* ================= News Section ================= */
.news-section {
    padding: calc(160 / 1920 * 100vw) 0 calc(170 / 1920 * 100vw);
    background-color: #fff;
}

.sec-en.light-gray {
    color: #ccc;
}

.news-grid {
    display: block !important;
    grid-template-columns: repeat(3,1fr);
    gap: calc(32 / 1920 * 100vw);
}

.news-card {
    transition: transform 0.3s;
    background-color: #fff;
    /* é˜²æ­¢èƒŒæ™¯é€è‰² */
}

.news-card:hover {
    transform: translateY(-5px);
}

/* å›¾ç‰‡åŒºåŸŸ */
.news-img {
    position: relative;
    width: 100%;
    height: calc(240 / 1920 * 100vw);
    overflow: hidden;
}

.news-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.news-card:hover .news-img img {
    transform: scale(1.05);
}

/* å·¦ä¸Šè§’æ ‡ç­¾ */
.news-tag {
    position: absolute;
    top: calc(16 / 1920 * 100vw);
    left: calc(16 / 1920 * 100vw);
    padding: calc(4 / 1920 * 100vw) calc(8/ 1920 * 100vw);
    font-size: calc(12 / 1920 * 100vw);
    z-index: 2;
    font-weight: 500;
    color: #101828;
    border-radius: 16777200px;
    background: rgba(255,255,255,0.95);
}

/* å†…å®¹åŒºåŸŸ */
.news-content {
    /* æµ…ç°åº• */
    padding: calc(24/ 1920 * 100vw) calc(16/ 1920 * 100vw);
    height: calc(201/ 1920 * 100vw);
    background: #F6F5F5;
}

.news-date {
    font-size: calc(14 / 1920 * 100vw);
    color: #6A7282;
    margin-bottom: calc(8/ 1920 * 100vw);
    display: flex;
    align-items: center;
    gap: 5px;
    padding-left: calc(24 / 1920 * 100vw);
    background: url(../images/date.png) no-repeat left center;
    background-size: calc(16 / 1920 * 100vw);
}

.news-title {
    font-size: calc(20/ 1920 * 100vw);
    font-weight: bold;
    color: #0F2B51;
    margin-bottom: calc(8/ 1920 * 100vw);
    line-height: 1.4;
    /* é™åˆ¶ä¸¤è¡Œ */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.3s;
}

.news-card:hover .news-title {
    color: #FF5700;
}

.news-desc {
    font-size: calc(14 / 1920 * 100vw);
    color: #4A5565;
    line-height: 1.6;
    /* é™åˆ¶ä¸‰è¡Œ */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-align: justify;
}

/* ================= Footer Section ================= */
.footer {
    background-color: #000;
    color: #fff;
    padding-top: calc(60 / 1920 * 100vw);
    padding-bottom: calc(25/ 1920 * 100vw);
    font-size: calc(14 / 1920 * 100vw);
    position: relative;
}

.footer-main .right {
    display: flex;
    gap: 105px;
}

.footer-main {
    display: flex;
    justify-content: space-between;
    margin-bottom: calc(130/ 1920 * 100vw);
}

.footer-col {
    /* flex:1;*/
    /* é»˜è®¤å‡åˆ† */
}

/* ç¬¬ä¸€åˆ—å®½ä¸€ç‚¹ */
.col-brand {
    flex: .74;
}

/* æœ€åŽä¸€åˆ—å®½ä¸€ç‚¹ */
.col-contact {
    flex: 1.2;
}

/* Logo */
.f-logo img {
    height: calc(70 / 1920 * 100vw);
    margin-bottom: calc(24 / 1920 * 100vw);
}

.f-slogan {
    color: #909090;
    margin-bottom: calc(24/ 1920 * 100vw);
    font-size: calc(18/ 1920 * 100vw);
    font-family: "DM Sans";
    line-height: 1.3;
}

/* ç¤¾äº¤å›¾æ ‡ */
.f-socials a {
}

.f-socials a span {
}

.f-socials a span img {
    width: calc(24 / 1920 * 100vw);
}

.f-socials a span.slide:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 calc(5 / 1920 * 100vw) calc(5/ 1920 * 100vw) calc(5/ 1920 * 100vw);
    border-color: transparent transparent #fff transparent;
    position: absolute;
    top: calc(-5/ 1920 * 100vw);
    left: 50%;
    -o-transform: translate(-50%,0%);
    -webkit-transform: translate(-50%,0%);
    -moz-transform: translate(-50%,0%);
    -ms-transform: translate(-50%,0%);
    transform: translate(-50%,0%);
}

.f-socials a:hover span.slide {
    top: calc(33 / 1920 * 100vw);
    visibility: visible;
    opacity: 1;
    z-index: 5;
}

.f-socials a span.slide {
    position: absolute;
    width: calc(80 / 1920 * 100vw);
    left: calc(-29 / 1920 * 100vw);
    top: calc(46 / 1920 * 100vw);
    background: #fff;
    padding: calc(5 / 1920 * 100vw);
    border-radius: calc(3 / 1920 * 100vw);
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
    visibility: hidden;
    opacity: 0;
    z-index: -1;
}

.f-socials a span.slide img {
    width: 100%;
    height: calc(70 / 1920 * 100vw);
}

.f-socials {
    display: flex;
    gap: calc(24 / 1920 * 100vw);
    margin-bottom: calc(71/ 1920 * 100vw);
}

.f-socials a {
    font-size: calc(20 / 1920 * 100vw);
    color: #999;
    transition: color 0.3s;
    display: block;
    position: relative;
}

.f-socials a:hover {
    color: #fff;
}

.f-subscribe form{
    display: flex;
    background-color: #333;
    border-radius: calc(4 / 1920 * 100vw);
    padding: calc(8 / 1920 * 100vw);
    border-radius: calc(8 / 1920 * 100vw);
    border: 1px solid #646464;
    background: #1C1C1C;
    /* General/Shadow 02 */
    box-shadow: 0 2px 12px 0 rgba(20,20,43,0.08);
}
.f-subscribe {
    
}

.f-subscribe input {
    flex: 1;
    background: transparent;
    border: none;
    color: #fff;
    padding: 0px calc(10 / 1920 * 100vw) 0px 0px;
    font-size: calc(14 / 1920 * 100vw);
    outline: none;
    height: calc(38 / 1920 * 100vw);
}

.f-subscribe button {
    color: #fff;
    border: none;
    cursor: pointer;
    font-size: calc(16 / 1920 * 100vw);
    border-radius: 8px;
    background: #E87011;
    width: calc(80 / 1920 * 100vw);
}

/* é“¾æŽ¥åˆ—è¡¨ */
.f-title {
    font-size: calc(18 / 1920 * 100vw);
    font-weight: bold;
    margin-bottom: calc(36/ 1920 * 100vw);
    color: #fff;
    /* border-bottom:1px solid #A7A7A7;*/
    /* display:inline-block;*/
}

.f-title a {
    color: #fff;
    transition: color 0.3s;
    border-bottom: 1px solid #A7A7A7;
    display: inline-block;
    padding-bottom: 3px;
}

.f-title a:hover {
    color: #FF5700;
}

.mt-20 {
    margin-top: calc(20 / 1920 * 100vw);
}

.f-links li,.f-contact-list li {
    margin-bottom: calc(25 / 1920 * 100vw);
}

.f-links {
    padding-top: calc(6/ 1920 * 100vw);
}

.f-links a {
    color: #909090;
    transition: color 0.3s;
    font-size: calc(14/ 1920 * 100vw);
}

.f-links a:hover {
    color: #fff;
    text-decoration: underline;
}

.f-contact-list li img {
    width: calc(20 / 1920 * 100vw);
    height: calc(20 / 1920 * 100vw);
    object-fit: contain;
    margin-right: calc(6/ 1920 * 100vw);
}

.f-contact-list li {
    color: #999;
    display: flex;
    align-items: flex-start;
    /* gap:calc(10 / 1920 * 100vw);*/
    line-height: 1.5;
    align-items: center;
    margin-bottom: calc(18 / 1920 * 100vw);
}

/* --- åº•éƒ¨ç‰ˆæƒ --- */
.footer-line {
    width: 100%;
    height: 1px;
    background-color: #333;
    margin-bottom: calc(25/ 1920 * 100vw);
}

.footer-bottom * {
    font-family: "DM Sans";
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    color: #909090;
    font-size: calc(18/ 1920 * 100vw);
}

.footer-links a {
    color: #0065F3;
    margin: 0 5px;
}

/* --- å›žåˆ°é¡¶éƒ¨ --- */
.back-to-top {
    position: fixed;
    /* å›ºå®šå®šä½ */
    bottom: calc(50 / 1920 * 100vw);
    right: calc(43/ 1920 * 100vw);
    width: calc(40 / 1920 * 100vw);
    height: calc(40 / 1920 * 100vw);
    background: url(../images/top.png) no-repeat center center;
    background-size: 100%;
    z-index: 999;
    transition: transform 0.3s;
}

.back-to-top:hover {
    transform: translateY(-5px);
}

.contactBtn {
}

/* ================= About Hero Section ================= */
.about-hero {
    position: relative;
    width: 100%;
    /* 高度比普通内页高 */
    height: calc(500 / 1920 * 100vw);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: #000;
    margin-top: calc(80/ 1920 * 100vw);
}

/* 背景图 */
.ah-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.ah-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 渐变遮罩 (模拟图中的暗角和蓝色氛围) */
.ah-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    /* 从左上角的透明 到 右下角的深蓝 */
    background: radial-gradient(circle at center,transparent 0%,rgba(0,51,102,0.4) 100%);
}

.ah-content {
    position: relative;
    z-index: 2;
    text-align: center;
    color: #fff;
    padding-top: 0;
}

.ah-title {
    font-size: calc(80/ 1920 * 100vw);
    /* 超大标题 */
    font-weight: 900;
    margin-bottom: calc(20 / 1920 * 100vw);
    letter-spacing: calc(2 / 1920 * 100vw);
}

.ah-sub {
    font-size: calc(24 / 1920 * 100vw);
    font-weight: 400;
    opacity: 0.9;
    letter-spacing: calc(2 / 1920 * 100vw);
    line-height: 1.6;
}

/* ================= Sub Nav Section ================= */
.sub-nav {
    background-color: #ECECEC;
    /* 浅灰底 */
    /* 如果想让条子撑满全屏，可以不加container，直接 ul width 100% */
    overflow: hidden;
}

/* 特殊处理：如果 container 有 padding，这里需要去掉，或者让 ul 撑满 */
.container.no-padding {
    width: 100%;
    /* 全宽模式，或者保持 1400px */
    /* 设计图看起来像是居中的 1400px 区域内的导航条 */
    /* 如果是全屏通栏，则把 .container 去掉 */
}

.sub-nav-list {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    /* 4等分 */
    height: calc(96/ 1920 * 100vw);
    /* 固定高度 */
}

.sub-nav-list li {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: all 0.3s;
}

.sub-nav-list li a {
    font-size: calc(26/ 1920 * 100vw);
    color: #171717;
    font-weight: 500;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* 分割线 (灰色竖线) */
.sub-nav-list li::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 40%;
    background-color: #ccc;
}

/* 激活项和最后一个项不需要分割线 */
.sub-nav-list li.active::after,.sub-nav-list li:last-child::after {
    display: none;
}

/* 激活状态 */
.sub-nav-list li.active {
    /* 橙色 */
    background: #FF7100;
}

.sub-nav-list li.active a {
    color: #fff;
}

/* 悬停状态 */
.sub-nav-list li:hover {
    background-color: #FF5700;
    opacity: 0.9;
}

.sub-nav-list li:hover a {
    color: #fff;
}

/* ================= Overview Section ================= */
.overview-section {
    position: relative;
    padding: calc(163/ 1920 * 100vw) 0;
    color: #fff;
    background-color: #000;
}

.ov-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* 替换为工厂车间背景图 */
    background-size: cover;
    background-position: center;
    z-index: 0;
    background: url(../images/bg2.jpg) no-repeat center center;
    background-size: cover;
}

.ov-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.7);
    /* 深黑遮罩 */
    z-index: 1;
}

.sec-en.gray {
    color: #DBDBDB;
    margin-bottom: calc(40 / 1920 * 100vw);
}

.overview-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: calc(286/ 1920 * 100vw);
    padding-top: calc(60/ 1920 * 100vw);
}

/* 左侧 */
.ov-text {
    width: calc(447/ 1920 * 100vw);
}

.ov-desc {
    font-size: calc(20/ 1920 * 100vw);
    line-height: 1.8;
    color: #D7D7D7;
    text-align: justify;
}

.ov-desc p {
}

/* 右侧 */
.ov-stats {
    width: 50%;
}

.ov-stat-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: calc(16/ 1920 * 100vw);
}

.ov-stat-item {
    width: 45%;
    border-bottom: 1px solid transparent;
    /* 占位 */
}

.ov-num {
    font-size: calc(80/ 1920 * 100vw);
    /* 超大数字 */
    font-weight: 900;
    color: #E87011;
    line-height: 1;
    margin-bottom: calc(10 / 1920 * 100vw);
    font-family: 'Impact',sans-serif;
    display: flex;
    align-items: baseline;
}

.ov-num .unit,.ov-num .plus {
    font-size: calc(40 / 1920 * 100vw);
    color: #E87011;
    margin-left: 5px;
}

.ov-num .unit {
}

.ov-label {
    font-size: calc(30/ 1920 * 100vw);
    color: #fff;
}

.ov-divider {
    width: 100%;
    height: 1px;
    border-bottom: 1px solid #D2D2D2;
    margin-bottom: calc(54 / 1920 * 100vw);
    opacity: .5;
}

/* ================= Honors Section ================= */
.honors-section {
    padding: calc(120 / 1920 * 100vw) 0 calc(70/ 1920 * 100vw);
    background-color: #F3F3F3;
    /* 浅灰背景 */
}

/* 居中修饰类 */
.text-center {
    text-align: center;
}

.honors-header {
    margin-bottom: calc(26/ 1920 * 100vw);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.honors-desc {
    font-size: calc(20/ 1920 * 100vw);
    line-height: 1.8;
    color: #666;
    /* 限制文字宽度 */
    text-align: center;
    /* 文字居中对齐，或者 justify */
    margin-top: calc(12 / 1920 * 100vw);
    text-align: left;
    color: #929292;
}

/* 荣誉大图容器 */
.honors-img-box {
    width: 100%;
    text-align: center;
}

.honors-img-box img {
    max-width: 100%;
    /* 不超过容器宽 */
    height: auto;
    display: block;
    margin: 0 auto;
}

/* ================= Culture Section ================= */
.culture-section {
    padding: calc(120 / 1920 * 100vw) 0 calc(192/ 1920 * 100vw);
    background-color: #fff;
}

/* 头部样式复用 .honors-header,.honors-desc 的逻辑 */
.culture-header {
    margin-bottom: calc(8/ 1920 * 100vw);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.culture-desc {
    font-size: calc(20/ 1920 * 100vw);
    line-height: 1.8;
    color: #929292;
    text-align: left;
    margin-top: calc(24 / 1920 * 100vw);
}

/* --- 文化网格 --- */
.culture-grid {
    display: flex;
    justify-content: space-between;
    /* 或者用 grid-template-columns:repeat(3,1fr);*/
}

.cult-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    padding: calc(48/ 1920 * 100vw) calc(20 / 1920 * 100vw) calc(34/ 1920 * 100vw);
}

/* 竖向分割线 */
.cult-item:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 100%;
    /* 线条高度 */
    background-color: #D2D2D2;
}

.cult-icon img {
    height: calc(64 / 1920 * 100vw);
}

.cult-icon {
    font-size: calc(60 / 1920 * 100vw);
    color: #FF5700;
    /* 橙色图标 */
    margin-bottom: calc(10 / 1920 * 100vw);
}

.cult-title {
    font-size: calc(60/ 1920 * 100vw);
    color: #E87011;
    margin-bottom: calc(34/ 1920 * 100vw);
    font-weight: 500;
}

.cult-content p {
    font-size: calc(30 / 1920 * 100vw);
    color: #000;
    line-height: 1.6;
    margin: 0;
    font-weight: 500;
}

/* ================= Global Network Section ================= */
.global-section {
    padding: calc(137/ 1920 * 100vw) 0 calc(73/ 1920 * 100vw);
    background-color: #0D131A;
    /* 深黑蓝 */
    color: #fff;
}

.sec-en.dark-gray {
    color: #555;
}

/* 头部 */
.global-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: calc(60 / 1920 * 100vw);
}

.global-title-box {
    width: 20%;
}

.global-desc {
    width: 75%;
    font-size: calc(20/ 1920 * 100vw);
    line-height: 1.8;
    color: #929292;
    text-align: justify;
}

/* 地图 */
.global-map-wrapper {
    position: relative;
    width: 100%;
    /* 地图图片比例大约 2:1 */
    height: auto;
    margin-top: calc(40 / 1920 * 100vw);
}

.global-map-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    opacity: 0.8;
}

/* 地图光点 */
.map-spot {
    position: absolute;
    width: calc(10 / 1920 * 100vw);
    height: calc(10 / 1920 * 100vw);
    cursor: pointer;
}

.map-spot.spot1 {
    left: 13%;
    top: 24%;
}

.map-spot.spot2 {
    left: 51%;
    top: 26%;
}

.map-spot.spot3 {
    left: 53%;
    top: 34%;
}

.map-spot.spot4 {
    left: 61%;
    top: 29%;
}

.map-spot.spot5 {
    left: 80%;
    top: 31%;
}

.map-spot.spot6 {
    left: 76%;
    top: 48%;
}

.map-spot.spot7 {
    left: 85%;
    top: 34%;
}

.spot-dot {
    width: 100%;
    height: 100%;
    background-color: #FF5700;
    border-radius: 50%;
    position: relative;
    z-index: 2;
}

.spot-ripple {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 300%;
    height: 300%;
    border: 1px solid #FF5700;
    border-radius: 50%;
    opacity: 0;
    animation: ripple 2s infinite;
    z-index: 1;
    background: #FF7100;
}

@keyframes ripple {
    0% {
        transform: translate(-50%,-50%) scale(0.5);
        opacity: 0.8;
    }

    100% {
        transform: translate(-50%,-50%) scale(2);
        opacity: 0;
    }
}

/* 特殊大光点 (苏州) */
.map-spot.active {
    width: calc(40 / 1920 * 100vw);
    height: calc(40 / 1920 * 100vw);
}

.map-spot.active .spot-ripple {
    border-width: 2px;
    width: 500%;
    /* 波纹更大 */
    height: 500%;
}
.map-spot:hover .spot-label,.map-spot.current .spot-label{
    top:50%;
    
    visibility:visible;
    opacity:1;
    z-index:5;


}
.spot-label {
    position: absolute;
    left: 202%;
    /* 文字在点右侧 */
    top: 120%;
    transform: translateY(-50%);
    color: #ff5700;
    font-size: calc(16 / 1920 * 100vw);
    white-space: nowrap;
    opacity: .7;
    -webkit-transition: all 0.4s;
    -o-transition:all 0.4s;
    -moz-transition:all 0.4s;
    -ms-transition:all 0.4s;
    transition:all 0.4s;
    visibility: hidden;
    opacity: 0;
    z-index: -1;
}

/* ================= Locations Section ================= */
.locations-section {
    padding: calc(160 / 1920 * 100vw) 0;
    background-color: #fff;
}

/* 复用之前的 .sec-title,.sec-en */
.loc-header {
    margin-bottom: calc(40/ 1920 * 100vw);
}

.loc-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: calc(80 / 1920 * 100vw);
    /* 较大的列间距 */
    margin-bottom: calc(10/ 1920 * 100vw);
}

.loc-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 标题和图片居中 */
}

.loc-img {
    width: calc(420/ 1920 * 100vw);
    height: calc(240/ 1920 * 100vw);
    overflow: hidden;
    margin-bottom: calc(24/ 1920 * 100vw);
    /* border-radius:calc(8 / 1920 * 100vw);可选圆角 */
}

.loc-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.loc-img:hover img {
    transform: scale(1.05);
}

.loc-title {
    font-size: calc(32 / 1920 * 100vw);
    font-weight: normal;
    color: #0F2B51;
    /* 深蓝标题 */
    margin-bottom: calc(8/ 1920 * 100vw);
    line-height: 1.5;
}

/* 信息列表 (左对齐) */
.loc-info-list {
    width: 100%;
    text-align: left;
    width: calc(420/ 1920 * 100vw);
    margin: auto;
}

.info-row {
    display: flex;
    margin-bottom: calc(5 / 1920 * 100vw);
    line-height: 1.6;
}

.info-row .label {
    width: calc(112 / 1920 * 100vw);
    /* 固定宽度标签 */
    color: #929292;
    font-size: calc(16 / 1920 * 100vw);
    flex-shrink: 0;
}

.info-row .val {
    color: #505050;
    font-size: calc(14 / 1920 * 100vw);
}

.loc-divider {
    width: 100%;
    border-bottom: 1px solid #B3B3B3;
}

/* ================= Form Section ================= */
.form-section {
    padding: calc(64/ 1920 * 100vw) 0;
    background: #F5F5F5;
    /* 浅灰背景 */
}

.form-header {
    margin-bottom: calc(44/ 1920 * 100vw);
}

.form-row-4 {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: calc(24 / 1920 * 100vw);
    margin-bottom: calc(24/ 1920 * 100vw);
}

.form-group label {
    display: block;
    font-size: calc(14 / 1920 * 100vw);
    color: #6F6C90;
    margin-bottom: calc(10 / 1920 * 100vw);
}

.red {
    color: #FF330A;
}

.input-wrap {
    position: relative;
    overflow: hidden;
    border-radius: calc(8/ 1920 * 100vw);
    border: 1px solid var(--Neutral-400,#D9DBE9);
    background: var(--Neutral-100,#FFF);
    /* General/Shadow 02 */
    box-shadow: 0 2px 12px 0 rgba(20,20,43,0.08);
}

.input-wrap .icon img {
    width: calc(32 / 1920 * 100vw);
    object-fit: contain;
}

.input-wrap .icon {
    position: absolute;
    left: calc(8/ 1920 * 100vw);
    top: 50%;
    transform: translateY(-50%);
    color: #ccc;
    font-size: calc(18 / 1920 * 100vw);
}

.input-wrap input,.input-wrap select {
    width: 100%;
    height: calc(56 / 1920 * 100vw);
    border: none;
    padding-left: calc(50 / 1920 * 100vw);
    /* 留出图标位置 */
    font-size: calc(16 / 1920 * 100vw);
    color: #6F6C90;
    outline: none;
    background: transparent;
    font-weight: normal;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}
 .input-wrap select{
     background:url(../images/down.png) no-repeat 96% center;
     background-size:calc(17 / 1920 * 100vw);
 }
.input-wrap select {
    padding-left: calc(7 / 1920 * 100vw);
}

/* 文本域 */
.form-group.full textarea {
    width: 100%;
    padding: calc(12/ 1920 * 100vw) calc(8/ 1920 * 100vw);
    resize: none;
    outline: none;
    border-radius: calc(8 / 1920 * 100vw);
    border: 1px solid var(--Neutral-400,#D9DBE9);
    background: var(--Neutral-100,#FFF);
    box-shadow: 0 2px 12px 0 rgba(20,20,43,0.08);
    font-size: calc(16 / 1920 * 100vw);
    color: #6F6C90;
}

/* 底部提交 */
.form-footer {
    /* display:flex;*/
    flex-direction: column;
    margin: auto;
    align-items: center;
    margin-top: calc(24/ 1920 * 100vw);
    width: calc(464/ 1920 * 100vw);
    text-align: left;
}

.privacy-check {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: calc(14 / 1920 * 100vw);
    color: #596169;
    margin-bottom: calc(10/ 1920 * 100vw);
    cursor: pointer;
    text-align: left;
}

/* 自定义复选框样式略，直接用默认 */
.privacy-check input {
    width: calc(16 / 1920 * 100vw);
    height: calc(16 / 1920 * 100vw);
    accent-color: #FF5700;
    -webkit-appearance: auto !important;
}

.btn-submit {
    width: 100%;
    height: calc(56 / 1920 * 100vw);
    background-color: #FF5700;
    color: #fff;
    border: none;
    border-radius: calc(8 / 1920 * 100vw);
    font-size: calc(16 / 1920 * 100vw);
    cursor: pointer;
    transition: background 0.3s;
    border-radius: 8px;
    background: #FF7100;
    /* General/Shadow 02 */
    box-shadow: 0 2px 12px 0 rgba(20,20,43,0.08);
}

.btn-submit:hover {
    background-color: #e04e00;
}

.cbanner {
    overflow: hidden;
}

.cbanner img {
    height: calc(500 / 1920 * 100vw);
    width: 100%;
    object-fit: cover;
}

/* ================= Solution Detail Section ================= */
.sol-block {
    padding: calc(120 / 1920 * 100vw) 0;
}

.light-bg {
    background-color: #F8F8F8;
    background: #F3F3F3;
}

.dark-bg {
    background-color: #000;
}

.sol-row {
    display: flex;
    justify-content: space-between;
    /* 垂直居中 */
    gap: calc(80 / 1920 * 100vw);
}

/* 反转布局 (图片在左，文字在右) */
.sol-row.reverse {
    /* flex-direction:row-reverse;*/
}

/* 文字区域 */
.sol-text {
    width: 45%;
}

/* 复用标题样式，根据背景调整颜色 */
.sec-title.white {
    color: #fff;
}

.sec-en.gray {
    color: #999;
    margin-bottom: calc(40 / 1920 * 100vw);
}

/* 列表样式 */
.sol-list {
    margin-top: calc(39 / 1920 * 100vw);
}

.sol-list li {
    position: relative;
    padding-left: calc(17 / 1920 * 100vw);
    margin-bottom: calc(30 / 1920 * 100vw);
    font-size: calc(20/ 1920 * 100vw);
    color: #929292;
    line-height: 1.6;
}

.sol-list li:last-child {
    margin: 0px;
}

/* 橙色圆点 */
.sol-list.orange-dot li::before {
    content: '';
    position: absolute;
    left: 0;
    top: calc(12 / 1920 * 100vw);
    /* 视觉对齐 */
    width: calc(8 / 1920 * 100vw);
    height: calc(8 / 1920 * 100vw);
    background-color: #FF7100;
    border-radius: 50%;
}

.sol-list li .label {
    color: #333;
    font-weight: bold;
}

/* 深色背景下的文字颜色 */
.sol-list.white-text li {
    color: #ccc;
}

.sol-list.white-text li .label {
    color: #fff;
}

/* 图片区域 */
.sol-img {
    width: calc(647/ 1920 * 100vw);
    /* 竖图比例 */
    height: calc(970/ 1920 * 100vw);
    overflow: hidden;
    /* border-radius:calc(8 / 1920 * 100vw);*/
}

.sol-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ================= Solution List Section ================= */
.sol-list-section {
    padding: calc(100 / 1920 * 100vw) 0 calc(63/ 1920 * 100vw);
    background-color: #fff;
}

.sol-list-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: calc(74/ 1920 * 100vw) calc(32/ 1920 * 100vw);
    /* 行间距40，列间距30 */
    margin-bottom: calc(73/ 1920 * 100vw);
}

.sol-item {
    text-align: center;
}

.si-img {
    width: 100%;
    /* 保持图片比例，比如 16:9 或 3:2 */
    height: calc(240 / 1920 * 100vw);
    overflow: hidden;
    margin-bottom: calc(24 / 1920 * 100vw);
    /* border:1px solid #eee;可选边框 */
}

.si-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.sol-item:hover .si-img img {
    transform: scale(1.05);
}

.si-title {
    font-size: calc(20/ 1920 * 100vw);
    color: #0F2B51;
    font-weight: 500;
    transition: color 0.3s;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sol-item:hover .si-title {
    color: #FF5700;
    /* 悬停标题变色 */
}

/* --- 分页器 --- */
.pagination-center {
    display: flex;
    justify-content: center;
    gap: calc(10 / 1920 * 100vw);
    align-items: center;
}
.pagination-center a{
    min-width: calc(40 / 1920 * 100vw);
    height: calc(40 / 1920 * 100vw);
    border: 1px solid #eee;
    background-color: #fff;
    color: #525252;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(14 / 1920 * 100vw);
    padding: 0 calc(10 / 1920 * 100vw);
    transition: all 0.3s;
    border: 0.556px solid #E5E5E5;
}


.pagination-center a:hover,
.pagination-center a.page-num-current {
    background-color: #FF7100;
    color: #fff;
    border-color: #FF7100;
}

.page-dots {
    color: #999;
    font-size: calc(14 / 1920 * 100vw);
}

/* ========== PC Styles (1920 Base) ========== */
.talent-section,.strategy-section {
    padding: calc(120 / 1920 * 100vw) 0;
    background: #ffffff;
}

.talent-section {
    background: #F3F3F3;
}

.talent-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: calc(80 / 1920 * 100vw);
}

.talent-row.reverse {
    flex-direction: row-reverse;
}

/* Text Area */
.talent-content {
    width: calc(647/ 1920 * 100vw);
}

.talent-title {
    font-size: calc(40 / 1920 * 100vw);
    font-weight: 700;
    margin-bottom: calc(10 / 1920 * 100vw);
}

.talent-subtitle {
    font-size: calc(20 / 1920 * 100vw);
    color: #bfbfbf;
    margin-bottom: calc(30 / 1920 * 100vw);
}

.talent-desc {
    font-size: calc(20/ 1920 * 100vw);
    line-height: 1.8;
    color: #929292;
    margin-top: calc(60/ 1920 * 100vw);
}

/* Image */
.talent-img {
    width: calc(647/ 1920 * 100vw);
}

.talent-img img {
    width: 100%;
    height: auto;
    display: block;
}

/* ========== PC Styles (1920 Base) ========== */
.apply-section,.process-section {
    padding: calc(120 / 1920 * 100vw) 0;
    background: #ffffff;
    background: #F3F3F3;
}

.process-section {
    padding-top: 0
}

/* Titles */
.section-title {
    font-size: calc(40 / 1920 * 100vw);
    font-weight: 700;
    margin-bottom: calc(10 / 1920 * 100vw);
}

.section-subtitle {
    font-size: calc(20 / 1920 * 100vw);
    color: #cfcfcf;
    margin-bottom: calc(70 / 1920 * 100vw);
}

/* Apply Channels */
.apply-channels {
    display: flex;
    justify-content: space-between;
    gap: calc(24/ 1920 * 100vw);
    padding-top: calc(24/ 1920 * 100vw);
}

.apply-card {
    flex: 1;
    height: calc(240 / 1920 * 100vw);
    background: #fff;
    border-radius: calc(6 / 1920 * 100vw);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.apply-card img {
    display: block;
    margin: auto;
    height: calc(120/ 1920 * 100vw);
}

.apply-card .email-box img {
    display: block;
    margin: auto;
    height: calc(70/ 1920 * 100vw);
    margin-bottom: calc(10/ 1920 * 100vw);
}

.email-box {
    font-size: calc(20/ 1920 * 100vw);
    color: #929292;
}

/* Hiring Process */
.process-steps {
    margin-top: calc(102/ 1920 * 100vw);
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 0;
    text-align: center;
}

.process-item img {
    width: calc(100 / 1920 * 100vw);
    margin-bottom: calc(94/ 1920 * 100vw);
    object-fit: contain;
}

.process-item p {
    font-size: calc(18 / 1920 * 100vw);
    color: #4A5565;
}

/* ================= Featured News Section ================= */
.featured-news-section {
    padding: calc(131/ 1920 * 100vw) 0;
    background-color: #fff;
    padding-bottom: calc(57/ 1920 * 100vw);
}

.featured-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.side-title img {
    height: calc(20/ 1920 * 100vw);
}

.side-title {
    font-size: calc(18/ 1920 * 100vw);
    font-weight: 700;
    color: #000;
    margin-bottom: calc(25/ 1920 * 100vw);
    display: flex;
    align-items: center;
    gap: 10px;
}

.side-title i {
    color: #FF5700;
}

/* --- 左侧大卡片 --- */
.feat-left {
    width: calc(880/ 1920 * 100vw);
    background: #FAFAFA;
    padding: calc(24/ 1920 * 100vw);
}

.feat-card-lg {
    background-color: #F8F8F8;
    /* 浅灰底 */
    overflow: hidden;
}

.fc-img {
    width: 100%;
    height: calc(489/ 1920 * 100vw);
    overflow: hidden;
}

.fc-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.feat-card-lg:hover .fc-img img {
    transform: scale(1.05);
}

.fc-content {
    padding: calc(24/ 1920 * 100vw) 0;
    position: relative;
    /* 顶部橙色条 */
    border-top: 4px solid #E87011;
    padding-bottom: 0;
}

.fc-title {
    font-size: calc(30/ 1920 * 100vw);
    color: #000;
    margin-bottom: calc(16 / 1920 * 100vw);
}

.fc-desc {
    font-size: calc(16 / 1920 * 100vw);
    color: #838383;
    line-height: 1.6;
    margin-bottom: calc(20 / 1920 * 100vw);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.fc-date img {
    height: calc(16 / 1920 * 100vw);
}

.fc-date {
    font-size: calc(14 / 1920 * 100vw);
    color: #6A7282;
    display: flex;
    align-items: center;
    gap: calc(3/ 1920 * 100vw);
}

/* --- 右侧列表 --- */
.feat-right {
    width: calc(534/ 1920 * 100vw);
    padding: calc(24/ 1920 * 100vw);
}

.hot-list {
    display: flex;
    flex-direction: column;
}

.hot-item {
    display: flex;
    gap: calc(20 / 1920 * 100vw);
    margin-bottom: calc(20 / 1920 * 100vw);
    border-bottom: 0.556px solid rgba(188,192,198,0.50);
    padding: calc(16/ 1920 * 100vw) 0;
}

.hot-item:last-child {
}

.hot-info {
    position: relative;
}

.hot-img {
    width: calc(164/ 1920 * 100vw);
    height: calc(109/ 1920 * 100vw);
    flex-shrink: 0;
    overflow: hidden;
}

.hot-img img:hover {
    -webkit-transform: scale(1.05,1.05);
    -o-transform: scale(1.05,1.05);
    -moz-transform: scale(1.05,1.05);
    -ms-transform: scale(1.05,1.05);
    transform: scale(1.05,1.05);
}

.hot-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    transition: all 0.4s;
}

.hot-info h4 a {
    font-size: calc(20/ 1920 * 100vw);
    color: #0F2B51;
    font-weight: 500;
    line-height: 1.4;
    display: block;
    /* 限制2行 */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.3s;
}

.hot-info h4 a:hover {
    color: #FF5700;
}

.hot-info .date {
    font-size: calc(12 / 1920 * 100vw);
    color: #6A7282;
    position: absolute;
    bottom: 0;
    left: 0;
}

/* ================= News List Section ================= */
.news-list-section {
    background-color: #fff;
}

/* --- Tabs --- */
.news-tabs {
    display: flex;
    gap: calc(16/ 1920 * 100vw);
    margin-bottom: calc(24/ 1920 * 100vw);
    /* 底部分割线 */
}

.tab-link {
    font-size: calc(30/ 1920 * 100vw);
    color: #9D9D9D;
    padding-bottom: calc(12/ 1920 * 100vw);
    position: relative;
    transition: color 0.3s;
}

/* 激活态：黑字 + 橙色下划线 */
.tab-link.active {
    color: #000;
    font-weight: bold;
}

.tab-link.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #FF7100;
}

/* --- Grid --- */
.news-list-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: calc(32 / 1920 * 100vw);
    margin-bottom: calc(60 / 1920 * 100vw);
}

/* 既然是复用 .news-card，样式直接继承自首页 */
/* 如果要微调，可以在这里写 */
.mt-60 {
    margin-top: calc(60 / 1920 * 100vw);
}

.type2 .news-content {
    height: calc(169 / 1920 * 100vw);
}

/* ================= News Detail Wrapper ================= */
.news-detail-wrapper {
    padding: calc(112/ 1920 * 100vw) 0 calc(32/ 1920 * 100vw);
    background-color: #fff;
}

.news-detail-layout {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

/* --- Left Content --- */
.nd-left {
    width: calc(882/ 1920 * 100vw);
}

.breadcrumb a {
    color: #6B7280;
}

.breadcrumb {
    font-size: calc(14 / 1920 * 100vw);
    color: #6B7280;
    margin-bottom: calc(24/ 1920 * 100vw);
}

.breadcrumb a {
    color: #6B7280;
}

.breadcrumb .current {
    color: #1A1A2E;
}

.nd-main-img {
    width: 100%;
}

.nd-main-img img {
    width: 100%;
    height: auto;
    display: block;
}

.nd-article-header {
    margin-bottom: calc(10 / 1920 * 100vw);
    border-bottom: 0.623px solid #E5E7EB;
    padding-bottom: 2px;
}

.nd-h1 {
    font-size: calc(48/ 1920 * 100vw);
    font-weight: bold;
    color: #101828;
    margin-bottom: calc(16 / 1920 * 100vw);
}

.nd-date {
    font-size: calc(14 / 1920 * 100vw);
    color: #6A7282;
}

/* 正文样式 */
.nd-body {
    color: #333;
    line-height: 1.8;
    font-size: calc(16 / 1920 * 100vw);
}

.nd-body h3 {
    font-size: calc(24 / 1920 * 100vw);
    /* margin-top:calc(10 / 1920 * 100vw);*/
    margin-bottom: calc(15 / 1920 * 100vw);
}

.nd-body h4 {
    font-size: calc(20 / 1920 * 100vw);
    margin-top: calc(25 / 1920 * 100vw);
    margin-bottom: calc(10 / 1920 * 100vw);
}

.nd-body p {
    margin-bottom: calc(20 / 1920 * 100vw);
}

.nd-body ul {
    padding-left: calc(20 / 1920 * 100vw);
    list-style: disc;
    margin-bottom: calc(20 / 1920 * 100vw);
}

/* --- Right Sidebar --- */
.nd-right {
    width: calc(534/ 1920 * 100vw);
    /* 复用之前的 .feat-right,.hot-list 样式，这里不需要额外写 */
}

/* --- Footer Nav (Prev/Next) --- */
.nd-footer-nav {
    /* 和左侧内容对齐 */
    margin-top: calc(87/ 1920 * 100vw);
}

.nav-card {
    display: block;
    background-color: #F8F8F8;
    /* 浅灰底 */
    padding: calc(24 / 1920 * 100vw);
    margin-bottom: calc(32/ 1920 * 100vw);
    transition: background 0.3s;
    border-radius: calc(16 / 1920 * 100vw);
    border: 0.554px solid rgba(0,0,0,0.08);
    background: rgba(0,0,0,0.02);
}

.nav-card:hover {
    background-color: #eee;
}

.nav-card .label {
    font-size: calc(16 / 1920 * 100vw);
    color: rgba(0,0,0,0.50);
    margin-bottom: calc(15 / 1920 * 100vw);
    display: block;
}

.nav-card .title {
    font-size: calc(18 / 1920 * 100vw);
    font-weight: bold;
    color: #333;
    margin-bottom: calc(5 / 1920 * 100vw);
}

.nav-card .date {
    font-size: calc(16 / 1920 * 100vw);
    color: #ccc;
    font-weight: normal;
}

.padding48 {
    padding: calc(48 / 1920 * 100vw);
    background: #F7F7F7;
}

.margintype1 {
    height: calc(80 / 1920 * 100vw);
}

/* ================= Contact Info Section ================= */
.contact-info-section {
    padding: calc(88 / 1920 * 100vw) 0;
    background-color: #fff;
}

.contact-header {
    margin-bottom: calc(40 / 1920 * 100vw);
}

.contact-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

/* --- 左侧列表 --- */
.contact-list {
    width: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.contact-block {
    margin-bottom: calc(30 / 1920 * 100vw);
    padding-bottom: calc(18 / 1920 * 100vw);
    border-bottom: 1px solid #eee;
    float: left;
    width: 50%;
}

.contact-block.no-border {
    border-bottom: none;
}

.block-title img {
    width: calc(40/ 1920 * 100vw);
}
.block-content{
    padding-right: 0;
    margin: auto;
    padding-top: 2vw;
    
    padding-right: 21%;
}
  .contact-block:last-child  .block-content{
        padding-left:0;
      padding-right:0
    }
.block-title {
    font-size: calc(32 / 1920 * 100vw);
    color: #0F2B51;
    font-weight: normal;
    margin-bottom: calc(12/ 1920 * 100vw);
    display: flex;
    align-items: center;
    gap: calc(6 / 1920 * 100vw);
    justify-content: flex-start;
}

.orange-icon {
    color: #FF5700;
}

.c-row {
    display: flex;
    margin-bottom: calc(10 / 1920 * 100vw);
    font-size: calc(16 / 1920 * 100vw);
    line-height: 1.6;
}

.c-row .label {
    width: calc(124 / 1920 * 100vw);
    color: #929292;
    flex-shrink: 0;
}

.c-row .val a {
    color: inherit;
    text-decoration: underline
}

.c-row .val {
    color: #505050;
    font-size: 14px;
    /* text-decoration:underline;*/
}

.qr-code {
    width: calc(120 / 1920 * 100vw);
    margin-top: calc(24/ 1920 * 100vw);
    margin: 0;
}

.qr-code img {
    width: 100%;
    height: 100%;
}

/* --- 右侧地图 --- */
.contact-map {
    width: calc(600/ 1920 * 100vw);
}

.map-box {
    width: 100%;
    height: calc(480/ 1920 * 100vw);
    /* 固定高度 */
    background-color: #eee;
}

/* ================= Solution Detail Main ================= */
.sol-detail-main {
    padding: calc(112/ 1920 * 100vw) 0 calc(72/ 1920 * 100vw);
    background-color: #fff;
}

/* 复用面包屑样式 .breadcrumb (新闻详情页写过)，这里不需要重写 */
/* --- 顶部简介卡片 --- */
.sol-intro-card {
    display: flex;
    background-color: #F8F8F8;
    /* 浅灰背景 */
    margin-bottom: calc(88/ 1920 * 100vw);
    align-items: stretch;
    /* 等高 */
    position: relative;
    padding-left: calc(712/ 1920 * 100vw);
}

.intro-img {
    width: calc(712/ 1920 * 100vw);
    /* 高度由右侧内容或图片比例决定，也可以定高 */
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
}

.intro-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.intro-content {
    width: 100%;
    padding: calc(48/ 1920 * 100vw) calc(64/ 1920 * 100vw);
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #F7F7F7;
}

.intro-title {
    font-size: calc(48/ 1920 * 100vw);
    color: #101828;
    margin-bottom: calc(25 / 1920 * 100vw);
    line-height: 1.1;
}

.intro-divider {
    width: 100%;
    border-bottom: 1px solid #E5E7EB;
    margin-bottom: calc(25 / 1920 * 100vw);
}

.intro-text p {
    font-size: calc(16 / 1920 * 100vw);
    line-height: 1.8;
    text-align: justify;
    color: #364153;
}

/* --- 主要工艺 --- */
.sec-header-center {
    text-align: center;
    margin-bottom: calc(32/ 1920 * 100vw);
}

.process-banner {
    margin-bottom: calc(24/ 1920 * 100vw);
}

.process-img-box img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.process-img-box {
    width: 100%;
    height: calc(500 / 1920 * 100vw);
    background-color: #F0F0F0;
    /* 灰色占位 */
}

/* 工艺列表 */
.process-list {
    width: 100%;
    zoom:1;overflow: hidden;
}

.process-row .item:nth-child(1) {
}

.process-row .item:nth-child(2) {
}

.process-row {
    zoom:1;overflow: hidden;
}

.proc-item:nth-child(2n) {
    /* text-align: right; */
    /* display: block; */
}
.proc-item:nth-child(4n){
    padding-right: 0px !important;
}
.proc-item {
    width: 25%;
    font-size: calc(24/ 1920 * 100vw);
    color: #0F2B51;
    display: flex;
    align-items: center;
    gap: calc(10 / 1920 * 100vw);
    line-height: calc(64 / 1920 * 100vw);
    float: left;
    /* width: 50%; */
    border-bottom: 1px solid #eee;
    margin-bottom: calc(24/ 1920 * 100vw);
}

.dot {
    width: calc(10 / 1920 * 100vw);
    height: calc(10 / 1920 * 100vw);
    border-radius: 50%;
    background-color: #FF5700;
    /* 橙色圆点 */
    display: inline-block;
    vertical-align: middle;
}

.action-section {
    padding-bottom: calc(30/ 1920 * 100vw);
    background-color: #fff;
}

.action-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: calc(32/ 1920 * 100vw);
}

.action-item {
    width: 100%;
    height: calc(240/ 1920 * 100vw);
    overflow: hidden;
}

.action-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.action-item:hover img {
    transform: scale(1.05);
}

.process-list .item:nth-child(1) .proc-item:nth-child(2n) {
    /* padding-right: 4vw; */
}

.process-list .item:nth-child(2) .proc-item:nth-child(1n) {
    padding-left: 4vw;
}

.process-list .item {
    float: none;
    width: 100%;
    zoom: 1;
    overflow: hidden;
}

.tailor-section {
    padding: calc(160 / 1920 * 100vw) 0 calc(140 / 1920 * 100vw);
    background: #191919;
    /* 深色背景 */
    color: #fff;
    overflow: hidden;
}

.process-wrapper {
    position: relative;
    padding: calc(10 / 1920 * 100vw) 0;
    /* 定义总高度，或者由内容撑开 */
}

/* --- SVG 线条 --- */
.process-line-svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
}

/* 默认隐藏激活线，由 JS 控制 drawSVG */
.line-path-active {
    stroke-dasharray: 1;
    /* 这里只是占位，JS会覆盖 */
    stroke-dashoffset: 1;
}

/* --- 步骤布局 (交替) --- */
.step-item {
    width: calc(448/ 1920 * 100vw);
    position: relative;
    z-index: 1;
    margin-bottom: calc(44/ 1920 * 100vw);
    opacity: 0.5;
    /* 默认半透明 */
    transition: all 0.5s ease-out;
}

.step-left {
    margin-left: 0;
    text-align: left;
}

/* 调整右侧的位置，对应 SVG 线条的折点 */
.step-right {
    margin-left: 68.9%;
    /* 放到右边 */
    text-align: left;
}

/* 卡片样式 */
.step-card {
    background-color: #364153;
    /* 默认深灰 */
    padding: calc(32/ 1920 * 100vw);
    border-radius: calc(4 / 1920 * 100vw);
    margin-bottom: calc(17/ 1920 * 100vw);
    transition: all 0.5s;
    /* 初始位置稍微下沉 */
    /* transform: translateY(20px); */
    height: calc(160/ 1920 * 100vw);
}

.step-num {
    font-size: calc(60 / 1920 * 100vw);
    color: #FF5700;
    /* 默认数字是橙色 */
    line-height: 1;
    margin-bottom: calc(8/ 1920 * 100vw);
    transition: color 0.5s;
    font-family: Inter;
}

.step-title {
    font-size: calc(20 / 1920 * 100vw);
    color: #ccc;
    font-weight: 500;
    transition: color 0.5s;
}

.step-desc {
    font-size: calc(14 / 1920 * 100vw);
    color: #999;
    line-height: 1.6;
    transition: color 0.5s;
    font-family: Inter;
}

/* --- 激活状态 (由 GSAP 添加 .active 类) --- */
.step-item.active {
    opacity: 1;
}

.step-item.active .step-card {
    background-color: #FF5700;
    /* 变橙色 */
    /* transform: translateY(0); */
    /* 上浮 */
    box-shadow: 0 10px 30px rgba(255,87,0,0.3);
    background: #FF6900;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.10),0 4px 6px -4px rgba(0,0,0,0.10);
}

.step-item.active .step-num {
    color: rgba(255,255,255,1);
    /* 数字变半透明白 */
}

.step-item.active .step-title,.step-item.active .step-desc {
    color: #fff;
    /* 文字变白 */
}

.sec-en.gray.mb0 {
    margin-bottom: 0;
}

.process-line-svg {
    z-index: 0;
    /* 在底层 */
}

.step-card {
    position: relative;
    z-index: 10;
    /* 在上层，盖住线条 */
    background-color: #2A323C;
    /* 必须有背景色，不能透明 */
}

/* ================= Video Section ================= */
.video-section {
    padding: calc(160 / 1920 * 100vw) 0;
    background-color: #fff;
}

.video-section .swiper-button-next,.video-section .swiper-button-prev {
    width: calc(50 / 1920 * 100vw);
    height: calc(50 / 1920 * 100vw);
}

.video-section .swiper-button-next {
    background: url(../images/right.png) no-repeat center center;
    background-size: 100%;
    right: 0px;
}

.video-section .swiper-button-prev {
    background: url(../images/left.png) no-repeat center center;
    background-size: 100%;
    left: 0px;
}

.video-grid {
    /* display:grid;*/
    /* grid-template-columns:repeat(2,1fr);*/
    /* gap:calc(40 / 1920 * 100vw);*/
}

.video-item {
    width: 100%;
    position: relative;
    cursor: pointer;
}

.video-cover {
    width: 100%;
    /* 16:9 比例 */
    height: calc(400/ 1920 * 100vw);
    overflow: hidden;
    position: relative;
    /* border-radius:calc(8 / 1920 * 100vw);可选圆角 */
}

.video-cover img,.video-cover video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.video-item:hover .video-cover img {
    transform: scale(1.05);
}

/* 播放按钮 */
.play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: calc(80 / 1920 * 100vw);
    height: calc(80 / 1920 * 100vw);
    background-color: rgba(0,0,0,0.5);
    /* 半透明黑 */
    border: 2px solid #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: calc(30 / 1920 * 100vw);
    transition: all 0.3s;
    z-index: 2;
}

.video-item:hover .play-btn {
    background-color: #FF5700;
    border-color: #FF5700;
    transform: translate(-50%,-50%) scale(1.1);
}

.ah-sub.type2 {
    text-align: right;
    padding-right: calc(230/ 1920 * 100vw);
    margin: auto;
}

/* ========== PC Styles (1920 Base) ========== */
.solution-section {
    padding: calc(100/ 1920 * 100vw) 0;
    background: #ffffff;
    text-align: center;
}

.container {
}

.solution-title {
    font-size: calc(60/ 1920 * 100vw);
    font-weight: 700;
    margin-bottom: calc(20 / 1920 * 100vw);
    color: #101828;
}

.solution-desc {
    font-size: calc(20/ 1920 * 100vw);
    line-height: calc(28 / 1920 * 100vw);
    color: #929292;
    margin: 0 auto calc(24 / 1920 * 100vw);
}

.solution-subtitle {
    font-size: calc(30/ 1920 * 100vw);
    margin-bottom: calc(24 / 1920 * 100vw);
    color: #101828;
    line-height: 2;
}

/* Step Diagram */
.solution-steps {
    display: flex;
    justify-content: center;
    align-items: end;
}

.step-items {
    color: #fff;
    font-size: calc(22/ 1920 * 100vw);
    border: 1px solid #E7E7E7;
    background: linear-gradient(180deg,#FFD0B0 0%,rgba(255,120,26,0.60) 100%);
    position: relative;
    flex: 1;
    display: flex;
    text-align: center;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.step-1 {
    height: calc(103/ 1920 * 100vw);
}

.step-2 {
    height: calc(201/ 1920 * 100vw);
}

.step-3 {
    height: calc(312/ 1920 * 100vw);
}

/* Device Section */
.device-section {
    padding: calc(160 / 1920 * 100vw) 0;
    background: #F9F9F9;
    text-align: center;
}

.device-header {
    padding-bottom: calc(24 / 1920 * 100vw);
}

.device-title {
    font-size: calc(60 / 1920 * 100vw);
    font-weight: 700;
    margin-bottom: calc(17 / 1920 * 100vw);
}

.device-subtitle {
    font-size: calc(16 / 1920 * 100vw);
    color: #4A5565;
    margin-bottom: calc(24/ 1920 * 100vw);
}

.device-list {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: calc(40 / 1920 * 100vw);
}

.device-card {
    border-radius: calc(6 / 1920 * 100vw);
    background: #F6F5F5;
    height: calc(346 / 1920 * 100vw);
}

.device-card .imgbox {
    background: #EEE;
    padding: calc(16/ 1920 * 100vw);
    margin-bottom: calc(31/ 1920 * 100vw);
}

.device-card img {
    width: 100%;
    height: auto;
}

.device-card h4 {
    font-size: calc(20/ 1920 * 100vw);
    margin-bottom: calc(14 / 1920 * 100vw);
    color: #0F2B51;
}

.device-card p {
    font-size: calc(14 / 1920 * 100vw);
    color: #4A5565;
}

.solution-steps .arr {
    position: absolute;
    width: calc(124 / 1920 * 100vw);
    height: calc(124 / 1920 * 100vw);
    background: url(../images/rr.png) no-repeat center center;
    background-size: 100%;
    right: calc(-71 / 1920 * 100vw);
    top: calc(-120 / 1920 * 100vw);
    z-index: 6;
}

.solution-steps .step-1 .arr {
}

.solution-steps .step-2 .arr {
    top: calc(-134 / 1920 * 100vw);
}

.line-intel {
    padding: calc(56/ 1920 * 100vw) 0 calc(113/ 1920 * 100vw);
    background: #ffffff;
    text-align: center;
}

.line-header {
    margin-bottom: calc(80 / 1920 * 100vw);
}

.line-title {
    font-size: calc(48 / 1920 * 100vw);
    font-weight: 700;
    margin-bottom: calc(14 / 1920 * 100vw);
}

.line-subtitle {
    font-size: calc(18 / 1920 * 100vw);
    color: #666;
}

/* 中间大图 */
.line-diagram {
    width: 100%;
}

.line-diagram img {
    width: 100%;
    height: auto;
    display: block;
}

/* 底部三个橙色按钮 */
.line-features {
    display: flex;
    justify-content: center;
    gap: calc(40 / 1920 * 100vw);
    padding-top: calc(58/ 1920 * 100vw);
}

.feature-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(9/ 1920 * 100vw);
    height: calc(92 / 1920 * 100vw);
    color: #fff;
    font-size: calc(16 / 1920 * 100vw);
    border-radius: calc(10/ 1920 * 100vw);
    background: #FF7100;
    padding: 0px calc(32/ 1920 * 100vw);
}

.feature-item .icon img {
    width: 100%;
}

.feature-item .icon {
    width: calc(44/ 1920 * 100vw);
}

.type2 .device-header {
    padding-bottom: calc(56/ 1920 * 100vw);
}

.feature-item .ris {
    /* display:flex;*/
    text-align: left;
}

.feature-item .ris b {
    display: block;
    text-align: left;
    font-size: calc(12/ 1920 * 100vw);
    color: #fff;
    opacity: .6;
    font-weight: normal;
    margin-top: calc(10/ 1920 * 100vw);
}

.line-intel.type2 {
    padding-top: 0px;
    padding-bottom: calc(150/ 1920 * 100vw);
}

.tech-eco {
    padding: 0;
    background: #ffffff;
    text-align: center;
    padding-bottom: calc(40/ 1920 * 100vw);
}

.eco-header {
    margin-bottom: calc(44/ 1920 * 100vw);
}

.eco-title {
    font-size: calc(46 / 1920 * 100vw);
    font-weight: 700;
}

.eco-sub {
    margin-top: calc(10 / 1920 * 100vw);
    color: #888;
    font-size: calc(16 / 1920 * 100vw);
}

/* 场景卡片 */
.scene-list {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: calc(16/ 1920 * 100vw);
    margin-bottom: calc(263/ 1920 * 100vw);
    text-align: center;
}

.scene-item {
    text-align: center;
    text-decoration: none;
    color: #222;
}

.scene-item img {
    width: 100%;
    height: calc(230 / 1920 * 100vw);
    object-fit: cover;
    margin-bottom: calc(30/ 1920 * 100vw);
}

.scene-item h3 {
    font-size: calc(20 / 1920 * 100vw);
    margin-bottom: calc(10 / 1920 * 100vw);
    color: #0F2B51;
    font-weight: normal;
}

.scene-item p {
    font-size: calc(14/ 1920 * 100vw);
    color: #6A7282;
}

/* LOGO 区 */
.group-title {
    margin: calc(30 / 1920 * 100vw) 0 calc(20 / 1920 * 100vw);
    font-size: calc(20/ 1920 * 100vw);
    color: #0F2B51;
}

.logo-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 calc(50 / 1920 * 100vw);
    align-items: center;
    text-align: center;
}

.logo-group img {
    height: calc(150/ 1920 * 100vw);
    object-fit: contain;
    width: calc(173/ 1920 * 100vw);
}

.input-wrap.type2 {
}

.input-wrap.type2 img {
    position: absolute;
    right: 0;
    top: 0;
    height: calc(56 / 1920 * 100vw);
    width: calc(120 / 1920 * 100vw);
    object-fit: cover;
    cursor: pointer;
}

.input-wrap.type2 input {
    padding-left: calc(12/ 1920 * 100vw);
}



.about-hero * {
    opacity: 1;
}

@font-face {
    font-family: "HarmonyOS Sans SC";
    src: url('../fonts/HarmonyOS_Sans_SC_Medium.ttf')
}

/* ================= Why Choose Us Section ================= */
.why-us-section {
    padding: calc(267/ 1920 * 100vw) 0;
    background-color: #000;
    color: #fff;
    padding-bottom: calc(220/ 1920 * 100vw);
}

/* --- Header --- */
.why-header {
    margin-bottom: calc(164/ 1920 * 100vw);
    position: relative;
}

.why-cn-title {
    font-size: calc(100/ 1920 * 100vw);
    font-weight: 900;
    margin-bottom: calc(20 / 1920 * 100vw);
}

.why-en-wrapper {
    display: flex;
    align-items: center;
    margin-bottom: calc(40 / 1920 * 100vw);
}

.highlight-box {
    background-color: #E87011;
    color: #fff;
    font-size: calc(100/ 1920 * 100vw);
    font-weight: 900;
    padding: calc(20 / 1920 * 100vw) calc(4 / 1920 * 100vw);
    margin-right: calc(20 / 1920 * 100vw);
}

.en-text {
    font-size: calc(100/ 1920 * 100vw);
    font-weight: 900;
}

.why-deco-line {
    position: relative;
    padding-left: calc(20 / 1920 * 100vw);
    padding-top: calc(157/ 1920 * 100vw);
}

.why-deco-line .line {
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    height: calc(60 / 1920 * 100vw);
    background-color: #fff;
    height: 100%;
}

.small-text {
    font-size: calc(24/ 1920 * 100vw);
    color: #fff;
    position: absolute;
    bottom: 0;
    left: calc(20 / 1920 * 100vw);
}

/* --- Pain Points Row --- */
.pain-points-row .rows {
    display: flex;
    justify-content: space-between;
}

.pain-points-row {
    padding-left: calc(230/ 1920 * 100vw);
    padding-right: 0;
}

/* Left Content */
.pain-left {
}

.pain-title-group {
    position: relative;
    margin-bottom: calc(40 / 1920 * 100vw);
}

.question-mark {
    font-style: italic;
    font-size: calc(110/ 1920 * 100vw);
    color: #FF5700;
    font-weight: 900;
    line-height: 1;
    left: 0;
    background: linear-gradient(179deg,#ff7100 42.93%,rgb(255 113 0 / 60%) 63.59%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    width: calc(75/ 1920 * 100vw);
    display: inline-block;
}

.pain-title-group h3 {
    font-size: calc(56/ 1920 * 100vw);
    font-weight: bold;
    line-height: 1.2;
    position: relative;
    z-index: 1;
    margin-bottom: calc(93/ 1920 * 100vw);
    margin-left: calc(24/ 1920 * 100vw);
    margin-top: calc(-66 / 1920 * 100vw);
}

.thin-line {
    width: calc(606/ 1920 * 100vw);
    /* 或者延伸到右边 */
    height: 1px;
    background-color: #fff;
    position: absolute;
    opacity: .4;
    right: calc(80/ 1920 * 100vw);
    top: calc(74/ 1920 * 100vw);
}

/* 列表 */
.pain-list {
    display: flex;
    flex-direction: column;
}

.pain-item {
    border-left: calc(9 / 1920 * 100vw) solid #E87011;
    padding-left: calc(10/ 1920 * 100vw);
}

.pain-item h4 {
    font-size: calc(32/ 1920 * 100vw);
    color: #fff;
    margin-bottom: calc(14 / 1920 * 100vw);
    font-weight: normal;
}

.pain-item:last-child p {
    padding: calc(5 / 1920 * 100vw);
}

.pain-item p {
    font-size: calc(32/ 1920 * 100vw);
    color: #666;
    padding-bottom: calc(14 / 1920 * 100vw);
}

/* Right Images */
.pain-right-imgs {
    display: flex;
    /* 无间隙拼贴 */
}

.pain-img-box {
    flex: 1;
    height: calc(335/ 1920 * 100vw);
    overflow: hidden;
    position: relative;
    height: calc(361/ 1920 * 100vw);
}
.pain-img-box img:hover{
    
-webkit-transform: scale(1.05,1.05);
-o-transform: scale(1.05,1.05);
-moz-transform: scale(1.05,1.05);
-ms-transform: scale(1.05,1.05);
transform: scale(1.05,1.05);

}
.pain-img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* 黑白滤镜 */
    filter: grayscale(100%);
    transition: filter 0.5s;
    -webkit-transition: all 0.4s;
    -o-transition:all 0.4s;
    -moz-transition:all 0.4s;
    -ms-transition:all 0.4s;
    transition:all 0.4s;
    cursor: pointer;
}

.pain-img-box:hover img {
    filter: grayscale(0%);
}

.why-features-section {
    background-color: #000;
    color: #fff;
    padding-bottom: calc(100 / 1920 * 100vw);
    position: relative;
    padding-bottom: calc(287/ 1920 * 100vw);
}

.feature-block {
    position: relative;
    zoom:1;/* overflow:hidden;*/
    background: #000;
}

.brown-stripe {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(335/ 1920 * 100vw);
    /* 棕色条高度 */
    background: rgba(255,113,0,0.50);
    /* 深棕色 */
    z-index: 0;
}

.feat-row {
    display: flex;
    justify-content: space-between;
    position: relative;
    /* margin-top:calc(100 / 1920 * 100vw);*/
    /* padding-bottom:calc(138/ 1920 * 100vw);*/
}

.feat-text {
    width: 24%;
}

.num-title {
    text-align: center;
}

.num-title .num {
    vertical-align: middle;
    font-style: italic;
    font-size: calc(110 / 1920 * 100vw);
    color: #FF5700;
    font-weight: 900;
    line-height: 1;
    left: 0;
    background: linear-gradient(104deg,#ff7100 42.93%,rgb(255 113 0 / 60%) 84.59%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    width: auto;
    display: inline-block;
    padding-right: calc(10 / 1920 * 100vw);
}

.num-title h3 {
    font-size: calc(92/ 1920 * 100vw);
    font-weight: 900;
    line-height: 1.2;
    display: inline-block;
    font-weight: normal;
    vertical-align: middle;
    color: #fff;
    position: relative;
    z-index: 5;
}

.feat-desc {
    font-size: calc(20/ 1920 * 100vw);
    color: #929292;
    line-height: 1.6;
    margin-bottom: calc(24/ 1920 * 100vw);
}

.btn-more-simple {
    color: #E87011;
    font-size: calc(16 / 1920 * 100vw);
    margin-left: calc(12/ 1920 * 100vw);
    display: inline-block;
    background: url(../images/more1.png) no-repeat right center;
    background-size: calc(20/ 1920 * 100vw);
    line-height: calc(20/ 1920 * 100vw);
    padding-right: calc(28/ 1920 * 100vw);
}

.feat-cards-group {
    width: 60%;
    display: flex;
    gap: calc(38/ 1920 * 100vw);
}

.mini-card {
    flex: 1;
    background-color: #333;
    padding: calc(24/ 1920 * 100vw);
    /* 顶部橙条 */
    /* 卡片稍微超出棕色条 */
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    background: #2F2C2A;
    box-shadow: 0 4px 30px 0 rgba(109,109,109,0.25);
}

.mc-icon img {
    width: calc(24 / 1920 * 100vw);
    position: absolute;
    top: 50%;
    left: 50%;
    -o-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.mc-icon {
    color: #FF5700;
    margin-bottom: calc(10 / 1920 * 100vw);
    border-radius: 40px;
    background: #FF7100;
    box-shadow: 0 5px 10px 0 rgba(255,113,0,0.30);
    width: calc(40/ 1920 * 100vw);
    height: calc(40/ 1920 * 100vw);
    position: relative;
    margin-bottom: calc(24/ 1920 * 100vw);
}

.mini-card h4 {
    font-size: calc(32/ 1920 * 100vw);
    margin-bottom: calc(24/ 1920 * 100vw);
}

.mini-card p {
    font-size: calc(14 / 1920 * 100vw);
    color: #999;
    margin-bottom: calc(24/ 1920 * 100vw);
    line-height: 1.4;
    /* 固定高度对齐 */
}

.mc-img img {
    width: 100%;
    height: auto;
    height: calc(187/ 1920 * 100vw);
    object-fit: cover;
}

.feat-img-box {
    width: calc(968/ 1920 * 100vw);
    position: relative;
}

.feat-img-box img {
    width: 100%;
    display: block;
}

.orange-overlay-box {
    position: absolute;
    bottom: calc(90 / 1920 * 100vw);
    left: calc(-140 / 1920 * 100vw);
    /* 向左溢出 */
    background-color: #FF7100;
    padding: calc(2 / 1920 * 100vw);
    color: #fff;
    z-index: 2;
}

.orange-overlay-box h4 {
    font-size: calc(60 / 1920 * 100vw);
    line-height: 1.2;
    text-transform: capitalize;
    font-weight: 300;
}

.addline {
    position: relative;
    width: 100%;
}

.long-line {
    flex: 1;
    height: 1px;
    background-color: #666;
    margin-bottom: calc(20 / 1920 * 100vw);
    position: absolute;
    width: calc(763/ 1920 * 100vw);
    right: calc(80/ 1920 * 100vw);
    top: calc(65/ 1920 * 100vw);
}

.mb-40 {
    margin-bottom: calc(40 / 1920 * 100vw);
}

.process-tabs {
    display: flex;
    margin-top: calc(64/ 1920 * 100vw);
    border: 1px solid #333;
}

.pt-item {
    flex: 1;
    text-align: center;
    padding: calc(32/ 1920 * 100vw) 0;
    color: #fff;
    font-size: calc(30/ 1920 * 100vw);
    cursor: pointer;
    border-right: 1px solid #333;
    -webkit-transition: all 0.4s;
    -o-transition:all 0.4s;
    -moz-transition:all 0.4s;
    -ms-transition:all 0.4s;
    transition:all 0.4s;
}

.pt-item.active {
    background-color: #FF5700;
}

.process-content-box {
    width: 100%;
    padding: calc(32/ 1920 * 100vw) calc(8/ 1920 * 100vw);
    display: none;
}

.process-content-box img {
    width: 100%;
}

.wide-text {
    width: 45%;
    /* 文字区域宽一点 */
}

.text-list {
    list-style: none;
    padding: 0;
}

.text-list li {
    margin-bottom: calc(20 / 1920 * 100vw);
    font-size: calc(16 / 1920 * 100vw);
    line-height: 1.6;
    color: #ccc;
}

.text-list strong {
    color: #fff;
}

.feat-img-tall {
    width: calc(766/ 1920 * 100vw);
    height: calc(1033/ 1920 * 100vw);
    /* 竖图高度 */
    overflow: hidden;
}

.feat-img-tall img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.section-divider {
    height: 1px;
    background-color: #333;
    margin-left: calc(33/ 1920 * 100vw);
    margin-right: calc(33/ 1920 * 100vw);
    margin-top: calc(160/ 1920 * 100vw);
}

.center-header {
    text-align: center;
    margin-bottom: calc(70 / 1920 * 100vw);
}

.num-title.center {
    display: inline-block;
    text-align: left;
    /* 数字和文字内部还是左对齐组合，整体居中 */
    position: relative;
}

.num-title.center .num {
    position: absolute;
    left: calc(-105 / 1920 * 100vw);
    top: calc(-33 / 1920 * 100vw);
    opacity: 0.8;
}

.value-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: calc(170 / 1920 * 100vw) calc(60 / 1920 * 100vw);
}

.value-item {
    width: 48%;
    /* 两列 */
}

.val-img {
    width: 100%;
    height: calc(447/ 1920 * 100vw);
    overflow: hidden;
    margin-bottom: calc(30 / 1920 * 100vw);
}

.val-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
    cursor: pointer;
}

.value-item:hover .val-img img {
    transform: scale(1.05);
}

.val-info {
    display: flex;
    align-items: flex-start;
    padding-top: calc(60 / 1920 * 100vw);
}

.val-info h4 {
    font-size: calc(40/ 1920 * 100vw);
    color: #fff;
    width: 35%;
    font-weight: normal;
}

.val-info p {
    font-size: calc(26/ 1920 * 100vw);
    color: #fff;
    width: 44%;
    line-height: 1.6;
}

.container.type1 {
    padding-left: calc(80 / 1920 * 100vw);
    padding-right: calc(80 / 1920 * 100vw);
    width: 100%;
}

.whytinytitle span {
    line-height: calc(32/ 1920 * 100vw);
    padding: 0 calc(36/ 1920 * 100vw) 0 calc(12/ 1920 * 100vw);
    display: inline-block;
    border-radius: 21104000px;
    background: #FF7100;
    font-size: calc(16/ 1920 * 100vw);
    background: url(../images/arrow-right-circle2.png) no-repeat 92% center #FF7100;
    background-size: calc(20/ 1920 * 100vw);
    margin-bottom: calc(33/ 1920 * 100vw);
}

.whytinytitle {
    text-align: center;
}

.feat1 {
    margin-top: calc(100 / 1920 * 100vw);
    padding-bottom: calc(138 / 1920 * 100vw);
}

.feat2 .feat-text {
    width: 100%;
    width: auto;
    white-space: nowrap;
}

.feat2 {
    padding-left: calc(142/ 1920 * 100vw);
    padding-right: 0;
    padding-top: calc(182/ 1920 * 100vw);
    padding-bottom: calc(206/ 1920 * 100vw);
}

.feat4 {
    padding-left: calc(142/ 1920 * 100vw);
    padding-right: calc(114/ 1920 * 100vw);
}

.feat3 {
    padding-left: calc(142/ 1920 * 100vw);
    padding-right: 0;
}

.num-title.type2 {
    position: relative;
    text-align: left;
    /* width:auto;*/
}

.num-title.type2 .num {
    vertical-align: sub;
    position: relative;
    top: calc(-68/ 1920 * 100vw);
}

.num-title.type2 h3 {
    position: relative;
    left: calc(-34/ 1920 * 100vw);
}

.feat4 .feat-text {
    width: 44%;
}

.feat4 .feat-desc2 {
    padding-top: calc(159/ 1920 * 100vw);
    font-size: calc(32/ 1920 * 100vw);
    color: #fff;
    width: calc(473/ 1920 * 100vw);
}

.feat4 .feat-desc2 p {
    padding-bottom: calc(32/ 1920 * 100vw);
    line-height: 1.6;
}

.block-04 {
    padding-bottom: calc(92/ 1920 * 100vw);
}

.block-05 {
    padding-left: calc(80/ 1920 * 100vw);
    padding-right: calc(80/ 1920 * 100vw);
    padding-bottom: calc(150/ 1920 * 100vw);
}
.val-info.wap{
    display: none;
}
/* 容器设为相对定位，方便可能的扩展 */
.process-content-box { 
    display: none; 
    width: 100%;
    overflow: hidden;
}

/* 激活时显示 */
.process-content-box.active { 
    display: block; 
}

/* 图片动画：透明度从 0->1，大小从 1.05->1 (从大到小) */
.process-content-box.active img {
    animation: smoothScale 0.6s ease-out forwards;
}

@keyframes smoothScale { 
    0% { 
        opacity: 0; 
        transform: scale(1.08); /* 稍微放大一点点就行，别缩成0 */
    }
    10% {
        opacity: 0.1; /* 快速让图片显形，防止白屏 */
    }
    100% { 
        opacity: 1; 
        transform: scale(1); 
    } 
}


.bdModel{
position: relative;
}
.bdModel .btn{
    cursor: pointer;
    z-index: 54;
    position: absolute;
    height: 100%;
    width:calc(40/ 1920 * 100vw);
    top: calc(-20/ 1920 * 100vw);
}
.bdModel .btn.btn-prev{
    left: 0px;
    background: url(../images/left.png) no-repeat center center;
    background-size: 100%;
}
.bdModel .btn.btn-next{
    right: 0px;
    background: url(../images/right.png) no-repeat center center;
    background-size: 100%;
}
.map-point:hover{
    z-index:88
}  


