/* body {
    font-size: 16px;
} */

/* :root {
    --12px: 0.75rem;
    --14px: 0.875rem;
    --16px: 1rem;
    --18px: 1.125rem;
    --20px: 1.25rem;
    --24px: 1.25rem;
    --28px: 1.75rem;
    --30px: 1.875rem;
    --32px: 2rem;
    --36px: 2.25rem;
    --40px: 2.5rem;
    --48px: 3rem;
    --50px: 3.125rem;
    --52px: 3.25rem;
    --54px: 3.375rem;
    --56px: 3.5rem;
    --60px: 3.75rem;
    --62px: 3.875rem;
    --64px: 4rem;
    --72px: 4.5rem;
    --80px: 5rem;
    --90px: 5.625rem;
    --120px: 7.5rem;
} */

:root {
    --12px: 0.75rem;
    --14px: 0.875rem;
    --16px: 1rem;
    --18px: 1.125rem;
    --20px: 1.25rem;
    --24px: 1.25rem;
    --28px: 1.5rem;
    --30px: 1.5625rem;
    --32px: 1.6875rem;
    --36px: 1.875rem;
    --40px: 2.0625rem;
    --48px: 2.5rem;
    --50px: 2.625rem;
    --52px: 2.6875rem;
    --54px: 2.8125rem;
    --56px: 2.875rem;
    --60px: 3.125rem;
    --62px: 3.1875rem;
    --64px: 3.3125rem;
    --72px: 3.75rem;
    --80px: 4.125rem;
    --90px: 4.6875rem;
    --120px: 6.25rem;
}

img {
    user-select: none;
}

.flex {
    display: flex;
}

.disc>li {
    padding-left: 15px;
    position: relative;
}

.disc>li::before {
    font-family: initial;
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: #00d683;
    position: absolute;
    top: 11px;
    left: 0;
}

.pagin {
    text-align: center;
}

.pagin span {
    width: 12px !important;
    height: 12px !important;
}

.pagin span.swiper-pagination-bullet-active {
    background-color: #00d683 !important;
}

.more {
    width: fit-content;
    padding: var(--18px) 1.5625rem;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 5px;
    font-size: var(--16px);
    color: #fff;
    font-weight: 500;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    transition: all .6s ease;
}

.more:hover {
    background-color: #fff;
    color: #00d683;
}

.more>div {
    width: 24px;
    height: 24px;
    border-radius: 3px;
    background-color: #00d683;
    margin-left: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .6s ease;
}

.more:hover>div {
    margin-left: 20px;
}

/* banner */
.banner {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.banner>img {
    width: 100%;
    max-height: 100lvh;
    display: block;
}

.banner>.info {
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
}

.half>.info {
    top: 56%;
}

.half>.info {
    margin-bottom: 0;
}

.banner>.info>.title {
    font-family: 'UAFSANS COND';
    font-size: 4.25rem;
    line-height: 100%;
    text-transform: uppercase;
    margin-bottom: 1.875rem;
}

.banner>.info>p {
    font-size: var(--24px);
    line-height: 150%;
    font-weight: 300;
    max-width: 47rem;
    width: 100%;
}

.sNav {
    background-color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    /* margin-bottom: 5.9375rem; */
}

.sNav>.center {
    column-gap: 20px;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.sNav>.center>span {
    text-transform: uppercase;
}

.sNav>.center>span,
.sNav>.center>.box a {
    font-size: var(--16px);
    font-weight: 500;
    line-height: 375%;
    color: #000;
}

.sNav>.center>.box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.8125rem;
    margin-left: auto;
}

.sNav>.center>.box>a {
    font-weight: 300;
    transition: color .3s ease;
}

.sNav>.center>.box>a:hover,
.sNav>.center>.box>a.act {
    color: #00d683;
}

/* crumbs */
.crumbs>.center {
    display: flex;
    align-items: center;
    justify-content: end;
    padding: 3.125rem 0;
}

.crumbs>.center>img {
    margin-right: 5px;
}

.crumbs>.center>span,
.crumbs>.center>a {
    font-size: var(--18px);
    color: #999;
    font-weight: 300;
    text-transform: uppercase;
}

.crumbs>.center>a:last-child {
    color: #000;
}

/* ÃƒÂ¨Ã‚Â¡Ã‚Â¨ÃƒÂ¥Ã‚ÂÃ¢â‚¬Â¢ÃƒÂ©Ã‚ÂªÃ…â€™ÃƒÂ¨Ã‚Â¯Ã‚Â */
.required {
    position: relative;
}

.invalid {
    /* max-width: 100px; */
    padding: 8px 10px;
    position: absolute !important;
    top: 70%;
    left: 20%;
    transform: translateY(-50%);
    background-color: #ff5c13;
    border-radius: 5px;
    font-size: var(--14px--);
    color: #fff;
    white-space: nowrap;
    /* overflow: hidden; */
    user-select: none;
    animation: invalidW 1s forwards;
}

.message>.invalid {
    /* top: calc(15% + 15px); */
    top: 26px;
    left: 25%;
    transform: translateY(0);
}

.verify>.invalid {
    top: 50%;
}

.invalid::before {
    content: '';
    border-right: 10px solid #ff5c13;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(-100%, -50%);
}

@keyframes invalidW {
    0% {
        max-width: 0;
        /* overflow: hidden; */
        white-space: nowrap;
    }

    100% {
        max-width: 300px;
        overflow: visible;
        grid-template-rows: repeat();
    }
}

@keyframes restinvalidW {
    0% {
        max-width: 300px;
    }

    60% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        max-width: 0px;
    }
}

/* about */
.ab1 {
    width: 100%;
    position: relative;
    z-index: 1;
    padding: 4.375rem 0;
}

.ab1>.center>.top {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    margin-bottom: 3.125rem;
}

.ab1>.center>.top>.counter:nth-of-type(-n+2) {
    grid-column: span 3;
}

.ab1>.center>.top>.counter:nth-of-type(n+3) {
    grid-column: span 2;
}

.ab1>.center>.top>.counter {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding: 3.125rem 4rem 5.875rem 4rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.13) !important;
    border-right: 1px solid rgba(0, 0, 0, 0.13);
    border-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.13) 70%, rgba(0, 0, 0, 0)) 1;
}

.ab1>.center>.top>.counter:nth-of-type(2),
.ab1>.center>.top>.counter:last-child {
    border-right: 0;
}

.ab1>.center>.top>.counter:nth-of-type(-n+2) {
    border-image: linear-gradient(to top, rgba(0, 0, 0, 0.13) 70%, rgba(0, 0, 0, 0)) 1;
}

.ab1>.center>.top>.counter>.num {
    width: fit-content;
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    color: #00d683;
    line-height: 100%;
}

.ab1>.center>.top>.counter>span {
    height: fit-content;
    font-family: 'UAFSANS COND';
    color: #00d683;
    text-transform: uppercase;
}

.ab1>.center>.top>.counter:nth-of-type(-n+2)>span {
    font-size: var(--40px);
    margin-top: auto;
    margin-bottom: .5rem;
}

.ab1>.center>.top>.counter:nth-of-type(n+3)>span {
    font-size: var(--40px);
    vertical-align: super;
}

.ab1>.center>.top>.counter>p {
    flex: 0 0 100%;
    font-size: var(--18px);
    font-weight: 300;
    line-height: 111.1111111%;
    color: #000;
}


.ab1>.center>.bottom {
    display: flex;
    justify-content: space-between;
}

.ab1>.center>.bottom>div {
    width: 48%;
}

.ab1>.center>.bottom>div>p {
    font-size: var(--18px);
    line-height: 200%;
    color: #000;
    font-weight: 300;
}

.ab1>.center>.bottom>div>p:not(:last-child) {
    margin-bottom: 1.5rem;
}

.ab2 {
    width: 100%;
    min-height: 100lvh;
    position: relative;
    transform: translateZ(0);
}

.ab2>.imgBox {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.ab2>.imgBox>img {
    width: 100%;
    min-height: 100lvh;
    display: block;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}

.ab2>.info {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 2;
    padding: 6.25rem 0;
}

.ab2>.info>.title {
    font-family: 'UAFSANS COND';
    font-size: var(--80px);
    line-height: 112.5%;
    color: #fff;
    text-transform: uppercase;
}

.ab2>.info>p {
    font-size: var(--24px);
    font-weight: 300;
    color: #fff;
    margin-bottom: 3.75rem;
    text-align: center;
}

.ab2 .histBox {
    width: 100%;
    position: relative;
    padding-bottom: 6rem;
}

.ab2 .histBox::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 1px;
    height: calc(100% - 8px);
    z-index: -1;
    transform-origin: center center;

    background: linear-gradient(to bottom, transparent 0%, #fff 10%, #fff 85%, transparent 100%);
    color: transparent;
    -webkit-mask-image: repeating-linear-gradient(to bottom,
            #000 0,
            #000 4px,
            transparent 4px,
            transparent 4px);
    mask-image: repeating-linear-gradient(to bottom,
            #000 0,
            #000 4px,
            transparent 4px,
            transparent 8px);
    opacity: 0.3;
}

.ab2 .histBox li {
    width: 50%;
    display: flex;
    flex-direction: column;
    position: relative;
}

.ab2 .histBox>li:nth-of-type(even) {
    margin-left: auto;
}

.ab2 .histBox>li:nth-of-type(even)>.line>svg {
    transform: rotateY(180deg);
}

.ab2 .histBox .hist>.line {
    width: 100%;
    position: relative;
}

.ab2 .histBox .hist>.line::before {
    content: "";
    position: absolute;
    top: 100%;
    right: 0;
    transform: translate(50%, -150%);
    width: 11px;
    height: 11px;
    background-color: #00d683;
    border-radius: 50%;
}

.ab2 .histBox>li:nth-of-type(even)>.line::before {
    right: initial;
    left: 0;
    transform: translate(-50%, -150%);
}

.ab2 .histBox .hist>.line>svg {
    width: 100%;
}

.ab2 .histBox .hist>.line>svg>path {
    fill: none;
    stroke: #22d3a7;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 1100;
    stroke-dashoffset: 1100;
}

@keyframes drawLine {
    0% {
        stroke-dashoffset: 1100;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

.drawLine {
    animation-name: drawLine;
    animation-fill-mode: forwards;
}


.ab2 .histBox .hist>.year {
    width: calc(100% - 12rem);
    font-size: var(--90px);
    line-height: 100%;
    font-weight: 100;
    color: #fff;
}

.ab2 .histBox .hist>.year span {
    position: relative;
    display: inline-block;
}

.ab2 .histBox .hist>.year span img {
    position: absolute;
    left: 100%;
    width: 11rem;
    height: auto;
    bottom: 0;
    margin-left: 2rem;
    max-height: clamp(110px, 10.4602510460251vw, 200px);
    object-fit: contain;
}

.ab2 .histBox .hist:nth-child(even)>.year {
    padding-left: 12rem;
}

.ab2 .histBox .hist>.infoBox {
    width: calc(100% - 12rem);
    position: absolute;
    left: 0;
    bottom: 0;
}

.ab2 .histBox .hist:nth-child(even)>.infoBox {
    left: 12rem;
}

.ab2 .histBox .hist>.infoBox>p.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--30px);
    color: #fff;
    margin-bottom: 10px;
}

.ab2 .histBox .hist>.infoBox>p.info {
    font-size: var(--18px);
    line-height: 133.3333333333%;
    color: #fff;
    font-weight: 100;
}

.ab3 {
    width: 100%;
    position: relative;
    background-color: #fff;
    padding: 9.75rem 0;
}

.ab3>.center {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ab3>.center>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--80px);
    line-height: 112.5%;
    text-transform: uppercase;
    color: #000;
    margin-bottom: 5.3125rem;
}

.ab3>.center>.tit>span {
    color: #00d683;
}

.ab3>.center>.flex {
    width: 100%;
    gap: 1.875rem;
}

.ab3>.center>.flex>div {
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}

.ab3>.center>.flex>div>img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
    transition: transform 1.5s ease;
}

.ab3>.center>.flex>div:hover>img {
    transform: scale(1.05);
}

.ab3>.center>.flex>div>.info {
    width: 100%;
    height: 100%;
    padding: 4.875rem 3.5rem;
    position: absolute;
    top: 0;
    left: 0;
    color: #fff;
}

.ab3>.center>.flex>div>.info>.tit {
    font-family: 'UAFSANS COND';
    font-size: 2.25rem;
    line-height: 100%;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.ab3>.center>.flex>div>.info>.info {
    font-size: var(--18px);
    line-height: 133.333333333333%;
    color: #fff;
    font-weight: 300;
    margin-bottom: 2.5rem;
}

.ab4 {
    padding: 8.75rem 0;
    background-color: #f4f6f9;
    position: relative;
}

.ab4>.center>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--80px);
    line-height: 112.5%;
    color: #000;
    text-align: center;
    margin-bottom: 5.3125rem;
}

.ab4>.center>.honor {
    width: 100%;
    margin-bottom: 5.1875rem;
}

.ab4>.center>.honor .swiper-wrapper {
    align-items: stretch;
}

.ab4>.center>.honor .swiper-slide {
    min-height: 100%;
    height: auto !important;
    padding: 3.125rem 2.625rem;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
}

.ab4>.center>.honor .swiper-slide>.imgBox {
    height: 13.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    /* overflow: hidden; */
    margin-bottom: 4.0625rem;
}

.ab4>.center>.honor .swiper-slide>.imgBox img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 14px 3px rgba(0, 0, 0, 0.3)) drop-shadow(0 25px 30px rgba(0, 0, 0, 0.25));

    /* box-shadow: 0 14px 10px 0 rgba(0, 0, 0, 0.3),
        0 45px 57px 0 rgba(0, 0, 0, 0.25); */
}

.ab4>.center>.honor .swiper-slide>p {
    font-size: var(--18px);
    line-height: 133.3333333333333%;
    font-weight: 300;
    color: #000;
    text-align: center;
}

.ab5 {
    padding: clamp(60px, 6.276150627615063vw, 120px) 0;
    background: url("/src/imgs/advantage.jpg") no-repeat;
    background-size: 100% 100%;
}

.ab5>.center>span {
    display: block;
    font-size: var(--18px);
    line-height: 100%;
    font-weight: 500;
    color: #fff;
    margin-bottom: 2.1875rem;
    text-transform: uppercase;
}

.ab5>.center>div.title {
    font-family: 'UAFSANS COND';
    font-size: 3.5rem;
    line-height: 100%;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 4.6875rem;
}

.ab5>.center>div.title>span {
    color: #00d683;
}

.ab5>.center>a.more {
    margin-bottom: 9.6875rem;
}

.ab5>.center>.bott {
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    justify-content: space-between;
    gap: 7rem;
}

.ab5>.center>.bott>div {
    width: calc((100% - 21rem) / 4);
    color: #fff;
    position: relative;
}

