@charset "utf-8";

/* 게시판 목록 */
#bo_list {position:relative;margin-bottom:20px}
#bo_list:after {display:block;visibility:hidden;clear:both;content:""}
#bo_list .td_board {width:120px;text-align:center}
#bo_list .td_chk {width:30px;text-align:center;border-top:1px solid #ecf0f1;border-bottom:1px solid #ecf0f1}
#bo_list .td_date {width:60px;text-align:center}
#bo_list .td_datetime {width:60px;text-align:center}
#bo_list .td_group {width:100px;text-align:center}
#bo_list .td_mb_id {width:100px;text-align:center}
#bo_list .td_mng {width:80px;text-align:center}
#bo_list .td_name {width:90px;text-align:left;padding:10px 0}
#bo_list .td_nick {width:100px;text-align:center}
#bo_list .td_num {width:50px;text-align:center}
#bo_list .td_num2 {width:50px;text-align:center}
#bo_list .td_numbig {width:80px;text-align:center}
#bo_list .txt_active {color:#5d910b}
#bo_list .txt_expired {color:#ccc}
#bo_list tbody tr {border-left:2px solid transparent}
#bo_list tbody tr:hover {border-left:2px solid #667eea}
#bo_list tbody .even td {background:#fbfbfb}

#bo_cate {margin:25px 0}
#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:2px}
#bo_cate a {display:block;line-height:28px;padding:5px 15px;border-radius:30px;border:1px solid #d6e9ff;color:#6794d3}
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active {text-decoration:none;background:#667eea;color:#fff}
#bo_cate #bo_cate_on {z-index:2;background:#667eea;color:#fff;font-weight:bold;border:1px solid #667eea;
-webkit-box-shadow:inset 0 2px 5px rgb(102, 126, 234);
-moz-box-shadow:inset 0 2px 5px rgb(102, 126, 234);
box-shadow:inset 0 2px 5px rgb(102, 126, 234)}
.td_subject img {margin-left:5px}

