@charset "utf-8";

/* =============================================
   CSS 변수 — 메인 디자인과 통일
============================================= */
:root {
    --primary:    #e6802c;
    --primary-lt: rgba(230,128,44,0.12);
    --primary-bd: rgba(230,128,44,0.3);
    --black:      #0a0a0a;
    --gray-dark:  #333;
    --gray-mid:   #777;
    --gray-lt:    #f7f7f7;
    --border:     #ebebeb;
    --white:      #fff;
    --radius:     14px;
    --radius-sm:  6px;
    --shadow:     0 2px 16px rgba(0,0,0,0.07);
    --shadow-hover: 0 8px 32px rgba(0,0,0,0.13);
    --transition: 0.25s ease;
    --font-main:  'SCoreDream','Pretendard',sans-serif;
    --font-body:  'Pretendard',sans-serif;
}

/* =============================================
   공통
============================================= */
#bo_gall { font-family: var(--font-body); color: var(--gray-dark); padding:80px 0; margin-bottom: 150px;}
#bo_gall h2 { margin: 0; padding: 0; width: 1px; height: 1px; font-size: 0; line-height: 0; overflow: hidden; }

/* 카테고리 */
#bo_cate { margin: 0 0 28px; }
#bo_cate h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_cate ul { zoom: 1; }
#bo_cate ul:after { display: block; visibility: hidden; clear: both; content: ""; }
#bo_cate li { display: inline-block; padding: 3px; }
#bo_cate a {
    display: block;
    line-height: 1;
    padding: 8px 18px;
    border-radius: 100px;
    border: 1px solid var(--border);
    color: var(--gray-mid);
    font-size: 13px;
    font-family: var(--font-body);
    transition: all var(--transition);
    text-decoration: none;
}
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active {
    background: var(--primary);
    color: var(--white);
    border-color: var(--primary);
    text-decoration: none;
}
#bo_cate #bo_cate_on {
    background: var(--primary);
    color: var(--white);
    border-color: var(--primary);
    font-weight: 600;
}

/* 상단 버튼 */
#bo_btn_top { margin: 0 0 24px; display: flex; align-items: center; justify-content: space-between; }
#bo_btn_top:after { display: block; visibility: hidden; clear: both; content: ""; }
#bo_list_total { font-size: 13px; color: var(--gray-mid); }
#bo_list_total span { font-weight: 600; color: var(--gray-dark); margin-right: 4px; }

.btn { display: inline-flex; align-items: center; justify-content: center; }
.btn_b01, .btn_admin {
    width: 38px; height: 38px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border);
    background: var(--white);
    color: var(--gray-mid);
    font-size: 14px;
    transition: all var(--transition);
    text-decoration: none;
    cursor: pointer;
}
.btn_b01:hover, .btn_admin:hover {
    background: var(--primary);
    color: var(--white);
    border-color: var(--primary);
}
.btn_bo_user { float: right; margin: 0; padding: 0; list-style: none; display: flex; gap: 6px; }
.btn_bo_user li { position: relative; float: none; width: auto; margin: 0; background: none; }
.btn_bo_user > li { position: relative; }
.bo_fx { margin-bottom: 8px; float: right; }
.bo_fx:after { display: block; visibility: hidden; clear: both; content: ""; }
.bo_fx ul { margin: 0; padding: 0; list-style: none; display: flex; gap: 6px; }

/* 더보기 옵션 */
.more_opt {
    display: none;
    position: absolute;
    top: 44px; right: 0;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    z-index: 999;
    box-shadow: var(--shadow);
    min-width: 110px;
    overflow: hidden;
    padding: 0; margin: 0;
}
.more_opt:before, .more_opt:after { display: none; }
.more_opt li {
    border-bottom: 1px solid var(--border);
    padding: 0; float: none;
    width: auto; margin: 0;
    text-align: left;
}
.more_opt li:last-child { border-bottom: 0; }
.more_opt li button, .more_opt li a {
    display: block; width: 100%;
    padding: 10px 16px;
    border: 0; background: var(--white);
    color: var(--gray-mid); font-size: 13px;
    text-align: left; transition: all var(--transition);
    cursor: pointer;
}
.more_opt li:hover a, .more_opt li:hover button {
    background: var(--gray-lt); color: var(--primary);
}
.more_opt li i { float: right; line-height: 20px; }