.ab5>.center>.bott>div a {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.ab5>.center>.bott>div>.counter {
    font-family: 'UAFSANS COND';
    font-size: 4.25rem;
    line-height: 100%;
    display: flex;
    align-items: start;
    margin-bottom: 10px;
}

.ab5>.center>.bott .t {
    font-size: 1.25rem;
    font-weight: 500;
    margin-bottom: 1rem;
}

.ab5>.center>.bott>div>.counter>span {
    font-size: calc(var(--90px) * 7 / 12);
    vertical-align: super;
    line-height: 100%;
}

.ab5>.center>.bott>div>p {
    font-size: var(--18px);
    line-height: 133.333333333%;
    color: rgba(255, 255, 255, 0.7);
    font-weight: 300;
}

.ab6 {
    background: url("/src/imgs/global.jpg") no-repeat;
    background-size: 100% 100%;
    padding: 4.0625rem 0 9.375rem;
}

.ab6>.center>img {
    max-width: 100%;
    object-fit: contain;
    display: block;
    margin: 0 auto;
    margin-bottom: 2.1875rem;
}

.ab6>.center>.info {
    display: flex;
    align-items: start;
    justify-content: space-between;
}

.ab6>.center>.info>.left {
    width: 45%;
}

.ab6>.center>.info>.left>.tit {
    font-family: 'UAFSANS COND';
    font-size: 4.25rem;
    color: #fff;
    text-transform: uppercase;
}

.ab6>.center>.info>.left>p {
    font-size: var(--18px);
    line-height: 133.333333333333%;
    color: #fff;
    font-weight: 300;
}

.ab6>.center>.info>.right {
    width: 37.5%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6.25rem;
}

.ab6>.center>.info>.right>.counter {
    flex: 1;
    display: flex;
    flex-wrap: wrap;
}

.ab6>.center>.info>.right>.counter>.num,
.ab6>.center>.info>.right>.counter>span,
.ab6>.center>.info>.right>.counter>sub {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    line-height: 100%;
    color: #fff;
}

.ab6>.center>.info>.right>.counter>sub {
    font-size: calc(var(--90px) * 7 / 12);
    line-height: 100%;
    vertical-align: sub;
}

.ab6>.center>.info>.right>.counter>p {
    width: auto;
    flex: 1 0 100%;
    font-weight: 300;
    color: #fff;
    font-size: var(--18px);
    line-height: 166.66666666667%;
}

.ab7 {
    padding: 9.6875rem 0 8.25rem;
    background-color: #fff;
}

.ab7>.center>.title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 5.625rem;
}

.ab7>.center>.title>span {
    font-family: 'UAFSANS COND';
    font-size: var(--80px);
    line-height: 100%;
    text-transform: uppercase;
    color: #000;
}

.ab7>.center>.title>.more {
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #000;
}

.ab7>.center>.title>.more:hover {
    background-color: #00d683;
    color: #fff;
}


.ab7>.center>.title>.more:hover>div {
    background-color: #fff;
}

.ab7>.center>.title>.more:hover>div path {
    fill: #00d683;
}

.ab7 .social {
    width: 100%;
    margin-bottom: 5rem;
}

.ab7 .social .swiper-slide {
    display: block;
}

.ab7 .social .imgBox {
    height: 300px;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 2.5rem;
}

.ab7 .social .imgBox img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    user-select: none;
    transition: all 1.5s ease;
}

.ab7 .social .swiper-slide:hover .imgBox img {
    transform: scale(1.05);
}

.ab7 .social .swiper-slide>p {
    font-size: var(--18px);
    line-height: 166.666666666667%;
    font-weight: 300;
    color: #000;
    transition: color .6s ease;
}

.ab7 .social .swiper-slide:hover>p {
    color: #00d683;
}

/* Brand Advantages */
.qu1 {
    position: relative;
    overflow: hidden;
    padding-top: 5.9375rem;
}

.qu1>.center {
    display: flex;
    justify-content: space-between;
    margin-bottom: 5.3125rem;
}

.qu1>.center>.left {
    width: 50%;
}

.qu1>.center>.left>p {
    font-size: var(--18px);
    line-height: 166.666666666%;
    color: #000;
    margin-bottom: 1.6em;
    font-weight: 300;
}

.qu1>.center>.right {
    width: 35.5%;
    height: fit-content;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 5.625rem;
}

.qu1>.center>.right>.box {
    grid-column: span 2;
}

.qu1>.center>.right>.box>div {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    line-height: 100%;
    color: #00d683;
}

.qu1>.center>.right>.box>p {
    font-size: var(--18px);
    line-height: 166.6666666666%;
    color: #000;
    font-weight: 300;
}

.qu1>.center>.right>.counter {
    flex: 1;
    grid-column: span 1;
    display: flex;
    flex-wrap: wrap;
}

.qu1>.center>.right>.counter>p {
    flex: 0 0 100%;
}

.qu1>.center>.right>.counter>.num {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    line-height: 100%;
    color: #00d683;
}

.qu1>.center>.right>.counter>span {
    font-family: 'UAFSANS COND';
    display: block;
    font-size: var(--36px);
    line-height: 100%;
    text-transform: uppercase;
    margin-top: auto;
    margin-bottom: 2.1875rem;
    color: #00d683;
}

.qu1>.center>.right>.counter>sub {
    font-size: calc(var(--90px) * 7 / 12);
    font-family: 'UAFSANS COND';
    vertical-align: sub;
    line-height: 100%;
    color: #00d683;
}

.qu1>.center.igs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1px;
}

.qu1>.center.igs>img {
    flex: 0 1 auto;
    min-width: 0;
    height: auto;
}

.qu2 {
    padding: 6.25rem 0;
    background-color: #f4f6f9;
}

.qu2>.center>.title {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 150%;
    color: #000;
    text-transform: uppercase;
    margin-bottom: 2.5rem;
}

.qu2>.center>.equipment img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.qu2>.center>.equipment {
    margin-bottom: 3.4375rem;
}

.digital1 {
    padding-top: 5.9375rem;
    padding-bottom: 1.875rem;
}

.digital1>.center {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
}

.digital1 .left {
    width: 50%;
}

.digital1 .left>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    line-height: 100%;
    text-transform: uppercase;
    color: #00d683;
    margin-bottom: 2.5rem;
}

.digital1 .left>p {
    font-size: var(--18px);
    line-height: 166.66666666666%;
    color: #000;
    font-weight: 300;
    margin-bottom: 3.125rem;
}

.digital1 .left>.box {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 1.75rem;
}

.digital1 .left>.box>div {
    flex: 1;
    box-shadow: 0 5px 25px 0 rgba(0, 0, 0, 0.05);
    padding: 1.875rem 2.75rem;
}

.digital1 .left>.box>div>.tit {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.875rem;
}

.digital1 .left>.box>div>.tit>b {
    font-size: var(--18px);
    line-height: 133.333333333333%;
    color: #000;
    font-weight: 500;
    transition: color .6s ease;
}

.digital1 .left>.box>div:hover>.tit>b {
    color: #00d683;
}

.digital1 .left>.box>div>.tit>img {
    max-height: 55px;
    object-fit: contain;
    transition: transform .6s ease;
}

.digital1 .left>.box>div:hover>.tit>img {
    transform: translateY(-15px) rotateY(360deg);
}

.digital1 .left>.box>div>p {
    font-size: var(--18px);
    line-height: 133.333333333333%;
    font-weight: 300;
    color: #666;
}

.digital1 .right {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: end;
}

.digital1 .right ul {
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.digital1 .right ul li {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
}

.digital1 .right ul li>.num {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    color: #00d683;
}

.digital1 .right ul li>span {
    font-family: 'UAFSANS COND';
    font-size: var(--36px);
    color: #00d683;
    display: block;
    margin-bottom: 15px;
}

.digital1 .right ul li>b,
.digital1 .right ul li>p {
    flex: 0 0 100%;
    font-size: var(--18px);
    line-height: 166.6666666666%;
}

.digital1 .right ul li>b {
    color: #000;
    font-weight: 500;
}

.digital1 .right ul li>p {
    color: #666;
}

.digital2 {
    width: 100%;
    position: relative;
    padding: 8.5625rem 0;
}

.digital2>.center>.title {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    line-height: 100%;
    color: #00d683;
    text-transform: uppercase;
    margin-bottom: 2.5rem;
}

.digital2 .operation .swiper-wrapper {
    align-items: stretch;
}

.digital2 .operation .swiper-slide {
    display: block;
    min-height: 100%;
    height: auto !important;
    position: relative;
    border-radius: 5px;
    padding: 3.125rem 1.25rem 1.625rem 1.25rem;
    background-color: #f6f8fa;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.digital2 .operation .swiper-slide>.tit>b {
    display: block;
    font-size: var(--18px);
    line-height: 166.66666666667%;
    font-weight: 500;
    color: #00d683;
    margin-bottom: 10px;
}

.digital2 .operation .swiper-slide>.tit>p {
    font-size: var(--18px);
    line-height: 133.3333333333333%;
    font-weight: 300;
    color: #666;
    margin-bottom: 2.1875rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-clamp: 4;
    overflow: hidden;
    text-overflow: ellipsis;
}

.digital2 .operation .swiper-slide>.imgBox {
    width: 100%;
    height: 230px;
    overflow: hidden;
    border-radius: 5px;
}

.digital2 .operation .swiper-slide>.imgBox img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    transition: transform 1.2s ease;
}

.digital2 .operation .swiper-slide:hover>.imgBox img {
    transform: scale(1.05);
}

.digital2 .pagin {
    margin-top: 3.4375rem;
}

/* innovation */
.inn1 {
    position: relative;
    overflow: hidden;
    padding-bottom: 8.125rem;
    background-color: #fff;
    padding-top: 5.9375rem;
}

