@charset "utf-8";

/* table acc */
.tbl_remark{display:flex; justify-content: flex-end; padding: 10px 0; font-size: 13px; color: #999;}
.cat{display:inline-block; padding:0 8px; margin:1px; height:26px; border:1px solid #ddd; vertical-align:middle; font-size:12px; line-height:24px; width:fit-content;}

/*shadow_box*/
.shadow_box{box-shadow:0 4px 4px rgba(var(--main-color-rgb), 0.04), 0 -4px 4px rgba(var(--main-color-rgb), 0.04), 4px 0 4px rgba(var(--main-color-rgb), 0.04), -4px 0 4px rgba(var(--main-color-rgb), 0.04);}

/* nodata */
.nodata{width:100%; padding:40px; text-align:center; font-family: var(--tit_font); border-radius:10px;}
.nodata:hover{border:none;}
.nodata .bx{color:rgba(var(--main-color-rgb), 0.4); font-size:28px;}

/* scrollTable */
.scrollTable{overflow:auto;}
.scrollTable table{table-layout: fixed;}

/* bbsList */
.bbsList{position:relative; width:100%; border-top:1px solid #ddd; border-collapse: collapse; width:100%;}
.bbsList caption{overflow:hidden; line-height:0; text-indent:-2000em;}
.bbsList th{position:relative; padding:17px; font-weight:600; color:#222; border-bottom:1px solid #ddd; background-color:#f9fafb; text-align:center; vertical-align: middle;}
.bbsList th + th:before{content:""; display:block;  position:absolute; top:0; bottom:0; left:0; margin:auto; width:1px; height:17px; background-color:#ddd;}
.bbsList tbody th:before{content:none;}
.bbsList td{padding:17px; border-bottom:1px solid #ddd; text-align:center; color:#454545; word-break:break-all; vertical-align: middle;}
.bbsList td > a:not(.btn){display:block; width:100%; height:100%;}

/* bbsTblView */
.bbsTblView{border-collapse: collapse; width:100%; table-layout: fixed;}
.bbsTblView caption{overflow:hidden; line-height:0; text-indent:-2000em;}
.bbsTblView th{padding: 20px 16px; background-color: #fafafa; border:1px solid #ddd; font-weight: 600; vertical-align: middle; color:#222}
.bbsTblView td{padding: 20px 16px; border: 1px solid #ddd; color:#454545; vertical-align: middle;}

/* tb_search_resulte */
.tb_search_resulte{padding-top:20px; border-top:1px dashed #eee; margin-top:20px;}
.tb_search_resulte ul{border-top:1px dashed #ddd; background:#fff; width:100%; max-height:300px; overflow-y:auto; border:1px solid #eee;}
.tb_search_resulte li{padding:10px; color:#666; cursor: pointer;}
.tb_search_resulte li:hover{color:#222; background:#f9f9f9;}
.tb_search_resulte li + li{padding-top:15px; border-top:1px solid #eee;}
.tb_search_resulte li.bbsNoneData{border-bottom:none;}
.tb_search_resulte li.bbsNoneData:hover{color:#666; cursor:unset; background:#fff;}

/* bbs_type_gallery */
.bbs_type_gallery{border-top:1px solid #ddd; padding:30px 0; border-bottom:1px solid #ddd;}
.bbs_type_gallery > ul{display:flex; gap:40px; flex-wrap: wrap;}
.bbs_type_gallery > ul > li:not(.nodata){width:calc((100% - 120px)/4);}

.bbs_type_gallery .img_box{border-radius:10px;}
.bbs_type_gallery .img_box > span{font-size:20px; font-family: var(--tit_font); font-weight: 700; color:#222; position:absolute; bottom:0; top:0; left:20px; margin:auto; width:calc(70% - 40px); height:fit-content;}
.bbs_type_gallery .gall_txt{margin-top:15px;}
.bbs_type_gallery .gall_txt > a{display:block; font-family: var(--tit_font); font-size:18px; font-weight: 500; color:#222;}
.bbs_type_gallery .gall_txt > span{font-size:15px;}

/* bbsView */
.bbsView{}
.bbsView_top{}
.bbsView_top{width:100%; padding:20px 0; margin-bottom:40px; border-top:1px solid #ddd; border-bottom:1px solid #ddd; font-size:0; text-align: center; background: #f9fafb;}
.bbsView_top > *{display:inline-block; position:relative; padding:0 15px; font-size:1rem; color:#888; vertical-align:middle;}
.bbsView_top > *:after{content:""; display:block; position:absolute; top:50%; right:0; width:1px; height:13px; margin-top:-6.5px; background:#d1d1d1;}
.bbsView_top > *:last-child:after{content:none;}
.bbsView_top b{display:inline-block; padding-right:7px; font-weight:500; color:#333;}
.bbsView_top span.author{color:#333;}
.bbsView_body{border-bottom:1px solid #ddd; padding-bottom:40px;}
.bbsView_body .view_content{}
.bbsView_body .view_content img{max-width:100%; object-fit: contain;}

.bbsView .file_list{}
.bbsView .file_list > b{background: #f9fafb; padding:10px 15px;}
.bbsView .file_list > ul > li{padding:10px 15px;}
.bbsView .file_list > ul > li.nodata{font-family: var(--txt_font);}
.bbsView .file_list > ul > li > p{max-width:100%;}
.bbsView .file_list > ul > li > p > i{font-sizE:20px;}

/*질문답변*/
.faqList{border-top:1px solid #27272f;}
.faqList .state{display:inline-block; position:absolute; top:50%; left:32px; transform:translateY(-50%); width:32px; height:32px; line-height:30px; background:#c1c1c1; border-radius:50%; font-weight:400; text-align:center; color:#fff; vertical-align:middle; transition:background .3s;}
.faqList dt{display:block; position:relative; padding:1.625rem 74px; border-bottom:1px solid #ddd; cursor:pointer;}
.faqList dt .ctrl{display:block; position:absolute; right:17px; top:50%; width:44px; height:26px; padding:0; background:none; border:none; outline:0; cursor:pointer; transform:translateY(-50%);}
.faqList dt .ctrl:after{content:""; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:url(/images/page/board/icon_arw_down.png) no-repeat 50% 50%; transition:transform 300ms;}
.faqList dd{overflow:hidden; background-color:#ffffff; border-bottom:1px solid transparent; transition:border .3s;}
.faqList dd .text:first-child{margin-top:0;}
.faqList dd .desc{display:none; position:relative; padding:1.625rem 74px;}
.faqList dt.active p{color:#27272f; font-weight:600;}
.faqList dt.active .ctrl:after{background-image:url(/images/page/board/icon_arw_up.png)}
.faqList dt.active .state{background-color: var(--main-color);}
.faqList dd.active{border-color:#ddd; background-color:#fafafa;}
.faqList dd.active .state{background-color:var(--sub-color);}

/* pagination nomarl  */
.pagination {display:flex; justify-content: center; text-align: center; text-align: center; gap:10px; margin-top: 30px;}
.pagination .page_item {display: inline-block; width: 40px; height: 40px; line-height: 40px; border: 1px solid transparent; color: #454545; font-size:15px;}
.pagination .page_item.on {color: #fff; background:var(--main-color); border:1px solid var(--main-color); border-radius:5px;}
.pagination .page_control {display: flex; gap:5px; align-items:center; }
.pagination .page_control .page_item {opacity: .5; border-color: #ccc; border-radius:5px; font-size:0;}
.pagination .page_control .page_item i{font-size:16px;}

/* view paging */
.view_paging {margin-top: 50px; text-align: center; display:flex; justify-content: space-between; align-items: center;}
.view_ctrl {position: relative;}
.view_ctrl:before { content: ''; display: inline-block; width: 60px; height: 60px; line-height:60px; font-size: 18px; border: 1px solid #eaeaea; border-radius: 50%; color:#999; vertical-align: middle;  font-family: boxicons !important; margin:auto; transition: border .3s; position:absolute; top:0; bottom:0; margin:auto;}
.view_ctrl:hover:before, .view_ctrl:hover:after {border-color: #999;}
.view_ctrl.prev_btn {padding-left:60px;}
.view_ctrl.next_btn {padding-right:60px;}
.view_ctrl.prev_btn:before {content:"\f180"; left:0;}
.view_ctrl.next_btn:before {content:"\f1a3"; right:0;}
.view_ctrl .txt {display: inline-block; vertical-align: middle; color: #666; margin: 0 10px;}
.view_ctrl .txt > b { display: block; color: #333;}


/* **************************************** *
 1280px
 * **************************************** */
 @media (max-width:1280px){

    /* bbs_type_gallery */
    .bbs_type_gallery > ul > li:not(.nodata){width:calc((100% - 80px)/3);}

}

/* **************************************** *
 1024px
 * **************************************** */
 @media (max-width:1024px){

    /* bbsTblView */
    .bbsTblView th,
    .bbsTblView td{padding:12px; font-size:15px;}

    /* bbs_type_gallery */
    .bbs_type_gallery > ul > li:not(.nodata){width:calc((100% - 80px)/3);}

 }

/* **************************************** *
 * 768px
 * **************************************** */
 @media (max-width:768px){

    /* bbsTblView */
    .bbsTblView,
    .bbsTblView tr,
    .bbsTblView thead,
    .bbsTblView tbody,
    .bbsTblView th,
    .bbsTblView td{display:block; width:100%;}

    .bbsTblView{border-top:2px solid #222; border-bottom:1px solid #ddd;}
    .bbsTblView th{border:1px solid #ddd; border-width: 1px 0;}
    .bbsTblView td{border:none;}

    /* bbs_type_gallery */
    .bbs_type_gallery > ul{gap:20px;}
    .bbs_type_gallery > ul > li:not(.nodata){width:calc((100% - 20px)/2);}
    .bbs_type_gallery .txt_box{font-size:14px;}

 }

/* **************************************** *
 * 640px
 * **************************************** */
 @media (max-width:640px){


 }


/* **************************************** *
 * 576px
 * **************************************** */
 @media (max-width:576px){

    /* view_paging */
    .view_paging{margin-top:30px;}
    .view_ctrl.prev_btn{padding-left:45px;}
    .view_ctrl.next_btn{padding-right:45px;}
    .view_ctrl:before{width:45px; height:45px; line-height:45px;}
    .view_ctrl .txt{font-size:14px;}
    .view_ctrl .txt > *{display:block; line-height:100%; text-align:center;}
    .view_ctrl .txt > span{padding-top:5px;}

 }

 
/* **************************************** *
 * 425px
 * **************************************** */
 @media (max-width:425px){

    /* bbs_top */
    .bbs_top .list_search{display:flex; flex-direction: column; min-width: 100%;}
    .bbs_top .list_search select, .search_input{width:100%; margin:5px auto;}

    /* bbs_type_gallery */
    .bbs_type_gallery > ul{gap:10px;}
    .bbs_type_gallery > ul > li:not(.nodata){width:100%;}

 }