/*
 * content-view.css
 * CHEditor5 → 그누보드 출력 정합성 CSS
 *
 * 역할: 에디터 iframe 환경을 출력 페이지(#bo_v_con)에서 그대로 재현한다.
 * 로드 위치: view.skin.php (게시판 보기 페이지)
 *
 * 원칙: 에디터가 Source of Truth.
 *       에디터에서 보이는 그대로 출력되어야 한다.
 */

/* =========================================================
   1. 에디터 iframe body 환경 미러링 → #bo_v_con 에 적용
      (cheditor.js setDocumentProp() 의 bodyCss 와 동일한 값)
   - editorFontSize  : 12px
   - editorFontName  : "맑은 고딕", "Malgun Gothic", gulim
   - editorFontColor : #000
   - lineHeight      : 1.7
   ========================================================= */
#bo_v_con {
    font-size:   12px;
    font-family: "맑은 고딕", "Malgun Gothic", gulim, sans-serif;
    color:       #000;
    line-height: 1.7;
    word-break:  break-all;
}

/* editarea.css: p { margin: 0; } 와 동일하게 */
#bo_v_con p {
    margin: 0;
}

/* editarea.css: table, td, th { border:1px dotted #ccc; } 와 동일하게 */
#bo_v_con table,
#bo_v_con td,
#bo_v_con th {
    border: 1px dotted #ccc;
}
#bo_v_con table {
    border-collapse: collapse;
}

/* =========================================================
   2. 에디터에서 사용하는 Google Fonts (editarea.css와 동일)
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo:wght@400;700;800&family=Black+Han+Sans&family=Jua&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Cormorant+Garamond:wght@400;600;700&family=Gowun+Batang:wght@400;700&family=Montserrat:wght@300;400;500;600&family=Nanum+Myeongjo:wght@400;700&family=Noto+Serif+KR:wght@300;400;500;700&family=Playfair+Display:wght@400;600;700&display=swap');

/* =========================================================
   3. Premium Archive Document Styles (editarea.css 동일)
      pd-* 클래스: 에디터 내 문서 스타일 박스
   ========================================================= */
:root {
  --pd-paper: #f7f0e2;
  --pd-paper2: #efe7d6;
  --pd-ink: #2f2822;
  --pd-gold: #94724a;
  --pd-gold-soft: #d5bf95;
  --pd-line: #cdbfa7;
  --pd-soft: #74695d;
  --pd-accent: #564232;
  --pd-radius: 18px;
}

/* 박스 공통 */
table.pd-box {
  width: fit-content;
  max-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--pd-radius);
  margin: 26px 0;
  font-family: 'Noto Serif KR', serif;
  line-height: 2;
  color: var(--pd-ink);
}
table.pd-box td {
  padding: 28px;
}

/* 1. 황실 칙령 (Royal Box) */
table.pd-royal {
  background: linear-gradient(90deg, rgba(148,114,74,.12), transparent);
  border-left: 6px solid var(--pd-gold);
}

/* 2. 편집자 주 (Editor Box) */
table.pd-editor {
  background: #faf7f0;
  border: 1px solid var(--pd-line);
}

/* 3. 중요 경고 (Warning Box) */
table.pd-warning {
  background: #fbefea;
  border-left: 8px solid #9d5a48;
}

/* 4. 고전 인용구 (Quote Box) */
table.pd-quote {
  background: #faf7f0;
  font-style: italic;
  border-left: 4px solid var(--pd-soft);
}

/* 5. 정보 박스 (Info Box) */
table.pd-info {
  background: #eef4f8;
  border-left: 8px solid #355b78;
}

/* 6. 문단 리드 (Lead) */
table.pd-lead { width: auto; display: inline-table; margin-right: 5px; margin-bottom: 5px;
  border-collapse: separate;
  border-spacing: 0;
  margin: 25px 0;
}
table.pd-lead td {
  font-size: 20px;
  padding-left: 24px;
  border-left: 4px solid var(--pd-gold);
  font-family: 'Noto Serif KR', serif;
}

