/* ---------------------------------------------------------------------------------------------------------------------
   이호석한의원 /faq — 병원 오버라이드 templates/user/faq.html 전용. 출처: test2.noszip.com faq.html 페이지 <style>(2026-10-18판).
   리셋·반응형 공통은 jy-brand.css(.jy-brand) 를 함께 로드하고, 여기서는 FAQ 전용 + 의미가 다른 hover(hv-2·hv-3)만 덮는다
   (.jy-brand.jy-faq 특이도가 jy-brand.css 의 .jy-brand .hv-* 보다 높다).
--------------------------------------------------------------------------------------------------------------------- */

/* 공통 본문 래퍼(.page-wrap) 비움 — 이 템플릿은 main 자신이 .jy-brand (소개형 페이지는 main > .jy-brand) */
.page-wrap:has(> main.jy-faq){ max-width:none; padding:0; }

/* 아코디언 — summary 마커 숨김, 펼치면 화살표 회전 */
.jy-faq .fq-item summary::-webkit-details-marker{ display:none; }
.jy-faq .fq-item summary .fq-arrow{ transition:transform .2s ease; }
.jy-faq .fq-item[open] summary .fq-arrow{ transform:rotate(180deg); }
.jy-faq .fq-arrow svg, .jy-faq .fq-search svg{ display:block; }

/* 답변 — 에디터 HTML(클래스 없는 p·목록)을 원본 답변 문단(.p-18-7) 모양으로 */
.jy-faq .fq-answer :where(p, li){ font-size:18px; line-height:1.95; color:rgb(78, 78, 78); }
.jy-faq .fq-answer :where(p){ margin:0; }
.jy-faq .fq-answer :where(ul, ol){ margin:0; padding-left:1.3em; }
.jy-faq .fq-answer :where(ul){ list-style:disc; }
.jy-faq .fq-answer :where(ol){ list-style:decimal; }
.jy-faq .fq-answer :where(a){ color:#2E733B; text-decoration:underline; }
.jy-faq .fq-answer :where(img){ max-width:100%; height:auto; border-radius:8px; }

/* 구분 선택 — 원본 form select 화살표 */
.jy-faq form select{ appearance:none; -webkit-appearance:none; width:auto; min-width:0 !important; padding-right:38px !important;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1.5l5 5 5-5' fill='none' stroke='%23191E14' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>") !important;
	background-repeat:no-repeat !important; background-position:right 15px center !important; background-color:#fff !important; }

/* 공통 site.css 의 요소 규칙(input·textarea 폭 100%·최대 30rem·여백, button 넓은 여백)을 브라우저 기본으로 —
   0,0,1 로 뒤에 로드되어 이기고, 원본 클래스(폭·높이)에는 진다 */
:where(.jy-faq) input{ width:auto; max-width:none; padding:1px 2px; }
:where(.jy-faq) button{ padding:1px 6px; }

/* 검색 결과 줄 · 빈 결과 */
.jy-faq .fq-result{ margin:18px 0 0; font-size:15px; color:rgb(107, 114, 99); }
.jy-faq .fq-result a{ margin-left:8px; color:#2E733B; }
.jy-faq .fq-empty{ padding:60px 0; text-align:center; color:rgb(107, 114, 99); }

/* 페이지 이동 — 비활성 화살표 */
.jy-faq .fq-pager-off{ opacity:.35; pointer-events:none; }

@media (max-width:640px){
	.jy-faq .fq-item summary{ grid-template-columns:40px 1fr 24px !important; gap:12px !important; }
	.jy-faq .fq-item > div{ padding:26px 20px 30px !important; }
}

/* hover (원본 style-hover — 이 페이지의 의미) */
.jy-brand.jy-faq .hv-1:hover{ color:#2E733B !important; }
.jy-brand.jy-faq .hv-2:hover{ border-color:#2E733B !important; color:#2E733B !important; background:none !important; }
.jy-brand.jy-faq .hv-3:hover{ background:#EEF6EA !important; color:#2E733B !important; }