/* ----------------------------------

Name: custom.kendo.css
Categorie : kendoUI 레이아웃, 플러그인, 컴포넌트, 버튼 등의 재정의 (공통)
Author : 이상혁
Version : v.1.0
Created : 2022-03-03
Last update : 2022-03-03

-------------------------------------

Table of contents

    01. kendoUI 커스텀
    02. 버튼
    03. 그리드
    04. 팝업
    05. 컴포넌트 재정의
    06. 웹접근성 테이블내의 컴포넌트 재정의

*/

/* ===================================
	01. kendoUI 커스텀 시작
====================================== */
.k-input {

}
.k-textbox > input,
.k-autocomplete .k-input,
.k-multiselect-wrap .k-input,
.k-picker-wrap .k-input,
.k-numeric-wrap .k-input,
.k-dropdown-wrap .k-input,
.k-selectbox .k-input,
.k-ie .k-autocomplete .k-input,
.k-ie .k-textbox > input,
.k-ie .k-picker-wrap .k-input,
.k-ie .k-numeric-wrap .k-input,
.k-ie .k-combobox .k-input {
    padding: 4px;
    box-sizing: border-box;
    height: 34px;
}
.k-daterangepicker .k-textbox,
.k-ie input.k-textbox {
    height: 36px;
    text-overflow: ellipsis;
    padding-right: 22px;
}
.k-autocomplete,
.k-combobox,
.k-datepicker,
.k-timepicker,
.k-datetimepicker,
.k-colorpicker,
.k-numerictextbox,
.k-dropdown,
.k-dropdowntree,
.k-selectbox,
.k-multiselect,
.k-textbox,
.k-listbox {
    width: auto;
}
.k-dropdown {
    min-width: 120px;
}
.input-group[class*="col-"] .k-autocomplete,
.input-group[class*="col-"] .k-combobox,
.input-group[class*="col-"] .k-datepicker,
.input-group[class*="col-"] .k-timepicker,
.input-group[class*="col-"] .k-datetimepicker,
.input-group[class*="col-"] .k-colorpicker,
.input-group[class*="col-"] .k-numerictextbox,
.input-group[class*="col-"] .k-daterangepicker,
.input-group[class*="col-"] .k-dropdown,
.input-group[class*="col-"] .k-dropdowntree,
.input-group[class*="col-"] .k-selectbox,
.input-group[class*="col-"] .k-multiselect,
.input-group[class*="col-"] .k-textbox,
.input-group[class*="col-"] .k-listbox {
    width: 100%;
    min-width: auto;
}
.input-group[class~="col"] > .k-autocomplete,
.input-group[class~="col"] > .k-combobox,
.input-group[class~="col"] > .k-datepicker,
.input-group[class~="col"] > .k-timepicker,
.input-group[class~="col"] > .k-datetimepicker,
.input-group[class~="col"] > .k-colorpicker,
.input-group[class~="col"] > .k-numerictextbox,
.input-group[class~="col"] > .k-daterangepicker,
.input-group[class~="col"] > .k-dropdown,
.input-group[class~="col"] > .k-dropdowntree,
.input-group[class~="col"] > .k-selectbox,
.input-group[class~="col"] > .k-multiselect,
.input-group[class~="col"] > .k-textbox,
.input-group[class~="col"] > .k-listbox {
    width: 100%;
    min-width: auto;
}
.input-group[class*="col-"] .k-dropdown,
.input-group[class~="col"] > .k-dropdown {
    white-space: normal;
}
.form-group[class*="col-"] .k-autocomplete,
.form-group[class*="col-"] .k-combobox,
.form-group[class*="col-"] .k-datepicker,
.form-group[class*="col-"] .k-timepicker,
.form-group[class*="col-"] .k-datetimepicker,
.form-group[class*="col-"] .k-colorpicker,
.form-group[class*="col-"] .k-numerictextbox,
.form-group[class*="col-"] .k-daterangepicker,
.form-group[class*="col-"] .k-dropdown,
.form-group[class*="col-"] .k-dropdowntree,
.form-group[class*="col-"] .k-selectbox,
.form-group[class*="col-"] .k-multiselect,
.form-group[class*="col-"] .k-textbox,
.form-group[class*="col-"] .k-listbox {
    width: 100%;
    min-width: auto;
}
.form-group[class~="col"] > .k-autocomplete,
.form-group[class~="col"] > .k-combobox,
.form-group[class~="col"] > .k-datepicker,
.form-group[class~="col"] > .k-timepicker,
.form-group[class~="col"] > .k-datetimepicker,
.form-group[class~="col"] > .k-colorpicker,
.form-group[class~="col"] > .k-numerictextbox,
.form-group[class~="col"] > .k-daterangepicker,
.form-group[class~="col"] > .k-dropdown,
.form-group[class~="col"] > .k-dropdowntree,
.form-group[class~="col"] > .k-selectbox,
.form-group[class~="col"] > .k-multiselect,
.form-group[class~="col"] > .k-textbox,
.form-group[class~="col"] > .k-listbox {
    width: 100%;
    min-width: auto;
}
.form-group[class*="col-"] .k-dropdown,
.form-group[class~="col"] > .k-dropdown {
    white-space: normal;
}
.k-textbox,
.k-textbox > input,
.k-textbox > .k-input,
.k-textarea,
.k-textarea > textarea,
.k-textarea > .k-input .k-multiselect .k-input,
.k-input[type="text"],
.k-input[type="number"],
.k-picker-wrap .k-input {
    font-size: 14px;
}
.k-block, .k-widget {
    background-color: inherit;
}

