@charset "UTF-8";

/* 초기화  222 */
* { margin: 0; padding: 0; font-family: inherit; outline: none; font-size: 1em; box-sizing: border-box; }
html { overflow-y: scroll; }
body { font-size: 1em; }
header, footer, section, article, aside, details, nav, menu, hgroup, figcaption, figure { display: block; }
input[type="submit"], input[type="button"], button, a, label { cursor: pointer; }
h1,h2,h3,h4,h5,h6,th { font-weight: inherit; }
ul, li, dl, dt, dd { list-style: none; }
a { text-decoration: none; color: inherit; }
legend { display: none; }
fieldset { border: 0; }
hr { display: none; }
table { border-collapse: collapse; }
small { font-size: 0.875em; }
textarea { resize: none; }

::placeholder { color: #aaa; }
.placeholdersjs {color:#aaa !important}


/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff}
.hd_pops img {max-width:100%}
.hd_pops_con {}
.hd_pops_footer {padding:0;background:#000;color:#fff;text-align:left;position:relative}
.hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""}
.hd_pops_footer button {padding:10px;border:0;color:#fff}
.hd_pops_footer .hd_pops_reject {background:#000;text-align:left}
.hd_pops_footer .hd_pops_close {background:#393939;position:absolute;top:0;right:0}


/* 개인정보취급방침 */
.privacyOpen { cursor: pointer; }
#privacy { font-size: 1rem; position: fixed; left: 0; top: 0; bottom: 0; right: 0; margin: auto; background-color: rgba(0,0,0,0.5); display: none; z-index: 999999; }
#privacy .box { width: 90%; max-width: 600px; background-color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); border-radius: 10px; overflow: hidden; }
#privacy .box h3 { font-size: 1.125em; padding: 0.625em 0.875em; border-bottom: 1px solid #ccc; }
#privacy .box textarea { font-size: 0.875em; background-color: #f7f7f7;  color: #666; width: 100%; height: 320px; padding: 1em; border: 0; vertical-align: top;  }
#privacy #privacyClose { position: absolute; top: 0; right: 0; font-size: 1.125em; padding: 0.625em 0.875em; cursor: pointer; z-index: 5; }


/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;width:0;height:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}


/* 자료없는 목록 */
.empty_table { padding:50px 0 !important; color: #999 !important; }
.empty_list { padding:50px 0 !important; text-align: center !important; width: 100% !important; color: #999 !important; }


/* 자동등록방지 */
#captcha { width: 320px; display: flex; flex-wrap: wrap; margin-top: 20px; }
#captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
#captcha > * { height: 40px; margin-right: 4px; vertical-align: top; border: 1px solid #ccc; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;  }
#captcha #captcha_mp3,#captcha #captcha_reload { width: 40px; cursor: pointer; text-indent:-999px; overflow: hidden; margin-right: 0; }
#captcha #captcha_mp3 { background:url('../../../img/captcha2.png') no-repeat 0 -2px; }
#captcha #captcha_reload { background:url('../../../img/captcha2.png') no-repeat 0 -42px; }
#captcha #captcha_key { width: 120px; padding: 0 8px; }
#captcha #captcha_info { width: 100%; border: 0; height: auto; margin-top: 4px; }


/* ckeditor 단축키 */
.cke_sc { display: block; width: 100%; margin-bottom: 8px; text-align: right; position: relative; }
.btn_cke_sc { font-size: 1em; background-color: #f7f7f7; border: 1px solid #ccc; color: #555; padding: 0 8px; line-height: 1.8; }
.cke_sc_def { position: absolute; top: 100%; right: 0; border:1px solid #ccc; background:#fafafa; text-align:center; margin-top: 4px; }
.cke_sc_def dl { width: 500px; line-height: 24px; text-align: left; display: flex; flex-wrap: wrap; padding: 8px 16px; }
.cke_sc_def dt,.cke_sc_def dd { border-bottom: 1px solid #ddd; }
.cke_sc_def dl > *:nth-last-child(-n+4) { border-bottom: 0; }
.cke_sc_def dt { width: 20%; font-weight: 700; }
.cke_sc_def dd { width: 30%; }
.btn_cke_sc_close { display: block; width: 100%; background-color: #fafafa; border: 0; border-top: 1px solid #ccc; padding: 8px 0; }


/* 새창 기본 스타일 */
.new_win {  }
.new_win #win_title { font-size: 1.25em; line-height: 50px; padding: 0 16px; font-weight: 500; }
.new_win .tbl_wrap { padding: 16px; padding-top: 0; }
.new_win .tbl_wrap table { text-align: left; }
.new_win .tbl_wrap thead { text-align: center; }
.new_win .tbl_wrap .td_chk { text-align: center; }
.new_win .tbl_wrap td { position: relative; }
.new_win .copymove_current { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); padding: 0 8px; line-height: 2; background-color: #222; color: #fff; display: inline-block; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; }
.new_win .copymove_currentbg { background: #f5f5f5; }
.win_btn { text-align: center; }
.win_btn > * { font-size: 1.125em; padding: 0 16px; height: 3em; }


/* 페이징 */
.pg_wrap { margin-top: 24px; }
.pg { display: block; text-align: center; font-size: 1.125em;}
.pg_page, .pg_current { width: 30px; height: 30px; line-height: 30px; display: inline-block; border: 1px solid #ddd; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; vertical-align: top; }
.pg_start,.pg_prev,.pg_next,.pg_end { background: no-repeat center; font-size: 0; }
.pg_start { background-image: url(../img/page_first.png); }
.pg_prev { background-image: url(../img/page_prev.png); }
.pg_next { background-image: url(../img/page_next.png); }
.pg_end { background-image: url(../img/page_end.png); }
.pg_page:hover { background-color: #fafafa; }
.pg_current { background-color: #222; border-color: #222; color: #fff; font-weight: inherit;}



/* btn */
.btn, .btn_submit, .btn_cancel, .btn_close, .btn_frmline { display: inline-block; text-align: center; background-color: #fff; border: 1px solid #ddd; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; }
.btn_frmline { background-color: #434a54; border-color: #434a54; color: #fff; }
.btn_cancel { background-color: #ffffff; border-color: #cccccc; color: #777; }
.btn_close { background-color: #ffffff; border-color: #cccccc; color: #777; }
.btn_submit { background-color: #222; border-color: #222; color: #fff; }
.btn_confirm { text-align: center; }



/* 폼 기본 */
.frm_input,textarea { height: 40px; padding: 0 8px; border: 1px solid #ddd; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; }
textarea { min-height: 250px; padding: 8px; }
.full_input { width:100%; }
.half_input { width:49.5%; margin-bottom: 8px; }
.half_input:nth-child(odd) { margin-right: 1%; }
.half_input:nth-last-child(-n+2) { margin-bottom: 0; }


div.chk_box { display: inline-block; }
.chk_box input[type="checkbox"] { display: none; }
.chk_box input[type="checkbox"] + label { line-height: 1; display: flex; align-items: center; }
.chk_box input[type="checkbox"] + label span { width: 1em; height: 1em; background-color: #fff; border: 1px solid #ddd; cursor: pointer; display: inline-block; border-radius: 0.2em; vertical-align: top; margin-right: 0.5em;}
.chk_box input[type="checkbox"]:checked + label span { background: #222 url(../img/chk.png) no-repeat center; border-color: #222; }

/* member 체크박스 */
.sub [class*='agree'] input[type="checkbox"] { display: none; }
.sub [class*='agree'] input[type="checkbox"] + label { display: flex; align-items: center; }
.sub [class*='agree'] input[type="checkbox"] + label span { width: 16px; height: 16px; background-color: #fff; border: 1px solid #ddd; cursor: pointer; display: inline-block; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; margin-right: 4px;  }
.sub [class*='agree'] input[type="checkbox"]:checked + label span { background: #222 url(../img/chk.png) no-repeat center; border-color: #222; }



/* 기본테이블 */
.tbl_wrap table { width: 100%; text-align: center; border-top: 1px solid #ececec; }
.tbl_wrap caption { display: none; }
.tbl_wrap tr { border-bottom: 1px solid #ececec; }
.tbl_wrap th, .tbl_wrap td { height: 50px; }
.tbl_wrap .td_chk { position: relative; }
.tbl_wrap .td_chk strong { color: #4268B2; }
.tbl_wrap .td_num { width: 80px; }
.tbl_wrap .td_subject { text-align: left; }
.tbl_wrap .td_name { width: 100px; }
.tbl_wrap .td_datetime { width: 120px; }
.tbl_wrap .chk_box { position: absolute; left: 0; top: 50%; transform: translateY(-50%); }



















/* 게시판 */
#board .img_box { -webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px; }

#bo_cate { margin-bottom: 24px; }
#bo_cate ul { display: flex; }
#bo_cate li { margin-right: 8px; }
#bo_cate li a { line-height: 3; padding: 0 1.25em; display: inline-block; color: #888; border: 1px solid #ddd; -webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px; }
#bo_cate li.on a { background-color: #222; border-color: #222; color: #fff; }

.bo_top_area { display: flex; align-items: center; margin-bottom: 16px; }
.bo_top_area #bo_user_btn { margin-left: auto; }

#bo_list_total strong { color: #222; }

#bo_user_btn {  }
#bo_user_btn ul { display: flex; justify-content: flex-end; }
#bo_user_btn li { color: #aaa; position: relative; }
#bo_user_btn li:hover { color: #444; }
#bo_user_btn .admin_btn { color: #d13f4a; }
#bo_user_btn .admin_btn:hover { color: #ff3746; }
#bo_user_btn a,
#bo_user_btn button { font-size: 1.25em; width: 2em; line-height: 2; color: inherit; display: inline-block; background-color: transparent; border: 0; text-align: center; }
#bo_user_btn .opt_list { padding: 0.25em 0; display: none; position: absolute; right: 0; top: 100%; border: 1px solid #ddd; background-color: #fff; }
#bo_user_btn .opt_list li > * { font-size: 0.875em; width: 8em; line-height: 2.5; }
#bo_user_btn .opt_list i { margin-right: 4px; }

#bo_sch { margin-top: 20px; }
#bo_sch form { display: flex; justify-content: flex-end; }
#bo_sch .sch_box { display: flex; margin-left: 8px; vertical-align: top; padding: 0; }
#bo_sch input, #bo_sch button { height: 100%; border: 0; background-color: transparent; }
#bo_sch input { padding: 0 8px; }
#bo_sch button { width: 40px; font-size: 16px; color: #222; }


#autosave_pop { display: none; z-index:10; position:absolute; top:35px; right:0; width:350px; height:180px; border:1px solid #aaa; background:#fff; box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2); }
#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;}
#autosave_pop strong {position:absolute;font-size:0;line-height:0;overflow:hidden}
#autosave_pop div {text-align:center;}
#autosave_pop button {border:0;}
#autosave_pop ul {padding:15px;border-top:1px solid #e9e9e9;overflow-y:scroll;height:148px;border-bottom:1px solid #e8e8e8}
#autosave_pop li {padding:8px 5px;border-bottom:1px solid #fff;background:#eee;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;font-size:0.92em;font-style:italic;color:#999}
.autosave_close {cursor:pointer;width:100%;height:30px;background:none;color:#888;font-weight:bold;font-size:0.92em}
.autosave_close:hover { color: #222; }
.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}


#bo_w .wr_box { display: flex; flex-wrap: wrap; margin-bottom: 8px; }
#bo_w .wr_option .chk_box { margin-right: 8px; }
#bo_w .wr_subject { position: relative; }
#bo_w .wr_subject .frm_input { padding-right: 120px; }
#bo_w .wr_subject .btn_frmline { font-size: 0.875em; width: 110px; height: 30px; position: absolute; top: 0; right: 0; margin: 5px; }
#bo_w .wr_other { position: relative; }
#bo_w .wr_other .frm_input { height: 50px; padding-left: 50px; }
#bo_w .wr_other .wr_icon { font-size: 1.5em; width: 50px; height: 50px; color: #999; position: absolute; top: 0; left: 0; display: flex; justify-content: center; align-items: center; }
#bo_w .wr_file { position: relative; }
#bo_w .wr_file .wr_other { width: 100%; margin-bottom: 8px; }
#bo_w .wr_file .wr_other:last-child { margin-bottom: 0; }
#bo_w .wr_file input[type='file'] { display: none; }
#bo_w .wr_file .file_name { background-color: #fff; padding-left: 138px; }
#bo_w .wr_file .file_btn { line-height: 32px; width: 80px; position: absolute; top: 0; left: 50px; background-color: #f7f7f7; border: 1px solid #ccc; color: #777; margin: 8px 0; cursor: pointer; }
#bo_w .wr_file .file_del { position: absolute; right: 0; top: 0; display: inline-block; line-height: 50px; margin-right: 8px; }
#bo_w .btn_confirm { margin-top: 32px; }
#bo_w .btn_confirm > * { padding: 0 24px; height: 40px; font-size: 1.125em; }


#bo_v_info { font-size: 13px; color: #999; display: flex; align-items: flex-end; margin-bottom: 8px; }
#bo_v_info strong { font-size: 15px; color: #222; }
#bo_v_info span::before { content:""; display: inline-block; width: 1px; height: 12px; background-color: #aaa; margin: 0 10px; vertical-align: middle; }
#bo_v_title { display: flex; font-size: 20px; border-bottom: 1px solid #ddd; padding-bottom: 16px; }
#bo_v_title + #bo_user_btn { margin-top: 8px; }
#bo_v_title + #bo_user_btn .opt_list li > * { width: 5em; }
#bo_v_title .btn_list { width: 40px; height: 40px; border: 1px solid #ddd;  margin-left: auto; -webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px; display: flex; justify-content: center; align-items: center }
#bo_v_title .btn_list svg { width: 14px; height: 14px; display: inline-block; }
#bo_v_title .btn_list svg path { stroke: #222; }
#bo_v_content { padding: 32px 0; }
#bo_v_other { position: relative; margin-top: 8px; }
#bo_v_other .bo_v_link { width: 100%; height: 50px; line-height: 50px; padding-left: 50px; display: block; border: 1px solid #ddd; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; }
#bo_v_other .bo_v_link:hover { color: #222; }
#bo_v_other .bo_v_icon { font-size: 1.5em; width: 50px; height: 50px; color: #999; position: absolute; top: 0; left: 0; display: flex; justify-content: center; align-items: center; }
#bo_v_other .bo_v_cnt { position: absolute; right: 0; top: 0; display: inline-block; line-height: 50px; margin-right: 8px; }


#bo_cmt { margin-top: 32px; }
#btn_cmt { width: 100%; padding: 8px 0; border: 0; border-bottom: 2px solid #222; background-color: transparent; font-size: 16px; text-align: left; }
#btn_cmt strong { color: #222; }
#bo_cmt_list > ul > li { border-bottom: 1px solid #ddd; }
#bo_cmt_list .bo_cmt_box { padding: 8px 0; display: flex; align-items: center; }
#bo_cmt_list .bo_cmt_info { flex-grow: 1; font-size: 1.125em; color: #333; }
#bo_cmt_list .bo_cmt_info i { margin-right: 2px; }
#bo_cmt_list .bo_cmt_date { font-size: 0.875em; color: #999; margin-left: 8px; }
#bo_cmt_list .bo_cmt_content { padding: 0 8px 12px; }
#bo_cmt_btn { color: #bbb; position: relative; margin-left: auto; }
#bo_cmt_btn .btn_cmt_opt { font-size: 1.25em; width: 2em; line-height: 2; color: inherit; display: inline-block; background-color: transparent; border: 0; text-align: center; }
#bo_cmt_btn .bo_cmt_list { z-index: 10; padding: 0.25em 0; display: none; position: absolute; right: 0; top: 30px; border: 1px solid #ddd; background-color: #fff; text-align: center; }
#bo_cmt_btn .bo_cmt_list li > * { font-size: 0.875em; width: 5em; line-height: 2.5; display: inline-block; }
#bo_cmt_btn .bo_cmt_list li > *:hover { color: #222; }
#bo_cmt_btn .bo_cmt_list i { margin-right: 4px; }
#bo_cmt_w { margin-top: 24px; }
.bo_cmt_w .wr_box textarea { width: 100%; height: 150px; }
.bo_cmt_w .bo_cmt_bottom { width: 100%; display: flex; margin-top: 8px; }
.bo_cmt_w .bo_cmt_bottom .frm_input { margin-right: 8px; }
.bo_cmt_w .guest { display: flex; }
.bo_cmt_w .btn_confirm { display: flex; margin-left: auto; }
.bo_cmt_w .btn_confirm .btn_submit { padding: 0 16px; height: 35px; margin-left: 10px; }
.bo_cmt_w .btn_confirm .chk_box { line-height: 35px; }
.bo_cmt_w #captcha { margin-top: 0; }