.inn1>.center>.tit {
    padding-bottom: 4rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.inn1>.center>.tit>.title {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    color: #00d683;
    margin-bottom: 1.5625rem;
    text-transform: uppercase;
}

.inn1>.center>.tit>p {
    font-size: var(--18px);
    line-height: 166.666666667%;
    color: #000;
    font-weight: 500;
    font-weight: 300;
}

.innParam {
    margin-bottom: 4.375rem;
}

.innParam>.row {
    display: flex;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.innParam>.row:not(.i1) {
    padding: 4.6875rem 0.9375rem;
    /*  11.0625rem 4.6875rem */
}

.innParam>.row.i1 .box {
    flex: 0 0 50%;
    display: flex;
    align-items: center;
    gap: 4.0625rem;
    padding: 4.6875rem 0.9375rem;
}

.innParam>.row.i1 .box:first-child {
    border-right: 1px solid rgba(0, 0, 0, 0.1);
}

.innParam>.row.i1 .box:last-child {
    padding-left: 8.125rem;
}

.innParam>.row.i1 .box>img {
    width: auto;
    height: auto;
    object-fit: contain;
    flex-shrink: 0;
}

.innParam>.row .box>.counter {
    display: flex;
    flex-wrap: wrap;
}

.innParam>.row .box>.counter .num {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    color: #00d683;
}

.innParam>.row .box>.counter .info {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    color: #00d683;
}

.innParam>.row .box>.counter>sub {
    font-family: 'UAFSANS COND';
    font-size: calc(var(--90px) * 7 / 12);
    line-height: 100%;
    vertical-align: sub;
    color: #00d683;
}

.innParam>.row .box>.counter>p {
    flex: 0 0 100%;
}

.innParam>.row>img {
    width: auto;
    height: auto;
    object-fit: contain;
    flex-shrink: 0;
    margin-right: 4.0625rem;
}

.innParam>.row.in2>.column {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3.75rem;
}

.innParam>.row.in2 .box {
    flex: 1;
    /* padding-right: 20.3125rem; */
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.innParam>.row.in2 .box>.counter {
    flex: 1;
    position: relative;
}

.innParam>.row.in2 .box>.counter:nth-of-type(2) {
    flex: 0.88;
}

.innParam>.row.in2 .box:nth-of-type(2) {
    align-items: end;
}

.innParam>.row.in2 .box:nth-of-type(2)>.counter:nth-of-type(1) {
    flex: 0.5;
}

.innParam>.row.in2 .box:nth-of-type(2)>.counter:nth-of-type(2) {
    flex: 1.4;
}

.innParam>.row.in2 .box:nth-of-type(2)>.counter:nth-of-type(2)>img {
    max-width: 100%;
    object-fit: contain;
}

.innParam>.row.in2 .box:nth-of-type(2)>.counter:nth-of-type(3)::after {
    content: "";
    width: 97px;
    height: 98px;
    position: absolute;
    left: 0;
    bottom: 0;
    transform: translateX(200%);
    background: url("/src/imgs/inn1-2.jpg") center/cover no-repeat;
}

.inn1>.center>.title {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 150%;
    color: #000;
    text-transform: uppercase;
}

.inn1>.center>p {
    font-size: var(--18px);
    line-height: 166.6666666666667%;
    font-weight: 300;
    color: #000;
}

.inn2 {
    width: 100%;
    position: relative;
    overflow: hidden;
    /* transform: translateZ(0); */
}

.inn2>img {
    max-width: 100%;
    min-height: 100lvh;
    object-fit: cover;
}

.inn2>img:not(.fix) {
    opacity: 0;
    visibility: hidden;
}

.inn2>img.fix {
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
}

.inn2>.info {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.inn2>.info>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    color: #fff;
    margin-bottom: 8.125rem;
    text-transform: uppercase;
}

.inn2>.info>.service {
    width: 56%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 5rem;
    row-gap: 3.75rem;
}

.inn2>.info>.service>.counter {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    padding-bottom: 15px;
    border-bottom: 2px solid #fff;
}

.inn2>.info>.service>.counter>.num {
    height: fit-content;
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    line-height: 100%;
    color: #00d683;
}

.inn2>.info>.service>.counter>sub {
    height: fit-content;
    font-size: calc(var(--90px) * 7 / 12);
    line-height: 100%;
    vertical-align: sub;
    color: #00d683;
}

.inn2>.info>.service>.counter>p {
    flex: 0 0 100%;
    height: 100%;
    color: #fff;
    font-size: var(--18px);
    line-height: 166.666666666667%;
    font-weight: 300;
}

.inn3 {
    width: 100%;
    position: relative;
    padding: 6.875rem 0;
    background-color: #fff;
}

.inn3>.center>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 150%;
    color: #000;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
}

.inn3>.center>p {
    font-size: var(--18px);
    line-height: 166.66666666667%;
    color: #000;
    font-weight: 300;
    margin-bottom: 4.0625rem;
}

.inn3>.center>.box {
    display: flex;
    margin-bottom: 5.3125rem;
    gap: 1rem;
}

.inn3>.center>.box img {
    max-width: 43rem;
    width: 44%;
}

.inn4 {
    position: relative;
    overflow: hidden;
    background-color: #fff;
    padding-bottom: 6.25rem;
}

.inn4>.center>.inn4Item {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    padding: 2.8125rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.inn4>.center>.inn4Item:first-child {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.inn4>.center>.inn4Item>div.left {
    width: 34%;
}

.inn4>.center>.inn4Item>div.left>.tit {
    font-size: var(--30px);
    line-height: 120%;
    color: #0c49a8;
    font-weight: 300;
    margin-bottom: 1.25rem;
}

.inn4>.center>.inn4Item>div.left>ul>li {
    font-size: var(--18px);
    line-height: 166.666666666667%;
    color: #666;
    font-weight: 300;
    /* padding-left: 15px; */
}

.inn4>.center>.inn4Item>div.right {
    flex: 0 0 50%;
}

.inn4>.center>.inn4Item>div.right>b {
    display: block;
    font-size: var(--18px);
    line-height: 166.666666666667%;
    font-weight: 500;
    color: #000;
    margin-bottom: 5px;
}

.inn4>.center>.inn4Item>div.right>p {
    font-size: var(--18px);
    line-height: 133.333333333%;
    color: #666;
    font-weight: 300;
}

.inn4>.center>.inn4Item>div.right>.box {
    width: 100%;
    display: flex;
    align-items: stretch;
    gap: 5.5rem;
    margin-top: 2.5rem;
}

.inn4>.center>.inn4Item>div.right>.box:not(:last-child) {
    padding-bottom: 4.6025rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.inn4>.center>.inn4Item>div.right>.box:has(div:not(.half)) {
    border-bottom: 0;
    padding-bottom: 0;
    margin-top: 0;
}

.inn4>.center>.inn4Item>div.right>.box>div {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.inn4>.center>.inn4Item>div.right>.box>div.half {
    width: calc(50% - (2.5rem / 2));
}

.inn4>.center>.inn4Item>div.right>.box>div>img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.inn4>.center>.inn4Item>div.right>.box>div>p {
    text-align: center;
    font-size: var(--18px);
    font-weight: 300;
    color: #000;
    margin-top: 2.5rem;
}

.inn5 {
    position: relative;
    overflow: hidden;
}

.inn5>img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.inn5>.info {
    position: absolute;
    left: 50%;
    bottom: 9.0625rem;
    transform: translateX(-50%);
}

.inn5>.info>.tit {
    font-family: 'UAFSANS COND';
    text-transform: uppercase;
    color: #fff;
    font-size: var(--60px);
    margin-bottom: 1.875rem;
}

.inn5>.info>p {
    width: 50%;
    font-size: var(--18px);
    line-height: 166.66666666666667%;
    color: #fff;
}

.inn6 {
    padding: 5rem 0 7.1875rem;
    background-color: #fff;
}

.inn6>.center>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 150%;
    color: #000;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.inn6>.center>p {
    font-size: var(--18px);
    line-height: 166.6666666666667%;
    color: #000;
    font-weight: 300;
}

.inn6>.center>p:nth-of-type(1) {
    margin-bottom: 4.375rem;
}

.inn6>.center>.box {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 3.125rem;
}

.inn6>.center>.box>.item {
    border-radius: 5px;
    background: linear-gradient(to right, #0b48a8, #1d66ab);
    overflow: hidden;
}

.inn6>.center>.box>.item>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inn6>.center>.box>.item:last-child {
    padding: 2.0625rem 2.875rem;
}

.inn6>.center>.box>.item:last-child>b {
    font-weight: bold;
    font-size: var(--18px);
    line-height: 166.66666666666666667%;
    color: #fff;
}

.inn6>.center>.box>.item:last-child>.counter {
    display: flex;
    align-items: end;
    margin-bottom: 5px;
}

.inn6>.center>.box>.item:last-child>.counter>.num {
    width: fit-content;
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    color: #00d683;
    line-height: 100%;
}

.inn6>.center>.box>.item:last-child>.counter>span {
    font-size: var(--36px);
    color: #00d683;
    text-transform: uppercase;
    display: block;
    margin-bottom: 5px;
}

.inn6>.center>.box>.item:last-child>p {
    font-size: var(--18px);
    line-height: 133.33333333333%;
    color: #96c3f5;
    font-weight: 300;
}

.inn6>.center>.box>.item:last-child>p>span {
    font-weight: 500;
    color: #fff;
}

/* Manufacturing Advantages */
.ad1 {
    padding: 7rem 0;
    background-color: #fff;
    overflow: hidden;
}

.ad1>.center {
    display: flex;
    justify-content: space-between;
}

.ad1>.center>.left {
    max-width: 42%;
}

.ad1>.center>.left>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    color: #00d683;
    text-transform: uppercase;
    margin-bottom: 2.1875rem;
}

.ad1>.center>.left>.imgBox {
    border-radius: 5px;
    overflow: hidden;
}

.ad1>.center>.left>.imgBox>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ad1>.center>.right {
    width: 50%;
    display: flex;
    flex-direction: column;
}

.ad1>.center>.right>p {
    font-size: var(--18px);
    line-height: 166.6666666666667%;
    color: #000;
    font-weight: 300;
}

.ad1>.center>.right>.box {
    display: flex;
    justify-content: space-between;
    margin-top: auto;
}

.ad1>.center>.right>.box>div.counter {
    flex: 1;
    display: flex;
    align-items: end;
    flex-wrap: wrap;
}

.ad1>.center>.right>.box>div.counter>.num {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    line-height: 100%;
    color: #00d683;
}

.ad1>.center>.right>.box>div.counter>span {
    font-family: 'UAFSANS COND';
    font-size: var(--36px);
    color: #00d683;
    display: block;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.ad1>.center>.right>.box>div.counter>p {
    flex: 0 0 100%;
    font-size: var(--18px);
    line-height: 166.66666666666%;
    color: #000;
    font-weight: 300;
}

.ad2 {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.ad2>img {
    width: 100%;
    display: block;
    object-fit: cover;
}

.ad2>.info {
    position: absolute;
    top: 6.75rem;
    left: 50%;
    transform: translateX(-50%);
    /* overflow: hidden; */
    display: flex;
    align-items: stretch;
    justify-content: space-between;
}

.ad2>.info>.left {
    width: 40%;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 3.125rem 3.4375rem;
    border-radius: 5px;
    overflow: hidden;
    opacity: 0;
}

.ad2:has(#svg-container.lineAni)>.info>.left {
    animation: fadeInUp 1.5s ease forwards;
    animation-delay: 1s;
}

.ad2:has(#svg-container.lineAni)>.info>.right {
    animation: fadeInRight 1.5s ease forwards;
    animation-delay: 1.5s;
}

.ad2:has(#svg-container.lineAni)>.point {
    transform: scale(1);
    box-shadow: 0 0 0 30px rgba(255, 255, 255, 0.6);
}

.ad2>.info>.left>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    color: #000;
    text-transform: uppercase;
    margin-bottom: 1.875rem;
}

.ad2>.info>.left>.box {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 2.5rem;
}

.ad2>.info>.left>.box>.counter {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
}

.ad2>.info>.left>.box>.counter>.num {
    font-family: 'UAFSANS COND';
    font-size: var(--50px);
    line-height: 100%;
    color: #00d683;
}

.ad2>.info>.left>.box>.counter>span {
    font-family: 'UAFSANS COND';
    font-size: var(--30px);
    line-height: 100%;
    color: #00d683;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.ad2>.info>.left>.box>.counter>p {
    flex: 0 0 100%;
    font-size: var(--18px);
    line-height: 166.666666666667%;
    font-weight: 300;
    color: #000;
}

.ad2>.info>.right {
    width: 50%;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 3.125rem 3.4375rem;
    border-radius: 5px;
    opacity: 0;
    overflow: hidden;
}

.ad2>.info>.right>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--36px);
    line-height: 120%;
    color: #000;
    text-transform: uppercase;
    margin-bottom: 3.125rem;
}

.ad2>.info>.right>.box {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 1rem;
}

.ad2>.info>.right>.box>.item {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: #fff;
    padding: .75rem;
}

.ad2>.info>.right>.box>.item>.imgBox {
    width: 100%;
    height: auto;
    object-fit: contain;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: .5rem;
}

.ad2>.info>.right>.box>.item>.imgBox>img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.ad2>.info>.right>.box>.item>p {
    text-align: center;
}

.ad2>.point {
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background-color: #00d683;
    position: absolute;
    top: 50%;
    left: 52%;
    transform: scale(0);
    transition: transform .3s ease, box-shadow 1.5s ease;
    z-index: 2;
}

#svg-container {
    /* width: 100%;
    height: 100%; */
    height: 210px;
    position: absolute;
    top: 50%;
    left: 52%;
    transform: translate(-100%, -100%);
    z-index: 1;
    pointer-events: none;
}

.lineAni {
    animation: lineAni 1s linear forwards;
}

@keyframes lineAni {
    0% {
        clip-path: polygon(100% 100%, 100% 100%, 100% 100%, 100% 100%);
    }

    80% {
        clip-path: polygon(100% 100%, 0% 100%, 30% 0%, 100% 0%);
    }

    100% {
        clip-path: polygon(100% 100%, 0% 100%, 0% 0%, 100% 0%);
    }
}

.ad3 {
    padding: 6.25rem 0;
}

.ad3>.center>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    line-height: 100%;
    text-transform: uppercase;
    color: #00d683;
    margin-bottom: 4.0625rem;
}

.ad3>.center>.box {
    display: flex;
    justify-content: space-between;
}

.ad3>.center>.box>.left {
    width: 38%;
}

.ad3>.center>.box>.left>.title,
.ad3>.center>.box>.right>.title {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 120%;
    margin-bottom: 1.875rem;
    text-transform: uppercase;
    color: #000;
}

.ad3>.center>.box>.left>p {
    font-size: var(--18px);
    line-height: 166.6666666667%;
    font-weight: 300;
    margin-bottom: 5rem;
}

.ad3>.center>.box>.left>table {
    width: 100%;
    border-collapse: collapse;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.ad3>.center>.box>.left>table tr th:nth-of-type(1),
.ad3>.center>.box>.left>table tr td:nth-of-type(1) {
    width: 45%;
}

.ad3>.center>.box>.left>table tr th:nth-of-type(2),
.ad3>.center>.box>.left>table tr td:nth-of-type(2) {
    width: 55%;
}

.ad3>.center>.box>.left>table tr th {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.ad3>.center>.box>.left>table tr th,
.ad3>.center>.box>.left>table tr td {
    text-align: left;
    padding: 1.5625rem 1.25rem;
    vertical-align: top;
}

.ad3>.center>.box>.left>table tr:nth-child(odd) th,
.ad3>.center>.box>.left>table tr:nth-child(odd) td {
    background-color: #f4f6fb;
}

.ad3>.center>.box>.right {
    width: 50%;
}

.ad3>.center>.box>.right>.box {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    row-gap: 6.25rem;
    justify-content: space-between;
}

.ad3>.center>.box>.right>.box>.counter {
    width: 50%;
    display: flex;
    align-items: start;
    flex-wrap: wrap;
}

.ad3>.center>.box>.right>.box>.counter:nth-child(even) {
    width: 45%;
}

.ad3>.center>.box>.right>.box>.counter>.num {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    line-height: 100%;
    color: #00d683;
}

.ad3>.center>.box>.right>.box>.counter>span {
    font-family: 'UAFSANS COND';
    font-size: var(--36px);
    line-height: 100%;
    margin-top: auto;
    margin-bottom: 8px;
    display: block;
    color: #00d683;
    text-transform: uppercase;
}

.ad3>.center>.box>.right>.box>.counter>b,
.ad3>.center>.box>.right>.box>.counter>p {
    flex: 0 0 100%;
    display: block;
    padding-right: 4rem;
    font-size: var(--18px);
    line-height: 150%;
    color: #000;
}

.ad3>.center>.box>.right>.box>.counter>b {
    font-weight: 500;
}

.ad3>.center>.box>.right>.box>.counter>p {
    font-weight: 300;
    height: 100%;
}

.ad4 {
    width: 100%;
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: stretch;
}

.ad4>.left {
    width: 100%;
    /* padding: 6.25rem 6.25rem 6.25rem 9.75rem; */
    padding: 6.25rem 0;
    background: linear-gradient(to right, #0b48a8, #1d66ab);
    z-index: 2;
}

.ad4>.left>* {
    width: 90%;
    max-width: 700px;
    margin: 0 auto;
}

.ad4>.left>b {
    display: block;
}

.ad4>.left>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 100%;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 4.0625rem;
}

.ad4>.left>.box {
    display: flex;
    gap: 4.0625rem;
    margin-bottom: 6.25rem;
}

.ad4>.left>.box>.item {
    display: flex;
    flex-wrap: wrap;
}

.ad4>.left>.box>.item>.title {
    font-family: 'UAFSANS COND';
    font-size: var(--80px);
    color: #00d683;
    height: fit-content;
}

.ad4>.left>.box>.item:not(:last-child)>span {
    height: fit-content;
    margin-top: auto;
    margin-bottom: 10px;
}

.ad4>.left>.box>.item>span {
    font-family: 'UAFSANS COND';
    display: block;
    font-size: var(--36px);
    color: #00d683;
    text-transform: uppercase;
}

.ad4>.left>.box>.item>p {
    flex: 0 0 100%;
    color: rgba(255, 255, 255, 0.7);
    font-size: var(--18px);
    line-height: 133.333333333333%;
    font-weight: 300;
}

.ad4>.left>.box>.item:last-child>span {
    height: calc(var(--90px) + 6px);
}

.ad4>.left>.box>.item:last-child>p {
    height: 100%;
}

.ad4>.left>b {
    font-size: var(--18px);
    line-height: 133.333333333333333%;
    color: #fff;
    font-weight: 500;
    margin-bottom: 5px;
}

.ad4>.left>p {
    font-size: var(--18px);
    line-height: 133.333333333333333%;
    color: rgba(255, 255, 255, 0.7);
    font-weight: 300;
    margin-bottom: 1.3em;
}

.ad4>.right {
    z-index: 1;
}

.ad4>.right>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ad5 {
    padding: 7.8125rem 0 6.25rem;
    position: relative;
}

.ad5>.center>.top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 5.625rem;
}

.ad5>.center>.top>.left {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    line-height: 100%;
    color: #00d683;
}

.ad5>.center>.top>.right {
    width: 50%;
    font-size: var(--18px);
    line-height: 166.6666666666667%;
    font-weight: 300;
}

.ad5>.center>.bottom>.tit {
    font-family: 'UAFSANS COND';
    padding-bottom: 1.875rem;
    text-transform: uppercase;
    color: #000;
    font-size: var(--40px);
    /* line-height: 150%; */
    line-height: 100%;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.ad5>.center>.bottom>.box>.item:first-child {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.ad5>.center>.bottom>.box>.item {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding: 4.0625rem 2.0625rem;
    display: flex;
    justify-content: space-between;
}

.ad5>.center>.bottom>.box>.item>div {
    width: 50%;
}

.ad5>.center>.bottom>.box>.item>div>.title {
    font-size: var(--30px);
    line-height: 120%;
    color: #000;
    font-weight: 300;
    margin-bottom: 1.5625rem;
}

.ad5>.center>.bottom>.box>.item>div>b {
    font-size: var(--18px);
    font-weight: 500;
    color: #000;
    display: block;
    margin-bottom: 5px;
}

.ad5>.center>.bottom>.box>.item>div>p {
    font-size: var(--18px);
    line-height: 133.33333333333%;
    color: #666;
    font-weight: 300;
    margin-bottom: 1.5625rem;
}

.ad5>.center>.bottom>.box>.item>div>.counter {
    display: flex;
    align-items: end;
}

.ad5>.center>.bottom>.box>.item>div>.counter>.num {
    font-family: 'UAFSANS COND';
    font-size: var(--80px);
    color: #00d683;
}

.ad5>.center>.bottom>.box>.item>div>.counter>span {
    font-family: 'UAFSANS COND';
    display: block;
    font-size: var(--30px);
    line-height: 200%;
    margin-bottom: 5px;
    text-transform: uppercase;
    color: #00d683;
}

.ad6 {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.ad6>.center>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 150%;
    color: #000;
    text-transform: uppercase;
    margin-bottom: 3.125rem;
}

.ad6>.center>.box {
    display: flex;
    gap: 1.25rem;
    margin-bottom: 1.25rem;
}

.ad6>.center>.box>div {
    width: calc(50% - (1.25rem / 2));
    border-radius: 5px;
    overflow: hidden;
    position: relative;
}

.ad6>.center>.box>div::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 10%, transparent);
}

.ad6>.center>.box>div>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ad6>.center>.box>div>.info {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    padding: 4.375rem 3.125rem;
}

.ad6>.center>.box>div>.info>.tit {
    font-size: var(--30px);
    line-height: 120%;
    font-weight: 300;
    color: #fff;
}

.ad6>.center>.box>div>.info>.info {
    font-size: var(--18px);
    line-height: 200%;
    font-weight: 300;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 2.5rem;
}

.ad6>.center>.box>div>.info>.counter {
    display: flex;
    align-items: end;
    flex-wrap: wrap;
    gap: 10px;
}

.ad6>.center>.box>div>.info>.counter>.num {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    line-height: 100%;
    color: #00d683;
}

.ad6>.center>.box>div>.info>.counter>span {
    font-family: 'UAFSANS COND';
    font-size: var(--36px);
    line-height: 100%;
    text-transform: uppercase;
    color: #00d683;
    display: block;
    margin-bottom: 10px;
}

.ad6>.center>.item {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}

.ad6>.center>.item>img {
    width: 100%;
    max-height: 100%;
    object-fit: cover;
    display: block;
}

.ad6>.center>.item>.info {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    padding: 0 3.125rem;
}

.ad6>.center>.item>.info>.tit {
    font-size: var(--36px);
    line-height: 100%;
    color: #fff;
    font-weight: 300;
    margin-bottom: 1.875rem;
}

.ad6>.center>.item>.info>.counter {
    display: flex;
    align-items: end;
}

.ad6>.center>.item>.info>.counter>.num {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    line-height: 100%;
    color: #00d683;
}

.ad6>.center>.item>.info>.counter>span {
    font-family: 'UAFSANS COND';
    font-size: var(--36px);
    line-height: 100%;
    color: #00d683;
    display: block;
    margin-bottom: 10px;
}

.ad6>.center>.item>.info>b,
.ad6>.center>.item>.info>p {
    font-size: var(--18px);
    line-height: 133.3333333333333%;
    font-weight: 500;
    color: #fff;
}

.ad6>.center>.item>.info>p {
    font-weight: 300;
}

.ad7 {
    padding: 7.6875rem 0;
    position: relative;
    overflow: hidden;
}

.ad7>.center>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 150%;
    text-align: center;
    text-transform: uppercase;
    text-align: center;
    color: #000;
    margin-bottom: 3.75rem;
}

.ad7>.center>.box {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ad7>.center>.box>div.imgbox {
    flex: 1;
    height: 8.3125rem;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.ad7>.center>.box>div.imgbox p {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 1.25rem;
    color: #000;
}

.ad7>.center>.box>div.imgbox:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background: linear-gradient(to top, transparent 0%, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.1) 80%, transparent 100%);
}

.cul1>.center>.title {
    padding-bottom: 6rem;
}

.cul1>.center>.title>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    line-height: 100%;
    text-transform: uppercase;
    color: #00d683;
    margin-bottom: 10px;
}

.cul1>.center>.title>p {
    font-size: var(--18px);
    line-height: 100%;
    font-weight: 300;
    color: #000;
}

.cul1>.center>.portray {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-bottom: 8rem;
}

.cul1>.center>.portray>div.info {
    width: fit-content;
}

.cul1>.center>.portray>div.info>.words {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.cul1>.center>.portray .letter-path {
    fill: transparent;
    stroke: #123980;
    stroke-width: 1.5px;
    fill-rule: evenodd;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
}

.drawStroke path {
    animation:
        drawStroke 1.5s ease-in-out forwards,
        fillSolid 0.4s ease-in-out 1.8s forwards;
}

@keyframes drawStroke {
    from {
        stroke-dashoffset: 1000;
    }

    to {
        stroke-dashoffset: 0;
    }
}

@keyframes fillSolid {
    to {
        fill: #123980;
        stroke: #123980;
        stroke-width: 1px;
    }
}

.cul1>.center>.portray>.info>svg {
    margin-bottom: 10px;
}

.cul1>.center>.portray .word {
    font-size: var(--24px);
    line-height: 150%;
    font-weight: 500;
    color: #000;
    text-transform: capitalize;
}

.cul1>.center>.portray .word::first-letter {
    color: #00d683;
}

.cul2 {
    width: 100%;
    overflow: hidden;
    background: url("/src/imgs/cul2.jpg") no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-position: center center;
    padding: 9rem 0;
}

.cul2>.center {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.cul2>.center>.box {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
}

.cul2>.center>.tit {
    font-family: 'UAFSANS COND';
    font-size: 2.5rem;
    text-transform: uppercase;
    line-height: 100%;
    color: #00d683;
    margin-bottom: 8rem;
    max-width: 55rem;
    width: 100%;
}

.cul2>.center>.box>.item {
    flex: 1;
    padding-top: 1.5625rem;
    padding-bottom: 1.5625rem;
}

.cul2>.center>.box>.item:nth-of-type(1) {
    padding-right: 5rem;
}

.cul2>.center>.box>.item:nth-of-type(3) {
    padding-left: 5rem;
}

.cul2>.center>.box>.item:nth-of-type(2) {
    flex: 1;
    padding: 1.5625rem 8.25rem;
    position: relative;
}

.cul2>.center>.box>.item:nth-of-type(2)::before,
.cul2>.center>.box>.item:nth-of-type(2)::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background: linear-gradient(to top, transparent 0%, rgba(255, 255, 255, 0.2) 10%, rgba(255, 255, 255, 0.2) 90%, transparent 100%);
}

.cul2>.center>.box>.item:nth-of-type(2)::after {
    left: initial;
    right: 0;
}

.cul2>.center>.box>.item>b {
    font-size: var(--18px);
    line-height: 133.3333333333333%;
    color: #fff;
    font-weight: 500;
    display: block;
    margin-bottom: 10px;
}

.cul2>.center>.box>.item>p {
    font-size: var(--18px);
    line-height: 133.3333333333333%;
    font-weight: 100;
    color: #fff;
}

.cul3 {
    position: relative;
    padding: 7.5rem 0 10.3125rem;
    overflow: hidden;
}

.cul3>.center>.title {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    line-height: 100%;
    color: #00d683;
    text-transform: uppercase;
    margin-bottom: 4rem;
}

.cul3 .logoIntro {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.cul3 .logoIntro>img {
    max-width: 100%;
    object-fit: contain;
}

@keyframes spinIn {
    0% {
        opacity: 0;
        transform: translateY(30px) rotateY(180deg);
    }

    100% {
        opacity: 1;
        transform: translateY(0) rotateY(0deg);
    }
}

.spinIn {
    animation-name: spinIn;
}

.cul3 .logoIntro>.tc {
    width: 100%;
}

.cul3 .logoIntro ul li {
    position: absolute;
    font-size: var(--18px);
    line-height: 133%;
    font-weight: 300;
    color: #000;
}

.cul3 .logoIntro ul li.circle1 {
    width: 40%;
    left: 0;
    top: 4%;
}

.cul3 .logoIntro ul li.circle1 span {
    max-width: 23rem;
    display: block;
}

.cul3 .logoIntro ul li:before {
    content: '';
    position: absolute;
    width: .75rem;
    height: .75rem;
    background: var(--li);
    border-radius: 50%;
    right: 0;
    top: 50%;
    border: 2px solid #fff;
    transform: translateY(-50%);
    z-index: 2;
}

.cul3 .logoIntro ul li:after {
    content: '';
    position: absolute;
    width: 10rem;
    right: 0;
    top: 50%;
    border-bottom: 1px dashed #cccccc;
}

.cul3 .logoIntro ul li.circle2 {
    width: 40%;
    left: 0;
    top: 75%;
}


.cul3 .logoIntro ul li.circle2 span {
    max-width: 23rem;
    display: block;
}

.cul3 .logoIntro ul li.circle3 {
    width: 37%;
    right: 0;
    top: 45%;
}

.cul3 .logoIntro ul li.circle3 span {
    max-width: 22rem;
    display: block;
    margin-left: auto;
}

.cul3 .logoIntro ul li.circle3::before {
    right: auto;
    left: 0;
    background: #30b2f1;
}

.cul3 .logoIntro ul li.circle3::after {
    right: auto;
    left: 0;
}

.cul3>.center>.boxs {
    display: flex;
    gap: 1.875rem;
    align-items: stretch;
    justify-content: space-between;
    padding-top: 10rem;
}

.cul3>.center>.boxs>.box {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1.4375rem;
    position: relative;
}

.cul3>.center>.boxs>.box>.item>img {
    position: absolute;
    top: 0;
    right: 10px;
    transform: translateY(-100%);
}

@keyframes mascotMove {
    0% {
        opacity: 0;
        transform: translateY(0%);
    }

    80% {
        opacity: 1;
        transform: translateY(-95%);
    }

    100% {
        transform: translateY(-90%);
    }
}

.mascotMove {
    animation-name: mascotMove;
    animation-fill-mode: forwards;
}

.mascotMove1 {
    animation-name: mascotMove1;
    animation-fill-mode: forwards;
}

.cul3>.center>.boxs>.box>.item {
    padding: 1.75rem 2.4rem;
    background-color: #f4f6f9;
    border-radius: 20px;
}

.cul3>.center>.boxs>.box:nth-of-type(1)>.item:first-child,
.cul3>.center>.boxs>.box:nth-of-type(2)>.item:last-child {
    flex: 1;
}

.cul3>.center>.boxs>.box>.item>.tit {
    font-weight: 700;
    font-size: var(--18px);
    letter-spacing: 5px;
    color: #00d683;
    line-height: 3rem;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.cul3>.center>.boxs>.box>.item>.info {
    font-size: var(--40px);
    line-height: 125%;
    color: #000;
    font-weight: 300;
    display: block;
    margin-bottom: 1rem;
}

.cul3>.center>.boxs .item:last-child b.info {
    display: block;
    font-size: 2rem;
}

.cul3>.center>.boxs>.box>.item>p:not(.info) {
    font-size: var(--20px);
    line-height: 150%;
    color: #000;
    font-weight: 300;
}

.cul3>.center>.boxs>.box>.item>p:not(.info) b {
    font-weight: 500;
}

.cul3>.center>.boxs>.box>.item>p:not(.info):not(:last-child) {
    margin-bottom: 1.5rem;
    max-width: 40rem;
}

/* social */
.srBox {
    padding: 2rem 0 8.25rem;
    position: relative;
    overflow: hidden;
}

.srBox .srList {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7.5rem;
}

.srBox .srList>.box {
    width: 100%;
    display: block;
    overflow: hidden;
}

.srBox .srList>.box>.imgBox {
    width: 100%;
    height: 300px;
    border-radius: 10px;
    margin-bottom: 2.1875rem;
    overflow: hidden;
}

.srBox .srList>.box>.imgBox>img {
    width: 100%;
    height: 100%;
    display: block;
    transition: transform 1.5s ease;
}

.srBox .srList>.box>p {
    font-size: var(--18px);
    line-height: 166.6666666667%;
    color: #000;
    font-weight: 300;
    transition: color .6s ease;
}

.srBox .srList>.box:hover img {
    transform: scale(1.05);
}

.srBox .srList>.box:hover>p {
    color: #00d683;
}

.srBox>.center>.pagins li,
.srBox>.center>.pagins li a {
    width: 60px;
    height: 60px;
    border-radius: 5px;
    font-size: var(--18px);
    font-weight: 300;
}

/* contact */
.ban_con .con_name.title {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    line-height: 100%;
    color: #fff;
    text-transform: uppercase;
}

.ban_con .con_tc {
    top: 40%;
    transform: translate(-50%, -100%);
}

.ban_con .con_tc_bu {
    bottom: 10%;
}

.ban_con .con_tc_bu .con_b_sit {
    font-weight: 300;
    font-size: var(--16px);
}

.ban_con .con_tc_bu .con_b_sit.con_b_30 {
    margin-bottom: 1.875rem;
}

.ban_con .con_tc_bu .con_list>.con_b_ws {
    margin-bottom: 3.125rem;
}

.ban_con .con_tc_bu .con_b_email>p {
    font-size: var(--18px);
    line-height: 133.33333333333%;
    color: #fff;
    font-weight: 700;
}

.ban_con .con_tc_bu .con_b_email>p:not(:last-child) {
    margin-bottom: 10px;
}

.Contact_corp>.center>.left>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    line-height: 100%;
    text-transform: uppercase;
    color: #00d683;
    margin-bottom: 1.5625rem;
}

.Contact_corp>.center {
    display: flex;
    justify-content: space-between;
}

.Contact_corp>.center>.left>p {
    font-size: var(--16px);
    line-height: 150%;
    color: #666;
    font-weight: 300;
}

.Contact_corp>.center>.right {
    width: 60%;
}

.Contact_corp>.center>.right>.Mes .row {
    width: 100%;
    display: flex;
    gap: 1.25rem;
}

.Contact_corp>.center>.right>.Mes .column {
    width: 100%;
    position: relative;
    margin-bottom: 2.5rem;
}

.Contact_corp>.center>.right>.Mes>.row>.column {
    flex: 1;
}

.Contact_corp>.center>.right>.Mes input,
.Contact_corp>.center>.right>.Mes textarea,
.Contact_corp>.center>.right>.Mes h-select {
    font-family: 'Onsite';
    width: 100%;
    display: inline-block;
    outline: none;
    border: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    background-color: transparent;
    padding: 1.5625rem 0;
    font-size: var(--16px);
    font-weight: 300;
    color: #000;
}

.Contact_corp>.center>.right>.Mes input::placeholder,
.Contact_corp>.center>.right>.Mes textarea::placeholder,
.Contact_corp>.center>.right>.Mes h-select::placeholder {
    font-size: var(--16px);
    font-weight: 300;
    color: #999;
}

.Contact_corp>.center>.right>.Mes .column>p {
    display: inline;
    font-size: var(--24px);
    font-weight: 300;
    text-transform: capitalize;
    color: #000;
}

.required:before {
    content: none;
    display: none;
}

.required>p::after {
    content: '*';
    color: #ff1f30;
}

.Contact_corp>.center>.right>.Mes>.row>.column.verify>p {
    position: absolute;
    bottom: 1.5625rem;
    transition: bottom .6s ease;
}

.Contact_corp>.center>.right>.Mes>.row>.column.verify>img {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    cursor: pointer;
}

.Contact_corp>.center>.right>.Mes>.row>.column.verify:has(input:focus)>p,
.Contact_corp>.center>.right>.Mes>.row>.column.verify:has(input:not(:placeholder-shown))>p {
    bottom: 100%;
}

.Contact_corp>.center>.right>.Mes>.row>.column.sub {
    display: flex;
    align-items: center;
    justify-content: end;
}

.Contact_corp>.center>.right>.Mes>.row>.column.sub>button {
    padding: 0.9375rem 3.4375rem;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #dbdbdb;
    background-color: #ffffff;
    outline: none;
    cursor: pointer;
    font-weight: 500;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
    z-index: 1;
    transition: color .6s ease;
}

.Contact_corp>.center>.right>.Mes>.row>.column.sub>button::before {
    content: "";
    width: 0;
    height: 100%;
    background-color: #00d683;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width .6s ease;
}

.Contact_corp>.center>.right>.Mes>.row>.column.sub>button:hover::before {
    width: 100%;
}

.Contact_corp>.center>.right>.Mes>.row>.column.sub>button:hover {
    color: #fff;
}

.Contact_corp>.center>.right>.Mes>.row>.column.sub>button>.arrows {
    width: 24px;
    height: 24px;
    border-radius: 5px;
    background-color: #00d683;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .6s ease;
}

.Contact_corp>.center>.right>.Mes>.row>.column.sub>button:hover>.arrows {
    background-color: #fff;
}

.Contact_corp>.center>.right>.Mes>.row>.column.sub>button:hover>.arrows path {
    fill: #00d683;
}

/* global service */
.service>.info>p {
    width: 100%;
    max-width: 27rem;
    font-size: var(--18px);
    line-height: 166.66666666667%;
    color: #fff;
    font-weight: 300;
}

.service>.info>.counbox {
    display: flex;
    align-items: start;
    margin: 3rem 0;
}

.service>.info>.counbox>.counter {
    min-width: 20rem;
    display: flex;
    flex-wrap: wrap;
}

.service>.info>.counbox>.counter>.num,
.service>.info>.counbox>.counter>span {
    font-family: 'UAFSANS COND';
    font-size: 4.25rem;
    line-height: 100%;
    color: #fff;
}

.service>.info>.counbox>.counter>sub {
    font-family: 'UAFSANS COND';
    font-size: calc(var(--90px) * 7 / 12);
    vertical-align: sub;
    line-height: 100%;
    color: #fff;
}

.service>.info>.counbox>.counter>p {
    flex: 0 0 100%;
    font-size: var(--18px);
    font-weight: 300;
    color: rgba(255, 255, 255, 0.7);
}

.support {
    padding-bottom: 6.25rem;
}

.support>.center {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 9.8125rem;
    row-gap: 6.875rem;
}

.support>.center>.item>.imgBox {
    height: 280px;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 3.75rem;
}

.support>.center>.item>.imgBox>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
    overflow: hidden;
    transition: transform .6s ease;
}

.support>.center>.item>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 125%;
    color: #000;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
    transition: color .6s ease;
}

.support>.center>.item>p {
    font-size: var(--18px);
    line-height: 166.6666666667%;
    color: rgba(0, 0, 0, 0.6);
    font-weight: 300;
}

.support>.center>.item:hover>.tit {
    color: #00d683;
}

.support>.center>.item:hover>.imgBox>img {
    transform: scale(1.05);
}

.sup1 {
    padding: 4.625rem 0 7.8125rem;
}

.sup1>.center {
    display: flex;
    justify-content: space-between;
}

.sup1>.center>.left>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    /* line-height: 150%; */
    line-height: 100%;
    text-transform: uppercase;
    color: #000;
    margin-bottom: 1.5625rem;
}

