@charset "utf-8";
/* Phosphor 아이콘 (이 스킨은 ph / ph-fill 클래스를 사용) */
@import url("https://unpkg.com/@phosphor-icons/web@2.1.1/src/regular/style.css");
@import url("https://unpkg.com/@phosphor-icons/web@2.1.1/src/fill/style.css");
/* ── 오늘의 연인 디자인 토큰 (원본은 전역 :root 의존 → 여기서 회사 팔레트로 직접 정의) ── */
:root{
  --primary:#15140f; --accent:#c9a96a; --accent-soft:#f1e7d2;
  --surface:#ffffff; --surface-alt:#f7f4ef; --surface-cool:#efe9df;
  --divider:#e8e3d8; --on-surface:#1b1813; --on-surface-alt:#756f64;
  --radius-sm:4px; --radius-md:8px; --radius-pill:999px;
  --font-display:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',system-ui,sans-serif;
  --font-kr:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',system-ui,sans-serif;
  --shadow-cyan:0 6px 20px rgba(201,169,106,.20);
  --shadow-float:0 18px 50px rgba(30,24,12,.12);
}
/* 한국어 단일 노출 — 영문 i18n 스팬 숨김 (이 사이트는 한국어만 사용) */
[data-i18n-en]{display:none !important}
/* ==========================================================================
   nol-basic / style.css  —  Norr Systems Korea Board Skin (PC)
   Aligned with NORR-DESIGN.md design tokens.

   ※ 디자인 토큰(--primary / --accent / --surface / --divider / --radius-* /
     --shadow-* / --font-display / --font-kr) 은 head.php :root 가 전역 제공.
     본 스킨은 그 토큰만 사용한다. 자체 컬러 변수 정의 금지.
   ※ 아이콘은 Phosphor (ph ph-… / ph-fill ph-…) 만 사용.
   ========================================================================== */

/* =========================================
   0. 그누보드 컨테이너 강제 정합 (head.php #wrapper:1560px override 와 일치)
   ========================================= */
#wrapper, #container, #container_title,
.twin-board-wrap, .twin-view-wrap, .twin-write-wrap, .twin-comment-wrap,
input, select, textarea, button {
    font-family: var(--font-kr) !important;
}
#wrapper { width: 100% !important; max-width: 100% !important; min-width: 100% !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; float: none !important; }
#container_wr { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 0 64px !important; box-sizing: border-box !important; float: none !important; }
#container_wr:after { content: ""; display: block; clear: both; }
/* 좌우 여백을 사이트 .wrap(max-width 1200 / padding 24px)과 일치 — 헤더·푸터와 정렬 */
#container { width: 100% !important; max-width: 1200px !important; margin: 0 auto !important; padding: 0 24px !important; box-sizing: border-box !important; float: none !important; }

#container_title {
    max-width: 100%;
    margin: 0 auto 2.5rem !important;
    padding: 0 0 1rem !important;
    font-family: var(--font-display) !important;
    font-size: clamp(1.5rem, 2.6vw, 2.2rem) !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.01em !important;
    color: var(--on-surface) !important;
    border-bottom: 1px solid var(--divider) !important;
    box-shadow: none !important;
    position: relative;
}
body[data-lang="ko"] #container_title,
#container_title { font-family: var(--font-display) !important; font-weight: 700 !important; }
/* 모바일 헤더 제목(#container_title.top) — PC 에는 .top 클래스가 없어 영향 없음 */
#container_title.top{
    font-size: 1.5rem !important;
    margin: 26px 0 1.25rem !important;   /* 헤더와 간격 확보 (모바일엔 #container_wr 패딩 미적용) */
    padding-bottom: .7rem !important;
    letter-spacing: -0.02em !important;
}
#container_title.top a{ display:none !important; }   /* 모바일 뒤로가기(<) 화살표 숨김 */
/* 모바일은 #container_wr 가 없어 하단 여백이 0 → 버튼이 푸터에 붙음. #container 에 직접 부여.
   PC 는 #container 가 #container_wr 안에 있어 이 선택자에 매칭되지 않음(모바일 전용). */
#wrapper > #container{ padding-bottom: 80px !important; }
#container_title::after {
    content: "";
    position: absolute;
    left: 0; bottom: -1px;
    width: 56px; height: 2px;
    background: var(--accent);
}
#aside { display: none !important; width: 0 !important; float: none !important; margin: 0 !important; padding: 0 !important; }

/* =========================================
   0-b. 게시판 상단 sub-hero 배너 (다른 페이지 톤 일치)
   · 마크업은 sub_hero.inc.php 재사용, company-suite.css 미로드분을 여기서 정의.
   · 게시판명은 히어로가 표시 → #container_title 숨김.
   ========================================= */
#container_title { display: none !important; }   /* 히어로가 제목 역할 → 중복 숨김 */

.oy-board-hero {
    position: relative;
    width: 100vw;
    left: 50%;
    transform: translateX(-50%);                 /* #container(1200) 밖으로 풀블리드 */
    margin-bottom: clamp(28px, 4vw, 52px);        /* 히어로와 목록 사이 간격 */
}
.oy-board-hero .sub-hero {
    position: relative;
    display: flex; align-items: center; justify-content: center;
    min-height: clamp(180px, 26vw, 300px);
    padding: clamp(44px, 6vw, 72px) var(--gutter);
    text-align: center;
    color: var(--on-dark);
    background: var(--dark);
    overflow: hidden;
}
.oy-board-hero .sub-hero .sh-bg {
    position: absolute; inset: 0;
    background-size: cover; background-position: center;
    transform: scale(1.04); filter: grayscale(18%);
}
.oy-board-hero .sub-hero::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(10,9,6,.55), rgba(10,9,6,.68));
}
.oy-board-hero .sub-hero .sh-inner { position: relative; z-index: 1; max-width: 820px; }
.oy-board-hero .sub-hero .eyebrow { display: block; margin-bottom: 14px; color: var(--gold); }
.oy-board-hero .sub-hero h1 {
    font-family: var(--serif); font-weight: 600;
    font-size: clamp(22px, 2.8vw, 34px); line-height: 1.16; letter-spacing: .01em;
    color: var(--on-dark);
}
.oy-board-hero .sub-hero .sh-desc {
    margin: 16px auto 0; max-width: 640px; color: var(--sub-dark);
    font-size: clamp(14px, 1.5vw, 16px); line-height: 1.8;
}
.oy-board-hero .crumb {
    position: relative; z-index: 1;
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px;
    margin-top: 22px; font-size: 13.5px; letter-spacing: .06em; color: var(--sub-dark);
}
.oy-board-hero .crumb a { color: var(--sub-dark); transition: color .2s; text-decoration: none; }
.oy-board-hero .crumb a:hover { color: var(--gold); }
.oy-board-hero .crumb .sep { opacity: .5; font-size: 10px; }
.oy-board-hero .crumb .cur { color: var(--on-dark); font-weight: 600; }

