/* =========================================================
   KERD — 푸터 3개 페이지 전용 스타일 (FAQ / 문의하기 / 소개)
   common.css 다음에 로드
   ========================================================= */

/* ---------- FAQ : 검색 ---------- */
.faq-search { display: flex; gap: 8px; margin: 28px 0 20px; }
.faq-search input {
  flex: 1; height: 48px; border: 1px solid var(--line); border-radius: 6px;
  padding: 0 16px; font-size: var(--fs-16); font-family: var(--font);
}
.faq-search input:focus { outline: none; border-color: var(--blue); }
.faq-search .btn { height: 48px; padding: 0 24px; }

/* ---------- FAQ : 카테고리 탭 ---------- */
.faq-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.faq-tab {
  border: 1px solid var(--line); background: #fff; border-radius: 20px;
  padding: 8px 18px; font-size: var(--fs-14); color: var(--ink-2);
}
.faq-tab.is-active { background: var(--navy); color: #fff; border-color: var(--navy); font-weight: 600; }

/* ---------- FAQ : 아코디언 ---------- */
.faq-list { border-top: 2px solid var(--ink); margin-bottom: 60px; }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-q {
  display: flex; align-items: center; gap: 14px; width: 100%;
  background: #fff; border: 0; text-align: left; padding: 20px 8px;
  font-size: var(--fs-16); color: var(--ink);
}
.faq-q .qmark { color: var(--blue); font-weight: 800; font-size: var(--fs-16); width: 48px; flex: none; white-space: nowrap; }
.faq-q .cat { font-size: var(--fs-12); color: var(--gray); border: 1px solid var(--line); border-radius: 4px; padding: 2px 8px; }
.faq-q .txt { flex: 1; font-weight: 500; }
.faq-q .arrow { color: var(--gray); transition: transform .2s; }
.faq-item.is-open .faq-q .arrow { transform: rotate(180deg); }
.faq-a {
  display: none; padding: 28px 48px; color: var(--ink-2);
  font-size: var(--fs-14); line-height: 1.8; background: var(--bg);
  text-align: left; /* 텍스트 좌측 정렬 */
}
.faq-item.is-open .faq-a { display: block; } /* 위아래 동일 패딩 → 세로 중앙 */

/* ---------- 문의하기 레이아웃 ---------- */
.ct-grid { display: grid; grid-template-columns: 1fr 340px; gap: 40px; padding: 32px 0 64px; }
@media (max-width: 900px) { .ct-grid { grid-template-columns: 1fr; } }

/* 폼 */
.ct-form .row { margin-bottom: 20px; }
.ct-form .row.two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ct-label { display: block; font-size: var(--fs-14); font-weight: 600; margin-bottom: 8px; }
.ct-label .req { color: var(--blue); margin-left: 2px; }
.ct-input, .ct-select, .ct-textarea {
  width: 100%; border: 1px solid var(--line); border-radius: 6px;
  padding: 12px 14px; font-size: var(--fs-14); font-family: var(--font); color: var(--ink);
}
.ct-input:focus, .ct-select:focus, .ct-textarea:focus { outline: none; border-color: var(--blue); }
.ct-textarea { min-height: 180px; resize: vertical; }
.ct-file {
  border: 1px dashed var(--line); border-radius: 6px; padding: 16px;
  font-size: var(--fs-13, 13px); color: var(--gray); text-align: center; background: var(--bg);
}
.ct-agree {
  display: flex; gap: 10px; align-items: flex-start; background: var(--bg);
  border: 1px solid var(--line); border-radius: 6px; padding: 14px 16px;
  font-size: var(--fs-13, 13px); color: var(--ink-2); margin-bottom: 24px;
}
.ct-agree a { color: var(--blue); text-decoration: underline; }
.ct-submit { width: 100%; }

/* 우측 안내 카드 */
.ct-side .card {
  border: 1px solid var(--line); border-radius: var(--radius); padding: 24px;
  background: var(--white); margin-bottom: 16px;
}
.ct-side .card h3 { font-size: var(--fs-16); margin-bottom: 16px; }
.ct-side .tel { font-size: 26px; font-weight: 800; color: var(--navy); }
.ct-side .time { font-size: var(--fs-13, 13px); color: var(--gray); margin: 4px 0 18px; }
.ct-side .info { font-size: var(--fs-14); }
.ct-side .info li { display: flex; gap: 8px; padding: 7px 0; border-top: 1px solid var(--line); }
.ct-side .info li .ico { color: var(--gray); width: 54px; flex: none; }
.ct-side .faqcard { background: var(--blue-weak); border-color: #d6e0ff; }
.ct-side .faqcard p { font-size: var(--fs-13, 13px); color: var(--ink-2); margin-bottom: 12px; }

/* 더미 표시 배너 */
.dummy-note {
  background: #fff8e6; border: 1px solid #f0d98a; color: #8a6d00;
  font-size: var(--fs-12); padding: 8px 14px; border-radius: 6px; margin: 12px 0;
}