.hw-vision4-all {
    color: #000;
    font-weight: 400;
    line-height: normal;
    position: relative;
}

.hw-vision4-all * {
    box-sizing: border-box;
}

.hw-vision4-all .text-animation {
    transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
    -webkit-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
    -moz-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
    -ms-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
    -o-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
    will-change: opacity, transform;
}

.hw-vision4-all img {
    border: 0;
    width: 100%;
    display: block;
}

.hw-vision4-all picture {
    border: 0;
    width: 100%;
    display: block;
}

.hw-vision4-all video {
    border: 0;
    width: 100%;
    display: block;
}

.hw-vision4-all a {
    text-decoration: none;
    color: initial;
}

.hw-vision4-all .pc-show {
    display: block;
    font-style: normal;
}

.hw-vision4-all .mob-show {
    display: none;
    font-style: normal;
}

.hw-vision4-all .iPc-show {
    display: inline-block;
    font-style: normal;
}

.hw-vision4-all .iMob-show {
    display: none;
    font-style: normal;
}

.hw-vision4-all .nr {
    white-space: nowrap;
    font-style: normal;
    display: inline-block;
}

.hw-vision4-all .ie {
    display: none;
}

.hw-vision4-all .nie {
    display: block;
}

.hw-vision4-all .blur-up {
    -webkit-filter: blur(3px);
    filter: blur(3px);
    -webkit-transition: -webkit-filter 400ms;
    transition: -webkit-filter 400ms;
    transition: filter 400ms;
    transition: filter 400ms, -webkit-filter 400ms;
}

.hw-vision4-all .blur-up.lazyloaded {
    -webkit-filter: blur(0);
    filter: blur(0);
}

.hw-vision4-all .lazyload:not([src]) {
    display: none;
}

.hw-vision4-all sup {
    font-size: 0.6em;
    cursor: pointer;
}

.hw-vision4-all .hw-footer li.active {
    color: #fff;
}

.hw-vision4-all .hw-footer .last,
.hw-vision4-all .hw-footer .last2 {
    position: relative;
    list-style: none !important;
}

.hw-vision4-all .hw-footer .last::before,
.hw-vision4-all .hw-footer .last2::before {
    content: "*";
    position: absolute;
    top: .15625vw;
    left: -0.78125vw;
}

.hw-vision4-all .hw-footer .last2::before {
    content: "**"
}

@media screen and (max-aspect-ratio:137/100) {

    .hw-vision4-all .hw-footer .last::before,
    .hw-vision4-all .hw-footer .last2::before {
        top: .5555555556vw;
        left: -4.1666666667vw
    }
}

@media only screen and (-ms-high-contrast:active),
(-ms-high-contrast:none) {
    .hw-vision4-all .ie {
        display: block;
    }

    .hw-vision4-all .nie {
        display: none;
    }
}

/* @media screen and (max-aspect-ratio:137/100) { */
/* <=1024 */
@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .mob-show {
        display: block;
    }

    .hw-vision4-all .pc-show {
        display: none;
    }

    .hw-vision4-all .iMob-show {
        display: inline-block;
    }

    .hw-vision4-all .iPc-show {
        display: none;
    }
}

