/* 텍스트 굵기 스타일 */
/* 컬러 스타일 */
/* 배경 스타일 */
/* 상태별 색상 스타일 */
/* 모든 컨트롤에 적용될 기본 폰트 */
/* 기본 텍스트 색상 */
/* disable 상태를 나타내는 텍스트 색상 */
/* 기본 보더 색상 */
/* 포커스 보더 색상 */
/* Disable 상태의 보더 색상. */
/* 내부에 아이템을 갖는 컨트롤의 경우, 각 아이템에 마우스 호버시의 텍스트 색상 */
/* 내부에 아이템을 갖는 컨트롤의 경우, 각 아이템에 마우스 호버시의 배경 색상 */
/* 내부에 아이템을 갖는 컨트롤의 경우, 각 아이템에 선택된 경우 텍스트 색상 */
/* 내부에 아이템을 갖는 컨트롤의 경우, 각 아이템이 선택된 경우 배경 색상 */
/* 내부에 아이템을 갖는 컨트롤이 Disabled된 경우, 각 아이템에 선택된 경우 텍스트 색상 */
/* 내부에 아이템을 갖는 컨트롤의 Disabled된 경우, 각 아이템이 선택된 경우 배경 색상 */
/**
 * 로그인 화면에서 쓰이는 스타일
 */
