@media screen and (max-width: 980px) {
  /* kv  */
  @media screen {
    .cbcn-kv-screen {
      width: 100%;
      height: calc(37.5 / 18.75 * 100vw);
      position: relative;
      display: block;
    }
  }

  /* navigation */
  @media screen {
    .cbcn-navigation-cardList {
      gap: 1em;
    }

    .cbcn-navigation-card {
      width: 100%;
      height: 100%;
      position: relative;
      border-radius: 1em;
      overflow: hidden;
      background: linear-gradient(200deg, #FAFAFA -7.62%, #F2F2F2 96.68%);
    }

    .cbcn-navigation-img {
      height: 27.5em;
      width: 100%;
    }

    .cbcn-navigation-Text {
      position: absolute;
      width: 100%;
      top: 1.5em;
      padding: 0 1em;
      gap: 0.5em;
      justify-content: space-between;
      align-items: flex-end;
    }

    .cbcn-navigation-txt {
      gap: 0.75em;
    }

    .cbcn-navigation-icon {
      width: 1.8em;
      height: 1.8em;
      position: absolute;
      bottom: 0.8em;
      right: 0.8em;
    }

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

    .cbcn-navigation-iconDiv:nth-child(1) {
      margin-bottom: 0.4em;
    }

    .cbcn-navigation-icon1 {
      width: 2.1574em;
      height: 2.19995em;
    }

    .cbcn-navigation-icon2 {
      width: 2.04855em;
      height: 2.5779em;
    }

    .cbcn-navigation-AIicon {
      position: absolute;
      width: 2em;
      height: 2em;
      bottom: 0.8em;
      left: 0.8em;
    }
  }

  /* design */
  @media screen {
    .cbcn-design-content {
      padding: 4em 5.3vw;
    }

    .cbcn-design-img {
      height: 25em;
      border-radius: 1em;
      width: 100%;
      overflow: hidden;
      margin-top: 1.5em;
    }
  }

  /* color */
  @media screen {
    .cbcn-color-screen {
      padding: 4em 5.3vw;
      height: 100%;
    }

    .cbcn-color-swiper .swiper-slide {
      gap: 2em;
      justify-content: space-between;
      height: auto;
      margin-bottom: 4em;
    }

    .cbcn-color-txt {
      align-items: center;
      justify-content: center;
      gap: 2em;
      height: 100%;
      flex: 1 1 auto;
    }

    .cbcn-color-txt {
      opacity: 0;
      text-align: center;
    }

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

    .cbcn-color-txt p {
      text-align: center;
    }

    .cbcn-color-content {
      bottom: 0;
    }

    .cbcn-color-btnListDiv {
      bottom: 3em;
      z-index: 99;
      display: inline-flex;
    }

    .cbcn-color-btnList {
      display: inline-flex !important;
      width: auto;
      padding: 0.45em;
      align-items: center;
      gap: 0.45em;
      border-radius: 2.25em;
      background: rgba(255, 255, 255, 0.15);
    }

    .cbcn-color-img {
      width: 100%;
      height: 19.55em;
      border-radius: 1.5em;
      overflow: hidden;
    }

    .cbcn-color-btn {
      width: 1.8em;
      height: 1.8em;
      position: relative;
    }

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

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

    .cbcn-color-btn.index0 .cbcn-color-circle {
      stroke: #e9c6bb;
    }

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

    .cbcn-color-btn.index2 .cbcn-color-circle {
      stroke: #794881;
    }

    .cbcn-color-btn.index3 .cbcn-color-circle {
      stroke: #46c5bc;
    }

    .cbcn-color-btn.active .cbcn-color-circle {
      stroke-dashoffset: 0;
      transition: stroke-dashoffset 2.15s ease-out;
    }
  }

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

    .cbcn-slim-content {
      padding: 0 !important;
    }

    .cbcn-slim-videoDiv {
      height: 5.4em;
      width: 100vw;
      margin: 2em 0;
    }

    .cbcn-slim-txt1 {
      padding: 0 5.3vw;
    }

    .cbcn-slim-param {
      gap: 2em;
      padding: 0 5.3vw;
    }

    .cbcn-slim-param1 {
      /* background: linear-gradient(
        96deg,
        #a8756b 6.15%,
        #c8a9a3 76.17%,
        #e9d8d4 143.29%
      ) !important;
      background-clip: text !important;
      -webkit-background-clip: text !important;
      -webkit-text-fill-color: transparent !important; */
    }

    .cbcn-slim-param2 {
      /* background: linear-gradient(
        108deg,
        #a8756b -1.18%,
        #c8a9a3 40.67%,
        #e9d8d4 99.88%
      ) !important;
      background-clip: text !important;
      -webkit-background-clip: text !important;
      -webkit-text-fill-color: transparent !important; */
    }
  }

  /* display */
  @media screen {
    .cbcn-display-screen.wt {
      background: linear-gradient(180deg, #FFF 51.56%, #C7F9F8 139.92%);
    }

    .cbcn-display-content {
      padding: 0 !important;
    }

    .cbcn-display-txt1,
    .cbcn-display-param {
      padding: 0 5.3vw;
    }

    .cbcn-display-img {
      height: 11.9em;
      width: 100vw;
      margin: 2.5em 0 1.5em 0;
    }

    .cbcn-display-param {
      flex-wrap: wrap;
      justify-content: space-between;
      gap: 1.2em;
    }

    .cbcn-display-param .cbcn-param {
      border-top: 1px solid #b3b3b3;
      padding-top: 1.5em;
    }


    .cbcn-display-icon {
      width: 3.15em;
      height: 1.3em;
    }

    .cbcn-display-param .cbcn-param {
      width: 41vw;
    }

    .cbcn-display-param .cbcn-param .param {
      white-space: normal !important;
    }
  }

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

    .cbcn-performance-box {
      margin-top: 1.5em;
    }

    .cbcn-performance-content {
      position: relative;
    }

    .cbcn-performance-h3 {
      color: rgba(255, 255, 255, 0.65) !important;
      font-family: "vivoSans-Bold" !important;
      font-size: 1.4em !important;
    }

    .cbcn-performance-box {
      z-index: 4;
      position: relative;
    }

    .cbcn-performance-box {
      margin-top: 1.65em;
    }

    .cbcn-performance-shadow {
      height: 150%;
      width: 100vw;
      position: absolute;
      top: 0;
      z-index: 5;
    }

    .cbcn-performance-p {
      text-align: center;
      font-size: 1.85em;
      text-shadow: 0px 0px 20px rgba(121, 255, 200, 0.50), 0px 0px 10px rgba(184, 238, 216, 0.50), 0px 0px 10px rgba(184, 238, 216, 0.50);
      text-transform: uppercase;
    }
  }

  /* battery */
  @media screen {
    .cbcn-battery-txtDiv {
      padding: 4em 5.3vw;
    }

    .cbcn-battery-swiper .swiper-slide {
      height: auto;
      justify-content: space-between;
      gap: 4em;
      position: relative;
    }

    .cbcn-battery-video {
      width: 100%;
      height: 10em;
      margin-top: 4em;
    }

    .cbcn-battery-6000 {
      gap: 2em;
    }

    .cbcn-battery-flexRow {
      flex-wrap: wrap;
      gap: 1em;
    }

    .cbcn-battery-param {
      width: 41vw;
      padding-top: 0.75em;
      border-top: 1px solid #4d4d4d;
    }

    .cbcn-battery-paramWidth {
      width: 100%;
    }

    .cbcn-battery-img {
      height: 8.45em;
      width: 100%;
      position: relative;
      margin-bottom: 1.5em;
    }

    .cbcn-battery-title {
      top: 0;
      width: 100%;
    }

    .cbcn-battery-title p {
      background: #FFF;
      background-clip: text;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      font-size: 4em;
      font-weight: 700;
      line-height: 120%;
      text-align: center;
    }

    .cbcn-battery-switchBtn-list {
      margin-top: 1.5em;
    }

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

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

    .cbcn-battery-title1 {
      justify-content: center;
      align-items: baseline;
    }

    .cbcn-battery-P1 {
      font-size: 4em !important;
      font-family: "vivoSans-Bold" !important;
    }

    .cbcn-battery-P2 {
      font-size: 1.5em !important;
      font-family: "vivoSans-ExtraBold" !important;
      padding-bottom: -10em;
    }

    .cbcn-battery-txt1 {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
    }

    .cbcn-battery-wrapper {
      gap: 6em;
    }

    .cbcn-battery-video {
      height: 8.45em;
      width: 100%;
    }

    .cbcn-battery-Divimg {
      display: block;
    }
  }

  /* antiFall */
  @media screen {
    .cbcn-antiFall-screen {
      position: relative;
      height: 100%;
      padding: 0 !important;
    }

    .cbcn-antiFall-content {
      padding: 0 0 4em 0 !important;
      position: relative;
    }

    .cbcn-antiFall-txt1,
    .cbcn-antiFall-param {
      position: relative;
      z-index: 2;
    }

    .cbcn-antiFall-txt1 {
      padding: 4em 5.3vw 0;
      position: absolute;
      top: 0em;
    }

    .cbcn-antiFall-txt1 h3,
    .cbcn-antiFall-txt1 p {
      color: rgba(0, 0, 0, 0.9) !important;
    }

    .cbcn-antiFall-txt1 .cbcn-p1 {
      color: rgba(0, 0, 0, 0.6) !important;
    }

    .cbcn-antiFall-imgDiv {
      height: 50em;
      width: 100vw;
    }

    .cbcn-antiFall-img {
      height: 50em;
      width: 100vw;
    }

    .cbcn-antiFall-paramBox {
      padding: 0 5.3vw;
      flex-wrap: wrap;
      justify-content: space-between;
      gap: 1.5em 0;
    }

    .cbcn-antiFall-param .param {
      border-top: 1px solid #b3b3b3;
      padding-top: 0.8em;
    }

    .cbcn-antiFall-param {
      width: 41vw;
    }

    .cbcn-antiFall-iconParam1 {
      border-top: 1px solid #b3b3b3;
      padding-top: 0.8em;
      align-items: center;
      width: 100%;
      gap: 1em;
    }

    .cbcn-antiFall-iconParam2 {
      width: 8em;
      border-top: 1px solid #b3b3b3;
      padding-top: 0.8em;
    }

    .cbcn-antiFall-icon1 {
      width: 2.26475em;
      height: 2.85em;
    }

    .cbcn-antiFall-icon2 {
      width: 100%;
      height: 2.8em;
    }

    .cbcn-antiFall-color {
      color: rgba(255, 255, 255, 0.5) !important;
    }
  }

  /* waterproof */
  @media screen {
    .cbcn-waterproof-paramBox {
      margin-top: 3em;
      padding: 0 5.3vw;
      margin-bottom: 2em;
    }

    .cbcn-waterproof-param {
      justify-content: space-between;
      width: 100%;
      gap: 0.75em;
    }

    .cbcn-waterproof-param .param {
      border-top: 1px solid #b3b3b3;
      padding-top: 0.8em;
      width: 41vw;
    }

    .cbcn-waterproof-imgDiv {
      width: 100vw;
      height: 12.75em;
    }
  }

  /* photography */
  @media screen {
    .cbcn-photography-screen {
      padding: 4em 5.3vw;
    }

    .cbcn-photography-box {
      margin-top: 1.5em;
    }

    .cbcn-photography-content {
      position: relative;
    }

    .cbcn-photography-h3 {
      z-index: 99;
      position: relative;
      font-family: "vivoSans-Bold" !important;
    }

    .cbcn-photography-box {
      z-index: 4;
      position: relative;
    }

    .cbcn-photography-box {
      margin-top: 1.65em;
    }

    .cbcn-photography-shadow {
      height: 150%;
      width: 100vw;
      position: absolute;
      top: 0;
      z-index: 5;
    }

    .cbcn-photography-p {
      text-align: center;
      font-size: 2.25em;
      text-shadow: 0px 0px 20px rgba(121, 255, 200, 0.50), 0px 0px 10px rgba(184, 238, 216, 0.50), 0px 0px 10px rgba(184, 238, 216, 0.50);
      text-transform: uppercase;
    }
  }

  /* rearCamera */
  @media screen {
    .cbcn-rearCamera-screen {
      padding-top: 4em;
      display: flex;
      height: 100vh;
      justify-content: space-between;
    }

    .cbcn-rearCamera-title {
      padding: 0 1em 3em;
    }

    .cbcn-rearCamera-div {
      width: 100%;
      height: 21.3em;
      position: relative;
    }

    .cbcn-rearCamera-img1 {
      position: absolute;
      width: 8em;
      height: 100%;
      right: 0;
      bottom: 0;
      overflow: hidden;
      z-index: 2;
    }

    .cbcn-rearCamera-img2 {
      position: absolute;
      bottom: 0;
      right: 5em;
      width: 8em;
      height: calc(100% - 3em);
      margin-bottom: -12em;
      opacity: 0;
    }

    .cbcn-rearCamera-desc {
      gap: 0.4em;
    }

    .cbcn-rearCamera-descText {
      padding-bottom: 4px;
      font-size: 1em !important;
      font-family: "vivoSans-Bold" !important;
    }

    .cbcn-rearCamera-desc .cbcn-p3 {
      line-height: 120%;
    }

    .cbcn-rearCamera-param {
      width: 9em;
      position: absolute;
      left: 5.3vw;
      z-index: 3;
    }

    .cbcn-rearCamera-param4 {
      top: 12em;
    }

    .cbcn-rearCamera-param3 {
      top: 6.7em;
    }

    .cbcn-rearCamera-param2 {
      top: -0.5em;
    }

    .cbcn-rearCamera-param1 {
      top: 0.9em;
      opacity: 0;
    }

    .cbcn-rearCamera-line {
      z-index: 3;
      position: absolute;
    }

    .cbcn-rearCamera-line4 {
      width: 13em;
      height: 1em;
      top: -1em;
    }

    .cbcn-rearCamera-line3 {
      left: 0em;
      width: 12.725em;
      height: 0.1em;
      top: -0.5em;
    }

    .cbcn-rearCamera-line2 {
      width: 13.2em;
      height: 2.7em;
      top: -0.5em;
      left: 0em;
    }

    .cbcn-rearCamera-line1 {
      width: 8.5em;
      height: 0.1em;
      bottom: -0.5em;
      left: 0em;
    }
  }

  /* night */
  @media screen {
    .cbcn-night-screen {
      background-color: #ffffff !important;
    }

    .cbcn-night-img {
      height: 12.6em;
      margin-top: 2.5em;
      border-radius: 0.6em;
      overflow: hidden;
    }
  }

  /* auraLight */
  @media screen {
    .cbcn-auraLight-swiper {
      margin-top: 2.5em;
      height: auto;
    }

    .cbcn-auraLight-img {
      height: 22.35em;
      width: 100%;
      border-radius: 0.6em;
      overflow: hidden;
    }

    .cbcn-auraLight-btn {
      position: absolute;
      bottom: 0.75em;
      left: 0.75em;
      padding: 0.25em 1em;
      border-radius: 0.4em;
      background: rgba(255, 255, 255, 0.1);
      backdrop-filter: blur(25px);
      overflow: hidden;
    }

    .cbcn-auraLight-switchBtn-list {
      margin-top: 1.5em;
    }

    .cbcn-auraLight-txt1 sup {
      background: #bf9a93;
      background-clip: text;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
  }

  /* 3DStudio */
  @media screen {
    .cbcn-3DStudio-swiper {
      margin-top: 2.5em;
    }

    .cbcn-3DStudio-img {
      height: 22.35em;
      width: 100%;
      border-radius: 0.6em;
      overflow: hidden;
    }

    .cbcn-3DStudio-btn {
      position: absolute;
      bottom: 0.75em;
      left: 0.75em;
      padding: 0.25em 1em;
      border-radius: 0.4em;
      background: rgba(255, 255, 255, 0.1);
      backdrop-filter: blur(25px);
      overflow: hidden;
    }

    .cbcn-3DStudio-switchBtn-list {
      margin-top: 1.5em;
    }
  }

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

    .cbcn-wideAngleLens-img {
      height: 13em;
      width: 100vw;
      margin-top: 2.5em;
    }
  }

  /* Selfie */
  @media screen {
    .cbcn-Selfie-img {
      height: 12.6em;
      border-radius: 0.6em;
      overflow: hidden;
      width: 100%;
      margin-top: 2.5em;
    }
  }

  /* aiImage2 */
  @media screen {
    .cbcn-aiImage2-screen {
      background-color: #f5f5f5 !important;
      padding: 4em 5.3vw;
    }

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

    .cbcn-aiImage2-icon {
      width: 1.75em;
      height: 1.62035em;
    }

    .cbcn-aiImage2-title {
      display: none;
    }

    .cbcn-aiImage2-title.active {
      display: flex;
    }

    .cbcn-aiImage2-title2 {
      display: none;
    }

    .cbcn-aiImage2-title2.active {
      display: flex;
    }

    .cbcn-aiImage2-video {
      width: 12em;
      height: 25.43075em;
      position: relative;
      display: flex;
      justify-content: center;
    }

    .cbcn-aiImage2-img {
      width: 12em;
      height: 25.5em;
      display: block !important;
      overflow: hidden;
    }

    .cbcn-aiImage2-switchBtn-list {
      margin-top: 1.5em;
    }

    /* 小语种注意：这里轮播文字高度不统一，做小语种时候要注意调整，以防文本压到图片 */
    .cbcn-aiImage2-content {
      height: 9em;
    }
  }

  /* flagship */
  @media screen {
    .cbcn-flagship-screen {
      padding: 4em 5.3vw;
    }

    .cbcn-flagship-box {
      margin-top: 1.5em;
    }

    .cbcn-flagship-content {
      position: relative;
    }

    .cbcn-flagship-h3 {
      z-index: 99;
      position: relative;
      font-family: "vivoSans-Bold";
    }

    .cbcn-flagship-box {
      z-index: 4;
      position: relative;
    }

    .cbcn-flagship-box {
      margin-top: 1.65em;
    }

    .cbcn-flagship-shadow {
      height: 150%;
      width: 100vw;
      position: absolute;
      top: 0;
      z-index: 5;
    }

    .cbcn-flagship-p {
      text-align: center;
      font-size: 1.25em;
      text-shadow: 0px 0px 20px rgba(121, 255, 200, 0.50), 0px 0px 10px rgba(184, 238, 216, 0.50), 0px 0px 10px rgba(184, 238, 216, 0.50);
      text-transform: uppercase;
    }
  }

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

    .cbcn-cool-content {
      padding-bottom: 4em;
    }

    .cbcn-cool-txt1 {
      padding: 0 5.3vw;
      margin-bottom: 4em;
    }

    .cbcn-cool-txt2 {
      padding: 0 5.3vw;
      z-index: 10;
      position: relative;
    }

    .cbcn-cool-param {
      padding: 0 5.3vw;
      z-index: 10;
      position: relative;
      margin-top: -1em;
    }

    .bcn-cool-param svg {
      width: 0.45em;
      height: 0.85em;
    }

    .cbcn-cool-img {
      width: 23.4em;
      height: 13.2em;
      margin-top: -1em;
      z-index: 9;
      position: relative;
    }
  }

  /* gemini */
  @media screen {
    .cbcn-gemini-content {
      background-color: #141414 !important;
      padding: 4em 5.3vw !important;
    }

    .cbcn-gemini-card {
      align-items: center;
      height: auto;
      justify-content: space-between;
    }

    .cbcn-gemini-img {
      width: 11.7155em;
      height: 25em;
      margin-top: 2em;
      overflow: hidden;
    }

    .cbcn-gemini-img canvas {
      width: 11.7155em;
      height: 25em;
    }

    .cbcn-gemini-switchBtn-list {
      margin-top: 1.5em;
    }

    .cbcn-gemini-item-title {
      position: relative;
      display: inline-block;
    }

    .cbcn-gemini-logo {
      position: relative;
      text-align: right;
      margin-top: 0.3em;
    }

    .cbcn-gemini-logo-img {
      width: 6.05em;
      height: 1.2em;
    }
  }

  /* chip */
  @media screen {
    .cbcn-chip-content {
      padding: 4em 5.3vw;
    }

    .cbcn-chip-img {
      height: 16em;
      width: 100%;
      border-radius: 1em;
      overflow: hidden;
      margin-top: 2.5em;
    }

    .cbcn-chip-switchBtn-list {
      margin-top: 1.5em;
    }

    .cbcn-chip-title3-sh {
      font-size: 1.2em !important;
      font-family: "vivoSans-ExtraBold";
      line-height: 110%;
    }

    .cbcn-chip-title3-h1 {
      font-size: 2em !important;
      font-family: "vivoSans-ExtraBold";
      line-height: 110%;
      padding-top: 0.2em;
    }

    .cbcn-chip-card2 {
      margin-top: 8em;
    }
  }

  /* sound */
  @media screen {
    .cbcn-sound-screen {
      padding: 4em 0 2em 0 !important;
    }

    .cbcn-sound-content {
      padding: 0em !important;
    }

    .cbcn-sound-txt1 {
      padding: 0 5.3vw;
    }

    .cbcn-sound-imgDiv {
      margin-top: 2.5em;
      width: 100%;
      height: 7.15em;
      position: relative;
    }

    .cbcn-sound-img {
      height: 5.7776em;
      width: 12.3177em;
    }

    .cbcn-sound-round {
      width: 3em;
      height: 7.15em;
    }

    .cbcn-sound-round div {
      width: 1.5em;
      height: 3.5em;
      border-radius: 50%;
      background: radial-gradient(277.66% 213.89% at 122.92% 50%, rgba(170, 245, 230, 0.00) 0.67%, #7AB2B2 95.42%);
      right: 0;
      opacity: 0;
      transform-origin: center center;
    }

    .cbcn-sound-round.left {
      left: 0em;
    }

    .cbcn-sound-round.right {
      right: 0em;
      transform: translateY(-50%) rotate(-180deg);
    }

    .cbcn-sound-round div:nth-of-type(1) {
      animation: soundScale 3s 0s infinite;
    }

    .cbcn-sound-round div:nth-of-type(2) {
      animation: soundScale 3s 0.3s infinite;
    }

    .cbcn-sound-round div:nth-of-type(3) {
      animation: soundScale 3s 0.6s infinite;
    }

    .cbcn-sound-round div:nth-of-type(4) {
      animation: soundScale 3s 0.9s infinite;
    }

    .cbcn-sound-round div:nth-of-type(5) {
      animation: soundScale 3s 1.2s infinite;
    }

    .cbcn-sound-round div:nth-of-type(6) {
      animation: soundScale 3s 1.5s infinite;
    }

    @keyframes soundScale {
      0% {
        opacity: 1;
        right: -20%;
        width: 0em;
        height: 0em;
      }

      75% {
        opacity: 0;
        right: 2em;
        width: 1.5em;
        height: 7.15em;
      }

      100% {
        opacity: 0;
        right: -20%;
        width: 0em;
        height: 0em;
      }
    }
  }

  /* os */
  @media screen {
    .cbcn-os-screen {
      height: 100vh;
    }

    .cbcn-os-imgBg {
      width: 100%;
      height: calc(30 / 18.5 * 100vw);
    }

    .cbcn-os-img {
      width: 8.8364em;
      height: 8.35485em;
      opacity: 1;
    }

    .cbcn-os-screen.active .cbcn-os-img {
      opacity: 0;
      transition: all 0.5s;
      transition-delay: 1s;
    }

    .cbcn-os-txt1 {
      width: calc(100% - 21.2vw);
      text-align: center;
      opacity: 0;
    }

    .cbcn-os-screen.active .cbcn-os-txt1 {
      opacity: 1;
      transition: all 0.5s;
      transition-delay: 1.5s;
    }
  }

  /* prolonged */
  @media screen {
    .cbcn-prolonged-img {
      height: 14.0896em;
      width: 100%;
      margin-top: 2em;
    }
  }

  /* experience */
  @media screen {
    .cbcn-experience-swiper {
      margin-top: 4em;
    }

    .cbcn-experience-img {
      width: 11.7155em;
      height: 25em;
    }

    .cbcn-experience-list {
      height: auto;
    }

    .cbcn-experience-item {
      height: auto;
      gap: 2em;
      justify-content: space-between;
      align-items: center;
    }

    .cbcn-experience-switchBtn-list {
      margin-top: 2em;
    }

    .cbcn-experience-p2 {
      font-size: 0.9em;
      font-family: "vivoSans-DemiBold";
      line-height: 150%;
      margin-top: 1.2em !important;
    }
    .cbcn-experience-txt1 .cbcn-h1 {
      font-size: 1.2em;
    }
  }

  /* remark */
  @media screen {

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