#honorx7d {
font-family: "HONOR Sans World Regular";
background: #fff;
}

#honorx7d .nowrap {
white-space: nowrap;
}

#honorx7d section,
#honorx7d div,
#honorx7d h2,
#honorx7d h3,
#honorx7d h4,
#honorx7d ul,
#honorx7d ol,
#honorx7d li,
#honorx7d p,
#honorx7d form,
#honorx7d table,
#honorx7d th,
#honorx7d td,
#honorx7d figure,
#honorx7d button {
border: none;
margin: 0px;
padding: 0px;
color: #000;
font-weight: normal;
box-sizing: border-box;
}

#honorx7d h2,
#honorx7d h3,
#honorx7d h4 {
line-height: 1.25;
}

#honorx7d p,
#honorx7d span {
line-height: 1.4;
}

#honorx7d button {
background-color: transparent;
cursor: pointer;
}

#honorx7d sup {
position: relative !important;
font-size: 50% !important;
line-height: 0 !important;
vertical-align: super !important;
top: 0 !important;
}

#honorx7d sup.zw-sup {
position: relative !important;
font-size: 50% !important;
line-height: 0 !important;
vertical-align: super !important;
top: 0 !important;
transform: none !important;
}

#honorx7d picture,
#honorx7d img,
#honorx7d video,
#honorx7d canvas {
display: block;
width: 100%;
height: 100%;
max-width: none;
}

#honorx7d img {
vertical-align: middle;
}

#honorx7d a {
color: inherit;
text-decoration: none;
}

#honorx7d *,
#honorx7d *::before,
#honorx7d *::after {
-webkit-font-smoothing: antialiased;
box-sizing: border-box;
text-rendering: optimizeLegibility;
}

#honorx7d *:focus,
#honorx7d *:active {
outline: none;
}

#honorx7d .object-fit {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}

#honorx7d .object-contain {
height: 100%;
-o-object-fit: contain;
object-fit: contain;
}

#honorx7d .ff-demiBold {
font-family: "HONOR Sans World DemiBold";
}

#honorx7d .ff-medium {
font-family: "HONOR Sans World Medium";
}

#honorx7d .ff-Regu {
font-family: "HONOR Sans World Regular";
}

#honorx7d .ff-Light {
font-family: "HONOR Sans World Light";
}

#honorx7d .blk-color {
color: #000;
}

#honorx7d .swiperBtn {
cursor: pointer;
}

#honorx7d .fs-80 {
font-size: 4.1666666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .fs-80 {
font-size: 9.6vw;
}
}

#honorx7d .fs-56 {
font-size: 2.9166666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .fs-56 {
font-size: 8.5333333333vw;
}
}

#honorx7d .fs-64 {
font-size: 3.03333333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .fs-64 {
font-size: 6.5333333333vw;
}
}

#honorx7d .fs-48 {
font-size: 2.5vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .fs-48 {
font-size: 5.8666666667vw;
}
}

#honorx7d .fs-40 {
font-size: 2.0833333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .fs-40 {
font-size: 6.4vw;
}
}

#honorx7d .fs-32 {
font-size: 1.6666666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .fs-32 {
font-size: 4.8vw;
}
}

#honorx7d .fs-24 {
font-size: 1.25vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .fs-24 {
font-size: 3.7333333333vw;
}
}

#honorx7d .fs-20 {
font-size: 0.9375vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .fs-20 {
font-size: 3.7333333333vw;
}
}

#honorx7d .fs-18 {
font-size: 0.9375vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .fs-18 {
font-size: 3.7333333333vw;
}
}

#honorx7d .mob-show {
display: none !important;
}

#honorx7d .mob-show-inline {
display: none !important;
}

#honorx7d .pc-show-inline {
display: inline-block !important;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .mob-show {
display: block !important;
}

#honorx7d .mob-show-inline {
display: inline-block !important;
}

#honorx7d .pc-show {
display: none !important;
}

#honorx7d .pc-show-inline {
display: none !important;
}
}

#honorx7d .sec-bottom-nodes {
width: 62.5vw;
height: -moz-max-content;
height: max-content;
padding: 0vw 0 5.2083333333vw 0;
margin: 0 auto;
padding-top: 10.5vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .sec-bottom-nodes {
width: 79%;
padding: 28vw 0 13.3333333333vw 0;
margin-top: 0;
}
}

#honorx7d .sec-bottom-nodes .line {
height: 1px;
width: 100%;
background: rgb(0, 0, 0);
margin-bottom: 2.6041666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .sec-bottom-nodes .line {
margin-bottom: 13.3333333333vw;
}
}

#honorx7d .sec-bottom-nodes ul.bz-txt {
padding-left: 14px;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .sec-bottom-nodes ul.bz-txt {
padding-left: 12px;
}
}

#honorx7d .sec-bottom-nodes .node-beizhu {
padding: 0 1.06vw;
margin: 3.6458333333vw 0 1.0416666667vw;
font-size: 14px;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .sec-bottom-nodes .node-beizhu {
padding: 0;
margin: 9.3333333333vw 0 4vw;
font-size: 12px;
}
}

#honorx7d .sec-bottom-nodes li {
list-style: decimal !important;
line-height: 1.3;
margin-bottom: 0.3125vw;
font-size: 14px;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .sec-bottom-nodes li {
font-size: 12px;
}
}

#honorx7d .sec-bottom-nodes ul.bz {
width: 100%;
margin-left: -0.8333333333vw;
padding-left: 2.5625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .sec-bottom-nodes ul.bz {
margin-left: 0;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .sec-bottom-nodes ul.bz {
padding-left: 12px;
}
}

#honorx7d .sec-bottom-nodes .mianze {
margin-top: 1.875vw;
padding-left: 1.02625vw;
font-size: 14px;
margin-bottom: 1.0416666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .sec-bottom-nodes .mianze {
font-size: 12px;
margin-bottom: 4vw;
margin-top: 8vw;
padding: 0 0 0 0;
}
}

#honorx7d .sec-bottom-nodes .dot-star {
padding-left: 1.2625vw;
}

#honorx7d .sec-bottom-nodes .dot-star li {
list-style: none !important;
position: relative;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .sec-bottom-nodes .dot-star {
padding-left: 12px;
}
}

#honorx7d .sec-bottom-nodes .dot-star li::after {
content: "*";
position: absolute;
top: 0;
left: 0;
transform: translateX(calc(-100% - 0.1041666667vw));
}

#honorx7d .section-kv .kvBuyBtn {
position: relative;
display: inline-block;
text-align: center;
font-size: 0.9375vw;
border-radius: 2.6041666667vw;
border: 1.5px solid #7f7f7f;
color: #000;
z-index: 4;
padding: 0.5208333333vw 1.5625vw;
line-height: 1;
transition: border-color 0.1s linear;
z-index: 99;
margin: 0 0.78vw;
}

@media (min-width: 1366px) {
#honorx7d .section-kv .kvBuyBtn:hover {
border-color: #000;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .kvBuyBtn {
margin: 0 1.333vw 0;
font-size: 3.7333333333vw;
transform: none;
padding: 2.1333vw 4.8vw;
border-radius: 8vw;
}
}

.honorx7d section {
position: relative;
}

.honorx7d .sticky-container {
position: sticky;
top: 52px;
height: calc(100vh - 52px);
overflow: hidden;
}

.honorx7d .text-gradient {
display: inline-block;
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
background-clip: text;
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
}

#honorx7d .popup {
position: fixed;
top: 52px;
left: 0;
width: 100%;
height: 100%;
background: rgb(0, 0, 0);
display: none;
z-index: 99999;
}

#honorx7d .popup.is-active {
display: block;
}

#honorx7d .popup .popupcloseBtn {
position: absolute;
top: calc(15vh + 0.2604166667vw);
right: -4.5833333333vw;
width: 2.2916666667vw;
height: 2.2916666667vw;
display: block;
cursor: pointer;
mix-blend-mode: difference;
overflow: hidden;
clip-path: inset(1px);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .popup .popupcloseBtn {
right: 6vw;
width: 5.3333333333vw;
height: 5.3333333333vw;
}
}

#honorx7d .popup .popupcloseBtn::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 3.2291666667vw;
height: 1px;
background-color: #fff;
transform: rotate(45deg);
transform-origin: 0% 0%;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .popup .popupcloseBtn::before {
width: 8.5333333333vw;
}
}

#honorx7d .popup .popupcloseBtn::after {
content: "";
position: absolute;
bottom: -0.1041666667vw;
left: -0.1041666667vw;
width: 3.2291666667vw;
height: 1px;
background-color: #fff;
transform: rotate(-45deg);
transform-origin: 0% 0%;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .popup .popupcloseBtn::after {
width: 8.5333333333vw;
}
}

#honorx7d .popup .popup-container {
position: relative;
width: 70%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .popup .popup-container {
width: 100%;
}
}

#honorx7d .popup .popup-container.is-video .videoWrapper {
display: block;
}

#honorx7d .popup .videoWrapper {
display: none;
height: 70%;
}

#honorx7d .popup .videoWrapper #video-popup {
height: 100%;
-o-object-fit: contain;
object-fit: contain;
border-radius: 0.4166666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .popup .videoWrapper.spec {
height: auto;
}
}

#honorx7d .replayBtn {
display: flex;
align-items: center;
font-size: 0.9375vw;
color: #256fff;
opacity: 1;
visibility: hidden;
transition: opacity 0.5s ease;
will-change: opacity;
width: -moz-max-content;
width: max-content;
height: -moz-max-content;
height: max-content;
cursor: pointer;
z-index: 30;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .replayBtn {
font-size: 3.7333333333vw;
}
}

#honorx7d .replayBtn img.icon-replay {
width: 1.0416666667vw !important;
height: 1.0416666667vw !important;
margin-right: 0.5208333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .replayBtn img.icon-replay {
width: 3.7333333333vw !important;
height: 3.7333333333vw !important;
margin-right: 1.3333333333vw;
}
}

#honorx7d .section-kv {
height: 56.25vw;
width: 100%;
overflow: hidden;
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv {
height: 177.8666666667vw;
}
}

#honorx7d .section-kv .text-wrapper {
width: 42.9895833333vw;
position: absolute;
top: 50%;
left: 46%;
transform: translate(calc(-50% + 30vw), calc(-50% - 0vw))scale(.95);
text-align: center;
z-index: 3;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper {
width: 190vw;
transform: translate(-48%, calc(-50% - 63vw)) scale(0.8);
}
}

#honorx7d .section-kv .text-wrapper .product-name {
width: 30.46875vw;
height: auto;
margin: 0 auto 1.5625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .product-name {
width: 70.6666666667vw;
margin: 0 auto 4vw;
}
}

#honorx7d .section-kv .text-wrapper .slogn {
font-size: 2.0833333333vw;
margin: 0 auto;
margin-bottom: 1.5625vw;
display: flex;
align-items: center;
justify-content: center;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .slogn {
font-size: 4.8vw;
margin-bottom: 4vw;
}
}

#honorx7d .section-kv .text-wrapper .slogn .line {
width: 1px;
border-left: 1px solid #000;
margin-right: 0.8333333333vw;
margin-left: 0.8333333333vw;
height: 1.7708333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .slogn .line {
height: 4vw;
margin-right: 1.8666666667vw;
margin-left: 1.8666666667vw;
}
}

#honorx7d .section-kv .text-wrapper .slogn .ai-img {
width: 3.28125vw;
height: 1.71875vw;
display: inline-block;
transform: translateY(-0.1vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .slogn .ai-img {
width: 7.2727272727vw;
height: 4.1212121212vw;
transform: translateY(-0.2vw);
}
}

#honorx7d .section-kv .text-wrapper .ksp {
width: 100%;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
gap: 1vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .ksp {
transform: scale(0.46);
transform-origin: top;
width: 100%;
gap: 4vw;
}
}

#honorx7d .section-kv .text-wrapper .ksp .line {
width: 1px;
height: 2.0833333333vw;
border-left: 1px solid #000;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .ksp .line {
height: 9vw;
border-left: 1px solid #000;
}
}

#honorx7d .section-kv .text-wrapper .ksp .detail .title {
font-size: 0.9375vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .ksp .detail .title {
font-size: 4.2666666667vw;
}
}

#honorx7d .section-kv .text-wrapper .ksp .detail .copy {
font-size: 0.9375vw;
white-space: nowrap;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .ksp .detail .copy {
font-size: 4.2666666667vw;
}
}

