@charset "utf-8";
/* =====================================================================
   게시판 · 회원 · 검색 등 그누보드 화면
   theme/sahav/skin/ 의 PHP 는 그누보드 기본 스킨 구조를 따르고,
   스킨마다 따로 있던 style.css 대신 모양은 이 파일 한 곳에서 정한다.
   ===================================================================== */

/* 게시판 공통 모양은 옛 사이트 활동처현황(jabong_customer) 게시판을 따른다 (2026-09-13 사용자 요청):
   옅은 가는 선 · 흰 머리줄 · 높이 60px 줄 · 한 줄 건너 아주 옅은 회색 · 테두리 없는 아이콘 버튼.
   옛 파랑 · 둥근 모서리는 쓰지 않고 먹색 · 네모로 바꿨다. */
#bo_list,
#bo_gall,
#bo_v { --bo-line: #ececec; --bo-stripe: #fbfbfb; }

/* ---------- 분류 ---------- */
#bo_cate { margin: 0 0 var(--sp-5); }
#bo_cate h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#bo_cate ul { display: flex; flex-wrap: wrap; gap: 4px; }
#bo_cate li { display: block; padding: 0; }

#bo_cate a {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 15px;
    border: 1px solid var(--c-line);
    border-radius: var(--radius-pill);
    background: #fff;
    color: var(--c-text-muted);
    font-size: var(--fs-sm);
    line-height: 1.2;
}
#bo_cate a:hover { border-color: var(--c-text); background: var(--c-text); color: #fff; }
#bo_cate #bo_cate_on {
    border-color: var(--c-text);
    background: var(--c-text);
    color: #fff;
    font-weight: 700;
    box-shadow: none;
}

/* ---------- 목록 윗줄: 총 건수 · 버튼 ---------- */
#bo_btn_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    margin: 0 0 var(--sp-2);
}

#bo_list_total {
    float: none;
    color: var(--c-text-muted);
    font-size: 13px;
    line-height: 34px;
}
#bo_list_total span { margin-right: 4px; }

.btn_bo_user {
    display: flex;
    float: none;
    align-items: center;
    gap: 6px;
}
.btn_bo_user > li { position: relative; float: none; width: auto; margin: 0; background: none; }

.btn_bo_user .btn,
.btn_bo_user .btn_b01,
.btn_bo_user .btn_admin,
.bo_v_com .btn,
.bo_v_com .btn_b01 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    min-height: 40px;
    padding: 0;
    border: 0;
    border-radius: var(--radius-sm);
    background: none;
    color: var(--c-text-muted);
    font-size: 19px;
}
.btn_bo_user .btn:hover,
.bo_v_com .btn:hover { background: var(--c-bg-soft); color: var(--c-text); }
.btn_bo_user .btn_admin { color: var(--c-danger); }

.bo_fx {
    display: flex;
    float: none;
    justify-content: flex-end;
    margin: var(--sp-3) 0 0;
}

.btn_bo_adm { display: flex; gap: 6px; float: none; }
.btn_bo_adm li { float: none; margin: 0; }

.more_opt {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 30;
    display: none;
    min-width: 130px;
    padding: 6px 0;
    border: 1px solid var(--c-line);
    border-radius: var(--radius-sm);
    background: #fff;
    box-shadow: var(--shadow);
}
.more_opt::before, .more_opt::after { display: none; }
.more_opt li { float: none; width: auto; margin: 0; padding: 0; border: 0; }

.more_opt li button,
.more_opt li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    padding: 10px 14px;
    border: 0;
    background: none;
    color: var(--c-text-sub);
    font-size: var(--fs-sm);
    text-align: left;
    white-space: nowrap;
}
.more_opt li button:hover,
.more_opt li a:hover { background: var(--c-bg-soft); color: var(--c-text); }
.more_opt li i { float: none; line-height: 1; }

/* ---------- 목록 (표) ---------- */
#bo_list { position: relative; margin-bottom: 0; }
#bo_list .tbl_head01 { margin: 0; }
#bo_list .tbl_head01 table { border-top: 1px solid var(--bo-line); }

#bo_list .tbl_head01 thead th {
    padding: 20px 10px;
    border-bottom: 1px solid var(--bo-line);
    background: #fff;
    color: var(--c-text-sub);
    font-weight: 400;
}

/* 줄 선은 아래쪽에만 긋는다 — 위에도 그으면 머리줄 선과 겹쳐 첫 줄 위가 2px 로 굵게 보인다 */
#bo_list .tbl_head01 td {
    height: 60px;
    padding: 10px 8px;
    border-top: 0;
    border-bottom: 1px solid var(--bo-line);
    color: var(--c-text-muted);
    line-height: 1.4;
}

#bo_list tbody tr { border-left: 0; }
#bo_list tbody tr:hover { border-left: 0; }
#bo_list tbody .even td { background: var(--bo-stripe); }
#bo_list .tbl_head01 tbody tr:hover td { background: #f6f6f6; }
#bo_list .td_subject { text-align: left; }
#bo_list .td_name { text-align: center; }
#bo_list .td_chk { border-left: 0; border-right: 0; }

/* 제목은 보통 굵기 — 공지 줄만 굵게 (.bo_notice td a, 사용자 요청) */
.bo_tit {
    display: inline;
    color: var(--c-text);
    font-weight: 400;
}
.bo_tit a:hover { color: var(--c-primary-strong); text-decoration: underline; }

.bo_cate_link {
    display: inline-flex;
    float: none;
    align-items: center;
    height: 22px;
    margin: 0 8px 0 0;
    padding: 0 8px;
    border-radius: var(--radius-pill);
    background: var(--c-secondary-soft);
    color: var(--c-secondary);
    font-size: 12px;
    font-weight: 600 !important;
    line-height: 1;
    vertical-align: middle;
}
.bo_cate_link:hover { text-decoration: none; }

#bo_list .bo_tit .new_icon,
#bo_gall .bo_tit .new_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-left: 4px;
    border-radius: 0;
    background: var(--c-success-soft);
    color: var(--c-success);
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    vertical-align: middle;
}

#bo_list .bo_tit .hot_icon,
#bo_gall .bo_tit .hot_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 0;
    background: var(--c-danger-soft);
    color: var(--c-danger);
    font-size: 11px;
    vertical-align: middle;
}

#bo_list .bo_tit .fa-lock,
#bo_list .bo_tit .fa-download,
#bo_list .bo_tit .fa-link,
#bo_gall .bo_tit .fa-lock,
#bo_gall .bo_tit .fa-download,
#bo_gall .bo_tit .fa-link {
    width: auto;
    margin-left: 4px;
    border: 0;
    background: none;
    color: var(--c-text-muted);
    font-size: 13px;
    line-height: 1;
    vertical-align: middle;
}

#bo_list .cnt_cmt,
#bo_gall .bo_tit .cnt_cmt {
    display: inline-block;
    height: auto;
    margin-left: 4px;
    padding: 1px 7px;
    border-radius: var(--radius-pill);
    background: var(--c-primary-soft);
    color: var(--c-primary-strong);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    vertical-align: middle;
}

