@charset "utf-8";

/* 게시판 목록 */
#bo_list {position:relative;margin-bottom:8%}
#bo_list:after {display:block;visibility:hidden;clear:both;content:""}
#bo_list table{width: 100%;}
#bo_list thead {border-top: 2px solid #000;}
.tbl_head01 thead th { border-bottom: 1px solid #000; color: #666; padding: 30px 0; font-weight: 300;}
.tbl_head01 td {padding:30px 5px; height: auto; color: #666666;
    border-bottom: 1px solid #d5d3d6;
}
#bo_list .td_board {width:120px;text-align:center}
#bo_list .td_chk {width:30px;text-align:center;}
#bo_list .td_date {width:120px;text-align:center}
#bo_list .td_datetime {width:100px;text-align:center}
#bo_list .td_group {width:100px;text-align:center}
#bo_list .td_mb_id {width:100px;text-align:center}
#bo_list .td_mng {width:80px;text-align:center}
#bo_list .td_name {width:120px;padding:10px 0; text-align: center;}
#bo_list .td_nick {width:100px;text-align:center}
#bo_list .td_num {width:80px;text-align:center}
#bo_list .td_num2 {width:80px;text-align:center}
#bo_list .bo_tit {padding-left: 50px;}
#bo_list .td_numbig {width:80px;text-align:center}
#bo_list .txt_active {color:#5d910b}
#bo_list .txt_expired {color:#ccc}
#bo_list tbody tr {border-left:2px solid transparent}
/* #bo_list tbody tr:hover {border-left:2px solid #253dbe} */
.tbl_head01 tbody tr:hover td {background-color: #f5f5f5;}
/* #bo_list tbody .even td {background:#fbfbfb} */
.tbl_head01 {margin: 0 0 3%;}

.td_subject img {margin-left:5px}

#bo_btn_top {margin:10px 0;}
#bo_btn_top:after {display:block;visibility:hidden;clear:both;content:""}
.bo_fx {display: flex; display: -ms-flexbox; flex-direction: row; justify-content: flex-end; -ms-flex-pack: end;}
.bo_fx li + li{margin-left: 10px;}
.bo_fx:after {display:block;visibility:hidden;clear:both;content:""}
.bo_fx ul {margin:0;padding:0;list-style:none}
#bo_list_total {float: left; line-height:34px;font-size:0.92em;color:#4e546f}

.btn_bo_user { float: right;}
.btn_bo_user > li {position:relative}
.btn_bo_user .bo_sch >form > div {display: flex; display: -ms-flexbox;
    flex-direction: row; -ms-flex-direction: row; align-items: center; -ms-flex-align: center;
}

.bo_sch {display: flex; display: -ms-flexbox; flex-direction: row; -ms-flex-direction: row;}
.sfl__,
.sch_input{height:2.5em; padding: 0 1%; border: 1px solid #b6b6b6; box-sizing: border-box;}
.sch_bar{display: flex; display: -ms-flexbox; margin-left: 5px;
    flex-direction: row; -ms-flex-direction: row;
}
.sch_btn {height: 2.5em; display: block; margin-left: 5px; padding: 0 3%; width: 5.3em;
    background-color: #8b8b8b; text-align: center; color: #fff;
}
.sch_btn span{margin-left: 3px;}
.bo_notice .notice_icon {display:block;line-height:30px; width: 50px; font-weight:300; color:#fff; background-color: #26a19c; margin: 0 auto; font-size: 1em;}

.td_num strong {color:#000}
#bo_list .bo_tit a {width: 100%; display: block; overflow: hidden; padding-bottom: 2px;
    white-space: nowrap; text-overflow: ellipsis;
}
.pg_wrap {
    display: flex; display: -ms-flexbox; justify-content: center; -ms-flex-pack: center;
    float: none !important;
    width: 100%;
    text-align: center;
    /* position: absolute;
    left: 50%;
    transform: translateX(-50%); */
}
.pg, .pg > div{display: flex; display: -ms-flexbox;}

.pg_page {
    margin: 0 2px 0 2px;
    display: block;
    background: none;
    border: 1px solid #d7d7d7;
    color: #333;
    font-weight: 300;
    height: 30px;
    line-height: 30px;
    padding: 0 5px;
    min-width: 30px;
}
.pg_page.page_current {background-color: #26a19c; color: #fff;}
.current_wrap {margin: 0 5px 0 5px;}
.pg_btn_wrap a{text-indent: -9999px;}
.pg_prev {background: url(/common/img/btn_prev.gif) no-repeat 50% 50% #fff !important;}
.pg_start {background: url(/common/img/btn_first.gif) no-repeat 50% 50% #fff !important;}
.pg_next {
    background: url(/common/img/btn_next.gif) no-repeat 50% 50% #fff !important;
}
.pg_end {background: url(/common/img/btn_end.gif) no-repeat 50% 50% #fff !important;}

.pg_page:hover {background-color: #f5f5f5; color: #555;}

/* 게시판 읽기 */
#bo_v {margin-bottom:8%;background:#fff;box-sizing:border-box}

#bo_v_table {position:absolute;top:0;right:16px;margin:0;padding:0 5px;height:25px;background:#ff3061;color:#fff;font-weight:bold;line-height:2.2em}

#bo_v_title .bo_v_cate {display:inline-block;line-height:20px;background:#e2eaf6;color:#3a8afd;padding:0 10px;border-radius:3px;}
#bo_v_title .bo_v_tit {display:block;font-size:1.5em;margin:5px 0 0;word-break:break-all}

#bo_v_info {margin:0; border-bottom:1px solid #000; border-top: 2px solid #000; color:#666; padding-top: 3%;}
#bo_v_info:after {display:block;visibility:hidden;clear:both;content:""} 
#bo_v_info h2 {font-size: 1.6em; color: #333;}

#bo_v_info .profile_info {margin:20px 0 10px;display:inline-block;float:left}
#bo_v_info .profile_info .pf_img {float:left;margin-right:10px}
#bo_v_info .profile_info .pf_img img {border-radius:50%;width:50px;height:50px}
#bo_v_info .profile_info .profile_info_ct {float:left;padding:5px 0;line-height:18px; display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap;}
#bo_v_info .profile_info .profile_info_ct span {color: #414141;}
.profile_info_ct li {position: relative;}
.profile_info_ct li + li {margin-left: 10px;}
.profile_info_ct li + li::before {content: ""; display: block; width: 1px; height: 18px;
    position: absolute; left: -10px; top: 0;
    background-color: #999;
}
.profile_info_ct li:last-child{margin-left: 20px;}

#bo_v_info strong {display:inline-block;margin:0 10px 0 0;font-weight:normal; color: #888; font-size: 1em;}
#bo_v_info .profile_img {display:none}
#bo_v_info .profile_info .profile_info_ct strong span {color:#888}
#bo_v_info .if_date {margin:0;color:#888}

#bo_v_file h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_file ul {margin:0;list-style:none}
#bo_v_file li {padding:20px; position:relative; border-bottom: 1px solid #d5d3d6;}
#bo_v_file li i {float:left;color:#b2b2b2;font-size:2.35em;margin-right:20px}
#bo_v_file a {text-decoration:none;word-wrap:break-word;color:#000;}
#bo_v_file a:focus, #bo_v_file li a:hover, #bo_v_file a:active {text-decoration:underline;color:#3a8afd}
#bo_v_file img {float:left;margin:0 10px 0 0}
#bo_v_file .bo_v_file_cnt {color:#b2b2b2;font-size:0.92em}

.bo_v_nb{float: left;}
.bo_v_nb li{float: left;}
.bo_v_nb li:first-child{margin-right: 20px;}
.bo_v_nb li a{display: block; padding: 0 2em; height: 45px;
    border-radius: 3px; 
    line-height: 45px; text-align: center; color: #fff;
    background-color: #26a19c;
}

#bo_v_atc {min-height:200px;height:auto !important;height:200px;}
#bo_v_atc_title {position:absolute;font-size:0;line-height:0;overflow:hidden}

#bo_v_con {margin:10px 0 2.5%; padding-top: 3%; width:100%; min-height:200px;
    line-height:1.7em;word-break:break-all; overflow:hidden; text-align: center;
    border-bottom: 1px solid #aeaeae;
}
#bo_v_con a {color:#000;text-decoration:underline}
#bo_v_con img {max-width:100%;height:auto}
#bo_v_con .img_wrap,
#bo_v_con .cont_wrap {margin-bottom: 3em;}
.btn_list {
    float: right;
    display: block; margin-bottom: 2.5%;
    padding: 0 2em;
    border-radius: 3px;
    font-size: 1em;
    height: 45px;
    line-height: 45px;
    background-color: #8b8b8b;
    color: #fff;
	margin:0 10px;
}

#container .btn_submit {padding: 0 1.5em;font-size:1em; height: 45px; line-height: 45px; display: block;
    background-color: #8cc342;
}
#container .btn_cancel {border-radius:3px;font-size:1em; height: 45px; line-height: 45px; padding: 0 10px;
    background-color: #8b8b8b; border: 0; color: #fff;
}

#bo_w .btn_confirm .btn_submit {margin-right: 10px;}

@media screen and (max-width: 768px) {
    #bo_list .bo_tit {padding-left: 20px;}
    .td_subject {max-width: 280px;}

    #container .btn_cancel,
    #container .btn_submit {height: 40px; line-height: 40px;}
    #container .btn_submit {padding: 0 1em;}
}

@media screen and (max-width: 550px) {
    .sch_input {max-width: 180px;}
    .sch_btn {width: 4.3em;}
    .sch_btn .fa {display: none;}
    .tbl_head01 {font-size: 12px;}
    #bo_list .td_num2 {width: 40px;}
    .bo_notice .notice_icon {width: 30px; font-size: 0.9em; line-height: 24px; height: 24px; font-weight: 400;}
    #bo_list .td_name {width: 40px;}
    #bo_list .td_datetime{width: 40px;}
    #bo_list .td_num {width: 36px;}
    #bo_list .bo_tit {padding-left: 5px;}
    .td_subject {text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}

    .td_subject {max-width: 110px;}

    .pg_page{padding: 0; font-size:0.9em}
}

@media screen and (max-width: 479px) {
    .bo_sch_wrap .sfl__ {width: 90px;}

    #bo_v_title .bo_v_tit {font-size: 1em;}
    .profile_info_ct {flex-direction: column; -ms-flex-direction: column;}
    .profile_info_ct li + li,
    .profile_info_ct li:last-child {margin-left: 0;}
    .profile_info_ct li + li::before {display: none;}

    .tbl_head01 thead {padding: 20px 0;}
     .tbl_head01 td{padding: 20px 5px;}

    #bo_w .bo_w_tit .frm_input {height: auto;}

    .btn_list, .bo_v_nb li a{padding: 0 1em;}

    #container .btn_cancel,
    #container .btn_submit {height: 36px; line-height: 36px; padding: 0 5px;}
    #container .btn_submit {padding: 0 0.8em;}
}
@media screen and (max-width: 350px) {
    .td_subject {max-width: 89px;}
    .bo_sch_wrap .sfl__ {width: 60px;}
    .sch_input {max-width: 175px;}
    .sch_btn {width: 3.3em;}
    .btn_bo_user .bo_sch >form > div{font-size: 0.9em;}
}