/* kv */
.cbcn-kv-content {
  width: 100%;
  height: 100%;
  position: relative;
}

.cbcn-kv-img-bg {
  width: 100%;
  left: 0;
}

.cbcn-kv-logo {
  position: absolute;
  right: 2em;
  top: 4em;
  z-index: 200;
  width: 10em;
  opacity: 1;
}

.cbcn-kv-content-btn {
  position: absolute;
  right: 17em;
  top: calc(50% + 15vh);
  font-size: 1.3em;
  font-family: HanyiVar-vivo-hwid-50;
  color: #000000;
  line-height: 2.8em;
  display: flex;
  justify-content: center;
  align-items: center;
}

.cbcn-kv-content-btn-icon {
  display: block;
  position: relative;
  top: 0.05em;
  width: 1.04em;
  margin-left: 0.392857142857em;
  fill: currentColor;
}

.cbcn-kv-content-btn:hover {
  color: #475ef6;
}

/* navigation */
.cbcn-navigation-content {
  width: 166.5em;
  gap: 1em;
  left: 10em;
  align-items: center;
}

.cbcn-navigation-card-itemDiv {
  width: 32.5em;
  height: 35em;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

.cbcn-navigation-card-item {
  border-radius: 0.5em;
  overflow: hidden;
  width: 32.5em;
  height: 35em;
  width: 27.5em;
  height: 25em;
}


.cbcn-navigation-card-itemContent {
  width: 32.5em;
  height: 35em;
}

.cbcn-navigation-card-item img {
  transition: all 0.8s;
}

/* .cbcn-navigation-card-item:hover img {
  scale: 1.05;
} */

.cbcn-navigation-card-txt {
  height: 100%;
  padding-top: 2.5em;
  padding-bottom: 1.5em;
  justify-content: space-between;
  position: relative;
  z-index: 99;
}

.cbcn-navigation-card-txt .cbcn-p1 {
  gap: 0 1em;
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;
}

.cbcn-navigation-card-txt .fullRow {
  width: 100%;
}

.cbcn-navigation-card-txt p,
.cbcn-navigation-card-txt p span {
  color: #FFF !important;
}


/* exterior */
.cbcn-exterior-p1 {
  gap: 27.9em;
  z-index: 1;
}

.cbcn-exterior-p2 {
  gap: 27.9em;
  z-index: 20;
}

.cbcn-exterior-p2 .cbcn-pc-h7 {
  color: #fff;
}

.cbcn-exterior-videoDiv {
  width: 51.9em;
  height: 32.75em;
  z-index: 10;
  overflow: hidden;
}

/* color */
.cbcn-color-content {
  height: 100%;
  width: 100vw;
}

.cbcn-color-imgDiv {
  width: 48em;
  height: 100%;
  left: 0;
  z-index: 99;
}

.cbcn-color-img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: all 0.5s;
}

.cbcn-color-img.active {
  opacity: 1;
}


.cbcn-color-img-1 {
  width: 20.7em;
  height: 38.85em;
  bottom: 0;
  z-index: 3;
}


.cbcn-color-img-t {
  width: 12.3347em;
  height: 53.1em;
  left: 0;
  z-index: 2;
  opacity: 0;
}