#honorx7d .section-kv .text-wrapper .button-wrapper {
display: flex;
align-items: center;
justify-content: center;
margin-top: 1.05625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .button-wrapper {
margin-top: 1vw;
}
}

#honorx7d .section-kv .text-wrapper .playBtn {
display: flex;
align-items: center;
white-space: nowrap;
margin: 0 0.78125vw;
font-size: 0.9375vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .playBtn {
font-size: 3.7333333333vw;
margin: 0 1.3333333333vw;
}
}

#honorx7d .section-kv .text-wrapper .playBtn .icon-play {
width: 0.9375vw;
height: auto;
margin-right: 0.3645833333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .text-wrapper .playBtn .icon-play {
width: 4.8vw;
height: auto;
margin-right: 1.8666666667vw;
}
}

#honorx7d .section-kv .bottom-txt {
width: 110vw;
position: absolute;
top: 50.5vw;
right: 2.3020833333vw;
display: flex;
flex-direction: column;
align-items: flex-end;
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-kv .bottom-txt {
width: 180vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .bottom-txt {
width: 195vw;
top: 164.133333vw;
right: 4vw;
opacity: 1;
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-kv .bottom-txt {
top: 165vw;
}
}

/* #honorx7d .section-kv .bottom-txt .kv-logo{
display: contents !important;
} */
#honorx7d .section-kv .bottom-txt .tuv-os {
display: flex;
align-items: flex-start;
justify-content: center;
/* margin-bottom: 0.78125vw; */
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .bottom-txt .tuv-os {
margin-bottom: -0.4vw;
transform: scale(0.8);
margin-right: -3vw;
}
}

#honorx7d .section-kv .bottom-txt .tuv-os .os-img {
width: 6.7708333333vw;
height: 1.4145833333vw;
margin: auto 0.3vw;
}

#honorx7d .section-kv .bottom-txt .tuv-os .snapdragon {
width: 100%;
}

#honorx7d .section-kv .bottom-txt .tuv-os .nfc {
width: 100%;
height: 2.1vw;
}

#honorx7d .section-kv .bottom-txt .tuv-os .dxomark {
width: 100%;
height: 2.8vw;
}

#honorx7d .section-kv .bottom-txt .tuv-os .ai {
width: 100%;
height: 1.7vw;
}

#honorx7d .section-kv .bottom-txt .tuv-os .sgs {
width: 100%;
height: 2.5vw;
}


@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .bottom-txt .tuv-os .os-img {
width: 14.0533333333vw;
height: 3.7333333333vw;
margin: auto 0.6vw;
}

#honorx7d .section-kv .bottom-txt .tuv-os .snapdragon {
width: 100%;
height: 3.4vw;
}

#honorx7d .section-kv .bottom-txt .tuv-os .nfc {
width: 100%;
height: 4.1vw;
}

#honorx7d .section-kv .bottom-txt .tuv-os .dxomark {
width: 100%;
height: 5.8vw;
}

#honorx7d .section-kv .bottom-txt .tuv-os .ai {
width: 100%;
height: 3.7vw;
}

#honorx7d .section-kv .bottom-txt .tuv-os .sgs {
width: 100%;
height: 5vw;
}
}

#honorx7d .section-kv .bottom-txt p {
width: 100%;
font-size: 0.416666667vw;
transform: scale(0.54);
transform-origin: right top;
text-align: right;
opacity: 0.6;
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-kv .bottom-txt p {
font-size: 8px;
}
}

@media (width: 1600px) and (orientation: landscape) {
#honorx7d .section-kv .bottom-txt p {
transform: scale(0.25);
}
}

@media (width: 1366px) and (orientation: landscape) {
#honorx7d .section-kv .bottom-txt {
width: 116vw;
}

#honorx7d .section-kv .bottom-txt p {
transform: scale(0.36);
}
}

@media (width: 1024px) and (orientation: landscape) {
#honorx7d .section-kv .bottom-txt p {
transform: scale(0.35);
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-kv .bottom-txt p {
font-size: 8px;
transform: scale(0.4);
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-kv .bottom-txt p {
transform: scale(0.21);
}
}

#honorx7d .section-point {
overflow: hidden;
}

#honorx7d .section-point .sticky-container {
height: auto;
position: sticky;
padding-bottom: 8.3333333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .sticky-container {
padding-bottom: 14.1333333333vw;
}
}

#honorx7d .section-point .point-title {
padding: 6.25vw 0 4.1666666667vw;
text-align: center;
width: 100%;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-title {
padding: 17.8666666667vw 0 8vw;
}
}

#honorx7d .section-point .point-content {
width: 72.9166666667vw;
height: 58.9583333333vw;
position: relative;
margin: 0 auto;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content {
width: 89.3333333333vw;
height: 398.9333333333vw;
}
}

#honorx7d .section-point .point-content .every-point {
position: absolute;
cursor: pointer;
border-radius: 1.25vw;
overflow: hidden;
transform: rotate(0);
text-align: left;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point {
border-radius: 3.2vw;
}
}

#honorx7d .section-point .point-content .every-point .bg {
transition: all 0.5s ease;
}

#honorx7d .section-point .point-content .every-point:hover .bg {
transform: scale(1.05);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point:hover .bg {
transform: scale(1);
}
}

#honorx7d .section-point .point-content .every-point .text-wrapper {
position: absolute;
top: 1.875vw;
left: 1.5104166667vw;
z-index: 1;
width: 31.9479166667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point .text-wrapper {
top: 5.8666666667vw;
left: 5.3333333333vw;
}
}

#honorx7d .section-point .point-content .every-point .text-wrapper .point-tit {
font-size: 1.46666666667vw;
width: 100%;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point .text-wrapper .point-tit {
font-size: 3.9vw;
}
}

#honorx7d .section-point .point-content .every-point1 {
left: 0;
top: 0;
width: 36.0416666667vw;
height: 22.9166666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point1 {
width: 100%;
height: 57.0666666667vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point1 .text-wrapper {
width: 54.6666666667vw;
}
}

#honorx7d .section-point .point-content .every-point1 .text-wrapper .point-tit {
margin-bottom: 1.3020833333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point1 .text-wrapper .point-tit {
margin-bottom: 4vw;
}
}

#honorx7d .section-point .point-content .every-point1 .text-wrapper .sgs-wrapper {
width: 12.8942708333vw;
height: 2.8208333333vw;
position: relative;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point1 .text-wrapper .sgs-wrapper {
width: 39.2vw;
height: 8.5333333333vw;
border-radius: 1.4666666667vw;
overflow: hidden;
transform: rotate(0);
}
}

#honorx7d .section-point .point-content .every-point1 .text-wrapper .sgs-wrapper .sgs-copy {
position: absolute;
top: 1.5302083333vw;
left: 2.9125vw;
font-size: 0.8333333333vw;
width: 22.6666666667vw;
transform: scale(0.5);
transform-origin: 0 0;
line-height: 1.2;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point1 .text-wrapper .sgs-wrapper .sgs-copy {
top: 5.0666666667vw;
left: 9vw;
width: 68.3333333333vw;
font-size: 3.2vw;
transform: scale(0.35);
}
}

#honorx7d .section-point .point-content .every-point2 {
right: 0;
top: 0;
width: 36.0416666667vw;
height: 22.9166666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point2 {
width: 100%;
height: 57.0666666667vw;
top: 61.3333333333vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point2 .text-wrapper {
width: 80%;
}
}

#honorx7d .section-point .point-content .every-point2 .out-perspective {
width: 100%;
height: 100%;
perspective: 100vw;
perspective-origin: 339% 409%;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point2 .out-perspective {
perspective-origin: 171% 211%;
}
}

#honorx7d .section-point .point-content .every-point2 .mah-big {
position: absolute;
top: 11.9vw;
left: 11.15vw;
z-index: 2;
transform: rotate3d(1, 0, 1, 31deg);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point2 .mah-big {
top: 30.9vw;
left: 31.15vw;
}
}

#honorx7d .section-point .point-content .every-point2 .mah-big .txt {
white-space: nowrap;
font-size: 5.7291666667vw;
background-image: linear-gradient(to top, #FFF2A9, #FFFDED);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point2 .mah-big .txt {
font-size: 15.4666666667vw;
}
}

#honorx7d .section-point .point-content .every-point2 .mah-big .txt span {
font-size: 2.34375vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point2 .mah-big .txt span {
font-size: 5.8666666667vw;
}
}

#honorx7d .section-point .point-content .every-point2 .mah-big .txt1 {
position: relative;
z-index: 2;
}

#honorx7d .section-point .point-content .every-point2 .mah-big .txt2 {
position: absolute;
top: 0;
left: 0;
background-image: none;
color: #E7911E;
z-index: 1;
transform: translate(4px, 4px);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point2 .mah-big .txt2 {
transform: translate(3px, 3px);
}
}

#honorx7d .section-point .point-content .every-point3 {
right: 0;
bottom: 0;
width: 24.4270833333vw;
height: 35.2083333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point3 {
width: 100%;
height: 74.6666666667vw;
top: 122.6666666667vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point3 .text-wrapper {
width: 80%;
}
}

#honorx7d .section-point .point-content .every-point3 .ai-icon {
width: 2.365625vw;
height: 1.40625vw;
transform: translateY(-0.2vw);
display: inline-block;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point3 .ai-icon {
width: 5.97333333333vw;
height: 4vw;
transform: translateY(-0.4vw);
}
}

#honorx7d .section-point .point-content .every-point4 {
left: 0;
top: 23.75vw;
width: 47.65625vw;
height: 15.625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point4 {
width: 100%;
height: 57.0666666667vw;
top: 201.6vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point4 .text-wrapper {
width: 100%;
}
}

#honorx7d .section-point .point-content .every-point4 .ai-icon {
width: 2.365625vw;
height: 1.40625vw;
transform: translateY(-0.2vw);
display: inline-block;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point4 .ai-icon {
width: 5.97333333333vw;
height: 4vw;
transform: translateY(-0.4vw);
}
}

#honorx7d .section-point .point-content .every-point5 {
left: 0;
top: 40.2083333333vw;
width: 23.4375vw;
height: 18.75vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point5 {
width: 100%;
height: 73.0666666667vw;
top: 262.9333333333vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point5 .text-wrapper {
width: 80%;
}
}

#honorx7d .section-point .point-content .every-point6 {
left: 24.2708333333vw;
top: 40.2083333333vw;
width: 23.4375vw;
height: 18.75vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point6 {
width: 100%;
height: 58.6666666667vw;
left: 0;
top: 340.2666666667vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-point .point-content .every-point6 .text-wrapper {
width: 60%;
}
}

#honorx7d .section-cmf {
height: 135vh;
}

#honorx7d .section-cmf #trigger-cmf-1 {
position: absolute;
top: 5vh;
}

#honorx7d .section-cmf.is-active1 .cmf-bg1 {
opacity: 0;
}

#honorx7d .section-cmf.is-active1 .cmf-content {
opacity: 1;
}

#honorx7d .section-cmf .sticky-container {
height: calc(110vh - 52px);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .sticky-container {
height: calc(100vh - 52px);
}
}

#honorx7d .section-cmf .cmf-bg1 {
width: 100%;
position: absolute;
left: 50%;
z-index: 1;
transition: all 0.5s ease;
height: calc(100vh - 52px);
top: 0;
transform: translate(-50%, 0);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-bg1 {
height: 100%;
top: 50%;
transform: translate(-50%, -50%);
}
}

#honorx7d .section-cmf .cmf-bg1 .top-shadow {
width: 100%;
height: 5vw;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0));
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-bg1 .top-shadow {
height: 20vw;
}
}

#honorx7d .section-cmf .cmf-bg1 .copy-title {
font-size: 7.2916666667vw;
width: 66.6666666667vw;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
background-image: linear-gradient(90deg, #814F22 0%, #D3AB7A 100%);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-bg1 .copy-title {
font-size: 9.6vw;
width: 86%;
}
}

#honorx7d .section-cmf .cmf-bg1 .copy-title sup {
-webkit-text-fill-color: #D3AB7A;
}

#honorx7d .section-cmf.is-color-gold .cmf-content .bg-wrapper .bg1 {
opacity: 1;
}

#honorx7d .section-cmf.is-color-gold .cmf-content .text-wrapper .txt-all .txt1 {
opacity: 1;
}

#honorx7d .section-cmf.is-color-gold .cmf-content .text-wrapper .cmf-btn1 .icon-circel {
opacity: 1;
}

