@charset "utf-8";
/* =====================================================================
 * ive-board.css — 게시판/서브페이지 디자인 시스템 오버레이(NASS)
 * 그누보드 기본 게시판 마크업(#bo_list/#bo_v/#bo_w/.pg ...) 위에 얹혀
 * 색상·폰트·버튼·간격을 메인과 통일. (기능은 basic 스킨 그대로 유지)
 * add_stylesheet 로 스킨 style.css 이후(order 100) 로드되어 오버라이드.
 * ===================================================================== */

/* ---- 서브 레이아웃 컨테이너 ---- */
/* gnuboard 기본 default.css 는 미디어쿼리가 없어 #wrapper{min-width:1200}·#container{float:left;width:930} 로
 * 서브페이지가 비반응형이 됨 → ive 서브페이지는 유동·중앙정렬로 교정(단일반응형 규칙). */
#wrapper.ive { min-width: 0; }
/* 오프캔버스 모바일 메뉴(.ive-gnb-mobile, translateX(100%))가 뷰포트 밖으로 나가며
 * 가로 스크롤을 유발 → 메뉴가 존재하는 ≤1024 구간에서만 가로 오버플로 차단 */
@media (max-width: 1024px) { html, body { overflow-x: hidden; } #hd, #ft, #wrapper { min-width: 0 !important; } }
#wrapper.ive #container_wr { width: auto; max-width: calc(var(--ive-container) + var(--ive-container-pad) * 2); margin-inline: auto; padding: clamp(30px, 4vw, 60px) var(--ive-container-pad) clamp(60px, 8vw, 120px); }
#wrapper.ive #container { float: none; width: auto; margin: 0; min-height: 0; font-family: var(--ive-font-family); color: var(--ive-color-text); }
#wrapper.ive #aside { display: none; } /* 서브페이지 사이드(외부로그인/설문) 숨김 — 클린 레이아웃 */
#container_title { font-size: clamp(24px, 2.4vw, 36px); font-weight: 800; letter-spacing: -0.02em; margin-bottom: clamp(24px, 3vw, 40px); }

/* ---- 서브페이지 공통 상단(라이트 히어로 + 중앙 브레드크럼/타이틀 + LNB 서브메뉴) — Figma 5660:3106 ---- */
.ive-subhead { position: relative; width: 100%; border-bottom: 1px solid #DFDFDF; background: linear-gradient(180deg, rgba(45, 69, 87, 0.05) 0%, rgba(45, 69, 87, 0.00) 100%); }
.ive-subhead--hasnav { margin-bottom: 34px; } /* 하단 pill 이 밴드 밖으로 30px 걸쳐 본문과 겹치지 않게 확보 */
.ive-subhead__inner { box-sizing: border-box; min-height: 240px; max-width: calc(var(--ive-container) + var(--ive-container-pad) * 2); margin-inline: auto; padding: 72px var(--ive-container-pad) 44px; display: flex; flex-direction: column; align-items: center; gap: 30px; }
.ive-subhead__crumbs { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; font-size: 15px; font-weight: 400; line-height: 1.2; color: #37546b; letter-spacing: -0.01em; }
.ive-subhead__crumbs a, .ive-subhead__crumbs .cur, .ive-subhead__crumbs span { color: #37546b; text-decoration: none; }
.ive-subhead__crumbs a:hover { text-decoration: underline; }
.ive-subhead__sep { width: 6px; height: 6px; border-right: 1.5px solid #37546b; border-bottom: 1.5px solid #37546b; transform: rotate(-45deg); opacity: 0.7; }
.ive-subhead__title { margin: 0; font-size: 40px; font-weight: 600; line-height: 1.2; letter-spacing: -0.02em; color: #0d171f; text-align: center; word-break: keep-all; }
/* LNB 서브메뉴(흰 pill, 밴드 하단 중앙에 걸침) */
.ive-subhead__nav { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 50%); z-index: 2; max-width: calc(100% - var(--ive-container-pad) * 2); }
.ive-subhead__nav ul { display: flex; align-items: center; gap: 40px; margin: 0; padding: 0 clamp(30px, 4vw, 56px); height: 60px; list-style: none; background: #fff; border: 1px solid #f2f7fd; border-radius: 50px; box-shadow: 0 4px 20px rgba(0,0,0,0.08); }
.ive-subhead__nav li { flex-shrink: 0; }
.ive-subhead__nav a { display: inline-flex; align-items: center; height: 60px; font-size: 18px; font-weight: 500; line-height: 1.3; letter-spacing: -0.02em; color: #7d7d7d; text-decoration: none; white-space: nowrap; transition: color .2s var(--ive-ease); }
.ive-subhead__nav li.is-active a { color: #111; }
.ive-subhead__nav a:hover { color: var(--ive-color-navy); }
.ive-subhead__nav a:focus-visible { outline: 2px solid var(--ive-color-slate); outline-offset: 3px; border-radius: 4px; }

@media (max-width: 1024px) {
    .ive-subhead__inner { min-height: 200px; padding-top: 56px; padding-bottom: 40px; gap: 22px; }
    .ive-subhead__title { font-size: 32px; }
    .ive-subhead__nav ul { height: 54px; gap: 28px; }
    .ive-subhead__nav a { height: 54px; font-size: 16px; }
}
@media (max-width: 768px) {
    .ive-subhead--hasnav { margin-bottom: 28px; }
    .ive-subhead__inner { min-height: 150px; padding: 34px var(--ive-container-pad) 34px; gap: 12px; }
    .ive-subhead__title { font-size: 26px; }
    .ive-subhead__crumbs { font-size: 13px; }
    /* 모바일: pill 을 컨테이너 폭으로 두고 항목 가로 스크롤(가로 오버플로 방지) */
    .ive-subhead__nav { left: var(--ive-container-pad); right: var(--ive-container-pad); transform: translateY(50%); max-width: none; }
    .ive-subhead__nav ul { height: 48px; gap: 22px; padding: 0 20px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; overscroll-behavior-inline: contain; justify-content: flex-start; }
    .ive-subhead__nav ul::-webkit-scrollbar { display: none; }
    .ive-subhead__nav a { height: 48px; font-size: 15px; }
}

/* ---- 카테고리(분류) ---- */
#bo_cate ul { gap: 8px; }
#bo_cate a { border: 1px solid var(--ive-color-border); border-radius: var(--ive-radius-pill); color: var(--ive-color-text-2); }
#bo_cate a:hover, #bo_cate_on, #bo_cate a#bo_cate_on { background: var(--ive-color-navy) !important; border-color: var(--ive-color-navy) !important; color: #fff !important; }

/* ---- 목록 테이블 ---- */
.tbl_head01 { border-top: 2px solid var(--ive-color-navy); }
.tbl_head01 thead th { background: var(--ive-color-bg-soft); color: var(--ive-color-text-2); font-weight: 600; border-bottom: 1px solid var(--ive-color-border); }
.bo_tit a, .bo_subject a, td.td_subject a { color: var(--ive-color-text); }
.bo_tit a:hover, .bo_subject a:hover { color: var(--ive-color-navy); text-decoration: underline; }
.bo_notice, tr.bo_notice td { background: var(--ive-color-bg-soft); }
.new_icon, .bo_icon_new { background: var(--ive-color-new); color: #fff; border-radius: 3px; }

/* ---- 게시판 상단/하단 아이콘 툴바(설정·검색·글쓰기·옵션) : 균일한 정사각 아웃라인 ---- */
.btn_bo_user { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; list-style: none; margin: 0; padding: 0; }
.btn_bo_user li { margin: 0; list-style: none; float: none; width: auto; } /* 스킨 기본 li{width:40px;float:left} 무력화 → 글쓰기 등 넓은 버튼 우측 오버플로 방지 */
.btn_bo_user .btn {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 42px; height: 42px; padding: 0 12px; margin: 0;
    border: 1px solid var(--ive-color-border) !important; border-radius: 8px !important;
    background: #fff !important; color: var(--ive-color-text-2) !important;
    font-size: 14px; line-height: 1; text-decoration: none; cursor: pointer;
    transition: background-color .2s, color .2s, border-color .2s;
}
.btn_bo_user .btn:hover { border-color: var(--ive-color-navy) !important; color: var(--ive-color-navy) !important; background: #fff !important; }
.btn_bo_user .btn i { margin: 0; }
.btn_admin.btn .fa-spin { animation: none; } /* 관리자 톱니 회전 제거 */

/* ---- 텍스트 버튼(목록/수정/삭제/답변 등) : 아웃라인 ---- */
.btn_b01, .btn_b02, .btn_b03, .btn_admin, .btn_confirm, .btn_frmline,
#bo_v_act a, .bo_v_com a, a.btn01, input.btn01 {
    display: inline-flex; align-items: center; justify-content: center; gap: 5px;
    min-height: 42px; padding: 9px 18px; border-radius: 8px; margin: 2px;
    font-family: inherit; font-size: 14px; font-weight: 500; line-height: 1.2; cursor: pointer;
    border: 1px solid var(--ive-color-border); background: #fff; color: var(--ive-color-text-2);
    transition: background-color .2s, color .2s, border-color .2s; text-decoration: none; vertical-align: middle;
}
.btn_b01:hover, .btn_b02:hover, .btn_admin:hover, .btn_confirm:hover, #bo_v_act a:hover, a.btn01:hover {
    border-color: var(--ive-color-navy); color: var(--ive-color-navy);
}
/* ---- 폼 전송(작성완료/수정완료/검색실행) : 네이비 solid ---- */
input[type="submit"], .btn_submit, input.btn_submit, button.btn_submit, a.btn_submit, #btn_submit {
    display: inline-flex; align-items: center; justify-content: center; gap: 5px;
    min-height: 48px; padding: 12px 28px; border-radius: 8px; margin: 2px;
    font-family: inherit; font-size: 15px; font-weight: 600; line-height: 1.2; cursor: pointer;
    background: var(--ive-color-navy); color: #fff; border: 1px solid var(--ive-color-navy);
    transition: background-color .2s, border-color .2s; text-decoration: none; white-space: nowrap;
}
input[type="submit"]:hover, .btn_submit:hover, input.btn_submit:hover, button.btn_submit:hover { background: var(--ive-color-slate); border-color: var(--ive-color-slate); color: #fff; }
.btn_cancel, a.btn_cancel { background: #fff !important; color: var(--ive-color-text-2) !important; border-color: var(--ive-color-border) !important; }

/* ---- 관리 옵션 드롭다운(수정/삭제/복사/이동, 선택삭제 등) : 일반 메뉴 항목 ---- */
.more_opt { min-width: 105px; border-color: var(--ive-color-border) !important; border-radius: 8px; overflow: hidden; box-shadow: 0 8px 20px rgba(13,23,31,0.1); }
.more_opt li { width: auto !important; float: none !important; margin: 0 !important; padding: 0 !important; list-style: none; text-align: left; border-bottom: 1px solid var(--ive-color-border-2) !important; }
.more_opt li:last-child { border-bottom: 0 !important; }
.more_opt li a, .more_opt li button {
    display: flex !important; align-items: center; justify-content: space-between; gap: 10px;
    width: 100% !important; min-width: 0 !important; min-height: 0 !important; height: auto !important;
    margin: 0 !important; padding: 13px 16px !important; border: 0 !important; border-radius: 0 !important;
    background: #fff !important; color: var(--ive-color-text-2) !important;
    font-family: inherit; font-size: 14px; font-weight: 400 !important; line-height: 1.2; white-space: nowrap !important;
    text-align: left; cursor: pointer;
}
.more_opt li a:hover, .more_opt li button:hover { background: var(--ive-color-bg-soft) !important; color: var(--ive-color-navy) !important; }
.more_opt li i { float: none !important; }

/* ---- 페이징 ---- */
.pg_wrap { margin-top: 30px; }
.pg a.pg_page, .pg strong.pg_current, .pg span.pg_page { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; border-radius: var(--ive-radius-sm); border: 1px solid var(--ive-color-border); color: var(--ive-color-text-2); background: #fff; margin: 0 2px; }
.pg strong.pg_current { background: var(--ive-color-navy) !important; border-color: var(--ive-color-navy) !important; color: #fff !important; }
.pg a.pg_page:hover { border-color: var(--ive-color-navy); color: var(--ive-color-navy); }

/* ---- 검색 ---- */
#bo_sch input[type=text], #bo_sch select, .bo_sch_wrap input[type=text] { height: 44px; border: 1px solid var(--ive-color-border); border-radius: var(--ive-radius-sm); padding: 0 14px; }

/* ---- 게시글 보기 ---- */
#bo_v { border-top: 2px solid var(--ive-color-navy); }
#bo_v_title, .bo_v_tit {    margin: 20px 0 20px; font-size: clamp(22px, 2vw, 30px) !important; font-weight: 700; letter-spacing: -0.02em; line-height: 1.4; }
#bo_v_info { color: var(--ive-color-muted); border-bottom: 1px solid var(--ive-color-border-2); }
#bo_v_con { font-size: 16px; line-height: 1.8; color: var(--ive-color-text-2); padding: 40px 0; min-height: 200px; }
#bo_v_con img { max-width: 100%; height: auto; }
#bo_v_file .bo_v_file_cnt, #bo_v_file ul { border: 1px solid var(--ive-color-border-2); border-radius: var(--ive-radius); }
#bo_v_file a { color: var(--ive-color-navy); }
/* 이전/다음 글 */
.bo_v_nb, #bo_v_bot .bo_v_nb { border-top: 1px solid var(--ive-color-border-2); }
.bo_v_nb a { color: var(--ive-color-text-2); }
.bo_v_nb a:hover { color: var(--ive-color-navy); }

/* ---- 댓글 ---- */
#bo_vc { border-top: 1px solid var(--ive-color-border-2); }
#bo_vc h2, #bo_vc_win h2 { font-size: 18px; font-weight: 700; }
#bo_vc textarea { border: 1px solid var(--ive-color-border); border-radius: var(--ive-radius-sm); }

/* ---- 글쓰기/폼 ---- */
#bo_w .frm_input, #bo_w input[type=text], #bo_w input[type=password], #bo_w select, #bo_w textarea,
.write_div .frm_input, .frm_input {
    border: 1px solid var(--ive-color-border); border-radius: var(--ive-radius-sm);
    font-family: inherit; min-height: 44px; padding: 8px 14px;
}
#bo_w .frm_input:focus, .frm_input:focus, #bo_w textarea:focus, #bo_w select:focus {
    outline: none; border-color: var(--ive-color-slate); box-shadow: 0 0 0 3px rgba(45, 69, 87, 0.12);
}
.bo_w_extra label, .write_div > label { font-weight: 600; color: var(--ive-color-text-2); }
.bo_w_extra { margin-bottom: 6px; }
.bo_w_extra select.frm_input { min-width: 140px; }
.bo_w_extra_help { font-size: 13px; color: var(--ive-color-muted); margin: 2px 0 18px; }
/*.required, .frm_required { color: var(--ive-color-new); }*/

/* =====================================================================
 * NASS 리스트형 게시판 (.nb-board) — Figma 5627:625 실측 기준
 *   적용 대상: 공지사항(notice) · hero 스킨만.
 *   컬럼: No · 제목 · 작성자 · 등록일 (조회수 미노출)
 *   측정값: 콘텐츠폭 1364 / 헤더행 50 / 게시글행 60 / 상단바→목록 30 /
 *           목록→페이징 60 / 좌우패딩 60 / 구분선 1px #e0e0e0 / 상단강조 2px 네이비
 * ===================================================================== */
.nb-board {
    --nb-pad-x: clamp(20px, 4vw, 60px);   /* 행 좌우 패딩 (Figma 60) */
    max-width: 1364px;                    /* Figma 콘텐츠 컬럼 폭 */
    width: 100% !important;               /* 스킨 인라인 width 무시(반응형) */
    margin-inline: auto;
    box-sizing: border-box;
    font-family: var(--ive-font-family);
    color: var(--ive-color-text);
}
.nb-board * { box-sizing: border-box; }

/* ---- 상단바: 총건수 + 검색 (Figma 5627:1257, gap 30 → 목록) ---- */
.nb-list__top { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 30px; }
.nb-list__count { margin: 0; font-size: 16px; font-weight: 400; line-height: 1.4; color: var(--ive-color-text); letter-spacing: -0.01em; }
.nb-list__count b { font-weight: 500; }
.nb-list__bar { margin: 0 6px; color: var(--ive-color-border); }

/* 검색: 둥근 입력창 + 돋보기 (Figma 272×40, radius 20, bg #f4f4f4) */
.nb-search { position: relative; flex-shrink: 0; width: 272px; max-width: 100%; height: 40px; }
.nb-search__input {
    width: 100%; height: 40px; margin: 0;
    padding: 0 48px 0 27px;
    border: 0; border-radius: 20px; background: #f4f4f4;
    font-family: inherit; font-size: 16px; color: var(--ive-color-text); line-height: 40px;
    -webkit-appearance: none; appearance: none;
}
.nb-search__input::placeholder { color: #8e8e8e; }
.nb-search__input:focus { outline: none; box-shadow: 0 0 0 2px var(--ive-color-slate); }
.nb-search__btn {
    position: absolute; top: 50%; right: 21px; transform: translateY(-50%);
    width: 24px; height: 24px; padding: 0; margin: 0;
    border: 0; background: none; color: #1f1f1f; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
}
.nb-search__btn svg { width: 24px; height: 24px; display: block; }

/* ---- 목록 테이블 (Figma 5627:666) ---- */
.nb-list__table { width: 100%; }
.nb-table { table-layout: fixed; width: 100%; border-collapse: collapse; border-top: 2px solid var(--ive-color-navy); }
.nb-col-chk { width: 54px; }
.nb-col-no { width: 160px; }
.nb-col-subject { width: auto; }
.nb-col-writer { width: 140px; }
.nb-col-date { width: 150px; }

.nb-table th, .nb-table td { padding: 0 12px; vertical-align: middle; letter-spacing: -0.02em; }
.nb-table th:first-child, .nb-table td:first-child { text-align:center}
.nb-table th:last-child,  .nb-table td:last-child  { text-align:center }

/* 헤더행: 높이 50, bg #f8f8f8, 18px #2c2c2c */
.nb-table thead th { height: 50px; background: #f8f8f8; font-size: 18px; font-weight: 500; color: #2c2c2c; }
.nb-table thead .nb-c-no {  font-weight: 400; }
.nb-table thead .nb-c-subject { text-align: center; }
.nb-table thead .nb-c-writer { text-align: center; }
.nb-table thead .nb-c-date {  }

/* 게시글행: 높이 60, 하단 구분선 1px #e0e0e0 */
.nb-table tbody tr { border-bottom: 1px solid #e0e0e0; transition: background-color .18s var(--ive-ease); }
.nb-table tbody tr:hover { background: #fafafa; }
.nb-table tbody td { height: 60px; font-weight: 400; }

.nb-c-no { text-align: left; font-size: 18px; color: #555; }
.nb-c-writer { text-align: center; font-size: 16px; color: #222; }
.nb-c-date { text-align: right; font-size: 15px; color: #555; white-space: nowrap; }
.nb-current { color: var(--ive-color-new); font-weight: 500; }
.nb-notice { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; padding: 3px 10px; border-radius: 4px; background: var(--ive-color-navy); color: #fff; font-size: 13px; font-weight: 700; line-height: 1; }

/* 제목: 20px #111, 한 줄 말줄임 */
.nb-c-subject { overflow: hidden; }
.nb-subject { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 20px; color: var(--ive-color-text); text-decoration: none; }
.nb-subject__txt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nb-subject:hover .nb-subject__txt { color: var(--ive-color-navy); text-decoration: underline; }
.nb-tr.is-notice .nb-subject { font-weight: 700; }
.nb-new { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; min-width: 17px; height: 17px; padding: 0 3px; border-radius: 3px; background: var(--ive-color-new); color: #fff; font-size: 11px; font-weight: 700; line-height: 1; }
.nb-cmt { flex-shrink: 0; margin-left: 2px; padding: 0 6px; height: 18px; display: inline-flex; align-items: center; border-radius: 3px; background: var(--ive-color-bg-soft); color: var(--ive-color-slate); font-size: 12px; }
.nb-subject img { margin: 0; vertical-align: middle; }

/* 체크박스 컬럼(관리자 옵션 사용 시) — Figma 에 없는 관리 UI라 좌측 여백만 살짝 두고 정렬 */
.nb-col-chk { width: 56px; }
.nb-c-chk { position: relative; text-align: center; }
/* 첫 셀(60px) 패딩이 좁은 체크박스 컬럼을 밀어붙이는 문제 → 전용 패딩으로 교정 */
.nb-table th.nb-c-chk, .nb-table td.nb-c-chk { padding-left: 20px; padding-right: 4px; }
.nb-c-chk .selec_chk { position: absolute; width: 0; height: 0; opacity: 0; }
.nb-c-chk label { display: inline-block; line-height: 0; cursor: pointer; }
.nb-c-chk label span { position: relative; display: inline-block; width: 18px; height: 18px; border: 1px solid var(--ive-color-border); border-radius: 4px; background: #fff; vertical-align: middle; transition: background-color .15s, border-color .15s; }
.nb-c-chk .selec_chk:checked + label span { background: var(--ive-color-navy); border-color: var(--ive-color-navy); }
.nb-c-chk .selec_chk:checked + label span::after { content: ""; position: absolute; left: 6px; top: 2px; width: 4px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.nb-c-chk .selec_chk:focus-visible + label span { outline: 2px solid var(--ive-color-slate); outline-offset: 2px; }

/* 빈 목록 */
.nb-empty { height: 180px; text-align: center; color: var(--ive-color-muted); font-size: 16px; border-bottom: 1px solid #e0e0e0; }

/* 관리자 일괄옵션 / 글쓰기 버튼 */
.nb-list__bulk { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.nb-list__foot { display: flex; justify-content: flex-end; margin-top: 24px; }
.nb-btn-write { font-weight: 600; }

/* ---- 페이지네이션 (Figma 5627:777) : 박스 없는 숫자 + 좌우 화살표 ---- */
.nb-list__paging { margin-top: 60px; }
.nb-board .pg_wrap { margin: 0; text-align: center; width: 100%;}
.nb-board .pg { display: inline-flex; align-items: center; gap: 20px; }
.nb-board .pg a.pg_page, .nb-board .pg strong.pg_current, .nb-board .pg span.pg_page {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: auto; height: auto; margin: 0; padding: 0;
    border: 0 !important; background: none !important; border-radius: 0 !important;
    font-size: 20px; font-weight: 400; line-height: 1.4; letter-spacing: -0.02em; color: #969696;
}
.nb-board .pg strong.pg_current { background: none !important; color: #2c2c2c !important; }
.nb-board .pg a.pg_page:hover { color: var(--ive-color-navy); }
.nb-board .pg a.pg_start, .nb-board .pg a.pg_prev, .nb-board .pg a.pg_next, .nb-board .pg a.pg_end {
    width: 22px; height: 22px; font-size: 20px; color: #2c2c2c;
}
.nb-board .pg a.pg_prev, .nb-board .pg a.pg_start { margin-right: 20px; }
.nb-board .pg a.pg_next, .nb-board .pg a.pg_end { margin-left: 20px; }

/* ---- 반응형 (프로젝트 기존 breakpoint: 1024 / 768) ---- */
@media (max-width: 1024px) {
    .nb-table thead th { font-size: 16px; }
    .nb-subject { font-size: 17px; }
    .nb-col-no { width: 96px; }
    .nb-col-writer { width: 110px; }
    .nb-col-date { width: 120px; }
}
@media (max-width: 768px) {
    /* 상단바: 세로 스택, 검색 전체폭 */
    .nb-list__top { flex-direction: column; align-items: stretch; gap: 12px; margin-bottom: 20px; }
    .nb-search { width: 100%; }
    /* 모바일: 표 → 블록 카드행(제목 위 / 작성자·날짜 아래). 번호·체크박스 숨김, 가로스크롤 없음 */
    .nb-table { display: block; width: 100%; table-layout: auto; }
    .nb-table colgroup { display: none; }
    .nb-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } /* 헤더 숨김(스크린리더 유지) */
    .nb-table tbody, .nb-table tr, .nb-table td { display: block; width: 100%; }
    .nb-table tbody td { height: auto; padding: 0; }
    .nb-tr { padding: 16px var(--nb-pad-x); }
    .nb-table tbody td.nb-c-chk, .nb-table tbody td.nb-c-no { display: none; }
    .nb-c-subject { overflow: hidden; }
    .nb-subject { font-size: 16px; }
    .nb-subject__txt { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; word-break: keep-all; overflow-wrap: break-word; }
    /* 모바일: 작성자 숨김(전 게시판 공통) → 날짜만 노출 */
    .nb-table tbody td.nb-c-writer { display: none; }
    .nb-c-date { display: inline-block; margin-top: 6px; text-align: left; font-size: 13px; color: var(--ive-color-muted); }
    /* 하단 버튼: 콘텐츠(카드/표) 가장자리에 정렬(=뷰포트에서 20px). li 오버플로 수정으로 우측 여백 확보됨 */
    .nb-list__foot { padding-inline: 0; }
    .nb-list__bulk { padding-inline: 0; }
    .nb-list__paging { margin-top: 40px; }
    .nb-board .pg { gap: 14px; }
    .nb-board .pg a.pg_page, .nb-board .pg strong.pg_current { font-size: 17px; }
    .nb-board .pg a.pg_prev, .nb-board .pg a.pg_start { margin-right: 12px; }
    .nb-board .pg a.pg_next, .nb-board .pg a.pg_end { margin-left: 12px; }
}

/* =====================================================================
 * NAS 갤러리(카드 그리드)형 게시판 (.nb-grid) — Figma Press 5635:734 /
 *   NAS 5640:1608 / Video 5627:1325 실측
 *   3열 그리드 · press(테두리+배지, 썸네일 387:154) · nas/video(보더리스 16:9)
 * ===================================================================== */
.nb-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); }
.nb-grid--press { gap: 30px 40px; }        /* Figma: 행 30 / 열 40 */
.nb-grid--nas, .nb-grid--video { gap: 30px 26px; } /* Figma: 행 30 / 열 26 */
.nb-board--press { max-width: 1391px; }          /* Figma press: 3x437 + 2x40 */
.nb-board--grid .nb-list__paging { margin-top: 40px; } /* Figma 그리드 목록→페이징 */
.nb-card { position: relative; min-width: 0; }
.nb-card__link { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; }
.nb-card__thumb { position: relative; overflow: hidden; background: var(--ive-color-bg-soft); }
.nb-card__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s var(--ive-ease); object-position: center top;}
.nb-card__link:hover .nb-card__thumb img { transform: scale(1.04); }
.nb-card__thumb.is-empty { background: linear-gradient(135deg, #eef1f4, #d6dde3); }
.nb-card__body { display: flex; flex-direction: column; gap: 10px; }
.nb-card__badge { align-self: flex-start; display: inline-flex; align-items: center; justify-content: center; min-width: 55px; height: 20px; padding: 0 10px; border-radius: 40px; background: var(--ive-color-navy); color: #fff; font-size: 14px; line-height: 1; }
.nb-card__title { font-size: 18px; font-weight: 600; line-height: 1.4; color: var(--ive-color-text); letter-spacing: -0.02em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nb-card__link:hover .nb-card__title { color: var(--ive-color-navy); }
.nb-card__date { font-size: 14px; color: #8e8e8e; }
.nb-card__new { font-style: normal; margin-left: 4px; color: var(--ive-color-new); font-weight: 700; }
.nb-card__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.nb-card__play svg { width: clamp(44px, 4vw, 58px); height: auto; filter: drop-shadow(0 2px 6px rgba(0,0,0,.3)); transition: transform .3s var(--ive-ease); }
.nb-card__link:hover .nb-card__play svg { transform: scale(1.08); }

/* press: 상단4px 네이비 + 1px 회색 테두리, 하단라운드10, 패딩25, 썸네일 387:154 */
.nb-grid--press .nb-card__link { border: 1px solid #d7d7d7; border-top: 4px solid var(--ive-color-navy); border-radius: 0 0 10px 10px; padding: 25px; gap: 15px; }
.nb-grid--press .nb-card__thumb { aspect-ratio: 387 / 216; }
/* nas/video: 보더리스, 썸네일 16:9 */
.nb-grid--nas .nb-card__link, .nb-grid--video .nb-card__link { gap: 15px; }
.nb-grid--nas .nb-card__thumb { aspect-ratio: 1 / 1; border-radius: 10px; }
.nb-grid--video .nb-card__thumb { aspect-ratio: 16 / 9; border-radius: 10px; }

/* 관리자 체크박스 오버레이(카드 좌상단) */
.nb-card__chk { position: absolute; top: 12px; left: 12px; z-index: 3; }
.nb-grid--press .nb-card__chk { top: 37px; left: 37px; }
.nb-card__chk .selec_chk { position: absolute; width: 0; height: 0; opacity: 0; }
.nb-card__chk label { display: inline-block; line-height: 0; cursor: pointer; }
.nb-card__chk label span { position: relative; display: inline-block; width: 22px; height: 22px; border: 1px solid #fff; border-radius: 4px; background: rgba(0,0,0,0.35); vertical-align: middle; }
.nb-card__chk .selec_chk:checked + label span { background: var(--ive-color-navy); border-color: var(--ive-color-navy); }
.nb-card__chk .selec_chk:checked + label span::after { content: ""; position: absolute; left: 7px; top: 3px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.nb-card__chk .selec_chk:focus-visible + label span { outline: 2px solid var(--ive-color-slate); outline-offset: 2px; }

.nb-grid__empty { padding: 90px 0; text-align: center; color: var(--ive-color-muted); font-size: 16px; border-top: 2px solid var(--ive-color-navy); }

/* --- 갤러리 반응형 (Figma 모바일 프레임 없음 → 프로젝트 breakpoint 1024/768) --- */
@media (max-width: 1024px) {
    .nb-grid { grid-template-columns: repeat(2, 1fr); }
    .nb-grid--press { gap: 26px 26px; }
    .nb-grid--nas, .nb-grid--video { gap: 26px 20px; }
    .nb-card__title { font-size: 17px; }
}
@media (max-width: 768px) {
    .nb-grid { grid-template-columns: 1fr; gap: 24px; }
    .nb-grid--press .nb-card__link { padding: 18px; }
    .nb-grid--press .nb-card__chk { top: 28px; left: 28px; }
    .nb-card__title { font-size: 16px; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; }
}

/* =====================================================================
 * NAS 비급여 안내 가격표 (.nb-price) — Figma 5643:7584 실측
 *   분류별 3열 표(항목·가격/단위·비고/가격) 전부 중앙정렬, 헤더50·행60
 *   .nb-table 을 쓰지 않으므로 모바일에서도 표 레이아웃 유지(블록전환 X)
 * ===================================================================== */
.nb-price__section + .nb-price__section { margin-top: 0; }
.nb-price { --nb-pad-x: clamp(16px, 3vw, 60px); table-layout: fixed; width: 100%; border-collapse: collapse; border-top: 2px solid var(--ive-color-navy); font-family: var(--ive-font-family); }
.nb-price col.nb-col-chk { width: 56px; }
.nb-price col.nb-pc-1 { width: 30%; }
.nb-price col.nb-pc-2 { width: 40%; }
.nb-price col.nb-pc-3 { width: 30%; }
.nb-price th, .nb-price td { padding: 0 12px; text-align: center; vertical-align: middle; letter-spacing: -0.02em; }
.nb-price th:first-child, .nb-price td:first-child { padding-left: var(--nb-pad-x); }
.nb-price th:last-child, .nb-price td:last-child { padding-right: var(--nb-pad-x); }
.nb-price thead th { height: 50px; background: #f8f8f8; font-size: 18px; font-weight: 500; color: #2c2c2c; }
.nb-price thead .nb-pc-1 { font-weight: 400; }
.nb-price tbody tr { border-bottom: 1px solid #e0e0e0; }
.nb-price tbody tr:first-child { border-top: 1px solid #e0e0e0; }
.nb-price tbody td { height: 50px; font-size: 20px; font-weight: 400; word-break: keep-all; }
.nb-price td.nb-pc-1 { color: #555; }
.nb-price td.nb-pc-2 { color: var(--ive-color-text); }
.nb-price td.nb-pc-3 { color: #222; }
.nb-price__item { color: inherit; text-decoration: none; }
.nb-price__item:hover { color: var(--ive-color-navy); text-decoration: underline; }
/* 체크박스 컬럼(관리자) */
.nb-price th.nb-c-chk, .nb-price td.nb-c-chk { padding-left: 20px; padding-right: 4px; }

@media (max-width: 1024px) {
    .nb-price thead th { font-size: 16px; }
    .nb-price tbody td { font-size: 17px; }
}
@media (max-width: 768px) {
    /* 모바일: 컨테이너를 뷰포트 폭으로 강제(기본 스킨 #container float/930px 잔재 차단) */
    #wrapper.ive #container { float: none !important; width: 100% !important; }
    #wrapper.ive #container_wr { overflow-x: hidden; }
    .nb-price__section + .nb-price__section { margin-top: 24px; }
    .nb-price__section { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .nb-price { --nb-pad-x: 10px; min-width: 0; }
    .nb-price col.nb-pc-1 { width: 30%; } .nb-price col.nb-pc-2 { width: 32%; } .nb-price col.nb-pc-3 { width: 38%; }
    .nb-price th, .nb-price td { padding: 0 4px; }
    .nb-price thead th { height: 44px; font-size: 12px; white-space: normal; }
    .nb-price tbody td { height: auto; padding-top: 13px; padding-bottom: 13px; font-size: 11px; line-height: 1.35; white-space: normal; word-break: break-word; overflow-wrap: anywhere; }
    .nb-price td.nb-pc-2 { font-weight: 500; }
}

/* =====================================================================
 * equip 갤러리(2열 장비카드) — Figma 5627:1074 실측
 *   카드 671x422 / bg #eff0f1 / radius 15 / 좌 라벨(18 #2d4557)+장비명(30 #0d171f)
 *   우 원(399, 라이트 그라디언트)+장비이미지 / 좌하단 + 버튼(45) / 2열 gap 20
 * ===================================================================== */
.nb-grid--equip { grid-template-columns: repeat(2, 1fr); gap: 20px; }
.nb-card--equip .nb-card__link { position: relative; display: block; aspect-ratio: 671 / 422; background: #eff0f1; border-radius: 15px; overflow: hidden; }
/* 우측: 원 + 장비 이미지 */
.nb-card--equip .nb-card__figure { position: absolute; inset: 0; z-index: 0; }
.nb-card--equip .nb-card__circle { position: absolute;     left: 43.4%;    top: 29%; width: 59.5%; aspect-ratio: 1 / 1; border-radius: 50%; background: linear-gradient(180deg, #ffffff 0%, #eff0f1 71.68%); }
.nb-card--equip .nb-card__eimg { position: absolute; right: 2%; bottom: 0%; height: 74%; object-fit: contain; object-position: center bottom; transition: transform .4s var(--ive-ease); }
.nb-card--equip .nb-card__link:hover .nb-card__eimg { transform: scale(1.03); }
/* 좌측: 라벨 + 장비명 */
.nb-card--equip .nb-card__meta { position: absolute; left: 7.3%; top: 13.4%; right: 38%; z-index: 1; display: flex; flex-direction: column; gap: clamp(12px, 1.6vw, 20px); text-transform: uppercase; }
.nb-card--equip .nb-card__elabel { font-size: clamp(14px, 1.4vw, 18px); font-weight: 500; color: #2d4557; line-height: 1.4; letter-spacing: -0.02em; }
.nb-card--equip .nb-card__ename { font-size: clamp(20px, 2.6vw, 30px); font-weight: 600; color: #0d171f; line-height: 1.25; letter-spacing: -0.02em; word-break: keep-all; }
/* 좌하단 + 버튼 */
.nb-card--equip .nb-card__plus { position: absolute; left: 7.3%; bottom: 10.4%; z-index: 1; width: clamp(38px, 3.4vw, 45px); height: clamp(38px, 3.4vw, 45px); border-radius: 50%; background: #fff; color: #0d171f; display: grid; place-items: center; box-shadow: 0 1px 9px rgba(0,0,0,0.14); transition: background-color .2s, color .2s; }
.nb-card--equip .nb-card__link:hover .nb-card__plus { background: var(--ive-color-navy); color: #fff; }
.nb-card--equip .nb-card__link:focus-visible { outline: 3px solid var(--ive-color-slate); outline-offset: 2px; }
/* 관리자 체크박스: 좌상단 라벨과 겹치지 않도록 우상단 배치 */
.nb-card--equip .nb-card__chk { top: 16px; right: 16px; left: auto; }
/*
.nb-grid.nb-grid--equip li.nb-card:nth-child(1) .nb-card__eimg { right:-14%; }
*/
/* 반응형 */
@media (max-width: 768px) {
    .nb-grid--equip { grid-template-columns: 1fr; gap: 16px; }
    .nb-card--equip .nb-card__ename { font-size: clamp(19px, 5.4vw, 26px); }
    .nb-card--equip .nb-card__meta { gap: 10px; }
}

/* =====================================================================
 * 보유장비 상세 팝업(모달) — 일반 사용자 클릭 시 노출
 * ===================================================================== */
.eq-modal { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: center; justify-content: center; padding: 20px; }
.eq-modal[hidden] { display: none; }
body.eq-modal-open { overflow: hidden; }
.eq-modal__overlay { position: absolute; inset: 0; background: rgba(13, 23, 31, 0.55); backdrop-filter: blur(2px); animation: eqFade .2s ease; }
.eq-modal__dialog { position: relative; z-index: 1; width: min(920px, 100%); height: 510px; background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28); animation: eqPop .28s var(--ive-ease); } /* PC: 높이 최대 510px */
.eq-modal__scroll { display: flex; height: 510px; overflow: hidden; } /* PC: 좌측 이미지 고정 · 우측 본문(.eq-modal__body)만 넘치면 스크롤 */
.eq-modal__dialog:focus { outline: none; } /* 자동 오픈 시 포커스 링(테두리) 미표시 */
.eq-modal__close { position: absolute; top: 16px; right: 20px; z-index: 2; width: 42px; height: 42px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.9); color: #0d171f; cursor: pointer; transition: background-color .2s, color .2s; border:0px !important}
.eq-modal__close:hover { background: var(--ive-color-navy); color: #fff; }
.eq-modal__close:focus-visible { outline: 3px solid var(--ive-color-slate); outline-offset: 2px; }
/* 좌측 미디어(카드와 동일한 원형 배경 + 장비 이미지) */
.eq-modal__media { flex: 0 0 46%; position: relative; background: #eff0f1; overflow: hidden; min-height: 340px; } /* 좌측 이미지 고정폭 */
.eq-modal__circle { position: absolute; left: 50%; bottom: -10%; transform: translateX(-50%); width: 78%; aspect-ratio: 1 / 1; border-radius: 50%; background: linear-gradient(180deg, #ffffff 0%, #eff0f1 72%); }
.eq-modal__img { position: absolute; left: 50%; bottom: 0%; transform: translateX(-50%);  height: 72%; object-fit: contain; object-position: center bottom; }


/* 우측 본문 */
.eq-modal__body { flex: 1 1 54%; min-width: 0; min-height: 0; overflow-y: auto; margin: 5px 5px 5px 0; padding: clamp(28px, 3.4vw, 48px); } /* 우측 본문만 스크롤 · 스크롤바 우측·상하 5px 안쪽 */
.eq-modal__label { display: inline-block; font-size: clamp(13px, 1.3vw, 16px); font-weight: 500; color: var(--ive-color-slate); letter-spacing: -0.02em; text-transform: uppercase; }
.eq-modal__title { margin: 8px 0 20px; font-size: clamp(24px, 3vw, 34px); font-weight: 700; color: #0d171f; line-height: 1.25; letter-spacing: -0.02em; text-transform: uppercase; word-break: keep-all; }
.eq-modal__title::after { content: ""; display: block; width: 46px; height: 3px; margin-top: 16px; background: var(--ive-color-navy); border-radius: 2px; }

/* 상세 본문 공통(모달 · 글뷰페이지 공용) */
.eq-detail { color: #3a4a56; font-size: clamp(15px, 1.5vw, 17px); line-height: 1.75; letter-spacing: -0.01em; word-break: keep-all; }
.eq-detail p { margin: 0 0 14px; }
.eq-detail p:last-child { margin-bottom: 0; }
.eq-detail__lead { font-size: clamp(17px, 1.7vw, 20px); font-weight: 600; color: #0d171f; line-height: 1.55; margin-bottom: 16px; }
.eq-detail__box { margin-top: 22px; padding: 22px 24px; background: #f5f7f8; border-radius: 14px; border-top: 0px solid var(--ive-color-navy); }
.eq-detail__box + .eq-detail__box { margin-top: 14px; }
.eq-detail__h { margin: 0 0 10px; font-size: clamp(16px, 1.6vw, 19px); font-weight: 700; color: var(--ive-color-navy); letter-spacing: -0.02em; }
.eq-detail__nums { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.eq-detail__nums li { display: flex; align-items: flex-start; gap: 14px; }
.eq-detail__nums p { margin: 0; padding-top: 2px; }
.eq-detail__num { flex: 0 0 auto; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--ive-color-navy); color: #fff; font-size: 13px; font-weight: 700; }

@keyframes eqFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes eqPop { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }

@media (max-width: 768px) {
    .eq-modal { padding: 16px; }
    .eq-modal__dialog { width: 100%; max-height: calc(100vh - 32px); border-radius: 16px; }
    .eq-modal__scroll { display: flex; flex-direction: column; grid-template-columns: none; max-height: calc(100vh - 32px); overflow-y: auto; } /* 모바일: 이미지+본문 통째로 스크롤 */
    .eq-modal__media { flex: 0 0 auto; min-height: 0; height: 32vh; max-height: 300px; }
    .eq-modal__body { flex: 0 0 auto; min-height: 0; overflow: visible; margin: 0; padding: 24px 20px 30px; } /* 개별 스크롤 해제 → 이미지와 함께 스크롤 */
    .eq-detail__box { padding: 18px 18px; }
}

/* =====================================================================
 * 영상 콘텐츠 재생 팝업(모달) — 일반 사용자 클릭 시 유튜브 16:9 재생
 * ===================================================================== */
.vd-modal { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: center; justify-content: center; padding: 20px; }
.vd-modal[hidden] { display: none; }
body.vd-modal-open { overflow: hidden; }
.vd-modal__overlay { position: absolute; inset: 0; background: rgba(13, 23, 31, 0.72); backdrop-filter: blur(2px); animation: eqFade .2s ease; }
.vd-modal__dialog { position: relative; z-index: 1; width: min(1000px, 100%); animation: eqPop .28s var(--ive-ease); }
.vd-modal__frame { position: relative; width: 100%; aspect-ratio: 16 / 9; background: #000; border-radius: 14px; overflow: hidden; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.4); }
.vd-modal__iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.vd-modal__close { position: absolute; top: -52px; right: 0; width: 42px; height: 42px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.16); color: #fff; cursor: pointer; transition: background-color .2s; }
.vd-modal__close:hover { background: rgba(255, 255, 255, 0.3); }
.vd-modal__close:focus-visible { outline: 3px solid var(--ive-color-slate); outline-offset: 2px; }
@media (max-width: 768px) {
    .vd-modal { padding: 16px; }
    .vd-modal__close { top: -44px; }
}

/* =====================================================================
 * 의료진 소개(doctor) — 갤러리 카드 + 프로필 팝업(모달)
 * ===================================================================== */
.nb-grid--doctor { grid-template-columns: repeat(3, 1fr); gap: clamp(20px, 2vw, 30px); }
.nb-card--doctor { position: relative; }
.nb-card--doctor .nb-card__link { display: block; text-decoration: none; }
.nb-card--doctor .nb-card__portrait {    text-align: center; display: block; position: relative; aspect-ratio: 3 / 3.5; border-radius: 14px; overflow: hidden; background: #eef0f1; }
.nb-card--doctor .nb-card__portrait img { width: 85%;  object-fit: cover; padding-top: 30px; object-position: top center; transition: transform .4s var(--ive-ease); }
.nb-card--doctor .nb-card__link:hover .nb-card__portrait img { transform: scale(1.04); }
.nb-card--doctor .nb-card__portrait.is-empty::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, #eef0f1, #dfe3e6); }
.nb-card--doctor .nb-card__meta { display: flex; flex-direction: column; gap: 4px; padding: 16px 2px 0; }
.nb-card--doctor .nb-card__docdept { font-size: clamp(13px, 1.1vw, 15px); font-weight: 500; color: var(--ive-color-slate); letter-spacing: -0.02em; }
.nb-card--doctor .nb-card__docname { font-size: clamp(20px, 1.8vw, 24px); font-weight: 700; color: #0d171f; letter-spacing: -0.02em; line-height: 1.25; }
.nb-card--doctor .nb-card__docpos { font-size: clamp(14px, 1.15vw, 16px); font-weight: 500; color: #6b7a86; letter-spacing: -0.02em; }
.nb-card--doctor .nb-card__link:focus-visible { outline: 3px solid var(--ive-color-slate); outline-offset: 3px; border-radius: 14px; }
.nb-card--doctor .nb-card__chk { top: 12px; right: 12px; left: auto; }

/* 프로필 팝업 */
.dr-modal { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: center; justify-content: center; padding: 20px; }
.dr-modal[hidden] { display: none; }
body.dr-modal-open { overflow: hidden; }
.dr-modal__overlay { position: absolute; inset: 0; background: rgba(13, 23, 31, 0.55); backdrop-filter: blur(2px); animation: eqFade .2s ease; }
.dr-modal__dialog { position: relative; z-index: 1;     width: min(1200px, 100%);  max-height: 70vh; background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,0.28); animation: eqPop .28s var(--ive-ease); }
.dr-modal__scroll { display: flex; max-height: 70vh; overflow: hidden; } /* 사진 고정 · 본문(.dr-modal__body)만 넘치면 스크롤 */
.dr-modal__dialog:focus { outline: none; } /* 자동 오픈 시 포커스 링(테두리) 미표시 */
.dr-modal__close { position: absolute; top: 16px; right: 16px; z-index: 2; width: 42px; height: 42px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255,255,255,0.9); color: #0d171f; cursor: pointer; transition: background-color .2s, color .2s; }
.dr-modal__close:hover { background: var(--ive-color-navy); color: #fff; }
.dr-modal__close:focus-visible { outline: 3px solid var(--ive-color-slate); outline-offset: 2px; }
.dr-modal__photo { flex: 0 0 42%; min-height: 0; overflow: hidden; background: #eef0f1;     display: flex;
    align-items: flex-end;     justify-content: center;
}
.dr-modal__img { width: 73%;  object-fit: cover; object-position: top center; display: block; }
.dr-modal__body { flex: 1 1 58%; min-width: 0; min-height: 0; overflow-y: auto; margin: 5px 5px 90px 0; padding: clamp(28px, 3.2vw, 48px); } /* margin: 스크롤바를 우측·상하 가장자리에서 5px 안쪽으로 */

/* 프로필 본문(모달) */
.dr-detail__eyebrow { margin: 0 0 10px; font-size: clamp(13px, 1.3vw, 15px); font-weight: 600; color: var(--ive-color-slate); letter-spacing: 0.04em; text-transform: uppercase; }
.dr-detail__name { margin: 0 0 18px; font-size: clamp(24px, 2.6vw, 32px); font-weight: 700; color: #0d171f; line-height: 1.25; letter-spacing: -0.02em; border-bottom: 1px solid #eceef0; }
.dr-detail__name .dr-detail__title { display: block; margin-top: 8px; font-size: clamp(14px, 1.3vw, 17px); font-weight: 500; color: #6b7a86; }
.dr-detail__name .dr-detail__title i { font-style: normal; margin: 0 8px; color: #c9d0d5; }
.dr-detail__headline {position: absolute; bottom:0px; left:0px;     background: var(--ive-grad-navy); width:100%; margin: 0px; padding: 20px 20px; font-size: clamp(12px, 1.2vw, 16px); font-weight: 500; color:#fff; line-height: 1.5; word-break: keep-all; text-align:center}
.dr-detail__headline b { font-weight: 700; color: var(--ive-color-navy); }
.dr-detail__career { display: flex; flex-direction: column; gap: 14px; }
.dr-detail__career ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.dr-detail__career li { position: relative; padding-left: 14px; font-size: clamp(14px, 1.2vw, 15px); line-height: 1.55; color: #52606b; word-break: keep-all; }
.dr-detail__career li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 4px; height: 4px; border-radius: 50%; background: var(--ive-color-slate); }
.dr-detail__tags { margin: 20px 0 0; font-size: clamp(13px, 1.2vw, 15px); font-weight: 500; color: var(--ive-color-slate); letter-spacing: -0.01em; word-break: keep-all; }

.dr-detail__label {font-size:18px; margin:20px 0px 0px; font-weight: 700;} 
/* 팝업 추가 내용(wr_5) — 경력(.dr-detail__career)과 동일 구조(ul>li)로 렌더링, 별도 스타일 불필요 */

/* 의료진 글뷰페이지(경력 그룹 리스트 + 추가내용) */
.dr-view__career { display: flex; flex-direction: column; gap: 18px; }
.dr-view__career ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.dr-view__career li { position: relative; padding-left: 16px; font-size: clamp(15px, 1.4vw, 16px); line-height: 1.6; color: #444; word-break: keep-all; }
.dr-view__career li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 5px; height: 5px; border-radius: 50%; background: var(--ive-color-slate); }
/* 뷰페이지 추가 내용 — 경력(.dr-view__career)과 동일 구조(ul>li), .dr-view__extra는 구분선만 담당 */
.dr-view__extra { margin-top: 28px; padding-top: 28px; border-top: 1px solid #eceef0; }

@keyframes drFade { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 1024px) {
    .nb-grid--doctor { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
.dr-detail__label {font-size:16px; margin:20px 0px 0px; font-weight: 700;} 
    .dr-modal__img {max-width: 72% !important; margin:0 auto; padding-top:50px}
    .nb-grid--doctor { grid-template-columns: repeat(1, 1fr); gap: 20px; }
    .nb-card--doctor .nb-card__meta { padding-top: 12px; }
    .dr-modal { padding: 50px 20px; }
    .dr-modal__dialog { width: 100%; max-height: calc(100vh - 100px); border-radius: 16px; }
    .dr-modal__scroll { display: flex; flex-direction: column; grid-template-columns: none; max-height: calc(100vh - 32px); overflow-y: auto; } /* 모바일: 사진+본문 통째로 스크롤 */
    .dr-modal__photo { flex: 0 0 auto; min-height: 0; }
    .dr-modal__body { flex: 0 0 auto; min-height: 0; overflow: visible; margin: 0px 0px 140px; padding: 24px 20px 30px; } /* 개별 스크롤 해제 → 이미지와 함께 스크롤 */
    .dr-detail__headline {padding:10px 20px}
}