/* 1023px 이하 — 진료 안내 1 (care01 · child01 · digital01 · endodontic01 · implant01) */
@media all and (max-width: 1023px) {

  /* ── 1. 제목 곁에 띄워 둔 장식 그림 ────────────────────
     PC 좌표로 떠 있어 좁은 화면에서 제목·본문을 덮는다. 흐름 안으로 되돌려 글 위에 둔다. */
  html body #smart #section05 > .position-relative,
  html body #smart #section06 > .position-relative,
  html body #smart #section14 > .position-relative,
  html body #child #section05 > .position-relative,
  html body #mise #section09 > .position-relative {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
  }

  html body #smart #section05 > .position-relative > .position-absolute,
  html body #smart #section06 > .position-relative > .position-absolute,
  html body #smart #section14 > .position-relative > .position-absolute,
  html body #child #section05 > .position-relative > .position-absolute,
  html body #mise #section09 > .position-relative > img.position-absolute {
    position: relative !important;
    inset: auto !important;
    order: -1;
    width: 100% !important;
    height: auto !important;
    margin: 24px auto 0 !important;
    padding: 0 16px !important;
    transform: none !important;
  }

  html body #mise #section09 > .position-relative > img.position-absolute {
    padding: 0 !important;
    width: calc(100% - 32px) !important;
  }

  html body :is(#smart, #child, #mise) [id^="section"] > .position-relative > .position-absolute img {
    width: 100% !important;
    height: auto !important;
  }

  /* ── 2. 치료 전·후 사진 칸 ─────────────────────────────
     칸 높이 347px 와 이름표 위치(top 282px)가 PC 사진 높이에 묶여 있어,
     사진이 줄어들면 이름표·잠금 안내가 사진 밖으로 떨어져 서로 겹친다. */
  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .position-relative:has(> .boxGray),
  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .position-relative:has(> .boxBlue) {
    height: auto !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
  }

  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .position-relative:has(> .boxGray) > img,
  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .position-relative:has(> .boxBlue) > img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }

  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .position-relative > .boxGray,
  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .position-relative > .boxBlue {
    position: static !important;
    width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
  }

  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .position-relative:has(> .boxBlue) > .overlay {
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 44px !important;
    width: auto !important;
    height: auto !important;
  }

  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .overlay > a {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 8px 12px !important;
  }

  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .overlay > a > img {
    width: 28px !important;
    height: auto !important;
  }

  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .overlay > a > h6 {
    font-size: 13px !important;
    line-height: 1.4 !important;
    margin: 0 !important;
  }

  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .overlay > a > p {
    white-space: normal !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
    text-align: center !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* 사진 아래 안내 띠 — 높이가 한 줄에 묶여 두세 줄로 접힌 글이 잘린다 */
  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .textBox {
    height: auto !important;
    min-height: 0 !important;
    padding: 12px 14px !important;
  }

  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .textBox p {
    font-size: 13px !important;
    line-height: 1.55 !important;
    height: auto !important;
    margin: 0 !important;
  }

  /* ── 3. PC 여백 계단 ────────────────────────────────────
     한 겹 안쪽에 든 본문 칸은 공통 규칙이 닿지 않아 위아래 150px 여백이 그대로 남는다. */
  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) > .position-relative > .container {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
    height: auto !important;
  }

  html body :is(#smart, #child, #oneday, #mise, #digital) [id^="section"]:not(#_) .title {
    height: auto !important;
    min-height: 0 !important;
  }

  /* ── 4. 디지털 임플란트 — 글 칸 + 그림 칸 2단 ───────────
     글 칸이 145px 로 눌려 한 줄 여섯 글자로 부서진다. 위아래로 쌓는다. */
  html body #digital [id^="section"]:not(#_) .container > .d-flex:has(> div > h2) {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 20px !important;
  }

  html body #digital [id^="section"]:not(#_) .container > .d-flex:has(> div > h2) > * {
    width: 100% !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  html body #digital [id^="section"]:not(#_) .container > .d-flex:has(> div > h2) img:not(button img) {
    position: static !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    inset: auto !important;
  }

  /* 원데이 그림 — 왼쪽 -68px 로 튀어나가 있다 */
  html body #digital #section02 .step02ImgBox {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    inset: auto !important;
  }

  /* 칸 안 탭 — 한 줄 고정 글자가 옆 칸까지 뻗어 겹친다 */
  html body #digital [id^="section"]:not(#_) .tab-buttons,
  html body #digital [id^="section"]:not(#_) .tab-buttons ul {
    height: auto !important;
    width: 100% !important;
  }

  html body #digital [id^="section"]:not(#_) .tab-buttons ul {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    padding: 0 16px !important;
  }

  html body #digital [id^="section"]:not(#_) .tab-buttons li {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
  }

  html body #digital [id^="section"]:not(#_) .tab-buttons .tab-btn {
    width: 100% !important;
    height: 100% !important;
    min-height: 52px !important;
    white-space: normal !important;
    word-break: keep-all !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    padding: 6px 8px !important;
  }

  /* ── 5. 디지털 원데이 보철 — 원데이 보철 지면과 같은 짜임 ── */
  html body #oneday #section02 .up .d-flex > div:has(> iframe) {
    width: 100% !important;
    flex: 0 0 100%;
    aspect-ratio: 16 / 9;
    height: auto !important;
  }

  html body #oneday #section02 .up .label {
    width: auto !important;
    height: auto !important;
    padding: 10px 20px !important;
    display: inline-flex !important;
  }

  html body #oneday #section02 .up .label h5 {
    white-space: normal !important;
  }

  html body #oneday #section03 .container div.whiteBox {
    height: auto !important;
    padding: 24px 16px !important;
    flex-direction: column !important;
    gap: 16px !important;
  }

  html body #oneday #section03 .container div.whiteBox > div {
    width: 100% !important;
  }

  html body #oneday #section03 .container div.whiteBox > img {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain;
  }

  /* 장비 목록 — 왼쪽 목록 + 오른쪽 상세 2단을 위아래로 */
  html body #oneday #section08 .equipment-tabs {
    flex-wrap: nowrap !important;
    gap: 6px !important;
  }

  html body #oneday #section08 .equipment-tabs li {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }

  html body #oneday #section08 .equipment-tabs .tab-btn {
    width: 100% !important;
    padding: 6px 4px !important;
    font-size: 14px !important;
    white-space: nowrap !important;
  }

  html body #oneday #section08 .equipment-swiper-wrapper {
    flex-direction: column !important;
    height: auto !important;
    gap: 10px;
  }

  html body #oneday #section08 .custom-pagination {
    width: 100% !important;
    height: auto !important;
    padding-top: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  html body #oneday #section08 .custom-pagination::-webkit-scrollbar {
    display: none;
  }

  html body #oneday #section08 .custom-pagination .pagination-buttons-wrapper {
    display: flex !important;
    height: auto !important;
    width: max-content !important;
    max-width: none !important;
    gap: 6px;
    transform: none !important;
  }

  html body #oneday #section08 .pagination-btn {
    width: auto !important;
    height: auto !important;
    flex: 0 0 auto;
    min-height: 44px !important;
    padding: 6px 14px !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
  }

  html body #oneday #section08 .scroll-down-btn,
  html body #oneday #section08 .scroll-up-btn {
    display: none !important;
  }

  html body #oneday #section08 .swiper {
    width: 100% !important;
    flex: 0 0 auto !important;
    height: 600px !important;
  }

  html body #oneday #section08 .equipment-detail {
    height: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    padding: 16px !important;
    overflow-y: auto;
  }

  html body #oneday #section08 .equipment-detail > img {
    order: -1;
    width: 100% !important;
    height: 220px !important;
    margin: 0 !important;
    object-fit: contain !important;
    flex: 0 0 auto;
  }

  html body #oneday #section08 .equipment-detail div {
    padding-left: 0 !important;
    width: 100% !important;
  }

  html body #oneday #section08 .equipment-detail button {
    width: 160px !important;
    height: 44px !important;
  }

  html body #oneday #section08 .equipment-detail button a {
    gap: 12px !important;
    font-size: 15px !important;
    line-height: 44px !important;
    white-space: nowrap;
  }

  
  html body #digital #section08 .tab-buttons .tab-btn span {
    font-size: 16px !important;
    white-space: nowrap !important;
  }

  
  html body :is(#smart, #child, #oneday) [id^="section"]:not(#_) h2 > span {
    font-size: 32px !important;
    line-height: 1.3 !important;
  }

  /* 섹션 사이 세로 구분선 — PC 좌표(left 933px)로 떠 있어 문서 폭을 넓힌다 */
  html body #smart #section13 > div:nth-of-type(1) em {
    display: none !important;
  }

  /* 턱관절 치료 카드 — 설명 글이 카드 폭의 절반에 갇혀 있다 */
  html body #smart #section09 .boxes .box p {
    width: auto !important;
  }

  /* 심미보철 — 제목 위 150px 여백과 그 자리에 떠 있는 그림이 제목을 가린다 */
  html body #smart #section02 .container-xl > div {
    display: flex !important;
    flex-direction: column !important;
  }

  html body #smart #section02 .container-xl > div > div:not(.position-absolute) {
    padding-top: 24px !important;
    padding-bottom: 40px !important;
  }

  html body #smart #section02 .container-xl > div > .position-absolute {
    position: static !important;
    order: -1;
    width: 100% !important;
    margin-top: 32px !important;
  }

  html body #smart #section02 .container-xl > div > .position-absolute img {
    width: 100% !important;
    height: auto !important;
  }

  /* 턱관절·잇몸 카드 묶음 — 안쪽 여백을 줄여 글 폭을 확보한다 */
  html body #smart #section09 .container .boxes {
    padding: 32px 16px !important;
  }
}