.bo_notice td {
    border-bottom: 1px solid var(--bo-line);
    background: #f6f6f6 !important;
}
.bo_notice td a { font-weight: 700; }
/* 공지 표시만 자원봉사 색(로고 하트색, 사용자 요청) — 흰 글자 대비 5.0:1 */
.bo_notice .notice_icon {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 9px;
    border-radius: var(--radius-pill);
    background: var(--c-brand);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

.bo_current { color: var(--c-primary-strong); font-weight: 700; }
.td_num strong { color: var(--c-text); }
#bo_list .profile_img { display: inline-block; margin-right: 4px; }
#bo_list .profile_img img { border-radius: 50%; }

/* 휴대폰: 표를 목록 모양으로 (줄 무늬 · 옅은 선은 PC 와 같게) */
@media (max-width: 767px) {
    #bo_list .tbl_head01 table { border-top: 1px solid var(--bo-line); border-bottom: 0; }
    #bo_list .tbl_head01 thead { display: none; }
    #bo_list .tbl_head01 tbody,
    #bo_list .tbl_head01 tr { display: block; }

    #bo_list .tbl_head01 tr {
        position: relative;
        padding: 14px 12px;
        border-bottom: 1px solid var(--bo-line);
    }
    #bo_list .tbl_head01 tr.even { background: var(--bo-stripe); }
    #bo_list .tbl_head01 tr.bo_notice { background: #f6f6f6; }

    #bo_list .tbl_head01 td {
        display: inline-block;
        width: auto;
        height: auto;
        padding: 0;
        border: 0;
        background: transparent !important;
        text-align: left;
    }

    #bo_list .tbl_head01 .td_subject {
        display: block;
        margin-bottom: 6px;
        padding-left: 0 !important;
        font-size: var(--fs-base);
    }

    #bo_list .tbl_head01 .td_num2 { display: none; }
    #bo_list .tbl_head01 .bo_notice .td_num2 { display: block; margin-bottom: 6px; }

    #bo_list .tbl_head01 .td_chk {
        position: absolute;
        top: 14px;
        right: 12px;
    }
    #bo_list .tbl_head01 .td_chk + .td_num2 + .td_subject { padding-right: 32px; }

    #bo_list .tbl_head01 .td_name,
    #bo_list .tbl_head01 .td_num,
    #bo_list .tbl_head01 .td_datetime {
        margin-right: 10px;
        color: var(--c-text-muted);
        font-size: var(--fs-sm);
    }
    #bo_list .tbl_head01 .td_num::before { content: "조회 "; }

    #bo_list .tbl_head01 .empty_table { display: block; }
}

/* ---------- 게시판 검색 ---------- */
.bo_sch_wrap {
    position: fixed;
    inset: 0;
    z-index: 300;
    display: none;
    width: 100%;
    height: 100%;
}

.bo_sch_bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    background: rgba(17, 24, 39, .5);
}

.bo_sch {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    width: min(420px, calc(100% - 32px));
    max-height: none;
    margin: 0;
    overflow: hidden;
    border: 0;
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: var(--shadow-lg);
    transform: translate(-50%, -50%);
}

.bo_sch h3 {
    padding: 18px 56px 18px 20px;
    border-bottom: 1px solid var(--c-line);
    font-size: var(--fs-md);
}

.bo_sch form { display: grid; gap: 10px; padding: 20px; }
.bo_sch select { width: 100%; height: auto; border: 1px solid var(--c-line-strong); box-shadow: none; }

.bo_sch .sch_bar {
    display: flex;
    width: 100%;
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--c-line-strong);
    border-radius: var(--radius-sm);
    box-shadow: none;
}

.bo_sch .sch_input {
    flex: 1;
    float: none;
    width: auto;
    min-width: 0;
    height: 46px;
    padding: 0 12px;
    border: 0;
    background: transparent;
}
.bo_sch .sch_input:focus { outline: none; box-shadow: none; }

.bo_sch .sch_btn {
    float: none;
    width: 50px;
    height: 46px;
    border: 0;
    background: var(--c-text);
    color: #fff;
    font-size: 16px;
}

.bo_sch .bo_sch_cls {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--c-text-muted);
    font-size: 18px;
}

/* ---------- 갤러리 목록 ---------- */
#bo_gall h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

#bo_gall #gall_ul {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--sp-5) var(--sp-4);
    margin: var(--sp-3) 0 0;
    padding: 0;
}
#bo_gall #gall_ul::after { display: none; }
#bo_gall #gall_ul:has(> .col-gn-3) { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 1023px) {
    #bo_gall #gall_ul,
    #bo_gall #gall_ul:has(> .col-gn-3) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    #bo_gall #gall_ul,
    #bo_gall #gall_ul:has(> .col-gn-3) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4) var(--sp-3); }
}

#bo_gall .gall_li,
.gall_row [class*="col-gn-"] {
    position: relative;
    float: none;
    width: auto;
    min-height: 0;
    padding: 0;
}
/* 스킨이 새 줄 첫 칸(5 · 9 · 13번째…)에 붙이는 box_clear 는 옛 float 줄바꿈용 — grid 에서는 필요 없고, 숨기면 그 사진이 목록에서 빠진다 */

#bo_gall .gall_box {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0;
}

#bo_gall .gall_li .gall_chk {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 2;
    padding: 6px;
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, .92);
}
#bo_gall .gall_li .gall_chk label { padding: 0; }

#bo_gall .gall_con { position: relative; }

#bo_gall .gall_img {
    position: relative;
    overflow: hidden;
    border: 0;
    border-radius: var(--radius);
    background: var(--c-bg-soft);
    aspect-ratio: 4 / 3;
}

#bo_gall .gall_img a,
#bo_gall .gall_img .no_image,
#bo_gall .gall_img .is_notice {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

#bo_gall .gall_img img,
#bo_gall .gall_img video {
    display: block;
    width: 100%;
    max-width: none;
    height: 100% !important;
    object-fit: cover;
    transition: transform .3s var(--ease);
}
#bo_gall .gall_li:hover .gall_img img { transform: scale(1.04); }

#bo_gall .gall_img span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100% !important;
    background: transparent;
    color: var(--c-text-muted);
    font-size: var(--fs-sm);
    font-weight: 700;
}

#bo_gall .gall_text_href { margin: 10px 0 4px; }
#bo_gall .gall_text_href a { font-weight: 600; }
#bo_gall .bo_cate_link { margin-bottom: 4px; }

#bo_gall .bo_tit {
    display: -webkit-box;
    overflow: hidden;
    color: var(--c-text);
    font-size: var(--fs-base);
    font-weight: 600;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

#bo_gall .bo_cnt {
    display: -webkit-box;
    overflow: hidden;
    margin-bottom: 4px;
    color: var(--c-text-muted);
    font-size: var(--fs-sm);
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

#bo_gall .gall_info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 10px;
    color: var(--c-text-muted);
    font-size: var(--fs-xs);
    line-height: 1.5;
}
#bo_gall .gall_info strong { font-weight: 500; }
#bo_gall .gall_info i { font-size: 12px; }
#bo_gall .gall_info .gall_date,
#bo_gall .gall_info .gall_view { margin: 0; color: inherit; }

#bo_gall .gall_option { position: absolute; top: 8px; right: 8px; }
#bo_gall .gall_option strong {
    padding: 3px 10px;
    border-radius: var(--radius-pill);
    background: #fff;
    box-shadow: var(--shadow-sm);
    font-size: var(--fs-xs);
}

#bo_gall .gall_now .bo_tit,
#bo_gall .gall_now .gall_text_href a { color: var(--c-primary-strong); }
#bo_gall li.empty_list { grid-column: 1 / -1; padding: 80px 0; }

/* ---------- 글 읽기 ---------- */
#bo_v { margin-bottom: 0; background: #fff; }
#bo_v_table { display: none; }

#bo_v_title { padding-bottom: var(--sp-4); }
#bo_v_title .bo_v_cate {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 10px;
    border-radius: var(--radius-pill);
    background: var(--c-secondary-soft);
    color: var(--c-secondary);
    font-size: var(--fs-xs);
    font-weight: 600;
    line-height: 1;
}
#bo_v_title .bo_v_tit {
    display: block;
    margin-top: 8px;
    font-size: clamp(1.375rem, 2.4vw, 1.75rem);
    font-weight: 800;
    line-height: 1.4;
    word-break: keep-all;
}

