@charset "utf-8";

/* ==========================================================================
   게시판(플라이보드) ↔ 홈페이지 디자인 잇기
   /assets/css/board.css
   --------------------------------------------------------------------------
   싣는 차례가 중요합니다. head.sub.php 에서 이렇게 실립니다.

       1) /css/default.css   플라이보드 기본 (게시판 표·단추·페이징)
       2) /assets/css/site.css  홈페이지 (머리·꼬리·색·글꼴)
       3) 이 파일                두 벌이 부딪히는 곳만 정리

   플라이보드 기본 CSS 는 body 에 글꼴과 크기(0.75em = 12px)를 직접 겁니다.
   그대로 두면 홈페이지 머리·꼬리 글자까지 12px 로 줄어듭니다. 그래서
   body 는 홈페이지 기준으로 되돌리고, **게시판 본문 안에서만** 플라이보드
   기준으로 다시 돌려놓습니다. 스킨들이 em 으로 짜여 있어서 기준 크기만
   맞춰 주면 예전과 똑같이 나옵니다.
   ========================================================================== */

/* 플라이보드 default.css 에 대해 알아 둘 것
   ------------------------------------
   · body{font-size:0.75em} — 홈페이지 머리·꼬리까지 12px 로 줄입니다.
     바로 아래에서 되돌립니다.
   · #hd, #wrapper, #ft {min-width:1200px} — 휴대폰에서 가로 스크롤을
     만드는 값입니다. 다만 새 head.php 가 플라이보드 레이아웃(#wrapper 등)을
     쓰지 않으므로 게시판 화면에는 닿지 않습니다. 390px 폭에서 네 게시판
     모두 넘침이 없는 것을 확인했습니다.
   · .pg_start/.pg_prev/.pg_end/.pg_next 는 배경 그림으로 화살표를 그리는데
     그 그림이 없어 빈 칸이 됩니다. 아래에서 글자로 되돌립니다. */

/* ---------- 1. 홈페이지 기준 되돌리기 ---------- */
body{
  font-size:16px;
  font-family:var(--font);
  color:var(--text);
  line-height:1.6;
  letter-spacing:-.01em;
  background:var(--bg);
}

/* ---------- 2. 게시판이 놓이는 자리 ---------- */
.bbs{padding:54px 0 90px;background:var(--bg)}
/* 위에 큰 머리(히어로)가 있을 때는 제목이 이미 거기 있으므로
   본문을 조금 더 끌어올립니다. (head.php 가 .bbs--hero 를 붙입니다) */
.bbs--hero{padding-top:40px}

.bbs__head{
  padding-bottom:22px;margin-bottom:30px;
  border-bottom:2px solid var(--navy);
}
.bbs__head h1{
  font-size:clamp(24px,3vw,32px);font-weight:900;
  letter-spacing:-.035em;color:var(--text);
}
.bbs__head p{margin-top:10px;font-size:15px;color:var(--text-dim)}

/* ---------- 3. 게시판 본문 — 홈페이지 결에 맞추기 ----------
   예전에는 이 자리에서 본문을 12px 맑은고딕 검정으로 되돌렸습니다.
   게시판만 옛 홈페이지처럼 보이던 이유가 그것입니다. 이제는 반대로,
   홈페이지 글꼴·크기·색으로 맞춥니다.

   네 스킨(basic · live_gallery1 · fund · webzine)이 모두 플라이보드의
   같은 클래스(bo_* · tbl_* · pg_* · btn_*)를 쓰므로 한 벌로 덮습니다.
   스킨 파일은 건드리지 않습니다 — 여기 한 곳만 고치면 넷이 함께 바뀝니다.

   덮어쓰기라 스킨보다 힘이 세야 합니다. 그래서 규칙마다 .bbs__body 를
   앞에 붙였습니다(클래스 두 개 = 스킨의 한 개보다 셉니다). */
