@charset "utf-8";

/* 로더 */
#loadings {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #ffffff;
    z-index: 999999;
}

#loading_api {
    position: absolute;
    width: 50px;
    height: 50px;
    border: 2px solid rgba(0, 0, 0, .1); /* 컬러 */
    border-radius: 50%;
    border-top-color: #3498DB; /* 컬러 */
    animation: spin 0.5s ease-in-out infinite;
    -webkit-animation: spin 0.5s ease-in-out infinite;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
    
/* 로더 애니메이션 */
@keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}
@-webkit-keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}

section {
    padding: 0px;
    position: relative;
    width: 100%;
    overflow: hidden;
    /*z-index: 1;*/
    background-color: #090f1e
}


/********************************************************
■ Theme Layout : 테마 레이아웃
********************************************************/
@media all and (min-width:992px) {
    .responsive .boxed-a.body-inner .container.px-xl-0 { padding-left:1.5rem !important; padding-right:1.5rem !important; }
    .responsive .boxed-b.body-inner { padding-left:1.5rem !important; padding-right:1.5rem !important; }
    .responsive .boxed-b.body-inner #nt_title .container.px-xl-0,
    .responsive .boxed-b.body-inner #nt_wing .container.px-xl-0 { padding-left:1.5rem !important; padding-right:1.5rem !important; }
}

/* 비반응형 */
.no-responsive .boxed-a.body-inner .container.px-xl-0 { padding-left:1.5rem !important; padding-right:1.5rem !important; }
.no-responsive .boxed-b.body-inner { padding-left:1.5rem !important; padding-right:1.5rem !important; }
.no-responsive .boxed-b.body-inner #nt_title .container.px-xl-0,
.no-responsive .boxed-b.body-inner #nt_wing .container.px-xl-0 { padding-left:1.5rem !important; padding-right:1.5rem !important; }
@media all and (max-width:1200px) {
    .no-responsive .body-inner.wided .container.px-xl-0 { padding-left:1.5rem !important; padding-right:1.5rem !important; }
    .no-responsive .body-inner.wided #nt_title .container.px-xl-0,
    .no-responsive .body-inner.wided #nt_wing .container.px-xl-0 { padding-left:1.5rem !important; padding-right:1.5rem !important; }
}






button.btn.btn-basic,
.btn:not(.close):not(.mfp-close).btn-basic,
a.btn:not([href]):not([tabindex]).btn-basic {
    background-color: #fff;
    border-color: #ddd;
    color: #fff;
}

button.btn.btn-basic:hover,
button.btn.btn-basic:focus,
button.btn.btn-basic:not(:disabled):not(.disabled):active,
button.btn.btn-basic:not(:disabled):not(.disabled).active,
.btn:not(.close):not(.mfp-close).btn-basic:hover,
.btn:not(.close):not(.mfp-close).btn-basic:focus,
.btn:not(.close):not(.mfp-close).btn-basic:not(:disabled):not(.disabled):active,
.btn:not(.close):not(.mfp-close).btn-basic:not(:disabled):not(.disabled).active,
a.btn:not([href]):not([tabindex]).btn-basic:hover,
a.btn:not([href]):not([tabindex]).btn-basic:focus,
a.btn:not([href]):not([tabindex]).btn-basic:not(:disabled):not(.disabled):active,
a.btn:not([href]):not([tabindex]).btn-basic:not(:disabled):not(.disabled).active {
    background-color: #f5f5f5;
    border-color: #ddd;
    color: #fff;
}




/* topbar */
#topbar.topbar-colored,
#topbar.topbar-colored.dark {
    background-color: #3498DB !important;
    color: #fff !important;
}


/* news-ticker */
.na-list .news_arrow{display:inline-block; border-left:9px solid #ea5859; border-top:5px solid transparent; border-bottom:5px solid transparent; height:0; width:0}
.na-list .news_arrow{border-left-color:#b92c28}
@media (max-width: 1024px) {
    .news-tickers {
        display: none
    }
}



/* widget_box */
.widget_box {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    border: 1px solid #e6e8eb;
    border-top: 2px solid #3498DB;
    background-color: #fff;
}
.widget_box h3.h3 { padding:10px 15px 8px 15px; margin:0; font-weight:bold; }
.widget_box hr.hrs::before { width:100%; height:2px; content: ""; position:absolute; left:0; bottom:0px; line-height:1px; background-color:#ddd; }
.widget_box hr.hrs { display:block; position:relative; height:2px; border: none; line-height:1px; padding:0;    margin:0; }
@media all and (max-width:575px) {
    .responsive .widget_box h3.h3 { padding-left:1.0rem; padding-right:1.0rem; }
}


/* 링크모음 카테고리 */
.category li {
  list-style:none;
  background: #fff;
  position: relative;
  cursor: pointer;
  font-size:18px;
  font-weight: 600;
  padding: 22px 5px;
  text-align: center;
  border:1px solid #e5e5e5;
  border-right:0;
  border-left:1px solid #e5e5e5;
  z-index: 3;
}
.category li:last-child {
  border-right: 1px solid #e5e5e5;
}

.category li.on {
  overflow: hidden;
  background: #ff0000;
  z-index: 2;
  color: #fff !important;
}

.category li.on a,
.category li.on a:hover,
.category li.on a:focus{
  color: #fff !important;
}

.category li a:hover,
.category li a:focus { color: #ff0000 !important; }

.category.post-wrap { overflow:hidden; }
.category.post-list { overflow:hidden; list-style:none; }
.category li { float:left; width:10%; }

@media (max-width:480px) {
    .category li { width:20%; font-size:14px; }
    .cbt-0   { border-bottom: 0 !important; }
    .cbr-1   { border-right: 1px solid #e5e5e5 !important; }
}


.links_more {
    position: relative;
    margin-bottom: 1rem !important;
    /*margin: 60px auto 0;*/
}

.links_more .links_menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.links_more .links_menu li {
    font-size: 16px;
    line-height: 16px;
    color: #333;
    text-decoration: none;
    font-weight: 300;
    width:9.0909%;
    text-align:center;
    padding: 20px 0px;
    border: 2px solid #fff;
    background: #f7f7f7;
    border-radius: 15px;
    font-weight: 600 !important;
}

.links_more .links_menu li.active,
.links_more .links_menu li:hover {
    background: #f26522;
    color: #fff;
}

.links_more .links_menu li.active a,
.links_more .links_menu li:hover a {
    color: #fff;
}

@media (max-width:480px) {
    .links_more .links_menu li.all {
        width:100%;
    }
    .links_more .links_menu li {
        font-size: 14px;
        width:20%;
        margin:5px 0;
    }
}



/* Tabs ------------------------------------------------------ */
.div-tab.tabs .nav-tabs {
    margin: 0;
}
.div-tab.tabs .tab-content {
    border-width: 0px 1px 1px;
    border-style: solid;
    border-color: rgb(221, 221, 221);
    /*padding: 15px;*/
}
.div-tab.tabs .tab-content {
    border-radius: 0;
    border-image: none;
    box-shadow: none;
    background-color: #fff;
    -webkit-box-shadow: 0;
    -moz-box-shadow: none;
    -moz-border-radius: none;
    -webkit-border-radius: 0;
}
.div-tab.tabs .nav-tabs .nav-link {
    background: rgb(247, 247, 247);
    border-image: none;
    color: #3498DB;
    margin-right: 0;
    border: 0;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-top: 2px solid rgb(221, 221, 221);
    border-left: 1px solid rgb(230, 230, 230);
    border-image: none;
    line-height:14px !important;
    border-bottom:1px solid rgb(221, 221, 221);

}
.div-tab.tabs .nav-tabs .nav-link:hover, .div-tab.tabs .nav-tabs  .nav-link:focus {
    border-top: 2px solid rgb(221, 221, 221);
    border-left: 1px solid rgb(230, 230, 230);
    border-image: none;
}
.div-tab.tabs .nav-tabs  .nav-link:first-child  {
    border-left:1px solid rgb(221, 221, 221);
    margin-left:0px;
}
.div-tab.tabs .nav-tabs .nav-link:last-child, .div-tab.tabs .nav-tabs  .nav-link:last-child:hover {
    border-right:0px solid rgb(221, 221, 221);
}
.div-tab.tabs .nav-tabs  .nav-link.active {
    background: #fff;
    border-top:2px solid #3498DB;
    border-bottom:0px solid transparent;
}

.div-tab .w-tab { border-right:1px solid #ddd; border-top:1px solid #ddd; }
.div-tab .w-tab .nav { margin-top:-1px !important; }
.div-tab .w-tab .nav li.active a { font-weight:bold; }
.div-tab .tabs { margin-bottom:20px !important; }
/*.div-tab .tab-content { padding:15px !important; }*/

@media (max-width:480px) {

    .nav-justified > .nav-link,
    .nav-justified .nav-item {
        width:50%;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        text-align: center;
    }

}



/* top_tabs */
#top_tabs.card a {
    -webkit-transition: all 150ms ease 0s;
    -moz-transition: all 150ms ease 0s;
    -o-transition: all 150ms ease 0s;
    -ms-transition: all 150ms ease 0s;
    transition: all 150ms ease 0s;
}

#top_tabs.card .nav-tabs {
    border-top-right-radius: 0.1875rem;
    border-top-left-radius: 0.1875rem;
}

#top_tabs .nav-tabs {
    border: 0;
    /*padding: 15px 0.7rem;*/
    padding-bottom:15px;
}

#top_tabs .nav-tabs > .nav-item > .nav-link {
    color: #888888;
    margin: 0;
    margin-right: 5px;
    background-color: transparent;
    border: 1px solid #e6e8eb;
    border-radius: 30px;
    font-size: 14px;
    padding: 11px 23px;
    line-height: 1.5;
}

#top_tabs .nav-tabs > .nav-item > .nav-link:hover {
    background-color: transparent;
}

#top_tabs .nav-tabs > .nav-item > .nav-link.active {
    background-color: #3498DB;
    border-radius: 30px;
    color: #FFFFFF;
}

#top_tabs .nav-tabs > .nav-item > .nav-link i.now-ui-icons {
    font-size: 14px;
    position: relative;
    top: 1px;
    margin-right: 3px;
}

#top_tabs .nav-item .nav-link,
#top_tabs .nav-tabs .nav-link {
    -webkit-transition: all 300ms ease 0s;
    -moz-transition: all 300ms ease 0s;
    -o-transition: all 300ms ease 0s;
    -ms-transition: all 300ms ease 0s;
    transition: all 300ms ease 0s;
}

@media screen and (max-width: 768px) {

    #top_tabs .nav-tabs {
        display: inline-block;
        width: 100%;
        padding-left: 100px;
        padding-right: 100px;
        text-align: center;
    }

    #top_tabs .nav-tabs .nav-item > .nav-link {
        margin-bottom: 5px;
    }
}