.hw-vision4-all .sec3-text1 span {
    background: linear-gradient(177deg, #dbb592 0%, #a97d58 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    display: inline-block;
    /* will-change: transform; */
    transform: translate3d(0, 0, 0);
}

.hw-vision4-all .mark {
    color: #000;
    font-weight: 500;
    font-style: normal;
    display: inline;
}


/* sec1 */
.hw-vision4-all .sec1 {
    width: 100%;
    position: relative;
}

.hw-vision4-all .sec1-word {
    width: 32.08333333vw;
    position: absolute;
    left: 60.72916667vw;
    top: 19.01041667vw;
}

.hw-vision4-all .sec1-word p {
    color: #000000;
    font-size: 0.9375vw;
    font-weight: 400;
    line-height: 1.6;
    text-align: center;
    margin: 1.30208333vw 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hw-vision4-all .sec1-word p i {
    width: 1px;
    height: 0.9375vw;
    font-style: normal;
    background: #000;
    display: inline-block;
    vertical-align: middle;
}

.hw-vision4-all .sec1-ksp {
    width: 8.95833333vw;
    position: absolute;
    right: 3.02083333vw;
    bottom: 2.60416667vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec1-word {
        width: 71.94444444vw;
        position: absolute;
        left: 50%;
        top: 27.777777vw;
        transform: translateX(-50%);
    }

    .hw-vision4-all .sec1-word p {
        font-size: 2.083333vw;
        margin: 2.7777777vw 0 0;
    }

    .hw-vision4-all .sec1-word p i {
        height: 2.08333333vw;
    }

    .hw-vision4-all .sec1-ksp {
        width: 13.33333333vw;
        position: absolute;
        right: 5.5555555vw;
        bottom: 5.555555555vw;
    }
}


.hw-vision4-all .section-pic-center {
    position: relative;
    z-index: 10;
    text-align: center;
}

.hw-vision4-all .section-kv-pic {
    line-height: 1.25;
    margin-top: 1.5625vw;
    font-size: 1.46vw;
    font-weight: 400;
    color: #000;
}

.hw-vision4-all .section-kv-pic a {
    color: initial;
}

.hw-vision4-all .section-kv-pic span {
    font-size: 0.6770833333vw;
    font-weight: 500;
}

.hw-vision4-all .section-slogan-botton {
    background-color: #000;
    color: #fff;
    font-size: 13px;
    border: 2px solid #000;
    display: inline-block;
    line-height: 24px;
    font-weight: 800;
    padding: 10px 26px;
    border-radius: 6px;
    text-align: left;
    cursor: pointer;
    transition: .3s ease-out;
    margin-top: 24px;
}

.hw-vision4-all .section-slogan-botton:hover {
    opacity: .8;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .section-pic-center {
        margin: 76vw 0 0;
    }

    .hw-vision4-all .section-kv-pic span {
        font-size: 3.6111111111vw;
    }

    .hw-vision4-all .section-kv-pic {
        font-size: 5.56vw;
        margin-top: 6.6666666666vw;
    }
}


/* sec2 */
.hw-vision4-all .sec2 {
    padding: 15.625vw 0;
}

.hw-vision4-all .sec2-cneter {
    width: 87.5vw;
    margin: 0 auto;
    position: relative;
}

.hw-vision4-all .sec2-swiper {
    width: 81.25vw;
    margin: 0 auto;
    overflow: hidden;
}

.hw-vision4-all .sec2 .swiper-slide {
    width: 18.22916667vw;
    cursor: pointer;
}

.hw-vision4-all .sec2 .swiper-slide:nth-of-type(1),
.hw-vision4-all .sec2 .swiper-slide:nth-of-type(5) {
    width: 21.875vw;
}

.hw-vision4-all .sec2 .swiper-slide:nth-of-type(2n) {
    margin: 2.08333333vw 0 0;
}

.hw-vision4-all .sec2-img-cne {
    border-radius: 0.83333333vw;
    position: relative;
    overflow: hidden;
    transform: translate3d(0, 0, 0) rotate(0deg);
}

.hw-vision4-all .sec2-img {
    border-radius: 0.83333333vw;
    overflow: hidden;
    position: relative;
    width: 100%;
    transform: translate3d(0, 0, 0) rotate(0deg);
}

.hw-vision4-all .sec2-icon {
    width: 2.39583333vw;
    height: 2.39583333vw;
    position: absolute;
    right: 1.04166667vw;
    bottom: 1.04166667vw;
    border-radius: 50px;
    overflow: hidden;
    transform: rotate(0deg);
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
}
.hw-vision4-all .sec2-icon img {
    flex-shrink: 0;
}

.hw-vision4-all .sec2-button-prev {
    width: 1.04166667vw;
    position: absolute;
    left: 0;
    top: 12.5vw;
    cursor: pointer;
    outline: 0;
}

.hw-vision4-all .sec2-button-next {
    width: 1.04166667vw;
    position: absolute;
    right: 0;
    top: 12.5vw;
    transform: rotate(180deg);
    cursor: pointer;
    outline: 0;
}

.hw-vision4-all .sec2 .swiper-button-disabled {
    cursor: auto;
    opacity: .5;
}

@media screen and (min-width:1366px) {
    .hw-vision4-all .sec2-img img {
        transition: transform 1s ease-in-out;
    }

    .hw-vision4-all .sec2-li:hover .sec2-img img {
        transform: scale(1.1);
    }

    .hw-vision4-all .sec2-icon img {
        transform: translateY(0%);
        transition: transform 1s ease-in-out;
    }

    .hw-vision4-all .sec2-li:hover .sec2-icon img {
        transform: translateY(50%);
    }
}

.hw-vision4-all .sec2-word {
    width: 16.14583333vw;
    margin: 2.08333333vw 0 0;
}

.hw-vision4-all .sec2-word h3 {
    font-weight: 500;
    color: #000000;
    font-size: 1.66666667vw;
    line-height: 1.25;
    margin: 0 0 1.04166667vw;
}

.hw-vision4-all .sec2-word h4 {
    color: #88888b;
    font-size: 1.14583333vw;
    font-weight: 400;
    line-height: 1.6;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec2 {
        padding: 27.777777vw 0;
    }

    .hw-vision4-all .sec2-cneter {
        width: 84.166666vw;
    }

    .hw-vision4-all .sec2-swiper {
        width: 100%;
    }

    .hw-vision4-all .sec2 .swiper-slide {
        width: 100%;
        cursor: none;
    }

    .hw-vision4-all .sec2 .swiper-wrapper {
        display: block;
    }

    .hw-vision4-all .sec2 .swiper-slide:nth-of-type(n + 2) {
        margin: 22.2222222vw 0 0;
    }

    .hw-vision4-all .sec2 .swiper-slide:nth-of-type(1),
    .hw-vision4-all .sec2 .swiper-slide:nth-of-type(5) {
        width: 100%;
    }

    .hw-vision4-all .sec2-img-cne {
        border-radius: 2.22222222vw;
    }

    .hw-vision4-all .sec2-img {
        border-radius: 2.22222222vw;
    }

    .hw-vision4-all .sec2-icon {
        width: 6.38888888vw;
        height: 6.38888888vw;
        right: 2.7777777vw;
        bottom: 2.7777777vw;
    }

    .hw-vision4-all .sec2-button-prev {
        width: 1.04166667vw;
        position: absolute;
        left: 0;
        top: 12.5vw;
    }

    .hw-vision4-all .sec2-button-next {
        width: 1.04166667vw;
        position: absolute;
        right: 0;
        top: 12.5vw;
        transform: rotate(180deg);
    }

    .hw-vision4-all .sec2-word {
        width: 100%;
        margin: 11.111111vw 0 0;
    }

    .hw-vision4-all .sec2-word h3 {
        font-size: 6.66666666vw;
        margin: 0 0 5.55555555vw;
    }

    .hw-vision4-all .sec2-word h4 {
        font-size: 4.4444444vw;
    }
}

/* sec3 */
.hw-vision4-all .sec3 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec3-cen {
    width: 51.04166667vw;
    margin: 0 auto;
}

.hw-vision4-all .sec3-title {
    position: relative;
    padding: 0 0 0 3.4375vw;
}

.hw-vision4-all .sec3-title::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 8.85416667vw;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #d6dff4;
    z-index: -2;
}

.hw-vision4-all .sec3-title span {
    font-weight: 900;
    color: #2c3469;
    font-size: 6.25vw;
    line-height: 1.25;
    background-image: repeating-linear-gradient(105deg, #0c121d 0%, #0c121d 21%, #446eb7 27%, #0c121d 32%, #0c121d 65%, #365793 71%, #0c121d 76%, #0c121d 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    display: inline-block;
    background-size: 100% 100%;
    background-position-x: 0;
}

.hw-vision4-all .sec3-icon {
    width: 9.0625vw;
    position: absolute;
    left: 37.395833333vw;
    top: 3.75vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec3 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec3-cen {
        width: 91.666666666vw;
    }

    .hw-vision4-all .sec3-title {
        position: relative;
        padding: 0 0 0 9.72222222vw;
    }

    .hw-vision4-all .sec3-title::after {
        content: "";
        height: 12.5vw;
    }

    .hw-vision4-all .sec3-title span {
        font-size: 11.1111111vw;
        background-image: repeating-linear-gradient(134deg, #0c121d 0%, #0c121d 30.05%, #3c5f9d 33%, #0c121d 35.96%, #0c121d 57.64%, #2c4777 65.52%, #0c121d 72.91%, #0c121d 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        text-fill-color: transparent;
        display: inline-block;
        background-size: 100% 100%;
        background-position-x: 0;
    }

    .hw-vision4-all .sec3-icon {
        width: 14.861111111vw;
        position: absolute;
        left: 69.4444444vw;
        top: 8.0555555vw;
    }
}

/* sec4 */
.hw-vision4-all .sec4 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec4-cen {
    width: 81.04166667vw;
    margin: 0 auto;
}

.hw-vision4-all .sec4-img {
    margin: 0 0 3.125vw 0;
    position: relative;
}

.hw-vision4-all .sec4-img p {
    position: absolute;
    right: 1.04166667vw;
    bottom: 1.04166667vw;
    color: #ffffff;
    font-size: 12px;
    line-height: 1.6;
    font-weight: 400;
}

@media screen and (max-width:1920px) {
    .hw-vision4-all .sec4-img p {
        font-size: 0.625vw;
    }
}

.hw-vision4-all .sec4-word {
    width: 69.47916667vw;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.hw-vision4-all .sec4-word h4 {
    width: 35.67708333vw;
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

.hw-vision4-all .sec4-icon {
    width: 27.08333333vw;
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec4-icon li {
    list-style: none;
}

.hw-vision4-all .sec4-icon li img {
    width: 4.16666667vw;
    margin: 0 0 0.83333333vw 0;
}

.hw-vision4-all .sec4-icon li h5 {
    font-weight: 400;
    color: #000000;
    font-size: 1.25vw;
    line-height: 1.6;
    text-align: center;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec4 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec4-cen {
        width: 100%;
    }

    .hw-vision4-all .sec4-img {
        margin: 0 0 11.11111vw 0;
    }

    .hw-vision4-all .sec4-img {
        width: 100%;
        margin: 0 0 11.11111111vw 0;
    }

    .hw-vision4-all .sec4-img p {
        font-size: 1.666666666vw;
        right: 1.3888888vw;
        bottom: 1.3888888vw;
    }

    .hw-vision4-all .sec4-word {
        width: 84.1666666vw;
        display: flex;
        flex-direction: column-reverse;
    }

    .hw-vision4-all .sec4-word h4 {
        width: 100%;
        font-size: 4.444444444vw;
    }

    .hw-vision4-all .sec4-icon {
        width: 100%;
    }

    .hw-vision4-all .sec4-icon li {
        margin: 0 0 11.11111vw 0;
    }

    .hw-vision4-all .sec4-icon li img {
        width: 12.9166666vw;
        margin: 0 0 2.777777vw 0;
    }

    .hw-vision4-all .sec4-icon li h5 {
        font-size: 3.88888888vw;
    }
}

/* sec5 */
.hw-vision4-all .sec5 {
    padding: 0 0 15.625vw 0;
}

.hw-vision4-all .sec5-cen {
    width: 81.04166667vw;
    margin: 0 auto;
}

.hw-vision4-all .sec5-img {
    margin: 0 0 3.125vw 0;
}

.hw-vision4-all .sec5-word {
    width: 69.47916667vw;
    margin: 0 auto 5.20833333vw;
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec5-word h3 {
    width: 30.20833333vw;
    font-weight: 700;
    color: #000000;
    font-size: 3.33333333vw;
    line-height: 1.25;
}

.hw-vision4-all .sec5-word h4 {
    width: 25.15625vw;
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

.hw-vision4-all .sec5-button {
    width: 14.16666667vw;
    padding: 0.625vw 0;
    margin: 0 auto;
    border: 2px solid rgba(0, 0, 0, .1);
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1e2022;
    font-size: 0.9375vw;
    line-height: 1.6;
    font-weight: 400;
    cursor: pointer;
    -webkit-transition: .3s ease-out;
    transition: .3s ease-out
}
@media screen and (min-width:1366px) {
    .hw-vision4-all .sec5-button:hover {
        opacity: .8;
    }
}

.hw-vision4-all .sec5-button img {
    width: 1.66666667vw;
    margin: 0 0 0 0.625vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec5 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec5-cen {
        width: 100%;
    }

    .hw-vision4-all .sec5-img {
        margin: 0 0 11.11111vw 0;
    }

    .hw-vision4-all .sec5-word {
        width: 84.1666666vw;
        flex-direction: column;
        margin: 0 auto 11.11111vw;
    }

    .hw-vision4-all .sec5-word h3 {
        width: 100%;
        font-size: 8.8888888vw;
        margin: 0 0 11.111111vw 0;
    }

    .hw-vision4-all .sec5-word h4 {
        width: 100%;
        font-size: 4.444444444vw;
    }

    .hw-vision4-all .sec5-button {
        width: 37.7777777vw;
        padding: 1.66666666vw 0;
        font-size: 2.5vw;
        cursor: none;
    }

    .hw-vision4-all .sec5-button img {
        width: 4.44444444vw;
        margin: 0 0 0 1.66666666vw;
    }
}

/* sec05-popup */
:root.overflow-hidden {
    overflow: hidden;
}

.overflow-hidden {
    overflow: hidden;
}

.hw-vision4-all .sec05-popup {
    overflow: auto;
    z-index: -1;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: linear-gradient(rgba(50, 50, 50, 0.48), rgba(50, 50, 50, 0.48));
    transform: translateZ(0);
    backdrop-filter: blur(1vw);
    transition: opacity .3s cubic-bezier(0, 0, 0.5, 1);
}

.hw-vision4-all .sec05-popup.active {
    z-index: 999;
    opacity: 1;
}

.hw-vision4-all .sec05-cen {
    width: 69.47916667vw;
    margin: 100px auto 0;
    transform: translateY(100vh);
    transition: transform .3s cubic-bezier(0, 0, 0.5, 1) 0.3s;
    background: #fff;
}

.hw-vision4-all .sec05-popup.active .sec05-cen {
    transform: translateY(0);
    transition: transform .3s cubic-bezier(0, 0, 0.5, 1);
}

.hw-vision4-all .sec05-down {
    width: 2.1875vw;
    position: sticky;
    top: 4.9375vw;
    z-index: 5;
    padding: 1.04166667vw 0 1.97916667vw 0;
    margin: 0 1.04166667vw 0 auto;
    cursor: pointer;
}

.hw-vision4-all .sec05-box {
    width: 60vw;
    padding: 0 0 5.20833333vw;
    margin: 0 auto;
}

.hw-vision4-all .sec05-item1 {
    margin: 0 0 5.20833333vw 0;
}

.hw-vision4-all .sec05-item1-video {
    margin: 0 0 3.125vw 0;
    position: relative;
}

.hw-vision4-all .sec05-item1-video p {
    position: absolute;
    right: 1.04166667vw;
    bottom: 1.04166667vw;
    color: #ffffff;
    font-size: 12px;
    line-height: 1.6;
    font-weight: 400;
}

@media screen and (max-width:1920px) {
    .hw-vision4-all .sec05-item1-video p {
        font-size: 0.625vw;
    }
}

.hw-vision4-all .sec05-item1 h4 {
    width: 46.77083333vw;
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
    margin: 0 auto;
}

.hw-vision4-all .sec05-item2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hw-vision4-all .sec05-item2-video {
    width: 36.45833333vw;
}

.hw-vision4-all .sec05-item2 h4 {
    width: 18.33333333vw;
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec05-cen {
        width: 100%;
        margin: 0 auto 0;
    }

    .hw-vision4-all .sec05-down {
        width: 5.555555555vw;
        position: sticky;
        top: 0;
        z-index: 5;
        padding: 4.16666666vw 0 4.16666666vw 0;
        margin: 0 4.16666666vw 0 auto;
        cursor: none;
    }

    .hw-vision4-all .sec05-box {
        width: 84.16666666vw;
        padding: 0 0 13.8888888vw;
    }

    .hw-vision4-all .sec05-item1 {
        margin: 0 0 13.8888888vw 0;
    }

    .hw-vision4-all .sec05-item1-video {
        margin: 0 0 11.111111vw 0;
    }

    .hw-vision4-all .sec05-item1-video p {
        font-size: 1.666666666vw;
        right: 1.3888888vw;
        bottom: 1.3888888vw;
    }

    .hw-vision4-all .sec05-item1 h4 {
        width: 100%;
        font-size: 4.4444444vw;
    }

    .hw-vision4-all .sec05-item2 {
        display: block;
    }

    .hw-vision4-all .sec05-item2-video {
        width: 100%;
        margin: 0 0 11.111111vw 0;
    }

    .hw-vision4-all .sec05-item2 h4 {
        width: 100%;
        font-size: 4.4444444vw;
    }
}

/* sec6 */
.hw-vision4-all .sec6 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec6-cen {
    width: 51.04166667vw;
    margin: 0 auto;
    position: relative;
}

.hw-vision4-all .sec6-title {
    position: relative;
    padding: 0 0 0 3.4375vw;
}

.hw-vision4-all .sec6-title::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 8.85416667vw;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #d6dff4;
    z-index: -2;
}

.hw-vision4-all .sec6-title span {
    font-weight: 900;
    color: #2c3469;
    font-size: 6.25vw;
    line-height: 1.25;
    background-image: repeating-linear-gradient(105deg, #0c121d 0%, #0c121d 21%, #446eb7 27%, #0c121d 32%, #0c121d 65%, #365793 71%, #0c121d 76%, #0c121d 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    display: inline-block;
    background-size: 100% 100%;
    background-position-x: 0;
}

.hw-vision4-all .sec6-icon {
    width: 6.875vw;
    position: absolute;
    left: 27.08333vw;
    top: 6.5625vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec6 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec6-cen {
        width: 91.666666666vw;
    }

    .hw-vision4-all .sec6-title {
        position: relative;
        padding: 0 0 0 9.72222222vw;
    }

    .hw-vision4-all .sec6-title::after {
        content: "";
        height: 12.5vw;
    }

    .hw-vision4-all .sec6-title span {
        font-size: 11.1111111vw;
        background-image: repeating-linear-gradient(134deg, #0c121d 0%, #0c121d 30.05%, #3c5f9d 33%, #0c121d 35.96%, #0c121d 57.64%, #2c4777 65.52%, #0c121d 72.91%, #0c121d 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        text-fill-color: transparent;
        display: inline-block;
        background-size: 100% 100%;
        background-position-x: 0;
    }

    .hw-vision4-all .sec6-icon {
        width: 12.63888888vw;
        position: absolute;
        left: 52.0833333vw;
        top: 10.83333333vw;
    }
}

/* sec7 */
.hw-vision4-all .sec7 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec7-word {
    width: 38.02083333vw;
    margin: 0 auto;
}

.hw-vision4-all .sec7-word h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
    text-align: center;
    padding: 3.125vw 0 0 0;
}

.hw-vision4-all .sec7-img {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.hw-vision4-all .sec7-bag,
.hw-vision4-all .sec7-bag picture {
    width: 100%;
    height: 100vh;
}

.hw-vision4-all .sec7-bag img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hw-vision4-all .sec7-img-cen {
    width: 72.55208333vw;
    position: absolute;
    left: 6.97916667vw;
    bottom: 46.5%;
    transform: translateY(50%);
}

.hw-vision4-all .sec7-screen {
    width: 100%;
}

.hw-vision4-all .sec7-people {
    width: 44.32291667vw;
    position: absolute;
    left: 41.25vw;
    bottom: 0;
}

.hw-vision4-all .sec7-tip {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.hw-vision4-all .sec7-line {
    position: absolute;
    height: 0.26041667vw;
    background: #fff;
    transform: rotate(151deg);
    transform-origin: left;
}

.hw-vision4-all .sec7-line1 {
    left: 41.2%;
    top: 46.6%;
    width: 42.8%;
}

.hw-vision4-all .sec7-line2 {
    right: -26.6%;
    top: 2.1%;
    width: 38%;
}

.hw-vision4-all .sec7-tip-text {
    font-weight: 700;
    color: #ffffff;
    font-size: 2.55208333vw;
    line-height: 1.25;
    position: absolute;
    left: 42%;
    top: 30%;
    text-align: center;
}

.hw-vision4-all .sec7-tip-text p {
    font-size: 3.90625vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec7 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec7-word {
        width: 85.4166666vw;
    }

    .hw-vision4-all .sec7-word h4 {
        font-size: 4.444444444vw;
        padding: 11.111111vw 0 0 0;
        text-align: left;
    }

    .hw-vision4-all .sec7-bag,
    .hw-vision4-all .sec7-bag picture {
        width: 100%;
        height: auto;
    }

    .hw-vision4-all .sec7-img-cen {
        width: 107.22222222vw;
        position: absolute;
        left: 0;
        bottom: 4.1666666vw;
        transform: translateY(0);
    }

    .hw-vision4-all .sec7-screen {
        width: 100%;
    }

    .hw-vision4-all .sec7-line {
        height: 0.694444444vw;
    }

    .hw-vision4-all .sec7-line1 {
        left: 41.2%;
        top: 45.5%;
        width: 42.8%;
    }

    .hw-vision4-all .sec7-tip-text {
        font-size: 3.61111vw;
        position: absolute;
        left: 42.8%;
        top: 32%;
        opacity: 1;
    }

    .hw-vision4-all .sec7-tip-text p {
        font-size: 5.41666666vw;
    }
}

/* sec8 */
.hw-vision4-all .sec8 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec8-cne {
    width: 81.04166667vw;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hw-vision4-all .sec8-img {
    width: 50vw;
}

.hw-vision4-all .sec8-work {
    width: 21.66666667vw;
}

.hw-vision4-all .sec8-work h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec8 {
        padding: 0 0 27.777777vw 0;
    }

    .hw-vision4-all .sec8-cne {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }

    .hw-vision4-all .sec8-img {
        width: 100%;
    }

    .hw-vision4-all .sec8-work {
        width: 84.16666666vw;
        padding: 11.111111vw 0 0 0;
    }

    .hw-vision4-all .sec8-work h4 {
        font-size: 4.44444444vw;
    }
}

/* sec9 */
.hw-vision4-all .sec9 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec9-cne {
    width: 81.04166667vw;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: center;
}

.hw-vision4-all .sec9-img {
    width: 50vw;
}

.hw-vision4-all .sec9-work {
    width: 25.26041667vw;
}

.hw-vision4-all .sec9-work h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec9 {
        padding: 0 0 27.777777vw 0;
    }

    .hw-vision4-all .sec9-cne {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }

    .hw-vision4-all .sec9-img {
        width: 100%;
    }

    .hw-vision4-all .sec9-work {
        width: 84.16666666vw;
        padding: 11.111111vw 0 0 0;
    }

    .hw-vision4-all .sec9-work h4 {
        font-size: 4.44444444vw;
    }
}

/* .sec10 */
.hw-vision4-all .sec10 {
    padding: 0 0 15.625vw 0;
    overflow: hidden;
}

.hw-vision4-all .sec10-cen {
    width: 86.45833333vw;
    margin: 0 0 0 9.03645833vw;
}

.hw-vision4-all .sec10-top {
    width: 86.45833333vw;
    display: flex;
    justify-content: space-between;
    margin: 0 0 1.97916667vw;
}

.hw-vision4-all .sec10-work {
    width: 28.02083333vw;
    padding: 5.20833333vw 0 0;
    flex-shrink: 0;
    transform: translateY(10vw);
}

.hw-vision4-all .sec10-work h3 {
    width: 100%;
    font-weight: 700;
    color: #000000;
    font-size: 3.33333333vw;
    line-height: 1.25;
    padding: 0 0 3.125vw 0;
}

.hw-vision4-all .sec10-work h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

.hw-vision4-all .sec10-work h4 p+p {
    margin: 2.08333333vw 0 0;
}

.hw-vision4-all .sec10-top.active .sec10-work {
    transform: translateY(0);
    transition: transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
}

.hw-vision4-all .sec10-icon {
    width: 54.79166667vw;
    display: flex;
    flex-shrink: 0;
    position: relative;
}

.hw-vision4-all .sec10-bag {
    width: 57.60416667vw;
    position: absolute;
    left: -0.52083333vw;
    top: 50%;
    transform: translate(0%, -50%);
    z-index: -1;
    opacity: 0;
    transition: opacity .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
}

.hw-vision4-all .sec10-icon-li {
    width: 29.375vw;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: translateX(10vw);
    transition: transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
}

.hw-vision4-all .sec10-icon-li2 {
    margin: 0 0 0 -3.95833333vw;
    transform: translateX(-10vw);
}

.hw-vision4-all .sec10-top.active .sec10-bag {
    opacity: 1;
}

.hw-vision4-all .sec10-top.active .sec10-icon-li {
    transform: translateX(0);
}

.hw-vision4-all .sec10-icon-text {
    position: absolute;
    text-align: center;
}

.hw-vision4-all .sec10-icon-text p:nth-of-type(1) {
    font-size: 6.25vw;
    color: #FFFFFF;
    font-weight: 500;
    line-height: 1.25;
}

.hw-vision4-all .sec10-icon-text p:nth-of-type(1) span {
    background: linear-gradient(244.2deg, #ffffff 0%, #ffffff 65.55%, #cccccc 77.25%, #808080 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    display: inline-block;
}

.hw-vision4-all .sec10-icon-text p:nth-of-type(2) {
    font-size: 2.60416667vw;
    color: #FFFFFF;
    font-weight: 500;
    line-height: 1.6;
}

.hw-vision4-all .sec10-icon-text p:nth-of-type(2) span {
    background: linear-gradient(221.15deg, #ffffff 0%, #ffffff 65.55%, #cccccc 77.25%, #808080 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    display: inline-block;
}

.hw-vision4-all .sec10-ul {
    width: 81.04166667vw;
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec10-li {
    flex: 1;
    background: #f2f6ff;
    padding: 1.5625vw 0 1.82291667vw;
    position: relative;
    cursor: pointer;
}

.hw-vision4-all .sec10-li+.sec10-li {
    margin: 0 0 0 1.45833333vw;
}

.hw-vision4-all .sec10-li-icon {
    width: 4.16666667vw;
    height: 3.64583333vw;
    margin: 0 auto 1.5625vw;
    display: flex;
    align-items: center;
}

.hw-vision4-all .sec10-li-one p {
    font-weight: 700;
    color: #211d1e;
    font-size: 1.66666667vw;
    line-height: 1.25;
    text-align: center;
}

.hw-vision4-all .sec10-li-two {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #f2f6ff;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    z-index: -1;
    transition: all 0.2s ease;
}

.hw-vision4-all .sec10-li-two p {
    width: 20.83333333vw;
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
    transform: translateY(2.60416667vw);
    opacity: 0;
    transition: all 0.5s ease;
}

.hw-vision4-all .sec10-btn {
    width: 2.1875vw;
    position: absolute;
    right: 1.04166667vw;
    top: 1.04166667vw;
    z-index: 10;
}

.hw-vision4-all .sec10-btn img:nth-of-type(2) {
    display: none;
}

.hw-vision4-all .sec10-li.active .sec10-btn img:nth-of-type(1) {
    display: none;
}

.hw-vision4-all .sec10-li.active .sec10-btn img:nth-of-type(2) {
    display: block;
}

.hw-vision4-all .sec10-li.active .sec10-li-two {
    opacity: 1;
    z-index: 10;
}

.hw-vision4-all .sec10-li.active .sec10-li-two p {
    opacity: 1;
    transform: translateY(0);
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec10 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec10-cen {
        width: 100%;
        margin: 0 auto;
    }

    .hw-vision4-all .sec10-top {
        width: 100%;
        display: block;
        margin: 0 0 3.8888888vw;
    }

    .hw-vision4-all .sec10-work {
        width: 84.16666666vw;
        padding: 0 0 3.8888888vw 0;
        margin: 0 auto;
        transform: translateY(0);
    }

    .hw-vision4-all .sec10-work h3 {
        width: 100%;
        font-size: 8.88888888vw;
        padding: 0 0 11.1111111vw 0;
    }

    .hw-vision4-all .sec10-work h4 {
        font-size: 4.44444444vw;
    }

    .hw-vision4-all .sec10-work h4 p+p {
        margin: 8.333333333vw 0 0;
    }

    .hw-vision4-all .sec10-icon {
        width: 104.1666666vw;
        display: flex;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
    }

    .hw-vision4-all .sec10-bag {
        width: 109.7222222vw;
        position: absolute;
        left: -1.11111111vw;
        top: 50%;
        transform: translate(0%, -50%);
        z-index: -1;
        opacity: 1;
    }

    .hw-vision4-all .sec10-icon-li {
        width: 55.83333333vw;
        flex-shrink: 0;
        transform: translateX(0);
    }

    .hw-vision4-all .sec10-icon-li2 {
        margin: 0 0 0 -7.5vw;
    }

    .hw-vision4-all .sec10-icon-text {
        position: absolute;
        text-align: center;
    }

    .hw-vision4-all .sec10-icon-text p:nth-of-type(1) {
        font-size: 16.666666vw;
    }

    .hw-vision4-all .sec10-icon-text p:nth-of-type(2) {
        font-size: 6.9444444vw;
    }

    .hw-vision4-all .sec10-ul {
        width: 93.055555555vw;
        margin: 0 auto;
        display: block;
    }

    .hw-vision4-all .sec10-li {
        background: #f2f6ff;
        padding: 11.9444444vw 0;
        position: relative;
        cursor: none;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .hw-vision4-all .sec10-li+.sec10-li {
        margin: 6.944444444vw 0 0;
    }

    .hw-vision4-all .sec10-li-icon {
        width: 11.111111111vw;
        height: auto;
        margin: 0 9.722222222vw 0 0;
    }

    .hw-vision4-all .sec10-li-one {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .hw-vision4-all .sec10-li-one p {
        width: 56.25vw;
        font-weight: 500;
        font-size: 6.6666666666vw;
        color: #000;
        text-align: left;
    }

    .hw-vision4-all .sec10-li-two p {
        width: 79.86111111vw;
        font-size: 3.88888888vw;
    }

    .hw-vision4-all .sec10-btn {
        width: 5.83333333vw;
        position: absolute;
        right: 4.1666666vw;
        top: 4.1666666vw;
    }
}


/* sec11 */
.hw-vision4-all .sec11 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec11-cen {
    width: 51.04166667vw;
    margin: 0 auto;
    position: relative;
}

.hw-vision4-all .sec11-tip {
    font-weight: 900;
    color: #000000;
    font-size: 2.23958333vw;
    line-height: 1.6;
    padding: 0 0 0 3.4375vw;
    display: flex;
    align-items: center;
}

.hw-vision4-all .sec11-tip img {
    width: 3.54166667vw;
    margin: 0 0.52083333vw 0 0;
}

.hw-vision4-all .sec11-title {
    position: relative;
    padding: 0 0 0 3.4375vw;
}

.hw-vision4-all .sec11-title::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 8.85416667vw;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #d6dff4;
    z-index: -2;
}

.hw-vision4-all .sec11-title span {
    font-weight: 900;
    color: #2c3469;
    font-size: 6.25vw;
    line-height: 1.25;
    background-image: repeating-linear-gradient(105deg, #0c121d 0%, #0c121d 21%, #446eb7 27%, #0c121d 32%, #0c121d 65%, #365793 71%, #0c121d 76%, #0c121d 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    display: inline-block;
    background-size: 100% 100%;
    background-position-x: 0;
}

.hw-vision4-all .sec11-icon {
    width: 7.34375vw;
    position: absolute;
    left: 27.29166667vw;
    top: 2.0833333vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec11 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec11-cen {
        width: 91.666666666vw;
    }

    .hw-vision4-all .sec11-tip {
        font-size: 3.6111111111vw;
        padding: 0 0 0 9.72222222vw;
    }

    .hw-vision4-all .sec11-tip img {
        width: 5.8333333vw;
        margin: 0 1vw 0 0;
    }

    .hw-vision4-all .sec11-title {
        position: relative;
        padding: 0 0 0 9.72222222vw;
    }

    .hw-vision4-all .sec11-title::after {
        content: "";
        height: 12.5vw;
    }

    .hw-vision4-all .sec11-title span {
        font-size: 11.1111111vw;
        background-image: repeating-linear-gradient(134deg, #0c121d 0%, #0c121d 30.05%, #3c5f9d 33%, #0c121d 35.96%, #0c121d 57.64%, #2c4777 65.52%, #0c121d 72.91%, #0c121d 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        text-fill-color: transparent;
        display: inline-block;
        background-size: 100% 100%;
        background-position-x: 0;
    }

    .hw-vision4-all .sec11-icon {
        width: 12.222222vw;
        position: absolute;
        left: 51.3888888vw;
        top: 4.166666666vw;
    }
}

/* sec12- */
.hw-vision4-all .sec12 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec12-work {
    width: 41.66666667vw;
    margin: 0 auto;
    padding: 0 0 4.16666667vw 0;
    text-align: center;
}

.hw-vision4-all .sec12-work h3 {
    font-weight: 700;
    color: #000000;
    font-size: 3.33333333vw;
    line-height: 1.25;
    padding: 0 0 1.5625vw 0;
}

.hw-vision4-all .sec12-work h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

.hw-vision4-all .sec12-video {
    width: 100%;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec12 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec12-work {
        width: 84.166666666vw;
        padding: 0 0 11.1111111vw 0;
        text-align: left;
    }

    .hw-vision4-all .sec12-work h3 {
        font-size: 8.88888888vw;
        padding: 0 0 5.5555555vw 0;
    }

    .hw-vision4-all .sec12-work h4 {
        font-size: 4.44444444vw;
    }
}

/* sec13- */
.hw-vision4-all .sec13 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec13-cen {
    width: 90.078125vw;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
}

.hw-vision4-all .sec13-work {
    width: 22.91666667vw;
    text-align: left;
}

.hw-vision4-all .sec13-work h3 {
    font-weight: 700;
    color: #000000;
    font-size: 3.33333333vw;
    line-height: 1.25;
    padding: 0 0 1.5625vw 0;
}

.hw-vision4-all .sec13-work h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

.hw-vision4-all .sec13-video {
    width: 59.47916667vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec13 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec13-cen {
        width: 100%;
        display: block;
    }

    .hw-vision4-all .sec13-work {
        width: 84.166666666vw;
        padding: 0 0 11.1111111vw 0;
        margin: 0 auto;
    }

    .hw-vision4-all .sec13-work h3 {
        font-size: 8.88888888vw;
        padding: 0 0 5.5555555vw 0;
    }

    .hw-vision4-all .sec13-work h4 {
        font-size: 4.44444444vw;
    }

    .hw-vision4-all .sec13-video {
        width: 100%;
    }
}

/* sec14- */
.hw-vision4-all .sec14 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec14-cen {
    width: 81.04166667vw;
    margin: 0 auto;
}

.hw-vision4-all .sec14-work {
    display: flex;
    justify-content: space-between;
    padding: 0 0 4.16666667vw 0;
}

.hw-vision4-all .sec14-work h3 {
    width: 25vw;
    font-weight: 700;
    color: #000000;
    font-size: 3.33333333vw;
    line-height: 1.25;
}

.hw-vision4-all .sec14-work h4 {
    width: 35.9375vw;
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec14 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec14-cen {
        width: 100%;
    }

    .hw-vision4-all .sec14-work {
        width: 84.166666666vw;
        padding: 0 0 11.1111111vw 0;
        margin: 0 auto;
        display: block;
    }

    .hw-vision4-all .sec14-work h3 {
        width: 100%;
        font-size: 8.88888888vw;
        padding: 0 0 5.5555555vw 0;
    }

    .hw-vision4-all .sec14-work h4 {
        width: 100%;
        font-size: 4.44444444vw;
    }
}

/* sec15- */
.hw-vision4-all .sec15 {
    padding: 0 0 15.625vw 0;
}

.hw-vision4-all .sec15-cen {
    width: 90.72916667vw;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 0 auto;
}

.hw-vision4-all .sec15-work {
    width: 26.5625vw;
    text-align: left;
}

.hw-vision4-all .sec15-work h3 {
    font-weight: 700;
    color: #000000;
    font-size: 3.33333333vw;
    line-height: 1.25;
    padding: 0 0 1.5625vw 0;
}

.hw-vision4-all .sec15-work h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

.hw-vision4-all .sec15-video {
    width: 59.47916667vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec15 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec15-cen {
        width: 100%;
        display: block;
    }

    .hw-vision4-all .sec15-work {
        width: 84.166666666vw;
        padding: 0 0 11.1111111vw 0;
        margin: 0 auto;
    }

    .hw-vision4-all .sec15-work h3 {
        font-size: 8.88888888vw;
        padding: 0 0 5.5555555vw 0;
    }

    .hw-vision4-all .sec15-work h4 {
        font-size: 4.44444444vw;
    }

    .hw-vision4-all .sec15-video {
        width: 100%;
    }
}

/* sec16 */
.hw-vision4-all .sec16 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec16-cen {
    width: 51.04166667vw;
    margin: 0 auto;
    position: relative;
}

.hw-vision4-all .sec16-title {
    position: relative;
    padding: 0 0 0 3.4375vw;
}

.hw-vision4-all .sec16-title::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 8.85416667vw;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #d6dff4;
    z-index: -2;
}

.hw-vision4-all .sec16-title span {
    font-weight: 900;
    color: #2c3469;
    font-size: 6.25vw;
    line-height: 1.25;
    background-image: repeating-linear-gradient(105deg, #0c121d 0%, #0c121d 21%, #446eb7 27%, #0c121d 32%, #0c121d 65%, #365793 71%, #0c121d 76%, #0c121d 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    display: inline-block;
    background-size: 100% 100%;
    background-position-x: 0;
}

.hw-vision4-all .sec16-icon {
    width: 6.92708333vw;
    position: absolute;
    left: 27.29166667vw;
    top: 2.0833333vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec16 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec16-cen {
        width: 91.666666666vw;
    }

    .hw-vision4-all .sec16-title {
        position: relative;
        padding: 0 0 0 9.72222222vw;
    }

    .hw-vision4-all .sec16-title::after {
        content: "";
        height: 12.5vw;
    }

    .hw-vision4-all .sec16-title span {
        font-size: 11.1111111vw;
        background-image: repeating-linear-gradient(134deg, #0c121d 0%, #0c121d 30.05%, #3c5f9d 33%, #0c121d 35.96%, #0c121d 57.64%, #2c4777 65.52%, #0c121d 72.91%, #0c121d 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        text-fill-color: transparent;
        display: inline-block;
        background-size: 100% 100%;
        background-position-x: 0;
    }

    .hw-vision4-all .sec16-icon {
        width: 12.5vw;
        position: absolute;
        left: 52.77777777vw;
        top: 3.472222222vw;
    }
}

/* sec17 */
.hw-vision4-all .sec17 {
    padding: 0;
}

.hw-vision4-all .sec17-cen {
    position: relative;
}

.hw-vision4-all .sec17-ul {
    width: 23.95833333vw;
    position: absolute;
    left: 66.5625vw;
    top: 9.21875vw;
}

.hw-vision4-all .sec17-li {
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec17-li+.sec17-li {
    margin-top: 4.16666667vw;
}

.hw-vision4-all .sec17-icon {
    width: 4.16666667vw;
}

.hw-vision4-all .sec17-work {
    width: 18.22916667vw;
}

.hw-vision4-all .sec17-work h3 {
    font-weight: 700;
    color: #000000;
    font-size: 1.66666667vw;
    line-height: 1.25;
    margin: 0 0 1.04166667vw 0;
}

.hw-vision4-all .sec17-work h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec17 {
        padding: 0 0 27.77777vw 0;
    }

    .hw-vision4-all .sec17-ul {
        width: 84.722222vw;
        position: relative;
        left: 8.33333333333vw;
        top: 0;
        margin: -15.833333333vw 0 0;
    }

    .hw-vision4-all .sec17-li+.sec17-li {
        margin-top: 13.888888vw;
    }

    .hw-vision4-all .sec17-icon {
        width: 11.11111111vw;
    }

    .hw-vision4-all .sec17-work {
        width: 70.83333333vw;
    }

    .hw-vision4-all .sec17-work h3 {
        font-weight: 500;
        font-size: 6.6666666vw;
        margin: 0 0 4.166666666vw 0;
    }

    .hw-vision4-all .sec17-work h4 {
        font-size: 4.4444444vw;
    }
}

/* sec18 */
.hw-vision4-all .sec18 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec18-cen {
    width: 57.29166667vw;
    margin: 0 auto;
    position: relative;
}

.hw-vision4-all .sec18-title {
    position: relative;
    padding: 0 0 0 3.4375vw;
}

.hw-vision4-all .sec18-title::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 8.85416667vw;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #d6dff4;
    z-index: -2;
}

.hw-vision4-all .sec18-title span {
    font-weight: 900;
    color: #2c3469;
    font-size: 6.25vw;
    line-height: 1.25;
    background-image: repeating-linear-gradient(105deg, #0c121d 0%, #0c121d 21%, #446eb7 27%, #0c121d 32%, #0c121d 65%, #365793 71%, #0c121d 76%, #0c121d 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    display: inline-block;
    background-size: 100% 100%;
    background-position-x: 0;
}

.hw-vision4-all .sec18-icon {
    width: 7.8125vw;
    position: absolute;
    left: 27.0833333vw;
    top: 2.083333333vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec18 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec18-cen {
        width: 91.666666666vw;
    }

    .hw-vision4-all .sec18-title {
        position: relative;
        padding: 0 0 0 9.72222222vw;
    }

    .hw-vision4-all .sec18-title::after {
        content: "";
        height: 12.5vw;
    }

    .hw-vision4-all .sec18-title span {
        font-size: 11.1111111vw;
        background-image: repeating-linear-gradient(134deg, #0c121d 0%, #0c121d 30.05%, #3c5f9d 33%, #0c121d 35.96%, #0c121d 57.64%, #2c4777 65.52%, #0c121d 72.91%, #0c121d 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        text-fill-color: transparent;
        display: inline-block;
        background-size: 100% 100%;
        background-position-x: 0;
    }

    .hw-vision4-all .sec18-icon {
        width: 11.38888888vw;
        position: absolute;
        left: 52.77777777vw;
        top: 6.25vw;
    }
}

/* sec19 */
.hw-vision4-all .sec19 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec19-tip {
    width: 36.45833333vw;
    text-align: center;
    margin: 0 auto 4.16666667vw;
}

.hw-vision4-all .sec19-tip h3 {
    font-weight: 700;
    color: #000;
    font-size: 3.33333333vw;
    line-height: 1.25;
}

.hw-vision4-all .sec19-img {
    width: 75.3125vw;
    margin: 0 auto 3.125vw;
}

.hw-vision4-all .sec19-ul {
    width: 81.77083333vw;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec19-li {
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec19-li .sec19-icon {
    width: 5.46875vw;
}

.hw-vision4-all .sec19-li2 .sec19-icon {
    width: 4.16666667vw;
}

.hw-vision4-all .sec19-li .sec19-work {
    width: 16.14583333vw;
    margin: 0 0 0 1.5625vw;
}

.hw-vision4-all .sec19-li2 .sec19-work {
    width: 17.96875vw;
}

.hw-vision4-all .sec19-li3 .sec19-work {
    width: 16.66666667vw;
}

.hw-vision4-all .sec19-li .sec19-work h3 {
    font-weight: 700;
    color: #000000;
    font-size: 1.66666667vw;
    line-height: 1.25;
    margin: 0 0 1.04166667vw 0;
}

.hw-vision4-all .sec19-li .sec19-work h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec19 {
        padding: 0 0 27.777777vw 0;
    }

    .hw-vision4-all .sec19-tip {
        width: 69.44444444vw;
        margin: 0 auto 11.1111111vw;
    }

    .hw-vision4-all .sec19-tip h3 {
        font-size: 8.888888vw;
    }

    .hw-vision4-all .sec19-img {
        width: 86.1111111vw;
        margin: 0 auto 11.1111111vw;
    }

    .hw-vision4-all .sec19-ul {
        width: 88.8888888vw;
        display: block;
        margin: 0 0 0 5.27777777vw;
    }

    .hw-vision4-all .sec19-li {
        width: 100%;
    }

    .hw-vision4-all .sec19-li+.sec19-li {
        margin-top: 13.88888888vw;
    }

    .hw-vision4-all .sec19-li .sec19-icon {
        width: 14.583333333vw;
    }

    .hw-vision4-all .sec19-li2 .sec19-icon {
        width: 11.111111vw;
        margin: 0 auto;
    }

    .hw-vision4-all .sec19-li .sec19-work {
        width: 71.3888888vw;
        margin: 0 0 0 2.777777vw;
    }

    .hw-vision4-all .sec19-li2 .sec19-work {
        width: 71.3888888vw;
    }

    .hw-vision4-all .sec19-li3 .sec19-work {
        width: 71.3888888vw;
    }

    .hw-vision4-all .sec19-li .sec19-work h3 {
        font-weight: 500;
        font-size: 6.6666666vw;
        margin: 0 0 4.16666666vw 0;
    }

    .hw-vision4-all .sec19-li .sec19-work h4 {
        font-size: 4.4444444vw;
    }
}

/* sec20 */
.hw-vision4-all .sec20 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec20-tip {
    width: 30vw;
    text-align: center;
    margin: 0 auto 4.16666667vw;
}

.hw-vision4-all .sec20-tip h3 {
    font-weight: 700;
    color: #000;
    font-size: 3.33333333vw;
    line-height: 1.25;
}

.hw-vision4-all .sec20-cne {
    width: 81.14583333vw;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec20-img {
    width: 53.75vw;
    position: relative;
}

.hw-vision4-all .sec20-img p {
    position: absolute;
    right: 0.52083333vw;
    bottom: 0.52083333vw;
    color: #ffffff;
    font-size: 12px;
    line-height: 1.6;
    font-weight: 400;
}

@media screen and (max-width:1920px) {
    .hw-vision4-all .sec20-img p {
        font-size: 0.625vw;
    }
}

.hw-vision4-all .sec20-ul {
    width: 26.45833333vw;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.hw-vision4-all .sec20-li {
    height: 11.97916667vw;
    padding: 0 2.08333333vw 0 2.60416667vw;
    background: #f2f6ff;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hw-vision4-all .sec20-li1 {
    height: 13.80208333vw;
}

.hw-vision4-all .sec20-icon {
    width: 4.16666667vw;
}

.hw-vision4-all .sec20-li1 .sec20-icon {
    margin: 3.90625vw 0 auto;
}

.hw-vision4-all .sec20-li .sec20-work {
    width: 15.05208333vw;
}

.hw-vision4-all .sec20-li .sec20-work h3 {
    font-weight: 700;
    color: #000000;
    font-size: 1.66666667vw;
    line-height: 1.25;
    margin: 0 0 1.04166667vw 0;
}

.hw-vision4-all .sec20-li .sec20-work h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec20 {
        padding: 0 0 27.777777vw 0;
    }

    .hw-vision4-all .sec20-tip {
        width: 75vw;
        margin: 0 auto 11.1111111vw;
    }

    .hw-vision4-all .sec20-tip h3 {
        font-size: 8.888888vw;
    }

    .hw-vision4-all .sec20-cne {
        width: 100%;
        display: block;
    }

    .hw-vision4-all .sec20-img {
        width: 100%;
        margin: 0 0 11.11111111vw 0;
    }

    .hw-vision4-all .sec20-img p {
        font-size: 1.666666666vw;
        right: 1.3888888vw;
        bottom: 1.3888888vw;
    }

    .hw-vision4-all .sec20-ul {
        width: 93.055555vw;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .hw-vision4-all .sec20-li {
        height: auto;
        padding: 11.111111vw 4.44444444vw;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
    }

    .hw-vision4-all .sec20-li+.sec20-li {
        margin-top: 6.944444444vw;
    }

    .hw-vision4-all .sec20-icon {
        width: 11.111111vw;
    }

    .hw-vision4-all .sec20-li1 .sec20-icon {
        margin: 0;
    }

    .hw-vision4-all .sec20-li .sec20-work {
        width: 69.4444444vw;
    }

    .hw-vision4-all .sec20-li .sec20-work h3 {
        font-weight: 500;
        font-size: 6.6666666vw;
        margin: 0 0 4.16666666vw 0;
    }

    .hw-vision4-all .sec20-li .sec20-work h4 {
        font-size: 4.4444444vw;
        font-weight: 500;
    }
}

/* sec21 */
.hw-vision4-all .sec21 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec21-tip {
    width: 26.04166667vw;
    text-align: center;
    margin: 0 auto 4.16666667vw;
}

.hw-vision4-all .sec21-tip h3 {
    font-weight: 700;
    color: #000;
    font-size: 3.33333333vw;
    line-height: 1.25;
}

.hw-vision4-all .sec21-cen {
    width: 81.04166667vw;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec21-left {
    width: 30.78125vw;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.hw-vision4-all .sec21-right {
    width: 49.16666667vw;
}

.hw-vision4-all .sec21-item {
    background: #f2f6ff;
    flex: 1;
}

.hw-vision4-all .sec21-item .sec21-work {
    width: 26.30208333vw;
}

.hw-vision4-all .sec21-item .sec21-work h3 {
    font-weight: 700;
    color: #000000;
    font-size: 1.66666667vw;
    line-height: 1.25;
    margin: 0 0 1.04166667vw 0;
}

.hw-vision4-all .sec21-item .sec21-work h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

.hw-vision4-all .sec21-item1 {
    padding: 2.60416667vw 1.875vw 0 2.60416667vw;
}

.hw-vision4-all .sec21-item1 .sec21-icon {
    width: 21.71875vw;
    margin: 1.82291667vw 0 0 1.92708333vw;
    position: relative;
}

.hw-vision4-all .sec21-item1 .sec21-icon-text {
    position: absolute;
    left: 7.29166667vw;
    top: 3.33333333vw;
    font-size: 1.04166667vw;
    color: #fff;
    line-height: 1.6;
    font-weight: 400;
}

.hw-vision4-all .sec21-item2 {
    padding: 2.60416667vw 1.875vw 0 2.60416667vw;
    margin: 1.04166667vw 0 0;
}

.hw-vision4-all .sec21-item2 .sec21-icon {
    display: flex;
    align-items: center;
    margin: 2.86458333vw 0 0 2.96875vw;
}

.hw-vision4-all .sec21-item2 .sec21-icon img {
    width: 4.63541667vw;
    margin: 0 1.04166667vw 0 0;
}

.hw-vision4-all .sec21-item2 .sec21-icon-text {
    font-size: 1.14583333vw;
    color: #000;
    font-weight: 700;
    line-height: 1.6;
}

.hw-vision4-all .sec21-item2 .sec21-icon-text p+p {
    margin: 0.52083333vw 0 0;
}

@media screen and (min-width:1440px) {
    .hw-vision4-all .sec21-li p {
        font-size: 0.83333333vw;
    }
}

.hw-vision4-all .sec21-item3 {
    padding: 2.60416667vw 2.60416667vw 7.1875vw 2.60416667vw;
}

.hw-vision4-all .sec21-item3 .sec21-work {
    width: 40.26041667vw;
}

.hw-vision4-all .sec21-item3 .sec21-icon {
    width: 39.6875vw;
    margin: 4.6875vw auto 0;
}

.hw-vision4-all .sec21-btn {
    width: 81.04166667vw;
    margin: 0 auto;
    padding: 1.04166667vw 1.04166667vw 0 0;
    color: #000000;
    font-size: 12px;
    line-height: 1.6;
    font-weight: 400;
    text-align: right;
}

@media screen and (min-width:1920px) {
    .hw-vision4-all .sec21-btn {
        font-size: 0.625vw;
    }
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec21 {
        padding: 0 0 27.777777vw 0;
    }

    .hw-vision4-all .sec21-tip {
        width: 69.44444444vw;
        margin: 0 auto 11.1111111vw;
    }

    .hw-vision4-all .sec21-tip h3 {
        font-size: 8.888888vw;
    }

    .hw-vision4-all .sec21-cen {
        width: 100%;
        flex-direction: column-reverse;
    }

    .hw-vision4-all .sec21-left {
        width: 100%;
        display: block;
    }

    .hw-vision4-all .sec21-right {
        width: 100%;
    }

    .hw-vision4-all .sec21-item .sec21-work {
        width: 84.7222222vw;
    }

    .hw-vision4-all .sec21-item .sec21-work h3 {
        font-weight: 500;
        font-size: 6.6666666vw;
        margin: 0 0 4.16666666vw 0;
    }

    .hw-vision4-all .sec21-item .sec21-work h4 {
        font-size: 4.444444444vw;
        font-weight: 500;
    }

    .hw-vision4-all .sec21-item1 {
        padding: 11.111111vw 0 11.11111111vw 7.91666666vw;
        margin: 6.9444444vw 0 0;
    }

    .hw-vision4-all .sec21-item1 .sec21-icon {
        width: 70.83333333vw;
        margin: 11.1111111vw 0 0 6.944444vw;
    }

    .hw-vision4-all .sec21-item1 .sec21-icon-text {
        left: 27.5vw;
        top: 11.805555vw;
        font-size: 2.91666666666vw;
    }

    .hw-vision4-all .sec21-item2 {
        padding: 11.111111vw 0 11.11111111vw 7.91666666vw;
        margin: 6.9444444vw 0 0;
    }

    .hw-vision4-all .sec21-item2 .sec21-icon {
        margin: 11.1111111vw 0 0 10.555555vw;
    }

    .hw-vision4-all .sec21-item2 .sec21-icon img {
        width: 16.9444444vw;
        margin: 0 4.166666666vw 0 0;
    }

    .hw-vision4-all .sec21-item2 .sec21-icon-text {
        font-size: 3.47222222vw;
    }

    .hw-vision4-all .sec21-item2 .sec21-icon-text p+p {
        margin: 2.2222222vw 0 0;
    }

    .hw-vision4-all .sec21-item3 {
        padding: 11.111111vw 0 16.6666666666vw 7.91666666vw;
        position: relative;
    }

    .hw-vision4-all .sec21-item3 .sec21-work {
        width: 84.7222222vw;
    }

    .hw-vision4-all .sec21-item3 .sec21-icon {
        width: 84.16666666vw;
        margin: 11.1111111vw 0 0;
    }

    .hw-vision4-all .sec21-btn {
        width: 83.33333333vw;
        padding: 2.77777vw 0 0;
        font-size: 2.5VW;
        text-align: left;
    }
}

/* sec22 */
.hw-vision4-all .sec22 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec22-tip {
    width: 26.04166667vw;
    text-align: center;
    margin: 0 auto 4.16666667vw;
}

.hw-vision4-all .sec22-tip h3 {
    font-weight: 700;
    color: #000;
    font-size: 3.33333333vw;
    line-height: 1.25;
}

.hw-vision4-all .sec22-cne {
    width: 81.04166667vw;
    margin: 0 auto;
    overflow: hidden;
}

.hw-vision4-all .sec22-swiper {
    width: 100%;
    overflow: hidden;
}

.hw-vision4-all .sec22-swiper .sec22-img {
    position: relative;
}

.hw-vision4-all .sec22-img p {
    position: absolute;
    right: 1.04166667vw;
    bottom: 1.04166667vw;
    color: #ffffff;
    font-size: 12px;
    line-height: 1.6;
    font-weight: 400;
}

@media screen and (max-width:1920px) {
    .hw-vision4-all .sec22-img p {
        font-size: 0.625vw;
    }
}

.hw-vision4-all .sec22-swiper-word {
    width: 37.5vw;
    margin: 3.125vw auto 0;
}

.hw-vision4-all .sec22-swiper-pagination {
    width: 100%;
    font-weight: 700;
    color: #000000;
    font-size: 1.66666667vw;
    line-height: 1.25;
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec22-swiper-pagination .swiper-pagination-bullet {
    width: 33.33333%;
    height: auto;
    padding-bottom: 1.5625vw;
    background: transparent;
    opacity: 1;
    border-radius: 0;
    text-align: center;
    outline: 0;
}

.hw-vision4-all .sec22-line {
    width: 100%;
    height: 2px;
    background: #DEDEDE;
    position: relative;
}

.hw-vision4-all .sec22-line span {
    display: inline-block;
    width: 33.33333%;
    height: 0.20833333vw;
    transform: translateY(-50%);
    background: #5278FB;
    position: absolute;
    top: 50%;
}

.hw-vision4-all .sec22-swiper-text {
    margin: 2.08333333vw 0 0;
    display: flex;
}

.hw-vision4-all .sec22-swiper-text h4 {
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
    font-weight: 400;
    text-align: center;
    flex-shrink: 0;
    width: 100%;
    opacity: 0;
    transform: translateY(100%);
}

.hw-vision4-all .sec22-swiper-text h4:nth-of-type(n + 2) {
    margin: 0 0 0 -100%;
}

.hw-vision4-all .sec22-swiper-text h4.active {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .5s cubic-bezier(0.26, 0.67, 0.48, 0.91), transform .5s cubic-bezier(0.26, 0.67, 0.48, 0.91);
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec22 {
        padding: 0 0 27.777777vw 0;
    }

    .hw-vision4-all .sec22-tip {
        width: 69.44444444vw;
        margin: 0 auto 11.1111111vw;
    }

    .hw-vision4-all .sec22-tip h3 {
        font-size: 8.888888vw;
    }

    .hw-vision4-all .sec22-cne {
        width: 100%;
    }

    .hw-vision4-all .sec22-img p {
        font-size: 1.666666666vw;
        right: 1.3888888vw;
        bottom: 1.3888888vw;
    }

    .hw-vision4-all .sec22-swiper-word {
        width: 84.16666666vw;
        margin: 11.1111111vw auto 0;
    }

    .hw-vision4-all .sec22-swiper-pagination {
        font-size: 5.55555555vw;
        text-align: left;
    }

    .hw-vision4-all .sec22-swiper-pagination .swiper-pagination-bullet {
        padding-bottom: 4.16666vw;
    }

    .hw-vision4-all .sec22-swiper-pagination .swiper-pagination-bullet:nth-of-type(1) {
        text-align: left;
    }

    .hw-vision4-all .sec22-swiper-pagination .swiper-pagination-bullet:nth-of-type(3) {
        text-align: right;
    }

    .hw-vision4-all .sec22-line {
        width: 100%;
    }

    .hw-vision4-all .sec22-line span {
        height: 0.555555555vw;
        transform: translateY(-50%);
    }

    .hw-vision4-all .sec22-swiper-text {
        margin: 8.3333333vw 0 0;
        display: flex;
    }

    .hw-vision4-all .sec22-swiper-text h4 {
        font-size: 4.4444444vw;
        font-weight: 500;
    }
}

/* sec23 */
.hw-vision4-all .sec23 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec23-tip {
    width: 32vw;
    text-align: center;
    margin: 0 auto 4.16666667vw;
}

.hw-vision4-all .sec23-tip h3 {
    font-weight: 700;
    color: #000;
    font-size: 3.33333333vw;
    line-height: 1.25;
}

.hw-vision4-all .sec23-cne {
    width: 81.04166667vw;
    margin: 0 auto;
    overflow: hidden;
}

.hw-vision4-all .sec23-swiper {
    width: 100%;
    overflow: hidden;
}

.hw-vision4-all .sec23-swiper .sec23-img {
    position: relative;
}

.hw-vision4-all .sec23-img p {
    position: absolute;
    right: 1.04166667vw;
    bottom: 1.04166667vw;
    color: #ffffff;
    font-size: 12px;
    line-height: 1.6;
    font-weight: 400;
}

@media screen and (max-width:1920px) {
    .hw-vision4-all .sec23-img p {
        font-size: 0.625vw;
    }
}

.hw-vision4-all .sec23-swiper-word {
    width: 37.5vw;
    margin: 3.125vw auto 0;
}

.hw-vision4-all .sec23-swiper-pagination {
    width: 100%;
    font-weight: 700;
    color: #000000;
    font-size: 1.66666667vw;
    line-height: 1.25;
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec23-swiper-pagination .swiper-pagination-bullet {
    width: 33.33333%;
    height: auto;
    padding-bottom: 1.5625vw;
    background: transparent;
    opacity: 1;
    border-radius: 0;
    text-align: center;
    outline: 0;
}

.hw-vision4-all .sec23-line {
    width: 100%;
    height: 2px;
    background: #DEDEDE;
    position: relative;
}

.hw-vision4-all .sec23-line span {
    display: inline-block;
    width: 33.33333%;
    height: 0.20833333vw;
    transform: translateY(-50%);
    background: #5278FB;
    position: absolute;
    top: 50%;
}

.hw-vision4-all .sec23-swiper-text {
    margin: 2.08333333vw 0 0;
    display: flex;
}

.hw-vision4-all .sec23-swiper-text h4 {
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
    font-weight: 400;
    text-align: center;
    flex-shrink: 0;
    width: 100%;
    opacity: 0;
    transform: translateY(100%);
}

.hw-vision4-all .sec23-swiper-text h4:nth-of-type(n + 2) {
    margin: 0 0 0 -100%;
}

.hw-vision4-all .sec23-swiper-text h4.active {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .5s cubic-bezier(0.26, 0.67, 0.48, 0.91), transform .5s cubic-bezier(0.26, 0.67, 0.48, 0.91);
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec23 {
        padding: 0 0 27.777777vw 0;
    }

    .hw-vision4-all .sec23-tip {
        width: 82vw;
        margin: 0 auto 11.1111111vw;
    }

    .hw-vision4-all .sec23-tip h3 {
        font-size: 8.888888vw;
    }

    .hw-vision4-all .sec23-cne {
        width: 100%;
    }

    .hw-vision4-all .sec23-img p {
        font-size: 1.666666666vw;
        right: 1.3888888vw;
        bottom: 1.3888888vw;
    }

    .hw-vision4-all .sec23-swiper-word {
        width: 84.16666666vw;
        margin: 11.1111111vw auto 0;
    }

    .hw-vision4-all .sec23-swiper-pagination {
        font-size: 5.55555555vw;
        text-align: left;
    }

    .hw-vision4-all .sec23-swiper-pagination .swiper-pagination-bullet {
        padding-bottom: 4.16666vw;
    }

    .hw-vision4-all .sec23-swiper-pagination .swiper-pagination-bullet:nth-of-type(1) {
        text-align: left;
    }

    .hw-vision4-all .sec23-swiper-pagination .swiper-pagination-bullet:nth-of-type(3) {
        text-align: right;
    }

    .hw-vision4-all .sec23-line {
        width: 100%;
    }

    .hw-vision4-all .sec23-line span {
        height: 0.555555555vw;
        transform: translateY(-50%);
    }

    .hw-vision4-all .sec23-swiper-text {
        margin: 8.3333333vw 0 0;
        display: flex;
    }

    .hw-vision4-all .sec23-swiper-text h4 {
        font-size: 4.4444444vw;
        font-weight: 500;
    }
}

/* sec25 */
.hw-vision4-all .sec25 {
    padding: 0 0 10.41666667vw 0;
}

.hw-vision4-all .sec25-word {
    width: 53.85416667vw;
    margin: 0 auto 4.16666667vw;
    text-align: center;
}

.hw-vision4-all .sec25-word h3 {
    font-weight: 700;
    color: #000000;
    font-size: 3.33333333vw;
    line-height: 1.25;
    margin: 0 0 3.125vw 0;
}

.hw-vision4-all .sec25-word h4 {
    font-weight: 400;
    color: #88888b;
    font-size: 1.14583333vw;
    line-height: 1.6;
}

.hw-vision4-all .sec25-box {
    width: 81.04166667vw;
    margin: 0 auto;
    display: flex;
}

.hw-vision4-all .sec25-img {
    width: 42.1875vw;
}

.hw-vision4-all .sec25-text {
    background: #f2f6ff;
    flex: 1;
    padding: 3.125vw 0 0;
}

.hw-vision4-all .sec25-p1 {
    width: 28.75vw;
    font-weight: 700;
    color: #3e3e3e;
    font-size: 1.66666667vw;
    line-height: 1.25;
    text-align: center;
    margin: 0 auto 1.5625vw;
}

.hw-vision4-all .sec25-ul1 {
    width: 28.75vw;
    margin: 0 auto 3.125vw;
    display: flex;
    justify-content: space-between;
}

.hw-vision4-all .sec25-ul1 .sec25-li {
    display: flex;
    align-items: center;
}

.hw-vision4-all .sec25-ul1 .sec25-li p {
    color: #000000;
    font-size: 1.66666667vw;
    line-height: 1.6;
    font-weight: 400;
}

.hw-vision4-all .sec25-ul1 .sec25-icon {
    width: 4.16666667vw;
    margin: 0 1.04166667vw 0 0;
}

.hw-vision4-all .sec25-p2 {
    width: 28.75vw;
    font-weight: 700;
    color: #3e3e3e;
    font-size: 1.66666667vw;
    line-height: 1.25;
    text-align: center;
    margin: 0 auto 1.5625vw;
}

.hw-vision4-all .sec25-ul2 {
    width: 26.45833333vw;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.hw-vision4-all .sec25-ul2 .sec25-li {
    text-align: center;
}

.hw-vision4-all .sec25-ul2 .sec25-li sub {
    font-size: 1.45833333vw;
    line-height: 1.25;
    color: #3e3e3e;
    font-weight: 400;
    vertical-align: baseline;
}

.hw-vision4-all .sec25-ul2 .sec25-li span {
    font-size: 2.1875vw;
    line-height: 1.25;
    color: #5095F7;
    font-weight: 700;
}

.hw-vision4-all .sec25-ul2 .sec25-li p {
    color: #88888b;
    font-size: 12px;
    line-height: 1.6;
    font-weight: 400;
    margin: 1.04166667vw 0 0;
}

@media screen and (min-width:900px) {
    .hw-vision4-all .sec25-ul2 .sec25-li p {
        font-size: 0.83333333vw;
    }
}

.hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(4),
.hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(1) {
    min-width: 6.77083333vw;
}

.hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(2),
.hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(5) {
    min-width: 5.98958333vw;
}

.hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(3),
.hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(6) {
    min-width: 7.29166667vw;
}

.hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(n+4) {
    margin-top: 2.08333333vw;
}

@media screen and (max-aspect-ratio:137/100) {
    .hw-vision4-all .sec25 {
        padding: 0 0 27.7777777vw 0;
    }

    .hw-vision4-all .sec25-word {
        width: 84.1666666vw;
        margin: 0 auto 11.11111vw;
    }

    .hw-vision4-all .sec25-word h3 {
        width: 100%;
        font-size: 6.666666666vw;
        margin: 0 0 11.1111111vw 0;
    }

    .hw-vision4-all .sec25-word h4 {
        width: 100%;
        font-size: 4.444444444vw;
        font-weight: 500;
    }

    .hw-vision4-all .sec25-box {
        width: 100%;
        display: block;
    }

    .hw-vision4-all .sec25-img {
        width: 100%;
    }

    .hw-vision4-all .sec25-text {
        background: #f2f6ff;
        padding: 11.11111vw 0 11.11111vw;
    }

    .hw-vision4-all .sec25-p1 {
        width: 48.6111111vw;
        font-size: 6.666666666vw;
        margin: 0 auto 8.333333vw;
    }

    .hw-vision4-all .sec25-ul1 {
        width: 48.611111111vw;
        margin: 0 auto 11.1111111vw;
    }

    .hw-vision4-all .sec25-ul1 .sec25-li {
        display: block;
    }

    .hw-vision4-all .sec25-ul1 .sec25-li p {
        font-size: 4.444444vw;
        text-align: center;
    }

    .hw-vision4-all .sec25-ul1 .sec25-icon {
        width: 11.1111111vw;
        margin: 0 auto 2.777777777vw;
    }

    .hw-vision4-all .sec25-line {
        height: 4.1666666vw;
        width: 100%;
        background: #fff;
    }

    .hw-vision4-all .sec25-p2 {
        width: 77.7777777vw;
        font-size: 6.6666666vw;
        margin: 11.1111111vw auto 8.3333333vw;
    }

    .hw-vision4-all .sec25-ul2 {
        width: 77.77777777vw;
    }

    .hw-vision4-all .sec25-ul2 .sec25-li {
        font-size: 5.833333333vw;
    }

    .hw-vision4-all .sec25-ul2 .sec25-li sub {
        font-size: 5.833333333vw;
    }

    .hw-vision4-all .sec25-ul2 .sec25-li span {
        font-size: 8.888888888vw;
    }

    .hw-vision4-all .sec25-ul2 .sec25-li p {
        font-size: 4.4444444vw;
        margin: 2.77777777vw 0 0;
    }

    .hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(1),
    .hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(3),
    .hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(5) {
        min-width: 35.4166666vw;
    }

    .hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(2),
    .hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(4),
    .hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(6) {
        min-width: 30.5555555vw;
    }

    .hw-vision4-all .sec25-ul2 .sec25-li:nth-of-type(n+3) {
        margin-top: 8.3333333vw;
    }

}

.hw-vision4-all .hw-footer {
    width: 100%;
    padding-bottom: 10.41666667vw;
}

.hw-vision4-all .hw-footer-ul {
    width: 81.25vw;
    margin: 0 auto;
    list-style: decimal;
}

.hw-vision4-all .hw-footer-ul li {
    font-weight: 500;
    color: #86868b;
    font-size: 12px;
    line-height: 1.6;
}

.hw-vision4-all .hw-footer-ul li.active {
    color: #000;
}

@media screen and (min-width:1920px) {
    .hw-vision4-all .hw-footer-ul li {
        font-size: 0.625vw;
    }
}

@media screen and (max-aspect-ratio:127/100) {
    .hw-vision4-all .hw-footer {
        padding-bottom: 22.22222222vw;
    }

    .hw-vision4-all .hw-footer-ul {
        width: 79.16666667vw;
    }

    .hw-vision4-all .hw-footer-ul li {
        font-weight: 400;
        font-size: 3.0555555555vw;
    }
}
@media screen and (max-width:400px) {
    .hw-vision4-all .hw-footer-ul li {
        font-size: 12px;
    }
}