.k-animation-container,
.k-widget,
.k-widget *,
.k-animation-container *,
.k-widget *:before,
.k-animation-container *:after,
.k-block .k-header,
.k-list-container {
    box-sizing: border-box;
}
.k-widget.k-stepper * {
    box-sizing: content-box;
}

.k-multicheck-wrap .k-item .k-label span {
    line-height: 24px;
    margin-left: 4px;
}
.k-header > .k-grid-filter {

}
.k-grid-filter.k-state-active {
    background-color: rgba(229, 235, 240, 0);
    box-shadow: none;
}
.k-grid-filter.k-state-active .k-i-filter:before {
    color: #007ea8;
}
.k-numeric-wrap .k-input {
    text-align: right;
}
/* ===================================
	01. kendoUI 커스텀 끝
====================================== */

/* ===================================
	02. 버튼 시작
====================================== */
.btn.k-button::before {
    opacity: 1;
}
.k-button-icontext .k-icon:before {
    width: 20px;
    /* height: 20px; */
}
.k-button-icontext .k-icon {
    width: 20px;
    height: 20px;
}
.k-button-lg.k-button-icontext .k-icon:before {
    width: 30px;
    height: 30px;
}
.k-button-lg.k-button-icontext .k-icon {
    width: 30px;
    height: 30px;
}

.k-button-blue {
    border-color: #125faa;
    color: #fff !important;
    background-color: #1a85ee;
}
.k-button-blue:hover {
    border-color: #125faa;
    color: #fff !important;
    background-color: #1479dd;
}
.k-button-green {
    border-color: #008d64;
    color: #fff !important;
    background-color: #07b381;
}
.k-button-green:hover {
    border-color: #008d64;
    color: #fff !important;
    background-color: #049e71;
}
.k-button-skyBlue {
    border-color: #125faa;
    color: #fff !important;
    background-color: #00aeff;
}
.k-button-skyBlue:hover {
    border-color: #125faa;
    color: #fff !important;
    background-color: #0095da;
}
.k-button-darkBlue {
    border-color: #1f292e;
    color: #fff !important;
    background-color: #3c525c;
}
.k-button-darkBlue:hover {
    border-color: #1f292e;
    color: #fff !important;
    background-color: #2d424c;
}
.k-button-red {
    border-color: #d62f2f;
    color: #fff !important;
    background-color: #ff6c6c;
}
.k-button-red:hover {
    border-color: #d62f2f;
    color: #fff !important;
    background-color: #ff5959;
}
.kist-btn-rowRemove {
	padding: 3px 8px;
}


/* 검수시작 버튼 */
.k-button-checkstart,
.k-button-checkstart:hover {
    border-color: #769db3;
    color: #fff;
    background-color: #84b2bd;
}
/* 검수완료 버튼 */
.k-button-checkok,
.k-button-checkok:hover {
    border-color: #719677;
    color: #fff;
    background-color: #8bb195;
}
/* 등록 버튼 */
.k-button-ins,
.k-button-ins:hover {
    border-color: #6088b7;
    color: #fff;
    background-color: #7ea3ce;
}
/* 직권등록 버튼 */
.k-button-authins,
.k-button-authins:hover {
    border-color: #6088b7;
    color: #fff;
    background-color: #7ea3ce;
}
/* 지도 버튼 */
.k-button-map,
.k-button-map:hover {
    border-color: #8aa25f;
    color: #fff;
    background-color: #a5bd77;
}
/* 수정요청 버튼 */
.k-button-modifycall,
.k-button-modifycall:hover {
    border-color: #c7864b;
    color: #fff;
    background-color: #e69850;
}

