@charset "utf-8";

.category_list {width:100%; max-width:30rem; margin:0 auto 4rem;}
.category_list::-webkit-scrollbar {height: 0rem;}
.category_list::-webkit-scrollbar-thumb {background: #3871e9; border-radius: 10px;}
.category_list::-webkit-scrollbar-track {background: #1D2F5F;}
.category_list ul {display:flex; gap:1rem;}
.category_list li {flex:1;}
.category_list li:first-child {display:none;}
.category_list a {display:flex; flex-direction: column; align-items: center; justify-content:center; position:relative; height:4.4rem; padding:0 1rem; border-radius:1rem; font-size:1.5rem; font-weight:500; white-space:nowrap; background:#F7F8FB; transition:all 0.4s;}
.category_list a::after {position:absolute; top:0; left:0; right:0; bottom:0; border: 1px solid #EBEBEB; border-radius:1rem; content:''; transition:border-color 0.4s;}
.category_list a:hover,
.category_list #bo_cate_on {color:#E70013; background-color:#FEF2F3; box-shadow: 0 .4rem 1rem 0 rgba(231, 0, 19, 0.10);}
.category_list a:hover::after,
.category_list #bo_cate_on::after {border:2px solid #E70013;}


.faq_list {border-top:1px solid #222;}
.faq_list li {border-bottom: 1px solid #EBEBEB;}
.faq_list li > button {display:flex; width:100%; gap:1.5rem; padding:2.5rem;}
.faq_list li > button::after {width:2.4rem; height:2.4rem; margin-left:auto; background:url('./img/icon_faq_arr.svg') no-repeat center/contain; content:'';}
.faq_list li .tit {flex:1; min-width:0; font-size:1.8rem; line-height:1.6; text-align:left;}
.faq_list li .txt_q {font-size:2rem; font-weight:700; line-height:1.4;}
.faq_list li .cont {display:none; padding:2.5rem 5.5rem; border-top: 1px solid #EBEBEB; font-size:1.5rem; line-height:1.6;}
.faq_list li.on {background:#F7F8FB;}
.faq_list li.on > button .txt_q {color:#E70013;}
.faq_list li.on > button::after {transform:rotate(180deg);}


@media screen and (max-width:1024px){
	.category_list {width:auto; max-width:none;}	
	.category_list ul {gap:0.8rem;}
	.category_list a {height:5rem; font-size:1.8rem;}
}
@media screen and (max-width:500px){
	
	.faq_list li > button {padding:2.5rem 2rem 2.5rem;}
	.faq_list li .cont {padding:2.5rem 3rem 2.5rem 5rem;}
}