.watch-4-s1.watch-4-container {
    --global-nav-height: 76px;
    --global-full-height: calc(100vh - var(--global-nav-height));
}

.watch-4-container *,
.watch-4-container::before,
.watch-4-container::after {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.watch-4-container *:focus,
.watch-4-container *:active {
    outline: none;
}

.watch-4-container section {
    position: relative;
    z-index: 1;
}

.watch-4-container .pc-hide {
    display: none;
}

.watch-4-container .mob-hide {
    display: inline-block;
}
.watch-4-container .video-fallback {
    display: none;
}

.watch-4-container.no-sticky .video-fallback,
.watch-4-container.isWeChat .video-fallback,
.watch-4-container.isuc .video-fallback {
    display: block;
}

.watch-4-container.isuc video,
.watch-4-container.isWeChat video {
    display: none;
}
.watch-4-container img,
.watch-4-container video {
    width: 100%;
    max-width: 100%;
}
.watch-4-container .blur-up {
    filter: blur(20px);
    transition: filter .2s;
    will-change: filter;
}
.watch-4-container .blur-up.lazyloaded {
    filter: blur(0)
}
.watch-4-container sup {
    font-size: .6em;
    cursor: pointer;
}
.watch-4-container span.nowrap{
    white-space: nowrap;
}
.watch-4-container .section-between {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.watch-4-container .section-left {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.watch-4-container .section-relative{
    position: relative;
}
.watch-4-container .section-absolute{
    position: absolute;
}
.watch-4-container .section-center{
    text-align: center;
}
.watch-4-container .pc-hide{
    display: none;
}
.watch-4-container .mob-hide{
    display: inline-block;
}
.watch-4-container article,
.watch-4-container p{
    line-height: 1.6;
}
.watch-4-container .watch-4-title{
    font-size: 2.5vw;
    font-weight: bold;
    line-height: 1.25;
    margin-bottom: 1.5625vw;
}
.watch-4-container .watch-4-desc{
    font-size: 1.666667vw;
}
.watch-4-kv .section-pic{
    width: 73.697917vw;
    margin-top: -9vw;
}
.watch-4-kv .section-pic img{
    transition: transform 1s ease;
    transform: translateX(0);
}
.watch-4-container.isie .watch-4-kv .section-pic img,
.watch-4-kv .section-pic.active img{
    transform: translateX(-8.645833vw);
}
.watch-4-container.isie .watch-4-kv .section-pic img,.watch-4-container.isie .watch-4-kv .section-text{
    transition: none;
}
.watch-4-kv{
    width: 100%;
    height: calc(100vh - var(--global-nav-height));
    overflow: hidden;
}
.watch-4-kv .section-text{
    top: 50%;
    left: 52.458333vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    opacity: 0;
    transform: translateX(100%) translateY(-50%);
    transition: all 1s ease;
}
.watch-4-container.isie .watch-4-kv .section-text{
    display: block;
    flex-direction: unset;
    align-items: unset;
}
.watch-4-container.isie .watch-4-kv .section-text,
.watch-4-kv .section-text.active{
    opacity: 1;
    transform: translateX(0) translateY(-50%);
}
.watch-4-kv .section-text .kv-logo{
    width: 41.067188vw;
    margin: 0 auto;
}
.watch-4-kv .section-text .kv-slogan{
    font-size: 2.5vw;
    line-height: 1.25;
    font-weight: 700;
    margin-top: 1.5625vw;
}
.watch-4-kv .section-text .section-pic-center{
    text-align: center;
}
.watch-4-kv .section-text .section-kv-pic {
    width: 22.5vw;
    line-height: 1.25;
    margin-top: 1.5625vw;
    font-size: 1.458333vw;
    font-weight: 400;
    color: rgb(0, 0, 0);
}
.watch-4-kv .section-text .section-kv-pic span {
    font-size: .45em;
    font-weight: 500;
}
.watch-4-kv .section-text a {
    color: inherit;
}
.watch-4-kv .section-text .section-slogan-botton {
    background-color: rgb(0, 0, 0);
    color: rgb(255, 255, 255);
    font-size: 13px;
    border: 2px solid rgb(0, 0, 0);
    display: inline-block;
    line-height: 24px;
    font-weight: 800;
    padding: 10px 26px;
    border-radius: 40px;
    text-align: left;
    cursor: pointer;
    transition: .3s ease-out;
    margin-top: 1.25vw;
}
.debussy-r-s1 .section-text .section-slogan-botton:hover {
    opacity: .8;
}
.debussy-r-s1 .section-text .section-slogan-botton a {
    color: inherit;
}
/*  */
.watch-4-s1{
    width: 100%;
    min-height: 44.791667vw;
    transition: all 0.6s ease;
}
.watch-4-wrap-1{
    padding: 6.25vw 0;
    position: relative;
    opacity: 0;
    display: none;
    transition: opacity 0.6s ease;
}
.watch-4-text{
    width: 61.25vw;
    margin: 0 auto;
}
.watch-4-text .changeBtn {
    display: inline-block;
    font-size: 1.145833vw;
    line-height: 1.25;
    margin-top: 3.125vw;
    color: #fff;
    background: #000;
    padding: 0.8854166667vw 1.5625vw;
    border-radius: 2.0833333333vw;
}
.watch-4-text .changeBtn:hover{
    background-color: #3f3f3f;
}
.watch-4-wrap-1 .section-pic{
    width: 34.375vw;
    margin: 3.125vw auto 0;
}
.watch-4-wrap-2{
    width: 100%;
    height: 100%;
    min-height: 44.791667vw;
    display: flex;
    align-items: center;
    opacity: 0;
    transition: opacity 0.6s ease;
    top: 0;
    display: none;
}
.watch-4-wrap-1.active{
    z-index: 2;
    opacity: 1;
}
.watch-4-wrap-1.active2{
    display: block;
}
.watch-4-wrap-2.active{
    z-index: 2;
    opacity: 1;
}
.watch-4-wrap-2.active2{
    display: flex;
}
.watch-4-wrap-2 .section-pic-box{
    width: 54.0625vw;
}

.watch-4-wrap-2 .section-txt-box{
    transition: all 0.6s ease;
    /* height: 100%; */
    position: absolute;
    left: 54.0625vw;
    top: 50%;
    transform: translateY(-50%);
}
.watch-4-wrap-2 .section-txt-box.active{
    top: 6.25vw;
    transform: translateY(0%);
}
.watch-4-wrap-2 .section-txt-box>div{
    display: none;
    opacity: 0;
    transition: all 0.6s ease;
    transform: translateY(5.2083333333vw);
}
.watch-4-wrap-2 .section-txt-box>div:not(:first-child){
    margin-top: 1.5625vw;
}
.watch-4-wrap-2 .section-txt-box>div.active1{
    display: block;
}
.watch-4-wrap-2 .section-txt-box>div.active2{
    opacity: 1;
    transform: translateY(0) rotate(0deg);
}
.watch-4-wrap-2 .watch-all{
    width: 34.375vw;
    height: 32.604167vw;
    margin: 0 auto;
    display: flex;
    align-items: center;
    opacity: 0;
}
.watch-4-wrap-2 .watch-all.active{
    opacity: 1;
}
.watch-4-wrap-2 .watch-all.notActive{
    opacity: 0;
}
.watch-4-wrap-2 .watch-subTitle{
    display: inline-flex;
    padding: .625vw 1.25vw;
    background-color: #F7F7F7;
    border-radius: 1.354167vw;
    -webkit-border-radius: 1.354167vw;
    transition: all 0.6s ease;
}
.watch-4-wrap-2 .watch-subTitle .watch-title-icon{
    display: inline-block;
    width: 1.041667vw;
    height: 1.041667vw;
    display: flex;
    margin-right: .260417vw;
}
.watch-4-wrap-2 .watch-subTitle .watch-color-logo{
    width: .46875vw;
    height: 1.145833vw;
    margin-right: .520833vw;
    margin-left: .3125vw;
}
.watch-4-wrap-2 .watch-subTitle .watch-size-logo{
    background: url(/content/dam/huawei-cbg-site/common/mkt/pdp/accessories/easyfit-strap/images/huawei-watch-4-series-straps-color-size-icon-1.svg) no-repeat;
    background-size: 100%;
}
.watch-4-wrap-2 .watch-subTitle .watch-body-logo{
    background: url(/content/dam/huawei-cbg-site/common/mkt/pdp/accessories/easyfit-strap/images/huawei-watch-4-series-straps-color-body-icon-1.svg) no-repeat;
    background-size: 100%;
}
.watch-4-wrap-2 .watch-subTitle .watch-material-logo{
    background: url(/content/dam/huawei-cbg-site/common/mkt/pdp/accessories/easyfit-strap/images/huawei-watch-4-series-straps-color-material-icon-1.svg) no-repeat;
    background-size: 100%;
}
.watch-4-wrap-2 .watch-subTitle .watch-color-logo{
    background: url(/content/dam/huawei-cbg-site/common/mkt/pdp/accessories/easyfit-strap/images/huawei-watch-4-series-straps-color-icon-1.png) no-repeat;
    background-size: 100%;
}
.watch-4-wrap-2 .watch-subTitle .watch-pan-logo{
    background: url(/content/dam/huawei-cbg-site/common/mkt/pdp/accessories/easyfit-strap/images/huawei-watch-4-series-straps-color-pan-icon-1.svg) no-repeat;
    background-size: 100%;
}
.watch-4-wrap-2 .watch-subTitle h4{
    font-size: 1.041667vw;
    line-height: 1.6;
    color: #636363;
}
.watch-4-wrap-2 .watch-subTitle.active h4{
    color: #000000;
}
.watch-4-wrap-2 .watch-subChoice{
    font-size: 0;
    margin-top: 1.5625vw;
    margin-left: 1.25vw;
    transition: opacity 0.3s ease;
}
.watch-4-wrap-2 .watch-subChoice>li:not(:last-child){
    margin-right: 3.125vw;
}
.watch-4-wrap-2 .watch-46mm-wrap,.watch-4-wrap-2 .watch-48mm-wrap{
    width: 20.78125vw;
    height: 32.604167vw;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    margin: auto;
    transform: translateY(-50%);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.watch-4-wrap-2 .watch-46mm-wrap.active,.watch-4-wrap-2 .watch-48mm-wrap.active{
    opacity: 1;
}
.watch-4-wrap-2 .watch-46mm-wrap.notActive,
.watch-4-wrap-2 .watch-48mm-wrap.notActive {
    opacity: 0;
}
.watch-4-wrap-2 .watch-46mm-wrap>div,.watch-4-wrap-2 .watch-48mm-wrap>div{
    width: 100%;
    top: 0;
    left: 0;
}
.watch-46mm-dai>div,.watch-46mm-body>div,.watch-46mm-pan>div,
.watch-48mm-dai>div,.watch-48mm-body>div,.watch-48mm-pan>div{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.6s ease;
}
.watch-46mm-body>div,.watch-48mm-body>div{
    transition: none;
}
.watch-46mm-dai>div.active,.watch-46mm-body>div.active,.watch-46mm-pan>div.active,
.watch-48mm-dai>div.active,.watch-48mm-body>div.active,.watch-48mm-pan>div.active{
    opacity: 1;
}
.watch-info{
    font-size: 1.041667vw;
    line-height: 1.6;
    color: #000000;
    margin-top: 3.125vw;
    opacity: 0;
    display: none;
    transition: opacity 0.6s ease;
}
.watch-info.actived{
    display: block;
}
.watch-info.active{
    opacity: 1;
}
.watch-info>span:not(:last-child){
    margin-right: 1.041667vw;
}
.watch-color li,.watch-pan li{
    width: 1.041667vw;
}
.watch-color-icon{
    width: 1.041667vw;
    height: 1.041667vw;
    border-radius: 50%;
    display: flex;
    position: relative;
    margin: 0 auto 2.0625vw 0;
}

.watch-color-icon::before {
    content: attr(data-name);
    position: absolute;
    top: calc(100% + 0.5208333333vw);
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    font-size: 1.041667vw;
    line-height: 1.6;
    color: #000;
    opacity: 0;
    transition: opacity 0.3s ease;
}
.watch-4-wrap-2 .watch-subChoice>li.active .watch-color-icon::before{
    opacity: 1;
}
.watch-4-wrap-2 .watch-subChoice{
    display: none;
    transition: opacity 0.3s ease;
}
.watch-4-wrap-2 .watch-subChoice-fjcolor{
    width: 13.541667vw;
}
.watch-4-wrap-2 .watch-subChoice>li{
    cursor: pointer;
    display: inline-block;
    font-size: 1.041667vw;
    line-height: 1.6;
    color: #636363;
}
.watch-4-wrap-2 .watch-subChoice>li.active{
    color: #000;
}
.watch-4-wrap-2 .watch-subChoice.active{
    display: block;
}
.watch-subChoice-fjcolor .watch-li-margin{
    margin-top: 1.5625vw;
}
.watch-4-container .section-footnote {
    color: #9D9D9D;
    font-size: 12px;
    margin: 0 auto;
    width:70.989583vw;
    padding-top: 4.166667vw;
    padding-bottom: 6.25vw;
    overflow: hidden;
}
.watch-4-container .section-footnote .footlist{
    padding: 0;
    list-style: none !important;
    position: relative;
}
.watch-4-container .section-footnote .footlist::before {
    content: "*";
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: -9px;
}
@media (min-width: 1920px) {
    .watch-4-container .section-footnote{
        font-size: .625vw;
    }
}

.watch-4-container .section-footnote .active {
    color: #000000;
}

.watch-4-container .section-footnote ol {
    list-style-type: decimal;
    padding-left: 2em;
}

.watch-4-container .section-footnote li {
    line-height: 1.6em;
    padding-left: 0.5em;
}
@media screen and (max-aspect-ratio: 51/50) {
    .watch-4-kv{
        height: auto;
        display: flex;
        flex-direction: column;
    }
    .watch-4-kv .section-pic{
        width: 100%;
        margin-top: 0;
    }
    .watch-4-kv .section-text .kv-slogan{
        font-size: 6.666667vw;
        margin-top: 4.166667vw;
        text-align: center;
    }
    .watch-4-kv .section-text{
        width: 73%;
        margin:8.333333vw auto 0;
        position: static;
        opacity: 1;
        transform: none;
        transition: none;
        align-items: center;
    }
    .watch-4-kv .section-text .kv-logo{
        width: 100%;
    }
    .watch-4-wrap-1{
        padding: 27.777778vw 0;
        transition: opacity 0.3s ease;
    }
    .watch-4-text{
        width: 84.722222vw;
    }
    .watch-4-container .watch-4-title{
        font-size: 6.666667vw;
        margin-bottom: 5.555556vw;
    }
    .watch-4-container .watch-4-desc{
        font-size: 4.444444vw;
    }
    .watch-4-text .changeBtn{
        font-size:3.333333vw;
        margin-top: 8.333333vw;
        padding: 1.666667vw 3.333333vw;
        border-radius: 3.611111vw;
        -webkit-border-radius: 3.611111vw;
    }
    .watch-4-wrap-1 .section-pic{
        width: 88.055556vw;
        margin-top: 8.333333vw;
    }
    .watch-4-wrap-2{
        flex-direction: column;
        padding-top: 27.777778vw;
        padding-bottom: 27.777778vw;
    }
    .watch-4-wrap-2 .section-pic-box{
        width: 100%;
    }
    .watch-4-wrap-2 .watch-all{
        width: 88.055556vw;
        height: 86.944444vw;
    }
    .watch-4-wrap-2 .watch-46mm-wrap, .watch-4-wrap-2 .watch-48mm-wrap{
        width: 55.416667vw;
        height: 86.944444vw;
    }
    .watch-info{
        font-size: 3.333333vw;
        margin-top: 8.333333vw;
    }
    .watch-info>span:not(:last-child){
        margin-right: 2.777778vw;
    }
    .watch-4-wrap-2 .section-txt-box{
        margin-top: 5.555556vw;
        width: 72.222222vw;
        position: static;
        transform: translateY(0);
    }
    .watch-4-wrap-2 .section-txt-box.active{
        top: unset;
        transform: translateY(0);
    }
    .watch-4-wrap-2 .watch-subTitle{
        padding: 1.666667vw 3.333333vw;
        border-radius: 3.611111vw;
        -webkit-border-radius: 3.611111vw;
    }
    .watch-4-wrap-2 .watch-subTitle .watch-title-icon{
        width: 2.777778vw;
        height: 2.777778vw;
        margin-right: .694444vw;
    }
    .watch-4-wrap-2 .watch-subTitle .watch-color-logo{
        width: 1.25vw;
        height: 3.333333vw;
        margin-right: 1.388889vw;
        margin-left: .833333vw;
    }
    .watch-4-wrap-2 .watch-subTitle h4{
        font-size: 3.333333vw;
    }
    .watch-4-wrap-2 .watch-subChoice{
        width:100%;
        margin-top: 5.555556vw;
        margin-left: 3.611111vw;
    }
    .watch-4-wrap-2 .watch-subChoice>li{
        font-size: 3.333333vw;
    }
    .watch-4-wrap-2 .section-txt-box>div:not(:first-child){
        margin-top: 5.555556vw;
    }
    .watch-4-wrap-2 .watch-subChoice>li:not(:last-child){
        margin-right: 5.555556vw;
    }
    .watch-4-wrap-2 .watch-subChoice.watch-subChoice-fjcolor{
        width: 40%;
    }
    .watch-color li,.watch-pan li{
        width: 2.777778vw;
    }
    .watch-color-icon{
        width: 2.777778vw;
        height: 2.777778vw;
        margin-bottom: 7.755556vw;
        transform: scale(1);
    }
    .watch-color li .watch-color-icon,.watch-pan li .watch-color-icon{
        margin-left: 0;
        margin-top: 0;
    }
    .watch-color-icon::before{
        font-size: 3.333333vw;
        top: calc(100% + 2.777778vw);
    }
    .watch-subChoice-fjcolor .watch-li-margin{
        margin-top: 5.555556vw;
    }
    .watch-4-container .section-footnote {
        font-size: 3.333333vw;
        width: 83.055556vw;
        padding-bottom: 16.666667vw;
        padding-top: 0;
    }
}
@media (min-width: 1430px) and (max-width: 1500px) and (min-aspect-ratio: 51 / 50){
    .watch-4-kv .section-text{
        left: 53.458333vw;
    }
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1194px) and (orientation : landscape){
    .watch-4-kv .section-pic{
        margin-top: 0;
    }
}
@media only screen and (min-width: 2150px) {
    .watch-4-kv .section-pic{
        margin-top: 0;
    }
}
@media screen and (max-width: 779px),
screen and (max-aspect-ratio: 1 / 1) and (max-width: 1200px) {
    .watch-4-kv .section-text .section-kv-pic span {
        font-size: .65em;
    }

    .watch-4-kv .section-text .section-kv-pic {
        width: auto;
        font-size: 5.56vw;
        margin-top: 6.6666666666vw;
        color: rgb(0, 0, 0);
    }

    .watch-4-kv .section-text .section-slogan-botton {
        background-color: rgb(0, 0, 0);
        color: rgb(255, 255, 255);
        border: 2px solid rgb(0, 0, 0);
        margin-top: 3.333333333333vw;
    }
}