.k-button-lg {
    padding: 4px 16px;
    font-size: 18px;
    font-weight: bold;
}
.k-button-skyBlue .k-i-arrow-chevron-right {
    margin-left: 10px;
}
.k-i-zoom:before {
    content: "";
    background: url(../../web/images/excel_up/ico_btn_zoom.png) no-repeat 50% 50%;
}
.k-i-file-excel:before {
    content: "";
    background: url(../../web/images/excel_up/ico_btn_excel.png) no-repeat 50% 50%;
}
.k-button-lg .k-i-file-excel:before {
    content: "";
    background: url(../../web/images/excel_up/ico_btn_lg_excel.png) no-repeat 50% 50%;
}
.k-button-lg .k-i-arrow-chevron-right:before {
    content: "";
    background: url(../../web/images/excel_up/ico_btn_lg_arrow_right.png) no-repeat 50% 50%;
}
.k-button-lg .k-i-finish:before {
    content: "";
    background: url(../../web/images/excel_up/ico_btn_lg_finish.png) no-repeat 50% 50%;
}

/* ===================================
	02. 버튼 끝
====================================== */


/* ===================================
	03. 그리드 시작
====================================== */
.kist-grid .k-grid-pager .k-textbox {
    height: 28px;
}

.k-grid td {
    border-width: 0 0 1px 1px;
}
.k-grid tr:last-child td {
    border-bottom-width: 0px;
}
.k-grid {
    border-top: 2px solid #114672;
}
.k-header,
.k-grid-header {
    background-color: #e5ebf0;
    border-color: #cccccc;
}
.k-grid-header th.k-header, .k-filter-row th {
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    white-space: normal;
    text-overflow: inherit;
}
.k-grid-header th.k-header > .k-link {
    text-overflow: inherit;
}
.k-grid tr td {
    border-color: #cccccc;
    text-align: center;
    word-break: keep-all;
    font-size: 14px;
}
.k-grid tr td.td-head {
    background-color: #e5ebf0;
}
.k-grid tr td .td-data {
    text-overflow: ellipsis;
    word-break: keep-all;
    overflow: hidden;
    min-height: 16px;
    display: block;
}
.k-pager-wrap {
    background-color: #e7e9ea;
    color: #333333;
}
.k-pager-wrap .k-pager-refresh {
    background-color: #e7e9ea;
}





.kist-excel-tree-list tr td {
    text-align: left;
}
.k-upload.k-header.k-upload-empty {
    background-color: #fafafb;
}


.kist-grid {

}
.kist-grid.k-grid tbody button.k-button {
	min-width: auto;
	padding: 2px 6px;
	margin: 0px;
}

.kist-grid.kist-grid-scroll-x {
	overflow-x: auto;
}

.kist-grid .k-state-selected,
.kist-grid .k-state-selected:hover,
.kist-grid .k-state-selected:link,
.kist-grid .k-state-selected:visited,
.kist-grid.k-grid td.k-state-selected:hover,
.kist-grid.k-grid tr.k-state-selected:hover td {
	color: #333333;
	background-color: #dde8f5 !important;
}

.kist-grid input.k-checkbox {
	margin-left: -14px;
}
.kist-btn-rowAdd.trViewOff,
.kist-btn-rowRemove.trViewOff {
	display: none !important;
}
.kist-grid.kist-grid-scroll-400 .k-grid-content {
	max-height: 400px;
}
.kist-grid .k-widget.k-dropdown.dropDownTemplate {
	width: 100%;
}
.kist-grid .k-textbox,
.kist-grid .k-widget.k-numerictextbox .k-numeric-wrap .k-input,
.kist-grid .k-dropdown-wrap.k-state-default {
	height: 26px;
}
.kist-grid .k-widget.k-numerictextbox .k-numeric-wrap .k-link {
	height: 13px;
}
.kist-grid .td-head {
	background-color: #eef2f5;
	text-align: left;
}
.kist-grid .k-state-selected .td-head {
	background-color: #cbdaec;
}
.kist-grid .k-widget.k-numerictextbox.numeric-max-width-200 {
	max-width: 200px;
}
.kist-grid .td-head-yellow {
	background-color: #ffe8ac;
	pointer-events: none;
}
.kist-grid .td-data-textarea {
	text-rendering: auto;
	color: initial;
	letter-spacing: normal;
	word-spacing: normal;
	text-transform: none;
	text-indent: 0px;
	text-shadow: none;
	display: inline-block;
	text-align: start;
	background-color: white;
	flex-direction: column;
	cursor: text;
	white-space: pre-wrap;
	overflow-wrap: break-word;
	margin: 0em;
	border-width: 1px;
	border-style: solid;
	border-color: rgb(169, 169, 169);
	border-image: initial;
	padding: 2px;
	width: 100%;
	height: 70px;
	overflow-y: auto !important;
}
.kist-grid .td-textarea {
	width: 96%;
	height: 70px;
	padding-right: 0px;
	border-width: 1px;
	border-style: solid;
	border-color: rgb(169, 169, 169);
}