/* 게시판 목록 공통 */
.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;color:#676e70}
.chk_box input[type="checkbox"] + label:hover {color:#667eea}
.chk_box input[type="checkbox"] + label span {float:left;width:15px;height:15px;display:block;background:#fff;border:1px solid #d0d4df;border-radius:3px}
.write_div .chk_box input[type="checkbox"] + label, .bo_vc_w .chk_box input[type="checkbox"] + label {padding-left:20px}
.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:15px;height:15px;display:block;margin:0;background:#fff;border:1px solid #d0d4df;border-radius:3px}
.chk_box input[type="checkbox"]:checked + label {color:#000}
.chk_box input[type="checkbox"]:checked + label span {background:url(./img/chk.png) no-repeat 50% 50% #667eea;border-color:#667eea;border-radius:3px}


#bo_btn_top {margin:10px 0}
#bo_btn_top:after {display:block;visibility:hidden;clear:both;content:""}
.bo_fx {margin-bottom:5px;float:right;zoom:1}
.bo_fx:after {display:block;visibility:hidden;clear:both;content:""}
.bo_fx ul {margin:0;padding:0;list-style:none}
#bo_list_total {float:left;line-height:34px;font-size:0.92em;color:#4e546f}

.btn_bo_user {float:right;margin:0;padding:0;list-style:none}
.btn_bo_user li {float:left;width:40px;text-align:center;margin-left:5px;background:#fff}
.btn_bo_user > li {position:relative}
.btn_bo_adm {float:left}
.btn_bo_adm li {float:left;margin-right:5px}
.btn_bo_adm input {padding:0 8px;border:0;background:#d4d4d4;color:#666;text-decoration:none;vertical-align:middle}
.bo_notice td {background:#fff6fa !important;border-bottom:1px solid #f8e6ee}
.bo_notice td a {font-weight:bold}
.bo_notice .notice_icon {display:inline-block;line-height:25px;border-radius:5px;font-weight:bold;color:#667eea}

.more_opt {display:none;position:absolute;top:45px;right:0;background:#fff;border:1px solid #b8bfc4;z-index:999}
.more_opt:before {content:"";position:absolute;top:-8px;right:13px;width:0;height:0;border-style:solid;border-width:0 6px 8px 6px;border-color:transparent transparent #b8bfc4 transparent}
.more_opt:after {content:"";position:absolute;top:-6px;right:13px;width:0;height:0;border-style:solid;border-width:0 6px 8px 6px;border-color:transparent transparent #fff transparent}
.more_opt li {border-bottom:1px solid #f1f1f1;padding:10px;float:inherit;width:90px;margin:0;color:#6b757c;text-align:left}
.more_opt li:last-child {border-bottom:0}
.more_opt li button, .more_opt li a {width:100%;border:0;background:#fff;color:#6b757c}
.more_opt li:hover a,
.more_opt li:hover button {color:#000}
.more_opt li i {float:right;line-height:20px}

.td_num strong {color:#000}
.bo_cate_link {float:left;display:inline-block;margin-right:10px;background:#e2eaf6;color:#667eea;font-weight:normal !important;height:20px;line-height:10px;padding:5px 8px;border-radius:5px;font-size:0.95em} /* 글제목줄 분류스타일 */
.bo_cate_link:hover {text-decoration:none}
.bo_tit {display:block;color:#000;font-weight:bold}
.bo_current {color:#e8180c}
#bo_list .profile_img img {border-radius:50%}
#bo_list .cnt_cmt {background:#e9eff5;color:#667eea;font-size:11px;height:16px;line-height:16px;padding:0 5px;border-radius:3px;vertical-align:middle}

#bo_list .bo_tit .title_icon {margin-right:2px}
#bo_list .bo_tit .fa-heart {color:#ff0000}
#bo_list .bo_tit .fa-lock {display:inline-block;line-height:14px;width:16px;font-size:0.833em;color:#4f818c;background:#cbe3e8;text-align:center;border-radius:2px;font-size:12px;border:1px solid #cbe3e8;vertical-align:middle}
#bo_list .bo_tit .new_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#23db79;background:#b9ffda;text-align:center;border-radius:2px;margin-left:2px;font-weight:bold;vertical-align:middle}
#bo_list .bo_tit .hot_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#ff0000;background:#ffb9b9;text-align:center;border-radius:2px;vertical-align:middle}
#bo_list .bo_tit .fa-caret-right {color:#bbb}
#bo_list .bo_tit .fa-download {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#daae37;background:#ffefb9;text-align:center;border-radius:2px;margin-left:5px;vertical-align:middle}
#bo_list .bo_tit .fa-link {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#b451fd;background:#edd3fd;text-align:center;border-radius:2px;margin-left:5px;vertical-align:middle}

.bo_sch_wrap {display:none;width:100%;height:100%;position:fixed;top:0;left:0;z-index:999}
.bo_sch {position:absolute;top:50%;left:50%;background:#fff;text-align:left;width:330px;max-height:300px;margin-left:-125px;margin-top:-180px;overflow-y:auto;border-radius:5px;-webkit-box-shadow:1px 1px 18px rgba(0,0,0,0.2);-moz-box-shadow:1px 1px 18px rgba(0,0,0,0.2);box-shadow:1px 1px 18px rgba(0,0,0,0.2);border:1px solid #dde7e9;background:#fff;border-radius:3px}
.bo_sch:after {display:block;visibility:hidden;clear:both;content:""}
.bo_sch h3 {padding:15px;border-bottom:1px solid #e8e8e8}
.bo_sch legend {background:red}
.bo_sch form {padding:15px;display:block}
.bo_sch select {border:0;width:100%;height:40px;border:1px solid #d0d3db;border-radius:2px;-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075);
-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075);padding:6px 12px;font-size:14px;line-height:1.42857143;color:#555;background-color:#fff;background-image:none}
.bo_sch input {border:0;width:100%;height:40px;border:1px solid #d0d3db;border-radius:2px;-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075);
-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075);padding:6px 12px;font-size:14px;line-height:1.42857143;color:#555;background-color:#fff;background-image:none}
.bo_sch button {border:0;padding:0 20px;height:40px;background:#667eea;color:#fff;border-radius:2px;font-weight:bold}
.bo_sch button:hover {background:#5a6fd8}
.bo_sch_close {float:right;font-size:20px;font-weight:bold;cursor:pointer;color:#999;line-height:1}
.bo_sch_close:hover {color:#000}

/* 게시판 검색 */
#bo_sch {padding:15px 0;border-top:1px solid #e8e8e8;margin-top:20px}
#bo_sch legend {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_sch form {display:block}
#bo_sch select, #bo_sch input {height:30px;border:1px solid #d0d3db;padding:0 10px;vertical-align:middle;font-size:12px}
#bo_sch select {width:100px}
#bo_sch input {width:200px}
#bo_sch button {height:30px;padding:0 15px;background:#667eea;color:#fff;border:0;vertical-align:middle;font-size:12px;cursor:pointer;border-radius:2px}
#bo_sch button:hover {background:#5a6fd8}

/* 게시판 버튼 */
.btn {display:inline-block;padding:6px 12px;margin-bottom:0;font-size:14px;font-weight:normal;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;cursor:pointer;border:1px solid transparent;border-radius:4px;text-decoration:none}
.btn:hover, .btn:focus {text-decoration:none}
.btn:active {background-image:none;outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}
.btn_admin {color:#fff;background-color:#667eea;border-color:#667eea}
.btn_admin:hover {color:#fff;background-color:#5a6fd8;border-color:#5a6fd8}
.btn_b01, .btn_b02 {color:#fff;background-color:#667eea;border-color:#667eea}
.btn_b01:hover, .btn_b02:hover {color:#fff;background-color:#5a6fd8;border-color:#5a6fd8}

/* ==========================================
   게시판 목록 페이지 스타일 (view/write와 통일된 디자인)
   ========================================== */

/* 게시판 목록 컨테이너 */
.list-container {
    background: #f9fafb !important;
    border-radius: 12px !important;
    padding: 2rem !important;
    margin: 2rem 0 !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

/* 게시판 헤더 (view/write와 동일한 패턴) */
.list-header {
    background: linear-gradient(135deg, #c4b5fd 0%, #ddd6fe 100%) !important;
    color: #5b21b6 !important;
    padding: 1.5rem 2rem 2rem 2rem !important;
    border-radius: 12px 12px 0 0 !important;
    margin-bottom: 0 !important;
}

.list-header-content {
    text-align: center !important;
}

.list-title {
    font-size: 1.8rem !important;
    font-weight: 700 !important;
    margin: 0 0 0.5rem 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
}

.list-title i {
    font-size: 1.5rem !important;
}

.list-subtitle {
    font-size: 1rem !important;
    opacity: 0.9 !important;
    margin: 0 !important;
}

/* 게시판 정보 섹션 (view/write와 동일한 패턴) */
.list-info {
    background: white !important;
    border-radius: 0 0 12px 12px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
    overflow: hidden !important;
    padding: 2rem !important;
    margin-bottom: 2rem !important;
}

.list-stats {
    display: flex !important;
    gap: 2rem !important;
    margin-bottom: 1.5rem !important;
}

.stat-item {
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
    padding: 1rem !important;
    background: #f8fafc !important;
    border-radius: 8px !important;
    border: 1px solid #e2e8f0 !important;
}

.stat-icon {
    width: 40px !important;
    height: 40px !important;
    background: linear-gradient(135deg, #c4b5fd, #ddd6fe) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #5b21b6 !important;
    font-size: 1.2rem !important;
}

.stat-content {
    display: flex !important;
    flex-direction: column !important;
}

.stat-label {
    font-size: 0.9rem !important;
    color: #6b7280 !important;
    margin-bottom: 0.25rem !important;
}

.stat-value {
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    color: #7c3aed !important;
}

.list-actions {
    display: flex !important;
    justify-content: flex-end !important;
}

.list-actions .btn_bo_user {
    display: flex !important;
    gap: 0.75rem !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.list-actions .btn_bo_user li {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
}

.list-actions .btn {
    background: linear-gradient(135deg, #c4b5fd, #ddd6fe) !important;
    color: #5b21b6 !important;
    border: none !important;
    padding: 0.75rem 1.5rem !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

.list-actions .btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(196, 181, 253, 0.4) !important;
    background: linear-gradient(135deg, #a78bfa, #c4b5fd) !important;
}

/* 게시판 목록 섹션 */
.list-content {
    background: white !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
    overflow: hidden !important;
    margin-bottom: 2rem !important;
}

.list-table-wrapper {
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem !important;
    margin-bottom: 2rem !important;
}

.list-table {
    display: none !important;
}

/* 카드 형태의 헤더 */
.list-header-card {
    background: linear-gradient(135deg, #c4b5fd, #ddd6fe) !important;
    color: #5b21b6 !important;
    padding: 1rem 1.5rem !important;
    border-radius: 12px !important;
    display: grid !important;
    grid-template-columns: 80px 1fr 100px 80px 100px !important;
    gap: 1rem !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    align-items: center !important;
}

.list-header-card .header-item:nth-child(2) {
    text-align: left !important;
}

/* 게시물 컨테이너 */
.posts-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem !important;
}

/* 카드 형태의 게시물 아이템 */
.post-card {
    background: white !important;
    border-radius: 12px !important;
    padding: 1.5rem !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
    border: 1px solid #f1f5f9 !important;
    transition: all 0.3s ease !important;
    display: grid !important;
    grid-template-columns: 80px 1fr 100px 80px 100px !important;
    gap: 1rem !important;
    align-items: center !important;
}

.post-card:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
    border-color: #c4b5fd !important;
}

.post-number {
    text-align: center !important;
    font-weight: 600 !important;
    color: #6b7280 !important;
    font-size: 0.9rem !important;
}

.post-title {
    text-align: left !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
    flex: 1 !important;
}

.post-title .subject-link {
    color: #374151 !important;
    text-decoration: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    transition: color 0.3s ease !important;
}

.post-title .subject-link:hover {
    color: #7c3aed !important;
}

.post-title .subject-title {
    font-weight: 500 !important;
    line-height: 1.4 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    flex: 1 !important;
    min-width: 0 !important;
}

.post-author {
    text-align: center !important;
    color: #374151 !important;
    font-weight: 500 !important;
}

.post-views {
    text-align: center !important;
    color: #6b7280 !important;
    font-size: 0.9rem !important;
}

.post-date {
    text-align: center !important;
    color: #6b7280 !important;
    font-size: 0.9rem !important;
}

.list-table thead th {
    background: linear-gradient(135deg, #c4b5fd, #ddd6fe) !important;
    color: #5b21b6 !important;
    padding: 1rem 1.5rem !important;
    font-weight: 600 !important;
    text-align: center !important;
    border: none !important;
    font-size: 0.9rem !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    border-radius: 8px 8px 0 0 !important;
}

.list-table thead th.col-subject {
    text-align: left !important;
}

.list-table thead th:first-child {
    border-radius: 8px 0 0 0 !important;
}

.list-table thead th:last-child {
    border-radius: 0 8px 0 0 !important;
}

.list-table tbody td {
    padding: 1.25rem 1.5rem !important;
    border-bottom: none !important;
    vertical-align: middle !important;
    text-align: center !important;
    background-color: white !important;
    border-radius: 0 !important;
}

.list-table tbody td:first-child {
    border-radius: 8px 0 0 8px !important;
}

.list-table tbody td:last-child {
    border-radius: 0 8px 8px 0 !important;
}

.list-table tbody td.td_subject {
    text-align: left !important;
}

.list-table tbody tr {
    background-color: white !important;
    margin-bottom: 2px !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

.list-table tbody tr:hover {
    background: #f8fafc !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
    transform: translateY(-1px) !important;
}

.list-table tbody tr:last-child td {
    border-bottom: none !important;
}

/* 번호 컬럼 */
.notice-number {
    display: inline-block !important;
    background: #fbbf24 !important;
    color: #92400e !important;
    padding: 0.25rem 0.75rem !important;
    border-radius: 12px !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
}

.current-number {
    display: inline-block !important;
    background: #667eea !important;
    color: white !important;
    padding: 0.25rem 0.75rem !important;
    border-radius: 12px !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
}

.post-number {
    color: #6b7280 !important;
    font-weight: 500 !important;
}

/* 제목 컬럼 */
.subject-wrapper {
    width: 100% !important;
}

.subject-link {
    color: #374151 !important;
    text-decoration: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
    transition: all 0.3s ease !important;
}

.subject-link:hover {
    color: #7c3aed !important;
}

.subject-content {
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
    flex: 1 !important;
    min-width: 0 !important;
}

.subject-badges {
    display: flex !important;
    gap: 0.5rem !important;
}

.badge {
    display: inline-block !important;
    padding: 0.25rem 0.5rem !important;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.badge-new {
    background: #ef4444 !important;
    color: white !important;
}

.badge-hot {
    background: #f97316 !important;
    color: white !important;
}

.subject-title {
    font-weight: 500 !important;
    line-height: 1.4 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    flex: 1 !important;
    min-width: 0 !important;
}

.comment-count {
    background: #faf5ff !important;
    color: #7c3aed !important;
    padding: 0.25rem 0.5rem !important;
    border-radius: 4px !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

/* 작성자 컬럼 */
.author-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.author-name {
    color: #374151 !important;
    font-weight: 500 !important;
}

/* 조회수, 날짜 컬럼 */
.view-count, .date-time {
    color: #6b7280 !important;
    font-size: 0.9rem !important;
}

/* 빈 게시판 (view/write와 동일한 패턴) */
.empty-list {
    background: white !important;
    border-radius: 12px !important;
    padding: 4rem 2rem !important;
    text-align: center !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
    margin-bottom: 2rem !important;
}

.empty-icon {
    font-size: 4rem !important;
    color: #d1d5db !important;
    margin-bottom: 1rem !important;
}

.empty-message h3 {
    color: #374151 !important;
    font-size: 1.5rem !important;
    font-weight: 600 !important;
    margin: 0 0 0.5rem 0 !important;
}

.empty-message p {
    color: #6b7280 !important;
    font-size: 1rem !important;
    margin: 0 0 2rem 0 !important;
}

.empty-action .btn {
    background: linear-gradient(135deg, #c4b5fd, #ddd6fe) !important;
    color: #5b21b6 !important;
    padding: 0.75rem 2rem !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

.empty-action .btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(196, 181, 253, 0.4) !important;
    background: linear-gradient(135deg, #a78bfa, #c4b5fd) !important;
}

/* 페이지네이션 (view/write와 동일한 패턴) */
.list-pagination {
    text-align: center !important;
    margin: 2rem 0 !important;
}

.list-pagination .write_pages {
    display: inline-flex !important;
    gap: 0.5rem !important;
    align-items: center !important;
}

.list-pagination .write_pages a,
.list-pagination .write_pages strong {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.75rem 1rem !important;
    min-width: 40px !important;
    height: 40px !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 8px !important;
    color: #374151 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
}

.list-pagination .write_pages a:hover {
    background: #c4b5fd !important;
    color: #5b21b6 !important;
    border-color: #c4b5fd !important;
    transform: translateY(-2px) !important;
}

.list-pagination .write_pages strong {
    background: linear-gradient(135deg, #c4b5fd, #ddd6fe) !important;
    color: #5b21b6 !important;
    border-color: #c4b5fd !important;
}

/* 검색 섹션 - 현대적인 디자인 */
.list-search {
    background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%) !important;
    border-radius: 16px !important;
    padding: 2.5rem !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08) !important;
    border: 1px solid #e2e8f0 !important;
    margin-top: 2rem !important;
}

.list-search h3 {
    margin: 0 0 2rem 0 !important;
    color: #1f2937 !important;
    font-size: 1.3rem !important;
    font-weight: 700 !important;
    text-align: center !important;
    position: relative !important;
}

.list-search h3::after {
    content: '' !important;
    position: absolute !important;
    bottom: -8px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 60px !important;
    height: 3px !important;
    background: linear-gradient(135deg, #c4b5fd, #a78bfa) !important;
    border-radius: 2px !important;
}

.search-form {
    width: 100% !important;
}

.search-controls {
    display: flex !important;
    gap: 1rem !important;
    align-items: center !important;
    background: white !important;
    padding: 1.5rem !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
    border: 1px solid #f1f5f9 !important;
}

.search-select {
    flex-shrink: 0 !important;
    position: relative !important;
}

.search-select select {
    height: 48px !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 10px !important;
    padding: 0 0.8rem !important;
    font-size: 0.9rem !important;
    background: white !important;
    color: #374151 !important;
    width: 90px !important;
    max-width: 90px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    line-height: 1 !important;
}

.search-select select:hover {
    border-color: #c4b5fd !important;
    box-shadow: 0 2px 8px rgba(196, 181, 253, 0.15) !important;
}

.search-select select:focus {
    outline: none !important;
    border-color: #a78bfa !important;
    box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.1) !important;
}

.search-input {
    flex: 1 !important;
    position: relative !important;
}

.search-input input {
    width: 100% !important;
    height: 48px !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 10px !important;
    padding: 0 1rem !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
    background: white !important;
    color: #374151 !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    align-items: center !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

.search-input input::placeholder {
    color: #9ca3af !important;
    font-weight: 400 !important;
}

.search-input input:hover {
    border-color: #c4b5fd !important;
    box-shadow: 0 2px 8px rgba(196, 181, 253, 0.15) !important;
}

.search-input input:focus {
    outline: none !important;
    border-color: #a78bfa !important;
    box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.1) !important;
}

.search-button {
    flex-shrink: 0 !important;
}

.btn-search {
    height: 48px !important;
    padding: 0 1.2rem !important;
    background: linear-gradient(135deg, #8b5cf6, #a855f7) !important;
    color: white !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    box-shadow: 0 4px 12px rgba(139, 92, 246, 0.25) !important;
    position: relative !important;
    overflow: hidden !important;
    min-width: 90px !important;
    white-space: nowrap !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

.btn-search::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent) !important;
    transition: left 0.5s ease !important;
}

.btn-search:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(139, 92, 246, 0.4) !important;
    background: linear-gradient(135deg, #7c3aed, #8b5cf6) !important;
}

.btn-search:hover::before {
    left: 100% !important;
}

.btn-search:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 8px rgba(139, 92, 246, 0.3) !important;
}

/* 페이지네이션 */
.write_pages {
    text-align: center !important;
    margin: 2rem 0 !important;
}

.write_pages a, .write_pages strong {
    display: inline-block !important;
    padding: 0.5rem 1rem !important;
    margin: 0 0.25rem !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    color: #374151 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.write_pages a:hover {
    background: #667eea !important;
    color: white !important;
    border-color: #667eea !important;
}

.write_pages strong {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    color: white !important;
    border-color: #667eea !important;
}

/* ==========================================
   게시물 보기 페이지 스타일
   ========================================== */

/* 게시물 보기 컨테이너 */
.view-container {
    background: #f9fafb !important;
    border-radius: 12px !important;
    padding: 2rem !important;
    margin: 2rem 0 !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

/* 게시물 헤더 */
.view-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: white !important;
    padding: 1.5rem 2rem !important;
    border-radius: 8px !important;
    margin-bottom: 2rem !important;
}

.view-title-section {
    text-align: center !important;
}

.category-badge {
    display: inline-block !important;
    background: rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    padding: 0.25rem 0.75rem !important;
    border-radius: 20px !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    margin-bottom: 0.5rem !important;
}

.view-title {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

/* 게시물 정보 */
.view-info {
    background: white !important;
    border-radius: 8px !important;
    padding: 1.5rem !important;
    margin-bottom: 2rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.profile_info {
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
    margin-bottom: 1.5rem !important;
}

.pf_img {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    background: #f3f4f6 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pf_img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.profile_info_ct {
    flex: 1 !important;
}

.author-section {
    margin-bottom: 0.5rem !important;
}

.author-name {
    color: #374151 !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

.author-name i {
    color: #667eea !important;
}

.post-meta {
    display: flex !important;
    gap: 1.5rem !important;
    color: #6b7280 !important;
    font-size: 0.9rem !important;
}

.meta-item {
    display: flex !important;
    align-items: center !important;
    gap: 0.25rem !important;
}

.meta-item i {
    color: #667eea !important;
}

.meta-item a {
    color: #667eea !important;
    text-decoration: none !important;
}

.meta-item a:hover {
    text-decoration: underline !important;
}

/* 게시물 액션 버튼 */
.view-actions {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding-top: 1rem !important;
    border-top: 1px solid #e5e7eb !important;
}

.view-actions-left .btn_bo_user,
.view-bottom-actions .btn_bo_user {
    display: flex !important;
    gap: 0.5rem !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.view-actions-left .btn_bo_user li,
.view-bottom-actions .btn_bo_user li {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
}

.view-actions-left .btn,
.view-bottom-actions .btn {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    color: white !important;
    border: none !important;
    padding: 0.5rem 1rem !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

.view-actions-left .btn:hover,
.view-bottom-actions .btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3) !important;
}

/* 더보기 메뉴 */
.more-actions {
    position: relative !important;
}

.btn_more {
    background: #f3f4f6 !important;
    color: #6b7280 !important;
    border: none !important;
    padding: 0.5rem !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.btn_more:hover {
    background: #e5e7eb !important;
    color: #374151 !important;
}

.more_opt {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    background: white !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
    z-index: 1000 !important;
    min-width: 120px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0.5rem 0 !important;
}

.more_opt li {
    margin: 0 !important;
}

.more_opt a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0.5rem 1rem !important;
    color: #374151 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    gap: 0.5rem !important;
}

.more_opt a:hover {
    background: #f3f4f6 !important;
    color: #667eea !important;
}

.more_opt a i {
    font-size: 0.8rem !important;
}

/* 게시물 내용 */
.view-content {
    background: white !important;
    border-radius: 8px !important;
    padding: 2rem !important;
    margin-bottom: 2rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.content-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 1.5rem !important;
    padding-bottom: 1rem !important;
    border-bottom: 1px solid #e5e7eb !important;
}

.content-header h3 {
    margin: 0 !important;
    color: #374151 !important;
    font-size: 1.2rem !important;
    font-weight: 600 !important;
}

.content-actions {
    display: flex !important;
    gap: 0.5rem !important;
}

.btn_scrap {
    background: #f3f4f6 !important;
    color: #6b7280 !important;
    border: none !important;
    padding: 0.5rem 1rem !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    font-size: 0.9rem !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

.btn_scrap:hover {
    background: #667eea !important;
    color: white !important;
}

.content-body {
    line-height: 1.8 !important;
    color: #374151 !important;
}

.content-text {
    font-size: 1rem !important;
}

/* 링크 섹션 */
.view-links {
    background: white !important;
    border-radius: 8px !important;
    padding: 1.5rem !important;
    margin-bottom: 2rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.view-links h4 {
    margin: 0 0 1rem 0 !important;
    color: #374151 !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
}

.link-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.link-list li {
    margin-bottom: 0.5rem !important;
}

.link-list a {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    color: #667eea !important;
    text-decoration: none !important;
    padding: 0.5rem !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
}

.link-list a:hover {
    background: #f0f4ff !important;
    color: #4c51bf !important;
}

/* 첨부파일 섹션 */
.view-files {
    background: white !important;
    border-radius: 8px !important;
    padding: 1.5rem !important;
    margin-bottom: 2rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.view-files h4 {
    margin: 0 0 1rem 0 !important;
    color: #374151 !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
}

.file-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.file-list li {
    margin-bottom: 0.5rem !important;
}

.file-link {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    color: #374151 !important;
    text-decoration: none !important;
    padding: 0.75rem !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
}

.file-link:hover {
    background: #f8fafc !important;
    border-color: #667eea !important;
    color: #667eea !important;
}

.file-size {
    color: #6b7280 !important;
    font-size: 0.9rem !important;
    margin-left: auto !important;
}

/* 댓글 섹션 */
#bo_vc {
    background: white !important;
    border-radius: 8px !important;
    padding: 2rem !important;
    margin-bottom: 2rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

#bo_vc h2 {
    margin: 0 0 1.5rem 0 !important;
    color: #374151 !important;
    font-size: 1.2rem !important;
    font-weight: 600 !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

.comment-count {
    background: #667eea !important;
    color: white !important;
    padding: 0.25rem 0.5rem !important;
    border-radius: 4px !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
}

/* 게시물 네비게이션 */
.post-navigation {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1rem !important;
    margin-bottom: 2rem !important;
}

.nav-prev,
.nav-next {
    background: white !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.nav-prev a,
.nav-next a {
    display: flex !important;
    align-items: center !important;
    padding: 1rem !important;
    color: #374151 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    gap: 1rem !important;
}

.nav-prev a:hover,
.nav-next a:hover {
    background: #f8fafc !important;
    color: #667eea !important;
}

.nav-content {
    flex: 1 !important;
}

.nav-label {
    display: block !important;
    font-size: 0.8rem !important;
    color: #6b7280 !important;
    margin-bottom: 0.25rem !important;
}

.nav-title {
    display: block !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
}

.nav-prev i,
.nav-next i {
    color: #667eea !important;
    font-size: 1.2rem !important;
}

/* 반응형 디자인 */
@media (max-width: 768px) {
    .list-container {
        padding: 1rem !important;
        margin: 1rem 0 !important;
    }
    
    .list-header {
        padding: 1rem !important;
    }
    
    .list-title {
        font-size: 1.2rem !important;
    }
    
    .list-info {
        padding: 1rem !important;
    }
    
    .list-stats {
        flex-direction: column !important;
        gap: 1rem !important;
    }
    
    .list-actions {
        justify-content: center !important;
    }
    
    .list-actions .btn_bo_user {
        justify-content: center !important;
    }
    
    .list-table-wrapper {
        overflow-x: auto !important;
    }
    
    .list-search {
        padding: 1.5rem !important;
    }
    
    .search-controls {
        flex-direction: column !important;
        gap: 1rem !important;
        padding: 1rem !important;
    }
    
    .search-select select {
        width: 100% !important;
        max-width: none !important;
        height: 44px !important;
    }
    
    .search-input input {
        width: 100% !important;
        height: 44px !important;
    }
    
    .btn-search {
        height: 44px !important;
        padding: 0 1.2rem !important;
        min-width: 80px !important;
    }
    
    .view-container {
        padding: 1rem !important;
        margin: 1rem 0 !important;
    }
    
    .view-header {
        padding: 1rem !important;
    }
    
    .view-title {
        font-size: 1.2rem !important;
    }
    
    .view-info {
        padding: 1rem !important;
    }
    
    .profile_info {
        flex-direction: column !important;
        text-align: center !important;
    }
    
    .post-meta {
        justify-content: center !important;
        flex-wrap: wrap !important;
    }
    
    .view-actions {
        flex-direction: column !important;
        gap: 1rem !important;
    }
    
    .view-actions-left .btn_bo_user,
    .view-bottom-actions .btn_bo_user {
        justify-content: center !important;
    }
    
    .view-content {
        padding: 1rem !important;
    }
    
    .post-navigation {
        grid-template-columns: 1fr !important;
    }
}