@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&family=Share+Tech+Mono&display=swap');

/* ============================================================
   CYBERPUNK GNUBOARD5 THEME
   적용법: <link rel="stylesheet" href="cyberpunk_gnuboard5.css">
   ============================================================ */

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  --cy-bg: #050a14;
  --cy-surface: #0a1628;
  --cy-panel: #0d1f3c;
  --cy-border: #00d4ff;
  --cy-border-dim: #1a4060;
  --cy-accent: #00d4ff;
  --cy-accent2: #7b2dff;
  --cy-accent3: #ff2d6e;
  --cy-text: #c8e8ff;
  --cy-text-dim: #5a8aaa;
  --cy-text-bright: #ffffff;
  --cy-green: #00ff88;
  --cy-yellow: #ffcc00;
}

/* ============================================================
   BASE / BODY
   ============================================================ */

body {
  background: var(--cy-bg);
  color: var(--cy-text);
  font-family: 'Share Tech Mono', monospace;
  font-size: 13px;
  line-height: 1.5;
}

/* 스캔라인 효과 */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0px,
    transparent 3px,
    rgba(0, 212, 255, 0.015) 3px,
    rgba(0, 212, 255, 0.015) 4px
  );
  pointer-events: none;
  z-index: 9999;
}

a {
  color: var(--cy-accent);
  text-decoration: none;
  transition: color 0.2s;
}
a:hover { color: var(--cy-text-bright); }

/* ============================================================
   SITE HEADER
   ============================================================ */

#hd,
.site-header {
  background: linear-gradient(180deg, #020812 0%, #050a14 100%);
  border-bottom: 1px solid var(--cy-border-dim);
  padding: 10px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* 사이트 로고 */
#hd h1,
.site-header h1 {
  font-family: 'Orbitron', sans-serif;
  font-size: 22px;
  color: var(--cy-accent);
  letter-spacing: 6px;
  text-transform: uppercase;
}

/* ============================================================
   NAVIGATION (#gnb)
   ============================================================ */

#gnb {
  background: linear-gradient(90deg, #020812 0%, #050f1e 50%, #020812 100%);
  border-bottom: 1px solid var(--cy-border);
  position: relative;
}

#gnb::after {
  content: '';
  position: absolute;
  bottom: -3px;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--cy-accent), transparent);
}

.gnb_wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  flex-wrap: wrap;
  gap: 4px;
}

/* 1단계 메뉴 */
#gnb_1dul {
  display: flex;
  list-style: none;
  gap: 0;
}

.gnb_1dli a.gnb_1da {
  display: block;
  padding: 14px 14px;
  color: var(--cy-text-dim);
  text-decoration: none;
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-left: 1px solid var(--cy-border-dim);
  transition: color 0.2s, background 0.2s;
}

.gnb_1dli a.gnb_1da:hover,
.gnb_1dli.current a.gnb_1da {
  color: var(--cy-accent);
  background: rgba(0, 212, 255, 0.06);
}

/* 로그인/관리 링크 */
.hd_login {
  display: flex;
  list-style: none;
  gap: 8px;
  padding: 8px 0;
}

.hd_login li a {
  color: var(--cy-text-dim);
  text-decoration: none;
  font-size: 11px;
  padding: 4px 10px;
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  transition: all 0.2s;
}

.hd_login li a:hover {
  color: var(--cy-accent);
  border-color: var(--cy-accent);
}

.hd_login .tnb_admin a {
  color: var(--cy-yellow);
  border-color: var(--cy-yellow);
}

/* ============================================================
   LAYOUT (#wrapper, #container, #aside)
   ============================================================ */

#wrapper {
  max-width: 1100px;
  margin: 0 auto;
  padding: 16px;
}

#container_wr {
  display: grid;
  grid-template-columns: 1fr 240px;
  gap: 16px;
}

#container {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#aside {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* ============================================================
   SECTION / PANEL 공통
   ============================================================ */

section,
article#bo_v {
  background: var(--cy-panel);
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  position: relative;
  overflow: hidden;
}

section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--cy-accent), transparent);
}