/* top_tabs2 */
#top_tabs2.card a {
    -webkit-transition: all 150ms ease 0s;
    -moz-transition: all 150ms ease 0s;
    -o-transition: all 150ms ease 0s;
    -ms-transition: all 150ms ease 0s;
    transition: all 150ms ease 0s;
}

#top_tabs2.card .nav-tabs {
    border-top-right-radius: 0.1875rem;
    border-top-left-radius: 0.1875rem;
}

#top_tabs2 .nav-tabs {
    border: 0;
    padding: 15px 0.7rem;
}

#top_tabs2 .nav-tabs > .nav-item > .nav-link {
    color: #888888;
    margin: 0;
    margin-right: 5px;
    background-color: transparent;
    border: 1px solid #e6e8eb;
    border-radius: 30px;
    font-size: 14px;
    padding: 11px 23px;
    line-height: 1.5;
}

#top_tabs2 .nav-tabs > .nav-item > .nav-link:hover {
    background-color: transparent;
}

#top_tabs2 .nav-tabs > .nav-item > .nav-link.active {
    background-color: #3498DB;
    border-radius: 30px;
    color: #FFFFFF;
}

#top_tabs2 .nav-tabs > .nav-item > .nav-link i.now-ui-icons {
    font-size: 14px;
    position: relative;
    top: 1px;
    margin-right: 3px;
}

#top_tabs2 .nav-item .nav-link,
#top_tabs2 .nav-tabs .nav-link {
    -webkit-transition: all 300ms ease 0s;
    -moz-transition: all 300ms ease 0s;
    -o-transition: all 300ms ease 0s;
    -ms-transition: all 300ms ease 0s;
    transition: all 300ms ease 0s;
}




#top_tabs2 .nav-tabs:not(.nav-tabs-neutral)>.nav-item>.nav-link.active {
    box-shadow: 0px 5px 35px 0px rgba(0, 0, 0, 0.3);
}
#top_tabs2 .nav-tabs.nav-tabs-neutral>.nav-item>.nav-link {
    color: #FFFFFF;
}

#top_tabs2 .nav-tabs.nav-tabs-neutral>.nav-item>.nav-link.active {
    background-color: rgba(255, 255, 255, 0.2);
    color: #FFFFFF;
}




#top_tabs2.card .card-header {
    background-color: transparent;
    border-bottom: 0;
    background-color: transparent;
    border-radius: 0;
    padding: 0;
}

#top_tabs2.card[data-background-color="orange"] {
    background-color: #f96332;
}

#top_tabs2.card[data-background-color="red"] {
    background-color: #FF3636;
}

#top_tabs2.card[data-background-color="yellow"] {
    background-color: #FFB236;
}

#top_tabs2.card[data-background-color="blue"] {
    background-color: #2CA8FF;
}

#top_tabs2.card[data-background-color="green"] {
    background-color: #15b60d;
}

#top_tabs2 [data-background-color="orange"] {
    background-color: #e95e38;
}

#top_tabs2 [data-background-color="red"] {
    background-color: rgb(233, 27, 35);
}

#top_tabs2 [data-background-color="yellow"] {
    background-color: rgb(241, 196, 15);
}

#top_tabs2 [data-background-color="blue"] {
    background-color: #3498DB;
}

#top_tabs2 [data-background-color="green"] {
    background-color: rgb(140, 195, 70);
}

#top_tabs2 [data-background-color="black"] {
    background-color: #2c2c2c;
}

#top_tabs2 [data-background-color]:not([data-background-color="gray"]) {
    color: #FFFFFF;
}

#top_tabs2 [data-background-color]:not([data-background-color="gray"]) p {
    color: #FFFFFF;
}

@media screen and (max-width: 768px) {

    #top_tabs2 .nav-tabs {
        display: inline-block;
        width: 100%;
        padding-left: 100px;
        padding-right: 100px;
        text-align: center;
    }

    #top_tabs2 .nav-tabs .nav-item > .nav-link {
        margin-bottom: 5px;
    }
}






/********************************************************
■ MAIN MENU
********************************************************/
#mainMenu nav>ul>li>a {
    font-size:18px !important;
    line-height:1.5 !important;
    font-family: 'Nanum Gothic', sans-serif !important;
    font-weight: 400 !important;
}

#mainMenu nav>ul>li .dropdown-menu>li>a,
#mainMenu nav>ul>li .dropdown-menu>li>span,
#mainMenu nav>ul>li .dropdown-menu>li [class*="col-"]>ul>li>a {
    font-size:14px !important;
    font-family: 'Nanum Gothic', sans-serif !important;
    font-weight: bold;
    line-height:1.8;
}



/********************************************************
■ Footer 
********************************************************/
#footer .nt-links ul { list-style: none; margin: 0; padding:0; }
#footer .nt-links ul > li { float: left; padding: 0 13px; }
#footer ul > li:first-child { padding-left:0; }
#footer ul > li:last-child { padding-right:0; }
#footer .nt-links ul > li::after { font-family: dotum; font-weight: normal; float: right; color:#ccc; content: "|"; margin-right:-15px; }
#footer .nt-links ul > li:last-child::after { content: ""; }
#footer .nt-links ul > li > a { color: #333; white-space:nowrap;    }
@media all and (max-width:991px) {
    .responsive #footer .nt-links ul > li { float:none; display:inline-block; }
}





.divider-text-center {
    text-align: center;
    position: relative;
}

.divider-text-center::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    right: 0;
    border-top: 1px solid #ddd;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.divider-text-center span {
    background-color: #fff;
    padding: 0 15px;
    position: relative;
    text-transform: uppercase;
}










/*
 *
 * login-register modal
 * Autor: Creative Tim
 * Web-autor: creative.tim
 * Web script: http://creative-tim.com
 * 
 */
 
/*  Shake animation  */

@-webkit-keyframes shake {
    0%, 100% {-webkit-transform: translateX(0);}
    10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);}
    20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);}
}

@-moz-keyframes shake {
    0%, 100% {-moz-transform: translateX(0);}
    10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);}
    20%, 40%, 60%, 80% {-moz-transform: translateX(10px);}
}

@-o-keyframes shake {
    0%, 100% {-o-transform: translateX(0);}
    10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);}
    20%, 40%, 60%, 80% {-o-transform: translateX(10px);}
}

@keyframes shake {
    0%, 100% {transform: translateX(0);}
    10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}
    20%, 40%, 60%, 80% {transform: translateX(10px);}
}

.shake {
    -webkit-animation-name: shake;
    -moz-animation-name: shake;
    -o-animation-name: shake;
    animation-name: shake;
}

.login .modal-dialog{
    width: 350px;
}
.login .modal-footer{
    border-top: 0;
    margin-top: 0px;
    padding: 10px 20px 20px;
}
.login .modal-header {
    border: 0 none;
    padding: 15px 15px 15px;
/*     padding: 11px 15px; */
}
.login .modal-body{
/*     background-color: #eeeeee; */
}
.login .forgot {
    color: #797979;
    margin-left: 0;
    overflow: hidden;
    text-align: center;
    width: 100%;
}
.login .btn-login, .registerBox .btn-register{
    background-color: #00BBFF;
    border-color: #00BBFF;
    border-width: 0;
    color: #FFFFFF;
    display: block;
    margin: 0 auto;
    /*padding: 15px 50px;*/
    text-transform: uppercase;
    width: 100%;
}
.login .btn-login:hover, .registerBox .btn-register:hover{
    background-color: #00A4E4;
    color: #FFFFFF;
}
.login .btn-login, .passwordlostBox .btn-passwordlost{
    background-color: #ff0000;
    border-color: #ff0000;
    border-width: 0;
    color: #FFFFFF;
    display: block;
    margin: 0 auto;
    /*padding: 15px 50px;*/
    text-transform: uppercase;
    width: 100%;
}
.login .btn-login:hover, .passwordlostBox .btn-passwordlost:hover{
    background-color: #ff0000;
    color: #FFFFFF;
}
/*
.login .form-control{
    border-radius: 3px;
    background-color: rgba(0, 0, 0, 0.09);
    box-shadow: 0 1px 0px 0px rgba(0, 0, 0, 0.09) inset;
    color: #FFFFFF;
}
.login .form-control:hover{
    background-color: rgba(0,0,0,.16);
}
.login .form-control:focus{
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.04) inset;
    background-color: rgba(0,0,0,0.23);
    color: #FFFFFF;
}
.login .box .form input[type="text"], .login .box .form input[type="password"] {
    border-radius: 3px;
    border: none;
    color: #333333;
    font-size: 16px;
    height: 46px;
    margin-bottom: 5px;
    padding: 13px 12px;
    width: 100%;
}
*/



.login .form-control {
    height: 48px;
    padding-left: 18px;
    font-size: 14px;
    background: transparent;
}

.login .form-control:focus {
    outline: 0;
    box-shadow: none;
}

.login .form-control::placeholder {
    font-weight: 300;
    color: #999999;
}

.login .form-control::placeholder {
    color: #777777;
}

@media (max-width:400px){
    .login .modal-dialog{
        width: 100%;
    }
}

.big-login, .big-register{
    background-color: #00bbff;
    color: #FFFFFF;
    border-radius: 7px;
    border-width: 2px;
    font-size: 14px;
    font-style: normal;
    font-weight: 200;
    padding: 16px 60px;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
}
.big-login:hover{
    background-color: #00A4E4;
    color: #FFFFFF;
}
.big-register{
    background-color: rgba(0,0,0,.0);
    color: #00bbff;
    border-color: #00bbff;
}
.big-register:hover{
    border-color: #00A4E4;
    color:  #00A4E4;
}


