@charset "utf-8";

/* ═══════════════════════════════════════════════
   3W 다크 테마 — 게시판 스킨 오버라이드
   설악중기 (fokm.kr)
═══════════════════════════════════════════════ */

/* ─── 페이지 레이아웃 ─── */
.board-list {
  padding: 48px 48px 64px;
  max-width: 1280px;
  margin: 0 auto;
}

/* ─── 카테고리 ─── */
.list-category .div-tab-box { margin-bottom:15px; }
.list-category .dropdown { margin-bottom:15px; }
.list-category .active a, .list-category .selected a { color:#F5C400; font-weight:bold !important; }

/* ─── PC 목록 테이블 ─── */
.table-responsive { background: transparent !important; border: none !important; }

table.list-pc {
  border: none !important;
  border-bottom: 1px solid rgba(245,196,0,.12) !important;
  background: transparent !important;
  margin-bottom: 0 !important;
}
table.list-pc th {
  background: #1C1C1C !important;
  background-image: none !important;
  color: #888880 !important;
  font-size: 11px !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  border: none !important;
  border-bottom: 1px solid rgba(245,196,0,.15) !important;
  height: 48px !important;
  padding: 0 16px !important;
  font-weight: 500 !important;
}
table.list-pc th a { color:#888880 !important; text-decoration:none; }
table.list-pc th a:hover { color:#F5C400 !important; }
table.list-pc td {
  color: #FAFAF8 !important;
  border-bottom: 1px solid rgba(255,255,255,.05) !important;
  background: transparent !important;
  padding: 14px 16px !important;
}
table.list-pc tbody tr:hover td { background: rgba(245,196,0,.03) !important; }
table.list-pc.bg-white { background: transparent !important; }
table.list-pc tbody tr:first-child td { border-top: none !important; }
table.list-pc .list-now { background: rgba(245,196,0,.05) !important; }
table.list-pc tr.active { background: rgba(245,196,0,.04) !important; }
table.list-pc .list-img img { width:40px; height:40px; border-radius:50%; }
table.list-pc .list-img i { width:40px;height:40px;line-height:40px;margin:0;font-size:24px;background:#2A2A2A;border-radius:50%;text-align:center;color:#888;display:inline-block; }
table.list-pc .list-subject { text-align:left !important; white-space:normal !important; }
table.list-pc .list-subject a { display:block; color:#FAFAF8 !important; transition:color .2s; }
table.list-pc .list-subject a:hover { color:#F5C400 !important; }
table.list-pc .list-subject.now { font-weight:bold !important; }
table.list-pc .list-subject.now a { color:#F5C400 !important; }
table.list-pc .list-subject.notice a { color:#F5C400 !important; font-weight:bold !important; }
table.list-pc .list-none { padding:100px 0; color:#888880; }
table.list-pc .count { color:#F5C400 !important; }
span.count.orangered { color:#F5C400 !important; }

/* ─── 모바일 목록 ─── */
.list-mobile { margin-bottom:15px; border-top:1px solid rgba(245,196,0,.1); }
.list-mobile strong { font-weight:normal; margin:0; line-height:40px; display:block; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden; }
.list-mobile strong a { color:#FAFAF8 !important; }
.list-mobile strong a:hover { color:#F5C400 !important; }
.list-mobile.no-img strong { line-height:30px; }
.list-mobile strong.notice a { font-weight:bold; color:#F5C400 !important; }
.list-mobile strong.now a { font-weight:bold; color:#F5C400 !important; }
.list-mobile .list-img img { width:40px; height:40px; border-radius:50%; }
.list-mobile .list-img i { width:40px;height:40px;line-height:40px;margin:0;font-size:24px;background:#2A2A2A;border-radius:50%;text-align:center;color:#888;display:inline-block; }
.list-mobile .list-cnt { color:#F5C400; font-size:12px; font-weight:bold; font-family:verdana; letter-spacing:-1px; }
.list-mobile .media { border-bottom:1px solid rgba(255,255,255,.05); margin:0; padding:10px 8px; background:transparent; }
.list-mobile .media.list-notice { background:rgba(245,196,0,.03); }
.list-mobile .media.list-now { background:rgba(245,196,0,.04); }
.list-mobile :first-child.media { margin-top:0; }
.list-mobile .media .media-body { padding-left:0; color:#888880; }

/* ─── 목록 공통 ─── */
.list-wrap { width:100%; }
.list-btn-box { margin-bottom:20px; }
.list-btn-box a span { margin-left:4px; }
.list-btn-box .sort a { color:#F5C400 !important; font-weight:bold !important; }
.list-btn-box .dropdown-menu { font-size:12px; background:#1C1C1C !important; border:1px solid rgba(245,196,0,.15) !important; border-radius:0 !important; box-shadow:0 8px 24px rgba(0,0,0,.5) !important; }
.list-btn-box .dropdown-menu li a { color:#FAFAF8 !important; }
.list-btn-box .dropdown-menu li a:hover { color:#F5C400 !important; background:#2A2A2A !important; }
.list-none { margin:0 0 15px; padding:80px 0; color:#888880; text-align:center; }
.list-page { margin-bottom:20px; margin-top:12px; }
.list-page .pagination { margin:0; }

/* ─── 페이지네이션 ─── */
.list-page .pagination { display:flex; justify-content:center; gap:4px; flex-wrap:wrap; }
.list-page .pagination > li > a,
.list-page .pagination > li > span {
  background: transparent !important;
  border: 1px solid rgba(245,196,0,.15) !important;
  color: #888880 !important;
  font-size:13px;
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:0 !important;
  transition:all .3s;
  float:none;
  padding:0;
  margin:0;
  line-height:1;
}
.list-page .pagination > li > a:hover,
.list-page .pagination > li > a:focus {
  border-color: #F5C400 !important;
  color: #F5C400 !important;
  background: transparent !important;
}
.list-page .pagination > li.active > a,
.list-page .pagination > li.active > span,
.list-page .pagination > .active > a {
  background: #F5C400 !important;
  border-color: #F5C400 !important;
  color: #0D0D0D !important;
  font-weight:700;
}
.list-page .pagination > li:first-child > a,
.list-page .pagination > li:last-child > a { border-radius:0 !important; }

/* ─── 아이콘 ─── */
.list-wrap .wr-text { font-family:dotum; font-size:11px; letter-spacing:-1px; line-height:11px; font-weight:normal; }
.list-wrap .wr-icon { display:inline-block; padding:0; margin:0; overflow:hidden; vertical-align:middle; background-repeat:no-repeat; background-position:left top; }
.list-wrap .wr-notice { width:37px; height:19px; background-image:url('./img/icon_notice.gif'); }
.list-wrap .wr-new { width:12px; height:12px; background-image:url('./img/icon_new.gif'); }
.list-wrap .wr-secret { width:12px; height:12px; background-image:url('./img/icon_secret.gif'); }
.list-wrap .wr-hot { width:12px; height:12px; background-image:url('./img/icon_hot.gif'); }
.list-wrap .wr-text.red { color:#F5C400; }

/* ─── 검색 모달 ─── */
.modal-content { background:#1C1C1C !important; border:1px solid rgba(245,196,0,.15) !important; border-radius:0 !important; }
.modal-header { border-bottom:1px solid rgba(245,196,0,.1) !important; }
.modal-body h4 { color:#FAFAF8; }
.modal-body .form-control {
  background:#0D0D0D !important;
  border:1px solid rgba(245,196,0,.2) !important;
  color:#FAFAF8 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.modal-body .form-control:focus { border-color:rgba(245,196,0,.5) !important; box-shadow:none !important; }
.modal-body select.form-control option { background:#1C1C1C; }
.btn-close { color:#888880 !important; }

/* ─── 버튼 (Bootstrap 오버라이드) ─── */
.btn { border-radius:0 !important; font-size:12px !important; letter-spacing:.05em; transition:all .3s !important; }
.btn-black, .btn-default {
  background:#1C1C1C !important;
  border:1px solid rgba(245,196,0,.2) !important;
  color:#888880 !important;
}
.btn-black:hover, .btn-black:focus,
.btn-default:hover, .btn-default:focus {
  background:#2A2A2A !important;
  color:#FAFAF8 !important;
  border-color:rgba(245,196,0,.4) !important;
}
.btn-color, .btn-primary {
  background:#F5C400 !important;
  border-color:#F5C400 !important;
  color:#0D0D0D !important;
  font-weight:700 !important;
}
.btn-color:hover, .btn-color:focus,
.btn-primary:hover, .btn-primary:focus {
  background:#E05C00 !important;
  border-color:#E05C00 !important;
  color:#FAFAF8 !important;
}

/* ─── 내용 보기 ─── */
.view-wrap {
  width:100%;
  overflow:hidden;
  padding:0 48px 64px;
  max-width:1280px;
  margin:0 auto;
}
.view-wrap h1 {
  font-family:'Black Han Sans', sans-serif;
  font-size:26px;
  font-weight:400;
  color:#FAFAF8;
  line-height:1.5;
  white-space:normal;
  word-wrap:break-word;
  text-overflow:unset;
  overflow:visible;
  margin:0;
  padding:32px 0 20px;
  border-bottom:1px solid rgba(245,196,0,.12);
  letter-spacing:-.02em;
  display:block;
}
.view-wrap h1 .photo { border-radius:50%; width:40px; height:40px; margin-right:12px; display:inline-block; }
.view-wrap .no-attach { border-bottom:0; }

/* 메타 정보 패널 */
.view-head.panel.panel-default,
.view-head.panel {
  background:#1C1C1C !important;
  border:none !important;
  border-bottom:1px solid rgba(245,196,0,.08) !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.view-head .panel-heading {
  background:transparent !important;
  border-bottom:1px solid rgba(255,255,255,.05) !important;
  padding:14px 16px;
}
.panel-heading { background:#1C1C1C !important; border-radius:0 !important; }
.view-head .font-12.text-muted,
.view-head .text-muted { color:#888880 !important; }
.view-head .sp { display:inline-block; width:20px; text-align:center; font-size:11px; color:#444; }
.view-head .red, .view-head b.red { color:#F5C400 !important; }

/* 첨부파일 리스트 */
.view-head .list-group { margin-bottom:0; }
.view-head .list-group-item {
  background:#141414 !important;
  border:none !important;
  border-bottom:1px solid rgba(255,255,255,.05) !important;
  color:#888880 !important;
  border-radius:0 !important;
  transition:color .2s, background .2s;
}
.view-head .list-group-item:hover { color:#F5C400 !important; background:#0D0D0D !important; }
.view-head .label-warning { background:#E05C00 !important; color:#fff !important; }
.view-head .label-primary { background:#F5C400 !important; color:#0D0D0D !important; }

/* 본문 */
.view-content { padding:32px 0 24px; color:#FAFAF8; }
.view-content p { padding:0; margin:0; line-height:1.9; }
.view-content img { width:auto; height:auto; max-width:100%; }
.view-mobile .view-content { padding:24px 0 16px; }
.view-img img { display:block; max-width:100%; margin:0 auto 15px; border:0; height:auto; }

/* 추천/비추천 */
.view-good-box { text-align:center; margin:24px 0; }
.view-good-box span { margin:15px 6px; width:80px; height:80px; display:inline-block; }
.view-good-box a {
  background:#1C1C1C;
  border:1px solid rgba(245,196,0,.15);
  padding-top:14px;
  border-radius:50%;
  width:80px; height:80px;
  text-align:center;
  color:#888880;
  font-size:22px;
  line-height:26px;
  display:inline-block;
  transition:all .3s;
}
.view-good-box .view-good a:hover { background:#F5C400; border-color:#F5C400; color:#0D0D0D; }
.view-good-box .view-nogood a:hover { background:#2A2A2A; border-color:#555; color:#FAFAF8; }

/* 태그 */
.view-tag { margin:10px 0; padding:0; color:#888880; font-size:12px; }
.view-tag a { color:#888880; }
.view-tag a:hover { color:#F5C400; }
.view-cnt { margin-top:4px; }

/* 액션 버튼 */
.view-icon { margin:16px 0; }
.view-btn { margin:0 0 48px; }
.view-btn i { margin-right:2px; }
.view-author .auth-photo { width:160px; padding-right:15px; }

/* 댓글 헤더 */
.view-comment {
  font-family:'Bebas Neue', sans-serif !important;
  color:#FAFAF8 !important;
  margin:0 0 16px;
  padding:0 0 8px;
  font-size:22px !important;
  font-weight:400 !important;
  letter-spacing:.1em;
  border-bottom:1px solid rgba(245,196,0,.15) !important;
  border-bottom-color:rgba(245,196,0,.15) !important;
  border-bottom-width:1px !important;
  border-bottom-style:solid !important;
  display:block;
  position:relative;
}

/* 댓글 */
.comment-media .photo i { background:#1C1C1C; padding:15px; border-radius:50%; width:64px; height:64px; text-align:center; color:#888; font-size:30px; display:inline-block; }
.comment-media .photo img { border-radius:50%; width:64px !important; height:64px !important; display:inline-block; }
.view-mobile .comment-media .photo i { padding:10px; width:54px; height:54px; }
.view-mobile .comment-media .photo img { width:54px !important; height:54px !important; }
.comment-media .media { border-top:1px solid rgba(255,255,255,.05); margin:7px 0; padding:7px 0 0; }
.comment-media :first-child.media { border-top:0; margin-top:0; padding-top:0; }
.comment-media h5 { margin:2px 0; line-height:22px; color:#FAFAF8; }
.comment-media .media .media-body { padding-left:0; color:#888880; }
.comment-media .media .media-info { margin-left:10px; }
.comment-media .media .media-content { margin-top:8px; }
.comment-media .media .media-btn { margin-left:4px; }
.comment-media .cmt-good-btn { text-align:right; padding-right:1px; }
.comment-media .cmt-good,
.comment-media .cmt-nogood { display:inline-block; width:74px; height:20px; margin-top:10px; padding-right:10px; margin-right:-1px; font:bold 11px verdana; text-align:right; letter-spacing:-1px; line-height:19px; cursor:pointer; }
.comment-media .cmt-good { background:url('./img/cmt_good.gif') no-repeat left center; color:#F5C400; }
.comment-media .cmt-nogood { background:url('./img/cmt_nogood.gif') no-repeat left center; color:#888; }

/* 댓글 폼 */
#bo_vc_opt ol { margin:0; padding:0; list-style:none; }
#bo_vc_opt ol li { float:left; margin:0; }
#bo_vc_send_sns ul { margin:0; padding:0; list-style:none; }
#bo_vc_send_sns ul li { float:left; margin:0 0 0 20px; }
#bo_vc_send_sns input { margin:0 0 0 5px; }
.comment-media .form-control {
  background:#0D0D0D !important;
  border:1px solid rgba(245,196,0,.15) !important;
  color:#FAFAF8 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.comment-media .form-control:focus { border-color:rgba(245,196,0,.5) !important; box-shadow:none !important; }

/* ─── 쓰기 폼 ─── */
.write-wrap {
  width:100%;
  overflow:hidden;
  padding:0 48px 64px;
  max-width:1280px;
  margin:0 auto;
}
.write-wrap h2 { padding:0; margin:0 0 20px; font-size:22px; font-weight:400; font-family:'Black Han Sans',sans-serif; color:#FAFAF8; letter-spacing:.05em; }
.write-wrap label { font-weight:bold; margin-top:4px; color:#888880; }
.write-wrap .form-control {
  background:#0D0D0D !important;
  border:1px solid rgba(245,196,0,.15) !important;
  color:#FAFAF8 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.write-wrap .form-control:focus { border-color:rgba(245,196,0,.5) !important; box-shadow:none !important; }
.write-wrap .write-content { height:300px; }
.write-wrap .write-file { border:0; box-shadow:none; }
.write-wrap .write-btn { margin:15px 0 25px; text-align:center; }
.write-wrap .delete-file { margin:0; padding:0 10px; font-weight:normal; }
.write-wrap .delete-file label { font-weight:normal; }
.write-wrap .sp-label { font-weight:normal; margin-right:10px; }
.write-wrap .sp-label input[type="checkbox"],
.write-wrap .sp-label input[type="radio"] { margin-top:0; accent-color:#F5C400; }
.write-wrap .table { border-color:rgba(245,196,0,.1) !important; }
.write-wrap .table th { background:#1C1C1C !important; color:#888880 !important; border-color:rgba(245,196,0,.1) !important; }
.write-wrap .table td { border-color:rgba(255,255,255,.05) !important; color:#FAFAF8; background:transparent; }

/* 자동저장 팝업 */
#autosave_pop div { text-align:right; }
#autosave_pop button { margin:0; margin-left:10px; padding:0; border:0; background:transparent; color:#888880; }
#autosave_pop ul { margin:0; padding:0; padding-left:15px; list-style:disc; }
#autosave_pop li { padding:2px 5px; }
#autosave_pop a { display:block; float:left; color:#F5C400; }
#autosave_pop span { display:block; float:right; }

/* SNS */
#bo_v_sns { margin:4px 0 15px; padding:0; list-style:none; zoom:1; }
#bo_v_sns:after { display:block; visibility:hidden; clear:both; content:""; }
#bo_v_sns li { float:left; margin:0 5px 0 0; }

/* 공통 테이블 (게시판 내 테이블) */
.board-list .table,
.view-wrap .table {
  border-color: rgba(245,196,0,.1) !important;
  color: #FAFAF8;
}
.board-list .table th,
.view-wrap .table th {
  background: #1C1C1C !important;
  border-color: rgba(245,196,0,.1) !important;
  color: #888880 !important;
}
.board-list .table td,
.view-wrap .table td {
  border-color: rgba(255,255,255,.05) !important;
  background: transparent;
  color: #FAFAF8;
}

/* ─── 반응형 ─── */
@media all and (max-width:960px) {
  .board-list { padding:24px 20px 40px; }
  .view-wrap { padding:0 20px 40px; }
  .write-wrap { padding:0 20px 40px; }
}
@media all and (max-width:460px) {
  .board-list { padding:16px 12px 32px; }
  .view-wrap { padding:0 12px 32px; }
  .write-wrap { padding:0 12px 32px; }
  .responsive .list-btn { text-align:center; margin:0 auto; }
  .responsive .pull-right.list-btn { float:none !important; margin-bottom:14px; }
  .responsive .view-wrap h1 { font-size:20px; line-height:1.4; margin-bottom:10px; }
  .responsive .view-wrap h1 .photo { display:none; }
  .responsive .view-btn i { margin-right:0; }
  .responsive .view-author .auth-photo { float:none; width:100%; padding-right:0; }
  .responsive .comment-btn { text-align:center; }
  .responsive .comment-btn .pull-right { float:none !important; }
}