#bo_v_info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    margin: 0;
    padding: var(--sp-3) 0;
    border-top: 1px solid var(--bo-line);
    border-bottom: 1px solid var(--bo-line);
    color: var(--c-text-muted);
    font-size: var(--fs-sm);
}
#bo_v_info::after { display: none; }
#bo_v_info h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#bo_v_info .profile_info { display: flex; float: none; align-items: center; gap: 10px; margin: 0; }
#bo_v_info .profile_info .pf_img { float: none; margin: 0; }
#bo_v_info .profile_info .pf_img img { width: 36px; height: 36px; border-radius: 50%; }
#bo_v_info .profile_info .profile_info_ct { float: none; padding: 0; line-height: 1.6; }
#bo_v_info strong { margin: 0 10px 0 0; font-weight: 400; }
#bo_v_info .sv_member,
#bo_v_info .sv_guest,
#bo_v_info .member,
#bo_v_info .guest { color: var(--c-text); font-weight: 700; }
#bo_v_info .profile_img { display: none; }
#bo_v_info .if_date { color: var(--c-text-muted); }

#bo_v_top ul, #bo_v_bot ul { background: none; }
#bo_v_top::after, #bo_v_bot::after { display: none; }
#bo_v_top h2, #bo_v_bot h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.bo_v_com {
    display: flex;
    float: none;
    gap: 6px;
    margin: 0;
}
.bo_v_com > li { position: relative; float: none; margin: 0; }

#bo_v_atc { min-height: 160px; height: auto !important; padding: var(--sp-6) 0; }
#bo_v_atc_title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

#bo_v_img { width: 100%; overflow: hidden; }
#bo_v_img a.view_image { display: block; }
#bo_v_img img {
    max-width: 100%;
    height: auto;
    margin-bottom: var(--sp-4);
    border-radius: var(--radius-sm);
}

#bo_v_con {
    width: 100%;
    min-height: 120px;
    margin: 0;
    overflow: visible;
    color: var(--c-text);
    font-size: 1.0625rem;
    line-height: 1.85;
    word-break: keep-all;
    overflow-wrap: anywhere;
}
#bo_v_con img { max-width: 100% !important; height: auto !important; }
#bo_v_con iframe { max-width: 100%; }
#bo_v_con a { color: var(--c-secondary); text-decoration: underline; }
#bo_v_con ul { display: block; margin: 1em 0; padding-left: 1.5em; list-style: disc; }
#bo_v_con ol { display: block; margin: 1em 0; padding-left: 1.5em; list-style: decimal; }
#bo_v_con li { display: list-item; }
#bo_v_con table { max-width: 100%; }
@media (max-width: 767px) {
    #bo_v_con table { display: block; overflow-x: auto; }
    #bo_v_con { font-size: var(--fs-base); }
}

/* 첨부 · 링크 */
#bo_v_file h2, #bo_v_link h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#bo_v_file ul, #bo_v_link ul { display: grid; gap: 8px; margin: var(--sp-4) 0 0; }

#bo_v_file li,
#bo_v_link li {
    position: relative;
    margin: 0;
    padding: 14px 16px 14px 52px;
    border: 1px solid var(--c-line);
    border-radius: var(--radius);
    box-shadow: none;
    color: var(--c-text-muted);
    font-size: var(--fs-sm);
}
#bo_v_file li::after, #bo_v_link li::after { content: ""; display: block; clear: both; }
#bo_v_file li:hover,
#bo_v_link li:hover { border-color: var(--c-secondary); color: var(--c-text-muted); }

#bo_v_file li i,
#bo_v_link li i {
    position: absolute;
    top: 50%;
    left: 18px;
    float: none;
    margin: 0;
    color: var(--c-text-muted);
    font-size: 20px;
    transform: translateY(-50%);
}
#bo_v_file li:hover i,
#bo_v_link li:hover i { color: var(--c-secondary); }

#bo_v_file a,
#bo_v_link a {
    display: inline;
    float: none;
    color: var(--c-text);
    font-size: var(--fs-base);
    font-weight: 600;
    word-wrap: break-word;
}
#bo_v_file a:hover,
#bo_v_link a:hover { color: var(--c-secondary); text-decoration: underline; }
#bo_v_file img { float: none; margin: 0 6px 0 0; }

#bo_v_file .bo_v_file_cnt,
#bo_v_link .bo_v_link_cnt {
    display: block;
    color: var(--c-text-muted);
    font-size: var(--fs-xs);
}

/* 추천 · 공유 */
#bo_v_act { margin: 0 0 var(--sp-5); text-align: center; }
#bo_v_act a { margin: 0 3px; color: var(--c-text-sub); }
#bo_v_act i { margin-right: 4px; font-size: 1.2em; }
#bo_v_act .bo_v_good,
#bo_v_act .bo_v_nogood {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 72px;
    height: 44px;
    padding: 0 14px;
    border: 1px solid var(--c-line);
    border-radius: var(--radius-pill);
    line-height: 1;
}
#bo_v_act a:hover { border-color: var(--c-primary); background: #fff; color: var(--c-primary-strong); }
#bo_v_act_good,
#bo_v_act_nogood {
    top: 50px;
    width: 180px;
    border-radius: var(--radius-sm);
    background: var(--c-bg-dark);
}

#bo_v_share {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    padding: var(--sp-4) 0;
}
#bo_v_share::after { display: none; }
#bo_v_share .btn {
    width: auto;
    min-height: 36px;
    height: 36px;
    padding: 0 12px;
    border: 1px solid var(--c-line);
    border-radius: var(--radius-sm);
    background: #fff;
    color: var(--c-text-sub);
    font-size: var(--fs-sm);
    font-weight: 500;
}
#bo_v_share .btn i { margin-right: 2px; color: inherit; }

#bo_v_sns { display: flex; float: none; flex-wrap: wrap; gap: 6px; }
#bo_v_sns li { float: none; width: auto; margin: 0; }
#bo_v_sns li a {
    display: inline-flex;
    align-items: center;
    height: 36px;
    padding: 0 12px;
    border-radius: var(--radius-sm);
    color: #fff;
    font-size: var(--fs-sm);
}

/* 이전 · 다음 글 */
.bo_v_nb {
    position: relative;
    clear: both;
    margin: var(--sp-6) 0 0;
    border-top: 1px solid var(--bo-line);
    text-align: left;
}
.bo_v_nb::after { display: none; }

.bo_v_nb li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 8px;
    border-top: 0;
    border-bottom: 1px solid var(--c-line);
}
.bo_v_nb li:last-child { border-bottom: 1px solid var(--c-line); }
.bo_v_nb li:hover { background: var(--c-bg-soft); }
.bo_v_nb li i { color: var(--c-text-muted); }

.bo_v_nb li .nb_tit {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: 72px;
    padding: 0;
    color: var(--c-text-muted);
    font-size: var(--fs-sm);
}