#honorx7d .section-cmf.is-color-cyan .cmf-content .bg-wrapper .bg2 {
opacity: 1;
}

#honorx7d .section-cmf.is-color-cyan .cmf-content .text-wrapper .txt-all .txt2 {
opacity: 1;
}

#honorx7d .section-cmf.is-color-cyan .cmf-content .text-wrapper .cmf-btn2 .icon-circel {
opacity: 1;
}

#honorx7d .section-cmf.is-color-gray .cmf-content .bg-wrapper .bg3 {
opacity: 1;
}

#honorx7d .section-cmf.is-color-gray .cmf-content .text-wrapper .txt-all .txt3 {
opacity: 1;
}

#honorx7d .section-cmf.is-color-gray .cmf-content .text-wrapper .cmf-btn3 .icon-circel {
opacity: 1;
}

#honorx7d .section-cmf.is-color-black .cmf-content .bg-wrapper .bg4 {
opacity: 1;
}

#honorx7d .section-cmf.is-color-black .cmf-content .text-wrapper .txt-all .txt4 {
opacity: 1;
}

#honorx7d .section-cmf.is-color-black .cmf-content .text-wrapper .cmf-btn4 .icon-circel {
opacity: 1;
}

#honorx7d .section-cmf .cmf-content {
height: 100%;
width: 100%;
position: relative;
background: #fff;
z-index: 2;
opacity: 0;
transition: all 0.5s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content {
display: flex;
flex-direction: column;
align-items: center;
}
}

#honorx7d .section-cmf .cmf-content .bg-wrapper {
height: 100%;
width: 100%;
position: relative;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content .bg-wrapper {
margin-top: 4vw;
width: 55.8333333333vw;
height: 85vw;
border-radius: 2.1333333333vw;
transform: rotate(0);
overflow: hidden;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-cmf .cmf-content .bg-wrapper {
width: 89.3333333333vw;
height: 136vw;
border-radius: 3.2vw;
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-cmf .cmf-content .bg-wrapper {
width: 35.7333333333vw;
height: 54.4vw;
}
}

#honorx7d .section-cmf .cmf-content .bg-wrapper .bg {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
opacity: 0;
transition: opacity 0.5s ease;
}

#honorx7d .section-cmf .cmf-content .text-wrapper {
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% - 22vw), -50%);
width: 20.6666666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content .text-wrapper {
width: 66.6666666667vw;
display: flex;
flex-direction: column;
align-items: center;
position: static;
margin-top: 5.3333333333vw;
transform: none;
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-cmf .cmf-content .text-wrapper {
margin-top: 3.2vw;
}
}

#honorx7d .section-cmf .cmf-content .text-wrapper .txt-all {
margin-bottom: 2.34375vw;
position: relative;
width: 100%;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content .text-wrapper .txt-all {
margin-bottom: 3.7333333333vw;
text-align: center;
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-cmf .cmf-content .text-wrapper .txt-all {
margin-bottom: 2.1333333333vw;
}
}

#honorx7d .section-cmf .cmf-content .text-wrapper .txt-all .txt {
width: 100%;
opacity: 0;
transition: all 0.5s ease;
}

#honorx7d .section-cmf .cmf-content .text-wrapper .txt-all .txt2,
#honorx7d .section-cmf .cmf-content .text-wrapper .txt-all .txt3,
#honorx7d .section-cmf .cmf-content .text-wrapper .txt-all .txt4 {
position: absolute;
left: 0;
top: 0;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {

#honorx7d .section-cmf .cmf-content .text-wrapper .txt-all .txt2,
#honorx7d .section-cmf .cmf-content .text-wrapper .txt-all .txt3,
#honorx7d .section-cmf .cmf-content .text-wrapper .txt-all .txt4 {
left: 50%;
transform: translate(-50%, 0);
}
}

#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn {
margin-right: 1.5625vw;
position: relative;
cursor: pointer;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn {
margin-right: 3.2vw;
margin-left: 3.2vw;
}
}

#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn .icon-circel {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 2.3958333333vw;
height: 2.3958333333vw;
border-radius: 999px;
opacity: 0;
transition: all 0.5s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn .icon-circel {
width: 6.4vw;
height: 6.4vw;
}
}

#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn .icon {
width: 1.875vw;
height: 1.875vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn .icon {
width: 4.2666666667vw;
height: 4.2666666667vw;
}
}

#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn.cmf-btn1 .icon-circel {
border: 0.1041666667vw solid #D3AB7A;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn.cmf-btn1 .icon-circel {
border: 1px solid #D3AB7A;
}
}

#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn.cmf-btn2 .icon-circel {
border: 0.1041666667vw solid #15615B;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn.cmf-btn2 .icon-circel {
border: 1px solid #15615B;
}
}

#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn.cmf-btn3 .icon-circel {
border: 0.1041666667vw solid #6E6E6E;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn.cmf-btn3 .icon-circel {
border: 1px solid #6E6E6E;
}
}

#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn.cmf-btn4 .icon-circel {
border: 0.1041666667vw solid #000;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-cmf .cmf-content .text-wrapper .cmf-btn.cmf-btn4 .icon-circel {
border: 1px solid #000;
}
}

#honorx7d .section-design {
height: 130vh;
margin-top: 3vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design {
margin-top: 0;
}
}

#honorx7d .section-design.is-active1 .bgd {
opacity: 0;
transition: all 0.5s ease 0.2s;
}

#honorx7d .section-design.is-active1 .copy-wrapper .copy-title {
transform: translateY(-30vw);
opacity: 0;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design.is-active1 .copy-wrapper .copy-title {
transform: none;
opacity: 0;
}
}

#honorx7d .section-design.is-active1 .copy-wrapper .copy-text {
transform: translateY(30vw);
opacity: 0;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design.is-active1 .copy-wrapper .copy-text {
transform: none;
opacity: 0;
}
}

#honorx7d .section-design.is-active1 .detail-wrapper .every-detail {
transform: translateX(0);
}

#honorx7d .section-design .top-shadow {
width: 100%;
height: 5vw;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0));
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .top-shadow {
height: 20vw;
}
}

#honorx7d .section-design .bgd {
transition: all 0.7s ease;
}

#honorx7d .section-design .copy-wrapper {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 80%;
text-align: center;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .copy-wrapper {
width: 90%;
}
}

#honorx7d .section-design .copy-wrapper .copy-title {
margin-bottom: 1.8229166667vw;
background-image: linear-gradient(90deg, #814F22 0%, #D3AB7A 100%);
font-size: 7.2916666667vw;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .copy-wrapper .copy-title {
font-size: 9.6vw;
margin-bottom: 2.6666666667vw;
}
}

#honorx7d .section-design .copy-wrapper .copy-text {
font-size: 3.3333333333vw;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .copy-wrapper .copy-text {
font-size: 6.4vw;
}
}

#honorx7d .section-design .detail-wrapper {
width: 72.9166666667vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
justify-content: space-between;
flex-direction: row-reverse;
z-index: 2;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .detail-wrapper {
width: 89.3333333333vw;
flex-direction: column-reverse;
align-items: center;
}
}

#honorx7d .section-design .detail-wrapper .every-detail {
transition: all 0.7s ease;
}

#honorx7d .section-design .detail-wrapper .every-detail p {
position: absolute;
top: 2.0833333333vw;
left: 3.125vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .detail-wrapper .every-detail p {
top: 5.3333333333vw;
left: 4.2666666667vw;
transform: scale(0.6);
transform-origin: left top;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-design .detail-wrapper .every-detail p {
transform: scale(1);
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-design .detail-wrapper .every-detail p {
top: 2.6666666667vw;
left: 2.1333333333vw;
transform: scale(0.45);
transform-origin: left top;
}
}

#honorx7d .section-design .detail-wrapper .every-detail1 {
position: relative;
width: 29.1666666667vw;
height: 43.125vw;
transform: translateX(45vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .detail-wrapper .every-detail1 {
width: 66.1728395062vw;
height: 35.5555555556vw;
margin-bottom: 0vw;
transform: translateX(-96vw);
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-design .detail-wrapper .every-detail1 {
width: 89.3333333333vw;
height: 48vw;
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-design .detail-wrapper .every-detail1 {
width: 42.5396825397vw;
height: 22.8571428571vw;
}
}

#honorx7d .section-design .detail-wrapper .every-detail1 p {
width: 23.6770833333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .detail-wrapper .every-detail1 p {
width: 46.6666666667vw;
}
}

#honorx7d .section-design .detail-wrapper .every-detail2 {
position: relative;
width: 42.9166666667vw;
height: 21.1458333333vw;
margin-bottom: 0.8333333333vw;
transform: translateX(-60vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .detail-wrapper .every-detail2 {
width: 66.1728395062vw;
height: 35.5555555556vw;
margin-bottom: 4.2666666667vw;
transform: translateX(-96vw);
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-design .detail-wrapper .every-detail2 {
width: 89.3333333333vw;
height: 48vw;
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-design .detail-wrapper .every-detail2 {
width: 42.5396825397vw;
height: 22.8571428571vw;
}
}

#honorx7d .section-design .detail-wrapper .every-detail2 p {
width: 12.8125vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .detail-wrapper .every-detail2 p {
width: 50.7333333333vw;
}
}

#honorx7d .section-design .detail-wrapper .every-detail3 {
position: relative;
width: 42.9166666667vw;
height: 21.1458333333vw;
transform: translateX(-60vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .detail-wrapper .every-detail3 {
width: 66.1728395062vw;
height: 35.5555555556vw;
transform: translateX(96vw);
margin-bottom: 4.2666666667vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-design .detail-wrapper .every-detail3 {
width: 89.3333333333vw;
height: 48vw;
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-design .detail-wrapper .every-detail3 {
width: 42.5396825397vw;
height: 22.8571428571vw;
}
}

#honorx7d .section-design .detail-wrapper .every-detail3 p {
width: 17.1354166667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-design .detail-wrapper .every-detail3 p {
width: 49.3333333333vw;
}
}

#honorx7d .section-design .detail-wrapper .detail-flex {
display: flex;
flex-direction: column;
}

#honorx7d .section-battery {
height: 150vh;
margin-top: 3vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery {
margin-top: 0;
}
}

#honorx7d .section-battery .sticky-container {
background: linear-gradient(to top, #FFFFFF 65%, #F8EFE4 100%);
}

#honorx7d .section-battery.is-active1 .text-wrapper {
opacity: 1;
transition: all 0.7s ease 0.3s;
}

#honorx7d .section-battery.is-active1 .bg-wrapper {
transform: translate(calc(-50% + 16vw - 2.2vw), calc(-50% + 1vw)) scale(1);
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery.is-active1 .bg-wrapper {
transform: translate(calc(-50% + 14vw), calc(-50% + 27vw)) scale(1);
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-battery.is-active1 .bg-wrapper {
transform: translate(calc(-50% + 14vw), calc(-50% + 27vw)) scale(0.7);
}
}

#honorx7d .section-battery.is-active2 .text-wrapper .top-text .copy-wrapper1 {
opacity: 0;
}

#honorx7d .section-battery.is-active2 .text-wrapper .top-text .copy-wrapper2 {
opacity: 1;
transform: translateY(0);
}

#honorx7d .section-battery.is-active2 .text-wrapper .bottom-text .txt {
opacity: 0;
}

#honorx7d .section-battery.is-active2 .bg-wrapper .bg-txt .repeat-all1 {
opacity: 0;
}

#honorx7d .section-battery.is-active2 .bg-wrapper .bg-txt .repeat-all2 {
opacity: 1;
}

#honorx7d .section-battery .top-shadow {
width: 100%;
height: 5vw;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0));
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .top-shadow {
height: 20vw;
}
}

#honorx7d .section-battery .text-wrapper {
width: 70.8125vw;
position: absolute;
top: 50%;
left: 54%;
transform: translate(calc(-50% - 18.5vw + 13.4375vw), calc(-50% - 7vw));
opacity: 0;
transition: all 0.7s ease;
z-index: 2;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .text-wrapper {
width: 89.3333333333vw;
transform: translate(-50%, calc(-50% - 33vw)) scale(0.7);
transform-origin: left bottom;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-battery .text-wrapper {
transform: translate(-50%, calc(-50% - 33vw));
transform-origin: center;
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-battery .text-wrapper {
transform: translate(-30%, calc(-50% - 34vw)) scale(0.5);
transform-origin: left bottom;
width: 149vw;
}
}

#honorx7d .section-battery .text-wrapper .top-text {
width: 100%;
}

