@charset "utf-8";
@import url(common.css);

/* FAQ */
.BD_count {line-height:1.5rem; margin:1.5rem 0 0;}
.BD_count span {color:#222; font-size:13px}
.BD_count strong.cnt_point { color:#06F}

.faqList { border: 6px solid #0b4d93; border-radius: 1rem 1rem 0 0; background: #fff; overflow: hidden; }
.faqList .list { width:100%}
.faqList .list > dt{display:block;position:relative;border-bottom:1px solid #e9e9e9}
.faqList .list > dt button { width:100%; display:block; border-bottom:1px solid #e9e9e9; padding: 0.85rem 3.5rem 0.85rem 1.2rem; text-align:left; line-height:1.4rem; vertical-align: middle; font-weight:400; background-color:transparent; position: relative; }
.faqList .list > dt button::before { position: absolute; content: "\ea4e"; width: 1.7rem; height: 1.7rem; line-height: 1.7rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; right: 1.2rem; top: 0.76rem; background: #ece9e9; font-size: 1.2rem; color: #4156a7; font-family: 'remixicon'; transition: 0.2s; }

.faqList .list > dt.active button::before { color: #fff; background: #4156a7; transform: rotate(180deg); }

.faqList .list > dt button .faq_Q {position:absolute; top:0.85rem; left:0.75rem; width:1.4rem; height:1.4rem; color:#fff; line-height:1.25rem; text-align:center; margin:0 0.5rem 0 0; border-radius:6px 0; background-color:#0b4d93}
.faqList .list > dt button .faq_question {display:inline-block; *display:inline; zoom:1; margin:0 1rem 0 1.5rem; font-size:0.8rem; color:#4156a7; font-weight: 600; }  
.faqList .list > dd {display:none; position:relative; border-bottom:1px solid #dfdfdf; background:#f9f9f9}
.faqList .list > dd .faq_answer{ margin:0 0.75rem 0 2.75rem; padding:0.75rem 0; font-family:'NotoR'}
.faqList .list > dd .faq_answer > span.faq_A {position:absolute; top:0.6rem; left:0.75rem; width:1.4rem; height:1.4rem; color:#fff; line-height:25px; text-align:center; margin:0 10px 0 0; border-radius:6px 0; background:#00a078; font-family:'NotoM';}
.faqList .list > dd .faq_answer p { font-size: 0.75rem; color: #333; }
.faqList .list > dd .faq_answer p.faq_btn { height:1rem;}
.faqList .list > dt{background: url("/images/board/faq_off.png") no-repeat right center}
.faqList .list > dt.active{background-image:url('/images/board/faq_on.png')}

/** 반응형 **/

@media screen and (max-width: 480px) {
    .faqList .list > dt button { padding: 0.85rem 3rem 0.85rem 1.2rem; }
    .faqList .list > dt button .faq_question { font-size: 0.75rem; }
    .faqList .list > dt button::before { right: 0.75rem; width: 1.5rem; height: 1.5rem; line-height: 1.5rem; }
}