.bo_v_nb li a {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    color: var(--c-text);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bo_v_nb li .nb_date {
    flex: 0 0 auto;
    float: none;
    color: var(--c-text-muted);
    font-size: var(--fs-sm);
}

@media (max-width: 640px) {
    .bo_v_nb li .nb_date { display: none; }
}

/* ---------- 댓글 ---------- */
.cmt_btn {
    display: flex;
    align-items: center;
    width: 100%;
    margin: var(--sp-6) 0 0;
    padding: 0 0 14px;
    border: 0;
    border-bottom: 1px solid var(--bo-line, #ececec);
    background: none;
    font-weight: 700;
    text-align: left;
}
.cmt_btn span.total { display: inline-flex; align-items: center; gap: 6px; margin-right: auto; color: var(--c-text); }
.cmt_btn span.total::after { display: none; }
.cmt_btn b { color: var(--c-text); font-size: var(--fs-md); }
.cmt_btn span.cmt_more {
    width: 12px;
    height: 12px;
    margin: 0;
    border-right: 2px solid var(--c-text-muted);
    border-bottom: 2px solid var(--c-text-muted);
    background: none;
    transform: rotate(45deg);
}
.cmt_btn_op span.cmt_more { transform: rotate(-135deg); }

#bo_vc h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#bo_vc article {
    position: relative;
    display: flex;
    gap: 12px;
    margin: 0;
    padding: var(--sp-4) 0;
    border-bottom: 1px solid var(--c-line);
}
#bo_vc article::after { display: none; }
#bo_vc article .pf_img { float: none; flex: 0 0 auto; margin: 0; }
#bo_vc article .pf_img img { width: 40px; height: 40px; border-radius: 50%; }
#bo_vc article .cm_wrap { float: none; flex: 1; width: auto; max-width: none; min-width: 0; }
#bo_vc header { position: relative; width: 100%; }
#bo_vc header .profile_img { display: none; }
#bo_vc header .icon_reply { position: static; margin-right: 4px; }
#bo_vc .member, #bo_vc .guest, #bo_vc .sv_member, #bo_vc .sv_guest { color: var(--c-text); font-weight: 700; }
.bo_vc_hdinfo { margin-left: 6px; color: var(--c-text-muted); font-size: var(--fs-sm); }
#bo_vc h1 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#bo_vc .cmt_contents { padding: 6px 0 0; color: var(--c-text-sub); line-height: 1.75; }
#bo_vc p a { text-decoration: underline; }
#bo_vc p a.s_cmt { color: var(--c-primary-strong); }
#bo_vc_empty { margin: 0; padding: 48px 0 !important; color: var(--c-text-muted); text-align: center; }
#bo_vc .bo_vl_opt { position: absolute; top: 0; right: 0; }

.bo_vc_act {
    position: absolute;
    top: 36px;
    right: 0;
    z-index: 30;
    display: none;
    width: auto;
    min-width: 80px;
    padding: 4px 0;
    border: 1px solid var(--c-line);
    border-radius: var(--radius-sm);
    background: #fff;
    box-shadow: var(--shadow);
    text-align: left;
}
.bo_vc_act::before, .bo_vc_act::after { display: none; }
.bo_vc_act li { border: 0; }
.bo_vc_act li a { display: block; padding: 8px 14px; font-size: var(--fs-sm); }
.bo_vc_act li a:hover { background: var(--c-bg-soft); color: var(--c-text); }

.bo_vc_w { position: relative; display: block; margin: var(--sp-4) 0 0; }
.bo_vc_w::after { content: ""; display: block; clear: both; }
.bo_vc_w h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.bo_vc_w #char_cnt { display: block; margin: 0 0 6px; color: var(--c-text-muted); font-size: var(--fs-sm); }
.bo_vc_w textarea { box-shadow: none; }

.bo_vc_w_wr {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--sp-3);
    margin-top: var(--sp-3);
}
.bo_vc_w_wr::after { display: none; }
.bo_vc_w_info { display: flex; float: none; flex-wrap: wrap; gap: 6px; margin: 0; }
.bo_vc_w_info .frm_input { float: none; margin: 0; }
.bo_vc_w_info #captcha { display: flex; flex-basis: 100%; padding-top: 6px; }

.bo_vc_w .btn_confirm {
    display: flex;
    clear: none;
    align-items: center;
    gap: var(--sp-3);
    margin: 0 0 0 auto;
}
.bo_vc_w .btn_confirm label { margin: 0; font-size: var(--fs-sm); }
.bo_vc_w .btn_submit { min-width: 110px; height: 44px; font-size: var(--fs-base); }
.secret_cm { display: inline-flex; float: none; }

#bo_vc_send_sns { display: inline-flex; float: none; }
#bo_vc_sns { display: flex; gap: 6px; }
#bo_vc_sns li { float: none; margin: 0; }

/* ---------- 글쓰기 ----------
   목록 표와 같은 표 형태 (2026-09-13 사용자 선택): 왼쪽 항목 이름 | 오른쪽 입력칸, 줄마다 옅은 선.
   휴대폰에서는 항목 이름이 입력칸 위로 올라간다. 스킨마다 .write-table > .write-row > .write-row__th · .write-row__td */
#bo_w { --bo-line: #ececec; }
#bo_w .write_div { position: relative; }
#bo_w .write_div::after { display: none; }

#bo_w .write-table { border-top: 1px solid var(--bo-line); }

#bo_w .write-row {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    border-bottom: 1px solid var(--bo-line);
}

#bo_w .write-row__th {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 12px 20px;
    background: #f8f8f8;
    color: var(--c-text-sub);
    font-size: var(--fs-sm);
}
#bo_w .write-row--top .write-row__th { align-items: flex-start; padding-top: 23px; }
#bo_w .write-row__th .req { color: var(--c-danger); }

#bo_w .write-row__td { min-width: 0; padding: 10px 0 10px 16px; }

@media (max-width: 767px) {
    #bo_w .write-row { grid-template-columns: minmax(0, 1fr); }
    #bo_w .write-row__th,
    #bo_w .write-row--top .write-row__th { padding: 12px 0 0; background: none; color: var(--c-text); font-weight: 600; }
    #bo_w .write-row__td { padding: 8px 0 12px; }
}

#bo_w .bo_v_option { display: flex; flex-wrap: wrap; gap: 8px 18px; }
#bo_w .bo_v_option li { float: none; margin: 0; }

#bo_w .bo_w_select select { width: 100%; max-width: 360px; }

#bo_w .bo_w_info {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 8px;
}
#bo_w .bo_w_info::after { display: none; }
#bo_w .bo_w_info .frm_input { float: none; width: 100%; margin: 0; }
#bo_w #wr_password,
#bo_w #wr_homepage { margin-left: 0; }

#bo_w .bo_w_tit .frm_input { width: 100%; padding-right: 150px; }
#bo_w .bo_w_tit #btn_autosave {
    position: absolute;
    top: 6px;
    right: 6px;
    min-height: 32px;
    height: 32px;
    padding: 0 10px;
    font-size: var(--fs-sm);
}

#bo_w .wr_content.smarteditor2 iframe { background: #fff; }
#char_count_desc { display: block; margin: 0 0 6px; color: var(--c-text-muted); font-size: var(--fs-sm); }
#char_count_wrap { margin: 6px 0 0; text-align: right; color: var(--c-text-muted); font-size: var(--fs-sm); }
#char_count { font-weight: 700; }

#bo_w .bo_w_link .frm_input { width: 100%; }

#bo_w .bo_w_flie .file_wr {
    display: flex;
    align-items: center;
    min-height: 44px;
    height: auto;
    margin: 0;
    padding: 6px 12px;
    border: 1px solid var(--c-line-strong);
    border-radius: var(--radius-sm);
}
#bo_w .bo_w_flie .frm_file { margin: 0; padding: 0; max-width: 100%; }
#bo_w .bo_w_flie .frm_input { width: 100%; margin: 8px 0 0; }
#bo_w .bo_w_flie .file_del { position: static; display: block; margin-top: 6px; color: var(--c-text-muted); font-size: var(--fs-sm); }

#bo_w .btn_confirm { justify-content: center; margin-top: var(--sp-6); }
#bo_w .btn_submit,
#bo_w .btn_cancel { min-width: 120px; min-height: 50px; font-size: var(--fs-md); }
/* 취소는 흰 바탕 테두리 버튼 (회청색 채움 대신) */
#bo_w .btn_cancel,
#bo_w .btn_cancel:hover { border-color: var(--c-line-strong); background: #fff; color: var(--c-text); }
#bo_w .btn_cancel:hover { border-color: var(--c-text); }