#honorx7d .section-battery .text-wrapper .top-text .copy-wrapper {
width: 100%;
transition: all 0.7s ease;
}

#honorx7d .section-battery .text-wrapper .top-text .copy-wrapper .copy-title {
margin-bottom: 1.5625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .text-wrapper .top-text .copy-wrapper .copy-title {
margin-bottom: 4vw;
}
}

#honorx7d .section-battery .text-wrapper .top-text .copy-wrapper .copy-text {
width: 38.8541666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .text-wrapper .top-text .copy-wrapper .copy-text {
width: 100%;
}
}

#honorx7d .section-battery .text-wrapper .top-text .copy-wrapper2 {
position: absolute;
top: 0;
left: 0;
opacity: 0;
transform: translateY(5vw);
}

#honorx7d .section-battery .text-wrapper .top-text .copy-wrapper2 .copy-text {
width: 25.78125vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .text-wrapper .top-text .copy-wrapper2 .copy-text {
width: 100%;
}
}

#honorx7d .section-battery .text-wrapper .bottom-text {
margin-top: 3.6458333333vw;
display: flex;
align-items: center;
}

#honorx7d .section-battery .text-wrapper .bottom-text .icon {
width: 8.0208333333vw;
height: 8.0208333333vw;
margin-right: 0.2083333333vw;
transform: translateX(-0.7291666667vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .text-wrapper .bottom-text .icon {
width: 17.3333333333vw;
height: 17.3333333333vw;
margin-right: 6.6666666667vw;
transform: translateX(0);
}
}

#honorx7d .section-battery .text-wrapper .bottom-text .txt {
text-align: center;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .text-wrapper .bottom-text .txt {
transform: translateY(-0.8vw);
text-align: left;
}
}

#honorx7d .section-battery .text-wrapper .bottom-text .txt .txt1 {
font-size: 2.9166666667vw;
background-image: linear-gradient(90deg, #814F22 0%, #D3AB7A 100%);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .text-wrapper .bottom-text .txt .txt1 {
font-size: 8.5333333333vw;
}

#honorx7d .section-battery .text-wrapper .bottom-text .txt .txt1 span {
font-size: 6.9333333333vw;
}
}

#honorx7d .section-battery .text-wrapper .bottom-text .txt .txt2 {
font-size: 1.0416666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .text-wrapper .bottom-text .txt .txt2 {
font-size: 3.7333333333vw;
}
}

#honorx7d .section-battery .bg-wrapper {
width: 69.5833333333vw;
height: 56.25vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% + 16vw - 2.2vw), calc(-50% + 1vw)) scale(1.38);
transform-origin: 102% 95%;
transition: all 0.7s ease;
perspective: 100vw;
perspective-origin: 210% 220%;
z-index: 3;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .bg-wrapper {
width: 134.1333333333vw;
height: 108.5333333333vw;
transform: translate(calc(-50% + 14vw), calc(-50% + 27vw)) scale(1.2);
transform-origin: left 140%;
perspective: 130vw;
perspective-origin: 130% 150%;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-battery .bg-wrapper {
transform: translate(calc(-50% + 14vw), calc(-50% + 27vw)) scale(1.41);
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-battery .bg-wrapper {
transform: translate(calc(-50% + 14vw), calc(-50% + 27vw)) scale(1);
transform-origin: 40% 10%;
}
}

#honorx7d .section-battery .bg-wrapper .bg-txt {
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% + 1vw), calc(-50% + 5.25vw)) rotate3d(1, 0, 1, 32deg) scale(1.1);
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .bg-wrapper .bg-txt {
transform: translate(calc(-50% + 2vw), calc(-50% + 9.25vw)) rotate3d(1, 0, 1, 32deg) scale(1.05);
}
}

#honorx7d .section-battery .bg-wrapper .bg-txt .repeat-all {
transition: all 0.7s ease;
}

#honorx7d .section-battery .bg-wrapper .bg-txt .repeat-all1 {
position: relative;
}

#honorx7d .section-battery .bg-wrapper .bg-txt .repeat-all2 {
position: absolute;
top: 0;
left: 0;
opacity: 0;
}

#honorx7d .section-battery .bg-wrapper .bg-txt .txt {
background-image: linear-gradient(to top, #FFF2A9, #FFFDED);
font-size: 9.375vw;
transition: all 0.7s ease;
position: relative;
z-index: 2;
white-space: nowrap;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .bg-wrapper .bg-txt .txt {
font-size: 19.2vw;
letter-spacing: 0.2vw;
}
}

#honorx7d .section-battery .bg-wrapper .bg-txt .txt span {
font-size: 4.1666666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .bg-wrapper .bg-txt .txt span {
font-size: 6.9333333333vw;
}
}

#honorx7d .section-battery .bg-wrapper .bg-txt .txt.txt-repeat {
position: absolute;
top: 0;
left: 0;
background-image: none;
color: #E7911E;
z-index: 1;
transform: translate(6px, 6px);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-battery .bg-wrapper .bg-txt .txt.txt-repeat {
transform: translate(3px, 3px);
}
}

#honorx7d .section-drop {
height: 260vh;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop {
height: 230vh;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-drop {
height: 190vh;
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-drop {
height: 280vh;
}
}

#honorx7d .section-drop .sticky-container {
height: calc(100vh - 52px);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .sticky-container {
height: calc(150vh - 52px);
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-drop .sticky-container {
height: calc(100vh - 52px);
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-drop .sticky-container {
height: calc(200vh - 52px);
}
}

#honorx7d .section-drop.is-active1 .copy-wrapper .title-wrapper {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease;
}

#honorx7d .section-drop.is-active1 .copy-wrapper .text-all {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease 0.1s;
}

#honorx7d .section-drop.is-active1 .bg-wrapper .phone .phone-in {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease;
}

#honorx7d .section-drop.is-active1 .bg-wrapper .strone {
transform: translate(calc(-50% + 19vw), calc(-50% + 10.937vw)) scale(1);
opacity: 1;
transition: all 0.5s ease 0.35s;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop.is-active1 .bg-wrapper .strone {
transform: translate(calc(-50% + 0vw), calc(-50% + 0vw)) scale(1);
}
}

#honorx7d .section-drop.is-active2 .copy-wrapper .title-wrapper .copy-title1 {
opacity: 0;
transition: all 0.7s ease;
}

#honorx7d .section-drop.is-active2 .copy-wrapper .title-wrapper .copy-title2 {
opacity: 1;
transition: all 0.7s ease;
}

#honorx7d .section-drop.is-active2 .copy-wrapper .text-all .text-wrapper1 {
opacity: 0;
transition: all 0.5s ease;
}

#honorx7d .section-drop.is-active2 .copy-wrapper .text-all .text-wrapper2 {
opacity: 1;
transform: translateY(0);
transition: all 0.7s ease;
}

#honorx7d .section-drop.is-active3 .copy-wrapper .text-wrapper2 .top-wrapper {
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop.is-active3 .copy-wrapper .text-wrapper2 .bottom-wrapper {
opacity: 1;
transform: translateY(0);
transition: all 0.7s ease 0.1s;
}
}

#honorx7d .section-drop .copy-wrapper {
width: 50.75vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% - 11vw), calc(-50% - 1vw));
z-index: 4;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper {
width: 85vw;
top: 13.3333333333vw;
left: 5.3333333333vw;
transform: none;
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-drop .copy-wrapper {
transform: scale(0.8);
transform-origin: top left;
width: 110vw;
}
}

#honorx7d .section-drop .copy-wrapper .title-wrapper {
position: relative;
margin-bottom: 2.34375vw;
transform: translateY(5vw);
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .title-wrapper {
margin-bottom: 4.5333333333vw;
}
}

#honorx7d .section-drop .copy-wrapper .title-wrapper .copy-title {
transition: all 0.7s ease;
}

#honorx7d .section-drop .copy-wrapper .title-wrapper .copy-title2 {
position: absolute;
top: 0;
left: 0;
opacity: 0;
}

#honorx7d .section-drop .copy-wrapper .text-all {
position: relative;
width: 100%;
transform: translateY(5vw);
opacity: 0;
transition: all 0.7s ease;
}

#honorx7d .section-drop .copy-wrapper .text-wrapper {
position: relative;
}

#honorx7d .section-drop .copy-wrapper .text-wrapper1 {
transition: all 0.7s ease 0.1s;
}