/* 전체선택 */
#gall_allchk { margin-bottom: 16px; font-size: 13px; color: var(--gray-mid); }

/* 체크박스 */
.selec_chk { position: absolute; top: 0; left: 0; width: 0; height: 0; opacity: 0; outline: 0; z-index: -1; overflow: hidden; }
.chk_box { position: relative; }
.chk_box input[type="checkbox"] + label { position: relative; padding-left: 22px; color: var(--gray-mid); vertical-align: baseline; font-size: 13px; cursor: pointer; }
.chk_box input[type="checkbox"] + label:hover { color: var(--primary); }
.chk_box input[type="checkbox"] + label span {
    position: absolute; top: 50%; left: 0;
    transform: translateY(-50%);
    width: 16px; height: 16px;
    display: block; background: var(--white);
    border: 1.5px solid var(--border); border-radius: 4px;
    transition: all var(--transition);
}
.chk_box input[type="checkbox"]:checked + label span {
    background: var(--primary); border-color: var(--primary);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpolyline points='1,5 4,8 11,1' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center; background-size: 10px;
}
.all_chk.chk_box input[type="checkbox"] + label span { top: 0; left: 0; transform: none; }
.write_div .chk_box input[type="checkbox"] + label,
.bo_vc_w .chk_box input[type="checkbox"] + label { padding-left: 22px; }
.write_div .chk_box input[type="checkbox"] + label span,
.bo_vc_w .chk_box input[type="checkbox"] + label span {
    position: absolute; top: 2px; left: 0;
    width: 16px; height: 16px; margin: 0; transform: none;
}

/* =============================================
   갤러리 그리드
============================================= */
#bo_gall #gall_ul {
    margin: 0 -10px;
    padding: 0;
    list-style: none;
    zoom: 1;
}
#bo_gall #gall_ul:after { display: block; visibility: hidden; clear: both; content: ""; }

/* 컬럼 그리드 */
.gall_row .col-gn-0, .gall_row .col-gn-1,
.gall_row .col-gn-2, .gall_row .col-gn-3,
.gall_row .col-gn-4, .gall_row .col-gn-5,
.gall_row .col-gn-6, .gall_row .col-gn-7,
.gall_row .col-gn-8, .gall_row .col-gn-9,
.gall_row .col-gn-10 {
    position: relative; min-height: 1px;
    padding-left: 10px; padding-right: 10px;
    float: left; box-sizing: border-box; margin-left: 0;
}
.gall_row .col-gn-0, .gall_row .col-gn-1 { width: 100%; }
.gall_row .col-gn-2 { width: 50%; }
.gall_row .col-gn-3 { width: 33.33333333%; }
.gall_row .col-gn-4 { width: 25%; }
.gall_row .col-gn-5 { width: 20%; }
.gall_row .col-gn-6 { width: 16.66666667%; }
.gall_row .box_clear { clear: both; }

/* 카드 */
#bo_gall .gall_li { margin-bottom: 28px; }

#bo_gall .gall_box {
    position: relative;
    background: var(--white);
    border-radius: var(--radius);
    border: 1px solid var(--border);
    overflow: hidden;
    transition: all var(--transition);
    box-shadow: var(--shadow);
}
#bo_gall .gall_box:hover {
    box-shadow: var(--shadow-hover);
    transform: translateY(-4px);
    border-color: transparent;
}

/* 체크박스 위치 */
#bo_gall .gall_li .gall_chk {
    position: absolute; top: 12px; left: 12px;
    z-index: 2;
    background: rgba(255,255,255,0.9);
    border-radius: 4px;
    padding: 4px;
    backdrop-filter: blur(4px);
}

/* 이미지 영역 */
#bo_gall .gall_img {
    position: relative;
    overflow: hidden;
    background: var(--gray-lt);
    border-bottom: 1px solid var(--border);
}
#bo_gall .gall_img a,
#bo_gall .gall_img .no_image,
#bo_gall .gall_img .is_notice { display: block; }

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

