@charset "UTF-8";

@font-face {
  font-family: "vivoSans-Medium";
  src: url("./font/vivoSansGlobal2-Medium.ttf?v=1") format("truetype");
  font-weight: 400;
}

@font-face {
  font-family: "vivoSans-DemiBold";
  src: url("./font/vivoSansGlobal2-DemiBold.ttf?v=1") format("truetype");
  font-weight: 400;
}

@font-face {
  font-family: "vivoSans-Bold";
  src: url("./font/vivoSansGlobal2-Bold.ttf?v=1") format("truetype");
  font-weight: 400;
}

@font-face {
  font-family: "vivoSans-ExtraBold";
  src: url("./font/vivoSansGlobal2-ExtraBold.ttf?v=1") format("truetype");
  font-weight: 400;
}

/* 默认值 */
@media screen {
  #cbcn-dom-container * {
    box-sizing: border-box;
  }

  #cbcn-dom-container video:focus {
    outline: none;
  }

  #cbcn-dom-container p,
  #cbcn-dom-container h2,
  #cbcn-dom-container h3 {
    margin: 0;
  }

  .J_replace_content {
    position: relative;
  }

  .J_replace_content .loadingWt {
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    background-color: #fff;
  }

  #cbcn-dom-container {
    font-family: "vivoSans-Bold";
    font-size: 20px;
    background: transparent;
    color: rgba(255, 255, 255, 0.95);
    /* display: none; */
    background-color: transparent;
    overflow-x: hidden;
  }

  #cbcn-dom-container sup {
    font-size: 0.5em;
    position: relative;
    top: 0em;
    line-height: 0;
    vertical-align: super;
  }

  #cbcn-dom-container video.cover,
  #cbcn-dom-container img.cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  #cbcn-dom-container video.contain,
  #cbcn-dom-container img.contain {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
  }
}

/* 常用 */
@media screen {
  #cbcn-dom-container .cbcn-hide {
    opacity: 0;
  }

  #cbcn-dom-container .none {
    display: none;
  }
}

/* 居中 */
@media screen {
  #cbcn-dom-container .rowCenter1 {
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
  }

  #cbcn-dom-container .cbcn-titletxt.rowCenter1 {
    display: flex;
  }
}

/* 章节screen */
@media screen {
  .cbcn-screen {
    position: relative;
    width: 100%;
    background-color: #f3f2f1;
    overflow: hidden;
  }

  .cbcn-screen.wt {
    background-color: #fff;
  }

  .cbcn-screen.bk {
    background-color: #000000;
  }

  .cbcn-screen.grey {
    background-color: #0d0d0d;
  }
}

/* 文字样式 */
@media screen {
  #cbcn-dom-container .color1 {
    background: linear-gradient(296deg, #d7f0ff 0.5%, #4170e5 85.02%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  #cbcn-dom-container .color1 sup {
    background: #d7f0ff;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  #cbcn-dom-container .color2 {
    background: linear-gradient(296deg, #d7f0ff 0.5%, #4170e5 85.02%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  #cbcn-dom-container .color2 sup {
    background: linear-gradient(296deg, #d7f0ff 0.5%, #4170e5 85.02%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  #cbcn-dom-container .bk p {
    color: rgba(255, 255, 255, 0.95);
  }


  #cbcn-dom-container .grey p,
  #cbcn-dom-container .grey h2,

  #cbcn-dom-container .grey h3 {
    color: rgba(255, 255, 255, 0.95);
  }

  #cbcn-dom-container .wt p,
  #cbcn-dom-container .wt h2,
  #cbcn-dom-container .wt h3 {
    color: rgba(0, 0, 0, 0.9);
  }

  #cbcn-dom-container p.wt {
    color: rgba(255, 255, 255, 0.95);
  }

  #cbcn-dom-container p.bk {
    color: rgba(255, 255, 255, 0.95);
  }

  #cbcn-dom-container .grey p.grey,
  #cbcn-dom-container p.bk.grey,
  #cbcn-dom-container .grey h2.grey,
  #cbcn-dom-container h2.bk.grey,
  #cbcn-dom-container .grey h3.grey,
  #cbcn-dom-container h3.bk.grey {
    color: rgba(255, 255, 255, 0.65);
  }

  #cbcn-dom-container .wt p.grey,
  #cbcn-dom-container .wt h2.grey,
  #cbcn-dom-container .wt h3.grey {
    color: rgba(0, 0, 0, 0.6);
  }

  #cbcn-dom-container .wt p.grey span,
  #cbcn-dom-container .grey p.grey span,
  #cbcn-dom-container p.bk.grey span,
  #cbcn-dom-container .wt h2.grey span,
  #cbcn-dom-container .grey h2.grey span,
  #cbcn-dom-container h2.bk.grey span,
  #cbcn-dom-container .wt h3.grey span,
  #cbcn-dom-container .grey h3.grey span,
  #cbcn-dom-container h3.bk.grey span {
    color: rgba(0, 0, 0, 0.9);
  }

  #cbcn-dom-container .bk p.grey,
  #cbcn-dom-container p.wt.grey,
  #cbcn-dom-container .bk h2.grey,
  #cbcn-dom-container h2.wt.grey,
  #cbcn-dom-container .bk h3.grey,
  #cbcn-dom-container h3.wt.grey {
    color: rgba(255, 255, 255, 0.65);
  }

  #cbcn-dom-container .bk p.grey span,
  #cbcn-dom-container p.wt.grey span,
  #cbcn-dom-container .bk h2.grey span,
  #cbcn-dom-container h2.wt.grey span,
  #cbcn-dom-container .bk h3.grey span,
  #cbcn-dom-container h3.wt.grey span {
    color: rgba(255, 255, 255, 0.95);
  }

  #cbcn-dom-container .bk h2,
  #cbcn-dom-container .bk h3 {
    color: rgba(255, 255, 255, 0.95);
  }


  #cbcn-dom-container .grey h2,
  #cbcn-dom-container .grey h3 {
    color: rgba(255, 255, 255, 0.95);
  }

  #cbcn-dom-container .wt h2,
  #cbcn-dom-container .wt h3 {
    color: rgba(0, 0, 0, 0.9);
  }
}

