.n200-first-screen {
    width: 100%;
    height: 66.9725rem;
    background-color: #000;
    position: relative;
}

.first-screen-left-box {
    width: 36%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 13%;
    color: #fff;
}

.first-screen-left-box>p:nth-child(1) {
    font-size: 6.2rem;
    line-height: 8.24rem;
    margin-bottom: 1.24rem;
}

.first-screen-left-box>p:nth-child(2) {
    font-size: 6.2rem;
    line-height: 8.24rem;
    color: #B2B2B2;
}

.first-screen-left-box>p:nth-child(3) {
    font-size: 3.1rem;
    line-height: 3.1rem;
}

.first-screen-right-box {
    position: absolute;
    right: 0;
    z-index: 1;
    width: 62.5%;
    max-width: 1200px;
}

.first-screen-right-box img {
    width: 100%;
}

@media screen and (max-width: 768px) {
    .n200-first-screen {
        height: 680px;
    }
    .first-screen-left-box {
        position: unset;
        padding: 40px 30px;
        transform: unset;
        width: 100%;
    }
    .first-screen-left-box>p:nth-child(1) {
        font-size: 56px;
        line-height: 74px;
        margin-bottom: 10px;
    }
    .first-screen-left-box>p:nth-child(2) {
        font-size: 56px;
        line-height: 74px;
    }
    .first-screen-left-box>p:nth-child(3) {
        font-size: 30px;
        line-height: 36px;
    }
    .first-screen-right-box {
        width: 100%;
        max-width: 360px;
        top: unset;
        bottom: -50px;
        left: 50%;
        transform: translateX(-50%);
    }
}

.n200-video-screen {
    position: relative;
    height: 66.9725rem;
    overflow: hidden;
    background-color: #000;
}

.n200-video-screen .video-screen-text-box .text-box-title {
    color: #ec1b28;
    /* font-size: 0.5rem; */
    margin-bottom: 20px;
}

.n200-video-screen .video-screen-text-box .text-box-subtitle {
    color: #fff;
    /* font-size: 0.2rem; */
}

.n200-video-screen .video-screen-video-box {
    position: absolute;
    width: 96.055625rem;
    height: 45.082rem;
    top: 50%;
    transform: translateY(-50%);
    right: -40.92775rem;
}

.n200-video-screen .video-screen-video-box img {
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 20;
}

.n200-video-screen .video-screen-video-box video {
    height: 93%;
    position: absolute;
    top: 1.55029375rem;
    left: 2.35644375rem;
    z-index: 10;
}
.n200-video-screen .text-box-title {
    font-size: 3rem;
    line-height: 1.2;
}
.n200-video-screen .text-box-subtitle {
    font-size: 1.25rem;
    line-height: 1.2;
}