#honorx7d .section-drop .copy-wrapper .text-wrapper1 .txt {
margin-bottom: 10.4166666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper1 .txt {
margin-bottom: 8vw;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper1 .txt span {
font-size: 2.9166666667vw;
background-image: linear-gradient(90deg, #814F22 0%, #D3AB7A 100%);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper1 .txt span {
font-size: 5.3333333333vw;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper1 .sgs-wrapper {
width: 28.28125vw;
height: 8.2291666667vw;
position: relative;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper1 .sgs-wrapper {
width: 60.6933333333vw;
height: 17.6vw;
border-radius: 2.6666666667vw;
overflow: hidden;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper1 .sgs-wrapper .sgs-copy {
font-size: 0.9375vw;
position: absolute;
top: 4.530208vw;
left: 6.79125vw;
width: 20.5729166667vw;
line-height: 1.2;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper1 .sgs-wrapper .sgs-copy {
font-size: 3.2vw;
transform: scale(0.61);
transform-origin: 0 0;
width: 68.5vw;
top: 9.530208vw;
left: 14.79125vw;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 {
position: absolute;
top: 0;
left: 0;
z-index: 1;
opacity: 0;
transform: translateY(5vw);
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper2 {
margin-top: 5vw;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .top-wrapper {
margin-bottom: 5.7291666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper2 .top-wrapper {
margin-bottom: 0;
transition: all 0.7s ease;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .top-wrapper .txt1 {
margin-bottom: 1.5104166667vw;
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .top-wrapper .txt {
display: flex;
align-items: center;
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .top-wrapper .txt .icon {
width: 2.5694444444vw;
height: 1.6319444444vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper2 .top-wrapper .txt .icon {
width: 5.0666666667vw;
height: 3.7333333333vw;
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .top-wrapper .txt .icon.icon2 {
width: 5.0666666667vw;
height: 3.1111111111vw;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .top-wrapper .txt .line {
margin: 0 0.78125vw;
height: 1.8229166667vw;
width: 1px;
border-right: 1px solid #000;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper2 .top-wrapper .txt .line {
height: 4.2666666667vw;
margin: 0 1.6vw;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .bottom-wrapper {
display: flex;
flex-wrap: wrap;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper2 .bottom-wrapper {
flex-direction: column;
flex-wrap: nowrap;
position: absolute;
top: 0;
left: 0;
opacity: 0;
transform: translateY(5vw);
transition: all 0.7s ease;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .bottom-wrapper .every-detail .title {
margin-bottom: 0.2604166667vw;
font-size: 2.5vw;
background-image: linear-gradient(90deg, #814F22 0%, #D3AB7A 100%);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper2 .bottom-wrapper .every-detail .title {
font-size: 5.3333333333vw;
margin-bottom: 0vw;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .bottom-wrapper .every-detail1 {
margin-right: 3.0729166667vw;
margin-bottom: 2.2395833333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper2 .bottom-wrapper .every-detail1 {
margin-bottom: 3.2vw;
margin-right: 0;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .bottom-wrapper .every-detail2 {
margin-bottom: 2.2395833333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper2 .bottom-wrapper .every-detail2 {
margin-bottom: 3.2vw;
}
}

#honorx7d .section-drop .copy-wrapper .text-wrapper2 .bottom-wrapper .every-detail3 {
margin-right: 4.90625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .copy-wrapper .text-wrapper2 .bottom-wrapper .every-detail3 {
margin-right: 0;
margin-bottom: 3.2vw;
}
}

#honorx7d .section-drop .bg-wrapper {
width: 100%;
height: 53.5416666667vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% - 0vw), calc(-50% + 2vw));
overflow: hidden;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .bg-wrapper {
height: 100%;
position: relative;
top: auto;
left: auto;
transform: none;
}
}

#honorx7d .section-drop .bg-wrapper .top-shadow {
width: 100%;
height: 6vw;
background: linear-gradient(to bottom, #fff, rgba(255, 255, 255, 0));
position: absolute;
top: 0;
left: 0;
z-index: 3;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .bg-wrapper .top-shadow {
height: 20vw;
}
}

@media (max-aspect-ratio: 1920/1120) and (orientation: landscape) {
#honorx7d .section-drop .bg-wrapper .bottom-shadow {
width: 100%;
background: linear-gradient(to top, #fff, rgba(255, 255, 255, 0));
position: absolute;
bottom: 0;
left: 0;
height: 5vw;
z-index: 6;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .bg-wrapper .bottom-shadow {
width: 100%;
height: 0;
background: linear-gradient(to top, #fff, rgba(255, 255, 255, 0));
position: absolute;
bottom: 0;
left: 0;
height: 20vw;
z-index: 6;
}
}

#honorx7d .section-drop .bg-wrapper .phone {
width: 50.5456349206vw;
height: 50.5456349206vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% + 24vw), calc(-50% - 0.3vw)) rotate(14.6deg);
z-index: 4;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .bg-wrapper .phone {
width: 100%;
height: 100%;
transform: translate(calc(-50% + 8.5vw), calc(-50% - 3.2vw)) rotate(14.6deg);
}
}

#honorx7d .section-drop .bg-wrapper .phone .phone-in {
transform: translateY(-15vw);
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .bg-wrapper .phone .phone-in {
transform: translateY(-35vw);
}
}

#honorx7d .section-drop .bg-wrapper .strone {
width: 45.46875vw;
height: 32.96875vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% + 19vw), calc(-50% + 10.937vw)) scale(0.3);
transform-origin: 73% 85%;
opacity: 0;
transition: all 0.7s ease;
z-index: 5;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-drop .bg-wrapper .strone {
width: 100%;
height: 100%;
transform-origin: 73% 95%;
transform: translate(calc(-50% + 0vw), calc(-50% + 0vw)) scale(0.3);
}
}

#honorx7d .section-water {
margin-top: -100vh;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water {
margin-top: 0;
}
}

#honorx7d .section-water #trigger-ga {
position: absolute;
top: -5vh;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water #trigger-ga {
position: static;
}
}

#honorx7d .section-water .sticky-container {
position: static;
height: 103vh;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .sticky-container {
height: auto;
}
}

#honorx7d .section-water.is-active1 .text-wrapper .copy-wrapper {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water.is-active1 .text-wrapper .bg {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease 0.1s;
}
}

#honorx7d .section-water.is-active1 .text-wrapper .detail-wrapper {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease 0.1s;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water.is-active1 .text-wrapper .detail-wrapper {
transform: translateY(5vw);
opacity: 0;
transition: all 0.7s ease;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water.is-active2 .text-wrapper .detail-wrapper {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease;
}
}

#honorx7d .section-water .text-wrapper {
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% - 16.5vw), -50%);
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper {
position: static;
transform: none;
padding: 19.916667vw 0 11vw;
display: flex;
flex-direction: column;
align-items: center;
}
}

#honorx7d .section-water .text-wrapper .copy-wrapper {
margin-bottom: 3.125vw;
width: 39.5833333333vw;
transform: translateY(5vw);
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .copy-wrapper {
margin-bottom: 6.6666666667vw;
width: 84vw;
display: flex;
flex-direction: column;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .copy-wrapper .copy-title {
order: 1;
}
}

#honorx7d .section-water .text-wrapper .copy-wrapper .copy-text {
margin-bottom: 1.5625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .copy-wrapper .copy-text {
margin-top: 4vw;
order: 2;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .bg {
width: 84vw;
height: 89.8666666667vw;
margin-bottom: 5.3333333333vw;
transform: translateY(5vw);
opacity: 0;
transition: all 0.7s ease;
}
}

#honorx7d .section-water .text-wrapper .detail-wrapper {
width: 29.1666666667vw;
transform: translateY(5vw);
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .detail-wrapper {
width: 84vw;
}
}

#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail {
margin-bottom: 1.8229166667vw;
display: flex;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail {
margin-bottom: 4vw;
}
}

#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail .icon {
transform: translateY(0.6vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail .icon {
transform: translateY(1.6vw);
}
}

#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail .txt1 {
font-size: 2.0833333333vw;
background-image: linear-gradient(90deg, #814F22 0%, #D3AB7A 100%);
margin-bottom: 0.5208333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail .txt1 {
font-size: 5.3333333333vw;
margin-bottom: 2.1333333333vw;
}
}

#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail .txt1 sup {
-webkit-text-fill-color: #D3AB7A;
}

#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail .txt2 {
font-size: 0.9375vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail .txt2 {
font-size: 3.7333333333vw;
}
}

#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail1 .icon {
width: 1.71875vw;
height: 1.8229166667vw;
margin-right: 0.9864583333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail1 .icon {
width: 4.0586666667vw;
height: 4.2666666667vw;
margin-right: 1.28vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail1 .txt1 {
transform: translate(-0.048vw, 0);
}
}

#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail2 .icon {
width: 2.3151041667vw;
height: 2.0833333333vw;
margin-right: 0.3932291667vw;
transform: translateX(-0.15625vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail2 .icon {
width: 5.3333333333vw;
height: 4.8vw;
transform: translate(-1.3333333333vw, 1vw);
margin-right: 0;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail2 .txt1 {
transform: translate(-0.0533333333vw, 0);
}
}

#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail3 .icon {
width: 1.759375vw;
height: 1.9791666667vw;
margin-right: 0.9489583333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-water .text-wrapper .detail-wrapper .every-detail3 .icon {
width: 3.7333333333vw;
height: 4.2vw;
margin-right: 1.6vw;
}
}

#honorx7d .section-ins {
height: 220vh;
margin-top: 6vw;
}

#honorx7d .section-ins.is-enter .text-wrapper {
opacity: 1;
transform: translate(-50%, calc(-50% - 17vw));
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins.is-enter .text-wrapper {
transform: translate(-50%, calc(-50% - 58vw));
}
}

#honorx7d .section-ins.is-active1 .finger-wrapper .img4 {
transform: rotate(2.8deg);
transition: all 0.5s ease;
}

#honorx7d .section-ins.is-active1 .finger-wrapper .icon-wrapper1 .icon {
opacity: 1;
transform: translateX(0);
transition: all 0.7s ease 0.2s;
}

#honorx7d .section-ins.is-active2 .text-wrapper .txt-all .txt1 {
opacity: 0;
transition: all 0.7s ease;
}

#honorx7d .section-ins.is-active2 .text-wrapper .txt-all .txt2 {
transform: translate(-50%, 0);
opacity: 1;
transition: all 0.7s ease 0.1s;
}

#honorx7d .section-ins.is-active2 .finger-wrapper .img2 {
opacity: 1;
}

#honorx7d .section-ins.is-active2 .finger-wrapper .img4 {
transform: rotate(0);
transition: all 0.5s ease;
}

#honorx7d .section-ins.is-active2 .finger-wrapper .icon-wrapper1 {
opacity: 0;
transition: all 0.7s ease;
}

#honorx7d .section-ins.is-active3 .finger-wrapper .img3 {
opacity: 1;
transition: all 0.7s ease 0.4s;
}

#honorx7d .section-ins.is-active3 .finger-wrapper .img4 {
transform: rotate(2.8deg);
transition: all 0.5s ease;
}

#honorx7d .section-ins.is-active3 .finger-wrapper .icon-wrapper2 .icon {
opacity: 1;
transform: translateX(0);
transition: all 0.7s ease 0.4s;
}

#honorx7d .section-ins .content-ins {
width: 100%;
height: 100%;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .content-ins {
transform: scale(0.7);
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-ins .content-ins {
transform: scale(1);
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-ins .content-ins {
transform: scale(0.46);
}
}

#honorx7d .section-ins .top-shadow {
width: 100%;
height: 5vw;
background: linear-gradient(to bottom, #fff, rgba(255, 255, 255, 0));
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

#honorx7d .section-ins .bg-bottom-shadow {
width: 100%;
height: 4vw;
background: linear-gradient(to top, #fff, rgba(255, 255, 255, 0));
position: absolute;
bottom: 0;
left: 0;
z-index: 3;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .bg-bottom-shadow {
height: 20vw;
}
}

@media (orientation: landscape) and (width: 1024px) {
#honorx7d .section-ins .bg-bottom-shadow {
height: 15vw;
}
}

@media (orientation: landscape) and (width: 2520px) {
#honorx7d .section-ins .bg-bottom-shadow {
height: 13vw;
}
}

#honorx7d .section-ins .bgd {
position: absolute;
top: 0;
left: 0;
}

#honorx7d .section-ins .text-wrapper {
width: 73.5729166667vw;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, calc(-50% - 13.2vw));
opacity: 0;
transition: all 0.7s ease;
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .text-wrapper {
width: 80.5333333333vw;
transform: translate(-50%, calc(-50% - 53vw));
}
}

#honorx7d .section-ins .text-wrapper .copy-title .ai-icon {
width: 4.3645833333vw;
height: 2.8125vw;
display: inline-block;
transform: translateY(-0.4vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .text-wrapper .copy-title .ai-icon {
width: 10.0666666667vw;
height: 6.9333333333vw;
transform: translateY(-0.6vw);
}
}

#honorx7d .section-ins .text-wrapper .txt-all {
margin: 0 auto;
position: relative;
margin-top: 1.8229166667vw;
width: 39.6666666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .text-wrapper .txt-all {
width: 80.6666666667vw;
margin-top: 4vw;
}
}

#honorx7d .section-ins .text-wrapper .txt-all .txt1 {
transition: all 0.7s ease 0.1s;
}

#honorx7d .section-ins .text-wrapper .txt-all .txt2 {
width: 100%;
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%, 3vw);
opacity: 0;
transition: all 0.7s ease;
}

#honorx7d .section-ins .finger-wrapper {
width: 54.3560606061vw;
height: 53.4564393939vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% - 18vw), calc(-50% + 13vw));
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper {
width: 177.0666666667vw;
height: 174.1333333333vw;
transform: translate(calc(-50% - 22vw), calc(-50% + 46vw));
}
}

#honorx7d .section-ins .finger-wrapper .bottom-shadow {
width: 100%;
height: 15vw;
background: linear-gradient(to top, #fff 40%, transparent 100%);
position: absolute;
bottom: 0;
left: 0;
z-index: 1;
}

#honorx7d .section-ins .finger-wrapper .img {
transition: all 0.7s ease;
}

#honorx7d .section-ins .finger-wrapper .img1 {
position: relative;
z-index: 1;
}

#honorx7d .section-ins .finger-wrapper .img2 {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
z-index: 1;
}

#honorx7d .section-ins .finger-wrapper .img3 {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
z-index: 1;
}

