@charset "utf-8";

a.btn_b03:hover, .btn_b03:hover {background-color: #333;}

ul.faq_list_board {color: #363636; border-top:2px solid #363636; margin-bottom: 5%;}
ul.faq_list_board .chk_box {position: absolute; left: 0; top: 5%; z-index: 1; }
ul.faq_list_board > li{position: relative;}
ul.faq_list_board p.q {display: block; padding:3% 30px 3% 60px; position: relative; border-bottom: 1px solid #f9f9f9; font-weight: 500; cursor: pointer; border-bottom: 1px solid #d5d3d6;}

ul.faq_list_board p.q:after {content:"\f107"; font-family:"FontAwesome"; font-size: 22px; display:block; text-align: center; position:absolute;  width:28px; height:28px; line-height: 28px;right:0; top:50%; margin-top: -14px;	transform: rotate(0deg); transition: 120ms 200ms ease-out;	z-index:12;
}
a.btn_b03, .btn_b03 {color: #fff; background-color: #767676; font-size: 1em; position: absolute; right: 30px; top: 50%; transform: translateY(-50%);}
ul.faq_list_board p.q.on:after  {transform: rotate(-180deg);    transition:  120ms ease-in-out;  }
/* ul.faq_list_board p.q.on {background: #f9f9f9;} */

ul.faq_list_board span.qt {color: #0d51a0; display:block; width: 40px; height: 40px;
    position: absolute; left: 10px; top: 50%; transform: translateY(-50%);
    line-height: 40px; text-align: center; color: #fff;
    background-color: #555b65;
}

ul.faq_list_board div.answer { padding: 0 20px 0 50px; height: 0; overflow: hidden;
    color: #686868; 
    background-color: #f9f9f9;
    position: relative;
    transition: all 0.3s;
}
ul.faq_list_board .q.on + div.answer{padding: 30px 20px 20px 90px; height: 100px; border-bottom: 1px solid #d5d3d6;}
ul.faq_list_board div.answer .desc{}
ul.faq_list_board div.answer:before {content:"A"; display: block; color: #bc0000; width:40px; height: 40px;  display: block; float: left; margin-left: -40px; margin-right: 10px; margin-top: -10px;
    text-align:center; color: #fff; line-height: 40px;
    background-color: #26a19c;
}
ul.faq_list_board div.answer::after{content: "";  width: 20px; height: 20px; 
    border-left: 1px solid #26a19c; border-bottom: 1px solid #26a19c;
    position: absolute; left: 20px; top: 20px;
}
ul.faq_list_board div.answer img {max-width:100%; margin: 0;}

ul.faq_list_board div.answer .desc {font-size: 1em; text-align: left;}
ul.faq_list_board .cate_name {display: inline-block; padding: 0 10px 0 0; text-align: center;}
	
ul.faq_list_board .empty_table {min-height:110px; padding-top: 40px;}

/* ### 기본 스타일 커스터마이징 끝 ### */

/* 게시판 목록 */

#bo_cate {margin:25px 0}
#bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_cate ul {zoom:1}
#bo_cate ul:after {display:block;visibility:hidden;clear:both;content:""}
#bo_cate li {display:inline-block;padding:2px}
#bo_cate a {display:block;line-height:28px;padding:5px 15px;border-radius:3px;border:1px solid #343434;color:#343434}
#bo_cate a:focus, 
#bo_cate a:hover, 
#bo_cate a:active {text-decoration:none;background:#343434;color:#fff}
#bo_cate #bo_cate_on {z-index:2;background:#343434;color:#fff;font-weight:bold;border:1px solid #343434; }


@media screen and (max-width: 768px) {
    ul.faq_list_board div.answer:before,
    ul.faq_list_board span.qt {width: 34px; height: 34px; line-height: 34px;}
    /* ul.faq_list_board span.qt {left: 15px;} */
    ul.faq_list_board p.q {padding: 5% 30px 5% 60px}

    ul.faq_list_board .q.on + div.answer{padding: 30px 20px 20px 70px; height: 100px; border-bottom: 1px solid #d5d3d6;}

    ul.faq_list_board div.answer:before {margin-left: -30px;
    }
    ul.faq_list_board div.answer::after{width: 10px;}
}

@media screen and (max-width: 550px) {
    #container .btn_cancel {line-height: 30px; height: 30px; font-weight: 400;}
    .pg_page{padding: 0; font-size:0.9em}
}