.k-grid-content-locked {
    /* border-bottom: 1px solid #cccccc; */
}
.k-grid-header .k-grid-header-locked {
    border-right: 1px solid #cccccc;
}
.k-grid-header-locked .k-header, .k-grid-content-locked {
    border-left-color: #cccccc;
    border-right-color: #cccccc;
}
.kc-grid-toolbar-btn-group {
    position: absolute;
    right: 0px;
}
.kc-grid-toolbar-btn-group .btn {
    margin: 0px;
    margin-right: 4px;
}
.kc-grid .k-grid-search {
    width: 40%;
}
.kc-grid .no-data {
    width: 100%;
    min-height: 60px;
    background: url(../img/common/icon/ico_no_data.png) no-repeat 50% 50%;
}
/* .k-grid-header th.k-header {
    line-height: 20px;
    padding: 6px 2px;
} */
/* .k-grid-header th.k-with-icon .k-link {
    margin-right: 0px;
    line-height: 20px;
    padding: 6px;
} */
.k-filter-menu-container .k-multicheck-wrap {
    display: grid;
}

.kc-grid.row-pointer tbody > tr {
    cursor: pointer;
}
.k-pager-md .k-pager-info, .k-pager-sm .k-pager-info, .k-pager-sm .k-pager-sizes, .k-pager-sm .k-pager-numbers {
    display: flex;
}
.kc-grid-width-sm .k-pager-sizes {
    display: none;
}

.k-state-active,
.k-state-active:hover,
.k-active-filter {
  background: none;
}
/* ===================================
	03. 그리드 끝
====================================== */

/* ===================================
	04. 팝업 시작
====================================== */
.k-window {

}
.k-window-content .k-button::before {

}
.k-window-actions .k-button::before {
    opacity: 0;
}
.k-window-content {
    padding: 0px;
    overflow: hidden;
}
.k-window.k-state-focused,
.k-window.kc-state-focus-all {
    border: 2px solid #0095da;
}
.k-window.k-state-focused .k-window-titlebar,
.k-window.kc-state-focus-all .k-window-titlebar {
    color: #fff;
    background-color: #0095da;
    cursor: move;
}
.k-window-title {
    cursor: move;
}
.k-window-titlebar {
    border-radius: 0;
}
.k-edit-form-container {
    width: auto;
}
.k-popup-edit-form {
    width: 100%;
    height: 100%;
    padding: 12px;
    overflow: auto;
}
.kc-popup-btn-group .k-popup-edit-form {
    margin-bottom: 56px;
}
.k-popup-edit-form.button-group-display {
    height: calc(100% - 56px);
}
.k-edit-buttons {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    padding: 10px;
}
.k-edit-buttons .button-group {
    float: right;
}
.popup-contents {
    overflow: auto;
    height: calc(100% - 90px);
    padding: 10px;
}
.popup-footer {
    position: absolute;
    bottom: 0px;
    display: block;
    width: calc(100% - 40px);
    padding: 19px 10px 20px 10px;
    text-align: right;
    border-top: 1px solid #000;
}
/* ===================================
	04. 팝업 끝
====================================== */

/* ===================================
	05. 컴포넌트 재정의 시작
====================================== */
/* 공통 */
.k-textbox > input,
.k-autocomplete .k-input,
.k-multiselect-wrap .k-input,
.k-picker-wrap .k-input,
.k-numeric-wrap .k-input,
.k-dropdown-wrap .k-input,
.k-selectbox .k-input {
    line-height: 1.75em;
}

