/**
 * FAQ 아코디언 모듈 CSS
 * 원본: momoprs.com/pages/08_03/css/style.css
 * 소스: includes/modules/faq_accordion.php에서 분리
 */

/* .faq_page 스코프로 sub_common.css 스타일 오버라이드 */
.faq_page .img_box img {width: 100%;}
.faq_page .m_color {color: var(--man-color-02);}

/* #content - 원본 08_03 스타일 */
.faq_page.sub_visual,
.faq_page .sub_visual {padding: 130px 0;text-align: center;position:relative;background:transparent;}
.faq_page.sub_visual::after,
.faq_page .sub_visual::after{content:''; display: block; position:absolute; bottom: 0; left: 50%; transform:translate(-50%,0);width: 80%; height: 2px; background:#000;}
.faq_page.sub_visual h1,
.faq_page .sub_visual h1 {font-size: 44px;line-height: 1em;letter-spacing: -1px;color:#000;}

.faq_page .container{padding: 60px 14.7% 160px;}
.faq_container {width:calc(1136 /1368 * 100%); margin: 0 auto; overflow: hidden}
.faq_item {background-color: var(--man-color-04);margin-bottom: 8px}
.faq_item:last-child { margin-bottom: 0;}
.faq_question {display: flex;align-items: flex-start;padding:20px 80px 20px 40px; cursor: pointer;width: 100%;text-align: left;gap: 16px; background: var(--man-color-05); position:relative;}
.faq_item .label {font-weight: 700;font-size: 32px;flex-shrink: 0;}
.faq_item .q_text {flex-grow: 1;font-size: 22px;line-height: 38px;}
.faq_item .icon {flex-shrink: 0;width: 12px;height: 12px;position: absolute;right: 40px;top: 50%;border-right: 2px solid #171717;border-bottom: 2px solid #171717;transform: rotate(45deg) translateY(-50%);transition: transform 0.3s ease-in-out;}

.faq_answer { display: none;}
.answer_content {padding: 24px 40px; display: flex;align-items: flex-start;gap: 16px}
.answer_content .label {color: var(--man-color-02);}
.answer_content .a_text{font-size:20px;line-height: 1.8}
.faq_item.active .icon {transform: rotate(225deg) translate(-50%, 0%);}

.faq_empty {
    text-align: center;
    padding: 60px 20px;
    color: #999;
    font-size: 16px;
}

/* PC (해상도 1440px ~ 1540px) */
@media screen and (max-width:1540px) {
    .faq_page .container{padding: 60px 12.6% 160px;}
}
/* PC (해상도 1058px ~ 1440px) */
@media screen and (max-width:1440px) {
    .faq_container {width: 100%;}
}
/* PC (해상도 1024px ~ 1058px) */
@media screen and (max-width:1058px) {

}


/* 태블릿 (해상도 769px ~ 1024px) */
@media screen and (max-width:1024px) {
    /* content */
    .faq_page.sub_visual,
    .faq_page .sub_visual {padding: 60px 0;}
    .faq_page.sub_visual h1,
    .faq_page .sub_visual h1 {font-size: 36px;}
    .faq_page.sub_visual::after,
    .faq_page .sub_visual::after{width:100%;}

    .faq_page .container{padding: 60px 5% 160px;}
    .faq_question{padding: 24px 60px 24px 24px}
    .faq_item .label {font-size: 20px;}
    .faq_item .q_text{font-size: 18px;line-height: 24px;}
    .answer_content .a_text{font-size:16px;}
    .faq_item .icon {width: 10px;height: 10px;right: 32px;top: 50%;}
}

/* 모바일 가로, 모바일 세로 (해상도 375px ~ 768px)*/
@media screen and (max-width:768px) {
    /* content */
    .faq_page.sub_visual h1,
    .faq_page .sub_visual h1 {font-size: 34px;}

    .faq_page .container{padding: 32px 24px 80px;}
    .faq_question{padding: 16px 50px 16px 20px}
    .faq_item .label {font-size: 18px;}
    .faq_item .q_text{font-size: 16px;line-height: 22px;}
    .answer_content{padding: 20px;}
    .answer_content .a_text{font-size:14px;}
    .faq_item .icon {width: 8px;height: 8px;right: 20px;}
}