/* 이미지 없을 때 */
#bo_gall .gall_img .no_image {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gray-lt);
    text-align: center;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 13px;
    color: var(--gray-mid);
    letter-spacing: 0.1em;
}

/* 공지 뱃지 */
#bo_gall .gall_img .is_notice {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-lt);
    font-weight: 700;
    font-size: 14px;
    color: var(--primary);
    letter-spacing: 0.05em;
}

/* 텍스트 영역 */
#bo_gall .gall_con { position: relative; }

#bo_gall .gall_text_href {
    padding: 16px 16px 10px;
}
#bo_gall .gall_text_href a { text-decoration: none; }

/* 카테고리 링크 */
.bo_cate_link {
    display: inline-block;
    background: var(--primary-lt);
    color: var(--primary);
    height: auto;
    line-height: 1;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    border: 1px solid var(--primary-bd);
    margin-bottom: 8px;
    text-decoration: none;
}
.bo_cate_link:hover { text-decoration: none; }

/* 제목 */
#bo_gall .bo_tit {
    display: block;
    font-weight: 600;
    font-size: 14px;
    line-height: 1.5;
    color: var(--gray-dark);
    font-family: var(--font-main);
    transition: color var(--transition);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#bo_gall .bo_tit:hover { color: var(--primary); }

/* 댓글 수 */
#bo_gall .bo_tit .cnt_cmt {
    background: var(--primary-lt);
    color: var(--primary);
    font-size: 11px;
    height: 18px;
    line-height: 18px;
    padding: 0 6px;
    border-radius: 4px;
    vertical-align: middle;
    margin-left: 4px;
    font-weight: 600;
}

/* 미리보기 텍스트 */
#bo_gall .bo_cnt {
    display: block;
    color: var(--gray-mid);
    font-size: 12px;
    line-height: 1.6;
    margin-top: 6px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
}

/* 정보 영역 */
#bo_gall .gall_info {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px 14px;
    font-size: 12px;
    color: var(--gray-mid);
    border-top: 1px solid var(--border);
}
#bo_gall .gall_info strong { display: inline-block; margin: 0; font-weight: 500; color: var(--gray-dark); }
#bo_gall .gall_info i { font-size: 11px; margin-right: 3px; }
#bo_gall .gall_info .gall_date,
#bo_gall .gall_info .gall_view { display: inline-flex; align-items: center; color: var(--gray-mid); margin-left: 0; }

/* 추천 옵션 뱃지 */
#bo_gall .gall_option {
    position: absolute;
    top: 12px; right: 12px;
    z-index: 2;
}
#bo_gall .gall_option strong {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(255,255,255,0.92);
    padding: 4px 10px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 600;
    color: var(--gray-dark);
    box-shadow: 0 2px 8px rgba(0,0,0,0.12);
    backdrop-filter: blur(4px);
}

/* 현재 열람중 */
#bo_gall .gall_now .gall_box { border-color: var(--primary); }
#bo_gall .gall_now .bo_tit { color: var(--primary); }
.bo_current { color: var(--primary); font-weight: 600; }

/* 아이콘 */
#bo_gall .bo_tit .new_icon {
    display: inline-block; width: 16px; line-height: 16px;
    font-size: 10px; color: var(--white);
    background: var(--primary); text-align: center;
    border-radius: 3px; margin-left: 4px;
    font-weight: 700; vertical-align: middle;
}
#bo_gall .bo_tit .hot_icon {
    display: inline-block; width: 16px; line-height: 16px;
    font-size: 10px; color: #c0392b;
    background: #fde8e8; text-align: center;
    border-radius: 3px; vertical-align: middle;
}
#bo_gall .bo_tit .fa-lock {
    display: inline-block; line-height: 16px;
    color: var(--gray-mid); vertical-align: middle;
    font-size: 12px;
}
#bo_gall .bo_tit .fa-download {
    width: 16px; height: 16px; line-height: 16px;
    background: #fef3e2; color: #b8860b;
    text-align: center; font-size: 10px;
    border-radius: 3px; margin-right: 2px; vertical-align: middle;
}
#bo_gall .bo_tit .fa-link {
    width: 16px; height: 16px; line-height: 16px;
    background: #f5eafd; color: #7d3c98;
    text-align: center; font-size: 10px;
    border-radius: 3px; margin-right: 2px; vertical-align: middle;
}

