/* ==========================================================
   claudedesign — board/faq page redesign
   Applies dark theme tokens + hero header + restyled board UI.
   Scoped via <html class="cd-redesign cd-page-X">.
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&family=Pretendard:wght@400;500;600&display=swap');

/* ---------- design tokens ---------- */
html.cd-redesign {
  --cd-bg: #0a0a0b;
  --cd-bg-1: #111114;
  --cd-bg-2: #16161a;
  --cd-ink: #ededee;
  --cd-ink-mute: #a8a8b0;
  --cd-ink-faint: #6b6b75;
  --cd-line: #26262c;
  --cd-line-2: #1c1c22;
  --cd-accent: #d6ff3d;
  --cd-accent-2: #7dd3fc;
  --cd-f-display: "Space Grotesk","Pretendard",system-ui,sans-serif;
  --cd-f-mono: "JetBrains Mono",ui-monospace,Menlo,monospace;
  --cd-f-body: "Pretendard","Inter",system-ui,sans-serif;
}

/* ---------- global body / wrapper ---------- */
html.cd-redesign, html.cd-redesign body {
  background: var(--cd-bg) !important;
  color: var(--cd-ink) !important;
  font-family: var(--cd-f-body) !important;
  margin: 0 !important;
}
html.cd-redesign .ety-main { margin-bottom: 0 !important; }

/* Wrapper for board/FAQ content */
.cd-page-content {
  background: var(--cd-bg);
  min-height: 50vh;
  padding: 0 0 80px;
}
/* When no hero is rendered, leave room under the fixed header */
.cd-page-content.cd-no-hero { padding-top: 140px; }
@media (max-width: 1089px) {
  .cd-page-content.cd-no-hero { padding-top: 100px; }
}
.cd-page-content > .py-5 { background: transparent !important; padding: 0 !important; }
.cd-page-content .container { background: transparent !important; }

/* ---------- hero header ---------- */
.cd-page-hero {
  background: var(--cd-bg);
  padding: 160px 0 56px;
  border-bottom: 1px solid var(--cd-line);
}
.cd-page-hero-inner {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 32px;
}
.cd-page-hero .cd-s-num {
  font-family: var(--cd-f-mono);
  color: var(--cd-accent);
  font-size: 12px;
  letter-spacing: 0.08em;
}
.cd-page-hero .cd-eyebrow {
  font-family: var(--cd-f-mono);
  color: var(--cd-ink-faint);
  font-size: 11px;
  letter-spacing: 0.12em;
  margin-top: 8px;
  margin-bottom: 14px;
  text-transform: uppercase;
}
.cd-page-hero .cd-h-display.cd-s-title {
  font-family: var(--cd-f-display);
  font-weight: 500;
  font-size: clamp(38px, 4.5vw, 64px);
  letter-spacing: -0.02em;
  color: var(--cd-ink);
  margin: 0;
  line-height: 1.05;
}
.cd-page-hero .cd-s-lead {
  max-width: 640px;
  margin-top: 18px;
  color: var(--cd-ink-mute);
  font-size: 16px;
  line-height: 1.6;
}
@media (max-width: 768px) {
  .cd-page-hero { padding: 110px 0 36px; }
  .cd-page-hero-inner { padding: 0 20px; }
}

/* ---------- container width on these pages ---------- */
html.cd-redesign .cd-page-content #bo_list,
html.cd-redesign .cd-page-content #bo_v,
html.cd-redesign .cd-page-content #bo_w,
html.cd-redesign .cd-page-content #faq_wrap,
html.cd-redesign .cd-page-content #faq_sch,
html.cd-redesign .cd-page-content #bo_cate {
  max-width: 1320px;
  width: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 32px;
  padding-right: 32px;
  box-sizing: border-box;
}
html.cd-redesign .cd-page-content #bo_list { margin-top: 40px; }
html.cd-redesign .cd-page-content #bo_v[style] {
  background: transparent !important;
  width: auto !important;
}
html.cd-redesign .cd-page-content #faq_sch,
html.cd-redesign .cd-page-content #bo_cate { margin-top: 40px; }
/* explain skin wraps list in extra <div class="container"> — kill its width caps */
html.cd-redesign .cd-page-content > .container { max-width: 1320px; padding: 0 32px; }
html.cd-redesign .cd-page-content > .container > #bo_list,
html.cd-redesign .cd-page-content > .container > #bo_v { padding: 0 !important; max-width: 100%; }