#honorx7d .section-ins .finger-wrapper .img4 {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 3;
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
transition: all 0.7s ease;
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon {
opacity: 0;
transition: all 0.7s ease;
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon1 {
position: absolute;
top: 3vw;
right: -7.5vw;
width: 10.8630952381vw;
height: 6.1011904762vw;
transform: translateX(-20vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon1 {
width: 20vw;
height: 10.1333333333vw;
top: 33vw;
right: 93.5vw;
transform: translateX(20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon2 {
position: absolute;
top: 6vw;
right: 5.1vw;
width: 9.7718253968vw;
height: 4.5138888889vw;
transform: translateX(-10vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon2 {
width: 18.5777777778vw;
height: 7.4666666667vw;
top: 13vw;
right: 30.1vw;
transform: translateX(-20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon3 {
position: absolute;
top: 10vw;
right: 0vw;
width: 12.6984126984vw;
height: 6.2003968254vw;
transform: translateX(-15vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon3 {
width: 24.7111111111vw;
height: 10.5777777778vw;
top: 21vw;
right: 20vw;
transform: translateX(-20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon4 {
position: absolute;
top: 12vw;
right: -14vw;
width: 12.1775793651vw;
height: 5.1091269841vw;
transform: translateX(-28vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon4 {
width: 21.6vw;
height: 8.1777777778vw;
top: 25vw;
right: 84vw;
transform: translateX(20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon5 {
position: absolute;
top: 15.5vw;
right: -7.5vw;
width: 15.6001984127vw;
height: 7.2916666667vw;
transform: translateX(-20vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon5 {
width: 24.5333333333vw;
height: 10.4vw;
top: 32.5vw;
right: 22.5vw;
transform: translateX(-20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon6 {
position: absolute;
top: 21.5vw;
right: 3.15vw;
width: 11.0367063492vw;
height: 4.439484127vw;
transform: translateX(-15vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon6 {
width: 20.1777777778vw;
height: 7.4666666667vw;
top: 43.5vw;
right: 91.15vw;
transform: translateX(20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon7 {
position: absolute;
top: 22.5vw;
right: -16vw;
width: 13.5416666667vw;
height: 4.8363095238vw;
transform: translateX(-28vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon7 {
width: 33.4222222222vw;
height: 12.3555555556vw;
top: 12.5vw;
right: 80.5vw;
transform: translateX(20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon8 {
position: absolute;
top: 26vw;
right: -4vw;
width: 18.005952381vw;
height: 6.1011904762vw;
transform: translateX(-20vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper1 .icon8 {
width: 25.0666666667vw;
height: 10.1333333333vw;
top: 45vw;
right: 26vw;
transform: translateX(-20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon {
opacity: 0;
transition: all 0.7s ease;
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon11 {
position: absolute;
top: 3vw;
right: -11.5vw;
width: 13.3333333333vw;
height: 6.40625vw;
transform: translateX(-25vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon11 {
width: 23.7333333333vw;
height: 10.1333333333vw;
top: 33vw;
right: 91.5vw;
transform: translateX(20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon22 {
position: absolute;
top: 6vw;
right: 4.1vw;
width: 11.0119047619vw;
height: 4.5138888889vw;
transform: translateX(-13vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon22 {
width: 18.8444444444vw;
height: 7.4666666667vw;
transform: translateX(20vw);
top: 43.5vw;
right: 89.15vw;
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon33 {
position: absolute;
top: 10vw;
right: -6vw;
width: 18.8492063492vw;
height: 6.2003968254vw;
transform: translateX(-16vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon33 {
width: 37.1555555556vw;
height: 12.3555555556vw;
top: 12.5vw;
right: 75.5vw;
transform: translateX(20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon44 {
position: absolute;
top: 12vw;
right: -20vw;
width: 13.814484127vw;
height: 5.1091269841vw;
transform: translateX(-33vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon44 {
width: 22.0444444444vw;
height: 7.4666666667vw;
top: 13vw;
right: 21.2vw;
transform: translateX(-20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon55 {
position: absolute;
top: 15.5vw;
right: -8.5vw;
width: 17.3363095238vw;
height: 7.2916666667vw;
transform: translateX(-20vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon55 {
width: 30.3111111111vw;
height: 10.5777777778vw;
top: 29vw;
right: 19vw;
transform: translateX(-20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon66 {
position: absolute;
top: 18.5vw;
right: -19.35vw;
width: 11.7807539683vw;
height: 4.439484127vw;
transform: translateX(-33vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon66 {
width: 20.4444444444vw;
height: 7.4666666667vw;
top: 19vw;
right: 22vw;
transform: translateX(-20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon77 {
position: absolute;
top: 22vw;
right: 3vw;
width: 11.2351190476vw;
height: 4.439484127vw;
transform: translateX(-15vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon77 {
width: 24vw;
height: 10.1333333333vw;
top: 45vw;
right: 27.5vw;
transform: translateX(-20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon88 {
position: absolute;
top: 23.4vw;
right: -15vw;
width: 13.1944444444vw;
height: 4.8363095238vw;
transform: translateX(-30vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon88 {
width: 23.2vw;
height: 8.1777777778vw;
top: 25vw;
right: 82vw;
transform: translateX(20vw);
}
}

#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon99 {
position: absolute;
top: 26vw;
right: -1.5vw;
width: 13.8888888889vw;
height: 6.1011904762vw;
transform: translateX(-20vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ins .finger-wrapper .icon-wrapper2 .icon99 {
width: 25.8666666667vw;
height: 10.4vw;
top: 32.5vw;
right: 21.5vw;
transform: translateX(-20vw);
}
}

#honorx7d .section-camera {
margin-top: 3vw;
overflow: hidden;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-camera {
margin-top: 0;
}
}

#honorx7d .section-camera .top-shadow {
width: 100%;
height: 5vw;
background: linear-gradient(to bottom, #fff, rgba(255, 255, 255, 0));
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-camera .top-shadow {
height: 15vw;
}
}

#honorx7d .section-camera .bottom-shadow {
width: 100%;
height: 5vw;
background: linear-gradient(to top, #fff, rgba(255, 255, 255, 0));
position: absolute;
bottom: 0;
left: 0;
z-index: 3;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-camera .bottom-shadow {
height: 18vw;
}
}

#honorx7d .section-camera .sticky-container {
height: 53.5416666667vw;
position: static;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-camera .sticky-container {
height: 189.3333333333vw;
}
}

#honorx7d .section-camera.is-active1 .copy-wrapper {
transform: translate(-50%, 0);
opacity: 1;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-camera.is-active1 .copy-wrapper {
transform: translate(calc(-50% + 3vw), 0);
}
}

#honorx7d .section-camera.is-active1 .camera-phone {
transform: translate(-50%, 0);
opacity: 1;
transition: all 0.7s ease 0.1s;
}

#honorx7d .section-camera .copy-wrapper {
width: 72.9479166667vw;
position: absolute;
top: 4.4270833333vw;
left: 50%;
transform: translate(-50%, 5vw);
z-index: 3;
text-align: center;
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-camera .copy-wrapper {
width: 88.5333333333vw;
text-align: left;
top: 16vw;
transform: translate(calc(-50% + 3vw), 5vw);
}
}

#honorx7d .section-camera .copy-wrapper .copy-title .ai-img {
width: 4.5208333333vw;
height: 2.96875vw;
display: inline-block;
transform: translateY(-0.4vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-camera .copy-wrapper .copy-title .ai-img {
width: 13.0666666667vw;
height: 6.6666666667vw;
transform: translateY(-0.8vw);
}
}

#honorx7d .section-camera .copy-wrapper .copy-text {
width: 36.71875vw;
margin: 1.8229166667vw auto 0;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-camera .copy-wrapper .copy-text {
width: 100%;
margin: 6.1333333333vw auto 0;
}
}

#honorx7d .section-camera .camera-phone {
width: 100%;
height: 41.5625vw;
position: absolute;
bottom: 0;
left: 50%;
transform: translate(-50%, 100%);
z-index: 1;
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-camera .camera-phone {
height: 121.3333333333vw;
}
}

#honorx7d .section-ai {
height: 53.5416666667vw;
overflow: hidden;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai {
height: auto;
margin-top: 15vw;
}
}

#honorx7d .section-ai.is-active-0 .assistant-wrapper .detail-wrapper .detail1 .detail-txt .title {
transform: scale(1);
opacity: 1;
}

#honorx7d .section-ai.is-active-0 .assistant-wrapper .detail-wrapper .detail1 .detail-txt .copy {
margin-top: 0.5208333333vw;
height: auto;
clip-path: inset(0 0);
}

#honorx7d .section-ai.is-active-0 .assistant-wrapper .detail-wrapper .detail1>img {
transform: translate(0, -50%) rotate(-180deg);
transition: all 0.3s ease;
opacity: 1;
}

#honorx7d .section-ai.is-active-0 .assistant-wrapper .bg-wrapper .bg.bg1 {
opacity: 1;
transition: all 0.5s ease;
}

#honorx7d .section-ai.is-active-1 .assistant-wrapper .detail-wrapper .detail2 .detail-txt .title {
transform: scale(1);
opacity: 1;
}

#honorx7d .section-ai.is-active-1 .assistant-wrapper .detail-wrapper .detail2 .detail-txt .copy {
margin-top: 0.5208333333vw;
height: auto;
clip-path: inset(0 0);
}

#honorx7d .section-ai.is-active-1 .assistant-wrapper .detail-wrapper .detail2>img {
transform: translate(0, -50%) rotate(-180deg);
transition: all 0.3s ease;
opacity: 1;
}

#honorx7d .section-ai.is-active-1 .assistant-wrapper .bg-wrapper .bg.bg2 {
opacity: 1;
transition: all 0.5s ease;
}

#honorx7d .section-ai.is-active-2 .assistant-wrapper .detail-wrapper .detail3 .detail-txt .title {
transform: scale(1);
opacity: 1;
}

#honorx7d .section-ai.is-active-2 .assistant-wrapper .detail-wrapper .detail3 .detail-txt .copy {
margin-top: 0.5208333333vw;
height: auto;
clip-path: inset(0 0);
}

#honorx7d .section-ai.is-active-2 .assistant-wrapper .detail-wrapper .detail3>img {
transform: translate(0, -50%) rotate(-180deg);
transition: all 0.3s ease;
opacity: 1;
}

#honorx7d .section-ai.is-active-2 .assistant-wrapper .bg-wrapper .bg.bg3 {
opacity: 1;
transition: all 0.5s ease;
}

#honorx7d .section-ai.is-active-3 .assistant-wrapper .detail-wrapper .detail4 .detail-txt .title {
transform: scale(1);
opacity: 1;
}

#honorx7d .section-ai.is-active-3 .assistant-wrapper .detail-wrapper .detail4 .detail-txt .copy {
margin-top: 0.5208333333vw;
height: auto;
clip-path: inset(0 0);
}

#honorx7d .section-ai.is-active-3 .assistant-wrapper .detail-wrapper .detail4>img {
transform: translate(0, -50%) rotate(-180deg);
transition: all 0.3s ease;
opacity: 1;
}

#honorx7d .section-ai.is-active-3 .assistant-wrapper .bg-wrapper .bg.bg4 {
opacity: 1;
transition: all 0.5s ease;
}

#honorx7d .section-ai.is-active1 .assistant-wrapper .text-all .copy-title {
opacity: 1;
transform: translateY(0);
transition: all 0.7s ease;
}

#honorx7d .section-ai.is-active1 .assistant-wrapper .text-all .detail-wrapper {
opacity: 1;
transform: translateY(0);
transition: all 0.7s ease 0.1s;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai.is-active1 .copy-title {
opacity: 1;
transform: translateY(0);
transition: all 0.7s ease;
}
}

#honorx7d .section-ai .sticky-container {
height: 100%;
position: static;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai .sticky-container {
display: flex;
flex-direction: column;
justify-content: center;
padding-bottom: 5vw;
}
}

#honorx7d .section-ai .bgd {
width: 100%;
height: 100%;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai .copy-title {
width: 84vw;
margin: 0 auto;
margin-bottom: 5.3333333333vw;
opacity: 0;
transform: translateY(5vw);
transition: all 0.7s ease;
}
}

#honorx7d .section-ai .assistant-wrapper {
width: 72.9166666667vw;
display: flex;
justify-content: space-between;
align-items: flex-start;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, calc(-50% + 1vw));
}

#honorx7d .section-ai .assistant-wrapper .text-all {
width: 26.6770833333vw;
transform: translateY(6vw);
}

#honorx7d .section-ai .assistant-wrapper .text-all .copy-title {
margin-bottom: 5.0520833333vw;
opacity: 0;
transform: translateY(5vw);
transition: all 0.7s ease;
}

#honorx7d .section-ai .assistant-wrapper .detail-wrapper {
width: 26.4895833333vw;
opacity: 0;
transform: translateY(5vw);
transition: all 0.7s ease;
}

#honorx7d .section-ai .assistant-wrapper .detail-wrapper .detail {
padding: 1.1979166667vw 0 1.1979166667vw 0;
border-bottom: 1px solid #000;
position: relative;
cursor: pointer;
width: 100%;
text-align: left;
display: block;
}

#honorx7d .section-ai .assistant-wrapper .detail-wrapper .detail .detail-txt {
width: 24.2708333333vw;
}

#honorx7d .section-ai .assistant-wrapper .detail-wrapper .detail .detail-txt .title {
font-size: 1.6666666667vw;
opacity: 0.5;
transform: scale(0.625);
transform-origin: left center;
}

#honorx7d .section-ai .assistant-wrapper .detail-wrapper .detail .detail-txt .title .ai-icon {
width: 2.365625vw;
height: 1.40625vw;
transform: translateY(-0.2vw);
display: inline-block;
}

#honorx7d .section-ai .assistant-wrapper .detail-wrapper .detail .detail-txt .copy {
margin-top: 0;
height: 0;
clip-path: inset(0 0 100%);
transition: all 0.3s ease;
}

#honorx7d .section-ai .assistant-wrapper .detail-wrapper .detail>img {
width: 1.71875vw;
height: 1.71875vw;
transition: all 0.3s ease;
position: absolute;
right: 0.7291666667vw;
top: 50%;
transform: translate(0, -50%);
opacity: 0.4;
}

#honorx7d .section-ai .assistant-wrapper .bg-wrapper {
width: 29.2708333333vw;
height: 38.8020833333vw;
position: relative;
}

#honorx7d .section-ai .assistant-wrapper .bg-wrapper .bg {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
opacity: 0;
transition: all 0.5s ease;
}

#honorx7d .section-ai .assistant-wrapper .bg-wrapper .bg video {
border-radius: 1.25vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai .swiper-container-ai {
width: 84vw;
position: relative;
overflow: visible;
margin: 0 auto;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai .swiper-container-ai .swiper-slide {
position: relative;
height: 137.3333333333vw;
display: flex;
flex-direction: column;
align-items: center;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai .swiper-container-ai .swiper-slide .bg {
width: 84vw;
height: 110.9333333333vw;
margin-bottom: 5.3333333333vw;
}

#honorx7d .section-ai .swiper-container-ai .swiper-slide .bg video,
#honorx7d .section-ai .swiper-container-ai .swiper-slide .bg img {
border-radius: 3.2vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai .swiper-container-ai .swiper-slide .detail-txt {
width: 79vw;
position: relative;
}

#honorx7d .section-ai .swiper-container-ai .swiper-slide .detail-txt .title {
font-size: 5.3333333333vw;
}

#honorx7d .section-ai .swiper-container-ai .swiper-slide .detail-txt .title .ai-icon {
width: 8.2666666667vw;
height: 4.5333333333vw;
transform: translateY(-0.6vw);
display: inline-block;
}

#honorx7d .section-ai .swiper-container-ai .swiper-slide .detail-txt .copy {
margin-top: 1.0666666667vw;
color: #000;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai .btn-swiper-ai-out {
position: relative;
margin: 5.3333333333vw auto 0;
z-index: 2;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai .btn-swiper-ai {
width: 74.6666666667vw;
display: flex;
justify-content: space-between;
align-items: center;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) and (max-aspect-ratio: 12/10) and (max-width: 1025px) and (width: 430px) {
#honorx7d .section-ai .btn-swiper-ai {
margin-top: 0;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-ai .btn-swiper-ai .swiperBtn {
width: 10.6666666667vw;
height: 10.6666666667vw;
}

#honorx7d .section-ai .btn-swiper-ai .swiperBtn.my-button-disabled {
opacity: 0.4;
}

#honorx7d .section-ai .btn-swiper-ai .swiper-pagination {
width: 32vw;
height: 1px;
position: relative;
background: #ccc;
}

#honorx7d .section-ai .btn-swiper-ai .swiper-pagination .swiper-pagination-progressbar-fill {
height: 3px;
background: #000;
border-radius: 0;
position: absolute;
margin-top: -1px;
border-radius: 0.4vw;
}
}

#honorx7d .section-magicos {
padding: 4.8vw 0 7.8125vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-magicos {
padding: 21.6666666667vw 0 0;
}
}

#honorx7d .section-magicos .sticky-container {
height: auto;
position: static;
}

#honorx7d .section-magicos.is-active1 .content .every-detail1 {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease;
}

#honorx7d .section-magicos.is-active1 .content .every-detail2 {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease 0.1s;
}

#honorx7d .section-magicos .copy-title {
text-align: center;
width: 100%;
padding: 0 0 3.90625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-magicos .copy-title {
padding: 0 0 7.4666666667vw;
}
}

#honorx7d .section-magicos .content {
display: flex;
width: 62.5vw;
margin: 0 auto;
justify-content: space-between;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-magicos .content {
width: 89.3333333333vw;
flex-direction: column;
align-items: center;
justify-content: center;
}
}

#honorx7d .section-magicos .content .every-detail {
width: 30.2083333333vw;
height: 32.2916666667vw;
position: relative;
text-align: center;
transform: translateY(3vw);
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-magicos .content .every-detail {
width: 89.3333333333vw;
height: 104vw;
transform: translateY(0);
opacity: 1;
}
}

#honorx7d .section-magicos .content .every-detail .text-wrapper {
position: absolute;
top: 2.34375vw;
left: 50%;
transform: translate(-50%, 0);
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-magicos .content .every-detail .text-wrapper {
top: 5.3333333333vw;
}
}

#honorx7d .section-magicos .content .every-detail .txt {
margin-top: 0.5729166667vw;
font-size: 0.9375vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-magicos .content .every-detail .txt {
margin-top: 1.8666666667vw;
font-size: 3.7333333333vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-magicos .content .every-detail1 {
margin-bottom: 4.2666666667vw;
}
}

#honorx7d .section-magicos .content .every-detail1 .text-wrapper {
width: 28.5416666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-magicos .content .every-detail1 .text-wrapper {
width: 73vw;
}
}

#honorx7d .section-magicos .content .every-detail2 .text-wrapper {
width: 20.03125vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-magicos .content .every-detail2 .text-wrapper {
width: 69vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-pay {
padding: 26.6666666667vw 0 15.67vw;
}
}

#honorx7d .section-pay .sticky-container {
height: 53.5416666667vw;
position: static;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-pay .sticky-container {
height: auto;
}
}

#honorx7d .section-pay.is-active1 .copy-wrapper {
opacity: 1;
transform: translateY(0);
transition: all 0.7s ease;
}

#honorx7d .section-pay .copy-wrapper {
width: 48.9583333333vw;
position: absolute;
left: 13.3333333333vw;
top: 6.7708333333vw;
z-index: 1;
opacity: 0;
transform: translateY(5vw);
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-pay .copy-wrapper {
margin: 0 auto;
width: 89.3333333333vw;
position: static;
margin-bottom: 6.1333333333vw;
text-align: center;
}
}

#honorx7d .section-pay .copy-wrapper .copy-title {
margin-bottom: 1.5625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-pay .copy-wrapper .copy-title {
margin-bottom: 4vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-pay .bg {
width: 89.3333333333vw;
height: 96vw;
margin: 0 auto;
}
}

#honorx7d .section-chip {
margin-top: 3vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-chip {
margin-top: 0;
}
}

#honorx7d .section-chip .sticky-container {
height: 53.5416666667vw;
position: static;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-chip .sticky-container {
height: 189.3333333333vw;
}
}

#honorx7d .section-chip.is-active1 .copy-title {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease;
}

#honorx7d .section-chip.is-active1 .chip-img {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease 0.1s;
}

#honorx7d .section-chip.is-active1 .text-wrapper {
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease 0.2s;
}

#honorx7d .section-chip .top-shadow {
width: 100%;
height: 5vw;
background: linear-gradient(to bottom, #fff, rgba(255, 255, 255, 0));
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-chip .top-shadow {
height: 10vw;
}
}

#honorx7d .section-chip .bottom-shadow {
width: 100%;
height: 5vw;
background: linear-gradient(to top, #fff, rgba(255, 255, 255, 0));
position: absolute;
bottom: 0;
left: 0;
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-chip .bottom-shadow {
height: 15vw;
}
}

#honorx7d .section-chip .bg {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

#honorx7d .section-chip .copy-title {
width: 56.9791666667vw;
margin: 0 auto;
text-align: center;
position: relative;
z-index: 2;
transform: translateY(5vw);
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-chip .copy-title {
width: 88vw;
}
}

