@charset "utf-8";
/* ==========================================================================
    board.css — 게시판 (목록/갤러리/FAQ/상세/댓글/검색/페이징)
    boardId>0 인 페이지 + search/myboard 등에서 로드
    브레이크포인트: 1280 / 1024 / 768 / 560 (common.css 표준)
   ========================================================================== */

/* ==========================================================================
    목록 상단 — Total + 검색폼 + 카테고리 탭 (_board_search.php)
   ========================================================================== */
.bo_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.bo_top .total {
    font-size: .9375rem;
    color: var(--ink-3);
}

.bo_top .total>span {
    color: var(--point, #4F46E5);
    font-weight: 600;
}

/* 태그 필터 칩 */
.bo_top .tag_chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 10px;
    padding: 3px 12px;
    border: 1px solid var(--point-border);
    border-radius: 100px;
    background: var(--point-faint);
    color: var(--point, #4F46E5);
    font-size: .875rem;
}

.bo_top .tag_chip a {
    color: var(--ink-4);
    transition: color .15s;
}

.bo_top .tag_chip a:hover {
    color: var(--danger);
}

/* 검색폼은 flex 아이템 — min-width:auto 기본값을 풀어야 좁은 화면에서 축소된다 */
.bo_top form {
    min-width: 0;
}

.bo_top .search {
    display: flex;
    gap: 6px;
    min-width: 0;
}

.bo_top .search select.bo_field {
    width: 110px;
    flex: none;
}

.bo_top .search input[type="text"] {
    width: min(260px, 100%);
}

.bo_top .search input[type="submit"] {
    flex: none;
    width: auto;
    padding: 0 20px;
    height: var(--input-height);
    font-weight: 500;
    color: #fff;
    background: var(--ink);
    border-radius: var(--radius-sm);
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    transition: background .2s;
}

.bo_top .search input[type="submit"]:hover {
    background: var(--point, #4F46E5);
}

.bo_top .blind {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}

/* 카테고리 탭 */
.bo_cate_tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 20px;
}

.bo_cate_tabs li a {
    display: block;
    padding: 8px 18px;
    font-size: .9375rem;
    color: var(--ink-3);
    background: var(--bg-soft);
    border-radius: 100px;
    transition: background .15s, color .15s;
}

.bo_cate_tabs li a:hover {
    color: var(--ink);
}

.bo_cate_tabs li a.on {
    color: #fff;
    font-weight: 600;
    background: var(--point, #4F46E5);
}

/* 최근 본 글 (board.js 가 채움) */
#recent_viewed {
    margin: 0 0 14px;
    font-size: .875rem;
    color: var(--ink-3);
}

#recent_viewed a {
    color: var(--ink-2);
}

#recent_viewed a:hover {
    color: var(--point, #4F46E5);
}

@media (width <=768px) {
    .bo_top {
        flex-direction: column;
        align-items: stretch;
    }

    .bo_top form {
        width: 100%;
    }

    .bo_top .search {
        flex-wrap: wrap;
    }

    .bo_top .search input[type="text"] {
        flex: 1;
        width: auto;
        min-width: 0;
    }
}

@media (width <=560px) {

    /* 좁은 화면 — 검색 조건 선택은 한 줄 전체 사용 */
    .bo_top .search select.bo_field {
        flex: 1 0 100%;
        width: auto;
    }
}

/* ==========================================================================
    기본 목록 (테이블 → 768 이하 카드 변환)
   ========================================================================== */
.bo_basic_list table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    border-top: 2px solid var(--ink);
}

.bo_basic_list thead th {
    padding: 13px 8px;
    font-size: .9375rem;
    font-weight: 600;
    color: var(--ink);
    border-bottom: 1px solid var(--line);
    background: var(--bg-soft);
}

.bo_basic_list thead th.a {
    width: 70px;
}

.bo_basic_list thead th.w {
    width: 110px;
}

.bo_basic_list thead th.c {
    width: 110px;
}

.bo_basic_list thead th.d {
    width: 80px;
}

.bo_basic_list tbody td {
    padding: 14px 8px;
    text-align: center;
    font-size: .9375rem;
    color: var(--ink-2);
    border-bottom: 1px solid var(--line-soft);
    vertical-align: middle;
}

.bo_basic_list tbody tr {
    transition: background .15s;
}

.bo_basic_list tbody tr:hover {
    background: var(--bg-soft);
}

.bo_basic_list .tda {
    color: var(--ink-4);
}