/* ---------- mypage sidebar — hide on redesigned pages (nav already has 고객센터 dropdown) ---------- */
html.cd-redesign #mypage { display: block !important; overflow: visible !important; }
html.cd-redesign #mypage > div[style*="float:left"]:first-child { display: none !important; }
html.cd-redesign #mypage > div[style*="margin-left"] {
  background: transparent !important;
  margin-left: 0 !important;
  width: 100% !important;
  float: none !important;
}
/* the bare "| 게시판제목" divider before #bo_btn_top — drop it (hero already shows title) */
html.cd-redesign #mypage > div[style*="margin-left"] > div:first-child:not([id]):not([class]) {
  display: none !important;
}
/* the trailing clear:both div after #mypage */
html.cd-redesign .py-5 > div[style*="clear:both"] { display: none !important; }

/* ---------- board list header ---------- */
html.cd-redesign #bo_list { color: var(--cd-ink); font-family: var(--cd-f-body); }
html.cd-redesign #bo_list_total {
  color: var(--cd-ink-mute) !important;
  font-family: var(--cd-f-mono);
  font-size: 13px;
  width: auto !important;
  text-align: left !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}
html.cd-redesign #bo_list .bo_title,
html.cd-redesign #bo_list_total span { color: var(--cd-ink-mute) !important; }
/* #bo_btn_top: flex row with total on left, search on right */
html.cd-redesign #bo_btn_top {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px;
  margin-bottom: 20px;
}
html.cd-redesign #bo_btn_top > div[style*="float:right"] {
  float: none !important; background: transparent !important; padding: 0 !important;
}
html.cd-redesign #bo_btn_top .btn_bo_user { margin: 0; padding: 0; list-style: none; display: flex; gap: 6px; }