/* =========================================
   1. 공통 버튼 (NORR btn-pill 패턴 정합)
   ========================================= */
.btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    padding: 0 1.25rem !important;
    height: 42px !important;
    border-radius: var(--radius-pill) !important;
    font-family: var(--font-kr) !important;   /* 버튼은 가독성 위해 산세리프(Pretendard) */
    font-size: 0.9375rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    border: 1px solid transparent !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
    line-height: 1 !important;
    letter-spacing: -0.01em !important;
    white-space: nowrap !important;
    width: auto !important;   /* 모바일 mobile.css 의 a.btn{width:30px} 무력화 (원형 방지) */
}
.btn i { font-size: 1rem !important; transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1); }

/* 보조 액션 — Ghost (관리자/RSS/목록/스크랩/검색/수정/답변 등 대부분) */
.btn_b01,
.btn_admin {
    background: var(--surface) !important;
    border-color: var(--divider) !important;
    color: var(--on-surface) !important;
    box-shadow: none !important;
}
.btn_b01:hover,
.btn_admin:hover {
    background: var(--surface-alt) !important;
    border-color: var(--on-surface-alt) !important;
    color: var(--primary) !important;
}
.btn_b01 i,
.btn_admin i { color: var(--on-surface-alt) !important; }
.btn_b01:hover i,
.btn_admin:hover i { color: var(--accent) !important; }

/* 주력 CTA — 글쓰기/작성완료/댓글등록만 Navy fill */
.btn_b02, .btn_submit {
    background: var(--primary) !important;
    color: var(--accent-soft) !important;
    border: 1px solid transparent !important;
}
.btn_b02:hover, .btn_submit:hover {
    background: var(--accent) !important;
    color: var(--primary) !important;
}
.btn_b02 i, .btn_submit i { color: var(--accent) !important; }
.btn_b02:hover i, .btn_submit:hover i { color: var(--primary) !important; }

/* 취소/삭제 — Ghost (hover 시에만 위험 표시) */
.btn_cancel {
    background: var(--surface) !important;
    border: 1px solid var(--divider) !important;
    color: var(--on-surface-alt) !important;
}
.btn_cancel i { color: var(--on-surface-alt) !important; }
.btn_cancel:hover {
    background: #fff5f5 !important;
    border-color: #f4b6b6 !important;
    color: #d63a3a !important;
}
.btn_cancel:hover i { color: #d63a3a !important; }

/* =========================================
   2. 게시판 목록 (PC 테이블 기본)
   ========================================= */
.twin-board-wrap {
    position: relative;
    color: var(--on-surface);
    margin-bottom: 0;
}
#bo_btn_top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    gap: 1rem;
}
#bo_list_total {
    font-family: var(--font-display);
    font-size: 0.9375rem;
    color: var(--on-surface-alt);
    font-weight: 500;
    letter-spacing: -0.01em;
}
#bo_list_total span {
    font-weight: 700;
    color: var(--primary);
    margin-right: 0.375rem;
}
.bo_btn_top_right {
    display: flex;
    gap: 0.875rem;
    align-items: center;
    flex-wrap: wrap;
    margin-left: auto;
}
.btn_bo_user { display: flex; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }

/* 카테고리 칩 — NORR cert-chip 패턴 */
#bo_cate { margin-bottom: 2rem; }
#bo_cate h2 { display: none; }
#bo_cate ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 0; padding: 0;
    list-style: none;
}
#bo_cate a {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 1.125rem;
    border-radius: var(--radius-pill);
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--on-surface-alt);
    background: var(--surface);
    border: 1px solid var(--divider);
    letter-spacing: -0.01em;
    transition: all 0.3s ease;
}
#bo_cate a:hover {
    border-color: var(--accent);
    color: var(--primary);
    background: var(--surface-cool);
}
#bo_cate #bo_cate_on {
    background: var(--primary);
    color: var(--accent-soft);
    border-color: var(--primary);
    box-shadow: 0 6px 20px rgba(21,20,15,0.18);
}

/* 테이블 미니멀 라인 — 카드 wrapper 제거, 상/하 strong border + 행간 hairline */
#bo_list .tbl_head01 {
    background: transparent !important;
    border-radius: 0 !important;
    overflow: visible !important;
    border: none !important;
    box-shadow: none !important;
}
#bo_list .tbl_head01 table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    border: none !important;
}
#bo_list .tbl_head01 caption { display: none !important; }

/* 헤더 행 — 굵은 상단 라인 + 작은 회색 라벨 */
#bo_list .tbl_head01 thead th,
.tbl_head01 th {
    padding: 0.875rem 0.5rem !important;
    background: transparent !important;
    font-family: var(--font-display) !important;
    font-size: 0.875rem !important;
    font-weight: 700 !important;
    color: var(--on-surface) !important;
    border-top: 2px solid var(--primary) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid var(--divider) !important;
    text-align: center !important;
    white-space: nowrap !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}
#bo_list .tbl_head01 thead th a,
.tbl_head01 th a {
    color: var(--on-surface) !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}