#autosave_wrapper { position: relative; }
#autosave_pop {
    position: absolute !important;
    top: 44px;
    right: 0;
    z-index: 10;
    display: none;
    width: min(350px, 90vw);
    height: auto !important;
    max-height: none;
    border: 1px solid var(--c-line);
    border-radius: var(--radius-sm);
    background: #fff;
    box-shadow: var(--shadow);
}
#autosave_pop::before, #autosave_pop::after { display: none; }
#autosave_pop strong { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#autosave_pop ul { height: 160px; margin: 0; padding: 10px; overflow-y: auto; border-bottom: 1px solid var(--c-line); }
#autosave_pop li { display: flex; justify-content: space-between; gap: 8px; padding: 8px; border-bottom: 1px solid var(--c-line); background: none; }
#autosave_pop a { float: none; }
#autosave_pop span { float: none; color: var(--c-text-muted); font-size: var(--fs-xs); font-style: normal; }
.autosave_close { width: 100%; height: 36px; border: 0; background: none; color: var(--c-text-muted); font-weight: 600; }
.autosave_close:hover { background: var(--c-bg-soft); color: var(--c-text); }
.autosave_content { display: none; }
.autosave_del {
    width: 20px;
    height: 20px;
    overflow: hidden;
    border: 0;
    background: none;
    color: var(--c-text-muted);
    text-indent: 0;
    font-size: 0;
}
.autosave_del::before { content: "\00D7"; font-size: 18px; line-height: 1; }

/* ---------- 회원: 공통 상자 ---------- */
.mbskin {
    position: relative;
    width: 100%;
    max-width: 460px;
    margin: 0 auto;
    text-align: left;
}
.mbskin::after { display: none; }

.mbskin .mbskin_box {
    overflow: hidden;
    border: 1px solid var(--c-line);
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: var(--shadow-sm);
}

.mbskin h1 { margin: 0 0 var(--sp-5); font-size: var(--fs-xl); text-align: center; }
.mbskin .frm_input { width: 100%; }
.mbskin .btn_submit { width: 100%; min-height: 50px; margin: 0; font-size: var(--fs-md); }

/* 로그인 */
#mb_login h1 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.mb_log_cate { display: flex; border-bottom: 1px solid var(--c-line); }
.mb_log_cate::after { display: none; }
.mb_log_cate h2 {
    flex: 1;
    float: none;
    width: auto;
    padding: 16px 0;
    color: var(--c-text);
    font-size: var(--fs-md);
    text-align: center;
}
.mb_log_cate .join {
    flex: 1;
    float: none;
    width: auto;
    padding: 16px 0;
    background: var(--c-bg-soft);
    color: var(--c-text-sub);
    font-weight: 600;
    text-align: center;
}
.mb_log_cate .join:hover { color: var(--c-primary-strong); }

#login_fs { display: grid; gap: 10px; padding: var(--sp-6); }
#mb_login #login_fs .frm_input,
#mb_login #login_fs .btn_submit { margin: 0; }

#login_info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 4px;
    font-size: var(--fs-sm);
}
#login_info::after { display: none; }
#login_info .login_if_auto,
#login_info .login_if_lpl { float: none; }
#login_info .login_if_auto label { padding-left: 0; }
#login_password_lost {
    display: inline;
    padding: 0;
    border: 0;
    color: var(--c-text-sub);
    text-decoration: underline;
    text-underline-offset: 3px;
}

#mb_login #sns_login { margin: 0; padding: 0 var(--sp-6) var(--sp-6); border: 0; }
#mb_login #sns_login h3 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

#mb_login_notmb,
#mb_login_od_wr {
    margin: var(--sp-5) auto 0;
    padding: var(--sp-5);
    border: 1px solid var(--c-line);
    border-radius: var(--radius-lg);
}
#mb_login_notmb h2,
#mb_login_od_wr h2 { margin: 0 0 var(--sp-3); font-size: var(--fs-md); }
#guest_privacy {
    height: 150px;
    margin: 10px 0;
    padding: 12px;
    overflow-y: auto;
    border: 1px solid var(--c-line);
    border-radius: var(--radius-sm);
    background: var(--c-bg-soft);
    color: var(--c-text-sub);
    font-size: var(--fs-sm);
    line-height: 1.7;
    text-align: left;
}
#mb_login_notmb .btn_submit { display: flex; }
#mb_login_od_wr .frm_input { margin: 10px 0 0; }
#mb_login_od_wr p { margin: var(--sp-4) 0 0; padding: 14px 16px; border-radius: var(--radius-sm); background: var(--c-bg-soft); line-height: 1.6; }

/* 회원가입 약관 */
.register { max-width: 860px; margin: 0 auto; }
.register::after { display: none; }

.register .btn_confirm { justify-content: center; margin-top: var(--sp-5); }
.register .btn_confirm .btn_submit,
.register .btn_confirm .btn_close {
    float: none;
    width: auto;
    min-width: 160px;
    height: auto !important;
    min-height: 52px;
    margin: 0;
    font-size: var(--fs-md);
}

#fregister p {
    position: relative;
    height: auto;
    margin: 0 0 var(--sp-4);
    padding: 14px 18px;
    border-radius: var(--radius);
    background: var(--c-primary-soft);
    color: var(--c-primary-strong);
    font-size: var(--fs-base);
    font-weight: 600;
    line-height: 1.5;
    text-align: left;
}
#fregister p::before { display: none; }
#fregister p i { margin-right: 6px; }

#fregister section {
    position: relative;
    margin: 0 0 var(--sp-4);
    overflow: hidden;
    border: 1px solid var(--c-line);
    border-radius: var(--radius);
}

#fregister h2 {
    padding: 16px 60px 16px 20px;
    border-bottom: 1px solid var(--c-line);
    background: var(--c-bg-soft);
    font-size: var(--fs-base);
    text-align: left;
}

#fregister textarea {
    display: block;
    width: 100%;
    height: 180px;
    padding: 16px 20px;
    border: 0;
    background: #fff;
    color: var(--c-text-sub);
    font-size: var(--fs-sm);
    line-height: 1.7;
    resize: vertical;
}

#fregister_chkall {
    position: relative;
    top: auto;     /* 아래 .fregister_agree 의 top · right 가 relative 에도 먹어 아래 · 왼쪽으로 밀리던 것 */
    right: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--sp-4);
    padding: 14px;
    border: 0;
    border-radius: var(--radius);
    background: var(--c-bg-soft);
    line-height: 1.5;
}

.fregister_agree { position: absolute; top: 14px; right: 16px; }
.fregister_agree.chk_all { position: static; }
#fregister .fregister_agree label { margin: -8px; padding: 8px; }   /* 제목 오른쪽 체크 칸 — 휴대폰에서 누르기 쉽게 누르는 곳만 넓힘 */

.fregister_terms div { padding: 20px; background: #fff; }
.fregister_terms table { width: 100%; font-size: var(--fs-sm); }
.fregister_terms table caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.fregister_terms table th { width: 33.33%; padding: 10px; border: 1px solid var(--c-line); background: var(--c-bg-soft); color: var(--c-text); }
.fregister_terms table td { padding: 10px; border: 1px solid var(--c-line); border-top: 0; }

.chk_li { padding-left: 0; }

/* 회원가입 입력 */
#register_form { margin-bottom: var(--sp-4); background: none; }
#register_form h2,
.register_form_inner h2 {
    padding: 16px 20px;
    border-bottom: 1px solid var(--c-line);
    background: var(--c-bg-soft);
    font-size: var(--fs-base);
}
.register_form_inner {
    overflow: hidden;
    margin-bottom: var(--sp-4);
    border: 1px solid var(--c-line);
    border-radius: var(--radius);
    background: #fff;
}
.register_form_inner ul { display: grid; gap: var(--sp-4); padding: 20px; }
.register_form_inner label { display: block; margin-bottom: 6px; font-weight: 600; line-height: 1.5; }
.register_form_inner label.inline { display: inline; }

#fregisterform .cert_desc { color: var(--c-secondary); }
#fregisterform .cert_req { margin-left: 5px; }
#fregisterform #msg_certify { margin: 5px 0; padding: 8px; border-radius: var(--radius-sm); background: var(--c-secondary-soft); text-align: center; }
#fregisterform .frm_address { margin: 6px 0 0; }
#fregisterform #mb_addr3 { display: inline-block; margin: 6px 0 0; }
#fregisterform #mb_addr_jibeon { display: block; margin: 6px 0 0; color: var(--c-text-muted); font-size: var(--fs-sm); }
#fregisterform .btn_confirm { justify-content: center; }
#fregisterform .form_01 div { margin: 0 0 var(--sp-4); }
#fregisterform .captcha { display: block; margin: 6px 0 0; }
#fregisterform .reg_mb_img_file img { max-width: 100%; height: auto; }
#reg_mb_icon, #reg_mb_img { float: right; }
#fregisterform .consent-line { display: flex; margin: 0 !important; }
#fregisterform .consent-date { margin: 5px 0 0 28px !important; color: var(--c-text-muted); font-size: var(--fs-sm); }
#fregisterform .consent-group .sub-consents { padding: 0 20px; }
#fregisterform .js-open-consent {
    display: block;
    margin-left: 10px;
    border: 0;
    background: none;
    color: var(--c-secondary);
    font-size: var(--fs-sm);
    text-decoration: underline;
    cursor: pointer;
}