/* 빈 목록 */
#bo_gall li.empty_list {
    padding: 80px 0;
    text-align: center;
    color: var(--gray-mid);
    font-size: 14px;
    list-style: none;
    width: 100%;
}

/* 페이지네이션 */
.pg_wrap { margin: 32px 0; text-align: center; }
.pg_wrap a, .pg_wrap strong {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border);
    color: var(--gray-mid); font-size: 13px;
    margin: 0 2px; text-decoration: none;
    transition: all var(--transition);
    font-family: var(--font-body);
}
.pg_wrap a:hover { border-color: var(--primary); color: var(--primary); }
.pg_wrap strong { background: var(--primary); color: var(--white); border-color: var(--primary); font-weight: 700; }

/* 검색 */
.bo_sch_wrap { display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 9999; }
.bo_sch {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    background: var(--white);
    width: 360px;
    border-radius: var(--radius);
    box-shadow: 0 8px 40px rgba(0,0,0,0.15);
    border: 1px solid var(--border);
    overflow: hidden;
}
.bo_sch h3 { padding: 18px 20px; font-size: 15px; font-weight: 600; border-bottom: 1px solid var(--border); font-family: var(--font-main); }
.bo_sch form { padding: 20px; }
.bo_sch select {
    width: 100%; height: 44px;
    border: 1.5px solid var(--border); border-radius: var(--radius-sm);
    padding: 0 12px; font-size: 14px;
    background: var(--white); color: var(--gray-dark);
    font-family: var(--font-body); outline: none;
    transition: border var(--transition);
}
.bo_sch select:focus { border-color: var(--primary); }
.bo_sch .sch_bar {
    display: flex; margin-top: 12px;
    border: 1.5px solid var(--border);
    border-radius: var(--radius-sm); overflow: hidden;
    transition: border var(--transition);
}
.bo_sch .sch_bar:focus-within { border-color: var(--primary); }
.bo_sch .sch_input {
    flex: 1; height: 44px; border: 0; padding: 0 14px;
    background: transparent; font-size: 14px; color: var(--gray-dark);
    font-family: var(--font-body); outline: none;
}
.bo_sch .sch_btn {
    width: 44px; height: 44px; border: 0; background: none;
    color: var(--gray-mid); font-size: 15px; cursor: pointer;
    transition: color var(--transition);
}
.bo_sch .sch_btn:hover { color: var(--primary); }
.bo_sch .bo_sch_cls {
    position: absolute; right: 0; top: 0;
    color: var(--gray-mid); border: 0; padding: 14px 16px;
    font-size: 16px; background: transparent; cursor: pointer;
    transition: color var(--transition);
}
.bo_sch .bo_sch_cls:hover { color: var(--primary); }
.bo_sch_bg { background: rgba(0,0,0,0.3); width: 100%; height: 100%; }


