@charset "utf-8";
/* ══════════════════════════════════════════════════════════════
   PLAYWEBON BOARD · 목록형(default) — 미니멀 라인
   표 구조는 유지(정렬·공지·관리자 체크박스 보존), 시각만 리스트화
   ────────────────────────────────────────────────────────────── */
.board_list{
    --ml-ink:#17191d;
    --ml-ink-2:#5b626b;
    --ml-ink-3:#a2a8b0;
    --ml-ink-4:#c9ced5;
    --ml-line:#ececef;
    --ml-accent:#7e9b40;
    overflow-x:auto;
}

/* ── 테이블 초기화 ── */
.board_list table{
    width:100%;
    border:0;
    border-top:0;
    border-bottom:0;
    border-collapse:collapse;
    color:var(--ml-ink-2);
}

/* ── 헤더 ── */
.board_list thead th{
    padding:0 0 16px;
    border:0;
    border-bottom:1px solid var(--ml-line);
    background:transparent;
    font-size:13px;
    font-weight:600;
    color:var(--ml-ink-3);
    vertical-align:middle;
    white-space:nowrap;
}
.board_list thead th span{
    display:block;
    padding:0 12px;
    height:auto;
    font-weight:600;
}
.board_list thead th a{ color:var(--ml-ink-3); }
.board_list thead th a:hover{ color:var(--ml-ink); text-decoration:none; }

/* ── 행 ── */
.board_list td{
    padding:24px 12px;
    border:0;
    border-bottom:1px solid var(--ml-line);
    font-size:14px;
    color:var(--ml-ink-3);
    vertical-align:middle;
    white-space:nowrap;
    transition:.2s;
}
.board_list tbody tr:last-child td{ border-bottom:1px solid var(--ml-line); }

.board_list a{ color:inherit; text-decoration:none; }
.board_list a:hover,
.board_list a:active,
.board_list a:focus{ text-decoration:none; }

/* ── 번호 ── */
.board_list td.no{
    text-align:center;
    font-size:14px;
    color:var(--ml-ink-4);
    font-variant-numeric:tabular-nums;
}

/* ── 제목 ── */
.board_list td.title{
    white-space:normal;
    line-height:1.5;
    width:100%;
    min-width:340px;
}
.board_list td.title > a{
    font-size:19px;
    font-weight:600;
    color:var(--ml-ink);
    letter-spacing:-.02em;
    transition:.2s;
}
.board_list tbody tr:hover td.title > a{ color:var(--ml-accent); }

/* 제목 옆 화살표 (호버 시 등장) */
.board_list td.title > a:first-of-type::after{
    content:'';
    display:inline-block;
    width:6px;height:6px;
    border-top:1.5px solid currentColor;
    border-left:1.5px solid currentColor;
    transform:rotate(135deg);
    margin:0 0 2px 9px;
    opacity:0;
    vertical-align:middle;
    transition:.22s;
}
.board_list tbody tr:hover td.title > a:first-of-type::after{ opacity:1; margin-left:14px; }

/* ── 작성자 · 날짜 · 조회 · 추천 ── */
.board_list td.author{ font-size:14px; color:var(--ml-ink-2); }
.board_list td.author a{ color:var(--ml-ink-2); }
.board_list td.time,
.board_list td.readNum,
.board_list td.voteNum,
.board_list td.lastReply,
.board_list td.lastReply a{
    text-align:center;
    font-size:14px;
    color:var(--ml-ink-3);
    font-variant-numeric:tabular-nums;
}
.board_list td.lastReply sub{ color:var(--ml-ink-4); }

/* ── 댓글 / 트랙백 수 ── */
.board_list a.replyNum,
.board_list a.trackbackNum{
    margin-left:7px;
    font-size:13px;
    font-weight:700;
    color:var(--ml-accent);
    letter-spacing:0;
}

