.vj-pro-container {
    font-weight: 500;
    line-height: 1.6;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

.vj-pro-container img,
.vj-pro-container video {
    width: 100%;
}

.vj-pro-container video {
    display: block;
}

.vj-pro-container .wx-img {
    display: none;
}

.vj-pro-container .section {
    position: relative;
}

.vj-pro-container .blur-up {
    filter: blur(20px);
    transition: filter .2s;
    will-change: filter;
}

.vj-pro-container .blur-up.lazyloaded {
    filter: blur(0)
}

.vj-pro-container .visuallyhidden {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(0 0 99.9% 99.9%);
    overflow: hidden;
    height: 1px;
    width: 1px;
    padding: 0;
    border: 0;
}

.vj-pro-container .hidden-web {
    display: none;
}

.vj-pro-container .hidden-inline-web {
    display: none;
}

.vj-pro-container sup {
    font-size: .6em;
    cursor: pointer;
}

.vj-pro-container sup a {
    color: inherit;
}

.vj-pro-container .big-title {
    font-size: 6.25vw;
    line-height: 1.25;
}

.vj-pro-container h2 {
    font-size: 3.854166vw;
    line-height: 1.25;
    text-align: center;
}

.vj-pro-container .h2 {
    font-size: 5.208333vw;
    font-weight: bold;
    line-height: 1.25;
    text-align: center;
}

.vj-pro-container .h2 div {
    line-height: inherit;
}

.vj-pro-container .linear-grey {
    display: flex;
    justify-content: center;
}

.vj-pro-container .linear-grey div {
    color: transparent;
    background: linear-gradient(110deg, #A6A6A6 0%, #E8E8E8 30%, #ADADAD 100%);
    background-clip: text;
    -webkit-background-clip: text;
}

.vj-pro-container .h3 {
    font-size: 3.333333vw;
    font-weight: bold;
    line-height: 1.25;
}

.vj-pro-container .subtitle {
    font-size: 1.66vw;
    font-weight: 500;
    line-height: 1.25;
    margin-bottom: .25em;
}

.vj-pro-container .h4 {
    font-size: 2.1875vw;
    line-height: 1.25;
}

.vj-pro-container p {
    color: #6E6E73;
    font-size: 1.1458vw;
    line-height: 1.6;
}

.vj-pro-container .highlight-text {
    color: #FFFFFF;
}

.vj-pro-container .dark-text {
    color: #000;
}

.vj-pro-container .orange-text {
    color: #FF8519;
}

.vj-pro-container .smaller-text {
    font-size: 1.04vw;
    line-height: 1.6;
}

.vj-pro-container .disclaimer {
    font-size: .83vw;
}

.vj-pro-container .canvas-fallback {
    display: none;
}

.vj-pro-container .inline-video-fallback {
    display: none;
}

.vj-pro-container .space-400vh {
    height: 400vh;
}

.vj-pro-container .space-300vh {
    height: 300vh;
}

.vj-pro-container .space-200vh {
    height: 200vh;
}

.vj-pro-container .space-100vh {
    height: 100vh;
}

.vj-pro-container .space-50vh {
    height: 50vh;
}

.vj-pro-container .nowrap {
    white-space: nowrap;
}

.vj-pro-container .sticky-viewport {
    position: sticky;
    height: 100vh;
    top: 0;
}

.vj-pro-container .sticky-container {
    position: sticky;
    top: 0;
}

.vj-pro-container .sequence-animation canvas {
    width: 100%;
    height: 100%;
}

.vj-pro-container .video-pop-play {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.04vw;
    white-space: nowrap;
}

.vj-pro-container .video-fallback {
    display: none;
}

.vj-pro-container .popup-btn {
    width: -moz-fit-content;
    width: fit-content;
    line-height: 1.33;
    padding: 0.9375vw 1.354166vw;
    height: auto;
    margin: 4.166666vw auto 0;
    border-radius: 1.614583vw;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.vj-pro-container .popup-btn span {
    font-size: 0.9375vw;
    line-height: 1.33;
}

.vj-pro-container .popup-btn-highlight {
    border: solid 1.5px #FFFFFF;
    padding: 0.3125vw 1.588541vw 0.3125vw 1.223958vw;
    margin: 1.411458vw auto 0 0;
}

.vj-pro-container .popup-btn-highlight2 {
    border: solid 2px #000000;
    padding: 0.78125vw 2.552083vw 0.885416vw 1.5625vw;
    margin: 2.0833333vw auto 0 0;
}

.vj-pro-container .popup-btn-highlight span {
    color: #fff;
}

.vj-pro-container .popup-btn-highlight2 span {
    color: #000;
}

.vj-pro-container .more-item-popup-image {
    width: 0.729166vw;
    margin-right: 0.729166vw;
}

.vj-pro-container .popup-btn-dark {
    border: solid 1.5px #000000;
    color: #000000;
}

.vj-pro-container .popup-btn-dark span {
    color: #000000;
}

.vj-pro-container .ie-fallback {
    display: none;
}

.vj-pro-container .kv-container {
    display: flex;
    align-items: center;
    position: relative;
    flex-wrap: wrap;
}

.vj-pro-container .kv-image-container {
    width: 66.09375vw;
    position: relative;
}

.vj-pro-container .kv-content-container {
    margin-left: auto;
    margin-right: auto;
    width: 28.43802vw;
}


.vj-pro-container .kv-content-icon {
    width: 100%;
    height: auto;
    margin: 0 auto;
}

.vj-pro-container .kv-content-logo {
    width: 100%;
    height: auto;
    margin: 2.151041vw auto 0;
}

.vj-pro-container .kv-content-slogan {
    display: flex;
    justify-content: space-between;
    font-size: 4.166vw;
    font-weight: 500;
}

.vj-pro-container .kv-content-text {
    margin-top: 1.041666vw;
}

.vj-pro-container .kv-slogan-2 {
    display: inline-block;
}

.vj-pro-container .kv-content-feature {
    font-size: 1.145833vw;
    text-align: center;
}

.vj-pro-container .kv-content-feature span {
    white-space: nowrap;
}

.huawei-product-buy-btn-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 0;
}

.huawei-product-buy-btn-price {
    color: #000;
    font-size: 1.46vw;
    font-weight: 400;
    line-height: 1.25;
}

.huawei-product-buy-btn-price span {
    font-size: 0.677083vw;
    font-weight: 500;
}

.huawei-product-buy-btn {
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    line-height: 24px;
    text-align: center;
    display: inline-block;
    padding: 10px 26px;
    border: 2px solid #000;
    background-color: #000;
    transition: 0.3s ease-out;
    margin-top: 24px;
    cursor: pointer;
    border-radius: 6px;
}

.huawei-product-buy-btn:hover {
    opacity: .8;
}

.vj-pro-container .kv-content-price-container {
    margin-top: 3.90625vw;
}

.vj-pro-container .sticky-container {
    position: sticky;
    width: 100%;
    height: 100vh;
    top: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vj-pro-container .section-s2 {
    position: relative;
    width: 100%;
    height: 170vh;
    background: #000000;
}

.vj-pro-container .section-s2 .s2-sticky .s2-bg {
    width: 100%;
    height: 100%;
}

.vj-pro-container .section-s2 .s2-sticky .s2-bg img,
.vj-pro-container .section-s2 .s2-sticky .s2-bg video {
    -o-object-fit: cover;
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.vj-pro-container .section-s2 .s2-sticky .s2-cover {
    position: absolute;
    width: 100%;
    height: 100%;
    background: black;
    transition: all .3s;
    opacity: 0;
    z-index: 2;
    top: 0;
    left: 0;
}

.vj-pro-container .section-s2 .s2-sticky .s2-cover.active {
    opacity: .6;
}

.vj-pro-container .section-s2 .s2-sticky .s2-mid-title {
    color: white;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 3;
}

.vj-pro-container .section-s2 .s2-sticky .s2-mid-title h3 {
    font-size: 2.5vw;
    font-weight: bold;
    line-height: 1.6;
}

.vj-pro-container .section-s2 .s2-sticky .s2-click-btn {
    width: -moz-fit-content;
    width: fit-content;
    padding: 0 1.354166vw;
    height: 2.5vw;
    margin: 4.166666vw auto 0;
    border: solid 1.5px #FFFFFF;
    border-radius: 1.614583vw;
}

.vj-pro-container .section-s2 .s2-sticky .s2-click-btn a {
    width: 100%;
    height: 100%;
    color: white;
    font-size: 0.9375vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: bold;
    line-height: 1.25;
}

.vj-pro-container .section-s2 .s2-sticky .s2-click-btn a svg {
    width: 1.09375vw;
}

.vj-pro-container .section-s2 .s2-sticky .s2-click-btn a span {
    margin-left: 0.640625vw;
}

.vj-pro-container .section-reasons {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding-top: 8.3333vw;
    z-index: 3;
    background: linear-gradient(to bottom, #161617 0%, #161617 80%, #000000 100%);
}

@media screen and (min-aspect-ratio: 11/10) {
    .vj-pro-container .section-reasons .swiper-wrapper {
        transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
    }

}

.vj-pro-container .section-reasons .swiper-slide {
    width: 67.5vw;
    margin: auto 1.6666vw;
    border-radius: 0.8333vw;
    transition: none;
}

.vj-pro-container .section-reasons .swiper-slide .s2-con {
    position: relative;
    width: 100%;
    height: 100%;
}

.vj-pro-container .section-reasons .swiper-slide .reasons-title {
    width: 80%;
    font-weight: bold;
    position: absolute;
    top: 2.0833vw;
    left: 2.5vw;
    will-change: transform;
    transform: translateZ(1px);
    -webkit-transform: translateZ(1px);
    -moz-transform: translateZ(1px);
    -ms-transform: translateZ(1px);
    -o-transform: translateZ(1px);
}

.vj-pro-container .section-reasons .swiper-slide .reasons-title p {
    font-size: 1.66666vw;
}

.vj-pro-container .section-reasons .swiper-slide .txt-color-grey {
    color: #1E2022 !important;
}

.vj-pro-container .section-reasons .swiper-slide .s2-wrap {
    width: 67.5vw;
    height: 38vw;
    overflow: hidden;
    position: relative;
    border-radius: 0.8333vw;
}

.vj-pro-container .section-reasons .swiper-slide5 {
    background-color: #000000;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-wrap .s2-img {
    width: 30.78125vw;
    height: auto;
    position: absolute;
    left: 17.5vw;
    bottom: 0;

}

.vj-pro-container .section-reasons .swiper-slide5 .s2-content {
    position: absolute;
    top: 12.5vw;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-left {
    left: 3.854166vw;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-right {
    left: 50.9375vw;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-inline-p {
    font-size: 0.833333vw;
    color: #86868B;
    width: 100%;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-inline-center {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-left .s2-inline-center-headline {
    font-size: 6.25vw;
    line-height: 1.25;
    color: #EBEBEB;
    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    background-image: linear-gradient(to bottom, #EBEBEB 0%, #92918E 100%);
    background-size: 100% 100%;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-left .s2-inline-center-text {
    color: #EBEBEB;
    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    background-image: linear-gradient(to bottom, #EBEBEB 0%, #92918E 100%);
    background-size: 100% 100%;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-right .s2-inline-center-headline {
    font-size: 6.25vw;
    line-height: 1.25;
    color: #FFF4DD;
    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    background-image: linear-gradient(to bottom, #FFF4DD 0%, #948063 100%);
    background-size: 100% 100%;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-right .s2-inline-center-text {
    color: #FFF4DD;
    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    background-image: linear-gradient(to bottom, #FFF4DD 0%, #948063 100%);
    background-size: 100% 100%;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-inline-center-text {
    font-size: 1.666666vw;
}

.vj-pro-container .section-reasons .swiper-slide5 .s2-inline-center-img {
    width: auto;
    height: 4.611979vw;
    margin-right: 0.921875vw;
}

.vj-pro-container .section-reasons .swiper-slide video {
    width: 100%;
    height: 38vw;
    border-radius: 0.8333vw;
    overflow: hidden;
    object-fit: cover;
}

.vj-pro-container .section-reasons .swiper-slide-prev {
    cursor: pointer;
}

.vj-pro-container .section-reasons .swiper-slide-next {
    cursor: pointer;
}

.vj-pro-container .section-reasons .swiper-button-center {
    width: 15.625vw;
    margin: 0 auto;
    height: 3.33vw;
    background-color: #242425;
    border-radius: 1.66vw;
    position: relative;
    margin-top: 2.08333vw;
}

.vj-pro-container .section-reasons .swiper-button-center .swiper-pagination {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.vj-pro-container .section-reasons .swiper-button-center .swiper-pagination-bullet {
    width: 0.52vw;
    height: 0.52vw;
    margin: auto 0.26vw;
    background: #ffffff;
    transition: all 1s;
    opacity: .3;
}

.vj-pro-container .section-reasons .swiper-button-center .swiper-pagination-bullet-active {
    background-color: #ffffff;
    opacity: .8;
    transition: all 1s;
}

.vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev {
    left: 1.8vw;
}

.vj-pro-container .section-reasons .swiper-button-center .swiper-button-next {
    right: 1.8vw;
}

.vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev,
.vj-pro-container .section-reasons .swiper-button-center .swiper-button-next {
    color: #FFFFFF;
    width: 0.7364583vw;
    font-weight: bold;
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
}

.vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev:hover,
.vj-pro-container .section-reasons .swiper-button-center .swiper-button-next:hover {
    opacity: .5;
}

.vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev:active,
.vj-pro-container .section-reasons .swiper-button-center .swiper-button-next:active {
    opacity: 1;
}

.vj-pro-container .section-reasons .swiper-button-center .swiper-button-next:after,
.vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev:after {
    font-size: 1.2625vw;
    content: '';
}

.vj-pro-container .section-headline {
    padding: 10.416666vw 0 6.25vw;
    display: flex;
    justify-content: center;
    background: #000;
}

.vj-pro-container .section-headline .h2 {
    width: fit-content;
    line-height: 1.3;
    text-align: center;
    color: transparent;
    background-image: linear-gradient(to left, rgba(39, 39, 41, 0.6) 0%, #f7f7f7 100%, rgba(39, 39, 41, 0.6) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.vj-pro-container .aesthetics-design .sticky-viewport,
.vj-pro-container .aesthetics-s5 .sticky-viewport {
    overflow: hidden;
}

.vj-pro-container .aesthetics-design-container,
.vj-pro-container .aesthetics-s5-container {
    height: 100%;
    display: none;
}

.vj-pro-container .aesthetics-design-container-2,
.vj-pro-container .aesthetics-s5-container-2 {
    width: 100%;
    height: 100%;
}

.vj-pro-container .aesthetics-design-container.active,
.vj-pro-container .aesthetics-s5-container.active {
    display: block;
    pointer-events: all;
    z-index: 2;
}

.vj-pro-container .aesthetics-design-background,
.vj-pro-container .aesthetics-s5-background {
    height: 100%;
}

.vj-pro-container .aesthetics-design-stage-1,
.vj-pro-container .aesthetics-design-stage-2,
.vj-pro-container .aesthetics-design-stage-3,
.vj-pro-container .aesthetics-s5-stage-1,
.vj-pro-container .aesthetics-s5-stage-2,
.vj-pro-container .aesthetics-s5-stage-3 {
    will-change: transform;
}

.vj-pro-container .aesthetics-design-close-container,
.vj-pro-container .aesthetics-s5-close-container {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.vj-pro-container .aesthetics-design-stage,
.vj-pro-container .aesthetics-s5-stage {
    position: absolute;
    width: 20.270833vw;
    transform: translateY(100%);
    font-size: 1.25vw;
    opacity: 0;
    will-change: transform;
    transition: all 0.3s linear;
}

.vj-pro-container .aesthetics-design-stage-1,
.vj-pro-container .aesthetics-s5-stage-1 {
    top: 50%;
    left: 9.375vw;
}

.vj-pro-container .aesthetics-design-stage-2,
.vj-pro-container .aesthetics-s5-stage-2 {
    top: calc(50% + 15.911458vw);
    left: 9.375vw;
}

.vj-pro-container .aesthetics-design-stage-3,
.vj-pro-container .aesthetics-s5-stage-3 {
    right: 9.375vw;
    top: calc(50% + 18.307291vw);
}

.vj-pro-container .aesthetics-design-container-1 .aesthetics-design-stage-2 {
    top: calc(50% + 5.911458vw);
}

.vj-pro-container .aesthetics-design-container-2 .aesthetics-design-stage-3 {
    right: 4.375vw;
    top: calc(50% + 11.307291vw);
}

.vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-2 {
    top: calc(50% - 13.911458vw);
    left: 9.375vw;
}

.vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-3 {
    right: 11.989583vw;
    top: auto;
    bottom: 2vw;
}

.vj-pro-container .aesthetics-s5-container-2 .aesthetics-s5-stage-3 {
    top: calc(50% + 6.307291vw);
}

.vj-pro-container .aesthetics-design-stage.active,
.vj-pro-container .aesthetics-s5-stage.active {
    transform: translateY(-50%);
    opacity: 1;
}

.vj-pro-container .aesthetics-design-stage.active2,
.vj-pro-container .aesthetics-s5-stage.active2 {
    opacity: 0;
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
}

.vj-pro-container .aesthetics-design-stage-container.active,
.vj-pro-container .aesthetics-s5-stage-container.active {
    opacity: 1;
    pointer-events: all;
}

.vj-pro-container .switch-container {
    display: flex;
    position: relative;
    justify-content: center;
    background: #626970;
    font-size: 0;
    overflow: hidden;
}

.vj-pro-container .switch-model {
    width: 51%;
    overflow: hidden;
    flex-shrink: 0;
    margin: 0;
}

.vj-pro-container .switch-watch {
    width: 51%;
    z-index: 2;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
}

.vj-pro-container .section-switch1 .switch-watch,
.vj-pro-container .section-switch2 .switch-model {
    width: calc(50% + 1px);
}

.vj-pro-container .switch-watch-swiper {
    width: 100%;
    height: 100%;
    position: relative;
}

.vj-pro-container .switch-watch-swiper .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(/content/dam/huawei-cbg-site/cn/mkt/pdp/wearables/watch-gt5-pro/images/switch/shadow-light.png) no-repeat;
    background-size: 18.602604vw 26.834895vw;
    background-position: 80% 50%;
}

.vj-pro-container .switch-watch-swiper .swiper-slide:nth-child(1) {
    background: url(/content/dam/huawei-cbg-site/cn/mkt/pdp/wearables/watch-gt5-pro/images/switch/shadow-dark.png) no-repeat;
    background-size: 18.602604vw 26.834895vw;
    background-position: 80% 50%;
}

.vj-pro-container .switch-watch-swiper .swiper-slide:nth-child(2) {
    background: url(/content/dam/huawei-cbg-site/cn/mkt/pdp/wearables/watch-gt5-pro/images/switch/shadow-light.png) no-repeat;
    background-size: 18.602604vw 26.834895vw;
    background-position: 80% 50%;
}

.vj-pro-container .switch-watch-swiper2 .swiper-slide:nth-child(1),
.vj-pro-container .switch-watch-swiper2 .swiper-slide:nth-child(2) {
    background-position: 73% 50%;
}

.vj-pro-container .switch-watch-swiper1 .switch-img {
    width: 21.710937vw;
    margin: 0 auto;
}

.vj-pro-container .switch-watch-swiper2 .switch-img {
    width: 18.646875vw;
    margin: 0 auto;
}

.vj-pro-container .switch-watch-swiper1 .swiper-slide:nth-child(1) {
    background-color: #626970;
}

.vj-pro-container .switch-watch-swiper1 .swiper-slide:nth-child(2) {
    background-color: #D6DCDE;
}

.vj-pro-container .switch-watch-swiper2 .swiper-slide:nth-child(1) {
    background-color: #626970;
}

.vj-pro-container .switch-watch-swiper2 .swiper-slide:nth-child(2) {
    background-color: #D6DCDE;
}

.vj-pro-container .switch-color-name {
    position: absolute;
    z-index: 2;
    color: #fff;
    left: 50%;
    transform: translateX(-50%);
    bottom: 6.875vw;
    text-align: center;
}

.vj-pro-container .section-switch2 .switch-color-name {
    bottom: 5.833333vw;
}

.vj-pro-container .section-switch2-wrap {
    position: relative;
    font-size: 0;
}

.vj-pro-container .switch-watch-swiper .swiper-slide {
    transition: all .5s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.vj-pro-container .switch-model-swiper .swiper-slide {
    transition: all .5s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.vj-pro-container .switch-model-swiper .swiper-slide {
    opacity: 0;
}

.vj-pro-container .switch-model-swiper .swiper-slide-active {
    opacity: 1;
}

.vj-pro-container .color-name {
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    white-space: nowrap;
    font-size: 1.666666vw;
}

.vj-pro-container .color-name.active {
    opacity: 1;
}

.vj-pro-container .color-name:nth-child(2) {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}

.vj-pro-container .color-black {
    color: #000;
}

.vj-pro-container .switch-color-btn-container {
    display: flex;
    margin: 0 auto;
    align-items: center;
    justify-content: center;
    position: sticky;
    bottom: 0;
    z-index: 5;
    opacity: 0;
    transition-duration: .1s;
}

.vj-pro-container .switch-color-btn {
    font-size: 0.9375vw;
    border-radius: 1.40625vw;
    margin: 0 auto;
    height: auto;
    width: auto;
    display: flex;
    justify-content: center;
    position: absolute;
    left: auto;
    bottom: 2.109375vw;
    align-items: center;
    padding: 0.729166vw 0;
    background: rgba(51, 51, 53, 0.7);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    color: #D6D6D6;
}

.vj-pro-container .switch-color-text {
    cursor: pointer;
    padding: 0;
    text-align: center;
    width: fit-content;
    min-width: 0px;
    position: relative;
    padding: 0 1.458333vw;
    opacity: 0;
    z-index: 2;
    white-space: nowrap;
    pointer-events: all;
    will-change: auto;
}

@keyframes switchBtn {
    0% {
        width: 0;
        transform: scale(0);
        opacity: 0;
        will-change: transform;
    }

    50% {
        transform: scale(1);
        width: 5.020833vw;
        transition: all 0.3s;
        will-change: width transform;
    }

    100% {
        width: 11.875vw;
        transition: all 0.6s;
        will-change: width;
    }
}


.vj-pro-container .switch-color-btn-container.animated {
    opacity: 1;
}

.vj-pro-container .switch-color-btn-container.animated .switch-color-btn {
    animation: switchBtn 0.6s ease-in-out forwards;
    -webkit-animation: switchBtn 0.6s ease-in-out forwards;
    transition-delay: .2s;
}

.vj-pro-container .switch-color-btn-container.animated .switch-color-text {
    opacity: 1;
    transition-delay: .4s;
}

.vj-pro-container .switch-color-text.active {
    color: #000000;
    pointer-events: none;
}

.vj-pro-container .switch-color-btn[data-active="0"]::after {
    transform: translateX(0);
}

.vj-pro-container .switch-color-btn[data-active="1"]::after {
    transform: translateX(97%);
    -webkit-transform: translateX(97%);
    -moz-transform: translateX(97%);
    -ms-transform: translateX(97%);
    -o-transform: translateX(97%);
}

.vj-pro-container .switch-color-btn::after {
    background: rgba(255, 255, 255, 1);
    border-radius: 2.34375vw;
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 48%;
    height: calc(100% - 0.625vw);
    margin: 0.3125vw;
    transition: transform .3s ease;
    -webkit-transition: transform .3s ease;
    -moz-transition: transform .3s ease;
    -ms-transition: transform .3s ease;
    -o-transition: transform .3s ease;
}

.vj-pro-container .switch-card-container {
    display: flex;
    width: 81.25vw;
    margin: 0 auto;
    flex-wrap: wrap;
}

.vj-pro-container .switch-card-col {
    width: 100%;
    display: flex;
    justify-content: space-between;
    height: 0;
    margin-top: 0;
    visibility: hidden;
    will-change: height;
}

.vj-pro-container .switch-card-col.active {
    height: auto;
    margin-top: 6.125vw;
    visibility: visible;
}

.vj-pro-container .switch-card-item {
    width: 39.58333vw;
    height: 50vw;
    flex-shrink: 0;
    background-color: #F5F5F7;
    margin: 0;
    position: relative;
    overflow: hidden;
}

.vj-pro-container .switch-card-con {
    padding: 3.932291vw 3.333333vw 0 3.333333vw;
    position: relative;
    top: auto;
    left: auto;
    z-index: 2;
}

.vj-pro-container .switch-card-headline {
    font-size: 2.1875vw;
    line-height: 1.25;
    font-weight: bold;
    margin-bottom: 1.625vw;
}

.vj-pro-container .switch-card-text {
    font-size: 1.041667vw;
    color: #86868B;
}

.vj-pro-container .switch-card-item-4 .switch-card-text {
    color: #FFFFFF;
}

.vj-pro-container .card-swiper {
    width: 100%;
    height: auto;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 6.3vw;
    padding-bottom: 12.173125vw;
}

.vj-pro-container .card-swiper-clock-dial {
    width: 13.57916vw;
    margin: 0 auto;
}

.vj-pro-container .switch-card-bottom {
    position: relative;
}

.vj-pro-container .switch-card-shell {
    width: 16.927083vw;
    position: relative;
    top: 0;
    left: 50%;
    margin-top: 6.25vw;
    transform: translate(-50%, 0);
    z-index: 1;
}

.vj-pro-container .switch-card-bg {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
}

.vj-pro-container .switch-card-item-4 .switch-card-con {
    z-index: 3;
}


.vj-pro-container .switch-card-btn {
    position: absolute;
    width: 1.875vw;
    height: 1.875vw;
    right: 1.145833vw;
    bottom: 1.145833vw;
}

.vj-pro-container .switch-card-btn .switch-card-btn-img {
    width: 100%;
    opacity: 1;
    cursor: pointer;
}

.vj-pro-container .switch-card-btn .switch-card-btn-img-1 {
    z-index: 3;
}

.vj-pro-container .switch-card-btn .switch-card-btn-img {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 2;
    pointer-events: none;
}

.vj-pro-container .switch-card-btn .switch-card-btn-img.active {
    opacity: 1;
    pointer-events: all;
}

.vj-pro-container .sports-container {
    position: relative;
    width: 81.25vw;
    margin: 0 auto;
    height: 300vh;
}

.vj-pro-container .sports-items {
    width: 100%;
    position: relative;
    transform: translateY(-50%);
    top: 50%;
    overflow: hidden;
}

.vj-pro-container .sports-item {
    width: 100%;
    position: relative;
}

.vj-pro-container .sports-item-2,
.vj-pro-container .sports-item-3 {
    position: absolute;
    max-width: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
}

.vj-pro-container .sports-item-1 {
    z-index: 3;
}

.vj-pro-container .sports-item-2 {
    z-index: 2;
}

.vj-pro-container .sports-item-3 {
    z-index: 1;
}

.vj-pro-container .sports-items[data-active="2"] .sports-item-1 {
    pointer-events: none;
}

.vj-pro-container .sports-items[data-active="2"] .sports-item-3 {
    pointer-events: none;
}

.vj-pro-container .sports-items[data-active="2"] .sports-item-2 {
    pointer-events: all;
}

.vj-pro-container .sports-items[data-active="3"] .sports-item-2 {
    pointer-events: none;
}

.vj-pro-container .sports-items[data-active="3"] .sports-item-1 {
    pointer-events: none;
}

.vj-pro-container .sports-items[data-active="3"] .sports-item-3 {
    pointer-events: all;
}

.vj-pro-container .sports-bg-wrap {
    width: 100%;
    overflow: hidden;
}

.vj-pro-container .sports-bg-wrap img {
    border: 1px solid #fff;
}

.vj-pro-container .sports-text-wrap {
    position: relative;
    overflow: hidden;
}

.vj-pro-container .sports-text-inner {
    display: flex;
    align-items: flex-start;
    opacity: 0;
}

.vj-pro-container .sports-text-inner-1,
.vj-pro-container .sports-text-inner-2,
.vj-pro-container .sports-text-inner-3 {
    opacity: 0;
}

.vj-pro-container .sports-text-inner-1.animated,
.vj-pro-container .sports-text-inner-2.animated,
.vj-pro-container .sports-text-inner-3.animated {
    opacity: 1;
    transition: opacity .8s;
}

.vj-pro-container .sports-text-inner .sports-headline {
    max-width: 30vw;
}

.vj-pro-container .sports-text {
    width: 27.135416vw;
    min-height: 8.333333vw;
    font-size: 1.25vw;
    flex-shrink: 0;
    margin-left: auto;
    margin-top: 1.604166vw;
    padding-bottom: 9.895833vw;
    color: #86868B;
}

.vj-pro-container .sports-items {
    top: 0;
    transform: translate(0, 0);
}

.vj-pro-container .sports-clock-dial-wrap {
    width: 12.86458vw;
    position: absolute;
    top: 26.78125vw;
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 4;
}

.vj-pro-container .sports-clock-dial-1 {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 6;
}

.vj-pro-container .sports-clock-dial-2 {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 5;
}

.vj-pro-container .sports-clock-dial-3 {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 4;
}

.vj-pro-container .sports-shell {
    width: 16.257812vw;
    position: absolute;
    top: 24.713541vw;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
}

.vj-pro-container .section-sports .sticky-viewport {
    height: auto;
    top: 0;
    display: flex;
    align-items: center;
}

.vj-pro-container .section-sports .h2,
.vj-pro-container .section-health .h2 {
    padding: 9.635416vw 0 6.25vw;
}

.vj-pro-container .section-sports .h3 {
    margin-top: 1.604166vw;
}

.vj-pro-container .section-health {
    position: relative;
    width: 100%;
    height: 230vh;
}

.vj-pro-container .health-trigger2 {
    position: relative;
    top: 30vh;
}

.vj-pro-container .section-health .health-sticky .health-bg {
    width: 100%;
    height: 100%;
    position: relative;
}

.vj-pro-container .section-health .health-sticky .health-bg img,
.vj-pro-container .section-health .health-sticky .health-bg video {
    -o-object-fit: cover;
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.vj-pro-container .section-health .health-sticky .health-cover {
    position: absolute;
    width: 100%;
    height: 25vw;
    background: url(/content/dam/huawei-cbg-site/cn/mkt/pdp/wearables/watch-gt5-pro/images/health/health-cover.png) no-repeat;
    background-position: center;
    background-size: 100%;
    opacity: 0;
    z-index: 2;
    bottom: -2px;
    left: 0;
    transition: all .3s;
}

.vj-pro-container .section-health .health-sticky .health-cover.active {
    opacity: 1;
}

.vj-pro-container .section-health .health-content {
    position: absolute;
    width: 40.598958vw;
    bottom: 6.25vw;
    left: 9.401041vw;
    z-index: 3;
    transform: translate(0, 0);
}

.vj-pro-container .section-health .health-text {
    margin-top: 2.083333vw;
    font-size: 1.25vw;
    color: #fff;
}

.vj-pro-container .section-more {
    width: 100%;
    overflow: hidden;
}

.vj-pro-container .section-more .h3 {
    text-align: center;
    margin-bottom: 4.166666vw;
}

.vj-pro-container .more-item-text {
    will-change: transform;
    transform: translateZ(1px);
    -webkit-transform: translateZ(1px);
    -moz-transform: translateZ(1px);
    -ms-transform: translateZ(1px);
    -o-transform: translateZ(1px);
}

.vj-pro-container .more-container {
    display: flex;
    justify-content: space-between;
}

.vj-pro-container .more-title-container {
    margin-left: 15%;
}

.vj-pro-container .more-subtitle {
    color: #000000;
    font-size: 1.14vw;
    line-height: 1.25;
    margin-bottom: .25em;
    opacity: .3;
}

.vj-pro-container .more-left-part,
.vj-pro-container .more-right-part {
    width: 100%;
    will-change: transform;
}

.vj-pro-container .more-right-part {
    transition-delay: .25s;
}

.vj-pro-container .more-container.active .more-left-part,
.vj-pro-container .more-container.active .more-right-part {
    opacity: 1;
    transform: translateY(0);
}

.vj-pro-container .more-title .product-special-title-color {
    font-size: 1.333em;
}

.vj-pro-container .section-more .swiper-wrapper {
    transition: transform .5s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.vj-pro-container .more-item-image {
    overflow: hidden;
    width: 100%;
    height: auto;
    will-change: transform;
}

.vj-pro-container .more-text {
    margin-top: 1.458vw;
    margin-left: 2.5vw;
}

.vj-pro-container .more-item {
    position: relative;
    width: 26.041666vw;
    height: 35.416666vw;
    transform: translateY(3vw);
    pointer-events: none;
    opacity: 0;
    background: #F5F5F7;
    margin-right: 1.5625vw;
    transition: all .3s cubic-bezier(0, 0, 0.5, 1);
    overflow: hidden;
}

.vj-pro-container .more-item:last-child {
    margin-right: 0;
}

.vj-pro-container .more-item.animated {
    transform: translateY(0);
    pointer-events: all;
    opacity: 1;
}

.vj-pro-container .more-item .more-item-btn,
.vj-pro-container .item-btn {
    width: 1.875vw;
    height: 1.875vw;
    position: absolute;
    bottom: 1.041666vw;
    right: 1.041666vw;
    cursor: pointer;
    z-index: 4;
}

.vj-pro-container .more-item .more-item-btn .item-img,
.vj-pro-container .item-btn .item-img {
    opacity: 0;
    transition: opacity .2s;
    will-change: opacity;
    pointer-events: none;
}

.vj-pro-container .more-item .more-item-btn .item-img-2,
.vj-pro-container .more-item .more-item-btn .item-img-3,
.vj-pro-container .item-btn .item-img-2,
.vj-pro-container .item-btn .item-img-3 {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.vj-pro-container .more-item .more-item-btn .item-img.active,
.vj-pro-container .item-btn .item-img.active {
    opacity: 1;
    pointer-events: all;
}


.vj-pro-container .more-item-2 {
    background: linear-gradient(to bottom, #ECF2EC, #D5E6D6);
}

.vj-pro-container .more-item-8 {
    background: #F5F5FE;
}

.vj-pro-container .more-item-9 {
    background: #F5F5F7;
}

.vj-pro-container .more-item .more-cover {
    width: 100%;
    height: 15.625vw;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: .8;
}

.vj-pro-container .more-item-1 .more-cover {
    background: linear-gradient(to bottom, black, transparent);
}

.vj-pro-container .more-item-3 .more-cover {
    background: linear-gradient(to bottom, #5B7247, transparent);
    opacity: 1;
}

.vj-pro-container .more-item-4 .more-cover {
    background: linear-gradient(to bottom, #744730, transparent);
    opacity: 1;
}

.vj-pro-container .more-item-full-video,
.vj-pro-container .more-item-full-image {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.vj-pro-container .more-item-full-video video,
.vj-pro-container .more-item-full-video img,
.vj-pro-container .more-item-full-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.vj-pro-container .more-item-2 .more-item-image {
    position: absolute;
    width: 17.559895vw;
    left: 50%;
    transform: translateX(-50%);
    bottom: 2.604166vw;
}

.vj-pro-container .more-item-5 .more-item-image {
    position: absolute;
    width: 17.157291vw;
    left: 50%;
    transform: translateX(-50%);
    bottom: 2.604166vw;
}

.vj-pro-container .more-item-7 .more-item-image {
    position: absolute;
    width: 17.603645vw;
    left: 50%;
    transform: translateX(-50%);
    bottom: 2.604166vw;
}

.vj-pro-container .more-item-8 .more-item-image {
    position: relative;
    width: 100%;
    margin: 3.645vw auto 5.729166vw;
}

.vj-pro-container .more-item-9 .more-item-image {
    position: relative;
    width: 18.75vw;
    margin: 4.89583vw auto 4.166666vw;
}

.vj-pro-container .more-item-text {
    position: relative;
    padding: 3.125vw 2.083333vw 0;
    z-index: 2;
}

.vj-pro-container .more-item-text p {
    font-size: 1.04vw;
    color: #D6D6D6;
}

.vj-pro-container .more-item-1 .more-item-text p {
    color: #B7B7B7;
}

.vj-pro-container .more-item-4 .more-item-text p {
    color: #86868B;
}

.vj-pro-container .more-item-2 .more-item-text p,
.vj-pro-container .more-item-3 .more-item-text p,
.vj-pro-container .more-item-5 .more-item-text p,
.vj-pro-container .more-item-6 .more-item-text p,
.vj-pro-container .more-item-7 .more-item-text p,
.vj-pro-container .more-item-8 .more-item-text p,
.vj-pro-container .more-item-9 .more-item-text p {
    color: #86868B;
}

.swiper-slide-active .more-item-text,
.swiper-slide-duplicate-active .more-item-text {
    margin-left: 0;
}

.vj-pro-container .more-item-2.animated {
    transition-delay: 0.1s;
}

.vj-pro-container .more-item-3.animated {
    transition-delay: 0.2s;
}

.vj-pro-container .more-item-4.animated {
    transition-delay: 0.3s;
}

.vj-pro-container .more-item-5.animated {
    transition-delay: 0.4s;
}

.vj-pro-container .more-item-6.animated {
    transition-delay: 0.5s;
}

.vj-pro-container .more-item-8.animated {
    transition-delay: 0.6s;
}

.vj-pro-container .more-item-9.animated {
    transition-delay: 0.7s;
}

.vj-pro-container .more-swiper-btn-container {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 1.666666vw;
    margin-right: 8.85vw;
}

.vj-pro-container .more-swiper-btn-container .common-control-swiper-btn {
    cursor: pointer;
    transition: all 100ms linear;
    display: flex;
}

.vj-pro-container .more-swiper-btn-container .common-control-swiper-btn:first-child {
    margin-right: 1.2vw;
}

.vj-pro-container .more-swiper-btn-container .common-control-swiper-btn:hover {
    opacity: .7;
}

.vj-pro-container .more-swiper-btn-container .common-control-swiper-btn:active {
    opacity: 1;
}

.vj-pro-container .more-swiper-btn-container .btn-disable {
    opacity: .3;
    pointer-events: none;
}

.vj-pro-container .more-swiper-btn-container img {
    width: 2.5vw;
    height: 2.5vw;
}

.camera-main-title-animation {
    display: flex;
    justify-content: center;
}

.camera-main-title-container {
    display: flex;
    justify-content: center;
    position: relative;
    text-align: center;
}

.camera-main-title-container .h2 {
    padding: 0 1em .2em .5em;
    transform: scale(0);
    opacity: 0;
    transition: transform 1s ease, opacity .4s ease;
}

.camera-main-title-icon {
    position: absolute;
    width: 5.05vw;
    transition: transform 1s ease;
}

.camera-main-title-icon-1 {
    left: 0;
    transform: translate(300%, 100%);
}

.camera-main-title-icon-2 {
    right: 0;
    bottom: 0;
    transform: translate(-300%, -100%);
}

.camera-main-title-icon-2 img {
    transform: rotate(180deg);
}

.camera-main-title-container.active .h2 {
    transform: scale(1);
    opacity: 1;
}

.camera-main-title-container.active .camera-main-title-icon {
    transform: translate(0, 0);
}

.camera-main-title-text {
    margin: 0 auto;
    width: 47.2%;
    text-align: center;
}

.camera-main-title-text p.common-transform-show {
    opacity: 0;
    transform: translateY(2.08vw);
    transition: all .5s cubic-bezier(0.26, 0.67, 0.48, 0.91);
    will-change: transform;
}

.title-animation-end p.common-transform-show.active {
    opacity: 1;
    transform: translateY(0);
}

.camera-intro-container {
    position: relative;
}

#camera-intro-background-animation {
    margin: 0 auto;
    width: 100%;
    height: auto;
}

.camera-intro-content-container {
    position: absolute;
    top: 20%;
    left: 15%;
}

.camera-intro-content-feature-container {
    position: relative;
}

.camera-intro-content-feature-front {
    position: absolute;
    top: 25%;
    left: 0;
    width: 100%;
}

.camera-intro-content-feature-front,
.camera-intro-content-feature-rear {
    opacity: 0;
    pointer-events: none;
    transition: opacity .6s ease;
}

.camera-intro-content-feature-container[data-index="1"] .camera-intro-content-feature-front {
    opacity: 1;
    pointer-events: all;
}

.camera-intro-content-feature-container[data-index="2"] .camera-intro-content-feature-rear {
    opacity: 1;
    pointer-events: all;
}

.camera-intro-content-feature-item {
    margin-bottom: 3.125vw;
}

.camera-intro-content-feature-item:last-child {
    margin-bottom: 0;
}

.camera-intro-new-content-feature-container .camera-intro-content-feature-item {
    margin-bottom: 2vw;
}

.camera-intro-new-content-feature-container .camera-intro-content-feature-item:last-child {
    margin-bottom: 0;
}

.camera-intro-content-feature-item-title {
    font-size: 1.25vw;
    font-weight: 500;
    line-height: 1.25;
}

.camera-intro-content-feature-item-num {
    background: linear-gradient(to bottom, #D4E5B0, #8FD600);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    font-size: 4.21vw;
    margin: 0 0 1.04vw;
    line-height: 1;
}

.camera-intro-content-feature-item-text {
    color: #6E6E73;
    font-size: .9375vw;
    margin-top: 1.04vw;
}

.camera-intro-switch-btn-container {
    display: flex;
    margin-top: 4.166vw;
    align-items: center;
    justify-content: center;
}

.camera-intro-switch-btn-container.hidden-web {
    display: none;
}

.camera-intro-switch-btn {
    font-size: 0.9375vw;
    border-radius: 1.40625vw;
    margin: 0 auto;
    height: auto;
    width: 18.020833vw;
    display: flex;
    justify-content: center;
    position: relative;
    align-items: center;
    padding: 0.729166vw 0;
    background: #333335;
}


.camera-intro-switch-text {
    cursor: pointer;
    padding: 0;
    text-align: center;
    width: 50%;
    position: relative;
    opacity: 1;
    z-index: 2;
}

.camera-intro-switch-text:nth-child(1) {
    padding-left: 0.3125vw;
}

.camera-intro-switch-text:nth-child(2) {
    padding-right: 0.3125vw;
}

.camera-intro-switch-btn[data-index="1"]::after {
    transform: translateX(0);
}

.camera-intro-switch-btn[data-index="2"]::after {
    transform: translateX(8.375vw);
}

.camera-intro-switch-btn::after {
    background-color: #fff;
    border-radius: 2.34375vw;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: calc(100% - 0.625vw);
    margin: 0.3125vw;
    transition: transform .3s ease;
    -webkit-transition: transform .3s ease;
    -moz-transition: transform .3s ease;
    -ms-transition: transform .3s ease;
    -o-transition: transform .3s ease;
}

.camera-intro-new-background {
    margin-left: 23.54%;
    width: 54.22%;
}

.camera-intro-new-background img {
    image-rendering: -webkit-optimize-contrast;
}

.camera-intro-new-content-container {
    position: absolute;
    top: 0;
    left: 8%;
    width: 83%;
}

.camera-intro-new-content-feature-container {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.camera-intro-new-content-feature-rear {
    margin-top: 4.1vw;
}

.camera-intro-new-content-feature-front {
    margin-top: 4.8vw;
}

@media (max-aspect-ratio: 11 / 10) {
    .vj-pro-container .header-top {
        top: 0;
    }

    .vj-pro-container .hidden-web {
        display: block;
    }

    .vj-pro-container .hidden-mob {
        display: none;
    }

    .vj-pro-container .hidden-inline-web {
        display: inline-block;
    }

    .vj-pro-container .sticky-viewport {
        height: 100vh;
        top: 0;
    }

    .vj-pro-container {
        font-size: 3.6vw;
    }

    .vj-pro-container h2 {
        font-size: 11.111111vw;
    }

    .vj-pro-container .h2 {
        font-size: 12.5vw;
    }

    .vj-pro-container .h3 {
        font-size: 9.444vw;
    }

    .vj-pro-container .subtitle {
        font-size: 6.667vw;
        font-weight: bold;
        line-height: 1.25;
    }

    .vj-pro-container .h4 {
        font-size: 8.333vw;
    }

    .vj-pro-container p {
        font-size: 4.44vw;
    }

    .vj-pro-container .disclaimer {
        font-size: 3vw;
    }

    .vj-pro-container .video-pop-play {
        font-size: 3.8vw;
    }

    .vj-pro-container .auto-video-btn {
        font-size: 3.8vw;
    }

    .vj-pro-container .popup-btn {
        border-radius: 4.305555vw;
    }

    .vj-pro-container .popup-btn span {
        font-size: 3.611111vw;
    }

    .vj-pro-container .popup-btn-highlight {
        margin: 5.555555vw auto 0 0;
        padding: 1.25vw 6.430555vw 1.666666vw 4.347222vw;
    }

    .vj-pro-container .popup-btn-highlight2 {
        margin: 8.333333vw auto 0 0;
        padding: 3.333333vw 5.55555vw;
        border-radius: 6.833333vw;
    }

    .vj-pro-container .more-item-popup-image {
        width: 3.202777vw;
        margin-right: 2.083333vw;
    }

    .vj-pro-container .common-swiper-btn-container {
        display: flex;
    }

    .vj-pro-container .common-swiper-btn-container .common-control-swiper-btn:first-child {
        margin-right: 3.722vw;
    }

    .vj-pro-container .common-control-swiper-btn {
        cursor: pointer;
        opacity: 1;
        transition: opacity .3s ease;
    }

    .vj-pro-container .common-control-swiper-btn.btn-disable {
        cursor: default;
        opacity: .3;
    }

    .vj-pro-container .common-popup-btn-container svg {
        width: 11.111vw;
        height: 11.111vw;
    }

    .vj-pro-container .common-popup-btn-container:hover .common-popup-btn-light {
        opacity: 0;
    }

    .vj-pro-container .kv-content-price-container {
        margin-top: 16.666666vw;
    }

    .vj-pro-container .kv-image-container {
        width: 100%;
    }

    .vj-pro-container .kv-content-container {
        width: 86.111111vw;
        margin: 16.666666vw auto 30.555555vw;
    }

    .vj-pro-container .kv-content-icon {
        width: 100%;
    }

    .vj-pro-container .kv-content-logo {
        width: 100%;
        margin: 0 auto 3.888888vw;
    }

    .vj-pro-container .kv-content-feature {
        font-size: 3.4722222vw;
    }

    .vj-pro-container .kv-content-text {
        margin-top: 0;
    }

    .vj-pro-container .huawei-product-buy-btn-price {
        font-size: 5.56vw;
    }

    .vj-pro-container .huawei-product-buy-btn-price span {
        font-size: 3.611111111vw;
    }

    .vj-pro-container .section-s2 .s2-sticky .s2-bg {
        width: 100%;
        height: 100%;
    }

    .vj-pro-container .section-s2 .s2-sticky .s2-mid-title {
        width: 90.277778vw;
    }

    .vj-pro-container .section-s2 .s2-sticky .s2-mid-title h3 {
        font-size: 6.666667vw;
    }

    .vj-pro-container .section-s2 .s2-sticky .s2-click-btn {
        height: 11.666666vw;
        padding: 0 6.172222vw;
        border: solid 0.416666vw #FFFFFF;
        border-radius: 5.833333vw;
        margin-top: 13.888888vw;
    }

    .vj-pro-container .section-s2 .s2-sticky .s2-click-btn a {
        font-size: 3.333333vw;
    }

    .vj-pro-container .section-s2 .s2-sticky .s2-click-btn a svg {
        width: 4.245833vw;
        height: 4.245833vw;
    }

    .vj-pro-container .section-s2 .s2-sticky .s2-click-btn a span {
        margin-left: 2.055555vw;
    }

    .vj-pro-container .section-reasons {
        padding-top: 22.222222vw;
    }

    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-next,
    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev {
        width: 2.601388vw;
    }

    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-next {
        right: 6.819444vw;
        width: 2.601388vw;
    }

    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev {
        left: 6.819444vw;
        width: 2.601388vw;
    }

    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-next:after,
    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev:after {
        content: '';
    }

    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev:hover,
    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-next:hover {
        opacity: 1;
    }

    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev.swiper-button-disabled,
    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-next.swiper-button-disabled,
    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-prev:active,
    .vj-pro-container .section-reasons .swiper-button-center .swiper-button-next:active {
        opacity: .3;
    }

    .vj-pro-container .section-reasons .swiper-slide {
        position: relative;
        width: 83.333333vw;
        margin: auto 2.222222vw;
        height: 125vw;
        border-radius: 2.222222vw;
        overflow: hidden;
    }

    .vj-pro-container .section-reasons .swiper-slide .s2-con {
        position: relative;
        transition: none;
    }

    .vj-pro-container .section-reasons .swiper-slide video,
    .vj-pro-container .section-reasons .swiper-slide .s2-wrap {
        height: 100%;
        border-radius: 2.222222vw;
    }

    .vj-pro-container .section-reasons .swiper-slide .s2-wrap {
        position: relative;
        width: 83.333333vw;
        border-radius: 2.222222vw;
        transition: none;
        filter: blur(0px) !important;
        -webkit-filter: blur(0px) !important;
    }


    .vj-pro-container .section-reasons .swiper-slide .reasons-title {
        width: auto;
        top: 5.833333vw;
        left: 6.666666vw;
        right: 3.5vw;
        z-index: 4;
        will-change: transform;
        transform: translateZ(1px);
        -webkit-transform: translateZ(1px);
        -moz-transform: translateZ(1px);
        -ms-transform: translateZ(1px);
        -o-transform: translateZ(1px);
    }

    .vj-pro-container .section-reasons .swiper-slide .reasons-title p {
        font-size: 5vw;
        line-height: 1.25;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-wrap .s2-img {
        width: 67.916666vw;
        left: 50%;
        transform: translateX(-50%);
        bottom: 0;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-content {
        position: relative;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-content>.s2-inline-p {
        color: #86868B;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-inline-wrap {
        width: 100%;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-inline-p {
        font-size: 3.333333vw;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-inline-center {
        width: 50%;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-inline-center-img {
        height: 12.298611vw;
        margin-right: 2.736111vw;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-left .s2-inline-center-headline,
    .vj-pro-container .section-reasons .swiper-slide5 .s2-right .s2-inline-center-headline {
        font-size: 11.666666vw;
        line-height: 1.25;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-left,
    .vj-pro-container .section-reasons .swiper-slide5 .s2-right {
        width: 93%;
        left: 6.666666vw;
        top: auto;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-left {
        margin-top: 22.833333vw;
        transform: translate(0, 0);
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-right {
        margin-top: 3.763888vw;
        transform: translate(0, 0);
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-inline-wrap {
        display: flex;
        flex-wrap: wrap;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-inline-p {
        display: inline-block;
    }

    .vj-pro-container .section-reasons .swiper-slide5 .s2-inline-center-text {
        font-size: 4.444444vw;
        line-height: 1.25;
    }

    .vj-pro-container .section-reasons .swiper-button-center {
        width: 62.222222vw;
        height: 13.333333vw;
        border-radius: 12.222222vw;
        margin-top: 8.416666vw;
    }

    .vj-pro-container .section-reasons .swiper-button-center .swiper-pagination-bullet {
        width: 2.222222vw;
        height: 2.222222vw;
        margin: 0 1.666666vw;
    }

    .vj-pro-container .switch-color-btn-container {
        bottom: 8.333333vw;
    }

    .vj-pro-container .aesthetics-design-container,
    .vj-pro-container .aesthetics-s5-container {
        visibility: visible;
        transition: opacity .3s linear;
        opacity: 0;
    }

    .vj-pro-container .aesthetics-s5-container-2 {
        background: #FAFAFA;
    }

    .vj-pro-container .section-design .switch-color-btn-container,
    .vj-pro-container .s5 .switch-color-btn-container {
        position: relative;
        left: auto;
        transform: none;
        /* opacity: 0; */
        bottom: 0;
    }

    .vj-pro-container .section-design .switch-color-btn,
    .vj-pro-container .s5 .switch-color-btn {
        bottom: 8.333333vw;
    }

    .vj-pro-container .section-design .switch-color-btn-container.active,
    .vj-pro-container .s5 .switch-color-btn-container.active,
    .vj-pro-container .section-design .switch-color-btn-container.animated,
    .vj-pro-container .s5 .switch-color-btn-container.animated {
        opacity: 1;
    }

    .vj-pro-container .switch-watch-swiper1 .swiper-slide:nth-child(1),
    .vj-pro-container .switch-watch-swiper1 .swiper-slide:nth-child(2),
    .vj-pro-container .switch-watch-swiper2 .swiper-slide:nth-child(1),
    .vj-pro-container .switch-watch-swiper2 .swiper-slide:nth-child(2) {
        background-size: 65.166666vw 94.00555vw;
        background-position: 125% 30%;
    }

    .vj-pro-container .aesthetics-design-container {
        background: #000;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img-wrap,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img-wrap {
        height: 100%;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img {
        width: 100%;
        height: 100%;
        transition: all 0.3s linear;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img-2,
    .vj-pro-container .aesthetics-design-container .aesthetics-design-img-3,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img-2,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img-3 {
        position: relative;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        opacity: 1;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img-2,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img-2 {
        z-index: 2;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img-3,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img-3 {
        z-index: 3;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img.active,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img.active {
        opacity: 1;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img img,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img img {
        height: 100%;
        object-fit: cover;
    }

    .vj-pro-container .aesthetics-design-container.active,
    .vj-pro-container .aesthetics-s5-container.active {
        opacity: 1;
        visibility: visible;
    }

    .vj-pro-container .aesthetics-design-background,
    .vj-pro-container .aesthetics-s5-background {
        height: auto;
    }

    .vj-pro-container .aesthetics-design-stage-container,
    .vj-pro-container .aesthetics-s5-stage-container {
        position: relative;
        opacity: 1;
        pointer-events: all;
    }

    .vj-pro-container .aesthetics-design-stage,
    .vj-pro-container .aesthetics-s5-stage {
        width: 86.111111vw;
        left: 6.944vw;
        transform: translate(0, 0);
        top: 16.666666vw;
        bottom: auto;
        font-size: 4.444444vw;
        opacity: 1;
    }

    .vj-pro-container .aesthetics-design-stage-2,
    .vj-pro-container .aesthetics-s5-stage-2 {
        transform: translate(0, 0);
        left: 6.944vw;
        top: 16.666666vw;
        opacity: 1;
    }

    .vj-pro-container .aesthetics-design-stage.active,
    .vj-pro-container .aesthetics-s5-stage.active {
        opacity: 1;
        transform: translate(0, 0);
        pointer-events: all;
    }

    .vj-pro-container .aesthetics-design-container-1 .aesthetics-design-stage-2 {
        top: 16.666666vw;
    }

    .vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-2 {
        top: 16.666666vw;
        left: 6.944vw;
    }

    .vj-pro-container .aesthetics-design-container-2 .aesthetics-design-stage-3,
    .vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-3,
    .vj-pro-container .aesthetics-s5-container-2 .aesthetics-s5-stage-3 {
        bottom: auto;
        top: 16.666666vw;
        right: auto;
        left: 6.944vw;
    }

    .vj-pro-container .aesthetics-design-close-container,
    .vj-pro-container .aesthetics-s5-close-container {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        transform: translateY(0);
        z-index: 3;
    }

    .vj-pro-container .aesthetics-design-close-text,
    .vj-pro-container .aesthetics-s5-close-text {
        margin: 0 auto;
        width: 86.111111vw;
        text-align: left;
    }

    .vj-pro-container .switch-color-text {
        opacity: 1;
    }

    .vj-pro-container .section-headline {
        padding: 27.777777vw 0 16.5vw;
    }

    .vj-pro-container .switch-container {
        width: 100%;
        overflow: hidden;
        flex-wrap: wrap;
    }

    .vj-pro-container .section-switch2 .switch-container {
        flex-wrap: wrap-reverse;
    }

    .vj-pro-container .section-switch .switch-color-btn-container {
        bottom: 8.333333vw;
    }

    .vj-pro-container .switch-color-btn-container.animated .switch-color-btn {
        animation: none;
        -webkit-animation: none;
    }

    .vj-pro-container .switch-color-btn-container .switch-color-text {
        padding: 0 6.388888vw;
    }

    .vj-pro-container .switch-color-btn-container.animated .switch-color-text {
        transition: none;
    }

    .vj-pro-container .switch-model,
    .vj-pro-container .switch-watch,
    .vj-pro-container .section-switch1 .switch-watch,
    .vj-pro-container .section-switch2 .switch-model {
        width: 100%;
    }

    .vj-pro-container .section-switch1 .switch-watch {
        transform: translateX(0);
    }

    .vj-pro-container .switch-watch-swiper .switch-img {
        width: 58.333333vw;
        padding: 14.013888vw 0 46.291666vw;
    }

    .vj-pro-container .switch-watch-swiper .swiper-slide {
        transform: translate(0, 0);
        text-align: center;
        display: block;
    }

    @keyframes switchBtn {
        0% {
            width: 0;
            transform: scale(0);
            opacity: 0;
            will-change: transform opacity;
        }

        50% {
            transform: scale(1);
            width: 53.333333vw;
            transition: all 0.3s;
            will-change: width transform;
        }

        100% {
            width: 83.333333vw;
            transition: all 0.6s;
            will-change: width;
        }
    }


    .vj-pro-container .switch-color-name,
    .vj-pro-container .section-switch2 .switch-color-name {
        bottom: 31.138888vw;
    }

    .vj-pro-container .section-switch1 .color-name,
    .vj-pro-container .section-switch2 .color-name {
        font-size: 5.833333vw;
    }

    .vj-pro-container .switch-color-btn {
        width: 51.388888vw;
        font-size: 4.444444vw;
        border-radius: 7.5277777vw;
        padding: 3.1944444vw 0 3.888888vw;
        bottom: 8.333333vw;
    }

    .vj-pro-container .switch-color-btn::after {
        width: 50%;
        border-radius: 6.5277777vw;
        height: calc(100% - 2.222222vw);
        margin: 1.111111vw;
    }

    .vj-pro-container .switch-color-btn[data-active="1"]::after {
        transform: translateX(23.5vw);
    }

    .vj-pro-container .switch-card-container {
        width: 100%;
    }

    .vj-pro-container .switch-card-col {
        flex-wrap: wrap;
    }

    .vj-pro-container .switch-card-col.active {
        margin-top: 0;
    }

    .vj-pro-container .switch-card-item {
        margin-top: 5.5555555vw;
        width: 100%;
        height: auto;
        min-height: 143vw;
    }

    .vj-pro-container .switch-card-con {
        padding: 12.569444vw 6.944444vw 0;
    }

    .vj-pro-container .switch-card-item-3 .switch-card-bottom {
        padding-bottom: 22.805555vw;
    }

    .vj-pro-container .switch-card-item-4 {
        height: 165vw;
    }

    .vj-pro-container .switch-card-item-4 .switch-card-con {
        position: relative;
    }

    .vj-pro-container .switch-card-item-4 .switch-card-bg {
        height: auto;
        object-fit: cover;
    }

    .vj-pro-container .switch-card-headline {
        font-size: 8.888888vw;
        line-height: 1.25;
        margin-bottom: 8.333333vw;
    }

    .vj-pro-container .switch-card-text {
        font-size: 4.44vw;
    }

    .vj-pro-container .card-swiper {
        height: auto;
        top: 18vw;
        padding-bottom: 41.173125vw;
    }

    .vj-pro-container .card-swiper-clock-dial {
        width: 39.406944vw;
    }

    .vj-pro-container .switch-card-shell {
        width: 49.2125vw;
        margin-top: 13.888888vw;
    }

    .vj-pro-container .switch-card-btn {
        width: 10.833333vw;
        height: 10.833333vw;
        right: 5.555555vw;
        bottom: 5.555555vw;
    }

    .vj-pro-container .section-sports .h2,
    .vj-pro-container .section-health .h2 {
        padding: 25.763888vw 0 16.666666vw;
    }

    .vj-pro-container .section-sports .sticky-viewport {
        position: relative;
        top: 0;
    }

    .vj-pro-container .sports-container {
        width: 100%;
        height: auto;
    }

    .vj-pro-container .sports-item-2,
    .vj-pro-container .sports-item-3 {
        position: relative;
    }

    .vj-pro-container .sports-bg-wrap img {
        border: 0;
    }

    .vj-pro-container .sports-text-inner {
        transition: none;
        flex-wrap: wrap;
    }

    .vj-pro-container .sports-text-inner-1,
    .vj-pro-container .sports-text-inner-2,
    .vj-pro-container .sports-text-inner-3 {
        transform: translateY(0);
        opacity: 1;
    }

    .vj-pro-container .section-sports .h3 {
        width: 86.111111vw;
        margin: 84.722222vw auto 0;
        font-size: 8.888888vw;
        text-align: left;
        max-width: 100%;
    }

    .vj-pro-container .sports-text {
        width: 86.111111vw;
        margin: 8.333333vw auto 27.777777vw;
        padding: 0;
        font-size: 4.444444vw;
    }

    .vj-pro-container .sports-shell {
        width: 58.333333vw;
        top: 63.194444vw;
    }

    .vj-pro-container .sports-clock-dial-wrap {
        width: 57.777777vw;
        top: 63.819444vw;
    }

    .vj-pro-container .section-more .h3 {
        margin-bottom: 13.888888vw;
    }

    .vj-pro-container .more-swiper-container {
        width: 88.888888vw;
        width: 100%;
        margin: 0 auto;
    }

    .vj-pro-container .more-item {
        height: 133.333333vw;
    }

    .vj-pro-container .more-item-text {
        padding: 9.722222vw 5.555555vw 0;
        margin-bottom: 0;
        will-change: transform;
        transform: translateZ(1px);
        -webkit-transform: translateZ(1px);
        -moz-transform: translateZ(1px);
        -ms-transform: translateZ(1px);
        -o-transform: translateZ(1px);
    }

    .vj-pro-container .more-item-text p {
        font-size: 4.44vw;
    }

    .vj-pro-container .more-item-2 .more-item-image {
        width: 68.555555vw;
        bottom: 9.722222vw;
    }

    .vj-pro-container .more-item-5 .more-item-image {
        width: 58.494444vw;
        bottom: 9.166666vw;
    }

    .vj-pro-container .more-item-7 .more-item-image {
        width: 64.679166vw;
        bottom: 9.166666vw;

    }

    .vj-pro-container .more-item-8 .more-item-image {
        margin: 15vw auto 16.666666vw;
    }

    .vj-pro-container .more-item-9 .more-item-image {
        width: 66.66666vw;
        margin: 25vw auto 19.444444vw;
    }

    .vj-pro-container .more-item .wx-img {
        height: 100%;
    }

    .vj-pro-container .more-item .more-item-btn,
    .vj-pro-container .item-btn {
        width: 10.833333vw;
        height: 10.833333vw;
        right: 5.555555vw;
        bottom: 5.555555vw;
    }

    .vj-pro-container .more-swiper-btn-container {
        margin-top: 8.333333vw;
        margin-right: 5.555555vw;
    }

    .vj-pro-container .more-swiper-btn-container img {
        width: 13.888888vw;
        height: 13.888888vw;
    }

    .vj-pro-container .more-swiper-btn-container .common-control-swiper-btn:hover {
        opacity: 1;
    }

    .vj-pro-container .more-swiper-btn-container .common-control-swiper-btn:active {
        opacity: 0.7;
    }

    .vj-pro-container .more-swiper-btn-container .common-control-swiper-btn.btn-disable {
        opacity: 0.3;
    }

    .vj-pro-container .section-health {
        height: auto;
    }

    .vj-pro-container .health-sticky {
        position: relative;
        height: auto;
        flex-wrap: wrap;
    }

    .vj-pro-container .section-health .health-sticky .health-bg {
        height: 133vw;
    }

    .vj-pro-container .section-health .health-content {
        position: relative;
        left: auto;
        margin: 12.5vw 6.944444vw 0;
        bottom: auto;
        width: auto;
        color: #000;
    }

    .vj-pro-container .section-health .health-text {
        color: #86868B;
        font-size: 4.444444vw;
        margin-top: 8.333333vw;
    }

}

.vj-pro-container .s12 .sticky-viewport {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.vj-pro-container .s12-canvas-wrap {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity .3s;
    z-index: 2;
}

.vj-pro-container .s12-background {
    width: 37.36458vw;
    height: 37.36458vw;
    margin: 0 auto;
    position: absolute;
    left: auto;
    top: auto;
    z-index: 2;
}

.vj-pro-container .s12-center-circle {
    width: 29.73958333vw;
    height: 29.73958333vw;
    position: absolute;
    top: auto;
    left: auto;
    opacity: 0;
    z-index: 1;
}

.vj-pro-container .s12-center-circle-top {
    z-index: 3;
}

.vj-pro-container .s12-center-circle-top .s12-name{
    position: absolute;
    left: 50%;
    top: calc(100% + 2.96875vw);
    transform: translateX(-50%) scale(1.42857142);
    transform-origin: top;
    font-weight:500;
    color:#000000;
    font-size:1.25vw;
    line-height:1.25;
    opacity: 0;
  }

.vj-pro-container .s12-center-circle.active {
    opacity: 1;
}

.vj-pro-container .s12-panda-video {
    width: 16.66666667vw;
    position: absolute;
    top: auto;
    left: auto;
}

.vj-pro-container .s12-panda-video .s12-name{
    position: absolute;
    left: 50%;
    top: calc(100% + 2.08333333vw);
    transform: translateX(-50%);
    font-weight:500;
    color:#000000;
    font-size:1.25vw;
    line-height:1.25;
    opacity: 0;
  }

.vj-pro-container .s12-left-video,
.vj-pro-container .s12-right-video {
    opacity: 0;
}

.vj-pro-container .s12-close-container {
    position: absolute;
    top: 50%;
    left: 59.375vw;
    width: 25vw;
    transform: translate(0, -50%);
    z-index: 5;
}

.vj-pro-container .s12-close-text {
    position: absolute;
    width: 100%;
    height: max-content;
}

.vj-pro-container .s12-stage {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, 50%);
    transition: all .1s;
    opacity: 0;
}

.vj-pro-container .s12-stage p {
    font-size: 1.25vw;
    color: #797C80;
}

.vj-pro-container .s12-stage-2,
.vj-pro-container .s12-stage-3 {
    z-index: 1;
}

.vj-pro-container .s12-stage-1 {
    z-index: 3;
    pointer-events: all;
    width: 30.20833333vw;
    margin-left: -2.44791667vw;
    margin-top: 0.78125vw;
}

.vj-pro-container .s12-center-watch {
    transition: all .1s;
    z-index: 1;
}

.vj-pro-container .s12-center-watch {
    width: 19.739583vw;
    position: absolute;
    left: 35.3vw;
    top: auto;
    opacity: 0;
    transform: translate(0, 0) scale(1);
}

.vj-pro-container .s12-left-img-wrap {
    position: absolute;
    width: 17.33125vw;
    top: auto;
    left: 15.625vw;
    opacity: 0;
    transform: translateX(-10%);
}

.vj-pro-container .s12-center-watch-2 {
    width: 19.739583vw;
    position: absolute;
    right: 0;
    top: 0;
    opacity: 0;
}

.vj-pro-container .s12-left-img-phone-1,
.vj-pro-container .s12-left-img-phone-2 {
    width: 100%;
}

.vj-pro-container .s12-left-img-phone-2 {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    opacity: 0;
}

@media screen and (max-aspect-ratio: 11/10) {
    .vj-pro-container .s12-trigger {
        position: relative;
        top: -50vh;
    }

    .vj-pro-container .s12 .sticky-viewport {
        width: 100%;
        display: block;
    }

    .vj-pro-container .s12-canvas-wrap {
        width: 100%;
        height: auto;
        align-items: center;
        margin-top: 20vw;
    }

    .vj-pro-container .s12-background {
        width: 100%;
        height: 100vw;
        position: relative;
        top: 0;
    }

    .vj-pro-container .s12-center-circle {
        width: 63.655555vw;
        height: 63.655555vw;
        top: auto;
    }

    .vj-pro-container .s12-close-container {
        width: 86.111111vw;
        position: static;
        margin: 3.33vw auto 0;
        transform: translate(0, 0);
    }

    .vj-pro-container .s12-close-text {
        top: 0;
        position: relative;
    }

    .vj-pro-container .s12-stage-1 {
        position: relative;
    }

    .vj-pro-container .s12-stage {
        width: 100%;
        opacity: 0;
        top: 0;
        transform: none;
    }

    .vj-pro-container .s12-stage p {
        font-size: 4.444444vw;
    }

    .vj-pro-container .s12-stage {
        transform: translateY(30%);
    }

    .vj-pro-container .s12-panda-video {
        width: 37.576388vw;
        top: auto;
    }

    .vj-pro-container .s12-left-video {
        left: 5.486111vw;
        transform: translateX(10vw);
    }

    .vj-pro-container .s12-right-video {
        left: auto;
        right: 5.486111vw;
        transform: translateX(-10vw);
    }

    .vj-pro-container .s12-center-watch {
        width: 35.058333vw;
        left: auto;
        right: 6.666666vw;
        top: 36vw;
        transform: translateX(10%) scale(1);
        transform-origin: center;
    }

    .vj-pro-container .s12-left-img-wrap {
        width: 43.294444vw;
        height: 93.26944vw;
        left: 9.722222vw;
        top: 23vw;
        transform: translateX(-10%);
        opacity: 0;
    }

    .vj-pro-container .s12-left-img-phone {
        width: 100%;
    }

    .vj-pro-container .s12-center-watch-2 {
        width: 100%;
        position: absolute;
        right: 0;
        top: 0;
    }

    .vj-pro-container .s12-stage-2,
    .vj-pro-container .s12-stage-3 {
        margin-top: 12vw;
    }
}

.vj-pro-container .section-status {
    overflow: hidden;
}

.vj-pro-container .section-status .h3 {
    width: 100%;
    text-align: center;
    margin-top: 9.895833vw;
    margin-bottom: 5.208333vw;
}

.vj-pro-container .section-status h4 {
    font-size: 1.666667vw;
    line-height: 1.25;
    font-weight: bold;
}

.vj-pro-container .section-status .status-swiper {
    transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.vj-pro-container .section-status .status-swiper .status-item {
    width: 39.84375vw;
    height: auto;
    padding: 3.125vw 4.166666vw 2.083333vw;
    margin-right: 1.5625vw;
    box-sizing: border-box;
}

.vj-pro-container .section-status .status-swiper .status-item .img-box {
    width: 26.389583vw;
    margin: 1.5625vw auto 3.125vw;
}

.vj-pro-container .section-status .status-swiper .status-item p {
    font-size: 1.041666vw;
    line-height: 1.6;
    margin-top: 1.041666vw;
    color: #797C80;
}

.vj-pro-container .section-status .status-swiper .status-item .status-item-des {
    font-size: 0.625vw;
    color: #86868B;
}

.vj-pro-container .section-status .status-swiper .status-item-1 {
    background: #F5F5F7;
    margin-left: calc((100% - 81.25vw)/2);
}

.vj-pro-container .section-status .status-swiper .status-item-2 {
    background: linear-gradient(to bottom, #E6E6F4, #C6C7DA);
}

.vj-pro-container .section-status .status-swiper .status-item-3 {
    background: #F5F5F7;
    margin-right: calc((100% - 81.25vw)/2);
}

.vj-pro-container .section-status .status-swiper .swiper-btn-box {
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 2.0833333vw;
    margin-right: 8.85vw;
}

.vj-pro-container .section-status .status-swiper .swiper-btn-box img {
    height: 100%;
    object-fit: contain;
}

.vj-pro-container .section-status .status-swiper .swiper-button-next,
.vj-pro-container .section-status .status-swiper .swiper-button-prev {
    width: 2.5vw;
    height: 2.5vw;
    position: relative;
    left: auto;
    right: auto;
    top: 0;
    margin-top: 0;
    transition: all 100ms linear;
}

.vj-pro-container .section-status .status-swiper .swiper-button-next {
    margin-left: 0.833333vw;
}

.vj-pro-container .section-status .status-swiper .swiper-button-next::after,
.vj-pro-container .section-status .status-swiper .swiper-button-prev::after {
    content: '';
}

.vj-pro-container .section-status .status-swiper .swiper-button-prev:hover,
.vj-pro-container .section-status .status-swiper .swiper-button-next:hover {
    opacity: .7;
}

.vj-pro-container .section-status .status-swiper .swiper-button-prev:active,
.vj-pro-container .section-status .status-swiper .swiper-button-next:active {
    opacity: 1;
}

.vj-pro-container .section-status .status-swiper .swiper-button-disabled {
    opacity: .3;
    pointer-events: none;
}

@media screen and (max-aspect-ratio: 11/10) {
    .vj-pro-container .section-status .h3 {
        margin: 0 auto 16.666666vw;
    }

    .vj-pro-container .section-status h4 {
        font-size: 6.666666vw;
    }

    .vj-pro-container .section-status .status-swiper .status-item {
        height: auto;
        margin: 0 auto;
        padding: 10vw 5.555555vw 16.666666vw;
    }

    .vj-pro-container .section-status .status-swiper .status-item p {
        font-size: 4.444444vw;
        margin-top: 6.944444vw;
    }

    .vj-pro-container .section-status .status-swiper .status-item .status-item-des {
        font-size: 3.333333vw;
    }

    .vj-pro-container .section-status .status-swiper .status-item .img-box {
        width: 71.645833vw;
        margin: 11.111111vw auto 13.888888vw;
    }

    .vj-pro-container .section-status .status-swiper .swiper-button-next,
    .vj-pro-container .section-status .status-swiper .swiper-button-prev {
        width: 13.888888vw;
        height: 13.888888vw;
    }

    .vj-pro-container .section-status .status-swiper .swiper-button-next:hover,
    .vj-pro-container .section-status .status-swiper .swiper-button-prev:hover {
        opacity: 1;
    }

    .vj-pro-container .section-status .status-swiper .swiper-button-next:active,
    .vj-pro-container .section-status .status-swiper .swiper-button-prev:active {
        opacity: 0.7;
    }

    .vj-pro-container .section-status .status-swiper .swiper-button-prev.swiper-button-disabled,
    .vj-pro-container .section-status .status-swiper .swiper-button-next.swiper-button-disabled {
        opacity: 0.3;
    }

    .vj-pro-container .section-status .status-swiper .swiper-btn-box {
        margin-top: 8.333333vw;
        margin-right: 5.555555vw;
    }

    .vj-pro-container .section-status .status-swiper .swiper-button-next {
        margin: 0 0 0 5.555555vw;
    }
}

.vj-pro-container .s13 {
    display: flex;
    margin: 0 auto;
    width: 81.25vw;
    flex-wrap: wrap;
}

.vj-pro-container .s13 .h3 {
    width: 100%;
    text-align: center;
    margin-top: 9.895833vw;
    margin-bottom: 5.208333vw;
}

.vj-pro-container .s13 .s13-section-left {
    width: 40vw;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    background: #F5F5F7;
}

.vj-pro-container .s13 .s13-section-left .s13Swiper {
    width: 40vw;
    height: 37.5vw;
}

.vj-pro-container .s13 .s13-section-left .s13Swiper .swiper-wrapper .swiper-slide {
    transition: opacity .3s;
}

.vj-pro-container .s13 .s13-section-left .s13Swiper .swiper-wrapper .swiper-slide .s7-watch-dial {
    width: 22.465625vw;
    height: auto;
    margin: 0 auto;
}

.vj-pro-container .s13 .s13-section-left .s13Swiper .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
}


.vj-pro-container .s13 .s13-section-left .s13Swiper .swiper-slide-1 .s7-watch-dial-1 {
    z-index: 2;
}

.vj-pro-container .s13 .s13-section-left .s13Swiper .swiper-slide-1 .s13-slide1-video {
    position: absolute;
    width: 13.498437vw;
    border-radius: 50%;
    overflow: hidden;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.vj-pro-container .s13 .s13-section-right {
    width: 41.25vw;
    background: #f5f5f7;
    position: relative;
    overflow: hidden;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title {
    width: 30.833333vw;
    position: absolute;
    top: 4.947916vw;
    left: 5.208333vw;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .swiper-wrapper {
    display: block;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-item {
    width: 100%;
    position: relative;
    padding-bottom: 1.302083vw;
    margin-top: 1.041666vw;
    cursor: pointer;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-item-1 {
    margin-top: 0;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-item-5 {
    border: none;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-item h4 {
    font-size: 1.666667vw;
    line-height: 1.25;
    transition: 0.5s all ease-in-out;
    color: #86868b;
    font-weight: bold;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-top .s13-section-right-title-top-icon {
    width: 1.041667vw;
    height: 1.041667vw;
    position: relative;
    flex-shrink: 0;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title img {
    opacity: 0;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-top .s13-section-right-title-top-icon img {
    width: 100%;
    position: absolute;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-top .s13-section-right-title-top-icon img.close {
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-top .s13-section-right-title-top-icon img.open {
    top: 0;
    left: 0;
}

.vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-item p {
    font-size: max(0.9375vw, 12px);
    color: #797c80;
    transition: 0.5s all ease-in-out;
    overflow: hidden;
}

.vj-pro-container .linkga .link-to {
    transition: transform .3s ease-out;
    display: inline-block;
}

.vj-pro-container .linkga:hover .link-to {
    transform: translateX(3px);
}

.vj-pro-container .section span.blue {
    color: #0066CC;
}

@media screen and (min-aspect-ratio: 11/10) {

    .vj-pro-container .section-reasons .swiper-button-center .swiper-pagination-bullet:hover {
        opacity: .8;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="0"] .s13-section-right-title-item-1 h4 {
        color: #000000;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="0"] .s13-section-right-title-item-1 img.close {
        opacity: 1;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="0"] .s13-section-right-title-item-2 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="0"] .s13-section-right-title-item-3 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="0"] .s13-section-right-title-item-4 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="0"] .s13-section-right-title-item-5 img.open {
        opacity: 1;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="0"] .s13-section-right-title-item-1 p {
        margin-top: 1.041667vw;
        height: var(--s13p1) !important;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="1"] .s13-section-right-title-item-2 h4 {
        color: #000000;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="1"] .s13-section-right-title-item-2 img.close {
        opacity: 1;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="1"] .s13-section-right-title-item-1 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="1"] .s13-section-right-title-item-3 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="1"] .s13-section-right-title-item-4 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="1"] .s13-section-right-title-item-5 img.open {
        opacity: 1;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="1"] .s13-section-right-title-item-2 p {
        margin-top: 1.041667vw;
        height: var(--s13p2) !important;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="2"] .s13-section-right-title-item-3 h4 {
        color: #000000;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="2"] .s13-section-right-title-item-3 img.close {
        opacity: 1;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="2"] .s13-section-right-title-item-2 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="2"] .s13-section-right-title-item-1 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="2"] .s13-section-right-title-item-4 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="2"] .s13-section-right-title-item-5 img.open {
        opacity: 1;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="2"] .s13-section-right-title-item-3 p {
        margin-top: 1.041667vw;
        height: var(--s13p3) !important;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="3"] .s13-section-right-title-item-4 h4 {
        color: #000000;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="3"] .s13-section-right-title-item-4 img.close {
        opacity: 1;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="3"] .s13-section-right-title-item-2 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="3"] .s13-section-right-title-item-3 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="3"] .s13-section-right-title-item-1 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="3"] .s13-section-right-title-item-5 img.open {
        opacity: 1;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="3"] .s13-section-right-title-item-4 p {
        margin-top: 1.041667vw;
        height: var(--s13p4) !important;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="4"] .s13-section-right-title-item-5 h4 {
        color: #000000;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="4"] .s13-section-right-title-item-5 img.close {
        opacity: 1;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="4"] .s13-section-right-title-item-2 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="4"] .s13-section-right-title-item-3 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="4"] .s13-section-right-title-item-4 img.open,
    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="4"] .s13-section-right-title-item-1 img.open {
        opacity: 1;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title[data-active="4"] .s13-section-right-title-item-5 p {
        margin-top: 1.041667vw;
        height: var(--s13p5) !important;
    }
}

@media screen and (max-aspect-ratio: 11/10) {
    .vj-pro-container .s13 {
        width: 100%;
        overflow: hidden;
    }

    .vj-pro-container .s13 .h3 {
        font-size: 8.888889vw;
        margin: 26.388888vw auto 13.888888vw;
    }

    .vj-pro-container .s13 .s13-section-left {
        width: 100%;
    }

    .vj-pro-container .s13 .s13-section-left .s13Swiper {
        width: 100%;
        height: auto;
    }

    .vj-pro-container .s13 .s13-section-right {
        width: 100%;
        padding-top: 13.333333vw;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title {
        width: 100%;
        position: static;

    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title .swiper-wrapper {
        display: flex;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-item {
        padding-bottom: 0;
        cursor: auto;
        border-bottom: none;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-item h4 {
        font-size: 6.666667vw;
        padding: 0 6.666666vw;
        color: #000000;
        font-weight: bold;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-item p {
        font-size: 4.444444vw;
        font-weight: 500;
        color: #86868B;
        margin-top: 8.333333vw;
        padding: 0 5.555555vw 0 6.666666vw;
        overflow: hidden;
    }

    .vj-pro-container .s13 .s13-section-right .swiper-btn-box {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        margin-top: 13.888889vw;
        margin-bottom: 8.333333vw;
    }

    .vj-pro-container .s13 .s13-section-right .swiper-btn-box .swiper-button-next,
    .vj-pro-container .s13 .s13-section-right .swiper-btn-box .swiper-button-prev {
        position: initial;
        width: 13.888889vw;
        height: 13.888889vw;
        border-radius: 50%;
    }

    .vj-pro-container .s13 .s13-section-right .swiper-btn-box .swiper-button-next.swiper-button-disabled,
    .vj-pro-container .s13 .s13-section-right .swiper-btn-box .swiper-button-prev.swiper-button-disabled {
        opacity: 0.3;
    }

    .vj-pro-container .s13 .s13-section-right .swiper-btn-box .swiper-button-next::after,
    .vj-pro-container .s13 .s13-section-right .swiper-btn-box .swiper-button-prev::after {
        content: ""
    }

    .vj-pro-container .s13 .s13-section-right .swiper-btn-box .swiper-button-next {
        margin-left: 5.555556vw;
        margin-right: 5.555556vw;
    }

    .vj-pro-container .s13 .s13-section-left .s13Swiper .swiper-wrapper .swiper-slide .s7-watch-dial {
        width: 82.247222vw;
        padding: 13.888888vw 0 0;
    }

    .vj-pro-container .s13 .s13-section-left .s13Swiper .swiper-slide-1 .s13-slide1-video {
        width: 82.247222vw;
    }
}

.vj-pro-container .s14 {
    width: 100%;
    background-image: linear-gradient(180deg, #fff 0%, #E8E8ED 100%);
}

.vj-pro-container .s14 .s14-container {
    display: flex;
    width: 81.25vw;
    margin: 0 auto;
    padding: 10.416666vw 0 0;
    align-items: center;
}

.vj-pro-container .s14 .s14-content {
    width: 25.57291vw;
    flex-shrink: 0;
    text-align: left;
}

.vj-pro-container .s14 .h3 {
    font-size: 3.333333vw;
    font-weight: bold;
}

.vj-pro-container .s14 p {
    font-size: 1.25vw;
    margin: 1.5625vw 0 0;
    color: #797C80;
}

.vj-pro-container .s14 .s14-imgbox {
    width: 46.6739581vw;
    flex-shrink: 0;
    margin-left: auto;
}

@media screen and (max-aspect-ratio: 11/10) {
    .vj-pro-container .s14 .s14-container {
        flex-wrap: wrap;
        width: 89.0125vw;
        padding: 29.166666vw 0 0;
    }

    .vj-pro-container .s14 .s14-content {
        width: 86.111111vw;
        margin: 0 auto;
    }

    .vj-pro-container .s14 .h3 {
        font-size: 8.888889vw;
        font-weight: bold;
    }

    .vj-pro-container .s14 p {
        font-size: 4.444444vw;
        font-weight: 500;
        color: #86868B;
        text-align: left;
        margin-top: 8.333333vw;
        width: 86.111111vw;
    }

    .vj-pro-container .s14 .s14-imgbox {
        width: 100%;
        margin: 14.013888vw auto 0;
    }

}

.vj-pro-container .s15 .h2 {
    margin-top: 10.416666vw;
}

.vj-pro-container .s15 .s15-container .s15-container-top {
    display: flex;
    margin: 6.25vw auto 0;
    width: 81.25vw;
}

.vj-pro-container .s15 .s15-container .s15-container-left {
    width: 39.84375vw;
    height: 37.5vw;
    position: relative;
    overflow: hidden;
}

.vj-pro-container .s15 .s15-container .s15-container-left .imgbox-bg {
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
}

.vj-pro-container .s15 .s15-container .s15-container-left .s15-container-left-item-bg {
    position: relative;
    z-index: 2;
}

.vj-pro-container .s15 .s15-container .s15-container-right {
    width: 39.84375vw;
    height: 37.5vw;
    background-color: #f5f5f7;
    position: relative;
}

.vj-pro-container .s15 .s15-container .s15-container-right .imgbox-bg {
    width: 16.534895vw;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    z-index: 1;
}

.vj-pro-container .s15 .s15-container p {
    width: auto;
    font-size: 1.041667vw;
    color: #86868b;
    margin: 3.125vw auto 0;
    font-weight: 500;
}

.vj-pro-container .s15 .s15-container p span {
    color: #000;
    font-weight: 500;
}

.vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .imgbox-bg {
    width: 16.527083vw;
    margin: 3.125vw auto 0;
    position: relative;
}

.vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .s15-container-bottom-item-mian {
    position: absolute;
    top: 9.410417vw;
    left: 50%;
    transform: translateX(-50%);
    width: 13.177083vw;
}

.vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .s15-container-bottom-item-mian .img-1 {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
}

.vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .s15-container-bottom-item-mian .img-2 {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    opacity: 0;
    will-change: opacity;
}

.vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .s15-container-bottom-item-arrow {
    position: absolute;
    right: -3.458333vw;
    opacity: 0;
    width: 2.708333vw;
}

.vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .s15-container-bottom-item-arrow-1 {
    top: 7.3vw;
    right: -3.2vw;
}

.vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .s15-container-bottom-item-arrow-2 {
    top: 20.7vw;
    right: -2.3vw;
}

.vj-pro-container .s15 .s15-container .s15-container-btn {
    width: 1.875vw;
    height: 1.875vw;
    position: absolute;
    right: 1.041666vw;
    bottom: 1.041666vw;
    opacity: 0;
    cursor: pointer;
    pointer-events: none;
}

.vj-pro-container .s15 .s15-container .s15-container-btn .s15-container-bottom-item-img {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
}

.vj-pro-container .s15 .s15-container .s15-container-right .s15-container-btn {
    opacity: 1;
}

.vj-pro-container .s15 .s15-container .s15-container-right .s15-container-btn-img {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    z-index: 2;
    pointer-events: none;
}

.vj-pro-container .s15 .s15-container .s15-container-right .s15-container-btn-img.active {
    opacity: 1;
    pointer-events: all;
}

.vj-pro-container .s15 .s15-container .s15-container-right {
    margin-left: 1.5625vw;
}

.vj-pro-container .s15 .s15-container .s15-container-left .s15-container-bottom-item,
.vj-pro-container .s15 .s15-container .s15-container-right .s15-container-right-item {
    padding: 0 2.8125vw;
}

.vj-pro-container .s15 .s15-container .s15-container-right .s15-container-right-item-main {
    margin-top: 6.25vw;
    width: 100%;
    pointer-events: all;
    transition: all 0.5s ease;
}

.vj-pro-container .s15 .s15-container .s15-container-right .s15-container-right-item-main .swiper-wrapper {
    display: flex;
    align-items: center;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom {
    margin: 6.25vw auto 0;
    position: relative;
    overflow: hidden;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-wrapper {
    height: 35.41666vw;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-btn-box {
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 2.0833333vw;
    margin-right: 8.85vw;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-btn-box img {
    height: 100%;
    object-fit: contain;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-button-next,
.vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-button-prev {
    width: 2.5vw;
    height: 2.5vw;
    position: relative;
    left: auto;
    right: auto;
    top: 0;
    margin-top: 0;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-button-next {
    margin-left: 0.833333vw;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-button-next::after,
.vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-button-prev::after {
    content: '';
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item {
    width: 26.041667vw;
    height: auto;
    margin-right: 1.5625vw;
    overflow: hidden;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item p {
    width: 21.875vw;
    margin: 0 auto;
    margin-top: 3.125vw;
}

.vj-pro-container .s15 .s15-container .s15-container-left {
    background-image: linear-gradient(0deg, #e0d1bb 0%, #e8ddcb 40%, #fcfaf5 105%);
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-1 .img-box {
    width: 15.766145vw;
    margin: 3.125vw auto 2.098958vw;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-2 {
    background: #F5F5F7;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-2 .img-box {
    width: 100%;
    margin: 3.645833vw auto;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-3 {
    background: linear-gradient(to bottom, #E6E6F4, #C6C7DA);
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-3 .img-box {
    width: 21.302083vw;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-4 .img-bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-4 .img-bg img {
    height: 100%;
    object-fit: cover;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-4 .img-box {
    width: 15.596875vw;
    margin: 2.604166vw auto 0;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-4 p {
    color: #D6D6D6;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-4 p span {
    color: #fff;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-5 {
    background: linear-gradient(to bottom, #FCFAF5, #E0D1BB);
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-5 .img-box {
    width: 15.596875vw;
    margin: 2.604166vw auto 0;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-6 {
    background: #F5F5F7;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-6 .img-box {
    width: 17.304687vw;
    margin: 4.6875vw auto 0;
}

.vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item:last-child {
    margin-right: 0;
}

.vj-pro-container .popup-btn-linkga {
    line-height: 1;
    display: inline-block;
    vertical-align: middle;
}

@media screen and (max-aspect-ratio: 11/10) {
    .vj-pro-container .s15 {
        width: 100%;
        overflow: hidden;
    }

    .vj-pro-container .s15 .h2 {
        margin-top: 25.819444vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-top {
        display: flex;
        flex-wrap: wrap;
        margin: 16.666667vw auto 0;
        width: 100%;
    }

    .vj-pro-container .s15 .s15-container .s15-container-left {
        height: 144vw;
        width: 100%;
    }

    .vj-pro-container .s15 .s15-container .s15-container-left .s15-container-bottom-item,
    .vj-pro-container .s15 .s15-container .s15-container-right .s15-container-right-item {
        padding: 0;
    }

    .vj-pro-container .s15 .s15-container .s15-container-right {
        height: 134.583333vw;
        width: 100%;
    }

    .vj-pro-container .s15 .s15-container .s15-container-right .imgbox-bg {
        width: 56.077777vw;
    }

    .vj-pro-container .s15 .s15-container p {
        width: 86.111111vw;
        font-size: 4.444444vw;
        margin: 13.888889vw auto 0;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-wrapper {
        height: 133.333333vw;
    }

    .vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .imgbox-bg {
        width: 51.834722vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-left .s15-container-bottom-item .imgbox-bg {
        width: 55.555556vw;
        margin: 14.888888vw auto 0;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-button-next,
    .vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-button-prev {
        width: 13.888888vw;
        height: 13.888888vw;
    }

    .vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .s15-container-bottom-item-mian {
        position: absolute;
        top: 30.555556vw;
        left: 50%;
        transform: translateX(-50%);
        width: 44.444444vw;
    }

    .vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .s15-container-bottom-item-arrow {
        position: absolute;
        right: -11.472222vw;
        opacity: 0;
        width: 10vw;
    }

    .vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .s15-container-bottom-item-arrow-1 {
        top: 22.361111vw;
    }

    .vj-pro-container .s15 .s15-container-left .s15-container-bottom-item .s15-container-bottom-item-arrow-2 {
        right: -8.388889vw;
        top: 70.472222vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-right {
        margin-left: 0;
        margin-top: 5.555555vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-right .s15-container-right-item {
        padding: 0 6.944444vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-right .s15-container-right-item-main {
        margin-top: 11.111111vw;
        width: 100%;
        margin-bottom: 25vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-btn {
        width: 10.833333vw;
        height: 10.833333vw;
        right: 5.555555vw;
        bottom: 5.555555vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom {
        width: 100%;
        margin: 27.777778vw auto 0;
        overflow: hidden;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item {
        width: 100%;
        height: auto;
        margin: 0 auto;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item p {
        width: 77.777778vw;
        margin: 0 auto;
        margin-top: 11.111111vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-1 .img-box {
        width: 58.333333vw;
        margin: 11.111111vw auto 8.888889vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-2 .img-box {
        width: 100%;
        margin: 11.111111vw auto 8.888889vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-3 .img-box {
        width: 73.472222vw;
        margin: 0 auto;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-4 .img-box,
    .vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-5 .img-box {
        width: 52.893055vw;
        margin: 18.61111vw auto 11.111111vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .s15-container-bottom-item-6 .img-box {
        width: 67.883333vw;
        margin: 18.222222vw auto 0;
    }

    .vj-pro-container .s15 .s15-container .swiper-btn-box {
        display: flex;
        justify-content: flex-end;
        align-items: flex-end;
        margin-top: 8.333333vw;
        height: 13.888889vw;
    }

    .vj-pro-container .s15 .swiper-btn-box .swiper-button-next,
    .vj-pro-container .s15 .swiper-btn-box .swiper-button-prev {
        position: initial;
        width: 13.888889vw;
        height: 13.888889vw;
        border-radius: 50%;
        background-color: #DEDEE2;
    }

    .vj-pro-container .s15 .swiper-btn-box .swiper-button-next.swiper-button-disabled,
    .vj-pro-container .s15 .swiper-btn-box .swiper-button-prev.swiper-button-disabled {
        opacity: .3;
    }

    .vj-pro-container .s15 .swiper-btn-box .swiper-button-next::after,
    .vj-pro-container .s15 .swiper-btn-box .swiper-button-prev::after {
        content: ""
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-btn-box {
        margin-top: 8.333333vw;
        margin-right: 5.555555vw;
    }

    .vj-pro-container .s15 .s15-container .s15-container-bottom .swiper-button-next {
        margin: 0 0 0 5.555555vw;
    }

    .vj-pro-container .s15 .swiper-btn-box .swiper-button-next:hover,
    .vj-pro-container .s15 .swiper-btn-box .swiper-button-prev:hover {
        opacity: auto;
    }

    .vj-pro-container .s15 .swiper-btn-box .swiper-button-next:active,
    .vj-pro-container .s15 .swiper-btn-box .swiper-button-prev:active {
        opacity: .7;
    }
}

.vj-pro-container .s16 {
    display: flex;
    padding: 5.208333vw 0;
    margin: 7.291667vw auto 0;
    height: auto;
    width: 81.25vw;
    background-color: #f5f5f7;
}

.vj-pro-container .s16 .text-box {
    font-size: 2.1875vw;
    line-height: 1.25;
    font-weight: bold;
    width: 22vw;
    color: #000;
    margin-left: 4.166667vw;
    margin-right: 8.333333vw;
    align-self: center;
}

.vj-pro-container .s16 .s16-items {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}

.vj-pro-container .s16 .s16-item {
    width: 17.625vw;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
}

.vj-pro-container .s16 .s16-item-1 {
    margin-right: 6.510417vw;
    padding-top: 0.901041vw;
}

.vj-pro-container .s16 .s16-item-2 {
    padding-top: 0.901041vw;
}

.vj-pro-container .s16 .s16-item p {
    font-weight: 500;
    font-size: 1.041667vw;
    color: #86868b;
}

.vj-pro-container .s16 .s16-item h3 {
    font-weight: 500;
    font-size: 1.041667vw;
    color: #86868b;
}

.vj-pro-container .s16 .s16-item .s16-item-main {
    display: flex;
    margin-top: 0.760416vw;
}

.vj-pro-container .s16 .s16-item .s16-item-main p {
    font-size: 0.729167vw;
    font-size: max(0.729167vw, 12px);
    font-weight: 500;
}

.vj-pro-container .s16 .s16-item .s16-item-main .bottom {
    margin-top: 1.5625vw;
}

.vj-pro-container .s16 .s16-item .s16-item-main .icon {
    font-size: 3.333333vw;
    font-weight: 500;
    line-height: 1.3;
}

.vj-pro-container .s16 .s16-item-1 .s16-item-main .icon {
    color: #35689f;
}

.vj-pro-container .s16 .s16-item-2 .s16-item-main .icon {
    color: #aa7c4d;
}

.vj-pro-container .s16 .s16-item .s16-item-main .icon .icon-headline {
    display: inline-block;
}

.vj-pro-container .s16 .s16-item .s16-item-main .icon span {
    font-size: 1.25vw;
    margin-left: 0;
}

.vj-pro-container .s16 .s16-item .s16-item-main .s16-item-main-left {
    margin-right: 2.5vw;
    white-space: nowrap;
}

@media screen and (max-aspect-ratio: 11/10) {
    .vj-pro-container .s16 {
        flex-wrap: wrap;
        margin: 0;
        margin-top: 27.777778vw;
        padding: 0;
        width: 100%;
        height: auto;
    }

    .vj-pro-container .s16 .text-box {
        width: 100%;
        font-size: 8.888889vw;
        margin: 0;
        margin-top: 12.5vw;
        padding-left: 6.944444vw;
        padding-right: 7.333333vw;
    }

    .vj-pro-container .s16 .s16-item {
        width: 86.111111vw;
        margin-top: 11.166666vw;
        margin-left: 6.944444vw;
        padding-top: 4.875vw;
    }

    .vj-pro-container .s16 .s16-item p {
        font-size: 4.444444vw;
        color: #86868b;
    }

    .vj-pro-container .s16 .s16-item h3 {
        font-size: 4.444444vw;
        color: #86868b;
    }

    .vj-pro-container .s16 .s16-item .s16-item-main {
        margin-top: 6.305555vw;
    }

    .vj-pro-container .s16 .s16-item .s16-item-main p {
        font-size: 3.333333vw;
    }

    .vj-pro-container .s16 .s16-item .s16-item-main .bottom {
        margin-top: 5.333333vw;
    }

    .vj-pro-container .s16 .s16-item .s16-item-main .icon {
        font-size: 13.888889vw;
        line-height: 1.25;
    }

    .vj-pro-container .s16 .s16-item .s16-item-main .icon span {
        font-size: 5.277778vw;
        margin-left: 1vw;
    }

    .vj-pro-container .s16 .s16-item .s16-item-main .s16-item-main-left {
        margin-right: 13.888888vw;
    }

    .vj-pro-container .s16 .s16-item-2 {
        margin-top: 11.236111vw;
        margin-bottom: 16.666667vw;
    }
}

.vj-pro-container .s16-1 {
    width: 81.25vw;
    margin: 0 auto;
    margin-top: 1.5625vw;
    display: flex;
}

.vj-pro-container .s16-1 .s16-1-item {
    width: 39.84375vw;
    background-color: #F5F5F7;
    padding-left: 4.166667vw;
    padding-right: 4.166667vw;
    position: relative;
}

.vj-pro-container .s16-1 .s16-1-item h3 {
    font-size: 2.1875vw;
    line-height: 1.25;
    font-weight: bold;
    color: #000;
    margin-top: 4.166667vw;
}

.vj-pro-container .s16-1 .s16-1-item p {
    font-weight: 500;
    font-size: 1.041667vw;
    color: #86868B;
    width: 31.458333vw;
    margin-top: 1.5625vw;
}

.vj-pro-container .s16-1 .s16-1-item-1 {
    margin-right: 1.5625vw;
}

.vj-pro-container .s16-1 .s16-1-item-1 .imgbox {
    width: 25.625vw;
    position: relative;
    margin: 4.766666vw auto 0;
}

.vj-pro-container .s16-1 .s16-1-item-2 a {
    color: #0066CC;
    display: block;
    margin-top: 1.5625vw;
    font-size: 1.041667vw;
    font-weight: 500;
}

.vj-pro-container .s16-1 .s16-1-item-2 .imgbox {
    width: 26.822917vw;
    position: relative;
    margin: 5.208333vw auto 5vw;
}

@media screen and (max-aspect-ratio: 11/10) {
    .vj-pro-container .s16-1 {
        width: 100%;
        margin: 0;
        margin-top: 5.555556vw;
        flex-wrap: wrap;
    }

    .vj-pro-container .s16-1 .s16-1-item {
        width: 100%;
        height: auto;
        padding-left: 0;
        padding-right: 0;
    }

    .vj-pro-container .s16-1 .s16-1-item h3 {
        font-size: 8.888889vw;
        margin-top: 12.5vw;
        margin-left: 6.944444vw;
        margin-right: 6.944444vw;
    }

    .vj-pro-container .s16-1 .s16-1-item p {
        font-size: 4.444444vw;
        color: #86868B;
        width: auto;
        margin-top: 8.333333vw;
        margin-left: 6.944444vw;
        margin-right: 6.944444vw;
    }

    .vj-pro-container .s16-1 .s16-1-item-1 {
        margin-right: 0;
    }

    .vj-pro-container .s16-1 .s16-1-item-1 .imgbox {
        width: 100%;
        margin: 0 auto;
        margin-top: 13.888889vw;
        transform: none;
        position: static;
    }

    .vj-pro-container .s16-1 .s16-1-item-2 {
        margin-top: 5.555556vw;
    }

    .vj-pro-container .s16-1 .s16-1-item-2 a {
        margin-top: 8.333333vw;
        margin-left: 6.944444vw;
        font-size: 4.444444vw;
    }

    .vj-pro-container .s16-1 .s16-1-item-2 .imgbox {
        width: 26.822917vw;
        position: static;
        margin: 0 auto;
        margin-top: 13.888889vw;
        margin-bottom: 16.666667vw;
        transform: none;
        width: 83.333333vw;
    }
}

.vj-pro-container .section-footnote {
    width: 67.5vw;
    margin: 0 auto;
    margin-top: 10.416667vw;
    line-height: 1.6;
    font-weight: 500;
    color: #86868b;
}

.vj-pro-container .section-footnote .section-content {
    font-size: 0.625vw;
    font-size: max(0.625vw, 12px);
    list-style-type: decimal;
    margin-bottom: 10.416667vw;
}

.vj-pro-container .section-footnote .price::before {
    content: "*";
    position: absolute;
    top: 0;
    left: -9px;
}

.vj-pro-container .section-footnote .price {
    list-style: none;
    position: relative;
}

.vj-pro-container .section-footnote li.current {
    color: #000;
}

.vj-pro-container .section-footnote .section-content li a {
    color: #2997ff;
    word-wrap: break-word;
}

@media screen and (max-aspect-ratio: 11/10) {
    .vj-pro-container .section-footnote {
        width: 86.111111vw;
        margin: 0 auto;
        margin-top: 27.777778vw;
        color: #86868b;
    }

    .vj-pro-container .section-footnote .section-content {
        font-size: 3.333333vw;
        margin-bottom: 27.777778vw;
        padding-left: 2em;
    }
}

@media screen and (max-width: 800px) and (min-aspect-ratio: 11 / 10) {
    .vj-pro-container .s16 .s16-item .s16-item-main p {
        font-size: 0.729167vw;
    }

    .vj-pro-container .section-footnote .section-content {
        font-size: 0.625vw;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-item p {
        font-size: 0.9375vw;
    }
}

@media screen and (min-width: 1023px) and (max-width: 1281px)and (orientation: landscape) {
    .vj-pro-container .s16 .s16-item .s16-item-main p {
        font-size: 0.729167vw;
    }

    .vj-pro-container .s13 .s13-section-right .s13-section-right-title .s13-section-right-title-item p {
        font-size: 0.9375vw;
    }
}

html.html-model-active {
    margin-right: var(--scrollbar-width);
}

html.html-model-active body {
    overflow: hidden !important;
}

html.html-model-active #second-navigation-v4 .product-tabs__heading {
    margin-right: var(--scrollbar-width);
}

@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
    .vj-pro-container .backdrop-filter {
        background-color: rgba(0, 0, 0, 0.5);
        -webkit-backdrop-filter: saturate(180%) blur(30px);
        backdrop-filter: saturate(180%) blur(30px);
    }
}

.vj-pro-container .slideup-popup-container {
    position: fixed;
    z-index: 200;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    visibility: hidden;
    justify-content: flex-end;
    pointer-events: none;
}

.vj-pro-container .slideup-popup-container .content-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transition: opacity .4s;
    opacity: 0;
}

.vj-pro-container .slideup-popup-1 {
    flex-direction: row;
    align-items: center;
}

.vj-pro-container .slideup-popup-1 .popup-image-wrap {
    width: 24.791666vw;
}

.vj-pro-container .slideup-popup-container .popup-content {
    position: relative;
    width: 67.5vw;
    margin: 1% auto;
    background-color: #FFFFFF;
    transition: transform .4s;
    transform: translateY(100vh);
    border-radius: 0.833333vw;
    overflow-y: scroll;
    scrollbar-width: none;
}

.vj-pro-container .slideup-popup-1 .popup-content-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 2.8125vw 3.0208333vw;
}

.vj-pro-container .slideup-popup-2 .popup-media-wrap {
    width: 100%;
    position: relative;
}

.slideup-popup-1-active .vj-pro-container .slideup-popup-1,
.slideup-popup-2-active .vj-pro-container .slideup-popup-2 {
    pointer-events: all;
}

.slideup-popup-1-active .vj-pro-container .slideup-popup-1,
.slideup-popup-2-active .vj-pro-container .slideup-popup-2 {
    visibility: visible;
}

.slideup-popup-1-active .vj-pro-container .slideup-popup-1 .content-overlay,
.slideup-popup-2-active .vj-pro-container .slideup-popup-2 .content-overlay {
    opacity: 1;
}

.slideup-popup-1-active .vj-pro-container .slideup-popup-1 .popup-content,
.slideup-popup-2-active .vj-pro-container .slideup-popup-2 .popup-content {
    transform: translateY(0%);
}

.vj-pro-container .popup-content .popup-headline-wrap {
    width: 40.958333vw;
    margin: 4.84375vw auto 0 5.625vw;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.vj-pro-container .popup-content .popup-headline {
    width: 29.14583vw;
    font-size: 2.5vw;
    line-height: 1.25;
    font-weight: bold;
    text-align: left;
}

.vj-pro-container .popup-content .popup-headline-image {
    width: 4.58333vw;
    margin-left: 0;
    vertical-align: middle;
}

.vj-pro-container .slideup-popup-1 .popup-content .popup-text-wrap {
    width: 26vw;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.vj-pro-container .slideup-popup-2 .popup-content .popup-text-wrap {
    width: 56.25vw;
    margin: 1.5625vw auto 3.645833vw;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.vj-pro-container .popup-content .popup-text {
    width: 48%;
    font-size: 1.041666vw;
    color: #86868B;
}

.vj-pro-container .popup-content .popup-text-des {
    width: auto;
    font-size: 0.625vw;
    margin-top: 0.9375vw;
    margin-left: 38.75vw;
    margin-right: auto;
    margin-bottom: 2.604166vw;
}

.vj-pro-container .slideup-popup-1 .popup-content .popup-text {
    width: 23vw;
    margin-left: 1.276041vw;
    margin-bottom: 0;
}

.vj-pro-container .slideup-popup-1 .popup-content .popup-text-des {
    width: auto;
    margin-left: auto;
    margin-right: 36.15625vw;
    text-align: right;
}

.vj-pro-container .slideup-popup-2 .popup-content .popup-text-des {
    margin-left: 32vw;
    display: flex;
    justify-content: flex-end;
    margin-right: 2.604166vw;
    margin-top: 1.5625vw;
    white-space: nowrap;
}

.vj-pro-container .popup-content .icon-close {
    position: absolute;
    z-index: 1;
    top: .833333vw;
    right: .833333vw;
    width: 2.1875vw;
    cursor: pointer;
}

@media screen and (max-aspect-ratio: 11/10) {
    .vj-pro-container .slideup-popup-container {
        flex-direction: column;
    }

    .vj-pro-container .slideup-popup-container .popup-content {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        margin-top: 13.888888vw;
        margin-bottom: 13.888888vw;
        border-radius: 4.444444vw;
    }

    .vj-pro-container .popup-content .icon-close {
        width: 10vw;
        top: 5.555555vw;
        right: 5.555555vw;
    }

    .vj-pro-container .popup-content .popup-headline-wrap {
        width: 86.111111vw;
        margin: 0 auto;
        flex-wrap: wrap;
        order: 1;
    }

    .vj-pro-container .popup-content .popup-headline {
        width: 100%;
        font-size: 6.666666vw;
    }

    .vj-pro-container .popup-content .popup-headline-image {
        width: 24.344444vw;
        margin-left: 0;
        margin-top: 11.11111vw;
    }

    .vj-pro-container .slideup-popup-container .popup-img-wrap,
    .vj-pro-container .slideup-popup-container .popup-media-wrap {
        order: 2;
        margin: 11.111111vw 0 13.888888vw;
        position: relative;
    }

    .vj-pro-container .popup-content .popup-text-wrap {
        order: 3;
        width: 86.111111vw;
    }

    .vj-pro-container .popup-content .popup-text {
        width: 100%;
        font-size: 4.444444vw;
    }

    .vj-pro-container .popup-content .popup-text-des {
        order: 4;
        width: 86.111111vw;
        font-size: 3.333333vw;
        margin-right: auto;
        margin-left: 6.944444vw;
    }

    .vj-pro-container .slideup-popup-1 .popup-content-wrap {
        padding: 5.55vw 5.55vw 13.333333vw;
    }

    .vj-pro-container .slideup-popup-1 .popup-image-wrap {
        width: 100%;
        margin: 13.194444vw 0 11.111111vw;
        order: 2;
    }

    .vj-pro-container .slideup-popup-1 .popup-content .popup-text-wrap {
        width: 100%;
        order: 1;
        margin-top: 6.66666vw;
    }

    .vj-pro-container .slideup-popup-1 .popup-content .popup-text {
        width: 100%;
        margin-left: 0;
    }

    .vj-pro-container .slideup-popup-1 .popup-content .popup-text-des {
        font-size: 3.33vw;
        margin-right: auto;
    }

    .vj-pro-container .slideup-popup-2 .popup-content .popup-text-des {
        margin-top: 13.888888vw;
        padding-bottom: 13.333333vw;
        width: 86.111111vw;
        margin-left: auto;
        margin-right: auto;
        white-space: normal;
    }

    .vj-pro-container .slideup-popup-2 .popup-content .popup-text-wrap {
        width: 86.111111vw;
    }
}

@media screen and (min-width: 798px) and (max-width: 1366px) and (min-aspect-ratio: 11/10) {

    .vj-pro-container .aesthetics-design-stage-1,
    .vj-pro-container .aesthetics-s5-stage-1 {
        left: 5.735vw;
    }

    .vj-pro-container .aesthetics-design-stage-3,
    .vj-pro-container .aesthetics-s5-stage-3 {
        right: 4.375vw;
        top: calc(50% + 39vh);
    }

    .vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-2 {
        top: calc(50% - 20.911458vw);
        left: 4.375vw;
    }

}

@media screen and (min-width: 798px) and (max-width: 1280px) and (min-aspect-ratio: 11/10) {
    .vj-pro-container .section-sports .sticky-viewport {
        height: 100vh;
        top: 0;
    }

    .vj-pro-container .more-item .more-item-btn,
    .vj-pro-container .item-btn {
        display: flex;
        align-items: center;
    }

    .vj-pro-container .sports-items {
        top: 50%;
        transform: translateY(-50%);
    }

    .vj-pro-container .sports-clock-dial-wrap {
        top: calc(50% + 6vw);
        transform: translate(-50%, -50%);
    }

    .vj-pro-container .popup-btn-linkga {
        font-size: 12px;
        display: flex;
        align-items: center;
    }
}

@media screen and (min-width: 820px) and (max-width: 1024px) and (max-aspect-ratio: 11/10) {
    .vj-pro-container .more-item .more-item-btn,
    .vj-pro-container .item-btn {
        display: flex;
        align-items: center;
    }
    .vj-pro-container .s12-canvas-wrap {
        margin-top: 0;
        width: 70%;
        margin: 0 auto;
    }

    .vj-pro-container .s12-background {
        height: 70vw;
    }

    .vj-pro-container .s12-center-circle {
        width: 50vw;
        height: 50vw;
    }

    .vj-pro-container .s12-center-watch {
        width: 25.058333vw;
        left: 59.52777vw;
        top: 11vw;
        transform: translateX(10%) scale(1);
    }

    .vj-pro-container .s12-panda-video {
        width: 30vw;
    }

    .vj-pro-container .s12-left-video {
        left: 8.486111vw;
    }

    .vj-pro-container .s12-right-video {
        right: 8.486111vw;
    }

    .vj-pro-container .s12-left-img-wrap {
        top: 3vw;
        width: 29.294444vw;
        height: auto;
        left: 22.236111vw;
    }

    .vj-pro-container .s12-close-container {
        margin-top: 0;
    }

    .vj-pro-container .aesthetics-design-stage,
    .vj-pro-container .aesthetics-s5-stage,
    .vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-3,
    .vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-2,
    .vj-pro-container .aesthetics-design-container-1 .aesthetics-design-stage-2,
    .vj-pro-container .aesthetics-design-container-2 .aesthetics-design-stage-3,
    .vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-3,
    .vj-pro-container .aesthetics-s5-container-2 .aesthetics-s5-stage-3 {
        top: 6.666666vw;
        font-size: 3.6vw;
    }

    .vj-pro-container .s12-stage p {
        font-size: 3.444444vw;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img-wrap,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img-wrap {
        width: 100%;
        overflow: hidden;
    }

    .vj-pro-container .more-swiper-container .swiper {
        transform: translateX(-1px);
    }

}

@media screen and (max-width: 769px) and (max-aspect-ratio: 11/10) {

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img img,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img img {
        width: 100%;
        margin-left: 0%;
        object-fit: cover;
    }

    .vj-pro-container .s12-close-container {
        margin-top: 5.33vw;
    }
}

@media screen and (min-width: 640px) and (max-width: 798px) {
    .vj-pro-container .more-item .more-item-btn,
    .vj-pro-container .item-btn {
        display: flex;
        align-items: center;
    }
    .vj-pro-container .more-swiper-container .swiper {
        transform: translateX(-1px);
    }

    .vj-pro-container .aesthetics-design-stage,
    .vj-pro-container .aesthetics-s5-stage,
    .vj-pro-container .aesthetics-design-stage-2,
    .vj-pro-container .aesthetics-s5-stage-2,
    .vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-2,
    .vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-3,
    .vj-pro-container .aesthetics-design-container-1 .aesthetics-design-stage-2,
    .vj-pro-container .aesthetics-design-container-2 .aesthetics-design-stage-3,
    .vj-pro-container .aesthetics-s5-container-1 .aesthetics-s5-stage-3,
    .vj-pro-container .aesthetics-s5-container-2 .aesthetics-s5-stage-3 {
        top: 6.777777vw;
        font-size: 3vw;
    }

    .vj-pro-container .s12-canvas-wrap {
        margin-top: 0;
        width: 70%;
        margin: 0 auto;
    }

    .vj-pro-container .s12-background {
        height: 70vw;
    }

    .vj-pro-container .s12-center-circle {
        width: 50vw;
        height: 50vw;
    }

    .vj-pro-container .s12-center-watch {
        width: 25.058333vw;
        left: 55.52777vw;
        top: 11vw;
    }

    .vj-pro-container .s12-panda-video {
        width: 30vw;
    }

    .vj-pro-container .s12-left-video {
        left: 8.486111vw;
    }

    .vj-pro-container .s12-right-video {
        right: 8.486111vw;
    }

    .vj-pro-container .s12-left-img-wrap {
        top: 3vw;
        width: 29.294444vw;
        height: auto;
        left: 22.236111vw;
    }

    .vj-pro-container .s12-close-container {
        margin-top: 0;
    }

    .vj-pro-container .s12-stage p {
        font-size: 3vw;
    }

    .vj-pro-container .s12-stage-1 {
        margin-top: -12vw;
    }

    .vj-pro-container .s12-stage-2,
    .vj-pro-container .s12-stage-3 {
        margin-top: 12vw;
    }

    .vj-pro-container .popup-btn-highlight2 {
        margin-top: 3.33vw;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img img,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img img {
        width: 60%;
        margin-left: 20%;
        object-fit: contain;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img-wrap,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img-wrap {
        width: 100%;
        overflow: hidden;
    }


    .vj-pro-container .s16 .s16-item .s16-item-main .icon {
        font-size: 12.2222222vw;
    }

    .vj-pro-container .popup-btn span {
        font-size: 3vw;
    }
}

@media screen and (max-width: 769px) and (max-aspect-ratio: 11/10) {

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img img,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img img {
        width: 100%;
        margin-left: 0%;
        object-fit: cover;
    }
}

@media screen and (min-width: 670px) and (max-width: 767px) and (min-aspect-ratio: 1/1) {

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img img,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img img {
        width: 60%;
        margin-left: 20%;
        object-fit: contain;
    }

    .vj-pro-container .s12-stage p {
        font-size: 3.33333vw;
    }

    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img-2 img,
    .vj-pro-container .aesthetics-design-container .aesthetics-design-img-3 img,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img-3 img {
        width: 100%;
        margin-left: 0%;
        object-fit: cover;
    }

    .vj-pro-container .s12-close-container {
        margin-top: 3.33vw;
    }

    .vj-pro-container .aesthetics-design-container .aesthetics-design-img-wrap,
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img-wrap {
        width: 100%;
        overflow: hidden;
    }

    .vj-pro-container .s16 .s16-item .s16-item-main .icon {
        font-size: 12.2222222vw;
    }

    .vj-pro-container .popup-btn span {
        font-size: 3vw;
    }

    .vj-pro-container .switch-color-btn {
        font-size: 3.333333vw;
    }
}

@media screen and (max-width: 375px) and (max-aspect-ratio: 11/10) {
    .vj-pro-container .s12-canvas-wrap {
        margin-top: 10vh;
    }

    .vj-pro-container .s12-center-watch {
        top: 16vw;
        left: 58.52777vw;
    }

    .vj-pro-container .s12-center-circle {
        width: 59.655555vw;
        height: 59.655555vw;
    }

    .vj-pro-container .s12-left-img-wrap {
        top: 8vw;
    }

    .vj-pro-container .s12-left-video {
        left: 2.486111vw;
    }

    .vj-pro-container .s12-right-video {
        right: 2.486111vw;
    }

    .vj-pro-container .switch-card-item-2 .switch-card-bg {
        margin-top: 15vw;
    }

    .vj-pro-container .switch-card-item-1 .switch-card-bg {
        margin-top: 10vw;
    }

    .vj-pro-container .s12-stage p {
        font-size: 4vw;
    }
}

@media screen and (min-width: 360px) and (max-width: 400px) {
    .vj-pro-container .s12-close-container {
        margin-top: 0;
    }

    .vj-pro-container .s12-stage p {
        font-size: 4vw;
    }
}

.vj-pro-container .section-kv .kv-click-btn {
    margin: 1.979166vw auto 0;
    width: max-content;
}

.vj-pro-container .section-kv .kv-click-btn a {
    display: flex;
    align-items: center;
    justify-content: center;
}

.vj-pro-container .section-kv .kv-click-btn a span {
    display: inline-block;
    font-size: 1.25vw;
    line-height: 1.25;
}

.vj-pro-container .section-kv .kv-click-btn a svg {
    margin-right: 0.729166vw;
}

.vj-pro-container .section-kv .kv-bottom {
    position: absolute;
    right: 3.125vw;
    bottom: 2.6041666vw;
}

.vj-pro-container .section-kv .kv-bottom svg {
    width: 8.125vw;
    height: 2.4046875vw;
}

@media screen and (max-aspect-ratio: 11/10) {
    .vj-pro-container .section-kv .kv-click-btn a span {
        font-size: 4.444444vw;
    }

    .vj-pro-container .section-kv .kv-click-btn {
        margin-top: 11.111111vw;
    }

    .vj-pro-container .section-kv .kv-click-btn a svg {
        width: 5.555555vw;
        height: 5.555555vw;
        margin-right: 2.7777777vw;
    }

    .vj-pro-container .section-kv .kv-bottom {
        position: absolute;
        right: 6.944444vw;
        bottom: 6.944444vw;
    }

    .vj-pro-container .section-kv .kv-bottom svg {
        width: 25.09305vw;
        height: 7.4263888vw;
    }
}

.vj-pro-container .slideup-popup-scroll-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (max-aspect-ratio: 11 / 10) {
    .vj-pro-container .section-kv .kv-click-btn a svg {
        width: 9.04vw;
        height: 9.04vw;
    }
    .vj-pro-container .slideup-popup-container {
        justify-content: flex-start;
    }

    .vj-pro-container .slideup-popup-scroll-container {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        overflow-y: scroll;
        justify-content: flex-start;
    }

    .vj-pro-container .slideup-popup-container .popup-content {
        overflow: initial;
    }

    .vj-pro-container .popup-content .icon-close {
        position: sticky;
        margin-top: 5.55vw;
        margin-left: 84.5%;
        z-index: 33;
    }

    .vj-pro-container .slideup-popup-container .popup-content {
        border-radius: 7.777vw;
        margin: 5.55vw 2.77vw;
        width: auto;
    }

    .vj-pro-container .slideup-popup-1 .popup-content-wrap {
        padding-top: 5.55vw;
    }

    .vj-pro-container .slideup-popup-1 .icon-close {
        margin-top: 0;
        margin-left: auto;
    }

    .s15-container-right-item-main {
        overflow: initial;
    }
    .vj-pro-container .aesthetics-design-container,
    .vj-pro-container .aesthetics-s5-container {
        display: block;
        opacity: 0;
        transition: opacity .3s ease;
        pointer-events: none;
        position: relative;
        z-index: 1;
    }

    .vj-pro-container .aesthetics-design-container.active,
    .vj-pro-container .aesthetics-s5-container.active {
        opacity: 1;
        pointer-events: all;
        z-index: 2;
    }

    .vj-pro-container .aesthetics-design-container-2,
    .vj-pro-container .aesthetics-s5-container-2 {
        position: absolute;
        top: 0;
        left: 0;
    }
}

.vj-pro-container .s16-1-item-des {
    font-size: max(0.625vw, 12px);
    position: absolute;
    right: 1.5625vw;
    bottom: 1.5625vw;
    color: #99999d;
}

@media (max-aspect-ratio: 11 / 10) {
    .vj-pro-container .s16-1-item-des {
        font-size: 3.333333vw;
        bottom: 11.111111vw;
        right: 8.333333vw;
    }

    .vj-pro-container .s16-1 .s16-1-item-2 {
        padding-bottom: 11.111111vw;
    }
}

@media (max-aspect-ratio: 11 / 10) {
    .vj-pro-container .section-status .h3 {
        margin-top: 27.777777vw;
    }

    .vj-pro-container .s12 .sticky-viewport {
        /* position: relative; */
        height: auto;
        display: flex;
        flex-wrap: wrap;
    }

    .vj-pro-container .s12-center-circle {
        opacity: 1;
        width: 51.65555vw;
        height: 51.65555vw;
        display: none;
    }

    .vj-pro-container .s12-background {
        transform: scale(0.56);
        order: 1;
    }

    .vj-pro-container .s12-center-watch {
        display: none;
    }

    .vj-pro-container .s12-close-container {
        order: 2;
    }

    .vj-pro-container .s12-left-img-wrap {
        display: none;
    }

    .vj-pro-container .s12-left-video,
    .vj-pro-container .s12-right-video {
        transform: translateX(0);
        opacity: 1;
        display: none;
    }

    .vj-pro-container .s12 .space-300vh,
    .vj-pro-container .s12 .space-50vh {
        height: 0;
    }

    .vj-pro-container .s12-canvas-wrap {
        margin-top: 27.777777vw;
        margin-bottom: 13.888888vw;
        opacity: 0;
        transition-duration: .3s;
        width: 100%;
    }

    .vj-pro-container .s12-stage {
        transform: translate(0);
        position: relative;
        opacity: 1;
        top: auto;
        pointer-events: all;
        opacity: 0;
        transition-duration: .3s;
        transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    }

    .vj-pro-container .s12-close-container {
        margin-top: 0;
    }

    .vj-pro-container .popup-btn-highlight2 {
        margin-top: 13.88888888vw;
    }

    .vj-pro-container .s12-stage.animated,
    .vj-pro-container .s12-canvas-wrap.animated {
        opacity: 1;
    }

    .vj-pro-container .s12-stage-1 {
        margin-top: 0;
        margin-left: 0;
    }

    .vj-pro-container .s12-stage-2,
    .vj-pro-container .s12-stage-3 {
        margin-top: 13.888888vw;
    }

    .vj-pro-container .s12-stage p {
        font-size: 4.444444vw;
    }

    .vj-pro-container .s12-img-wrap-top {
        width: 88.888888888vw;
        height: auto;
        margin: 0 auto;
        z-index: 3;
        position: relative;
    }

    .vj-pro-container .s12-img-wrap-top .s12-name{
        font-weight:500;
        color:#000000;
        font-size:3.3333333333vw;
        line-height:1.6;
        text-align: center;
      }
  
      .vj-pro-container .s12-img-wrap-top .s12-name1{
        position: absolute;
        width: 30.555555555vw;
        left: 0;
        top: 40.2777777vw;
      }
  
      .vj-pro-container .s12-img-wrap-top .s12-name2{
        margin-top: 4.1666666vw;
      }
  
      .vj-pro-container .s12-img-wrap-top .s12-name3{
        position: absolute;
        width: 30.555555555vw;
        right: 0;
        top: 40.2777777vw;
      }

    .vj-pro-container .s12-img-wrap-1 {
        width: 51.2vw;
        margin: 27.777777vw auto 0;
        opacity: 0;
        transition-duration: .3s;
        transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    }

    .vj-pro-container .s12-img-wrap-2 {
        width: 86.111111vw;
        margin-top: 27.777777vw;
        display: flex;
        justify-content: space-between;
        align-items: center;
        opacity: 0;
        transition-duration: .3s;
        transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    }

    .vj-pro-container .s12-img-wrap-1.animated,
    .vj-pro-container .s12-img-wrap-2.animated,
    .vj-pro-container .s12-img-wrap-3.animated {
        opacity: 1;
    }

    .vj-pro-container .s12-img-wrap-2 .s12-img-l {
        width: 35.058333vw;
    }

    .vj-pro-container .s12-img-wrap-2 .s12-img-r {
        width: 43.294444vw;
        margin-left: 4.166666vw;
    }
    .swiper .common-wrap-pagination{
        position: absolute;
        bottom: 25.3333vw;
        display: flex;
        justify-content: center;
        z-index: 5;
    }
    .swiper .common-wrap-pagination .swiper-pagination-bullet{
        background-color: #FFFFFF;
        border-radius: 2.778vw;
        width: 2.22vw;
        height: 2.22vw;
        opacity: .3s;
        transition: all .3s ease;
    }
    .swiper .common-wrap-pagination .swiper-pagination-bullet-active{
        background-color: #D6D6D6;
        width: 4.444vw;
        opacity: 1;
    }
    .aesthetics-s5 .common-wrap-pagination .swiper-pagination-bullet{
        background-color: #ABABAB;
        opacity: 1;
    }
    .aesthetics-s5 .common-wrap-pagination .swiper-pagination-bullet-active{
        background-color: #000000;
    }
    .vj-pro-container .aesthetics-design-close-container, .vj-pro-container .aesthetics-s5-close-container{
        display: none;
    }
    .vj-pro-container .aesthetics-design-container .aesthetics-design-img{
        background-color: #000000;
    }
    .vj-pro-container .aesthetics-s5-container .aesthetics-s5-img{
        /* background-color: #FAFAFA; */
    }
    .vj-pro-container .s5{
        z-index: 10;
    }
}

.vj-pro-container .slideup-popup-scroll-container {
    z-index: 1;
}

.vj-pro-container .slideup-popup-container {
    z-index: 999;
}



.vj-pro-container .s111 {
    width: 62.5vw;
    margin: 0 auto;
  }
  .vj-pro-container .s111 .swiper-slide {
    display: flex;
    align-items: center;
    background: #fff;
  }
  .vj-pro-container .s111 .s111-text {
    font-weight:500;
    color:#797c80;
    font-size:1.25vw;
    line-height:1.6;
    width: 30vw;
    margin: 0 12.5vw 0 0;
  }
  .vj-pro-container .s111 .s111-img {
    width: 17.34375vw;
  }
  .vj-pro-container .s111 .s111-swiper-pagination{
    display: flex;
    justify-content: center;
    width: 17.34375vw;
    margin: 1.5625vw 0px 0px 42.5vw;
  }
  .vj-pro-container .s111 .s111-swiper-pagination span {
    width: 0.83vw;
    height: 0.83vw;
    margin: 0;
    overflow: hidden;
    background:#797c80;
    --swiper-pagination-bullet-inactive-opacity:0.3;
    transform: translate3d(0,0,0) rotate(0deg);
  }
  .vj-pro-container .s111 .s111-swiper-pagination span + span {
    margin: 0 0 0 1.04166667vw;
  }
  @media (max-aspect-ratio: 11 / 10){
    .vj-pro-container .s111 {
      width: 86.11111111vw;
      margin: 0 auto;
    }
    .vj-pro-container .s111 .swiper-wrapper {
      display: block;
    }
    .vj-pro-container .s111 .swiper-slide {
      flex-direction: column-reverse;
      margin: 27.7777777vw 0 0;
    }
    .vj-pro-container .s111 .s111-text {
      color:#797c80;
      font-size:4.4444444444vw;
      width: 100%;
      margin: 13.888888888vw 0 0 0;
      opacity: 0;
      transition-duration: .3s;
      transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    }
    .vj-pro-container .s111 .s111-img {
      width: 46.25vw;
      opacity: 0;
      transition-duration: .3s;
      transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    }
    .vj-pro-container .s111 .s111-text.animated,.vj-pro-container .s111 .s111-img.animated{
      opacity: 1;
    }
    .vj-pro-container .s111 .s111-swiper-pagination{
      display: none;
    }
  }