/* 자주하는질문 */
.faq_con{ width:100%; margin-bottom: 12px;}
.faq_con:last-child{margin-bottom: unset;}
.faq_con .faq_q{
  position: relative; 
  font-size: 16px; font-weight: 400; color: var(--clr_black_ex); line-height: 19px;
  word-break: keep-all; cursor: pointer;
  display: flex; align-items: center; gap: 12px;
  border: var(--mix_brdr_btrDkr); background-color: #fff; border-radius: 9px;
  padding: 15px; box-sizing: border-box; 

}
.faq_con .faq_q:hover{background-color: #fefefe;}
.faq_qTitBox{
  width: auto; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  flex: 1;
}
.faq_qTitBox p{width:fit-content;}
.crossSpan{width: 14px; display: flex; transform:rotate(180deg);}
.crossSpan img{width: 100%; height: 100%; object-fit: cover;}

.faq_con .faq_q .q{font-weight: 700; color: var(--clr_black_mn);}
.faq_con .faq_a *{font-weight: 400; color: var(--clr_black_mn);}
.faq_con .faq_a{
  padding: 15px; box-sizing: border-box;
  display: none; position: relative; font-size: 14px; color: var(--clr_black_mn); 
  background-color: #fff; border-radius: 9px;
}
.faq_con.on .faq_a {
  border: var(--mix_brdr_btrDkr); box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.08);
  display: block; margin-top: 2px;
} 
.faq_con.on .crossSpan{rotate:180deg;}
.faq_con .faq_a strong{font-weight: 500 !important;}
.faq_con .faq_a img{width: 100%; max-width: 700px; margin: 0 auto; margin-top: 15px; display: block;}

.faq_q--none{text-align: center; color: var(--clr_black_ex); margin-top: 80px; font-size: 14px;}



@media all and (max-width:767px) {
  .faq_con .faq_a *{font-size: 13px; line-height: 19px;}
  .faq_con .faq_a,
  .faq_con .faq_q{padding: 12px;}
  .faq_con .faq_q{font-size: 13px; gap: 14px;}
  .faq_con .faq_q .q{font-size: 14px;}
  .faq_q--none{font-size: 13px;}
}

@media (min-width: 768px) and (max-width: 1023px) { 
  .faq_con .faq_a *{font-size: 14px; line-height: 22px;}
  .faq_con .faq_a,
  .faq_con .faq_q{padding: 15px;}
  .faq_con .faq_q{font-size: 14px; gap: 16px;}
  .faq_con .faq_q .q{font-size: 16px;}
}

@media all and (min-width:1024px){
  .crossSpan{width: 18px;}
  .faq_con .faq_a *{font-size: 16px; line-height: 25px;}
  .faq_con .faq_a,
  .faq_con .faq_q{padding: 19px 20px;}
  .faq_con .faq_q{font-size: 16px; gap: 19px;}
  .faq_con .faq_q .q{font-size: 18px;}
}