.k-textbox.k-invalid,
.k-textbox.k-state-invalid,
.k-textbox.ng-invalid.ng-dirty,
.k-textbox.ng-invalid.ng-touched {
    border-color: rgba(213,25,35,.5);
}
.from-to-datepicker .k-form-error {
    display: inline;
}
.from-to-datepicker .input-group .input-label-display,
.from-to-datepicker .input-group .input-group-label,
.from-to-datepicker .form-group .input-label-display,
.from-to-datepicker .form-group .input-group-label {
    width: auto;
    display: inline-block;
}
.input-group[class*="col-"] .from-to-datepicker .k-autocomplete,
.input-group[class*="col-"] .from-to-datepicker .k-combobox,
.input-group[class*="col-"] .from-to-datepicker .k-datepicker,
.input-group[class*="col-"] .from-to-datepicker .k-timepicker,
.input-group[class*="col-"] .from-to-datepicker .k-datetimepicker,
.input-group[class*="col-"] .from-to-datepicker .k-colorpicker,
.input-group[class*="col-"] .from-to-datepicker .k-numerictextbox,
.input-group[class*="col-"] .from-to-datepicker .k-daterangepicker,
.input-group[class*="col-"] .from-to-datepicker .k-dropdown,
.input-group[class*="col-"] .from-to-datepicker .k-dropdowntree,
.input-group[class*="col-"] .from-to-datepicker .k-selectbox,
.input-group[class*="col-"] .from-to-datepicker .k-multiselect,
.input-group[class*="col-"] .from-to-datepicker .k-textbox,
.input-group[class*="col-"] .from-to-datepicker .k-listbox {
    width: auto;
}

/* 필수 */
.k-input.required,
.k-autocomplete.required,
.required .k-picker-wrap.k-state-default,
.required .k-numeric-wrap.k-state-default,
.required .k-dropdown-wrap.k-state-default,
.required .k-state-default .k-textbox {
    background: #f7efbe !important;
}

.k-overlay {
    background-color: #fff;
}

/* input */
.kc-input-border-none,
.kc-input-border-none .k-input,
.k-state-focused.kc-input-border-none {
    border: none;
    box-shadow: none;
    padding: 0px;
}
.kc-input-border-none:focus,
.kc-input-border-none:focus-within,
.kc-input-border-none.k-state-focus,
.kc-input-border-none.k-state-focused {
    border-color: inherit;
    box-shadow: none;
}

/* tab */
.k-tabstrip-wrapper {
    display: table;
    width: 100%;
}
.k-tabstrip {
    height: 100%;
}
/* Select */
.k-dropdown-wrap.k-state-default .k-icon.k-i-arrow-60-down:before {
    top: 50%;
    margin-top: -6px;
}

/* Multiple Select */
.k-multiselect-wrap li {
    margin: 3px 0px 3px 3px;
}

/* Multiple Select Group */
.kc-multi-select-group .kc-multi-select-optional,
.kc-multi-select-label .label-optional {
    min-width: 237px;
}
.kc-multi-select-group .kc-multi-select-selected,
.kc-multi-select-label .label-selected {
    min-width: 200px;
}
.kc-multi-select-group .kc-multi-select-optional,
.kc-multi-select-group .kc-multi-select-selected {
    min-height: 240px;
}

/* DatePicker */
.k-datepicker {
    width: 140px;
}
.k-datepicker .k-icon,
.k-datetimepicker .k-icon {
    height: 1.2em;
}
.k-datepicker .k-icon:before,
.k-datetimepicker .k-icon:before {
    top: 4px;
}
.k-block > .k-header,
.k-tabstrip-items .k-item,
.k-panelbar .k-tabstrip-items .k-item,
.k-tabstrip-items .k-link,
.k-calendar-container.k-state-border-down,
.k-list-container.k-state-border-down,
.k-autocomplete.k-state-border-down,
.k-multiselect.k-state-border-down,
.k-dropdown-wrap.k-state-border-down,
.k-picker-wrap.k-state-border-down,
.k-numeric-wrap.k-state-border-down {
    border-radius: 4px;
}
.k-picker-wrap.k-state-focused > .k-select,
.k-picker-wrap.k-state-active > .k-select,
.k-dropdown-wrap.k-state-focused > .k-select,
.k-dropdown-wrap.k-state-active > .k-select {
  border-color: #cccccc;
}
.k-list-container.k-state-border-down,
.k-autocomplete.k-state-border-down,
.k-picker-wrap.k-state-border-down,
.k-numeric-wrap.k-state-border-down {
  border-bottom-width: 1px;
  padding-bottom: 0px;
}
.k-datepicker .k-state-default > .k-select,
.k-datetimepicker .k-state-default > .k-select {
    background-color: #fff;
}

/* DateTimePicker */
.k-datetimepicker {
    width: 250px;
}
.k-datetimepicker .k-select .k-link {
    height: 100%;
}
.k-datetimepicker .k-picker-wrap {
    overflow: hidden;
}

