/* 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: 0em 1em;
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;
}

.cbcn-navigation-card-txt .fullRow {
  width: 100%;
  justify-content: center;
  gap: 1em;
}

.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: 22.1em;
  height: 46.5em;
  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, #C85B2D 4.8%, #F4D9D1 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: #F8D7CD;
}

.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: #F8D7CD;
}

.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;
}

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

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

.cbcn-straightScreen-paramGroup {
  position: absolute;
  bottom: 1.5em;
  left: 2.5em;
  gap: 4em;
  align-items: end;
  align-items: flex-end;
  opacity: 0;
}

/* 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;
}

/* 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 {
  width: 21.8em;
  flex-wrap: wrap;
  gap: 3em;
  right: 12.6em;
  opacity: 0;
}

/* battery */
.cbcn-battery-swiper {
  height: 100%;
  position: relative;
  z-index: 9;
}

.cbcn-battery-cardList {
  width: 100vw;
  height: 100%;
  position: relative;
  z-index: 9;
}
.cbcn-battery-endurance {
  height: 4.1em;
  bottom: 22.9em;
  overflow: hidden;
  z-index: 9;
  background: linear-gradient(136deg, #2E84E8 19.22%, #2D2AB8 92.53%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.cbcn-battery-card {
  position: absolute;
  bottom: 4.75em;
  left: 23.5em;
  gap: 22em;
  opacity: 0;
}
.cbcn-battery-card1 {
  opacity: 1;
}

.cbcn-battery-paramGroup {
  width: 49em;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1.5em 0em;
}

.cbcn-battery-txt1, .cbcn-battery-txt3, .cbcn-battery-txt4, .cbcn-battery-txt5 {
  z-index: 99;
  gap: 10.2em;
  align-items: end;
  align-items: flex-end;
}

.cbcn-battery-txt2 {
  position: relative;
  z-index: 99;
  gap: 3.5em;
}

.cbcn-battery-card3 .cbcn-battery-paramGroup{
  width: 50.5em;
  gap: 2.95em;
}
.cbcn-battery-card3 .cbcn-battery-paramGroup .cbcn-param:first-child, .cbcn-battery-txt2 .cbcn-param:first-child{
  flex: 1;
}

.cbcn-battery-card4 .cbcn-battery-paramGroup{
  justify-content: start;
  justify-content: flex-start;
  gap: 18.6em;
  align-items: end;
  align-items: flex-end;
}
.cbcn-battery-remark {
  position: relative;
  bottom: 0;
}

.cbcn-battery-videoDiv {
  width: 65em;
  height: 36.5em;
  position: absolute;
  bottom: 1em;
  z-index: 1;
  overflow: hidden;
}

.cbcn-battery-video2, .cbcn-battery-video3, .cbcn-battery-video4 {
  opacity: 0;
  transition: opacity 0.3s;
}
.cbcn-battery-video1 {
  opacity: 1;
  transition: opacity 0.3s;
}

/* endurance */
.cbcn-endurance-img {
  width: 49em;
  height: 22.8em;
  position: relative;
  margin-top: 3.5em;
}
.cbcn-endurance-title {
  gap: 2.5em;
  align-items: center;
}
.cbcn-endurance-text {
  width: 32em;
  text-align: center;
}
.cbcn-endurance-infoDiv {
  width: 100%;
  margin-top: 3.5em;
  gap: 2em 8.5em;
  flex-wrap: wrap;
}

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

.cbcn-chip-img {
  width: 60em;
  height: 29.0625em;
}


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

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

.cbcn-chip-paramGroup {
  width: 23em;
  gap: 1.5em 2.5em;
  flex-wrap: wrap;
  margin-top: 5em;
}

.cbcn-chip-paramGroup .cbcn-param:nth-of-type(3) {
  width: 8.8em;
}
/* .cbcn-chip-paramGroup .fullparam {
  width: 20.8em;
} */

/* 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-txt {
  width: 14.6em;
}

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

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

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

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

.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;
}

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

/* rearCamera */
.cbcn-rearCamera-videoDiv {
  width: 71em;
  height: 37.55em;
  margin-bottom: 4em;
  position: relative;
  overflow: hidden;
}

.cbcn-rearCamera-img {
  width: 21.45em;
  height: 37.55em;
  position: absolute;
  left: 38.55em;
  bottom: -20em;
  z-index: 2;
  opacity: 0;
}

.cbcn-rearCamera-imgbg {
  width: 100%;
  height: 32.5em;
  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: 16em;
  top: 8.9em;
}

.cbcn-rearCamera-lineicon1 {
  width: 15.35em;
  height: 0.05em;
  position: absolute;
  z-index: 99;
  left: 29.95em;
  top: 10.3em;
  stroke-dasharray: 307;
  stroke-dashoffset: 307;
}

.cbcn-rearCamera-paramDiv {
  gap: 2.5em;
}

.cbcn-rearCamera-paramDiv p {
  color: #fff !important;
}

.cbcn-rearCamera-txtDiv .cbcn-param .txt{
  color: #000000;
}

/* 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-content {
  justify-content: space-between;
}
.cbcn-portraitAlgorithm-title {
  gap: 3em;
}

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

.cbcn-portraitAlgorithm-img {
  position: relative;
  width: 24.5em;
  height: 31.5em;
  border-radius: 7px;
  overflow: hidden;
}


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

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

.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-screen {
  width: 100%;
}

.cbcn-halo-img {
  position: relative;
  width: 96em;
  height: 46.5em;
  margin: auto;
}

.cbcn-halo-title {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 5em;
  align-items: end;
  align-items: flex-end;
}
.cbcn-halo-title>div {
  width: 15.3em;
}

.cbcn-halo-paramDiv {
  margin-top: 3.5em;
  gap: 2em;
  position: relative;
  z-index: 9;
}


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

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

.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;
}

.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 {
  width: 100%;
  justify-content: space-between;
  align-items: end;
  align-items: flex-end;
}

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

.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;
}

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

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

.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;
}

/* 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: 100%;
  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: 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;
  }
}