/**************/
/* 기사문 형식 */
/**************/
.article-container { background: white; border-radius: 25px; padding: 30px 20px; margin-bottom: 20px; }
.article-title {
    font-size: var(--fs-21);
    font-weight: 700; text-align: center !important; margin-bottom: 20px; 
}
.article-subtitle {
    font-size: var(--fs-16); color: #666; text-align: right !important; 
    margin-bottom: 20px; display: block; 
}
.article-p { font-size: var(--fs-18); font-weight: 400; line-height: 1.6; margin-bottom: 0px; }
.article-p.indent { text-indent: 1em; }
.article-p.indent .idx-box { text-indent: 0; }

.article-p.source { text-align: right !important; margin-top: 25px; font-size: var(--fs-16); color: #666; }
.article-p.text-left { text-align: left !important; }
.article-p.text-right { text-align: right !important; }
.article-p.text-center { text-align: center !important; }
.article-p.text-justify { text-align: justify !important; color: #000 !important; }

/* 대화문 형식 */
.passage-dialogue-card { 
    background: white; border-radius: 25px; padding: 25px 20px;  margin-bottom: 20px;
    display: flex; flex-direction: column; gap: 0px; 
}
.speaker-tag { 
    display: inline-block; background: #FAFADF; padding: 2px 5px; border-radius: 5px; outline: 1px #DFDF8E solid; outline-offset: -1px;
    font-size: 17px; font-weight: 400; margin-bottom: 8px; color: #000; line-height: 24px;
    font-family: 'NanumSquareRound', sans-serif !important;
    text-align: center;
}
.speech-text { 
    font-size: var(--fs-18); font-weight: 400; line-height: 1.6; color: #000; }

/* 분리형(Split) 지문 */
.passage-split-card { background: transparent; margin-bottom: 20px; display: flex; flex-direction: column; }
.passage-split-header { 
    background: white; border-radius: 25px; padding: 17px; 
    display: flex; justify-content: center; align-items: center; 
}
.passage-split-header h2 {
    font-size: var(--fs-21);
    font-weight: 700; text-align: center !important; line-height: 1.4; color: #000; 
}
.passage-split-body { 
    background: white; border-radius: 25px; 
    position: relative; padding: 20px 20px 25px 20px; 
    display: flex; flex-direction: column; gap: 0px; 
}
.passage-split-body::before { 
    content: ""; position: absolute; top: 0; left: 25px; right: 25px; 
    height: 1px; background: #e6e6e6; 
}
.passage-item p { font-size: clamp(16px, 4.8vw, 22px); font-weight: 400; line-height: 1.6; color: #000; }
.passage-split-body p { font-size: var(--fs-18); font-weight: 400; line-height: 1.6; color: #000; }

.label-box { 
    width: 22px; height: 22px; background: #C6EFFF; border: 1px solid #D0D2FF; border-radius: 5px; 
    flex-shrink: 0; font-size: 13px; font-weight: 800; text-align: center !important; line-height: 20px;
    font-family: 'NanumSquareRound', sans-serif !important; margin-top: 4px;
}

/* 이미지형 지문 스타일 */
.passage-image-container {
    width: 100%; margin-bottom: 20px; border-radius: 25px; overflow: hidden;
    display: flex; flex-direction: column; align-items: center;  
}
.passage-img { width: 100%; max-width: 560px; border-radius: 25px; height: auto; display: block; }

/* 이미지 위아래 텍스트 (필요한 경우) */
.passage-text-top { padding: 20px 20px 10px; font-family: 'Noto Serif KR,', serif !important; font-size: var(--fs-18); line-height: 1.6; }
.passage-text-bottom { padding: 10px 20px 20px; font-family: 'Noto Serif KR', serif !important; font-size: var(--fs-18); line-height: 1.6; }


/* ---------------------------------------------------- */
/* ----------------------- Chat 타입 ------------------- */
/* ---------------------------------------------------- */

.passage-chat-container { 
    display: flex; 
    flex-direction: column; 
    gap: 20px; 
    width: 100%;
    max-width: 580px; 
    margin-left: auto; 
    margin-right: auto; 
    margin-bottom: 20px;
    background-color: #b2d4eb;
    border-radius: 25px;
    padding: 18px;
}

/* 개별 채팅 줄 */
.chat-item { display: flex; align-items: flex-start; gap: 10px; }

/* 상대방 채팅 (기본) */
.chat-item.other { justify-content: flex-start; }

/* 내 채팅 (isMe: true) */
.chat-item.mine { 
    flex-direction: row-reverse; 
    padding-left: 60px; 
} 

.chat-avatar { width: 50px; height: 50px; border-radius: 0%; object-fit: cover; flex-shrink: 0; }

.chat-content-group { display: flex; flex-direction: column; gap: 4px; max-width: none; flex: 1; }

/* 말풍선이 max-width에 도달했을 때 각자의 시작점(아바타 쪽)으로 정렬 */
.chat-item.other .chat-content-group { align-items: flex-start; }
.chat-item.mine .chat-content-group { align-items: flex-end; }

.chat-name { font-family: 'NanumSquareRound', sans-serif !important; font-size: var(--fs-16); font-weight: 700; color: #000; }

/* 말풍선 공통 */
.chat-bubble {
    padding: 12px 16px;
    border-radius: 25px;
    font-size: var(--fs-18);
    line-height: 1.6;
    font-family: 'Noto Serif KR', serif !important;
    position: relative;
    text-align: justify; 
    text-justify: inter-word;
    word-break: break-all;
    overflow-wrap: break-word;
    width: 100%;
    max-width: 480px;
}

/* 상대방 말풍선 스타일 */
.chat-item.other .chat-bubble { background: #fff; border-top-left-radius: 2px; margin-top: -3px; }

/* 내 말풍선 스타일 */
.chat-item.mine .chat-bubble { background: #FFEB33; border-top-right-radius: 2px; color: #000; }

/* 내 채팅일 때 이름/사진 숨기기 옵션 적용을 위한 클래스 */
.chat-item.mine.bubble-only .chat-avatar,
.chat-item.mine.bubble-only .chat-name { display: none; }


/********************************************/
/************* 대화형 B 전용 컨테이너 **********/
/********************************************/
.dialog-b-container {
    background-color: #ffffff;
    border-radius: 12px;
    padding: 42px 12px 12px 12px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    margin-bottom: 20px;
}

/* 대화 한 세트 영역 */
.db-item { position: relative; margin-top: 42px; }

/* 첫 번째 대화 세트는 상단 여백 제거 (컨테이너 padding으로 처리됨) */
.db-item:first-child { margin-top: 0; }

/* 화자별 대화 말풍선 박스 */
.db-content-box {
    background-color: #fff;
    border: 1px solid #e1e1e1;
    border-radius: 15px;
    padding: 12px 10px;
    position: relative;
    z-index: 1;
}

/* 아바타 이미지 */
.db-avatar { width: 60px; height: 60px; object-fit: cover; position: absolute; top: -30px; left: 0px; z-index: 2; }

/* 화자 이름 */
.db-speaker {
    font-family: 'NanumSquareRound', serif !important;
    font-weight: 700;
    font-size: var(--fs-17);
    color: #000;
    margin: 0 0 6px 56px;
    line-height: 1;
}

/* 대화 본문 */
.db-text {
    font-size: var(--fs-18);
    color: #000;
    line-height: 1.6;
    font-family: 'Noto Serif KR', serif !important;
    text-align: justify; 
    text-justify: inter-word;
    word-break: break-all;
    overflow-wrap: break-word;
}

/* 단락이 연속해서 나올 경우 위쪽에 간격 추가 */
.db-text + .db-text { margin-top: 8px; }
.db-text.indent { text-indent: 1em; }
.db-text.indent .idx-box { text-indent: 0; }


/****************************************************/
/*********** 사진 기사(또는 그림일기) 컨테이너 ***********/
/****************************************************/
.image-article-container {
    background-color: #fff;
    padding: 30px 0px;
    border-radius: 25px;    
    font-family: 'Noto Serif KR', serif !important;
    text-align: justify; 
    text-justify: inter-word;
    word-break: break-all;
    overflow-wrap: break-word;
    margin-bottom: 20px;
}

/* 우측 상단 날짜/정보 */
.ia-subtitle { text-align: right; font-size: var(--fs-16); color: #666; margin-bottom: 20px; padding: 0 20px; }

/* 제목 */
.ia-title { text-align: center; font-size: var(--fs-18); font-weight: 700; margin: 10px 0 20px 0; line-height: 1.4; }

/* 이미지 영역 */
.ia-img-wrapper { text-align: center; margin-bottom: 20px; padding: 0 10px;}
.ia-img { max-width: 100%; height: auto; border-radius: 0px; }

/* 본문 영역 */
.ia-content { margin-top: 15px; padding: 0 20px; }

.ia-p { font-size: var(--fs-18); line-height: 1.6; margin-bottom: 0px; }
.ia-p.indent { text-indent: 1em; }
.ia-p.indent .idx-box { text-indent: 0; }

/* 지문 내 이미지 출처 */
.ia-img-source {
    display: block;
    width: 100%;
    font-family: 'NanumSquareRound', serif !important;
    text-align: right;
    font-size: var(--fs-14);
    color: #666;
    margin-top: 5px;
    margin-bottom: 2px;
    padding-right: 5px;
    font-weight: 400;
}


/****************************************************/
/******************** 그림일기 유형 *******************/
/****************************************************/
.image-diary-container {
    background-color: #fff;
    padding: 30px 0px;
    border-radius: 25px;
    font-family: 'Noto Serif KR', serif !important;
    text-align: justify; 
    text-justify: inter-word;
    word-break: break-all;
    overflow-wrap: break-word;
    margin-bottom: 20px;
}

.diary-title { 
    text-align: center; 
    font-size: var(--fs-18); 
    font-weight: 700; 
    margin: 0 0 25px 0; 
    line-height: 1.4; 
}

.diary-subtitle { 
    font-size: var(--fs-18);
    color: #000;
    line-height: 1.6; 
    margin-bottom: 10px; 
    padding: 0 20px;
}

.diary-img-wrapper { 
    text-align: center; 
    margin-bottom: 20px; 
    padding: 0 10px;
}
.diary-img { 
    max-width: 100%; 
    height: auto; 
    border-radius: 0px; 
}

.diary-img-source {
    display: block;
    width: 100%;
    font-family: 'NanumSquareRound', serif !important;
    text-align: right;
    font-size: var(--fs-14);
    color: #666;
    margin-top: 5px;
    margin-bottom: 2px;
    padding-right: 5px;
    font-weight: 400;
}

.diary-content { 
    margin-top: 15px; 
    padding: 0 20px; 
}

.diary-p { 
    font-size: var(--fs-18); 
    line-height: 1.6; 
    margin-bottom: 0px;
}
.diary-p.indent { 
    text-indent: 1em; 
}


/****************************************************/
/********************** 그림일기 B 유형 ***************/
/****************************************************/

/* B유형 전용 컨테이너 */
.image-diary-container.type-b {
    padding-top: 25px;
}

.image-diary-container.type-b .diary-subtitle {
    text-align: right;
    margin-bottom: 25px;
    font-size: var(--fs-18);
    color: #000;
    font-weight: 400;
}

.image-diary-container.type-b .diary-title {
    margin-top: 0;
    margin-bottom: 10px;
}

.image-diary-container.type-b .diary-img-wrapper {
    margin-top: 5px;
}


/****************************************************/
/******************** 시, 동시 유형 *******************/
/****************************************************/
.poem-container {
    background-color: #fff;
    padding: 30px 20px;
    border-radius: 25px;
    text-align: center;
    margin-bottom: 20px;
    font-family: 'Noto Serif KR', serif !important;
}

.poem-title { font-size: var(--fs-21); font-weight: 700; margin-bottom: 16px; }

.poem-author { text-align: right; font-size: var(--fs-16); color: #666; margin-bottom: 25px; padding-right: 10px; }

.poem-body { display: inline-block; text-align: center; width: 100%; }

.poem-stanza { margin-bottom: 24px; }
.poem-stanza:last-child { margin-bottom: 0; }

.poem-source {
    text-align: right;
    font-size: var(--fs-16);
    color: #666;
    margin-top: 25px;
}

.poem-line { font-size: var(--fs-18); line-height: 1.8; word-break: keep-all; }


/****************************************************/
/********************** 편지 유형 ********************/
/****************************************************/
.letter-container {
    background-color: #fff;
    padding: 30px 20px;
    border-radius: 25px;
    margin-bottom: 20px;
    font-family: 'Noto Serif KR', serif !important;
}

/* 받는 사람 */
.letter-salutation {
    font-size: var(--fs-18);
    font-weight: 400;
    margin-bottom: 25px;
    text-align: left;
}

/* 본문 영역 */
.letter-content { margin-bottom: 35px; }

.letter-p {
    font-size: var(--fs-18);
    line-height: 1.6;
    text-align: justify; 
    text-justify: inter-word;
    word-break: break-all;
    overflow-wrap: break-word;
}

/* 편지 본문 들여쓰기 및 기호(idx-box) 보정 */
.letter-p.indent { text-indent: 1em; }
.letter-p.indent .idx-box { text-indent: 0; display: inline-flex; }

/* 하단 날짜 및 보낸 사람 영역 */
.letter-footer { text-align: right; display: flex; flex-direction: column; gap: 8px; }
.letter-date { font-size: var(--fs-18); color: #000; }
.letter-sign-off { font-size: var(--fs-18); color: #000; }


/****************************************************/
/********************* 알림장 유형 ********************/
/****************************************************/

/* 1. 전체 카드 구조 */
.notice-card {
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    font-family: 'Noto Serif KR', serif !important;    
    color: #000;
    text-align: justify; 
    text-justify: inter-word;
    word-break: break-all;
    overflow-wrap: break-word;
}

.notice-header {
    background: white;
    border-radius: 25px;
    padding: 25px 20px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.notice-body {
    background: white;
    border-radius: 25px;
    position: relative;
    padding: 20px 18px 30px 18px;
    display: flex;
    flex-direction: column;
    font-size: var(--fs-18);    
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

/* 제목 스타일 */
.notice-title { font-size: var(--fs-21); font-weight: 700; line-height: 1.4; margin-bottom: 6px; }
.notice-subtitle { font-size: var(--fs-19); font-weight: 500; }

/* 본문 문구 */
.notice-intro, .notice-closing { font-size: var(--fs-18); margin-bottom: 20px; font-size: var(--fs-18); line-height: 1.6; }
.notice-intro { text-indent: 1em; }

/* 섹션 전체를 묶는 큰 테두리 박스 */
.notice-sections-group { border: 1px solid #E6E6E6; border-radius: 15px; padding: 20px 14px 14px 14px; margin-bottom: 20px; }

/* 개별 섹션 (박스 내부 간격 조절) */
.notice-section { margin-bottom: 25px; }
.notice-section:last-child { margin-bottom: 0; }

/* 섹션 소제목 라벨 */
.notice-label {
    display: flex;
    align-items: flex-start;
    font-family: 'NanumSquareRound', serif !important;
    font-weight: 700;
    font-size: var(--fs-18);
    margin-bottom: 10px; 
}
.notice-label::before { content: "■"; font-size: var(--fs-14); margin-right: 8px; align-self: center; margin-top: -1px; }

/* 리스트 및 불렛 스타일 */
.notice-list { list-style: none; padding-left: 0; margin: 0; }
.notice-item { position: relative; padding-left: 18px; line-height: 1.7; margin-bottom: 8px; }
.notice-item::before { content: "-"; position: absolute; left: 0; font-weight: 700; }
.notice-sub-list { list-style: none; padding-left: 0px; margin-top: 6px; }
.notice-sub-item { position: relative; padding-left: 15px; font-size: var(--fs-18); line-height: 1.6; margin-bottom: 4px; }
.notice-sub-item::before { content: "•"; position: absolute; left: 0; font-size: 0.9em; }

/* 하단 푸터 */
.notice-footer { text-align: center !important; margin-top: 15px; display: flex; flex-direction: column; gap: 8px; }
.notice-date { font-size: var(--fs-18); color: #000; }
.notice-issuer { font-size: var(--fs-18); font-weight: 700; color: #000; }


/****************************************************/
/****************** 조사 보고서 (Survey Report) ***********/
/****************************************************/

/* 전체 흰색 배경 카드 */
.survey-report-container {
    background-color: #fff;
    padding: 17px 10px 10px;
    border-radius: 25px;
    margin-bottom: 20px;
    font-family: 'Noto Serif KR', serif !important;    
    color: #000;
    text-align: justify; 
    text-justify: inter-word;
    word-break: break-all;
    overflow-wrap: break-word;
}

/* 메인 제목 */
.survey-report-main-title { font-size: var(--fs-21); font-weight: 700; text-align: center !important; margin-bottom: 17px; }
/* 부제목 */
.survey-report-sub-title { text-align: right; font-size: var(--fs-16); color: #666; margin-bottom: 17px; }

/* 내부 표 카드 */
.survey-report-card { overflow: hidden; }

/* 개별 행 및 라벨 */
.survey-report-row { border: 1px solid #E6E6E6; border-radius: 15px; margin-top: -1px;}
.survey-report-row:first-child { margin-top: 0; }
.survey-report-label { display: flex; align-items: flex-start;font-family: 'NanumSquareRound', serif !important; font-size: var(--fs-18); font-weight: 700; padding: 15px 15px 0; }
.survey-report-label::before { content: "■"; font-size: var(--fs-14); margin-right: 8px; align-self: center; margin-top: -1px; }
.survey-report-content-box { padding: 8px 15px 15px 15px; }
.survey-report-text-item { font-size: var(--fs-18); line-height: 1.6; margin-bottom: 0px; }
.survey-report-bullet-item {
    position: relative;
    padding-left: 12px;
    font-size: var(--fs-18);
    line-height: 1.6;
    margin-bottom: 8px;
}
.survey-report-bullet-item::before { content: "•"; position: absolute; left: 0; font-weight: bold; }

/* 이미지 처리 */
.survey-report-img-wrapper { margin: 10px 0 15px 0; text-align: left; }
.survey-report-img { width: 100%; max-width: 680px; height: auto; border-radius: 5px; }


/****************************************************/
/************** 체험 보고서 B 유형 (rb) *************/
/****************************************************/

.report-b-container {
    background-color: #fff;
    padding: 30px 20px;
    border-radius: 25px;
    font-family: 'Noto Serif KR', serif !important;
    text-align: justify; 
    text-justify: inter-word;
    word-break: break-all;
    overflow-wrap: break-word;
    margin-bottom: 20px;
}

.rb-title { text-align: center; font-size: var(--fs-21); font-weight: 700; margin-bottom: 10px; }
.rb-name { text-align: right; font-size: var(--fs-18); margin-bottom: 20px; color: #000; }

.rb-section-list, .rb-section-image {
    /*padding-bottom: 10px;*/
    margin-bottom: 0px;
}

.rb-border-b {
    border-bottom: 1px solid #e6e6e6;
    padding-bottom: 20px;
    margin-bottom: 20px;
}
.rb-body > div:last-child {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    border-bottom: none !important;
}

.rb-list { list-style: none; padding-left: 0; }
.rb-list li {
    position: relative;
    font-size: var(--fs-18);
    line-height: 1.6;
    margin-bottom: 8px;
    font-weight: 400;
}

/* 1depth: ■ 블릿 */
.rb-list li.depth-1 { padding-left: 22px; }
.rb-list li.depth-1::before { content: "■"; position: absolute; left: 0; font-size: 0.8em; top: 2px; }

/* 2depth: · 블릿 + 700 강조 */
.rb-list li.depth-2 { padding-left: 18px; margin-left: 0px; font-weight: 700; } /* margin-left: 10px; */
.rb-list li.depth-2::before { content: "·"; position: absolute; left: 0; font-weight: 700; font-size: 1.4em; top: -6px; }

/* 3depth: 블릿 없음 */
.rb-list li.depth-3 { padding-left: 0; margin-left: 18px; } /* margin-left: 28px; */
.rb-list li.depth-3::before { content: none; }

/* 4. 이미지 그리드 (500px 기준 wrap) */
.rb-image-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
    margin: 15px 0;
}

.rb-img-item { 
    /* 컨테이너가 500px 이상이면 1행(240px*2), 미만이면 래핑 */
    /*flex: 1 1 240px; 
    max-width: 450px; */
    flex: 1 1 280px;
    max-width: 450px;
    text-align: center; 
}

.rb-img { width: 100%; height: auto; display: block; border-radius: 15px;}
.rb-img-caption { font-size: var(--fs-16); font-weight: 400; margin-top: 8px; }

.rb-img-source {
    text-align: right;
    font-size: var(--fs-16);
    color: #666;
    margin-top: 10px;
    width: 100%;
}


/****************************************************/
/***************** 특징 설명 (Feature Article) **********/
/****************************************************/

.fa-container {
    background-color: #fff;
    padding: 30px 20px;
    border-radius: 25px;
    margin-bottom: 20px;
    font-family: 'Noto Serif KR', serif !important;
}

/* 제목 및 부제목 */
.fa-header { margin-bottom: 18px; border-bottom: 1px solid #e6e6e6; padding-bottom: 10px;}
.fa-title { font-size: var(--fs-21); font-weight: 700; text-align: center; margin-bottom: 5px; color: #000; }
.fa-subtitle { font-size: var(--fs-21); font-weight: 700; color: #666; text-align: right; }

/* 이미지 및 캡션 */
.fa-img-container { text-align: center; margin-bottom: 30px; }
.fa-img { width: 100%; max-width: 560px; border-radius: 20px; margin-bottom: 5px; }
.fa-img-caption { font-size: var(--fs-16); font-weight: 700; color: #000; margin-bottom: 2px; word-break: keep-all; }
.fa-img-source { font-size: var(--fs-16); color: #666; }

/* 특징 리스트 라벨 */
.fa-label { margin-bottom: 12px; }
.fa-label span {
    display: inline-block;
    background-color: #f6f8d6;
    padding: 2px 8px;
    border: 1px solid #DFDF8E;
    border-radius: 8px;
    font-weight: 700;
    font-size: var(--fs-17);
}

/* 리스트 아이템 */
.fa-list { display: flex; flex-direction: column; gap: 5px; }
.fa-feature-item { position: relative; padding-left: 15px; font-size: var(--fs-18); line-height: 1.6; text-align: justify; }
.fa-feature-item::before { content: "•"; position: absolute; left: 0; font-weight: bold; }

/****************************************************/
/***************** 정보 나열형 (info-document) **********/
/****************************************************/

.info-document-container {
    background-color: #fff;
    border-radius: 25px; /* 기존 지문 컨테이너와 통일 */
    padding: 30px 0px;
    margin-bottom: 20px;
    font-family: 'Noto Serif KR', serif !important;
    text-align: justify; 
    /*text-justify: inter-word;*/
    word-break: break-all;
    overflow-wrap: break-word;
}

/* 지문 중앙 헤드라인 (예: 우리 땅 독도) */
.id-headline {
    text-align: center !important;
    font-size: var(--fs-21);
    font-weight: 700;
    color: #000;
    margin-bottom: 25px;
    padding-bottom: 12px;
    border-bottom: 1px double #e6e6e6;
}

/* 섹션 단위 (1. 위치, 2. 역사 등) */
.id-section { margin-bottom: 22px; }
.id-section:last-child { margin-bottom: 0; }
.id-section-content { padding: 0 10px; }

/* 섹션 라벨 (숫자와 제목) */
.id-section-label { font-size: var(--fs-19); font-weight: 700; color: #000; margin-bottom: 8px; display: flex; align-items: center; padding: 0 20px; }

/* 섹션 본문 텍스트 */
.id-text { font-size: var(--fs-18); line-height: 1.6; color: #000; padding: 0 10px; }

/* 섹션 리스트 스타일 (불렛) */
.id-list { list-style: none; padding: 0 10px; margin: 0; }
.id-list li { position: relative; padding-left: 18px; margin-bottom: 6px; font-size: var(--fs-18); line-height: 1.6; }
.id-list li::before { content: "•"; position: absolute; left: 0; font-weight: bold; }

/* 섹션 표 스타일 (관련 기록 표) */
.id-table {
    width: 100%;    
    border-collapse: separate; /* border-radius를 위해 collapse 대신 separate 사용 */
    border-spacing: 0;         
    margin-top: 10px;
    border: 1px solid #E6E6E6;
    border-radius: 15px;
    overflow: hidden;
    table-layout: fixed;
}

/* 내부 셀 테두리 보정 (border-collapse: separate 대응) */
.id-table th, .id-table td {
    border-right: 1px solid #E6E6E6;
    border-bottom: 1px solid #E6E6E6;
    padding: 10px 12px;
    font-size: var(--fs-18);
    line-height: 1.6;
}
.id-table td { padding: 10px 12px 10px 8px !important; }

/* 마지막 열 우측 테두리 제거 */
.id-table th:last-child, 
.id-table td:last-child { border-right: none; }

/* 마지막 행 하단 테두리 제거 */
.id-table tr:last-child th, 
.id-table tr:last-child td { border-bottom: none; }

/* 왼쪽 헤더 영역 */
.id-table th {
    background-color: #FAFADF;
    color: #000;
    font-weight: 700;
    /*writing-mode: vertical-rl;   /* 세로 방향으로 텍스트 */
    /*text-orientation: upright;    /* 글자 눕지 않도록 함 */        
    width: 32px;
    text-align: center !important;
    vertical-align: middle;
    padding: 15px 0;
    letter-spacing: 0;
    line-height: 1.2;
    word-break: break-all;
}

.id-table td { background-color: #fff; color: #000; }

/* 표 내부 리스트 스타일 */
.id-table-list { list-style: none; padding: 0; margin: 0; }
.id-table-list li { position: relative; padding-left: 18px; margin-bottom: 4px; font-size: var(--fs-18); line-height: 1.6; color: #000; }
.id-table-list li:last-child { margin-bottom: 0; }
.id-table-list li::before { content: "•"; position: absolute; left: 0; top: 0; font-weight: 700; color: #000; }


/****************************************************/
/************** 안내문/포스터 B 유형 (idb) ***********/
/****************************************************/
.idb-container {
    background-color: #fff;
    padding: 30px 20px;
    border-radius: 25px;
    text-align: center; /* 전체 중앙 정렬 */
    font-family: 'Noto Serif KR', serif !important;
    margin-bottom: 20px;
}

.idb-title {
    font-size: var(--fs-21);
    font-weight: 700;
    margin-bottom: 10px;
}

.idb-subtitle {
    font-size: var(--fs-19);
    font-weight: 500;
    margin-bottom: 25px;
}

.idb-main-img-wrap {
    margin-bottom: 25px;
}
.idb-main-img {
    max-width: 100%;
    height: auto;
}

.idb-body {
    margin-bottom: 20px;
}

.idb-p {
    font-size: var(--fs-18);
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: 10px;
    word-break: keep-all;
}

.idb-table-wrap {
    margin-top: 20px;
}
.idb-table {
    width: 100%;
    border-collapse: collapse;
    border-left: none;
    border-right: none;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
}

.idb-table th, .idb-table td {
    border: 1px solid #e6e6e6;
    padding: 12px 5px;
    font-size: var(--fs-16);
    vertical-align: middle;
}

.idb-table th:first-child, 
.idb-table td:first-child {
    border-left: none;
}

.idb-table th:last-child, 
.idb-table td:last-child {
    border-right: none;
}
.idb-table th {
    background-color: #fff;
    font-weight: 700;
}

.idb-footer-img-wrap {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}
.idb-footer-img {
    max-width: 90px;
}


/****************************************************/
/***************** 이메일 유형 ************************/
/****************************************************/

/* 이메일 유형 스타일 */
.email-container {
    width: 100%;
    background-color: #FFF;
    border-radius: 25px;
    padding: 30px 20px;
    box-sizing: border-box;
    font-family: 'Noto Serif KR', serif !important;
    text-align: justify; 
    text-justify: inter-word;
    word-break: break-all;
    overflow-wrap: break-word;
    margin-bottom: 20px;
}

.email-subject {
    font-size: var(--fs-18);
    font-weight: 700;
    color: #000;
    line-height: 1.3;
    margin-bottom: 20px;
}

.email-meta-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.email-meta-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.email-label {
    font-size: var(--fs-16);
    color: #666;
    font-weight: 400;
}

.email-name-tag {
    display: inline-block;
    background-color: #FAFADF;
    border: 1px solid #DFDF8E;
    border-radius: 15px;
    padding: 2px 12px;
    font-size: var(--fs-16);
    color: #000;
    font-weight: 400;
}

.email-date {
    font-size: var(--fs-16);
    color: #666;
    margin-top: 5px;
}

.email-divider {
    width: 100%;
    height: 1px;
    background-color: #EEE;
    margin: 20px 0;
}

.email-body {
    margin-bottom: 30px;
}

.email-p {
    font-size: var(--fs-18);
    line-height: 1.6;
    color: #000;
    margin-bottom: 0;
}

.email-sign-off {
    font-size: var(--fs-18);
    color: #000;
    font-weight: 400;
    margin-top: 20px;    
}


/**************************************************/
/***************** SNS 유형 ************************/
/**************************************************/
.sns-container {
    width: 100%;
    background-color: #FFF;
    border-radius: 25px;
    padding: 30px 0 30px 0;
    margin-bottom: 20px;
    box-sizing: border-box;
    font-family: 'Noto Serif KR', serif !important;
    text-align: justify; 
    text-justify: inter-word;
    word-break: break-all;
    overflow-wrap: break-word;
}

.sns-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    padding: 0 20px;
}
.sns-avatar { width: 30px; height: 30px; }
.sns-username {
    font-family: 'NanumSquareRound', sans-serif !important;
    font-size: var(--fs-18);
    font-weight: 700;
    color: #000;
}

.sns-img-wrapper { width: 100%; margin-bottom: 12px; padding: 0 20px; }
.sns-img { width: 100%; /*max-width: 600px;*/ height: auto; display: block; }

.sns-interactions {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
    padding: 0 20px;
}
.sns-icon-group {
    display: flex;
    align-items: center;
    gap: 5px;
    font-family: 'NanumSquareRound', sans-serif !important;
    font-size: var(--fs-16);
    font-weight: 400;
    color: #000;
}
.sns-icon { width: auto; height: 18px; }

.sns-text {
    font-family: 'Noto Serif KR', serif !important;
    font-size: var(--fs-18);
    line-height: 1.6;
    color: #000;
    margin-bottom: 35px;
    padding: 0 20px;
}

.sns-hashtags-box { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 20px; }
.sns-hashtag { font-size: var(--fs-16); color: #000; font-weight: 500; }