/*
 * 게시판 스킨 "basic01" 전용 스타일 (public/skins/board/basic01/style.css)
 * 레이아웃 basic 의 front.css 에 있던 게시판 목록 · 글보기 · 댓글 · 글쓰기 · 페이저 규칙을 이 스킨으로 옮겨 둔 것입니다.
 * 이 스킨을 쓰는 게시판 화면에 자동으로 붙으며, 이 스킨만 다르게 꾸미려면 아래 규칙을 고치면 됩니다.
 */

/* board list */
.kc-board-head { margin-bottom: 14px; }
.kc-cats { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.kc-cats a { padding: 5px 12px; border: 1px solid var(--kc-line); border-radius: 999px; font-size: 14px; color: var(--kc-muted); }
.kc-cats a.active, .kc-cats a:hover { border-color: var(--kc-primary); color: var(--kc-primary); text-decoration: none; }
.kc-list { width: 100%; border-top: 2px solid var(--kc-text); font-size: 14px; }
.kc-list th { font-weight: 600; text-align: center; padding: 10px 6px; border-bottom: 1px solid var(--kc-line); background: var(--kc-soft); white-space: nowrap; }
.kc-list td { padding: 11px 6px; border-bottom: 1px solid var(--kc-line); text-align: center; color: var(--kc-muted); white-space: nowrap; }
.kc-list td.kc-subject { text-align: left; color: var(--kc-text); white-space: normal; width: 100%; }
.kc-list tr.is-notice td { background: #f7f9ff; }
.kc-list tr.is-current td { background: #fffbe6; }
.kc-subject a { color: var(--kc-text); font-weight: 500; }
.kc-subject .kc-cat { color: var(--kc-primary); font-size: 13px; margin-right: 4px; }
.kc-reply-mark { color: var(--kc-muted); margin-right: 4px; }
.kc-badge { display: inline-block; font-size: 11px; font-weight: 700; border-radius: 4px; padding: 1px 5px; vertical-align: 1px; margin-left: 4px; }
.kc-badge-new { background: #e5484d; color: #fff; }
.kc-badge-hot { background: #ff8a00; color: #fff; }
.kc-badge-notice { background: var(--kc-primary); color: #fff; margin: 0; }
.kc-ico { color: var(--kc-muted); font-size: 13px; margin-left: 3px; }
.kc-list-mobile { list-style: none; padding: 0; margin: 0; border-top: 2px solid var(--kc-text); }
.kc-list-mobile li { padding: 12px 2px; border-bottom: 1px solid var(--kc-line); }
.kc-list-mobile .kc-meta { font-size: 12px; color: var(--kc-muted); margin-top: 4px; display: flex; flex-wrap: wrap; gap: 8px; }
.kc-gallery { display: grid; gap: 16px; }
.kc-gallery-item { display: block; color: var(--kc-text); }
.kc-gallery-item:hover { text-decoration: none; }
.kc-thumb { aspect-ratio: 4/3; background: var(--kc-soft); border-radius: 8px; overflow: hidden; display: flex; align-items: center; justify-content: center; color: #b0b6c0; font-size: 2rem; }
.kc-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s; }
.kc-gallery-item:hover .kc-thumb img { transform: scale(1.04); }
.kc-gallery-item .kc-gtitle { margin-top: 8px; font-weight: 600; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-gallery-item .kc-meta { font-size: 12px; color: var(--kc-muted); }
.kc-list-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; margin-top: 16px; position: relative; top: -10px; }
.kc-search-form { display: flex; gap: 6px; justify-content: center; margin-top: 18px; flex-wrap: wrap; }
.kc-search-form .form-select { width: auto; }
.kc-search-form .form-control { width: 220px; max-width: 100%; }
.kc-pager { margin-top: 18px; }
.page-link { color: var(--kc-text); }
.page-item.active .page-link { background: var(--kc-primary); border-color: var(--kc-primary); }

/* post view */
.kc-post-head { border-top: 2px solid var(--kc-text); border-bottom: 1px solid var(--kc-line); padding: 18px 4px 14px; }
.kc-post-title { font-size: 1.35rem; font-weight: 700; margin: 0 0 10px; letter-spacing: -.01em; }
.kc-post-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--kc-muted); align-items: center; }
.kc-post-meta .kc-name { color: var(--kc-text); font-weight: 600; }
.kc-post-files, .kc-post-links { border-bottom: 1px solid var(--kc-line); padding: 10px 4px; font-size: 14px; }
.kc-post-files ul, .kc-post-links ul { list-style: none; margin: 0; padding: 0; }
.kc-post-files li, .kc-post-links li { padding: 3px 0; }
.kc-post-body { padding: 28px 4px; min-height: 160px; line-height: 1.75; overflow-x: auto; }
.kc-post-body img { max-width: 100%; height: auto; }
.kc-post-body iframe, .kc-post-body video { max-width: 100%; }
.kc-post-body table { max-width: 100%; }
.kc-post-body pre { background: #0f172a; color: #e2e8f0; padding: 14px; border-radius: 8px; }
.kc-post-images img { display: block; max-width: 100%; height: auto; margin: 0 auto 14px; border-radius: 4px; }
.kc-post-tags { padding: 0 4px 14px; }
.kc-post-tags a { display: inline-block; font-size: 13px; padding: 3px 10px; margin: 0 4px 4px 0; background: var(--kc-soft); border-radius: 999px; color: var(--kc-muted); }
.kc-extra-fields { margin: 0 4px 16px; font-size: 14px; }
.kc-extra-fields th { width: 160px; background: var(--kc-soft); font-weight: 600; }
.kc-reactions { display: flex; justify-content: center; gap: 10px; padding: 8px 0 22px; }
.kc-react-btn { min-width: 96px; border-radius: 999px; }
.kc-react-btn.active { background: var(--kc-primary); color: #fff; border-color: var(--kc-primary); }
.kc-post-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; border-top: 1px solid var(--kc-line); border-bottom: 1px solid var(--kc-line); padding: 10px 0; }
.kc-post-actions .btn { --bs-btn-padding-y: .25rem; --bs-btn-padding-x: .6rem; --bs-btn-font-size: .85rem; }
.kc-prevnext { list-style: none; padding: 0; margin: 16px 0; border-top: 1px solid var(--kc-line); font-size: 14px; }
.kc-prevnext li { display: flex; gap: 12px; padding: 10px 4px; border-bottom: 1px solid var(--kc-line); }
.kc-prevnext li > span { color: var(--kc-muted); white-space: nowrap; width: 56px; }
.kc-prevnext li > a { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-blind { background: var(--kc-soft); border-radius: 8px; padding: 24px; text-align: center; color: var(--kc-muted); }

/* comments */
.kc-comments { margin-top: 28px; }
.kc-comments-title { font-size: 1.05rem; font-weight: 700; margin-bottom: 10px; }
.kc-comment { border-bottom: 1px solid var(--kc-line); padding: 14px 4px; display: flex; gap: 10px; }
.kc-comment.is-reply { padding-left: 36px; background: #fbfbfc; }
.kc-comment.is-best { background: #fff8e6; }
.kc-comment-photo { flex: 0 0 36px; }
.kc-comment-photo img, .kc-comment-photo .kc-avatar { width: 36px; height: 36px; }
.kc-comment-main { flex: 1; min-width: 0; }
.kc-comment-head { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; font-size: 13px; color: var(--kc-muted); margin-bottom: 4px; }
.kc-comment-head .kc-name { color: var(--kc-text); font-weight: 600; }
.kc-comment-body { font-size: 14px; line-height: 1.65; }
.kc-comment-tools { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 6px; font-size: 13px; }
.kc-comment-tools button, .kc-comment-tools a { background: none; border: 0; padding: 0; color: var(--kc-muted); font-size: 13px; }
.kc-comment-tools button.active { color: var(--kc-primary); font-weight: 600; }
.kc-comment-form { border: 1px solid var(--kc-line); border-radius: var(--kc-radius); padding: 12px; margin-top: 14px; background: #fff; }
.kc-comment-form textarea { resize: vertical; }


/* write form: attachment list + drag-and-drop zone */
.kc-hint-inline { font-size: .8125rem; color: var(--kc-muted); }
.file-list { display: flex; flex-direction: column; gap: .5rem; }
.file-list:empty { display: none; }
.file-item { display: flex; align-items: center; gap: .625rem; flex-wrap: wrap; padding: .5rem .75rem; border: 1px solid var(--kc-line); border-radius: 6px; background: #fff; }
.file-item.is-deleted { opacity: .45; text-decoration: line-through; }
.file-item .file-name { flex: 1 1 10rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .875rem; font-weight: 500; }
.file-item .file-size { flex: none; font-size: .75rem; color: var(--kc-muted); }
.file-item .file-remove { flex: none; display: inline-flex; align-items: center; gap: .25rem; padding: .25rem .5rem; border: 0; border-radius: .375rem; background: transparent; color: var(--kc-muted); font: inherit; font-size: .8125rem; cursor: pointer; }
.file-item .file-remove:hover { background: var(--kc-soft); color: #dc3545; }
.file-dropzone { margin-top: .5rem; }
.file-dropzone-inner { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; padding: 1.5rem 1rem; text-align: center; border: 1.5px dashed var(--kc-line); border-radius: 6px; cursor: pointer; transition: border-color .15s, background-color .15s; }
.file-dropzone-inner:hover, .file-dropzone-inner:focus-visible, .file-dropzone-inner.is-drag-over { border-color: var(--kc-primary); background: var(--kc-soft); outline: 0; }
.file-dropzone-inner.is-full { opacity: .5; cursor: not-allowed; }
.file-dropzone-inner svg { color: var(--kc-muted); }
.file-dropzone-text { font-size: .875rem; margin: 0; }
.file-dropzone-hint { font-size: .75rem; color: var(--kc-muted); margin: 0; }
.file-item .file-caption { flex: 1 1 12rem; min-width: 0; max-width: 18rem; }


/* 이름 클릭 메뉴 (사이드뷰) — ciboard #nameContextMenu 와 같은 검은 상자 */
.kc-sv-menu { background: #000; color: #fff; padding: 4px 8px 6px; min-width: 0; width: max-content; border: 0; border-radius: 0; z-index: 10000; font-size: 12px; --bs-dropdown-min-width: 0; }
.kc-sv-menu { margin-left: 14px; }
.kc-sv-menu li { list-style: none; }
.kc-sv-menu .kc-sv-id { color: #fff; font-size: 12px; line-height: 20px; white-space: nowrap; }
.kc-sv-menu a { color: #fff; font-size: 12px; line-height: 20px; display: block; white-space: nowrap; text-decoration: none; background: transparent; padding: 0; }
.kc-sv-menu a:hover, .kc-sv-menu a:focus { color: #ff0000; background: transparent; }


/* board list: clien.net 'content_list' CSS (clien-main.css 의 규칙을 그대로 가져와 .kc-clien-list 안에서만 적용) */
.kc-board-head .kc-page-title { font-size: 1.75rem; font-weight: 500; letter-spacing: -.5px; margin: 0; }
.kc-board-head { margin-bottom: 6px; padding: .5em 0; align-items: center; }
.kc-clien-list { position: relative; width: 100%; font-size: 12px; line-height: 1; color: #111; font-weight: 400; }
.kc-clien-list .list_manage { padding: 0 0 .5em; font-size: 12px; color: #666; }
.kc-clien-list .list_content { position: relative; display: block; width: 100%; background-color: #F1F1F1; border-top: 1px solid #E2E2E2; }
.kc-clien-list .list_item { position: relative; display: flex; align-items: center; width: 100%; height: 3.083em; border-bottom: 1px solid #E2E2E2; border-left: 1px solid #E2E2E2; border-right: 1px solid #E2E2E2; background-color: #FFF; }
.kc-clien-list .list_item.notice { background-color: #FAFAFA; }
.kc-clien-list .list_item.notice .list_title { font-weight: 500; }
.kc-clien-list .list_item.is-current { background-color: #FFFBE6; }
.kc-clien-list .list_item .list_chk { display: flex; align-items: center; width: 2.5em; justify-content: center; border-left: 0px solid #E2E2E2; }
.kc-clien-list .list_item .list_symph, .kc-clien-list .list_item .list_title, .kc-clien-list .list_item .list_author, .kc-clien-list .list_item .list_hit, .kc-clien-list .list_item .list_time { display: flex; align-items: center; }
.kc-clien-list .list_item .list_symph, .kc-clien-list .list_item .list_symph_not { justify-content: center; height: 3em; color: transparent; border-left: 2px solid #E2E2E2; }
.kc-clien-list .list_item .list_symph { min-width: 3.333em; }
.kc-clien-list .list_item .list_symph > span, .kc-clien-list .list_item .list_symph_not > span { display: flex; align-items: center; justify-content: center; height: 1.273em; line-height: 1; font-size: 0.917em; padding: 0.091em 0.455em 0; border-radius: 0.33em; }
.kc-clien-list .list_item.notice .list_symph { color: #6875AD; border-left-color: #E6EFF6; }
.kc-clien-list .view_symph.lSymph01 { border-left-color: #F1F1F1; }
.kc-clien-list .view_symph.lSymph01 span { background-color: #FAFAFA; color: #CCC; }
.kc-clien-list .view_symph.lSymph02 { border-left-color: #E6EFF6; }
.kc-clien-list .view_symph.lSymph02 span { background-color: #E6EFF6; color: #000; }
.kc-clien-list .view_symph.lSymph03 { border-left-color: #CCDFED; }
.kc-clien-list .view_symph.lSymph03 span { background-color: #CCDFED; color: #000; }
.kc-clien-list .view_symph.lSymph04 { border-left-color: #AFCAE2; }
.kc-clien-list .view_symph.lSymph04 span { background-color: #AFCAE2; color: #FFF; }
.kc-clien-list .view_symph.lSymph05 { border-left-color: #7195B5; }
.kc-clien-list .view_symph.lSymph05 span { background-color: #7195B5; color: #FFF; }
.kc-clien-list .view_symph.lSymph06 { border-left-color: #527492; }
.kc-clien-list .view_symph.lSymph06 span { background-color: #527492; color: #FFF; }
.kc-clien-list .list_item .list_title { flex: 1 1 auto; min-width: 0; overflow: hidden; padding: 0 0.833em 0 0.417em; }
.kc-clien-list .list_item .list_title .list_subject { display: inline-block; position: relative; max-width: 32.857em; font-size: 1.166666em; line-height: 1.286em; word-break: break-all; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin: 0 0.357em 0 0; color: #111; font-weight: inherit; text-decoration: none; }
.kc-clien-list .list_item .list_title .list_subject:visited { text-decoration: none; color: #999; }
.kc-clien-list .list_item .list_title .list_subject:hover { color: #D43F3A; }
.kc-clien-list .list_item .list_title .kc-cat { color: #666; font-size: 0.857em; margin: 0 0.833em 0 0; padding: 0 0.25em; border-radius: 0.33em; border: 1px solid rgba(0, 0, 0, 0.05); line-height: 1.417em; }
.kc-clien-list .list_item .list_title .kc-ico { color: #999; font-size: 1.167em; margin: 0 0.357em 0 0; }
.kc-clien-list .list_item .list_title .list_reply { position: relative; top: 0.091em; font-size: 0.917em; color: #F7683A; padding: 0; font-weight: 400; }
.kc-clien-list .list_item .list_title .list_reply { display: inline-block; height: 1.636em; line-height: 1.545em; padding: 0 0.364em; border-radius: 0.33em; border: 1px solid rgba(0, 0, 0, 0.05); background-color: #FAFAFA; }
.kc-clien-list .list_item .list_author { position: relative; justify-content: center; }
.kc-clien-list .list_item .list_author .nickname { display: flex; align-items: center; justify-content: center; width: 7.917em; height: 1.333em; min-height: 16px; font-weight: 500; line-height: 1.333em; text-overflow: ellipsis; white-space: nowrap; border-left: 1px solid #E2E2E2; }
.kc-clien-list .list_item .list_hit, .kc-clien-list .list_item .list_time { text-align: center; color: #666; }
.kc-clien-list .list_item .list_hit .hit, .kc-clien-list .list_item .list_hit .time, .kc-clien-list .list_item .list_time .hit, .kc-clien-list .list_item .list_time .time { display: block; position: relative; width: 5.455em; font-size: 0.917em; line-height: 1.545em; height: 1.455em; border-left: 1px solid #E2E2E2; }
.kc-clien-list .list_item .list_hit .time, .kc-clien-list .list_item .list_time .time { color: #333; }
.kc-clien-list .list_item .list_time .time { width: 8.5em; }
.kc-clien-list .kc-badge { font-size: 0.917em; }
.kc-list-mobile { border-top: 0; }
.kc-list-mobile li { padding: 10px 4px; border-bottom: 1px solid #e2e2e2; }
.kc-list-mobile li a { color: #111; text-decoration: none; }
.kc-list-mobile li a:visited { color: #999; }
.kc-list-mobile .kc-cmt { color: #f7683a; font-size: 12px; font-weight: 500; margin-left: 5px; }
@media (max-width: 767.98px) { .kc-clien-list .list_item .list_hit, .kc-clien-list .list_item .list_author { display: none; } .kc-clien-list .list_item .list_time .time { width: auto; padding: 0 0.833em; white-space: nowrap; } }

/* pager: clien.net 'board-pagination / board-nav-area' CSS (clien-main.css 규칙을 그대로) */
.board-pagination { position: relative; top: -1px; display: flex; justify-content: center; font-weight: 500; font-size: 12px; line-height: 1; margin-top: 18px; }
.board-pagination .board-nav { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; }
.board-pagination .board-nav .board-nav-area { display: flex; border-radius: 0.33em; overflow: hidden; }
.board-pagination .board-nav a { text-decoration: none; color: #333; }
.board-pagination .board-nav .board-nav-area .board-nav-page:first-child { border-bottom-left-radius: 0.33em; border-top-left-radius: 0.33em; }
.board-pagination .board-nav .board-nav-area .board-nav-page:last-child { border-top-right-radius: 0.33em; border-bottom-right-radius: 0.33em; border: 1px solid #E2E2E2; }
.board-pagination .board-nav .board-nav-area .board-nav-page:last-child.active { border: 1px solid #37475A; }
.board-pagination .board-nav .board-nav-area .board-nav-page:last-child.active:hover { background-color: #333; border: 1px solid #333; }
.board-pagination .board-nav .board-nav-first, .board-pagination .board-nav .board-nav-prev, .board-pagination .board-nav .board-nav-page, .board-pagination .board-nav .board-nav-next { display: flex; align-items: center; justify-content: center; padding: 0 0.417em; margin-top: 0.833em; min-height: 2.667em; line-height: 2.5em; }
.board-pagination .board-nav .board-nav-first { color: #666; }
.board-pagination .board-nav .board-nav-first:before { content: "\f100"; position: relative; top: -0.071em; font-family: "FontAwesome"; padding: 0 0.357em 0 0; font-size: 1.167em; }
.board-pagination .board-nav .board-nav-first:hover, .board-pagination .board-nav .board-nav-first:focus { outline: none; color: #D43F3A; }
.board-pagination .board-nav .board-nav-prev { padding: 0 0.833em; }
.board-pagination .board-nav .board-nav-prev:before { content: "\f0d9"; position: relative; top: -0.071em; font-family: "FontAwesome"; font-size: 1.167em; }
.board-pagination .board-nav .board-nav-prev:after { content: ""; position: relative; right: 1.17em; height: 2.33em; border-left: 1px solid #E2E2E2; }
.board-pagination .board-nav .board-nav-prev.ten { padding: 0 0.417em; }
.board-pagination .board-nav .board-nav-prev.ten:after { border-left: 0; }
.board-pagination .board-nav .board-nav-prev.ten:before { content: "\f104"; padding: 0 0.357em 0 0; }
.board-pagination .board-nav .board-nav-prev:hover, .board-pagination .board-nav .board-nav-prev:focus { outline: none; color: #D43F3A; }
.board-pagination .board-nav .board-nav-page { z-index: 1; min-width: 2.667em; border: 1px solid #E2E2E2; border-right-width: 0; margin-right: 0; background-color: #FFF; }
.board-pagination .board-nav .board-nav-page.last { border: 1px solid #E2E2E2; }
.board-pagination .board-nav .board-nav-page.active { color: #FFF; border: 1px solid #37475A; border-right-width: 0; background-color: #37475A; }
.board-pagination .board-nav .board-nav-page.active:hover, .board-pagination .board-nav .board-nav-page.active:focus { outline: none; background-color: #333; border: 1px solid #333; border-right: 0; }
.board-pagination .board-nav .board-nav-page:hover, .board-pagination .board-nav .board-nav-page:focus { outline: none; background-color: #E2E2E2; }
.board-pagination .board-nav .board-nav-next { padding: 0 0.833em; }
.board-pagination .board-nav .board-nav-next:after { content: "\f0da"; position: relative; top: -0.071em; font-family: "FontAwesome"; font-size: 1.167em; }
.board-pagination .board-nav .board-nav-next:before { content: ""; position: relative; right: -1.17em; height: 2.33em; border-right: 1px solid #E2E2E2; }
.board-pagination .board-nav .board-nav-next.ten { padding: 0 0.417em; }
.board-pagination .board-nav .board-nav-next.ten:after { content: "\f105"; padding: 0 0 0 0.357em; }
.board-pagination .board-nav .board-nav-next.ten:before { border-right: 0; }
.board-pagination .board-nav .board-nav-next:hover, .board-pagination .board-nav .board-nav-next:focus { outline: none; color: #D43F3A; }

/* write button: clien.net 'button_post' (clien-main.css 의 .list_button_area .button_post 규칙) */
.kc-pager-wrap .button_post { width: 8em; height: 2.667em; font-size: 12px; line-height: 1; color: #FFF; margin-top: 0.833em; border-radius: 0.33em; background-color: #37475A; }
.kc-pager-wrap .button_post .action_icon { display: flex; align-items: center; height: 2.667em; color: #FFF; line-height: 2.667em; border-radius: 0.33em; text-decoration: none; cursor: pointer; }
.kc-pager-wrap .button_post .action_icon:hover { color: #FFF; }
.kc-pager-wrap .button_post .action_icon:focus { outline: none; background-color: #516B82; }
.kc-pager-wrap .button_post .button_icon { width: 33px; font-size: 1.167em; line-height: 1; padding: 0.643em 0; text-align: center; border-right: 1px solid rgba(255, 255, 255, 0.1); box-sizing: border-box; }
.kc-pager-wrap .button_post .button_name { display: inline-block; width: 5.167em; text-align: center; }

/* clien button_command 스타일 (관리자 버튼) */
.kc-list-foot .button_command { display: inline-block; width: 75px; height: 2.667em; padding: 0; margin-top: .833em; font-size: 12px; line-height: 2.667em; color: #666; text-align: center; text-decoration: none; cursor: pointer; border: 0; border-radius: .33em; background-color: #FFF; box-shadow: 0 0 0 1px rgba(0,0,0,0.1) inset; box-sizing: border-box; }
.kc-list-foot .button_command:hover { color: #666; box-shadow: 0 0 0 1px rgba(0,0,0,0.15) inset; }
.kc-list-foot .button_command:focus { outline: none; background-color: #F1F1F1; }
.kc-list-foot .kc-mgr-btns select { margin-top: .833em; }
.kc-list-foot #kc-move-target { font-size: 12px; }

/* ---- clien content_view 스타일 글보기 ---- */
.kc-clien-view { font-size: 12px; }
.kc-clien-view .kc-post-head { border-top: 0; border-bottom: 0; padding: 0; }
.kc-clien-view .kc-post-title { display: block; font-size: 1.83333em; line-height: 1.7; font-weight: 400; letter-spacing: 0; word-break: break-all; margin: 0; padding: 0.42em 0 0.9em; }
.kc-clien-view .kc-post-meta { display: block; gap: 0; font-size: 1em; color: #666; padding: 0 0 1.25em; border-bottom: 1px solid #516B82; }
.kc-clien-view .kc-post-meta > span { display: inline-block; padding: 0 0.42em 0 0; margin: 0 0.67em 0 0; border-right: 1px solid #E2E2E2; }
.kc-clien-view .kc-post-meta > span:last-child { padding: 0; margin: 0; border-right: 0; }
.kc-clien-view .kc-post-meta .kc-name { color: #333; font-weight: 400; }
.kc-clien-view .kc-post-files, .kc-clien-view .kc-post-links { margin-top: 1em; padding: 0.583em 0.833em 0.417em; border: 1px solid rgba(0,0,0,0.05); border-radius: 0.33em; background-color: #FFF9E5; font-size: 1em; }
.kc-clien-view .kc-post-body { margin-top: 1em; padding: 2.5em 1.25em; min-height: 160px; font-size: 13px; line-height: 1.6; word-break: break-all; border: 1px solid #E2E2E2; border-radius: 0 0 0.33em 0.33em; }
.kc-clien-view .kc-post-tags { padding: 1em 0 0; }
.kc-clien-view .kc-reactions { display: flex; justify-content: center; gap: 2px; padding: 1.25em 0 0; }
.kc-clien-view .kc-post-actions { justify-content: center; gap: 2px 1em; border-top: 0; border-bottom: 1px solid #E2E2E2; padding: 1.25em 0 2.5em; }
.kc-clien-view .kc-post-actions .btn, .kc-clien-view .kc-reactions .btn { --bs-btn-padding-y: 0.75em; --bs-btn-padding-x: 0.833em; --bs-btn-font-size: 1em; --bs-btn-border-radius: 0.33em; font-size: 12px; line-height: 1.2; color: #FFF; margin: 0 1px; border: 1px solid #516B82; background-color: #516B82; }
.kc-clien-view .kc-post-actions .btn:hover, .kc-clien-view .kc-reactions .btn:hover { color: #FFF; background-color: #435A6E; border-color: #435A6E; }
.kc-clien-view .kc-post-actions .btn:focus, .kc-clien-view .kc-reactions .btn:focus { outline: none; border-color: rgba(0,0,0,0.3); box-shadow: none; }
.kc-clien-view .kc-post-actions .btn-outline-danger { border-color: #D7625E; background-color: #D7625E; }
.kc-clien-view .kc-post-actions .btn-outline-danger:hover { background-color: #C4524E; border-color: #C4524E; }
.kc-clien-view .kc-reactions .btn.active, .kc-clien-view .kc-post-actions .btn.active { color: #FFF; background-color: #F7683A; border-color: #F7683A; }
@media (max-width: 767.98px) { .kc-clien-view .kc-post-body { padding: 1.5em 0.833em; } .kc-clien-view .kc-post-title { font-size: 1.5em; } }
.kc-clien-view .kc-post-actions .btn, .kc-clien-view .kc-reactions .btn { border-radius: 0.33em; font-weight: 400; }

/* 글쓰기 버튼을 페이저 우측으로 */
.kc-pager-wrap { position: relative; }
.kc-pager-wrap .button_post { position: absolute; right: 0; top: 8px; margin-top: 0; }
@media (max-width: 767.98px) { .kc-pager-wrap .button_post { position: static; margin: 0.833em auto 0; } }

/* clien button_next_page (다음페이지) */
.kc-pager-wrap .button_next_page { position: absolute; z-index: 2; left: 0; top: 8px; display: block; width: 8em; min-width: 8em; height: 2.667em; font-size: 12px; line-height: 1; color: #666; text-align: center; text-decoration: none; padding: 0.75em; margin-top: 0; border-radius: 0.33em; box-shadow: 0 0 0 1px rgba(0,0,0,0.1) inset; background-color: #FFF; box-sizing: border-box; cursor: pointer; }
.kc-pager-wrap .button_next_page:hover { color: #666; box-shadow: 0 0 0 1px rgba(0,0,0,0.15) inset; }
.kc-pager-wrap .button_next_page:focus { outline: none; background-color: #F1F1F1; }
.kc-pager-wrap .button_next_page .button_name { position: relative; top: -0.083em; }
.kc-pager-wrap .button_next_page .fa { font-size: 1.167em; margin: 0 0 0 0.357em; }
@media (max-width: 767.98px) { .kc-pager-wrap .button_next_page { position: static; margin: 0.833em auto 0; } }

/* clien post_info (작성자 바) + 작성자 메뉴 */
.kc-clien-view .kc-post-meta { border-bottom: 1px solid #516B82; }
.kc-clien-view .kc-post-meta strong { font-weight: 700; color: #333; }
.kc-clien-view .kc-post-info { display: flex; align-items: center; min-height: 3em; padding: 0.833em 1.25em; margin-top: 1em; background-color: #FAFAFA; border: 1px solid #E2E2E2; border-bottom: 0; }
.kc-clien-view .kc-post-info .kc-name { color: #78909C; font-weight: 700; text-decoration: none; }
.kc-clien-view .kc-post-info .kc-name::after, .kc-clien-view .kc-post-info .kc-name.dropdown-toggle::after { content: "님"; display: inline; margin: 0; vertical-align: baseline; font-weight: 400; border: 0; }
.kc-clien-view .kc-post-info .kc-sv-menu { background: #FFF; color: #666; min-width: 8.5em; margin-left: 0; padding: 0; font-size: 12px; border: 1px solid rgba(0,0,0,0.15); border-radius: 0.33em; box-shadow: 0 2px 6px rgba(0,0,0,0.15); }
.kc-clien-view .kc-post-info .kc-sv-menu li { border-bottom: 1px dotted #CCC; }
.kc-clien-view .kc-post-info .kc-sv-menu li:last-child { border-bottom: 0; }
.kc-clien-view .kc-post-info .kc-sv-menu li > a, .kc-clien-view .kc-post-info .kc-sv-menu li.kc-sv-id { display: block; padding: 0.75em 0.833em; color: #666; font-size: 12px; background: transparent; }
.kc-clien-view .kc-post-info .kc-sv-menu li.kc-sv-id { color: #000; font-weight: 500; }
.kc-clien-view .kc-post-info .kc-sv-menu li > a:hover { color: #D43F3A; background-color: #FAFAFA; }
.kc-clien-view .kc-post-info + .kc-post-files, .kc-clien-view .kc-post-info + .kc-post-links { margin-top: 0; }
.kc-clien-view .kc-post-head ~ .kc-post-body { margin-top: 0; border-top: 1px solid #E2E2E2; }

/* ---- clien 댓글 / 하단 버튼 ---- */
.kc-clien-comments { font-size: 12px; margin-top: 1.5em; }
.kc-clien-comments .kc-comments-title { font-size: 1em; font-weight: 400; color: #516B82; margin: 0 0 0.833em; padding: 0.833em 0 0; }
.kc-clien-comments .kc-comments-title .fa-comment { color: #516B82; margin-right: 0.25em; }
.kc-clien-comments .kc-comments-title strong { font-weight: 700; }
.kc-clien-comments .border-top { border-top: 0 !important; }
.kc-clien-comments .kc-comment { display: block; padding: 0; margin-bottom: 0.5em; border-bottom: 0; background: transparent; }
.kc-clien-comments .kc-comment.is-reply { background: transparent; }
.kc-clien-comments .kc-comment-photo { display: none; }
.kc-clien-comments .kc-comment-head { display: flex; flex-wrap: nowrap; align-items: center; gap: 0 0.5em; margin: 0; padding: 0.5em 0.833em; font-size: 12px; color: #666; background-color: #F1F1F1; }
.kc-clien-comments .kc-comment-head .kc-name { color: #333; font-weight: 500; text-decoration: none; }
.kc-clien-comments .kc-comment-head time { margin-left: auto; color: #666; padding-right: 0.5em; border-right: 1px solid #E2E2E2; }
.kc-clien-comments .kc-comment-head time:last-child { border-right: 0; padding-right: 0; }
.kc-clien-comments .kc-comment-tools { display: flex; gap: 0; margin: 0; font-size: 12px; }
.kc-clien-comments .kc-comment-tools > * { padding: 0 0.5em; border-left: 1px solid #E2E2E2; line-height: 1.2; }
.kc-clien-comments .kc-comment-tools > *:first-child { border-left: 0; }
.kc-clien-comments .kc-comment-tools button, .kc-clien-comments .kc-comment-tools a { color: #3B6FA3; font-size: 12px; text-decoration: none; }
.kc-clien-comments .kc-comment-tools [data-prompt] { color: #D43F3A; }
.kc-clien-comments .kc-comment-tools button:hover, .kc-clien-comments .kc-comment-tools a:hover { text-decoration: underline; }
.kc-clien-comments .kc-comment-body { padding: 0.75em 0.833em 1.25em; font-size: 13px; line-height: 1.6; word-break: break-all; }
.kc-clien-comments .kc-comment.is-best .kc-comment-head { background-color: #FAE3BF; }
.kc-clien-comments .kc-comment.is-best .kc-comment-body { background-color: #FFF8EB; }
.kc-clien-comments .kc-comment.is-best .badge { font-size: 11px; }
.kc-clien-comments .kc-comment-form { padding: 1.25em; margin-top: 1em; background-color: #E4E8EC; border: 0; border-radius: 0; }
.kc-clien-comments .kc-cm-box { display: flex; align-items: stretch; }
.kc-clien-comments .kc-cm-box textarea { flex: 1; min-height: 6.5em; margin: 0; font-size: 13px; border: 1px solid #37475A; border-right: 0; border-radius: 0.33em 0 0 0.33em; resize: vertical; }
.kc-clien-comments .kc-cm-box textarea:focus { box-shadow: none; border-color: #37475A; }
.kc-clien-comments .kc-cm-submit { width: 9.5em; flex: none; font-size: 12px; font-weight: 700; color: #FFF; background-color: #37475A; border: 1px solid #37475A; border-radius: 0 0.33em 0.33em 0; cursor: pointer; }
.kc-clien-comments .kc-cm-submit:hover { background-color: #516B82; }
.kc-clien-comments .kc-comment-form > .d-flex:last-child { margin-top: 0.5em; }
.kc-view-foot { display: flex; justify-content: space-between; margin: 1.5em 0 0; }
.kc-view-foot .button_post { width: 8em; height: 2.667em; font-size: 12px; line-height: 1; color: #FFF; border-radius: 0.33em; background-color: #37475A; }
.kc-view-foot .button_post.button_list { background-color: #999; }
.kc-view-foot .button_post .action_icon { display: flex; align-items: center; height: 2.667em; color: #FFF; line-height: 2.667em; border-radius: 0.33em; text-decoration: none; }
.kc-view-foot .button_post .button_icon { width: 33px; font-size: 1.167em; line-height: 1; padding: 0.643em 0; text-align: center; border-right: 1px solid rgba(255, 255, 255, 0.1); box-sizing: border-box; }
.kc-view-foot .button_post .button_name { display: inline-block; width: 5.167em; text-align: center; }
@media (max-width: 767.98px) { .kc-clien-comments .kc-comment-head { flex-wrap: wrap; } .kc-clien-comments .kc-cm-submit { width: 6em; } }
.kc-clien-comments .kc-comment-form > .mb-2:has(.kc-comment-cancel.d-none) { display: none !important; }


/* ---- 게시판 목록 (solution 'bd-head' · 카드 테이블) ---- */
.sol-board { --sb-card: #FFFFFF; --sb-border: #E4E4E7; --sb-border-sub: #F1F1F3; --sb-fg: #09090B; --sb-muted: #71717A; --sb-soft: #F4F4F5; --sb-ring: #A1A1AA; --sb-brand: #5E6AD2; --sb-secondary: #F4F4F5; }
.sol-board a { text-decoration: none; }
.sol-board .breadcrumb { display: block; padding: 0; background: none; font-size: 14px; color: var(--sb-muted); margin: 0 0 .75rem; }
.sol-board .breadcrumb a { color: var(--sb-muted); }
.sol-board .breadcrumb a:hover { color: var(--sb-fg); }
.sol-board .breadcrumb span { margin: 0 .35rem; opacity: .6; }
.sol-board .bd-head { padding: 26px 0 24px; text-align: center; }
.sol-board .bd-label { margin: 0 0 6px; font-size: 11px; font-weight: 700; letter-spacing: .08em; color: var(--sb-brand); text-transform: uppercase; }
.sol-board .bd-title { margin: 0 0 8px; font-size: 30px; font-weight: 700; line-height: 1.7; }
.sol-board .bd-title a { color: var(--sb-fg); }
.sol-board .bd-desc { margin: 0; font-size: 14px; font-weight: 300; line-height: 1.7; color: var(--sb-muted); }
.sol-board .bd-desc a { color: var(--sb-muted); }
.sol-board .bd-filters { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 0 0 20px; }
.sol-board .bd-filter { display: inline-flex; align-items: center; padding: 6px 14px; font-size: 13px; font-weight: 600; line-height: 1.7; color: var(--sb-muted); background: transparent; border: 1px solid var(--sb-border); border-radius: 7px; }
.sol-board .bd-filter:hover { background: var(--sb-soft); color: var(--sb-fg); }
.sol-board .bd-filter.on, .sol-board .bd-filter.on:hover { background: var(--sb-brand); border-color: var(--sb-brand); color: #FFF; }
.sol-board .bd-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin: 0 0 16px; }
.sol-board .bd-toolbar-l, .sol-board .bd-toolbar-r { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sol-board .bd-count { font-size: 13px; color: var(--sb-muted); }
.sol-board .bd-count strong { font-weight: 700; color: var(--sb-fg); }
.sol-board .bd-sorts { display: flex; gap: 2px; }
.sol-board .bd-sort { padding: 3px 8px; border-radius: 6px; font-size: 11px; font-weight: 600; line-height: 1.7; color: var(--sb-muted); background: transparent; }
.sol-board .bd-sort:hover { color: var(--sb-fg); }
.sol-board .bd-sort.on { color: var(--sb-brand); background: rgba(94, 106, 210, 0.08); }
.sol-board .bd-search { display: flex; align-items: center; gap: 6px; width: 220px; margin: 0; padding: 7px 14px; background: var(--sb-card); border: 1px solid var(--sb-border); border-radius: 8px; }
.sol-board .bd-search > svg { flex: none; color: var(--sb-muted); }
.sol-board .bd-search:focus-within { border-color: var(--sb-ring); }
.sol-board .bd-search input[type=search] { flex: 1 1 auto; min-width: 0; height: auto; padding: 0; font-size: 13px; line-height: 1.7; color: var(--sb-fg); background: transparent; border: 0; box-shadow: none; outline: 0; }
.sol-board .bd-write { flex: none; }
.sol-board .bd-manage-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; padding: 10px 14px; background: var(--sb-soft); border: 1px solid var(--sb-border); border-radius: 10px; font-size: 12px; }
.sol-board .bd-manage-bar select { width: auto; font-size: 12px; }
.sol-board .bd-manage-bar .btn-sm { font-size: 11px; }
.sol-board .sb-card { background: var(--sb-card); border: 1px solid var(--sb-border); border-radius: 12px; overflow: hidden; }
.sol-board .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sol-board table.sb-list { width: 100%; border-collapse: collapse; font-size: 14px; background: var(--sb-card); margin: 0; }
.sol-board table.sb-list thead th { padding: .75rem 1rem; text-align: left; white-space: nowrap; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; color: var(--sb-muted); border-bottom: 1px solid var(--sb-border); background: transparent; }
.sol-board table.sb-list tbody td { padding: .875rem 1rem; border-bottom: 1px solid var(--sb-border-sub); vertical-align: middle; background: transparent; color: var(--sb-fg); }
.sol-board table.sb-list tbody tr:last-child td { border-bottom: 0; }
.sol-board table.sb-list tbody tr:hover td { background: var(--sb-soft); }
.sol-board table.sb-list .num, .sol-board table.sb-list .center { text-align: center; white-space: nowrap; }
.sol-board table.sb-list th.center, .sol-board table.sb-list th.num { text-align: center; }
.sol-board table.sb-list .subject { width: 100%; }
.sol-board table.sb-list .subject a.list_subject { color: var(--sb-fg); font-weight: 500; overflow-wrap: anywhere; }
.sol-board table.sb-list .subject a.list_subject:hover { color: var(--sb-brand); }
.sol-board table.sb-list .muted, .sol-board table.sb-list td.muted a, .sol-board table.sb-list td.muted .kc-name { color: var(--sb-muted); font-size: .8125rem; white-space: nowrap; }
.sol-board table.sb-list tr.is-notice td { background: rgba(94, 106, 210, 0.05); }
.sol-board table.sb-list tr.is-current td { background: rgba(245, 158, 11, 0.12); }
.sol-board .kc-cmt { margin-left: 6px; font-size: 12px; font-weight: 600; color: #F7683A; }
.sol-board .kc-ico { margin-left: 4px; font-size: 12px; color: var(--sb-muted); }
.sol-board .kc-reply-mark { color: var(--sb-muted); margin-right: 4px; }
.sol-board .badge { display: inline-block; padding: 3px 8px; border-radius: 5px; font-size: 11px; font-weight: 700; line-height: 1.4; }
.sol-board .badge-cat { background: var(--sb-secondary); color: var(--sb-fg); }
.sol-board .badge-notice { background: #FDE8E8; color: #B42318; }
.sol-board .bd-empty { padding: 60px 20px; text-align: center; color: var(--sb-muted); font-size: 14px; }
.sol-board .sb-pager { margin: 1.5rem 0; }
.sol-board .sb-pager .board-pagination { top: 0; margin-top: 0; }
.sol-board .sb-pager .board-nav { gap: .25rem; }
.sol-board .sb-pager .board-nav-area { gap: .25rem; border-radius: 0; overflow: visible; }
.sol-board .sb-pager .board-nav a { display: grid; place-items: center; min-width: 36px; height: 36px; padding: 0 .625rem; border: 1px solid var(--sb-border); border-radius: 8px; background: var(--sb-card); color: var(--sb-muted); font-size: 14px; font-weight: 500; line-height: 1; text-decoration: none; }
.sol-board .sb-pager .board-nav a:hover { background: var(--sb-soft); color: var(--sb-fg); }
.sol-board .sb-pager .board-nav a.active, .sol-board .sb-pager .board-nav a.active:hover { background: var(--sb-brand); border-color: var(--sb-brand); color: #FFF; }
.sol-board .sb-pager .board-nav a::before, .sol-board .sb-pager .board-nav a::after { content: none !important; border: 0 !important; position: static !important; padding: 0 !important; height: auto !important; }
.sol-board .sb-pager .board-nav a.board-nav-first, .sol-board .sb-pager .board-nav a.board-nav-prev.ten, .sol-board .sb-pager .board-nav a.board-nav-next.ten { font-size: 13px; }
.sol-board .sb-pager .board-nav a.board-nav-prev:not(.ten)::after { content: "‹" !important; font-size: 18px; }
.sol-board .sb-pager .board-nav a.board-nav-next:not(.ten)::after { content: "›" !important; font-size: 18px; }
.sol-board .sb-pager .board-nav { flex-wrap: wrap; justify-content: center; }
@media (max-width: 767.98px) {
  .sol-board .hide-sm { display: none; }
  .sol-board .bd-head { padding: 32px 0 20px; }
  .sol-board .bd-title { font-size: 24px; }
  .sol-board .bd-toolbar-r { width: 100%; }
  .sol-board .bd-search { width: auto; flex: 1 1 auto; }
  .sol-board table.sb-list thead th, .sol-board table.sb-list tbody td { padding: .75rem .625rem; }
}

/* ---- 게시판 글쓰기 (solution 'page-head' + 카드 폼) ---- */
.sol-write { --sw-card: #FFFFFF; --sw-bg: #FFFFFF; --sw-border: #E4E4E7; --sw-input: #E4E4E7; --sw-fg: #09090B; --sw-muted: #71717A; --sw-soft: #F4F4F5; --sw-ring: #A1A1AA; --sw-brand: #5E6AD2; --sw-danger: #E5484D; }
.sol-write a { text-decoration: none; }
.sol-write .breadcrumb { display: block; padding: 0; background: none; font-size: 14px; color: var(--sw-muted); margin: 0 0 .75rem; }
.sol-write .breadcrumb a { color: var(--sw-muted); }
.sol-write .breadcrumb a:hover { color: var(--sw-fg); }
.sol-write .breadcrumb span { margin: 0 .35rem; opacity: .6; }
.sol-write .page-head { display: flex; align-items: baseline; gap: .75rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.sol-write .page-head h1 { margin: 0; font-size: 1.875rem; line-height: 2.25rem; letter-spacing: -.025em; font-weight: 700; color: var(--sw-fg); }
.sol-write .sw-card { background: var(--sw-card); border: 1px solid var(--sw-border); border-radius: 12px; }
.sol-write .sw-card-body { padding: 1.25rem; }
.sol-write .kc-form-row { display: block; padding: 0; margin-bottom: 1rem; border-bottom: 0; }
.sol-write .kc-form-row > label, .sol-write .kc-form-row > .kc-label { display: block; padding: 0; margin-bottom: .375rem; font-size: 14px; font-weight: 500; color: var(--sw-fg); }
.sol-write .kc-req { color: var(--sw-danger); margin-left: 2px; }
.sol-write .py-3.border-bottom, .sol-write .py-2.border-bottom { border-bottom: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; margin-bottom: 1rem; }
.sol-write .form-control, .sol-write .form-select { padding: .5rem .75rem; font-size: 14px; line-height: 1.25rem; color: var(--sw-fg); background-color: var(--sw-bg); border: 1px solid var(--sw-input); border-radius: 8px; box-shadow: none; transition: border-color .2s ease, box-shadow .2s ease; }
.sol-write .form-control:focus, .sol-write .form-select:focus { border-color: var(--sw-ring); box-shadow: 0 0 0 3px rgba(161, 161, 170, 0.25); outline: 0; }
.sol-write textarea.form-control { min-height: 80px; }
.sol-write .form-control::placeholder { color: var(--sw-muted); }
.sol-write .form-text, .sol-write .kc-hint-inline { font-size: .8125rem; color: var(--sw-muted); margin-top: .375rem; }
.sol-write .form-check-label { font-size: 14px; color: var(--sw-fg); }
.sol-write .form-check-input:checked { background-color: var(--sw-brand); border-color: var(--sw-brand); }
.sol-write .file-list { display: flex; flex-direction: column; gap: .5rem; }
.sol-write .file-list:empty { display: none; }
.sol-write .file-item { display: flex; align-items: center; gap: .625rem; flex-wrap: wrap; padding: .5rem .75rem; border: 1px solid var(--sw-border); border-radius: .375rem; background: var(--sw-card); }
.sol-write .file-item.is-deleted { opacity: .45; text-decoration: line-through; }
.sol-write .file-item .file-name { flex: 1 1 10rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .875rem; font-weight: 500; }
.sol-write .file-item .file-size { flex: none; font-size: .75rem; color: var(--sw-muted); }
.sol-write .file-item .file-caption { flex: 1 1 12rem; min-width: 0; max-width: 18rem; }
.sol-write .file-item .file-remove { flex: none; display: inline-flex; align-items: center; gap: .25rem; padding: .25rem .5rem; border: 0; border-radius: .375rem; background: transparent; color: var(--sw-muted); font: inherit; font-size: .8125rem; cursor: pointer; }
.sol-write .file-item .file-remove:hover { background: var(--sw-soft); color: var(--sw-danger); }
.sol-write .file-dropzone { margin-top: .5rem; }
.sol-write .file-dropzone-inner { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; padding: 1.5rem 1rem; text-align: center; border: 1.5px dashed var(--sw-border); border-radius: .375rem; cursor: pointer; transition: border-color .15s, background-color .15s; }
.sol-write .file-dropzone-inner:hover, .sol-write .file-dropzone-inner.is-drag-over { border-color: var(--sw-brand); background: var(--sw-soft); }
.sol-write .file-dropzone-inner.is-full { opacity: .5; cursor: not-allowed; }
.sol-write .file-dropzone-inner svg { color: var(--sw-muted); }
.sol-write .file-dropzone-text { font-size: .875rem; margin: 0; }
.sol-write .file-dropzone-hint { font-size: .75rem; color: var(--sw-muted); margin: 0; }
.sol-write .kc-form-actions { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: .5rem; margin-top: 1.2rem; }
.sol-write .sw-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .5rem 1rem; font-size: 14px; font-weight: 500; line-height: 1.25rem; color: var(--sw-fg); background: var(--sw-soft); border: 1px solid transparent; border-radius: 8px; cursor: pointer; white-space: nowrap; transition: opacity .2s ease, background-color .2s ease, color .2s ease; }
.sol-write .sw-btn:hover { color: var(--sw-fg); background: #E9E9EC; }
.sol-write .sw-btn.sw-primary { padding: .65rem 1.5rem; background: var(--sw-brand); color: #FFF; }
.sol-write .sw-btn.sw-primary:hover { opacity: .9; background: var(--sw-brand); color: #FFF; }
.sol-write .alert { border-radius: 10px; }
.sol-write .kc-form-row:has(> .kc-label + .pt-2) { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1rem; }
.sol-write .kc-form-row:has(> .kc-label + .pt-2) > .kc-label { width: auto; margin: 0; }
.sol-write .kc-form-row > .pt-2 { padding-top: 0 !important; }
.sol-write .kc-form-row > div > .form-select.w-auto, .sol-write .kc-form-row .form-select.w-auto { width: 100% !important; }
@media (max-width: 767.98px) { .sol-write .page-head h1 { font-size: 1.5rem; line-height: 2rem; } }

/* ---- 게시판 글보기 (solution 'post-head' · 카드 · 추천 · 댓글) ---- */
.sol-view { --sv-card: #FFFFFF; --sv-bg: #FFFFFF; --sv-border: #E4E4E7; --sv-border-sub: #F1F1F3; --sv-input: #E4E4E7; --sv-fg: #09090B; --sv-muted: #71717A; --sv-soft: #F4F4F5; --sv-ring: #A1A1AA; --sv-brand: #5E6AD2; --sv-danger: #E5484D; }
.sol-view a { text-decoration: none; }
.sol-view .breadcrumb { display: block; padding: 0; background: none; font-size: 14px; color: var(--sv-muted); margin: 0 0 .75rem; }
.sol-view .breadcrumb a { color: var(--sv-muted); }
.sol-view .breadcrumb a:hover { color: var(--sv-fg); }
.sol-view .breadcrumb span { margin: 0 .35rem; opacity: .6; }
.sol-view .sv-card { background: var(--sv-card); border: 1px solid var(--sv-border); border-radius: 12px; overflow: hidden; }
.sol-view .sv-card + .sv-card { margin-top: 1rem; }
.sol-view .post-head { padding: 1.5rem 1.25rem; border-bottom: 1px solid var(--sv-border); }
.sol-view .post-head h1 { margin: 0 0 .625rem; font-size: 1.25rem; line-height: 1.75rem; font-weight: 700; color: var(--sv-fg); overflow-wrap: anywhere; }
.sol-view .post-head .badge-cat { margin-bottom: .5rem; }
.sol-view .post-meta { display: flex; flex-wrap: wrap; gap: .25rem 1rem; font-size: .8125rem; color: var(--sv-muted); }
.sol-view .post-meta strong { color: var(--sv-fg); font-weight: 600; }
.sol-view .post-meta strong a, .sol-view .post-meta strong .kc-name { color: var(--sv-fg); font-weight: 600; }
.sol-view .badge { display: inline-block; padding: 3px 8px; border-radius: 5px; font-size: 11px; font-weight: 700; line-height: 1.4; vertical-align: middle; }
.sol-view .badge-cat { background: var(--sv-soft); color: var(--sv-fg); }
.sol-view .badge-notice { background: #FDE8E8; color: #B42318; }
.sol-view .post-body { padding: 2rem 1.25rem; min-height: 8rem; margin: 0; border: 0; font-size: 1rem; line-height: 1.75; }
.sol-view .post-body img { border-radius: 10px; }
.sol-view .post-body blockquote { margin: 1.25rem 0; padding: .5rem 0 .5rem 1.25rem; border-left: 3px solid var(--sv-border); color: var(--sv-muted); }
.sol-view .post-body pre { background: var(--sv-soft); color: var(--sv-fg); padding: 1rem; border-radius: 10px; overflow-x: auto; font-size: 14px; }
.sol-view .post-body code { background: var(--sv-soft); padding: .125rem .375rem; border-radius: 4px; }
.sol-view .post-body pre code { background: none; padding: 0; }
.sol-view .post-body table { border-collapse: collapse; width: 100%; margin: 1.25rem 0; }
.sol-view .post-body th, .sol-view .post-body td { border: 1px solid var(--sv-border); padding: .625rem; }
.sol-view .kc-post-files, .sol-view .kc-post-links { margin: 0; padding: .75rem 1.25rem; border: 0; border-bottom: 1px solid var(--sv-border); border-radius: 0; background: var(--sv-soft); font-size: 14px; }
.sol-view .kc-post-tags { padding: 0 1.25rem 1rem; }
.sol-view .kc-post-tags a { color: var(--sv-muted); background: var(--sv-soft); }
.sol-view .vote-row { display: flex; gap: .625rem; justify-content: center; padding: 1.5rem 0; }
.sol-view .vote-btn { display: inline-flex; flex-direction: column; align-items: center; gap: .125rem; min-width: 5.5rem; padding: .75rem 1.25rem; border: 1px solid var(--sv-border); border-radius: 10px; background: var(--sv-bg); color: var(--sv-muted); cursor: pointer; font-family: inherit; font-size: .8125rem; font-weight: 500; transition: background-color .15s, border-color .15s; }
.sol-view .vote-btn:hover { background: var(--sv-soft); color: var(--sv-muted); }
.sol-view .vote-btn .n { font-size: 1.125rem; font-weight: 700; color: var(--sv-fg); line-height: 1.4; }
.sol-view .vote-btn.on, .sol-view .vote-btn.active { border-color: var(--sv-brand); color: var(--sv-fg); background: var(--sv-bg); }
.sol-view .post-actions { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; padding: 1.125rem 1.25rem; border: 0; border-top: 1px solid var(--sv-border); justify-content: flex-start; }
.sol-view .post-actions > div:nth-child(2) { margin-left: auto; }
.sol-view .sv-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .5rem 1rem; margin: 0; font-size: 14px; font-weight: 500; line-height: 1.25rem; color: var(--sv-fg); background: var(--sv-soft); border: 1px solid transparent; border-radius: 8px; cursor: pointer; white-space: nowrap; transition: opacity .2s ease, background-color .2s ease, color .2s ease; }
.sol-view .sv-btn:hover { color: var(--sv-fg); background: #E9E9EC; }
.sol-view .sv-btn.active { background: var(--sv-brand); color: #FFF; }
.sol-view .sv-btn.sv-danger { background: var(--sv-danger); color: #FFF; }
.sol-view .sv-btn.sv-danger:hover { opacity: .9; background: var(--sv-danger); color: #FFF; }
.sol-view .sv-btn.sv-primary { background: var(--sv-brand); color: #FFF; }
.sol-view .sv-btn.sv-primary:hover { opacity: .9; background: var(--sv-brand); color: #FFF; }
.sol-view .sibling-nav { border-top: 1px solid var(--sv-border); font-size: 14px; }
.sol-view .sibling-nav > div { display: flex; gap: .75rem; padding: .75rem 1.25rem; border-bottom: 1px solid var(--sv-border-sub); }
.sol-view .sibling-nav > div:last-child { border-bottom: 0; }
.sol-view .sibling-nav .dir { color: var(--sv-muted); flex: none; width: 3.5rem; }
.sol-view .sibling-nav a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--sv-fg); }
.sol-view .sibling-nav a:hover { color: var(--sv-brand); }
.sol-view .sv-comments { margin-top: 1.25rem; font-size: 14px; }
.sol-view .sv-comments .card-head { display: flex; align-items: center; gap: .625rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--sv-border); }
.sol-view .sv-comments .card-head h2 { margin: 0; padding: 0; font-size: 1rem; font-weight: 600; color: var(--sv-fg); }
.sol-view .sv-comments .comment-count { color: var(--sv-muted); font-weight: 600; font-size: .8125rem; }
.sol-view .sv-comments .kc-comment { display: block; padding: 1rem 1.25rem; margin: 0; background: transparent; border-bottom: 1px solid var(--sv-border-sub); }
.sol-view .sv-comments .kc-comment.is-reply { background: transparent; padding-left: 2.25rem; }
.sol-view .sv-comments .kc-comment.is-best { background: rgba(94, 106, 210, 0.06); }
.sol-view .sv-comments .kc-comment-photo { display: none; }
.sol-view .sv-comments .kc-comment-head { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin: 0 0 .375rem; padding: 0; font-size: .8125rem; background: transparent; color: var(--sv-muted); }
.sol-view .sv-comments .kc-comment-head .kc-name { font-weight: 600; color: var(--sv-fg); }
.sol-view .sv-comments .kc-comment-head time { margin-left: 0; color: var(--sv-muted); border: 0; padding: 0; }
.sol-view .sv-comments .kc-comment-tools { margin: 0 0 0 auto; display: flex; gap: .5rem; font-size: 12px; }
.sol-view .sv-comments .kc-comment-tools button, .sol-view .sv-comments .kc-comment-tools a { border: 0; background: none; padding: 0; cursor: pointer; color: var(--sv-muted); font-size: 12px; font-family: inherit; }
.sol-view .sv-comments .kc-comment-tools button:hover, .sol-view .sv-comments .kc-comment-tools a:hover { color: var(--sv-fg); }
.sol-view .sv-comments .kc-comment-body { padding: 0; font-size: 14px; line-height: 1.7; color: var(--sv-fg); }
.sol-view .sv-comments .border-top { border-top: 0 !important; }
.sol-view .sv-comments > .kc-muted { padding: 3rem 1rem; text-align: center; border: 0 !important; }
.sol-view .sv-comments .kc-comment-form { margin: 0; padding: 1.25rem; border: 0; border-top: 1px solid var(--sv-border); border-radius: 0; background: transparent; }
.sol-view .sv-comments .form-control { padding: .5rem .75rem; font-size: 14px; color: var(--sv-fg); background-color: var(--sv-bg); border: 1px solid var(--sv-input); border-radius: 8px; box-shadow: none; }
.sol-view .sv-comments .form-control:focus { border-color: var(--sv-ring); box-shadow: 0 0 0 3px rgba(161, 161, 170, 0.25); }
.sol-view .sv-comments textarea.form-control { min-height: 5rem; }
.sol-view .sv-comments > p.small { padding: 1rem 1.25rem; margin: 0 !important; }
@media (max-width: 767.98px) { .sol-view .post-actions > div:nth-child(2) { margin-left: 0; } .sol-view .vote-btn { min-width: 4.5rem; padding: .625rem 1rem; } }



/* ── basic01 목록: 상단 정렬·내가본글 바 · 분류 칩 · 분류 배지 · 댓글 수 배지 (clien.net 목록 모양) ── */
.kc-clien-bar { display: flex; align-items: center; gap: 8px; padding: 0 0 10px; margin-bottom: 10px; border-bottom: 1px solid #A9A9A9; }
.kc-clien-bar .kc-sort { width: auto; min-width: 92px; font-size: 13px; color: #555; border-color: #D5D5D5; border-radius: 4px; }
.kc-seen-btn { margin-left: auto; height: 34px; padding: 0 12px; font-size: 13px; color: #37475A; background: #FFF; border: 1px solid #37475A; border-radius: 4px; cursor: pointer; }
.kc-seen-btn[aria-pressed="true"] { background: #37475A; color: #FFF; }
.kc-cats { display: flex; flex-wrap: nowrap; gap: 4px; margin: 0 0 12px; }
.kc-cats a { flex: 1 1 0; min-width: 0; padding: 0; height: 24px; line-height: 24px; text-align: center; font-size: 12px; font-weight: 500; color: #4A5A70; background: #E4EBF2; border: 0; border-radius: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kc-cats a:hover { background: #D3DEEA; color: #37475A; }
.kc-cats a.active { background: #526D8A; color: #FFF; font-weight: 700; }
.kc-clien-list .list_content { border-top: 1px solid #C9C9C9; }
.kc-clien-list .list_item .list_title .kc-cat { flex: none; display: inline-block; min-width: 3.4em; text-align: center; padding: 0.15em 0.6em; margin-right: 0.8em; color: #6A7686; background: #E9EEF4; border: 0; border-radius: 4px; font-size: 0.92em; line-height: 1.4em; }
.kc-clien-list .list_item .list_title { padding-left: 0.9em; }
.kc-clien-list .list_item.no-symph .list_title { padding-left: 0.9em; }
.kc-clien-list .list_item.notice .list_symph { color: #6875AD; font-size: 12px; min-width: 3.4em; border-left: 0; }
.kc-clien-list .list_item.notice .list_symph > span { background: none; color: #6875AD; padding: 0; }
.kc-clien-list .list_item.notice { background: #F7F7F7; }
.kc-clien-list .list_item .list_title { white-space: nowrap; }
.kc-clien-list .list_item .list_title .list_reply { margin-left: 0.2em; font-size: 0.92em; color: #F7683A; background: #FFF4EF; border: 1px solid #FBD9CC; }
@media (max-width: 767.98px) { .kc-cats { flex-wrap: wrap; } .kc-cats a { flex: 0 0 auto; padding: 0 12px; } }

/* ── basic01 글보기: 제목 오른쪽 공감 박스 · 작성자 막대 · 한 줄 반응 버튼 (clien.net 글보기 모양) ── */
.kc-clien-view .kc-post-head { position: relative; padding-right: 7em; }
.kc-clien-view .kc-post-title { font-size: 1.75em; line-height: 1.5; padding: 0.3em 0 0.7em; color: #222; }
.kc-clien-view .kc-title-cmt { display: inline-block; vertical-align: middle; margin-left: .4em; padding: 0 .45em; font-size: .5em; line-height: 1.7em; color: #F7683A; background: #FAFAFA; border: 1px solid #E2E2E2; border-radius: 4px; text-decoration: none; }
.kc-clien-view .kc-view-symph { position: absolute; top: 0; right: 0; display: flex; align-items: baseline; justify-content: center; gap: 2px; min-width: 6.4em; padding: .9em 1em; background: #E4EBF2; color: #37475A; border-radius: 4px; }
.kc-clien-view .kc-view-symph strong { font-size: 1.7em; font-weight: 500; line-height: 1; }
.kc-clien-view .kc-view-symph span { font-size: 1em; }
.kc-clien-view .kc-post-meta { border-bottom: 0; padding-bottom: 1em; font-size: 12.5px; }
.kc-clien-view .kc-post-meta .kc-modified { color: #999; }
.kc-clien-view .kc-author-bar { display: flex; align-items: center; gap: .5em; margin-top: 0; padding: 0.9em 1em; font-size: 12px; background: #F8F8F8; border: 1px solid #E2E2E2; border-top: 1px solid #516B82; border-bottom: 0; }
.kc-clien-view .kc-author-bar .kc-name { font-weight: 600; color: #333; }
.kc-clien-view .kc-post-body { margin-top: 0; border-radius: 0; border-color: #E2E2E2; }
.kc-clien-view .kc-reactions { display: inline-flex; gap: 0; justify-content: center; padding: 1.25em 0 0; }
.kc-clien-view .kc-reactions .kc-react-btn { border-radius: 0.33em 0 0 0.33em; min-width: 0; color: #FFF; background-color: #435A6E; border-color: #435A6E; }
.kc-clien-view .kc-reactions .kc-react-count { display: inline-flex; align-items: center; padding: 0 1em; font-size: 1.1em; font-weight: 700; color: #FFF; background: #7BA7BC; border-radius: 0 0.33em 0.33em 0; }
.kc-clien-view .kc-reactions .btn-outline-secondary.kc-react-btn { border-radius: 0.33em; margin-left: 4px; }
.kc-clien-view .kc-post-actions { border-bottom: 1px solid #E2E2E2; }
.kc-clien-view .kc-post-actions .btn { color: #FFF; background-color: #435A6E; border-color: #435A6E; }
.kc-clien-view .kc-post-actions .btn-outline-secondary:not(.active) { color: #FFF; }
@media (max-width: 767.98px) { .kc-clien-view .kc-post-head { padding-right: 0; } .kc-clien-view .kc-view-symph { position: static; display: inline-flex; margin-bottom: .5em; } }

/* ── basic01 글보기: 작성자 게시글·댓글 패널 · 주시하기 ── */
.kc-author-panel { margin: 1.25em 0 0; border: 1px solid #E2E2E2; border-radius: 4px; background: #FFF; font-size: 12px; }
.kc-ap-tabs { display: flex; align-items: stretch; border-bottom: 1px solid #E2E2E2; background: #FAFAFA; }
.kc-ap-who { display: flex; align-items: center; padding: 0 12px; color: #444; }
.kc-ap-tabs button { padding: 10px 16px; font-size: 13px; color: #888; background: none; border: 0; border-right: 1px solid transparent; cursor: pointer; }
.kc-ap-tabs button.on { color: #111; font-weight: 700; background: #FFF; margin-bottom: -1px; border: 1px solid #E2E2E2; border-bottom-color: #FFF; border-radius: 4px 4px 0 0; }
.kc-ap-list { list-style: none; margin: 0; padding: 6px 10px; }
.kc-ap-list[hidden] { display: none; }
.kc-ap-list li { display: flex; align-items: center; gap: 6px; padding: 4px 0; line-height: 1.5; }
.kc-ap-list a { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #222; font-size: 13px; text-decoration: none; }
.kc-ap-list a:hover { color: #D43F3A; }
.kc-ap-like { flex: none; min-width: 2.2em; padding: 0 .3em; text-align: center; color: #37475A; background: #E4EBF2; border-radius: 3px; }
.kc-ap-like.zero { color: #BBB; background: transparent; }
.kc-ap-board { flex: none; padding: 0 .5em; color: #6A7686; background: #E9EEF4; border-radius: 3px; }
.kc-ap-cmt { flex: none; font-style: normal; color: #F7683A; }
.kc-ap-list time { flex: none; color: #666; min-width: 4em; text-align: right; }
.kc-ap-empty { color: #999; justify-content: center; }
.kc-clien-view .kc-post-actions .kc-watch { margin-left: auto; color: #37475A; background: #FFF; border-color: #CCC; }
.kc-clien-view .kc-post-actions .kc-watch .w-on, .kc-clien-view .kc-post-actions .kc-watch.active .w-off { display: none; }
.kc-clien-view .kc-post-actions .kc-watch.active .w-on { display: inline; }
.kc-clien-view .kc-post-actions .kc-watch.active { color: #FFF; background: #F7683A; border-color: #F7683A; }
.kc-clien-view .kc-post-actions .kc-watch:hover { color: #37475A; background: #F1F1F1; }
.kc-clien-view .kc-post-actions .kc-watch.active:hover { color: #FFF; background: #E5572A; }