#bo_list .tbl_head01 thead th a:hover { color: var(--primary) !important; }
#bo_list .tbl_head01 thead th i { opacity: 0.5; font-size: 0.75rem !important; }

/* 바디 행 */
#bo_list .tbl_head01 tbody td,
.tbl_head01 td {
    padding: 1.25rem 0.5rem !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid var(--divider) !important;
    text-align: center !important;
    color: var(--on-surface-alt) !important;
    font-size: 0.9375rem !important;
    font-weight: 500 !important;
    height: auto;
    vertical-align: middle !important;
}
#bo_list .tbl_head01 td.empty_table {
    padding: 5rem 0 !important;
    color: var(--on-surface-alt) !important;
    font-size: 1rem !important;
}

#bo_list .td_chk { width: 50px !important; }
#bo_list .td_chk input[type="checkbox"] {
    width: 18px; height: 18px;
    accent-color: var(--accent);
    cursor: pointer;
}

/* 번호 — navy 강조 */
#bo_list .td_num2 {
    width: 80px !important;
    font-family: var(--font-display) !important;
    font-weight: 700 !important;
    color: var(--primary) !important;
    font-size: 0.9375rem !important;
}

/* 제목 — 왼쪽 정렬 + 진한 검정 (PC 데스크탑) */
#bo_list .td_subject { text-align: left !important; padding-left: 1.875rem !important; }
/* 모바일 메타 prefix (번호) — PC 에서는 숨김 */
#bo_list .bo_num_mobile { display: none !important; }
/* 셀 내부 모든 자식의 underline / border 잔영 제거 (그누보드 sideview 등 영향 차단) */
#bo_list .tbl_head01 tbody td,
#bo_list .tbl_head01 tbody td * {
    text-decoration: none !important;
    border-bottom-style: none !important;
}
#bo_list .tbl_head01 tbody td { border-bottom: 1px solid var(--divider) !important; }

#bo_list .td_name {
    width: 140px !important;
    color: var(--on-surface-alt) !important;
    font-size: 0.875rem !important;
}
#bo_list .td_num {
    width: 90px !important;
    color: var(--on-surface-alt) !important;
    font-family: var(--font-display) !important;
    font-size: 0.875rem !important;
    font-variant-numeric: tabular-nums;
}
/* 모바일 메타용 아이콘은 PC 에서 숨김 */
#bo_list .td_num .td_meta_icon { display: none; }
#bo_list .td_datetime {
    width: 110px !important;
    color: var(--on-surface-alt) !important;
    font-family: var(--font-display) !important;
    font-size: 0.875rem !important;
    letter-spacing: -0.01em !important;
}

/* 글쓴이 칼럼 — 데스크탑에서 숨김(레퍼런스 4컬럼: 번호/제목/작성일/조회). 모바일 메타엔 유지 */
@media (min-width: 769px) {
    #bo_list .td_name { display: none !important; }
}

#bo_list .bo_tit {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}
#bo_list .bo_tit a {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: var(--on-surface) !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
    word-break: break-all !important;
    letter-spacing: -0.01em !important;
}
#bo_list .bo_tit a:hover { color: var(--primary) !important; }
#bo_list .bo_cate_link {
    display: inline-block;
    font-family: var(--font-display);
    font-size: 0.75rem;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 0.375rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* 공지 / 댓글수 / 열람중 뱃지 */
#bo_list .notice_icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    height: 34px !important;
    background: var(--primary) !important;
    color: #fff !important;
    border-radius: 50% !important;
    font-size: 0 !important;
}
#bo_list .notice_icon i { font-size: 1.05rem !important; color: #fff !important; line-height: 1 !important; }
#bo_list .bo_notice td.td_num2 { color: var(--accent) !important; }
#bo_list .bo_notice td a {
    font-weight: 700 !important;
    color: var(--primary) !important;
}
#bo_list .cnt_cmt {
    background: rgba(201, 169, 106, 0.16) !important;
    color: var(--primary) !important;
    font-family: var(--font-display) !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    padding: 0.125rem 0.5rem !important;
    border-radius: var(--radius-pill) !important;
    margin-left: 0.375rem !important;
    display: inline-block !important;
}
#bo_list .bo_current {
    color: var(--primary) !important;
    font-family: var(--font-display) !important;
    font-weight: 700 !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
}

/* 하단 영역 (페이지/검색) */
.bo_fx {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 2rem;
    flex-wrap: wrap;
    gap: 1.25rem;
}

/* 검색창 — 레퍼런스: 밑줄 스타일(하단 보더만), 우측 아이콘 */
#bo_sch {
    display: flex !important;
    align-items: center !important;
    border: none !important;
    border-bottom: 1px solid var(--on-surface) !important;
    background: transparent !important;
    border-radius: 0 !important;
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    height: 44px !important;
    box-sizing: border-box !important;
    min-width: 300px !important;
}
#bo_sch legend { display: none !important; }
#bo_sch form {
    display: flex !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center;
}
#bo_sch select {
    border: none !important;
    padding: 0 0.5rem 0 0 !important;
    height: 100% !important;
    font-family: var(--font-display) !important;
    font-size: 0.875rem !important;
    color: var(--on-surface-alt) !important;
    border-right: 1px solid var(--divider) !important;
    margin-right: 0.625rem !important;
    outline: none !important;
    background: transparent !important;
    cursor: pointer !important;
    font-weight: 500 !important;
}
#bo_sch .sch_input {
    border: none !important;
    padding: 0 0.5rem 0 0 !important;
    height: 100% !important;
    font-size: 0.9375rem !important;
    width: 200px !important;
    flex: 1 1 auto !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    color: var(--on-surface) !important;
}
#bo_sch .sch_input::placeholder { color: var(--on-surface-alt); opacity: 0.7; }
#bo_sch .sch_btn {
    background: transparent !important;
    border: none !important;
    width: 36px !important;
    height: 100% !important;
    color: var(--primary) !important;
    cursor: pointer !important;
    transition: color 0.3s ease !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}