.sup1>.center>.left>p {
    font-size: var(--18px);
    line-height: 166.6666666667%;
    color: #666;
    font-weight: 300;
}

.sup1>.center>.left {
    width: 38%;
}

.sup1>.center>.right {
    width: 45%;
}

.sup1>.center>.right>li {
    position: relative;
    font-size: var(--24px);
    line-height: 125%;
    color: #000;
    font-weight: 300;
}

.sup1>.center>.right>li:not(:last-child) {
    margin-bottom: 2.5rem;
}

.sup1>.center>.right>li.act>.cir {
    width: 21px;
    height: 21px;
    border-radius: 50%;
    position: absolute;
    top: 4px;
    left: -38px;
    background-color: #00d27a;
    transform-origin: center center;
    animation: popIn 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

@keyframes popIn {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

.sup1>.center>.right>li.act>.cir::before {
    content: "";
    position: absolute;
    left: 4px;
    bottom: 10.5px;
    width: 0;
    height: 2px;
    background-color: white;
    border-radius: 4px;
    transform: rotate(45deg);
    transform-origin: left bottom;
    opacity: 0;
    animation: drawShort 0.2s ease-out forwards 0.3s;
}

.sup1>.center>.right>li.act>.cir::after {
    content: "";
    position: absolute;
    left: 9.4px;
    bottom: 5.5px;
    width: 0;
    height: 2px;
    background-color: white;
    border-radius: 4px;
    transform: rotate(-45deg);
    transform-origin: left bottom;
    opacity: 0;
    animation: drawLong 0.3s ease-out forwards 0.5s;
}

@keyframes drawShort {
    0% {
        width: 0;
        opacity: 0;
    }

    1% {
        opacity: 1;
    }

    100% {
        width: 6.5px;
        opacity: 1;
    }
}

@keyframes drawLong {
    0% {
        width: 0;
        opacity: 0;
    }

    1% {
        opacity: 1;
    }

    100% {
        width: 12px;
        opacity: 1;
    }
}

.sup2 {
    padding: 8.75rem 0;
}

.sup2>.center {
    display: flex;
    align-items: center;
    gap: calc(2% + 4.0625rem);
}

.sup2>.center>.left {
    width: 48%;
    border-radius: 10px;
    overflow: hidden;
}

.sup2>.center>.left>img {
    width: 100%;
    display: block;
    object-fit: contain;
}

.sup2>.center>.right>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    line-height: 100%;
    color: #000;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
}

.sup2>.center>.right>p {
    font-size: var(--18px);
    line-height: 166.666666666667%;
    color: #666;
    font-weight: 300;
    margin-bottom: 5.625rem;
}

.sup2>.center>.right>.more {
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #000;
}

/* case */
.case {
    background-color: #f4f6f9;
}

.caseBox {
    padding: 1.875rem 0 7.5rem;
}

.caseBox .filter {
    display: flex;
    align-items: start;
    gap: 10px;
}

.caseBox .filter>span {
    font-size: var(--18px);
    font-weight: 300;
    color: #666;
}

.caseBox .filter>.check {
    display: flex;
    column-gap: 3.125rem;
    row-gap: 2rem;
    flex-wrap: wrap;
}

.caseBox .filter>.check>label {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 7px;
}

.caseBox .filter>.check>label>span {
    font-size: var(--18px);
    font-weight: 500;
    color: #000;
    user-select: none;
}

.caseBox .filter>.check>label>input {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    appearance: none;
    outline: none;
    border-radius: 0;
    border: 1px solid #e1e1e1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.caseBox .filter>.check>label>input::before {
    content: "";
    width: 6px;
    height: 6px;
    flex-shrink: 0;
    background-color: #00d683;
    transform: scale(0);
    transition: transform .3s ease;
}

.caseBox .filter>.check>label>input:checked::before {
    transform: scale(1);
}

.caseBox .caseInfo {
    padding-top: 3.125rem;
}

.caseBox .caseInfo .main {
    height: 0;
    transition: height .6s ease;
    overflow: hidden;
}

.caseBox .caseInfo .main.open {
    margin-bottom: 1.25rem;
}

.caseBox .caseInfo .main>.info {
    background-color: #fff;
    padding: 2.5rem 1.875rem;
    border-radius: 5px;
}

.caseBox .caseInfo .main>.info>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 120%;
    text-align: center;
    color: #00d683;
    margin-bottom: 1.875rem;
    text-transform: uppercase;
}

