@charset "utf-8";

/* ==========================================================
   HUSS 교과프로그램 게시판 공용 (huss_cv · huss_rc)
   연도 선택 · 관리자 메뉴 · 빈 목록 · 쓰기 폼
   목록 디자인 자체는 /css/sub.css 의 .edu / .cv_* / .rc_* 를 그대로 쓴다.
   ========================================================== */

/* ---------- 연도 선택 (융합교육과정 : 2개 연도 이상일 때만 노출) ---------- */
.hb_year{display:flex; justify-content:center; flex-wrap:wrap; gap:6px; margin:-20px 0 30px;}
.hb_year a{display:inline-flex; align-items:center; height:42px; padding:0 22px; border:1px solid #dcebf5; border-radius:100px; background:#fff; font-size:15px; font-weight:800; color:#4b5468; transition:all .3s ease;}
.hb_year a:hover, .hb_year a:focus-visible{border-color:#246ba5; color:#246ba5;}
.hb_year a.on{border-color:#204c75; background:#204c75; color:#fff;}

/* ---------- 관리자 메뉴 ---------- */
.hb_admbar{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin:0 0 20px; padding:14px 16px 14px 22px; border:1px dashed #c4dcee; border-radius:20px; background:#fff;}
.hb_admbar p{display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:14px; color:#7b8497;}
.hb_admbar p i{font-size:18px; color:#246ba5;}
.hb_admbar p b{font-weight:800; color:#204c75;}
.hb_admbar .btns{display:flex; flex-wrap:wrap; gap:6px;}

.edu .hb_chkall{display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:600; color:#4b5468; cursor:pointer;}
.edu .hb_chkall input{width:17px; height:17px; margin:0; accent-color:#246ba5;}
.edu .hb-selbtns{gap:12px;}

/* ---------- 빈 목록 ---------- */
.edu .hb_empty{padding:80px 20px; border:1px dashed #dcebf5; border-radius:24px; text-align:center;}
.edu .hb_empty i{font-size:46px; color:#c4dcee;}
.edu .hb_empty p{margin-top:8px; font-size:17px; color:#7b8497;}

/* ==========================================================
   쓰기 폼
   ========================================================== */
.hb_w{max-width:960px; margin:0 auto; padding-bottom:140px; color:#204c75; word-break:keep-all;}
.hb_w_head{margin-bottom:30px; padding-bottom:24px; border-bottom:2px solid #204c75;}
.hb_w_head em{display:block; font-style:normal; font-size:13px; font-weight:700; color:#246ba5; letter-spacing:2px; text-transform:uppercase;}
.hb_w_head h3{margin:6px 0 0; font-size:30px; font-weight:800; letter-spacing:-1px; color:#204c75;}
.hb_w_head p{margin-top:8px; font-size:14px; color:#7b8497; line-height:1.6;}
.hb_w_head p b{color:#204c75;}
.hb_w .req{color:#d64545; font-weight:800;}

.hb_w_grid{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:22px 24px;}
.hb_w_row{min-width:0;}
.hb_w_row.full{grid-column:1 / -1;}
.hb_w_row > label, .hb_w_row > .lb{display:block; margin-bottom:8px; font-size:15px; font-weight:700; color:#204c75;}
.hb_w input[type="text"], .hb_w input[type="number"], .hb_w select, .hb_w textarea{width:100%; height:52px; margin:0; padding:0 16px; border:1px solid #dcebf5; border-radius:14px; background:#fff; box-shadow:none; font-family:inherit; font-size:15px; color:#204c75; outline:none; transition:border-color .3s ease, box-shadow .3s ease; -webkit-appearance:none; appearance:none;}
.hb_w select{padding-right:40px; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2316264f' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") no-repeat right 18px center; cursor:pointer;}
.hb_w textarea{height:auto; min-height:180px; padding:14px 16px; line-height:1.7; resize:vertical;}
.hb_w input:focus, .hb_w select:focus, .hb_w textarea:focus{border-color:#246ba5; box-shadow:0 0 0 3px rgba(36,107,165,.12);}
.hb_w input::placeholder, .hb_w textarea::placeholder{color:#9aa3b5;}
.hb_w .help{margin-top:6px; font-size:13px; color:#7b8497; line-height:1.5;}

.hb_w_unit{position:relative;}
.hb_w_unit input{padding-right:60px !important;}
.hb_w_unit span{position:absolute; right:18px; top:50%; transform:translateY(-50%); font-size:14px; font-weight:700; color:#7b8497;}

.hb_w_radio{display:flex; flex-wrap:wrap; gap:6px;}
.hb_w_radio label{cursor:pointer;}
.hb_w_radio input{position:absolute; width:1px; height:1px; opacity:0;}
.hb_w_radio span{display:inline-flex; align-items:center; height:52px; padding:0 22px; border:1px solid #dcebf5; border-radius:100px; background:#fff; font-size:15px; font-weight:700; color:#4b5468; transition:all .25s ease;}
.hb_w_radio label:hover span{border-color:#246ba5; color:#246ba5;}
.hb_w_radio input:checked + span{border-color:#246ba5; background:#246ba5; color:#fff;}
.hb_w_radio input:focus-visible + span{outline:3px solid #348bc1; outline-offset:2px;}

.hb_w_switch{display:flex; align-items:center; gap:8px; min-height:52px; font-size:15px; font-weight:600; color:#4b5468; cursor:pointer;}
.hb_w_switch input{width:20px; height:20px; margin:0; accent-color:#246ba5;}


/* ---------- 반응형 ---------- */
@media (max-width: 767px){
	.hb_admbar{padding:14px;}
	.hb_admbar p span{display:none;}
	.hb_w_head h3{font-size:24px;}
	.hb_w_grid{grid-template-columns:minmax(0, 1fr); gap:18px;}
	.hb_w_radio span{height:46px; padding:0 18px;}
}