@charset "utf-8";
/* ============================================================
   Run to Me · 블로그(news) · 공지사항(notice) 브랜드 스킨
   기존 style.css 위에 덧입히는 오버라이드
   ============================================================ */

:root{
	--rm-rose:      #B05C74;
	--rm-rose-deep: #8E4459;
	--rm-rose-soft: #C98195;
	--rm-tint:      #F6E4E9;
	--rm-bg:        #FDF7F8;
	--rm-sand:      #E5B98C;
	--rm-sand-soft: #FAEBDC;
	--rm-ink:       #4A3036;
	--rm-muted:     #8A7076;
	--rm-line:      #F0E0E4;
}

/* ── 공통 : 목록 상단 ───────────────────────────────── */
#bo_list, #bo_gall{ color:var(--rm-ink); }

#bo_btn_top{ display:flex; align-items:center; flex-wrap:wrap; gap:10px;
	padding:0 0 16px; margin-bottom:22px; border-bottom:2px solid var(--rm-tint); }
#bo_list_total{ font-size:14px; color:var(--rm-muted); letter-spacing:-.3px; }
#bo_list_total span{ color:var(--rm-rose); font-weight:500; }
.btn_bo_user{ margin-left:auto; display:flex; gap:8px; }
.btn_bo_user li{ list-style:none; }

/* ── 공통 : 버튼 ────────────────────────────────────── */
/* 기존 .btn 은 height/line-height 가 고정(30px·45px)이라 스킨마다 달랐다.
   높이·행간·여백을 한 번에 다시 잡아 글자를 정확히 가운데 놓는다. */
.btn_b01, .btn_b02, .btn_b03, .btn_admin, .btn_cancel, .btn_submit,
.btn_b01.btn, .btn_b02.btn, .btn_b03.btn, .btn_admin.btn, .btn_cancel.btn{
	box-sizing:border-box !important;
	height:38px !important; min-height:38px !important;
	padding:0 16px !important;
	line-height:36px !important;
	font-size:13px !important; font-weight:500;
	border-radius:8px !important;
	vertical-align:middle !important;
	text-align:center;
	transition:all .18s; }

/* a 태그 버튼은 아이콘이 같이 들어가므로 flex 로 정렬한다 */
a.btn_b01, a.btn_b02, a.btn_b03, a.btn_admin, a.btn_cancel{
	display:inline-flex !important; align-items:center; justify-content:center;
	gap:6px; line-height:1 !important; }
.btn_b01 i, .btn_b02 i, .btn_b03 i, .btn_admin i, .btn_cancel i{
	line-height:1 !important; font-size:13px; margin:0 !important; }

/* input[type=submit] 은 flex 가 안 먹으므로 행간으로 중앙 정렬 */
input.btn_b01, input.btn_b02, input.btn_b03, input.btn_submit{
	display:inline-block !important; line-height:36px !important; }

.btn_b01, .btn_b01.btn{
	background:#fff !important; color:var(--rm-rose) !important;
	border:1px solid var(--rm-rose-soft) !important; }
.btn_b01:hover{ background:var(--rm-tint) !important; border-color:var(--rm-rose) !important; }

.btn_b02, .btn_b02.btn, .btn_submit{
	background:var(--rm-rose) !important; color:#fff !important;
	border:1px solid var(--rm-rose) !important; }
.btn_b02:hover, .btn_submit:hover{ background:var(--rm-rose-deep) !important; border-color:var(--rm-rose-deep) !important; }

.btn_b03, .btn_admin, .btn_cancel{
	background:#fff !important; color:var(--rm-muted) !important;
	border:1px solid var(--rm-line) !important; }
.btn_b03:hover, .btn_admin:hover, .btn_cancel:hover{ background:var(--rm-bg) !important; color:var(--rm-ink) !important; }

/* ── 공통 : 카테고리 ─────────────────────────────────── */
#bo_cate h2{ display:none; }
#bo_cate_ul{ display:flex; flex-wrap:wrap; gap:8px; padding:0 0 20px; margin:0; }
#bo_cate_ul li{ list-style:none; }
#bo_cate_ul a{ display:inline-block; padding:7px 16px; border-radius:20px;
	background:#fff; border:1px solid var(--rm-line); color:var(--rm-muted);
	font-size:13px; transition:all .18s; }
#bo_cate_ul a:hover{ border-color:var(--rm-rose-soft); color:var(--rm-rose); }
#bo_cate_ul a#bo_cate_on, #bo_cate_ul .bo_cate_on{
	background:var(--rm-rose) !important; border-color:var(--rm-rose) !important; color:#fff !important; }
