@charset "utf-8";
/* =====================================================================
   오늘의 연인 — FAQ 스킨 (자주 묻는 질문)
   · FAQ 페이지는 테마 head 를 거쳐 main.css 가 로드되므로
     사이트 토큰(--gold/--gold-deep/--ink/--ivory/--line/--line-2/--sub/
     --serif/--sans/--radius)을 그대로 사용한다.
   · 아코디언 동작은 기존 jQuery(list.skin.php) 그대로. 디자인만 교체.
   ===================================================================== */

/* ---- 그누보드 컨테이너 정합 (게시판 스킨과 동일: 풀폭·#aside 숨김·헤더/푸터 정렬) ---- */
#wrapper{width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;float:none!important}
#container_wr{width:100%!important;max-width:100%!important;margin:0!important;padding:28px 0 64px!important;float:none!important}
#container_wr:after{content:"";display:block;clear:both}
#container{width:100%!important;max-width:1200px!important;margin:0 auto!important;padding:0 24px!important;float:none!important;box-sizing:border-box!important;min-height:0!important}
#aside{display:none!important}
#wrapper > #container{padding-bottom:80px!important}   /* 모바일(#container_wr 없음) 하단 여백 */

#container_title{
  max-width:100%;margin:0 auto 2rem!important;padding:0 0 1rem!important;
  font-family:var(--serif)!important;font-weight:700!important;
  font-size:clamp(1.5rem,2.6vw,2.2rem)!important;line-height:1.2!important;
  letter-spacing:-0.02em!important;color:var(--ink)!important;
  border-bottom:1px solid var(--line)!important;position:relative;box-shadow:none!important;
}
#container_title::after{content:"";position:absolute;left:0;bottom:-1px;width:56px;height:2px;background:var(--gold)}
#container_title.top{font-size:1.5rem!important;margin:26px 0 1.25rem!important;padding-bottom:.7rem!important}
#container_title.top a{display:none!important}   /* 모바일 뒤로가기 화살표 숨김 */

/* ---- FAQ 검색 ---- */
#faq_sch{
  background:var(--ivory);border:1px solid var(--line);border-radius:var(--radius);
  padding:clamp(20px,3vw,32px);margin:0 0 28px;
  display:flex;justify-content:center;
}
#faq_sch .sch_tit{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
#faq_sch form{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;width:100%;max-width:520px}
#faq_sch .frm_input{
  flex:1;min-width:180px;height:50px;padding:0 16px;box-sizing:border-box;
  border:1px solid #b8af9b;border-radius:var(--radius);background:#fff;
  font-family:var(--sans);font-size:15px;color:var(--ink);
}
#faq_sch .frm_input:focus{outline:none;border-color:var(--gold)}
#faq_sch .btn_submit{
  height:50px;padding:0 24px;border:0;border-radius:var(--radius);cursor:pointer;white-space:nowrap;
  background:var(--ink);color:#fff;font-family:var(--sans);font-weight:700;font-size:15px;
  display:inline-flex;align-items:center;gap:7px;transition:background .25s;
}
#faq_sch .btn_submit:hover{background:var(--gold-deep)}

/* ---- 분류 탭(카테고리) — 골드 pill ---- */
#bo_cate{margin-bottom:28px}
#bo_cate h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
#bo_cate ul{display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0;list-style:none}
#bo_cate li{padding:0;display:inline-block}
#bo_cate a{
  display:block;padding:9px 20px;border-radius:999px;border:1px solid var(--line-2);
  color:var(--sub);font-size:14px;font-family:var(--sans);text-decoration:none;transition:all .25s;
}
#bo_cate a:hover,#bo_cate a:focus,#bo_cate a:active{border-color:var(--gold);color:var(--gold-deep);text-decoration:none;background:transparent}
#bo_cate #bo_cate_on{background:var(--ink);color:#fff;border-color:var(--ink);font-weight:700;box-shadow:none}

/* ---- FAQ 아코디언 ---- */
#faq_wrap{margin:0 0 30px}
#faq_wrap h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
#faq_wrap ol{margin:0;padding:0;list-style:none;border-top:2px solid var(--ink)}
#faq_wrap li{border-bottom:1px solid var(--line);background:#fff;position:relative}
#faq_wrap li:first-child{border-top:none}

#faq_wrap li h3{
  margin:0;min-height:64px;display:flex;align-items:center;gap:12px;
  padding:18px 56px 18px 52px;position:relative;cursor:pointer;
  font-family:var(--sans);font-size:clamp(15px,1.5vw,17px);font-weight:600;line-height:1.5;color:var(--ink);
}
#faq_wrap li h3 .tit_bg{
  position:absolute;left:16px;top:50%;transform:translateY(-50%);
  font-family:var(--serif);font-size:1.55em;font-weight:700;color:var(--gold);text-align:center;
}
#faq_wrap li h3 a{color:inherit;text-decoration:none;flex:1}
#faq_wrap li h3 .tit_btn{
  position:absolute;right:16px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;border:0;background:transparent;color:var(--gold-deep);
  font-size:1.05em;cursor:pointer;transition:transform .3s ease;
}
#faq_wrap li h3.faq_li_open{color:var(--gold-deep)}
#faq_wrap li h3.faq_li_open .tit_btn{transform:translateY(-50%) rotate(45deg)}   /* + → × */

#faq_con .con_inner{
  display:none;padding:2px 56px 28px 52px;position:relative;
  font-family:var(--sans);font-size:15px;line-height:1.85;color:var(--sub);
}
#faq_con .con_inner .closer_btn{
  position:absolute;right:16px;top:6px;width:32px;height:32px;border:0;
  background:transparent;color:var(--gold-deep);font-size:1.05em;cursor:pointer;
}
#faq_con .con_inner img{max-width:100%;height:auto}

/* ---- 빈 목록 / 관리자 / 상하단 이미지 ---- */
.empty_list{padding:60px 0;text-align:center;color:var(--sub);font-size:15px;line-height:1.8}
.faq_admin{text-align:right;margin-top:18px}
.faq_img{margin:0 0 20px}
.faq_img img{max-width:100%;height:auto;display:block}

@media (max-width:768px){
  #faq_sch{padding:18px}
  #faq_wrap li h3{padding:16px 46px 16px 44px;font-size:15px}
  #faq_wrap li h3 .tit_bg{left:12px;font-size:1.3em}
  #faq_con .con_inner{padding:2px 18px 24px 44px}
}