.caseBox .caseInfo .main>.info .tableBox {
    width: 100%;
    overflow-x: auto;
}

.caseBox .caseInfo .main>.info .tableBox>table {
    min-width: 100% !important;
    border-collapse: collapse;
}


.caseBox .caseInfo .main>.info .tableBox table tr {
    position: relative;
}

.caseBox .caseInfo .main>.info .tableBox table tr:nth-of-type(odd) th,
.caseBox .caseInfo .main>.info .tableBox table tr:nth-of-type(odd) td {
    background-color: #f4f6f9;

}

.caseBox .caseInfo .main>.info .tableBox table tr:nth-of-type(odd) th:first-child,
.caseBox .caseInfo .main>.info .tableBox table tr:nth-of-type(odd) td:first-child {
    border-radius: 10px 0 0 10px;
}

.caseBox .caseInfo .main>.info .tableBox table tr:nth-of-type(odd) th:last-child,
.caseBox .caseInfo .main>.info .tableBox table tr:nth-of-type(odd) td:last-child {
    border-radius: 0 10px 10px 0;
}

.caseBox .caseInfo .main>.info .tableBox table th {
    font-weight: 500;
}

.caseBox .caseInfo .main>.info .tableBox table th,
.caseBox .caseInfo .main>.info .tableBox table td {
    min-width: 100px;
    padding: 1.25rem 1.875rem;
    text-align: left !important;
    vertical-align: top;
    display: table-cell;
}

.caseBox .caseInfo .main>.info .tableBox table th {
    font-size: var(--18px);
    line-height: 166.66666666666667%;
    color: #000;
}

.caseBox .caseInfo .main>.info .tableBox table td {
    font-size: var(--18px);
    line-height: 166.66666666666667%;
    color: #666;
    font-weight: 300;
}

.caseBox .caseInfo .main>.info .tableBox table th:not(:last-child),
.caseBox .caseInfo .main>.info .tableBox table td:not(:last-child) {
    border-right: 1px solid rgba(0, 0, 0, 0.1);
}

/* zero */

.zero1 {
    display: block;
    width: 100%;
    overflow: hidden;
    /* padding: 6.25rem 0; */
    padding-top: 6.25rem;
}

.zero1>.center {
    display: flex;
    flex-direction: column;
}

.zero1>.center>div {
    width: 100%;
    display: block;
    /* overflow: hidden; */
}

.zero1>.center>div.flex {
    display: flex;
    justify-content: space-between;
}

.zero1>.center>div.c_flex {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    text-transform: uppercase;
    color: #000;
    line-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 2.5rem 0;
    text-align: center;
}

.zero1>.center>div.c_flex>span {
    color: #00d683;
}

.zero1>.center>div>.item {
    position: relative;
    padding: 3.5rem 3rem;
    overflow: hidden;
    background-color: #f3f5f7;
    z-index: 1;
}

.zero1>.center>div>.item::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, #0b48a8, #1d66ab);
    opacity: 0;
    transition: opacity .6s ease;
    z-index: -1;
}

.zero1>.center>div>.item:hover:before {
    opacity: 1;
}

.zero1>.center>div>.item>span {
    font-size: var(--18px);
    font-weight: 300;
    color: #000;
    transition: color .6s ease;
    text-transform: uppercase;
}

.zero1>.center>div>.item>h3 {
    font-family: 'UAFSANS COND';
    font-size: var(--36px);
    line-height: 100%;
    color: #00d683;
    text-transform: uppercase;
    margin-top: 10px;
    margin-bottom: 1.5625rem;
}

.zero1>.center>div>.item>p {
    font-size: var(--18px);
    font-weight: 300;
    line-height: 133.33333333333333%;
    color: #666;
    transition: color .6s ease;
}

.zero1>.center>div>.item:hover>span,
.zero1>.center>div>.item:hover>p {
    color: #fff;
}

.zero1>.center>div.top>.item:nth-of-type(1),
.zero1>.center>div.bot>.item:nth-of-type(2) {
    width: 41%;
}

.zero1>.center>div.top>.item:nth-of-type(2),
.zero1>.center>div.bot>.item:nth-of-type(1) {
    width: 34%;
}

.zero1>.center>div.top>.item:nth-of-type(1),
.zero1>.center>div.bot>.item:nth-of-type(1) {
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
}

.zero1>.center>div.top>.item:nth-of-type(2),
.zero1>.center>div.bot>.item:nth-of-type(2) {
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    border-top-right-radius: 50px;
}

.zero1>.center>div.top>.item:nth-of-type(1) {
    margin-left: 5.625rem;
}

.zero1>.center>div.top>.item:nth-of-type(2) {
    /* transform: translateY(18%); */
    margin-bottom: -9rem;
}

.zero1>.center>div.bot>.item:nth-of-type(1) {
    /* transform: translateY(-35%); */
    margin-top: -15%;
}



/* .zero1>.center>div>.item:nth-of-type(3) {
    width: 35%;
} */


.nei_banner .nei_txt .tit {
    font-family: 'UAFSANS COND';
    text-transform: uppercase;
    font-size: var(--90px);
    line-height: 100%;
}

.zero_one .left>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--48px);
    line-height: 100%;
    text-transform: uppercase;
    color: #00d683;
    margin-bottom: 2.5rem;
}

.zero_one .left>p {
    font-size: var(--18px);
    line-height: 166.666666666667%;
    color: #666;
    font-weight: 300;
}

.zero_one .left>p:nth-of-type(1) {
    margin-bottom: 1.25rem;
}