/* =============================================
   게시물 읽기 (view.php — 갤러리와 공유)
============================================= */
#bo_v { margin-bottom: 40px; background: var(--white); box-sizing: border-box; }
#bo_v_title .bo_v_cate {
    display: inline-block; padding: 3px 10px;
    background: var(--primary-lt); color: var(--primary);
    border: 1px solid var(--primary-bd); border-radius: 4px;
    font-size: 12px; font-weight: 600; margin-bottom: 10px;
}
#bo_v_title .bo_v_tit {
    display: block; font-size: 26px; font-weight: 600;
    line-height: 1.45; color: var(--black);
    font-family: var(--font-main); word-break: break-all; margin: 8px 0 0;
}
#bo_v_info {
    margin: 20px 0 0; padding: 20px 0;
    border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
    display: flex; align-items: center; justify-content: space-between;
}
#bo_v_info:after { display: block; visibility: hidden; clear: both; content: ""; }
#bo_v_info h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_v_info .profile_info { display: inline-flex; align-items: center; gap: 12px; margin: 0; float: none; }
#bo_v_info .profile_info .pf_img img { border-radius: 50%; width: 44px; height: 44px; object-fit: cover; }
#bo_v_info strong { display: inline-block; margin: 0 8px 0 0; font-weight: normal; }
#bo_v_info .sv_member, #bo_v_info .member { font-weight: 700; color: var(--gray-dark); }
#bo_v_info .sv_guest, #bo_v_info .guest { font-weight: 600; color: var(--gray-dark); }
#bo_v_info .profile_img { display: none; }
#bo_v_info .if_date { margin: 0; color: var(--gray-mid); font-size: 13px; }
#bo_v_top { zoom: 1; }
#bo_v_top:after { display: block; visibility: hidden; clear: both; content: ""; }
#bo_v_top h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_v_top ul { padding: 0; list-style: none; }
.bo_v_com { margin: 0; float: right; display: flex; gap: 6px; }
.bo_v_com > li { position: relative; float: left; margin-left: 0; }
#bo_v_atc { min-height: 200px; height: auto !important; }
#bo_v_atc_title { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_v_share {
    padding: 16px 0; display: flex; align-items: center; gap: 10px;
    border-bottom: 1px solid var(--border); margin-bottom: 24px;
}
#bo_v_share .btn {
    padding: 0 14px; height: 36px; font-size: 13px;
    color: var(--gray-mid); border: 1px solid var(--border);
    border-radius: var(--radius-sm); background: var(--white); transition: all var(--transition);
}
#bo_v_share .btn:hover { border-color: var(--primary); color: var(--primary); }
#bo_v_share .btn i { margin-right: 5px; }
#bo_v_con {
    margin: 24px 0 40px; width: 100%; line-height: 1.85;
    min-height: 200px; word-break: break-all; overflow: hidden;
    font-size: 15px; color: var(--gray-dark);
}
#bo_v_con a { color: var(--primary); text-decoration: underline; }
#bo_v_con img { max-width: 100%; height: auto; border-radius: var(--radius-sm); }
#bo_v_img { width: 100%; overflow: hidden; zoom: 1; }
#bo_v_img img { margin-bottom: 20px; max-width: 100%; height: auto; border-radius: var(--radius-sm); }
#bo_v_act { margin-bottom: 36px; text-align: center; }
#bo_v_act .bo_v_act_gng { position: relative; display: inline-block; margin: 0 6px; }
#bo_v_act a { vertical-align: middle; color: var(--gray-mid); text-decoration: none; transition: all var(--transition); }
#bo_v_act .bo_v_good, #bo_v_act .bo_v_nogood {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    border: 1.5px solid var(--border); padding: 10px 24px;
    border-radius: 100px; font-size: 14px; transition: all var(--transition);
}
#bo_v_act .bo_v_good:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-lt); }
#bo_v_act .bo_v_nogood:hover { border-color: #c0392b; color: #c0392b; background: #fde8e8; }
#bo_v_act_good, #bo_v_act_nogood {
    display: none; position: absolute; top: 44px; left: 50%; transform: translateX(-50%);
    z-index: 9999; padding: 8px 14px;
    background: var(--primary); color: var(--white);
    border-radius: var(--radius-sm); font-size: 12px; white-space: nowrap;
}
#bo_v_file h2, #bo_v_link h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_v_file ul, #bo_v_link ul { margin: 0; list-style: none; }
#bo_v_file li, #bo_v_link li {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 16px; margin: 8px 0;
    border: 1.5px solid var(--border); border-radius: var(--radius);
    transition: all var(--transition); background: var(--white);
}
#bo_v_file li:hover, #bo_v_link li:hover { border-color: var(--primary); background: var(--primary-lt); }
#bo_v_file li i, #bo_v_link li i { font-size: 1.6em; color: var(--gray-mid); flex-shrink: 0; }
#bo_v_file li:hover i, #bo_v_link li:hover i { color: var(--primary); }
#bo_v_file a, #bo_v_link a { text-decoration: none; color: var(--gray-dark); word-break: break-all; }
#bo_v_file a:hover, #bo_v_link a:hover { color: var(--primary); }
#bo_v_file .bo_v_file_cnt, #bo_v_link .bo_v_link_cnt { color: var(--gray-mid); font-size: 12px; display: block; margin-top: 2px; }
.bo_v_nb { margin: 32px 0; clear: both; }
.bo_v_nb:after { display: block; visibility: hidden; clear: both; content: ""; }
.bo_v_nb li {
    display: flex; align-items: center; gap: 16px;
    padding: 14px 16px; border-top: 1px solid var(--border);
    font-size: 14px; transition: background var(--transition);
}
.bo_v_nb li:last-child { border-bottom: 1px solid var(--border); }
.bo_v_nb li:hover { background: var(--gray-lt); }
.bo_v_nb li i { font-size: 12px; color: var(--gray-mid); }
.bo_v_nb li .nb_tit { color: var(--gray-mid); font-size: 12px; white-space: nowrap; min-width: 56px; }
.bo_v_nb li a { color: var(--gray-dark); text-decoration: none; flex: 1; transition: color var(--transition); }
.bo_v_nb li a:hover { color: var(--primary); }
.bo_v_nb li .nb_date { color: var(--gray-mid); font-size: 12px; white-space: nowrap; }