/* ---------- search box (basic skin: #bo_sch; explain skin: .bo_sch_wrap > .bo_sch) ---------- */
html.cd-redesign #bo_sch,
html.cd-redesign .bo_sch_wrap .bo_sch {
  background: var(--cd-bg-1) !important;
  border: 1px solid var(--cd-line) !important;
  border-radius: 999px !important;
  padding: 4px 6px 4px 12px !important;
  display: inline-flex !important; align-items: center; gap: 8px;
  color: var(--cd-ink);
}
html.cd-redesign #bo_sch legend,
html.cd-redesign .bo_sch_wrap .bo_sch h3 { display: none; }
html.cd-redesign #bo_sch select,
html.cd-redesign #bo_sch input.sch_input,
html.cd-redesign .bo_sch_wrap .bo_sch select,
html.cd-redesign .bo_sch_wrap .bo_sch input.sch_input {
  background: transparent !important;
  border: none !important;
  color: var(--cd-ink) !important;
  font-family: var(--cd-f-body);
  font-size: 13px;
  padding: 4px 6px !important;
  outline: none;
}
html.cd-redesign #bo_sch select option,
html.cd-redesign .bo_sch_wrap select option { color: #000; }
html.cd-redesign #bo_sch .sch_btn,
html.cd-redesign .bo_sch_wrap .sch_btn {
  background: var(--cd-accent) !important;
  color: var(--cd-bg) !important;
  border: none !important;
  border-radius: 999px !important;
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
html.cd-redesign .bo_sch_wrap .sch_bar { display: inline-flex; align-items: center; gap: 6px; }
html.cd-redesign .bo_sch_wrap .bo_sch_cls { display: none; }
/* explain skin search wrap modal: simplify to inline */
html.cd-redesign .bo_sch_wrap { position: static !important; background: transparent !important; }
html.cd-redesign .bo_sch_wrap .bo_sch_bg { display: none; }

/* ---------- board list table → cards (flex, tolerates variable columns) ---------- */
html.cd-redesign #bo_list .tbl_head01,
html.cd-redesign #bo_list table { background: transparent !important; border: none !important; }
html.cd-redesign #bo_list table thead { display: none; }
html.cd-redesign #bo_list table,
html.cd-redesign #bo_list tbody { display: block; width: 100%; }
html.cd-redesign #bo_list table tbody tr {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 8px 16px;
  background: var(--cd-bg-1);
  border: 1px solid var(--cd-line);
  border-radius: 8px;
  margin-bottom: 4px;
  transition: border-color .2s ease, transform .2s ease;
}
html.cd-redesign #bo_list table tbody tr:hover {
  border-color: var(--cd-accent);
  transform: translateY(-1px);
}
html.cd-redesign #bo_list table tbody td {
  border: none !important;
  background: transparent !important;
  color: var(--cd-ink) !important;
  padding: 0 !important;
  font-family: var(--cd-f-body);
  font-size: 14px;
  display: flex;
  align-items: center !important;
  align-self: center !important;
  line-height: 1.4;
}
html.cd-redesign #bo_list table tbody .td_chk { flex: 0 0 22px; }
html.cd-redesign #bo_list table tbody .td_num,
html.cd-redesign #bo_list table tbody .td_num2 {
  flex: 0 0 44px;
  font-family: var(--cd-f-mono);
  color: var(--cd-ink-faint) !important;
  font-size: 12px;
}
html.cd-redesign #bo_list table tbody .td_subject { flex: 1 1 auto; min-width: 0; }
html.cd-redesign #bo_list table tbody .td_subject a,
html.cd-redesign #bo_list table tbody .td_subject {
  color: var(--cd-ink) !important;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  display: block; min-width: 0;
}
/* Make date and author readable (was too dark) */
html.cd-redesign #bo_list table tbody .td_name,
html.cd-redesign #bo_list table tbody .td_name *,
html.cd-redesign #bo_list table tbody .td_datetime,
html.cd-redesign #bo_list table tbody .td_date {
  color: var(--cd-ink-mute) !important;
  font-family: var(--cd-f-mono);
  font-size: 12px;
}
html.cd-redesign #bo_list table tbody .td_name {
  flex: 0 0 110px; justify-content: flex-end;
}
html.cd-redesign #bo_list table tbody .td_datetime,
html.cd-redesign #bo_list table tbody .td_date {
  flex: 0 0 90px; justify-content: flex-end;
}
/* Force entire row to ONE line — never wrap (badge/heart + title + rest stay inline) */
html.cd-redesign #bo_list table tbody tr {
  flex-wrap: nowrap !important;
}
html.cd-redesign #bo_list table tbody .td_subject {
  flex: 1 1 auto !important; min-width: 0;
  display: flex !important;
  align-items: center !important;
  align-self: stretch !important;
}
html.cd-redesign #bo_list table tbody .td_subject .bo_tit {
  display: flex !important;
  align-items: center !important;
  gap: 8px;
  width: 100%;
  margin: 0; padding: 0;
  white-space: nowrap; overflow: hidden;
  line-height: 1.4;
  min-height: 0;
}
html.cd-redesign #bo_list table tbody .td_subject .bo_tit a {
  display: inline-block !important;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  min-width: 0; flex: 0 1 auto;
  line-height: 1.4;
  margin: 0; padding: 0;
}
/* heart icon stays inline-centered after title */
html.cd-redesign #bo_list table tbody .td_subject .bo_tit .fa-heart {
  flex: 0 0 auto;
  color: #ff5a7a;
  font-size: 13px;
  line-height: 1;
}
html.cd-redesign #bo_list table tbody tr.bo_notice {
  border-left: 3px solid var(--cd-accent);
}
html.cd-redesign #bo_list table tbody tr.bo_notice td { background: transparent !important; }
html.cd-redesign #bo_list table tbody .notice_icon {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 2px 8px; font-family: var(--cd-f-mono); font-size: 10px;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--cd-bg) !important; background: var(--cd-accent) !important;
  border-radius: 999px; font-weight: 600;
}
html.cd-redesign #bo_list table tbody .bo_tit,
html.cd-redesign #bo_list table tbody .bo_tit *,
html.cd-redesign #bo_list table tbody .bo_tit a,
html.cd-redesign #bo_list table tbody .bo_tit a * {
  color: var(--cd-ink) !important; font-weight: 500 !important;
  background: transparent !important;
}
html.cd-redesign #bo_list table tbody .bo_tit { display: block; }
html.cd-redesign #bo_list table tbody .new_icon {
  display: inline-block; margin-left: 6px;
  padding: 0 6px; border-radius: 999px;
  background: var(--cd-accent-2); color: var(--cd-bg) !important;
  font-family: var(--cd-f-mono); font-size: 10px; font-weight: 600;
}
html.cd-redesign #bo_list table tbody .cnt_cmt {
  margin-left: 6px; color: var(--cd-accent-2) !important;
  font-family: var(--cd-f-mono); font-size: 11px;
}
html.cd-redesign #bo_list table tbody .bo_cate_link {
  background: var(--cd-bg-2) !important; color: var(--cd-accent-2) !important;
  border-radius: 999px; padding: 2px 8px; font-size: 11px;
  font-family: var(--cd-f-mono); margin-right: 8px;
}
html.cd-redesign #bo_list table tbody tr.even td,
html.cd-redesign #bo_list table tbody tr td { background: transparent !important; }
/* sortable column header sort arrows — only show in modal/search */
html.cd-redesign #bo_list .tbl_wrap[style*="min-height"] { min-height: 0 !important; }
html.cd-redesign #bo_list table tbody .empty_table {
  flex: 1; padding: 60px 20px !important;
  text-align: center; color: var(--cd-ink-faint) !important;
  font-family: var(--cd-f-mono); justify-content: center;
}

