/* show_ysk.html 专用样式 — derivative-define 双栏布局响应式适配 */

/*
 * 平板端（501–1259px）
 * 公共重置已提取至 responsive-tablet.css，此处仅保留页面专有规则
 */
@media screen and (max-width: 1259px) {
  /*
   * derivative-define 双栏 → 单栏
   * 将侧边栏从 30% float 改为全宽块级，内容区 margin-left 归零
   */
  .v2022.derivative-define .pageContainer .page-left {
    float: none;
    width: 100%;
    margin-top: 0;
    margin-bottom: 20px;
  }
  .v2022.derivative-define .pageContainer .page-right {
    margin-left: 0;
    margin-top: 0;
  }

  /*
   * 移动端侧边栏切换按钮：平板下显示
   * 延伸全局 500px 的 .mobile-page-sider-bar 行为到 1259px
   */
  .v2022 .mobile-page-sider-bar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    box-shadow: rgba(0, 0, 0, 0.4) 0px 0px 10px 0px;
    width: 100%;
    box-sizing: border-box;
    background: #fff;
    padding: 15px;
    font-size: 16px;
    color: #006db5;
    z-index: 250;
    position: fixed;
    left: 0;
    top: 66px;
  }
  .v2022 .mobile-page-sider-bar .iconfont {
    font-size: 19px;
  }
  .v2022 .mobile-page-sider-bar .iconfont:first-child {
    display: none;
  }

  /*
   * 侧边栏：平板下改为 fixed 定位、默认隐藏
   * 由 JS 控制点击 .mobile-page-sider-bar 后展开
   */
  .v2022 .page-sider-bar {
    box-shadow: rgba(0, 0, 0, 0.4) 0px 0px 10px 0px;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #C1C9CD;
    background: #fff;
    padding: 0;
    z-index: 302;
    position: fixed;
    left: 0;
    top: 66px;
    display: none;
  }

  /* iframe / video 视频：响应式高度 */
  .v2022 .videoSingle iframe,
  .v2022 .videobox iframe {
    height: 56.25vw !important;
    max-height: 420px;
  }
}

/*
 * 小屏平板 / 手机（768px 及以下）
 * 漫画期货卡片缩小，避免溢出
 */
@media screen and (max-width: 1259px) {
  .v2022.derivative-define .comic-futures-card {
    margin-top: 20px;
    padding: 20px;
    height: auto;
    min-height: 140px;
  }
  .v2022.derivative-define .comic-futures-card .comic-futures-label {
    font-size: 14px;
    margin-bottom: 12px;
  }
  .v2022.derivative-define .comic-futures-card .comic-futures-desc {
    font-size: 18px;
    line-height: 24px;
    max-width: 75%;
    padding-bottom: 10px;
  }
  .v2022.derivative-define .comic-futures-card .comic-futures-link-text {
    font-size: 14px;
  }
  .v2022.derivative-define .comic-futures-card .comic-futures-link-icon {
    width: 40px;
    height: 40px;
  }
  .v2022.derivative-define .comic-futures-card .comic-futures-link-icon .iconfont {
    font-size: 18px;
  }

  /* 面包屑：为固定侧边栏腾出空间 */
  .v2022.derivative-define .crumb {
    margin-top: 50px;
  }
  .v2022.derivative-define .crumb .nPageContainer {
    padding: 0;
  }
}