/* Premium Block Title Styles */
.pd-box .pd-title {
  font-size: 1.15em;
  display: block;
  margin-bottom: 8px;
}
.pd-royal .pd-title {
  color: #8d7043;
  margin-bottom: 10px;
  border-bottom: 1px solid #d7c9b4;
  padding-bottom: 8px;
}
.pd-editor .pd-title { color: #333; }
.pd-warning .pd-title { color: #c92a2a; }
.pd-quote .pd-quote-text { font-size: 1.15em; padding: 0 15px; }
.pd-quote .fa { color: #d5bf95; font-size: 2em; vertical-align: middle; }
.pd-info .pd-title { color: #355b78; }

/* 구분선 styles */
.pd-sep-a {
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--pd-gold), transparent);
  border: none;
  margin: 50px 0;
}
.pd-sep-b {
  text-align: center;
  border: none;
  height: 40px;
  margin: 40px 0;
  position: relative;
  background: transparent;
}
.pd-sep-b:after {
  content: "❖ ❖ ❖";
  color: var(--pd-gold);
  letter-spacing: 14px;
  font-size: 20px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.pd-sep-c {
  height: 10px;
  border-top: 1px solid var(--pd-line);
  border-bottom: 1px solid var(--pd-line);
  border-left: none; border-right: none;
  background: transparent;
  margin: 50px 0;
}

/* =========================================================
   4. 프리미엄 템플릿 (tpl-01 ~ tpl-163)
      editarea.css 와 완전히 동일한 스타일
   ========================================================= */
[class^="tpl-"] {
  width: fit-content;
  max-width: 100%;
  box-sizing: border-box;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.tpl-01 strong, .tpl-02 strong, .tpl-03 strong, .tpl-04 strong, .tpl-10 strong {
  display: block;
  font-size: 1.15em;
  margin-bottom: 8px;
}

/* --- 카테고리 1: 인포/알림 박스 --- */
.tpl-01 { padding: 20px; background: #ebf8ff; border-left: 5px solid #3182ce; border-radius: 0 8px 8px 0; color: #2a4365; }
.tpl-02 { padding: 20px; background: #fff5f5; border-left: 5px solid #e53e3e; border-radius: 0 8px 8px 0; color: #742a2a; }
.tpl-03 { padding: 20px; background: #f0fff4; border-left: 5px solid #38a169; border-radius: 0 8px 8px 0; color: #22543d; }
.tpl-04 { padding: 20px; background: #fffff0; border-left: 5px solid #d69e2e; border-radius: 0 8px 8px 0; color: #744210; }
.tpl-05 { padding: 20px; background: #fff; border: 1px solid #e2e8f0; border-top: 4px solid #805ad5; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.05); }
.tpl-06 { padding: 20px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: #fff; border-radius: 10px; box-shadow: 0 4px 15px rgba(118,75,162,0.3); }
.tpl-07 { padding: 20px; background: #1a202c; color: #e2e8f0; border-radius: 8px; border-left: 4px solid #f6ad55; }
.tpl-08 { padding: 20px; background: rgba(255,255,255,0.7); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.5); border-radius: 12px; box-shadow: 0 8px 32px rgba(31,38,135,0.07); }
.tpl-09 { padding: 20px; background: #edf2f7; border-radius: 12px; box-shadow: inset 5px 5px 10px #d1d5db, inset -5px -5px 10px #ffffff; }
.tpl-10 { padding: 20px; background: #fff; border: 2px dashed #a0aec0; border-radius: 8px; text-align: center; color: #4a5568; }

/* --- 카테고리 2: 타이틀 / 소제목 --- */
.tpl-11 { font-size: 22px; font-weight: bold; color: #2d3748; padding-bottom: 8px; border-bottom: 3px solid #3182ce; display: inline-block; margin-bottom: 15px; }
.tpl-12 { font-size: 22px; font-weight: bold; background: linear-gradient(90deg, #ed8936, #dd6b20); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 15px; }
.tpl-13 { font-size: 20px; font-weight: bold; color: #fff; background: #2b6cb0; padding: 8px 20px; border-radius: 30px; display: inline-block; margin-bottom: 15px; }
.tpl-14 { font-size: 22px; font-weight: bold; color: #2d3748; border-left: 6px solid #e53e3e; padding-left: 12px; margin-bottom: 15px; }
.tpl-15 { font-size: 20px; font-weight: bold; color: #4a5568; position: relative; padding-left: 30px; margin-bottom: 15px; }
.tpl-15::before { content: '🎯'; position: absolute; left: 0; top: 0; }
.tpl-16 { font-size: 22px; font-weight: 800; color: #1a202c; text-transform: uppercase; letter-spacing: 2px; border-bottom: 1px solid #cbd5e0; padding-bottom: 10px; margin-bottom: 15px; }
.tpl-17 { font-size: 20px; font-weight: bold; color: #fff; background: #8d7043; padding: 10px 15px; border-radius: 4px 4px 0 0; margin-bottom: 0; }
.tpl-18 { font-size: 22px; color: #2d3748; text-shadow: 1px 1px 2px rgba(0,0,0,0.1); border-bottom: 2px dashed #a0aec0; padding-bottom: 8px; margin-bottom: 15px; }
.tpl-19 { font-size: 20px; font-weight: bold; color: #2b6cb0; padding: 10px; background: #ebf8ff; border-radius: 6px; border: 1px solid #bee3f8; margin-bottom: 15px; }
.tpl-20 { display: flex; align-items: center; font-size: 22px; font-weight: bold; color: #2d3748; margin-bottom: 15px; min-width: 350px; }
.tpl-20::after { content: ''; flex: 1; border-bottom: 2px solid #e2e8f0; margin-left: 15px; }

/* --- 카테고리 3: 인용구 (Quote) --- */
.tpl-21 { position: relative; padding: 30px 40px; background: #f7fafc; border-radius: 8px; font-style: italic; color: #4a5568; text-align: center; }
.tpl-21::before { content: '❝'; font-size: 60px; color: #e2e8f0; position: absolute; top: -10px; left: 20px; }
.tpl-22 { padding: 20px 20px 20px 50px; background: #fff; border-left: 4px solid #8d7043; position: relative; box-shadow: 0 2px 10px rgba(0,0,0,0.05); }
.tpl-22::before { content: '❞'; font-size: 40px; color: #d7c9b4; position: absolute; left: 10px; top: 10px; }
.tpl-23 { padding: 25px; background: #2d3748; color: #e2e8f0; border-radius: 12px; font-size: 16px; line-height: 1.6; border-right: 6px solid #48bb78; }
.tpl-24 { padding: 20px; background: linear-gradient(to right, #fbf8f3, #fff); border: 1px solid #d7c9b4; border-radius: 8px; font-family: 'Georgia', serif; font-size: 18px; color: #5a4a35; }
.tpl-25 { border-top: 2px solid #2b6cb0; border-bottom: 2px solid #2b6cb0; padding: 20px; text-align: center; font-size: 18px; font-weight: 500; color: #2b6cb0; background: #fafafa; }
.tpl-26 { position: relative; padding: 20px; margin: 20px 0; background: #fff; border: 1px solid #e2e8f0; box-shadow: 5px 5px 0px #cbd5e0; }
.tpl-27 { display: block; padding: 15px 25px; background: #edf2f7; border-radius: 30px; font-weight: 500; color: #4a5568; text-align: center; border: 2px solid #cbd5e0; }
.tpl-28 { padding: 30px; background: #fff5f5; border-radius: 50% 20% / 10% 40%; box-shadow: 0 4px 15px rgba(229,62,62,0.1); text-align: center; color: #c53030; }
.tpl-29 { border-left: 8px solid #3182ce; padding: 10px 20px; background: #ebf8ff; font-size: 16px; font-weight: 500; color: #2b6cb0; font-style: normal; }
.tpl-30 { position: relative; padding: 20px; background: #fffaf0; border: 1px dashed #ed8936; border-radius: 8px; color: #dd6b20; }

/* --- 카테고리 4: 표 / 요약 정리 --- */
.tpl-31 { width: auto; display: inline-table; margin-right: 5px; margin-bottom: 5px; border-collapse: collapse; border-radius: 8px; overflow: hidden; box-shadow: 0 4px 6px rgba(0,0,0,0.05); }
.tpl-31 th { background: #4a5568; color: #fff; padding: 12px 15px; text-align: left; }
.tpl-31 td { padding: 12px 15px; border-bottom: 1px solid #e2e8f0; background: #fff; }
.tpl-31 tr:last-child td { border-bottom: none; }
.tpl-32 { width: auto; display: inline-table; margin-right: 5px; margin-bottom: 5px; border-collapse: separate; border-spacing: 0; border: 1px solid #d7c9b4; border-radius: 8px; }
.tpl-32 th { background: #fbf8f3; color: #8d7043; padding: 15px; border-bottom: 1px solid #d7c9b4; border-right: 1px solid #d7c9b4; }
.tpl-32 td { padding: 15px; border-bottom: 1px solid #d7c9b4; border-right: 1px solid #d7c9b4; background: #fff; }
.tpl-32 th:last-child, .tpl-32 td:last-child { border-right: none; }
.tpl-32 tr:last-child td { border-bottom: none; }
.tpl-33 { background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 0; }
.tpl-33-header { background: #3182ce; color: #fff; padding: 15px 20px; border-radius: 8px 8px 0 0; font-weight: bold; }
.tpl-33-body { padding: 15px 20px; color: #4a5568; }
.tpl-34 { width: auto; display: inline-table; margin-right: 5px; margin-bottom: 5px; border-collapse: separate; border-spacing: 15px; margin: 0; }
.tpl-34-item { padding: 20px; background: #fff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); text-align: center; border-top: 4px solid #48bb78; vertical-align: top; }
.tpl-35 { background: #1a202c; color: #a0aec0; padding: 20px; border-radius: 8px; font-family: monospace; }
.tpl-36 { padding: 15px; border-left: 4px solid #805ad5; background: #faf5ff; border-radius: 0 8px 8px 0; display: flex; align-items: center; gap: 15px; }
.tpl-37 { border: 2px solid #38b2ac; border-radius: 12px; padding: 20px; position: relative; margin-top: 20px; background:#fff;}
.tpl-37-label { position: absolute; top: -12px; left: 20px; background: #38b2ac; color: #fff; padding: 2px 10px; border-radius: 12px; font-size: 12px; font-weight: bold; }
.tpl-38 { background: linear-gradient(135deg, #f6d365 0%, #fda085 100%); padding: 3px; border-radius: 12px; }
.tpl-38-inner { background: #fff; padding: 20px; border-radius: 9px; height: 100%; box-sizing: border-box; }
.tpl-39 { border-left: 2px solid #e2e8f0; padding-left: 20px; margin-left: 10px; }
.tpl-40 { padding: 20px; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; position: relative; }
.tpl-40::before { content: ''; position: absolute; left: -1px; top: 20px; bottom: 20px; width: 4px; background: #e53e3e; border-radius: 0 4px 4px 0; }

/* --- 카테고리 5: 구분선 및 기타 --- */
.tpl-41 { border: 0; height: 1px; background: linear-gradient(to right, transparent, #cbd5e0, transparent); margin: 30px 0; }
.tpl-42 { border: 0; height: 2px; border-bottom: 2px dashed #a0aec0; margin: 30px 0; }
.tpl-43 { text-align: center; margin: 30px 0; color: #a0aec0; font-size: 24px; letter-spacing: 15px; }
.tpl-44 { display: flex; align-items: center; margin: 30px 0; min-width: 300px; justify-content: center; }
.tpl-44::before, .tpl-44::after { content: ''; flex: 1; border-bottom: 1px solid #e2e8f0; }
.tpl-44 span { padding: 0 15px; color: #718096; font-weight: bold; }
.tpl-45 { border: 0; height: 4px; background: #3182ce; border-radius: 2px; width: 50px; margin: 30px auto; }
.tpl-46 { border: 0; height: 1px; background: #e2e8f0; margin: 30px 0; position: relative; }
.tpl-46::after { content: '♦'; position: absolute; left: 50%; top: -10px; transform: translateX(-50%); color: #cbd5e0; background: #f0f2f5; padding: 0 10px; }
.tpl-47 { padding: 15px; background: #fff; border-radius: 8px; text-align: center; box-shadow: 0 2px 4px rgba(0,0,0,0.05); font-weight: bold; color: #2d3748; cursor: pointer; transition: 0.2s; border: 1px solid #e2e8f0; }
.tpl-47:hover { background: #f7fafc; border-color: #cbd5e0; }
.tpl-48 { padding: 15px; background: #3182ce; color: #fff; border-radius: 8px; text-align: center; font-weight: bold; box-shadow: 0 4px 6px rgba(49,130,206,0.3); cursor: pointer; transition: 0.2s; }
.tpl-48:hover { background: #2b6cb0; }
.tpl-49 { padding: 15px; border: 2px solid #1a202c; color: #1a202c; border-radius: 30px; text-align: center; font-weight: bold; cursor: pointer; transition: 0.2s; }
.tpl-49:hover { background: #1a202c; color: #fff; }
.tpl-50 { display: inline-block; padding: 8px 16px; background: #e53e3e; color: #fff; border-radius: 4px; font-size: 14px; font-weight: bold; animation: pulse 2s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(229,62,62,0.4); } 70% { box-shadow: 0 0 0 10px rgba(229,62,62,0); } 100% { box-shadow: 0 0 0 0 rgba(229,62,62,0); } }

/* --- 카테고리 A: 신문사 / 전문 칼럼 포맷 (51~65) --- */
.tpl-51 { padding: 15px 20px; background: #fffbeb; border-left: 4px solid #f59e0b; border-radius: 4px; color: #92400e; font-size: 14px; margin-bottom: 15px; }
.tpl-51 strong { color: #b45309; }
.tpl-52 { font-family: 'Nanum Myeongjo', serif; font-size: 18px; font-weight: 700; line-height: 1.6; color: #333; border-left: 4px solid #718096; padding-left: 15px; background: #f7fafc; padding-top: 10px; padding-bottom: 10px; }
.tpl-53 { padding: 20px; background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); margin-bottom: 15px; }
.tpl-53 strong { font-size: 18px; color: #2d3748; display: block; margin-bottom: 10px; border-bottom: 2px solid #edf2f7; padding-bottom: 8px; }
.tpl-54 { border: 1px solid #ccc; padding: 20px; background: #fafafa; font-family: 'Nanum Myeongjo', serif; }
.tpl-54-header { display: flex; align-items: center; border-bottom: 1px dashed #bbb; padding-bottom: 15px; margin-bottom: 15px; }
.tpl-54-avatar { width: 50px; height: 50px; background: #ddd; border-radius: 50%; margin-right: 15px; display: flex; align-items: center; justify-content: center; font-size: 24px; }
.tpl-54-name { font-weight: 800; font-size: 18px; color: #000; }
.tpl-55 { font-family: 'Nanum Myeongjo', serif; border: 2px solid #222; padding: 20px; text-align: justify; line-height: 1.7; position: relative; }
.tpl-55::before { content: '社 說'; position: absolute; top: -14px; left: 20px; background: #fff; padding: 0 10px; font-weight: 800; font-size: 18px; color: #222; }
.tpl-56 { font-family: 'Nanum Myeongjo', serif; border-top: 3px solid #000; border-bottom: 3px solid #000; padding: 25px 20px; text-align: center; font-size: 22px; font-weight: 800; color: #111; margin: 20px 0; }
.tpl-57 { font-family: 'Noto Sans KR', sans-serif; display: inline-block; background: #e53e3e; color: #fff; padding: 4px 10px; font-weight: bold; font-size: 14px; letter-spacing: 2px; }
.tpl-57-text { font-family: 'Nanum Myeongjo', serif; font-size: 22px; font-weight: bold; margin-left: 10px; vertical-align: middle; }
.tpl-58 { font-family: 'Noto Sans KR', sans-serif; font-size: 13px; color: #718096; text-align: right; border-bottom: 1px solid #e2e8f0; padding-bottom: 5px; }
.tpl-59 { text-align: center; font-size: 20px; color: #000; margin: 30px 0; }
.tpl-59::before, .tpl-59::after { content: ''; display: inline-block; width: 60px; height: 1px; background: #000; vertical-align: middle; margin: 0 15px; }
.tpl-60 { border: 1px solid #000; padding: 20px; font-family: 'Noto Sans KR', sans-serif; background: #fff; }
.tpl-60 ul { margin: 0; padding-left: 20px; color: #222; line-height: 1.8; }
.tpl-60 ul li { font-weight: 500; }
.tpl-61 { background: #edf2f7; padding: 15px; text-align: center; font-family: 'Noto Sans KR', sans-serif; font-size: 13px; color: #4a5568; margin-top: 10px; }
.tpl-62 { font-family: 'Nanum Myeongjo', serif; line-height: 1.8; }
.tpl-62 .q { font-weight: 800; font-size: 18px; color: #000; margin-bottom: 5px; }
.tpl-62 .a { font-size: 16px; color: #333; margin-bottom: 20px; padding-left: 20px; }
.tpl-62 .q::before { content: 'Q. '; color: #e53e3e; font-weight: 800; font-size: 18px; }
.tpl-62 .a::before { content: 'A. '; color: #3182ce; font-weight: 800; font-size: 16px; }
.tpl-63 { width: auto; display: inline-table; margin-right: 5px; margin-bottom: 5px; border-collapse: collapse; font-family: 'Noto Sans KR', sans-serif; text-align: center; border-top: 2px solid #000; border-bottom: 2px solid #000; }
.tpl-63 th, .tpl-63 td { border-bottom: 1px solid #ccc; padding: 10px; }
.tpl-63 th { background: #f7fafc; font-weight: bold; }
.tpl-64 { display: flex; border: 1px solid #000; font-family: 'Nanum Myeongjo', serif; }
.tpl-64-pro { flex: 1; padding: 20px; border-right: 1px solid #ccc; }
.tpl-64-con { flex: 1; padding: 20px; background: #fcfcfc; }
.tpl-64 h3 { margin-top: 0; border-bottom: 2px solid #000; padding-bottom: 5px; text-align: center; font-weight: 800; }
.tpl-65 { font-family: "Noto Sans KR", sans-serif; text-align: left; border: 1px solid #e2e8f0; }

/* --- 카테고리 B: 대학교 대자보 포맷 (66~80) --- */
.tpl-66 { font-family: 'Black Han Sans', sans-serif; font-size: 40px; text-align: center; color: #000; line-height: 1.1; letter-spacing: -2px; text-shadow: 2px 2px 0 #cbd5e0; }
.tpl-67 { background: #e53e3e; color: #fff; font-family: 'Black Han Sans', sans-serif; font-size: 28px; text-align: center; padding: 20px; letter-spacing: 2px; }
.tpl-68 { font-family: 'Noto Sans KR', sans-serif; font-size: 18px; font-weight: 800; line-height: 1.8; color: #000; }
.tpl-68 .num { display: inline-block; background: #000; color: #fff; width: 30px; height: 30px; text-align: center; line-height: 30px; border-radius: 50%; margin-right: 10px; }
.tpl-69 { font-family: 'Black Han Sans', sans-serif; font-size: 22px; color: #000; background: linear-gradient(transparent 50%, #f6e05e 50%); display: inline-block; padding: 0 5px; }
.tpl-70 { font-family: 'Black Han Sans', sans-serif; font-size: 32px; color: #000; border: 4px solid #000; padding: 15px; text-align: center; box-shadow: 8px 8px 0 #000; }
.tpl-71 { border: 5px solid #000; background: #fffff0; padding: 30px; font-family: 'Noto Sans KR', sans-serif; font-weight: 700; color: #111; font-size: 18px; line-height: 1.6; }
.tpl-72 { border-collapse: collapse; width: auto; display: inline-table; margin-right: 5px; margin-bottom: 5px; border: 3px solid #000; font-family: 'Noto Sans KR', sans-serif; font-weight: bold; }
.tpl-72 th, .tpl-72 td { border: 2px solid #000; padding: 15px; text-align: center; }
.tpl-72 th { background: #000; color: #fff; font-size: 18px; }
.tpl-73 { background: #fff; border: 2px solid #000; padding: 20px; position: relative; font-family: 'Black Han Sans', sans-serif; font-size: 20px; text-align: center; }
.tpl-73::after { content: ''; position: absolute; bottom: -10px; right: -10px; width: 30px; height: 30px; background: #e53e3e; transform: rotate(45deg); z-index: -1; }
.tpl-74 { display: inline-block; background: #000; color: #fff; font-weight: 900; font-size: 20px; padding: 5px 15px; transform: skewX(-10deg); }
.tpl-74 span { display: inline-block; transform: skewX(10deg); }
.tpl-75 { border: 3px solid #e53e3e; padding: 20px; background: #fff; text-align: center; font-family: 'Noto Sans KR', sans-serif; }
.tpl-75 strong { font-size: 22px; color: #e53e3e; display: block; margin-bottom: 10px; font-weight: 900; }
.tpl-76 { font-family: 'Black Han Sans', sans-serif; font-size: 26px; color: #000; text-align: center; margin: 30px 0; }
.tpl-76::before { content: '『'; color: #e53e3e; }
.tpl-76::after { content: '』'; color: #e53e3e; }
.tpl-77 { text-align: right; font-family: 'Nanum Myeongjo', serif; font-size: 20px; font-weight: bold; margin-top: 30px; }
.tpl-77 .stamp { display: inline-block; border: 2px solid #e53e3e; color: #e53e3e; border-radius: 50%; width: 50px; height: 50px; line-height: 50px; text-align: center; font-size: 16px; margin-left: 10px; font-weight: 900; transform: rotate(-15deg); }
.tpl-78 { border: 2px solid #000; padding: 15px; font-family: 'Noto Sans KR', sans-serif; font-weight: bold; column-count: 3; column-gap: 20px; text-align: center; font-size: 14px; }
.tpl-79 { background: repeating-linear-gradient(45deg, #000, #000 10px, #e53e3e 10px, #e53e3e 20px); color: #fff; padding: 15px; text-align: center; font-family: 'Black Han Sans', sans-serif; font-size: 24px; text-shadow: 2px 2px 0 #000; }
.tpl-80 { border-top: 20px solid #000; border-bottom: 20px solid #000; padding: 30px 20px; text-align: center; font-family: 'Black Han Sans', sans-serif; font-size: 24px; color: #000; }

/* --- 카테고리 C: 유치원 / 교보재 포맷 (81~100) --- */
.tpl-81 { font-family: 'Gulim', '굴림', sans-serif; border: 4px dashed #ed8936; padding: 25px; border-radius: 20px; background: #fffaf0; font-size: 20px; color: #dd6b20; text-align: center; }
.tpl-82 { font-family: 'Gulim', '굴림', sans-serif; background: #ebf8ff; padding: 30px; border-radius: 50px 50px 50px 50px; text-align: center; font-size: 22px; color: #2b6cb0; box-shadow: 0 5px 15px rgba(66,153,225,0.2); border: 3px solid #bee3f8; }
.tpl-83 { font-family: 'Gulim', '굴림', sans-serif; font-size: 30px; color: #48bb78; text-align: center; text-shadow: 2px 2px 0 #c6f6d5; letter-spacing: 2px; }
.tpl-84 { background: #fefcbf; border: 3px solid #ecc94b; border-radius: 15px; padding: 20px; font-family: 'Gulim', '굴림', sans-serif; font-size: 18px; color: #975a16; }
.tpl-85 { background: #f0fff4; border: 3px solid #68d391; border-radius: 15px; padding: 20px; font-family: 'Gulim', '굴림', sans-serif; font-size: 20px; color: #22543d; text-align: center; }
.tpl-85::before { content: '💮 참 잘했어요!'; display: block; font-size: 24px; margin-bottom: 10px; }
.tpl-86 { display: inline-block; background: #fed7e2; color: #b83280; font-family: 'Gulim', '굴림', sans-serif; font-size: 18px; padding: 8px 20px; border-radius: 30px; border: 2px solid #f687b3; margin-bottom: 15px; }
.tpl-87 { font-family: 'Gulim', '굴림', sans-serif; font-size: 18px; color: #2d3748; line-height: 2; list-style: none; padding-left: 0; }
.tpl-87 li { margin-bottom: 10px; }
.tpl-87 .c1 { display: inline-block; background: #fc8181; color: white; border-radius: 50%; width: 25px; height: 25px; text-align: center; line-height: 25px; margin-right: 10px; }
.tpl-87 .c2 { display: inline-block; background: #63b3ed; color: white; border-radius: 50%; width: 25px; height: 25px; text-align: center; line-height: 25px; margin-right: 10px; }
.tpl-87 .c3 { display: inline-block; background: #68d391; color: white; border-radius: 50%; width: 25px; height: 25px; text-align: center; line-height: 25px; margin-right: 10px; }
.tpl-88 { background: #fff; border: 2px solid #cbd5e0; border-radius: 12px; padding: 20px; font-family: 'Gulim', '굴림', sans-serif; font-size: 18px; }
.tpl-88 div { margin-bottom: 10px; color: #4a5568; }
.tpl-88 span { color: #f6ad55; font-size: 22px; margin-right: 10px; }
.tpl-89 { width: auto; display: inline-table; margin-right: 5px; margin-bottom: 5px; border-collapse: separate; border-spacing: 5px; font-family: 'Gulim', '굴림', sans-serif; text-align: center; }
.tpl-89 th { background: #fbd38d; color: #975a16; padding: 10px; border-radius: 10px; }
.tpl-89 td { background: #fffaf0; color: #dd6b20; padding: 10px; border-radius: 10px; border: 1px solid #feebc8; }
.tpl-90 { background: #fef08a; padding: 20px; box-shadow: 2px 2px 5px rgba(0,0,0,0.1); font-family: 'Gulim', '굴림', sans-serif; font-size: 18px; color: #854d0e; transform: rotate(-2deg); width: 80%; margin: 20px auto; }
.tpl-91 { height: 10px; background: linear-gradient(to right, #fc8181, #f6ad55, #f6e05e, #68d391, #63b3ed, #b794f4); border-radius: 5px; margin: 30px 0; border: none; }
.tpl-92 { background: #fff; border: 2px solid #a0aec0; padding: 30px; font-family: 'Gulim', '굴림', sans-serif; border-radius: 0 20px 0 20px; position: relative; }
.tpl-92::before { content: ''; position: absolute; top: -2px; left: -2px; border-width: 0 0 20px 20px; border-style: solid; border-color: transparent transparent #a0aec0 #f7fafc; }
.tpl-93 { text-align: center; font-family: 'Gulim', '굴림', sans-serif; margin-bottom: 20px; }
.tpl-93 span { display: inline-block; background: #fc8181; color: #fff; padding: 10px 15px; font-size: 24px; clip-path: polygon(0% 0%, 100% 0%, 50% 100%); margin: 0 2px; height: 40px; }
.tpl-93 span:nth-child(even) { background: #63b3ed; }
.tpl-94 { background: #bee3f8; border-radius: 50px 50px 50px 5px; padding: 20px 30px; font-family: 'Gulim', '굴림', sans-serif; color: #2b6cb0; font-size: 18px; display: inline-block; }
.tpl-95 { font-family: 'Gulim', '굴림', sans-serif; font-size: 28px; text-align: center; }
.tpl-95 span { display: inline-block; padding: 5px 10px; margin: 0 2px; border-radius: 8px; color: #fff; }
.tpl-96 { border: 4px solid #68d391; padding: 20px; font-family: 'Gulim', '굴림', sans-serif; border-radius: 15px; position: relative; background: #fff; }
.tpl-96::after { content: ''; position: absolute; right: -15px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; background: #68d391; border-radius: 50%; }
.tpl-97 { font-family: 'Gulim', '굴림', sans-serif; font-size: 22px; color: #d69e2e; text-align: center; padding: 10px; border: 2px dashed #ecc94b; border-radius: 30px; background: #fffff0; }
.tpl-98 { font-family: 'Gulim', '굴림', sans-serif; font-size: 24px; color: #2d3748; display: inline-block; background: linear-gradient(transparent 60%, #fbd38d 60%); }
.tpl-99 { border-collapse: separate; border-spacing: 0; font-family: 'Gulim', '굴림', sans-serif; width: auto; display: inline-table; margin-right: 5px; margin-bottom: 5px; border-radius: 15px; overflow: hidden; border: 2px solid #cbd5e0; }
.tpl-99 th { background: #e2e8f0; padding: 15px; color: #4a5568; }
.tpl-99 td { padding: 15px; background: #fff; text-align: center; color: #718096; border-top: 1px solid #e2e8f0; }
.tpl-100 { font-family: 'Gulim', '굴림', sans-serif; background: #fff5f5; border: 2px solid #feb2b2; padding: 20px; border-radius: 20px; text-align: center; color: #c53030; font-size: 20px; }
.tpl-100::before { content: '😊'; font-size: 30px; margin-right: 10px; vertical-align: middle; }

/* --- 가로폭 100% 강제 적용 템플릿 --- */
.tpl-20, .tpl-31, .tpl-32, .tpl-34, .tpl-41, .tpl-42, .tpl-44, .tpl-46 {
  width: 100% !important;
}
.tpl-34 {
  display: flex !important;
  flex-direction: row !important;
}

/* --- 카테고리 1: 대단원 / 메인 제목 (101~110) --- */
.tpl-101 { font-family: 'Nanum Myeongjo', serif; font-size: 32px; font-weight: 800; color: #111; text-align: center; margin-bottom: 15px; }
.tpl-102 { font-family: 'Cinzel', serif; font-size: 16px; color: #94724a; text-transform: uppercase; letter-spacing: 4px; text-align: center; margin-bottom: 10px; display: block; }
.tpl-103 { font-size: 28px; font-weight: 700; color: #2d3748; padding-bottom: 10px; border-bottom: 2px solid #2b6cb0; display: inline-block; }
.tpl-104 { font-size: 26px; font-weight: 800; color: #1a202c; position: relative; padding-left: 20px; }
.tpl-104::before { content: ''; position: absolute; left: 0; top: 5px; bottom: 5px; width: 6px; background: #e53e3e; }
.tpl-105 { display: flex; align-items: baseline; gap: 15px; margin-bottom: 20px; border-bottom: 1px solid #cbd5e0; padding-bottom: 15px; }
.tpl-105 .num { font-family: 'Playfair Display', serif; font-size: 48px; color: #94724a; line-height: 1; }
.tpl-105 .text { font-size: 24px; font-weight: 700; color: #2d3748; }
.tpl-106 { font-size: 24px; font-weight: 700; text-align: center; position: relative; display: inline-block; left: 50%; transform: translateX(-50%); }
.tpl-106::before, .tpl-106::after { content: ''; position: absolute; top: 50%; width: 50px; height: 1px; background: #a0aec0; }
.tpl-106::before { right: 100%; margin-right: 15px; }
.tpl-106::after { left: 100%; margin-left: 15px; }
.tpl-107 { font-family: 'Nanum Myeongjo', serif; font-size: 30px; font-weight: 800; color: #222; margin-bottom: 20px; display: flex; flex-direction: column; }
.tpl-107 .sub { font-size: 14px; font-weight: 400; color: #718096; margin-top: 8px; font-family: 'Noto Sans KR', sans-serif; letter-spacing: 1px; }
.tpl-108 { font-size: 26px; font-weight: 800; background: linear-gradient(transparent 60%, #fbd38d 60%); display: inline-block; padding: 0 5px; }
.tpl-109 { font-family: 'Playfair Display', serif; font-size: 36px; font-style: italic; color: #4a5568; margin-bottom: 15px; }
.tpl-110 { font-size: 22px; font-weight: 700; color: #111; border-top: 3px solid #111; padding-top: 15px; margin-top: 30px; display: inline-block; }

/* --- 카테고리 2: 중제목 / 소제목 (111~120) --- */
.tpl-111 { font-size: 20px; font-weight: 700; color: #2b6cb0; margin-bottom: 15px; }
.tpl-111::before { content: '■ '; color: #2b6cb0; font-size: 14px; vertical-align: middle; margin-right: 8px; }
.tpl-112 { font-size: 18px; font-weight: 700; color: #2d3748; padding-left: 12px; border-left: 3px solid #94724a; margin-bottom: 12px; }
.tpl-113 { font-size: 18px; font-weight: bold; color: #333; border-bottom: 1px dashed #a0aec0; padding-bottom: 5px; display: inline-block; margin-bottom: 15px; }
.tpl-114 { font-family: 'Nanum Myeongjo', serif; font-size: 20px; font-weight: 800; color: #111; margin-bottom: 10px; }
.tpl-114::after { content: ''; display: block; width: 30px; height: 2px; background: #e53e3e; margin-top: 8px; }
.tpl-115 { font-size: 18px; font-weight: 700; color: #2d3748; display: flex; align-items: center; margin-bottom: 15px; }
.tpl-115::before { content: '✔'; margin-right: 10px; color: #48bb78; }
.tpl-116 { font-size: 16px; font-weight: 700; color: #718096; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 10px; }
.tpl-117 { font-size: 20px; font-weight: bold; color: #1a202c; text-indent: -15px; padding-left: 15px; margin-bottom: 15px; }
.tpl-117::before { content: 'Q. '; color: #e53e3e; font-weight: 900; }
.tpl-118 { font-size: 20px; font-weight: bold; color: #2d3748; text-indent: -15px; padding-left: 15px; margin-bottom: 15px; }
.tpl-118::before { content: 'A. '; color: #3182ce; font-weight: 900; }
.tpl-119 { font-family: 'Nanum Myeongjo', serif; font-size: 22px; color: #222; border-left: 1px solid #000; padding-left: 15px; margin-bottom: 15px; }
.tpl-120 { font-size: 18px; font-weight: 700; color: #111; margin-bottom: 10px; display: inline-block; box-shadow: inset 0 -10px 0 #e2e8f0; }

/* --- 카테고리 3: 문단 / 들여쓰기 (121~130) --- */
.tpl-121 { font-family: 'Nanum Myeongjo', serif; font-size: 16px; line-height: 1.8; color: #333; text-align: justify; margin-bottom: 20px; }
.tpl-121::first-letter { font-size: 3.5em; font-weight: 800; float: left; margin: 8px 12px 0 0; line-height: 0.8; color: #94724a; font-family: 'Cinzel', serif; }
.tpl-122 { padding-left: 30px; border-left: 1px solid #cbd5e0; font-size: 16px; line-height: 1.7; color: #4a5568; margin: 20px 0 20px 10px; font-style: italic; }
.tpl-123 { font-size: 18px; font-weight: 500; line-height: 1.8; color: #2d3748; margin-bottom: 25px; }
.tpl-124 { column-count: 2; column-gap: 40px; font-size: 15px; line-height: 1.8; color: #4a5568; text-align: justify; margin-bottom: 20px; }
.tpl-125 { padding-left: 40px; text-indent: -20px; font-size: 16px; line-height: 1.7; color: #333; margin-bottom: 15px; }
.tpl-125::before { content: '※ '; color: #e53e3e; font-weight: bold; }
.tpl-126 { font-family: 'Nanum Myeongjo', serif; text-align: center; font-size: 17px; line-height: 2; color: #222; margin: 30px 0; }
.tpl-127 { margin-left: 40px; margin-right: 40px; font-size: 15px; line-height: 1.8; color: #4a5568; text-align: justify; }
.tpl-128 { font-size: 16px; line-height: 1.8; color: #111; font-weight: bold; margin-bottom: 15px; }
.tpl-129 { font-family: 'Noto Sans KR', sans-serif; font-size: 15px; color: #718096; line-height: 1.6; border-top: 1px solid #e2e8f0; padding-top: 15px; margin-top: 20px; }
.tpl-130 { font-family: 'Nanum Myeongjo', serif; font-size: 16px; line-height: 2; color: #333; text-indent: 15px; margin-bottom: 15px; }

/* --- 카테고리 4: 리스트 및 목차 (131~140) --- */
.tpl-131 { font-size: 16px; line-height: 1.8; color: #333; padding-left: 0; list-style: none; margin-bottom: 20px; }
.tpl-131 li { position: relative; padding-left: 20px; margin-bottom: 10px; }
.tpl-131 li::before { content: '•'; color: #3182ce; font-size: 1.2em; position: absolute; left: 0; top: -2px; }
.tpl-132 { font-size: 16px; line-height: 1.8; color: #333; padding-left: 0; list-style: none; counter-reset: item; margin-bottom: 20px; }
.tpl-132 li { position: relative; padding-left: 30px; margin-bottom: 12px; }
.tpl-132 li::before { counter-increment: item; content: counter(item) "."; color: #94724a; font-weight: bold; position: absolute; left: 0; font-family: 'Cinzel', serif; }
.tpl-133 { font-size: 16px; line-height: 1.8; color: #333; padding-left: 0; list-style: none; margin-bottom: 20px; }
.tpl-133 li { position: relative; padding-left: 20px; margin-bottom: 10px; border-bottom: 1px dashed #e2e8f0; padding-bottom: 10px; }
.tpl-133 li::before { content: '→'; color: #a0aec0; position: absolute; left: 0; }
.tpl-134 { display: flex; flex-direction: column; gap: 15px; margin-bottom: 20px; }
.tpl-134 dt { font-weight: 700; font-size: 16px; color: #1a202c; float: left; width: 80px; clear: left; text-align: right; margin-right: 20px; }
.tpl-134 dd { font-size: 15px; color: #4a5568; margin-left: 100px; line-height: 1.6; }
ul.tpl-135 { list-style: none; padding: 0; margin: 0 0 15px 0; }
ul.tpl-135 li { display: flex; align-items: flex-start; margin-bottom: 10px; }
ul.tpl-135 li .step { font-size: 12px; font-weight: bold; color: #fff; background: #2b6cb0; padding: 2px 8px; border-radius: 4px; margin-right: 15px; white-space: nowrap; }
ul.tpl-135 li .desc { font-size: 16px; color: #333; line-height: 1.6; }
.tpl-136 { font-size: 16px; line-height: 1.8; color: #333; padding-left: 0; list-style: none; margin-bottom: 20px; }
.tpl-136 li { position: relative; padding-left: 20px; margin-bottom: 10px; }
.tpl-136 li::before { content: '-'; color: #718096; position: absolute; left: 0; }
.tpl-137 { display: flex; justify-content: space-between; border-bottom: 1px dotted #a0aec0; padding-bottom: 5px; margin-bottom: 10px; font-size: 16px; color: #2d3748; }
.tpl-137 .left { font-weight: 500; }
.tpl-137 .right { color: #718096; }
.tpl-138 { padding-left: 20px; border-left: 2px solid #e2e8f0; margin-left: 10px; font-size: 15px; color: #4a5568; line-height: 1.7; }
.tpl-139 { font-family: 'Nanum Myeongjo', serif; font-size: 16px; color: #222; }
ul.tpl-139 li strong { font-size: 18px; display: block; margin-bottom: 5px; }
.tpl-140 { display: flex; gap: 10px; font-size: 15px; color: #4a5568; margin-bottom: 15px; }
ul.tpl-140 li::before { content: '💡'; }

/* --- 카테고리 5: 구분선, 서명 및 메타 (141~150) --- */
.tpl-141 { text-align: center; margin: 40px 0; }
.tpl-141::after { content: '* * *'; font-size: 20px; color: #a0aec0; letter-spacing: 15px; }
.tpl-142 { border: 0; height: 1px; background: #e2e8f0; margin: 40px 0; }
.tpl-148 { font-size: 13px; color: #a0aec0; text-align: right; margin-top: 10px; font-style: italic; }

/* --- 신규 텍스트 효과 (Basic) --- */
.tpl-160 { color: #fff; text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #0fa, 0 0 40px #0fa, 0 0 80px #0fa; font-weight: bold; background: #222; padding: 2px 5px; border-radius: 4px; }
.tpl-161 { background: linear-gradient(transparent 60%, #fef08a 40%); font-weight: bold; padding: 0 2px; }
.tpl-162 { background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: bold; }
.tpl-163 { color: #fff; text-shadow: 1px 1px 0 #999, 2px 2px 0 #888, 3px 3px 0 #777, 4px 4px 0 #666, 5px 5px 0 #555, 6px 6px 0 #444, 7px 7px 5px rgba(0,0,0,0.5); font-weight: bold; font-size: 1.2em; }