/* ---------- pagination ---------- */
html.cd-redesign .pg_wrap { margin-top: 32px; text-align: center; }
html.cd-redesign .pg_page, html.cd-redesign .pg_current {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 36px;
  margin: 0 2px; padding: 0 10px;
  background: var(--cd-bg-1) !important;
  border: 1px solid var(--cd-line) !important;
  border-radius: 8px !important;
  color: var(--cd-ink-mute) !important;
  font-family: var(--cd-f-mono); font-size: 13px;
  text-decoration: none;
}
html.cd-redesign .pg_current {
  background: var(--cd-accent) !important;
  color: var(--cd-bg) !important;
  border-color: var(--cd-accent) !important;
}
html.cd-redesign .pg_page:hover { border-color: var(--cd-accent) !important; color: var(--cd-ink) !important; }

/* ---------- write button / btn_bo_user ---------- */
html.cd-redesign .btn_bo_user,
html.cd-redesign .bo_v_com,
html.cd-redesign .btn_b01,
html.cd-redesign .btn_b02 { color: var(--cd-ink) !important; }
html.cd-redesign .btn_b02, html.cd-redesign .btn_admin, html.cd-redesign .btn_b01 {
  background: var(--cd-bg-1) !important;
  border: 1px solid var(--cd-line) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-size: 13px !important;
  font-family: var(--cd-f-mono) !important;
  color: var(--cd-ink) !important;
}
html.cd-redesign .btn_b02:hover { border-color: var(--cd-accent) !important; }

/* ---------- view (게시글 본문) ---------- */
html.cd-redesign #bo_v {
  color: var(--cd-ink);
  font-family: var(--cd-f-body);
  background: transparent !important;
}
html.cd-redesign #bo_v header { background: transparent !important; padding: 0; }
html.cd-redesign #bo_v_title {
  font-family: var(--cd-f-display);
  font-size: clamp(28px, 3vw, 42px);
  letter-spacing: -0.02em;
  color: var(--cd-ink) !important;
  background: transparent !important;
  padding: 0 0 18px !important;
  border-bottom: 1px solid var(--cd-line);
  margin: 0 auto 24px !important;
  font-weight: 500;
  line-height: 1.2;
  max-width: 760px;
}
html.cd-redesign #bo_v_title .bo_v_tit { color: var(--cd-ink) !important; background: transparent !important; }
html.cd-redesign #bo_v_title .bo_v_cate {
  display: inline-block; font-family: var(--cd-f-mono); font-size: 11px;
  color: var(--cd-accent) !important; background: transparent !important;
  padding: 2px 8px; border: 1px solid var(--cd-line); border-radius: 999px;
  vertical-align: middle; margin-right: 10px;
}
html.cd-redesign #bo_v_atc_title { position: absolute; left: -9999px; }
html.cd-redesign #bo_v_info {
  color: var(--cd-ink-faint) !important;
  font-family: var(--cd-f-mono);
  font-size: 12px;
  border: none !important;
  background: transparent !important;
}
html.cd-redesign #bo_v_info * { color: var(--cd-ink-faint) !important; }
html.cd-redesign #bo_v_con,
html.cd-redesign #bo_v_atc {
  color: var(--cd-ink) !important;
  background: transparent !important;
  font-size: 16px;
  line-height: 1.75;
  padding: 24px 0 !important;
  max-width: 760px;
  margin-left: auto !important;
  margin-right: auto !important;
}
html.cd-redesign #bo_v_con { max-width: 100%; }
/* Force every nested element in WYSIWYG body to light color, overriding inline style="color:#000" etc. */
html.cd-redesign #bo_v_con,
html.cd-redesign #bo_v_con *,
html.cd-redesign #bo_v_con p,
html.cd-redesign #bo_v_con div,
html.cd-redesign #bo_v_con span,
html.cd-redesign #bo_v_con font,
html.cd-redesign #bo_v_con li,
html.cd-redesign #bo_v_con td,
html.cd-redesign #bo_v_con th,
html.cd-redesign #bo_v_con h1,
html.cd-redesign #bo_v_con h2,
html.cd-redesign #bo_v_con h3,
html.cd-redesign #bo_v_con h4,
html.cd-redesign #bo_v_con h5,
html.cd-redesign #bo_v_con h6,
html.cd-redesign #bo_v_con b,
html.cd-redesign #bo_v_con strong,
html.cd-redesign #bo_v_con em,
html.cd-redesign #bo_v_con i {
  color: var(--cd-ink) !important;
  background-color: transparent !important;
}
html.cd-redesign #bo_v_con a,
html.cd-redesign #bo_v_con a * { color: var(--cd-accent-2) !important; }
html.cd-redesign #bo_v_con img { max-width: 100%; height: auto; border-radius: 8px; }
/* HTML <font color="..."> attribute override (kills <font color="#000"> from old editors) */
html.cd-redesign #bo_v_con font[color] { color: var(--cd-ink) !important; }
/* explain skin hardcodes width:1280px inline on #bo_v_con — override */
html.cd-redesign #bo_v_con[style] { width: auto !important; max-width: 100% !important; }
html.cd-redesign #bo_v[style] { width: auto !important; max-width: 100% !important; }

