<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "utf-8";
.cke_sc { display: none !important; } /*단축키 일람 없애기 */
#board-wrap { }
#board-wrap &gt; .board-wrap-inner { }
.board-container { position: relative; display: flex; }
.board-wrap { position: relative; flex: 1 1 auto; max-width: 100%; }
.board-title h2.title { }
.submenu-wrap { display: none; position: relative; flex: 0 0 300px; max-width: 300px; margin-left: 25px; }
.board-card { background-color: #fff; box-shadow: rgb(0, 0, 0, 0.1) 0 0 8px; padding: 15px; margin-bottom: 25px; border-radius: .25rem; }
select { min-width: 120px; padding: .375rem .75rem; border: 1px solid #dee2e6; }
@media(max-width: 768px) {
#board-wrap { padding: 0 5px; }
.board-container { flex-wrap: wrap; }
.board-wrap { flex: 1 1 100%; max-width: 100%; order: 2}
.board-title h2.title { font-size: 20px; }
.submenu-wrap { flex: 1 1 100%; max-width: 100%; order: 1; margin: 0; }
.board-card { padding: 15px 12px; margin-bottom: 25px; border-radius: .25rem; }
}
.board-top { display: flex; margin: 25px 0 15px 0; }
.board-total { display: flex; align-self: center; font-size: 15px; }
.board-total &gt; span { padding: .375rem .75rem; }
.board-total &gt; .total { display: inline-block; border: 1px solid #dee2e6; border-radius: .375rem; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.board-total &gt; .page { display: inline-block; border: 1px solid #dee2e6; border-radius: .375rem; border-left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; }
.board-search { margin-left: auto; }
.board-search + .board-btn { margin-left: 10px; }
.board-search-form { display: flex; }
.board-search-form &gt; .sch_input { padding: .375rem .75rem; border: 1px solid #dee2e6; max-width: 160px; border-radius: .5rem; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.board-search-form &gt; .sch_btn { background-color: transparent; border: 1px solid #dee2e6; border-radius: .5rem; border-top-left-radius: 0; border-bottom-left-radius: 0; border-left: 0; }
@media(max-width: 768px) {
.board-top { flex-wrap: wrap; }
.board-top .board-total { order: 1; }
.board-top .board-total &gt; span { font-size: 12px; padding: .375rem .5rem; }
.board-search { order: 2; }
.board-search-form { display: flex; }
.board-search-form &gt; .sch_input { font-size: 12px; }
.board-search-form &gt; .sch_btn { font-size: 12px; }
.board-top &gt; .board-top-btn { flex: 1 1 100%; margin: 0; margin-bottom: 8px; justify-content: flex-end; order: 0; }
}

.board-btn-wrap { display: flex; margin: 15px 0; }
.board-btn { align-self: center; display: flex; }
.board-btn .btn { color: #fff; font-size: 14px; margin-right: 5px; }
.board-btn .btn:last-child { margin-right: 0; }
.board-btn .btn:hover,
.board-btn .btn:focus { color: #fff; }
.board-btn .btn:focus { outline: none; box-shadow: none; }
.btn_write  { background-color: #2a76cc; color: #fff; }
.btn_list   { background-color: #212529; color: #fff; }
.btn_modify { background-color: #868e96; color: #fff; }
.btn_delete { background-color: #868e96; color: #fff; }
.btn_cancel { background-color: #495057; color: #fff; }
.btn_submit { background-color: #dc3545; color: #fff; }
.frm_input::placeholder { font-size: 0; }
@media(max-width: 768px) {
.board-btn .btn { font-size: 12px; }
}

.navi-wrap { position: relative; display: flex; padding: 12px 0 8px 0; }
.navi-wrap &gt; .navi-title { }
.navi-wrap &gt; .navi-pos { margin-left: auto; align-self: flex-start; display: flex; }
.navi-wrap &gt; .navi-pos &gt; a { position: relative; display: block; margin-right: 26px; font-size: 14px; color: #000; font-weight: 400; }
.navi-wrap &gt; .navi-pos &gt; a:last-child { margin-right: 0; }
.navi-wrap &gt; .navi-pos &gt; a:after { position: absolute; content: '＞'; width: 26px; display: inline-block; text-align: center; }
.navi-wrap &gt; .navi-pos &gt; a:last-child:after { content: ''; display: none; }
@media(max-width: 768px) {
.navi-wrap { }
.navi-wrap &gt; .navi-title { display: none; }
.navi-wrap &gt; .navi-pos { margin: 0; padding-left: 10px; }
}

/* 글 쓰기 */
#board-write-wrapper { margin-top: 25px; }
.dtable-form { display: flex; flex-wrap: wrap; border: 0; }
.dtable-form &gt; .dl { border-bottom: 1px solid transparent; }
.dtable-form &gt; .dl:last-child { }
.dtable-form &gt; .dl.dlf { }
.dtable-form &gt; .dl &gt; .dth { flex: 1 1 25%; max-width: 25%; background-color: transparent; border-color: transparent; }
.dtable-form &gt; .dl &gt; .dtd { flex: 1 1 auto; max-width: 100%; align-self: center; }
.dtable-form &gt; .dl.dlf &gt; .dth { flex: 1 1 12.5%; max-width: 12.5%; background-color: transparent; border-color: transparent; }
.dtable-form &gt; .dl.dlf &gt; .dtd { flex: 1 1 auto; max-width: 100%; align-self: center; }
.dtable-form select { min-width: 120px; }
.dtable-form textarea { border: 1px solid #dee2e6; }
.dtable-form .frm_input { width: 100%; padding: .375rem .75rem; border: 1px solid #dee2e6; }
.wr_option { flex: 1 1 auto; border: 1px solid #dee2e6; border-bottom: 0; background: #fafafa; padding: 5px; }
.wr_option .wr_option_header { display: flex; }
.wr_option .wr_option_header &gt; div { padding: 2px 8px; border: 1px solid #dee2e6; font-size: 12px; background: #fff; cursor: pointer; }
.wr_option .wr_option_header &gt; div &gt; i { margin-right: 3px; }
.wr_option .wr_option_header &gt; div:not(:last-child) { margin-right: 5px; }
.wr_option .wr_option_movie { display: none; margin-top: 5px; padding-top: 5px; border-top: 1px dashed #dee2e6; }
.wr_option .wr_option_movie.on { display: block; }
.dtable-form + .board-btn-wrap { margin: 25px; display: flex; justify-content: center; }
.label-file { position: relative; width: 100%; height: 40px; border: 1px solid #ccc; border-radius: .25rem; cursor: pointer; }
.label-file:hover { border-color: #ccc; }
.label-file:before { position: absolute; top: 8px; left: 10px; content: attr(data-hold); font-size: 14px; }
.label-file:after { position: absolute; top: -1px; right: 0; bottom: -1px;content: attr(data-btn); font-size: 14px; background: #000; color: #fff; line-height: 40px; width: 80px; text-align: center; display: block; border-top-right-radius: .25rem; border-bottom-right-radius: .25rem; border: 1px solid transparent; }
.file-input { opacity: 0; position: absolute; z-index: -1; margin: 0; padding: 0; display: block; cursor: pointer; width: 100%; }

/* 카테고리 */
.board-category { position: relative; width: 100%; margin: 25px 0 17px 0; overflow: hidden; overflow-x: auto; padding-bottom: 8px; }
.board-category &gt; ul { display: flex; }
.board-category &gt; ul &gt; li { display: block; border: 1px solid #dee2e6; text-align: center; }
.board-category &gt; ul &gt; li:not(:first-child) { border-left: 0; }
.board-category &gt; ul &gt; li:first-child { border-top-left-radius: .25rem; border-bottom-left-radius: .25rem; }
.board-category &gt; ul &gt; li:last-child { border-top-right-radius: .25rem; border-bottom-right-radius: .25rem; }
.board-category &gt; ul &gt; li &gt; a { display: inline-block; padding: .375rem 1rem; white-space: nowrap; font-size: 14px; }
.board-category &gt; ul &gt; li.cate-on { background: #f6f6f6 }
.board-category &gt; ul &gt; li.cate-on &gt; a { }
@media(max-width: 768px) {
.board-category &gt; ul &gt; li &gt; a { font-size: 12px; }
}
#board-list-top { position: relative; margin-bottom: 20px; display: flex; }
/* 리스트 */
.board-templete-list { position: relative; width: 100%; }
.board-templete-list &gt; li { position: relative; border-bottom: 1px solid #dee2e6; }
.board-templete-list &gt; li:last-child { border-bottom: 0; }
.board-templete-list &gt; li:hover { background-color: #f8f9fa; }
.board-templete-list &gt; li &gt; .item-list { position: relative; display: flex; padding: .75rem 1rem; width: 100%; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-image { flex: 0 0 3rem; max-width: 3rem; height: 3rem; margin-right: 10px; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-image img { width: 100%; height: 100%; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont { position: relative; flex: 1 1 auto; max-width: 100%; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject { display: flex; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject &gt; .list-icon { display: inline-block; flex: 0 0 auto; margin-right: 5px; color: #6c757d; line-height: 1.2; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject &gt; .list-icon.new { color: #dc3545; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject &gt; a { flex: 0 0 auto; max-width: 100%; line-height: 1.2; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject &gt; a .wr-subject { word-break: keep-all; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject &gt; a + .list-icon { margin-left: 8px; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta { display: flex; font-size: 13px; color: #868e96; padding-top: .375rem; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-meta { position: relative; align-self: center; display: inline-block; margin-right: 17px; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-meta:after { content: ''; position: absolute; top: 50%; right: -8px; transform: translateY(-50%); border-right: 1px solid #dee2e6; height: 12px; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-meta:last-child:after { display: none; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-meta &gt; span { display: inline-block; margin-right: 3px; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-good { display: flex; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-good &gt; span.icon-inner { align-self: center; display: inline-flex; align-items: center; width: 1rem; height: 1rem; color: #ff5a57; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-good &gt; span.icon-inner svg { fill: #ff5a57; width: 100%; height: 100%; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-comment { flex: 0 0 auto; align-self: center; padding: 0.5rem 1rem; margin-left: 1rem; font-size: 0.875rem; font-weight: 500; color: #495057; border: 1px solid #e9ecef; background: #f8f9fa; }
.board-empty { min-height: 240px; text-align: center; line-height: 240px; }
@media(max-width: 768px) {
#board-list-wrapper .board-card { padding: 15px 7px; }
.board-templete-list &gt; li &gt; .item-list { padding: .75rem 0; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-image { flex: 0 0 2rem; max-width: 2rem; height: 2rem; margin-right: 7px; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-image img { width: 100%; height: 100%; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject { font-size: 13px; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject &gt; .list-icon { }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject &gt; .list-icon.new {  }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject &gt; a { }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject &gt; a .wr-subject { word-break: keep-all; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-subject &gt; a + .list-icon { }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta { font-size: 11px; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-meta { margin-right: 13px; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-meta:after { right: -7px; }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-meta:last-child:after { }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-meta &gt; span { }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-good { }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-good &gt; span.icon-inner { }
.board-templete-list &gt; li &gt; .item-list &gt; .list-cont .list-meta &gt; .wr-good &gt; span.icon-inner svg { }
.board-templete-list &gt; li &gt; .item-list &gt; .list-comment { margin-left: .75rem; font-size: 0.75rem; padding: 0.375rem 0.75rem; }
}

/* view */
.article-subject { font-size: 22px; }
.article-meta-info { display: flex; padding: 15px 0; border-bottom: 1px solid #dee2e6; }
.article-meta-info .meta-profile { width: 50px; height: 50px; padding: 3px; }
.article-meta-info .meta-profile img { width: 100%; height: auto; border-radius: 50%; }
.article-meta-info .meta-info { align-self: center; flex: 1 1 auto; max-width: 100%; margin-left: 10px; font-size: 13px; }
.article-meta-info .meta-info .meta-item { display: flex; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta { position: relative; align-self: center; display: inline-block; margin-right: 17px; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta:after { content: ''; position: absolute; top: 50%; right: -8px; transform: translateY(-50%); border-right: 1px solid #dee2e6; height: 12px; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta:last-child:after { display: none; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta &gt; span { display: inline-block; margin-right: 3px; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta.wr-good { display: flex; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta.wr-good &gt; span.icon-inner { align-self: center; display: inline-flex; align-items: center; width: 1rem; height: 1rem; color: #ff5a57; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta.wr-good &gt; span.icon-inner svg { fill: #ff5a57; width: 100%; height: 100%; }
@media(max-width: 768px) {
.article-subject { font-size: 17px; }
.article-meta-info { display: flex; padding: 15px 0; border-bottom: 1px solid #dee2e6; }
.article-meta-info .meta-profile { width: 42px; height: 42px; padding: 3px; }
.article-meta-info .meta-profile img { width: 100%; height: auto; border-radius: 50%; }
.article-meta-info .meta-info { align-self: center; flex: 1 1 auto; max-width: 100%; margin-left: 7px; font-size: 12px; }
.article-meta-info .meta-info .meta-item { display: flex; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta { position: relative; align-self: center; display: inline-block; margin-right: 13px; white-space: nowrap; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta:after { content: ''; position: absolute; top: 50%; right: -7px; transform: translateY(-50%); border-right: 1px solid #dee2e6; height: 12px; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta:last-child:after { display: none; }
.article-meta-info .meta-info .meta-item &gt; .wr-meta &gt; span { display: inline-block; margin-right: 3px; }
.article-meta-info .meta-info .meta-item &gt; .wr-good { }
.article-meta-info .meta-info .meta-item &gt; .wr-good &gt; span.icon-inner { width: 0.85rem; height: 0.85rem;}
.article-meta-info .meta-info .meta-item &gt; .wr-good &gt; span.icon-inner svg { }
}
#article-view-file { padding: 5px; }
#article-view-file &gt; ul { }
#article-view-file &gt; ul &gt; li { font-size: 13px; border-bottom: 1px dashed #ddd; padding: 0 0 3px 5px; }
#article-view-file &gt; ul &gt; li &gt; i { margin-right: 5px; }
#article-view-file &gt; ul &gt; li &gt; a { }
#article-view-file &gt; ul &gt; li &gt; span { }
#article-view-link { padding: 5px; }
#article-view-link &gt; ul { }
#article-view-link &gt; ul &gt; li { font-size: 13px; border-bottom: 1px dashed #ddd; padding: 0 0 3px 5px; }
#article-view-link &gt; ul &gt; li &gt; i { margin-right: 5px; }
#article-view-link &gt; ul &gt; li &gt; a { }
#article-view-link &gt; ul &gt; li &gt; span { }
.article-movie { padding: 25px 5px; text-align: center; }
.article-content { position: relative; width: 100%; padding: 25px 5px; }
.article-content img { width: auto !important; height: auto !important; max-width: 100% !important; }
.article-face { display: flex; justify-content: center; margin: 0; }
.article-face &gt; .btn-face { position: relative; background-color: transparent; border-radius: 0; padding: 0; }
.article-face &gt; .btn-face &gt; .face-ico { width: 50px; height: 40px; padding: 8px 12px 0 12px; }
.article-face &gt; .btn-face.face-nogood &gt; .face-ico { width: 50px; height: 40px; padding: 11px 12px 0 12px; }
.article-face &gt; .btn-face.face-good + .face-nogood { }
.article-face &gt; .btn-face &gt; .face-ico svg { width: 100%; height: 100%; }
.article-face &gt; .btn-face.face-good &gt; .face-ico svg { fill: #ff5a57; }
.article-face &gt; .btn-face.face-nogood &gt; .face-ico svg { fill: #333; }
.article-face &gt; .btn-face.face-good &gt; b.face_num { color: #ff5a57; line-height: 1; }
.article-face &gt; .btn-face.face-nogood &gt; b.face_num { color: #333; line-height: 1; }
.article-btn-wrap { display: flex; width: 100%; }
.article-btn-wrap &gt; .board-btn-wrap { display: flex; }
.article-btn-wrap &gt; .board-btn-wrap:last-child { margin-left: auto; }
.article-btn-wrap &gt; .board-btn-wrap &gt; .btn:not(:last-child) { margin-right: 5px; }
.article-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; }
.article-view-nb:after { display: block; visibility: hidden; clear: both; content: ""; }
.article-view-nb li { border-bottom: 1px solid #ddd; border-top: 0; padding: 10px; display: flex; align-items: center; justify-content: space-between; }
.article-view-nb li:hover { background: #f6f6f6; }
.article-view-nb li &gt; * { display: block; white-space: nowrap; }
.article-view-nb li .nb_tit { display: inline-block; padding-right: 10px; color: #3f4553; }
.article-view-nb li .nb_tit i { margin-right: 5px; }
.article-view-nb li a { margin-right: 5px; overflow: hidden; text-overflow: ellipsis; width: 100%; }
.article-view-nb li .nb_date { float: right; color: #888; }
@media(max-width: 768px) {
.article-view-nb { font-size: 13px; }
.article-view-nb:after { }
.article-view-nb li { }
.article-view-nb li:hover { }
.article-view-nb li &gt; * { }
.article-view-nb li .nb_tit { }
.article-view-nb li .nb_tit i {  }
.article-view-nb li a { }
.article-view-nb li .nb_date { }
}

/* comment */
.comment-list-box { position: relative; width: 100%; display: flex; padding: 8px 0 12px 0; border-bottom: 1px solid #f6f6f6; margin-bottom: 8px; font-size: 14px; }
.comment-list-box:last-child { border-bottom: 0; margin-bottom: 0; }
.comment-depth1 { padding-left: 25px; }
.comment-depth2 { padding-left: 50px; }
.comment-list-box &gt; .comment-profile { flex: 0 0 50px; max-width: 50px; }
.comment-list-box &gt; .comment-profile img { width: 100%; height: auto; border-radius: 50%; }
.comment-list-box &gt; .comment-content { flex: 1 1 auto; max-width: 100%; padding: 8px 0 4px 10px; }
.comment-header { display: flex; width: 100%; }
.comment-header &gt; .ico-name { font-size: 14px; font-weight: 600; }
.comment-header &gt; .ico-date { display: inline-block; margin-left: 5px; align-self: center; font-size: 13px; }
.comment-header &gt; .ico-date i { font-size: 14px; margin-right: 2px; }
.comment-header &gt; .comment-btn { margin-left: auto; display: flex; font-size: 12px; }
.comment-header &gt; .comment-btn &gt; li { position: relative; }
.comment-header &gt; .comment-btn &gt; li:not(:last-child) { margin-right: 2px; }
.comment-header &gt; .comment-btn &gt; li &gt; span { display: inline-block; cursor: pointer; }
.comment-header &gt; .comment-btn &gt; li &gt; span.cmt-icon { padding: 1px 8px; border: 1px solid #dee2e6; border-radius: .25rem; }
.comment-header &gt; .comment-btn &gt; li &gt; span.cmt-icon-face { display: flex; }
.comment-header &gt; .comment-btn &gt; li &gt; span.cmt-icon-face .ico-img { display: inline-block; padding: 0 3px; }
.comment-header &gt; .comment-btn &gt; li &gt; span.cmt-icon-good .ico-img { color: #ff5a57; }
.comment-header &gt; .comment-btn &gt; li &gt; span.cmt-icon-good .ico-num { color: #ff5a57; }
.comment-header &gt; .comment-btn &gt; li &gt; span.cmt-icon-nogood .ico-img { color: #333; }
.comment-header &gt; .comment-btn &gt; li &gt; span.cmt-icon-nogood .ico-num { color: #333; }
.comment-body { padding: 5px 0 8px 5px; }
.face_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; }
.face_msg.msg_good { background: rgba(231,68,113,.85); }
.face_msg.msg_nogood { background: rgba(1,134,190,.85); }
/* comment write */
#comment-write { margin: 50px 0 25px 0; }
.fcommentw { }
.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 &gt; div { padding: 2px 8px; border: 1px solid #d5d5d5; font-size: 12px; background: #fff; cursor: pointer; }
.fcommentw .cw_option .cw_option_header &gt; div &gt; i { margin-right: 3px; }
.fcommentw .cw_option .cw_option_header &gt; div:not(:last-child) { margin-right: 5px; }
.fcommentw .cw_option .cw_option_header .cw_secret { margin-left: auto; }
.fcommentw .cw_option .cw_option_file,
.fcommentw .cw_option .cw_option_movie { display: none;border-top: 1px dashed #d5d5d5; background: #fff; margin-top: 5px; }
.fcommentw .cw_option .write_input { border: 1px solid #f6f6f6; width: 100%; padding: .375rem .75rem; }
.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; }
.cw_form_tail { display: flex; }
.cw_form_tail .cw_btn { margin-left: auto; }
/* emoticon */
.myModal.emoticon .myModal-header { background: #fff; border-bottom: 1px solid #ddd; }
.myModal.emoticon .myModal-header &gt; .header-title &gt; span { display: inline-block; padding-right: 15px; color: #000; font-weight: 600; }
.myModal.emoticon .myModal-header button.closex:before,
.myModal.emoticon .myModal-header button.closex:after,
.myModal.emoticon .myModal-footer button.closex:before,
.myModal.emoticon .myModal-footer button.closex:after { background-color: #000; }
.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.emoticon .myModal-header button.closex { width: 50px; height: 50px; }
}</pre></body></html>