@charset "utf-8";

/* ==========================================================================
   Reloj Board (.reloj-board-section 스코프)
   ========================================================================== */
.reloj-board-section {
    padding: 0;
    color: #ffffff;
    font-family: "Jost", "Noto Sans KR", sans-serif;
}
.reloj-board-section *,
.reloj-board-section *::before,
.reloj-board-section *::after { box-sizing: border-box; }

.reloj-board-section .reloj-board-wrapper {
    background: #24263A;
    border-radius: 16px;
    padding: 32px;
    max-width: 100%;
    margin: 0 auto;
}

/* 헤더 */
.reloj-board-section .reloj-board-header { margin-bottom: 24px; }
.reloj-board-section .reloj-board-title {
    color: #ffffff; font-size: 26px; font-weight: 700; margin: 0 0 8px;
}
.reloj-board-section .reloj-board-sub { color: #B2B6BF; font-size: 14px; margin: 0; }
.reloj-board-section .reloj-board-sub b { color: #65FF4B; }

/* 검색 */
.reloj-board-section .reloj-board-search { margin-bottom: 20px; }
.reloj-board-section .reloj-board-search-row {
    display: flex; gap: 8px; flex-wrap: wrap;
}
.reloj-board-section .reloj-board-search-select {
    background: #31334E;
    color: #ffffff;
    border: 1px solid transparent;
    border-radius: 100px;
    padding: 0 16px;
    font-size: 13px;
    outline: none;
    min-width: 110px;
    height: 40px;
}
.reloj-board-section .reloj-board-search-input {
    flex: 1; min-width: 240px; position: relative;
    background: #31334E;
    border-radius: 100px;
    border: 1px solid transparent;
    transition: border-color 0.2s;
}
.reloj-board-section .reloj-board-search-input:focus-within { border-color: #65FF4B; }
.reloj-board-section .reloj-board-search-input i {
    position: absolute; left: 18px; top: 50%; transform: translateY(-50%);
    color: #B2B6BF; font-size: 14px;
}
.reloj-board-section .reloj-board-search-input input {
    width: 100%;
    background: transparent;
    border: 0;
    color: #ffffff;
    padding: 10px 18px 10px 42px;
    font-size: 14px;
    outline: none;
}
.reloj-board-section .reloj-board-search-input input::placeholder { color: #B2B6BF; }
.reloj-board-section .reloj-board-search-btn {
    background: linear-gradient(94deg, #65FF4B 0%, #FFFB1F 100%);
    color: #121519;
    border: 0;
    border-radius: 100px;
    padding: 0 24px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    white-space: nowrap;
    height: 40px;
    transition: opacity 0.2s;
}
.reloj-board-section .reloj-board-search-btn:hover { opacity: 0.9; }

/* 카테고리 탭 */
.reloj-board-section .reloj-board-category { margin-bottom: 20px; }
.reloj-board-section .reloj-board-tabs {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-wrap: wrap; gap: 4px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.reloj-board-section .reloj-board-tabs li a {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 10px 18px;
    color: #B2B6BF;
    text-decoration: none;
    font-size: 14px;
    border-radius: 8px 8px 0 0;
    transition: background 0.2s, color 0.2s;
}
.reloj-board-section .reloj-board-tabs li a:hover { color: #ffffff; background: rgba(255,255,255,0.04); }
.reloj-board-section .reloj-board-tabs li.active a {
    color: #65FF4B;
    background: rgba(101,255,75,0.08);
    font-weight: 600;
    border-bottom: 2px solid #65FF4B;
}
.reloj-board-section .reloj-board-tab-count {
    color: #ffffff;
    background: rgba(255,255,255,0.08);
    padding: 1px 8px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 600;
}
.reloj-board-section .reloj-board-tabs li.active .reloj-board-tab-count {
    background: linear-gradient(94deg, #65FF4B 0%, #FFFB1F 100%);
    color: #121519;
}

/* ==========================================================================
   목록 (PC 플렉스: 옵션 컬럼 조합 무관 자동 정렬)
   ========================================================================== */
.reloj-board-section .reloj-board-list-table { margin-bottom: 16px; }
.reloj-board-section .reloj-board-list-head,
.reloj-board-section .reloj-board-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
}
.reloj-board-section .reloj-board-list-head {
    background: rgba(255,255,255,0.04);
    border-radius: 8px 8px 0 0;
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    padding: 12px 16px;
}
.reloj-board-section .reloj-board-list-head a { color: #ffffff; text-decoration: none; }
.reloj-board-section .reloj-board-list-head a:hover { color: #65FF4B; }

/* 컬럼별 고정 폭 (flex item) */
.reloj-board-section .reloj-board-list-head > span,
.reloj-board-section .reloj-board-row > span {
    flex-shrink: 0;
    text-align: center;
    min-width: 0;
}
.reloj-board-section .reloj-board-list-head .col-chk,
.reloj-board-section .reloj-board-row .col-chk { width: 28px; }
.reloj-board-section .reloj-board-list-head .col-num,
.reloj-board-section .reloj-board-row .col-num { width: 60px; }
.reloj-board-section .reloj-board-list-head .col-img,
.reloj-board-section .reloj-board-row .col-img { width: 50px; }
.reloj-board-section .reloj-board-list-head .col-cat,
.reloj-board-section .reloj-board-row .col-cat { width: 70px; }
.reloj-board-section .reloj-board-list-head .col-subject,
.reloj-board-section .reloj-board-row .col-subject {
    flex: 1; min-width: 0; text-align: left;
}
.reloj-board-section .reloj-board-list-head .col-name,
.reloj-board-section .reloj-board-row .col-name {
    width: 100px; text-align: left;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.reloj-board-section .reloj-board-list-head .col-date,
.reloj-board-section .reloj-board-row .col-date { width: 90px; }
.reloj-board-section .reloj-board-list-head .col-hit,
.reloj-board-section .reloj-board-row .col-hit { width: 60px; }
.reloj-board-section .reloj-board-list-head .col-good,
.reloj-board-section .reloj-board-row .col-good { width: 50px; }
.reloj-board-section .reloj-board-list-head .col-nogood,
.reloj-board-section .reloj-board-row .col-nogood { width: 50px; }

.reloj-board-section .reloj-board-list-body { list-style: none; padding: 0; margin: 0; }
.reloj-board-section .reloj-board-row {
    border-bottom: 1px solid rgba(255,255,255,0.06);
    color: #d8d8e0;
    font-size: 13px;
    transition: background 0.2s;
}
.reloj-board-section .reloj-board-row:hover { background: rgba(255,255,255,0.03); }
.reloj-board-section .reloj-board-row.is-now { background: rgba(101,255,75,0.06); }
.reloj-board-section .reloj-board-row.is-notice { background: rgba(255,251,31,0.04); }

.reloj-board-section .reloj-board-row .col-num,
.reloj-board-section .reloj-board-row .col-date,
.reloj-board-section .reloj-board-row .col-hit,
.reloj-board-section .reloj-board-row .col-good,
.reloj-board-section .reloj-board-row .col-nogood { color: #888a9a; font-size: 12px; }
.reloj-board-section .reloj-board-row .col-name {
    color: #B2B6BF; font-weight: 500;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.reloj-board-section .reloj-board-row .col-img img {
    width: 40px; height: 40px; border-radius: 8px; object-fit: cover; vertical-align: middle;
}
.reloj-board-section .reloj-board-row .col-img i { font-size: 24px; color: #404A60; }

.reloj-board-section .reloj-board-num { color: #888a9a; }

/* 제목 */
.reloj-board-section .reloj-board-subject {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #ffffff;
    font-weight: 500;
    text-decoration: none;
    line-height: 1.4;
}
.reloj-board-section .reloj-board-subject:hover { color: #65FF4B; text-decoration: none; }
.reloj-board-section .reloj-board-row.is-notice .reloj-board-subject { color: #FFFB1F; font-weight: 600; }
.reloj-board-section .reloj-board-row.is-now .reloj-board-subject { color: #65FF4B; }

.reloj-board-section .reloj-board-cat {
    color: #FFFB1F;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}
.reloj-board-section .reloj-board-cat:hover { color: #65FF4B; }

.reloj-board-section .reloj-board-comment-cnt {
    color: #65FF4B;
    font-weight: 600;
    font-size: 12px;
    margin-left: 4px;
}

/* 아이콘/태그 */
.reloj-board-section .reloj-board-icon {
    display: inline-flex; align-items: center; justify-content: center;
    height: 18px; padding: 0 6px;
    border-radius: 4px;
    font-size: 10px; font-weight: 700;
    line-height: 1;
}
.reloj-board-section .reloj-board-icon-hot { background: #ED5050; color: #ffffff; }
.reloj-board-section .reloj-board-icon-new { background: #65FF4B; color: #121519; }
.reloj-board-section .reloj-board-icon-secret { background: rgba(255,255,255,0.1); color: #B2B6BF; }

.reloj-board-section .reloj-board-tag {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 700;
}
.reloj-board-section .reloj-board-tag-notice {
    background: linear-gradient(94deg, #65FF4B 0%, #FFFB1F 100%);
    color: #121519;
}
.reloj-board-section .reloj-board-tag-now {
    background: rgba(101,255,75,0.18);
    color: #65FF4B;
}

/* 빈 상태 */
.reloj-board-section .reloj-board-empty {
    padding: 80px 20px;
    text-align: center;
    color: #888a9a;
    list-style: none;
}
.reloj-board-section .reloj-board-empty i { font-size: 48px; margin-bottom: 16px; display: block; color: #404A60; }
.reloj-board-section .reloj-board-empty p { margin: 0; font-size: 14px; }

/* ==========================================================================
   목록 (모바일)
   ========================================================================== */
.reloj-board-section .reloj-board-list-mobile {
    list-style: none; padding: 0; margin: 0;
}
.reloj-board-section .reloj-board-mrow {
    display: flex; gap: 12px; align-items: center;
    padding: 14px 12px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    text-decoration: none;
    color: #d8d8e0;
    transition: background 0.2s;
}
.reloj-board-section .reloj-board-mrow:hover { background: rgba(255,255,255,0.03); text-decoration: none; }
.reloj-board-section .reloj-board-mrow.is-notice { background: rgba(255,251,31,0.04); }
.reloj-board-section .reloj-board-mrow.is-now { background: rgba(101,255,75,0.06); }
.reloj-board-section .reloj-board-mimg {
    flex-shrink: 0;
    width: 48px; height: 48px;
    border-radius: 10px;
    overflow: hidden;
    background: rgba(255,255,255,0.05);
    display: flex; align-items: center; justify-content: center;
}
.reloj-board-section .reloj-board-mimg img { width: 100%; height: 100%; object-fit: cover; }
.reloj-board-section .reloj-board-mimg i { font-size: 22px; color: #404A60; }
.reloj-board-section .reloj-board-mbody { flex: 1; min-width: 0; display: block; }
.reloj-board-section .reloj-board-msubject {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.reloj-board-section .reloj-board-mrow.is-notice .reloj-board-msubject { color: #FFFB1F; }
.reloj-board-section .reloj-board-mrow.is-now .reloj-board-msubject { color: #65FF4B; }
.reloj-board-section .reloj-board-mmeta {
    display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
    font-size: 12px;
    color: #888a9a;
}
.reloj-board-section .reloj-board-mmeta i { margin-right: 2px; }

/* ==========================================================================
   액션 버튼
   ========================================================================== */
.reloj-board-section .reloj-board-actions {
    display: flex; justify-content: space-between; align-items: center;
    flex-wrap: wrap; gap: 8px; margin-top: 16px;
}
.reloj-board-section .reloj-board-action-left,
.reloj-board-section .reloj-board-action-right { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.reloj-board-section .reloj-board-btn-secondary,
.reloj-board-section .reloj-board-btn-primary {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 18px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    border: 0;
    transition: all 0.2s;
    line-height: 1.2;
}
.reloj-board-section .reloj-board-btn-secondary {
    background: transparent;
    color: #ffffff;
    border: 1px solid #404A60;
}
.reloj-board-section .reloj-board-btn-secondary:hover { background: #ffffff; color: #121519; }
.reloj-board-section .reloj-board-btn-primary {
    background: linear-gradient(94deg, #65FF4B 0%, #FFFB1F 100%);
    color: #121519;
    font-weight: 600;
}
.reloj-board-section .reloj-board-btn-primary:hover { opacity: 0.9; color: #121519; }

.reloj-board-section .reloj-board-sort { position: relative; }
.reloj-board-section .reloj-board-sort-menu {
    background: #31334E;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 10px;
    padding: 6px 0;
    margin-top: 4px;
}
.reloj-board-section .reloj-board-sort-menu li.sort > a { color: #65FF4B; }
.reloj-board-section .reloj-board-sort-menu li > a {
    color: #d8d8e0;
    padding: 6px 16px;
    display: block;
    font-size: 13px;
    text-decoration: none;
}
.reloj-board-section .reloj-board-sort-menu li > a:hover { background: rgba(255,255,255,0.04); color: #65FF4B; }

/* 페이지네이션 — BS3 기본 룰(float:left, border, margin -1px, first/last radius) 전면 무력화 */
.reloj-board-section .reloj-board-pagination { text-align: center; margin: 24px 0 8px; }
.reloj-board-section .reloj-board-pagination .pagination {
    display: inline-flex !important;
    gap: 6px;
    padding: 0;
    margin: 0;
    list-style: none;
    flex-wrap: wrap;
    justify-content: center;
    border-radius: 0;
}
.reloj-board-section .reloj-board-pagination .pagination > li {
    display: inline-flex !important;
    margin: 0 !important;
    padding: 0;
    float: none !important;
}
.reloj-board-section .reloj-board-pagination .pagination > li > a,
.reloj-board-section .reloj-board-pagination .pagination > li > span {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    margin: 0 !important;
    background: #31334E !important;
    color: #d8d8e0 !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
    border-radius: 8px !important;
    font-size: 13px;
    line-height: 1;
    text-decoration: none !important;
    float: none !important;
    transition: background .15s, color .15s, border-color .15s, transform .15s;
}
.reloj-board-section .reloj-board-pagination .pagination > li > a > i,
.reloj-board-section .reloj-board-pagination .pagination > li > span > i {
    color: inherit !important;
    font-size: 13px;
    line-height: 1;
}
.reloj-board-section .reloj-board-pagination .pagination > li > a:hover,
.reloj-board-section .reloj-board-pagination .pagination > li > a:focus {
    background: rgba(101,255,75,0.12) !important;
    color: #65FF4B !important;
    border-color: rgba(101,255,75,0.35) !important;
    transform: translateY(-1px);
}
.reloj-board-section .reloj-board-pagination .pagination > li.active > a,
.reloj-board-section .reloj-board-pagination .pagination > li.active > span,
.reloj-board-section .reloj-board-pagination .pagination > li.active > a:hover,
.reloj-board-section .reloj-board-pagination .pagination > li.active > a:focus {
    background: linear-gradient(94deg, #65FF4B 0%, #FFFB1F 100%) !important;
    color: #121519 !important;
    border-color: transparent !important;
    font-weight: 700;
    cursor: default;
}
/* disabled 페이지 버튼: BS3 기본 흰배경 회색문자 → 다크 테마 색상으로 강제 */
.reloj-board-section .reloj-board-pagination .pagination > li.disabled > a,
.reloj-board-section .reloj-board-pagination .pagination > li.disabled > span,
.reloj-board-section .reloj-board-pagination .pagination > li.disabled > a:hover,
.reloj-board-section .reloj-board-pagination .pagination > li.disabled > a:focus {
    background: #1c1e2c !important;
    color: #6b6f80 !important;
    border-color: rgba(255,255,255,0.04) !important;
    cursor: not-allowed;
    opacity: 0.55;
    transform: none !important;
}
.reloj-board-section .reloj-board-pagination .pagination > li.disabled > a > i,
.reloj-board-section .reloj-board-pagination .pagination > li.disabled > span > i {
    color: inherit !important;
}
@media (max-width: 575px) {
    .reloj-board-section .reloj-board-pagination .pagination { gap: 4px; }
    .reloj-board-section .reloj-board-pagination .pagination > li > a,
    .reloj-board-section .reloj-board-pagination .pagination > li > span {
        min-width: 32px; height: 32px; padding: 0 8px; font-size: 12px;
    }
}

.reloj-board-section .reloj-board-noscript {
    color: #ED5050; font-size: 12px; margin: 8px 0; text-align: center;
}

/* ==========================================================================
   View (보기)
   ========================================================================== */
.reloj-board-section.reloj-board-view .reloj-board-view-head {
    padding-bottom: 18px;
    margin-bottom: 20px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.reloj-board-section .reloj-board-view-title {
    color: #ffffff;
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 12px;
    line-height: 1.4;
    word-break: break-word;
}
.reloj-board-section .reloj-board-view-photo {
    width: 36px; height: 36px; border-radius: 50%;
    margin-right: 10px; vertical-align: middle;
}
.reloj-board-section .reloj-board-view-meta {
    display: flex; flex-wrap: wrap; gap: 14px;
    color: #B2B6BF; font-size: 13px;
}
.reloj-board-section .reloj-board-view-meta i { color: #888a9a; margin-right: 4px; }
.reloj-board-section .reloj-board-view-meta .reloj-board-view-date { margin-left: auto; }

.reloj-board-section .reloj-board-attach {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 12px;
    padding: 6px 0;
    margin-bottom: 16px;
}
.reloj-board-section .reloj-board-attach-item {
    display: flex; align-items: center; gap: 8px;
    padding: 10px 16px;
    color: #d8d8e0; font-size: 13px;
    text-decoration: none;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}
.reloj-board-section .reloj-board-attach-item:last-child { border-bottom: 0; }
.reloj-board-section .reloj-board-attach-item:hover { color: #65FF4B; background: rgba(255,255,255,0.02); text-decoration: none; }
.reloj-board-section .reloj-board-attach-item i { color: #65FF4B; }
.reloj-board-section .reloj-board-attach-warn { color: #FFFB1F; }
.reloj-board-section .reloj-board-attach-warn i { color: #FFFB1F; }
.reloj-board-section .reloj-board-attach-size { color: #888a9a; font-size: 12px; }
.reloj-board-section .reloj-board-attach-cnt {
    margin-left: auto;
    background: rgba(101,255,75,0.15);
    color: #65FF4B;
    padding: 2px 10px;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 600;
}

.reloj-board-section .reloj-board-view-img { text-align: center; margin-bottom: 16px; }
.reloj-board-section .reloj-board-view-img img { max-width: 100%; height: auto; border-radius: 12px; }

.reloj-board-section .reloj-board-view-content {
    color: #d8d8e0;
    font-size: 14px;
    line-height: 1.7;
    padding: 4px 0 24px;
    word-break: break-word;
}
.reloj-board-section .reloj-board-view-content p { color: #d8d8e0; }
.reloj-board-section .reloj-board-view-content a { color: #65FF4B; }
.reloj-board-section .reloj-board-view-content img { max-width: 100%; height: auto; border-radius: 8px; }
/* 파싱글 호환: 인라인 bgcolor(흰색 등) 무력화 → 테마 어두운 배경 유지 */
.reloj-board-section .reloj-board-view-content table,
.reloj-board-section .reloj-board-view-content tr,
.reloj-board-section .reloj-board-view-content td,
.reloj-board-section .reloj-board-view-content th,
.reloj-board-section .reloj-board-view-content [bgcolor],
.reloj-board-section .reloj-board-view-content table[bgcolor],
.reloj-board-section .reloj-board-view-content tr[bgcolor],
.reloj-board-section .reloj-board-view-content td[bgcolor],
.reloj-board-section .reloj-board-view-content th[bgcolor] {
    background-color: transparent !important;
    background: transparent !important;
    color: #d8d8e0;
    border-color: rgba(255,255,255,0.08) !important;
}
.reloj-board-section .reloj-board-view-content font,
.reloj-board-section .reloj-board-view-content span,
.reloj-board-section .reloj-board-view-content div { color: inherit; }
/* 본문 표 폭 자동 (네이트 등 width=700 고정 표 → 모바일 호환) */
.reloj-board-section .reloj-board-view-content table { width: 100% !important; max-width: 100%; border-collapse: collapse; }
.reloj-board-section .reloj-board-view-content iframe.ad100 { display: none !important; }

/* 추천/비추천 */
.reloj-board-section .reloj-board-good {
    display: flex; gap: 12px; justify-content: center; margin: 12px 0 24px;
}
.reloj-board-section .reloj-board-good-btn {
    display: inline-flex; flex-direction: column; align-items: center; gap: 4px;
    min-width: 96px;
    padding: 14px 18px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(255,255,255,0.03);
    color: #d8d8e0;
    text-decoration: none;
    transition: all 0.2s;
}
.reloj-board-section .reloj-board-good-btn:hover { text-decoration: none; }
.reloj-board-section .reloj-board-good-btn i { font-size: 20px; }
.reloj-board-section .reloj-board-good-btn b { font-size: 16px; font-weight: 700; }
.reloj-board-section .reloj-board-good-btn span { font-size: 11px; color: #B2B6BF; }
.reloj-board-section .reloj-board-good-up:hover { border-color: #65FF4B; color: #65FF4B; }
.reloj-board-section .reloj-board-good-up:hover span { color: #65FF4B; }
.reloj-board-section .reloj-board-good-down:hover { border-color: #ED5050; color: #ED5050; }
.reloj-board-section .reloj-board-good-down:hover span { color: #ED5050; }

.reloj-board-section .reloj-board-view-tag {
    color: #B2B6BF; font-size: 12px; margin: 8px 0 16px;
}
.reloj-board-section .reloj-board-view-tag i { color: #65FF4B; margin-right: 4px; }

.reloj-board-section .reloj-board-view-tools {
    display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px;
    padding: 12px 0;
    border-top: 1px solid rgba(255,255,255,0.06);
    border-bottom: 1px solid rgba(255,255,255,0.06);
    margin-bottom: 24px;
}
.reloj-board-section .reloj-board-view-icons,
.reloj-board-section .reloj-board-view-sns { display: flex; gap: 6px; flex-wrap: wrap; }

.reloj-board-section .reloj-board-comment-title {
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    margin: 8px 0 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.reloj-board-section .reloj-board-comment-title span {
    color: #65FF4B;
    margin-left: 6px;
    font-size: 14px;
}

/* ==========================================================================
   Form (글쓰기)
   ========================================================================== */
.reloj-board-section .reloj-board-field { margin-bottom: 18px; }
.reloj-board-section .reloj-board-label {
    display: block;
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 8px;
}
.reloj-board-section .reloj-board-required { color: #65FF4B; }
.reloj-board-section .reloj-board-field-row {
    display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
}
.reloj-board-section .reloj-board-input,
.reloj-board-section .reloj-board-textarea {
    flex: 1; min-width: 0;
    width: 100%;
    background: #31334E;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #ffffff;
    padding: 10px 14px;
    font-size: 14px;
    outline: none;
    transition: border-color 0.2s;
}
.reloj-board-section .reloj-board-input:focus,
.reloj-board-section .reloj-board-textarea:focus { border-color: #65FF4B; }
.reloj-board-section .reloj-board-input::placeholder,
.reloj-board-section .reloj-board-textarea::placeholder { color: #888a9a; }
.reloj-board-section .reloj-board-select { max-width: 320px; }
.reloj-board-section .reloj-board-textarea { min-height: 280px; resize: vertical; }

.reloj-board-section .reloj-board-checkbox {
    display: inline-flex; align-items: center; gap: 6px;
    color: #d8d8e0;
    font-size: 13px;
    font-weight: normal;
    margin: 0 12px 0 0;
    white-space: nowrap;
}
.reloj-board-section .reloj-board-checkbox input { margin: 0; }

.reloj-board-section .reloj-board-help {
    color: #B2B6BF;
    font-size: 12px;
    margin: 8px 0 0;
    padding: 8px 12px;
    background: rgba(255,255,255,0.03);
    border-radius: 8px;
}
.reloj-board-section .reloj-board-help strong { color: #65FF4B; }

.reloj-board-section .reloj-board-captcha { text-align: center; padding: 16px 0; }

.reloj-board-section .cke,
.reloj-board-section .cke_chrome,
.reloj-board-section .cke_inner { border-radius: 10px; overflow: hidden; }

/* ==========================================================================
   유틸/모바일
   ========================================================================== */
@media (max-width: 767px) {
    .reloj-board-section { padding: 24px 8px; }
    .reloj-board-section .reloj-board-wrapper { padding: 18px 14px; }
    .reloj-board-section .reloj-board-title { font-size: 22px; }

    .reloj-board-section .reloj-board-search-row { flex-direction: column; }
    .reloj-board-section .reloj-board-search-select { width: 100%; }
    .reloj-board-section .reloj-board-search-input { width: 100%; }
    .reloj-board-section .reloj-board-search-btn { padding: 10px; }

    .reloj-board-section .hidden-xs { display: none !important; }

    .reloj-board-section .reloj-board-list-head { display: none; }
    .reloj-board-section .reloj-board-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 14px 12px;
    }
    .reloj-board-section .reloj-board-row > span {
        width: auto;
        text-align: left;
    }
    .reloj-board-section .reloj-board-row .col-subject { width: 100%; }
    .reloj-board-section .reloj-board-row .col-num,
    .reloj-board-section .reloj-board-row .col-img,
    .reloj-board-section .reloj-board-row .col-cat,
    .reloj-board-section .reloj-board-row .col-good,
    .reloj-board-section .reloj-board-row .col-nogood,
    .reloj-board-section .reloj-board-row .col-name,
    .reloj-board-section .reloj-board-row .col-date,
    .reloj-board-section .reloj-board-row .col-hit { font-size: 11px; margin-right: 8px; }

    .reloj-board-section .reloj-board-view-title { font-size: 18px; }
    .reloj-board-section .reloj-board-view-meta { font-size: 12px; gap: 10px; }
    .reloj-board-section .reloj-board-view-meta .reloj-board-view-date { margin-left: 0; }
    .reloj-board-section .reloj-board-view-tools { flex-direction: column; }

    .reloj-board-section .reloj-board-actions { flex-direction: column; align-items: stretch; }
    .reloj-board-section .reloj-board-action-left,
    .reloj-board-section .reloj-board-action-right { justify-content: center; }
}

/* ==========================================================================
   Comments (.reloj-board-comments / .reloj-board-commentform)
   ========================================================================== */
.reloj-board-section .reloj-board-comments-wrap { margin-bottom: 16px; }
.reloj-board-section .reloj-board-comments {
    list-style: none; padding: 0; margin: 0 0 8px;
}

/* 빈 상태 */
.reloj-board-section .reloj-board-comment-empty {
    padding: 40px 20px;
    text-align: center;
    color: #888a9a;
    background: rgba(255,255,255,0.02);
    border: 1px dashed rgba(255,255,255,0.08);
    border-radius: 12px;
    margin-bottom: 12px;
}
.reloj-board-section .reloj-board-comment-empty i { font-size: 36px; color: #404A60; display: block; margin-bottom: 10px; }
.reloj-board-section .reloj-board-comment-empty p { margin: 0; font-size: 13px; }

/* 댓글 카드 */
.reloj-board-section .reloj-board-comment {
    display: flex;
    gap: 12px;
    padding: 14px 16px;
    margin-bottom: 8px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 12px;
    transition: border-color 0.2s;
}
.reloj-board-section .reloj-board-comment:hover { border-color: rgba(101,255,75,0.18); }
.reloj-board-section .reloj-board-comment.is-reply {
    background: rgba(101,255,75,0.04);
    border-color: rgba(101,255,75,0.14);
    border-left: 3px solid #65FF4B;
}

.reloj-board-section .reloj-board-comment-photo {
    flex-shrink: 0;
    margin: 0;
    float: none;
}
.reloj-board-section .reloj-board-comment-photo img,
.reloj-board-section .reloj-board-comment-photo .reloj-board-comment-avatar {
    width: 40px; height: 40px;
    border-radius: 50%;
    object-fit: cover;
    background: rgba(255,255,255,0.06);
    color: #B2B6BF;
    display: flex; align-items: center; justify-content: center;
    font-size: 18px;
}

.reloj-board-section .reloj-board-comment-body {
    flex: 1; min-width: 0;
}

.reloj-board-section .reloj-board-comment-head {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
    margin-bottom: 6px;
}
.reloj-board-section .reloj-board-comment-meta {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
    flex: 1; min-width: 0;
}
.reloj-board-section .reloj-board-comment-name {
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
}
.reloj-board-section .reloj-board-comment-info {
    color: #888a9a;
    font-size: 11px;
    text-decoration: none;
}
.reloj-board-section .reloj-board-comment-info i { margin-right: 3px; }
.reloj-board-section a.reloj-board-comment-info:hover { color: #65FF4B; }

.reloj-board-section .reloj-board-comment-best {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 100px;
    background: linear-gradient(94deg, #65FF4B 0%, #FFFB1F 100%);
    color: #121519;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.reloj-board-section .reloj-board-comment-reply-tag {
    display: inline-flex; align-items: center; gap: 3px;
    padding: 2px 8px;
    border-radius: 100px;
    background: rgba(101,255,75,0.12);
    color: #65FF4B;
    font-size: 10px;
    font-weight: 600;
}

.reloj-board-section .reloj-board-comment-tools {
    display: flex; flex-wrap: wrap; gap: 4px;
    margin-left: auto;
}
.reloj-board-section .reloj-board-comment-tool {
    display: inline-flex; align-items: center; gap: 3px;
    padding: 4px 10px;
    border-radius: 100px;
    color: #B2B6BF;
    background: transparent;
    font-size: 11px;
    text-decoration: none;
    border: 1px solid transparent;
    transition: all 0.2s;
}
.reloj-board-section .reloj-board-comment-tool:hover {
    color: #ffffff;
    background: rgba(255,255,255,0.06);
    text-decoration: none;
}
.reloj-board-section .reloj-board-comment-tool i { font-size: 11px; }

.reloj-board-section .reloj-board-comment-content {
    color: #d8d8e0;
    font-size: 14px;
    line-height: 1.65;
    word-break: break-word;
    padding: 4px 0;
}
.reloj-board-section .reloj-board-comment-content a { color: #65FF4B; }
.reloj-board-section .reloj-board-comment-content img { max-width: 100%; height: auto; border-radius: 8px; }
.reloj-board-section .reloj-board-comment-content p { color: #d8d8e0; margin: 0 0 6px; }

.reloj-board-section .reloj-board-comment-replyname {
    color: #65FF4B;
    font-weight: 600;
    margin-right: 4px;
}
.reloj-board-section .reloj-board-comment-secret {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 2px 8px;
    border-radius: 100px;
    background: rgba(255,255,255,0.06);
    color: #B2B6BF;
    font-size: 11px;
    margin-right: 6px;
    vertical-align: middle;
}
.reloj-board-section .s_cmt {
    display: inline-flex; align-items: center; gap: 4px;
    color: #FFFB1F !important;
    text-decoration: none;
}
.reloj-board-section .s_cmt:hover { text-decoration: underline; }

/* 댓글 추천/비추천 */
.reloj-board-section .reloj-board-comment-good {
    display: flex; gap: 6px; margin-top: 8px;
}
.reloj-board-section .reloj-board-comment-good-btn {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 4px 12px;
    border-radius: 100px;
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(255,255,255,0.03);
    color: #d8d8e0;
    font-size: 12px;
    text-decoration: none;
    transition: all 0.2s;
}
.reloj-board-section .reloj-board-comment-good-up:hover { border-color: #65FF4B; color: #65FF4B; }
.reloj-board-section .reloj-board-comment-good-down:hover { border-color: #ED5050; color: #ED5050; }

/* 댓글 작성 폼 */
.reloj-board-section .reloj-board-commentform {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 12px;
    padding: 16px;
    margin-top: 14px;
}
.reloj-board-section .reloj-board-commentform-guest {
    display: flex; gap: 12px; flex-wrap: wrap;
    margin-bottom: 12px;
}
.reloj-board-section .reloj-board-commentform-guest .reloj-board-field {
    flex: 1; min-width: 180px; margin-bottom: 0;
}
.reloj-board-section .reloj-board-commentform-textarea { margin-bottom: 12px; position: relative; }
.reloj-board-section .reloj-board-comment-textarea {
    min-height: 100px;
    width: 100%;
}
.reloj-board-section .reloj-board-comment-charcount {
    text-align: right;
    color: #888a9a;
    font-size: 11px;
    margin-top: 4px;
}
.reloj-board-section .reloj-board-comment-charcount span { color: #65FF4B; font-weight: 600; }

.reloj-board-section .reloj-board-commentform-actions {
    display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
}
.reloj-board-section .reloj-board-commentform-options {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.reloj-board-section .reloj-board-commentform-vote {
    display: flex; gap: 8px; flex-wrap: wrap;
}
.reloj-board-section .reloj-board-commentform-buttons {
    display: flex; flex-wrap: wrap; gap: 6px;
    margin-left: auto;
}
.reloj-board-section .reloj-board-commentform-buttons .reloj-board-btn-secondary {
    padding: 8px 12px;
    min-width: 36px;
    justify-content: center;
}

/* 권한 없음/잠김 */
.reloj-board-section .reloj-board-comment-locked {
    padding: 16px 20px;
    text-align: center;
    background: rgba(255,255,255,0.03);
    border: 1px dashed rgba(255,255,255,0.08);
    border-radius: 12px;
    color: #B2B6BF;
    font-size: 13px;
    margin-top: 14px;
}
.reloj-board-section .reloj-board-comment-locked a {
    color: #65FF4B;
    text-decoration: none;
}
.reloj-board-section .reloj-board-comment-locked a:hover { text-decoration: underline; }
.reloj-board-section .reloj-board-comment-locked i { margin-right: 6px; }

/* 모바일 댓글 보강 */
@media (max-width: 767px) {
    .reloj-board-section .reloj-board-comment { padding: 12px 12px; gap: 10px; }
    .reloj-board-section .reloj-board-comment-photo img,
    .reloj-board-section .reloj-board-comment-photo .reloj-board-comment-avatar { width: 32px; height: 32px; font-size: 14px; }
    .reloj-board-section .reloj-board-comment-name { font-size: 13px; }
    .reloj-board-section .reloj-board-comment-content { font-size: 13px; }
    .reloj-board-section .reloj-board-commentform-actions { flex-direction: column; align-items: stretch; }
    .reloj-board-section .reloj-board-commentform-buttons { margin-left: 0; justify-content: flex-end; }
}

/* ==========================================================================
   뉴스 게시판 전용 스타일 (.news-board-section)
   ========================================================================== */

/* 헤더 */
.news-board-header { margin-bottom: 28px; }
.news-board-title {
    font-size: 24px; font-weight: 800; color: #fff;
    margin: 0 0 6px; display: flex; align-items: center; gap: 10px;
}
.news-board-title i { color: #65FF4B; }
.news-board-sub { color: #B2B6BF; font-size: 13px; margin: 0; }
.news-board-sub b { color: #65FF4B; }

/* 카드 그리드 */
.news-card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 8px;
}

/* 뉴스 카드 */
.news-card {
    background: #1e1f35;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 14px;
    overflow: hidden;
    transition: transform .2s, border-color .2s, box-shadow .2s;
}
.news-card:hover {
    transform: translateY(-4px);
    border-color: rgba(101,255,75,.35);
    box-shadow: 0 8px 30px rgba(0,0,0,.4);
}
.news-card.is-notice { border-color: rgba(255,251,31,.25); }
.news-card-link {
    display: flex; flex-direction: column; height: 100%;
    text-decoration: none; color: inherit;
}

/* 카드 썸네일 */
.news-card-thumb {
    position: relative;
    width: 100%; padding-top: 56%;
    background: #14152A; overflow: hidden; flex-shrink: 0;
}
.news-card-thumb img {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .35s;
}
.news-card:hover .news-card-thumb img { transform: scale(1.04); }
.news-card-thumb-placeholder {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #1e1f35, #14152A);
}
.news-card-thumb-placeholder i { font-size: 36px; color: rgba(255,255,255,.12); }

/* 카드 배지 */
.news-card-cat {
    position: absolute; top: 10px; left: 10px;
    background: rgba(101,255,75,.9); color: #121519;
    font-size: 11px; font-weight: 800; padding: 3px 10px;
    border-radius: 100px; letter-spacing: .5px;
}
.news-card-cat-notice { background: rgba(255,251,31,.9); }
.news-card-badge-hot {
    position: absolute; top: 10px; right: 10px;
    background: #ff4757; color: #fff;
    font-size: 10px; font-weight: 800; padding: 3px 8px; border-radius: 100px;
}
.news-card-badge-new {
    position: absolute; top: 10px; right: 10px;
    background: #1e90ff; color: #fff;
    font-size: 10px; font-weight: 800; padding: 3px 8px; border-radius: 100px;
}

/* 카드 본문 */
.news-card-body { padding: 14px 16px 16px; display: flex; flex-direction: column; flex: 1; }
.news-card-title {
    font-size: 14px; font-weight: 600; color: #e8e8f0;
    line-height: 1.55; margin: 0 0 10px;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
    overflow: hidden; flex: 1;
}
.news-card:hover .news-card-title { color: #ffffff; }
.news-card-comments { color: #65FF4B; font-weight: 700; margin-left: 4px; font-size: 13px; }
.news-card-meta {
    display: flex; gap: 12px; font-size: 12px;
    color: #7c7f9c; align-items: center; margin-top: auto; flex-wrap: wrap;
}
.news-card-meta i { margin-right: 3px; }
.news-card-date, .news-card-hit { color: #9093b0; }

/* 빈 상태 */
.news-empty {
    grid-column: 1/-1; text-align: center; padding: 60px 20px; color: #B2B6BF;
}
.news-empty i { font-size: 40px; display: block; margin-bottom: 14px; color: #3f4162; }

/* ==========================================================================
   뉴스 기사 뷰 (.news-article)
   ========================================================================== */
.news-article { margin-bottom: 32px; }

.news-article-header {
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    margin-bottom: 24px;
}
.news-article-cat {
    display: inline-block;
    background: rgba(101,255,75,.15); color: #65FF4B;
    border: 1px solid rgba(101,255,75,.3);
    font-size: 12px; font-weight: 700; padding: 4px 12px;
    border-radius: 100px; margin-bottom: 14px; letter-spacing: .5px;
}
.news-article-title {
    font-size: 26px; font-weight: 800; color: #fff;
    line-height: 1.45; margin: 0 0 16px; letter-spacing: -0.3px;
}
.news-article-meta {
    display: flex; gap: 16px; flex-wrap: wrap;
    font-size: 13px; color: #8285a0; align-items: center;
}
.news-article-meta i { margin-right: 4px; }
.news-article-meta span { display: flex; align-items: center; }

/* 히어로 이미지 */
.news-article-hero {
    margin: 0 0 24px; border-radius: 12px; overflow: hidden; line-height: 0;
}
.news-article-hero img { width: 100%; max-height: 420px; object-fit: cover; display: block; }

/* 본문 */
.news-article-content {
    font-size: 15.5px; line-height: 1.85;
    color: #c8cad8; margin-bottom: 28px;
}
.news-article-content img {
    max-width: 100%; height: auto; border-radius: 10px;
    margin: 16px auto; display: block;
}
.news-article-content p { margin: 0 0 14px; }
.news-article-content a { color: #65FF4B; text-decoration: underline; }
.news-article-content a:hover { color: #FFFB1F; }
.news-article-content figure { margin: 16px 0; }
.news-article-content figcaption { font-size: 12px; color: #7c7f9c; text-align: center; margin-top: 6px; }

/* 태그 */
.news-article-tags {
    font-size: 13px; color: #9093b0; margin: 16px 0;
    padding: 12px 16px; background: rgba(255,255,255,.04); border-radius: 10px;
}
.news-article-tags i { color: #65FF4B; margin-right: 6px; }

/* 댓글 섹션 */
.news-comment-section { margin-top: 24px; }

/* 이전/다음 글 */
.news-prev-next {
    margin-top: 20px; border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px; overflow: hidden;
}
.news-nav-item {
    display: flex; align-items: center; gap: 14px;
    padding: 14px 20px; text-decoration: none;
    transition: background .2s; color: #d8d8e0;
}
.news-nav-item + .news-nav-item { border-top: 1px solid rgba(255,255,255,.06); }
.news-nav-item:hover { background: rgba(255,255,255,.04); color: #fff; }
.news-nav-label {
    font-size: 12px; color: #65FF4B; font-weight: 700;
    white-space: nowrap; min-width: 54px;
    display: flex; align-items: center; gap: 5px;
}
.news-nav-subject {
    font-size: 14px; color: #B2B6BF; flex: 1;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.news-nav-item:hover .news-nav-subject { color: #e8e8f0; }

/* ==========================================================================
   반응형
   ========================================================================== */
@media (max-width: 1024px) {
    .news-card-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
}
@media (max-width: 640px) {
    .news-board-title { font-size: 20px; }
    .news-card-grid { grid-template-columns: 1fr; gap: 14px; }
    .news-card-title { font-size: 13.5px; -webkit-line-clamp: 2; }
    .news-article-title { font-size: 20px; }
    .news-article-content { font-size: 14.5px; }
    .news-article-meta { gap: 10px; font-size: 12px; }
    .news-prev-next { display: none; }
}