/* ============================================================
   BOARD LIST (#bo_list)
   ============================================================ */

#bo_list h2 {
  font-family: 'Orbitron', sans-serif;
  font-size: 10px;
  letter-spacing: 2px;
  color: var(--cy-accent);
  text-transform: uppercase;
  padding: 8px 14px;
  border-bottom: 1px solid var(--cy-border-dim);
}

/* 게시판 상단 버튼 영역 */
#bo_btn_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 14px;
  border-bottom: 1px solid var(--cy-border-dim);
  flex-wrap: wrap;
  gap: 8px;
}

#bo_list_total {
  font-size: 11px;
  color: var(--cy-text-dim);
}

#bo_list_total span {
  color: var(--cy-accent);
}

/* 버튼 공통 */
.btn,
.btn_b01,
.btn_admin,
.btn_submit,
.sch_btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  font-size: 10px;
  font-family: 'Share Tech Mono', monospace;
  text-decoration: none;
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  color: var(--cy-text-dim);
  background: transparent;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: all 0.2s;
}

.btn:hover,
.btn_b01:hover {
  border-color: var(--cy-accent);
  color: var(--cy-accent);
  background: rgba(0, 212, 255, 0.06);
}

.btn_admin {
  border-color: var(--cy-yellow);
  color: var(--cy-yellow);
}

.btn_admin:hover {
  background: rgba(255, 204, 0, 0.08);
}

.btn_bo_user {
  list-style: none;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

/* 게시판 테이블 */
.tbl_head01 table {
  width: 100%;
  border-collapse: collapse;
}

.tbl_head01 thead tr {
  background: rgba(0, 212, 255, 0.05);
  border-bottom: 1px solid var(--cy-border-dim);
}

.tbl_head01 th {
  padding: 8px 14px;
  font-size: 10px;
  letter-spacing: 1.5px;
  color: var(--cy-text-dim);
  text-align: left;
  text-transform: uppercase;
  font-weight: 400;
}

.tbl_head01 th a {
  color: var(--cy-text-dim);
  text-decoration: none;
}

.tbl_head01 th a:hover { color: var(--cy-accent); }

.tbl_head01 tbody tr {
  border-bottom: 1px solid rgba(26, 64, 96, 0.5);
  transition: background 0.15s;
}

.tbl_head01 tbody tr:hover {
  background: rgba(0, 212, 255, 0.04);
}

.tbl_head01 td {
  padding: 10px 14px;
  font-size: 12px;
  color: var(--cy-text);
}

/* 제목 열 */
.td_subject a {
  color: var(--cy-text);
  text-decoration: none;
  transition: color 0.2s;
}
.td_subject a:hover { color: var(--cy-accent); }

/* 새글 배지 */
.new_icon {
  display: inline-block;
  padding: 1px 5px;
  font-size: 9px;
  background: var(--cy-accent);
  color: #000;
  border-radius: 2px;
  margin-left: 6px;
  font-family: 'Orbitron', sans-serif;
  letter-spacing: 1px;
}

/* 댓글 수 */
.cnt_cmt {
  display: inline-block;
  padding: 1px 5px;
  font-size: 9px;
  border: 1px solid var(--cy-accent3);
  color: var(--cy-accent3);
  border-radius: 2px;
  margin-left: 4px;
}

/* 열람중 */
.bo_current {
  display: inline-block;
  padding: 2px 7px;
  font-size: 9px;
  background: rgba(123, 45, 255, 0.25);
  border: 1px solid var(--cy-accent2);
  color: var(--cy-accent2);
  border-radius: 2px;
  font-family: 'Orbitron', sans-serif;
  letter-spacing: 1px;
}

/* 숫자/날짜 열 */
.td_num,
.td_num2,
.td_datetime {
  color: var(--cy-text-dim);
  font-size: 11px;
  text-align: center;
}

/* 글쓴이 */
.td_name { color: var(--cy-text-dim); }
.sv_member { color: var(--cy-text); }

/* 체크박스 */
.selec_chk {
  accent-color: var(--cy-accent);
}

/* 하단 버튼 */
.bo_fx {
  padding: 8px 14px;
  border-top: 1px solid var(--cy-border-dim);
  display: flex;
  justify-content: flex-end;
}

/* ============================================================
   BOARD SEARCH (.bo_sch_wrap)
   ============================================================ */

.bo_sch_wrap {
  padding: 10px 14px;
}

.bo_sch {
  border: none;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.bo_sch h3 { display: none; }

.bo_sch select {
  background: rgba(0, 8, 20, 0.7);
  border: 1px solid var(--cy-border-dim);
  color: var(--cy-text-dim);
  font-family: 'Share Tech Mono', monospace;
  font-size: 11px;
  padding: 5px 8px;
  border-radius: 2px;
  outline: none;
  transition: border-color 0.2s;
}

.bo_sch select:focus { border-color: var(--cy-accent); }

.sch_bar {
  display: flex;
  gap: 6px;
  flex: 1;
}

.sch_input {
  flex: 1;
  background: rgba(0, 8, 20, 0.7);
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  color: var(--cy-text);
  font-family: 'Share Tech Mono', monospace;
  font-size: 11px;
  padding: 5px 10px;
  outline: none;
  transition: border-color 0.2s;
}

.sch_input:focus { border-color: var(--cy-accent); }
.sch_input::placeholder { color: var(--cy-text-dim); }

.sch_btn {
  border-color: var(--cy-accent);
  color: var(--cy-accent);
}

/* ============================================================
   POST VIEW (#bo_v)
   ============================================================ */

article#bo_v {
  background: var(--cy-panel);
  border: 1px solid var(--cy-border-dim);
}

article#bo_v::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--cy-accent2), transparent);
}