#bo_sch .sch_btn i { font-size: 1.25rem !important; }
#bo_sch .sch_btn:hover {
    background: transparent !important;
    color: var(--accent) !important;
}

/* =========================================
   3. 게시물 읽기 (View)
   ========================================= */
.twin-view-wrap {
    background: transparent;
    border: none;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
    margin-bottom: 3rem;
}
/* 헤더: 좌측 제목 + 우측 메타(작성자·작성일·조회) 한 줄 */
.bo_v_head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1.25rem 2rem;
    flex-wrap: wrap;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--divider);
    margin-bottom: 2.5rem;
}
#bo_v_title { margin: 0; flex: 1 1 55%; min-width: 0; }
.bo_v_cate {
    display: inline-flex;
    align-items: center;
    background: var(--primary);
    color: var(--accent-soft);
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.375rem 0.875rem;
    border-radius: var(--radius-pill);
    margin-bottom: 1rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.bo_v_tit {
    display: block;
    font-family: var(--font-display);
    font-size: clamp(1.5rem, 4vw, 2.25rem);
    font-weight: 700;
    color: var(--on-surface);
    line-height: 1.15;
    letter-spacing: -0.01em;
    word-break: break-all;
}
body[data-lang="ko"] .bo_v_tit { font-family: var(--font-kr); font-weight: 700; }

#bo_v_info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    padding: 0;
    border-bottom: none;
    margin: 0;
    color: var(--on-surface-alt);
    font-family: var(--font-display);
    font-size: 0.875rem;
    flex-shrink: 0;
    letter-spacing: -0.01em;
}
#bo_v_info h2 { display: none; }
#bo_v_info i { display: none; }
#bo_v_info .bo_v_cmt { display: none; }   /* 댓글 수 — 레퍼런스 메타에서 제외 */
#bo_v_info strong {
    color: var(--on-surface-alt);
    font-weight: 500;
    margin: 0;
}
#bo_v_info strong:first-of-type { color: var(--primary); font-weight: 700; }   /* 작성자 강조 */
#bo_v_info strong:not(:first-of-type):not(.bo_v_cmt)::before {
    content: "·";
    margin: 0 0.5rem;
    color: var(--divider);
    font-weight: 400;
}
.if_date {
    margin-left: 0 !important;
    color: var(--on-surface-alt) !important;
    font-weight: 500 !important;
    font-family: var(--font-display) !important;
}

#bo_v_atc { min-height: 300px; }
#bo_v_atc_title { display: none; }
#bo_v_con {
    font-size: 1.0625rem;
    line-height: 1.8;
    color: var(--on-surface);
    word-break: break-all;
    margin-bottom: 3rem;
}
#bo_v_con img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-md);
    margin-bottom: 1.25rem;
}
#bo_v_con a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}
#bo_v_con a:hover { color: var(--primary); }

/* 추천 / 비추천 */
#bo_v_act {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 2.5rem;
}
.bo_v_act_gng { position: relative; }
.bo_v_good, .bo_v_nogood {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 84px; height: 84px;
    border-radius: 50%;
    border: 1px solid var(--divider);
    background: var(--surface);
    text-decoration: none;
    transition: all 0.3s ease;
    font-family: var(--font-display);
}
.bo_v_good { color: var(--accent); }
.bo_v_nogood { color: #d63a3a; }
.bo_v_good:hover {
    background: var(--accent);
    color: var(--primary);
    border-color: transparent;
    transform: translateY(-3px);
    box-shadow: var(--shadow-cyan);
}
.bo_v_nogood:hover {
    background: #d63a3a;
    color: #fff;
    border-color: transparent;
    transform: translateY(-3px);
}
.bo_v_good strong, .bo_v_nogood strong {
    font-size: 1.125rem;
    font-weight: 700;
    margin-top: 0.375rem;
    letter-spacing: -0.02em;
}
#bo_v_act_good, #bo_v_act_nogood {
    display: none;
    position: absolute;
    top: 94px;
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    background: var(--primary);
    color: var(--accent-soft);
    padding: 0.375rem 0.75rem;
    border-radius: var(--radius-sm);
    font-size: 0.8125rem;
    z-index: 10;
    font-family: var(--font-display);
    font-weight: 500;
}

/* 첨부파일 / 관련링크 */
#bo_v_file, #bo_v_link {
    background: var(--surface-alt);
    border: 1px solid var(--divider);
    border-radius: var(--radius-md);
    padding: 1.5rem;
    margin-bottom: 1.25rem;
}
#bo_v_file h2, #bo_v_link h2 {
    font-family: var(--font-display);
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 0.875rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    letter-spacing: -0.01em;
}
#bo_v_file h2 i, #bo_v_link h2 i { color: var(--accent); }
#bo_v_file ul, #bo_v_link ul { list-style: none; padding: 0; margin: 0; }
#bo_v_file li, #bo_v_link li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.625rem 0;
    border-bottom: 1px solid var(--divider);
    font-size: 0.9375rem;
}
#bo_v_file li:last-child, #bo_v_link li:last-child {
    border-bottom: none;
    padding-bottom: 0;
}
#bo_v_file a, #bo_v_link a {
    color: var(--on-surface);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}
#bo_v_file a:hover, #bo_v_link a:hover {
    color: var(--accent);
}
#bo_v_file a strong, #bo_v_link a strong { font-weight: 600; }
.bo_v_file_cnt, .bo_v_link_cnt {
    font-family: var(--font-display);
    font-size: 0.75rem;
    color: var(--on-surface-alt);
    letter-spacing: -0.01em;
}

/* 하단 버튼 — 관리액션(상단) / 이전·다음(좌) · 목록(우) */
#bo_v_top {
    display: block;
    margin-top: 2.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--divider);
}
.bo_v_adm {
    display: flex;
    gap: 0.5rem;
    list-style: none;
    margin: 0 0 1.25rem;
    padding: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.bo_v_nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}
.bo_v_pn, .bo_v_com {
    display: flex;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
}

/* =========================================
   4. 댓글 (Comments)
   ========================================= */