/* 회원가입 완료 */
#reg_result {
    max-width: 960px; /* 640px 이면 안내 글이 한두 글자씩 다음 줄로 넘어가 보였다 (사용자 요청 2026-09-18) */
    margin: 0 auto;
    padding: var(--sp-7) var(--sp-5);
    border: 0;
    border-radius: var(--radius-lg);
    background: var(--c-bg-soft);
    text-align: center;
}
#reg_result h2 { margin: 0 0 var(--sp-4); font-size: var(--fs-xl); }
#reg_result h2 strong { color: var(--c-primary-strong); }
#reg_result i { color: var(--c-primary); font-size: 3em; }
#reg_result p { line-height: 1.8; }
#reg_result .reg_result_p { margin: 0 0 10px; color: var(--c-text); font-size: var(--fs-md); }
#reg_result #result_email {
    margin: var(--sp-4) 0;
    padding: 12px 20px;
    border: 0;
    border-radius: var(--radius-sm);
    background: #fff;
    line-height: 2;
}
#reg_result #result_email span { display: inline-block; width: 120px; }
#reg_result #result_email strong { color: var(--c-primary-strong); }
#reg_result .btn_confirm { justify-content: center; margin: var(--sp-6) 0 0; }

.btn_confirm_reg { margin: var(--sp-5) 0; text-align: center; }
.reg_btn_submit { width: min(280px, 100%); min-height: 56px; font-size: var(--fs-md); }

/* 아이디 · 비밀번호 찾기, 재설정 */
#find_info h3 { display: none; margin-bottom: var(--sp-4); text-align: center; font-size: var(--fs-md); }
#find_info .new_win_con { padding: var(--sp-5); border-radius: var(--radius); background: var(--c-bg-soft); }
#find_info.cert .new_win_con { float: none; width: auto; }
#find_info.cert .new_win_con:nth-child(2) { margin-left: 0; }
#find_info.cert h3 { display: block; }
#find_info p { line-height: 1.6; }
#find_info #mb_email { width: 100%; margin: 10px 0; }
#find_info .find_btn .btn_submit { width: auto; }
#pw_reset #info_fs { margin-bottom: 10px; }
#pw_reset .frm_input { width: 100%; margin: 10px 0 0; }

/* 회원 · 비밀글 비밀번호 확인 */
#pw_confirm h1 { margin: var(--sp-6) 20px var(--sp-4); font-size: var(--fs-xl); text-align: center; }
/* 회원 비밀번호 확인은 사진 상단에 같은 제목이 있으므로 화면에서는 숨긴다 (읽어 주기는 남김) */
#mb_confirm h1 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

#mb_confirm p,
#pw_confirm p {
    padding: 0 20px var(--sp-5);
    border-bottom: 1px solid var(--c-line);
    color: var(--c-text-sub);
    line-height: 1.6;
    text-align: center;
}
#mb_confirm p strong,
#pw_confirm p strong { display: block; margin: 0 0 6px; color: var(--c-primary-strong); font-size: var(--fs-md); }

#mb_confirm fieldset,
#pw_confirm fieldset { display: grid; gap: 10px; padding: var(--sp-6); text-align: left; }
#mb_confirm fieldset .frm_input,
#pw_confirm fieldset .frm_input { width: 100%; background-color: #fff !important; }
#mb_confirm_id { display: block; margin: 0; font-weight: 700; }
#mb_confirm .confirm_id { color: var(--c-text-muted); font-size: var(--fs-sm); }
#pw_confirm_id { display: block; margin: 0; font-weight: 700; }

/* 기존 회원 본인인증 */
#member_cert_refresh p {
    height: auto;
    margin: 0 0 var(--sp-4);
    padding: 14px 18px;
    border-radius: var(--radius);
    background: var(--c-primary-soft);
    color: var(--c-primary-strong);
    font-weight: 600;
    line-height: 1.5;
}
#member_cert_refresh p::before { display: none; }
#member_cert_refresh section { position: relative; margin: 0 0 var(--sp-4); overflow: hidden; border: 1px solid var(--c-line); border-radius: var(--radius); }
#member_cert_refresh h2 { padding: 16px 60px 16px 20px; border-bottom: 1px solid var(--c-line); background: var(--c-bg-soft); font-size: var(--fs-base); }
#member_cert_refresh textarea { display: block; width: 100%; height: 150px; padding: 16px 20px; border: 0; line-height: 1.7; }
.member_cert_refresh_agree { position: absolute; top: 14px; right: 16px; }

/* 쪽지 */
.memo_list { border-top: 1px solid var(--c-line); }
.memo_list li { position: relative; padding: 14px 16px; border-bottom: 1px solid var(--c-line); background: #fff; }
.memo_list li::after { content: ""; display: block; clear: both; }
.memo_list li.read { background: var(--c-bg-soft); }
.memo_list li.empty_li { padding: 32px 0; color: var(--c-text-muted); text-align: center; }
.memo_list .memo_li { float: left; }
.memo_list .profile_big_img { position: relative; margin-right: 12px; }
.memo_list .profile_big_img img { width: 48px; height: 48px; border-radius: 50%; }
.memo_list .memo_li.memo_name { float: none; padding-top: 4px; }
.memo_list .memo_preview a { display: block; margin-right: 30px; padding-top: 6px; }
.memo_list .no_read {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--c-primary);
    text-indent: -9999px;
}
#memo_list .memo_datetime { color: var(--c-text-muted); font-size: var(--fs-sm); }
#memo_list .memo_del { position: absolute; top: 12px; right: 12px; padding: 8px; color: var(--c-text-muted); font-size: 18px; }
#memo_list .pg_wrap { width: 100%; }