.bo_cate_link{ display:inline-block; padding:2px 10px; margin-right:8px; border-radius:14px;
	background:var(--rm-sand-soft); color:#85552B; font-size:11px; font-weight:500; }

/* ── 블로그(news) : 카드 ─────────────────────────────── */
.card{ background:#fff; border:1px solid var(--rm-line) !important; border-radius:14px !important;
	overflow:hidden; box-shadow:none !important; transition:transform .2s, border-color .2s; }
.card:hover{ transform:translateY(-3px); border-color:var(--rm-rose-soft) !important; }
.card img{ width:100%; display:block; }
.card-content{ padding:18px 20px 20px !important; }
.card-title{ font-size:16px !important; font-weight:500 !important; line-height:1.5;
	color:var(--rm-ink) !important; margin:0 0 10px !important; }
.card-title a{ color:var(--rm-ink) !important; }
.card:hover .card-title a{ color:var(--rm-rose) !important; }
.card-content p{ color:var(--rm-muted); font-size:13px; line-height:1.7; }
.card-read-more{ border-top:1px solid var(--rm-line) !important; background:var(--rm-bg) !important; }
.card-read-more .btn{ color:var(--rm-rose) !important; font-size:13px; }
.card-position{ margin-bottom:24px; }
.gall_date, .gall_name{ color:#A08D94 !important; font-size:11px !important; }
.cnt_cmt{ display:inline-block !important; min-width:20px; padding:1px 8px !important;
	border-radius:10px !important; background:var(--rm-tint) !important;
	color:var(--rm-rose-deep) !important; font-size:11px !important; font-weight:500; }

/* ── 공지사항(notice) : 목록 행 ──────────────────────── */
#bo_list .clearfix.pr.bl{ display:flex; align-items:center; gap:14px;
	padding:16px 12px !important; border-bottom:1px solid var(--rm-line) !important;
	transition:background .18s; }
#bo_list .clearfix.pr.bl:hover{ background:var(--rm-bg); }
.e_num{ flex:0 0 54px; text-align:center; color:#B5A5AB; font-size:13px; }
.e_num .notice_icon{ display:inline-block; padding:3px 9px; border-radius:12px;
	background:var(--rm-rose); color:#fff; font-size:11px; font-weight:500; }
.e_num .bo_current{ color:var(--rm-rose); font-weight:500; font-size:12px; }
.e_subject{ flex:1 1 auto; min-width:0; }
.e_subject a{ color:var(--rm-ink) !important; font-size:15px; letter-spacing:-.3px; }
.e_subject a:hover{ color:var(--rm-rose) !important; text-decoration:underline; }
.e_name, .e_date{ flex:0 0 auto; color:#A08D94 !important; font-size:12px !important; }
.e_num_ti, .e_date_ti, .e_name_ti{ color:var(--rm-muted) !important; font-size:12px !important; font-weight:500; }

/* ── 공통 : 본문 보기 ───────────────────────────────── */
#bo_v{ color:var(--rm-ink); }
#bo_v_title, .bo_v_tit{ font-size:24px !important; font-weight:500 !important; line-height:1.45;
	color:var(--rm-ink) !important; padding:0 0 16px !important; margin:0 0 16px !important;
	border-bottom:2px solid var(--rm-tint) !important; letter-spacing:-.5px; }
#bo_v_info{ padding:0 0 18px !important; margin:0 0 22px !important;
	border-bottom:1px solid var(--rm-line) !important; color:#A08D94 !important; font-size:13px !important; }
#bo_v_info strong{ color:var(--rm-muted) !important; font-weight:400 !important; }
#bo_v_atc{ min-height:200px; padding:6px 0 30px !important; line-height:1.85; font-size:15px; color:#3E3439; }
#bo_v_atc img{ max-width:100%; height:auto; border-radius:8px; }
#bo_v_con{ line-height:1.85; }
.bo_v_cate{ display:inline-block; padding:3px 12px; border-radius:14px;
	background:var(--rm-tint); color:var(--rm-rose-deep); font-size:12px; }

#bo_v_file{ border:1px solid var(--rm-line); border-radius:10px; padding:6px 14px; margin-bottom:20px; background:var(--rm-bg); }
#bo_v_file a{ color:var(--rm-rose) !important; font-size:13px; }
#bo_v_top, #bo_v_bot{ padding:14px 0; }
.bo_v_nb{ border-top:1px solid var(--rm-line); }
.bo_v_nb li{ border-bottom:1px solid var(--rm-line); }
.bo_v_nb a{ color:var(--rm-muted) !important; font-size:14px; }
.bo_v_nb a:hover{ color:var(--rm-rose) !important; }
.btn_prv, .btn_next{ color:var(--rm-rose) !important; }

/* ── 공통 : 댓글 ────────────────────────────────────── */
#bo_vc h2{ font-size:16px; font-weight:500; color:var(--rm-ink); }
#bo_vc article{ padding:16px 4px !important; border-bottom:1px solid var(--rm-line) !important; }
#bo_vc_w{ background:var(--rm-bg); border:1px solid var(--rm-line); border-radius:12px; padding:18px; }
#bo_vc_w textarea, #bo_v_atc textarea{ border:1px solid var(--rm-line) !important; border-radius:8px !important; }

/* ── 공통 : 페이지네이션 ────────────────────────────── */
.pg_wrap{ margin:34px 0 10px; text-align:center; }
.pg{ display:inline-block; }
.pg_page, .pg_current{ display:inline-block; box-sizing:border-box;
	min-width:36px; height:36px; line-height:34px; padding:0 8px !important;
	margin:0 3px !important; border-radius:8px; font-size:13px; text-align:center; float:none !important; }
.pg_page{ background:#fff !important; border:1px solid var(--rm-line) !important; color:var(--rm-muted) !important; }
.pg_page:hover{ border-color:var(--rm-rose-soft) !important; color:var(--rm-rose) !important; }
.pg_current{ background:var(--rm-rose) !important; border:1px solid var(--rm-rose) !important; color:#fff !important; }

/* ── 공통 : 검색 ────────────────────────────────────── */
#bo_sch{ margin:26px 0 0; text-align:center; }
#bo_sch select, #bo_sch input[type=text]{ height:40px; border:1px solid var(--rm-line) !important;
	border-radius:8px !important; padding:0 12px; font-size:14px; color:var(--rm-ink); }
#bo_sch .btn_submit{ height:40px; }

/* ── 레이아웃 보정 : 기존 float 구조와의 충돌 정리 ──── */
#bo_list_total{ float:none !important; background:none !important; padding:0 !important;
	border-radius:0 !important; line-height:1.6 !important; }

.bo_fx{ float:none !important; display:flex; justify-content:flex-end; align-items:center;
	gap:8px; margin:22px 0 0 !important; }
.bo_fx:after{ content:none !important; }
.btn_bo_user{ float:none !important; margin:0 !important; padding:0 !important; }
.btn_bo_user li{ float:none !important; margin:0 !important; }
#bo_btn_top .btn_bo_user{ margin-left:auto !important; }

#gall_allchk{ display:inline-flex; align-items:center; gap:6px; margin:18px 0 0; padding:0 4px; }
#gall_allchk input[type=checkbox]{ width:16px; height:16px; accent-color:var(--rm-rose); }

#bo_sch{ float:none !important; display:flex; align-items:center;
	width:100%; max-width:560px; margin:30px auto 0 !important; padding:5px !important;
	border:1px solid var(--rm-line) !important; border-radius:28px !important;
	background:#fff !important; box-sizing:border-box;
	transition:border-color .18s, box-shadow .18s; }
#bo_sch:focus-within{ border-color:var(--rm-rose-soft) !important;
	box-shadow:0 0 0 3px rgba(176,92,116,.10); }
#bo_sch form{ display:flex; align-items:center; width:100%; margin:0; }

#bo_sch select{ float:none !important; width:auto !important; height:38px !important;
	margin:0 !important; padding:0 8px 0 14px !important;
	border:0 !important; border-radius:0 !important; outline:0 !important;
	background:transparent !important; box-shadow:none !important;
	color:var(--rm-muted) !important; font-size:13px; cursor:pointer; }

