@charset "UTF-8";

/* 공지사항 전용. 셸과 공통 부품(info-head, info-button, info-detail-*)은 recruitment-info-renewal.css 를 그대로 쓴다. */

/* 분류 탭과 검색 */
.notice-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:30px; padding-bottom:14px; border-bottom:2px solid #222b3c; }
.notice-tabs { display:flex; flex-wrap:wrap; align-items:center; gap:4px; }
.notice-tabs a { display:inline-flex; align-items:center; height:40px; padding:0 14px; border-radius:8px; color:#5c6678; font-size:15px; font-weight:600; white-space:nowrap; }
.notice-tabs a:hover { color:var(--info-ink); background:var(--info-soft); }
.notice-tabs a.is-active { background:#eef3fd; color:var(--info-blue); font-weight:700; }
.notice-search { width:260px; }

/* 목록 표 */
.notice-table-wrap { margin-top:0; }
.notice-table { width:100%; border-collapse:collapse; table-layout:fixed; }
.notice-col-no { width:84px; }
.notice-col-category { width:132px; }
.notice-col-date { width:120px; }
.notice-col-views { width:80px; }
.notice-table thead th { height:48px; padding:0 12px; border-bottom:1px solid #d7dde6; color:#5c6678; font-size:13px; font-weight:600; text-align:center; }
.notice-table tbody td { height:60px; padding:10px 12px; border-bottom:1px solid var(--info-line); color:#5c6678; font-size:14px; text-align:center; vertical-align:middle; }
.notice-table tbody tr:hover { background:#fafbfd; }
.notice-table tbody tr.is-pinned { background:#f7f9fe; }
.notice-table .notice-title { text-align:left; }
.notice-table .notice-title a { color:var(--info-ink); font-size:16px; font-weight:500; line-height:1.5; word-break:keep-all; }
.notice-table .notice-title a:hover { color:var(--info-blue); text-decoration:underline; text-underline-offset:3px; }
.notice-table tr.is-pinned .notice-title a { font-weight:700; }
.notice-table .notice-date, .notice-table .notice-views, .notice-table .notice-no { font-variant-numeric:tabular-nums; }

.notice-pin { display:inline-flex; align-items:center; gap:3px; height:24px; padding:0 8px; border-radius:5px; background:var(--info-blue); color:#fff; font-size:12px; font-weight:700; }
.notice-pin i { font-size:13px; }

.notice-badge { display:inline-flex; align-items:center; height:26px; padding:0 10px; border-radius:6px; background:#eef1f6; color:#4a5568; font-size:12px; font-weight:700; white-space:nowrap; }
.notice-badge.is-update { background:#eaf2ff; color:#2058c7; }
.notice-badge.is-event { background:#fff1e6; color:#c25a12; }
.notice-badge.is-promotion { background:#f3ecff; color:#6b3fc9; }
.notice-badge.is-company { background:#e8f6ef; color:#1c7a4c; }

.notice-state { display:inline-flex; align-items:center; height:22px; margin-left:8px; padding:0 7px; border-radius:5px; font-size:11px; font-weight:700; vertical-align:2px; }
.notice-state.is-ongoing { background:#e8f6ef; color:#1c7a4c; }
.notice-state.is-upcoming { background:#eaf2ff; color:#2058c7; }
.notice-state.is-ended { background:#f0f1f4; color:#8b94a4; }
.notice-new { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; margin-left:6px; border-radius:50%; background:#ef5b4c; color:#fff; font-size:10px; font-weight:700; vertical-align:2px; }

/* 페이지 */
.notice-pagination { display:flex; align-items:center; justify-content:center; gap:6px; margin-top:40px; }
.notice-pagination a { display:inline-flex; align-items:center; justify-content:center; min-width:44px; height:44px; padding:0 6px; border-radius:8px; color:#5c6678; font-size:15px; font-weight:600; font-variant-numeric:tabular-nums; }
.notice-pagination a:hover { background:var(--info-soft); color:var(--info-ink); }
.notice-pagination a.is-active { background:var(--info-ink); color:#fff; }

/* 상세 */
.notice-detail-labels { display:flex; align-items:center; gap:0; margin-bottom:14px; }
.notice-detail-labels .notice-state { vertical-align:0; }
.notice-period { display:flex; align-items:center; gap:6px; margin:14px 0 0; padding:12px 16px; border-radius:10px; background:var(--info-soft); color:#4a5568; font-size:14px; }
.notice-period i { color:var(--info-blue); font-size:17px; }
.notice-period strong { color:var(--info-ink); font-weight:700; font-variant-numeric:tabular-nums; }
.info-detail-file { display:flex; align-items:center; gap:8px; min-height:44px; padding:0 4px; color:#3d4759; font-size:14px; font-weight:600; }
.info-detail-file:hover { color:var(--info-blue); }

.notice-sibling { margin-top:36px; border-top:1px solid #d7dde6; }
.notice-sibling-row { display:grid; grid-template-columns:110px minmax(0,1fr); align-items:center; min-height:56px; border-bottom:1px solid var(--info-line); }
.notice-sibling-row span { display:flex; align-items:center; gap:6px; padding-left:8px; color:#7b8495; font-size:14px; font-weight:600; }
.notice-sibling-row a { overflow:hidden; color:var(--info-ink); font-size:15px; text-overflow:ellipsis; white-space:nowrap; }
.notice-sibling-row a:hover { color:var(--info-blue); text-decoration:underline; text-underline-offset:3px; }
.notice-sibling-row em { color:#a4adbb; font-size:14px; font-style:normal; }

/* 작성 */
.notice-select { width:100%; height:48px; padding:0 14px; border:1px solid #d3d9e3; border-radius:8px; background:#fff; color:var(--info-ink); font-family:inherit; font-size:15px; }
.notice-form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.notice-form-help { display:block; margin-top:-8px; color:var(--info-muted); font-size:13px; line-height:1.5; }
.notice-check { display:inline-flex; align-items:center; gap:8px; min-height:44px; color:#3d4759; font-size:15px; font-weight:600; cursor:pointer; }
.notice-check input { width:18px; height:18px; accent-color:var(--info-blue); }
.notice-file-list { margin:0; padding:0; list-style:none; border-top:1px solid var(--info-line); }
.notice-file-list li { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:48px; border-bottom:1px solid var(--info-line); color:#3d4759; font-size:14px; }
.notice-file-list li.is-empty { justify-content:center; color:var(--info-muted); }
.notice-file-list button { width:44px; height:44px; border:0; background:transparent; color:#8b94a4; font-size:18px; cursor:pointer; }
.notice-file-list button:hover { color:#c0463e; }

/* 공지 본문의 행동 버튼. 에디터는 클래스를 지우므로 링크 주소로 모양을 정한다.
   회원가입, 기업서비스, 카카오톡 문의로 가는 링크만 버튼으로 보이고 나머지 링크는 밑줄 글자 그대로 둔다. */
.notice-page .info-detail-content .toastui-editor-contents a[href^="/Register/"],
.notice-page .info-detail-content .toastui-editor-contents a[href^="/Service"],
.notice-page .info-detail-content .toastui-editor-contents a[href^="https://open.kakao.com/"] { display:inline-flex; align-items:center; justify-content:center; min-width:220px; height:52px; margin:4px 0; padding:0 26px; border-radius:10px; background:var(--info-blue, #2f6feb); color:#fff; font-size:16px; font-weight:700; text-decoration:none; }
.notice-page .info-detail-content .toastui-editor-contents a[href^="/Register/"]:hover,
.notice-page .info-detail-content .toastui-editor-contents a[href^="/Service"]:hover { background:#2058c7; color:#fff; }
.notice-page .info-detail-content .toastui-editor-contents a[href^="/Service"] { border:1px solid #cfd6e1; background:#fff; color:var(--info-ink, #111827); }
.notice-page .info-detail-content .toastui-editor-contents a[href^="/Service"]:hover { border-color:var(--info-blue, #2f6feb); background:#fff; color:var(--info-blue, #2f6feb); }
.notice-page .info-detail-content .toastui-editor-contents a[href^="https://open.kakao.com/"] { background:#fee500; color:#191919; }
.notice-page .info-detail-content .toastui-editor-contents a[href^="https://open.kakao.com/"]:hover { background:#f5dc00; color:#191919; }

@media (max-width:768px) {
    .notice-toolbar { flex-direction:column; align-items:stretch; }
    .notice-tabs { flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; }
    .notice-search { width:100%; }
    .notice-table thead { display:none; }
    .notice-table, .notice-table tbody, .notice-table tr, .notice-table td { display:block; width:100%; }
    .notice-table colgroup { display:none; }
    .notice-table tbody tr { position:relative; padding:14px 4px; border-bottom:1px solid var(--info-line); }
    .notice-table tbody td { height:auto; padding:0; border:0; text-align:left; }
    .notice-table .notice-no { display:none; }
    .notice-table tr.is-pinned .notice-no { display:block; margin-bottom:6px; }
    .notice-table .notice-category { margin-bottom:8px; }
    .notice-table .notice-title a { font-size:15px; }
    .notice-table .notice-date, .notice-table .notice-views { display:inline-block; width:auto; margin-top:8px; margin-right:12px; color:#8b94a4; font-size:13px; }
    .notice-table .notice-views::before { content:"조회 "; }
    .notice-sibling-row { grid-template-columns:84px minmax(0,1fr); }
    .notice-form-row { grid-template-columns:1fr; }
    .notice-page .info-detail-content .toastui-editor-contents a[href^="/Register/"],
    .notice-page .info-detail-content .toastui-editor-contents a[href^="/Service"],
    .notice-page .info-detail-content .toastui-editor-contents a[href^="https://open.kakao.com/"] { display:flex; width:100%; min-width:0; }
}