@charset "utf-8";
.cke_sc { display: none !important; } /*단축키 일람 없애기 */
#list { margin-top: 25px; }
#board-category { margin-bottom: 25px; }
#board-category > ul { border-left: 1px solid #343a40; }
#board-category > ul > li { display: block; font-size: 1rem; border: 1px solid #343a40; border-left: 0; margin-bottom: -1px; text-align: center; }
#board-category > ul > li > a { display: inline-block; padding: .375rem .755rem; }
#board-category > ul > li.cate-on { background: #343a40 }
#board-category > ul > li.cate-on > a { color: #fff; }
#board-list-top { position: relative; margin-bottom: 20px; display: flex; }
.list-pageing { display: flex; font-size: 1rem; }
.list-pageing .total { border: 1px solid #343a40; background: #343a40; border-top-left-radius: .25rem; border-bottom-left-radius: .25rem; color: #ffff00; padding: .375rem .75rem; text-align: center; min-width: 50px; }
.list-pageing .pageing { border: 1px solid #343a40; border-top-right-radius: .25rem; border-bottom-right-radius: .25rem; color: #343a40; padding: .375rem .75rem; text-align: center; min-width: 50px; }
.list-search { position: relative; margin-left: 5px; }
.list-search button { }
.list-search .board-search-wrap { display: none; position: absolute; left: 0; top: calc( 100% + 6px ); padding: 25px; background: #fff; z-index: 10; background: #f1f1f1; border: 1px solid #ddd; }
.list-search .board-search-wrap:after { content: ""; position: absolute; top: -6px; left: 15px; width: 0; height: 0; border-style: solid; border-width: 0 5px 6px 5px; border-color: transparent transparent #f1f1f1 transparent; }
.list-search .board-search-wrap:before { content: ""; position: absolute; top: -6px; left: 14px; width: 0; height: 0; border-style: solid; border-width: 0 6px 6px 6px; border-color: transparent transparent #ddd transparent; }
.list-search .board-search-wrap .search-form { display: flex; }
.list-search .board-search-wrap .search-form .sfl { width: auto; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.list-search .board-search-wrap .search-form .stx { width: auto; margin-left: -1px; border-radius: 0; }
.list-search .board-search-wrap .search-form .submit { margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0; }
@media (max-width: 768px) {
.list-pageing { font-size: 14px; }
.list-search { position: static; }
.list-search .board-search-wrap { display: none; position: absolute; left: 10px; right: 10px; top: calc( 100% + 6px ); padding: 15px; background: #fff; z-index: 10; background: #f1f1f1; border: 1px solid #ddd; }
.list-search .board-search-wrap:after { content: ""; position: absolute; top: -6px; left: 15px; width: 0; height: 0; border: 0; }
.list-search .board-search-wrap:before { content: ""; position: absolute; top: -6px; left: 14px; width: 0; height: 0; border: 0; }
.list-search .board-search-wrap .search-form { display: flex; flex-direction: column; }
.list-search .board-search-wrap .search-form .sfl { flex: 1 1 auto; border-radius: 0; margin: 0; margin-bottom: .5rem; }
.list-search .board-search-wrap .search-form .stx { flex: 1 1 auto; margin: 0; margin-bottom: .5rem; }
.list-search .board-search-wrap .search-form .submit { flex: 1 1 auto; border-radius: 0; margin: 0; margin-bottom: .5rem; }
.list-search .board-search-wrap .search-form .board-search-close { flex: 1 1 auto; margin: 0 !important; border-radius: 0; }
}
#board-list { font-size: 1rem; }
#board-list .board-list { position: relative; display: flex; }
#board-list .board-list > div { padding: .75rem; }
#board-list .board-list .wr-chk { text-align: center; flex: 0 0 40px; }
#board-list .board-list .wr-num { text-align: center; flex: 0 0 60px; }
#board-list .board-list .wr-category { text-align: center; flex: 0 0 60px; }
#board-list .board-list .wr-name { text-align: center; flex: 0 0 120px; }
#board-list .board-list .wr-date { text-align: center; flex: 0 0 80px; }
#board-list .board-list .wr-subject { text-align: center; flex: 1 1 auto; }
#board-list .board-list-head { border-top: 2px solid #343a40; }
#board-list > ul > .board-list-body { position: relative; border-top: 1px solid #ddd; }
#board-list > ul > .board-list-body:last-child { border-bottom: 1px solid #ddd; }
#board-list > ul > .board-list-body:hover { background: #f1f1f1; }
#board-list > ul > .board-list-body.even { }
#board-list > ul > .board-list-body.notice { }
#board-list > ul > .board-list-body > div { padding: .75rem; }
#board-list > ul > .board-list-body > div.wr-category { white-space: nowrap; overflow: hidden; }
#board-list > ul > .board-list-body > div.wr-name { white-space: nowrap; }
#board-list > ul > .board-list-body > div.wr-subject { text-align: left; white-space: nowrap; overflow: hidden; }
#board-list > ul > .board-list-body > div.wr-subject > .list-subject { padding: 0; }
#board-list > ul > .board-list-body > div.wr-num .wr-notice { font-weight: 600; color: #dc3545; }
#board-list > ul > .board-list-body > div.wr-num .wr-current { font-weight: 600; }
#board-list > ul > .board-list-body.list-empty { min-height: 250px; text-align: center; padding-top: 50px; }
/* icon */
#board-list .board-list-body > div.wr-subject > .wr-notice { font-weight: 600; color: #dc3545; }
#board-list .board-list-body > div.wr-subject > .wr-secret { padding-right: 5px; }
#board-list .board-list-body > div.wr-subject > .list-icon { display: inline-block; padding-left: 5px; font-size: 12px; }
#board-list .board-list-body > div.wr-subject > .new { margin: 0; padding-right: 10px; font-size: 14px; color: #e74471; }
#board-list .board-list-body > div.wr-subject > .hot { color: #e74471; }
#board-list .board-list-body > div.wr-subject > .comment { font-family:'Montserrat'; color: #fd7e14; }
#board-list .board-list-tail { display: flex; }
#board-list .board-list-tail .board-btn-wrap { margin-left: auto; }
#board-list .board-list-tail .board-btn-wrap > ul { display: flex; }
#board-list .board-list-tail .board-btn-wrap > ul > li:not(:last-child) { margin-right: 8px; }
@media (max-width: 992px) {

}
@media (max-width: 768px) {
#board-list { font-size: 13px; }
#board-list .board-list > div { font-size: 13px; padding: .75rem; }
#board-list .board-list .wr-num { display: none !important; }
#board-list .board-list .wr-name { text-align: center; flex: 0 0 80px; }
#board-list .board-list .wr-date { text-align: center; flex: 0 0 60px; }
}
@media (max-width: 576px) {

}


#board-list .board-list-tail { margin: 25px 0; }

/* view */
#board-view { position: relative; width: 100%; }
#board-view h2.board-view-title { margin: 10px 0; padding: 0 5px; font-size: 1.25rem; }
#board-view h2.board-view-title .title { }
#board-view .view-info { position: relative; margin-top: 15px; width: 100%; -ms-display: flexbox; display: flex; -ms-flex-pack: justify!important; justify-content: space-between!important; flex-wrap: wrap; background-color: #f5f5f5; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 10px 15px; }
#board-view > .view-info > div > span { display: inline-block; margin-right: 5px;align-self: center; }
#board-view > .view-info > .writer { display: flex; }
#board-view > .view-info > .writer > .name { }
#board-view > .view-info > .writer > .ip { }
#board-view > .view-info > .info { text-align: right; }
@media (max-width: 992px) {
#board-view > .view-info > .info { margin-top: .5rem; text-align: left; }
}
#board-view > .view-info > .info > .comment { }
#board-view > .view-info > .info > .view { }
#board-view > .view-info > .info > .good { }
#board-view > .view-info > .info > .nogood { }
#board-view > .view-info > .info > .date { }

#board-view .view-content { padding: 20px; border-bottom: 1px solid #ddd; }
#board-view .view-content img { width: 100%; }

/* view link, file */
#board-view-link { }
#board-view-link h2, #bo_v_file h2 { display: none; }
#board-view-file,
#board-view-link { color: #999; font: normal normal 12px/16px 'Courier New','Gulimche',monospace; }
#board-view-file i,
#board-view-link i { font-size: 16px; color: #000; }
#board-view-file a,
#board-view-link a { color: #2d60a9 !important; }
#board-view-file { padding: 5px 20px; border-bottom: 1px solid #ddd; margin-top: -1px; }
#board-view-file ul { margin: 0; padding: 0; }
#board-view-file ul li { margin: 5px 0; padding: 0; list-style: none; }
#board-view-link { padding: 5px 20px; border-bottom: 1px solid #ddd; margin-top: -1px; }
#board-view-link ul { margin: 0; padding: 0; }
#board-view-link ul li { margin: 5px 0; padding: 0; list-style: none; }
/* 추천,비추천 */
#board-view #bo_v_act { width: 100%; margin: 15px 0; padding: 20px; text-align: center; }
#board-view #bo_v_act .bo_v_act_gng { position: relative; display: inline-block; }
#board-view #bo_v_act_good, 
#board-view #bo_v_act_nogood { display: none; position: absolute; bottom: -5px; left: 50%; margin-left: -80px; padding: 0; height: 30px; line-height: 30px; width: 160px; background: rgba(0,0,0,.75); color: #fff; text-align: center; border-radius: 15px; border: 0; font-size: 12px; }
#board-view #bo_v_act .bo_v_good,
#board-view #bo_v_act .bo_v_nogood { display: inline-block; font-size: 1rem; }
#board-view #bo_v_act .bo_v_good { color: #0186be; }
#board-view #bo_v_act .bo_v_nogood { color: #e74471; }
#board-view #bo_v_act a.bo_v_good:hover, 
#board-view #bo_v_act a.bo_v_nogood:hover { color: #3f4553; }
#board-view #bo_v_act a.bo_v_good:hover span, 
#board-view #bo_v_act a.bo_v_nogood:hover span { background-color: #3f4553; }
#board-view #bo_v_act .bo_v_good span,
#board-view #bo_v_act .bo_v_nogood span { display: inline-block; padding: 4px; width: 100px; height: auto !important; line-height: auto !important; border: 1px solid #aaa; background: #fff; border-radius: 25px; }
#board-view #bo_v_act .bo_v_good span i,
#board-view #bo_v_act .bo_v_nogood span i { margin-right: 5px; }
#board-view #bo_v_act .bo_v_good span { background: #0186be; color: #fff; border: 0; }
#board-view #bo_v_act .bo_v_nogood span { background: #e74471; color: #fff; border: 0; }
#board-view #bo_v_act .bo_v_good strong,
#board-view #bo_v_act .bo_v_nogood strong { display: block; text-align: center; font-size: 1.25rem; font-weight: 400; }

.board-view-btn { margin: 15px 0; }

/* sns */
#bo_v_sns { display: flex; }
#bo_v_sns li img { width: 30px; height: 30px; border-radius: 50%; }

/* board_view_nb 다음글/이전글 */
.board-view-nb { margin: 15px 0; padding: 0; list-style: none; position: relative; clear: both; text-align: left; border-top: 1px solid #ddd; font-size: 1rem; font-weight: 300; }
.board_view-nb:after { display: block; visibility: hidden; clear: both; content: ""; }
.board-view-nb li { border-bottom: 1px solid #ddd; border-top: 0; padding: 10px; -webkit-flex: 1; -ms-flex: 1; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; -ms-flex-pack: space-between; }
.board-view-nb li:hover { background: #f6f6f6; }
.board-view-nb li > * { display: block; white-space: nowrap; }
.board-view-nb li .nb_tit { display: inline-block; padding-right: 10px; color: #3f4553; }
.board-view_nb li .nb_tit i { margin-right: 5px; }
.board-view-nb li a { margin-right: 5px; overflow: hidden; text-overflow: ellipsis; width: 100%; }
.board-view-nb li .nb_date { float: right; color: #888; }

/* 게시판 댓글 */
.board_cmt_btn { position: relative; background: none; border: 0; text-align: left; width: 100%; margin: 30px 0 0 0; padding: 10px 0; font-size: 18px; color: #3f4553; border-bottom: 1px solid #3f4553; }
.board_cmt_btn i { font-size: 22px; color: #3f4553; padding-left: 10px; }
.board_cmt_btn:before { position: absolute; bottom: 5px; right: 5px; content: "\f077"; font-family: 'FontAwesome'; display: block; line-height: 1; transition: all 0.3s ease-in-out; }
.board_cmt_btn:after { position: absolute; bottom: 0; left: 0; content: ""; display: block; width: 4.5em; height: 2px; background: #3f4553; }
.board_cmt_btn:focus { border: 0 !important; border-bottom: 1px solid #3f4553 !important; outline: none !important; }
.board_cmt_btn_op {}
.board_cmt_btn_op:before { bottom: 5px; transform: rotate(180deg); }
.board_cmt_btn_op:after {}

#bo_vc { border-bottom: 1px solid #ddd; }
#bo_vc h1 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_vc h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_vc h3 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_vc article { margin: 0; padding: 10px 10px 10px 15px; position: relative; border-top: 1px solid #ddd; font-size: 14px; min-height: 72px; }
#bo_vc article:not([data-depth="0"]) { padding: 10px 10px 10px 40px; border-color: #eee; background: url('./img/icon_reply.gif') 20px 10px no-repeat; }
/*#bo_vc article:not([data-depth="0"]) .pf_img { display: none; }*/

/*댓글답변*/
#bo_vc { position: relative; width: 100%; }
#bo_vc header .icon_reply { position: absolute; top: 15px; left: -20px; }
#bo_vc header .cmt-name { display: -ms-flexbox!important; display: flex!important; align-items: center; }
#bo_vc header .cmt-name i { margin-right: 3px; }
#bo_vc header .bo_vc_hdinfo { font-size: 12px; color: #777; }
#bo_vc header.comment-header { display: -ms-flexbox!important; display: flex!important; -ms-flex-pack: justify!important; justify-content: space-between!important; align-items: center; }
#bo_vc header.comment-header:after { display: none; clear: both; content: ""; }

#bo_vc .cmt_contents { margin: 5px 0 0 0; font-size: 14px;  }
#bo_vc .cmt_contents p { margin: 0; padding-left: 15px; }
#bo_vc .cmt_contents P .href_name { color: #0186be; }
#bo_vc p a { text-decoration: underline; }
#bo_vc p a.s_cmt { text-decoration: underline; color: #ed6479; }
#bo_vc_empty { font-size: 1rem; margin: 0; padding: 30px 0 !important; color: #777; text-align: center; }
#bo_vc #bo_vc_winfo {}
#bo_vc footer { -webkit-flex: 1; -ms-flex: 1; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; -ms-flex-pack: space-between; margin-top: 10px; }
#bo_vc footer .cmt-icon .cmt-vc-icon { position: relative; display: inline-block; font-size: 11px; border: 1px solid; padding: 0.25em 0.5em; line-height: 1; border-radius: 0.25em; cursor: pointer; color: #777; font-family: 'Dotum',sans-serif; letter-spacing: -0.1em; transition: all 0.3s ease-in-out; }
#bo_vc footer .cmt-icon .cmt-vc-icon i { margin-right: 2px; }
#bo_vc footer .cmt-icon .cmt-vc-icon b.cmt-cnt { margin-left: 2px; font-size: 11px; }
#bo_vc footer .cmt-icon .cmt-vc-icon b.cmt-msg { display: none; position: absolute; top: calc( 100% + 3px ); right: -50%; padding: 0 15px; height: 30px; line-height: 30px; width: 240px; background: rgba(0,0,0,.75); color: #fff; text-align: center; border-radius: 15px; border: 0; font-size: 12px; z-index: 1001; }
#bo_vc footer .cmt-icon .cmt-vc-icon:hover { background-color: #3f4553 !important; border-color: #3f4553 !important; color: #fff !important; }
#bo_vc footer .cmt-icon .cmt-icon-open { background-color: #3f4553 !important; border-color: #3f4553 !important; color: #fff !important; }
#bo_vc footer .cmt-icon .cmt-icon-good { color: #0186be; border-color: #0186be; }
#bo_vc footer .cmt-icon .cmt-icon-nogood { color: #e74471; border-color: #e74471; }
#bo_vc footer .cmt-icon .cmt-icon-good:hover { color: #0186be; border-color:#0186be; }
#bo_vc footer .cmt-icon .cmt-icon-nogood:hover { color: #e74471; border-color: #e74471; }

#bo_vc_w { position: relative; margin-bottom: 1rem; }
@media (max-width: 1200px) {
 #bo_vc_w { position: relative; padding: 0 10px; }
}
#bo_vc_w h1 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_vc_w h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_vc_w h3 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
.bo_vc_w { position: relative; margin: 15px 10px 0 10px; border: 1px solid #ddd; padding: 10px 20px; }
.bo_vc_w:after { display: block; display: block; visibility: hidden; clear: both; content: ""; }
.bo_vc_w #fviewcomment { clear: both; display: block; margin: 10px 0; padding: 0; background: #fff; border-right: 0; border-left: 0; }
.bo_vc_w #char_cnt { display: block; margin: 0 0 5px; }
.bo_vc_w textarea { width: 100%; color: #000; padding: .375rem .75rem; margin: 0; min-height: 100px; background: none !important; border: 1px solid #ced4da; }
.bo_vc_w textarea:focus { }
.bo_vc_w #wr_secret {}

/* 댓글 쓰기 */
.bo_vc_w_wr { margin: 0; margin-top: 1rem; }
.bo_vc_w_info { margin: 0; padding: 15px 0; line-height: 1; -webkit-flex: 1; -ms-flex: 1; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; -ms-flex-pack: space-between; }
.bo_vc_w_info .profile_img {}
.bo_vc_w_info .profile_img img { border-radius: 50%; }
.bo_vc_w_info .bo_vc_w_name { padding: 0 5px;}
.bo_vc_w_info input[type="checkbox"] + label { color: #999; margin-bottom: 0; }
.bo_vc_w_info input[type="checkbox"] + label:hover { color: #999; }
.bo_vc_w_info input[type="checkbox"]:checked + label { color: #3f4553; }
.bo_vc_w_wr { }
.bo_vc_w_wr .vc_btn { text-align: right; }
.bo_vc_w_wr .btn_submit { display: block; border-radius: 0; padding: .375em 1.25rem; background: #3f4553; letter-spacing: -1px; height: calc(1.5em + .75rem + 2px); }



#board-write { }
#board-write .div-write { position: relative; width: 100%; margin-bottom: .5rem; }
@media (min-width: 768px) {
 #board-write .div-select { width: 50% !important; padding-right: .25rem; }
}
#board-write .div-write .board-option { }
#board-write .div-write > .board-option > li { padding-right: .5rem; }
#board-write .div-write > .board-option > li > label { margin: 0; }
/* auto save btn */
#board-write #btn_autosave { position: absolute; top: 0; right: 0; background: #3f4553; color: #fff; letter-spacing: -1px; }
@media (max-width: 768px) {
 #board-write #btn_autosave { position: relative; margin: .25rem 0; float: right; clear: both; z-index: 10; }
}
/* auto save list */
#autosave_pop { display: none; z-index: 1; position: absolute !important; top: calc(2.5em + .75rem + 2px); right: 0; width: 350px; height: auto !important; height: 180px; max-height: 180px; border: 1px solid #565656; background: #fff; -webkit-box-shadow: 2px 2px 3px 0 rgba(0,0,0,0.2); -moz-box-shadow: 2px 2px 3px 0 rgba(0,0,0,0.2); 
box-shadow: 2px 2px 3px 0 rgba(0,0,0,0.2); font-size: 12px; }
@media (max-width: 768px) {
 #autosave_pop { top: calc(6em + .75rem + 2px); z-index: 20; }
}

#autosave_pop:before { content: ""; position: absolute; top: -8px; right: 45px; width: 0; height: 0; border-style: solid; border-width: 0 6px 8px 6px; border-color: transparent transparent #000 transparent; }
#autosave_pop:after { content: ""; position: absolute; top: -7px; right: 45px; width: 0; height: 0; border-style: solid; border-width: 0 6px 8px 6px; border-color: transparent transparent #fff transparent; }
html.no-overflowscrolling #autosave_pop { height: auto; max-height: 10000px !important; } /* overflow 미지원 기기 대응 */
#autosave_pop strong { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#autosave_pop div { text-align: center; margin: 0 !important; }
#autosave_pop button { margin: 0; padding: 0; border: 0; }
#autosave_pop ul { padding: 15px; border-top: 1px solid #e9e9e9; list-style: none; overflow-y: auto; height: 130px; border-bottom: 1px solid #e8e8e8; }
#autosave_pop li { margin: 5px 0; border-bottom: 1px solid #fff; zoom: 1; }
#autosave_pop li:after { display: block; visibility: hidden; clear: both; content: ""; }
#autosave_pop a { display: block; float: left; }
#autosave_pop span { display: block; float: right; color: #999; }
.autosave_close { cursor: pointer; width: 100%; height: 30px; background: none; color: #888; font-weight: bold; font-size: 0.92em; }
.autosave_close:hover { background: #f3f3f3; color: #3597d9; }
.autosave_content { display: none; }
.autosave_del { /* background: url(./img/close_btn.png) no-repeat 50% 50%; text-indent: -999px; overflow: hidden; height: 20px; width: 20px; */; }
.autosave_del { font-style: normal; background: none; display: inline-block; overflow: hidden; height: 18px; width: 18px; }
.autosave_del:before { font-family: 'FontAwesome'; content: "\f014"; font-size: 15px; line-height: 1; }

#board-write .write-link label { position: absolute; top: 0 ;left: 0; padding: .375rem .75rem; border-top-left-radius: .25rem; border-bottom-left-radius: .25rem; background: #3f4553; color: #fff; height: calc(1.5em + .75rem + 2px); min-width: 100px; margin: 0; }

#board-write .write-file .bf-file { position: relative; border: 1px solid #ced4da; border-radius: .25rem; }
#board-write .write-file .bf-file label { white-space: nowrap; padding: .375rem .75rem; border-top-left-radius: .25rem; border-bottom-left-radius: .25rem; background: #3f4553; color: #fff; height: calc(1.5em + .75rem + 2px); min-width: 100px; margin-top: -1px; margin-bottom: -1px; }
#board-write .write-file .bf-file .form-control-file { padding: 0 .75rem; align-self: center; }
@media (max-width: 768px) {
 #board-write .write-link label { min-width: 40px; }
 #board-write .write-file .bf-file label { min-width: 40px; }
}
#board-write .write-btn { margin-top: 1rem; }
#board-write .write-btn .btn { width: 100%; text-align: center; }
#board-write .write-btn .btn_cancel { border-color: #a0a0a0; background: #a0a0a0; color: #fff; }
#board-write .write-btn .btn_submit { border-color: #3f4553; background: #3f4553; color: #fff; }



/* btn wrap */
.board-btn-wrap { }
.board-btn-wrap > ul { }
.board-btn-wrap > ul > li { margin-right: 5px; }
.board-btn-wrap > ul > li:last-child { margin: 0; }
.board-btn-wrap > ul > li > a.btn { }