/* 제목 */
#bo_v_title {
  font-family: 'Orbitron', sans-serif;
  font-size: 15px;
  color: var(--cy-text-bright);
  letter-spacing: 1px;
  padding: 14px 16px 8px;
}

/* 게시물 정보 */
#bo_v_info {
  padding: 0 16px 10px;
  border-bottom: 1px solid var(--cy-border-dim);
}

#bo_v_info h2 { display: none; }

.profile_info {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.pf_img img {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid var(--cy-border-dim);
  background: rgba(0, 212, 255, 0.08);
  filter: hue-rotate(180deg) saturate(0.3);
}

.profile_info_ct {
  font-size: 11px;
  color: var(--cy-text-dim);
  line-height: 1.8;
}

.profile_info_ct strong { color: var(--cy-text); }
.profile_info_ct a { color: var(--cy-accent); }
.if_date { color: var(--cy-text-dim); font-size: 11px; }

/* 상단 버튼 */
#bo_v_top {
  padding: 8px 0 4px;
}

/* 본문 */
#bo_v_atc {
  padding: 14px 16px;
  border-bottom: 1px solid var(--cy-border-dim);
}

#bo_v_atc_title { display: none; }

#bo_v_share {
  margin-bottom: 10px;
}

/* 스크랩 버튼 */
.btn_b03 {
  display: inline-block;
  padding: 4px 12px;
  font-size: 10px;
  border: 1px solid var(--cy-yellow);
  color: var(--cy-yellow);
  background: rgba(255, 204, 0, 0.06);
  border-radius: 2px;
  cursor: pointer;
  font-family: 'Share Tech Mono', monospace;
  text-transform: uppercase;
  letter-spacing: 1px;
  text-decoration: none;
  transition: all 0.2s;
}

.btn_b03:hover { background: rgba(255, 204, 0, 0.14); }

/* 본문 이미지 */
#bo_v_img img,
#bo_v_con img,
a.view_image img {
  max-width: 100%;
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  margin-bottom: 12px;
}

/* 본문 내용 */
#bo_v_con {
  font-size: 13px;
  color: var(--cy-text);
  line-height: 1.9;
  margin-top: 10px;
}

/* 관련링크 */
#bo_v_link {
  padding: 10px 16px;
  border-bottom: 1px solid var(--cy-border-dim);
  font-size: 11px;
}

