/* 全站繁體中文介面字型統一：優先使用各系統原生正黑體。 */
:root {
  --tl-unified-font: "Microsoft JhengHei", "Microsoft JhengHei UI", "PingFang TC", "Noto Sans TC", Arial, sans-serif;
}

html, body, button, input, select, textarea, body * {
  font-family: var(--tl-unified-font) !important;
  font-synthesis: none;
}

.activebox p, .hdlist p, .poptit {
  font-weight: 500;
  letter-spacing: 0.08em;
}

.scene-image-wrap {
  position: relative;
}

.scene-image-wrap .imgs {
  display: block;
}

.scene-title-left {
  position: absolute;
  top: 0;
  left: 12.1%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24.1%;
  height: 10.3%;
  box-sizing: border-box;
  color: #4b575d;
  background: #afc7d6;
  border-top: 1px solid rgba(255,255,255,.82);
  border-bottom: 1px solid rgba(255,255,255,.72);
  font-size: .25rem;
  font-weight: 400;
  letter-spacing: .03em;
  line-height: 1;
  white-space: nowrap;
}

.scene-title-left::before,
.scene-title-left::after {
  content: "◆";
  margin: 0 .16rem;
  font-size: .12rem;
}

/* 手機版「等級突破」內容高於原容器時，讓背景延伸到最後一個場景區塊。 */
@media (max-width: 768px) {
  .level-breakthrough-wrap {
    min-height: 125.2rem;
    box-sizing: border-box;
    background-color: #edf0ef;
  }

  body.pb .level-breakthrough-wrap {
    min-height: 148.39rem;
  }

  .level-breakthrough-wrap .section2 {
    position: relative;
    z-index: 0;
    height: auto !important;
    min-height: 80.12rem;
  }

  .level-breakthrough-wrap .section2::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    background: #1d3440;
  }
}