/* 공지 표시 — 번호 자리 */
.bo_basic_list .tda .notice::before {
    content: '공지';
    display: inline-block;
    padding: 2px 10px;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--point, #4F46E5);
    background: var(--point-soft);
    border-radius: 100px;
}

html:lang(en) .bo_basic_list .tda .notice::before {
    content: 'Notice';
}

.bo_basic_list .tdb {
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bo_basic_list .tdb a {
    color: var(--ink);
    transition: color .15s;
}

.bo_basic_list .tdb a:hover {
    color: var(--point, #4F46E5);
}

/* 목록 내 날짜(모바일 카드용) — PC에서는 숨김 */
.bo_basic_list .tdb a .date {
    display: none;
}

/* 답글 들여쓰기: style="--indent:n" 데이터 구동 */
.bo_basic_list .reply-mark {
    display: inline-block;
    margin-left: calc(var(--indent, 0) * 12px);
    margin-right: 6px;
    padding: 1px 8px;
    font-size: .75rem;
    color: var(--ink-3);
    border: 1px solid var(--line);
    border-radius: 100px;
    vertical-align: middle;
}

.bo_basic_list .tdb .lock img,
.bo_basic_list .tdb .file img {
    vertical-align: -2px;
    margin: 0 3px;
}

.bo_basic_list .tdb .new {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    margin-left: 5px;
    border-radius: 50%;
    background: #7bb52b;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    vertical-align: 2px;
}

/* Q&A 답변완료 표시 (마크업 텍스트 "1" 은 숨기고 라벨로 대체) */
.bo_basic_list .tdb .qna {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 8px;
    font-size: 0;
    color: var(--success);
    background: color-mix(in srgb, var(--success) 10%, #fff);
    border-radius: 100px;
    vertical-align: middle;
}

.bo_basic_list .tdb .qna::after {
    content: '답변완료';
    font-size: .75rem;
    font-weight: 600;
}

html:lang(en) .bo_basic_list .tdb .qna::after {
    content: 'Answered';
}

.bo_basic_list .tdc,
.bo_basic_list .tdd {
    color: var(--ink-4);
    font-size: .875rem;
}

.bo_basic_list .tde.no_reulst {
    padding: 60px 0;
    color: var(--ink-4);
}

/* 768 이하 — 카드 변환 (마크업 무수정: thead 숨김 + tr 그리드) */
@media (width <=768px) {
    .bo_basic_list thead {
        display: none;
    }

    .bo_basic_list table,
    .bo_basic_list tbody {
        display: block;
    }

    .bo_basic_list tbody tr {
        display: grid;
        grid-template-columns: auto 1fr auto;
        grid-template-areas:
            "num   title title"
            "meta  meta  meta";
        gap: 4px 8px;
        align-items: center;
        padding: 13px 4px;
        border-bottom: 1px solid var(--line-soft);
    }

    .bo_basic_list tbody td {
        display: block;
        padding: 0;
        border: 0;
        text-align: left;
    }

    .bo_basic_list .tda {
        grid-area: num;
    }

    /* 일반글 번호는 카드에서 숨김 (공지 칩만 유지) */
    .bo_basic_list .tda:not(:has(.notice)) {
        display: none;
    }

    .bo_basic_list .tdb {
        grid-area: title;
        white-space: normal;
    }

    .bo_basic_list .tdw {
        grid-area: meta;
        font-size: .8125rem;
        color: var(--ink-4);
    }

    /* 작성자 · 작성일 · 조회수 를 meta 줄에 인라인 배치 */
    .bo_basic_list .tdw,
    .bo_basic_list .tdc,
    .bo_basic_list .tdd {
        display: inline;
        grid-area: meta;
        font-size: .8125rem;
        color: var(--ink-4);
    }

    .bo_basic_list .tdc::before,
    .bo_basic_list .tdd::before {
        content: ' · ';
    }

    .bo_basic_list .tdd::after {
        content: '';
    }

    .bo_basic_list .tde.no_reulst {
        display: block;
        grid-column: 1 / -1;
        text-align: center;
    }
}

/* ==========================================================================
    갤러리 목록
   ========================================================================== */
.board_photo_wrap {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(16px, 2vw, 24px);
}

.board_photo_wrap li a {
    display: block;
}

.board_photo_wrap .image {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: var(--radius);
    background: var(--bg-soft);
}

.board_photo_wrap .image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}

.board_photo_wrap li a:hover .image img {
    transform: scale(1.05);
}

.board_photo_wrap .tit {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 12px;
}

.board_photo_wrap .tit .txt {
    min-width: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color .15s;
}

.board_photo_wrap li a:hover .tit .txt {
    color: var(--point, #4F46E5);
}

.board_photo_wrap .tit .new {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #7bb52b;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
}

.board_photo_wrap .contents {
    margin-top: 4px;
    font-size: .875rem;
    color: var(--ink-3);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.board_photo_wrap .date {
    display: block;
    margin-top: 6px;
    font-size: .8125rem;
    color: var(--ink-4);
}

.board_photo_wrap .no_result {
    grid-column: 1 / -1;
    padding: 60px 0;
    text-align: center;
    color: var(--ink-4);
    border-top: 2px solid var(--ink);
    border-bottom: 1px solid var(--line-soft);
}

@media (width <=1024px) {
    .board_photo_wrap {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (width <=768px) {
    .board_photo_wrap {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (width <=560px) {
    .board_photo_wrap {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ==========================================================================
    상세 보기
   ========================================================================== */
.bo_basic_view table {
    width: 100%;
    border-collapse: collapse;
    border-top: 2px solid var(--ink);
}

.bo_basic_view thead th {
    padding: 22px 8px;
    text-align: left;
    border-bottom: 1px solid var(--line);
}

.bo_basic_view thead th .tit {
    display: block;
    font-size: 1.375rem;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.4;
}

.bo_basic_view thead th .meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin-top: 10px;
    font-size: .875rem;
    font-weight: 400;
    color: var(--ink-4);
}

.bo_basic_view thead th .meta .writer {
    color: var(--ink-2);
    font-weight: 500;
}

.bo_basic_view tbody td.con {
    padding: clamp(24px, 3vw, 40px) 8px;
    border-bottom: 1px solid var(--line-soft);
}

.bo_basic_view .edit {
    line-height: 1.75;
    overflow-x: auto;
}

.bo_basic_view .edit img {
    max-width: 100%;
    height: auto;
}

/* 첨부파일 */
.bbs_file_t {
    margin-top: 28px;
    padding: 14px 16px;
    background: var(--bg-soft);
    border-radius: var(--radius-sm);
}

.bbs_file_t .acc {
    display: block;
    margin-bottom: 6px;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--ink-3);
}

.bbs_file_wrap span {
    display: block;
}

.bbs_file_wrap .bbs_file {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 0;
    font-size: .9375rem;
    color: var(--ink-2);
    transition: color .15s;
}

.bbs_file_wrap .bbs_file:hover {
    color: var(--point, #4F46E5);
    text-decoration: underline;
}

/* Q&A 답변 / 댓글형 피드 */
.comment-wrap {
    display: flex;
    gap: 12px;
    padding: 18px 8px;
    border-bottom: 1px solid var(--line-soft);
    background: var(--point-faint);
    border-radius: var(--radius-sm);
}

.comment-wrap .avatar {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--point, #4F46E5);
    color: #fff;
    font-weight: 600;
}

.comment-wrap .feed {
    min-width: 0;
}

.comment-wrap .feed .write {
    font-weight: 600;
    font-size: .9375rem;
    color: var(--ink);
}

.comment-wrap .feed .write .date {
    margin-left: 8px;
    font-weight: 400;
    font-size: .8125rem;
    color: var(--ink-4);
}

.comment-wrap .feed .comment {
    margin-top: 6px;
    color: var(--ink-2);
    line-height: 1.65;
}

/* 태그 */
.post_tags {
    margin: 16px 0 0;
}

.post_tags a {
    display: inline-block;
    margin: 0 6px 6px 0;
    padding: 3px 12px;
    border: 1px solid var(--line);
    border-radius: 100px;
    color: var(--point, #4F46E5);
    font-size: .875rem;
    transition: border-color .15s, background .15s;
}

.post_tags a:hover {
    border-color: var(--point-border);
    background: var(--point-faint);
}

/* 이전글/다음글 */
.bo_pn {
    margin-top: 20px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.bo_pn li {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 8px;
    min-width: 0;
}

.bo_pn li+li {
    border-top: 1px solid var(--line-soft);
}

.bo_pn .lb {
    flex: none;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--ink-3);
}

.bo_pn a {
    color: var(--ink-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color .15s;
}

.bo_pn a:hover {
    color: var(--point, #4F46E5);
}

/* 액션 버튼 (공유/추천/스크랩/신고 — _board_actions.php) */
.bo_footer .btn_wrap {
    display: flow-root;
    text-align: right;
}

.bo_footer .btn_wrap .btn_left {
    float: left;
    margin-bottom: 8px;
}

.bo_footer .btn_wrap .btn_left .btn {
    color: var(--ink-2);
    background: var(--bg);
    border: 1px solid var(--line);
}

.bo_footer .btn_wrap .btn_left .btn:hover {
    color: var(--point, #4F46E5);
    border-color: var(--point-border);
    background: var(--point-faint);
}

.bo_footer .btn_wrap .btn_left .btn.kakao {
    color: #3C1E1E;
    background: #FEE500;
    border-color: #FEE500;
}

.bo_footer .btn_wrap .btn_left #btn_like.on {
    color: var(--danger);
}

.bo_footer .btn_wrap .btn_left #btn_scrap.on {
    color: var(--point, #4F46E5);
}

/* 신고 모달 (_board_actions.php) */
#report_modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgb(0 0 0 / .45);
    z-index: 9999;
    align-items: center;
    justify-content: center;
}

#report_modal .report_modal_box {
    max-width: 420px;
    width: 92%;
    padding: 22px;
    background: var(--bg);
    border-radius: var(--radius);
    box-shadow: var(--shadow-2);
}

#report_modal .report_modal_box>strong {
    font-size: 1.05em;
}

#report_modal .report_reasons {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 14px 0 8px;
    font-size: .95em;
}

#report_modal #report_detail {
    width: 100%;
    height: 70px;
    resize: vertical;
}

#report_modal .report_modal_btns {
    text-align: right;
    margin-top: 12px;
}

/* ==========================================================================
    댓글
   ========================================================================== */
.comment_area .amount {
    padding-bottom: 12px;
    font-size: 1.0625rem;
    border-bottom: 2px solid var(--ink);
}

.comment_area .amount strong {
    color: var(--point, #4F46E5);
}

.comment_area .write_wrap {
    margin-top: 16px;
}

.comment_area .write {
    display: flex;
    gap: 8px;
    align-items: stretch;
}

.comment_area .write textarea {
    flex: 1;
    height: 76px;
}

.comment_area .write .submit {
    flex: none;
    width: 90px;
    color: #fff;
    font-weight: 500;
    text-align: center;
    background: var(--ink);
    border-radius: var(--radius-sm);
    white-space: nowrap;
    transition: background .2s;
}

.comment_area .write .submit:hover {
    background: var(--point, #4F46E5);
}

.comment_list {
    margin-top: 8px;
}

.comment_list .comment_item {
    padding: 16px 4px;
    border-bottom: 1px solid var(--line-soft);
}

/* 답글 들여쓰기 (ml-N: sc_depth) */
.comment_list .comment_item.ml-1 {
    margin-left: 28px;
}

.comment_list .comment_item.ml-2 {
    margin-left: 56px;
}

.comment_list .comment_item .info {
    display: flex;
    align-items: center;
    gap: 6px;
}

.comment_list .reply-arrow {
    width: 12px;
    height: 12px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 1v6a2 2 0 0 0 2 2h6M7 6l3 3-3 3' fill='none' stroke='%239ca3af' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;
}

/* 댓글 아바타 (사진/이니셜) */
.comment_list .cmt_avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    vertical-align: middle;
}

.comment_list .cmt_avatar_initial {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--point-soft);
    color: var(--point-strong);
    font-size: .8em;
    font-weight: 600;
}

.comment_list .info .name {
    font-size: .9375rem;
    color: var(--ink);
}

.comment_list .info .date {
    font-size: .8125rem;
    color: var(--ink-4);
}

.comment_list .content {
    margin-top: 8px;
    color: var(--ink-2);
    line-height: 1.65;
    word-break: break-word;
}

.comment_list .btn_area {
    display: flex;
    gap: 4px;
    margin-top: 8px;
}

/* 댓글 액션 버튼 — 소형 텍스트 버튼으로 재정의 */
.comment_list .btn_area .btn {
    min-width: 0;
    height: auto;
    margin: 0;
    padding: 3px 10px;
    font-size: .8125rem;
    color: var(--ink-3);
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 100px;
}

.comment_list .btn_area .btn:hover {
    color: var(--point, #4F46E5);
    background: var(--point-faint);
    border-color: var(--point-border);
}

.comment_list .btn_area .btn.delete:hover,
.comment_list .btn_area .btn.report:hover {
    color: var(--danger);
    border-color: color-mix(in srgb, var(--danger) 35%, #fff);
    background: color-mix(in srgb, var(--danger) 6%, #fff);
}

/* 댓글 전체 보기 */
.comment_more {
    text-align: center;
    margin-top: 14px;
}

/* ==========================================================================
    페이지네이션 (Board.php buildPaging)
   ========================================================================== */
.bo_pagenate {
    display: flex;
    justify-content: center;
    margin-top: 32px;
}

.bo_pagenate .paging {
    display: flex;
    align-items: center;
    gap: 4px;
}

.bo_pagenate .paging ol {
    display: flex;
    gap: 4px;
}

.bo_pagenate .paging a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 6px;
    font-size: .9375rem;
    color: var(--ink-3);
    border-radius: var(--radius-sm);
    transition: background .15s, color .15s;
}

.bo_pagenate .paging a:hover {
    background: var(--bg-soft);
    color: var(--ink);
}

.bo_pagenate .paging li.current a.on {
    color: #fff;
    font-weight: 600;
    background: #7bb52b;
}

.bo_pagenate .paging a.first,
.bo_pagenate .paging a.prev,
.bo_pagenate .paging a.next,
.bo_pagenate .paging a.end {
    font-size: .9375rem;
    color: #000;
}

.bo_pagenate .paging a.lock {
    pointer-events: none;
}

/* ==========================================================================
    비밀번호 확인 레이어 팝업
   ========================================================================== */
.pw_layer_popup {
    display: none;
}

.pw_layer_popup .dimBg {
    position: fixed;
    inset: 0;
    background: rgb(0 0 0 / .45);
    z-index: 998;
}

.pw_layer_popup .pwd_popup_wrap {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(360px, 90vw);
    padding: 28px 24px;
    background: var(--bg);
    border-radius: var(--radius);
    box-shadow: var(--shadow-2);
    z-index: 999;
}

.pw_layer_popup .pwd_popup_wrap h4 {
    margin-bottom: 14px;
    font-size: 1.125rem;
    font-weight: 700;
}

.pw_layer_popup .btn_wrap {
    margin-top: 16px;
    text-align: right;
}

.pw_layer_popup .btn_submit,
.pw_layer_popup .btn_cancel {
    display: inline-block;
    margin-left: 6px;
    padding: 9px 20px;
    font-size: .9375rem;
    font-weight: 500;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background .2s;
}

.pw_layer_popup .btn_submit {
    color: #fff;
    background: var(--point, #4F46E5);
}

.pw_layer_popup .btn_submit:hover {
    background: var(--point-strong);
}

.pw_layer_popup .btn_cancel {
    color: var(--ink-2);
    background: var(--bg-soft);
}

.pw_layer_popup .btn_cancel:hover {
    background: var(--line-soft);
}

/* ==========================================================================
    임시저장 박스 (_board_drafts.php)
   ========================================================================== */
.draft_box {
    margin: 0 0 16px;
    padding: 12px 16px;
    border: 1px dashed var(--point-border);
    border-radius: var(--radius-sm);
    background: var(--bg-soft);
}

.draft_box>strong {
    color: var(--point, #4F46E5);
}

.draft_box ul {
    margin-top: 8px;
}

.draft_box li {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 3px 0;
    font-size: .95em;
}

.draft_box li a {
    color: var(--ink-2);
    text-decoration: underline;
}

.draft_box li .draft_date {
    color: var(--ink-4);
    font-size: .85em;
}

.draft_box li .btn_draft_del {
    color: var(--danger);
    font-size: .85em;
}

/* ==========================================================================
    글쓰기 — 카테고리 선택 영역
   ========================================================================== */
.cate_section,
.cate1_section,
.cate2_section {
    margin: 4px 0;
}

/* ==========================================================================
    통합검색 (sub/search.php)
   ========================================================================== */
.search_empty {
    padding: 5rem 0;
    text-align: center;
    color: var(--ink-4);
}

.search_group {
    margin-bottom: 40px;
}

.search_group h3 {
    padding-bottom: 10px;
    border-bottom: 2px solid var(--ink);
    font-size: 1.125rem;
    font-weight: 700;
}

.search_group h3 small {
    color: var(--ink-4);
    font-weight: 400;
}

.search_group li {
    border-bottom: 1px solid var(--line-soft);
}

.search_group li a {
    display: block;
    padding: 16px 4px;
    transition: background .15s;
}

.search_group li a:hover {
    background: var(--bg-soft);
}

.search_group li a strong {
    font-size: 1.05em;
    color: var(--ink);
}

.search_group li a p {
    margin: 6px 0 4px;
    color: var(--ink-3);
    line-height: 1.5;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.search_group li a .meta {
    color: var(--ink-4);
    font-size: .875em;
}

.search_group mark {
    background: var(--point-soft);
    color: inherit;
    padding: 0 1px;
}

.search_more {
    text-align: right;
    margin: 10px 0 0;
}

.search_more a {
    color: var(--point, #4F46E5);
}

.search_more a:hover {
    text-decoration: underline;
}