#bo_v_link h2 {
  font-family: 'Orbitron', sans-serif;
  font-size: 9px;
  letter-spacing: 2px;
  color: var(--cy-text-dim);
  margin-bottom: 6px;
  text-transform: uppercase;
}

#bo_v_link ul { list-style: none; }

#bo_v_link li {
  margin-bottom: 4px;
  color: var(--cy-text-dim);
}

#bo_v_link a { color: var(--cy-accent); }

.bo_v_link_cnt {
  font-size: 10px;
  color: var(--cy-text-dim);
}

/* ============================================================
   COMMENTS (#bo_vc)
   ============================================================ */

#bo_vc h2 {
  font-family: 'Orbitron', sans-serif;
  font-size: 10px;
  letter-spacing: 2px;
  color: var(--cy-accent2);
  padding: 8px 16px;
  border-bottom: 1px solid var(--cy-border-dim);
  text-transform: uppercase;
}

/* 댓글 토글 버튼 */
.cmt_btn {
  display: block;
  width: 100%;
  padding: 8px 16px;
  background: rgba(123, 45, 255, 0.08);
  border: none;
  border-top: 1px solid var(--cy-border-dim);
  color: var(--cy-accent2);
  font-family: 'Orbitron', sans-serif;
  font-size: 10px;
  letter-spacing: 2px;
  cursor: pointer;
  text-align: left;
  text-transform: uppercase;
  transition: background 0.2s;
}

.cmt_btn:hover { background: rgba(123, 45, 255, 0.14); }

/* 개별 댓글 */
#bo_vc article {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(26, 64, 96, 0.4);
  background: transparent;
  border-left: none;
  border-right: none;
  border-top: none;
  border-radius: 0;
}

#bo_vc article::before { display: none; }

#bo_vc article .pf_img img {
  width: 34px;
  height: 34px;
  border-radius: 50%;
}

/* 댓글 헤더 */
#bo_vc article header h2 { display: none; }

#bo_vc article header {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}

.bo_vc article header .member {
  color: var(--cy-accent);
  font-size: 11px;
}

.bo_vc article header span {
  color: var(--cy-text-dim);
  font-size: 10px;
}

.bo_vc_hdinfo { color: var(--cy-text-dim); font-size: 10px; }

/* 댓글 내용 */
.cmt_contents {
  font-size: 12px;
  color: var(--cy-text);
  line-height: 1.6;
}

.cmt_contents p { margin: 0; }

/* 비밀글 아이콘 */
.cmt_contents img[alt="비밀글"] {
  display: inline-block;
  width: 12px;
  height: 12px;
  opacity: 0.6;
}

/* 댓글 옵션 버튼 */
.bo_vl_opt {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-end;
}

.btn_cm_opt {
  font-size: 10px;
  padding: 2px 8px;
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  color: var(--cy-text-dim);
  background: transparent;
  cursor: pointer;
  font-family: 'Share Tech Mono', monospace;
  transition: all 0.15s;
}

.btn_cm_opt:hover {
  border-color: var(--cy-accent);
  color: var(--cy-accent);
}

.bo_vc_act {
  list-style: none;
  display: none;
  flex-direction: column;
  gap: 3px;
  background: var(--cy-surface);
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  padding: 4px;
}

.bo_vc_act li a {
  display: block;
  padding: 3px 8px;
  font-size: 10px;
  color: var(--cy-text-dim);
  border-radius: 2px;
  transition: all 0.15s;
}

.bo_vc_act li a:hover {
  background: rgba(0, 212, 255, 0.08);
  color: var(--cy-accent);
}

/* ============================================================
   COMMENT WRITE (#bo_vc_w)
   ============================================================ */

#bo_vc_w {
  background: transparent;
  border: none;
  border-top: 1px solid var(--cy-border-dim);
}

#bo_vc_w h2 {
  font-family: 'Orbitron', sans-serif;
  font-size: 10px;
  letter-spacing: 2px;
  color: var(--cy-green);
  padding: 8px 16px;
  border-bottom: 1px solid var(--cy-border-dim);
  text-transform: uppercase;
}