@media screen and (max-width: 768px) {
    .n200-video-screen {
        height: auto;
        padding: 28.54168754rem 2.140625rem 4.42395625rem;
    }
    .n200-video-screen .video-screen-video-box {
        width: 41.8135rem;
        left: 2.140625rem;
        right: unset;
        top: 4.63801875rem;
        transform: unset;
        height: 19.6220625rem;
    }
    .n200-video-screen .video-screen-text-box .text-box-title {
        margin-bottom: 10px;
    }
    .n200-video-screen .video-screen-video-box video {
        height: 93%;
        top: 0.71354375rem;
        left: 1.0703125rem;
    }
    .n200-video-screen .text-box-title {
        font-size: 1.75rem;
    }
    .n200-video-screen .text-box-subtitle {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 1023px) and (min-width: 769px) {
    .video-screen-text-box {
        position: absolute;
        left: 12.5%;
        right: 50%;
        top: 50%;
        transform: translateY(-50%);
    }
}

@media screen and (min-width: 1024px) {
    .video-screen-text-box {
        position: absolute;
        left: 20%;
        right: 52%;
        top: 50%;
        transform: translateY(-50%);
    }
}

.as-bg-image-wrapper {
    overflow: hidden;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
}

.as-bg-image-wrapper .as-bg-image {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.n200-section-more2 .as-bg-image-wrapper,
.n200-section-5g .as-bg-image-wrapper,
.n200-section-acc .as-bg-image-wrapper,
.n200-section-scroll .as-bg-image-wrapper,
.n200-section-camera .as-bg-image-wrapper,
.n200-section-ai .as-bg-image-wrapper,
.n200-section-da .as-bg-image-wrapper,
.n200-section-black .as-bg-image-wrapper,
.n200-section-fingerprint .as-bg-image-wrapper,
.n200-section-memory .as-bg-image-wrapper {
    height: 680px;
}

.n200-pho .as-bg-image-wrapper {
    height: 720px;
}

@media screen and (max-width: 1439px) {
    .n200-section-more2 .as-bg-image-wrapper,
    .n200-section-5g .as-bg-image-wrapper,
    .n200-section-acc .as-bg-image-wrapper,
    .n200-section-scroll .as-bg-image-wrapper,
    .n200-section-camera .as-bg-image-wrapper,
    .n200-section-ai .as-bg-image-wrapper,
    .n200-section-da .as-bg-image-wrapper,
    .n200-section-black .as-bg-image-wrapper,
    .n200-section-fingerprint .as-bg-image-wrapper,
    .n200-section-memory .as-bg-image-wrapper {
        height: 680px;
    }
    .n200-pho .as-bg-image-wrapper {
        height: 720px;
    }
    .n200-section-da .as-bg-image-wrapper {
        height: 240px;
    }
    .n200-section-black .as-bg-image-wrapper {
        height: 5px;
    }
}

@media screen and (max-width: 768px) {
    .n200-section-more2 .as-bg-image-wrapper,
    .n200-section-5g .as-bg-image-wrapper,
    .n200-section-acc .as-bg-image-wrapper,
    .n200-section-scroll .as-bg-image-wrapper,
    .n200-section-camera .as-bg-image-wrapper,
    .n200-section-ai .as-bg-image-wrapper,
    .n200-section-memory .as-bg-image-wrapper {
        height: 680px;
    }
    .n200-pho .as-bg-image-wrapper {
        height: 480px;
    }
    .n200-section-fingerprint .as-bg-image-wrapper {
        height: 350px;
    }
}

.n200-section .n200-inner {
    left: 20%;
    right: 52%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
}
.n200-section.n200-right .n200-inner {
    left: 52%;
    right: 20%;
}
.n200-section.n200-center .n200-inner {
    left: 36%;
    right: 36%;
    top: 60px;
    -webkit-transform: initial;
    transform: initial;
    text-align: center;
}
.n200-section .n200-head {
    font-size: 3rem;
    line-height: 1.2;
}
.n200-section .n200-text {
    font-size: 1.25rem;
    margin-top: .625rem;
    line-height: 1.2;
}

.n200-section-scroll,
.n200-section-camera,
.n200-section-fingerprint {
    background-color: #000;
    color: #fff;
}

.n200-section-notes {
    max-width: 1280px;
    padding: 3% 0;
    margin: 0 auto;
}
.n200-section-notes p {
    font-size: .9rem;
    margin-bottom: .25rem;
}
.n200-section-notes .n200-head {
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 1rem;
}

@media screen and (max-width: 768px) {
    .n200-section .n200-inner {
        left: 10%;
        right: 10%;
        top: 0%;
        -webkit-transform: initial;
        transform: initial;
        text-align: center;
    }

    .n200-section .n200-head {
        font-size: 1.75rem;
    }
    .n200-section .n200-text {
        font-size: 1.125rem;
    }
    .n200-section.n200-right .n200-inner {
        left: 10%;
        right: 10%;
    }
    .n200-section.n200-center .n200-inner {
        left: 10%;
        right: 10%;
        top: inherit;
    }
    .n200-section-ai .n200-inner,
    .n200-section-scroll .n200-inner {
        top: 57%;
    }

    .n200-section-notes {
        max-width: unset;
        padding: 6% 15px;
    }
    .n200-section-notes p {
        font-size: .85rem;
        margin-bottom: .25rem;
    }
}

.n200-section-more {
    position: relative;
}
.n200-section-more .n200-more-f {
    padding: 4% 0 4% 52%;
}
.n200-section-more .n200-more-f ul {
    margin: 0;
    padding: 0;
}
.n200-section-more .n200-more-f li {
    margin: 0;
    padding: 0 0 .625rem;
    font-size: 2.5rem;
    list-style: none;
}
.n200-section-more .n200-more-f li::before {
    content: "+";
    margin-right: 16px;
    color: #03afd1;
    font-size: .85em;
}
.n200-section-more .n200-head {
    color: #ec1b28;
    font-size: 4.5rem;
}

@media screen and (max-width: 768px) {
    .n200-section-more {
        padding: 11% 0;
        background-image: url(../n200/more_bg.jpg);
        background-size: 100%;
    }
    .n200-section-more .n200-more-f {
        padding: 3% 7%;
    }
    .n200-section-more .n200-head {
        font-size: 3rem;
    }
    .n200-section-more .n200-more-f li {
        font-size: 1.75rem;
        line-height: 1.2;
        padding-bottom: .5rem;
    }
    .n200-section-more .n200-inner {
        position: initial;
        top: unset;
        left: unset;
        right: unset;
        bottom: unset;
        -webkit-transform: initial;
        transform: initial;
        text-align: left;
        padding: 3% 7%;
    }
}