@charset "utf-8";

/* 모바일 목록 */
@media all and (max-width:767px) {
	.responsive #bo_list .float-left.float-md-none {
		margin-right:1.0rem;
	}
	.responsive #bo_list .na-title {
		margin-bottom:0.14rem;
	}
}

/* 게시판 읽기 */
#bo_v_title {
	font-size:23px;
	font-weight:bold;
	line-height:1.4;
	letter-spacing:-1px;
}
#bo_v_con {
	min-height:200px; 
	word-break:break-all;
	overflow:hidden
}
@media all and (max-width:575px) {
	.responsive #bo_v_title {
		font-size:20px;
		line-height:1.5;
	}
	.responsive #bo_v_con { 
		min-height:140px; 
	}
}

#bo_v_con img {
	max-width:100%;
	height:auto
}
#bo_v_img {
	width:100%;
	text-align:center;
	overflow:hidden;
	zoom:1;
}
#bo_v_img:after {
	display:block;
	visibility:hidden;
	clear:both;
	content:"";
}
#bo_v_img a.view_image {
	display:block;
}
#bo_v_img img {
	margin-bottom:1.0rem;
}

/* 게시판 읽기 : SNS 공유 */
#bo_v_sns_icon { 
	margin:-5px auto; 
}
#bo_v_sns_icon img { 
	width:40px; 
	border-radius:50%; 
	margin:5px;
}

/* 게시판 댓글 : 내용 */
.cmt-reply {
	top:0;
	left:-16px;
}
.by-writer {
	background:rgba(43,107,255,.07) !important;
	border-top:1px solid rgba(43,107,255,.25) !important;
}
.cmt-content {
	word-break:break-all;
	overflow:hidden
}
.cmt-content img {
	max-width:100%;
	height:auto
}

/* 게시판 댓글 : 대댓글, 수정, 삭제 */
.cmt-btn ul { 
	list-style: none; 
	margin: 0; 
}
.cmt-btn ul > li { 
	float: left; 
	font-size:12px;
	padding: 0 10px; 
}
.cmt-btn ul > li::before { 
	float: left; 
	color:#ccc; 
	content: "|"; 
	margin-left:-12px;
}
.cmt-btn ul > li:last-child { 
	padding-right:0;
}
.cmt-btn ul > li:first-child::before, 
.cmt-btn ul > li.no-bar::before { 
	content: ""; 
	margin-left:0; 
}
.cmt-btn ul > li > a { 
	float:left;
	color:#888;
	white-space:nowrap;	
}

/* 게시판 댓글 : 쓰기폼 */
#fviewcomment #wr_content { 
	resize:none; 
}
@media all and (max-width:575px) {
	.responsive .cmt-box {
		border-right:0 !important;
	}
	.responsive #bo_vc_w .cmt-box {
		border-left:0 !important;
		border-radius:0 !important;
	}
	.responsive #bo_vc_login {
		border-left:0 !important;
		border-right:0 !important;
		border-radius:0 !important;
	}
}

/* 게시판 댓글 : SNS 등록 */
#bo_vc_opt ol {
	margin:0;
	padding:0;
	list-style:none;
	zoom:1;
	background:#26282e;
	border-radius:3px;
}
#bo_vc_opt ol:after { 
	display:block;
	visibility:hidden;
	clear:both;
	content:""; 
}
#bo_vc_opt ol li { 
	float:left;
	margin:0; 
}
#bo_vc_send_sns ul { 
	margin:0;
	padding:0;
	list-style:none;
	zoom:1; 
}
#bo_vc_send_sns ul:after { 
	display:block;
	visibility:hidden;
	clear:both;
	content:""; 
}
#bo_vc_send_sns ul li {	
	float:left;
	margin:0 1.0rem 0 0;
}
#bo_vc_send_sns input {	
	margin:0 0 0 0.5rem;
}

/* 게시판 쓰기 */
#bo_w .list-group-item {
	padding-left:0;
	padding-right:0;
	border-left:0;
	border-right:0;
}
#bo_w #wr_content { 
	margin-bottom:1.0rem !important;
}
@media all and (max-width:575px) {
	#bo_w .list-group-item {
		padding-left:1.0rem;
		padding-right:1.0rem;
	}
	.responsive #bo_w #wr_content {
		max-height:160px !important;
	}
}