/* 组件 */
@media screen {

  /* 字体 */
  .cbcn-h0 {
    font-family: "vivoSans-ExtraBold";
    font-size: var(--Font-Size-H0);
    line-height: 110%;
  }

  .cbcn-h1 {
    font-family: "vivoSans-ExtraBold";
    font-size: var(--Font-Size-H1);
    line-height: 120%;
  }

  .cbcn-h2 {
    font-family: "vivoSans-ExtraBold";
    font-size: var(--Font-Size-H2);
    line-height: 110%;
  }

  .cbcn-h3 {
    font-family: "vivoSans-ExtraBold";
    font-size: var(--Font-Size-H3);
    line-height: 110%;
  }

  .cbcn-h4 {
    font-family: "vivoSans-ExtraBold";
    font-size: var(--Font-Size-H4);
    line-height: 110%;
  }

  .cbcn-h5 {
    font-family: "vivoSans-ExtraBold";
    font-size: var(--Font-Size-H5);
    line-height: 110%;
  }

  .cbcn-sh {
    font-family: "vivoSans-ExtraBold";
    font-size: var(--Font-Size-SH);
    line-height: 110%;
  }

  .cbcn-p1 {
    font-family: "vivoSans-DemiBold";
    font-size: var(--Font-Size-B1);
    line-height: 150%;
  }

  .cbcn-p2 {
    font-family: "vivoSans-DemiBold";
    font-size: var(--Font-Size-B2);
    line-height: 150%;
  }

  .cbcn-p3 {
    font-family: "vivoSans-DemiBold";
    font-size: var(--Font-Size-B3);
    line-height: 150%;
  }

  .cbcn-fn {
    font-family: "vivoSans-Medium";
    font-size: var(--Font-Size-FN);
    line-height: 150%;
    color: rgba(255, 255, 255, 0.65) !important;
  }

  /* 标题+正文 */
  .cbcn-title1 .cbcn-sh,
  .cbcn-title2 .cbcn-sh,
  .cbcn-title3 .cbcn-sh {
    margin-bottom: var(--Title-Spac---Small) !important;
  }

  .cbcn-title1 .cbcn-p1,
  .cbcn-title1 .cbcn-p2 {
    margin-top: var(--Title-Spac---Large) !important;
  }

  .cbcn-title2 .cbcn-p1,
  .cbcn-title2 .cbcn-p2 {
    margin-top: var(--Title-Spac---Medium) !important;
  }

  .cbcn-title3 .cbcn-p1,
  .cbcn-title3 .cbcn-p2 {
    margin-top: var(--Title-Spac---Regular) !important;
  }

  /* 数据类型 */
  .cbcn-param {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .cbcn-param .param {
    font-family: "vivoSans-ExtraBold";
    font-size: var(--Font-Size-D1);
    white-space: nowrap;
    line-height: 110%;
  }

  .cbcn-param .txt {
    font-family: "vivoSans-DemiBold";
    font-size: var(--Font-Size-B1);
    line-height: 150%;
    opacity: 0.5;
  }

  .cbcn-param.sm {
    gap: 5px;
  }

  .cbcn-param.sm .param {
    font-family: "vivoSans-ExtraBold";
    font-size: var(--Font-Size-D2);
    line-height: 110%;
  }

  .cbcn-param.sm .txt {
    font-size: var(--Font-Size-B2);
    line-height: 120%;
  }

  /* 声明备注 */
  .cbcn-remark {
    opacity: 0.4;
  }

  .cbcn-remark p {
    color: #000;
  }
}