/* DateRangePicker */
.k-daterangepicker .k-dateinput {
    width: 47%;
}
.k-daterangepicker > span:nth-child(2) {
    display: inline-block;
    width: 6%;
    height: 20px;
    background: url(../img/common/icon/ico_date_range_picker.png) no-repeat 50% 50%;
}
.k-daterangepicker .k-dateinput .k-input {
    text-overflow: ellipsis;
    white-space: normal;
}
.k-widget.k-daterangepicker {
    display: inline-block;
}
.k-daterangepicker .k-dateinput::before {
    content: "\e108";
    margin: auto;
    width: 1em;
    height: 1em;
    line-height: 1;
    display: inline-block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 8px;
    font: 16px/1 'WebComponentsIcons';
    color: #000;
    z-index: 2;
}

/* NumericTextBox */
.k-numerictextbox .k-link {
    height: 17px;
}
.k-numeric-wrap.k-expand-padding .k-i-warning,
.k-numerictextbox .k-i-warning {
    right: auto;
    left: 0px;
}

/* NumericTextBox Spinner 기능 삭제*/
.k-numeric-wrap {
    padding-right: 0px;
}
.k-numerictextbox .k-select {
    display: none;
}

/* FileUpload */
.k-upload-files.k-reset .k-file div p {
    display: inline-block;
    border-left:2px solid #dddddd;
    margin:10px;
    line-height:20px;
    padding:0px 10px 0px 30px;
}

.k-upload-files.k-reset .k-file div p:first-child  {
    border-left:0px solid #dddddd;
    margin-left:0px;
    padding-left:10px;
}
.dropZoneElement {
    position: relative;
    background-color: #fefefe;
    border: 1px solid #b0b9c4;
    border-top: 0px;
    padding: 10px 20px;
    min-height: 57px;
    overflow: hidden;
}
.dropZoneElement.k-dropzone-hovered {
    background-color: #f5f5f5;
}
.dropZoneElement::before {
    content: "";
    position: absolute;
    display: block;
    width: 470px;
    height: 36px;
    top: 50%;
    left: 50%;
    margin-top: -18px;
    margin-left: -235px;
    background: url(../img/common/icon/ico_dropZone.png) no-repeat 0px 50%;
}
.dropZoneTextB {
    font-weight: bold;
    color: #0b61c1;
}
.dropZoneText {
    display: inline;
    line-height: 40px;
}
.dropZoneText::before {
    content: "";
    display: inline-block;
    width: 300px;
    height: 36px;
    background: url(../../web/images/excel_up/ico_dropZone.png) no-repeat 0px 50%;
}
.dropZoneTextP {
    display: inline-block;
}
.dropZoneTextP.k-dropzone-hovered {
    background-color: #fefefe;
}
.dropZoneBtnGroup {
    float: right;
    display: inline-block;
    height: 28px;
    margin-top: 5px;
}
.fileDropGroup .k-upload-action.k-button,
.fileDropGroup .k-remove.k-button{
    position: absolute;
    top: 50%;
    right: 0px;
    height: 28px;
    display: flex;
    width: 28px;
    margin-top: -14px;
}
.fileDropGroup .k-upload.k-header {
    border-radius: 0px;
    background-color: #eff1f5;
    border: 1px solid #b0b9c4;
}

/* TextArea */
.k-textarea {
    width: 100%;
}

/* Switch */
.k-switch.k-state-disabled {
    opacity: 0.3;
}
.k-switch-container {
    box-shadow: none;
}
.k-switch-label-on {
    left: 10px;
}
.k-switch-label-off {
    right: 10px;
}
.required.k-switch-on .k-switch-handle,
.required.k-switch-off .k-switch-handle {
    background-color: #f7efbe;
}

/* Radio & CheckBox */
.k-radio-label,
.k-checkbox-label {
    line-height: 16px;
}
.k-radio-list .k-radio-item,
.k-checkbox-list .k-checkbox-item {
    margin-top: 4px;
}
.k-list-horizontal .k-radio-item,
.k-list-horizontal .k-checkbox-item {
    margin: 0 20px 0 0;
}
.required .k-radio,
.required .k-checkbox {
    background-color: #f7efbe;
}
.k-radio:checked,
.k-checkbox:checked {
    color: #bde0ff;
    background-color: #428bca;
}