.twin-comment-wrap { margin-top: 3rem; }
.cmt_btn {
    background: transparent;
    border: none;
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--on-surface);
    padding: 0 0 0.875rem;
    border-bottom: 2px solid var(--primary);
    width: 100%;
    text-align: left;
    cursor: pointer;
    margin-bottom: 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.625rem;
    letter-spacing: -0.025em;
}
body[data-lang="ko"] .cmt_btn { font-family: var(--font-kr); font-weight: 700; }
.cmt_btn i { color: var(--accent); }

#bo_vc h2 { display: none; }
#bo_vc article {
    padding: 1.5rem 0;
    border-bottom: 1px solid var(--divider);
    position: relative;
}
#bo_vc article.bo_vc_reply {
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
    padding: 1.25rem 1.5rem;
    border-bottom: 0;
    border-radius: var(--radius-md);
    background: var(--surface-alt);
}
#bo_vc article.bo_vc_reply::before {
    content: "↳";
    position: absolute;
    top: 1.2rem;
    left: -1.75rem;
    color: var(--accent);
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
}
#bo_vc header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.875rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}
#bo_vc header h2 { display: none; }
#bo_vc .member, #bo_vc .guest {
    font-family: var(--font-display);
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--primary);
    letter-spacing: -0.01em;
}
.bo_vc_hdinfo {
    color: var(--on-surface-alt);
    font-family: var(--font-display);
    font-size: 0.8125rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}
.bo_vc_hdinfo i { color: var(--accent); }
.cmt_contents {
    font-size: 0.9375rem;
    line-height: 1.65;
    color: var(--on-surface);
    margin-bottom: 0.875rem;
    word-break: break-all;
}
.bo_vc_act {
    list-style: none;
    padding: 0; margin: 0;
    display: flex;
    gap: 0.375rem;
    justify-content: flex-end;
}
.bo_vc_act a {
    font-family: var(--font-display);
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--on-surface-alt);
    text-decoration: none;
    transition: color 0.2s ease, background-color 0.2s ease;
    border: 0 !important;
    background: transparent !important;
    border-radius: 999px;
    padding: 0.375rem 0.625rem !important;
    min-width: auto !important;
    height: auto !important;
    line-height: 1.25 !important;
    box-shadow: none !important;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    letter-spacing: -0.01em;
}
.bo_vc_act a:hover {
    color: var(--primary);
    background: var(--surface-alt) !important;
}
.bo_vc_act a.bo_vc_delete { color: #b45a5a; }
.bo_vc_act a.bo_vc_delete:hover {
    color: #b42323;
    background: #fff1f1 !important;
}
#bo_vc_empty {
    padding: 3.5rem 0;
    text-align: center;
    color: var(--on-surface-alt);
    font-size: 0.9375rem;
    background: var(--surface-alt);
    border: 1px dashed var(--divider);
    border-radius: var(--radius-md);
}
#bo_vc_empty i {
    display: block;
    font-size: 1.75rem;
    margin-bottom: 0.625rem;
    color: var(--divider);
}

/* 댓글 작성 폼 */
.bo_vc_w {
    background: var(--surface-alt);
    padding: 1.75rem;
    border: 1px solid var(--divider);
    border-radius: var(--radius-md);
    margin-top: 2rem;
}
.bo_vc_w h2 { display: none; }
.bo_vc_w textarea,
#fviewcomment textarea {
    width: 100%;
    height: 110px;
    padding: 1rem;
    border: 1px solid var(--divider);
    border-radius: var(--radius-sm);
    font-size: 0.9375rem;
    font-family: inherit;
    resize: vertical;
    box-sizing: border-box;
    margin-bottom: 1rem;
    transition: all 0.3s ease;
    background: var(--surface);
    line-height: 1.6;
}
.bo_vc_w textarea:focus,
#fviewcomment textarea:focus {
    border-color: var(--accent);
    outline: none;
    box-shadow: 0 0 0 3px rgba(201, 169, 106, 0.18);
}
.bo_vc_w_wr {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 1rem;
}
.bo_vc_w_info { display: flex; gap: 0.625rem; flex-wrap: wrap; }
.bo_vc_w_info .frm_input {
    padding: 0.625rem 0.875rem;
    border: 1px solid var(--divider);
    border-radius: var(--radius-sm);
    font-size: 0.875rem;
    background: var(--surface);
    color: var(--on-surface);
}
.bo_vc_w_info .frm_input:focus {
    border-color: var(--accent);
    outline: none;
    box-shadow: 0 0 0 3px rgba(201, 169, 106, 0.18);
}
.bo_vc_w .btn_confirm,
#fviewcomment .btn_confirm {
    display: flex;
    align-items: center;
    gap: 0.875rem;
}
.bo_vc_w .btn_confirm label,
#fviewcomment .btn_confirm label {
    cursor: pointer;
    color: var(--on-surface-alt);
    font-family: var(--font-display);
    font-size: 0.8125rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    letter-spacing: -0.01em;
}
.bo_vc_w .btn_confirm label i,
#fviewcomment .btn_confirm label i { color: var(--accent); }
.bo_vc_w .btn_submit,
#fviewcomment .btn_submit {
    background: var(--primary) !important;
    color: var(--accent-soft) !important;
    border: none !important;
    padding: 0 1.875rem !important;
    height: 44px !important;
    border-radius: var(--radius-pill) !important;
    font-family: var(--font-kr) !important;   /* 버튼은 가독성 위해 산세리프(Pretendard) */
    font-size: 0.9375rem !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    letter-spacing: -0.01em !important;
}
.bo_vc_w .btn_submit:hover,
#fviewcomment .btn_submit:hover {
    background: var(--accent) !important;
    color: var(--primary) !important;
    transform: translateY(-2px) !important;
    box-shadow: var(--shadow-cyan) !important;
}

