.bz-n{font-size:.8rem;color:var(--gray);font-variant-numeric:tabular-nums;margin-left:.15rem}
.bz-fig{margin:1.6rem 0;text-align:center}
.bz-fig svg{max-width:100%;height:auto}
.bz-fig-err{margin:1.2rem 0;padding:.7rem .9rem;border:1px solid var(--lightgray);
  font-size:.86rem;color:var(--gray)}
.bz-box{float:right;width:17.5rem;margin:.2rem 0 1.2rem 1.8rem;padding:0 1rem .9rem;
  border:1px solid var(--dark);border-top-width:3px;background:var(--light);
  font-size:.86rem;line-height:1.6}
/* 제목 아래 두 줄 괘선(굵은 선 + 가는 선). 옛 책 속표지의 규칙이다.
   색이 없는 사이트에서 '여기가 머리'라고 말하는 가장 조용한 방법. */
.bz-box-t{font-family:var(--titleFont);font-weight:700;font-size:1.05rem;text-align:center;
  padding:.8rem 0 .55rem;margin-bottom:.7rem;
  border-bottom:1px solid var(--dark);position:relative}
.bz-box-t::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--dark)}
.bz-box-s{display:block;font-family:var(--bodyFont);font-weight:400;font-size:.78rem;
  letter-spacing:.02em;color:var(--gray);margin-top:.2rem}
.bz-box-i{display:block;width:100%;height:auto;margin:.3rem 0 .8rem;border:1px solid var(--lightgray)}
/* 묶음 머리: 양옆 가는 선 사이에 작은 글씨 */
.bz-box-g{display:flex;align-items:center;gap:.6rem;margin:.85rem 0 .45rem;
  font-family:var(--titleFont);font-size:.78rem;letter-spacing:.08em;color:var(--darkgray)}
.bz-box-g::before,.bz-box-g::after{content:"";flex:1;height:1px;background:var(--lightgray)}
.bz-box dl{display:grid;grid-template-columns:auto 1fr;gap:.32rem .75rem;margin:0}
.bz-box dt{font-family:var(--titleFont);color:var(--gray);white-space:nowrap;
  text-align:right;padding-right:.1rem}
.bz-box dd{margin:0}
.bz-box dd a{color:var(--dark)}

/* 둘러보기: 문서 끝의 묶음 길잡이. 틀과 같은 괘선 규칙(굵은 위선, 두 줄 제목선). */
.bz-nav{margin:3rem 0 0;border:1px solid var(--dark);border-top-width:3px;
  background:var(--light);font-size:.86rem}
.bz-nav-t{cursor:pointer;list-style:none;padding:.7rem 1rem .55rem;text-align:center;
  font-family:var(--titleFont);font-weight:700;font-size:1rem;position:relative;
  border-bottom:1px solid var(--dark)}
.bz-nav-t::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--dark)}
.bz-nav-t::-webkit-details-marker{display:none}
.bz-nav:not([open]) .bz-nav-t{border-bottom:0}
.bz-nav:not([open]) .bz-nav-t::after{display:none}
.bz-nav dl{display:grid;grid-template-columns:auto 1fr;gap:0;margin:.5rem 0 0}
.bz-nav dt{padding:.5rem 1rem .5rem 1.1rem;font-family:var(--titleFont);color:var(--gray);
  white-space:nowrap;text-align:right;border-right:1px solid var(--lightgray)}
.bz-nav dd{margin:0;padding:.5rem 1.1rem;line-height:1.9}
.bz-nav dt + dd{border-bottom:1px solid var(--lightgray)}
.bz-nav dt:last-of-type + dd{border-bottom:0}
.bz-nav dd a{color:var(--dark)}
@media (max-width:760px){
  .bz-box{float:none;width:auto;margin:1.2rem 0}
  .bz-nav dl{grid-template-columns:1fr}
  .bz-nav dt{text-align:left;border-right:0;padding-bottom:0;border-bottom:0}
  .bz-nav dt + dd{border-bottom:1px solid var(--lightgray)}
}
@media print{.bz-box{float:none;width:auto}}.bz-nav[open],.bz-nav{open:true}}
@media (max-width:760px){
  .bz-box{float:none;width:auto;margin:1.2rem 0}
}
@media print{
  .bz-box{float:none;width:auto}
}