/* view action buttons */
html.cd-redesign #bo_v_act ul,
html.cd-redesign #bo_v_top ul,
html.cd-redesign #bo_v_bot ul { padding: 0; list-style: none; margin: 0; }
html.cd-redesign #bo_v_act .btn, html.cd-redesign #bo_v_top .btn, html.cd-redesign #bo_v_bot .btn {
  background: var(--cd-bg-1) !important;
  border: 1px solid var(--cd-line) !important;
  color: var(--cd-ink) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
}
/* basic skin view buttons row */
html.cd-redesign #bo_v_top {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-top: 32px; padding-top: 24px;
  border-top: 1px solid var(--cd-line);
}
html.cd-redesign #bo_v_top .bo_v_left,
html.cd-redesign #bo_v_top .bo_v_com {
  display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0;
}
html.cd-redesign #bo_v_top .bo_v_com { margin-left: auto; }
html.cd-redesign #bo_v_top .bo_v_nb {
  flex: 1 1 100%; list-style: none; padding: 0; margin: 24px 0 0;
  display: grid; gap: 8px;
}
html.cd-redesign #bo_v_top .bo_v_nb li {
  display: grid; grid-template-columns: 80px 1fr auto; gap: 12px;
  padding: 14px 16px;
  background: var(--cd-bg-1); border: 1px solid var(--cd-line); border-radius: 12px;
  color: var(--cd-ink-mute);
}
html.cd-redesign #bo_v_top .bo_v_nb .nb_tit {
  font-family: var(--cd-f-mono); font-size: 11px;
  color: var(--cd-ink-faint); text-transform: uppercase;
}
html.cd-redesign #bo_v_top .bo_v_nb a {
  color: var(--cd-ink) !important; text-decoration: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html.cd-redesign #bo_v_top .bo_v_nb .nb_date {
  font-family: var(--cd-f-mono); font-size: 11px; color: var(--cd-ink-faint);
}
html.cd-redesign #bo_v_top .bo_v_nb li:hover { border-color: var(--cd-accent); }
/* hide redundant text for next/prev caret icons */
html.cd-redesign #bo_v_top .bo_v_nb i { display: none; }
/* file/link section */
html.cd-redesign #bo_v_file, html.cd-redesign #bo_v_link {
  background: var(--cd-bg-1) !important;
  border: 1px solid var(--cd-line); border-radius: 12px;
  padding: 16px 20px !important; margin: 16px 0 !important;
}
html.cd-redesign #bo_v_file h2, html.cd-redesign #bo_v_link h2 {
  font-family: var(--cd-f-mono); font-size: 11px; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--cd-accent) !important;
  margin: 0 0 12px !important; padding: 0 !important;
  background: transparent !important; border: none !important;
}
html.cd-redesign #bo_v_file ul, html.cd-redesign #bo_v_link ul {
  list-style: none; padding: 0; margin: 0;
}
html.cd-redesign #bo_v_file li, html.cd-redesign #bo_v_link li {
  padding: 6px 0; color: var(--cd-ink-mute);
}
html.cd-redesign #bo_v_file a, html.cd-redesign #bo_v_link a { color: var(--cd-accent-2) !important; }
html.cd-redesign #bo_v_file .bo_v_file_cnt, html.cd-redesign #bo_v_link .bo_v_link_cnt {
  display: block; font-family: var(--cd-f-mono); font-size: 11px; color: var(--cd-ink-faint);
}
/* share/sns area */
html.cd-redesign #bo_v_share {
  margin: 16px 0; padding: 12px 0; display: flex; gap: 8px; flex-wrap: wrap;
}
/* bo_fx (bottom buttons row on list) */
html.cd-redesign .bo_fx {
  display: flex; justify-content: flex-end; margin-top: 16px;
}
html.cd-redesign .bo_fx .btn_bo_user { list-style: none; padding: 0; margin: 0; display: flex; gap: 6px; }