/* ── 아이콘 배지 ── */
.board_list span.notice_icon{
    display:inline-block;
    margin-right:8px;
    padding:4px 11px;
    border-radius:999px;
    background:#eef3ff;
    color:#2f6bff;
    font-size:12px;
    font-weight:700;
    letter-spacing:0;
    vertical-align:middle;
}
.board_list span.new_icon,
.board_list span.update_icon{
    display:inline-block;
    margin-left:7px;
    padding:3px 8px;
    border-radius:5px;
    font-size:11px;
    font-weight:700;
    letter-spacing:.02em;
    vertical-align:middle;
}
.board_list span.new_icon{ background:#ffefef; color:#e0393f; }
.board_list span.update_icon{ background:#fff4e6; color:#c97a12; }
.board_list i.secret_document{ margin-left:6px; color:var(--ml-ink-3); font-size:14px; }

/* ── 공지 행 ── */
.board_list tr.notice{ background:transparent; }
.board_list tr.notice td{ border-bottom:1px solid var(--ml-line); }
.board_list tr.notice td.title a{ font-weight:700; }
.board_list td.notice{ text-align:center; font-size:13px; color:var(--ml-ink-3); }

/* ── 게시물 없음 ── */
.board_list tr.no_article{ height:180px; }
.board_list tr.no_article td{
    vertical-align:middle;
    font-size:15px;
    color:var(--ml-ink-3);
    border-bottom:1px solid var(--ml-line);
}

/* ── 관리자 체크박스 ── */
.board_list td.check{ text-align:center; }

/* ── 반응형 ── */
@media ( max-width: 1024px ){
    .board_list td{ padding:22px 8px; }
    .board_list td.title{ min-width:260px; }
    .board_list td.title > a{ font-size:18px; }
}
@media ( max-width: 768px ){
    /* ── 모바일 : 표 → 카드형 리스트 ── */
    .board_list{ overflow:visible; }
    .board_list table{ display:block; width:100%; }
    .board_list thead{ display:none; }
    .board_list tbody{ display:block; width:100%; }

    .board_list tbody tr{
        display:flex;
        flex-wrap:wrap;
        align-items:center;
        gap:0;
        padding:16px 2px 15px;
        border-bottom:1px solid var(--ml-line);
    }
    .board_list tbody tr td{
        display:inline-block;
        width:auto;
        padding:0;
        border:0;
        font-size:12.5px;
        color:var(--ml-ink-3);
        white-space:nowrap;
        text-align:left;
    }
    .board_list tbody tr:last-child td{ border-bottom:0; }

    /* 번호 숨김 (공지 표시는 유지) */
    .board_list tbody td.no:not(.notice){ display:none; }
    .board_list tbody td.check{ margin-left:auto; }

    /* 공지 배지 */
    .board_list tbody td.notice{
        order:-1;
        flex-basis:100%;
        margin:0 0 7px;
        text-align:left;
    }
    .board_list tbody tr.notice td.notice{
        display:inline-block;
        padding:4px 10px;
        border-radius:999px;
        background:#eef3ff;
        color:#2f6bff;
        font-size:11.5px;
        font-weight:700;
        line-height:1.4;
    }

    /* 제목 : 한 줄 전체 차지 */
    .board_list tbody td.title{
        flex-basis:100%;
        width:100%;
        min-width:0;
        margin:0 0 9px;
        white-space:normal;
        line-height:1.45;
        word-break:keep-all;
    }
    .board_list tbody td.title > a{
        font-size:15.5px;
        font-weight:600;
        letter-spacing:-.03em;
    }
    .board_list td.title > a:first-of-type::after{ display:none; }
    .board_list span.notice_icon{ margin-right:6px; padding:3px 9px; font-size:11px; }
    .board_list span.new_icon,
    .board_list span.update_icon{ margin-left:5px; padding:2px 6px; font-size:10px; }
    .board_list a.replyNum,
    .board_list a.trackbackNum{ margin-left:5px; font-size:12px; }

    /* 메타 줄 : 작성자 · 날짜 · 조회 · 추천 */
    .board_list tbody td.author,
    .board_list tbody td.time,
    .board_list tbody td.readNum,
    .board_list tbody td.voteNum,
    .board_list tbody td.lastReply,
    .board_list tbody td.module_title{
        font-size:12.5px;
        color:var(--ml-ink-3);
    }
    .board_list tbody td.author,
    .board_list tbody td.author a{ color:var(--ml-ink-2); font-weight:500; }
    .board_list tbody td.author:after,
    .board_list tbody td.time:after,
    .board_list tbody td.readNum:after,
    .board_list tbody td.voteNum:after,
    .board_list tbody td.lastReply:after,
    .board_list tbody td.module_title:after{
        content:'';
        display:inline-block;
        width:2px; height:2px;
        margin:0 8px 3px;
        border-radius:50%;
        background:var(--ml-ink-4);
        vertical-align:middle;
    }
    .board_list tbody tr td:last-child:after,
    .board_list tbody td.check:after{ display:none; }
    .board_list tbody td.readNum:before{
        content:'\2609';
        margin-right:4px;
        color:var(--ml-ink-4);
    }

    /* 확장변수 셀 */
    .board_list tbody tr td:not([class]){
        font-size:12.5px;
        color:var(--ml-ink-3);
        overflow:hidden;
        text-overflow:ellipsis;
        max-width:100%;
    }

    /* 게시물 없음 */
    .board_list tr.no_article{ display:block; height:auto; padding:60px 0; }
    .board_list tr.no_article td{ display:block; width:100%; font-size:14px; text-align:center; }
    .board_list tr.no_article td p{ text-align:center !important; }
}
@media ( max-width: 420px ){
    .board_list tbody tr{ padding:14px 2px 13px; }
    .board_list tbody td.title{ margin-bottom:8px; }
    .board_list tbody td.title > a{ font-size:14.5px; }
    .board_list tbody tr td{ font-size:11.5px; }
    .board_list tbody td.author:after,
    .board_list tbody td.time:after,
    .board_list tbody td.readNum:after,
    .board_list tbody td.voteNum:after,
    .board_list tbody td.lastReply:after,
    .board_list tbody td.module_title:after{ margin:0 6px 3px; }
}