/* =========================================================
   FRIENDS COMPANY 게시판 다크 스킨 — 딥블루(#2b6bff) + 시안(#38e1ff)
   리스트 · 뷰 · 글쓰기 · 댓글
   ========================================================= */
#bo_list_wrap, #bo_v, #bo_w{ max-width:1300px; margin:0 auto; }

/* 카테고리 탭 */
.board-tab{ border:1px solid rgba(255,255,255,.08); border-radius:12px; overflow:hidden; margin:24px auto; max-width:1300px; }
.board-tab .tab{ font-size:15px; padding:13px 0; color:#b6bbc6; border-right:1px solid rgba(255,255,255,.08); background:#202227; transition:.15s; }
.board-tab .tab a{ color:inherit; }
.board-tab .tab:hover{ background:#26282e; }
.board-tab .tab.active{ background:#2b6bff; color:#fff; font-weight:700; }
.board-tab .tab.active a{ color:#fff; }

/* 리스트 헤더 / 행 */
#bo_list .table-head, #bo_list .na-table.table-head{ background:#202227 !important; color:#eceef2; font-weight:700; border:0; border-radius:10px; }
#bo_list .table-head a, #bo_list .na-table.table-head a{ color:#eceef2; }
#bo_list .na-table-head{ border:0 !important; }
#bo_list .na-table > li{ border-bottom:1px solid rgba(255,255,255,.06); }
#bo_list li:nth-of-type(even){ background:rgba(255,255,255,.015); }
#bo_list .d-md-table-row:hover{ background:rgba(255,255,255,.035); }
#bo_list_total div{ color:#5c8dff; font-weight:700; }
.na-subject{ color:#d7dae2; }
a.na-subject:hover{ color:#fff; }
.na-text.text-primary{ color:#5c8dff !important; }
.na-notice{ background:#2b6bff !important; color:#fff !important; font-weight:700; border-radius:5px; padding:.12rem .5rem; }

/* 버튼 (게시판 영역 한정) */
#bo_list_wrap .btn-basic, #bo_v .btn-basic, #bo_w .btn-basic{ color:#e5e8ee; border:1px solid #4a4e59; background:#2b2e35; }
#bo_list_wrap .btn-basic:hover, #bo_v .btn-basic:hover, #bo_w .btn-basic:hover{ background:#383c45; border-color:#565b66; color:#fff; }

/* 뷰(읽기) */
#bo_v_title{ color:#fff; padding-bottom:14px; border-bottom:1px solid rgba(255,255,255,.08); }
#bo_v .border-bottom, #bo_v .border-top{ border-color:rgba(255,255,255,.08) !important; }
#bo_v_con{ color:#c6cad4; line-height:1.85; }
#bo_v_info .text-muted{ color:#868c99 !important; }
.cmt-btn ul > li > a:hover{ color:#5c8dff; }

/* 글쓰기 */
#bo_w .list-group-item.bg-primary{ background:#2b6bff !important; border-color:#2b6bff !important; }
#bo_w h5.font-weight-bold{ color:#fff; }
#bo_w .col-form-label{ color:#cfd3dd; font-weight:600; }
#bo_w .custom-control-label, #bo_w .custom-control-label span{ color:#b6bbc6; }
#bo_w .btn-basic i{ color:#d7dae2; }
#bo_w .btn-basic .text-muted{ color:#b6bbc6 !important; }
#bo_w .form-control-plaintext{ color:#b6bbc6; }

/* 갤러리 / 웹진 카드 */
.img-wrap.bg-light{ background:#202227 !important; border:1px solid rgba(255,255,255,.08); overflow:hidden; }
.img-render{ transition:transform .3s, opacity .3s; }
.img-item:hover .img-render, .card:hover .img-render{ transform:scale(1.04); }
.card-title{ color:#eceef2; }
.card:hover .card-title{ color:#5c8dff; }
.na-round{ border-radius:10px; }

/* 뷰 하단: 첨부파일 / 이전·다음글 */
#bo_v .d-table-row .bg-light{ background:#202227 !important; }
#bo_v .d-table-row a{ color:#b6bbc6; }
#bo_v .d-table-row a:hover{ color:#5c8dff; text-decoration:none; }

/* =========================================================
   다크 스킨 v2 — 부트스트랩/나리야 기본(흰 배경) 완전 오버라이드
   리스트 · 뷰 · 글쓰기 · 댓글 · 검색 · 페이징
   ※ 기본스타일(BS4 white)과 충돌 방지: 게시판 래퍼 스코프 + !important
   ========================================================= */

/* ── 0) 경계선 일괄 다크 (버튼 테두리는 아래에서 재선언) ── */
#bo_list_wrap [class*="border"], #bo_list [class*="border"], #bo_v [class*="border"],
#bo_w [class*="border"], #bo_vc [class*="border"], #bo_vc_w [class*="border"], #bo_search [class*="border"]{
	border-color:rgba(255,255,255,.09) !important;
}

/* ── 1) 흰 배경 계열 전부 다크 ── */
#bo_list_wrap .bg-white, #bo_list .bg-white, #bo_v .bg-white, #bo_w .bg-white, #bo_search .bg-white,
#bo_list_wrap .bg-light, #bo_list .bg-light, #bo_v .bg-light, #bo_w .bg-light, #bo_vc .bg-light, #bo_vc_w .bg-light{
	background-color:#202227 !important;
}
#bo_w .list-group-item{ background:transparent !important; border-color:rgba(255,255,255,.09) !important; }
#bo_list_wrap .alert{ background:#202227; border:1px solid rgba(255,255,255,.09); color:#c6cad4; }

/* ── 2) 입력요소 (인풋/셀렉트/텍스트영역/파일) ── */
#bo_list_wrap .form-control, #bo_v .form-control, #bo_w .form-control, #bo_vc .form-control, #bo_vc_w .form-control, #bo_search .form-control,
#bo_list_wrap .custom-select, #bo_v .custom-select, #bo_w .custom-select, #bo_search .custom-select,
#bo_w .custom-file-label{
	background-color:#1c1d22 !important; color:#e5e8ee !important;
	border-color:rgba(255,255,255,.14) !important; box-shadow:none !important;
}
#bo_w .form-control:focus, #bo_search .form-control:focus, #bo_vc_w .form-control:focus, #bo_v .form-control:focus{
	border-color:#2b6bff !important; box-shadow:0 0 0 .18rem rgba(43,107,255,.25) !important;
}
#bo_w .form-control::placeholder, #bo_search .form-control::placeholder, #bo_vc_w .form-control::placeholder{ color:#6a707d !important; }
/* 셀렉트 화살표: 밝은 색으로 교체(다크 배경에서 안 보이는 문제) */
#bo_list_wrap .custom-select, #bo_v .custom-select, #bo_w .custom-select, #bo_search .custom-select{
	background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23b6bbc6' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") !important;
	background-repeat:no-repeat !important; background-position:right .75rem center !important; background-size:8px 10px !important;
}
/* 파일 첨부: 찾아보기 버튼 블루 */
#bo_w .custom-file-label::after{ background:#2b6bff !important; color:#fff !important; border:0 !important; }
#bo_w .input-group-text, #bo_search .input-group-text{ background:#26282e !important; color:#b6bbc6 !important; border-color:rgba(255,255,255,.14) !important; }
#bo_w .form-control-plaintext{ color:#b6bbc6 !important; }

/* ── 3) 체크박스/라디오 ── */
#bo_list_wrap .custom-control-label::before, #bo_w .custom-control-label::before{
	background-color:#1c1d22 !important; border:1px solid rgba(255,255,255,.3) !important;
}
#bo_list_wrap .custom-control-input:checked ~ .custom-control-label::before,
#bo_w .custom-control-input:checked ~ .custom-control-label::before{
	background-color:#2b6bff !important; border-color:#2b6bff !important;
}
#bo_w .custom-control-label, #bo_list_wrap .custom-control-label{ color:#c6cad4 !important; }

/* ── 4) 글쓰기: 라벨/제목/에디터 프레임 ── */
#bo_w .col-form-label{ color:#e5e8ee !important; font-weight:700; }
#bo_w h5, #bo_w .font-weight-bold{ color:#fff; }
#bo_w .f-sm.text-muted, #bo_w .text-muted{ color:#868c99 !important; }
/* 스마트에디터(내부 흰색 유지) — 다크 배경 위 입력창처럼 보이게 프레임 처리 */
#bo_w .smart_editor2, #bo_w #smart_editor2, #bo_w .note-editor{
	border-radius:10px; overflow:hidden; border:1px solid rgba(255,255,255,.16);
}
#bo_w textarea#wr_content{ min-height:280px; }

/* ── 5) 리스트: 정렬 드롭다운/관리 버튼/빈 목록 ── */
#bo_list_wrap .btn-group-vertical.bg-white .btn{ color:#d7dae2; }
#bo_list_wrap .btn-group-vertical.bg-white .btn:hover{ background:#26282e; color:#fff; }
#bo_list_wrap .btn_b01, #bo_v .btn_b01, #bo_list_wrap .btn_admin{ color:#b6bbc6; }
#bo_list_wrap .btn_b01:hover, #bo_v .btn_b01:hover{ color:#fff; }
#bo_list .text-muted, #bo_list_wrap .text-muted, #bo_v .text-muted, #bo_vc .text-muted{ color:#868c99 !important; }
#bo_list_wrap .close, #bo_search .close{ color:#fff; text-shadow:none; opacity:.6; }
#bo_list_wrap .close:hover{ opacity:1; }

/* ── 6) 버튼 재선언 (경계선 일괄 다크보다 우선) ── */
#bo_list_wrap .btn-basic, #bo_v .btn-basic, #bo_w .btn-basic, #bo_vc_w .btn-basic{
	color:#e5e8ee !important; border:1px solid #4a4e59 !important; background:#2b2e35 !important;
}
#bo_list_wrap .btn-basic:hover, #bo_v .btn-basic:hover, #bo_w .btn-basic:hover, #bo_vc_w .btn-basic:hover{
	background:#383c45 !important; border-color:#565b66 !important; color:#fff !important;
}
#bo_list_wrap .btn-primary, #bo_v .btn-primary, #bo_w .btn-primary, #bo_search .btn-primary{
	background:linear-gradient(140deg,#2b6bff,#1a3fa8) !important; border-color:#2b6bff !important; color:#fff !important;
}
#bo_list_wrap .btn-primary:hover, #bo_v .btn-primary:hover, #bo_w .btn-primary:hover{
	filter:brightness(1.1); box-shadow:0 0 16px rgba(43,107,255,.5);
}

/* ── 7) 페이징 (BS4 pagination) ── */
#nt_body .pagination .page-link{
	background:#202227 !important; border-color:rgba(255,255,255,.1) !important; color:#b6bbc6 !important; box-shadow:none !important;
}
#nt_body .pagination .page-link:hover{ background:#26282e !important; color:#fff !important; }
#nt_body .pagination .page-item.active .page-link,
#nt_body .pagination .active > .page-link{
	background:linear-gradient(140deg,#2b6bff,#1a3fa8) !important; border-color:#2b6bff !important; color:#fff !important;
}
#nt_body .pagination .page-item.disabled .page-link{ background:#1c1d22 !important; color:#5c626e !important; }