.cbcn-color-img-bg {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.cbcn-color-txtDiv {
  width: 20em;
  left: 61em;
  height: calc(15.8em + 6.5em + 11.4em);
  justify-content: space-between;
  z-index: 10;
}

.cbcn-color-desc {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.cbcn-color-descItem {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: all 0.5s;
  text-align: center;
}

.cbcn-color-descItem.active {
  opacity: 1;
}

.cbcn-color-descItem:nth-of-type(1) .cbcn-pc-h8 {
  background: linear-gradient(298deg, #647CA9 4.8%, #A4BADB 133.51%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.cbcn-color-descItem:nth-of-type(2) .cbcn-pc-h8 {
  background: linear-gradient(298deg, #AFBD99 4.8%, #D2DAC3 133.51%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.cbcn-color-descItem:nth-of-type(3) .cbcn-pc-h8 {
  background: linear-gradient(298deg, #64686B 4.8%, #C3C7CA 133.51%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.cbcn-color-descItem .cbcn-p3 {
  background: linear-gradient(90deg, #949494 0%, #2E2E2E 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.cbcn-color-bottomDiv {
  padding-left: 0.4em;
}

.cbcn-color-infoDiv {
  width: 100%;
  height: 11.1em;
  position: relative;
}

.cbcn-color-info {
  gap: 1em;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  transition: all 0.5s;
}

.cbcn-color-info.active {
  opacity: 1;
}


.cbcn-color-btnList {
  margin-top: 3em;
  gap: 0.7em;
  width: max-content;
  border-radius: 3em;
}

.cbcn-color-btn {
  width: 1.7em;
  height: 1.7em;
  border-radius: 50%;
  border-width: 0;
  border-style: solid;
  cursor: pointer;
  background-color: #fff;
  position: relative;
  z-index: 99;
}

.cbcn-color-btn.active {
  border-width: 2px;
}

.cbcn-color-btn.index0 {
  border-color: #BDC6E6;
}

.cbcn-color-btn.index1 {
  border-color: #CCDBC4;
}

.cbcn-color-btn.index2 {
  border-color: #999999;
}

.cbcn-color-btn span {
  display: block;
  width: 1.4em;
  height: 1.4em;
  border-radius: 50%;
  border: 0.1em solid #fff;
}

.cbcn-color-btn.index0 span {
  background-color: #BDC6E6;
}

.cbcn-color-btn.index1 span {
  background-color: #CCDBC4;
}

.cbcn-color-btn.index2 span {
  background-color: #999999;
}

/* lensModule */

.cbcn-lensModule-content {
  margin-left: 100vw;
  left: 46em;
  width: 40.5em;
  height: 32.5em;
  overflow: hidden;
  z-index: -1;
}

.cbcn-lensModule-contentDiv {
  position: absolute;
  left: 0;
  top: 0;
  width: 40.5em;
  height: 32.5em;
}

.cbcn-lensModule-txtDiv {
  width: 100%;
  top: 3em;
  padding-left: 3em;
  padding-right: 2.5em;
  z-index: 9;
  justify-content: space-between;
}

/* curvedScreen */
.cbcn-curvedScreen-content {
  margin-right: -7.7em;
  right: 9.5em;
  width: 40.5em;
  height: 32.5em;
  overflow: hidden;
  z-index: -1;
}

.cbcn-curvedScreen-contentDiv {
  position: absolute;
  right: 0;
  top: 0;
  width: 40.5em;
  height: 32.5em;
}

.cbcn-curvedScreen-paramGroup {
  gap: 8.3em;
  right: 5em;
}

/* display */
.cbcn-display-p1 {
  gap: 39.85em;
  z-index: 20;
}

.cbcn-display-txt1 {
  z-index: 20;
  top: 4.8em;
  opacity: 0;
}

.cbcn-display-p2 {
  width: 30em;
}

.cbcn-display-img {
  width: 48.8em;
  height: 29.1em;
  z-index: 10;
}

.cbcn-display-paramDiv {
  width: 46.5em;
  top: calc(50% + 9.2em);
  flex-wrap: wrap;
  gap: 1.5em 6.5em;
  z-index: 20;
  justify-content: center;
  opacity: 0;
}

.cbcn-display-paramDiv .style1 {
  width: 10.5em;
}

.cbcn-display-paramDiv .style2 {
  width: 15em;
}

.cbcn-display-paramDiv .style3 {
  width: 7em;
}

.cbcn-display-descDiv {
  top: calc(50% + 11.95em);
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1em 0;
  width: 46.5em;
  opacity: 0;
  z-index: 20;
}

.cbcn-display-descDiv .cbcn-pc-h4 {
  width: 9em;
}

/* waterproof */
.cbcn-waterproof-title {
  gap: 1.7em;
  width: 20.1em;
  left: 12.5em;
}

/* antiDrop */
.cbcn-antiDrop-imgDiv {
  width: 48em;
  height: 24.94885em;
  overflow: hidden;
}

.cbcn-antiDrop-img {
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.cbcn-antiDrop-txt {
  right: 12.5em;
  width: 21.4em;
}

.cbcn-antiDrop-info {
  margin-top: 2.5em;
}

.cbcn-antiDrop-paramDiv {
  margin-top: 4.5em;
  gap: 3.75em;
}

/* quality */
.cbcn-quality-swiper {
  width: 49em;
  height: 40em;
  position: relative;
  overflow: hidden;
}

.cbcn-quality-cardList {
  position: absolute;
  left: 0;
  top: 0;
  transition: all 0.5s;
}

.cbcn-quality-card {
  width: 49em;
  margin-right: 3em;
  overflow: hidden;
  position: relative;
}

.cbcn-quality-imgDiv {
  position: relative;
  width: 49em;
  height: 24em;
}

.cbcn-quality-title {
  justify-content: space-between;
  align-items: end;
  align-items: flex-end;
  margin-top: 2.5em;
}

.cbcn-quality-text {
  width: 20.5em;
  text-align: left;
}

.cbcn-quality-infoDiv {
  justify-content: space-between;
  margin-top: 3em;
}

.cbcn-quality-infoDiv>div {
  width: 13.5em;
}

.cbcn-quality-title2 {
  justify-content: space-between;
  margin-top: 2.5em;
}

.cbcn-quality-text2 {
  width: 21.4em;
  justify-content: space-between;
}

.cbcn-quality-paramDiv {
  gap: 3.75em;
}

.cbcn-quality-swiperBtnList {
  gap: 0.8em;
}

.cbcn-quality-swiperBtn {
  height: 1em;
  width: 4.5em;
  cursor: pointer;
  position: relative;
}

.cbcn-quality-swiperBtn div {
  width: 100%;
  height: 0.2em;
  background-color: #E6E6E6;
  border-radius: 1em;
}

.cbcn-quality-swiperBtn.active div {
  background-color: #808080;
}

/* studioLevel */
.cbcn-studioLevel-p {
  z-index: 99;
  transform-origin: center;
  font-size: 1em;
  opacity: 0;
}


/* rearCamera */
.cbcn-rearCamera-videoDiv {
  width: 73em;
  height: 40.55em;
  margin-bottom: 2.35em;
  position: relative;
  overflow: hidden;
}

.cbcn-rearCamera-img {
  width: 21.8em;
  height: 40.55em;
  position: absolute;
  left: 25.85em;
  bottom: -20em;
  z-index: 2;
  opacity: 0;
}

.cbcn-rearCamera-imgbg {
  width: 100%;
  height: 33.55em;
  position: absolute;
  z-index: 1;
  left: 0;
  bottom: -10em;
  opacity: 0;
}

.cbcn-rearCamera-txt {
  position: absolute;
  gap: 2em;
  opacity: 0;
  z-index: 3;
}

.cbcn-rearCamera-txt1 {
  left: 7.25em;
  top: 11.75em;
}

.cbcn-rearCamera-txt2 {
  right: 9.2em;
  top: 18.6em;
}

.cbcn-rearCamera-lineicon1 {
  width: 26.35em;
  height: 0.05em;
  position: absolute;
  z-index: 99;
  left: 7.25em;
  top: 10.6em;
  stroke-dasharray: 527;
  stroke-dashoffset: 527;
}

.cbcn-rearCamera-lineicon2 {
  width: 30.2em;
  height: 0.05em;
  position: absolute;
  z-index: 99;
  right: 9.2em;
  top: 17.45em;
  stroke-dasharray: 604;
  stroke-dashoffset: 604;
}



/* fullFocus */
.cbcn-fullFocus-title {
  width: 100%;
}

.cbcn-fullFocus-txt {
  width: 20em;
}

.cbcn-fullFocus-content {
  opacity: 0;
  width: 100%;
  margin-top: 60px;
}

.cbcn-fullFocus-swiper {
  width: 18em;
  height: 22em;
  overflow: visible;
  position: relative;
}

.cbcn-fullFocus-cardList {
  position: absolute;
  top: 0;
  left: 0;
}

.cbcn-fullFocus-card {
  width: 18em;
  height: 22em;
  margin-right: 1em;
  opacity: 0.4;
  position: relative;
  border-radius: 7px;
  overflow: hidden;
}

.cbcn-fullFocus-card.active {
  opacity: 1;
}

.cbcn-fullFocus-infoDiv {
  width: 19.35345em;
  position: relative;
  margin-top: 1.5em;
  height: 7em;
  user-select: none;
  overflow: hidden;
}

.cbcn-fullFocus-video {
  display: block;
  width: 100%;
}

.cbcn-fullFocus-info {
  display: block;
  top: 0;
  position: absolute;
  width: 100%;
  opacity: 0;
}

.cbcn-fullFocus-info0 {
  opacity: 1;
}

.cbcn-fullFocus-info .cbcn-pc-h6 {
  margin-top: 2em;
}

/* portraitAlgorithm */
.cbcn-portraitAlgorithm-title {
  justify-content: space-between;
  align-items: end;
  align-items: flex-end;
}

.cbcn-portraitAlgorithm-text {
  width: 21em;
}

.cbcn-portraitAlgorithm-swiper {
  margin-top: 1.55em;
  width: 49em;
  height: 25em;
  position: relative;
  overflow: visible;
}

.cbcn-portraitAlgorithm-cardList {
  position: absolute;
  left: 0;
  top: 0;
}

.cbcn-portraitAlgorithm-card {
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  width: 0;
  height: 25em;
  margin-left: 77.5em;
  border-radius: 7px;
}

.cbcn-portraitAlgorithm-card.index0 {
  width: 49em;
  margin-left: 0;
}

.cbcn-portraitAlgorithm-card-content {
  width: 49em;
  height: 25em;
  position: absolute;
  left: 0;
  top: 0;
  justify-content: space-between;
}

.cbcn-portraitAlgorithm-img {
  position: relative;
  width: 24.5em;
  height: 100%;
  overflow: hidden;
}


/* facula */
.cbcn-facula-title {
  justify-content: space-between;
  align-items: end;
  align-items: flex-end;
}

.cbcn-facula-text {
  width: 16.5em;
}

.cbcn-facula-cardList {
  justify-content: space-between;
  margin-top: 3em;
}

.cbcn-facula-img {
  position: relative;
  width: 24em;
  height: 28.5em;
  margin-bottom: 2em;
  border-radius: 7px;
  overflow: hidden;
}


/* halo */
.cbcn-halo-content {
  height: 54em;
  margin-top: 5em;
}

.cbcn-halo-video {
  width: 96em;
  height: 54em;
}
.cbcn-halo-txt {
  right: 0;
  width: 20.3em;
  margin-top: 5em;
  opacity: 0;
}

.cbcn-halo-txt .cbcn-title {
  margin-bottom: 1.5em;
}

.cbcn-halo-paramGroup {
  margin-top: 2.5em;
  gap: 2em;
}


/* fullFocusLight */
.cbcn-fullFocusLight-title {
  width: 100%;
}

.cbcn-fullFocusLight-txt {
  width: 27em;
}

.cbcn-fullFocusLight-content {
  opacity: 0;
  width: 100%;
  margin-top: 60px;
}

.cbcn-fullFocusLight-swiper {
  width: 19em;
  height: 26em;
  overflow: visible;
  position: relative;
}

.cbcn-fullFocusLight-cardList {
  position: absolute;
  top: 0;
  left: 0;
}

.cbcn-fullFocusLight-card {
  width: 19em;
  height: 26em;
  margin-right: 1em;
  opacity: 0.4;
  position: relative;
  overflow: hidden;
  border-radius: 7px;
}

.cbcn-fullFocusLight-card.active {
  opacity: 1;
}


.cbcn-fullFocusLight-infoDiv {
  width: 19.35345em;
  position: relative;
  margin-top: 1.5em;
  height: 7em;
  user-select: none;
  overflow: hidden;
}

.cbcn-fullFocusLight-video {
  display: block;
  width: 100%;
}

.cbcn-fullFocusLight-info {
  display: block;
  top: 0;
  position: absolute;
  width: 100%;
  opacity: 0;
}

.cbcn-fullFocusLight-info0 {
  opacity: 1;
}

.cbcn-fullFocusLight-info .cbcn-pc-h6 {
  margin-top: 2em;
}

/* rearSupplementaryLight */
.cbcn-rearSupplementaryLight-title {
  justify-content: space-between;
  align-items: end;
  align-items: flex-end;
}

.cbcn-rearSupplementaryLight-text {
  width: 19em;
}

.cbcn-rearSupplementaryLight-swiper {
  margin-top: 1.55em;
  width: 49em;
  height: 25em;
  position: relative;
  overflow: visible;
}

.cbcn-rearSupplementaryLight-cardList {
  position: absolute;
  left: 0;
  top: 0;
}

.cbcn-rearSupplementaryLight-card {
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  width: 0;
  height: 25em;
  margin-left: 77.5em;
  border-radius: 7px;
}

.cbcn-rearSupplementaryLight-card.index0 {
  width: 49em;
  margin-left: 0;
}

.cbcn-rearSupplementaryLight-card-content {
  width: 49em;
  height: 25em;
  position: absolute;
  left: 0;
  top: 0;
  justify-content: space-between;
}

.cbcn-rearSupplementaryLight-img {
  position: relative;
  width: 24.5em;
  height: 100%;
  overflow: hidden;
}

/* rearSupplementaryLightSimple */
.cbcn-rearSupplementaryLightSimple-title {
  margin-top: 10em;
}

.cbcn-rearSupplementaryLightSimple-text {
  width: 19em;
}

.cbcn-rearSupplementaryLightSimple-content {
  justify-content: space-between;
  margin-top: 3.5em;
}

.cbcn-rearSupplementaryLightSimple-img {
  width: 24em;
  height: 24em;
  position: relative;
  overflow: hidden;
}

.cbcn-rearSupplementaryLightSimple-contentItem {
  position: relative;
}

.cbcn-rearSupplementaryLightSimple-contentItem:last-of-type {
  margin-top: 6.45em;
}

.cbcn-rearSupplementaryLightSimple-infoTxt {
  margin-top: 2em;
}

/* frontCamera */
.cbcn-frontCamera-txt {
  left: 19.6em;
}

.cbcn-frontCamera-text {
  width: 21em;
}

.cbcn-frontCamera-img {
  position: absolute;
  top: 150px;
  right: 15.65em;
  width: 26.4em;
  height: 61.2em;
  z-index: 2;
}

/* frontSimple */
.cbcn-frontSimple-contentDiv {
  left: 23.5em;
  margin-top: 30px;
}

.cbcn-frontSimple-content1 {
  gap: 2.5em;
}

.cbcn-frontSimple-content1-title {
  width: 19.35em;
  /* margin-top: 3.95em; */
}

.cbcn-frontSimple-content1-imgDiv {
  /* margin-top: 6em; */
}

.cbcn-frontSimple-content1-img {
  width: 24.1em;
  height: 27em;
  position: relative;
  border-radius: 7px;
  overflow: hidden;
}

.cbcn-frontSimple-content1-img img {
  opacity: 0;
  transition: all 0.5s;
}

.cbcn-frontSimple-content1-img img.active {
  opacity: 1;
}

.cbcn-frontSimple-content1-info {
  margin-top: 2em;
}

/* frontSupplementaryLight */
.cbcn-frontSimple-content2 {
  gap: 2.5em;
  margin-left: 7.5em;
}

.cbcn-frontSimple-content2-img {
  width: 24.1em;
  height: 27em;
  position: relative;
  border-radius: 7px;
  overflow: hidden;
}

.cbcn-frontSimple-content2-img img {
  opacity: 0;
  transition: all 0.5s;
}

.cbcn-frontSimple-content2-img img.active {
  opacity: 1;
}

.cbcn-frontSimple-content2-info {
  margin-top: 1.5em;
}

.cbcn-frontSimple-content2-title {
  width: 19.6em;
  margin-top: 10.55em;
}

/* content3 */
.cbcn-frontSimple-content3 {
  gap: 2.5em;
  margin-left: 7em;
}

.cbcn-frontSimple-content3-imgDiv {
  margin-top: 8em;
}

.cbcn-frontSimple-content3-img {
  width: 39em;
  height: 25em;
  position: relative;
  border-radius: 7px;
  overflow: hidden;
}

.cbcn-frontSimple-content3-title {
  width: 18.55em;
}

.cbcn-frontSuperWideAngle-content {
  justify-content: space-between;
  align-items: center;
}

.cbcn-frontSuperWideAngle-text {
  width: 19em;
}

.cbcn-frontSuperWideAngle-imgDiv {
  width: 25.5em;
  height: 28.3em;
  position: relative;
  border-radius: 7px;
  overflow: hidden;
}

/* AIRetouching */
.cbcn-AIRetouching-content {
  width: 100vw;
  margin-top: 60px;
}

.cbcn-AIRetouching-swiper {
  width: 100vw;
  height: 27.5em;
  position: relative;
}

.cbcn-AIRetouching-cardList {
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.5s;
}

.cbcn-AIRetouching-card {
  width: 100vw;
  height: 27.5em;
  justify-content: space-between;
  position: relative;
}

.cbcn-AIRetouching-card-content {
  height: 100%;
  align-items: center;
  margin-left: 23.5em;
}

.cbcn-AIRetouching-text {
  width: 15.3em;
}

.cbcn-AIRetouching-img1 {
  width: 28.1em;
  height: 27.3em;
  margin-left: 3.6em;
  position: relative;
}

.cbcn-AIRetouching-img2 {
  margin-left: 4.85em;
  position: relative;
  gap: 1em;
}

.cbcn-AIRetouching-img2 img {
  width: 19em;
  height: 27.5em;
}

.cbcn-AIRetouching-img3 {
  width: 19.65em;
  height: 28.4em;
  margin-left: 10.95em;
  position: relative;
}


.cbcn-AIRetouching-swiperBtnList {
  margin-top: 3em;
  gap: 0.75em;
  justify-content: center;
}

.cbcn-AIRetouching-swiperBtn {
  height: 1em;
  width: 5em;
  cursor: pointer;
  position: relative;
}

.cbcn-AIRetouching-swiperBtn div {
  width: 100%;
  height: 0.2em;
  background-color: #E6E6E6;
  border-radius: 1em;
}

.cbcn-AIRetouching-swiperBtn.active div {
  background-color: #808080;
}

.cbcn-AIRetouching-top {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 99;
  background-color: #fff;
}

.cbcn-AIRetouching-p1 {
  gap: 19.95em;
  z-index: 20;
}

.cbcn-AIRetouching-p1 span {
  width: 5em;
}

.cbcn-AIRetouching-p1 span {
  width: 5em;
  text-align: right;
}

.cbcn-AIRetouching-top-imgbgDiv {
  width: 14.45em;
  height: 31.45em;
}

.cbcn-AIRetouching-top-imgDiv {
  width: 14.45em;
  height: 31.45em;
  margin-top: 30px;
}

.cbcn-AIRetouching-top-imgInfo {
  position: absolute;
  bottom: 1em;
  left: 1.5em;
  z-index: 99;
  opacity: 0;
}

.cbcn-AIRetouching-top-img1 {
  width: 14.45em;
  height: 31.45em;
  z-index: 1;
}

.cbcn-AIRetouching-top-img2 {
  width: 14.45em;
  height: 31.45em;
  z-index: 3;
}

.cbcn-AIRetouching-top-img3 {
  width: 5.19795em;
  height: 5.19795em;
  position: absolute;
  left: 6.8em;
  top: 5.18em;
  z-index: 2;
  border-radius: 7px;
  overflow: hidden;
}

.cbcn-AIRetouching-top-img4 {
  width: 8.50205em;
  height: 8.46175em;
  position: absolute;
  bottom: 0.52em;
  right: 2.98em;
  z-index: 2;
  border-radius: 7px;
  overflow: hidden;
}

.cbcn-AIRetouching-top-title {
  left: 11.35em;
  width: 18.4em;
  margin-left: -32em;
}

.cbcn-AIRetouching-swiperBtnList {
  opacity: 0;
}

/* battery */
.cbcn-battery-videoDiv {
  width: 65em;
  height: 36.5em;
  margin-top: 60px;
}

.cbcn-battery-title {
  position: absolute;
  bottom: calc(50% + 10.35em);
  left: 23.5em;
}

.cbcn-battery-title2 {
  opacity: 0;
}

.cbcn-battery-txt {
  position: absolute;
  top: calc(50% + 9.4em + 60px);
  left: 23.5em;
  width: 20em;
}

.cbcn-battery-txt2 {
  opacity: 0;
}

.cbcn-battery-paramGroup1 {
  position: absolute;
  top: calc(50% + 9.4em + 60px);
  right: 25.6em;
  width: 17.9em;
}

.cbcn-battery-paramGroup1 .cbcn-param {
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 12.8em;
  opacity: 0;
}

.cbcn-battery-paramGroup1 .cbcn-battery-param1 {
  margin-top: 0;
  opacity: 1;
}

.cbcn-battery-paramGroup2 {
  position: absolute;
  top: calc(50% + 9.4em + 60px);
  right: 28.7em;
  gap: 1em;
  opacity: 0;
}

/* chip */
.cbcn-chip-p1 {
  gap: 27.9em;
  z-index: 1;
}

.cbcn-chip-img {
  width: 59.9em;
  height: 39.6em;
}


.cbcn-chip-textDiv1 {
  left: 23.5em;
  margin-left: -50.5em;
}

.cbcn-chip-text {
  width: 16.4em;
}

.cbcn-chip-paramGroup {
  width: 23em;
  justify-content: space-between;
  gap: 1.5em;
  flex-wrap: wrap;
  margin-top: 4.4em;
}

.cbcn-chip-paramGroup .cbcn-param {
  width: 10.6em;
}


.cbcn-chip-textDiv2 {
  left: 23.5em;
  margin-top: 38.35em;
  gap: 4em;
}

.cbcn-chip-textDiv2Row {
  justify-content: space-between;
  flex-wrap: wrap;
  width: 23.3em;
  gap: 1.5em;
}

/* cooling */
.cbcn-cooling-title {
  gap: 3em;
  position: absolute;
  bottom: calc(50% - 4.75em);
  left: 23.5em;
}

.cbcn-cooling-txt {
  width: 17em;
}

.cbcn-cooling-imgDiv {
  position: absolute;
  left: 39.05em;
  width: 45em;
  height: 30.5em;
}

.cbcn-cooling-infoDiv {
  gap: 2em;
  left: 58.45em;
  margin-left: 37.6em;
}

.cbcn-cooling-infoDiv .cbcn-param {
  width: 12.1em;
}

/* storage */
.cbcn-storage-title {
  justify-content: space-between;
}

.cbcn-storage-paramGroup {
  gap: 2.5em;
}

.cbcn-storage-imgDiv {
  margin-top: 3em;
  width: 100%;
  height: 31em;
  position: relative;
  border-radius: 7px;
  overflow: hidden;
}

/* signal */
.cbcn-signal-title {
  justify-content: space-between;
  align-items: end;
  align-items: flex-end;
}

.cbcn-signal-txt {
  width: 18em;
}

.cbcn-signal-cardList {
  width: 100%;
  justify-content: space-between;
  margin-top: 3em;
}

.cbcn-signal-card {
  width: 11.65em;
  height: 16.3em;
  padding: 1.5em 1.25em;
  align-items: center;
  justify-content: space-between;
  border-radius: 0.5em;
  background: #FFF;
}

.cbcn-signal-cardImg {
  width: 7.5em;
  height: 7.55em;
}

/* ai */
.cbcn-ai-swiper {
  margin-top: 3.6em;
  width: 42.5em;
  height: 25.75em;
  position: relative;
  overflow: visible;
}

.cbcn-ai-cardList {
  position: absolute;
  left: 0;
  top: 0;
  transition: all 0.5s;
}

.cbcn-ai-card {
  width: 42.5em;
  height: 25.75em;
  margin-right: 3em;
  overflow: hidden;
  position: relative;
}

.cbcn-ai-img {
  position: relative;
  width: 24em;
  height: 100%;
}

.cbcn-ai-card-info {
  position: absolute;
  top: 2.5em;
  left: 2em;
  z-index: 99;
  gap: 1.75em;
}

.cbcn-ai-desc {
  width: 16em;
}

.cbcn-ai-swiperBtnList {
  margin-top: 3em;
  gap: 0.75em;
  justify-content: center;
}

.cbcn-ai-swiperBtn {
  height: 1em;
  width: 5em;
  cursor: pointer;
  position: relative;
}

.cbcn-ai-swiperBtn div {
  width: 100%;
  height: 0.2em;
  background-color: #E6E6E6;
  border-radius: 1em;
}

.cbcn-ai-swiperBtn.active div {
  background-color: #808080;
}

/* originOS */
.cbcn-originOS-card {
  width: 42.52895em;
  height: 17.0086em;
  background: #fff;
  border-radius: 0.6em;
  position: relative;
  overflow: hidden;
}

.cbcn-originOS-card-txt {
  position: absolute;
  top: 3.5em;
  left: 2em;
}

.cbcn-originOS-imgIcon {
  width: 14.5em;
  height: 4.8507em;
  margin-bottom: 3.7em;
  display: block;
}

.cbcn-originOS-img {
  width: 26.45em;
  height: 14.25em;
  position: absolute;
  bottom: 0;
  right: 0;
}

/* note */
.cbcn-note-title {
  font-size: 0.9em;
  line-height: 150%;
}

.cbcn-note-content {
  margin-top: 2em;
}

.cbcn-note-desc {
  font-size: 0.6em;
  color: #808080;
  line-height: 200%;
}

.cbcn-note-desc ol li {
  list-style: decimal;
  list-style-position: outside;
  margin-left: 1.5em;
}

@media screen and (min-width: 1440px) and (max-width: 1600px) {}

@media screen and (min-width: 981px) {
  .cbcn-display-paramDiv .textClip {
    opacity: 0.7;
    background: linear-gradient(136deg, #1478ED 19.22%, #080BBD 92.53%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .cbcn-fullFocus-title .subtitle {
    padding-right: 1.36em;
  }
  .cbcn-halo-title .subtitle{
    padding-right: 1.36em;
  }
  .cbcn-fullFocusLight-title .subtitle{
    padding-right: 1.36em;
  }
}