/* ============================================================
   정리 본문 (.art-body) — Notion 블록 스타일 · 라이트/다크 지원
   색은 변수로, 다크는 .dark .art-body 에서 재정의
   ============================================================ */
.art-body{
  --txt:#37352f; --dim:#6b6b6b; --line:#e7e6e3; --soft:#f4f3f0; --chip:rgba(55,53,47,.07);
  --s1:#2f9e6f; --s1bg:#e9f5ef;   /* 직업윤리 - green  */
  --s2:#2f7fc4; --s2bg:#e8f1fb;   /* 시민과국가 - blue */
  --s3:#9065b0; --s3bg:#f3eefa;   /* 정의 - purple     */
  color:var(--txt); font-family:'Pretendard',-apple-system,sans-serif;
  font-size:15px; line-height:1.72;
}
.dark .art-body{
  --txt:#E9E9E7; --dim:#9b9a97; --line:rgba(255,255,255,.12); --soft:rgba(255,255,255,.05); --chip:rgba(255,255,255,.10);
  --s1:#74cda3; --s1bg:rgba(116,205,163,.14);
  --s2:#79b6e6; --s2bg:rgba(121,182,230,.14);
  --s3:#c39bda; --s3bg:rgba(195,155,218,.16);
}

/* 형광(반투명 → 라이트/다크 공용). 글자색은 본문색 상속 */
.art-body .kw{background:rgba(245,182,40,.32);font-weight:600;padding:0 3px;border-radius:3px;-webkit-box-decoration-break:clone;box-decoration-break:clone;}
.art-body .hp{background:rgba(244,63,94,.24);font-weight:600;padding:0 3px;border-radius:3px;-webkit-box-decoration-break:clone;box-decoration-break:clone;}
.art-body b{font-weight:700;color:var(--txt);}

/* 본문 기본 */
.art-body p{margin:7px 0;}
.art-body ul{margin:7px 0;padding-left:22px;}
.art-body li{margin:4px 0;}
.art-body .lead{color:var(--dim);font-size:14px;margin:2px 0 10px;}

/* 중단원 헤더 */
.art-body .section{margin-top:8px;}
.art-body .s-head{display:flex;align-items:flex-start;gap:12px;margin:46px 0 16px;}
.art-body .section:first-of-type .s-head{margin-top:8px;}
.art-body .s-num{flex:0 0 auto;width:30px;height:30px;border-radius:8px;background:var(--acbg);color:var(--ac);
  font-size:15px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-top:4px;}
.art-body .s-head h2{font-size:25px;font-weight:800;letter-spacing:-.02em;margin:0;color:var(--txt);line-height:1.28;}
.art-body .s-head .q{font-size:13.5px;color:var(--dim);font-weight:400;margin-top:4px;line-height:1.45;}

/* 소제목 */
.art-body h3{font-size:18px;font-weight:700;letter-spacing:-.01em;margin:28px 0 9px;color:var(--txt);line-height:1.4;}
.art-body h4{font-size:15.5px;font-weight:700;margin:18px 0 6px;color:var(--txt);}

/* 표 */
.art-body table{width:100%;border-collapse:collapse;margin:14px 0;font-size:13.5px;line-height:1.55;border:1px solid var(--line);}
.art-body th,.art-body td{border:1px solid var(--line);padding:7px 10px;text-align:left;vertical-align:top;}
.art-body thead th{background:var(--soft);color:var(--txt);font-weight:600;font-size:13px;}
.art-body th.rowh{background:var(--soft);color:var(--txt);font-weight:600;white-space:nowrap;}
.art-body tbody tr:hover{background:var(--soft);}
.art-body .vs th{width:33.33%;}

/* 콜아웃 */
.art-body .card{background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:14px 16px;margin:14px 0;}
.art-body .card h4{margin-top:0;}
.art-body .note{background:var(--soft);border-radius:8px;padding:12px 15px;margin:13px 0;border-left:3px solid var(--ac);
  font-size:13.5px;color:var(--txt);line-height:1.6;}
.art-body .note b{color:var(--txt);}
.art-body .memo{display:flex;gap:9px;align-items:baseline;background:rgba(245,182,40,.13);border:1px solid rgba(245,182,40,.30);
  border-radius:8px;padding:11px 15px;margin:13px 0;font-size:13.5px;color:var(--txt);line-height:1.6;}
.art-body .memo::before{content:"📌";flex:0 0 auto;font-size:13px;}
.art-body .memo .lab{flex:0 0 auto;font-weight:700;font-size:11px;letter-spacing:.02em;
  background:rgba(245,182,40,.30);color:var(--txt);border-radius:4px;padding:2px 7px;}
.art-body .memo .mn{font-weight:700;background:rgba(245,182,40,.40);padding:0 3px;border-radius:3px;}

/* 태그 칩 */
.art-body .pill{display:inline-block;background:var(--chip);color:var(--txt);font-weight:500;
  font-size:12.5px;border-radius:5px;padding:3px 9px;margin:3px 5px 3px 0;}

/* 2열 그리드 */
.art-body .grid2{display:flex;gap:12px;margin:13px 0;}
.art-body .grid2>div{flex:1;}
@media(max-width:640px){.art-body .grid2{flex-direction:column;}}

/* 정의 행 */
.art-body .def{display:flex;gap:10px;margin:7px 0;}
.art-body .def .t{flex:0 0 96px;font-weight:700;color:var(--ac);font-size:14px;}
.art-body .def .d{flex:1;}