/*Login*/
.login_wrap {width:100%; margin: 0 auto; padding-top: 100px; padding-bottom: 100px;}
.login_wrap_inner {padding: 50px; box-sizing: border-box; border-radius:6px; margin: 0 auto; background: #1a2338;}
.login_inp {width: 100%; height:50px; font-size: 14px; color:#000; font-weight: 600 !important; padding-left:10px; border:0px; border-bottom: 2px solid #eee; transition: all 350ms cubic-bezier(0.645, 0.045, 0.355, 1); }
.login_inp:focus {border-bottom: 2px solid #000;}
.login_wrap input:focus {outline: none !important;}
.login_wrap textarea:focus {outline: none !important;}
.login_wrap button:focus {outline: none !important;}
.login_wrap_inner ul {width: 100%;}
.login_ci {color:#fff;margin-bottom: 30px; text-align: center;}
.login_ci img {height: 60px;margin-bottom:20px; }
.login_ul {margin-bottom: 10px; position: relative;}
.login_r_ico {position: absolute; top:13px; right: 10px; color:#999;}
.login_ul_chk {margin-top: 15px;}
.login_submit_btn {background-color: #3498DB; color:#fff; font-size: 14px; text-align: center; height:50px; width: 100%; border:0px; border-radius: 4px;}
.login_a_link a {color:#fff; padding-left: 15px; margin-left: 15px; border-left: 2px solid #34405e;}
.login_a_link a:first-child {border:0px; padding: 0px; margin: 0px;}
.login_ul_chk .frm_label {display: none;}
.login_ul_chk .sns-wrap {text-align: left;}
.line_or {position: relative;display: block;width: 100%;padding: 30px 0;font-size: 0;line-height: 0;}
.line_or:before, .line_or:after {display: inline-block;width: calc(50% - 20px);height: 1px;margin: 8px 0;background-color: rgba(0,0,0,0.06);vertical-align: top;content: '';}
.line_or .txt_or {display: inline-block;width: 40px;font-size: 12px;line-height: 18px;text-align: center;color: rgba(0,0,0,0.3);}
.login_ul .required {background-position: right center !important;}
.box_tit { color:#fff; }
.login_tit {font-size: 20px;}
.login_sub_txt {color:#888; font-size: 14px; margin-top: 10px; line-height: 150%; word-break: keep-all;}
.reg_on_bt { background-color:#006cff !important; }
.reg_off_bt { color:#fff; background-color:#1d273e !important; }
.center_btn_divs_box a { color:#fff !important; }
.box-inp { border-radius: 6px !important;border-bottom: 0px solid #eee !important; background:#090f1e; }
.modal-title { color:#fff; }

/* modal login */
.modal_login_wrap {width:100%; margin: 0 auto; padding-top: 0px; padding-bottom: 0px;}
.modal_login_wrap_inner {padding: 25px; box-sizing: border-box; border:0px solid #ddd; margin: 0 auto;}
.modal_login_inp {width: 100%; height:50px; font-size: 14px; color:#000; font-weight: 600 !important; padding-left:10px; border-radius:6px; border:0px; border-bottom: 2px solid #eee; transition: all 350ms cubic-bezier(0.645, 0.045, 0.355, 1); }
.modal_login_inp:focus {border-bottom: 2px solid #000;}
.modal_login_wrap input:focus {outline: none !important;}
.modal_login_wrap textarea:focus {outline: none !important;}
.modal_login_wrap button:focus {outline: none !important;}
.modal_login_wrap_inner ul {width: 100%;}
.modal_login_ci {margin-bottom: 30px; text-align: center;}
.modal_login_ci img {height: 60px;}
.modal_login_ul {margin-bottom: 10px; position: relative;}
.modal_login_r_ico {position: absolute; top:13px; right: 10px; color:#999;}
.modal_login_ul_chk {text-align: left; margin-top: 15px;}
.modal_login_submit_btn {background-color: #3498DB; color:#fff; font-size: 14px; text-align: center; height:50px; width: 100%; border:0px; border-radius: 4px;}
.modal_login_a_link a {color:#fff;padding-left: 15px; margin-left: 15px; border-left: 2px solid #1c263c;}
.modal_login_a_link a:first-child {border:0px; padding: 0px; margin: 0px;}
.modal_login_ul_chk .frm_label {display: none;}
.modal_login_ul_chk .sns-wrap {text-align: left;}
.modal_login_ul .required {background-position: right center !important;}
.modal-header .close { color:#fff; }


/* magic-check */
@keyframes hover-color {
    from {
        background-color: #fff;
    }

    to {
        background-color: #fff;
    }
}

.magic-radio,
.magic-checkbox {
    position: absolute;
    display: none;
}

.magic-radio[disabled],
.magic-checkbox[disabled] {
    cursor: not-allowed;
}

.magic-radio + label {
    position: relative;
    padding-left: 30px;
    margin-right: 0px;
    cursor: pointer;
    vertical-align: middle;
}

.magic-checkbox + label {
    position: relative;
    color: #fff;
    padding-left: 30px;
    padding-top: 5px;
    margin-right: 0px;
    cursor: pointer;
    vertical-align: middle;
}


.magic-radio + label:hover:before,
.magic-checkbox + label:hover:before {
    animation-duration: 0.4s;
    animation-fill-mode: both;
    animation-name: hover-color;
}

.magic-radio + label:before {
    position: absolute;
    top: -3px;
    left: 0;
    display: inline-block;
    width: 22px;
    height: 22px;
    content: '';
    border: 1px solid #ddd;
    background-color: #fff;
}

.magic-checkbox + label:before {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 25px;
    height: 25px;
    content: '';
    border: 1px solid #ddd;
    background-color: #fff;
}


.magic-radio + label:after,
.magic-checkbox + label:after {
    position: absolute;
    display: none;
    content: '';
}

.magic-radio[disabled] + label,
.magic-checkbox[disabled] + label {
    cursor: not-allowed;
    color: #3498DB;
}

.magic-radio[disabled] + label:hover,
.magic-radio[disabled] + label:before,
.magic-radio[disabled] + label:after,
.magic-checkbox[disabled] + label:hover,
.magic-checkbox[disabled] + label:before,
.magic-checkbox[disabled] + label:after {
    cursor: not-allowed;
}

.magic-radio[disabled] + label:hover:before,
.magic-checkbox[disabled] + label:hover:before {
    animation-name: none;
}

.magic-radio[disabled] + label:before,
.magic-checkbox[disabled] + label:before {
    border-color: #eee;
}

.magic-radio:checked + label:before,
.magic-checkbox:checked + label:before {
    animation-name: none;
}

.magic-radio:checked + label:after,
.magic-checkbox:checked + label:after {
    display: block;
}

.magic-radio + label:before {
    border-radius: 50%;
    border: 1px solid #ddd;
}

.magic-radio + label:after {
    top: 3px;
    left: 6px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #3498DB;
}

.magic-radio:checked + label:before {
    border: 1px solid #ddd;
}

.magic-radio:checked[disabled] + label:before {
    border: 1px solid #eee;
}

.magic-radio:checked[disabled] + label:after {
    border: 1px solid #eee;
    color:#3498DB;
}

.magic-checkbox + label:before {
    border-radius: 3px;
    border:1px solid #ddd;
}

.magic-checkbox + label:after {
    top: 6px;
    left: 9px;
    box-sizing: border-box;
    width: 6px;
    height: 9px;
    transform: rotate(45deg);
    border-width: 2px;
    border-style: solid;
    border-color: #3498DB;
    border-top: 0;
    border-left: 0;
}


.magic-checkbox:checked + label:before {
    background: #fff;
    border: 1px solid #ddd;
}

.magic-radio:checked + label:before {
    border: 1px solid #ddd;
    background: #fff;
}


.magic-checkbox:checked[disabled] + label:before {
    border: 1px solid #ddd;
    background: #fff;
}



    .img-fluid,
    .modal-dialog.cascading-modal.modal-avatar .modal-header,
    .video-fluid {
        max-width: 100%;
        height: auto
    }

    .flex-center {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        height: 100%
    }

    .flex-center p {
        margin: 0
    }

    .flex-center ul {
        text-align: center
    }

    .flex-center ul li {
        margin-bottom: 1rem
    }

    .flex-center ul li:last-of-type {
         margin-bottom: 0
    }

    .waves-effect{
        position:relative;
        overflow:hidden;
        cursor:pointer;
        -webkit-user-select:none;
        -moz-user-select:none;
        -ms-user-select:none;
        user-select:none;
        -webkit-tap-highlight-color:transparent
    }


/* modal */
 body.modal-open {
     padding-right: 0 !important;
     overflow: auto
 }

 body.modal-open .fixed-top {
     padding-right: 1rem !important
 }

 body.modal-open .fixed-bottom {
     padding-right: 0 !important
 }

 body.scrollable {
     overflow-y: auto
 }

 .modal-dialog .modal-content {
     border: 0;
     border-radius: 6px;
     background: #131a2c;
     -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
     box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15)
 }

 .modal-dialog .modal-content .modal-header {
     border-top-left-radius: .125rem;
     border-top-right-radius: .125rem;
     border-bottom: 1px solid #1c263c;
 }

 .modal-dialog.cascading-modal {
     margin-top: 10%
 }

 .modal-dialog.cascading-modal .close {
     color: #fff;
     text-shadow: none;
     outline: 0;
     opacity: 1
 }

 .modal-dialog.cascading-modal .modal-header {
     padding: 1.5rem;
     margin: -2rem 1rem 1rem 1rem;
     text-align: center;
     border: 0;
     border-radius: .125rem;
     -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
     box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15)
 }

 .modal-dialog.cascading-modal .modal-header .close {
     margin-right: 1rem
 }

 .modal-dialog.cascading-modal .modal-header .title {
     width: 100%;
     margin-bottom: 0;
     font-size: 1.25rem
 }

 .modal-dialog.cascading-modal .modal-header .title .fas,
 .modal-dialog.cascading-modal .modal-header .title .fab,
 .modal-dialog.cascading-modal .modal-header .title .far {
     margin-right: 9px
 }

 .modal-dialog.cascading-modal .modal-header .social-buttons {
     margin-top: 1.5rem
 }

 .modal-dialog.cascading-modal .modal-header .social-buttons a {
     font-size: 1rem
 }

 .modal-dialog.cascading-modal .modal-c-tabs .md-tabs {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     margin: -1.5rem 1rem 0 1rem;
     -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
     box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
 }

 .modal-dialog.cascading-modal .modal-c-tabs .md-tabs li {
     -webkit-box-flex: 1;
     -ms-flex: 1;
     flex: 1
 }

 .modal-dialog.cascading-modal .modal-c-tabs .md-tabs li a {
     text-align: center
 }

 .modal-dialog.cascading-modal .modal-c-tabs .tab-content {
     padding: 1.7rem 0 0 0
 }

 .modal-dialog.cascading-modal .modal-body,
 .modal-dialog.cascading-modal .modal-footer {
     padding-right: 2rem;
     padding-left: 2rem;
     color: #616161
 }

 .modal-dialog.cascading-modal .modal-body .additional-option,
 .modal-dialog.cascading-modal .modal-footer .additional-option {
     margin-top: 1rem;
     text-align: center
 }

 .modal-dialog.cascading-modal.modal-avatar {
     margin-top: 6rem
 }

 .modal-dialog.cascading-modal.modal-avatar .modal-header {
     margin: -6rem 0 -1rem;
     -webkit-box-shadow: none;
     box-shadow: none
 }

 .modal-dialog.cascading-modal.modal-avatar .modal-header img {
     width: 130px;
     margin-right: auto;
     margin-left: auto;
     -webkit-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
     box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
 }

 .modal-dialog.modal-notify .heading {
     padding: .3rem;
     margin: 0;
     font-size: 1.15rem;
     color: #fff
 }

 .modal-dialog.modal-notify .modal-header {
     border: 0;
     -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
     box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
 }

 .modal-dialog.modal-notify .close {
     opacity: 1
 }

 .modal-dialog.modal-notify .modal-body {
     padding: 1.5rem;
     color: #616161
 }

 .modal-dialog.modal-notify.modal-primary .modal-header {
     background-color: #4285f4
 }

 .modal-dialog.modal-notify.modal-primary .fas,
 .modal-dialog.modal-notify.modal-primary .fab,
 .modal-dialog.modal-notify.modal-primary .far {
     color: #4285f4
 }

 .modal-dialog.modal-notify.modal-primary .badge {
     background-color: #4285f4
 }

 .modal-dialog.modal-notify.modal-primary .btn .fas,
 .modal-dialog.modal-notify.modal-primary .btn .fab,
 .modal-dialog.modal-notify.modal-primary .btn .far {
     color: #fff
 }

 .modal-dialog.modal-notify.modal-primary .btn.btn-outline-primary .fas,
 .modal-dialog.modal-notify.modal-primary .btn.btn-outline-primary .fab,
 .modal-dialog.modal-notify.modal-primary .btn.btn-outline-primary .far {
     color: #4285f4
 }

 .modal-dialog.modal-notify.modal-danger .modal-header {
     background-color: #ff3547
 }

 .modal-dialog.modal-notify.modal-danger .fas,
 .modal-dialog.modal-notify.modal-danger .fab,
 .modal-dialog.modal-notify.modal-danger .far {
     color: #ff3547
 }

 .modal-dialog.modal-notify.modal-danger .badge {
     background-color: #ff3547
 }

 .modal-dialog.modal-notify.modal-danger .btn .fas,
 .modal-dialog.modal-notify.modal-danger .btn .fab,
 .modal-dialog.modal-notify.modal-danger .btn .far {
     color: #fff
 }

 .modal-dialog.modal-notify.modal-danger .btn.btn-outline-danger .fas,
 .modal-dialog.modal-notify.modal-danger .btn.btn-outline-danger .fab,
 .modal-dialog.modal-notify.modal-danger .btn.btn-outline-danger .far {
     color: #ff3547
 }

 .modal-dialog.modal-notify.modal-warning .modal-header {
     background-color: #fb3
 }

 .modal-dialog.modal-notify.modal-warning .fas,
 .modal-dialog.modal-notify.modal-warning .fab,
 .modal-dialog.modal-notify.modal-warning .far {
     color: #fb3
 }

 .modal-dialog.modal-notify.modal-warning .badge {
     background-color: #fb3
 }

 .modal-dialog.modal-notify.modal-warning .btn .fas,
 .modal-dialog.modal-notify.modal-warning .btn .fab,
 .modal-dialog.modal-notify.modal-warning .btn .far {
     color: #fff
 }

 .modal-dialog.modal-notify.modal-warning .btn.btn-outline-warning .fas,
 .modal-dialog.modal-notify.modal-warning .btn.btn-outline-warning .fab,
 .modal-dialog.modal-notify.modal-warning .btn.btn-outline-warning .far {
     color: #fb3
 }

 .modal-dialog.modal-notify.modal-success .modal-header {
     background-color: #00c851
 }

 .modal-dialog.modal-notify.modal-success .fas,
 .modal-dialog.modal-notify.modal-success .fab,
 .modal-dialog.modal-notify.modal-success .far {
     color: #00c851
 }

 .modal-dialog.modal-notify.modal-success .badge {
     background-color: #00c851
 }

 .modal-dialog.modal-notify.modal-success .btn .fas,
 .modal-dialog.modal-notify.modal-success .btn .fab,
 .modal-dialog.modal-notify.modal-success .btn .far {
     color: #fff
 }

 .modal-dialog.modal-notify.modal-success .btn.btn-outline-success .fas,
 .modal-dialog.modal-notify.modal-success .btn.btn-outline-success .fab,
 .modal-dialog.modal-notify.modal-success .btn.btn-outline-success .far {
     color: #00c851
 }

 .modal-dialog.modal-notify.modal-info .modal-header {
     background-color: #33b5e5
 }

 .modal-dialog.modal-notify.modal-info .fas,
 .modal-dialog.modal-notify.modal-info .fab,
 .modal-dialog.modal-notify.modal-info .far {
     color: #33b5e5
 }

 .modal-dialog.modal-notify.modal-info .badge {
     background-color: #33b5e5
 }

 .modal-dialog.modal-notify.modal-info .btn .fas,
 .modal-dialog.modal-notify.modal-info .btn .fab,
 .modal-dialog.modal-notify.modal-info .btn .far {
     color: #fff
 }

 .modal-dialog.modal-notify.modal-info .btn.btn-outline-info .fas,
 .modal-dialog.modal-notify.modal-info .btn.btn-outline-info .fab,
 .modal-dialog.modal-notify.modal-info .btn.btn-outline-info .far {
     color: #33b5e5
 }

 .modal {
     padding-right: 0 !important
 }

 .modal.modal-scrolling {
     height: -webkit-min-content;
     height: -moz-min-content;
     height: min-content
 }

 @media(min-width:768px) {
     .modal .modal-dialog.modal-top {
         top: 0
     }

     .modal .modal-dialog.modal-left {
         left: 0
     }

     .modal .modal-dialog.modal-right {
         right: 0
     }

     .modal .modal-dialog.modal-bottom {
         bottom: 0
     }

     .modal .modal-dialog.modal-top-left {
         top: 10px;
         left: 10px
     }

     .modal .modal-dialog.modal-top-right {
         top: 10px;
         right: 10px
     }

     .modal .modal-dialog.modal-bottom-left {
         bottom: 10px;
         left: 10px
     }

     .modal .modal-dialog.modal-bottom-right {
         right: 10px;
         bottom: 10px
     }
 }

 .modal.fade.top:not(.show) .modal-dialog {
     -webkit-transform: translate3d(0, -25%, 0);
     transform: translate3d(0, -25%, 0)
 }

 .modal.fade.left:not(.show) .modal-dialog {
     -webkit-transform: translate3d(-25%, 0, 0);
     transform: translate3d(-25%, 0, 0)
 }

 .modal.fade.right:not(.show) .modal-dialog {
     -webkit-transform: translate3d(25%, 0, 0);
     transform: translate3d(25%, 0, 0)
 }

 .modal.fade.bottom:not(.show) .modal-dialog {
     -webkit-transform: translate3d(0, 25%, 0);
     transform: translate3d(0, 25%, 0)
 }

 @media(min-width:992px) {
     .modal.modal-scrolling {
         position: relative
     }

     .modal.modal-scrolling .modal-dialog {
         position: fixed;
         z-index: 1050
     }

     .modal.modal-content-clickable {
         top: auto;
         bottom: auto
     }

     .modal.modal-content-clickable .modal-dialog {
         position: fixed
     }

     .modal .modal-fluid {
         width: 100%;
         max-width: 100%
     }

     .modal .modal-fluid .modal-content {
         width: 100%
     }

     .modal .modal-frame {
         position: absolute;
         width: 100%;
         max-width: 100% !important;
         margin: 0 !important
     }

     .modal .modal-frame.modal-bottom {
         bottom: 0
     }

     .modal .modal-full-height {
         position: absolute;
         top: 0;
         right: 0;
         display: -webkit-box;
         display: -ms-flexbox;
         display: flex;
         width: 400px;
         height: auto;
         min-height: 100%;
         margin: 0
     }

     .modal .modal-full-height.modal-top,
     .modal .modal-full-height.modal-bottom {
         display: block;
         width: 100%;
         max-width: 100%;
         height: auto
     }

     .modal .modal-full-height.modal-top {
         bottom: auto
     }

     .modal .modal-full-height.modal-bottom {
         top: auto;
         min-height: 0
     }

     .modal .modal-full-height .modal-content {
         width: 100%
     }

     .modal .modal-full-height.modal-lg {
         width: 90%;
         max-width: 90%
     }
 }

 @media(min-width:992px) and (min-width:992px) {
     .modal .modal-full-height.modal-lg {
         width: 800px;
         max-width: 800px
     }
 }

 @media(min-width:992px) and (min-width:1200px) {
     .modal .modal-full-height.modal-lg {
         width: 1000px;
         max-width: 1000px
     }
 }

 @media(min-width:992px) {
     .modal .modal-side {
         position: absolute;
         right: 10px;
         bottom: 10px;
         width: 400px;
         margin: 0
     }
 }


/* bootstrap3 */
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}

/* Button ------------------------------------------------------ */
.btn.btn-color {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(213, 7, 15);  
    background-color: rgb(233, 27, 35); 
}
.btn.active.btn-color, .btn.btn-color:hover, .btn.btn-color:focus, .btn.btn-color:active { 
    background-color: rgb(213, 7, 15); 
}
.btn.btn-dark { 
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid #000; 
    background-color: #333; 
}
.btn.active.btn-dark, .btn.btn-dark:hover, .btn.btn-dark:focus, .btn.btn-dark:active { 
    border-color: rgb(213, 7, 15); 
    background-color: rgb(213, 7, 15); 
}
.btn.btn-black { 
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid #111; 
    background-color: #333; 
}
.btn.active.btn-black, .btn.btn-black:hover, .btn.btn-black:focus, .btn.btn-black:active { 
    background-color: #111; 
}
.btn.btn-white { 
    color: #333 !important; border-image: none !important; background-image: none !important;
    border: 1px solid #ddd; 
    background-color: #fff; 
}
.btn.active.btn-white, .btn.btn-white:hover, .btn.btn-white:focus, .btn.btn-white:active { 
    background-color: #f5f5f5; 
}
.btn.btn-gray { 
    color: #333 !important; border-image: none !important; background-image: none !important;
    border: 1px solid #ccc; 
    background-color: #eee; 
}
.btn.active.btn-gray, .btn.btn-gray:hover, .btn.btn-gray:focus, .btn.btn-gray:active { 
    background-color: #f5f5f5; 
}
.btn.btn-lightgray { 
    color: #333 !important; border-image: none !important; background-image: none !important;
    border: 1px solid #ddd; 
    background-color: #fafafa; 
}
.btn.active.btn-lightgray, .btn.btn-lightgray:hover, .btn.btn-lightgray:focus, .btn.btn-lightgray:active { 
    background-color: #efefef; 
}
.btn.btn-darkgray { 
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid #444; 
    background-color: #666; 
}
.btn.active.btn-darkgray, .btn.btn-darkgray:hover, .btn.btn-darkgray:focus, .btn.btn-darkgray:active { 
    background-color: #444; 
}
.btn.btn-red {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(213, 7, 15);  
    background-color: rgb(233, 27, 35); 
}
.btn.active.btn-red, .btn.btn-red:hover, .btn.btn-red:focus, .btn.btn-red:active { 
    background-color: rgb(213, 7, 15); 
}
.btn.btn-darkred {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(150, 25, 30);  
    background-color: rgb(170, 60, 63); 
}
.btn.active.btn-darkred, .btn.btn-darkred:hover, .btn.btn-darkred:focus, .btn.btn-darkred:active { 
    background-color: rgb(150, 25, 30); 
}
.btn.btn-crimson {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(190, 20, 50);  
    background-color: rgb(220, 20, 60); 
}
.btn.active.btn-crimson, .btn.btn-crimson:hover, .btn.btn-crimson:focus, .btn.btn-crimson:active { 
    background-color: rgb(190, 20, 50); 
}
.btn.btn-orangered {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(240, 0, 0);  
    background-color: orangered; 
}
.btn.active.btn-orangered, .btn.btn-orangered:hover, .btn.btn-orangered:focus, .btn.btn-orangered:active { 
    background-color: rgb(240, 0, 0); 
}
.btn.btn-orange {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(240, 130, 0);  
    background-color: rgb(240, 150, 20); 
}
.btn.active.btn-orange, .btn.btn-orange:hover, .btn.btn-orange:focus, .btn.btn-orange:active { 
    background-color: rgb(240, 130, 0); 
}
.btn.btn-green {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(110, 180, 20);  
    background-color: rgb(140, 195, 70); 
}
.btn.active.btn-green, .btn.btn-green:hover, .btn.btn-green:focus, .btn.btn-green:active { 
    background-color: rgb(110, 180, 20); 
}
.btn.btn-lightgreen {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(130, 190, 60);  
    background-color: rgb(160, 200, 80); 
}
.btn.active.btn-lightgreen, .btn.btn-lightgreen:hover, .btn.btn-lightgreen:focus, .btn.btn-lightgreen:active { 
    background-color: rgb(130, 190, 60); 
}
.btn.btn-deepblue {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(0, 110, 160);  
    background-color: rgb(0, 125, 180); 
}
.btn.active.btn-deepblue, .btn.btn-deepblue:hover, .btn.btn-deepblue:focus, .btn.btn-deepblue:active { 
    background-color: rgb(0, 110, 160); 
}
.btn.btn-skyblue {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(60, 180, 245);  
    background-color: rgb(100, 195, 245); 
}
.btn.active.btn-skyblue, .btn.btn-skyblue:hover, .btn.btn-skyblue:focus, .btn.btn-skyblue:active { 
    background-color: rgb(60, 180, 245); 
}
.btn.btn-blue {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid #2089D0;  
    background-color: #3498DB;  
}
.btn.active.btn-blue, .btn.btn-blue:hover, .btn.btn-blue:focus, .btn.btn-blue:active { 
    background-color: #2089D0; 
}
.btn.btn-navy {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(40, 40, 50);  
    background-color: rgb(50, 60, 70); 
}
.btn.active.btn-navy, .btn.btn-navy:hover, .btn.btn-navy:focus, .btn.btn-navy:active { 
    background-color: rgb(40, 40, 50); 
}
.btn.btn-violet {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(65, 50, 100);  
    background-color: rgb(85, 60, 125); 
}
.btn.active.btn-violet, .btn.btn-violet:hover, .btn.btn-violet:focus, .btn.btn-violet:active { 
    background-color: rgb(65, 50, 100); 
}
.btn.btn-yellow {
    color: #fff !important; border-image: none !important; background-image: none !important;
    border: 1px solid rgb(230, 180, 0);  
    background-color: rgb(240, 195, 15); 
}
.btn.active.btn-yellow, .btn.btn-yellow:hover, .btn.btn-yellow:focus, .btn.btn-yellow:active { 
    background-color: rgb(230, 180, 0); 
}
.btn.btn-trans { 
    color: #fff !important; border-image: none !important; background: none;
    border: 2px solid #fff; 
}
.btn.active.btn-trans, .btn.btn-trans:hover, .btn.btn-trans:focus, .btn.btn-trans:active { 
    color: rgb(213, 7, 15) !important; 
    background-color: #fff; 
    background-image: none; 
}

/* ====================================================================================================================
 * Font, Color 등 설정은 제일 하단에 위치시킴
 * ====================================================================================================================*/

/* Background Color ------------------------------------------------------ */
.bg-red, i.bg-red, .badge.bg-red { 
    background-color: rgb(233, 27, 35);
    color: #fff !important; 
}
.bg-darkred, i.bg-darkred, .badge.bg-darkred { 
    background-color: rgb(170, 60, 63);
    color: #fff !important; 
}
.bg-crimson, i.bg-crimson, .badge.bg-crimson { 
    background-color: rgb(220, 20, 60); 
    color: #fff !important; 
}
.bg-orangered, i.bg-orangered, .badge.bg-orangered { 
    background-color: orangered; 
    color: #fff !important; 
}
.bg-orange, i.bg-orange, .badge.bg-orange { 
    background-color: rgb(240, 150, 20);
    color: #fff !important; 
}
.bg-green, i.bg-green, .badge.bg-green { 
    background-color: rgb(140, 195, 70); 
    color: #fff !important; 
}
.bg-lightgreen, i.bg-lightgreen, .badge.bg-lightgreen { 
    background-color: rgb(160, 200, 80); 
    color: #fff !important; 
}
.bg-deepblue, i.bg-deepblue, .badge.bg-deepblue { 
    background-color: rgb(0, 125, 180); 
    color: #fff !important; 
}
.bg-skyblue, i.bg-skyblue, .badge.bg-skyblue { 
    background-color: rgb(100, 195, 245); 
    color: #fff !important; 
}
.bg-blue, i.bg-blue, .badge.bg-blue { 
    background-color: rgb(52, 152, 219); 
    color: #fff !important; 
}
.bg-navy, i.bg-navy, .badge.bg-navy { 
    background-color: rgb(50, 60, 70); 
    color: #fff !important; 
}
.bg-violet, i.bg-violet, .badge.bg-violet { 
    background-color: rgb(85, 60, 125); 
    color: #fff !important; 
}
.bg-yellow, i.bg-yellow, .badge.bg-yellow { 
    background-color: rgb(241, 196, 15); 
    color: #fff !important; 
}
.bg-darkgray, i.bg-darkgray, .badge.bg-darkgray { 
    background-color: #666; 
    color: #fff !important; 
}
.bg-gray, i.bg-gray, .badge.bg-gray { 
    background-color: #888; 
    color: #ff !importantf; 
}
.bg-lightgray, i.bg-lightgray, .badge.bg-lightgray { 
    background-color: #ddd; 
    color: #fff !important; 
}
.bg-white, i.bg-white, .badge.bg-white { 
    background-color: #fff; 
    color: #333 !important; 
}
.bg-light, i.bg-light, .badge.bg-light {
    color: #333 !important; 
    background-color: #f5f5f5; 
}
.bg-light-border, i.bg-light-border, .badge.bg-light-border {
    color: #333 !important; 
    background-color: #fafafa; 
    border-bottom:1px solid #ddd; 
}
.bg-black, i.bg-black, .badge.bg-black {
    background-color: #333; 
    color: #fff !important; 
}
.bg-color, i.bg-color, .badge.bg-color { 
    background-color: rgb(233, 27, 35);
    color: #fff !important; 
}

/* Border Color ------------------------------------------------------ */
.border-red, i.border-red, img.border-red { 
    border-color: rgb(233, 27, 35);
}
.border-darkred, i.border-darkred, img.border-darkred { 
    border-color: rgb(170, 60, 63);
}
.border-crimson, i.border-crimson, img.border-crimson { 
    border-color: rgb(220, 20, 60); 
}
.border-orangered, i.border-orangered, img.border-orangered { 
    border-color: orangered; 
}
.border-orange, i.border-orange, img.border-orange { 
    border-color: rgb(240, 150, 20);
}
.border-green, i.border-green, img.border-green { 
    border-color: rgb(140, 195, 70); 
}
.border-lightgreen, i.border-lightgreen, img.border-lightgreen { 
    border-color: rgb(160, 200, 80); 
}
.border-deepblue, i.border-deepblue, img.border-deepblue { 
    border-color: rgb(0, 125, 180); 
}
.border-skyblue, i.border-skyblue, img.border-skyblue { 
    border-color: rgb(100, 195, 245); 
}
.border-blue, i.border-blue, img.border-blue { 
    border-color: rgb(52, 152, 219); 
}
.border-navy, i.border-navy, img.border-navy { 
    border-color: rgb(50, 60, 70); 
}
.border-violet, i.border-violet, img.border-violet { 
    border-color: rgb(85, 60, 125); 
}
.border-yellow, i.border-yellow, img.border-yellow { 
    border-color: rgb(241, 196, 15); 
}
.border-darkgray, i.border-darkgray, img.border-darkgray { 
    border-color: #666; 
}
.border-gray, i.border-gray, img.border-gray { 
    border-color: #888; 
}
.border-lightgray, i.border-lightgray, img.border-lightgray { 
    border-color: #ddd; 
}
.border-white, i.border-white, img.border-white { 
    border-color: #fff; 
}
.border-light, i.border-light, img.border-light {
    border-color: #f5f5f5; 
}
.border-black, i.border-black, img.border-black {
    border-color: #333; 
}
.border-color, i.border-color, img.border-color { 
    border-color: rgb(233, 27, 35); 
}

/* Hover Color ------------------------------------------------------ */
.hover-red:hover { 
    background-color: rgb(233, 27, 35);
    color: #fff; 
}
.hover-darkred:hover { 
    background-color: rgb(170, 60, 63);
    color: #fff; 
}
.hover-crimson:hover { 
    background-color: rgb(220, 20, 60); 
    color: #fff; 
}
.hover-orangered:hover { 
    background-color: orangered;
    color: #fff; 
}
.hover-orange:hover { 
    background-color: rgb(240, 150, 20);
    color: #fff; 
}
.hover-green:hover:hover { 
    background-color: rgb(140, 195, 70); 
    color: #fff; 
}
.hover-lightgreen:hover { 
    background-color: rgb(160, 200, 80); 
    color: #fff; 
}
.hover-deepblue:hover { 
    background-color: rgb(0, 125, 180); 
    color: #fff; 
}
.hover-skyblue:hover { 
    background-color: rgb(100, 195, 245); 
    color: #fff; 
}
.hover-blue:hover { 
    background-color: rgb(52, 152, 219); 
    color: #fff; 
}
.hover-navy:hover { 
    background-color: rgb(50, 60, 70); 
    color: #fff; 
}
.hover-violet:hover { 
    background-color: rgb(85, 60, 125); 
    color: #fff; 
}
.hover-yellow:hover { 
    background-color: rgb(241, 196, 15); 
    color: #fff; 
}
.hover-darkgray:hover { 
    background-color: #666; 
    color: #fff; 
}
.hover-gray:hover { 
    background-color: #888; 
    color: #fff; 
}
.hover-lightgray:hover { 
    background-color: #ddd; 
    color: #fff; 
}
.hover-white:hover { 
    background-color: #fff; 
    color: #333; 
}
.hover-black:hover { 
    background-color: #333; 
    color: #fff; 
}
.hover-color:hover { 
    background-color: rgb(233, 27, 35);
    color: #fff; 
}

/* Trans Background Color ------------------------------------------------------ */
.trans-bg-red { 
    background-color: rgba(233, 27, 35, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-darkred { 
    background-color: rgba(170, 60, 63, 0.75) !important;
    color: #fff !important; 
}
.trans-bg-crimson { 
    background-color: rgba(220, 20, 60, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-orangered { 
    background-color: rgba(255, 70, 0, 0.75) !important;
    color: #fff !important; 
}
.trans-bg-orange { 
    background-color: rgba(240, 150, 20, 0.75) !important;
    color: #fff !important; 
}
.trans-bg-green { 
    background-color: rgba(140, 195, 70, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-lightgreen { 
    background-color: rgba(160, 200, 80, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-deepblue { 
    background-color: rgba(0, 125, 180, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-skyblue { 
    background-color: rgba(100, 195, 245, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-blue { 
    background-color: rgba(52, 152, 219, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-navy { 
    background-color: rgba(50, 60, 70, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-violet { 
    background-color: rgba(85, 60, 125, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-yellow { 
    background-color: rgba(241, 196, 15, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-darkgray { 
    background-color: rgba(102, 98, 98, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-gray { 
    background-color: rgba(102, 102, 102, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-lightgray { 
    background-color: rgba(208, 208, 208, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-white { 
    background-color: rgba(255, 255, 255, 0.75) !important; 
    color: #333 !important; 
}
.trans-bg-black { 
    background-color: rgba(0, 0, 0, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-color { 
    background-color: rgba(233, 27, 35, 0.75) !important; 
    color: #fff !important; 
}
.trans-bg-full { 
    width:100%; 
    height:100%; 
    overflow:hidden; 
    padding:8% !important; 
    text-overflow:clip; 
    white-space:normal; 
}




/* font size */
.fs-10 { font-size: 10px !important; }
.fs-11 { font-size: 11px !important; }
.fs-12 { font-size: 12px !important; }
.fs-13 { font-size: 13px !important; }
.fs-14 { font-size: 14px !important; }
.fs-15 { font-size: 15px !important; }
.fs-16 { font-size: 16px !important; }
.fs-17 { font-size: 17px !important; }
.fs-18 { font-size: 18px !important; }
.fs-19 { font-size: 19px !important; }
.fs-20 { font-size: 20px !important; }
.fs-21 { font-size: 21px !important; }
.fs-22 { font-size: 22px !important; }
.fs-23 { font-size: 23px !important; }
.fs-24 { font-size: 24px !important; }
.fs-25 { font-size: 25px !important; }
.fs-30 { font-size: 30px !important; }
.fs-35 { font-size: 35px !important; }
.fs-40 { font-size: 40px !important; }
.fs-45 { font-size: 45px !important; }
.fs-50 { font-size: 50px !important; }
.fs-55 { font-size: 55px !important; }
.fs-60 { font-size: 60px !important; }
.fs-65 { font-size: 65px !important; }
.fs-70 { font-size: 70px !important; }
.fs-75 { font-size: 75px !important; }
.fs-80 { font-size: 80px !important; }
.fs-90 { font-size: 90px !important; }
.fs-100 { font-size: 100px !important; }
.fs-120 { font-size: 120px !important; }
.fs-130 { font-size: 130px !important; }
.fs-140 { font-size: 140px !important; }
.fs-150 { font-size: 150px !important; }
.fs-200 { font-size: 200px !important; }

/* font weight */
.fw-100 { font-weight: 100 !important; }
.fw-200 { font-weight: 200 !important; }
.fw-300 { font-weight: 300 !important; }
.fw-400 { font-weight: 400 !important; }
.fw-500 { font-weight: 500 !important; }
.fw-600 { font-weight: 600 !important; }
.fw-700 { font-weight: 700 !important; }
.fw-800 { font-weight: 800 !important; }


/* margins */
/*
.mb-0   { margin-bottom:0px !important;   }
.mb-1   { margin-bottom:1px !important;   }
.mb-2   { margin-bottom:2px !important;   }
.mb-3   { margin-bottom:3px !important;   }
.mb-4   { margin-bottom:4px !important;   }
.mb-5   { margin-bottom:5px !important;   }
*/
.mb-6   { margin-bottom:6px !important;   }
.mb-7   { margin-bottom:7px !important;   }
.mb-8   { margin-bottom:8px !important;   }
.mb-9   { margin-bottom:9px !important;   }
.mb-10  { margin-bottom:10px !important;  }
.mb-12  { margin-bottom:12px !important;  }
.mb-15  { margin-bottom:15px !important;  }
.mb-18  { margin-bottom:18px !important;  }
.mb-20  { margin-bottom:20px !important;  }
.mb-25  { margin-bottom:20px !important;  }
.mb-30  { margin-bottom:30px !important;  }
.mb-35  { margin-bottom:35px !important;  }
.mb-40  { margin-bottom:40px !important;  }
.mb-45  { margin-bottom:45px !important;  }
.mb-50  { margin-bottom:50px !important;  }
.mb-60  { margin-bottom:60px !important;  }
.mb-70  { margin-bottom:70px !important;  }
.mb-80  { margin-bottom:80px !important;  }
.mb-90  { margin-bottom:90px !important;  }
.mb-100 { margin-bottom:100px !important; }
.mb-110 { margin-bottom:110px !important; }
.mb-120 { margin-bottom:120px !important; }
.mb-130 { margin-bottom:130px !important; }
.mb-140 { margin-bottom:140px !important; }
.mb-150 { margin-bottom:150px !important; }
.mb-200 { margin-bottom:200px !important; }

/*
.mt-0   { margin-top:0px !important;   }
.mt-1   { margin-top:1px !important;   }
.mt-2   { margin-top:2px !important;   }
.mt-3   { margin-top:3px !important;   }
.mt-4   { margin-top:4px !important;   }
.mt-5   { margin-top:5px !important;   }
*/
.mt-6   { margin-top:6px !important;   }
.mt-7   { margin-top:7px !important;   }
.mt-8   { margin-top:8px !important;   }
.mt-9   { margin-top:9px !important;   }
.mt-10  { margin-top:10px !important;  }
.mt-12  { margin-top:12px !important;  }
.mt-15  { margin-top:15px !important;  }
.mt-18  { margin-top:18px !important;  }
.mt-20  { margin-top:20px !important;  }
.mt-25  { margin-top:20px !important;  }
.mt-30  { margin-top:30px !important;  }
.mt-35  { margin-top:35px !important;  }
.mt-40  { margin-top:40px !important;  }
.mt-45  { margin-top:45px !important;  }
.mt-50  { margin-top:50px !important;  }
.mt-60  { margin-top:60px !important;  }
.mt-70  { margin-top:70px !important;  }
.mt-80  { margin-top:80px !important;  }
.mt-90  { margin-top:90px !important;  }
.mt-100 { margin-top:100px !important; }
.mt-110 { margin-top:110px !important; }
.mt-120 { margin-top:120px !important; }
.mt-130 { margin-top:130px !important; }
.mt-140 { margin-top:140px !important; }
.mt-150 { margin-top:150px !important; }
.mt-200 { margin-top:200px !important; }

/*
.ml-0   { margin-left:0px !important;   }
.ml-1   { margin-left:1px !important;   }
.ml-2   { margin-left:2px !important;   }
.ml-3   { margin-left:3px !important;   }
.ml-4   { margin-left:4px !important;   }
.ml-5   { margin-left:5px !important;   }
*/
.ml-6   { margin-left:6px !important;   }
.ml-7   { margin-left:7px !important;   }
.ml-8   { margin-left:8px !important;   }
.ml-9   { margin-left:9px !important;   }
.ml-10  { margin-left:10px !important;  }
.ml-12  { margin-left:12px !important;  }
.ml-15  { margin-left:15px !important;  }
.ml-18  { margin-left:18px !important;  }
.ml-20  { margin-left:20px !important;  }
.ml-25  { margin-left:20px !important;  }
.ml-30  { margin-left:30px !important;  }
.ml-35  { margin-left:35px !important;  }
.ml-40  { margin-left:40px !important;  }
.ml-45  { margin-left:45px !important;  }
.ml-50  { margin-left:50px !important;  }
.ml-60  { margin-left:60px !important;  }
.ml-70  { margin-left:70px !important;  }
.ml-80  { margin-left:80px !important;  }
.ml-90  { margin-left:90px !important;  }
.ml-100 { margin-left:100px !important; }
.ml-110 { margin-left:110px !important; }
.ml-120 { margin-left:120px !important; }
.ml-130 { margin-left:130px !important; }
.ml-140 { margin-left:140px !important; }
.ml-150 { margin-left:150px !important; }
.ml-200 { margin-left:200px !important; }

/*
.mr-0   { margin-right:0px !important;   }
.mr-1   { margin-right:1px !important;   }
.mr-2   { margin-right:2px !important;   }
.mr-3   { margin-right:3px !important;   }
.mr-4   { margin-right:4px !important;   }
.mr-5   { margin-right:5px !important;   }
*/
.mr-6   { margin-right:6px !important;   }
.mr-7   { margin-right:7px !important;   }
.mr-8   { margin-right:8px !important;   }
.mr-9   { margin-right:9px !important;   }
.mr-10  { margin-right:10px !important;  }
.mr-12  { margin-right:12px !important;  }
.mr-15  { margin-right:15px !important;  }
.mr-18  { margin-right:18px !important;  }
.mr-20  { margin-right:20px !important;  }
.mr-25  { margin-right:20px !important;  }
.mr-30  { margin-right:30px !important;  }
.mr-35  { margin-right:35px !important;  }
.mr-40  { margin-right:40px !important;  }
.mr-45  { margin-right:45px !important;  }
.mr-50  { margin-right:50px !important;  }
.mr-60  { margin-right:60px !important;  }
.mr-70  { margin-right:70px !important;  }
.mr-80  { margin-right:80px !important;  }
.mr-90  { margin-right:90px !important;  }
.mr-100 { margin-right:100px !important; }
.mr-110 { margin-right:110px !important; }
.mr-120 { margin-right:120px !important; }
.mr-130 { margin-right:130px !important; }
.mr-140 { margin-right:140px !important; }
.mr-150 { margin-right:150px !important; }
.mr-200 { margin-right:200px !important; }

/*
.m-0   { margin:0px !important;   }
.m-1   { margin:1px !important;   }
.m-2   { margin:2px !important;   }
.m-3   { margin:3px !important;   }
.m-4   { margin:4px !important;   }
.m-5   { margin:5px !important;   }
*/
.m-6   { margin:6px !important;   }
.m-7   { margin:7px !important;   }
.m-8   { margin:8px !important;   }
.m-9   { margin:9px !important;   }
.m-10  { margin:10px !important;  }
.m-12  { margin:12px !important;  }
.m-15  { margin:15px !important;  }
.m-18  { margin:18px !important;  }
.m-20  { margin:20px !important;  }
.m-25  { margin:20px !important;  }
.m-30  { margin:30px !important;  }
.m-35  { margin:35px !important;  }
.m-40  { margin:40px !important;  }
.m-45  { margin:45px !important;  }
.m-50  { margin:50px !important;  }
.m-60  { margin:60px !important;  }
.m-70  { margin:70px !important;  }
.m-80  { margin:80px !important;  }
.m-90  { margin:90px !important;  }
.m-100 { margin:100px !important; }
.m-110 { margin:110px !important; }
.m-120 { margin:120px !important; }
.m-130 { margin:130px !important; }
.m-140 { margin:140px !important; }
.m-150 { margin:150px !important; }
.m-200 { margin:200px !important; }



/* paddings */
/*
.pb-0   { padding-bottom:0px !important;   }
.pb-1   { padding-bottom:1px !important;   }
.pb-2   { padding-bottom:2px !important;   }
.pb-3   { padding-bottom:3px !important;   }
.pb-4   { padding-bottom:4px !important;   }
.pb-5   { padding-bottom:5px !important;   }
*/
.pb-6   { padding-bottom:6px !important;   }
.pb-7   { padding-bottom:7px !important;   }
.pb-8   { padding-bottom:8px !important;   }
.pb-9   { padding-bottom:9px !important;   }
.pb-10  { padding-bottom:10px !important;  }
.pb-12  { padding-bottom:12px !important;  }
.pb-15  { padding-bottom:15px !important;  }
.pb-18  { padding-bottom:18px !important;  }
.pb-20  { padding-bottom:20px !important;  }
.pb-25  { padding-bottom:20px !important;  }
.pb-30  { padding-bottom:30px !important;  }
.pb-35  { padding-bottom:35px !important;  }
.pb-40  { padding-bottom:40px !important;  }
.pb-45  { padding-bottom:45px !important;  }
.pb-50  { padding-bottom:50px !important;  }
.pb-60  { padding-bottom:60px !important;  }
.pb-70  { padding-bottom:70px !important;  }
.pb-80  { padding-bottom:80px !important;  }
.pb-90  { padding-bottom:90px !important;  }
.pb-100 { padding-bottom:100px !important; }
.pb-110 { padding-bottom:110px !important; }
.pb-120 { padding-bottom:120px !important; }
.pb-130 { padding-bottom:130px !important; }
.pb-140 { padding-bottom:140px !important; }
.pb-150 { padding-bottom:150px !important; }
.pb-180 { padding-bottom:180px !important; }
.pb-200 { padding-bottom:200px !important; }

/*
.pt-0   { padding-top:0px !important;   }
.pt-1   { padding-top:1px !important;   }
.pt-2   { padding-top:2px !important;   }
.pt-3   { padding-top:3px !important;   }
.pt-4   { padding-top:4px !important;   }
.pt-5   { padding-top:5px !important;   }
*/
.pt-6   { padding-top:6px !important;   }
.pt-7   { padding-top:7px !important;   }
.pt-8   { padding-top:8px !important;   }
.pt-9   { padding-top:9px !important;   }
.pt-10  { padding-top:10px !important;  }
.pt-12  { padding-top:12px !important;  }
.pt-15  { padding-top:15px !important;  }
.pt-18  { padding-top:18px !important;  }
.pt-20  { padding-top:20px !important;  }
.pt-25  { padding-top:20px !important;  }
.pt-30  { padding-top:30px !important;  }
.pt-35  { padding-top:35px !important;  }
.pt-40  { padding-top:40px !important;  }
.pt-45  { padding-top:45px !important;  }
.pt-50  { padding-top:50px !important;  }
.pt-60  { padding-top:60px !important;  }
.pt-70  { padding-top:70px !important;  }
.pt-80  { padding-top:80px !important;  }
.pt-90  { padding-top:90px !important;  }
.pt-100 { padding-top:100px !important; }
.pt-110 { padding-top:110px !important; }
.pt-120 { padding-top:120px !important; }
.pt-130 { padding-top:130px !important; }
.pt-140 { padding-top:140px !important; }
.pt-150 { padding-top:150px !important; }
.pt-200 { padding-top:200px !important; }

/*
.pl-0   { padding-left:0px !important;   }
.pl-1   { padding-left:1px !important;   }
.pl-2   { padding-left:2px !important;   }
.pl-3   { padding-left:3px !important;   }
.pl-4   { padding-left:4px !important;   }
.pl-5   { padding-left:5px !important;   }
*/
.pl-6   { padding-left:6px !important;   }
.pl-7   { padding-left:7px !important;   }
.pl-8   { padding-left:8px !important;   }
.pl-9   { padding-left:9px !important;   }
.pl-10  { padding-left:10px !important;  }
.pl-12  { padding-left:12px !important;  }
.pl-15  { padding-left:15px !important;  }
.pl-18  { padding-left:18px !important;  }
.pl-20  { padding-left:20px !important;  }
.pl-25  { padding-left:20px !important;  }
.pl-30  { padding-left:30px !important;  }
.pl-35  { padding-left:35px !important;  }
.pl-40  { padding-left:40px !important;  }
.pl-45  { padding-left:45px !important;  }
.pl-50  { padding-left:50px !important;  }
.pl-60  { padding-left:60px !important;  }
.pl-70  { padding-left:70px !important;  }
.pl-80  { padding-left:80px !important;  }
.pl-90  { padding-left:90px !important;  }
.pl-100 { padding-left:100px !important; }
.pl-110 { padding-left:110px !important; }
.pl-120 { padding-left:120px !important; }
.pl-130 { padding-left:130px !important; }
.pl-140 { padding-left:140px !important; }
.pl-150 { padding-left:150px !important; }
.pl-200 { padding-left:200px !important; }

/*
.pr-0   { padding-right:0px !important;   }
.pr-1   { padding-right:1px !important;   }
.pr-2   { padding-right:2px !important;   }
.pr-3   { padding-right:3px !important;   }
.pr-4   { padding-right:4px !important;   }
.pr-5   { padding-right:5px !important;   }
*/
.pr-6   { padding-right:6px !important;   }
.pr-7   { padding-right:7px !important;   }
.pr-8   { padding-right:8px !important;   }
.pr-9   { padding-right:9px !important;   }
.pr-10  { padding-right:10px !important;  }
.pr-12  { padding-right:12px !important;  }
.pr-15  { padding-right:15px !important;  }
.pr-18  { padding-right:18px !important;  }
.pr-20  { padding-right:20px !important;  }
.pr-25  { padding-right:20px !important;  }
.pr-30  { padding-right:30px !important;  }
.pr-35  { padding-right:35px !important;  }
.pr-40  { padding-right:40px !important;  }
.pr-45  { padding-right:45px !important;  }
.pr-50  { padding-right:50px !important;  }
.pr-60  { padding-right:60px !important;  }
.pr-70  { padding-right:70px !important;  }
.pr-80  { padding-right:80px !important;  }
.pr-90  { padding-right:90px !important;  }
.pr-100 { padding-right:100px !important; }
.pr-110 { padding-right:110px !important; }
.pr-120 { padding-right:120px !important; }
.pr-130 { padding-right:130px !important; }
.pr-140 { padding-right:140px !important; }
.pr-150 { padding-right:150px !important; }
.pr-200 { padding-right:200px !important; }

/*
.p-0   { padding:0px !important;   }
.p-1   { padding:1px !important;   }
.p-2   { padding:2px !important;   }
.p-3   { padding:3px !important;   }
.p-4   { padding:4px !important;   }
.p-5   { padding:5px !important;   }
*/
.p-6   { padding:6px !important;   }
.p-7   { padding:7px !important;   }
.p-8   { padding:8px !important;   }
.p-9   { padding:9px !important;   }
.p-10  { padding:10px !important;  }
.p-12  { padding:12px !important;  }
.p-15  { padding:15px !important;  }
.p-18  { padding:18px !important;  }
.p-20  { padding:20px !important;  }
.p-25  { padding:20px !important;  }
.p-30  { padding:30px !important;  }
.p-35  { padding:35px !important;  }
.p-40  { padding:40px !important;  }
.p-45  { padding:45px !important;  }
.p-50  { padding:50px !important;  }
.p-60  { padding:60px !important;  }
.p-70  { padding:70px !important;  }
.p-80  { padding:80px !important;  }
.p-90  { padding:90px !important;  }
.p-100 { padding:100px !important; }
.p-110 { padding:110px !important; }
.p-120 { padding:120px !important; }
.p-130 { padding:130px !important; }
.p-140 { padding:140px !important; }
.p-150 { padding:150px !important; }
.p-200 { padding:200px !important; }


/* borders */
.b-0    { border: 0 !important;  }
.bb-0   { border-bottom: 0 !important;  }
.bt-0   { border-top: 0 !important;     }
.bl-0   { border-left: 0 !important;    }
.br-0   { border-right: 0 !important;   }

.bw-0   { border-width: 0px !important; }
.bw-1   { border-width: 1px !important; }
.bw-2   { border-width: 2px !important; }
.bw-3   { border-width: 3px !important; }
.bw-4   { border-width: 4px !important; }
.bw-5   { border-width: 5px !important; }
.bw-10  { border-width: 10px !important; }

.btw-0   { border-top-width: 0px !important; }
.btw-1   { border-top-width: 1px !important; }
.btw-2   { border-top-width: 2px !important; }
.btw-3   { border-top-width: 3px !important; }
.btw-4   { border-top-width: 4px !important; }
.btw-5   { border-top-width: 5px !important; }
.btw-10  { border-top-width: 10px !important; }

.bbw-0   { border-bottom-width: 0px !important; }
.bbw-1   { border-bottom-width: 1px !important; }
.bbw-2   { border-bottom-width: 2px !important; }
.bbw-3   { border-bottom-width: 3px !important; }
.bbw-4   { border-bottom-width: 4px !important; }
.bbw-5   { border-bottom-width: 5px !important; }
.bbw-10  { border-bottom-width: 10px !important; }

.blw-0   { border-left-width: 0px !important; }
.blw-1   { border-left-width: 1px !important; }
.blw-2   { border-left-width: 2px !important; }
.blw-3   { border-left-width: 3px !important; }
.blw-4   { border-left-width: 4px !important; }
.blw-5   { border-left-width: 5px !important; }
.blw-10  { border-left-width: 10px !important; }

.brw-0   { border-right-width: 0px !important; }
.brw-1   { border-right-width: 1px !important; }
.brw-2   { border-right-width: 2px !important; }
.brw-3   { border-right-width: 3px !important; }
.brw-4   { border-right-width: 4px !important; }
.brw-5   { border-right-width: 5px !important; }
.brw-10  { border-right-width: 10px !important; }



/* width */
.width-10         { width:10px !important; }
.width-15         { width:15px !important; }
.width-20         { width:20px !important; }
.width-25         { width:25px !important; }
.width-30         { width:30px !important; }
.width-35         { width:35px !important; }
.width-40         { width:40px !important; }
.width-50         { width:50px !important; }
.width-60         { width:60px !important; }
.width-70         { width:70px !important; }
.width-80         { width:80px !important; }
.width-90         { width:90px !important; }
.width-100        { width:100px !important; }
.width-110        { width:110px !important; }
.width-120        { width:120px !important; }
.width-130        { width:130px !important; }
.width-140        { width:140px !important; }
.width-150        { width:150px !important; }
.width-200        { width:200px !important; }
.width-250        { width:250px !important; }
.width-300        { width:300px !important; }
.width-350        { width:350px !important; }
.width-400        { width:400px !important; }
.width-450        { width:450px !important; }
.width-500        { width:500px !important; }
.width-550        { width:550px !important; }
.width-600        { width:600px !important; }
.width-650        { width:650px !important; }
.width-700        { width:700px !important; }
.width-750        { width:750px !important; }
.width-800        { width:800px !important; }


/* width percent */
.width-100p       { width: 100% !important; }
.width-80p        { width: 80% !important;  }
.width-75p        { width: 75% !important;  }
.width-50p        { width: 50% !important;  }
.width-33p        { width: 33% !important;  }
.width-25p        { width: 25% !important;  }
.width-20p        { width: 20% !important;  }
.width-10p        { width: 10% !important;  }


/* height */
.height-1         { height:1px !important; }
.height-2         { height:2px !important; }
.height-3         { height:3px !important; }
.height-4         { height:4px !important; }
.height-5         { height:5px !important; }
.height-6         { height:6px !important; }
.height-7         { height:7px !important; }
.height-8         { height:8px !important; }
.height-9         { height:9px !important; }
.height-10         { height:10px !important; }
.height-15         { height:15px !important; }
.height-20         { height:20px !important; }
.height-25         { height:25px !important; }
.height-30         { height:30px !important; }
.height-35         { height:35px !important; }
.height-40         { height:40px !important; }
.height-45         { height:45px !important; }
.height-50         { height:50px !important; }
.height-60         { height:60px !important; }
.height-70         { height:70px !important; }
.height-80         { height:80px !important; }
.height-90         { height:90px !important; }
.height-100        { height:100px !important; }
.height-110        { height:110px !important; }
.height-120        { height:120px !important; }
.height-130        { height:130px !important; }
.height-140        { height:140px !important; }
.height-150        { height:150px !important; }
.height-200        { height:200px !important; }
.height-250        { height:250px !important; }
.height-300        { height:300px !important; }
.height-350        { height:350px !important; }
.height-400        { height:400px !important; }
.height-450        { height:450px !important; }
.height-500        { height:500px !important; }
.height-550        { height:550px !important; }
.height-600        { height:600px !important; }
.height-650        { height:650px !important; }
.height-700        { height:700px !important; }
.height-750        { height:750px !important; }
.height-800        { height:800px !important; }


/* height percent */
.height-100p       { height: 100vh !important; }
.height-75p        { height: 75vh !important;  }
.height-50p        { height: 50vh !important;  }
.height-33p        { height: 33vh !important;  }
.height-25p        { height: 25vh !important;  }
.height-20p        { height: 20vh !important;  }
.height-10p        { height: 10vh !important;  }

/** line-height- **/
.line-height-0      { line-height:0 !important;     }
.line-height-10     { line-height:10px !important;  }
.line-height-15     { line-height:15px !important;  }
.line-height-20     { line-height:20px !important;  }
.line-height-25     { line-height:25px !important;  }
.line-height-30     { line-height:30px !important;  }
.line-height-35     { line-height:35px !important;  }
.line-height-40     { line-height:40px !important;  }
.line-height-45     { line-height:45px !important;  }
.line-height-50     { line-height:50px !important;  }
.line-height-55     { line-height:55px !important;  }
.line-height-60     { line-height:60px !important;  }
.line-height-65     { line-height:65px !important;  }
.line-height-70     { line-height:70px !important;  }
.line-height-75     { line-height:75px !important;  }
.line-height-80     { line-height:80px !important;  }
.line-height-85     { line-height:85px !important;  }
.line-height-90     { line-height:90px !important;  }
.line-height-95     { line-height:95px !important;  }
.line-height-100    { line-height:100px !important; }

/* border radius */
.rad-3 {
  -webkit-border-radius: 3px !important;
        border-radius: 3px !important;
}
.rad-4 {
  -webkit-border-radius: 4px !important;
        border-radius: 4px !important;
}
.rad-6 {
  -webkit-border-radius: 6px !important;
        border-radius: 6px !important;
}
.rad-8 {
  -webkit-border-radius: 8px !important;
        border-radius: 8px !important;
}
.rad-10 {
  -webkit-border-radius: 10px !important;
        border-radius: 10px !important;
}
.rad-15 {
  -webkit-border-radius: 15px !important;
        border-radius: 15px !important;
}
.rad-20 {
  -webkit-border-radius: 20px !important;
        border-radius: 20px !important;
}
.rad-25 {
  -webkit-border-radius: 25px !important;
        border-radius: 25px !important;
}

.rad-0 {
  -webkit-border-radius: 0 !important;
        border-radius: 0 !important;
}
.rad-tl-0 { /* radius top left */
  -webkit-border-top-left-radius: 0 !important;
          border-top-left-radius: 0 !important;
}
.rad-tr-0 { /* radius top right */
  -webkit-border-top-right-radius: 0 !important;
          border-top-right-radius: 0 !important;
}
.rad-bl-0 { /* radius bottom left */
  -webkit-border-bottom-left-radius: 0 !important;
          border-bottom-left-radius: 0 !important;
}
.rad-br-0 { /* radius bottom right */
  -webkit-border-bottom-right-radius: 0 !important;
          border-bottom-right-radius: 0 !important;
}





/* mobile */
@media only screen and (max-width: 768px) {
  .block-xs { display: block !important; float: none !important; }
  .pl-xs-0 { padding-left: 0 !important;    }
  .pr-xs-0 { padding-right: 0 !important;   }
  .pt-xs-0 { padding-top: 0 !important;     }
  .pb-xs-0 { padding-bottom: 0 !important;  }
  .p-xs-0  { padding: 0 !important;         }

  .ml-xs-0 { margin-left: 0 !important;    }
  .mr-xs-0 { margin-right: 0 !important;   }
  .mt-xs-0 { margin-top: 0 !important;     }
  .mb-xs-0 { margin-bottom: 0 !important;  }
  .m-xs-0  { margin: 0 !important;         }

  .rad-xs-0  {
    -webkit-border-radius: 0 !important;
          border-radius: 0 !important;
  }
}

.text-capitalize {
    text-transform: capitalize;/*단어의 첫번째 글자를 대문자로 바꿉니다.*/
}
.text-uppercase {
    text-transform: uppercase;/*모든 글자를 대문자로 바꿉니다.*/
}
.text-lowercase {
    text-transform: lowercase;/*모든 글자를 소문자로 바꿉니다.*/
}



.bold {font-weight:bold;}
.cb {clear:both;}
.fl {float:left;}
.fr {float:right;}
.dn {display:none;}


/* ellipsis */
.elipsis { 
    overflow:hidden; 
    text-overflow:ellipsis; 
    white-space: nowrap; 
}

/* no selectrion */
.noselect {
    -webkit-touch-callout: none;
      -webkit-user-select: none;
       -khtml-user-select: none;
         -moz-user-select: none;
          -ms-user-select: none;
              user-select: none;
}


/* text color */
.text-default {
    color:#c6c6c6 !important;
}
.text-danger {
    color:#b92c28 !important;
}
.text-warning {
    color:#e38d13 !important;
}
.text-info {
    color:#28a4c9 !important;
}
.text-primary {
    color:#245580 !important;
}
.text-success {
    color:#02B700 !important;
}
.tex-white {
    color:#fff !important;
}
.tex-black {
    color:#111 !important;
}

.red, i.red { 
    color: rgb(233, 27, 35) !important;
}
.darkred, i.darkred { 
    color: rgb(170, 60, 63) !important;
}
.crimson, i.crimson { 
    color: rgb(220, 20, 60) !important; 
}
.orangered, i.orangered { 
    color: orangered !important; 
}
.orange, i.orange { 
    color: rgb(240, 150, 20) !important;
}
.green, i.green { 
    color: rgb(140, 195, 70) !important; 
}
.lightgreen, i.lightgreen { 
    color: rgb(160, 200, 80) !important; 
}
.deepblue, i.deepblue { 
    color: rgb(0, 125, 180) !important; 
}
.skyblue, i.skyblue { 
    color: rgb(100, 195, 245) !important; 
}
.blue, i.blue { 
    color: rgb(52, 152, 219) !important; 
}
.navy, i.navy { 
    color: rgb(50, 60, 70) !important; 
}
.violet, i.violet { 
    color: rgb(85, 60, 125) !important; 
}
.yellow, i.yellow { 
    color: #F1C40F !important; 
}
.darkgray, i.darkgray { 
    color: #666 !important; 
}
.gray, i.gray { 
    color: #888 !important; 
}
.lightgray, i.lightgray { 
    color: #ddd !important; 
}
.white, i.white { 
    color: #fff !important; 
}
.light, i.light {
    color: #f5f5f5 !important; 
}
.black, i.black { 
    color: #333 !important; 
}
.color, i.color { 
    color: rgb(233, 27, 35) !important;
}







/* letter spacing */
.letter-spacing-0 {
    letter-spacing: 0em !important;
}
.letter-spacing-1 {
    letter-spacing: 0.1em !important;
}
.letter-spacing-2 {
    letter-spacing: 0.2em !important;
}
.letter-spacing-3 {
    letter-spacing: 0.3em !important;
}
.letter-spacing-4 {
    letter-spacing: 0.4em !important;
}
.letter-spacing-5 {
    letter-spacing: 0.5em !important;
}
.letter-spacing-6 {
    letter-spacing: 0.6em !important;
}
.letter-spacing-7 {
    letter-spacing: 0.7em !important;
}
.letter-spacing-8 {
    letter-spacing: 0.8em !important;
}
.letter-spacing-9 {
    letter-spacing: 0.9em !important;
}
.letter-spacing-10 {
    letter-spacing: 1em !important;
}

/* 추가된 css */
.text-color { color:#fff; }
#noti_btn_top { color:#fff; }
.border-bottom-custom { border-bottom: 1px solid #34405e !important; }
.list-color a { color:#fff; }
.sly-tab hr { border-top: 1px solid #34405e !important; }
.sly-tab li a {
    color: #fff !important;
    border: 1px solid #34405e !important;
    background: #182136 !important;
}
.sly-tab .d-flex {
    border-left: 1px solid #34405e;
}
.page-item.disabled .page-link { color: rgb(115, 136, 182) !important; background-color: #262e42 !important; border-color: #1C273D !important; }
.page-link { color:#fff !important; background-color:#34405e !important; border: 1px solid #1C273D !important; }
#memo_info { color:#fff; }
.memo-color a { color:#fff; }
.date-color { color:#fff; }
.sv_wrap a { color:#fff; }
.bg-custom { background: #192237; }
.bg-custom-2 { background: #34405e; }
.border-left {
    border-left: 1px solid #34405e !important;
}
.list-group-item-custom { background-color:#192237; }
#point_info { color:#fff; }
#scrap_info { color:#fff; }
.login_wrap_inner { color:#fff; }
#find_info p { color:#fff; }
.reg_wrap_inner_join { border-radius:6px; border: 1px solid #34405e !important; }
.tbl_frm01 th { color:#fff; border: 1px solid #34405e !important; background: #182136 !important; }
.tbl_frm01 label { color:#fff; }
.tbl_frm01 td { border-top: 1px solid #34405e !important; border-bottom: 1px solid #34405e !important; }