/* 답변·수정 시 댓글 아래로 이동한 작성 폼 */
#bo_vc .bo_vc_w_box #fviewcomment {
    margin-top: 1rem;
    padding: 1.25rem;
    background: var(--surface-alt);
    border: 1px solid var(--divider);
    border-radius: var(--radius-md);
}
#bo_vc .bo_vc_w_box #fviewcomment textarea {
    display: block;
    min-height: 110px;
}

/* 댓글 폼은 답변·수정 시 DOM 위치가 바뀌므로 요소 ID에 직접 적용 */
#bo_vc #wr_content {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 110px !important;
    min-height: 110px !important;
    padding: 1rem !important;
    margin: 0 0 1rem !important;
    border: 1px solid var(--divider) !important;
    border-radius: var(--radius-sm) !important;
    background-color: var(--surface) !important;
    color: var(--on-surface) !important;
    font-family: inherit !important;
    font-size: 0.9375rem !important;
    line-height: 1.6 !important;
    box-sizing: border-box !important;
    resize: vertical !important;
}
#bo_vc #wr_content:focus {
    border-color: var(--accent) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(201, 169, 106, 0.18) !important;
}
#bo_vc #btn_submit {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 108px !important;
    height: 44px !important;
    padding: 0 1.875rem !important;
    border: 0 !important;
    border-radius: var(--radius-pill) !important;
    background: var(--primary) !important;
    color: var(--accent-soft) !important;
    font-family: var(--font-kr) !important;
    font-size: 0.9375rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    box-shadow: none !important;
}
#bo_vc #btn_submit:hover {
    background: var(--accent) !important;
    color: var(--primary) !important;
    transform: translateY(-2px);
}

/* =========================================
   5. 게시물 작성 (Write)
   ========================================= */
.twin-write-wrap {
    background: transparent;
    padding: 0;
    border: none;
    box-shadow: none;
    border-radius: 0;
    margin-bottom: 3rem;
    box-sizing: border-box;
}
.twin-write-wrap .write_div {
    margin-bottom: 1.5rem;
    position: relative;
}
.twin-write-wrap .frm_input,
.twin-write-wrap .frm_file,
.twin-write-wrap textarea,
.twin-write-wrap select {
    width: 100%;
    padding: 0.875rem 1.125rem;
    border: 1px solid #b8af9b;   /* 또렷한 테두리 (흰 배경에 묻히지 않도록) */
    border-radius: var(--radius-sm);
    font-size: 0.9375rem;
    box-sizing: border-box;
    transition: all 0.3s ease;
    font-family: inherit;
    color: var(--on-surface);
    background: var(--surface) !important;
    box-shadow: none !important;
    height: auto;
}
.twin-write-wrap .frm_input::placeholder { color: var(--on-surface-alt); opacity: 0.55; }
.twin-write-wrap .frm_input:focus,
.twin-write-wrap select:focus {
    border-color: var(--accent);
    outline: none;
    box-shadow: 0 0 0 3px rgba(201, 169, 106, 0.18);
}

/* 제목 입력 강조 */
.twin-write-wrap #wr_subject {
    font-family: var(--font-display) !important;
    font-size: 1.125rem !important;
    font-weight: 700 !important;
    padding: 1.125rem 1.25rem !important;
    background: var(--surface) !important;
    height: 60px !important;
    letter-spacing: -0.02em !important;
}
body[data-lang="ko"] .twin-write-wrap #wr_subject { font-family: var(--font-kr) !important; }
.twin-write-wrap #wr_subject::placeholder {
    color: var(--on-surface-alt);
    font-weight: 500;
    opacity: 0.55;
}

.twin-write-wrap .bo_w_info {
    display: flex;
    gap: 0.875rem;
    flex-wrap: wrap;
}
.twin-write-wrap .bo_w_info .frm_input { flex: 1; min-width: 200px; }

/* 옵션(공지/HTML/비밀글/메일) — Pill toggle */
.twin-write-wrap .bo_w_option {
    display: flex;
    gap: 0.625rem;
    align-items: center;
    flex-wrap: wrap;
}
.twin-write-wrap .bo_w_option input[type="checkbox"] { display: none; }
.twin-write-wrap .bo_w_option label {
    padding: 0.5rem 1.125rem;
    border: 1px solid var(--divider);
    border-radius: var(--radius-pill);
    font-family: var(--font-display);
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--on-surface-alt);
    cursor: pointer;
    transition: all 0.3s ease;
    user-select: none;
    background: var(--surface);
    letter-spacing: -0.01em;
}
.twin-write-wrap .bo_w_option label:hover {
    border-color: var(--accent);
    color: var(--primary);
    background: var(--surface-cool);
}
.twin-write-wrap .bo_w_option input[type="checkbox"]:checked + label {
    background: var(--primary);
    color: var(--accent-soft);
    border-color: var(--primary);
    box-shadow: 0 6px 20px rgba(21,20,15,0.18);
}

/* 자동저장 버튼 + 팝업 */
.twin-write-wrap .bo_w_tit #btn_autosave {
    position: absolute;
    top: 10px; right: 10px;
    background: var(--surface);
    border: 1px solid var(--divider);
    padding: 0 0.875rem;
    border-radius: var(--radius-pill);
    color: var(--on-surface-alt);
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    height: 38px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}
.twin-write-wrap .bo_w_tit #btn_autosave:hover {
    background: var(--surface-cool);
    border-color: var(--accent);
    color: var(--primary);
}

/* 링크 / 첨부파일 인풋 그룹 */
.twin-write-wrap .bo_w_link,
.twin-write-wrap .bo_w_flie .file_wr {
    display: flex;
    align-items: stretch;
}
.twin-write-wrap .bo_w_link label,
.twin-write-wrap .bo_w_flie .lb_icon {
    background: var(--surface);
    border: 1px solid #b8af9b;
    border-right: none;
    height: 52px;
    line-height: 52px;
    padding: 0 1rem 0 1.25rem;
    border-radius: var(--radius-sm) 0 0 var(--radius-sm);
    color: var(--primary);
    font-size: 1.125rem;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}