#memo_view_contents { margin-bottom: var(--sp-4); border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
.memo_from { position: relative; padding: 14px 20px; border-bottom: 1px solid var(--c-line); background: #fff; }
.memo_from::after { content: ""; display: block; clear: both; }
.memo_from li { float: left; }
.memo_from li.memo_profile img { width: 40px; height: 40px; border-radius: 50%; }
.memo_from li:first-child { margin-right: 10px; }
.memo_from li.memo_view_date { display: block; color: var(--c-text-muted); line-height: 24px; }
.memo_from li.memo_op_btn { position: absolute; }
.memo_from li.list_btn { right: 53px; }
.memo_from li.del_btn { right: 15px; }
.memo_btn { display: flex; justify-content: space-between; width: 100%; }
.memo_btn a { padding: 16px 20px; color: var(--c-text-muted); }
#memo_view p { min-height: 150px; height: auto !important; padding: 16px 20px; background: #fff; line-height: 1.8; }
#memo_write .form_01 { padding: 20px; border-top: 1px solid var(--c-line); }
.reply_btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 18px; border-radius: var(--radius-sm); background: var(--c-primary); color: #fff; font-weight: 700; }

/* 스크랩 · 포인트 · 자기소개 · 폼메일 */
#scrap li { position: relative; padding: 16px 20px; border-bottom: 1px solid var(--c-line); }
#scrap .scrap_tit { display: block; margin-bottom: 6px; font-weight: 700; line-height: 1.4; }
#scrap .scrap_cate { float: left; margin-right: 8px; padding: 1px 8px; border-radius: var(--radius-pill); background: var(--c-secondary-soft); color: var(--c-secondary); font-size: var(--fs-xs); }
#scrap .scrap_datetime { color: var(--c-text-muted); font-size: var(--fs-sm); }
#scrap .scrap_del { position: absolute; top: 14px; right: 14px; color: var(--c-text-muted); font-size: 18px; }
#scrap_do .new_win_con { padding: 0 20px; }
#scrap_do textarea { width: 100%; height: 100px; }
#scrap_do .scrap_tit { margin-bottom: 10px; padding: 10px 14px; border-radius: var(--radius-sm); background: var(--c-bg-soft); font-weight: 700; }
#scrap_do label { display: block; margin: 0 0 6px; }
#scrap .win_btn, #scrap_do .win_btn { margin: var(--sp-5) 0; }

#point .point_all {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: 20px;
    overflow: hidden;
    border: 1px solid var(--c-line);
    border-radius: var(--radius);
    background: var(--c-bg-soft);
}
#point .point_all li { float: none; width: auto; padding: 16px 20px; text-align: left; }
#point .point_all li span { float: right; font-weight: 700; }
#point .point_all li:last-child { border-left: 1px solid var(--c-line); }
#point .point_all .full_li { grid-column: 1 / -1; width: auto; border-bottom: 1px solid var(--c-line); }
#point .point_status { background: var(--c-bg-dark); color: #fff; }
.point_list li { position: relative; padding: 14px 16px; border-bottom: 1px solid var(--c-line); background: #fff; }
.point_list li:first-child { border-top: 1px solid var(--c-line); }
.point_list .point_use { background: var(--c-bg-soft); }
.point_list .point_num { position: absolute; top: 20px; right: 16px; color: var(--c-secondary); font-size: var(--fs-md); font-weight: 700; }
.point_list .point_use .point_num { position: static; float: right; color: var(--c-danger); }
.point_list .point_tit { display: block; margin-bottom: 4px; font-weight: 700; }
.point_list .point_date1,
.point_list .point_date { color: var(--c-text-muted); font-size: var(--fs-sm); }
.point_list .txt_expired { margin-left: 5px; color: var(--c-danger); }

#profile table { margin-bottom: 0; }
#profile table th { width: 110px; padding: 10px; text-align: left; }
#profile section { margin: 10px 0; padding: 12px; border: 1px solid var(--c-line); border-radius: var(--radius-sm); background: #fff; color: var(--c-text-sub); }
#profile .profile_name { font-weight: 700; text-align: center; }
#profile .my_profile_img { display: block; margin: 20px 0 5px; }
#profile .my_profile_img img, #profile .profile_img img { border-radius: 50%; }

#formmail textarea { height: 120px; }
#formmail .formmail_flie { position: relative; }
#formmail .formmail_flie .file_wr { display: flex; align-items: center; min-height: 44px; padding: 6px 12px 6px 44px; border: 1px solid var(--c-line-strong); border-radius: var(--radius-sm); }
#formmail .lb_icon { position: absolute; top: 50%; left: 0; width: 44px; text-align: center; color: var(--c-text-muted); transform: translateY(-50%); }
#formmail .frm_file { padding-left: 0; }

/* ---------- 내용관리 (bbs/content.php) ---------- */
#ctt { margin: 0; }
#ctt_con { line-height: 1.85; }
#ctt_con img { max-width: 100%; height: auto; }
.ctt_admin { margin-bottom: var(--sp-4); text-align: right; }
#ctt header h1 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ---------- 자주하시는 질문 ---------- */
#faq_hhtml, #faq_thtml { margin: var(--sp-4) 0; }
#bo_cate.faq_cate, #faq_cate { margin-bottom: var(--sp-5); }
#faq_wrap { margin: 0 0 var(--sp-5); }
#faq_wrap h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#faq_con ol { border-top: 2px solid var(--c-text); }
#faq_con li { border-bottom: 1px solid var(--c-line); }
#faq_con h3 { position: relative; }
#faq_con h3 a { display: block; padding: 18px 48px 18px 20px; color: var(--c-text); font-size: var(--fs-base); font-weight: 600; line-height: 1.6; }
#faq_con h3 .tit_bg { margin-right: 8px; color: var(--c-primary); font-weight: 800; }
#faq_con h3 .tit_btn { position: absolute; top: 20px; right: 16px; border: 0; background: none; color: var(--c-text-muted); }
#faq_con .con_inner { display: none; position: relative; padding: 18px 20px 18px 48px; background: var(--c-bg-soft); color: var(--c-text-sub); line-height: 1.8; }
#faq_con .con_inner .tit_bg { position: absolute; top: 18px; left: 20px; color: var(--c-secondary); font-weight: 800; }
#faq_con .con_inner .closer_btn { display: none; }
#faq_sch { margin: var(--sp-5) 0; }
#faq_sch h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#faq_sch form, .faq_sch { display: flex; max-width: 420px; margin: 0 auto; }
#faq_sch .frm_input { flex: 1; border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
#faq_sch .btn_submit { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }

/* ---------- 1:1문의 ---------- */
#bo_list.qa_list .td_subject a,
.qa_list .bo_tit { color: var(--c-text); }
#bo_v.qa_view .bo_v_tit { font-size: var(--fs-xl); }
#bo_v_ans { margin-top: var(--sp-6); padding: var(--sp-5); border-radius: var(--radius); background: var(--c-bg-soft); }
#bo_v_ans h2 { margin-bottom: var(--sp-3); font-size: var(--fs-md); }
#bo_v_addq, #bo_v_rel { margin-top: var(--sp-5); }
.qa_status { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: var(--radius-pill); background: var(--c-bg-soft); color: var(--c-text-sub); font-size: var(--fs-xs); font-weight: 700; }
.qa_status.txt_done { background: var(--c-success-soft); color: var(--c-success); }

/* ---------- 전체검색 · 새글 ---------- */
#sch_res_detail {
    margin: 0 0 var(--sp-5);
    padding: var(--sp-5);
    border-radius: var(--radius);
    background: var(--c-bg-soft);
}
#sch_res_detail legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#sch_res_detail form { display: flex; flex-wrap: wrap; gap: 8px; }
/* 검색어 칸: 입력칸의 size="40" 기본 폭 때문에 휴대폰에서 검색 단추가 화면 밖으로 밀리던 것 — 칸이 줄어들 수 있게 min-width: 0 */
#sch_res_detail .sch_wr { display: flex; flex: 1 1 240px; min-width: 0; max-width: 100%; }
#sch_res_detail .frm_input { flex: 1 1 auto; width: auto; min-width: 0; border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
#sch_res_detail .btn_submit { flex: 0 0 auto; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
#sch_res_detail .sch_rd { display: flex; flex-wrap: wrap; gap: 12px; flex-basis: 100%; font-size: var(--fs-sm); }

