/* jjf.html 手机端 — 全部限定 body.page-h5.page-jjf，不影响 PC */
@media (max-width: 992px) {
  html.page-h5,
  body.page-h5.page-jjf {
    height: 100%;
    height: -webkit-fill-available;
    height: 100svh;
    height: 100dvh;
    overflow: hidden;
  }

  body.page-h5.page-jjf .jjf-main {
    position: relative;
    overflow: hidden;
  }

  body.page-h5.page-jjf .jjf-main .page-wrap {
    height: 100%;
    min-height: 0;
    overflow: hidden;
  }

  body.page-h5.page-jjf .jjf-panel {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    background: #05070B;
  }

  body.page-h5.page-jjf .jjf-bg-stack,
  body.page-h5.page-jjf .jjf-pc-info,
  body.page-h5.page-jjf .jjf-carousel {
    display: none;
  }

  body.page-h5.page-jjf .jjf-h5-viewport {
    display: block;
    flex: 1;
    min-height: 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  body.page-h5.page-jjf .jjf-h5-viewport::-webkit-scrollbar {
    display: none;
  }

  body.page-h5.page-jjf .jjf-h5-track {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    height: 100%;
    min-height: 0;
  }

  body.page-h5.page-jjf .jjf-h5-slide {
    position: relative;
    flex: 0 0 100vw;
    width: 100vw;
    min-width: 100vw;
    max-width: 100vw;
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    padding:
      clamp(16px, calc((239 - 60) / 1080 * 100vw), 179px)
      clamp(16px, calc(87 / 1080 * 100vw), 87px)
      0;
    overflow: hidden;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    background-color: #05070B;
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center center;
  }

  body.page-h5.page-jjf .jjf-h5-slide .jjf-info {
    position: relative;
    z-index: 1;
    left: auto;
    top: auto;
    padding: 0;
    flex-shrink: 0;
    overflow: hidden;
  }

  body.page-h5.page-jjf .jjf-h5-slide .jjf-title {
    margin: 0;
    min-height: auto;
    font-family: "Alibaba PuHuiTi", "Microsoft YaHei", sans-serif;
    font-size: clamp(24px, calc(72 / 1080 * 100vw), 72px);
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0;
    color: #C8CED6;
    white-space: normal;
  }

  body.page-h5.page-jjf .jjf-h5-slide .jjf-line {
    display: block;
    width: clamp(60px, calc(190 / 1080 * 100vw), 190px);
    height: clamp(2px, calc(6 / 1080 * 100vw), 6px);
    margin-top: clamp(10px, calc(30 / 1080 * 100vw), 30px);
    margin-bottom: 0;
    background: #E10600;
    flex-shrink: 0;
  }

  body.page-h5.page-jjf .jjf-h5-slide .jjf-desc {
    margin: clamp(12px, calc(80 / 1080 * 100vw), 80px) 0 0;
    min-height: clamp(60px, calc(126 / 1080 * 100vw), 126px);
    font-family: "Alibaba PuHuiTi", "Microsoft YaHei", sans-serif;
    font-size: clamp(12px, calc(32 / 1080 * 100vw), 32px);
    font-style: normal;
    font-weight: 400;
    line-height: clamp(22px, calc(50 / 1080 * 100vw), 50px);
    letter-spacing: 0;
    color: #C8CED6;
  }

  body.page-h5.page-jjf .jjf-dots {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 4px;
    margin-top: auto;
    padding: 12px 20px 16px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  body.page-h5.page-jjf .jjf-dots::-webkit-scrollbar {
    display: none;
  }

  body.page-h5.page-jjf .jjf-dot {
    flex-shrink: 0;
    width: 10px;
    height: 3px;
  }

  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(1):checked ~ .jjf-panel .jjf-dots li:nth-child(1) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(2):checked ~ .jjf-panel .jjf-dots li:nth-child(2) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(3):checked ~ .jjf-panel .jjf-dots li:nth-child(3) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(4):checked ~ .jjf-panel .jjf-dots li:nth-child(4) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(5):checked ~ .jjf-panel .jjf-dots li:nth-child(5) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(6):checked ~ .jjf-panel .jjf-dots li:nth-child(6) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(7):checked ~ .jjf-panel .jjf-dots li:nth-child(7) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(8):checked ~ .jjf-panel .jjf-dots li:nth-child(8) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(9):checked ~ .jjf-panel .jjf-dots li:nth-child(9) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(10):checked ~ .jjf-panel .jjf-dots li:nth-child(10) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(11):checked ~ .jjf-panel .jjf-dots li:nth-child(11) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(12):checked ~ .jjf-panel .jjf-dots li:nth-child(12) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(13):checked ~ .jjf-panel .jjf-dots li:nth-child(13) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(14):checked ~ .jjf-panel .jjf-dots li:nth-child(14) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(15):checked ~ .jjf-panel .jjf-dots li:nth-child(15) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(16):checked ~ .jjf-panel .jjf-dots li:nth-child(16) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(17):checked ~ .jjf-panel .jjf-dots li:nth-child(17) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(18):checked ~ .jjf-panel .jjf-dots li:nth-child(18) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(19):checked ~ .jjf-panel .jjf-dots li:nth-child(19) .jjf-dot,
  body.page-h5.page-jjf .jjf-tab-input:nth-of-type(20):checked ~ .jjf-panel .jjf-dots li:nth-child(20) .jjf-dot {
    width: 20px;
    background: #E10600;
  }
}