.twin-write-wrap .bo_w_link .frm_input,
.twin-write-wrap .bo_w_flie .frm_file {
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    height: 52px;
    flex-grow: 1;
    background: var(--surface) !important;
    border-left: none;
    padding-left: 1rem;
}

/* 파일 선택 버튼 */
.twin-write-wrap .frm_file::file-selector-button {
    background: var(--surface);
    border: 1px solid #b8af9b;
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    margin-right: 0.875rem;
    color: var(--on-surface);
    font-family: var(--font-kr);   /* 산세리프 (버튼 가독성) */
    font-weight: 700;
    font-size: 0.8125rem;
    cursor: pointer;
    transition: all 0.2s ease;
    letter-spacing: -0.01em;
}
.twin-write-wrap .frm_file::file-selector-button:hover {
    border-color: var(--accent);
    color: var(--primary);
}

.twin-write-wrap .bo_w_flie .frm_input {
    margin-top: 0.625rem;
    background: var(--surface) !important;
}
.twin-write-wrap .file_del {
    display: inline-flex;
    align-items: center;
    margin-top: 0.625rem;
    font-size: 0.8125rem;
    color: #d63a3a;
    font-weight: 600;
    cursor: pointer;
}
.twin-write-wrap .file_del input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: #d63a3a;
    margin-right: 0.375rem;
    cursor: pointer;
}

.twin-write-wrap #char_count_wrap {
    text-align: right;
    margin-top: 0.625rem;
    font-family: var(--font-display);
    color: var(--on-surface-alt);
    font-size: 0.8125rem;
    letter-spacing: -0.01em;
}
.twin-write-wrap #char_count {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--accent);
    font-size: 1rem;
}

.twin-write-wrap .btn_confirm {
    display: flex;
    justify-content: center;
    gap: 0.875rem;
    margin-top: 2.5rem;
    padding-top: 2.5rem;
    border-top: 1px solid var(--divider);
}
.twin-write-wrap .btn_submit {
    padding: 0 3rem !important;
    height: 54px !important;
    font-size: 1rem !important;
}
.twin-write-wrap .btn_cancel {
    padding: 0 3rem !important;
    height: 54px !important;
    font-size: 1rem !important;
    line-height: 52px !important;
}

/* =========================================
   7. 페이지네이션 (레퍼런스: 원형 번호, 현재=네이비 채움, → 화살표)
   ========================================= */
.pg_wrap {
    clear: both !important;
    float: none !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 3rem 0 0 !important;
}
.pg {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.375rem !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
}
.pg a.pg_page,
.pg strong.pg_current {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 40px !important;
    height: 40px !important;
    padding: 0 0.5rem !important;
    border-radius: 50% !important;
    border: none !important;
    background: transparent !important;
    font-family: var(--font-display) !important;
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    transition: all 0.25s ease !important;
}
.pg a.pg_page { color: var(--on-surface-alt) !important; }
.pg a.pg_page:hover { background: var(--surface-alt) !important; color: var(--primary) !important; }
.pg strong.pg_current {
    background: var(--primary) !important;
    color: #fff !important;
    font-weight: 700 !important;
}
/* 화살표(처음/이전/다음/끝) — 기본 gif 제거, 글리프로 교체 */
.pg a.pg_start,
.pg a.pg_prev,
.pg a.pg_next,
.pg a.pg_end {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    border: none !important;
    background: transparent !important;
    text-indent: 0 !important;
    overflow: visible !important;
    font-size: 0 !important;
    color: var(--on-surface-alt) !important;
    transition: all 0.25s ease !important;
}
.pg a.pg_start:hover,
.pg a.pg_prev:hover,
.pg a.pg_next:hover,
.pg a.pg_end:hover { background: var(--surface-alt) !important; color: var(--primary) !important; }
.pg a.pg_start::after { content: "\00AB"; }
.pg a.pg_prev::after  { content: "\2190"; }
.pg a.pg_next::after  { content: "\2192"; }
.pg a.pg_end::after   { content: "\00BB"; }
.pg a.pg_start::after,
.pg a.pg_prev::after,
.pg a.pg_next::after,
.pg a.pg_end::after { font-size: 1.125rem !important; line-height: 1 !important; }

/* =========================================
   6. Mobile Responsive (모바일 카드형 변환)
   ========================================= */