/* Tooltip */
.kc-tooltip.kc-help-area {
    display: inline-block;
    min-width: 30px;
    height: 28px;
    line-height: 28px;
    padding: 0px 0px 0px 30px;
    background: url(../img/common/icon/ico_btn_help.png) no-repeat 0px 50%;
    cursor: pointer;
    vertical-align: middle;
}

/* Treeview */
.k-treeview {

}
.k-treeview .k-checkbox-wrapper {
    display: inline;
}
.k-treeview .k-i-collapse,
.k-treeview .k-i-expand {
    border-radius: 0px;
    margin-top: 0px;
}
.k-treeview .k-i-collapse:before {
    content: "";
    height: 16px;
    width: 16px;
    background: url(../img/common/icon/ico_treeview_hitarea.png) -16px 0px no-repeat;
    transition-timing-function: ease-in-out;
    transition-duration: .2s;
}
.k-treeview .k-i-expand:before {
    content: "";
    background: url(../img/common/icon/ico_treeview_hitarea.png) 0px 0px no-repeat;
    transition-timing-function: ease-in-out;
    transition-duration: .2s;
}
.k-treeview li.k-item {
    background: url(../img/common/icon/ico_treeview_default_line.gif) 0px 0px no-repeat;
}
.k-treeview li.k-item:last-child,
.k-treeview li.k-item.k-last {
    background-position: 0 -1762px;
}
.k-treeview li.k-item .k-checkbox-wrapper {
    margin: 0px 1px;
}
.k-treeview .k-checkbox-wrapper + .k-in {
    margin-left: 0px;
}
.k-treeview .k-in {
    padding: 0px 0.3333em 0px 0.25em;

}
.k-treeview .treeview-icon {
    position: relative;
    width: 24px;
    height: 18px;
    top: 3px;
    display: inline-block;
    line-height: 1;
}
.k-treeview .treeview-icon.folder-open:before {
    content: "";
    display: block;
    width: 24px;
    height: 18px;
    background: url(../img/common/icon/ico_treeview_floder_open.png) 0px 0px no-repeat;
}
.k-treeview .treeview-icon.folder-close:before {
    content: "";
    display: block;
    width: 24px;
    height: 18px;
    background: url(../img/common/icon/ico_treeview_floder.png) 0px 0px no-repeat;
}
.k-treeview .treeview-icon.treeview-list:before {
    content: "";
    display: block;
    width: 24px;
    height: 18px;
    background: url(../img/common/icon/ico_treeview_list.png) 0px 0px no-repeat;
}

/* Splitter */
.k-splitter {
    box-sizing: content-box;
}
.kc-splitter.kc-splitter-horizontal .k-grid {
    display: table;
}
.k-splitbar {
    background-color: #cccccc;
}
.k-splitbar:hover {
    background-color: #45a3da;
}
.k-splitbar:hover .k-i-arrow-60-left:before,
.k-splitbar:hover .k-i-arrow-60-right:before,
.k-splitbar:hover .k-i-arrow-60-up:before,
.k-splitbar:hover .k-i-arrow-60-down:before {
    color: #fff;
}
.k-splitbar:hover .k-resize-handle {
    background-color: #fff;
}
.k-splitbar-horizontal .k-icon {
    left: 3px;
}
.k-splitbar-vertical .k-icon {
    top: 2px;
}
.k-splitbar-vertical .k-i-arrow-60-up {
    margin-top: -3px;
}
.k-ghost-splitbar-horizontal,
.k-splitbar-horizontal {
    width: 10px;
}
.k-ghost-splitbar-vertical,
.k-splitbar-vertical {
    height: 10px;
}
.kc-splitter .kc-treeview {
    padding: 10px;
}


.k-panelbar .k-item .k-link.k-state-selected,
.k-panelbar > li > .k-link.k-state-selected {
    color: #2663af !important;
}

/* progress */
body > .k-loading-mask {
    position: fixed;
}
.k-loading-mask, .k-loading-image, .k-loading-text {

}
.k-loading-mask .k-loading-text {
    top: 50%;
    width: 100%;
    text-align: center;
    display: block;
    margin-top: 15px;
    text-indent: 0px;
    font-weight: bold;
    color: #000;
    /* text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff; */
    text-shadow: 1px 1px 0 #fff,
    -1px 1px 0 #fff,
    1px -1px 0 #fff,
    -1px -1px 0 #fff,
    0px 1px 0 #fff,
    0px -1px 0 #fff,
    -1px 0px 0 #fff,
    1px 0px 0 #fff,
    2px 2px 0 #fff,
    -2px 2px 0 #fff,
    2px -2px 0 #fff,
    -2px -2px 0 #fff,
    0px 2px 0 #fff,
    0px -2px 0 #fff,
    -2px 0px 0 #fff,
    2px 0px 0 #fff,
    1px 2px 0 #fff,
    -1px 2px 0 #fff,
    1px -2px 0 #fff,
    -1px -2px 0 #fff,
    2px 1px 0 #fff,
    -2px 1px 0 #fff,
    2px -1px 0 #fff,
    -2px -1px 0 #fff;
}

