@media screen and (max-width: 980px) {
  /* kv  */
  @media screen {
    .cbcn-kv-screen {
      width: 100%;
      height: calc(3000 / 1499 * 100vw);
      position: relative;
      display: block;
    }
    .cbcn-kv-logo {
      position: absolute;
      width: 1.1em;
      bottom: 1.32em;
      right: 0.65em;
    }
    .cbcn-kv-remark {
      position: absolute;
      right: 0.7em;
      bottom: 0.47em;
      text-align: right;
    }
  }
  /* navigation */
  @media screen {
    .cbcn-navigation-screen {
      background: #f5f5f5 !important;
    }
    .cbcn-navigation-swiper {
      width: 100%;
      padding: 0 1em;
    }
    .cbcn-navigation-gap {
      gap: 1em;
    }

    .cbcn-navigation-row {
      gap: 1em;
    }

    .cbcn-navigation-item {
      width: 100%;
      padding: 1.5em 1em;
      background: #010101;
      border-radius: 0.6em;
      overflow: hidden;
      text-decoration: none;
    }

    .cbcn-navigation-img {
      width: 14.8em;
      height: 14.8em;
      position: relative;
    }
    .cbcn-navigation-img img {
      position: absolute;
      top: -1.5em;
      left: -1em;
      width: 16.75em;
      min-height: auto;
    }
    .cbcn-navigation-img .cbcn-navigation-img3 {
      top: -0.85em;
    }

    .cbcn-navigation-txt {
      width: 100%;
      margin-top: 1.75em;
      position: relative;
      z-index: 9;
    }
    .cbcn-navigation-icon {
      width: 1.5em;
      height: 1.8em;
      position: absolute;
      top: 1.05em;
      left: 1.05em;
      z-index: 9;
    }
    .cbcn-navigation-desc {
      position: absolute;
      top: 10.82em;
      padding: 0 2.83em;
      text-align: center;
    }

    /* appearance */
    @media screen {
      .cbcn-appearance-screen {
        width: 100%;
        height: 100vh;
        overflow: hidden;
      }

      .cbcn-appearance-screen div {
        width: 100%;
      }

      .cbcn-appearance-p1,
      .cbcn-appearance-p2,
      .cbcn-appearance-p3 {
        width: 100%;
      }

      .cbcn-appearance-video {
        width: 100%;
        height: 34.85em;
      }
    }

    /* color */
    @media screen {
      .cbcn-color-screen {
        padding: 4em 0;
        padding-bottom: 0 !important;
        position: relative;
      }

      .cbcn-color-swiper {
        width: 100%;
        height: calc(17.2em + 3em);
        overflow: hidden;
        position: relative;
      }

      .cbcn-color-txt {
        margin: 0 auto;
        align-items: center;
        gap: 1em;
        opacity: 0;
        padding: 0 1em;
        min-height: 5em;
      }

      .swiper-slide-active .cbcn-color-txt {
        opacity: 1;
      }

      .cbcn-color-img {
        width: 100%;
        height: 14.2em;
        display: block;
        object-fit: cover;
      }

      .cbcn-color-btnListDiv {
        left: 50%;
        transform: translateX(-50%);
        top: 35%;
        position: absolute;
        z-index: 9;
      }

      .cbcn-color-btnList {
        display: inline-flex !important;
        width: auto;
        padding: 0.5em;
        align-items: center;
        gap: 0.6em;
        border-radius: 4.25em;
        background: rgba(255, 255, 255, 0.15);
        backdrop-filter: blur(25px);
        -webkit-backdrop-filter: blur(25px);
      }

      .cbcn-color-btn {
        width: 1.5em;
        height: 1.5em;
        cursor: pointer;
        position: relative;
      }

      .cbcn-color-btn svg {
        width: 1.5em;
        height: 1.5em;
      }

      .cbcn-color-circle {
        fill: none;
        stroke-width: 2.5px;
        stroke-dasharray: 125.6px;
        stroke-dashoffset: 125.6px;
      }

      .cbcn-color-btn.index1 .cbcn-color-circle {
        stroke: #bead9f;
      }

      .cbcn-color-btn.index2 .cbcn-color-circle {
        stroke: #000000;
      }
      .cbcn-color-btn.index3 .cbcn-color-circle {
        stroke: #00005b;
      }
      .cbcn-color-btn.active .cbcn-color-circle {
        stroke-dashoffset: 0;
        transition: stroke-dashoffset 1s ease-out;
      }
    }

    /* design */
    @media screen {
      .cbcn-design-screen.bk {
        background: #1a1a1a;
      }

      .cbcn-design-txt2 {
        justify-content: center;
        gap: 1em;
        margin-top: 1.75em;
      }

      .cbcn-design-txt2 P {
        text-align: left !important;
      }

      .cbcn-design-swiper {
        width: 100%;
        height: 12.5em;
        /* overflow: hidden; */
        position: relative;
        margin-top: 2.5em;
      }

      .cbcn-design-swiper-item {
        width: 16.75em;
        height: 12.5em;
        border-radius: 0.6em;
        overflow: hidden;
      }

      .cbcn-design-switchBtn-list {
        margin-top: 2em;
        justify-content: flex-end;
      }

      .cbcn-design-txt1 {
        text-align: left !important;
        width: 80%;
      }
    }

    /* image */
    @media screen {
      .cbcn-image-txt1 {
        padding: 0 1em;
        display: flex !important;
        flex-direction: column;
        justify-content: center;
        gap: 2.5em;
      }
      .cbcn-image-txt1 .ct {
        text-align: center!important;
      }
    }

    /* lensmodule */
    @media screen {
      .cbcn-lensmodule-img {
        height: 14.45em;
        width: 100%;
      }
    }

    /* zeiss */
    @media screen {
      .cbcn-zeiss-txt1 {
        width: 100%;
      }

      .cbcn-zeiss-img {
        width: 100%;
        height: 8em;
        margin: 2em 0;
      }

      .cbcn-zeiss-txt2 {
        padding: 0 1em;
      }
      .cbcn-zeiss-txt2 P {
        text-align: left !important;
      }

      .cbcn-zeiss-txt2 div:nth-child(2) {
        margin-top: 1.75em;
      }
    }

    /* rearCamera */
    @media screen {
      .cbcn-rearCamera-screen {
        padding: 4em 0;
      }

      .cbcn-rearCamera-txt1 {
        width: 100%;
        margin-bottom: 8em;
      }

      .cbcn-rearCamera-desc {
        margin-top: 2.5em;
        width: 100%;
        gap: 2.5em;
      }

      .cbcn-rearCamera-param {
        margin-top: 2.5em;
        gap: 1em;
      }

      .cbcn-rearCamera-img {
        width: 100%;
        height: 17.8em;
      }
    }

    /* longFocus */
    @media screen {
      .cbcn-longFocus-desc {
        width: 100%;
        padding: 0 1em;
      }

      .cbcn-longFocus-titletxt {
        padding: 0 1em;
      }
      .cbcn-longFocus-titletxt p {
        text-align: left !important;
      }
      .cbcn-longFocus-desc p {
        text-align: left !important;
      }
      .cbcn-longFocus-img {
        width: 100%;
        height: 14.05em;
        margin-top: 2.5em;
      }

      .cbcn-longFocus-txt2 {
        margin-top: 2.5em;
      }

      .cbcn-longFocus-param-div {
        width: 100%;
        gap: 1.5em;
        display: flex !important;
      }

      .cbcn-longFocus-param-row {
        flex-wrap: wrap;
        gap: 1.5em 1.2em;
      }

      .cbcn-longFocus-param-row .cbcn-param:nth-of-type(2n + 1) {
        min-width: 7em;
      }

      .cbcn-longFocus-param-row2 {
        gap: 1.2em;
      }

      .cbcn-longFocus-param-div .cbcn-param {
        padding-top: 1.35em;
        border-top: 1px solid #4d4d4d;
      }
    }

    /* stageMode */
    @media screen {
      .cbcn-stageMode-screen p {
        text-align: left !important;
      }
      .cbcn-stageMode-screen .cbcn-switchBtnList .cbcn-wap-flexRow {
        background-image: linear-gradient(
          to left,
          #000000 0%,
          #000000 50%,
          transparent 100%
        );
      }

      .cbcn-stageMode-info-p-p {
        margin-top: 1em !important;
        opacity: 1 !important;
      }

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

      .cbcn-stageMode-info-div p:nth-child(2) {
        margin-top: 1em;
      }

      .cbcn-stageMode-info {
        width: 100%;
      }

      .cbcn-stageMode-1-swiper {
        width: 100%;
        overflow: hidden;
        position: relative;
        margin-top: 2.5em;
      }
      .cbcn-stageMode-2-swiper {
        width: 100%;
        overflow: hidden;
        position: relative;
        margin-top: 8em;
      }
      .cbcn-stageMode-img {
        width: 100%;
        height: 11.35em;
        border-radius: 0.6em;
        overflow: hidden;
      }
      .cbcn-stageMode-switchBtn-list {
        margin-top: 2em;
        margin-bottom: 2em;
      }
      .cbcn-stageMode-video1,
      .cbcn-stageMode-video2 {
        width: 100%;
        height: 15em;
        border-radius: 0.6em;
        overflow: hidden;
      }

      .cbcn-stageMode-info .cbcn-drag-desc {
        position: absolute;
        bottom: 0.75em;
        left: 0.75em;
        display: flex;
        padding: 0.25em 0.5em 0.05em 0.5em;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        border-radius: 1.2em;
        background: rgba(255, 255, 255, 0.3);
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
      }
    }

    /* longFocusSpecimen */
    @media screen {
      .cbcn-longFocusSpecimen-screen h2 {
        text-align: left !important;
      }

      .cbcn-longFocusSpecimen-btn {
        transition: width 0.3s, height 0.3s, opacity 0.3s;
        opacity: 0.3;
        position: relative;
        z-index: 50;
        height: 100%;
        height: 11.35em;
      }
      .cbcn-longFocusSpecimen-img {
        width: 100%;
        height: 11.35em;
        border-radius: 12px;
        overflow: hidden;
      }
      .cbcn-longFocusSpecimen-p {
        margin-top: 1.5em !important;
        z-index: 10;
        position: relative;
      }
      .cbcn-longFocusSpecimen-switchBtn-list2 {
        margin-top: 1em;
        z-index: 1;
        position: relative;
        padding-right: 1em;
        transform: translateX(1em);
        background-image: linear-gradient(
          to left,
          black 0%,
          black 10%,
          transparent 50%
        );
        width: 100%;
      }
      .cbcn-longFocusSpecimen-swiper2 {
        margin-top: 2.5em;
      }
      .cbcn-longFocusSpecimen-swiper2 .swiper-slide-active {
        opacity: 1;
        z-index: 98;
      }
      .cbcn-longFocusSpecimen-inbtnListDiv {
        position: absolute;
        top: 0.75em;
        left: 50%;
        transform: translateX(-50%);
      }
      .cbcn-longFocusSpecimen-inbtnList {
        display: inline-flex !important;
        width: auto;
        gap: 0.1em;
        border-radius: 1.2em;
        background: rgba(33, 33, 33, 0.3);
        backdrop-filter: blur(15px);
        -webkit-backdrop-filter: blur(15px);
        justify-content: center;
        align-items: center;
        padding: 0.15em;
      }

      .cbcn-longFocusSpecimen-inbtn {
        padding: 0.05em 0.4em 0em;
        border-radius: 1.2em;
        text-align: center;
        cursor: pointer;
      }

      .cbcn-longFocusSpecimen-inbtn p {
        color: rgba(245, 245, 247, 1) !important;
      }

      .cbcn-longFocusSpecimen-inbtn.active {
        background: #fff;
      }

      .cbcn-longFocusSpecimen-inbtn.active p {
        color: #1d1d1f !important;
      }
      .cbcn-longFocusSpecimen-txt2 {
        margin-top: 2em;
        width: 100%;
      }

      .cbcn-longFocusSpecimen-txt2-content {
        position: relative;
        left: 0;
        width: 300%;
        transition: left 0s;
      }

      .cbcn-longFocusSpecimen-txt2-item {
        width: 33.3333%;
        gap: 1em;
      }
      .cbcn-longFocusSpecimen-txt2-item p {
        text-align: left!important;
      }
    }

    /* qualityEnhancement */
    @media screen {
      #cbcn-dom-container .cbcn-qualityEnhancement-screen .ct {
        text-align: left;
      }

      .cbcn-qualityEnhancement-swiper {
        margin-top: 2.5em;
        width: 100%;
        height: 21.5em;
        position: relative;
        overflow: hidden;
      }

      .cbcn-qualityEnhancement-img {
        width: 100%;
        height: 17.5em;
        border-radius: 0.4em;
        overflow: hidden;
        margin-bottom: 2em;
      }

      .cbcn-qualityEnhancement-p1 {
        width: 100%;
        margin-top: 19.5em;
        position: absolute;
      }

      .cbcn-qualityEnhancement-p2 {
        width: 100%;
        margin-top: 19.5em;
        margin-left: calc(100% + 1em);
        position: absolute;
        text-wrap: nowrap !important;
      }

      .cbcn-qualityEnhancement-p1 P,
      .cbcn-qualityEnhancement-p2 P {
        color: rgba(245, 245, 247, 0.6) !important;
      }

      .cbcn-qualityEnhancement-switchBtn-list {
        position: relative;
        z-index: 999;
        margin-top: -2em;
      }

      .cbcn-qualityEnhancement-txt2 {
        margin-top: 2.5em;
        width: 100%;
      }
    }

    /* sensor */
    @media screen {
      .cbcn-sensor-titletxt {
        padding: 0 1em;
      }
      .cbcn-sensor-txt2 {
        margin-top: 2.5em;
        width: 100%;
      }
      .cbcn-sensor-txt2 p {
        text-align: left!important;
      }

      .cbcn-sensor-txt2 .cbcn-wap-p19 {
        width: 100%;
        padding: 0 1em;
      }

      .cbcn-sensor-img {
        width: 100%;
        padding: 0 1em;
        height: 11.35em;
        margin: 2.5em auto 0;
        border-radius: 0.6em;
        overflow: hidden;
      }
      .cbcn-sensor-img canvas {
        border-radius: 0.6em;
        overflow: hidden;
      }

      .cbcn-sensor-param-div {
        width: 100%;
        padding: 0 1em;
        margin-top: 2.5em;
        gap: 1.75em;
        display: flex !important;
      }

      .cbcn-sensor-param-div .cbcn-param {
        padding-top: 1.35em;
        border-top: 1px solid #4d4d4d;
      }

      .cbcn-sensor-param-row1 {
        flex-wrap: wrap;
        gap: 1.5em 1em;
      }

      .cbcn-sensor-param-row1 svg {
        width: 15px;
        height: 15px;
        margin-left: 5px;
      }

      .cbcn-sensor-param-row1 .cbcn-param:nth-child(2n + 1) {
        min-width: 8em;
      }

      .cbcn-sensor-param-row2 {
        gap: 1.5em;
      }
    }

    /* nightView */
    @media screen {
      .cbcn-nightView-dragDiv {
        margin-top: 2em;
      }
      .cbcn-nightView-dragDiv .swiper-slide {
        position: relative;
        height: 11.35em;
      }
      .cbcn-nightView-dragDiv .cbcn-drag-desc {
        position: absolute;
        bottom: 0.75em;
        left: 0.75em;
        display: flex;
        padding: 0.25em 0.5em 0.05em 0.5em;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        border-radius: 1.2em;
        background: rgba(255, 255, 255, 0.3);
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
      }
      .cbcn-nightView-img {
        height: 11.35em;
        border-radius: 0.6em;
        overflow: hidden;
      }

      .cbcn-drag-img1 .cbcn-drag-desc,
      .cbcn-drag-img2 .cbcn-drag-desc {
        margin-top: 2em;
        width: 30%;
      }

      .cbcn-nightView-switchBtn-list {
        margin-top: 1em;
        z-index: 1;
        background-image: linear-gradient(
          to left,
          black 0%,
          black 50%,
          transparent 100%
        );
      }
    }

    /* videoRecording */
    @media screen {
      .cbcn-videoRecording-screen {
        padding: 4em 1em !important;
      }
      .cbcn-videoRecording-screen p,.cbcn-videoRecording-screen h2 {
        text-align: left !important;
      }
      .cbcn-videoRecording-videoDiv {
        width: 100%;
        position: relative;
      }

      .cbcn-videoRecording-img {
        width: 100%;
        height: 11.35em;
        border-radius: 0.6em;
        overflow: hidden;
        margin-top: 2.5em;
      }

      .cbcn-videoRecording-desc {
        margin-top: 2em;
        width: 100%;
      }
    }

    /* livePhoto */
    @media screen {
      .cbcn-livePhoto-swiper {
        margin: 2.5em 0 2em;
      }

      .cbcn-livePhoto-img {
        width: 100%;
        height: 17.5em;
        border-radius: 0.4em;
        overflow: hidden;
        margin-top: 2.5em;
      }

      .cbcn-livePhoto-txt2 {
        margin-top: 2.5em;
      }
    }

    /* sceneryMode */
    @media screen {
      .cbcn-sceneryMode-screen * {
        text-align: left !important;
      }
      .cbcn-sceneryMode-txt1 {
        width: 100%;
      }

      .cbcn-sceneryMode-swiper {
        margin-top: 2.5em;
        width: 100%;
        height: 7.9em;
        overflow: hidden;
      }

      .cbcn-sceneryMode-btnList {
        width: 100%;
        margin-top: 2.5em;
        position: relative;
      }
      .cbcn-sceneryMode-btnListDiv {
        width: 300%;
        position: relative;
        left: 0;
        transition: left 0s;
      }

      .cbcn-sceneryMode-btn {
        width: 100%;
        opacity: 0;
        text-align: center;
      }

      .cbcn-sceneryMode-btn.active {
        opacity: 1;
      }

      .cbcn-sceneryMode-txt2 {
        width: 100%;
        margin-top: 0.5em;
      }

      .cbcn-sceneryMode-txt2-content {
        width: 300%;
        position: relative;
        left: 0;
        transition: left 0s;
      }

      .cbcn-sceneryMode-txt2-content p {
        width: 100%;
      }

      .cbcn-sceneryMode-switchBtn-list {
        margin-top: 1.75em;
        width: 100%;
        position: relative;
      }

      #cbcn-dom-container .cbcn-sceneryMode-txt2-content p.cbcn-hide {
        opacity: 0;
      }
    }

    /* humanity */
    @media screen {
      .cbcn-humanity-txt1 {
        width: 100%;
      }

      .cbcn-humanity-swiper {
        margin-top: 2.5em;
        width: 100%;
        overflow: hidden;
      }

      .cbcn-humanity-img {
        width: 100%;
        height: 11.35em;
        border-radius: 0.6em;
        overflow: hidden;
        margin-bottom: 2.5em;
      }

      .cbcn-humanity-swiper .swiper-slide p {
        opacity: 0;
      }

      .cbcn-humanity-swiper .swiper-slide-active p {
        opacity: 1;
      }

      .cbcn-humanity-switchBtn-list {
        margin-top: 1em;
      }
    }

    /* imageChip */
    @media screen {
      .cbcn-imageChip-imgDiv {
        margin: 2.5em auto 3.5em;
        width: 14em;
        height: 14em;
        position: relative;
      }

      #cbcn-dom-container .cbcn-imageChip-screen .ct {
        text-align: left;
      }
      .cbcn-imageChip-p1 {
        position: absolute;
        bottom: -3.5em;
        right: 0;
      }
      .cbcn-imageChip-txt2 {
        width: 100%;
        margin-top: 1.75em;
      }
      .cbcn-imageChip-txt3 {
        margin-top: 2.5em;
        display: flex !important;
        flex-direction: column;
        gap: 1em;
      }
      .cbcn-imageChip-txt3 .cbcn-param {
        padding-top: 1em;
        border-top: 1px solid #4d4d4d;
      }

      .cbcn-imageChip-desc {
        width: 100%;
      }

      .cbcn-imageChip-desc p {
        color: rgba(245, 245, 247, 0.6) !important;
      }

      .cbcn-imageChip-paramDiv {
        margin-top: 2.5em;
        gap: 1.5em 2.5em;
        width: 100%;
        flex-wrap: wrap;
      }

      .cbcn-imageChip-paramDiv .cbcn-param:nth-of-type(2n + 1) {
        min-width: 6em;
        flex-shrink: 0;
      }
    }
    /* stageVideo */
    @media screen {
      .cbcn-stageVideo-info {
        margin-top: 2em;
      }
      .cbcn-stageVideo-info p:nth-child(2) {
        margin-top: 1em;
      }
    }
    /* backlightPortrait */
    @media screen {
      .cbcn-backlightPortrait-screen {
        padding: 4em 0;
      }

      .cbcn-backlightPortrait-txt1 {
        width: 100%;
        gap: 1.75em;
      }

      .cbcn-backlightPortrait-desc {
        width: 100%;
      }

      .cbcn-backlightPortrait-img {
        width: 16.75em;
        height: 14.85em;
        margin-top: 2em;
        position: relative;
        display: flex;
        align-self: center;
        border-radius: 0.4em;
        overflow: hidden;
      }

      .cbcn-backlightPortrait-svg {
        width: 17.5em;
        height: 13.85em;
        left: 0;
      }
    }

    /* HDR */
    @media screen {
      .cbcn-HDR-desc {
        text-wrap: wrap;
      }

      .cbcn-HDR-dragDiv {
        margin-top: 2.5em;
        width: 100%;
        height: 11.35em;
        overflow: hidden;
        position: relative;
      }

      .cbcn-HDR-img {
        width: 100%;
        height: 11.35em;
        border-radius: 0.4em;
        overflow: hidden;
      }
    }

    /* highRefreshRateVideo */
    @media screen {
      .cbcn-highRefreshRateVideo-screen {
        padding: 4em 0;
      }

      .cbcn-highRefreshRateVideo-desc {
        margin-top: 2.5em;
      }

      .cbcn-highRefreshRateVideo-img {
        margin-top: 2.5em;
      }
    }

    /* fullFocusVideo */
    @media screen {
      .cbcn-fullFocusVideo-screen {
        padding: 4em 1em !important;
        width: 100%;
      }

      .cbcn-fullFocusVideo-img-div {
        margin-top: 2.5em;
        width: 100%;
        position: relative;
        text-wrap: nowrap;
      }

      .cbcn-fullFocusVideo-img {
        width: 100%;
        height: 11.35em;
        border-radius: 0.4em;
        overflow: hidden;
        margin-top: 2.5em;
      }
    }

    /* ultraClearImages */
    @media screen {
      .cbcn-ultraClearImages-img {
        width: 100%;
        height: 22.5em;
        border-radius: 0.4em;
        overflow: hidden;
      }
      .cbcn-ultraClearImages-swiper {
        margin-top: 2em;
      }
      .cbcn-ultraClearImages-switchBtn-list {
        margin-top: 2em;
      }

      .cbcn-ultraClearImages-swiper .cbcn-drag-desc {
        position: absolute;
        bottom: 0.75em;
        left: 0.75em;
        display: flex;
        padding: 0.25em 0.5em 0.05em 0.5em;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        border-radius: 1.2em;
        background: rgba(255, 255, 255, 0.3);
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
      }
    }
    /* fullFocusPortrait */
    @media screen {
      .cbcn-fullFocusPortrait-screen {
        padding: 4em 0;
      }
      .cbcn-fullFocusPortrait-screen * {
        text-align: left !important;
      }

      .cbcn-fullFocusPortrait-InfoDiv {
        margin-top: 2.5em;
        padding: 0 1em;
      }

      .cbcn-fullFocusPortrait-Info {
        width: 100%;
      }

      .cbcn-fullFocusPortrait-image {
        margin-bottom: 2.5em;
        width: 100%;
        height: 15em;
        border-radius: 0.4em;
        overflow: hidden;
      }
      .cbcn-fullFocusPortrait-Info p:nth-child(3) {
        margin-top: 1em !important;
      }
      .cbcn-fullFocusPortrait-switchBtn-list {
        margin-top: 1em;
        padding: 0 1em;
      }
    }

    /* AIEraser */
    @media screen {
      .cbcn-AIEraser-content {
        gap: 2.5em;
        align-items: center;
      }

      .cbcn-AIEraser-video {
        width: 8.85em;
        height: 18.8em;
      }
    }

    /* performance */
    @media screen {
      .cbcn-performance-screen {
        padding: 4em 0;
      }

      .cbcn-performance-div {
        display: flex;
        justify-content: center;
        width: 100%;
      }

      .cbcn-performance-txt1 p:nth-last-child(1) {
        margin-top: 35px;
      }

      .cbcn-performance-txt1 p {
        background: linear-gradient(92deg, #f5f5f7 17.22%, #2c2c2c 98.95%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
      }
      .cbcn-performance-txt1 .ct {
        text-align: center!important;
      }

      .cbcn-performance-img {
        width: 100%;
        height: 7em;
      }
    }

    /* chip */
    @media screen {
      #cbcn-dom-container .cbcn-chip-txt1 .ct {
        text-align: left;
      }

      .cbcn-chip-desc p:nth-child(2) {
        margin-top: 1.5em;
      }

      .cbcn-chip-paramDiv {
        display: flex !important;
        gap: 1.75em 0;
        flex-wrap: wrap;
      }
      .cbcn-chip-paramDiv .cbcn-param {
        padding-top: 1em;
        border-top: 1px solid #4d4d4d;
        width: 100%;
      }

      .cbcn-chip-img {
        width: 100%;
        height: 19.75em;
        margin-bottom: -3.2em;
      }
      .cbcn-chip-paramDiv svg {
        transform: translateY(0.1em);
      }
    }

    /* battery */
    @media screen {
      #cbcn-dom-container .cbcn-battery-txt1 .ct {
        text-align: left;
      }
      .cbcn-battery-iconDiv {
        margin-top: 2.5em;
        display: flex;
        align-items: center;
        flex-direction: row;
        justify-content: center;
        gap: 1em;
      }

      .cbcn-battery-iconDiv img {
        width: 2.5em;
        height: 2.5em;
      }

      .cbcn-battery-img {
        width: 100%;
        height: 7.7em;
        margin-top: 2.5em;
      }

      .cbcn-battery-remark {
        position: relative;
      }

      .cbcn-battery-remark p {
        margin-top: 0.5em;
        text-align: left !important;
      }

      .cbcn-battery-param-div {
        margin-top: 2.5em;
        gap: 3em;
      }

      .cbcn-battery-param-row {
        gap: 3em;
      }

      .cbcn-battery-param-row svg {
        transform: translateY(0.1em);
        width: 1.2em;
      }

      .cbcn-battery-param-div .cbcn-param {
        padding: 0 !important;
        width: 100%;
      }

      .cbcn-battery-param-item .cbcn-battery-hr {
        width: 100%;
        height: 0.05em;
        background: #535353;
        margin: 0.75em 0;
      }

      .cbcn-cbcn-battery-txt1 {
        height: 100%;
        min-width: 8.5em !important;
      }

      .cbcn-cbcn-battery-txt2 {
        height: 100%;
        min-width: 8.5em !important;
      }

      .cbcn-battery-param-row:nth-last-child(1) {
        justify-content: space-between;
        gap: 1.75em;
      }
    }

    /* display */
    @media screen {
      #cbcn-dom-container .cbcn-display-txt1 .ct {
        text-align: left;
      }
      .cbcn-display-icon2 {
        height: 2.85em;
        width: 100%;
      }

      .cbcn-display-img {
        width: 100%;
        height: 9.3em;
        margin-top: 2.5em;
        position: relative;
      }

      .cbcn-display-paramDiv {
        display: flex;
        /* flex-direction: column; */
        margin-top: 2.5em;
        gap: 1.5em 0em;
        flex-wrap: wrap;
      }

      .cbcn-display-paramDiv .cbcn-param {
        min-width: 8em;
        padding: 1.35em 0 1.25em;
        border-top: 1px solid #4d4d4d;
      }
      .cbcn-displayicon-img1 {
        height: 1.75em;
        width: 8em;
      }
    }

    /* eyeProtection */
    @media screen {
      .cbcn-eyeProtection-screen {
        padding: 4em 0;
      }

      .cbcn-eyeProtection-img {
        margin-top: 2em;
        height: 20em;
      }

      .cbcn-eyeProtection-txt2 {
        position: relative;
        z-index: 9;
      }

      .cbcn-eyeProtection-txt2-item {
        backdrop-filter: blur(17.5px);
        -webkit-backdrop-filter: blur(17.5px);
        display: flex;
        padding: 1em 1em;
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        gap: 0.8em;
        background: rgba(229, 229, 229, 0.05);
      }

      .cbcn-eyeProtection-txt2-line {
        width: 100%;
        height: 1px;
        background-color: #535353;
      }
      .cbcn-eyeProtection-txt2 p, .cbcn-eyeProtection-txt2 h2 {
        color: rgba(29, 29, 31, 1) !important;
      }
      .cbcn-eyeProtection-item {
        min-width: 8em;
        gap: 1em;
        display: flex;
        flex-direction: column;
        padding: 1.35em 0 1.25em;
        border-top: 1px solid rgba(77, 77, 77, 0.7);
      }
      .cbcn-eyeProtection-iconItem {
        width: 100%;
        border-radius: 0.2848em;
        flex-direction: row;
        border: 0.911px solid rgba(223, 223, 223, 0);
        background: linear-gradient(
          314deg,
          rgba(87, 87, 87, 0.1) 6.81%,
          rgba(87, 87, 87, 0.05) 81.91%
        );
        padding: 0.6em 0.8em 0.6em 0.6em;
        align-items: center;
        gap: 0.75em;
        display: flex;
      }
      .cbcn-eyeProtection-icon {
        width: 4em;
        height: 1.8792em;
      }
      .cbcn-eyeProtection-item P:nth-child(1) {
        color: rgba(29, 29, 31, 1) !important;
      }

      .cbcn-eyeProtection-txt3-p p:nth-child(2) {
        margin-top: 0.25em;
      }

      .cbcn-eyeProtection-txt2-item1 {
        gap: 1.75em;
      }

      .cbcn-eyeProtection-txt2-item2 {
        margin-top: 1.75em;
        margin-bottom: 1.75em;
        gap: 1em;
      }

      .cbcn-eyeProtection-txt2-item {
        border-left: 1px solid rgba(153, 153, 153, 0.3);
        border-right: 1px solid rgba(153, 153, 153, 0.3);
      }

      .cbcn-eyeProtection-txt2-item1 p {
        color: #1d1d1d !important;
      }

      .cbcn-eyeProtection-txt2 .cbcn-param .txt,
      #cbcn-dom-container .cbcn-eyeProtection-txt2 p.wt.grey {
        color: #1d1d1d !important;
        opacity: 0.6;
      }
      .cbcn-eyeProtection-txt2-p1 {
        margin: 2em 0;
      }
    }

    /* signal */
    @media screen {
      #cbcn-dom-container .cbcn-signal-screen p.ct {
        text-align: left;
      }
      .cbcn-signal-screen {
        padding: 4em 0;
        background: #000 !important;
      }

      .cbcn-signal-div {
        width: 100%;
        margin-top: 2.5em;
        position: relative;
      }

      .cbcn-signal-img {
        width: 100vw;
        height: 15.7em;
        border-radius: 0.4em;
        overflow: hidden;
        position: relative;
        left: -1em;
      }

      .cbcn-signal-img-icon {
        position: absolute;
        bottom: 16px;
        right: 16px;
        width: 1.8em;
        height: 1.8em;
        z-index: 9;
        transition: transform 0.3s;
      }

      .cbcn-signal-txt-swiperDiv {
        position: absolute;
        top: 12.5em;
        left: 50%;
        transform: translateX(-50%);
        width: 12em;
        overflow: hidden;
        z-index: 8;
      }

      .cbcn-signal-txt-swiper {
        padding: 1em;
        width: 100%;
      }

      .cbcn-signal-txt-swiperDiv {
        display: flex;
        align-items: center;
      }

      .cbcn-signal-txt-swiper1 .swiper-wrapper {
        gap: 0.5em;
      }

      .cbcn-signal-txt-swiper2 .swiper-wrapper {
        gap: 0.3em;
      }

      .cbcn-signal-txt-swiper p {
        display: inline;
      }

      .cbcn-signal-txt-switchBtn-list {
        position: absolute;
        top: 13.55em;
        left: 0;
        z-index: 9;
        justify-content: space-between;
        width: 100%;
        height: 2em;
      }

      .cbcn-signal-desc {
        width: 100%;
        height: 10.7em;
        margin-top: 2.5em;
      }
    }

    /* antiFall */
    @media screen {
      .cbcn-antiFall-screen .safeRow {
        padding: 0 !important;
      }

      .cbcn-antiFall-titletxt {
        padding: 0 1em;
      }

      .cbcn-antiFall-img {
        margin-top: 2.5em;
        width: 100%;
        height: 8.05em;
        position: relative;
      }
    }

    /* antiWater */
    @media screen {
      .cbcn-antiWater-screen {
        padding: 4em 0;
      }
      .cbcn-antiWater-txt1 p {
        position: relative;
        z-index: 2;
      }
      .cbcn-antiWater-img {
        width: 14.95em;
        height: 24.85em;
        margin: -2.5em auto;
      }
    }

    /* os */
    @media screen {
      .cbcn-os-screen {
        padding: 0 !important;
      }
      .cbcn-os-img {
        width: 100vw;
        height: 25.55em;
      }
      .cbcn-os-imgDiv {
        width: 100%;
        display: block;
        position: relative;
      }

      .cbcn-os-content {
        bottom: 2.5em;
        position: absolute;
        left: 0;
        right: 0;
        gap: 5.17em;
        margin: auto;
        justify-content: center;
        align-items: center;
      }

      .cbcn-os-content p {
        text-align: center;
      }
      .cbcn-os-txt {
        width: 15.3em;
      }
      .cbcn-os-btn {
        padding: 0.5em 1em 0.3em;
        background: #fff;
        border-radius: 1.2em;
        text-decoration: none;
        /* cursor: pointer; */
      }
      .cbcn-os-btn p {
        color: #1d1d1f !important;
      }
      .cbcn-os-icon {
        position: absolute;
        bottom: 1em;
        right: 1em;
        width: 1.6em;
        height: 1.85em;
      }
    }
    /* gemini */
    @media screen {
      .cbcn-gemini-img {
        margin-top: 2.5em;
        height: 21.3em;
        width: 16.8em;
      }
      .cbcn-gemini-Aiicon {
        position: absolute;
        right: 1em;
        bottom: 0;
        width: 1.6em;
        height: 1.85em;
      }
    }

    /* AI */
    @media screen {
      .cbcn-AI-list {
        gap: 1em;
      }
      .cbcn-AI-item {
        border-radius: 0.6em;
        background: #1d1d1d;
        display: flex;
        padding: 1.5em 1em 0em 1em;
        flex-direction: column;
        align-items: flex-start;
        gap: 2.5em;
        align-self: stretch;
        justify-content: center;
        align-items: flex-start;
      }
      .cbcn-AI-img1 {
        width: 11em;
        height: 23.32155em;
        margin-bottom: 1.5em;
        display: flex;
        align-self: center;
      }
      .cbcn-AI-img2 {
        width: 11em;
        height: 23.32155em;
        margin-bottom: 1.5em;
        display: flex;
        align-self: center;
      }
      .cbcn-AI-img3 {
        width: 11em;
        height: 23.32155em;
        margin-bottom: 1.5em;
        display: flex;
        align-self: center;
      }
      .cbcn-AI-img4 {
        width: 11em;
        height: 23.32155em;
        margin-bottom: 1.5em;
        display: flex;
        align-self: center;
      }
      .cbcn-ai-desc p:nth-last-child(1) {
        color: rgba(255, 255, 255, 0.6) !important;
      }

      .cbcn-AI-item-title {
        position: relative;
        display: inline-block;
      }
      .cbcn-AI-logo {
        position: relative;
        text-align: right;
      }
      .cbcn-AI-logo-img {
        width: 4.6em;
        height: 0.9em;
      }
    }

    /* securityChip */
    @media screen {
      .cbcn-securityChip-screen {
        padding: 4em 0;
      }
      .cbcn-securityChip-img {
        width: 100%;
        height: 17.95em;
        margin-top: 1.68em;
      }
      .cbcn-securityChip-Aiicon {
        position: absolute;
        right: 1em;
        bottom: 4em;
        width: 1.6em;
        height: 1.85em;
      }
    }

    /* secureDataPurge */
    @media screen {
      .cbcn-secureDataPurge-img {
        width: 8.76735em;
        height: 18.619em;
        margin: 2.5em auto 0;
      }
      .cbcn-secureDataPurge-Aiicon {
        position: absolute;
        right: 1em;
        bottom: 4em;
        width: 1.6em;
        height: 1.85em;
      }
    }

    /* remark */
    @media screen {
      .cbcn-remark-screen ul,
      .cbcn-remark-screen ol {
        padding-inline-start: 2em;
      }

      .cbcn-remark-screen ol li {
        list-style: decimal;
        color: rgba(245, 245, 247, 0.4);
        line-height: 150%;
      }
    }
  }
}