.zero_two {
    background: linear-gradient(45deg, #0b48a8, #1d66ab);
}

.zero_two .zero_two_left {
    font-family: 'UAFSANS COND';
    text-transform: uppercase;
}

.zero_two .zero_two_right>.count {
    display: flex;
    flex-wrap: wrap;
}

.zero_two .zero_two_right>.count>.counter,
.zero_two .zero_two_right>.count>sub {
    font-family: 'UAFSANS COND';
    font-size: var(--90px);
    line-height: 100%;
    color: #00d683;
}

.zero_two .zero_two_right>.count>sub {
    font-size: calc(var(--90px) * 7 / 12);
    vertical-align: sub;
    line-height: 100%;
}

.zero_two .zero_two_right>.count>p {
    flex: 0 0 100%;
    font-size: var(--18px);
    line-height: 100%;
    font-weight: 300;
}

.zero_two ul li h3,
.zero_two ul li.active h3 {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 130%;
    text-transform: uppercase;
    color: #00d683;
}

.zero_two ul li h3 {
    color: #fff;
}

.zero_two ul li .zero_two_txt {
    font-size: var(--18px);
    line-height: 166.6666666666666667%;
    font-weight: 300;
}

.zero_two_txt p:before {
    width: 2px;
    height: 2px;
}

.zer_three h2 {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    color: #000;
    text-transform: uppercase;
}

.zer_three ul {
    gap: 2.25rem;
}

.zer_three ul li {
    width: calc((100% - 2.25rem) / 2);
    box-shadow: none;
}

.zer_three_box h3 {
    font-family: 'UAFSANS COND';
    font-size: var(--40px);
    line-height: 100%;
    color: #00d683;
}

.zer_three_box .zer_three_word {
    font-size: var(--18px);
    line-height: 166.6666666667%;
    color: #666;
    font-weight: 300;
}

.zer_three_box .imgBox {
    width: 100%;
    margin: 5% auto 0;
    display: block;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.zer_three_box img {
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
    margin: 0;
    border-radius: 10px;
}

/* offshor */
/* .offshor {
} */

.offshor>.center>.box {
    display: flex;
    justify-content: space-between;
    padding: 5.625rem 0;
}

.offshor>.center>.box:first-child {
    padding-bottom: 4.375rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.offshor>.center>.box>.left {
    max-width: 50%;
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    line-height: 100%;
    color: #00d683;
    text-transform: uppercase;
}

.offshor>.center>.box>.left>.imgBox {
    overflow: hidden;
}

.offshor>.center>.box>.left>.imgBox>img {
    max-width: 100%;
    object-fit: contain;
}

.offshor>.center>.box>.right {
    width: 50%;
}

.offshor>.center>.box>.right>p {
    font-size: var(--18px);
    line-height: 166.666666666666667%;
    font-weight: 300;
    color: #666;
}

.offshor>.center>.box>.right>p:not(:last-child) {
    margin-bottom: 1.25rem;
}

.offshor>.center>.box>.right>.imgBox {
    width: 100%;
    overflow: hidden;
}

.offshor>.center>.box>.right>.imgBox>img {
    max-width: 100%;
    max-height: 100%;
}

.offshor>.center>.box>.right>.imgBox>p {
    font-size: var(--18px);
    line-height: 166.66666666666667%;
    color: #00d683;
    font-weight: 500;
    text-align: center;
}

.offshor>.center>.box>.right:has(table) {
    overflow: hidden;
    overflow-x: auto;
}

.offshor>.center>.box>.right>table {
    width: 100%;
    border-collapse: collapse;
    border-top: 1px solid rgba(0, 0, 0, 1);
    border-bottom: 1px solid rgba(0, 0, 0, 1);
}

.offshor>.center>.box>.right>table th,
.offshor>.center>.box>.right>table td {
    font-size: var(--18px);
    line-height: 166.666666666666667%;
    text-align: left;
    padding: 1.25rem 0;
    font-weight: 300;
    color: #000;
}

.offshor>.center>.box>.right>table th {
    font-weight: 500;
    border-bottom: 1px solid rgba(0, 0, 0, 1);
}

.offshor>.center>.box>.right>table tr:not(:last-child) td {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.offshor>.center>.box>.right>table td b {
    font-weight: 500;
    color: #000;
}

.offshor>.center>.box>.right>table td:not(:first-child),
.offshor>.center>.box>.right>table td p {
    font-weight: 300;
    color: #666;
}

.offshor>.center>.box>.right>table td:first-child {
    vertical-align: top;
}

.offshor2 {
    padding: 2.5rem 0 7.5rem;
}

.offshor2>.center>.tit {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    color: #000;
    text-transform: uppercase;
    margin-bottom: 3.75rem;
}

.offshor2>.center>.spa {
    width: 100%;
}

.offshor2>.center>.spa .swiper-slide {
    cursor: pointer;
}

.offshor2>.center>.spa .imgBox {
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 1.875rem;
}

.offshor2>.center>.spa .imgBox>img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
    transition: transform 1.5s ease;
}

.offshor2>.center>.spa .swiper-slide:hover img {
    transform: scale(1.05);
}

.offshor2>.center>.spa .swiper-slide>b {
    font-size: var(--18px);
    line-height: 166.6666666667%;
    color: #000;
    font-weight: 500;
    transition: color .6s ease;
}

.offshor2>.center>.spa .swiper-slide:hover>b {
    color: #00d683;
}

.offshor2>.center>.spa .swiper-slide>p {
    font-weight: 300;
    color: #666;
}

.offshor2>.center>.pagin {
    margin-top: 2.5rem;
}

.offshor3 {
    padding: 3.75rem 0 9.0625rem;
    background-color: #f4f6f9;
}

.offshor3>.center>.box {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.offshor3>.center>.box>.left {
    width: 42%;
}

.offshor3>.center>.box .title {
    font-family: 'UAFSANS COND';
    font-size: var(--60px);
    line-height: 100%;
    text-transform: uppercase;
    color: #00d683;
    margin-bottom: 2.8125rem;
}

.offshor3>.center>.box p {
    font-size: var(--18px);
    line-height: 166.666666666666667%;
    color: #666;
    font-weight: 300;
}

.offshor3>.center>.box>.right {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.offshor3>.center>.box>.right>img {
    max-width: 100%;
    mix-blend-mode: multiply;
}

.offshor3>.center>.box:nth-of-type(2) .title {
    color: #000;
}

.offshor3>.center>.box:nth-of-type(2) .list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 5rem;
    row-gap: 2.5rem;
}

.offshor3>.center>.box:nth-of-type(2) .list>.item {
    padding-left: 20px;
    position: relative;
}

.offshor3>.center>.box:nth-of-type(2) .list>.item::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #00d683;
    position: absolute;
    top: 10px;
    left: 0;
}

.offshor3>.center>.box:nth-of-type(2) .list>.item>b,
.offshor3>.center>.box:nth-of-type(2) .list>.item>p {
    font-size: var(--18px);
    line-height: 166.6666666666667%;
    color: #000;
    font-weight: 500;
    display: block;
}

.offshor3>.center>.box:nth-of-type(2) .list>.item>p {
    color: #666;
    font-weight: 300;
}

.offshor4 {
    padding-top: 7.5rem;
    background-color: #ffffff;
    overflow: hidden;
}

.offshor4>.center>.box:not(:last-child) {
    margin-bottom: 5.625rem;
}

@media (max-width:1200px) {

    .sNav.inn>.center>.box {
        gap: 16px;
    }

    .ad1 {
        padding: 60px 0;
    }

    .ad1>.center>.left>.tit {
        font-size: 32px;
        margin-bottom: 20px;
    }

    .ad1>.center>.right>.box {
        margin-top: 35px;
    }

    .ad2>img {
        min-height: 430px;
    }

    .ad2>.info {
        top: 60px;
    }

    .ad2>.info>.left,
    .ad2>.info>.right {
        padding: 24px;
    }

    .ad2>.info>.left {
        width: 42%;
    }

    .ad2>.info>.right {
        width: 54%;
    }

    .ad2>.info>.left>.tit {
        font-size: 28px;
        margin-bottom: 15px;
    }

    .ad2>.info>.left>.box {
        row-gap: 18px;
    }

    .ad2>.info>.left>.box>.counter>.num {
        font-size: 26px;
    }

    .ad2>.info>.left>.box>.counter>span {
        font-size: 16px;
        margin-bottom: 2px;
    }

    .ad2>.info>.left>.box>.counter>p {
        font-size: 12px;
    }

    .ad2>.info>.right>.tit {
        font-size: 20px;
        line-height: 130%;
        margin-bottom: 15px;
    }

    .ad2>.info>.right>.box {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .ad2>.info>.right>.box>.item>p {
        font-size: 12px;
    }

    .ad3 {
        padding: 60px 0;
    }

    .ad3>.center>.tit {
        font-size: 32px;
        margin-bottom: 30px;
    }

    .ad3>.center>.box>.left {
        width: 44%;
    }

    .ad3>.center>.box>.right {
        width: 52%;
    }

    .ad3>.center>.box>.left>.title,
    .ad3>.center>.box>.right>.title {
        font-size: 24px;
        margin-bottom: 15px;
    }

    .ad3>.center>.box>.left>p {
        margin-bottom: 30px;
    }

    .ad3>.center>.box>.left>table tr th,
    .ad3>.center>.box>.left>table tr td {
        font-size: 14px;
        padding: 14px 10px;
    }

    .ad3>.center>.box>.right>.box {
        row-gap: 40px;
    }

    .ad3>.center>.box>.right>.box>.counter>b,
    .ad3>.center>.box>.right>.box>.counter>p {
        padding-right: 0;
    }

    .ad4>.left {
        padding: 50px 0;
    }

    .ad4>.left>.tit {
        font-size: 26px;
        margin-bottom: 25px;
    }

    .ad4>.left>.box {
        gap: 25px;
        margin-bottom: 40px;
    }

    .ad4>.left>.box>.item>.title {
        font-size: 40px;
    }

    .ad4>.left>.box>.item>span {
        font-size: 16px;
    }

    .ad4>.left>.box>.item:last-child>span {
        height: 46px;
    }

    .ad5 {
        padding: 60px 0 50px;
    }

    .ad5>.center>.top {
        margin-bottom: 40px;
    }

    .ad5>.center>.top>.left {
        font-size: 34px;
    }

    .ad5>.center>.bottom>.tit {
        font-size: 24px;
        padding-bottom: 15px;
    }

    .ad5>.center>.bottom>.box>.item {
        padding: 30px 20px;
    }

    .ad5>.center>.bottom>.box>.item>div>.title {
        font-size: 20px;
    }

    .ad5>.center>.bottom>.box>.item>div>.counter>.num {
        font-size: 44px;
    }

    .ad5>.center>.bottom>.box>.item>div>.counter>span {
        font-size: 18px;
    }

    .ad6>.center>.tit {
        font-size: 26px;
        margin-bottom: 25px;
    }

    .ad6>.center>.box>div>.info {
        padding: 30px 24px;
    }

    .ad6>.center>.box>div>.info>.tit {
        font-size: 22px;
    }

    .ad6>.center>.box>div>.info>.info {
        font-size: 14px;
        margin-bottom: 20px;
    }

    .ad6>.center>.box>div>.info>.counter>.num {
        font-size: 56px;
    }

    .ad6>.center>.box>div>.info>.counter>span {
        font-size: 20px;
    }

    .ad6>.center>.item>.info {
        padding: 0 24px;
    }

    .ad6>.center>.item>.info>.tit {
        font-size: 26px;
    }

    .ad6>.center>.item>.info>.counter>.num {
        font-size: 56px;
    }

    .ad7 {
        padding: 60px 0;
    }

    .ad7>.center>.tit {
        font-size: 26px;
        margin-bottom: 30px;
    }

    .ad7>.center>.box>div.imgbox {
        height: 96px;
    }

    .ad7>.center>.box>div.imgbox img {
        width: 64px;
        height: 64px;
        object-fit: contain;
    }

    .ad7>.center>.box>div.imgbox p {
        font-size: 13px;
    }

    /* inn */
    .inn1 {
        padding-top: 50px;
        padding-bottom: 60px;
    }

    .inn1>.center>.tit {
        padding-bottom: 30px;
    }

    .inn1>.center>.tit>.title {
        font-size: 32px;
        margin-bottom: 12px;
    }

    .innParam {
        margin-bottom: 50px;
    }

    .innParam>.row:not(.i1) {
        padding: 35px 10px;
    }

    .innParam>.row.i1 .box:last-child {
        padding-left: 40px;
    }

    .innParam>.row>img {
        margin-right: 25px;
        max-height: 120px;
    }

    .innParam>.row .box>.counter .num {
        font-size: 56px;
    }

    .innParam>.row .box>.counter .info {
        font-size: 24px;
    }

    .innParam>.row .box>.counter>sub {
        font-size: 32px;
    }

    .inn2>.info>.service {
        width: 80%;
        column-gap: 30px;
        row-gap: 30px;
    }

    .inn2>.info>.service>.counter>.num {
        font-size: 56px;
    }

    .inn3 {
        padding: 60px 0;
    }

    .inn3>.center>.tit {
        font-size: 24px;
    }

    .inn3>.center>p {
        margin-bottom: 30px;
    }

    .inn3>.center>.box {
        margin-bottom: 40px;
    }

    .inn4>.center>.inn4Item>div.right>.box {
        gap: 25px;
    }

    .inn5>.info {
        bottom: 40px;
        width: 90%;
    }

    .inn5>.info>.tit {
        font-size: 32px;
    }

    .inn6 {
        padding: 60px 0;
    }

    .inn6>.center>.box {
        gap: 8px;
    }

    .inn6>.center>.box>.item:last-child {
        padding: 20px;
    }

    .inn6>.center>.box>.item:last-child>.counter>.num {
        font-size: 48px;
    }

    .inn1 {
        padding-top: 50px;
        padding-bottom: 60px;
    }

    .inn1>.center>.tit {
        padding-bottom: 30px;
    }

    .inn1>.center>.tit>.title {
        font-size: 32px;
        margin-bottom: 12px;
    }

    .innParam {
        margin-bottom: 50px;
    }

    .innParam>.row:not(.i1) {
        padding: 35px 10px;
    }

    .innParam>.row.i1 .box:last-child {
        padding-left: 40px;
    }

    .innParam>.row>img {
        margin-right: 25px;
        max-height: 120px;
    }

    .innParam>.row .box>.counter .num {
        font-size: 56px;
    }

    .innParam>.row .box>.counter .info {
        font-size: 24px;
    }

    .innParam>.row .box>.counter>sub {
        font-size: 32px;
    }

    .inn2>.info>.service {
        width: 80%;
        column-gap: 30px;
        row-gap: 30px;
    }

    .inn2>.info>.service>.counter>.num {
        font-size: 56px;
    }

    .inn3 {
        padding: 60px 0;
    }

    .inn3>.center>.tit {
        font-size: 24px;
    }

    .inn3>.center>p {
        margin-bottom: 30px;
    }

    .inn3>.center>.box {
        margin-bottom: 40px;
    }

    .inn4>.center>.inn4Item>div.right>.box {
        gap: 25px;
    }

    .inn5>.info {
        bottom: 40px;
        width: 90%;
    }

    .inn5>.info>.tit {
        font-size: 32px;
    }

    .inn6 {
        padding: 60px 0;
    }

    .inn6>.center>.box {
        gap: 8px;
    }

    .inn6>.center>.box>.item:last-child {
        padding: 20px;
    }

    .inn6>.center>.box>.item:last-child>.counter>.num {
        font-size: 48px;
    }

    .qu1 {
        padding-top: 40px;
    }

    .qu1>.center {
        margin-bottom: 40px;
    }

    .qu1>.center>.right {
        display: flex;
        gap: 35px;
    }

    .qu1>.center>.right>.box>div,
    .qu1>.center>.right>.counter>.num {
        font-size: 56px;
    }

    .qu1>.center>.right>.counter>span {
        font-size: 22px;
        margin-bottom: 15px;
    }

    .qu2 {
        padding: 50px 0;
    }

    .qu2>.center>.title {
        font-size: 24px;
        margin-bottom: 20px;
    }

    .qu2>.center>.equipment {
        margin-bottom: 20px;
    }

    .qu2>.center>.pagin {
        display: block;
        text-align: center;
        line-height: 0;
    }

    .qu2>.center>.pagin .swiper-pagination-bullet {
        width: 8px;
        height: 8px;
        margin: 0 4px;
        background: #000;
        opacity: .15;
        transition: all .3s ease;
    }

    .qu2>.center>.pagin .swiper-pagination-bullet-active {
        background: #00d683;
        opacity: 1;
    }

    .srBox .srList {
        gap: 3.75rem;
    }

    .srBox .srList>.box>.imgBox>img {
        object-fit: cover;
    }

    .srBox .srList {
        grid-template-columns: repeat(2, 1fr);
    }

    .caseBox .caseInfo .main>.info .tableBox table td {
        min-width: 200px;
    }

    .support>.center {
        column-gap: 30px;
    }

    .service1>img {
        min-height: 50lvh !important;
        object-fit: cover;
    }
}

@media (max-width: 920px) {
    .ab1>.center>.bottom {
        flex-direction: column;
    }

    .ab1>.center>.bottom>div {
        width: 100%;
    }

    .ab1>.center>.bottom>div>p:last-child {
        margin-bottom: 1.5rem;
    }

    .ab2 .histBox {
        display: flex;
        flex-direction: column;
        align-items: end;
    }

    .ab2 .histBox::before {
        display: none;
    }

    .ab2 .histBox>li {
        width: 100%;
        margin-left: auto;
    }

    .ab2 .histBox>li:not(:last-child) {
        margin-bottom: 50px;
    }

    .ab2 .histBox .hist:nth-child(even)>.year,
    .ab2 .histBox .hist:nth-child(even)>.infoBox {
        left: 0;
        /* padding-left: 0; */
    }

    .ab2 .histBox .hist>.year,
    .ab2 .histBox .hist>.infoBox {
        padding-left: 20% !important;
    }

    .ab2 .histBox>li>.line::before {
        display: none;
    }

    .ab2 .histBox>li:nth-of-type(even) {
        margin-left: 0;
    }

    .ab2 .histBox>li:nth-of-type(even)>.line>svg {
        transform: rotate(0);
    }

    .ab2 .histBox .hist>.infoBox {
        bottom: inherit;
        top: 60%;
    }

    .ab3>.center>.flex {
        flex-direction: column;
    }

    .digital1>.center {
        flex-direction: column;
    }

    .digital1 .left,
    .digital1 .right {
        width: 100%;
    }

    .digital1 .right ul {
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
        margin-top: 30px;
    }

    .digital1 .right ul li {
        width: calc((100% / 3) - 2.5rem);
        min-width: 200px;
    }

    .support>.center {
        grid-template-columns: repeat(2, 1fr);
    }

    .service>img {
        min-height: 100lvh !important;
        object-fit: cover;
    }
}

@media (max-width:768px) {
    .banner>.info {
        top: 60%;
    }

    .ab5 {
        background-size: auto 100%;
        background-position: 60%;
    }

    .ab5>.center>.bott>div {
        flex: 0 0 40%;
        width: auto;
    }

    .ab6>.center>.info {
        flex-direction: column;
        gap: 30px;
    }

    .ab6>.center>.info>div {
        width: 100% !important;
    }

    .ab7>.center>.title {
        flex-wrap: wrap;
        gap: 20px;
    }

    .ab7>.center>.title>.more {
        margin-left: auto;
    }

    .banner.half>img {
        width: 100%;
        min-height: 280px;
    }

    .sNav.inn>.center {
        flex-direction: column;
        align-items: flex-start;
        padding: 8px 0;
    }

    .sNav.inn>.center>span {
        line-height: 260%;
    }

    .sNav.inn>.center>.box {
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 18px;
        width: 100%;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .sNav.inn>.center>.box>a {
        line-height: 200%;
    }

    .sNav.inn>.center>.box::-webkit-scrollbar {
        display: none;
    }

    .ad1 {
        padding: 50px 0;
    }

    .ad1>.center {
        flex-direction: column;
    }

    .ad1>.center>.left {
        max-width: 100%;
    }

    .ad1>.center>.left>.tit {
        font-size: 26px;
        margin-bottom: 15px;
    }

    .ad1>.center>.right {
        width: 100%;
        margin-top: 25px;
    }

    .ad1>.center>.right>p {
        font-size: 14px;
        line-height: 180%;
    }

    .ad1>.center>.right>p+br {
        display: none;
    }

    .ad1>.center>.right>.box {
        margin-top: 30px;
        gap: 15px;
    }

    .ad1>.center>.right>.box>div.counter>.num {
        font-size: 42px;
    }

    .ad1>.center>.right>.box>div.counter>span {
        font-size: 20px;
    }

    .ad1>.center>.right>.box>div.counter>p {
        font-size: 13px;
    }

    .ad2>img {
        position: absolute;
        top: 0;
        left: 0;
        width: auto;
        height: 100%;
        z-index: -1;
    }

    .ad2>.info {
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        flex-direction: column;
        gap: 14px;
        z-index: 1;
        padding: 30px;
    }

    .ad2>.point,
    .ad2>#svg-container {
        /* display: none !important; */
        opacity: 0;
    }

    .ad2>.info>.left,
    .ad2>.info>.right {
        width: 100%;
        padding: 20px 16px;
    }

    .ad2>.info>.left>.tit {
        font-size: 26px;
        margin-bottom: 15px;
    }

    .ad2>.info>.left>.box {
        row-gap: 18px;
    }

    .ad2>.info>.left>.box>.counter>.num {
        font-size: 26px;
    }

    .ad2>.info>.left>.box>.counter>span {
        font-size: 16px;
        margin-bottom: 2px;
    }

    .ad2>.info>.left>.box>.counter>p {
        font-size: 12px;
    }

    .ad2>.info>.right>.tit {
        font-size: 20px;
        margin-bottom: 15px;
    }

    .ad2>.info>.right>.box {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .ad2>.info>.right>.box>.item>p {
        font-size: 12px;
    }

    .ad3 {
        padding: 50px 0;
    }

    .ad3>.center>.tit {
        font-size: 26px;
        margin-bottom: 25px;
    }

    .ad3>.center>.box {
        flex-direction: column;
    }

    .ad3>.center>.box>.left,
    .ad3>.center>.box>.right {
        width: 100%;
    }

    .ad3>.center>.box>.left>.title,
    .ad3>.center>.box>.right>.title {
        font-size: 22px;
        margin-bottom: 12px;
    }

    .ad3>.center>.box>.left>p {
        font-size: 14px;
        margin-bottom: 30px;
    }

    .ad3>.center>.box>.left>table tr th,
    .ad3>.center>.box>.left>table tr td {
        font-size: 13px;
        line-height: 150%;
        padding: 10px;
    }

    .ad3>.center>.box>.right {
        margin-top: 40px;
    }

    .ad3>.center>.box>.right>.box {
        row-gap: 30px;
    }

    .ad3>.center>.box>.right>.box>.counter,
    .ad3>.center>.box>.right>.box>.counter:nth-child(even) {
        width: 100%;
    }

    .ad3>.center>.box>.right>.box>.counter>.num {
        font-size: 46px;
    }

    .ad3>.center>.box>.right>.box>.counter>span {
        font-size: 20px;
    }

    .ad3>.center>.box>.right>.box>.counter>b,
    .ad3>.center>.box>.right>.box>.counter>p {
        padding-right: 0;
        font-size: 13px;
    }

    .ad4 {
        grid-template-columns: 1fr;
    }

    .ad4>.left {
        padding: 40px 0;
    }

    .ad4>.left>.tit {
        font-size: 24px;
        margin-bottom: 25px;
    }

    .ad4>.left>.box {
        flex-wrap: wrap;
        gap: 20px;
        row-gap: 25px;
        margin-bottom: 35px;
    }

    .ad4>.left>.box>.item {
        width: calc(50% - 10px);
    }

    .ad4>.left>.box>.item:last-child {
        width: 100%;
    }

    .ad4>.left>.box>.item>.title {
        font-size: 44px;
    }

    .ad4>.left>.box>.item>span {
        font-size: 16px;
    }

    .ad4>.left>.box>.item:last-child>span {
        height: auto;
    }

    .ad4>.left>.box>.item>p {
        font-size: 12px;
    }

    .ad4>.left>b,
    .ad4>.left>p {
        font-size: 13px;
    }

    .ad4>.right>img {
        height: 64vw;
    }

    .ad5 {
        padding: 50px 0;
    }

    .ad5>.center>.top {
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 30px;
    }

    .ad5>.center>.top>.left {
        font-size: 30px;
        line-height: 115%;
        margin-bottom: 15px;
    }

    .ad5>.center>.top>.right {
        width: 100%;
        font-size: 14px;
    }

    .ad5>.center>.bottom>.tit {
        font-size: 22px;
        padding-bottom: 12px;
    }

    .ad5>.center>.bottom>.box>.item {
        flex-direction: column;
        padding: 25px 15px;
    }

    .ad5>.center>.bottom>.box>.item>div {
        width: 100%;
    }

    .ad5>.center>.bottom>.box>.item>div:not(:last-child) {
        border-bottom: 1px solid rgba(0, 0, 0, 0.13);
    }

    .ad5>.center>.bottom>.box>.item>div:nth-child(2) {
        margin-top: 25px;
    }

    .ad5>.center>.bottom>.box>.item>div>.title {
        font-size: 17px;
        margin-bottom: 10px;
    }

    .ad5>.center>.bottom>.box>.item>div>b,
    .ad5>.center>.bottom>.box>.item>div>p {
        font-size: 13px;
    }

    .ad5>.center>.bottom>.box>.item>div>.counter>.num {
        font-size: 42px;
    }

    .ad5>.center>.bottom>.box>.item>div>.counter>span {
        font-size: 16px;
    }

    .ad6>.center>.tit {
        font-size: 24px;
        line-height: 130%;
        margin-bottom: 20px;
    }

    .ad6>.center>.box {
        flex-direction: column;
        gap: 15px;
        margin-bottom: 15px;
    }

    .ad6>.center>.box>div {
        width: 100%;
    }

    .ad6>.center>.box>div>img {
        height: 68vw;
        min-height: 260px;
    }

    .ad6>.center>.box>div>.info {
        padding: 20px 16px;
    }

    .ad6>.center>.box>div>.info>.tit {
        font-size: 20px;
    }

    .ad6>.center>.box>div>.info>.info {
        font-size: 13px;
        margin-bottom: 15px;
    }

    .ad6>.center>.box>div>.info>.counter>.num {
        font-size: 48px;
    }

    .ad6>.center>.box>div>.info>.counter>span {
        font-size: 18px;
        margin-bottom: 4px;
    }

    .ad6>.center>.item>img {
        height: 64vw;
        min-height: 230px;
    }

    .ad6>.center>.item>.info {
        padding: 0 16px;
    }

    .ad6>.center>.item>.info>.tit {
        font-size: 22px;
        margin-bottom: 12px;
    }

    .ad6>.center>.item>.info>.counter>.num {
        font-size: 48px;
    }

    .ad6>.center>.item>.info>.counter>span {
        font-size: 18px;
    }

    .ad6>.center>.item>.info>b,
    .ad6>.center>.item>.info>p {
        font-size: 13px;
    }

    .ad7 {
        padding: 45px 0 50px;
    }

    .ad7>.center>.tit {
        font-size: 24px;
        line-height: 130%;
        margin-bottom: 25px;
    }

    .ad7>.center>.box {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 22px 8px;
    }

    .ad7>.center>.box>div.imgbox {
        flex: initial;
        height: auto;
    }

    .ad7>.center>.box>div.imgbox::after {
        display: none;
    }

    .ad7>.center>.box>div.imgbox img {
        width: 56px;
        height: 56px;
        object-fit: contain;
    }

    .ad7>.center>.box>div.imgbox p {
        font-size: 12px;
        margin-top: 6px;
    }

    /* inn */
    .inn1 {
        padding: 50px 0;
    }

    .inn1>.center>.tit>.title {
        font-size: 26px;
    }

    .innParam>.row {
        align-items: start;
        flex-direction: column;
    }

    .innParam>.row.i1 .box {
        flex: initial;
        width: 100%;
        padding: 25px 0;
    }

    .innParam>.row.i1 .box:first-child {
        border-right: 0;
        border-bottom: 1px solid rgba(0, 0, 0, .1);
        padding-left: 0;
    }

    .innParam>.row.i1 .box:last-child {
        padding-left: 0;
    }

    .innParam>.row.i1 .box>img {
        max-height: 70px;
    }

    .innParam>.row:not(.i1) {
        padding: 25px 0;
    }

    .innParam>.row>img {
        margin: 0 0 20px;
        max-height: 70px;
    }

    .innParam>.row.in2>.column {
        gap: 25px;
    }

    .innParam>.row.in2 .box:nth-of-type(2)>.counter:nth-of-type(3)::after {
        width: 60px;
        height: 60px;
        transform: translate(150%, -40%);
    }

    .innParam>.row.in2 .box {
        width: 100%;
    }

    .innParam>.row .box>.counter .num {
        font-size: 46px;
    }

    .innParam>.row .box>.counter .info {
        font-size: 18px;
    }

    .inn2>.info>.service {
        width: 100%;
        grid-template-columns: repeat(2, 1fr);
    }

    .inn2>.info>.service>.counter>.num {
        font-size: 44px;
    }

    .inn2>.info>.service>.counter>p {
        font-size: 12px;
    }

    .inn2>.info>.tit {
        font-size: 26px;
        margin-bottom: 30px;
    }

    .inn3>.center>.box {
        flex-direction: column;
    }

    .inn3>.center>.box img {
        width: 100%;
        max-width: 100%;
    }

    .inn4>.center>.inn4Item {
        flex-direction: column;
        padding: 25px 0;
    }

    .inn4>.center>.inn4Item>div.left,
    .inn4>.center>.inn4Item>div.right {
        width: 100%;
        flex: initial;
    }

    .inn4>.center>.inn4Item>div.right {
        margin-top: 20px;
    }

    .inn4>.center>.inn4Item>div.right>.box {
        gap: 20px;
        margin-top: 15px;
    }

    .inn4>.center>.inn4Item>div.right>.box>div>p {
        margin-top: 8px;
    }

    .inn5>.info {
        bottom: 20px;
    }

    .inn5>.info>.tit {
        font-size: 24px;
        margin-bottom: 10px;
    }

    .inn5>.info>p {
        width: 100%;
        font-size: 13px;
    }

    .inn6 {
        padding: 50px 0;
    }

    .inn6>.center>.box {
        grid-template-columns: 1fr;
    }

    .qu1>.center:nth-of-type(1) {
        flex-direction: column;
    }

    .qu1>.center>.left,
    .qu1>.center>.right {
        width: 100%;
    }

    .qu1>.center>.right {
        margin-top: 35px;
        row-gap: 25px;
    }

    .qu1>.center>.right>.box>div,
    .qu1>.center>.right>.counter>.num {
        font-size: 44px;
    }

    .qu1>.center>.right>.counter>span {
        font-size: 16px;
        margin-bottom: 8px;
    }

    .qu2>.center>.title {
        font-size: 22px;
    }

    .digital1 .right ul li {
        flex: 0 0 40%;
    }

    .cul2>.center>.box>.item:nth-of-type(1) {
        padding-right: 2rem;
    }

    .cul2>.center>.box>.item:nth-of-type(2) {
        padding: 1.5625rem 3.25rem;
    }

    .cul2>.center>.box>.item:nth-of-type(3) {
        padding-left: 2rem;
    }

    .cul1>.center>.portray>div.info {
        max-width: 100%;
        overflow: hidden;
    }

    .cul1>.center>.portray>.info>svg {
        max-width: 100%;
        transform: scale(0.8);
        transform-origin: center center;
    }

    .cul1>.center>.portray>div.info>.words {
        width: 80%;
        margin: 0 auto;
    }

    .cul2>.center>.tit {
        margin-bottom: 4rem;
    }

    .cul3>.center>.boxs {
        margin-top: 10rem;
    }

    .cul3 .logoIntro>.tc {
        padding-top: 4rem;
    }

    .cul3 .logoIntro>.tc,
    .cul3 .logoIntro ul {
        width: 100%;
    }

    .cul3 .logoIntro ul li,
    .cul3 .logoIntro ul li span {
        width: 100%;
        position: relative;
    }

    .cul3 .logoIntro ul li::before,
    .cul3 .logoIntro ul li::after {
        display: none;
    }

    .cul3 .logoIntro ul li {
        width: 100% !important;
    }

    .cul3 .logoIntro ul li span {
        max-width: 100% !important;
        display: block;
        margin-bottom: 1.5rem;
    }

    .offshor3>.center>.box {
        margin-bottom: 30px;
    }

    .offshor>.center>.box {
        flex-direction: column;
    }

    .offshor>.center>.box>div {
        max-width: 100% !important;
        width: 100% !important;
    }

    .offshor>.center>.box>.left>.imgBox {
        max-width: 50%;
        margin: 0 auto;
    }

    .offshor3>.center>.box:nth-of-type(2) .list {
        grid-template-columns: 1fr;
    }

    .offshor3>.center>.box,
    .offshor4>.center>.box:not(:last-child) {
        flex-direction: column;
    }

    .offshor3>.center>.box>.left {
        width: 100%;
        margin-bottom: 20px;
    }

    .download_box {
        flex-direction: column;
    }

    .solu-download .down_list {
        width: 100% !important;
    }

    .solu-download .down_list .down_text {
        width: auto !important;
    }

    .solu-certification .solu-tis {
        margin-bottom: 20px;
    }

    .solu-certification .solu-tis br {
        display: none;
    }

    .zero1>.center>div>.item {
        margin: 0 !important;
        transform: none !important;
    }

    .zero1>.center>div.c_flex {
        order: 1;
    }

    .zero1>.center>div.top {
        order: 2;
    }

    .zero1>.center>div.bot {
        order: 3;
    }

    .zero1>.center>div>.item {
        border-radius: 20px !important;
        margin-bottom: 20px !important;
    }

    .nei_banner img {
        min-height: 350px;
        object-fit: cover;
    }

    .nei_banner .nei_txt .tit {
        font-size: 36px;
    }

    .sup1>.center {
        flex-direction: column;
    }

    .sup1>.center>.left {
        width: 100%;
        margin-bottom: 20px;
    }

    .sup1>.center>.right {
        width: 100%;
        padding-left: 40px;
    }

    .sup1>.center>.right>li.act>.cir {
        top: -2px;
    }

    .sup2>.center {
        flex-direction: column-reverse;
    }

    .sup2>.center>.right {
        width: 100%;
    }

    .sup2>.center>.right>.tit>br,
    .sup2>.center>.right>p>br {
        display: none;
    }

    .sup2>.center>.right>p {
        margin-bottom: 3rem;
    }

    .sup2>.center>.left {
        width: 100%;
    }

    .Contact_corp>.center {
        flex-direction: column;
    }

    .Contact_corp>.center>.left {
        margin-bottom: 20px;
    }

    .Contact_corp>.center>.left {
        width: 100%;
    }

    .Contact_corp>.center>.right {
        width: 100%;
    }

    .Contact_corp>.center>.left>.tit>br,
    .Contact_corp>.center>.left>p>br {
        display: none;
    }
}

@media (max-width: 600px) {
    .ab1>.center>.top>.counter {
        padding: 2rem;
    }

    .cul2>.center>.box {
        flex-direction: column;
    }

    .cul2>.center>.box>.item:nth-of-type(2)::before,
    .cul2>.center>.box>.item:nth-of-type(2)::after {
        display: none;
    }

    .cul2>.center>.box>.item {
        padding: 1.5625rem 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.6);
    }

    .cul3>.center>.boxs {
        flex-direction: column;
    }

    .cul3>.center>.boxs>.box:nth-of-type(2) {
        order: 1;
    }

    .cul3>.center>.boxs>.box:nth-of-type(1) {
        order: 2;
    }

    .offshor>.center>.box>.left>.imgBox,
    .offshor3>.center>.box>.right {
        max-width: 100%;
        width: 100%;
    }

    .solu-download .down_list>.flex {
        flex-direction: column;
    }

    .solu-download .down_list .down_text {
        margin: 7% auto 0 auto !important;
    }
}

@media (max-width: 480px) {
    .banner>img {
        min-height: 50lvh !important;
        object-fit: cover;
    }

    .ab1>.center>.top {
        /* grid-template-columns: 1fr; */
        display: flex;
        flex-wrap: wrap;
    }

    .ab1>.center>.top>.counter:nth-of-type(n+2) {
        width: 50%;
    }

    .ab1>.center>.top>.counter:nth-of-type(-n+3) {
        width: 100%;
    }

    .ab1>.center>.top>.counter {
        border-right: 0 !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.13) !important;
        border-image: none;
    }

    .ab2 .histBox .hist>.infoBox {
        width: calc(100% - 6rem);
    }

    .ab2 .histBox .hist>.year,
    .ab2 .histBox .hist>.infoBox {
        padding-left: 5% !important;
    }

    .ab2 .histBox>li:not(:last-child) {
        margin-bottom: 100px;
    }

    .ab5>.center>.bott {
        flex-direction: column;
        gap: 30px;
    }

    .ab3>.center>.flex>div>img {
        min-height: 350px;
    }

    .innParam>.row.in2 .box {
        flex-wrap: wrap;
    }

    .innParam>.row .box>.counter>p {
        white-space: nowrap;
    }

    .innParam>.row.in2 .box:nth-of-type(2)>.counter:nth-of-type(1) {
        order: 1;
    }

    .innParam>.row.in2 .box:nth-of-type(2)>.counter:nth-of-type(3) {
        order: 2;
    }

    .innParam>.row.in2 .box:nth-of-type(2)>.counter:nth-of-type(2) {
        order: 3;
        width: 100%;
        flex: 0 0 100%;
    }

    .inn2>.info>.service {
        grid-template-columns: 1fr;
    }

    .inn2>.info>.service>.counter {
        padding: 0 15px;
        padding-bottom: 15px;
    }

    .inn4>.center>.inn4Item>div.right>.box>div.half {
        width: 100% !important;
    }

    .inn5 {
        min-height: 40lvh;
    }

    .inn5>img {
        height: 40lvh;
        object-fit: cover;
    }

    .qu1>.center.igs {
        flex-direction: column;
        gap: 8px;
    }

    .qu1>.center.igs>img {
        width: 100%;
        height: auto;
    }

    .digital1 .right ul li {
        flex: 0 0 100%;
    }

    .digital1 .left>.box {
        flex-direction: column;
    }

    .srBox .srList {
        grid-template-columns: repeat(1, 1fr);
    }

    .zer_three ul li {
        width: 100%;
    }

    .support>.center {
        grid-template-columns: repeat(1, 1fr);
    }

    .solu-download .down_list .down_text {
        max-width: 100% !important;
        margin: 10% auto 0 auto !important;
    }

    .ab1>.center>.bottom>div>p {
        font-size: 1.33rem;
        line-height: 167%;
    }

    .ab4,
    .ab3 {
        padding: 5rem 0;
    }

    .ab4>.center>.tit,
    .ab3>.center>.tit {
        font-size: 2.75rem;
        margin-bottom: 2rem;
    }

    .ab4>.center>.honor {
        margin-bottom: 2rem;
    }

    .ab5>.center>div.title {
        font-size: 2.75rem;
        margin-bottom: 2rem;
    }

    .ab5>.center>.bott>div>.counter {
        font-size: 2.75rem;
    }

    .ab6>.center>.info>.left>.tit {
        font-size: 2.75rem;
    }

    .ad2>.info {
        padding: 30px 5px;
    }

    .ab5>.center>a.more {
        margin-bottom: 60px;
    }

    .sNav.inn>.center>.box {
        row-gap: 0px;
    }

    .inn4>.center>.inn4Item>div.right {
        margin-top: 0px;
    }

    .inn3>.center>.box {
        margin-bottom: 0;
    }

    .sNav {
        display: none;
    }

    .qu1>.center>.right>.box {
        width: 60%;
    }

    .qu1>.center>.right>.counter>span {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .digital1 .left>.box>div>.tit>b {
        font-size: 18px;
    }

    .digital1 {
        padding-top: 40px;
    }

    .digital2 {
        padding-bottom: 40px;
    }

    .cul1>.center>.title {
        padding-bottom: 0;
    }

    .cul1>.center>.portray {
        padding-bottom: 4rem;
    }

    .cul1>.center>.title>p {
        font-size: 16px;
        line-height: 120%;
    }

    .cul1>.center>.portray>.info>svg {
        margin-bottom: 0px;
    }

    .cul2>.center>.box>.item>b {
        font-size: 18px;
    }

    .cul2>.center>.box>.item>p {
        font-size: 16px;
    }

    .cul3 .logoIntro>img {
        width: 60%;
    }

    .srBox .srList>.box>p {
        font-size: 16px;
    }

    .service>.info>p {
        font-size: 16px;
    }

    .banner>.info>.title {
        font-size: 40px;
    }

    .banner>.info {
        top: 60% !important;
    }

    .banner>.info>p {
        margin-bottom: 10px;
    }

    .sup1 {
        padding: 2rem 0 6rem;
    }

    .offshor>.center>.box,
    .sup2 {
        padding: 4rem 0;
    }

    .caseBox .caseInfo .main>.info .tableBox table td {
        font-size: 16px;
    }

    .offshor>.center>.box>.left {
        margin-bottom: 15px;
    }

    .offshor>.center>.box>.right>p:not(:last-child) {
        margin-bottom: 10px;
    }

    .offshor3>.center>.box .title {
        margin-bottom: 20px;
    }

    .offshor3>.center>.box:nth-of-type(2) .list {
        row-gap: 15px;
    }

    .offshor3 {
        padding: 4rem 0 3rem;
    }

    .offshor4>.center>.box:not(:last-child) {
        margin-bottom: 40px;
    }

    .offshor3>.center>.box:nth-of-type(2) .list>.item>b,
    .offshor3>.center>.box:nth-of-type(2) .list>.item>p {
        font-size: 16px;
    }

    .offshor3>.center>.box:nth-of-type(2) .list>.item>b,
    .offshor3>.center>.box:nth-of-type(2) .list>.item>p {
        font-size: 15px;
    }

    .solu-project {
        margin-bottom: 0 !important;
    }

    .solu-certification .solu-tis {
        margin-bottom: 2rem !important;
    }

    .solu-certification .right>p {
        line-height: 140%;
    }

    .solu-download .down_list .down_img {
        width: 70% !important;
    }

    .ad5>.center>.top>.left>br {
        display: none;
    }

    .offshor3>.center>.box p,
    .solu-certification .right>p,
    .ad1>.center>.right>p,
    .ad3>.center>.box>.left>p,
    .ad4>.left>b,
    .ad4>.left>p,
    .ad5>.center>.top>.right,
    .ad5>.center>.bottom>.box>.item>div>b,
    .ad5>.center>.bottom>.box>.item>div>p,
    .ad6>.center>.box>div>.info>.info,
    .inn1>.center>.tit>p,
    .innParam>.row .box>.counter>p,
    .inn1>.center>p,
    .inn3>.center>p,
    .inn4>.center>.inn4Item>div.right>p,
    .inn4>.center>.inn4Item>div.left>ul>li,
    .inn6>.center>p,
    .inn6>.center>.box>.item:last-child>p,
    .qu1>.center>.left>p,
    .qu1>.center>.right>.box>p,
    .digital1 .left>p,
    .digital1 .left>.box>div>p,
    .digital2 .operation .swiper-slide>.tit>p,
    .cul3 .logoIntro ul li.circle1 span {
        font-size: 15px;
    }

    .cul3>.center>.boxs>.box>.item>.info {
        font-size: 20px;
    }

    .qu2>.center>.title {
        font-size: 33px;
    }

    .digital2 .operation .swiper-slide>.tit>b,
    .inn4>.center>.inn4Item>div.right>b {
        font-size: 18px;
    }

    .inn2>.info>.service>.counter>p,
    .inn5>.info>p {
        font-size: 14px;
    }

    .ad5>.center>.bottom>.box>.item>div>p {
        margin-bottom: 14px;
    }

    .innParam>.row .box>.counter>p {
        margin-top: 5px;
    }

    .ad6>.center>.box>div>.info>.info {
        line-height: 150%;
        margin-top: 10px;
    }

    .inn4>.center>.inn4Item>div.left {
        margin-bottom: 15px;
    }

    .inn4>.center>.inn4Item>div.right>.box:not(:last-child) {
        margin-bottom: 10px;
    }

    .inn6>.center>p:nth-of-type(1) {
        margin-bottom: 30px;
    }
}