@charset "UTF-8";
/* ============================================================
   파크골프 FAQ 게시판 style.css v2.0
   기존 사이트 CSS 변수 완전 연동 (--color-primary, --bg-card 등)
   반응형 + 다크모드 [data-theme="dark"] + AOS
   ============================================================ */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   0. 래퍼
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 관리자 버튼 */
.faq-admin-bar {
  text-align: right;
  margin-bottom: .75rem;
}
.faq-admin-btn {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .38rem .9rem;
  background: var(--bg-muted, #f1f5f9);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: var(--radius, 4px);
  font-size: .8rem;
  font-weight: 600;
  color: var(--text-muted, #64748b);
  text-decoration: none;
  transition: all .2s;
}
.faq-admin-btn:hover {
  background: var(--color-primary, #1B5E20);
  color: #fff;
  border-color: var(--color-primary, #1B5E20);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   1. 히어로 배너
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.faq-hero {
  position: relative;
  background: linear-gradient(135deg, var(--color-primary, #1B5E20) 0%, #064e3b 55%, #0a3d2e 100%);
  border-radius: 16px;
  padding: 3rem 2.5rem 2.5rem;
  margin-bottom: 1.5rem;
  overflow: hidden;
  text-align: center;
}

/* 배경 패턴 */
.faq-hero-bg-pattern {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 20% 50%, rgba(74,222,128,.12) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(255,255,255,.06) 0%, transparent 40%);
  pointer-events: none;
}

/* 플로팅 이모지 */
.faq-hero-float {
  position: absolute;
  font-size: 2rem;
  opacity: .18;
  pointer-events: none;
  animation: faq-float 6s ease-in-out infinite;
}
.faq-hero-f1 { top: 18%; left: 6%;  animation-delay: 0s;   font-size: 2.4rem; }
.faq-hero-f2 { top: 25%; right: 8%; animation-delay: 2s;   font-size: 2rem;   opacity: .14; }
.faq-hero-f3 { bottom: 20%; left: 15%; animation-delay: 4s; font-size: 1.6rem; opacity: .12; }
@keyframes faq-float {
  0%,100% { transform: translateY(0) rotate(-3deg); }
  50%      { transform: translateY(-12px) rotate(3deg); }
}

.faq-hero-content { position: relative; z-index: 1; }

.faq-hero-badge {
  display: inline-block;
  background: rgba(74,222,128,.25);
  border: 1px solid rgba(74,222,128,.4);
  color: #a7f3d0;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .12em;
  padding: .25rem .85rem;
  border-radius: 20px;
  margin-bottom: .9rem;
}

.faq-hero-title {
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  font-weight: 900;
  color: #fff;
  margin: 0 0 .65rem;
  letter-spacing: -.03em;
  line-height: 1.25;
  font-family: var(--font, inherit);
}

.faq-hero-desc {
  font-size: .92rem;
  color: rgba(255,255,255,.78);
  line-height: 1.75;
  margin: 0 0 1.5rem;
}

.faq-hero-stats {
  display: inline-flex;
  align-items: center;
  gap: 1.5rem;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50px;
  padding: .55rem 1.5rem;
  backdrop-filter: blur(6px);
}
.faq-hero-stat { text-align: center; }
.faq-hero-stat-num {
  display: block;
  font-size: 1.5rem;
  font-weight: 900;
  color: #4ade80;
  line-height: 1.1;
}
.faq-hero-stat-lbl {
  display: block;
  font-size: .72rem;
  color: rgba(255,255,255,.65);
  margin-top: .1rem;
}
.faq-hero-stat-sep {
  width: 1px;
  height: 36px;
  background: rgba(255,255,255,.2);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   2. 검색 바  (#faq_sch 기존 ID 유지)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.faq-search-section { margin-bottom: 1.25rem; }

#faq_sch {
  background: var(--bg-card, #fff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 2px 10px rgba(0,0,0,.05);
  text-align: left;
  margin: 0;
}

.faq-search-form { display: flex; flex-direction: column; gap: .65rem; }

.faq-search-inner {
  display: flex;
  align-items: center;
  background: var(--bg-muted, #f8fafc);
  border: 1.5px solid var(--border, #e2e8f0);
  border-radius: 10px;
  overflow: hidden;
  transition: border-color .2s, box-shadow .2s;
}
.faq-search-inner:focus-within {
  border-color: var(--color-primary, #1B5E20);
  box-shadow: 0 0 0 3px rgba(27,94,32,.1);
  background: var(--bg-white, #fff);
}

.faq-search-icon-left {
  padding: 0 .9rem;
  color: var(--text-muted, #94a3b8);
  font-size: .95rem;
  flex-shrink: 0;
}

/* 기존 .frm_input 재정의 */
.faq-search-input.frm_input {
  flex: 1;
  height: 46px;
  padding: 0 .5rem;
  border: none !important;
  background: transparent !important;
  font-family: var(--font, inherit);
  font-size: .9rem;
  color: var(--text, #1e293b);
  outline: none;
  box-shadow: none !important;
  width: auto;
}
.faq-search-input.frm_input::placeholder { color: var(--text-light, #94a3b8); }

/* 기존 .btn_submit 재정의 */
.faq-search-btn.btn_submit {
  flex-shrink: 0;
  height: 46px;
  padding: 0 1.4rem;
  background: var(--color-primary, #1B5E20) !important;
  color: #fff !important;
  font-family: var(--font, inherit);
  font-size: .88rem;
  font-weight: 700;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: background .2s;
}
.faq-search-btn.btn_submit:hover { background: var(--color-primary-hover, #0D3B12) !important; }

.faq-search-keyword {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .83rem;
  color: var(--text-muted, #64748b);
  padding: .1rem .2rem;
  flex-wrap: wrap;
}
.faq-search-keyword i { color: var(--color-primary, #1B5E20); }
.faq-search-keyword strong { color: var(--text, #1e293b); }
.faq-clear-btn {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  margin-left: .25rem;
  padding: .18rem .55rem;
  background: var(--bg-muted, #f1f5f9);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 20px;
  font-size: .75rem;
  color: var(--text-muted, #64748b);
  text-decoration: none;
  transition: all .2s;
}
.faq-clear-btn:hover { background: #fee2e2; color: #e11d48; border-color: #fca5a5; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   3. 카테고리 탭  (#bo_cate 기존 ID 유지)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.faq-cat-section { margin-bottom: 1.25rem; }

#bo_cate {
  margin: 0;
}
#bo_cate h2 {
  position: absolute; font-size: 0; line-height: 0; overflow: hidden;
}

.faq-cat-list {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 기존 #bo_cate a 재정의 */
.faq-cat-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .45rem 1rem;
  background: var(--bg-card, #fff);
  border: 1.5px solid var(--border, #e2e8f0);
  border-radius: 30px;
  font-size: .83rem;
  font-weight: 600;
  color: var(--text-muted, #64748b);
  text-decoration: none;
  cursor: pointer;
  transition: all .22s;
  line-height: 1;
  white-space: nowrap;
}
.faq-cat-chip:hover,
.faq-cat-chip:focus {
  background: var(--color-primary-light, #f0fdf4);
  color: var(--color-primary, #1B5E20);
  border-color: #86efac;
  text-decoration: none;
  transform: translateY(-1px);
}
.faq-cat-chip.active,
#bo_cate_on {
  background: var(--color-primary, #1B5E20) !important;
  color: #fff !important;
  border-color: var(--color-primary, #1B5E20) !important;
  font-weight: 700;
}
.faq-cat-icon { font-size: .8rem; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   4. FAQ 아코디언  (#faq_wrap, #faq_con 기존 ID 유지)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#faq_wrap { margin: 0 0 1.5rem; }
#faq_wrap h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }

.faq-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}

/* 각 항목 */
.faq-item {
  background: var(--bg-card, #fff);
  border: 1.5px solid var(--border, #e2e8f0);
  border-radius: 12px;
  overflow: hidden;
  transition: border-color .22s, box-shadow .22s;
}
.faq-item:hover { border-color: #86efac; }
.faq-item.faq-item-open {
  border-color: var(--color-primary, #1B5E20);
  box-shadow: 0 4px 18px rgba(27,94,32,.1);
}

/* 질문 행 */
.faq-item-q {
  margin: 0;
  font-weight: normal;
  min-height: 0;
  line-height: normal;
  padding: 0;
  position: relative;
}

/* Q 배지 */
.faq-q-badge.tit_bg {
  position: absolute;
  top: 50%;
  left: 1.1rem;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  background: var(--color-primary, #1B5E20);
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .85rem;
  font-weight: 800;
  flex-shrink: 0;
  line-height: 1;
  text-align: center;
  transition: background .22s;
}
.faq-item-open .faq-q-badge.tit_bg { background: var(--color-primary, #1B5E20); }

/* 질문 링크 (.faq_button 기존 클래스 유지) */
#faq_wrap .faq_button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem 1.1rem 1rem 3.5rem;
  background: transparent;
  border: none;
  text-decoration: none;
  color: var(--text, #1e293b);
  font-size: .93rem;
  font-weight: 600;
  line-height: 1.55;
  cursor: pointer;
  gap: .75rem;
  min-height: 58px;
  transition: background .2s, color .2s;
}
#faq_wrap .faq_button:hover { background: #f8fafc; color: var(--color-primary, #1B5E20); }
.faq-item-open #faq_wrap .faq_button,
.faq-item-open .faq_button {
  background: var(--color-primary-light, #f0fdf4);
  color: var(--color-primary, #1B5E20);
}

.faq-q-text { flex: 1; }

/* 토글 화살표 */
.faq-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: var(--bg-muted, #f1f5f9);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 50%;
  flex-shrink: 0;
  transition: background .22s, transform .3s, border-color .22s;
}
#faq_wrap .toggle i {
  font-size: .78rem;
  color: var(--text-muted, #64748b);
  transition: color .22s, transform .3s;
}
.faq-item-open .faq-toggle {
  background: var(--color-primary, #1B5E20);
  border-color: var(--color-primary, #1B5E20);
}
.faq-item-open .faq-toggle i { color: #fff !important; }

/* 답변 영역 (.con_inner 기존 클래스 유지) */
#faq_con .con_inner,
.faq-item-a {
  display: none;
  border-top: 1.5px solid var(--border, #e2e8f0);
  padding: 1.25rem 1.25rem 1rem 3.5rem;
  position: relative;
  background: var(--bg-muted, #f8fafc);
}
.faq-item-open .faq-item-a { border-top-color: #bbf7d0; }

/* A 배지 */
.faq-a-badge.tit_bg {
  position: absolute;
  top: 1.2rem;
  left: 1.1rem;
  width: 32px;
  height: 32px;
  background: #4ade80;
  color: #14532d;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .82rem;
  font-weight: 800;
  line-height: 1;
  text-align: center;
}

.faq-a-body {
  font-size: .9rem;
  line-height: 1.8;
  color: var(--text, #1e293b);
  word-break: break-word;
}
.faq-a-body img { max-width: 100%; height: auto; border-radius: 8px; margin: .5rem 0; }
.faq-a-body p { margin: 0 0 .65rem; }
.faq-a-body p:last-child { margin-bottom: 0; }

/* 닫기 버튼 (.con_closer, .closer_btn 기존 유지) */
.faq-closer.con_closer {
  text-align: right;
  margin-top: .85rem;
  padding-top: .75rem;
  border-top: 1px dashed var(--border, #e2e8f0);
}
.faq-close-btn.closer_btn {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .32rem .85rem;
  background: var(--bg-card, #fff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 20px;
  font-family: var(--font, inherit);
  font-size: .78rem;
  font-weight: 600;
  color: var(--text-muted, #64748b);
  cursor: pointer;
  transition: all .2s;
  height: auto;
}
.faq-close-btn.closer_btn:hover {
  background: var(--color-primary, #1B5E20);
  color: #fff;
  border-color: var(--color-primary, #1B5E20);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   5. 빈 상태
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.faq-empty {
  text-align: center;
  padding: 4rem 1rem;
  background: var(--bg-card, #fff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 12px;
}
.faq-empty-ico { font-size: 3.5rem; margin-bottom: .85rem; }
.faq-empty h3 { font-size: 1.1rem; font-weight: 700; color: var(--text, #1e293b); margin: 0 0 .5rem; }
.faq-empty p  { font-size: .88rem; color: var(--text-muted, #64748b); line-height: 1.7; margin: 0 0 1.25rem; }
.faq-empty-link {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .55rem 1.3rem;
  background: var(--color-primary, #1B5E20);
  color: #fff;
  border-radius: var(--radius, 4px);
  font-size: .88rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s;
}
.faq-empty-link:hover { background: var(--color-primary-hover, #0D3B12); color: #fff; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   6. 페이지네이션
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.faq-paging {
  text-align: center;
  padding: 1rem 0 .5rem;
}
.faq-paging .pg_wrap { text-align: center; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   7. 하단 문의 유도 배너
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.faq-contact-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  background: linear-gradient(135deg, var(--color-primary-light, #f0fdf4) 0%, #ecfdf5 100%);
  border: 1.5px solid #86efac;
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  margin-top: 1.5rem;
  flex-wrap: wrap;
}
.faq-contact-left {
  display: flex;
  align-items: center;
  gap: .85rem;
  flex: 1;
  min-width: 0;
}
.faq-contact-emoji { font-size: 2rem; flex-shrink: 0; }
.faq-contact-text { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.faq-contact-text strong {
  font-size: .93rem;
  font-weight: 700;
  color: var(--color-primary, #1B5E20);
}
.faq-contact-text span {
  font-size: .82rem;
  color: var(--text-muted, #64748b);
}
.faq-contact-btn {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .62rem 1.3rem;
  background: var(--color-primary, #1B5E20);
  color: #fff;
  border-radius: var(--radius, 4px);
  font-size: .88rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  transition: background .2s, transform .2s;
  flex-shrink: 0;
}
.faq-contact-btn:hover {
  background: var(--color-primary-hover, #0D3B12);
  color: #fff;
  transform: translateY(-1px);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   8. 다크모드
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
[data-theme="dark"] .faq-hero {
  background: linear-gradient(135deg, #0a3010 0%, #042a1e 55%, #031f17 100%);
}
[data-theme="dark"] #faq_sch {
  background: var(--bg-card, #1e293b);
  border-color: var(--border, #334155);
}
[data-theme="dark"] .faq-search-inner {
  background: #0f172a;
  border-color: var(--border, #334155);
}
[data-theme="dark"] .faq-search-input.frm_input {
  color: var(--text, #f1f5f9);
}
[data-theme="dark"] .faq-search-input.frm_input::placeholder { color: #475569; }
[data-theme="dark"] .faq-cat-chip {
  background: var(--bg-card, #1e293b);
  border-color: var(--border, #334155);
  color: var(--text-muted, #94a3b8);
}
[data-theme="dark"] .faq-cat-chip:hover {
  background: rgba(27,94,32,.25);
  color: #4ade80;
  border-color: rgba(74,222,128,.3);
}
[data-theme="dark"] .faq-cat-chip.active,
[data-theme="dark"] #bo_cate_on {
  background: var(--color-primary, #1B5E20) !important;
  color: #fff !important;
}
[data-theme="dark"] .faq-item {
  background: var(--bg-card, #1e293b);
  border-color: var(--border, #334155);
}
[data-theme="dark"] .faq-item:hover { border-color: rgba(74,222,128,.3); }
[data-theme="dark"] .faq-item.faq-item-open { border-color: rgba(74,222,128,.5); }
[data-theme="dark"] #faq_wrap .faq_button {
  color: var(--text, #f1f5f9);
}
[data-theme="dark"] #faq_wrap .faq_button:hover {
  background: rgba(255,255,255,.04);
  color: #4ade80;
}
[data-theme="dark"] .faq-item-open .faq_button {
  background: rgba(27,94,32,.2);
  color: #4ade80;
}
[data-theme="dark"] .faq-toggle {
  background: #334155;
  border-color: #475569;
}
[data-theme="dark"] .faq-item-open .faq-toggle { background: var(--color-primary, #1B5E20); }
[data-theme="dark"] #faq_con .con_inner,
[data-theme="dark"] .faq-item-a {
  background: rgba(15,23,42,.6);
  border-top-color: var(--border, #334155);
}
[data-theme="dark"] .faq-item-open .faq-item-a { border-top-color: rgba(74,222,128,.25); }
[data-theme="dark"] .faq-a-body { color: var(--text, #f1f5f9); }
[data-theme="dark"] .faq-closer.con_closer { border-top-color: var(--border, #334155); }
[data-theme="dark"] .faq-close-btn.closer_btn {
  background: #334155;
  border-color: #475569;
  color: #94a3b8;
}
[data-theme="dark"] .faq-close-btn.closer_btn:hover {
  background: var(--color-primary, #1B5E20);
  color: #fff;
}
[data-theme="dark"] .faq-empty {
  background: var(--bg-card, #1e293b);
  border-color: var(--border, #334155);
}
[data-theme="dark"] .faq-contact-banner {
  background: rgba(27,94,32,.15);
  border-color: rgba(74,222,128,.25);
}
[data-theme="dark"] .faq-contact-text span { color: #64748b; }
[data-theme="dark"] .faq-search-keyword { color: #64748b; }
[data-theme="dark"] .faq-search-keyword strong { color: #f1f5f9; }
[data-theme="dark"] .faq-admin-btn {
  background: #334155;
  border-color: #475569;
  color: #94a3b8;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   9. 반응형
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 768px) {
  #faq-board { padding: 0 0 2rem; }

  .faq-hero { padding: 2rem 1.25rem 1.75rem; border-radius: 12px; }
  .faq-hero-title { font-size: 1.5rem; }
  .faq-hero-desc { font-size: .85rem; }
  .faq-hero-stats { padding: .45rem 1.1rem; gap: 1rem; }
  .faq-hero-stat-num { font-size: 1.25rem; }
  .faq-hero-f1, .faq-hero-f2, .faq-hero-f3 { display: none; }

  #faq_sch { padding: 1rem; border-radius: 10px; }
  .faq-search-input.frm_input { font-size: .85rem; }
  .faq-search-btn.btn_submit { padding: 0 1rem; font-size: .83rem; }

  .faq-cat-list { gap: .35rem; }
  .faq-cat-chip { padding: .4rem .8rem; font-size: .78rem; }

  #faq_wrap .faq_button {
    padding: .85rem .9rem .85rem 3.1rem;
    font-size: .87rem;
    min-height: 52px;
  }
  .faq-q-badge.tit_bg { width: 28px; height: 28px; left: .85rem; font-size: .78rem; }
  .faq-a-badge.tit_bg { width: 28px; height: 28px; left: .85rem; top: 1rem; font-size: .78rem; }
  #faq_con .con_inner,
  .faq-item-a { padding: 1rem .9rem 1rem 3rem; }
  .faq-a-body { font-size: .86rem; }
  .faq-toggle { width: 24px; height: 24px; }

  .faq-contact-banner { flex-direction: column; align-items: flex-start; padding: 1rem; }
  .faq-contact-btn { width: 100%; justify-content: center; }
}

@media (max-width: 480px) {
  .faq-hero { padding: 1.5rem 1rem 1.4rem; }
  .faq-hero-title { font-size: 1.3rem; }
  .faq-hero-badge { font-size: .62rem; }
  .faq-hero-stats { display: none; }

  .faq-cat-chip { font-size: .75rem; padding: .35rem .7rem; }
  .faq-cat-icon { display: none; }

  #faq_wrap .faq_button { font-size: .84rem; }
  .faq-toggle { display: none; }
}

@media (max-width: 380px) {
  .faq-search-input.frm_input { font-size: .8rem; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   10. 사운드온리 유틸
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sound_only {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  margin: -1px;
  padding: 0;
  width: 1px;
  height: 1px;
  border: 0;
}