#honorx7d .section-chip .chip-img {
width: 72.9166666667vw;
height: 26.5104166667vw;
border-radius: 1.25vw;
overflow: hidden;
transform: rotate(0);
margin: 0 auto;
margin-top: 2.6041666667vw;
margin-bottom: 1.4583333333vw;
position: relative;
z-index: 3;
transform: translateY(5vw);
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-chip .chip-img {
width: 89.3333333333vw;
height: 89.0666666667vw;
margin-top: 5.3333333333vw;
margin-bottom: 5.3333333333vw;
border-radius: 3.2vw;
transform: translateY(0);
opacity: 1;
transition: all 0.7s ease;
}
}

#honorx7d .section-chip .text-wrapper {
position: relative;
z-index: 2;
margin: 0 auto;
text-align: center;
transform: translateY(5vw);
opacity: 0;
transition: all 0.7s ease;
}

#honorx7d .section-chip .text-wrapper .txt-dots1 {
font-size: 2.9166666667vw;
background-image: linear-gradient(90deg, #814F22 0%, #D3AB7A 100%);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-chip .text-wrapper .txt-dots1 {
font-size: 8.5333333333vw;
}
}

#honorx7d .section-chip .text-wrapper .txt-dots1 span {
font-size: 1.9791666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-chip .text-wrapper .txt-dots1 span {
font-size: 6.9333333333vw;
}
}

#honorx7d .section-chip .text-wrapper .txt-dots2 {
font-size: 1.0416666667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-chip .text-wrapper .txt-dots2 {
font-size: 3.2vw;
}
}

#honorx7d .section-memory {
height: 160vh;
margin: 7.8125vw 0;
/* clip-path: inset(2px 0 2px 0); */
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory {
margin: 0 0;
}
}

#honorx7d .section-memory.is-active1 .copy-wrapper {
opacity: 1;
transform: translate(-50%, calc(-50% - 16vw));
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory.is-active1 .copy-wrapper {
transform: translate(-50%, calc(-50% - 45vw));
}
}

#honorx7d .section-memory.is-active2 .img-wrapper {
transform: translate(calc(-50% - 0.15625vw), calc(-50% + 9vw)) scale(0.59);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory.is-active2 .img-wrapper {
transform: translate(calc(-50% - 0.3645833333vw), calc(-50% + 14.841vw + 6vw)) scale(0.59);
}
}

#honorx7d .section-memory.is-active2 .img-wrapper .top-shadow2 {
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory.is-active2 .img-wrapper .bottom-shadow {
height: 98.94vw;
transition: all 0.4s ease;
}
}

#honorx7d .section-memory.is-active2 .phone-border {
opacity: 1;
transition: all 0.7s ease;
transform: translate(-50%, calc(-50% + 3.6vw)) scale(1);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory.is-active2 .phone-border {
opacity: 1;
transform: translate(-50%, calc(-50% + 5.9364vw + 6vw));
transition: all 0.3s ease 0.5s;
}
}

#honorx7d .section-memory.is-active2 .text-wrapper {
opacity: 1;
transition: all 0.3s ease 0.5s;
}

#honorx7d .section-memory.is-active3 .img-wrapper .item1 {
transform: translateY(0);
}

#honorx7d .section-memory.is-active3 .img-wrapper .item2 {
transform: translateY(0);
}

#honorx7d .section-memory.is-active3 .img-wrapper .item3 {
transform: translateY(0);
}

#honorx7d .section-memory.is-active3 .img-wrapper .item4 {
transform: translateY(0);
}

#honorx7d .section-memory .content-memory {
width: 100%;
height: 100%;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .content-memory {
transform: scale(0.85);
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-memory .content-memory {
transform: scale(1);
}
}

@media (min-aspect-ratio: 661/758) and (max-width: 1000px) {
#honorx7d .section-memory .content-memory {
transform: scale(0.5);
}
}

#honorx7d .section-memory .copy-wrapper {
width: 73.8854166667vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, calc(-50% - 11vw));
z-index: 4;
text-align: center;
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .copy-wrapper {
width: 89.3333333333vw;
transform: translate(-50%, calc(-50% - 40vw));
}
}

#honorx7d .section-memory .copy-wrapper .copy-title {
margin-bottom: 1.5625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .copy-wrapper .copy-title {
margin-bottom: 4vw;
}
}

#honorx7d .section-memory .copy-wrapper .copy-text {
width: 52.8541666667vw;
margin: 0 auto;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .copy-wrapper .copy-text {
width: 100%;
}
}

#honorx7d .section-memory .img-wrapper {
width: 83.0729166667vw;
display: flex;
justify-content: space-between;
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% - 0.15625vw), calc(-50% + 19.4vw)) scale(1);
transition: all 0.7s ease;
overflow: hidden;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .img-wrapper {
width: 136.9872395833vw;
transform: translate(calc(-50% - 0.234375vw), calc(-50% + 31.9906vw + 14vw)) scale(1.5);
}
}

#honorx7d .section-memory .img-wrapper .top-shadow {
width: 100%;
height: 42.5vw;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(180deg, #ffffff 70%, rgba(255, 255, 255, 0.7) 95%, rgba(217, 217, 217, 0) 100%);
z-index: 1;
transition: all 0.3s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .img-wrapper .top-shadow {
height: 70.0825vw;
}
}

#honorx7d .section-memory .img-wrapper .top-shadow2 {
width: 100%;
height: 60vw;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(180deg, #ffffff 70%, rgba(255, 255, 255, 0.7) 80%, rgba(217, 217, 217, 0) 100%);
z-index: 1;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .img-wrapper .top-shadow2 {
height: 98.94vw;
}
}