/* ── 8) 뷰: 본문/정보/이전다음/댓글 ── */
#bo_v_title{ color:#fff !important; }
#bo_v_con{ color:#c6cad4 !important; }
#bo_v_con a{ color:#5c8dff; }
#bo_v .d-table-row a{ color:#c6cad4; }
#bo_v .d-table-row a:hover{ color:#5c8dff; }
#bo_vc_w .cmt-box, #bo_vc .cmt-box{ background:#1c1d22 !important; }

/* ── 9) 스마트에디터 입력영역: 항상 흰 배경 강제
      (iframe 배경이 투명이라 다크 배경이 비쳐 검정 글자가 안 보이는 문제) ── */
#bo_w #smart_editor2 iframe, #bo_w .smart_editor2 iframe, #bo_w iframe{ background:#fff !important; }
#bo_w #smart_editor2 textarea, #bo_w .smart_editor2 textarea{ background:#fff !important; color:#111 !important; }

/* ── 10) 글쓴이 이름(sv_member/sv_guest) — css/default.css(#333) 오버라이드 ── */
#nt_body .sv_member, #nt_body .sv_guest, #nt_body a.sv_member{ color:#c6cad4 !important; }
#bo_list .sv_member:hover, #bo_v .sv_member:hover{ color:#fff !important; }
/* 사이드뷰 드롭다운(회원메뉴) 내부 링크는 흰색 유지 */
#nt_body .sv_wrap .sv a{ color:#fff !important; }