@charset "utf-8";
@media (max-width: 992px) {
.mobile-padding { padding: 0 10px !important; }
.mobile-none { display: none !important; }
.mobile-only { display: block !important; }
}
@media (min-width: 992px) {
.mobile-only { display: none !important; }
}
/* button */
button, input[type="submit"] { display: inline-block; line-height: 1.5; text-align: center; border: 1px solid transparent; padding: 4px 8px; border-radius: 0; }
.btn_board, a.btn_board { display: inline-block; min-width: 70px; line-height: 1.5; text-align: center; border: 1px solid transparent; padding: 4px 8px; border-radius: 0; }
.btn_board:hover, .btn_board:focus,
a.btn_board:hover, a.btn_board:focus { color: #fff; outline: none; box-shadow: none; }
.btn_board_del { background: #ae4951; color: #fff; }
.btn_board_copy,
.btn_board_move   { background: #0e0301; color: #fff; }
.btn_board_admin  { background: #0e0301; color: #fff; }
.btn_board_rss    { background: #0e0301; color: #fff; }
.btn_board_write  { background: #e81e25; color: #fff; }
.btn_board_cancel { background: #a5a79a; color: #fff; }
.btn_board_submit { background: #e81e25; color: #fff; }
.btn_board_modify { background: #b2a59f; color: #fff; }
.btn_board_reply  { background: #b2a59f; color: #fff; }
.btn_board_list   { background: #023459; color: #fff; }
.btn_board_search { background: #0e0301; color: #fff; width: 30px; min-width: 30px; }
.btn_board_close  { background: #e81e25; color: #fff; }
@media (max-width: 768px) {
.btn_board, a.btn_board { min-width: 50px; font-size: 12px; }
}

/* list */
#board-list { margin: 25px 0; }

/* list category */
#bo_cate {}
#bo_cate h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
#bo_cate ul { display: flex; flex-wrap: wrap-reverse; }
#bo_cate li { flex: 0 0 auto; border: 1px solid #ddd; border-left: 0; border-bottom: 0; }
#bo_cate li:first-child { border-left: 1px solid #ddd; }
#bo_cate a { display: block; padding: 8px 16px; background: #fff; }
#bo_cate #bo_cate_on { background: #f6f6f6; color: #dc3545; }
#bo_cate span.total_count { display: none; }
#bo_cate_on > span.total_count { display: inline-block; }

/* list total */
.list-total { display: flex; }
.list-total span { display: block; padding: 4px 12px; text-align: center; border: 1px solid transparent; }
.list-total .total_txt {  background: #0e0301; color: #fff; }
.list-total .total_page { background: #e81e25; color: #fff; }

/* list-article */
.list-article { width: 100%; }
.list-article > ul { display: table; width: 100%; }
.list-article > ul > li { display: table-row; width: 100%; }
.list-article > ul > li > div { display: table-cell; position: relative; }
.list-article > ul > li > div .mobile-title { display: none; }
.list-article > ul > li.list-head > div { padding: 12px 0; border-top: 1px solid #808080; border-bottom: 1px solid #ddd; vertical-align: middle; text-align: center; }
.list-article > ul > li.list-body > div { padding: 10px 5px; border-bottom: 1px solid #ddd; vertical-align: middle; text-align: center; }
.list-article > ul > li.list-body:hover { background: #f1f1f1; }
.list-article > ul > li > div.cell-check { width: 30px; }
.list-article > ul > li > div.cell-num { width: 50px; }
.list-article > ul > li > div.cell-notice { color: #e81e25; font-size: 16px; }
.list-article > ul > li > div.cell-cate { width: 80px; }
.list-article > ul > li > div.cell-image { width: 60px; }
.list-article > ul > li > div.cell-image img { width: 100%; height: auto; }
.list-article > ul > li > div.cell-subject { }
.list-article > ul > li > div.cell-subject a.new_article { position: relative; padding-left: 15px; }
.list-article > ul > li > div.cell-subject .reply { display: inline-block; transform: rotate(180deg); margin-right: 3px; }
.list-article > ul > li > div.cell-subject .secret { display: inline-block; margin-right: 3px; }
.list-article > ul > li > div.cell-subject .new { position:absolute; top: 2px; left: 0; display: inline-block; font-family: 'Work Sans'; margin-right: 3px; font-size: 10px; color: #fff; padding: 0 2px; background: #e81e25; line-height: 1.2; font-weight: 600; border-radius: 2px; }
.list-article > ul > li > div.cell-subject .hot { display: inline-block; margin-left: 3px; }
.list-article > ul > li > div.cell-subject .file { display: inline-block; margin-left: 3px; }
.list-article > ul > li > div.cell-subject .movie { display: inline-block; margin-left: 3px; color: #fe7773; }
.list-article > ul > li > div.cell-subject .cnt_cmt { display: inline-block; margin-left: 3px; font-size: 11px; color: #e81e25; }
.list-article .list-empty { display: block; width: 100%; padding: 100px; text-align: center; }

.list-article > ul > li > div.cell-name { width: 100px; }
.list-article > ul > li > div.cell-good { width: 60px; }
.list-article > ul > li > div.cell-nogood { width: 60px; }
.list-article > ul > li > div.cell-hit { width: 60px; }
.list-article > ul > li > div.cell-date { width: 80px; }
.list-article > ul > li.list-body > div.cell-subject { text-align: left; }
.list-btn { display: flex; justify-content: space-between; margin-top: 15px; }
.list-check { flex: 0 0 auto; }
.list-btn .list-check ul { display: flex; }
.list-check ul li:not(:last-child) { margin-right: 2px; }
.list-check ul li .btn_check_del { }
.list-check ul li .btn_check_copy, .list-btn .list-check ul li .btn_check_move { }
.list-user { flex: 0 0 auto; }
.list-user ul { display: flex; }
.list-user ul li:not(:last-child) { margin-right: 2px; }
.list-user ul li .btn_board_admin { }
.list-user ul li .btn_board_rss { }
.list-user ul li .btn_board_write { }

/* list search */
.list-search { display: flex; flex: 1 1 auto; justify-content: center; }
.list-search select { padding: 4px 8px; height: auto; border-radius: 0; }
.list-search .sch_input { width: 100%; max-width: 160px; padding: 4px 8px; height: auto; border-radius: 0; border: 1px solid #ced4da; line-height: 1.5; }
.list-search .btn_board_close { display: none; }

/* pageging */
.page-wrapper { margin : 25px 0; text-align: center; display: flex; justify-content: center; }
.page-wrapper .pg_wrap { clear:both; margin:0 auto; padding: 0;text-align:center}
.page-wrapper .page-wrapper .pg {}
.page-wrapper .pg a:focus, .pg a:hover {text-decoration:none}
.page-wrapper .pg_page, .qa_page, .pg_current {display:inline-block; margin: 0px 2px; width:25px; height:25px; line-height: 25px; text-align:center; text-decoration:none; background-color:#fff; color:#888; border:1px solid #ddd; vertical-align:middle; font-weight:normal; padding: 0; min-width: 25px; }
.page-wrapper .pg_page { }
.page-wrapper .pg_current {background-color:#3f4553;border-color:#3f4553;color:#fff !important;}
.page-wrapper .pg_start, .pg_end, .pg_prev, .pg_next {text-indent:-9999em;}
.page-wrapper .pg_start {background:url('/img/pg_start.png') center center no-repeat;}
.page-wrapper .pg_end {background:url('/img/pg_end.png') center center no-repeat;}
.page-wrapper .pg_prev {background:url('/img/pg_prev.png') center center no-repeat;}
.page-wrapper .pg_next {background:url('/img/pg_next.png') center center no-repeat;}
.page-wrapper .pg_empty {display:none}
.page-wrapper .pg_prev.pg_empty, .pg_next.pg_empty {display:inline-block; width:0px !important;border:0; padding:0px; }

@media (max-width: 992px) {
#bo_cate ul { display: flex; flex-wrap: nowrap; overflow-x: auto; border-bottom: 1px solid #ddd; }
.list-article > ul > li { position: relative; display: block; border-bottom: 1px solid #808080; }
.list-article > ul > li.list-body { padding: 7px 0 8px 10px }
.list-article > ul > li > div { display: block; font-size: 11px; }
.list-article > ul > li > div .mobile-title { display: inline-block; width: auto; }
.list-article > ul > li.list-head > div,
.list-article > ul > li.list-body > div { padding: 2px 8px; border-bottom: 0; }
.list-article > ul > li.list-body > div.cell-num { }
.list-article > ul > li.list-body > div.cell-notice { position: absolute; top: 10px; left: 0; font-size: 14px; }
.list-article > ul > li.list-body > div.cell-cate { position: absolute; bottom: 5px; right: 5px; width: auto; }
.list-article > ul > li.list-body > div.cell-image { position: absolute; top: 7px; left: 0px; }
.list-article > ul > li.list-body > div.cell-subject { display: block; width: auto; font-size: 14px; }
.list-article > ul > li.list-body > div.cell-notice ~ .cell-subject { padding-left: 25px; }
.list-article > ul > li.list-body > div.cell-image ~ .cell-subject { padding-left: 60px; }
.list-article > ul > li.list-body > div.cell-image ~ .cell-name { padding-left: 60px; }
.list-article > ul > li.list-body > div.cell-name { display: inline-block; width: auto;}
.list-article > ul > li.list-body > div.cell-good { display: inline-block; width: auto;}
.list-article > ul > li.list-body > div.cell-nogood { display: inline-block; width: auto;}
.list-article > ul > li.list-body > div.cell-hit { display: inline-block; width: auto;}
.list-article > ul > li.list-body > div.cell-date { display: inline-block; width: auto;}
}
@media (max-width: 768px) {
.list-search { justify-content: flex-start; }
.list-search .search-form { position: fixed; top: 0; left: 0; right: 0; opacity: 0; visibility: hidden; z-index: -10; }
.list-search.open .search-form { position: fixed; top: 0; bottom: 0; left: 0; right: 0; display: flex; justify-content: space-between; flex-direction: column; opacity: 1; visibility: visible; z-index: 1090; background: rgba(0,0,0,.25); }
.list-search.open .search-form:before,
.list-search.open .search-form:after { height: 1px; content: ''; }
.list-search.open .search-form .search-box { width: 70%; max-width: 70%; display: flex; flex-direction: column; margin: 0 auto; padding: 10px; background: #fff; }
.list-search.open .search-form .search-box select { width: 100%; margin-bottom: 5px; }
.list-search.open .search-form .search-box .sch_input { width: 100%; max-width: 100%; margin-bottom: 5px; }
.list-search.open .search-form .search-box .btn_board_search { width: 100%; margin-bottom: 5px; }
.list-search.open .search-form .search-box .btn_board_close { display: block; }
}
@media (max-width: 576px) {
}

/* write */
#board-write { margin: 25px 0; }
.write_input {  width: 100%; padding: .375rem .75rem; height: auto; border: 1px solid #ddd; border-radius: 0; }
.write-div { position: relative; display: flex; flex-wrap: wrap; width: 100%; margin-bottom: .5rem; }
.write-div .ca_name { min-width: 200px; padding: 4px 8px; height: auto; border-radius: 0; }
.write-half { justify-content: space-between; }
.write-half .write_info { flex: 1 1 49%; max-width: 49%; margin-bottom: .25rem; }
.write-div .wr_option { flex: 1 1 auto; border: 1px solid #d5d5d5; border-bottom: 0; background: #fafafa; padding: 5px; }
.write-div .wr_option .wr_option_header { display: flex; }
.write-div .wr_option .wr_option_header > div { padding: 2px 8px; border: 1px solid #d5d5d5; font-size: 12px; background: #fff; cursor: pointer; }
.write-div .wr_option .wr_option_header > div > i { margin-right: 3px; }
.write-div .wr_option .wr_option_header > div:not(:last-child) { margin-right: 5px; }
.write-div .wr_option .wr_option_movie { display: none; margin-top: 5px; padding-top: 5px; border-top: 1px dashed #d5d5d5; }
.write-div .wr_option .wr_option_movie.on { display: block; }

/* write autosave */
#btn_autosave { position: absolute; top: 0; right: 0; bottom: 0; background: #0e0301; color: #fff; }
.cke_sc { display: none; }
#autosave_wrapper {position:relative}
#autosave_pop { display:none; z-index:10; position:absolute !important; top:34px; right:0; width:350px; height:auto; max-height: 180px; border:1px solid #ddd; background:#fff; }
#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 #ddd 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;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:scroll;height:130px;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 {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}
.write-div .wr_content { width: 100%; }
.write-link label { position: absolute; top: 0; left: 0; bottom: 0; width: 50px; background: #0e0301; color: #fff; display: flex; justify-content: center; align-items: center; }
.write-link .write_input { padding-left: 60px; }
.write-file label.file_icon { position: absolute; top: 0; left: 0; bottom: 0; width: 50px; background: #0e0301; color: #fff; display: flex; justify-content: center; align-items: center; }
.write-file .write_file { width: auto; padding: .15rem 0 .15rem 60px; border-color: transparent; }
.write-file .file_del { margin-left: 10px; align-self: center; }
.write-file .file_input { margin-left: 10px; border: 1px solid #ddd; padding-left: .75rem; padding-right: .75rem; }
.write-btn { margin: 50px 0 25px 0; justify-content: center; }
.write-btn .btn_board_cancel { margin-right: 5px; }
@media (max-width: 992px) {
.write-half .write_info { flex: 1 1 100%; max-width: 100%; margin-bottom: .25rem; }
}
@media (max-width: 768px) {
}
@media (max-width: 576px) {
}

/* view */
#board-view { margin-top: 25px; color: #0e0301; }
.view-subject { margin-bottom: 10px; }
.view-subject .view_category { display: inline-block; padding: .125rem .75rem; background: #fe7773; color: #fff; }
.view-subject h4 { font-size: 18px; color: #0e0301; padding: .375rem 0; }
.view-info { position: relative; display: flex; justify-content: space-between; background: #f2f4ef; border-top: 2px solid #e81e25; padding: 10px 0; }
.view-info .view-info-photo { flex: 1 1 60px; max-width: 60px; padding: 0 5px; }
.view-info .view-info-photo img { width: 100%; height: auto; border-radius: 50%; }
.view-info .view-info-user { flex: 1 1 auto; padding: 0 10px; align-self: center; }
.view-info .view-info-user strong { }
.view-info .view-info-user .view-article-info { padding-top: 5px; font-size: 12px; }
.view-info .view-info-user .view-article-info span { display: inline-block; }
.view-info .view-info-user .view-article-info span:not(:last-child) { margin-right: 5px; }
.view-info .view-info-user .view-article-info span i { padding-right: 3px; }
.view-info .view-info-user .view-article-info span.date { }
.view-info .view-info-user .view-article-info span.hit { }
.view-info .view-info-user .view-article-info span.comment { }
.view-info .view-info-user .view-article-info span.good { }
.view-info .view-info-user .view-article-info span.nogood { }
.view-link { }
.view-link ul { }
.view-link ul li { padding: 5px 0; border-bottom: 1px solid #ddd; font-size: 12px; }
.view-link ul li i { display: inline-block; padding: 0 10px; margin-right: 5px; }
.view-link ul li a { display: inline-block; margin-right: 10px; font-size: 13px; color: #0e0301; }
.view-link ul li span { }
.view-file { }
.view-file ul { }
.view-file ul li { padding: 5px 0; border-bottom: 1px solid #ddd; font-size: 12px; }
.view-file ul li i { display: inline-block; padding: 0 10px; margin-right: 5px; }
.view-file ul li a { display: inline-block; margin-right: 10px; font-size: 13px; color: #0e0301; }
.view-file ul li span { }
.view-article { padding: 15px 0; margin-bottom: 15px; border-bottom: 1px solid #f2f4ef; }
.view-article .view-movie { text-align: center; margin-bottom: 15px; }
.view-article .view-movie lite-youtube { margin: 0 auto; width: auto; }
.view-article .view-file-image { margin-bottom: 15px; text-align: center; }
.view-article .view-file-image img { width: 100%; height: auto; }
.view-article .view-file-content { width: 100%; overflow: hidden; }
.view-article .view-file-content img { max-width: 100%; height: auto; }
.view-article .view-content { width: 100%; overflow: hidden; }
.view-article .view-content img { max-width: 100%; height: auto; }
.view-vote { display: flex; justify-content: center; flex-direction: column; align-items: center; }
.view-vote .view-vote-act { display: flex; flex: 0 0 auto; margin: 15px 0 10px 0; }
.view-vote .view-vote-act .view-vote-act-gng { position: relative; display: flex; justify-content: center; align-items: center; width: 70px; height: 70px; text-align: center; border: 1px solid #ddd; margin-left: -1px; }
.view-vote .view-vote-act .view-vote-act-gng a { color: #ece4e2; }
.view-vote .view-vote-act .view-vote-act-gng i { display: block; font-size: 26px; }
.view-vote .view-vote-act .view-vote-act-gng .vote-good:hover { color: #0186be;}
.view-vote .view-vote-act .view-vote-act-gng .vote-good strong { font-weight: 400; color: #0186be; }
.view-vote .view-vote-act .view-vote-act-gng .vote-nogood:hover { color: #e74471; }
.view-vote .view-vote-act .view-vote-act-gng .vote-nogood strong { font-weight: 400; color: #e74471; }
.view-vote .view-vote-act .view-vote-act-gng .vote_msg { display: none; position: absolute; left: -50%; top: calc( 100% + 3px ); padding: 0 12px; height: 23px; line-height: 23px; width: auto; color: #fff; text-align: center; white-space: nowrap; border-radius: 15px; border: 0; font-size: 12px; z-index: 1001; }
.view-vote .view-vote-act .view-vote-act-gng.good .vote_msg { background: rgba(1,134,190,.75);}
.view-vote .view-vote-act .view-vote-act-gng.nogood .vote_msg { background: rgba(231,68,113,.75); }
.view-vote .view-vote-login-msg { text-align: center; color: #ece4e2; font-size: 12px; }
.view-vote .view-vote-users-btn { }
.view-vote .view-vote-users-btn .vote_view { display: inline-block; padding: 2px 16px; font-size: 12px; border: 1px solid #ddd; background: #f5f5f5; cursor: pointer; }
.view-vote .view-vote-users { position: relative; width: 100%; display: flex; margin: 15px 0; opacity:0; visibility: hidden; height: 0; }
.view-vote .view-vote-users.open { opacity:1; visibility: visible; height: auto; }
.view-vote .view-vote-users .vote-users { flex: 1 1 50%; max-width: 50%; padding: 15px; border: 1px solid #ddd; }
.view-vote .view-vote-users .nogood-users { border-left: 0; }
.view-vote .view-vote-users .vote-users h5 { display: block; font-size: 12px; font-weight: 400; }
.view-vote .view-vote-users .good-users h5 { }
.view-vote .view-vote-users .nogood-users h5 { }
.view-vote .view-vote-users .vote-users-list { display: flex; flex-wrap: wrap; }
.view-vote .view-vote-users .vote-users-list .vote-user-name { }
.view-btn { display: flex; justify-content: space-between; }
.view-check { }
.view-user { }
.view-user ul { display: flex; }
.view-user ul li:not(:last-child) { margin-right: 2px; }
.view-user ul li .btn_board_copy { }
.view-user ul li .btn_board_move { }
.view-user ul li .btn_board_delete { }
.view-user ul li .btn_board_modify { }
.view-user ul li .btn_board_reply { }
.view-user ul li .btn_board_write { }
.view-user ul li .btn_board_list { }

/* 이전글 다음글 */
.view-nb { margin-top: 15px; }
.view-nb ul { list-style: none; position: relative; clear: both; text-align: left; border-top: 1px solid #ddd; }
.view-nb ul:after { display: block; visibility: hidden; clear: both; content: ""; }
.view-nb ul 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; }
.view-nb ul li:hover { background: #f6f6f6; }
.view-nb ul li > * { display: block; white-space: nowrap; }
.view-nb ul li .nb_tit { display: inline-block; padding-right: 10px; color: #3f4553; }
.view-nb ul li .nb_tit i { margin-right: 5px; }
.view-nb ul li a { margin-right: 5px; overflow: hidden; text-overflow: ellipsis; width: 100%; }
.view-nb ul li .nb_date { float: right; color: #888; }
@media (max-width: 992px) {
}
@media (max-width: 768px) {
}
@media (max-width: 576px) {
}

/* comment */
#view-comment { }
#comment-write { margin: 50px 0 25px 0; }
.fcommentw { position: relative; }
.fcommentw .cw_info { margin-bottom: 10px; }
.fcommentw .cw_form { }
.fcommentw .cw_form_tail { display: flex; justify-content: space-between; margin-top: 10px; }
.fcommentw .cw_guest { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 10px; }
.fcommentw .cw_guest .cw_captcha { align-self: center; }
.fcommentw .cw_guest .cw_guest_info { display: flex; align-self: center; margin-bottom: 10px; }
.fcommentw .cw_guest .cw_name { max-width: 120px; margin-right: 5px; }
.fcommentw .cw_guest .cw_pass { max-width: 120px; }
.fcommentw .cw_option { border: 1px solid #d5d5d5; border-bottom: 0; background: #fafafa; padding: 10px; }
.fcommentw .cw_option .cw_option_header { display: flex; }
.fcommentw .cw_option .cw_option_header > div { padding: 2px 8px; border: 1px solid #d5d5d5; font-size: 12px; background: #fff; cursor: pointer; }
.fcommentw .cw_option .cw_option_header > div > i { margin-right: 3px; }
.fcommentw .cw_option .cw_option_header > div:not(:last-child) { margin-right: 5px; }
.fcommentw .cw_option .cw_option_file,
.fcommentw .cw_option .cw_option_movie { display: none; margin-top: 5px; padding-top: 5px; border-top: 1px dashed #d5d5d5; background: #fff; }
.fcommentw .cw_option .cw_option_file.on,
.fcommentw .cw_option .cw_option_movie.on { position: relative; display: block; }
.fcommentw .cw_option .cw_option_file .file_del { position: absolute; top: calc( 1em + 2.5px ); right: 60px; }
.fcommentw .cw_option .cw_option_file .file_btn { position: absolute; top: 6px; right: 5px; bottom: 1px; display: flex; }
.fcommentw .cw_option .cw_option_file .file_btn button { border: 1px solid #ddd; background: #fff; align-self: center; width: 21px; font-size: 16px; font-weight: bold; height: 21px; line-height: 1; text-align: center; padding: 0; margin-right: 3px; }
.fcommentw .cw_option .cw_option_file .file_btn button.btn_add_file { background: #007bff; border-color: #007bff; color: #fff; }
.fcommentw .cw_option .cw_option_file .file_btn button.btn_del_file { background: #e83e8c; border-color: #e83e8c; color: #fff; }

.comment-bar { position: relative; border-bottom: 1px solid #3f4553; color: #3f4553; font-size: 16px; margin-bottom: 10px; }
.comment-bar b { display: inline-block; font-weight: 400; border-bottom: 2px solid #3f4553; padding: 5px 15px 5px 5px; }
.comment-bar b i { font-size: 18px; }
.comment-bar b .cmt_total { display: inline-block; padding-left: 5px; font-size: 12px; color: #e81e25; }
.comment-btn { position: absolute; bottom: 0; right: 0; background: transparent; width: 30px; min-width: 30px; }
.comment-btn:before { content: "\f077"; font-family: 'FontAwesome'; display: block; line-height: 1; transition: all 0.3s ease-in-out; cursor: pointer; }
.comment-btn-open:before { bottom: 5px; transform: rotate(180deg); }
#comment-loader { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
#comment-loader.on { display: block; }
#comment-loader.on .loader-image { display: flex; flex: 1 1 100%; max-width: 100%; height: 100%; justify-content: center; align-items: center; background: rgba(0,0,0,.2); }

#comment-list { width: 100%; height: auto; opacity:1; visibility: visible; transition: all 0.3s ease-in-out; }
#comment-list.close { display: block; opacity:0; visibility: hidden; width: 100%; height: 0; transition: all 0.3s ease-in-out; }
#comment-list.close .co_list { opacity:0; visibility: hidden; height: 0; }

.co_list { margin-bottom: 10px; }
.co_list .co_wrap { position: relative; border: 1px solid #ddd; padding: 15px; }
.co_list .co_new { border: 1px solid #e81e25; }
.co_wrap .co_header { display: flex; font-size: 12px; }
.co_wrap .co_header .co_photo { flex: 1 1 50px; max-width: 50px; padding: 0 10px 0 0; }
.co_wrap .co_header .co_photo img { width: 100%; height: auto; border-radius: 50%; }
.co_wrap .co_header > span { align-self: center; padding-right: 10px; }

.co_wrap .co_file { padding: 5px 10px; }
.co_wrap .co_file li { padding: 5px 0; border-bottom: 1px dashed #ddd; font-size: 12px; }
.co_wrap .co_file li i { display: inline-block; padding: 0 10px; margin-right: 5px; }
.co_wrap .co_file  li a { display: inline-block; margin-right: 10px; font-size: 13px; color: #0e0301; }
.co_wrap .co_file li span { }

div.co_list:not([data-depth='1']) { padding-left: 50px; }
div.co_list:not([data-depth='1']):before { content:'';}
div.co_list:not([data-depth='1']):after { content:'';}

.co_content { padding: 15px 0; }
.co_content > .m { margin-right: 10px; color: #dc3545; }
.co_content > span + p,
.co_content > span + div { display: inline-block;}
.co_content img { width: auto; height: auto; max-width: 100%; }
.co_content lite-youtube { max-width: 260px; height: auto; margin-bottom: 10px; }

.co_ico_wrap { position: absolute; right: 15px; top: 25px; }
.co_ico_wrap .co_ico { position: relative; display: inline-block; font-size: 12px; border: 1px solid; padding: 0.25em 0.5em; line-height: 1; border-radius: 0.25em; cursor: pointer; color: #777; font-family: 'Dotum',sans-serif; margin-left: 3px; }
.co_ico_wrap .co_ico i { margin-right: 3px; }
.co_ico_wrap .co_ico:hover { background-color: #3f4553; border-color: #3f4553; color: #fff; }
.co_ico_wrap .co_good:hover { color: #0186be; background-color: transparent; border-color:#0186be; }
.co_ico_wrap .co_nogood:hover { color: #e74471; background-color: transparent; border-color: #e74471; }
.co_ico_wrap .ico_msg { display: none; position: absolute; left: calc( -50% + 30px ); top: calc( 100% + 5px ); padding: 0 12px; height: 23px; line-height: 23px; width: auto; background: rgba(232,30,37,.75); color: #fff; text-align: center; border-radius: 15px; border: 0; font-size: 12px; z-index: 1001; }

@media (max-width: 992px) {
.co_list { padding-left: 0 !important; }
}
@media (max-width: 768px) {
.co_list .co_wrap { padding: 15px 15px 25px 15px; }
.fcommentw .cw_guest .cw_captcha { flex: 1 1 100%; max-width: 100%; }
.fcommentw .cw_guest .cw_guest_info { flex: 1 1 100%; max-width: 100%; }
.co_ico_wrap { position: absolute; right: 15px; top: calc( 100% - 25px); }
}
@media (max-width: 576px) {
.co_content lite-youtube { max-width: 100%; height: auto; margin-bottom: 10px; }
}
/* emoticon */
.emoti_wrapper { }
.emoti_wrapper .emoti_cate { text-align: right; margin-bottom: 10px; }
.emoti_wrapper .emoti_list { padding: 0 25px; }
.emoti_wrapper .emoti_box { display: flex; flex-wrap: wrap; margin: 0 -5px; }
.emoti_wrapper .emoti_box .emoti_data { padding: 0 5px; margin-bottom: 10px; }
.emoti_wrapper .emoti_box .emoti_data img { border: 1px solid #ddd; cursor: pointer; }
@media (max-width: 768px) {
.emoti_wrapper .emoti_list { padding: 0 5px; }
}

/* mymodal basic */
@media (min-width: 992px) {
html.noscroll body { padding-right: 17px; }
}
.myModal { position: fixed; top: 0; left: 0; z-index: 9999; display: none; width: 100%; height: 100%; overflow: hidden; outline: 0; overflow-x: hidden; overflow-y: auto; transition: all 0.5s ease-in-out; background: rgba(0,0,0,.7); }
.myModal-dialog { position: relative; display: flex; width: 100%; pointer-events: none; max-height: calc(100% - 1.5rem); margin: 1.75rem auto; }
.myModal-content { position: relative; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; width: 100%; pointer-events: auto; background-color: #fff; border: 1px solid rgba(0,0,0,.2); border-radius: .3rem; outline: 0; overflow: hidden; max-height: calc(100vh - 3.5rem); top: -100px; transition: all 0.5s ease-in-out; }
.myModal-content.open { top: 0; opacity:1; visibility: visible; transition: all 0.5s ease-in-out; }
.myModal-header { display: -ms-flexbox; display: flex; -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: justify; justify-content: space-between; padding: 1rem 1rem; border-bottom: 1px solid #dee2e6; border-top-left-radius: .3rem; border-top-right-radius: .3rem; -ms-flex-negative: 0; flex-shrink: 0; }
.myModal-header .header-title { align-self: center; }
.myModal-body { position: relative; -ms-flex: 1 1 auto; flex: 1 1 auto; padding: 1rem; overflow-y: auto; }
.myModal-footer { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: end; justify-content: flex-end; padding: 1rem; border-top: 1px solid #dee2e6; border-bottom-right-radius: .3rem; border-bottom-left-radius: .3rem; -ms-flex-negative: 0; flex-shrink: 0; }

.myModal .myModal-header button.closex,
.myModal .myModal-footer button.closex{ position: relative; width: 60px; height: 60px !important; padding: 0 !important; border-radius: 0; border: 0; background: transparent; outline: none; box-shadow: none; }
.myModal .myModal-header button.closex:before,
.myModal .myModal-header button.closex:after,
.myModal .myModal-footer button.closex:before, 
.myModal .myModal-footer button.closex:after{ content: ""; margin: auto; display: block; width: 50%; height: 1px; background: #fff; }
.myModal .myModal-header button.closex:before,
.myModal .myModal-footer button.closex:before{ transform: rotate(-45deg); }
.myModal .myModal-header button.closex:after,
.myModal .myModal-footer button.closex:after{ transform: rotate(45deg); }
@media (max-width: 992px) {
.myModal .myModal-dialog { max-height: 100%; margin: 0 auto; }
.myModal .myModal-content { max-height: 100vh; }
}

/* fadedown Modal */
#myModal.fadedown .myModal-dialog { max-width: 900px; }
#myModal.fadedown .myModal-content { border-radius: 0; border: 0; }
#myModal.fadedown .myModal-header { border-radius: 0; padding: 0; border: 0; background: #020202; }
#myModal.fadedown .header-title { align-self: center; color: #fff; padding-left: 10px; letter-spacing: -2px; }
#myModal.fadedown .myModal-footer { display: none; }
/* emticon modal css */
#myModal.emoticon .myModal-dialog { }
#myModal.emoticon .myModal-content { }
#myModal.emoticon .myModal-header { }
#myModal.emoticon .header-title { }
#myModal.emoticon .myModal-footer { }