@media (max-width: 768px) {
    #container { padding: 0 1.25rem !important; }
    #container_wr { padding-top: 0 !important; padding-bottom: 48px !important; }

    #container_title {
        margin-bottom: 1.75rem !important;
        font-size: 1.5rem !important;
    }

    .twin-write-wrap { padding: 0; }

    /* 상단 정보 + 검색창 */
    #bo_list_total { width: 100%; margin-bottom: 0.625rem; }
    .bo_fx, #bo_btn_top { flex-direction: column; align-items: stretch; }

    #bo_sch { width: 100%; height: 48px !important; }
    #bo_sch form { flex-wrap: nowrap; }
    #bo_sch select { width: auto !important; flex: 0 0 32% !important; }
    #bo_sch .sch_input { width: auto !important; flex: 1 1 auto !important; }

    /* 상단 우측 버튼 — 관리자/RSS 등은 자연 폭 (작게), 좌측 정렬 */
    .bo_btn_top_right { flex-direction: column; align-items: stretch; width: 100%; gap: 0.75rem; }
    .bo_btn_top_right .btn_bo_user {
        display: flex;
        flex-direction: row;
        width: auto;
        gap: 0.5rem;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
    .bo_btn_top_right .btn_bo_user li { flex: 0 0 auto; margin: 0; }
    .bo_btn_top_right .btn_bo_user .btn {
        width: auto;
        font-size: 0.8125rem !important;
        padding: 0 1rem !important;
        height: 38px !important;
    }

    /* 게시판 목록 — 미니멀 리스트 (카드 없음, 행간 hairline) */
    .tbl_head01 {
        overflow: visible !important;
        background: transparent !important;
        box-shadow: none !important;
        border: none !important;
        padding: 0 !important;
    }
    .tbl_head01 table,
    .tbl_head01 thead,
    .tbl_head01 tbody,
    .tbl_head01 tr,
    .tbl_head01 th,
    .tbl_head01 td {
        display: block;
        width: 100% !important;
        border: none !important;
    }
    .tbl_head01 thead { display: none; }
    /* 모든 셀 border 강제 제거 (행 단위 divider만 유지) */
    .tbl_head01 tbody td {
        padding: 0 !important;
        text-align: right !important;
        background: transparent !important;
        border-bottom: none !important;
        border-top: none !important;
    }

    /* 빈 게시물 알림 */
    .tbl_head01 tbody tr.empty_row {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
    }
    .tbl_head01 td.empty_table {
        padding: 3.5rem 1.25rem !important;
        text-align: center !important;
        background: var(--surface-alt) !important;
        border-radius: var(--radius-md) !important;
        box-shadow: none !important;
        border: 1px dashed var(--divider) !important;
    }

    /* 체크박스 — 우상단 절대배치 */
    #bo_list .td_chk {
        position: absolute !important;
        top: 1.5rem; right: 0;
        width: auto !important;
        z-index: 10;
    }
    #bo_list .td_chk input {
        width: 18px; height: 18px;
        cursor: pointer;
        accent-color: var(--accent);
    }

    /* PC 컬럼용 번호 셀은 모바일에서 숨김 (메타 prefix 가 대신 노출) */
    #bo_list .td_num2 { display: none !important; }

    /* 모바일 메타 prefix (번호) — td_name 안 span 으로 노출 */
    #bo_list .bo_num_mobile {
        display: inline !important;
        color: var(--primary) !important;
        font-family: var(--font-display) !important;
        font-size: 0.8125rem !important;
        font-weight: 700 !important;
        letter-spacing: -0.01em !important;
        margin-right: 0.5rem;
    }
    #bo_list .bo_num_mobile::after {
        content: "·";
        color: var(--divider);
        margin-left: 0.5rem;
        font-weight: 400;
    }
    /* 공지/열람중인 경우 prefix 색을 cyan/accent 로 */
    #bo_list .bo_notice .bo_num_mobile { color: var(--accent) !important; }

    /* 제목 — 행의 첫 줄, 굵은 검정 (체크박스와 겹치지 않게 우측 여백 확보) */
    #bo_list .td_subject {
        margin-bottom: 0.625rem !important;
        text-align: left !important;
        padding-left: 0 !important;
        padding-right: 2rem !important;
        text-decoration: none !important;
    }
    #bo_list .td_subject .bo_tit { text-decoration: none !important; }
    #bo_list .td_subject .bo_tit a {
        font-size: 1rem !important;
        font-weight: 700 !important;
        color: var(--on-surface) !important;
        line-height: 1.45 !important;
        text-decoration: none !important;
        border: none !important;
    }

    /* 메타 — 제목 아래 우측 정렬, 작은 회색 */
    #bo_list .td_name,
    #bo_list .td_num,
    #bo_list .td_datetime {
        display: inline !important;
        width: auto !important;
        font-family: var(--font-display) !important;
        font-size: 0.75rem !important;
        color: var(--on-surface-alt) !important;
        margin: 0 !important;
        line-height: 1 !important;
    }
    #bo_list .td_name::before,
    #bo_list .tbl_head01 tbody td[data-header]::before {
        content: "";
        display: none !important;
    }
    /* 메타 항목 간 구분자 */
    #bo_list .td_name::after,
    #bo_list .td_datetime::after {
        content: "·";
        color: var(--divider);
        margin: 0 0.5rem;
        font-weight: 400;
    }
    /* 조회수 앞 아이콘 — 모바일 전용 (PC에서는 숨김) */
    #bo_list .td_num .td_meta_icon {
        display: inline-flex !important;
        font-size: 0.875rem !important;
        color: var(--on-surface-alt) !important;
        opacity: 0.75 !important;
        margin-right: 0.25rem !important;
        vertical-align: -2px;
    }

    /* 하단 관리자 액션 3열 */
    .bo_fx .btn_bo_user {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
        gap: 0.5rem;
        justify-content: space-between;
    }
    .bo_fx .btn_bo_user li {
        flex: 1 1 calc(33.333% - 0.625rem);
        min-width: 30%;
        margin-left: 0;
    }
    .bo_fx .btn_bo_user li .btn {
        width: 100%;
        padding: 0 0.375rem !important;
        font-size: 0.8125rem !important;
        height: 40px !important;
    }

    /* 읽기/쓰기 모바일 최적화 */
    .bo_v_tit { font-size: 1.5rem; }
    .bo_v_head { flex-direction: column; align-items: flex-start; gap: 0.875rem; }
    .bo_v_nav { flex-direction: column; align-items: stretch; gap: 0.75rem; }
    .bo_v_pn, .bo_v_com { justify-content: center; flex-wrap: wrap; }
    .bo_v_pn .btn, .bo_v_com .btn { flex: 1 1 auto; }
    .bo_v_adm { justify-content: center; }

    .twin-write-wrap .bo_w_info { flex-direction: column; gap: 0.875rem; }
    .twin-write-wrap .bo_w_info .frm_input { width: 100%; min-width: 100%; }
    .twin-write-wrap .btn_confirm { flex-direction: column; }
    .twin-write-wrap .btn_submit,
    .twin-write-wrap .btn_cancel { width: 100%; padding: 0 !important; }
    .twin-write-wrap .bo_w_link label,
    .twin-write-wrap .bo_w_flie .lb_icon { padding: 0 0.875rem; font-size: 0.875rem; }

    #bo_vc header { flex-direction: column; align-items: flex-start; gap: 0.375rem; }
    #bo_vc article.bo_vc_reply {
        margin-left: 1.5rem !important;
        padding: 1rem;
    }
    #bo_vc article.bo_vc_reply::before { left: -1.25rem; }
    .bo_vc_w_wr { flex-direction: column; align-items: stretch; }
    .bo_vc_w .btn_confirm,
    #fviewcomment .btn_confirm { justify-content: space-between; }
}