/* 입력칸 안에 또 하나의 박스가 생기지 않도록 테두리·배경·그림자를 모두 제거 */
#bo_sch .sch_input, #bo_sch input[type=text]{ float:none !important; flex:1 1 auto; min-width:0;
	height:38px !important; margin:0 !important; padding:0 14px !important;
	border:0 !important; border-left:1px solid var(--rm-line) !important;
	border-radius:0 !important; outline:0 !important; box-shadow:none !important;
	background:transparent !important; font-size:14px; color:var(--rm-ink); }
#bo_sch .sch_input::placeholder{ color:#B9A7AD; }

/* 아이콘 스프라이트를 걷어내고 글자 버튼으로 되돌린다 */
#bo_sch .sch_btn{ float:none !important; flex:0 0 auto;
	width:auto !important; min-width:74px; height:38px !important;
	margin:0 !important; padding:0 20px !important;
	border:0 !important; border-radius:19px !important;
	background-image:none !important; background-color:var(--rm-rose) !important;
	color:#fff !important; font-size:13px !important; font-weight:500;
	line-height:38px !important; text-indent:0 !important; overflow:visible !important;
	cursor:pointer; transition:background-color .18s; }
#bo_sch .sch_btn:hover{ background-color:var(--rm-rose-deep) !important;
	transform:translateY(-1px); box-shadow:0 6px 14px -4px rgba(176,92,116,.5); }
#bo_sch .sch_btn:active{ transform:translateY(0) scale(.97); transition-duration:.08s; }

.wrapper:after{ content:""; display:block; clear:both; }

/* ── 모바일 ─────────────────────────────────────────── */
@media (max-width:768px){
	#bo_btn_top{ margin-bottom:16px; }
	.btn_bo_user{ margin-left:0; width:100%; }
	#bo_list .clearfix.pr.bl{ flex-wrap:wrap; gap:6px 10px; padding:14px 6px !important; }
	.e_num{ flex:0 0 auto; }
	.e_subject{ flex:1 1 100%; order:3; }
	.e_subject a{ font-size:14px; }
	#bo_v_title, .bo_v_tit{ font-size:20px !important; }
	#bo_v_atc{ font-size:14px; }
	.bo_fx{ flex-wrap:wrap; justify-content:flex-start; }
	#bo_sch{ max-width:100%; }
	#bo_sch select{ padding:0 8px !important; font-size:13px; }
	#bo_sch .sch_input{ padding:0 10px !important; font-size:13px; }
}