.bbs__body{
  font-size:15px;
  font-family:var(--font);
  line-height:1.65;
  letter-spacing:-.01em;
  color:var(--text);
  overflow-x:auto;-webkit-overflow-scrolling:touch;
}
.bbs__body a{color:var(--text);text-decoration:none}
.bbs__body a:hover{color:var(--brand)}

/* site.css 는 그림을 블록으로 깝니다. 게시판 본문 글에 넣은 그림은
   글줄 사이에 들어가는 일이 많아 원래대로 되돌립니다. */
.bbs__body img,
.bbs__body svg{display:inline-block;vertical-align:middle;max-width:100%;height:auto}

/* ── 목록 표 ─────────────────────────────────────────────────────────
   플라이보드 기본 표는 회색 줄 위주라 새 화면에서 헐거워 보입니다.
   머리줄을 연하게 깔고, 줄 간격을 넉넉히 하고, 모서리를 둥글게 합니다. */
.bbs__body .tbl_head01{border-radius:var(--radius-s);overflow:hidden;border:1px solid var(--line)}
.bbs__body .tbl_head01 table{width:100%;border-collapse:collapse;font-size:15px}
.bbs__body .tbl_head01 thead th{
  padding:15px 10px;background:var(--bg-alt);border:0;border-bottom:1px solid var(--line);
  font-size:14px;font-weight:800;color:var(--text-mid);letter-spacing:-.01em;
}
.bbs__body .tbl_head01 tbody td{
  padding:16px 10px;border:0;border-bottom:1px solid var(--line);
  color:var(--text-mid);background:var(--surface);
}
.bbs__body .tbl_head01 tbody tr:last-child td{border-bottom:0}
.bbs__body .tbl_head01 tbody tr:hover td{background:var(--bg-alt)}
.bbs__body .tbl_head01 td.td_subject,
.bbs__body .tbl_head01 .bo_tit{font-size:15.5px;font-weight:700;color:var(--text)}
.bbs__body .tbl_head01 .bo_tit a{color:var(--text)}
.bbs__body .tbl_head01 .bo_tit a:hover{color:var(--brand)}
.bbs__body .td_num,.bbs__body .td_num2,
.bbs__body .td_date,.bbs__body .td_datetime,
.bbs__body .td_name,.bbs__body .td_numbig{font-size:13.5px;color:var(--text-dim)}

/* ── 글 개수 · 쪽 안내 ─────────────────────────────────────────────── */
.bbs__body #bo_list_total,
.bbs__body .bo_list_total{font-size:13.5px;color:var(--text-dim)}

/* ── 쪽 넘김 ─────────────────────────────────────────────────────────
   기본은 작은 네모입니다. 손가락으로 누르기 어려워 크기를 키웁니다. */