/* =============================================
   댓글
============================================= */
.cmt_btn {
    width: 100%; text-align: left; border: 0;
    border-bottom: 2px solid var(--border);
    background: var(--white); font-weight: 700;
    margin: 40px 0 0; padding: 0 0 16px;
    cursor: pointer; font-family: var(--font-main);
    transition: border-color var(--transition);
}
.cmt_btn:hover { border-bottom-color: var(--primary); }
.cmt_btn span.total { position: relative; display: inline-block; margin-right: 6px; color: var(--primary); }
.cmt_btn span.total:after { display: none; }
.cmt_btn b { font-size: 15px; color: var(--gray-dark); margin-right: 4px; }
.cmt_btn span.cmt_more { float: right; width: 15px; height: 10px; background: url(./img/btn_cmt.png) no-repeat right 2px; margin-top: 6px; display: inline-block; }
.cmt_btn_op span.cmt_more { background-position: right -8px; }
#bo_vc h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_vc article {
    margin: 0; padding: 20px 0; position: relative;
    border-bottom: 1px solid var(--border);
    display: flex; gap: 14px;
}
#bo_vc article .pf_img { flex-shrink: 0; }
#bo_vc article .pf_img img { border-radius: 50%; width: 40px; height: 40px; object-fit: cover; }
#bo_vc article .cm_wrap { flex: 1; min-width: 0; }
#bo_vc header { position: relative; width: 100%; margin-bottom: 8px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
#bo_vc header .profile_img { display: none; }
#bo_vc .member, #bo_vc .sv_member { font-weight: 700; color: var(--gray-dark); font-size: 14px; }
#bo_vc .guest, #bo_vc .sv_guest { font-weight: 600; color: var(--gray-dark); font-size: 14px; }
.bo_vc_hdinfo { color: var(--gray-mid); font-size: 12px; }
#bo_vc h1 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_vc .cmt_contents { line-height: 1.8; font-size: 14px; color: var(--gray-dark); }
#bo_vc_empty { margin: 0; padding: 50px 0 !important; color: var(--gray-mid); text-align: center; font-size: 14px; }
#bo_vc .bo_vl_opt { position: absolute; top: 20px; right: 0; }
.bo_vc_act {
    display: none; position: absolute; right: 0; top: 44px;
    background: var(--white); border: 1px solid var(--border);
    border-radius: var(--radius-sm); box-shadow: var(--shadow);
    list-style: none; z-index: 9999; overflow: hidden;
    min-width: 80px; padding: 0; margin: 0;
}
.bo_vc_act:before, .bo_vc_act:after { display: none; }
.bo_vc_act li { border-bottom: 1px solid var(--border); float: none; width: auto; margin: 0; padding: 0; }
.bo_vc_act li:last-child { border-bottom: 0; }
.bo_vc_act li a { display: block; padding: 9px 16px; font-size: 13px; color: var(--gray-mid); transition: all var(--transition); }
.bo_vc_act li a:hover { color: var(--primary); background: var(--gray-lt); }
.bo_vc_w { position: relative; margin: 20px 0; display: block; }
.bo_vc_w:after { display: block; visibility: hidden; clear: both; content: ""; }
.bo_vc_w h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
.bo_vc_w textarea {
    border: 1.5px solid var(--border); background: var(--white);
    color: var(--gray-dark); border-radius: var(--radius);
    padding: 14px 16px; width: 100%; height: 100px;
    font-size: 14px; line-height: 1.7; font-family: var(--font-body);
    resize: vertical; outline: none; transition: border var(--transition); box-sizing: border-box;
}
.bo_vc_w textarea:focus { border-color: var(--primary); }
.bo_vc_w_info { margin: 10px 0; float: left; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.bo_vc_w_info .frm_input {
    float: none; height: 40px; padding: 0 14px;
    border: 1.5px solid var(--border); border-radius: var(--radius-sm);
    font-size: 14px; color: var(--gray-dark);
    font-family: var(--font-body); outline: none; background: var(--white);
    transition: border var(--transition);
}
.bo_vc_w_info .frm_input:focus { border-color: var(--primary); }
.bo_vc_w .btn_confirm { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; clear: both; }
.secret_cm { display: inline-flex; align-items: center; float: left; font-size: 14px; color: var(--gray-mid); }
.bo_vc_w .btn_submit {
    height: 42px; padding: 0 24px;
    border-radius: var(--radius-sm); border: 0;
    background: var(--primary); color: var(--white);
    font-weight: 600; font-size: 14px; cursor: pointer;
    font-family: var(--font-body); transition: opacity var(--transition);
}
.bo_vc_w .btn_submit:hover { opacity: 0.85; }


/* =============================================
   글쓰기
============================================= */
#bo_w .bo_v_option { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 10px; }
#bo_w .bo_v_option li { display: inline-flex; align-items: center; float: none; margin: 0; }
#bo_w .bo_v_option li label { font-size: 14px; color: var(--gray-mid); vertical-align: baseline; }
#bo_w .write_div { margin: 0 0 16px; position: relative; }
#bo_w .write_div:after { display: block; visibility: hidden; clear: both; content: ""; }
#bo_w .bo_w_info { display: flex; flex-wrap: wrap; gap: 10px; }
.frm_input {
    height: 48px; border: 1.5px solid var(--border);
    border-radius: var(--radius-sm); padding: 0 16px;
    font-size: 14px; color: var(--gray-dark);
    font-family: var(--font-body); background: var(--white);
    outline: none; transition: border var(--transition); box-sizing: border-box;
}
.frm_input:focus { border-color: var(--primary); }
.half_input { width: 220px; }
.full_input { width: 100%; }
#bo_w .bo_w_tit .frm_input { padding-right: 150px; height: 52px; font-size: 15px; }
#bo_w .bo_w_tit #btn_autosave {
    position: absolute; top: 10px; right: 10px;
    height: 32px; line-height: 32px; padding: 0 12px;
    border: 1px solid var(--border); border-radius: var(--radius-sm);
    font-size: 12px; color: var(--gray-mid);
    background: var(--white); cursor: pointer; transition: all var(--transition);
}
#bo_w .bo_w_tit #btn_autosave:hover { border-color: var(--primary); color: var(--primary); }
#bo_w .bo_w_link label {
    position: absolute; top: 1px; left: 1px;
    border-radius: var(--radius-sm) 0 0 var(--radius-sm);
    height: calc(100% - 2px); width: 44px;
    display: flex; align-items: center; justify-content: center;
    color: var(--gray-mid); background: var(--gray-lt);
    border-right: 1px solid var(--border);
}
#bo_w .bo_w_link .frm_input { padding-left: 54px; }
#bo_w .bo_w_flie .lb_icon {
    position: absolute; top: 0; left: 0;
    border-radius: var(--radius-sm) 0 0 var(--radius-sm);
    height: 100%; width: 44px;
    display: flex; align-items: center; justify-content: center;
    color: var(--gray-mid); background: var(--gray-lt);
    border-right: 1px solid var(--border);
}
#bo_w .bo_w_flie .frm_file { padding-left: 54px; }
#bo_w .bo_w_flie .file_wr {
    position: relative; border: 1.5px solid var(--border);
    border-radius: var(--radius-sm); background: var(--white);
    height: 48px; margin: 0; display: flex; align-items: center; overflow: hidden;
}
#bo_w .bo_w_select select {
    border: 1.5px solid var(--border); width: 100%; height: 48px;
    border-radius: var(--radius-sm); padding: 0 16px;
    font-size: 14px; font-family: var(--font-body);
    background: var(--white); color: var(--gray-dark);
    outline: none; transition: border var(--transition);
}
#bo_w .bo_w_select select:focus { border-color: var(--primary); }
#bo_w .btn_confirm { display: flex; justify-content: flex-end; gap: 10px; align-items: center; margin-top: 24px; }
.btn_cancel {
    display: inline-flex; align-items: center; justify-content: center;
    height: 48px; padding: 0 28px;
    border-radius: var(--radius-sm); border: 1.5px solid var(--border);
    background: var(--white); color: var(--gray-mid);
    font-size: 14px; font-weight: 500; text-decoration: none;
    font-family: var(--font-body); transition: all var(--transition);
}
.btn_cancel:hover { border-color: var(--gray-dark); color: var(--gray-dark); }
.btn_submit, #bo_w .btn_submit {
    display: inline-flex; align-items: center; justify-content: center;
    height: 48px; padding: 0 32px;
    border-radius: var(--radius-sm); border: 0;
    background: var(--primary); color: var(--white);
    font-size: 14px; font-weight: 700; cursor: pointer;
    font-family: var(--font-body); transition: opacity var(--transition);
}
.btn_submit:hover, #bo_w .btn_submit:hover { opacity: 0.85; }
#char_count_desc { display: block; margin: 0 0 8px; font-size: 13px; color: var(--gray-mid); }
#char_count_wrap { margin: 8px 0 0; text-align: right; font-size: 12px; color: var(--gray-mid); }
#char_count { font-weight: 700; color: var(--primary); }