/* ---------- comments ---------- */
html.cd-redesign #bo_vc { background: transparent !important; }
html.cd-redesign #bo_vc h2 {
  font-family: var(--cd-f-display); color: var(--cd-ink); font-size: 18px;
  border-top: 1px solid var(--cd-line); padding-top: 24px; margin-top: 24px;
}
html.cd-redesign .cmt_contents { color: var(--cd-ink) !important; background: transparent !important; }
html.cd-redesign #bo_vc article {
  background: var(--cd-bg-1) !important;
  border: 1px solid var(--cd-line);
  border-radius: 12px;
  padding: 16px !important;
  margin-bottom: 10px;
}

/* ---------- FAQ (basic skin) ---------- */
/* Hide top banners (yellow kids banner + dark gray AP banner) on FAQ page */
html.cd-redesign.cd-page-faq .ety-mt-main,
html.cd-redesign.cd-page-faq .ety-mt-main + div,
html.cd-redesign.cd-page-faq #faq_himg,
html.cd-redesign.cd-page-faq #faq_hhtml { display: none !important; }
/* Kill skin's white f2f2f2 backgrounds on FAQ wrappers */
html.cd-redesign.cd-page-faq .py-5,
html.cd-redesign.cd-page-faq .py-5 > .container,
html.cd-redesign.cd-page-faq .py-5 div[style*="f2f2f2"],
html.cd-redesign.cd-page-faq #bo_list,
html.cd-redesign.cd-page-faq #bo_list > div { background: transparent !important; }
html.cd-redesign #faq_wrap { color: var(--cd-ink); background: transparent !important; }
/* Hide left sidebar (내페이지내용 / 공지사항 / 학원소식 / FAQ buttons) */
html.cd-redesign.cd-page-faq #bo_list > div:first-child { display: none !important; }
/* Expand right content to full width, drop float/margin */
html.cd-redesign.cd-page-faq #bo_list > div:nth-child(2),
html.cd-redesign.cd-page-faq #bo_list > div:not(:first-child) {
  float: none !important; margin: 0 !important; width: 100% !important;
}
/* Hide leftover clear:both filler if any */
html.cd-redesign.cd-page-faq #bo_list > div[style*="clear"] { display: none; }

/* FAQ search box */
html.cd-redesign #faq_sch {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--cd-bg-1) !important;
  border: 1px solid var(--cd-line) !important;
  border-radius: 999px !important;
  padding: 4px 6px 4px 14px !important;
  margin-bottom: 24px;
}
html.cd-redesign #faq_sch legend { display: none; }
html.cd-redesign #faq_sch .sch_tit {
  font-family: var(--cd-f-mono); color: var(--cd-ink-faint); font-size: 12px;
}
html.cd-redesign #faq_sch input.frm_input {
  background: transparent !important; border: none !important;
  color: var(--cd-ink) !important; padding: 6px 4px !important; outline: none;
  font-size: 13px;
}
html.cd-redesign #faq_sch .btn_submit {
  background: var(--cd-accent) !important; color: var(--cd-bg) !important;
  border: none !important; border-radius: 999px !important;
  padding: 6px 14px !important; font-size: 12px; cursor: pointer;
}