#sch_res_ov { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin: 0 0 var(--sp-4); }
#sch_res_ov h2 { font-size: var(--fs-md); }
#sch_res_ov h2 strong { color: var(--c-primary-strong); }
#sch_res_ov ul { display: flex; gap: 12px; color: var(--c-text-muted); font-size: var(--fs-sm); }
#sch_res_board { margin-bottom: var(--sp-4); }
#sch_res_board ul { display: flex; flex-wrap: wrap; gap: 6px; }
#sch_res_board a { display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; border: 1px solid var(--c-line); border-radius: var(--radius-pill); font-size: var(--fs-sm); }
#sch_res_board .sch_on { border-color: var(--c-text); background: var(--c-text); color: #fff; }
.sch_res_list { margin-bottom: var(--sp-5); }
.sch_res_list h2 { margin-bottom: var(--sp-2); padding-bottom: 8px; border-bottom: 1px solid var(--c-text); font-size: var(--fs-md); }
.sch_res_list li { padding: 14px 0; border-bottom: 1px solid var(--c-line); }
.sch_res_list .sch_res_title { font-weight: 700; }
.sch_res_list p { margin: 4px 0; color: var(--c-text-sub); font-size: var(--fs-sm); }
.sch_res_list .sch_info { color: var(--c-text-muted); font-size: var(--fs-xs); }
.sch_more { text-align: right; }

#new_sch { margin: 0 0 var(--sp-4); padding: var(--sp-4); border-radius: var(--radius); background: var(--c-bg-soft); }
#new_sch legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#new_sch form { display: flex; flex-wrap: wrap; gap: 8px; }
#new_sch p { flex-basis: 100%; color: var(--c-text-muted); font-size: var(--fs-sm); }

/* ---------- 투표 · 인기검색어 · 접속자 · 방문자 (테마에서 쓰지 않지만 부를 때 대비) ---------- */
#poll { padding: var(--sp-4); border: 1px solid var(--c-line); border-radius: var(--radius); }
#poll h2 { margin-bottom: var(--sp-3); font-size: var(--fs-base); }
#poll ul { display: grid; gap: 6px; }
#poll_btn { display: flex; gap: 6px; margin-top: var(--sp-3); }
#popular { padding: var(--sp-4); }
#popular ul { display: flex; flex-wrap: wrap; gap: 6px; }
#popular a { display: inline-block; padding: 4px 10px; border-radius: var(--radius-pill); background: var(--c-bg-soft); font-size: var(--fs-sm); }
#visit { padding: var(--sp-4); border: 1px solid var(--c-line); border-radius: var(--radius); }
#visit dl { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; }
#visit dd { text-align: right; font-weight: 700; }
#current_connect ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
#current_connect li { padding: 12px; border: 1px solid var(--c-line); border-radius: var(--radius-sm); }
.ol { position: relative; }
.ol h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ---------- 활동처현황 (skin/board/place) ---------- */
#bo_list .td_place,
#bo_list .td_place-name { text-align: center; }   /* 옛 스킨처럼 활동처명도 가운데 */
#bo_list .td_place--addr { text-align: left; }
.place-label { display: none; }

@media (max-width: 767px) {
    #bo_list .tbl_head01 .td_place {
        display: block;
        margin: 2px 0 0;
        color: var(--c-text-sub);
        font-size: var(--fs-sm);
        text-align: left;
    }
    .place-label {
        display: inline-block;
        min-width: 96px;
        margin-right: 8px;
        color: var(--c-text-muted);
    }
}

/* ---------- 갤러리 목록 보정 ---------- */
/* 스킨이 사진 칸에 style="height:150px" 를 직접 넣으므로 비율 상자로 되돌린다.
   격자 칸이 사진 원래 폭보다 좁아질 수 있게 min-width 를 0 으로 둔다 (휴대폰 가로 넘침 방지). */
#bo_gall .gall_li,
#bo_gall .gall_box,
#bo_gall .gall_con { min-width: 0; }
#bo_gall .gall_img { width: 100%; height: auto !important; max-height: none !important; }

/* 관리자가 아닐 때도 번호만 든 빈 선택 칸이 있어 흰 점처럼 보이던 것을 숨긴다 */
#bo_gall .gall_li .gall_chk { padding: 0; background: none; }
#bo_gall .gall_li .gall_chk:has(input) { padding: 6px; background: rgba(255, 255, 255, .92); }

/* ---------- 할인가맹점 (skin/board/discount — 옛 daon_review 스킨과 같은 목록) ----------
   3:2 사진 아래에 상호(가운데) → 업종 · 소재지 · 연락처 · 할인적용 줄을 가는 선으로 나눈다 */
#bo_gall.bo-discount .gall_img { aspect-ratio: 3 / 2; }
#bo_gall.bo-discount .gall_text_href { margin: 12px 0 8px; text-align: center; }
#bo_gall.bo-discount .bo_tit { color: var(--c-text); font-size: 1.0625rem; font-weight: 700; }

.discount-info { border-top: 1px solid var(--c-line); list-style: none; }
.discount-info li {
    padding: 8px 12px;
    border-bottom: 1px solid var(--c-line);
    color: var(--c-text-sub);
    font-size: var(--fs-sm);
    line-height: 1.5;
    word-break: keep-all;
}
.discount-info__label { color: var(--c-text); }

/* ---------- 명예의 전당 (skin/board/honorable — 옛 daon_grand 스킨과 같은 카드) ----------
   옛 배경 그림(406×326 — 월계관 · "사하구 자원봉사센터" · 별이 그려져 있음) 위에
   년도 · 명예장 · 금배지 글을 옛 자리 그대로 올린다.
   칸 폭이 달라져도 글자가 그림 속 월계관·별과 겹치지 않게, 글자 크기와 여백을 카드 폭 기준(cqw)으로 잡는다.
   옛 스킨 값(px, 카드 406px) → cqw: 50px = 12.315cqw, 60px = 14.778cqw, 30px = 7.389cqw,
   글자 25.2px = 6.207cqw, 16.8px = 4.138cqw */
#bo_gall.bo-honor #gall_ul { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-5); }

.honor-card {
    position: relative;
    overflow: hidden;
    container-type: inline-size;
    aspect-ratio: 406 / 326;
    background-color: #1f2a2a;
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    word-break: keep-all;
}
.honor-card__link { display: block; height: 100%; color: inherit; }
.honor-card__link:hover { color: inherit; }

.honor-card__year,
.honor-card__title,
.honor-card__names { margin: 0; line-height: 1.6; }

.honor-card__year {
    padding-top: 12.315cqw;
    color: #ff9;
    font-size: 6.207cqw;
    font-weight: 500;
    letter-spacing: 2.463cqw;
}
.honor-card__title {
    color: #ff9;
    font-size: 6.207cqw;
    font-weight: 500;
    letter-spacing: .985cqw;
}
.honor-card__year + .honor-card__title { padding-top: 12.315cqw; }
.honor-card__year + .honor-card__title--only { padding-top: 14.778cqw; }

.honor-card__names {
    color: #fff;
    font-size: 4.138cqw;
    font-weight: 300;
    letter-spacing: .985cqw;
}
.honor-card__names--only { padding: .493cqw 7.389cqw 0; letter-spacing: .739cqw; }
.honor-card__names--gold { padding: 0 7.389cqw; line-height: 1.2; }

@media (max-width: 960px) {
    #bo_gall.bo-honor #gall_ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    #bo_gall.bo-honor #gall_ul { grid-template-columns: minmax(0, 1fr); }
}

/* 글쓰기: 배경 그림 고르기 (표 형태 오른쪽 칸 안에서 가로로) */
.honor-bg-choice { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-5); }
.honor-bg-choice label { display: inline-flex; align-items: center; gap: 6px; }

/* ---------- 회원 상자 여백 ----------
   로그인 · 회원 비밀번호 확인도 사이트 머리글 · 사진 상단 안(.site-content)에 뜬다 (theme head.sub.php → head.php).
   머리글 없이 뜨는 경우(다른 화면에서 쓰일 때)를 위해 바깥 여백은 남겨 둔다. */
.mbskin { margin: clamp(40px, 10vh, 96px) auto 48px; padding: 0 var(--gutter); }
.site-content .mbskin { margin-top: 0; padding: 0; }