#bo_vc_w textarea#wr_content {
  display: block;
  width: calc(100% - 32px);
  margin: 12px 16px 0;
  background: rgba(0, 8, 20, 0.7);
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  color: var(--cy-text);
  font-family: 'Share Tech Mono', monospace;
  font-size: 12px;
  padding: 10px 12px;
  resize: vertical;
  min-height: 80px;
  outline: none;
  transition: border-color 0.2s;
}

#bo_vc_w textarea#wr_content:focus {
  border-color: var(--cy-accent);
}

#bo_vc_w textarea#wr_content::placeholder {
  color: var(--cy-text-dim);
}

.bo_vc_w_wr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 16px 12px;
  flex-wrap: wrap;
  gap: 8px;
}

.bo_vc_w_info { font-size: 11px; color: var(--cy-text-dim); }

.btn_confirm {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* 비밀글 체크박스 */
.secret_cm label {
  font-size: 11px;
  color: var(--cy-text-dim);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}

#btn_submit {
  padding: 6px 18px;
  background: rgba(0, 212, 255, 0.1);
  border: 1px solid var(--cy-accent);
  color: var(--cy-accent);
  font-family: 'Orbitron', sans-serif;
  font-size: 10px;
  letter-spacing: 2px;
  cursor: pointer;
  border-radius: 2px;
  text-transform: uppercase;
  transition: all 0.2s;
}

#btn_submit:hover {
  background: rgba(0, 212, 255, 0.2);
}

/* ============================================================
   OUTLOGIN / USER CARD (#ol_after)
   ============================================================ */

#ol_after {
  background: var(--cy-panel);
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  overflow: hidden;
  position: relative;
}

#ol_after::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--cy-accent2), transparent);
}

#ol_after_hd {
  padding: 14px;
  text-align: center;
  border-bottom: 1px solid var(--cy-border-dim);
}

#ol_after_hd h2 { display: none; }

#ol_after_hd .profile_img img {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 2px solid var(--cy-accent2);
  background: rgba(123, 45, 255, 0.15);
  display: block;
  margin: 0 auto 8px;
  filter: hue-rotate(200deg) saturate(0.4);
}

#ol_after_hd strong {
  display: block;
  font-family: 'Orbitron', sans-serif;
  font-size: 12px;
  color: var(--cy-text-bright);
  letter-spacing: 1px;
}

#ol_after_info {
  display: inline-block;
  margin-top: 6px;
  font-size: 10px;
  padding: 3px 10px;
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  color: var(--cy-text-dim);
  transition: all 0.2s;
}

#ol_after_info:hover {
  border-color: var(--cy-accent);
  color: var(--cy-accent);
}

/* 포인트/쪽지/스크랩 */
#ol_after_private {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  border-bottom: 1px solid var(--cy-border-dim);
}

#ol_after_private li {
  border-right: 1px solid var(--cy-border-dim);
}

#ol_after_private li:last-child { border-right: none; }

#ol_after_private li a {
  display: block;
  text-align: center;
  padding: 10px 6px;
  font-size: 9px;
  color: var(--cy-text-dim);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: background 0.2s;
}

#ol_after_private li a:hover {
  background: rgba(0, 212, 255, 0.06);
  color: var(--cy-accent);
}

#ol_after_private li a strong {
  display: block;
  font-family: 'Orbitron', sans-serif;
  font-size: 14px;
  color: var(--cy-accent);
  margin-top: 2px;
}

#ol_after > footer {
  padding: 8px 14px;
}

#ol_after_logout {
  display: block;
  text-align: center;
  padding: 5px;
  font-size: 11px;
  color: var(--cy-accent3);
  border: 1px solid var(--cy-accent3);
  border-radius: 2px;
  text-decoration: none;
  transition: background 0.2s;
}

#ol_after_logout:hover {
  background: rgba(255, 45, 110, 0.1);
}

/* ============================================================
   VISITOR COUNT (#visit)
   ============================================================ */

#visit {
  background: var(--cy-panel);
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  overflow: hidden;
  position: relative;
}

#visit::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--cy-green), transparent);
}