/* Category pills */
html.cd-redesign #bo_cate { margin-bottom: 24px; }
html.cd-redesign #bo_cate h2 { display: none; }
html.cd-redesign #bo_cate_ul {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-wrap: wrap; gap: 8px;
}
html.cd-redesign #bo_cate_ul li a {
  display: inline-block;
  background: var(--cd-bg-1) !important;
  border: 1px solid var(--cd-line) !important;
  color: var(--cd-ink-mute) !important;
  border-radius: 999px !important;
  padding: 8px 16px !important;
  font-family: var(--cd-f-mono); font-size: 13px;
  text-decoration: none;
}
html.cd-redesign #bo_cate_ul li a#bo_cate_on,
html.cd-redesign #bo_cate_ul li a:hover {
  background: var(--cd-accent) !important;
  color: var(--cd-bg) !important;
  border-color: var(--cd-accent) !important;
}

/* FAQ accordion */
html.cd-redesign #faq_con h2 { display: none; }
html.cd-redesign #faq_con ol { list-style: none; padding: 0; margin: 0; }
html.cd-redesign #faq_con > ol > li {
  background: var(--cd-bg-1) !important;
  border: 1px solid var(--cd-line) !important;
  border-radius: 14px !important;
  margin-bottom: 10px !important;
  padding: 0 !important;
  overflow: hidden;
}
html.cd-redesign #faq_wrap li h3,
html.cd-redesign #faq_con > ol > li h3 {
  background: transparent !important;
  margin: 0 !important;
  padding: 14px 20px !important;       /* override skin's padding-left:50px */
  position: static !important;
  height: auto !important;
  min-height: 56px;
  display: flex !important;
  align-items: center !important;
  gap: 22px !important;
  cursor: pointer;
  line-height: 1.4;
}
html.cd-redesign #faq_wrap li h3 .tit_bg,
html.cd-redesign #faq_con > ol > li h3 .tit_bg {
  position: static !important;         /* kill skin's position:absolute */
  top: auto !important; left: auto !important;
  flex: 0 0 auto;
  display: inline-flex !important;
  align-items: center; justify-content: center;
  width: 28px !important; height: 28px !important;
  border-radius: 999px !important;
  background: var(--cd-accent) !important;
  color: var(--cd-bg) !important;
  font-family: var(--cd-f-mono);
  font-weight: 700;
  font-size: 13px !important;
  line-height: 1 !important;
}
html.cd-redesign #faq_con > ol > li h3 a {
  flex: 1 1 auto;
  color: var(--cd-ink) !important;
  font-family: var(--cd-f-body);
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  line-height: 1.4;
  display: inline-flex;
  align-items: center;
  margin-left: 10px;        /* extra space beyond flex gap */
}
/* Inner <p> wrapper inside the title — kill default block margins/padding */
html.cd-redesign #faq_con > ol > li h3 a p,
html.cd-redesign #faq_con > ol > li h3 a * {
  margin: 0 !important;
  padding: 0 !important;
  display: inline !important;
  line-height: 1.4;
}
html.cd-redesign #faq_con > ol > li h3 .tit_btn {
  background: transparent !important; border: none !important;
  color: var(--cd-ink-faint) !important; cursor: pointer;
  font-size: 14px;
}
html.cd-redesign #faq_con > ol > li .con_inner {
  background: var(--cd-bg-2) !important;
  color: var(--cd-ink) !important;
  padding: 18px 22px 18px 78px !important;   /* leave room for absolute A badge */
  border-top: 1px solid var(--cd-line) !important;
  line-height: 1.7;
  position: relative !important;             /* DO NOT set display — let jQuery toggle */
}
html.cd-redesign #faq_con > ol > li .con_inner > .tit_bg {
  position: absolute !important;
  top: 18px; left: 22px;
  width: 28px !important; height: 28px !important;
  display: inline-flex !important;
  align-items: center; justify-content: center;
  border-radius: 999px !important;
  background: var(--cd-ink-mute) !important;
  color: var(--cd-bg) !important;
  font-family: var(--cd-f-mono);
  font-weight: 700;
  font-size: 13px !important;
  line-height: 1 !important;
}
html.cd-redesign #faq_con > ol > li .con_inner,
html.cd-redesign #faq_con > ol > li .con_inner *,
html.cd-redesign #faq_con > ol > li .con_inner p,
html.cd-redesign #faq_con > ol > li .con_inner div,
html.cd-redesign #faq_con > ol > li .con_inner span,
html.cd-redesign #faq_con > ol > li .con_inner font,
html.cd-redesign #faq_con > ol > li .con_inner li,
html.cd-redesign #faq_con > ol > li .con_inner b,
html.cd-redesign #faq_con > ol > li .con_inner strong {
  color: var(--cd-ink) !important;
  background-color: transparent !important;
}
html.cd-redesign #faq_con > ol > li .con_inner font[color] { color: var(--cd-ink) !important; }
html.cd-redesign #faq_con > ol > li .con_inner a,
html.cd-redesign #faq_con > ol > li .con_inner a * { color: var(--cd-accent-2) !important; }
html.cd-redesign #faq_con > ol > li .closer_btn {
  margin-top: 12px;
  background: transparent !important;
  border: 1px solid var(--cd-line) !important;
  color: var(--cd-ink-faint) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  font-size: 12px; cursor: pointer;
}
html.cd-redesign .empty_list { color: var(--cd-ink-faint); padding: 40px; text-align: center; font-family: var(--cd-f-mono); }