.cl-container.login-wrap {
  background-color: #7FCBD8;
  background-image: none;
}
.cl-container.login-wrap .cl-container.login-logo {
  background-image: url(images/login-profile.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  top: calc(-150%);
}
.cl-container.login-wrap .cl-container.login-box {
  background-color: rgba(255, 255, 255, 0.4);
  border-radius: 10px;
}
.cl-container.login-wrap .cl-container.login-box .cl-output.login-title {
  font-size: 30px;
  text-align: center;
}
.cl-container.login-wrap .cl-container.login-box .cl-inputbox.login-id {
  background-image: url(images/human.png);
  background-size: 9%;
  background-repeat: no-repeat;
  background-position: 11px 50%;
  border-radius: 10px;
  padding-left: 55px;
  border: none;
}
.cl-container.login-wrap .cl-container.login-box .cl-inputbox.login-pw {
  background-image: url(images/locker.png);
  background-repeat: no-repeat;
  background-position: 13px 50%;
  background-size: 8%;
  border-radius: 10px;
  padding-left: 55px;
  border: none;
}
.cl-container.login-wrap .cl-container.login-box .cl-button.btn-login {
  background-image: none;
  background-color: #F98C0B;
  border: 0px;
  border-radius: 18px;
  color: #fff;
  font-size: 17px;
  text-shadow: none;
}
.cl-container.login-wrap .cl-container.login-box .cl-button.btn-login:not(.cl-disabled).cl-activated,
.cl-container.login-wrap .cl-container.login-box .cl-button.btn-login:not(.cl-disabled):active {
  opacity: 0.9;
}
.cl-container.login-wrap .cl-container.login-box .cl-button.btn-reg {
  background-image: none;
  background-color: #3579A8;
  border: 0px;
  border-radius: 18px;
  color: #fff;
  font-size: 17px;
  text-shadow: none;
}
.cl-container.login-wrap .cl-container.login-box .cl-button.btn-reg:not(.cl-disabled).cl-activated,
.cl-container.login-wrap .cl-container.login-box .cl-button.btn-reg:not(.cl-disabled):active {
  opacity: 0.9;
}
.cl-container.login-wrap .cl-container.login-box .cl-checkbox.login-text .cl-text {
  color: #283758;
  font-size: 11px;
  padding-left: 5px;
}
.cl-container.login-wrap .cl-container.login-box .cl-checkbox.login-text .cl-checkbox-icon {
  background-image: url(images/page3_login_uncheck-box.jpg);
  background-size: 21px 20px;
  border-radius: 3px;
}
.cl-container.login-wrap .cl-container.login-box .cl-checkbox.login-text.cl-checked {
  /* 체크된 체크박스 hover시 아이콘 스타일 */
}
.cl-container.login-wrap .cl-container.login-box .cl-checkbox.login-text.cl-checked .cl-checkbox-icon {
  background-image: url(images/page3_login_checkbox.jpg);
}
.cl-container.login-wrap .cl-container.login-box .cl-checkbox.login-text.cl-checked:hover .cl-checkbox-icon,
.cl-container.login-wrap .cl-container.login-box .cl-checkbox.login-text.cl-checked.cl-hover .cl-checkbox-icon {
  background-image: url(images/page3_login_checkbox.jpg);
}
/**
 * 타이틀
 */
.cl-output.main-title {
  color: #0F9DB3;
  font-weight: 700;
  font-size: 15px;
}
.cl-output.grid-row {
  color: #EF2636;
  font-weight: 700;
  text-align: center;
}
.cl-output.menu-top {
  color: #fff;
  font-size: 9pt;
  text-align: right;
}
.cl-container.header-line {
  border-bottom: 1px solid #E0E4E3;
}
.header-route {
  color: #A7A7A7;
  font-size: 10px;
}
.route-now {
  color: #0F9DB3;
  font-size: 10px;
}
/**
 * 버튼
 */
.cl-button.btn-search {
  background-image: url(images/icon_search_02.png);
  background-repeat: no-repeat;
  background-position: 10px center;
  background-color: #283758;
  background-size: 13px 12px;
  border: none;
  border-radius: 3px;
  color: #fff;
  padding-left: 30px;
  text-shadow: none;
  text-align: left;
}
.cl-button.btn-search:not(.cl-disabled):hover {
  color: #fff;
}
.cl-button.btn-search:not(.cl-disabled).cl-activated,
.cl-button.btn-search:not(.cl-disabled):active {
  background-image: url(images/icon_search_02.png);
  background-color: #283758;
  opacity: 0.9;
}
.cl-button.btn-search.cl-disabled {
  background-color: #ccc;
  color: #666;
}
.cl-button.btn-excel {
  padding-left: 18px;
  background-color: #fff;
  background-image: url(images/download_01.jpg);
  background-repeat: no-repeat;
  background-position: 5px 50%;
  background-size: 15px 14px;
  border-color: #D9D9D9;
  border-radius: 3px;
  font-size: 12px;
  font-weight: 700;
}
.cl-button.btn-excel:not(.cl-disabled):hover {
  color: #333;
}
.cl-button.btn-excel:not(.cl-disabled).cl-activated,
.cl-button.btn-excel:not(.cl-disabled):active {
  background-color: #fff;
  background-image: url(images/download_01.jpg);
  border-color: #6C6C6C;
  opacity: 1;
}
.cl-button.btn-new {
  background-color: #fff;
  background-image: url(images/icon_plus01.png);
  background-repeat: no-repeat;
  background-position: 10px 50%;
  background-size: 8px 9px;
  border-color: #D9D9D9;
  border-radius: 3px;
  padding-left: 15px;
}
.cl-button.btn-new:not(.cl-disabled).cl-activated,
.cl-button.btn-new:not(.cl-disabled):active {
  background-color: #fff;
  background-image: url(images/icon_plus01.png);
  border-color: #6C6C6C;
  opacity: 1;
}
.cl-button.btn-common {
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: 10px 50%;
  background-size: 8px 9px;
  border-color: #D9D9D9;
  border-radius: 3px;
}
.cl-button.btn-common:not(.cl-disabled).cl-activated,
.cl-button.btn-common:not(.cl-disabled):active {
  background-color: #fff;
  border-color: #6C6C6C;
  opacity: 1;
}
.cl-button.btn-delete-save {
  background-color: #0F9DB3;
  background-image: url(images/icon_lubbish.png);
  background-repeat: no-repeat;
  background-position: 10px 50%;
  background-size: 10px 10px;
  border-color: #0F9DB3;
  border-radius: 3px;
  color: #fff;
  text-shadow: none;
  padding-left: 15px;
}
.cl-button.btn-delete-save:not(.cl-disabled):hover {
  color: #fff;
}
.cl-button.btn-delete-save:not(.cl-disabled).cl-activated,
.cl-button.btn-delete-save:not(.cl-disabled):active {
  background-color: #0F9DB3;
  background-image: url(images/icon_lubbish.png);
  border-color: #0F9DB3;
  opacity: 0.9;
}
.cl-button.btn-delete {
  background-color: #fff;
  background-image: url(images/btn_del.png);
  background-repeat: no-repeat;
  background-position: 10px 50%;
  background-size: 13px 13px;
  border-color: #D9D9D9;
  border-radius: 3px;
  padding-left: 15px;
}
.cl-button.btn-delete:not(.cl-disabled).cl-activated,
.cl-button.btn-delete:not(.cl-disabled):active {
  background-color: #fff;
  background-image: url(images/icon_lubbish.png);
  border-color: #6C6C6C;
  opacity: 0.9;
}
.cl-button.btn-save {
  background-color: #0F9DB3;
  background-image: url(images/icon_save.jpg);
  background-repeat: no-repeat;
  background-position: 10px 50%;
  background-size: 11px 11px;
  border-color: #0F9DB3;
  border-radius: 3px;
  color: #fff;
  text-shadow: none;
  padding-left: 15px;
}
.cl-button.btn-save:not(.cl-disabled):hover {
  color: #fff;
}
.cl-button.btn-save:not(.cl-disabled).cl-activated,
.cl-button.btn-save:not(.cl-disabled):active {
  background-color: #0F9DB3;
  background-image: url(images/icon_save.jpg);
  border-color: #0F9DB3;
  opacity: 0.9;
}
.cl-button.btn-commit,
.cl-button.btn-commit:hover,
.cl-button.btn-commit.cl-hover,
.cl-button.btn-commit:active,
.cl-button.btn-commit.cl-active {
  background-color: #0F9DB3;
  border-color: #0F9DB3;
  border-radius: 3px;
  color: #fff;
  text-shadow: none;
}
.cl-button.btn-commit:not(.cl-disabled):hover,
.cl-button.btn-commit:hover:not(.cl-disabled):hover,
.cl-button.btn-commit.cl-hover:not(.cl-disabled):hover,
.cl-button.btn-commit:active:not(.cl-disabled):hover,
.cl-button.btn-commit.cl-active:not(.cl-disabled):hover {
  color: #fff;
}
.cl-button.btn-commit:not(.cl-disabled).cl-activated,
.cl-button.btn-commit:hover:not(.cl-disabled).cl-activated,
.cl-button.btn-commit.cl-hover:not(.cl-disabled).cl-activated,
.cl-button.btn-commit:active:not(.cl-disabled).cl-activated,
.cl-button.btn-commit.cl-active:not(.cl-disabled).cl-activated,
.cl-button.btn-commit:not(.cl-disabled):active,
.cl-button.btn-commit:hover:not(.cl-disabled):active,
.cl-button.btn-commit.cl-hover:not(.cl-disabled):active,
.cl-button.btn-commit:active:not(.cl-disabled):active,
.cl-button.btn-commit.cl-active:not(.cl-disabled):active {
  background-color: #0F9DB3;
  border-color: #0F9DB3;
  opacity: 0.9;
}
.cl-button.btn-logout {
  background-color: #0F9DB3;
  background-image: url(images/page3_icon_logout.png);
  background-repeat: no-repeat;
  background-position: 90% 50%;
  background-size: 9px 8px;
  border-color: #fff;
  border-radius: 11px;
  color: #fff;
  font-size: 13px;
  text-align: left;
  text-shadow: none;
  padding-left: 11px;
}
.cl-button.btn-logout:not(.cl-disabled):hover {
  color: #fff;
}
.cl-button.btn-logout:not(.cl-disabled).cl-activated,
.cl-button.btn-logout:not(.cl-disabled):active {
  background-image: url(images/page3_icon_logout.png);
  background-color: #0F9DB3;
  border-color: #fff;
  opacity: 0.9;
}
.cl-button.btn-close {
  background-color: #fff;
  border-color: #D9D9D9;
  background-image: url(images/cancel_01.png);
  background-size: 14px 14px;
  background-repeat: no-repeat;
  background-position: center;
}
.cl-button.btn-close:not(.cl-disabled).cl-activated,
.cl-button.btn-close:not(.cl-disabled):active {
  background-color: #fff;
  background-image: url(images/cancel_01.png);
  border-color: #6C6C6C;
  opacity: 1;
}
.cl-button.btn-undo {
  background-color: #fff;
  border-color: #D9D9D9;
  background-image: url(images/return_01.png);
  background-size: 15px 16px;
  background-repeat: no-repeat;
  background-position: center;
}
.cl-button.btn-undo:not(.cl-disabled).cl-activated,
.cl-button.btn-undo:not(.cl-disabled):active {
  background-color: #fff;
  background-image: url(images/return_01.png);
  border-color: #6C6C6C;
  opacity: 1;
}
.cl-button.btn-file {
  background-color: #707680;
  color: #fff;
  font-size: 13px;
  text-shadow: none;
  border-radius: 3px;
}
.cl-button.btn-file:not(.cl-disabled):hover {
  color: #fff;
}
.cl-button.btn-file:not(.cl-disabled).cl-activated,
.cl-button.btn-file:not(.cl-disabled):active {
  background-color: #707680;
  opacity: 0.9;
}
.cl-button.btn-list1 {
  background-color: #fff;
  border-color: #D9D9D9;
  background-image: url(images/open_menu_01.png);
  background-size: 13px 10px;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 3px;
}
.cl-button.btn-list1:not(.cl-disabled).cl-activated,
.cl-button.btn-list1:not(.cl-disabled):active {
  background-color: #fff;
  background-image: url(images/open_menu_01.png);
  border-color: #6C6C6C;
  opacity: 1;
}
.cl-button.btn-list2 {
  background-color: #fff;
  border-color: #D9D9D9;
  background-image: url(images/close-menu_01.png);
  background-size: 11px 11px;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 3px;
}
.cl-button.btn-list2:not(.cl-disabled).cl-activated,
.cl-button.btn-list2:not(.cl-disabled):active {
  background-color: #fff;
  background-image: url(images/close-menu_01.png);
  border-color: #6C6C6C;
  opacity: 1;
}
.cl-button.btn-menu-close {
  background-color: #fff;
  background-image: url(images/hide-menu_01.jpg);
  border: none;
}
.cl-button.btn-menu-close:not(.cl-disabled).cl-activated,
.cl-button.btn-menu-close:not(.cl-disabled):active {
  background-color: #fff;
  background-image: url(images/hide-menu_01.jpg);
  border-color: #6C6C6C;
  opacity: 1;
}
/* 팝업화면 닫기 버튼 */
.cl-button.btn-pop-close,
.cl-button.btn-pop-close:hover,
.cl-button.btn-pop-close.cl-hover,
.cl-button.btn-pop-close:active,
.cl-button.btn-pop-close.cl-active {
  text-shadow: none;
  background-color: #fff;
  border-color: none;
}
/* 팝업호출 버튼 스타일 */
.cl-button.btn-pop,
.cl-button.btn-pop:hover,
.cl-button.btn-pop.cl-hover,
.cl-button.btn-pop:active,
.cl-button.btn-pop.cl-active {
  text-shadow: none;
  background-repeat: no-repeat;
  text-align: center;
  background-image: linear-gradient(#F6D76E, #FAEBB6);
}
/* button 돋보기 검색 */
.cl-button.btn-pop-search {
  background: url("images/button/btn_sch3.png") no-repeat;
  background-position: center;
  background-color: #FFFFFF;
  border-style: none;
  border-radius: 0px;
}
.cl-button.btn-grid-close {
  background: url("images/close.png") no-repeat;
  background-position: center;
  background-color: #FFFFFF;
  border-style: none;
  border-radius: 0px;
}
.cl-container.search-box {
  background-color: #f5f5f3;
  border: solid 1px #dfdfdf;
}
.cl-container.search-box .cl-output {
  font-weight: 700;
  padding-right: 12px;
  text-align: right;
}
.cl-container.search-box .cl-output.require {
  background-color: #ebf7f7;
  background-image: url(images/point-menu_01.png);
  background-repeat: no-repeat;
  background-position: calc(97%) center;
}
.cl-inputbox.menu-search-box {
  font: 13px 'Noto Sans', 'Malgun Gothic';
  color: #333;
  border: 1px solid #bbb;
  background-color: #fff;
  background-image: url(images/icon_search_01.png);
  background-repeat: no-repeat;
  background-position: 95%;
  border-radius: 3px;
  border-color: #D9D9D9;
  /* 인풋 박스 텍스트 */
  /* 인풋 박스 - 포커스 상태 */
  /* 인풋 박스 - disabled 상태 */
}
.cl-inputbox.menu-search-box.cl-focus {
  border-color: #0F9DB3;
}
.cl-inputbox.menu-search-box.cl-disabled {
  border-color: #ddd;
  background-image: none;
  background-color: #ccc;
  color: #333;
}
/**
 * 메인 메뉴
 */
.cl-tree.main-menu {
  border: 0px;
}
.cl-tree.main-menu .cl-tree-list {
  border-bottom: 1px solid #C5C5C5;
}
.cl-tree.main-menu .cl-tree-item {
  padding: 10px;
  /* 상위 메뉴 */
  /* 하위 메뉴 */
}
.cl-tree.main-menu .cl-tree-item .cl-text {
  font-weight: 700;
  background-image: url(images/page2_menu_icon.png);
  background-repeat: no-repeat;
  background-position: right center;
  padding: 3px;
  font-size: 14px;
}
.cl-tree.main-menu .cl-tree-item.cl-folder {
  border-top: 1px solid #C5C5C5;
  /*2dpepth*/
}
.cl-tree.main-menu .cl-tree-item.cl-folder .cl-tree-itemicon {
  background-image: none;
}
.cl-tree.main-menu .cl-tree-item.cl-folder.cl-expanded > .cl-text {
  background-image: url(images/page2_menu_icon_off.png);
  background-size: 11px 7px;
  background-position: right center;
}
.cl-tree.main-menu .cl-tree-item.cl-folder.cl-collapsed > .cl-text {
  background-image: url(images/page2_menu_icon.png);
  background-size: 11px 7px;
  background-position: right center;
}
.cl-tree.main-menu .cl-tree-item.cl-folder.cl-expanded > .cl-tree-treeicon {
  background-image: none;
}
.cl-tree.main-menu .cl-tree-item.cl-folder.cl-collapsed > .cl-tree-treeicon {
  background-image: none;
}
.cl-tree.main-menu .cl-tree-item.cl-folder.sub-menu {
  padding: 9px;
  background-color: #EEEEEE;
  border-top: 1px solid #dcdcdc;
}
.cl-tree.main-menu .cl-tree-item.cl-folder.sub-menu.cl-expanded .cl-text {
  background-image: url(images/bg_2depth_off.png);
  background-size: 10px 10px;
  background-position: right center;
}
.cl-tree.main-menu .cl-tree-item.cl-folder.sub-menu.cl-collapsed .cl-text {
  background-image: url(images/bg_2depth_on.png);
  background-size: 10px 10px;
  background-position: right center;
}
.cl-tree.main-menu .cl-tree-item.cl-leaf {
  background-color: #ebebeb;
  border-color: #dcdcdc;
  padding: 9px;
}
.cl-tree.main-menu .cl-tree-item.cl-leaf .cl-text {
  background-image: url(images/depth3_menu_icon.png);
  background-size: 7px 7px;
  background-position: left center;
  font-weight: 300;
  font-size: 13px;
  padding: 0px 0px 0px 16px;
}
.cl-tree.main-menu .cl-tree-item.cl-leaf .cl-tree-itemicon {
  background: none;
}
.cl-tree.main-menu .cl-tree-item.cl-leaf.cl-selected {
  background-color: #F4F4F4;
  color: #0F9DB3;
}
.cl-tree.main-menu .cl-tree-item.cl-leaf.cl-selected .cl-text {
  text-decoration: underline;
}
.cl-tree.main-menu .cl-tree-item.cl-selected {
  background-color: #fff;
  color: #0F9DB3;
  font-weight: 700;
}
.cl-tree.main-menu .cl-tree-item.cl-selected.sub-menu {
  background-color: #f5f5f5;
  border-bottopm: 1px solid #dcdcdc;
}
.cl-tree.main-menu:not(.cl-disabled) .cl-tree-item:not(.cl-disabled) {
  /* 트리 아이템 - hover */
  /* 하위 메뉴 */
}
.cl-tree.main-menu:not(.cl-disabled) .cl-tree-item:not(.cl-disabled):not(.cl-selected).cl-hover,
.cl-tree.main-menu:not(.cl-disabled) .cl-tree-item:not(.cl-disabled):not(.cl-selected):hover {
  background-color: #fff;
  color: #0F9DB3;
  font-weight: 700;
}
.cl-tree.main-menu:not(.cl-disabled) .cl-tree-item:not(.cl-disabled):not(.cl-selected).cl-hover.sub-menu,
.cl-tree.main-menu:not(.cl-disabled) .cl-tree-item:not(.cl-disabled):not(.cl-selected):hover.sub-menu {
  background-color: #f5f5f5;
}
.cl-tree.main-menu:not(.cl-disabled) .cl-tree-item:not(.cl-disabled).cl-leaf:not(.cl-selected).cl-hover,
.cl-tree.main-menu:not(.cl-disabled) .cl-tree-item:not(.cl-disabled).cl-leaf:not(.cl-selected):hover {
  background-color: #ebebeb;
  color: #0F9DB3;
}
.cl-tree.main-menu:not(.cl-disabled) .cl-tree-item:not(.cl-disabled).cl-leaf:not(.cl-selected).cl-hover .cl-text,
.cl-tree.main-menu:not(.cl-disabled) .cl-tree-item:not(.cl-disabled).cl-leaf:not(.cl-selected):hover .cl-text {
  text-decoration: underline;
}