/* scheduler */
.k-scheduler .k-scheduler-table th {
    text-align: center;
}
.k-scheduler .k-button:active,
.k-scheduler .k-button.k-state-active,
.k-scheduler .k-button.k-state-selected {
    color: #fff;
    background-color: #007ac3;
}
.k-scheduler .k-scheduler-content .k-event-template {
    font-size: 14px;
}
.k-scheduler-content .k-event-actions {
    top: 1px;
}
.k-scheduler-content .k-event-template {
    padding: 3px 1.4em 3px 0.6em;
}
.kc-grid .td-edit-textarea {
    -webkit-writing-mode: horizontal-tb !important;
    text-rendering: auto;
    color: initial;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    /* -webkit-appearance: textarea; */
    background-color: white;
    -webkit-rtl-ordering: logical;
    flex-direction: column;
    resize: auto;
    cursor: text;
    white-space: pre-wrap;
    overflow-wrap: break-word;
    margin: 0em;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(169, 169, 169);
    border-image: initial;
    padding: 4px 8px;
    width: 100%;
    height: 70px;
    overflow-y: auto !important;
    border-radius: 4px;
}
.k-grid .k-edit-cell {
    padding: 0.4em 0.6em;
}
.k-grid .k-dropdown {
    text-align: left;
}

.k-grid .k-grid-search {
	width: 400px;
}
.k-grid .no-data {
	width: 100%;
    min-height: 60px;
    background: url(../img/common/icon/ico_no_data.png) no-repeat 50% 50%;
}
/* ===================================
	05. 컴포넌트 재정의 끝
====================================== */

/* ===================================
	06. 웹접근성 테이블내의 컴포넌트 재정의 시작
====================================== */
.kc-table .btn,
.kc-grid > table .btn {
    font-size:12px;
    padding: 0px 10px;
    height: 28px;
}
.kc-table .btn.btn-icon-right::after,
.kc-table .btn.btn-icon-left::before,
.kc-grid > table .btn.btn-icon-right::after,
.kc-grid > table .btn.btn-icon-left::before {
    width: 24px;
    height: 24px;
    top: 0px;
    left: 4px;
}
.kc-table .k-textbox,
.kc-table .k-textbox > input,
.kc-table .k-autocomplete .k-input,
.kc-table .k-multiselect-wrap .k-input,
.kc-table .k-picker-wrap .k-input,
.kc-table .k-numeric-wrap .k-input,
.kc-table .k-dropdown-wrap .k-input,
.kc-table .k-selectbox .k-input,
.kc-table .k-daterangepicker .k-textbox,
.k-ie .kc-table .k-autocomplete .k-input,
.kc-grid table .k-textbox,
.kc-grid table .k-textbox > input,
.kc-grid table .k-autocomplete .k-input,
.kc-grid table .k-multiselect-wrap .k-input,
.kc-grid table .k-picker-wrap .k-input,
.kc-grid table .k-numeric-wrap .k-input,
.kc-grid table .k-dropdown-wrap .k-input,
.kc-grid table .k-selectbox .k-input,
.kc-grid table .k-daterangepicker .k-textbox,
.k-ie .kc-grid .k-autocomplete .k-input,
.kc-table input,
.kc-table select {
    height: 26px;
    line-height: 1.3em;
}
.kc-table select {
    padding: 2px 6px;
}
.kc-table .k-dropdown-wrap.k-state-default .k-icon.k-i-arrow-60-down:before,
.kc-grid .k-dropdown-wrap.k-state-default .k-icon.k-i-arrow-60-down:before {
    margin-top: -8px;
}
.kc-table .k-datepicker .k-icon:before,
.kc-table .k-datetimepicker .k-icon:before,
.kc-grid .k-datepicker .k-icon:before,
.kc-grid .k-datetimepicker .k-icon:before {
    top: 0px;
}
.kc-table .k-daterangepicker > span:nth-child(2),
.kc-grid .k-daterangepicker > span:nth-child(2) {
    height: 16px;
}
/* ===================================
	06. 웹접근성 테이블내의 컴포넌트 재정의 끝
====================================== */