/* ── ssm-b:start — 모바일 글자 통일(진료 안내 1) ── */
/* 이미지에 구워진 글자(폰에서 3~5px 로 줄어든다)를 같은 내용의 HTML 글자로 보여 준다.
   PC(768px 이상)는 그대로 — 아래 블록은 PC 에서 숨는다. */
html body .ss-m:not(#_) { display: none !important; }

@media (max-width: 767px) {
  html body img.ss-mhide:not(#_):not(#_) { display: none !important; }

  html body .ss-m:not(#_):not(#_) {
    display: block !important;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    margin: 12px auto 0;
    padding: 0 16px;
    color: #222;
    font-size: 15px;
    line-height: 1.65;
    letter-spacing: -0.02em;
    word-break: keep-all;
    text-align: left;
    float: none;
    flex: 0 0 100%;
  }
  html body .ss-m.center { text-align: center; }
  html body .ss-m :is(p, li, span, strong, h4, div, th, td) { text-align: left !important; }
  html body .ss-m .ss-m-tbl :is(th, td) { text-align: center !important; }
  html body .ss-m .ss-m-card :is(strong, span) { display: block; }
  html body .ss-m .ss-m-card .ss-m-badge { display: inline-block; }
  html body .ss-m.light { color: #fff; }
  html body .ss-m * { box-sizing: border-box; letter-spacing: -0.02em; word-break: keep-all; }

  html body .ss-m .ss-m-t { margin: 0 0 8px; font-size: 17px; font-weight: 700; line-height: 1.45; color: inherit; }
  html body .ss-m .ss-m-p { margin: 0 0 8px; font-size: 15px; line-height: 1.65; color: inherit; font-weight: 400; }
  html body .ss-m .ss-m-p.b { font-weight: 700; }
  html body .ss-m .ss-m-p em { font-style: normal; font-weight: 700; color: #3f78cf; }
  html body .ss-m.light .ss-m-p em { color: #cfe0ff; }
  html body .ss-m .ss-m-cap { margin: 4px 0 0; font-size: 13px; line-height: 1.6; color: #6b7280; }
  html body .ss-m.light .ss-m-cap { color: rgba(255, 255, 255, .8); }

  /* 번호 목록 (01 02 03) */
  html body .ss-m .ss-m-nl { margin: 0 0 8px; padding: 0; list-style: none; counter-reset: ssn; }
  html body .ss-m .ss-m-nl li { position: relative; margin: 0; padding: 7px 0 7px 36px; font-size: 15px; line-height: 1.6; color: #444; counter-increment: ssn; }
  html body .ss-m .ss-m-nl li::before { content: counter(ssn, decimal-leading-zero); position: absolute; left: 0; top: 7px; font-size: 14px; font-weight: 700; color: #4a82d6; text-decoration: underline; }
  html body .ss-m .ss-m-nl.dark li::before { color: #002560; }
  html body .ss-m .ss-m-nl li b { color: #222; font-weight: 700; }

  html body .ss-m .ss-m-ul { margin: 0 0 8px; padding: 0; list-style: none; }
  html body .ss-m .ss-m-ul li { position: relative; margin: 0; padding: 4px 0 4px 16px; font-size: 15px; line-height: 1.6; }
  html body .ss-m .ss-m-ul li::before { content: ''; position: absolute; left: 3px; top: 14px; width: 5px; height: 5px; border-radius: 50%; background: #4a82d6; }

  /* 알약 */
  html body .ss-m .ss-m-chips { margin: 0 0 8px; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
  html body .ss-m .ss-m-chips li { margin: 0; padding: 7px 14px; border-radius: 999px; background: #eef3fb; border: 1px solid #cfdcf1; font-size: 15px; line-height: 1.4; color: #2f5fa8; }
  html body .ss-m.light .ss-m-chips li { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .5); color: #fff; }

  /* 카드 */
  html body .ss-m .ss-m-grid { display: grid; gap: 10px; margin: 0 0 8px; }
  html body .ss-m .ss-m-grid.c1 { grid-template-columns: 1fr; }
  html body .ss-m .ss-m-grid.c2 { grid-template-columns: 1fr 1fr; }
  html body .ss-m .ss-m-card { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border: 1px solid #dde5f2; border-radius: 10px; background: #f7f9fd; color: #222; }
  html body .ss-m .ss-m-card strong { font-size: 15px; font-weight: 700; line-height: 1.5; color: #222; }
  html body .ss-m .ss-m-card span { font-size: 14px; line-height: 1.6; color: #555; }
  html body .ss-m .ss-m-card .ss-m-badge { align-self: flex-start; margin-bottom: 2px; padding: 1px 10px; border-radius: 999px; background: #548ad6; font-size: 13px; font-weight: 700; line-height: 1.6; color: #fff; }
  html body .ss-m .ss-m-card.hi { background: #548ad6; border-color: #548ad6; }
  html body .ss-m .ss-m-card.hi strong, html body .ss-m .ss-m-card.hi span { color: #fff; }

  /* 단계 */
  html body .ss-m .ss-m-steps { margin: 0 0 8px; padding: 0; list-style: none; display: grid; gap: 8px; }
  html body .ss-m .ss-m-steps li { display: flex; align-items: center; gap: 12px; margin: 0; padding: 10px 14px; border: 1px solid #dde5f2; border-radius: 10px; background: #f7f9fd; }
  html body .ss-m .ss-m-steps li .n { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: #548ad6; font-size: 13px; font-weight: 700; line-height: 1; color: #fff; }
  html body .ss-m .ss-m-steps li .x { font-size: 15px; line-height: 1.5; color: #222; }
  html body .ss-m .ss-m-steps li.hi { background: #2d2d2d; border-color: #2d2d2d; }
  html body .ss-m .ss-m-steps li.hi .n { background: #fff; color: #2d2d2d; }
  html body .ss-m .ss-m-steps li.hi .x { color: #fff; font-weight: 700; }

  /* 표 */
  html body .ss-m .ss-m-tw { margin: 0 0 8px; overflow-x: auto; }
  html body .ss-m .ss-m-tbl { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.5; }
  html body .ss-m .ss-m-tbl th, html body .ss-m .ss-m-tbl td { padding: 9px 6px; border-bottom: 1px solid #dfe5f0; font-size: 14px; text-align: center; vertical-align: middle; color: #444; }
  html body .ss-m .ss-m-tbl thead th { padding: 11px 6px; background: #548ad6; font-weight: 700; color: #fff; }
  html body .ss-m .ss-m-tbl thead th:first-child { background: #9a9a9a; }
  html body .ss-m .ss-m-tbl tbody th { background: #f4f5f8; font-weight: 700; color: #222; }

  /* 사진(원본에서 글자 자리를 뺀 크롭) */
  html body .ss-m img.ss-m-ph { display: block; width: 100%; height: auto; margin: 0 0 10px; border-radius: 6px; }

  /* 패널(제목 띠 + 내용) · 기간 목록 */
  html body .ss-m .ss-m-panel { margin: 0 0 12px; border: 1px solid #dde5f2; border-radius: 10px; overflow: hidden; background: #fff; }
  html body .ss-m .ss-m-panel > .hd { padding: 10px 14px; background: #8f8f8f; font-size: 15px; font-weight: 700; line-height: 1.5; color: #fff; }
  html body .ss-m .ss-m-panel.blue > .hd { background: #548ad6; }
  html body .ss-m .ss-m-panel.navy > .hd { background: #00235a; }
  html body .ss-m .ss-m-panel > .bd { padding: 6px 14px 10px; }
  html body .ss-m .ss-m-panel > .bd > :last-child { margin-bottom: 0; }
  html body .ss-m .ss-m-tl { margin: 0; padding: 0; list-style: none; }
  html body .ss-m .ss-m-tl li { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: 9px 0; border-bottom: 1px solid #edf0f6; font-size: 15px; line-height: 1.5; color: #333; }
  html body .ss-m .ss-m-tl li:last-child { border-bottom: 0; }
  html body .ss-m .ss-m-tl li b { flex: 0 0 auto; font-weight: 700; color: #3f78cf; white-space: nowrap; }
  html body .ss-m img.ss-m-ph.sm { width: 56%; margin: 4px auto 10px; }

  /* 지면 쪽 글자색이 덮어쓰지 못하게 색을 못박는다 */
  html body .ss-m .ss-m-t, html body .ss-m .ss-m-p { color: #222 !important; }
  html body .ss-m.light .ss-m-t, html body .ss-m.light .ss-m-p { color: #fff !important; }
  html body .ss-m .ss-m-p em { color: #3f78cf !important; }
  html body .ss-m.light .ss-m-p em { color: #cfe0ff !important; }
  html body .ss-m .ss-m-cap { color: #6b7280 !important; }
  html body .ss-m .ss-m-nl li, html body .ss-m .ss-m-ul li, html body .ss-m .ss-m-tl li { color: #333 !important; }
  html body .ss-m .ss-m-nl li b { color: #111 !important; }
  html body .ss-m .ss-m-nl li::before { color: #4a82d6 !important; }
  html body .ss-m .ss-m-nl.dark li::before { color: #002560 !important; }
  html body .ss-m .ss-m-tl li b { color: #3f78cf !important; }
  html body .ss-m .ss-m-card strong { color: #222 !important; }
  html body .ss-m .ss-m-card span { color: #555 !important; }
  html body .ss-m .ss-m-card .ss-m-badge { color: #fff !important; }
  html body .ss-m .ss-m-steps li .x { color: #222 !important; }
  html body .ss-m .ss-m-steps li.hi .x { color: #fff !important; }
  html body .ss-m .ss-m-steps li .n { color: #fff !important; }
  html body .ss-m .ss-m-steps li.hi .n { color: #2d2d2d !important; }
  html body .ss-m .ss-m-panel > .hd { color: #fff !important; }
  html body .ss-m .ss-m-chips li { color: #2f5fa8 !important; }
  html body .ss-m.light .ss-m-chips li { color: #fff !important; }
  html body .ss-m .ss-m-tbl td, html body .ss-m .ss-m-tbl tbody th { color: #333 !important; }
  html body .ss-m .ss-m-tbl thead th { color: #fff !important; }
}
/* ── ssm-b:end ── */

html body .ss-m:not(#_) { display: none !important; }

@media (max-width: 767px) {
  html body img.ss-mhide:not(#_):not(#_) { display: none !important; }

  html body .ss-m:not(#_):not(#_) {
    display: block !important;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    margin: 12px auto 0;
    padding: 0 16px;
    color: #222;
    font-size: 15px;
    line-height: 1.65;
    letter-spacing: -0.02em;
    word-break: keep-all;
    text-align: left;
    float: none;
    flex: 0 0 100%;
  }
  html body .ss-m.center { text-align: center; }
  html body .ss-m :is(p, li, span, strong, h4, div, th, td) { text-align: left !important; }
  html body .ss-m .ss-m-tbl :is(th, td) { text-align: center !important; }
  html body .ss-m .ss-m-card :is(strong, span) { display: block; }
  html body .ss-m .ss-m-card .ss-m-badge { display: inline-block; }
  html body .ss-m.light { color: #fff; }
  html body .ss-m * { box-sizing: border-box; letter-spacing: -0.02em; word-break: keep-all; }

  html body .ss-m .ss-m-t { margin: 0 0 8px; font-size: 17px; font-weight: 700; line-height: 1.45; color: inherit; }
  html body .ss-m .ss-m-p { margin: 0 0 8px; font-size: 15px; line-height: 1.65; color: inherit; font-weight: 400; }
  html body .ss-m .ss-m-p.b { font-weight: 700; }
  html body .ss-m .ss-m-p em { font-style: normal; font-weight: 700; color: #3f78cf; }
  html body .ss-m.light .ss-m-p em { color: #cfe0ff; }
  html body .ss-m .ss-m-cap { margin: 4px 0 0; font-size: 13px; line-height: 1.6; color: #6b7280; }
  html body .ss-m.light .ss-m-cap { color: rgba(255, 255, 255, .8); }

  html body .ss-m .ss-m-nl { margin: 0 0 8px; padding: 0; list-style: none; counter-reset: ssn; }
  html body .ss-m .ss-m-nl li { position: relative; margin: 0; padding: 7px 0 7px 36px; font-size: 15px; line-height: 1.6; color: #444; counter-increment: ssn; }
  html body .ss-m .ss-m-nl li::before { content: counter(ssn, decimal-leading-zero); position: absolute; left: 0; top: 7px; font-size: 14px; font-weight: 700; color: #4a82d6; text-decoration: underline; }
  html body .ss-m .ss-m-nl.dark li::before { color: #002560; }
  html body .ss-m .ss-m-nl li b { color: #222; font-weight: 700; }

  html body .ss-m .ss-m-ul { margin: 0 0 8px; padding: 0; list-style: none; }
  html body .ss-m .ss-m-ul li { position: relative; margin: 0; padding: 4px 0 4px 16px; font-size: 15px; line-height: 1.6; }
  html body .ss-m .ss-m-ul li::before { content: ''; position: absolute; left: 3px; top: 14px; width: 5px; height: 5px; border-radius: 50%; background: #4a82d6; }

  html body .ss-m .ss-m-chips { margin: 0 0 8px; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
  html body .ss-m .ss-m-chips li { margin: 0; padding: 7px 14px; border-radius: 999px; background: #eef3fb; border: 1px solid #cfdcf1; font-size: 15px; line-height: 1.4; color: #2f5fa8; }
  html body .ss-m.light .ss-m-chips li { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .5); color: #fff; }

  html body .ss-m .ss-m-grid { display: grid; gap: 10px; margin: 0 0 8px; }
  html body .ss-m .ss-m-grid.c1 { grid-template-columns: 1fr; }
  html body .ss-m .ss-m-grid.c2 { grid-template-columns: 1fr 1fr; }
  html body .ss-m .ss-m-card { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border: 1px solid #dde5f2; border-radius: 10px; background: #f7f9fd; color: #222; }
  html body .ss-m .ss-m-card strong { font-size: 15px; font-weight: 700; line-height: 1.5; color: #222; }
  html body .ss-m .ss-m-card span { font-size: 14px; line-height: 1.6; color: #555; }
  html body .ss-m .ss-m-card .ss-m-badge { align-self: flex-start; margin-bottom: 2px; padding: 1px 10px; border-radius: 999px; background: #548ad6; font-size: 13px; font-weight: 700; line-height: 1.6; color: #fff; }
  html body .ss-m .ss-m-card.hi { background: #548ad6; border-color: #548ad6; }
  html body .ss-m .ss-m-card.hi strong, html body .ss-m .ss-m-card.hi span { color: #fff; }

  html body .ss-m .ss-m-steps { margin: 0 0 8px; padding: 0; list-style: none; display: grid; gap: 8px; }
  html body .ss-m .ss-m-steps li { display: flex; align-items: center; gap: 12px; margin: 0; padding: 10px 14px; border: 1px solid #dde5f2; border-radius: 10px; background: #f7f9fd; }
  html body .ss-m .ss-m-steps li .n { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: #548ad6; font-size: 13px; font-weight: 700; line-height: 1; color: #fff; }
  html body .ss-m .ss-m-steps li .x { font-size: 15px; line-height: 1.5; color: #222; }
  html body .ss-m .ss-m-steps li.hi { background: #2d2d2d; border-color: #2d2d2d; }
  html body .ss-m .ss-m-steps li.hi .n { background: #fff; color: #2d2d2d; }
  html body .ss-m .ss-m-steps li.hi .x { color: #fff; font-weight: 700; }

  html body .ss-m .ss-m-tw { margin: 0 0 8px; overflow-x: auto; }
  html body .ss-m .ss-m-tbl { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.5; }
  html body .ss-m .ss-m-tbl th, html body .ss-m .ss-m-tbl td { padding: 9px 6px; border-bottom: 1px solid #dfe5f0; font-size: 14px; text-align: center; vertical-align: middle; color: #444; }
  html body .ss-m .ss-m-tbl thead th { padding: 11px 6px; background: #548ad6; font-weight: 700; color: #fff; }
  html body .ss-m .ss-m-tbl thead th:first-child { background: #9a9a9a; }
  html body .ss-m .ss-m-tbl tbody th { background: #f4f5f8; font-weight: 700; color: #222; }

  html body .ss-m img.ss-m-ph { display: block; width: 100%; height: auto; margin: 0 0 10px; border-radius: 6px; }

  html body .ss-m .ss-m-panel { margin: 0 0 12px; border: 1px solid #dde5f2; border-radius: 10px; overflow: hidden; background: #fff; }
  html body .ss-m .ss-m-panel > .hd { padding: 10px 14px; background: #8f8f8f; font-size: 15px; font-weight: 700; line-height: 1.5; color: #fff; }
  html body .ss-m .ss-m-panel.blue > .hd { background: #548ad6; }
  html body .ss-m .ss-m-panel.navy > .hd { background: #00235a; }
  html body .ss-m .ss-m-panel > .bd { padding: 6px 14px 10px; }
  html body .ss-m .ss-m-panel > .bd > :last-child { margin-bottom: 0; }
  html body .ss-m .ss-m-tl { margin: 0; padding: 0; list-style: none; }
  html body .ss-m .ss-m-tl li { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: 9px 0; border-bottom: 1px solid #edf0f6; font-size: 15px; line-height: 1.5; color: #333; }
  html body .ss-m .ss-m-tl li:last-child { border-bottom: 0; }
  html body .ss-m .ss-m-tl li b { flex: 0 0 auto; font-weight: 700; color: #3f78cf; white-space: nowrap; }
  html body .ss-m img.ss-m-ph.sm { width: 56%; margin: 4px auto 10px; }

  html body .ss-m .ss-m-t, html body .ss-m .ss-m-p { color: #222 !important; }
  html body .ss-m.light .ss-m-t, html body .ss-m.light .ss-m-p { color: #fff !important; }
  html body .ss-m .ss-m-p em { color: #3f78cf !important; }
  html body .ss-m.light .ss-m-p em { color: #cfe0ff !important; }
  html body .ss-m .ss-m-cap { color: #6b7280 !important; }
  html body .ss-m .ss-m-nl li, html body .ss-m .ss-m-ul li, html body .ss-m .ss-m-tl li { color: #333 !important; }
  html body .ss-m .ss-m-nl li b { color: #111 !important; }
  html body .ss-m .ss-m-nl li::before { color: #4a82d6 !important; }
  html body .ss-m .ss-m-nl.dark li::before { color: #002560 !important; }
  html body .ss-m .ss-m-tl li b { color: #3f78cf !important; }
  html body .ss-m .ss-m-card strong { color: #222 !important; }
  html body .ss-m .ss-m-card span { color: #555 !important; }
  html body .ss-m .ss-m-card .ss-m-badge { color: #fff !important; }
  html body .ss-m .ss-m-steps li .x { color: #222 !important; }
  html body .ss-m .ss-m-steps li.hi .x { color: #fff !important; }
  html body .ss-m .ss-m-steps li .n { color: #fff !important; }
  html body .ss-m .ss-m-steps li.hi .n { color: #2d2d2d !important; }
  html body .ss-m .ss-m-panel > .hd { color: #fff !important; }
  html body .ss-m .ss-m-chips li { color: #2f5fa8 !important; }
  html body .ss-m.light .ss-m-chips li { color: #fff !important; }
  html body .ss-m .ss-m-tbl td, html body .ss-m .ss-m-tbl tbody th { color: #333 !important; }
  html body .ss-m .ss-m-tbl thead th { color: #fff !important; }
}
