/* head */
.sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}


@media (min-width: 768px) { /* bylee. bugfix */
  /* mobile dropdown menu > bug  / pc 해상도에서만 호출되게 변경 */
  .dropdown:hover>.dropdown-menu {display: block;margin-top: -2px;padding-top: -10px;border-top: 10px solid rgba(0,0,0,0);}

}

.navbar-nav .dropdown-menu {right: -30px;}
.dropdown-item:hover, .nav-link:hover {color: #007bff !important;}
.dropdown-item:focus, .dropdown-item:hover  {background-color: transparent !important;}
.dropdown-item:active, .nav-link:active {background-color: #fff;}
.nav-link:active {background-color: transparent}

#hd_h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}


/* 본문 바로가기 */
#skip_to_container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skip_to_container a:focus, #skip_to_container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:2em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em}
#hd_wrapper {position:relative;margin:0 auto;padding:10px 0;height:10px;zoom:1}
#hd_wrapper:after {display:block;visibility:hidden;clear:both;content:""}

.trans {background-color: rgba(0,0,0,0.8)}

/* bylee > size bugfix > font-size:1.2em !important;  추가  */
.nav-link {font-size:1.2em !important; color: rgba(255,255,255,1) !important;padding-right:1em;padding-left:1em !important;}


/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff;}
.hd_pops img{max-width:100%}
.hd_pops_con {}
.hd_pops_footer {padding: 0;background:#000;color:#fff;text-align:left;position:relative;}
.hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""}
.hd_pops_footer button {padding: 10px;border:0;color:#fff}
.hd_pops_footer .hd_pops_reject{background:#000;text-align:left}
.hd_pops_footer .hd_pops_close{background:#393939;position:absolute;top:0;right:0}


/* Main */
/* CIRCLE IMAGE CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns with circle image */
.box_circle .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
.box_circle h2 {
  font-weight: 400;
}
.box_circle .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}

/* Latest 제목 글자 수 자동 제한 */
.lat li {}
.lat li a {position: relative;display:block;padding-right: 30px;}
.lat li a .lt_title {display: block;text-overflow:ellipsis;overflow: hidden;white-space: nowrap;}
.hot_icon {margin-right: 5px;}
.new_icon {margin-right: 5px;}


/* 공통 */
.section-header h3::before {content: '';position: absolute;display: block;width: 120px;height: 1px;background: #ddd;bottom: 1px;left: calc(50% - 60px);}
.section-header h3::after {content: '';position: absolute;display: block;width: 40px;height: 3px;background: #007bff;bottom: 0;left: calc(50% - 20px);}
.section-header h3 {font-size: 1.5rem;color: #111;text-transform: uppercase;text-align: center;font-weight: 700;position: relative;padding-bottom: 15px;}

.empha {font-weight:600}


/* Board */
.page {margin:10px 0 30px;}


/* 기본테이블 */
/*
.tbl_wrap table {width:100%;border-collapse:collapse;border-spacing: 0 5px;border:1px solid #ccc;} 
.tbl_wrap caption {padding:10px 0;font-weight:bold;text-align:left}
.tbl_head01 {margin:0 0 10px}
.tbl_head01 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.tbl_head01 thead th {padding:10px 0;font-weight:normal;text-align:center;border-bottom:1px solid #ddd;background:#fafafa;height:40px}
.tbl_head01 thead th input {vertical-align:top}
.tbl_head01 tfoot th, .tbl_head01 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center}
.tbl_head01 tbody th {padding:8px 0;border-bottom:1px solid #e8e8e8}
.tbl_head01 td {color:#666;background:#fff;padding:10px 5px;border-top:1px solid #ecf0f1;line-height:1.4em;height:1.5rem;word-break:break-all}
.tbl_head01 tbody tr:hover td{background:#fafafa;}
.tbl_head01 a:hover {text-decoration:none}

.tbl_head02 {margin:0 0 10px}
.tbl_head02 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.tbl_head02 thead th {padding:5px 0;border-top:1px solid #d1dee2;border-bottom:1px solid #d1dee2;background:#e5ecef;color:#383838;font-size:0.95em;text-align:center;letter-spacing:-0.1em}
.tbl_head02 thead a {color:#383838}
.tbl_head02 thead th input {vertical-align:top}
.tbl_head02 tfoot th, .tbl_head02 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center}
.tbl_head02 tbody th {padding:5px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:#fff}
.tbl_head02 td {padding:5px 3px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:#fff;line-height:1.4em;word-break:break-all}
.tbl_head02 a {}
*/


/* thead 한 줄 테이블 */
.tbl_wrap table {width:100%;border-collapse:collapse;border-spacing: 0 5px;border:1px solid #ccc;}
.tbl_wrap caption {padding:10px 0;font-weight:bold;text-align:left}
.tbl_head01 {}
.tbl_head01 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.tbl_head01 table {clear:both;width:100%;border-collapse:collapse;border-spacing:0}
.tbl_head01 thead th {background:#6f809a;color:#fff;border:1px solid #60718b;font-weight:normal;text-align:center;padding:8px 5px;font-size:0.9em}
.tbl_head01 thead th a{color:#fff}
.tbl_head01 thead input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head01 thead a {color:#383838;text-decoration:underline}
.tbl_head01 tbody th{border:1px solid #d6dce7;padding:5px;text-align:center}
/*.tbl_head01 tbody td{border:1px solid #d6dce7;padding:5px;text-align:center}*/
.tbl_head01 tbody td{border:1px solid #d6dce7;padding:5px;}
.tbl_head01 tbody tr:nth-child(even){background:#eff3f9}
.tbl_head01 tbody td .frm_input{width:100%;}
.tbl_head01 tbody td select{width:100%}
.tbl_head01 table .tbl_input{height:27px;line-height:25px;border:1px solid #d5d5d5;width:100%}
.tbl_head01 table select {height: 27px;line-height: 25px;width: 100%;}

/* thead 두 줄 테이블 */
.tbl_head02 {}
.tbl_head02 table {clear:both;width:100%;border-collapse:collapse;border-spacing:0}
.tbl_head02 thead th, .tbl_head02 tbody th {padding:5px 0;border:1px solid #d1dee2;background:#e5ecef;color:#383838;letter-spacing:-0.1em}
.tbl_head02 thead th {font-size:0.95em}
.tbl_head02 thead input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head02 thead a {color:#383838;text-decoration:underline}
.tbl_head02 tbody th {}
.tbl_head02 tbody td {padding:7px 5px;line-height:1.4em;word-break:break-all}




/* 테이블 항목별 정의 */
.td_board {width:80px;text-align:center}
.td_category {width:80px;text-align:center}
.td_chk {width:30px;text-align:center}
.td_date {width:60px;text-align:center}
.td_datetime {width:120px;text-align:center}
.td_group {width:80px;text-align:center}
.td_mb_id {width:100px;text-align:center}
.td_mng {width:80px;text-align:center}
.td_name {width:100px;text-align:left}
.td_name2 {width:160px;text-align:left}
.td_name3 {width:200px;text-align:left}
.td_nick {width:100px;text-align:center}
.td_numbig {width:80px;text-align:center}
.td_stat {width:60px;text-align:center}
.td_hp {width:110px;text-align:center !important}
.td_mbstat {text-align:center}
.td_mng {width:100px;font-size:0.95em;text-align:center;letter-spacing:-0.1em}
.td_mngsmall {width:60px;text-align:center;}
.td_num {width:60px;text-align:center}
.td_num_c{width:70px;text-align:center}
.td_num_c2{width:60px;text-align:center}
.td_num_c3{width:100px;text-align:center}
.td_numbig {width:100px;text-align:right !important}
.td_numcancel0 {color:#999;text-align:right !important}
.td_numcancel1 {color:#ff3061;font-weight:bold;text-align:right !important}
.td_numcoupon {color:#86b325;text-align:right !important}
.td_numincome {text-align:right !important}
.td_num_right {text-align:right !important}
.td_numsmall {width:40px;text-align:center}
.td_numsum {font-weight:bold;text-align:right !important}
.td_numrdy {color:#ff3061;text-align:right !important}
.td_odrnum {width:250px;text-align:center}
.td_odrnum2 {width:140px;text-align:center}
.td_odrnum3 {width:110px;text-align:center}
.td_phonenumber {width:110px;text-align:center}
.td_odrstatus {width:70px;letter-spacing:-0.1em;text-align:center}
.td_output {width:90px;text-align:center}
.td_payby {width:70px;text-align:center;letter-spacing:-0.1em}
.td_paybybig {width:140px;text-align:center;letter-spacing:-0.1em}
.td_possible {width:70px;text-align:center}
.td_postal {width:60px;text-align:center}
.td_postalbig {width:140px;text-align:center}
.td_price {text-align:right !important}
.td_qty {text-align:right !important; width:100px;}
.td_pt {text-align:right !important}
.td_send {width:50px;text-align:center}
.td_sendcost_by {width:50px;text-align:center}
.td_sendcost_add {width:100px;text-align:center}
.td_stat {width:70px;text-align:center}
.td_tdiv {border-bottom:1px solid #c9c9c9 !important}
.td_tel{width:130px;text-align:center !important}
.td_telbig {width:100px;text-align:center}
.td_category1{width:130px;text-align:center}
.td_category2{width:100px;text-align:center}
.td_category3{width:80px;text-align:center}
.td_time{text-align:center;width:130px}
.td_center{text-align:center;}
.td_type{width:120px}
.td_groupname{width:140px;text-align:left}
.td_mng_s{width:60px}
.td_mng_m{width:100px}
.td_mng_l{width:160px}

.txt_true {color:#e8180c}
.txt_false {color:#ccc}
.td_left {
  text-align: left !important;
}
.td_boolean {
  width: 50px;
  text-align: center;
}
.td_confirm {width:90px;text-align:center}
.td_date {width:80px;text-align:center}
.td_datetime {width:140px;text-align:center}
.td_delicom {width:100px}
.td_delino {width:130px}

.txt_active {color:#5d910b}
.txt_done {color:#ff6347}
.txt_expired {color:#ccc}
.txt_rdy {color:#2e8b57}



.th-cen th {text-align:center}
.th-cen .cen  {text-align:center}



#bo_cate {margin:15px 0 10px}
#bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_cate ul {;zoom:1}
#bo_cate ul:after {display:block;visibility:hidden;clear:both;content:""}
#bo_cate li {display:inline-block;}
#bo_cate a {display:block;border:1px solid #ddd;background:#fff;margin:0 0 5px 0;line-height:30px;padding:0 10px;border-radius:3px;color:#5a5a5a !important}
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active {text-decoration:none;background:#f3f3f3}
#bo_cate #bo_cate_on {z-index:2;border:1px solid #aaa;color:#253dbe;font-weight:bold}
a.btn_admin,.btn_admin {display:inline-block;background:#6c757d;color:#fff;text-decoration:none;vertical-align:middle} /* 관리자 전용 버튼 */
.btn_admin:hover, a.btn_admin:hover {background:#5a6268;color:#fff}

.btn_bo_user {float:right;margin:0;padding:0;list-style:none}
.btn_bo_user li {float:left;margin-left:5px}
.btn_bo_adm {float:left}
.btn_bo_adm li {float:left;margin-right:5px}
.btn_bo_adm input {padding:8px;border:0;background:#e8180c;color:#fff;text-decoration:none;vertical-align:middle}


/* 사이드뷰 */
.sv_wrap {position:relative;font-weight:normal}
.sv_wrap .sv {z-index:1000;display:none;margin:5px 0 0;font-size:0.92em;background:#333;
-webkit-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);}
.sv_wrap .sv:before{content: "";position: absolute;top: -6px;left: 15px;width: 0;height: 0;border-style: solid;border-width: 0 6px 6px 6px;border-color: transparent transparent #333 transparent;}
.sv_wrap .sv a {display:inline-block;margin:0;padding:0  10px;line-height:30px;width:100px;font-weight:normal;color:#bbb }
.sv_wrap .sv a:hover{background:#000;color:#fff}
.sv_member{color:#333}
.sv_on {display:block !important;position:absolute;top:23px;left:0px;width:auto;height:auto}
.sv_nojs .sv {display:block}


/* 페이징 */
.pg_wrap {clear:both;margin:30px 0 ;text-align:center}
.pg_wrap:after {display:block;visibility:hidden;clear:both;content:""} 
.pg {}
.pg_page, .pg_current {display:inline-block;vertical-align:middle;background:#f3f3f3;border:1px solid #bbbcc3}
.pg a:focus, .pg a:hover {text-decoration:none}
.pg_page {color:#555;font-size:1.083em;height:30px;line-height:28px;padding:0 5px;min-width:30px;text-decoration:none;border-radius:3px;}
.pg_page:hover{background-color:#ddd}
.pg_start {text-indent:-999px;overflow:hidden;background:url('../img/btn_first.gif') no-repeat 50% 50% #fff;padding:0;border:1px solid #bbb;}
.pg_prev {text-indent:-999px;overflow:hidden;background:url('../img/btn_prev.gif') no-repeat 50% 50% #fff;padding:0;border:1px solid #bbb}
.pg_end {text-indent:-999px;overflow:hidden;background:url('../img/btn_end.gif') no-repeat 50% 50% #fff;padding:0;border:1px solid #bbb}
.pg_next {text-indent:-999px;overflow:hidden;background:url('../img/btn_next.gif') no-repeat 50% 50% #fff;padding:0;border:1px solid #bbb}
.pg_start:hover,.pg_prev:hover,.pg_end:hover,.pg_next:hover{background-color:#fafafa}

.pg_current {display:inline-block;background:#4c4f6f;color:#fff;font-weight:bold;height:30px;line-height:30px;padding:0 10px;min-width:30px;border-radius:3px;-webkit-box-shadow: inset 1px 1px 2px #222542;-moz-box-shadow:  inset 1px 1px 2px #222542;box-shadow: inset 1px 1px 2px #222542;}


/* 회원 가입 */
.btn_box {text-align:center;padding-top:20px;}


/* 캡챠 자동등록(입력)방지 기본 -pc */
.is_captcha_use {padding-top: 20px;text-align:center;list-style-type:none}

#captcha {display:inline-block;position:relative}
#captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden;}
#captcha #captcha_img {height:40px;border:1px solid #898989;vertical-align:top;padding:0;margin:0}
#captcha #captcha_mp3 {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../../../img/captcha2.png') no-repeat;text-indent:-999px;border-radius:3px}
#captcha #captcha_reload {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../../../img/captcha2.png') no-repeat  0 -40px;text-indent:-999px;border-radius:3px}
#captcha #captcha_key {margin:0 0 0 3px;padding:0 5px;width:90px;height:40px;border:1px solid #ccc;background:#fff;font-size:1.333em;font-weight:bold;text-align:center;border-radius:3px;vertical-align:top}
#captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em}

/*기본 리스트*/
.list_01 li{border:1px solid #dbdbdb;background:#fff;border-radius:3px;margin:3px 0;padding:10px 15px;list-style:none;position:relative;}
.list_01 li:after {display:block;visibility:hidden;clear:both;content:""}
.list_01 li:hover{background:#f9f9f9}
.list_01 li.empty_li{text-align:center;padding:20px 0;color:#666}

/* 상단 바로가기 아이콘 */
#return-to-top {position: fixed; text-align:center; bottom: 20px;right: 20px;background: rgb(0, 0, 0);background: rgba(0, 0, 0, 0.7);width: 40px;height: 40px;display: block;text-decoration: none;-webkit-border-radius: 35px;-moz-border-radius: 35px;border-radius: 35px;display: none;-webkit-transition: all 0.3s linear;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
#return-to-top i {color: #fff;margin: 0;position: relative;left: 16px;top: 13px;font-size: 19px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
#return-to-top:hover {background: rgba(0, 0, 0, 0.9);}
#return-to-top:hover i {color: #fff;top: 5px;}

/* 접속자수 */
.connect {border-top: 1px solid rgba(0,0,0,0.3);padding:5px 0;}
.connect:last-child {border-bottom: 1px solid rgba(0,0,0,0.3)}
.connect .crt_name img {width: 20px;border-radius: 50%;margin-right: 5px;}
.connect .ri {text-align:right}
.connect a {color:#5a5a5a;}
.connect a:hover {text-decoration: none}

.password-container {max-width:450px !important;}

.memo_box {border-top:1px solid rgba(0,0,0,0.275);border-bottom:1px solid rgba(0,0,0,0.275);margin: 10px 0 5px;}
.memo_line {padding:3px 0}
.qa_link a, .mono a {color:#5a5a5a}
.qa_link a:hover, .mono a:hover {text-decoration:none;color:#333}

#ans_datetime {margin-top:10px;}

.p_lb {padding:0 10px 10px 0}


/* 자료 없는 목록 */
.empty_table {padding:100px 0 !important;text-align:center}
.empty_list {padding:20px 0 !important;text-align:center}




/*  하위 페이지에서 font-size개입이 생겨 사이즈 변경된다. 방지위해 재정의 */
.navbar-toggler {
  padding: .25rem .75rem;
  font-size: 1.25rem !important;
  line-height: 1;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: .25rem;
}

body {padding-bottom: 0;}
.carousel { padding-top: 8px;}



/*****************************************************************************************************************************/
/* bylee add  { **************************************************************************************************************/


/*************************** index > header   {   **********************************/
.text-title {
  font-size: 1.7rem;
  font-weight: 200;
  line-height: 1;
}
.display-1, .display-2, .display-3, .display-4 {
  letter-spacing: -.02em;
}

.pt-4, .py-4 {
  padding-top: 1rem!important;
}

.shortcut-logo {
  width:2em;
  height:2em;
}

@media (min-width: 768px) {
  .pt-md-11, .py-md-11 {
    padding-top: 6rem !important;
  }

  .text-md-left {
    text-align: left !important;
  }

  .text-center {
    text-align: center !important;
  }

  /* index.php text title > size 변경위해 */
  .text-title {
    font-size: 3rem;
    font-weight: 400;
    line-height: 1;
  }

  .shortcut-logo {
    width:2.5em;
    height:2.5em;
  }

  #short_menu > div > ul > li{
   /* margin: 2em !important; */
  }
}
/***************************   }   index > header    **********************************/

.text-size-1 { font-size:1.00em  !important;}
.text-size-2 { font-size:0.95em  !important}
.text-size-3 { font-size:0.90em  !important}
.text-size-4 { font-size:0.85em  !important}
.text-size-5 { font-size:0.80em !important}
.text-size-6 { font-size:0.75em !important}
.text-size-7 { font-size:0.65em !important}
.text-size-8 { font-size:0.55em !important}

.text-h-1 { font-size:2.00em  !important; font-weight: bold !important;}
.text-h-2 { font-size:1.9em  !important; font-weight: bold !important;}
.text-h-3 { font-size:1.8em  !important; font-weight: bold !important;}
.text-h-4 { font-size:1.6em  !important; font-weight: bold !important;}
.text-h-5 { font-size:1.5em  !important; font-weight: bold !important;}
.text-h-6 { font-size:1.4em  !important; font-weight: bold !important;}
.text-h-7 { font-size:1.2em  !important; font-weight: bold !important;}
.text-h-8 { font-size:1.1em  !important; font-weight: bold !important;}

.bg-gray-0 { background-color:#f9f9f9 !important;}
.bg-gray-1 { background-color:#f3f3f3 !important;}
.bg-gray-2 { background-color:#efefef !important;}
.bg-gray-3 { background-color:#C8C8C8 !important;}
.bg-gray-4 { background-color:#BEBEBE !important;}
.bg-gray-5 { background-color:#B4B4B4 !important;}
.bg-gray-6 { background-color:#AAAAAA !important;}
.bg-gray-7 { background-color:#666666 !important;}
.bg-gray-8 { background-color:#4d4d4d !important;}
.bg-gray-9 { background-color:#333333 !important;}



.bg-gray{
  background-color:#8c8c8c !important;
}
.bg-gray-light{
  background-color:#bfbfbf !important;
}
.bg-gray-lighter{
  background-color:#d9d9d9 !important;
}
.bg-gray-lightest{
  background-color:#f2f2f2 !important;
}

.bg-pink {
  background-color: #e91e63!important;
}
.bg-pink-light {
  background-color: #ff4081!important;
}

.bg-pink-lighter {
  background-color: #ff5177!important;
}


.bg-blue{
  background-color: #5677fc!important;
}
.bg-blue-light {
  background-color: #03a9f4!important;
}

.bg-blue-lighter {
  background-color: #40c4ff!important;
}


.bg-cyan{
  background-color: #00bcd4!important;
}
.bg-cyan-light {
  background-color: #18ffff!important;
}

.bg-indigo {
  background-color: #3f51b5!important;
}
.bg-indigo-light {
  background-color: #536dfe!important;
}

.bg-teal {
  background-color: #009688!important;
}
.bg-teal-light {
  background-color: #64ffda!important;
}

.bg-green {
  background-color: #259b24!important;
}
.bg-green-light {
  background-color: #8bc34a!important;
}

.bg-green-lighter {
  background-color: #b2ff59!important;
}
.bg-lime {
  background-color: #cddc39!important;
}
.bg-lime-light {
  background-color: #eeff41!important;
}

.bg-yellow {
  background-color: #ffeb3b!important;
}
.bg-yellow-light {
  background-color: #ffff00!important;
}
.bg-amber {
  background-color: #ffc107!important;
}
.bg-amber-light {
  background-color: #ffd740!important;
}
.bg-orange {
  background-color: #ff9800!important;
}
.bg-orange-light {
  background-color: #ffab40!important;
}
.bg-deep-orange {
  background-color: #ff5722!important;
}
.bg-deep-orange-light {
  background-color: #ff6e40!important;
}

/************* front color css {  *********************************/


.color-gray-1{
  color: #0c0c0c !important;
}
.color-gray-2{
  color: #202020 !important;
}
.color-gray-3{
  color: #383838 !important;
}
.color-gray-4{
  color: #4a4a4a !important;
}
.color-gray-5{
  color: #6e6e6e !important;
}
.color-gray-6{
  color: #878787 !important;
}
.color-gray-7{
  color: #a9a9a9 !important;
}
.color-gray-8{
  color: #c9c9c9 !important;
}

.color-gray{
  color:#8c8c8c !important;
}
.color-gray-light{
  color:#bfbfbf !important;
}
.color-gray-lighter{
  color:#d9d9d9 !important;
}
.color-gray-lightest{
  color:#f2f2f2 !important;
}

.color-pink {
  color: #e91e63!important;
}
.color-pink-light {
  color: #ff4081!important;
}

.color-pink-lighter {
  color: #ff5177!important;
}


.color-blue{
  color: #5677fc!important;
}
.color-blue-light {
  color: #03a9f4!important;
}

.color-blue-lighter {
  color: #40c4ff!important;
}


.color-cyan{
  color: #00bcd4!important;
}
.color-cyan-light {
  color: #18ffff!important;
}

.color-indigo {
  color: #3f51b5!important;
}
.color-indigo-light {
  color: #536dfe!important;
}

.color-teal {
  color: #009688!important;
}
.color-teal-light {
  color: #64ffda!important;
}

.color-green {
  color: #259b24!important;
}
.color-green-light {
  color: #8bc34a!important;
}

.color-green-lighter {
  color: #b2ff59!important;
}
.color-lime {
  color: #cddc39!important;
}
.color-lime-light {
  color: #eeff41!important;
}

.color-yellow {
  color: #ffeb3b!important;
}
.color-yellow-light {
  color: #ffff00!important;
}
.color-amber {
  color: #ffc107!important;
}
.color-amber-light {
  color: #ffd740!important;
}
.color-orange {
  color: #ff9800!important;
}
.color-orange-light {
  color: #ffab40!important;
}
.color-deep-orange {
  color: #ff5722!important;
}
.color-deep-orange-light {
  color: #ff6e40!important;
}


/*** }  front color css   *************************************/

.project-title {
  font-size: 1.25rem;
}

.project-skill {
  font-size: 0.9rem;
  font-weight: 400;
  letter-spacing: 0.06rem;
}

.project-info-box {
  margin: 15px 0;
  background-color: #fff;
  padding: 30px 40px;
  border-radius: 5px;
}

.project-info-box p {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #d5dadb;
}

.project-info-box p:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

/*--- default effect ---*/
.hovereffect {
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  z-index: 2;
}

.hovereffect .overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  opacity: 0;
  background-color: rgba(0, 0, 0, 0.25);
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  border-radius: 5px;
}

.primary-dark .hovereffect .overlay {
  background-color: rgba(215, 48, 39, 0.95);
}

.white .hovereffect .overlay {
  background-color: rgba(255, 255, 255, 0.75);
}

.dark-overlay .hovereffect .overlay {
  background-color: rgba(0, 0, 0, 0.5);
}

.hovereffect img {
  display: block;
  position: relative;
  -webkit-transition: all .3s linear;
  transition: all .3s linear;
  border: 10px solid #fff;
  border-radius: 5px;
}


/****************  Mobile   Modal Right Menu   {  *************************************/

.modal.left .modal-dialog,
.modal.right .modal-dialog {
  position: fixed;
  margin: auto;
  width: 320px;
  height: 100%;
  -webkit-transform: translate3d(0%, 0, 0);
  -ms-transform: translate3d(0%, 0, 0);
  -o-transform: translate3d(0%, 0, 0);
  transform: translate3d(0%, 0, 0);
}

.modal.left .modal-content,
.modal.right .modal-content {
  height: 100%;
  overflow-y: auto;
}

.modal.left .modal-body,
.modal.right .modal-body {
  padding: 15px 15px 80px;
}


/*Right*/
.modal.right.fade .modal-dialog {
  right: 0px;
  -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
  -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
  -o-transition: opacity 0.3s linear, right 0.3s ease-out;
  transition: opacity 0.3s linear, right 0.3s ease-out;
}

.modal.right.fade.in .modal-dialog {
  right: 0;
}

/* ----- MODAL STYLE ----- */

.modal-content {
  border-radius: 0;
  border: none;
}

.modal-header {
  border-bottom-color: #EEEEEE;
  background-color: #FAFAFA;
}

/****************   }   Mobile   Modal Right Menu   ************************************/



.img-btn{
  text-decoration: none;
  border: none;
  cursor: pointer;
}

.img-btn:active{
  transform: scale(0.96);
  /* Scaling button to 0.98 to its original size */
  box-shadow: 3px 2px 22px 1px rgba(78, 78, 78, 0.79);
  /* Lowering the shadow */
}

.readonly { background-color: #d5d5d5 !important;}

/** font type & size 정의 **/
body, div, input, textarea, select, button,a,table {
  font-family: 'Malgun Gothic',"맑은 고딕",AppleGothic,-apple-system, BlinkMacSystemFont, "Helvetica Neue", "Apple SD Gothic Neo",Dotum,"돋움", Arial, sans-serif !important;
  font-size: 0.99em !important;
}

/* bootstrap. override */
a {
  color: inherit; /*color: #3e3e3e !important; */
  text-decoration: none;
  background-color: transparent;
}

a:link, a:visited {
  color: inherit;
  text-decoration: none;
}

a:hover {
  text-decoration : none;
}

/* list > paging 정보 박스 */
.bo_list_total {
  /*float: left;*/
  display: inline-block;
  line-height: 30px;
  font-size: 0.92em !important;
  color: #4e546f;
  background: #d4d4d4;
  padding: 0 10px;
  border-radius: 5px;
  margin-bottom: 6px;
}

.modal-menu-item {
  font-size: 16px !important;
}


.bg-gray-0 { background-color:#f9f9f9 !important;}
.bg-gray-1 { background-color:#f3f3f3 !important;}
.bg-gray-2 { background-color:#efefef !important;}
.bg-gray-3 { background-color:#C8C8C8 !important;}
.bg-gray-4 { background-color:#BEBEBE !important;}
.bg-gray-5 { background-color:#B4B4B4 !important;}
.bg-gray-6 { background-color:#AAAAAA !important;}

.copyright { font-size:14px !important; }

/** .frm_input{height:35px;line-height:32px;border:1px solid #d5d5d5;}   **/
.frm_srch_input {height:30px;line-height:30px; border:1px solid #d5d5d5 !important;}

.ui-datepicker-trigger {height:30px; background-color: #e7e7e7 !important; border-top:1px solid #d5d5d5; border-right:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5; border-left:0px;}
.ui-datepicker-trigger img { margin-bottom: 1px;}



/************************  jquery datepicker button  ************************************/
/*
button.ui-datepicker-trigger {
  padding-top:1px !important;
  padding-bottom:1px !important;
  padding-right:3px !important;
  padding-left:3px !important;
}


input.hasDatepicker {
  border:1px solid #d1d1d1 !important;
}

button.ui-datepicker-trigger {
  border:1px solid #d1d1d1 !important;
}

button.ui-datepicker-trigger img {
  vertical-align:baseline;
  position:relative; !important;
  top:2px !important;
}
*/



/********  only xs size screen (mobile screen )  ******************************/
@media (max-width: 576px) {
  /* bootstrap > page navigation */
  .page-item.disabled .page-link {
    color: #dce0e3  !important;
  }
  .copyright {font-size: 13.5px !important;}
  .main_dashboard { font-size:14px !important;}

  .main_copy {font-size:16px !important;}
}