@charset "utf-8";

/* faq 전용 배경 */
.header_img{background:linear-gradient(180deg,#000000 0%,#06080fcf 51%,#193b8470 100%),url(./img/head.png) no-repeat center center/cover}

/* FAQ 카테고리 탭 스타일 */
.faq-categories{margin:30px 0 20px}
.category-tabs{display:flex;gap:12px;justify-content:flex-start;flex-wrap: wrap;}
.category-tab{display:inline-flex;align-items:center;justify-content:center;padding: 10px 20px;border-radius:6px;font-size: 20px;font-weight:bold;cursor:pointer;text-decoration:none;border:1px solid var(--main-color);background:var(--bg-color);color:var(--main-color);transition:all 0.3s}
.category-tab:hover{background:var(--grey-1)}
.category-tab.active{border:1px solid var(--main-color);background:var(--main-color);color:var(--bg-color)}
.category-tab.active:hover{background:var(--main-color)}

/* FAQ 아코디언 스타일 */
.faq-accordion{margin-top:40px}
.faq-item{border-bottom:1px solid var(--line-color);margin-bottom:0}
.faq-item:first-child{border-top:1px solid var(--line-color)}
.faq-question{padding: 35px 80px 35px 35px;cursor:pointer;position:relative;background:var(--grey-1);transition:background 0.2s;display:flex;align-items:center;gap: 0 30px;}
.faq-question input[type="checkbox"]{width:16px;height:16px;flex-shrink:0}
.faq-question:hover{background:var(--grey-1)}
.faq-question::before{content:'Q.';color:var(--main-color);font-weight:bold;font-size: 24px;flex-shrink:0}
.faq-question::after{content:'▼';position:absolute;right: 30px;transition:transform 0.3s;font-size:12px;}
.faq-question.active::after{transform:rotate(180deg)}
.faq-question-text{flex:1;font-size: 24px;font-weight: bold;}
.faq-edit-btn{display:inline-flex;align-items:center;justify-content:center;padding:6px 12px;border-radius:4px;font-size:14px;font-weight:bold;text-decoration:none;border:1px solid var(--main-color);background:var(--bg-color);color:var(--main-color);transition:all 0.3s;margin-left:auto;flex-shrink:0}
.faq-edit-btn:hover{background:var(--main-color);color:var(--bg-color)}
.faq-answer{max-height:0;overflow:hidden;transition:max-height 0.3s ease-out;background:var(--bg-color)}
.faq-answer.active{max-height:1000px;transition:max-height 0.5s ease-in}
.faq-answer-content{padding:35px;display:flex;gap: 0 30px;align-items: center;}
.faq-answer-content::before{content:'A.';color: var(--main-color);font-weight:bold;font-size: 20px;flex-shrink:0}
.faq-answer-text{flex:1;line-height:1.6;font-size: 20px;}

@media (max-width:1024px){
.category-tab{padding: 10px 15px;font-size: 16px;}
.faq-question{padding:16px 50px 16px 20px}
.faq-question::before{font-size:16px}
.faq-question::after{right:20px}
.faq-question-text{font-size: 20px;}
.faq-answer-content{padding:16px 20px}
.faq-answer-content::before{font-size:16px}
.faq-answer-text{font-size: 16px;}
}