#visit h2 {
  font-family: 'Orbitron', sans-serif;
  font-size: 9px;
  letter-spacing: 2px;
  color: var(--cy-green);
  text-transform: uppercase;
  padding: 8px 14px;
  border-bottom: 1px solid var(--cy-border-dim);
}

#visit dl {
  padding: 8px 14px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 10px;
}

#visit dt {
  font-size: 11px;
  color: var(--cy-text-dim);
  padding: 3px 0;
  border-bottom: 1px solid rgba(26, 64, 96, 0.3);
}

#visit dd {
  font-family: 'Orbitron', sans-serif;
  font-size: 12px;
  color: var(--cy-green);
  text-align: right;
  padding: 3px 0;
  border-bottom: 1px solid rgba(26, 64, 96, 0.3);
}

/* ============================================================
   FOOTER (#ft)
   ============================================================ */

#ft {
  border-top: 1px solid var(--cy-border-dim);
  background: linear-gradient(to bottom, #050a14, #020510);
  position: relative;
  margin-top: 16px;
}

#ft::before {
  content: '';
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cy-accent), transparent);
}

#ft_wr {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr auto auto;
  gap: 16px;
  padding: 16px;
  align-items: start;
}

/* 푸터 링크 */
#ft_link {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-content: flex-start;
}

#ft_link a {
  font-size: 10px;
  color: var(--cy-text-dim);
  text-decoration: none;
  padding: 2px 8px;
  border: 1px solid var(--cy-border-dim);
  border-radius: 2px;
  transition: all 0.2s;
}

#ft_link a:hover {
  color: var(--cy-accent);
  border-color: var(--cy-accent);
}

/* 회사 정보 */
#ft_company h2 {
  font-family: 'Orbitron', sans-serif;
  font-size: 9px;
  letter-spacing: 2px;
  color: var(--cy-accent);
  text-transform: uppercase;
  margin-bottom: 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--cy-border-dim);
}

.ft_info {
  font-size: 10px;
  color: var(--cy-text-dim);
  line-height: 1.8;
}

/* 공지사항 (푸터) */
.notice.ft_cnt h2 {
  font-family: 'Orbitron', sans-serif;
  font-size: 9px;
  letter-spacing: 2px;
  color: var(--cy-accent);
  text-transform: uppercase;
  margin-bottom: 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--cy-border-dim);
}

.notice.ft_cnt h2 a { color: var(--cy-accent); }

.notice.ft_cnt ul { list-style: none; }

.notice.ft_cnt .empty_li {
  font-size: 10px;
  color: var(--cy-text-dim);
}

/* 저작권 */
#ft_copy {
  text-align: center;
  padding: 8px 16px;
  font-size: 10px;
  color: var(--cy-text-dim);
  border-top: 1px solid var(--cy-border-dim);
  letter-spacing: 2px;
  text-transform: uppercase;
}

/* 맨 위로 버튼 */
#top_btn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 36px;
  height: 36px;
  background: rgba(0, 212, 255, 0.1);
  border: 1px solid var(--cy-accent);
  color: var(--cy-accent);
  border-radius: 2px;
  cursor: pointer;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
  z-index: 1000;
}

#top_btn:hover { background: rgba(0, 212, 255, 0.22); }

/* ============================================================
   SOUND ONLY (접근성)
   ============================================================ */

.sound_only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

/* ============================================================
   RESPONSIVE (모바일)
   ============================================================ */

@media (max-width: 768px) {
  #container_wr {
    grid-template-columns: 1fr;
  }

  #aside { order: -1; }

  #ft_wr {
    grid-template-columns: 1fr 1fr;
  }

  .gnb_wrap {
    flex-direction: column;
    align-items: flex-start;
  }

  #gnb_1dul {
    flex-wrap: wrap;
  }

  .gnb_1dli a.gnb_1da {
    padding: 10px 12px;
    font-size: 10px;
  }

  #ol_after_private {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

@media (max-width: 480px) {
  #ft_wr {
    grid-template-columns: 1fr;
  }

  .bo_fx,
  #bo_btn_top {
    flex-direction: column;
    align-items: flex-start;
  }
}