#honorx7d .section-memory .img-wrapper .bottom-shadow {
width: 100%;
height: 60vw;
position: absolute;
bottom: 0;
left: 0;
background: linear-gradient(0deg, #ffffff 80%, rgba(255, 255, 255, 0.7) 100%, rgba(217, 217, 217, 0) 100%);
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .img-wrapper .bottom-shadow {
height: 75vw;
transition: all 0.4s ease;
background: linear-gradient(0deg, #ffffff 80%, rgba(255, 255, 255, 0.6) 91%, rgba(217, 217, 217, 0) 100%);
}
}

#honorx7d .section-memory .img-wrapper .item {
transition: all 0.7s ease;
}

#honorx7d .section-memory .img-wrapper .item1 {
width: 19.8744791667vw;
height: 119.5307291667vw;
margin-top: 20.3526041667vw;
clip-path: inset(0 0 0 1px);
transform: translateY(-38.5vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .img-wrapper .item1 {
width: 32.7730161458vw;
height: 197.1061723958vw;
margin-top: 33.5614442708vw;
clip-path: inset(0 0 0 1px);
transform: translateY(-63.4865vw);
}
}

#honorx7d .section-memory .img-wrapper .item2 {
width: 20.0838541667vw;
height: 96.225vw;
transform: translateY(20.5vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .img-wrapper .item2 {
width: 33.1182755208vw;
height: 158.675025vw;
transform: translateY(33.8045vw);
}
}

#honorx7d .section-memory .img-wrapper .item3 {
width: 21.2864583333vw;
height: 76.1vw;
margin-top: 29.590625vw;
transform: translateY(-13vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .img-wrapper .item3 {
width: 35.1013697917vw;
height: 125.4889vw;
margin-top: 48.794940625vw;
transform: translateY(-21.437vw);
}
}

#honorx7d .section-memory .img-wrapper .item4 {
width: 17.7505208333vw;
height: 95.2401041667vw;
margin-top: 2.9838541667vw;
clip-path: inset(0 1px 0 0);
transform: translateY(19.4vw);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .img-wrapper .item4 {
width: 29.2706088542vw;
height: 157.0509317708vw;
margin-top: 4.9203755208vw;
clip-path: inset(0 1px 0 0);
transform: translateY(31.6331vw);
}
}

#honorx7d .section-memory .phone-border {
width: 62.34375vw;
height: 62.34375vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, calc(-50% + 3.6vw)) scale(3.6);
opacity: 0;
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .phone-border {
opacity: 0;
width: 102.80484375vw;
height: 102.80484375vw;
transform: translate(-50%, calc(-50% + 5.9364vw + 6vw));
transition: all 0.3s ease;
}
}

#honorx7d .section-memory .text-wrapper {
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, calc(-50% + 19vw));
z-index: 1;
opacity: 0;
transition: all 0.3s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .text-wrapper {
transform: translate(-50%, calc(-50% + 53vw));
}
}

#honorx7d .section-memory .text-wrapper .txt-dots1 {
font-size: 2.9166666667vw;
background-image: linear-gradient(90deg, #814F22 0%, #D3AB7A 100%);
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .text-wrapper .txt-dots1 {
font-size: 8.5333333333vw;
}
}

#honorx7d .section-memory .text-wrapper .txt-dots2 {
font-size: 1.0416666667vw;
margin-top: 0.2604166667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-memory .text-wrapper .txt-dots2 {
font-size: 3.2vw;
margin-top: 0;
}
}

#honorx7d .section-light {
overflow: hidden;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light {
margin-top: -5vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 500px) {
#honorx7d .section-light {
margin-top: -15vw;
}
}

#honorx7d .section-light .sticky-container {
height: 53.5416666667vw;
position: static;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .sticky-container {
height: 189.3333333333vw;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light.is-active1 .text-wrapper {
transform: translate(calc(-50% - 0vw), calc(-50% - 52vw));
}
}

#honorx7d .section-light.is-active1 .text-wrapper .copy-title {
opacity: 1;
transform: translateY(0);
transition: all 0.7s ease;
}

#honorx7d .section-light.is-active1 .text-wrapper .icon-wrapper {
opacity: 1;
transform: translateY(0);
transition: all 0.7s ease 0.1s;
}

#honorx7d .section-light.is-active1 .phone-wrapper {
transform: translate(calc(-50% + 24vw), calc(-50% + 11.65vw));
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light.is-active2 .text-wrapper .icon-wrapper .icon-step {
opacity: 0;
transform: translateY(-20vw);
transition: all 0.7s ease;
}

#honorx7d .section-light.is-active2 .text-wrapper .icon-wrapper .icon-step2 {
opacity: 1;
transition: all 0.7s ease 0.1s;
transform: translate(calc(-50% - 0vw), calc(-50% + 0vw));
}
}

#honorx7d .section-light .text-wrapper {
width: 37.5vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% - 17vw), calc(-50% - 1vw));
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper {
opacity: 1;
width: 89.3333333333vw;
transform: translate(calc(-50% - 0vw), calc(-50% - 52vw));
}
}

#honorx7d .section-light .text-wrapper .copy-title {
width: 100%;
margin-bottom: 5.2083333333vw;
font-size: 3.75vw;
text-align: center;
opacity: 0;
transform: translateY(5vw);
transition: all 0.7s ease;
position: relative;
z-index: 2;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .copy-title {
font-size: 8.5333333333vw;
margin-bottom: 5.3333333333vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper {
width: 36.6666666667vw;
display: flex;
flex-direction: column;
opacity: 0;
transform: translateY(5vw);
transition: all 0.7s ease;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper {
width: 89.3333333333vw;
position: relative;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .icon-step {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .icon-step {
transform: translateY(0);
transition: all 0.7s ease 0.1s;
}
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .icon-step2 {
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% - 0vw), calc(-50% + 20vw));
opacity: 0;
transition: all 0.7s ease;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon {
position: relative;
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon .bg {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon .icon-txt {
position: absolute;
font-size: 0.875vw;
top: 3.3854166667vw;
left: 50%;
transform: translate(-50%, 0);
width: 100%;
text-align: center;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon .icon-txt {
font-size: 3vw;
top: 9.8133333333vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon .icon-txt1 {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 92%;
text-align: center;
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon .icon-txt1 .txt1 {
font-size: 1.46666666667vw;
margin-bottom: 0.2604166667vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon .icon-txt1 .txt1 {
font-size: 4.3333333333vw;
margin-bottom: 0vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon .icon-txt1 .txt2 {
font-size: 0.875vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon .icon-txt1 .txt2 {
font-size: 3vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon1 {
width: 17.9166666667vw;
height: 5.2083333333vw;
margin-bottom: 0.8333333333vw;
background: rgba(231, 231, 231, 0.7);
border-radius: 0.8333333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon1 {
width: 42.32vw;
height: 15.5466666667vw;
margin-bottom: 4vw;
border-radius: 2.1333333333vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon1 .bg {
width: 17.9166666667vw;
height: 5.2083333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon1 .bg {
width: 42.32vw;
height: 15.5466666667vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon2 {
width: 17.9166666667vw;
height: 5.2083333333vw;
margin-bottom: 0.8333333333vw;
background: rgba(231, 231, 231, 0.7);
border-radius: 0.8333333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon2 {
width: 42.32vw;
height: 15.5466666667vw;
margin-bottom: 4vw;
border-radius: 2.1333333333vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon2 .bg {
width: 17.9166666667vw;
height: 5.2083333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon2 .bg {
width: 42.32vw;
height: 15.5466666667vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon3 {
width: 11.6666666667vw;
height: 5.2083333333vw;
margin-bottom: 0.8333333333vw;
background: rgba(231, 231, 231, 0.7);
border-radius: 0.8333333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon3 {
width: 42.32vw;
height: 15.5466666667vw;
border-radius: 2.1333333333vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon3 .bg {
width: 11.6666666667vw;
height: 5.2083333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon3 .bg {
width: 42.32vw;
height: 15.5466666667vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon4 {
width: 11.6666666667vw;
height: 5.2083333333vw;
margin-bottom: 0.8333333333vw;
background: rgba(231, 231, 231, 0.7);
border-radius: 0.8333333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon4 {
width: 42.32vw;
height: 15.5466666667vw;
border-radius: 2.1333333333vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon4 .bg {
width: 11.6666666667vw;
height: 5.2083333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon4 .bg {
width: 42.32vw;
height: 15.5466666667vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon5 {
width: 11.6666666667vw;
height: 5.2083333333vw;
margin-bottom: 0.8333333333vw;
background: rgba(231, 231, 231, 0.7);
border-radius: 0.8333333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon5 {
width: 42.32vw;
height: 15.5466666667vw;
margin-bottom: 4vw;
border-radius: 2.1333333333vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon5 .bg {
width: 11.6666666667vw;
height: 5.2083333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon5 .bg {
width: 42.32vw;
height: 15.5466666667vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon6 {
width: 11.6666666667vw;
height: 5.2083333333vw;
background: rgba(231, 231, 231, 0.7);
border-radius: 0.8333333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon6 {
width: 42.32vw;
height: 15.5466666667vw;
margin-bottom: 4vw;
border-radius: 2.1333333333vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon7 {
width: 11.6666666667vw;
height: 5.2083333333vw;
background: rgba(231, 231, 231, 0.7);
border-radius: 0.8333333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon7 {
width: 42.32vw;
height: 15.5466666667vw;
border-radius: 2.1333333333vw;
}
}

#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon8 {
width: 11.6666666667vw;
height: 5.2083333333vw;
background: rgba(231, 231, 231, 0.7);
border-radius: 0.8333333333vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-light .text-wrapper .icon-wrapper .every-icon8 {
width: 42.32vw;
height: 15.5466666667vw;
border-radius: 2.1333333333vw;
}
}

#honorx7d .section-light .phone-wrapper {
width: 82.0833333333vw;
height: 82.0833333333vw;
position: absolute;
top: 50%;
left: 50%;
transform: translate(calc(-50% + 24vw), calc(-50% + 11.65vw + 100%));
transition: all 0.7s ease;
z-index: 1;
}

#honorx7d .section-sound {
-webkit-mask-image: linear-gradient(to top, #000, #fff);
mask-image: linear-gradient(to top, #000, #fff);
}

#honorx7d .section-sound .sticky-container {
height: 56.25vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-sound .sticky-container {
height: 172vw;
}
}

#honorx7d .section-sound.is-active1 .copy-wrapper {
transform: translate(-50%, 0);
opacity: 1;
transition: all 0.7s ease;
}

#honorx7d .section-sound .copy-wrapper {
width: 61.2916666667vw;
text-align: center;
position: absolute;
top: 6.25vw;
left: 50%;
transform: translate(-50%, 5vw);
opacity: 0;
transition: all 0.7s ease;
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-sound .copy-wrapper {
width: 89.3333333333vw;
top: 16vw;
}
}

#honorx7d .section-sound .copy-wrapper .copy-text {
margin-top: 1.5625vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-sound .copy-wrapper .copy-text {
margin-top: 4vw;
}
}

#honorx7d .section-sound .bottom-shadow {
width: 100%;
height: 13vw;
position: absolute;
bottom: -1px;
left: 0;
background: linear-gradient(0deg, #ffffff, rgba(255, 255, 255, 0));
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-sound .bottom-shadow {
height: 38vw;
bottom: 0;
}
}

#honorx7d .section-sound .video-wrapper {
transform: translateY(10vw);
width: 100vw;
height: 56.25vw;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-sound .video-wrapper {
width: 204vw;
height: 114.9333333333vw;
position: absolute;
bottom: 0;
left: 50%;
transform: translate(-50%, 0);
}
}

#honorx7d .section-sound .video-wrapper video {
clip-path: inset(2px 0);
}

#honorx7d .section-sound .video-wrapper .top-shadow {
width: 100%;
height: 20vw;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0));
z-index: 1;
}

@media (max-aspect-ratio: 12/10) and (max-width: 1025px) {
#honorx7d .section-sound .video-wrapper .top-shadow {
height: 40vw;
}
}

#honorx7d a:focus-visible,
#honorx7d button:focus-visible {
outline: 2px solid #0066cc;
outline-offset: 2px;
}

#honorx7d .section-ai .swiperBtn:focus-visible {
outline: 2px solid #0066cc;
outline-offset: 2px;
}