@charset "utf-8";

/* board/basic, board/gallery, qa, faq에서 참조합니다. */

/* 게시판 공통 */
.bo_common {}
.bo_common .txt_rdy {display:inline-block;height:30px;line-height:30px;padding:0 12px;border-radius:20px;color:#fff;font-size:1.2rem;background:var(--gradient);font-weight:600}
.bo_common .txt_rdy i,
.bo_common .txt_rdy svg {font-size:1.3rem}
.bo_common .txt_done { display:inline-block;height:30px;line-height:30px;padding:0 12px;border-radius:20px;color:#fff;font-size:1.2rem;background:var(--accent-green);font-weight:600 }
.bo_common .txt_done i,
.bo_common .txt_done svg {font-size:1.3rem}
.bo_common .fa-heart { display:inline-block; width:10px;height: 10px;padding: 3px; color:#ff0000; background:#ffb9b9; text-align:center; border-radius:2px; vertical-align:middle }
.bo_common .fa-lock { display:inline-block; width:10px;height: 10px;padding: 3px; color:#4f818c; background:#cbe3e8; text-align:center; border-radius:2px; font-size:1.2rem; border:1px solid #cbe3e8; vertical-align:middle }
.bo_common .new_icon { display:inline-block; width:18px; line-height:18px; font-size:1rem; color:#10B981; background:#D1FAE5; text-align:center; border-radius:4px; margin-left:4px; font-weight:600; vertical-align:middle }

.bo_common .buttons_more { position:relative; }
.bo_common .buttons_more .more { display:none; position:absolute; top:45px; background:var(--cardBg); border:var(--border); z-index:999; border-radius: var(--radius-sm); box-shadow: var(--shadow); }
.bo_common .buttons_more .more:before { content:""; position:absolute; top:-8px; right:13px; width:0; height:0; border-style:solid; border-width:0 6px 8px 6px; border-color:transparent transparent var(--border) transparent }
.bo_common .buttons_more .more:after { content:""; position:absolute; top:-6px; right:13px; width:0; height:0; border-style:solid; border-width:0 6px 8px 6px; border-color:transparent transparent var(--cardBg) transparent }
.bo_common .buttons_more .more li { border-bottom:var(--border); color:var(--text-secondary); text-align:left; }
.bo_common .buttons_more .more button,
.bo_common .buttons_more .more a { display:block; padding:12px 16px;width:100%; border:0; background:var(--cardBg); color:var(--text-secondary); font-size:1.2rem; text-align:left; transition: var(--transition); }
.bo_common .buttons_more .more a:hover,
.bo_common .buttons_more .more a:focus,
.bo_common .buttons_more .more button:hover,
.bo_common .buttons_more .more button:focus { color:var(--primary); background: var(--bg-slate); }
.bo_common .buttons_more .more svg { float:right; }

/* 게시판 쓰기 */
.bo_write {}
.bo_write h2 { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: polygon(0 0, 0 0, 0 0); }

.bo_write > form > div { position:relative; margin:12px 0; }

.bo_write .write_select select { border:1px solid var(--border); width:100%; height:48px; border-radius: var(--radius-sm); background: var(--cardBg); color: var(--text-primary); padding: 0 16px; }

.bo_write .write_writer { display:grid; grid-template-columns:1fr 1fr; gap:12px; }

.bo_write .write_option ul { display:flex; gap:8px; }

.bo_write .write_subject { position:relative }
.bo_write .write_subject .frm_input { padding-right:160px; height: 56px; font-size: 1.6rem; font-weight: 600; }
.bo_write .write_subject #btn_autosave_list { position:absolute; top:8px; right:15px; line-height:32px; height:32px }
.bo_write .write_subject #autosave_pop { display:none; z-index:10; position:absolute !important; top:44px; right:0; width:350px; height:auto !important; height:180px; max-height:180px; border:1px solid var(--border); background:var(--cardBg);box-shadow: var(--shadow); border-radius: var(--radius-sm); }
html.no-overflowscrolling .bo_write .write_subject #autosave_pop { height:auto; max-height:10000px !important }
.bo_write .write_subject #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 var(--border) transparent }
.bo_write .write_subject #autosave_pop:after { content:""; position:absolute; top:-6px; right:45px; width:0; height:0; border-style:solid; border-width:0 6px 8px 6px; border-color:transparent transparent var(--cardBg) transparent }
.bo_write .write_subject #autosave_pop strong { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: polygon(0 0, 0 0, 0 0); }
.bo_write .write_subject #autosave_pop div { text-align:center; margin:0 !important }
.bo_write .write_subject #autosave_pop button { margin:0; padding:0; border:0 }
.bo_write .write_subject #autosave_pop ul { padding:16px; border-top:var(--border); list-style:none; overflow-y:scroll; height:130px; border-bottom:var(--border) }
.bo_write .write_subject #autosave_pop li { display:flex; justify-content: space-between; padding:10px 8px; border-bottom:var(--border); background: var(--bg-slate); transition: all 0.2s; }
.bo_write .write_subject #autosave_pop a { display:block; max-width:135px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bo_write .write_subject #autosave_pop li > div { font-size:1.1rem; color:var(--text-muted) }
.bo_write .write_subject .autosave_content { display:none }
.bo_write .write_subject .autosave_del { height:20px; width:20px }
.bo_write .write_subject #autosave_close { cursor:pointer; width:100%; height:36px; background:none; color:var(--text-muted); font-weight:600; font-size:1.2rem; transition: var(--transition); }
.bo_write .write_subject #autosave_close:hover { background: var(--bg-slate); color: var(--primary); }

.bo_write #char_count_desc { display:block; margin:0 0 8px; padding:0 }
.bo_write #char_count_wrap { margin:8px 0 0; text-align:right }
.bo_write #char_count { font-weight:bold; color: var(--primary); }

.bo_write .write_link svg { position:absolute; top:16px; left:16px; font-size:1.5rem; color:var(--text-muted); }
.bo_write .write_link .frm_input { padding-left:50px }

.bo_write .write_file { position:relative; border:1px solid var(--border); background:var(--cardBg); color:var(--fontColor); vertical-align:middle; border-radius: var(--radius-sm); padding:12px; transition: var(--transition); }
.bo_write .write_file svg { position:absolute; top:14px; left:16px; font-size:1.5rem; color:var(--text-muted); }
.bo_write .write_file .frm_file { margin:4px 0 0 44px; }
.bo_write .write_file .frm_input { margin:12px 0 0; background:var(--bg-slate); }
.bo_write .write_file .file_del { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin: 12px 0 0; padding: 10px; background: var(--bg-slate); font-size:1.2rem; color:var(--text-muted); border-radius: var(--radius-sm); }
.bo_write .write_file .file_del label { display: flex; align-items: center; }

@media ( min-width: 1101px ) {
    .bo_write .write_file .file_del .elip { max-width: 300px; }
}

@media ( max-width: 1100px ) {
    .bo_write .write_file .file_del .elip,
    .bo_write .write_file .file_del .size { display: none; }
}

.bo_write .btn_submit { padding:0 24px; font-size:1.5rem; height: 52px; border-radius: var(--radius-sm); }
.bo_write .btn_cancel { border-radius: var(--radius-sm); font-size:1.5rem; height: 52px; padding: 0 24px; }

/* 게시판 읽기 */
.bo_view { margin-bottom:24px; background:var(--cardBg); box-sizing:border-box; border-radius: var(--radius); border: 1px solid var(--border); box-shadow: var(--shadow); }

.bo_view .view_buttons { }
.bo_view .view_buttons { display:flex; justify-content: right; list-style:none; word-break:break-all; background:var(--cardBg) }
.bo_view .view_buttons > li { height:40px }

.bo_view #view_subject {font-size:2.6rem; margin:8px 0 24px; padding:0; word-break:break-all; color: var(--text-primary); font-weight: 700; line-height: 1.3;}
.bo_view #view_subject .subject_cate { display:inline-block; line-height:22px; background: var(--gradient); color:#fff; padding:4px 14px; border-radius:20px; font-size: 1.2rem; font-weight: 600; }

.bo_view #view_header { display:grid; gap:12px; padding-bottom: 12px; border-bottom:var(--border); color:var(--text-secondary) }
.bo_view #view_header .header_profile_img img { border-radius:50%; width:48px; height:48px; border: 2px solid var(--border); }
.bo_view #view_header .header_info { display:flex; flex-direction: column; justify-content: center; gap: 6px; }
.bo_view #view_header > span { display:inline-block; margin:0 12px 0 0; font-weight:normal }
.bo_view #view_header > span a {color: var(--text-muted);}
.bo_view #view_header .sv_member,
.bo_view #view_header .sv_guest,
.bo_view #view_header .member,
.bo_view #view_header .guest { font-weight: 600; color: var(--text-primary); }
.bo_view #view_header .member { color: var(--text-primary); }
.bo_view #view_header .profile_img { display:none }
.bo_view #view_header .sv_member { color: var(--primary); }
.bo_view #view_header .info_date { margin:0; color:var(--text-muted) }

.bo_view #view_header .buttons_more .more { right:-8px; width:90px; }

.bo_view #view_article { padding:0 0 50px; }

.bo_view #article_img { width:100%; overflow:hidden; }
.bo_view #article_img:after { display:block; visibility:hidden; clear:both; content:"" }
.bo_view #article_img a.view_image { display:block }
.bo_view #article_img img { margin-bottom:20px; max-width:100%; height:auto; border-radius: var(--radius-sm); }

.bo_view #article_share { position:relative; padding:24px 0 }
.bo_view #article_share:after { display:block; visibility:hidden; clear:both; content:"" }
.bo_view #article_share .btn { padding:0 16px; color:var(--text-secondary); font-weight:500; font-size:1.3rem; width:90px; line-height:40px; height:40px; border:1px solid var(--border); border-radius: var(--radius-sm); transition: var(--transition); }
.bo_view #article_share .btn:hover { background: var(--bg-slate); color: var(--primary); border-color: var(--primary); }
.bo_view #article_share .btn svg { margin-right:6px; color:var(--text-muted); vertical-align:middle }

/* 에디터를 사용하지 않을 때 { */
.bo_view #article_contents.textarea { margin:12px 0 30px; width:100%; line-height:2rem; min-height:200px; word-break:break-all; overflow:hidden; color: var(--text-primary); font-size: 1.4rem; }
.bo_view #article_contents.textarea ul { list-style:disc }
.bo_view #article_contents.textarea a { color: var(--primary); text-decoration: underline; }
.bo_view #article_contents.textarea img { max-width:100%; height:auto }
/* }에디터를 사용하지 않을 때 */

/* ckeditor4를 사용할 때 { */
.bo_view #article_contents.ckeditor4 { line-height: 1.9; font-size:1.4rem; word-wrap: break-word; color: var(--text-primary); }
.bo_view #article_contents.ckeditor4 blockquote { margin:0; padding: 4px 12px 0 14px; border-style: solid; border-color: var(--primary); border-width: 0;border-left-width: 4px; background: var(--bg-slate); padding: 16px; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.bo_view #article_contents.ckeditor4 p { margin:0; padding: 0 0 12px 0; }
.bo_view #article_contents.ckeditor4 a { color: var(--primary); }
.bo_view #article_contents.ckeditor4 ol,
.bo_view #article_contents.ckeditor4 ul,
.bo_view #article_contents.ckeditor4 dl { margin-right: 0px; padding: 0 40px; }
.bo_view #article_contents.ckeditor4 ul { list-style:disc; }
.bo_view #article_contents.ckeditor4 h1,
.bo_view #article_contents.ckeditor4 h2,
.bo_view #article_contents.ckeditor4 h6 { line-height: 1.3; font-weight: 600; margin: 20px 0 12px; }
.bo_view #article_contents.ckeditor4 hr { border: 0px; border-top: 1px solid var(--border); }
.bo_view #article_contents.ckeditor4 p img { vertical-align: middle; }
.bo_view #article_contents.ckeditor4 img.right { float: right; margin-left: 15px; padding: 4px; border: 1px solid var(--border); border-radius: var(--radius-sm); }
.bo_view #article_contents.ckeditor4 img.left { float: left; margin-right: 15px; padding: 4px; border: 1px solid var(--border); border-radius: var(--radius-sm); }
.bo_view #article_contents.ckeditor4 pre { white-space: pre-wrap; word-wrap: break-word; -moz-tab-size: 4; tab-size: 4; background: #1E1E1E; color: #D4D4D4; padding: 16px; border-radius: var(--radius-sm); }
.bo_view #article_contents.ckeditor4 .marker { background-color: #FEF3C7; color: #000; }
.bo_view #article_contents.ckeditor4 span[lang] { font-style: italic; }
.bo_view #article_contents.ckeditor4 figure { display: inline-block; padding: 12px; margin: 12px 20px; border: solid 1px var(--border); border-radius: var(--radius-sm); background: var(--bg-slate); text-align: center; }
.bo_view #article_contents.ckeditor4 figure > figcaption { display: block; text-align: center; color: var(--text-muted); margin-top: 8px; }
.bo_view #article_contents.ckeditor4 a > img { padding: 1px; margin: 1px; border: none; outline: 1px solid var(--primary); }
.bo_view #article_contents.ckeditor4 .code-featured { border: 5px solid var(--primary); }
.bo_view #article_contents.ckeditor4 .math-featured { margin: 12px; padding: 20px; box-shadow: 0 0 2px rgba(200, 0, 0, 0.3); background-color: var(--bg-slate); }
.bo_view #article_contents.ckeditor4 .image-clean { padding: 0; border: 0; background: none; }
.bo_view #article_contents.ckeditor4 .image-clean > figcaption { font-size: 1.2rem; text-align: right; color: var(--text-muted); }
.bo_view #article_contents.ckeditor4 .image-grayscale { background-color: #fff; color: var(--text-secondary); }
.bo_view #article_contents.ckeditor4 .image-grayscale img,
.bo_view #article_contents.ckeditor4 img.image-grayscale { filter: grayscale(100%); }
.bo_view #article_contents.ckeditor4 .atwho-inserted { color: var(--primary); }
.bo_view #article_contents.ckeditor4 .embed-240p { margin:0 auto; max-width: 426px; max-height: 240px; }
.bo_view #article_contents.ckeditor4 .embed-360p { margin:0 auto; max-width: 640px; max-height: 360px; }
.bo_view #article_contents.ckeditor4 .embed-480p { margin:0 auto; max-width: 854px; max-height: 480px; }
.bo_view #article_contents.ckeditor4 .embed-720p { margin:0 auto; max-width: 1280px; max-height: 720px; }
.bo_view #article_contents.ckeditor4 .embed-1080p { margin:0 auto; max-width: 1920px; max-height: 1080px; }
/* }ckeditor4를 사용할 때 */

.bo_view #article_react { display:flex; gap: 12px; align-items: center; justify-content: center; margin-bottom:30px; }
.bo_view #article_react > div { position:relative }
.bo_view #article_react .btn_react { display:block; margin-right:6px; border:1px solid var(--border); width:80px; line-height:48px; border-radius:30px; vertical-align:middle; color:var(--text-secondary); text-align: center; background: var(--cardBg); transition: var(--transition); }
.bo_view #article_react .btn_react:hover,
.bo_view #article_react .btn_react.active { background: var(--gradient); color:#fff; border-color: var(--primary); }
.bo_view #article_react svg { font-size:1.8rem; margin-right:6px }
.bo_view #article_react .react_msg { display:none; position:absolute; top:34px; left:0; z-index:9999; padding:12px 0; width:175px; background: var(--bg-slate); color:#fff; text-align:center; border-radius: var(--radius-sm); }

.bo_view .view_filelink ul { }
.bo_view .view_filelink li { display:grid; grid-template-columns: 50px 1fr; margin:12px 0; padding:16px; border-radius: var(--radius-sm); border: 1px solid var(--border); transition: var(--transition); }
.bo_view .view_filelink svg { color:var(--text-muted); font-size:2.8rem; }
.bo_view .view_filelink a { display:block; margin:0 0 4px;text-decoration:none; word-wrap:break-word; color:var(--text-primary); font-weight: 500; }
.bo_view .view_filelink a:focus,
.bo_view .view_filelink li:hover a,
.bo_view .view_filelink a:active { text-decoration:underline; color: var(--primary); }
.bo_view .view_filelink img { float:left; margin:0 12px 0 0 }
.bo_view .view_filelink .filelink_cnt { color:var(--text-muted); font-size:1.2rem; }
.bo_view .view_filelink li:hover { border-color: var(--primary); background: var(--bg-slate); }
.bo_view .view_filelink li:hover svg { color: var(--primary); }
.bo_view .view_filelink li:hover .filelink_cnt { color: var(--primary); }

.bo_view #view_move { display:grid; gap: 12px; margin:12px 0 40px; background: var(--cardBg); }
.bo_view #view_move a { display:flex; flex-direction: column; position:relative; padding:20px 60px; width: 100%; border-radius: var(--radius); }
.bo_view #view_move a svg { position:absolute; top:45%; width: 20px; height: 12px; text-align: center; vertical-align: middle; }
.bo_view #view_move .prev { background: var(--bg-slate); color:var(--text-secondary); text-align:left; margin-left: auto; border: 1px solid var(--border); }
.bo_view #view_move .prev svg { left: 20px; }
.bo_view #view_move .next { background: var(--gradient); color:#ffffff; text-align: right; margin-right: auto; }
.bo_view #view_move .next svg { right: 20px; }
.bo_view #view_move .label { display:block; font-size: 1.4rem; }
.bo_view #view_move .subject { display:block; padding: 6px 0px; font-size: 1.6rem; font-weight:600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bo_view #view_move .date { display:block; color:var(--text-muted); font-size: 1.2rem; }
.bo_view #view_move .prev .label,
.bo_view #view_move .prev .date { color:var(--text-muted); }
.bo_view #view_move .next .label,
.bo_view #view_move .next .date { color:rgba(255,255,255,0.7); }

@media ( min-width: 1101px ) {
    .bo_view #view_move { display: grid; grid-template-columns: 1fr 1fr; }
    .bo_view #view_move a { max-width:440px; }
}

@media ( max-width: 1100px ) {
    .bo_view #view_move { display:flex; flex-direction: column; row-gap: 12px; }
}

/* 게시판 댓글 */
.bo_view .comment_opener { width:100%; text-align:left; border:0; border-bottom:1px solid var(--border); background:var(--cardBg); font-weight:600; margin:30px 0 0px; padding:0 0 16px; font-size: 1.5rem; color: var(--text-primary); }
.bo_view .comment_opener span.total { position:relative; display:inline-block; margin-right:6px; font-size:1.3rem; color: var(--primary); }
.bo_view .comment_opener svg { float:right; }
.bo_view .comment_opener b { font-size:1.5rem; color:var(--text-primary); }
.bo_view .comment_opener span.total:after { position:absolute; bottom:-18px; left:0; display:inline-block; background:var(--primary); content:""; width:100%; height:2px }

.bo_comment_write { position:relative; margin:12px 0; }
.bo_comment_write #contents_length { display:block; margin:0 0 6px }
.bo_comment_write textarea { border:1px solid var(--border); background:var(--cardBg); color:var(--text-primary); vertical-align:middle; border-radius: var(--radius-sm); padding:12px; width:100%; height:120px; transition: var(--transition); }
.bo_comment_write textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(99,102,241,0.2); outline: none; }

.bo_comment_write .write_writer { margin:12px 0; float:left }
.bo_comment_write .write_writer:after { display:block; visibility:hidden; clear:both; content:"" }
.bo_comment_write .write_writer .frm_input { float:left; margin-right:6px }
.bo_comment_write .write_writer #captcha { display:block; padding-top:12px; clear:both }

.bo_comment_write .btn_confirm { display:flex; gap:20px; justify-content: right; align-items: center; margin-top:12px }
.bo_comment_write .btn_submit, .bo_comment_write .btn_cancel { height:48px; padding:0 24px; border-radius: var(--radius-sm); font-weight:600; font-size:1.4rem }

.bo_comment { }
.bo_comment .comment { display:grid; grid-template-columns: 50px 1fr 40px; gap:12px; position:relative; margin:20px 0; padding-bottom: 8px; border-bottom:1px solid var(--border); }
.bo_comment .comment_depth1 { margin: 0 0 0 50px }
.bo_comment .comment_depth2 { margin: 0 0 0 100px }
.bo_comment .comment_depth3 { margin: 0 0 0 150px }
.bo_comment .comment_depth4 { margin: 0 0 0 200px }
.bo_comment .comment_depth5 { margin: 0 0 0 250px }

.bo_comment .comment .fa-reply { position:absolute; top:0; left:-16px; transform: rotate(180deg); }

.bo_comment .comment_profile_img img { border-radius:50%; width:48px; height:48px; border: 2px solid var(--border); }
.bo_comment .comment_info { color: var(--text-primary); }
.bo_comment .member,
.bo_comment .guest,
.bo_comment .sv_member,
.bo_comment .sv_guest { font-weight: 600; }
.bo_comment .comment .datetime { color:var(--text-muted) }

.bo_comment .comment_contents { padding:0 0 20px; line-height:2rem; color: var(--text-primary); font-size: 1.4rem; }
.bo_comment .comment_contents .contents_info { margin: 0 0 6px; }
.bo_comment .comment_contents .contents a { text-decoration:underline }
.bo_comment .comment_contents .contents a.certify { text-decoration:underline; color:#ef4444 }

.bo_comment .empty { margin:0; padding:80px 0 !important; color:var(--text-muted); text-align:center }

.bo_comment .buttons_more .more { right:8px; width:68px; }
.bo_comment .buttons_more .more a,
.bo_comment .buttons_more .more button { text-align:center; }

/* 게시판 목록 */
.bo_list { position:relative; margin-bottom:24px }
.bo_list:after { display:block; visibility:hidden; clear:both; content:"" }

.bo_list .list_header { display:flex; justify-content: space-between; align-items: center; margin:0 0 16px; }
.bo_list .list_header > ul { display:flex; }
.bo_list .list_header .more { right:-8px; width:100px; }

.bo_list .list_footer { display:flex; justify-content: space-between; }
.bo_list .list_footer ul { display:flex; }

.bo_list .list_search { display:none; width:100%; height:100%; position:fixed; top:0; left:0; z-index:999 }
.bo_list .list_search .search_modal { position:absolute; top:50%; left:50%; background:var(--bodyBg); text-align:left; padding:20px; width:360px; max-height:320px; margin-left:-160px; margin-top:-190px; overflow-y:auto; border-radius: var(--radius); box-shadow: var(--shadow); border:1px solid var(--border) }
.bo_list .list_search .modal_title { padding:6px 0 16px; border-bottom:1px solid var(--border); color: var(--text-primary); font-weight:600; font-size: 1.5rem; }
.bo_list .list_search select { border:0; width:100%; height:48px; border:1px solid var(--border); background: var(--cardBg); color: var(--text-primary); border-radius: var(--radius-sm); padding: 0 12px; }
.bo_list .list_search .search_modal .modal_keyword { display:flex; justify-content: space-between; margin-top:8px; background: var(--cardBg); border:1px solid var(--border); border-radius: var(--radius-sm); }
.bo_list .list_search input[type="text"] { width:260px; height:44px; border:0; padding:0 12px; background-color:transparent; color: var(--text-primary); }
.bo_list .list_search button[type="submit"] { height:44px; color:var(--text-muted); background:none; border:0; width:44px; font-size:1.6rem; transition: var(--transition); }
.bo_list .list_search button[type="submit"]:hover { color: var(--primary); }
.bo_list .list_search .modal_close { position:absolute; right:0; top:0; color:var(--text-muted); border:0; padding:14px 16px; font-size:1.6rem; background:var(--bg-slate); border-radius: 0 var(--radius) 0 0; transition: var(--transition); }
.bo_list .list_search .modal_close:hover { color: var(--primary); }
.bo_list .list_search .search_mask { background:rgba(0,0,0,0.5); width:100%; height:100% }

.bo_list .profile_img { display:inline-block; vertical-align:top; }
.bo_list .profile_img img { border-radius:50%; border: 1px solid var(--border); }
.bo_list .count_comment { background: var(--gradient); color:#fff; font-size:1.1rem; height:18px; line-height:18px; padding:0 8px; border-radius:20px; font-weight:600; vertical-align:middle; }
.bo_list .fa-caret-right { color:var(--text-muted) }
.bo_list .fa-download { display:inline-block; width:10px;height: 10px;padding: 3px; color:#daae37; background:#ffefb9; text-align:center; border-radius:2px; vertical-align:middle; }
.bo_list .fa-link { display:inline-block; width:10px;height: 10px;padding: 3px; color:#b451fd; background:#edd3fd; text-align:center; border-radius:2px; vertical-align:middle; }
.bo_list .fa-reply { transform: rotate(180deg); }
.bo_list .category_link { display:inline-block; margin-right:10px; background: var(--gradient); color:#fff; font-weight:600 !important; height:22px; line-height:12px; padding:5px 10px; border-radius:20px; font-size:1.1rem }
.bo_list .category_link:hover { text-decoration:none }
.bo_list .current_article { color:#ef4444 }
.bo_list .react_good { color:#ef4444; }
.bo_list .react_nogood { color: var(--primary); }