@charset "utf-8";

/* UI - Setup
------------------------------------------------*/
html, body {background:#181818 !important; color:rgba(255, 255, 255, 0.8);}
a {color:rgba(255, 255, 255, 0.8);}
a:hover, a:focus {color:#c00;}

/* ---- Scroll bar - webkit ----*/
::-webkit-scrollbar {height:6px; width:6px; background-color:rgba(0,0,0,0.4);}
::-webkit-scrollbar-thumb {border:0px solid transparent; background-color:rgba(255, 255, 255, 0.4); background-clip:padding-box; border-radius:7px}

/********************************************************
 common css edit
********************************************************/
.bg-light {background:rgba(0, 0, 0, 0.2) !important;}
.text-black-50 {color:rgba(255, 255, 255, 0.8) !important;}
.border {border-color:rgba(255, 255, 255, 0.1) !important;}
.border-top {border-color:rgba(255, 255, 255, 0.1) !important;}
.na-table {background:#343538;}
.text-white {color:#262627;}
.text-muted {color:rgba(255, 255, 255, 0.4) !important;}
.text-primary {color:#c00 !important;}
.btn {color:rgba(255, 255, 255, 0.8) !important;}
.input-group-text .text-muted {color:#262627 !important;}
.btnSort {color:rgba(255, 255, 255, 0.8) !important;}
.progress {background:#424245;}
.progress .progress-bar {background:#c00;}
#autosave_pop .list-group {background:#343538; border-radius:0;}

/* fullNavi */
.fullNavi {background:#c00; color:#fff; border:2px solid #c00;}

/* bg-primary */
.bg-primary {background:#c00 !important; border-color:#c00!important; color:#fff !important;}
/* .bg-primary .text-white {color:#262627 !important;} */

/* btn-primary */
.btn-primary.na-notice {font-weight:bold;}
.btn-primary {color:#fff !important; background:#c00 !important; border-color:#c00 !important;}
.btn-primary:hover {background:#c00 !important; border-color:#c00 !important; box-shadow:0 0 0 0.2rem rgb(204, 0, 0, 0.4);}
.btn-primary:focus,
.btn-primary:active {background:#a60101 !important; border-color:#a60101 !important; box-shadow:0 0 0 0.2rem rgb(204, 0, 0, 0.4) !important;}

/* btn-outline-primary */
.btn-outline-primary {border-color:#c00;}
.btn-outline-primary:hover {color:#fff !important; background-color:#c00; border-color:#c00;}
.btn-outline-primary:focus {box-shadow:0 0 0 0.2rem rgb(204, 0, 0, 0.4) !important;}
.btn-outline-primary:active {background:#a60101 !important; border-color:#a60101 !important; }

/* btn-basic */
.btn.btn-basic,
.btn-basic {color:rgba(255, 255, 255, 0.8) !important; background-color:rgba(255, 255, 255, 0.1) !important; border-color: rgba(255, 255, 255, 0.1) !important;}
.btn-basic:hover {background:rgba(255, 255, 255, 0.2) !important; border-color:rgba(255, 255, 255, 0.1) !important; box-shadow:0 0 0 0.2rem rgba(255, 255, 255, 0.04);}
.btn-basic:focus,
.btn-basic:active {background:rgba(255, 255, 255, 0.3) !important; border-color:rgba(255, 255, 255, 0.1) !important; box-shadow:0 0 0 0.2rem rgba(0, 0, 0, 0.1) !important;}

/* btn_confirm */
.btn_confirm .btn_submit {background:#c00;}
.btn_confirm .btn_submit:hover {background:#c00; box-shadow:0 0 0 0.2rem rgb(204, 0, 0, 0.4);}

/* sly-tab
------------------------------------------------*/
.sly-tab .d-flex {border-left:0;}
.sly-tab ul {border-left:1px solid rgba(255, 255, 255, 0.1) !important;}
.sly-tab ul li a {color:#fff; background:rgba(0, 0, 0, 0.1); border-top:1px solid rgba(255, 255, 255, 0.1); border-right: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.1);}
.sly-tab ul li a.active {border-top:1px solid rgba(255, 255, 255, 0.2);color: #cc0000;background:rgba(0, 0, 0, 0.6) !important;border-bottom: 1px solid #cc0000 !important;}
.sly-tab ul li.active a {background:#c00; border-bottom: 1px solid #c00; color:#fff !important;}
.sly-tab hr {border-top: 1px solid rgba(255, 255, 255, 0.1) !important;}

.sly-tab .sly-btn {border:1px solid #5d5f61; color:#fff; background:#424245;}
.sly-tab .sly-btn:hover {background:#1e1f21;}

/* nt_loader */
#nt_loader {background:#1e1f21;}
#nt_loader .loader svg {fill:#c00;}

/********************************************************
 common style
********************************************************/
/* switch toggle */
.switch.active .slider {background:#c00;}

/* top btn */
.go-btn button {color:#c00; border:2px solid #c00; background:#2c2d30;}

/* table */
.table {color:#fff; background:transparent;}

.table-bordered td,
.table-bordered th {border:1px solid rgba(255, 255, 255, 0.1) !important; color:rgba(255, 255, 255, 0.5) !important;}
#fsetup .groupBoxWrap .groupBox {border-bottom: 1px dashed rgba(255, 255, 255, 0.2);}
#fsetup .groupBoxWrap .groupBox h3 {color:#c00; background:rgba(0, 0, 0, 0.2); border-color:rgba(255, 255, 255, 0.1);}
#fsetup .groupBoxWrap .groupBox .setContents {}
#fsetup .groupBoxWrap .groupBox .setContents .text-muted {color:rgba(255, 255, 255, 0.7) !important;}
.form-control-plaintext {color:rgba(255, 255, 255, 0.5) !important;}

.sv_wrap .sv {background:#424245;}
.sv_wrap .sv:before {border-color: transparent transparent #424245 transparent;}

.na-table-head {border-top:1px solid rgba(255, 255, 255, 0.1) !important; border-bottom:1px solid rgba(255, 255, 255, 0.2) !important; background:rgba(0, 0, 0, 0.1);}
.na-table-head > div {color:rgba(255, 255, 255, 0.9);}

.btn-wset a {background:rgba(255, 255, 255, 0.1);}

.page-content {color:#fff;}

/* copy_move
------------------------------------------------*/
.new_win #win_title {background:#c00; color:#fff;}
#copymove table {}
#copymove table thead th {color:#fff !important;}
#copymove table tr {}
#copymove table tr.copymove_currentbg {background:transparent;}
#copymove table tr td {}
#copymove table tr td label {color:rgba(255, 255, 255, 0.7);}
#copymove table tr td .copymove_current {}

/* manageTools
------------------------------------------------*/
.manageTools {background:#343538; border-top:4px solid #666;}
.manageTools .manageHeader {border-bottom: 1px solid rgba(255, 255, 255, 0.1);}
.manageTools .manageHeader .title {color:rgba(255, 255, 255, 0.6);}
.manageTools .manageBody {background:#343538;}
.manageTools .manageBody .box .boxheader .title {color:#c00;}
.manageTools .manageBody .box {background:rgba(255, 255, 255, 0.04);}
.manageTools .manageBody .box .boxbody .list ul li {border-color: rgba(255, 255, 255, 0.1) !important;}
.manageTools .manageBody .box .boxbody .list ul li .switch,
.manageTools .manageBody .box .boxbody .list ul li a {color:rgba(255, 255, 255, 0.6);}
.manageTools .manageBody .box .boxbody .list ul li a:hover {background: #2c2d30; color:rgba(255, 255, 255, 0.6);}

/********************************************************
 LAYOUT
********************************************************/
/* header
------------------------------------------------*/
.header {border-bottom:1px solid rgba(255, 255, 255, 0.06); background:#202020; border-top:4px solid #424245;}
.header .sta .title .hgroup h1 {color:#fff;}
.header .sta .tools button {color:rgba(255, 255, 255, 0.6);}
.header .sta .tools button:hover {color:rgba(255, 255, 255, 1); background:rgba(0,0,0,0.6);}
@media (max-width:1280px) {
	.responsive .header {background:#c00; border-top:4px solid #8f0000;}
	.responsive .header .sta .title .hgroup h1 {color:#fff !important;}
	.responsive .header .sta .tools button {color:#fff !important;}
	.responsive .header .sta .tools button:hover {color:#fff !important; background:rgba(0,0,0,0.2);}
}

/* menu
------------------------------------------------*/
#gnb .gnbWrap > ul > li > .sub-slide {background:rgba(0,0,0,0.9) !important;}
#gnb .gnbWrap > ul > li > .sub-slide > ul > li > a {border-bottom: 1px solid rgba(255,255,255,0.1) !important;}
#gnb .gnbWrap > ul > li > .sub-slide > ul > li:hover,
#gnb .gnbWrap > ul > li > .sub-slide > ul > li.on {background:rgb(255, 255, 255, 0.2) !important;}
#gnb .gnbWrap > ul > li > .sub-slide > ul > li.on a {color:#c00;}

/* mobileNavi
------------------------------------------------*/
.mobileNavi .twoDepth {background:#343538;}
.mobileNavi .twoDepth ul li.active {border-bottom:2px solid #c00;}
.mobileNavi .twoDepth ul li.active a {color:#c00;}

/* search
------------------------------------------------*/
.searchPop .search h2 {color:#c00;}

/* bodyBox - widgetBox
------------------------------------------------*/
.bodyBox .widgetBox .widget {background:#2c2d30;}
.bodyBox .widgetBox .widget .wheader {color:#c00; background:rgba(255, 255, 255, 0.04); border-bottom:0; border-radius:4px 4px 0 0;}
.bodyBox .containerWrap .contents.sub {background:#343538;}
.bodyBox .containerWrap .contents.sub .title strong {color:#fff;}

/* side_left
------------------------------------------------*/
.widget .menuBox ul > li > a {color:rgba(255, 255, 255, 0.4); }
.widget .menuBox ul > li > a.active,
.widget .menuBox ul > li > ul > li > a.on {color:#fff; background:rgba(255, 255, 255, 0.06); box-shadow:inset 0px 0px 0px 1px rgba(255, 255, 255, 0.04);}
.widget .menuBox ul > li > a[href^="#"].line {background:rgba(255, 255, 255, 0.1); color:rgba(255, 255, 255, 0.8);}
.widget .menuBox ul > li > a[href^="#"].line.active {background:#c00; color:#fff !important;}

/* footer
------------------------------------------------*/
.footer .linkInfoWrap {background:#2c2d30;}
.footer .linkInfoWrap .linkInfo div a {}
.footer .linkInfoWrap .linkInfo div a:hover {color:#c00;}

/********************************************************
 PAGE
********************************************************/
/* page
------------------------------------------------*/
.btn_admin.na-notice {font-weight:bold;}
.btn_admin {color:#fff !important; background:#c00 !important; border-color:#c00 !important;}
.btn_admin:hover {background:#c00 !important; border-color:#c00 !important; box-shadow:0 0 0 0.2rem rgb(204, 0, 0, 0.4);}
.page-content .article-title {color:#c00 !important;}

/* page contents */
#ctt_con {}
#ctt_con a,
#ctt_con b {color:#c00;}

/* Total search
------------------------------------------------*/
#sch_res_list .list-group .list-group-item .sch_word {background:#c00; color:#fff;}

/* popup
------------------------------------------------*/
/* common */
html.popup, body.popup {background:#343538 !important;}
body.popup #fa_icon .list-group-item a {color:rgba(255, 255, 255, 0.8) !important;}
body.popup #autosave_wrapper {background:#343538;}

/* member
------------------------------------------------*/
.custom-control-input:checked~.custom-control-label::before {border-color:#c00; background-color:#343538;}
.list-group-item {background:transparent; border:1px solid rgba(255, 255, 255, 0.1);}
#fregister .page-content .article-title {color:#fff !important;}
#fregister .custom-checkbox {color:rgba(255, 255, 255, 0.6);}
.register .list-group-item h5 {color:#c00;}

/********************************************************
 BOARD
********************************************************/
/* common  */
.border-bottom {border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;}

/* gallery */
#bo_gallery ul li .itemBox {background:rgba(0, 0, 0, 0.1) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important;}
#bo_gallery ul li .itemBox.active,
#bo_gallery ul li .itemBox:hover {border:2px solid #c00 !important; padding: 9px;}
#bo_gallery ul li .itemBox.active .na-title .na-subject {color:#c00; background-size:100% 100%;}
#bo_gallery ul li .itemBox .na-title {border-bottom: 1px dashed rgba(255, 255, 255, 0.2) !important;}
#bo_gallery ul li .itemBox .na-title .na-item a {color:rgba(255, 255, 255, 0.7);}
#bo_gallery ul li .itemBox .na-title .na-item a .text-primary {color:#c00 !important;}
#bo_gallery ul li .itemBox .na-title .na-item a:hover {color:#c00;}
#bo_gallery ul li .itemBox .na-title .na-subject {background-image:linear-gradient(transparent 80%, #c00 0%) !important;}
#bo_gallery ul li .itemBox:hover .na-title .na-subject {color:#c00 !important;}
#bo_gallery ul li .itemBox .infoBox .infoBoxitem {color:rgba(255, 255, 255, 0.4);}
#bo_gallery ul li .itemBox .infoBox .infoBoxitem .commentBox.default {background-color:rgba(0, 0, 0, 0.3) !important;}

/* list */
#bo_v_title {color:rgba(255, 255, 255, 0.9);}
#bo_list .na-table li:nth-child(odd) {background:rgba(0, 0, 0, 0.3) !important;}
#bo_list .na-table .border-bottom.bg-light {background-color:rgba(0, 0, 0, 0) !important; outline:2px solid #c00; outline-offset:-2px;}
#bo_list .na-table .border-bottom.notice {background-color:rgba(0, 0, 0, 0.6) !important; }
#bo_list .na-title .na-subject {color:rgba(255, 255, 255, 0.6); background-image:linear-gradient(transparent 80%, #c00 0%) !important;}
#bo_list .na-title .na-subject:hover {color:#c00 !important;}

@media all and (max-width:768px) {
	.responsive #bo_btn_top {border-top:1px solid rgba(255, 255, 255, 0.1) !important; border-bottom:1px solid rgba(255, 255, 255, 0.2) !important;}
}

/* page-link  */
.page-link {background-color:rgba(0, 0, 0, 0.1); border-color: rgba(255, 255, 255, 0.1); color:rgba(255, 255, 255, 0.6) !important;}
.page-link:hover {background-color:rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.1);}
.page-link:focus {box-shadow:0 0 0 0.2rem rgba(254, 229, 0, 0.2);}
.page-item.active .page-link {background:#c00; border-color:#c00; color:#ffffff !important;}
.page-item.disabled .page-link {background-color:rgba(0, 0, 0, 0.1); border-color: rgba(255, 255, 255, 0.1);}

/* write */
#bo_w .list-group-item h5 {color:#c00;}

/* view */
.viewBody .readHeader {border: 1px solid rgba(255, 255, 255, 0.1) !important;}
.viewBody .readHeader .rhUser {background-color:rgba(0, 0, 0, 0.1) !important; border-color:rgba(255, 255, 255, 0.1) !important; color:rgba(255, 255, 255, 0.6) !important;}
.viewBody .readHeader .rhInfo {color:rgba(255, 255, 255, 0.6) !important;}
#bo_v_con a {color:#c00;}

/* comment */
#fviewcomment .cmt-box .text-nowrap button:hover i {color:#c00 !important;}

.commentMedia {background:rgba(0, 0, 0, 0.1) !important; border-color:rgba(255, 255, 255, 0.1) !important; color:rgba(255, 255, 255, 0.6) !important;}
.commentMedia .media .media-body {background-color:rgba(0, 0, 0, 0.2) !important;}
.commentMedia .media .media-body .media-content {background-color:#333 !important; border-color:#444 !important; color:rgba(255, 255, 255, 0.8) !important;}
.commentMedia .media .media-body .media-content:before {background-color:#333 !important; border-left: 1px solid #444 !important; border-bottom:1px solid #444 !important;}
.commentMedia .media .media-body .media-heading time {color:#c00 !important;}
.commentMedia .media .media-body .tools {border-top: 1px dashed rgba(255, 255, 255, 0.1) !important;}
.commentMedia .media .media-body .tools ul li a {color:rgba(255, 255, 255, 0.6) !important; background:rgba(0, 0, 0, 0.1) !important; border-color:rgba(255, 255, 255, 0.1) !important;}
.commentMedia .media .media-body .tools ul li a:hover {color:#c00 !important;}
.commentMedia .media.my .media-body .media-content {color:#fff !important; border:1px solid #c00 !important;}
.commentMedia .media.my .media-body .media-content:before {border-left: 1px solid #c00 !important; border-bottom:1px solid #c00 !important;}
.commentMedia .media .media-body .media-content a {color:#c00 !important;}

/* admin menu */
.adminMenu .btn-group .btn-white {color:rgba(255, 255, 255, 0.6) !important; background-color:rgba(0, 0, 0, 0.1) !important; border-color: rgba(255, 255, 255, 0.1) !important;}
.adminMenu .btn-group .btn-white:hover {background:rgba(0, 0, 0, 0.3) !important;}

/********************************************************
 WIDGET
********************************************************/
/* widget-wswg_outlogin
------------------------------------------------*/
.wswg_outlogin .myMenu .myDetailmenu a {border:1px solid rgba(255, 255, 255, 0.1);}
.wswg_outlogin .myMenu .myDetailmenu a:hover {border:1px solid #c00;}
.wswg_outlogin .loginFormBox,
.wswg_outlogin .userBox {background:rgba(255, 255, 255, 0.1);}
.wswg_outlogin .loginFormBox .loginForm .inputBox input {color:rgba(255, 255, 255, 0.8);}
.wswg_outlogin .login-sns {background: rgba(0, 0, 0, 0.1); border:1px solid rgba(255, 255, 255, 0.1);}
.wswg_outlogin .userBox .user .info em {color:rgba(255, 255, 255, 0.6);}

/* widget-infinite-masonry
------------------------------------------------*/
.widget-infinite-masonry .itemWrap .item .itemBox {background:#2c2d30; border:2px solid #2c2d30;}
.widget-infinite-masonry .itemWrap .item .itemBox:hover {border:2px solid #c00 !important;}
.widget-infinite-masonry .itemWrap .item .itemBox:hover .ancher .subject {color:#c00;}
.widget-infinite-masonry .itemWrap .item .itemBox .ancher .subject {background:#1e1f21; color:rgba(255, 255, 255, 0.7);}
.widget-infinite-masonry .itemWrap .item .itemBox .ancher .thumb ~ .subject {color:#ddd;}
.widget-infinite-masonry .itemWrap .item .itemBox:hover a .thumb ~ .subject {color:#c00 !important; }
.widget-infinite-masonry .itemWrap .item .itemBox a .labelColor {background:#c00 !important; color:#fff !important;}
.widget-infinite-masonry .itemWrap .item .itemBox .itemInfo {border-top:1px solid rgba(255, 255, 255, 0.1);}
.widget-infinite-masonry .itemWrap .item .itemBox .itemInfo .infoBox .commentBox {background:#c00; color:#fff !important;}
.widget-infinite-masonry .itemWrap .item .itemBox .itemInfo .infoBox .commentBox i {color:#fff !important;}
.widget-infinite-masonry .itemWrap .item .itemBox .itemInfo .infoBox .dateBox .dateText {color: rgba(255, 255, 255, 0.6);}

/* nt_sidebar - mobile
------------------------------------------------*/
#nt_sidebar {background:#1e1f21;}
#nt_sidebar_menu .me-ul {background:transparent;}
#nt_sidebar_menu .me-ul li a {border-bottom:1px solid rgba(255, 255, 255, 0.1);}
#nt_sidebar .sidebar-content .widget {background:#2c2d30;}

/********************************************************
 add index
********************************************************/
.nt-container .sliderBox, .nt-container .blocks {background:#2c2d30;}
.nt-container .blocks h3 a {background:#343538; color:#c00;}
.nt-container .blocks .basic-banner .owl-nav button {border:1px solid #1e1f21 !important; background: #1e1f21 !important;}

/* adBox */
.adBox {background:#2c2d30;}