/* 공지 본문 꾸밈(app/web/notice_body.render, 10/13 대표님 «기능마다 공지 — 일러스트를 넣어 제대로»)
   공개몰 공지 한 건 · 셀러 센터 공지 · 공급사 센터 공지 · 관리자 공지 고치기 미리보기가 같이 쓴다.
   공개몰 안쪽 본문·포털 기준(디자인_기준_v2 0-1): 모서리 4px 이하 · 그림자 0 · 남색/파랑 + 주황 한 점 · 평면 그림.
   부모 칸(.notice-body · .sx-notice .body · .nt-body · .adm-body)이 pre-wrap 이라 여기서 normal 로 되돌린다(줄바꿈은 <br>). */
.nb { white-space: normal; font-size: 15px; line-height: 1.8; color: var(--g1, #1F2937); word-break: keep-all; overflow-wrap: anywhere; text-align: left; }
.nb > * { margin: 0; }
.nb > * + * { margin-top: 14px; }
.nb .nb-h { margin-top: 30px; padding: 0 0 8px; font-size: 18px; font-weight: 800; line-height: 1.4; color: #0F1F45; border-bottom: 2px solid #0F1F45; letter-spacing: -.02em; }
.nb > .nb-h:first-child { margin-top: 0; }
.nb .nb-h + * { margin-top: 12px; }

/* 그림: 한 장 = 가운데 크게(최대 640px) · 이어진 2~3장 = 한 줄에 나란히(같은 높이 칸) */
.nb .nb-figs { display: grid; gap: 12px; margin-top: 18px; margin-bottom: 4px; }
.nb-figs.n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nb-figs.n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nb-fig { display: flex; flex-direction: column; justify-content: center; margin: 0; padding: 14px; background: #F5F8FF; border: 1px solid #E3EAF7; border-radius: 4px; text-align: center; }
.nb-fig img { display: block; width: 100%; height: auto; max-width: 640px; margin: 0 auto; user-select: none; }
.nb-fig figcaption { margin-top: 10px; font-size: 13.5px; font-weight: 600; line-height: 1.5; color: #374151; }

/* 번호 단계 · 점 목록 · 알림 상자 · 바로가기 단추 */
.nb-steps { list-style: none; padding: 0; counter-reset: nb; }
.nb-steps li { position: relative; min-height: 26px; padding-left: 38px; counter-increment: nb; }
.nb-steps li + li { margin-top: 10px; }
.nb-steps li::before { content: counter(nb); position: absolute; left: 0; top: 1px; width: 26px; height: 26px; border-radius: 50%;
  background: #2563EB; color: #fff; font-size: 13px; font-weight: 800; line-height: 26px; text-align: center; }
.nb-list { padding-left: 20px; }
.nb-list li + li { margin-top: 4px; }
.nb-list li::marker { color: #2563EB; }
.nb-note { padding: 12px 16px; background: #FFF6F1; border-left: 3px solid #FF6E4A; font-size: 14px; line-height: 1.7; color: #3A2A22; }
.nb-gos { display: flex; flex-wrap: wrap; gap: 8px; }
.nb .nb-go { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border: 1px solid #2563EB; border-radius: 4px;
  background: #2563EB; color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; }
.nb .nb-go:hover { background: #1D4ED8; border-color: #1D4ED8; color: #fff; }
.nb .nb-go + .nb-go { background: #fff; color: #2563EB; }
.nb .nb-go + .nb-go:hover { background: #EEF4FF; color: #1D4ED8; }

@media (max-width: 600px) {
  .nb { font-size: 14.5px; }
  .nb .nb-h { margin-top: 24px; font-size: 17px; }
  .nb-figs.n2, .nb-figs.n3 { grid-template-columns: minmax(0, 1fr); }
  .nb-fig { padding: 10px; }
  .nb .nb-go { flex: 1 1 100%; justify-content: center; }
}