/* ---------- write form ---------- */
html.cd-redesign #bo_w { color: var(--cd-ink); }
html.cd-redesign #bo_w h2, html.cd-redesign #bo_w .h2 {
  font-family: var(--cd-f-display); color: var(--cd-ink);
}
html.cd-redesign #bo_w input[type="text"],
html.cd-redesign #bo_w input[type="password"],
html.cd-redesign #bo_w textarea,
html.cd-redesign #bo_w select {
  background: var(--cd-bg-1) !important;
  border: 1px solid var(--cd-line) !important;
  color: var(--cd-ink) !important;
  border-radius: 8px !important;
  padding: 10px 12px !important;
}
html.cd-redesign #bo_w .btn_submit, html.cd-redesign #bo_w .btn_cancel {
  background: var(--cd-accent) !important;
  color: var(--cd-bg) !important;
  border-radius: 999px !important;
  border: none !important;
  padding: 10px 24px !important;
  font-family: var(--cd-f-mono);
}
html.cd-redesign #bo_w .btn_cancel {
  background: var(--cd-bg-1) !important;
  color: var(--cd-ink) !important;
  border: 1px solid var(--cd-line) !important;
}

/* ---------- top_banner (the old one) hidden on redesigned pages ---------- */
html.cd-redesign .ety-top-banner, html.cd-redesign #top_banner { display: none !important; }

/* ---------- ensure header alignment matches home (1320px content) ---------- */
@media (min-width: 992px) {
  html.cd-redesign .top-line > .container,
  html.cd-redesign .main-nav > .container {
    max-width: 1320px !important;
    width: 100% !important;
    padding-left: 32px !important;
    padding-right: 32px !important;
    margin: 0 auto !important;
  }
  html.cd-redesign #tnb { background: transparent !important; border: none !important; }
  html.cd-redesign #tnb ul { width: 100% !important; background: transparent !important; }
}
html.cd-redesign .top-line { background: #1c1c20 !important; }
html.cd-redesign .main-nav { background: #0a0a0b !important; }
html.cd-redesign #tnb ul li[style*="3d3d3d"] { background: #1f1f24 !important; }

/* ---------- footer dark fix ---------- */
html.cd-redesign #ft, html.cd-redesign #ft_wr, html.cd-redesign .ft {
  background: var(--cd-bg) !important;
  color: var(--cd-ink-mute) !important;
}

/* ---------- mobile responsive ---------- */
@media (max-width: 768px) {
  html.cd-redesign .cd-page-content > .py-5 #bo_list,
  html.cd-redesign .cd-page-content > .py-5 #bo_v,
  html.cd-redesign .cd-page-content #faq_wrap {
    padding: 0 16px;
    margin-top: 24px;
  }
  /* Compact row: one-line, narrower author/date on mobile */
  html.cd-redesign #bo_list table tbody tr {
    padding: 6px 12px; gap: 8px;
    flex-wrap: nowrap !important;
  }
  html.cd-redesign #bo_list table tbody .td_name { display: none !important; }
  html.cd-redesign #bo_list table tbody .td_datetime,
  html.cd-redesign #bo_list table tbody .td_date { flex: 0 0 60px; }
}
@media (max-width: 1089px) {
  html.cd-redesign .cd-page-hero { padding-top: 110px; }
}