/* =============================================
   반응형
============================================= */
@media (max-width: 1024px) {
    .gall_row .col-gn-3 { width: 50%; }
    .gall_row .col-gn-4 { width: 33.33%; }
}

@media (max-width: 768px) {
    #bo_btn_top { flex-direction: column; align-items: flex-start; gap: 12px; }
    .btn_bo_user { float: none; }

    .gall_row .col-gn-2,
    .gall_row .col-gn-3,
    .gall_row .col-gn-4 { width: 50%; }

    #bo_gall .gall_li { margin-bottom: 16px; }
    #bo_gall .gall_text_href { padding: 12px 12px 8px; }
    #bo_gall .gall_info { padding: 8px 12px 12px; }
    #bo_gall .bo_tit { font-size: 13px; }
    #bo_gall .bo_cnt { display: none; }

    #bo_v_title .bo_v_tit { font-size: 20px; }
    #bo_v_info { flex-direction: column; align-items: flex-start; gap: 12px; }
    .bo_v_com { margin-top: 0; }

    .half_input { width: 100%; }
    #bo_w .bo_w_info { flex-direction: column; }
}

@media (max-width: 480px) {
    .gall_row .col-gn-2,
    .gall_row .col-gn-3,
    .gall_row .col-gn-4 { width: 100%; }

    #bo_gall #gall_ul { margin: 0; }
    #bo_gall .gall_li { margin-bottom: 20px; }
    #bo_gall .bo_cnt { display: none; }

    .btn_b01, .btn_admin { width: 34px; height: 34px; font-size: 13px; }
}