.bbs__body .pg_wrap{margin:30px 0 0;text-align:center}
.bbs__body .pg{display:inline-flex;flex-wrap:wrap;gap:6px;justify-content:center}
.bbs__body .pg_page,
.bbs__body .pg_current{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;height:40px;padding:0 12px;border-radius:9px;
  font-size:14px;font-weight:700;border:1px solid var(--line);
  background:var(--surface);color:var(--text-mid);
}
.bbs__body .pg_page:hover{border-color:var(--brand);color:var(--brand)}
.bbs__body .pg_current{background:var(--brand);border-color:var(--brand);color:#fff}

/* ── 단추 ────────────────────────────────────────────────────────────
   글쓰기·목록·수정·삭제가 모두 다른 모양이었습니다. 한 벌로 맞춥니다. */
.bbs__body .btn_b01,.bbs__body .btn_b02,.bbs__body .btn_b03,
.bbs__body .btn_admin,.bbs__body .btn_submit,.bbs__body .btn_cancel,
.bbs__body .btn_confirm input[type="submit"],
.bbs__body input[type="submit"].btn_submit{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:42px;padding:0 18px;border-radius:999px;
  /* 글자를 접지 않습니다. 이것이 없으면 스킨이 폭을 좁게 잡아 둔 자리에서
     '게시판 옵션' 이 세로로 터집니다. */
  white-space:nowrap;
  font-size:14.5px;font-weight:700;line-height:1;border:1px solid var(--field-line);
  background:var(--surface);color:var(--text-mid);cursor:pointer;
  transition:background .14s,color .14s,border-color .14s;
}
.bbs__body .btn_b01:hover,.bbs__body .btn_b02:hover,
.bbs__body .btn_admin:hover{border-color:var(--brand);color:var(--brand);background:var(--bg-alt)}
/* 글쓰기·확인처럼 '지금 할 일' 은 채워진 단추로 */
.bbs__body .btn_b02,
.bbs__body .btn_submit,
.bbs__body input[type="submit"].btn_submit{
  background:var(--brand);border-color:var(--brand);color:#fff;
}
.bbs__body .btn_b02:hover,
.bbs__body .btn_submit:hover{background:var(--brand-strong);border-color:var(--brand-strong);color:#fff}
.bbs__body .btn_bo_user,
.bbs__body .bo_v_com,
.bbs__body .bo_fx{display:flex;flex-wrap:wrap;gap:8px;align-items:center}

/* ── 검색 상자 — 모든 게시판이 같은 모양 (partials/_board-search.php) ───────
   알약 꼴 한 줄: [무엇에서 ▾ | 🔍 검색어 ....... (검색)]
   사이트의 다른 찾기 상자(후원의집 .hssearch)와 같은 테두리 · 포커스 표시를 씁니다.
   예전 스킨의 작은 창(.bo_sch_wrap)과 떠 있는 상자(#bo_sch)는 더 이상 쓰지 않습니다. */
.bsearch{clear:both;display:flex;flex-direction:column;align-items:center;gap:10px;margin:28px 0 12px}
.bsearch .bsearch__box{
  display:flex;align-items:center;width:100%;max-width:560px;min-height:52px;
  border:1px solid var(--field-line);border-radius:999px;background:var(--surface);
  transition:border-color .16s,box-shadow .16s;
}
.bsearch .bsearch__box:focus-within{border-color:var(--brand);box-shadow:0 0 0 4px rgba(0,116,176,.16)}
.bsearch select.bsearch__sel{
  flex:none;height:50px;margin:0;padding:0 30px 0 20px;border:0;border-right:1px solid var(--line);
  border-radius:999px 0 0 999px;background:transparent url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23536574%22 stroke-width=%223%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22m6 9 6 6 6-6%22/%3E%3C/svg%3E") no-repeat right 12px center;
  -webkit-appearance:none;appearance:none;
  font:inherit;font-size:14.5px;font-weight:700;color:var(--text);cursor:pointer;float:none;
}
.bsearch .bsearch__ico{display:grid;place-items:center;width:40px;flex:none;color:var(--text-dim)}
.bsearch input.bsearch__input{
  flex:1;min-width:0;height:50px;margin:0;padding:0 4px;border:0;border-radius:0;background:none;box-shadow:none;
  font:inherit;font-size:15px;color:var(--text);float:none;width:auto;
}
.bsearch input.bsearch__input::placeholder{color:#6b7885}
.bsearch input.bsearch__input::-webkit-search-cancel-button{cursor:pointer}
.bsearch select.bsearch__sel:focus-visible,
.bsearch input.bsearch__input:focus-visible{outline:none}   /* 상자 전체 테두리(:focus-within)가 초점을 보여 줍니다 */
.bsearch select.bsearch__sel:focus-visible{background-color:var(--sky-soft,#eef6fb)}
.bsearch .bsearch__btn{
  flex:none;height:40px;margin:0 6px 0 4px;padding:0 20px;border:0;border-radius:999px;cursor:pointer;
  background:var(--brand-strong);color:#fff;font:inherit;font-size:14.5px;font-weight:800;float:none;width:auto;text-indent:0;
}
.bsearch .bsearch__btn:hover{background:var(--navy,#0a3156)}
.bsearch .bsearch__btn:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
.bsearch .bsearch__now{margin:0;font-size:14px;color:var(--text-mid);text-align:center;word-break:keep-all}
.bsearch .bsearch__now a{color:var(--brand-strong);font-weight:800;text-decoration:underline}
@media (max-width:480px){
  .bsearch select.bsearch__sel{padding:0 26px 0 14px;font-size:14px;max-width:112px}
  .bsearch .bsearch__ico{display:none}
  .bsearch input.bsearch__input{padding:0 4px 0 10px}
  .bsearch .bsearch__btn{padding:0 14px}
}
@media (max-width:400px){   /* 좁은 휴대폰 · 400% 확대: '무엇에서' 를 윗줄로 올려 검색어 칸을 넓게 */
  .bsearch .bsearch__box{flex-wrap:wrap;border-radius:18px}
  .bsearch select.bsearch__sel{
    flex:1 1 100%;max-width:none;height:46px;border-right:0;border-bottom:1px solid var(--line);
    border-radius:18px 18px 0 0;background-position:right 18px center;padding:0 40px 0 18px;
  }
  .bsearch input.bsearch__input{padding:0 4px 0 16px}
}
/* 예전 스킨 검색(작은 창 · 떠 있는 상자)이 서버에 남아 있어도 보이지 않게 */
.bbs__body .bo_sch_wrap,
.bbs__body #bo_sch{display:none !important}

/* ── 분류(카테고리) 줄 ──────────────────────────────────────────────── */
.bbs__body #bo_cate ul,
.bbs__body .bo_cate_ul{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 20px;padding:0;list-style:none}
.bbs__body #bo_cate a,
.bbs__body .bo_cate_link{
  display:inline-flex;align-items:center;min-height:38px;padding:0 15px;border-radius:999px;
  border:1px solid var(--line);background:var(--surface);
  font-size:14px;font-weight:700;color:var(--text-mid);
}
.bbs__body #bo_cate a:hover,
.bbs__body .bo_cate_link:hover{border-color:var(--brand);color:var(--brand)}
.bbs__body #bo_cate #bo_cate_on,
.bbs__body .bo_cate_on{background:var(--brand);border-color:var(--brand);color:#fff}

/* ── 글 읽기 ─────────────────────────────────────────────────────────── */
.bbs__body #bo_v{border:0;background:transparent}
.bbs__body #bo_v_title,
.bbs__body .bo_v_tit{
  font-size:clamp(20px,2.4vw,26px);font-weight:800;line-height:1.4;
  letter-spacing:-.03em;color:var(--text);word-break:keep-all;
}
.bbs__body #bo_v_info{
  display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;
  margin:14px 0 0;padding:0 0 18px;border-bottom:1px solid var(--line);
  font-size:13.5px;color:var(--text-dim);
}
.bbs__body #bo_v_con{
  padding:28px 0;font-size:16px;line-height:1.85;color:var(--text-mid);
  word-break:keep-all;
}
.bbs__body #bo_v_con p{margin:0 0 1em}
.bbs__body #bo_v_con img,
.bbs__body #bo_v_con video{max-width:100%;height:auto;border-radius:var(--radius-s)}
/* 편집기로 쓴 본문이 휴대폰 폭을 넘지 않게 — 띄어쓰기 없이 긴 낱말·주소는 줄을 바꾸고,
   본문 안 상자·표는 화면 폭을 넘지 않게 합니다(넘치면 화면 전체가 옆으로 밀려
   글을 읽을 때마다 좌우로 움직여야 했습니다 · WCAG 1.4.10). */
.bbs__body #bo_v_con{overflow-wrap:anywhere}
.bbs__body #bo_v_con *{max-width:100%}
.bbs__body #bo_v_con table{display:block;overflow-x:auto}
.bbs__body #bo_v_info .profile_info{max-width:100%}
.bbs__body #bo_v_file,
.bbs__body #bo_v_link{
  margin:0 0 18px;padding:14px 16px;border-radius:var(--radius-s);
  background:var(--bg-alt);border:1px solid var(--line);font-size:14px;
}
.bbs__body #bo_v_file li,
.bbs__body #bo_v_link li{padding:5px 0}
/* 이전글·다음글 */
.bbs__body #bo_v_nb{margin-top:26px;border-top:1px solid var(--line)}
.bbs__body #bo_v_nb li{padding:14px 2px;border-bottom:1px solid var(--line);font-size:14.5px}
.bbs__body #bo_v_nb a{color:var(--text-mid)}
.bbs__body #bo_v_nb a:hover{color:var(--brand)}

/* ── 댓글 ────────────────────────────────────────────────────────────── */
.bbs__body #bo_vc{margin-top:34px}
.bbs__body #bo_vc h2{font-size:17px;font-weight:800;color:var(--text);margin-bottom:12px}
.bbs__body #bo_vc article,
.bbs__body .cmt_contents{
  padding:16px 18px;margin-bottom:10px;border-radius:var(--radius-s);
  background:var(--surface);border:1px solid var(--line);font-size:15px;line-height:1.7;
}
.bbs__body #bo_vc_w textarea,
.bbs__body #bo_w textarea,
.bbs__body .frm_input{
  width:100%;padding:12px 14px;border:1px solid var(--field-line);border-radius:9px;
  font-size:15px;font-family:var(--font);color:var(--text);background:var(--surface);
}
.bbs__body #bo_vc_w textarea:focus,
.bbs__body #bo_w textarea:focus,
.bbs__body .frm_input:focus{outline:2px solid var(--brand);outline-offset:1px;border-color:var(--brand)}

/* ── 글쓰기 표 ───────────────────────────────────────────────────────── */
.bbs__body .tbl_frm01 th{
  padding:14px 12px;background:var(--bg-alt);border:0;border-bottom:1px solid var(--line);
  font-size:14px;font-weight:700;color:var(--text-mid);text-align:start;
}
.bbs__body .tbl_frm01 td{padding:12px;border:0;border-bottom:1px solid var(--line);background:var(--surface)}

/* ── 사진 게시판 (live_gallery1 · fund · webzine) ────────────────────
   카드 제목이 10~12px 이라 새 화면에서 너무 작아 보입니다. */
.bbs__body #bo_gall .gall_text_href,
.bbs__body #bo_gall .bo_tit,
.bbs__body .gall_con .bo_tit{font-size:15px;font-weight:700;line-height:1.5;color:var(--text)}
.bbs__body #bo_gall .gall_info,
.bbs__body .gall_con .gall_info{font-size:13px;color:var(--text-dim)}
.bbs__body #bo_gall li,
.bbs__body .gall_li{border-radius:var(--radius-s);overflow:hidden}
.bbs__body .gall_img img,
.bbs__body .gall_href img{border-radius:var(--radius-s)}

/* 아주 작은 글씨를 쓰는 스킨들을 한 번에 끌어올립니다.
   (10px · 11px 는 요즘 화면에서 읽히지 않습니다) */
.bbs__body [style*="font-size:10px"],
.bbs__body [style*="font-size:11px"]{font-size:13px !important}

/* ── 공지 글줄 ───────────────────────────────────────────────────────
   플라이보드 기본은 분홍색 배경입니다. 새 화면의 남색·하늘색 결과 부딪혀
   그 줄만 튀어 보입니다. 같은 계열의 옅은 하늘색으로 바꿉니다. */
.bbs__body tr.bo_notice td{background:var(--sky-soft,#eef4fb)}
.bbs__body tr.bo_notice:hover td{background:#e4eef9}
/* '공지' 딱지 — 번호 칸이 좁아 두 줄로 접히던 것을 한 줄로 붙잡습니다 */
.bbs__body .bo_notice .notice_icon,
.bbs__body .bo_notice strong{
  display:inline-block;padding:3px 10px;border-radius:999px;white-space:nowrap;
  background:var(--brand);color:#fff;font-size:11.5px;font-weight:800;line-height:1.5;
}
.bbs__body .bo_notice .td_num,
.bbs__body .bo_notice td:first-child{min-width:62px;white-space:nowrap}

/* ── 스킨이 단추 폭을 붙잡아 둔 곳 풀기 ──────────────────────────────
   단추는 네 스킨 모두 같은 모양입니다 — 아이콘과 글자를 함께 둔 알약.
   전에는 '아이콘만 있는 단추' 로 보고 42px 동그라미로 잡았는데, 로그인하면
   글자가 있는 단추(관리자 · 게시판 옵션 · 스크랩)가 나타나 그 안에서
   글자가 세로로 터졌습니다.

   스킨 CSS 가 폭을 두 군데서 붙잡습니다. 아이디(#)로 적혀 있어 이쪽도
   아이디를 함께 적어야 이깁니다 — 뒤에 불린다고 이기는 것이 아닙니다.

     .btn_bo_user li {width:40px}              (fund/style.css:164)
     #bo_v_share .btn {width:80px → 120px}     (fund/style.css:352,625)  */
.bbs__body .btn_bo_user li,
.bbs__body #bo_btn_top .btn_bo_user > li,
.bbs__body #bo_v_top .btn_bo_user > li{
  float:none;width:auto;min-width:0;margin:0;
  background:none;border:0;text-align:inherit;
}
.bbs__body #bo_v_share .btn,
.bbs__body #bo_v_share .btn_b03{
  width:auto;height:auto;min-height:42px;line-height:1;
  padding:0 18px;border-radius:999px;
  /* 스킨이 글씨를 가늘게(normal) · 테두리를 다른 회색으로 두었습니다.
     스크랩만 혼자 달라 보이던 까닭입니다. */
  font-size:14.5px;font-weight:700;
  border:1px solid var(--line-strong);color:var(--text-mid);
}
/* live_gallery1 은 아이콘을 30px 짜리 회색 네모로 만들어 단추 왼쪽에
   붙여 두었습니다. 그 스킨의 스크랩만 혼자 길고 다르게 보이던 까닭입니다.
   (live_gallery1/style.css:299) */
.bbs__body #bo_v_share .btn i{
  margin:0;width:auto;line-height:1;background:none;color:inherit;
}
.bbs__body #bo_btn_top li i{padding:0}         /* 같은 까닭 */

/* fund 글읽기 화면만 글씨를 가늘게(400) · 작게(13px) 두고, 칸에 테두리를
   한 겹 더 둘렀습니다. 단추 자신이 이미 테두리를 갖고 있어 두 겹이 됩니다.
   글쓰기 단추도 이 화면에서만 숨겨 두었는데, 다른 게시판에는 있습니다.
     #bo_v_top .btn_bo_user > li      (fund/style.css:607)
     #bo_v_top ul li.view_btn_wirte   (fund/style.css:608)
     #bo_v_top ul li span             (fund/style.css:609)
     #bo_v_top li i                   (fund/style.css:610)                */
.bbs__body #bo_v_top li i{padding:0}
.bbs__body #bo_v_top .btn_bo_user > li,
.bbs__body #bo_v_top .btn_bo_user li span{font-size:14.5px;font-weight:700}
.bbs__body #bo_v_top .btn_bo_user > li.view_btn_wirte{display:block}

/* 글쓰기 단추를 어둡게 칠하던 스킨 규칙. 지금은 단추 자신이 btn_b02(파랑)
   이므로, 칸(li)에 입혀 둔 색은 걷어냅니다 — 안 그러면 색이 두 겹입니다. */
.bbs__body #bo_btn_top .btn_bo_user > li.list_btn_write{background:none;border:0;box-shadow:none}
.bbs__body #bo_btn_top .list_btn_write a{color:#fff}

.bbs__body .btn_bo_user{float:none;justify-content:flex-end;margin-inline-start:auto}
.bbs__body #bo_btn_top{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}

/* fund 스킨만 휴대폰에서 관리자·RSS 를 감춥니다. 나머지 세 게시판에는
   그대로 있어, 같은 일을 하러 갔는데 화면마다 단추가 달라집니다.
   줄이 넘치면 아랫줄로 접히니(flex-wrap) 감출 까닭이 없습니다.
   (fund/style.css:883, 1020) */
.bbs__body #bo_btn_top .list_btn_admin,
.bbs__body #bo_btn_top .list_btn_rss{display:block}

/* 목록 아래쪽 단추줄 — 위쪽과 같은 모양으로.
   fund 스킨은 마지막 하나만 남기고 숨긴 뒤(ul li{display:none}) 그 칸에
   어두운 색을 칠하고 글씨를 흰색으로 두었습니다. 지금은 단추 자신이 색을
   갖고 있어(글쓰기 = btn_b02 파랑), 칸에 입힌 색은 걷어냅니다. 그대로 두면
   흰 글씨가 흰 단추 위에 얹혀 글자가 보이지 않습니다. */
.bbs__body .bo_fx{float:none;display:flex;flex-wrap:wrap;justify-content:flex-end;margin:16px 0 0}
.bbs__body .bo_fx ul li,
.bbs__body .bo_fx ul li:nth-last-child(1){
  display:block;width:auto;background:none;border:0;box-shadow:none;
}
.bbs__body .bo_fx ul li:hover{background:none;box-shadow:none}
.bbs__body .bo_fx ul li:nth-last-child(1) i{display:inline-block}
.bbs__body .bo_fx a.btn_b01,
.bbs__body .bo_fx a.btn_b02{
  height:auto;min-height:42px;line-height:1;border-radius:999px;
  /* 휴대폰에서만 padding 을 16px 로 줄이던 곳이 있어 그 단추만 4px
     좁았습니다 (fund/style.css:1021). 폭은 여기서만 정합니다. */
  padding:0 18px;
  font-size:14.5px;font-weight:700;
}
.bbs__body .bo_fx a.btn_b01{color:var(--text-mid)}
.bbs__body .bo_fx a.btn_b02{color:#fff}
.bbs__body .fa{font-size:15px;line-height:1}

/* ── 쪽 넘김의 처음·끝 화살표 ─────────────────────────────────────────
   스킨이 글자를 숨기고 배경 그림으로 그리는데 그 그림이 없어 빈 칸으로
   보였습니다. 글자를 도로 살려 '처음 · 끝' 으로 읽히게 합니다. */
.bbs__body .pg_start,.bbs__body .pg_prev,
.bbs__body .pg_next,.bbs__body .pg_end{
  text-indent:0;overflow:visible;background-image:none;
  font-size:13px;color:var(--text-dim);
}
.bbs__body .pg_start:hover,.bbs__body .pg_prev:hover,
.bbs__body .pg_next:hover,.bbs__body .pg_end:hover{color:var(--brand)}

/* ── 글쓴이·날짜처럼 곁들이는 값 ───────────────────────────────────── */
.bbs__body .sv_member,.bbs__body .sv_guest,
.bbs__body .member,.bbs__body .guest{color:var(--text-dim);font-weight:600}

/* ── 모금사업 '이 사업에 기부하기' 단추 (skin/board/fund/view.skin.php) ──
   예전에는 스킨 안에 인라인으로 자주색(#a6155f)·15pt 가 박혀 있었고,
   font-color 라는 없는 속성까지 섞여 있었습니다. 모양은 여기서 정합니다. */
.bbs__body .fundgo{display:flex;justify-content:flex-end;margin:22px 0 6px}
.bbs__body .fundgo__btn{
  display:inline-flex;align-items:center;gap:8px;
  min-height:52px;padding:0 28px;border-radius:999px;
  background:var(--brand);color:#fff;border:0;
  font-size:16.5px;font-weight:800;letter-spacing:-.02em;
  box-shadow:0 6px 18px rgba(0,116,176,.26);
  transition:background .15s,transform .15s,box-shadow .15s;
}
.bbs__body .fundgo__btn:hover{
  background:var(--brand-strong);color:#fff;
  transform:translateY(-1px);box-shadow:0 9px 24px rgba(0,116,176,.32);
}
.bbs__body .fundgo__btn:active{transform:none}

/* ── 사진 게시판 목록의 설명 줄 (live_gallery1) ──────────────────────
   예전에는 1.4em·pt 가 섞여 화면마다 크기가 달랐습니다. */
.bbs__body .gall_sub{
  padding:0 14px 12px;margin:0;
  font-size:15px;line-height:1.7;color:var(--text-mid);word-break:keep-all;
}

/* 휴대폰: 목록 표의 '글쓴이 · 조회' 칸을 접어 제목에 자리를 줍니다.
   다섯 칸을 다 두면 제목 칸이 글자 두세 개 너비로 좁아져 '2025년도 …' 가
   한 글자씩 세로로 내려앉았습니다(앱 · 휴대폰 공지사항 목록, 2026-10). */
@media (max-width:640px){
  .bbs__body .tbl_head01 .th_name,.bbs__body .tbl_head01 .td_name,
  .bbs__body .tbl_head01 .th_hit,.bbs__body .tbl_head01 .td_num{display:none}
  .bbs__body .tbl_head01 .th_num,.bbs__body .tbl_head01 .td_num2{width:52px;padding-left:6px;padding-right:4px}
  .bbs__body .tbl_head01 .th_date,.bbs__body .tbl_head01 .td_datetime{width:auto;white-space:nowrap;font-size:12.5px}
  .bbs__body .tbl_head01 td.td_subject{word-break:keep-all;overflow-wrap:anywhere}
}

@media (max-width:760px){
  .bbs__body{font-size:14.5px}
  .bbs__body #bo_v_con{font-size:15.5px;padding:22px 0}
  .bbs__body .tbl_head01 thead th,
  .bbs__body .tbl_head01 tbody td{padding:12px 8px}
}

/* ── 게시판 구분 탭 (head.php 의 $FD_BOARD_TABS) ──────────────────────
   한 주제를 두 게시판이 나눠 맡을 때 그 사이를 오가는 줄입니다.
   (아름다운 기부이야기 ↔ 2022년 이전 자료)
   예전 화면은 파란 네모 두 칸이었는데, 새 디자인의 결에 맞춰
   둥근 테두리 안에 두 칸을 나눠 넣었습니다. */
.bbstab{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  margin:0 0 26px;border:1px solid var(--line);border-radius:12px;
  background:var(--surface);overflow:hidden;
}
.bbstab__item{
  display:flex;align-items:center;justify-content:center;gap:6px;
  min-height:54px;padding:12px 16px;
  font-size:15px;font-weight:700;color:var(--text-mid);
  text-decoration:none;text-align:center;word-break:keep-all;
  border-inline-start:1px solid var(--line);
  transition:background .14s,color .14s;
}
.bbstab__item:first-child{border-inline-start:0}
.bbstab__item:hover{background:var(--bg-alt);color:var(--brand)}
.bbstab__item.is-on{
  background:var(--brand);color:#fff;font-weight:800;
  border-inline-start-color:var(--brand);
}
.bbstab__item.is-on:hover{background:var(--brand);color:#fff}

@media (max-width:560px){
  .bbstab__item{min-height:48px;font-size:14px;padding:10px 12px}
}

/* ── 사진 크게 보기 (게시판 /board/view_image.php) ─────────────────────
   게시글 사진을 누르면 뜨는 창입니다. 플라이보드가 사진의 원래 크기를
   width="7631" height="4448" 처럼 그대로 적어 보내는데, 홈페이지 공통
   규칙(img{max-width:100%})이 가로만 창에 맞춰 줄이고 세로는 4448px 로
   남겨, 사진이 세로로 길게 늘어져 보였습니다(2026-10, /news/507).
   세로를 자동으로 두어 원래 비율 그대로 창 너비에 맞춥니다. */
.bbs-view-image{text-align:center}
.bbs-view-image img{display:inline-block;max-width:100%;height:auto}