/****************************************************************************************************
 * File Name   : obz.common.css
 * Description : EMS 공통 CSS
 * Version      : v1
 ****************************************************************************************************/

 :root {
    --obz-base-font: "Roboto", "Pretendard";
}

/* ============================ font ============================ */
/* @font-face {
    font-family: 'Noto Sans Kr';
    src: url('./font/NotoSansKR-Regular.otf');
} */

@font-face {
    font-family: 'Pretendard';
    src: url('./font/Pretendard/Pretendard-Light.woff');
	font-weight: 200;
}
@font-face {
    font-family: 'Pretendard';
    src: url('./font/Pretendard/Pretendard-Medium.woff');
	font-weight: 400;
}
@font-face {
    font-family: 'Pretendard';
    src: url('./font/Pretendard/Pretendard-Bold.woff');
	font-weight: 700;
}

@font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/Roboto-Light.ttf');
	font-weight: 200;
}
@font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/Roboto-Regular.ttf');
	font-weight: 400;
}
@font-face {
    font-family: 'Roboto';
    src: url('./font/Roboto/Roboto-Bold.ttf');
	font-weight: 700;
}

/**
* 수정내역
* 2020-12-08 YYM check 프로퍼티에 알맞게 css 변경
* 2020-12-08 YYM text쪽 border css 알맞게 적용되도록 변경
* 2020-12-10 LEJ #obzbodyframe > * 우선순위 낮추기 위해 .obzbodyframe > *로 변경
* 2020-12-10 LEJ obzbutton 기본 텍스트색 및 아이콘색 #FFFFFF로 변경
* 2020-12-14 모든 위젯 클래스 명 변경 ( obzbutton -> obz-button / obz-item -> obz-ui )
* 2020-12-10 YYM popup css 수정
* 2020-12-15 YYM Line default style 지정
* 2020-12-15 obz-grid 클래스 명 추가
* 2021-01-06 YYM obz-tooltip 추가
* 2021-01-11 LEJ Switch 스타일 변경
* 2021-08-13 LYJ 전체 스타일 변경 (주석참고)
*/

/* point color : #1768C1 */

.clsIFrameDialog {
    /* border: 1px solid #ffffff; */
    border: 0px solid #ffffff;
    overflow: hidden;
    /*position: absolute;*/
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    /*padding-top:50px;*/
}

html {
    height: 98%;
}

body {
    height: 98%;
    background-color: #FFFFFF;
    /* background-color: transparent;*/
}

*:focus {
    outline: none;
}

/* 2021-08-13 LYJ 
 * 아래 삭제 사항
 * 	font-family: Malgun Gothic, Helvetica Neue, Helvetica, Arial, sans-serif;
 */
.obzbodyframe>* {
    font-size: 13px;
    line-height: 1.2;
    color: #333;
}

.dx-widget {
    font-size: 13px;
}

/* 2021-08-13 LYJ 
 * 아래 수정 사항
 * 	bottom: 20px;
 */
.obzbodyframe {
    position: absolute;
    top: 0px;
    bottom: 20px;
    left: 20px;
    right: 15px;
    opacity: 0;

    /* BC!!! */
    /* overflow: auto; */
}

a {
    color: #337ab7;
    text-decoration: none;
}

a:hover,
a:focus {
    color: #23527c;
    text-decoration: underline;
}

a:focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.dx-texteditor-input-container {
    font-size : inherit;
}
.dx-texteditor-input-container input {
    font-size: inherit;
}
.dx-state-readonly input {
    cursor: default;
}
.dx-placeholder {
/*	padding: 4px 2px;*/
    padding: 2px 2px 1px 0;
    font-size: inherit;
}
.dx-placeholder::before {
    padding: 3px 5px;
}
.obz-grid.wj-state-selected>a {
    color: #fff;
    text-decoration: none;
}

.obz-grid .wj-state-selected,
.obz-grid .wj-state-multi-selected {
    /*background-color: #80adbf;*/
    color: #000;
    font-weight: bold;
}

.obz-grid .wj-cell {
    padding: 15px;
}

/* 2021-08-13 LYJ 
 * 아래 삭제 사항
 * 	font-family: Malgun Gothic, Helvetica Neue, Helvetica, Arial, sans-serif;
 */
.obz-grid.wj-flexgrid .wj-grid-editor {
    font-size: 12px;
}

/*Action Menu*/
.obz-grid .obz-actMenu {
    background-color: #ffffff;
    margin-top: 5px;
    padding: 0px 3px;
    border: 1px solid #ececef;
    border-radius: 7px;
}

.obz-grid .obz-actMenu .obz-actMenuList {
    display: inline-block;
    background: #fff;
    color: #59595b;
    border-radius: 4px;
    font-size: 13px;
    margin: 3px 0px;
    padding: 6px 10px;
    cursor: pointer;
    transition: background .1s;
}

.obz-grid .obz-actMenu .obz-actMenuList:hover {
    color: #256dd9;
    background: #f0f7fc;
}

/*icon align*/

.wj-cells .wj-align-center .specific-svg {
    justify-content: center;
}

.wj-cells .wj-align-left .specific-svg {
    justify-content: flex-start;
}

.wj-cells .wj-align-right .specific-svg {
    justify-content: flex-end;
}

.obz-listbox {
    background-color: #ffffff;
    color: #333;
    border-width: 1px;
    border-style: solid;
    border-radius: 0;
    border-color: #ddd;
}


.obz-ui.obz-listbox .dx-radiobutton-icon::before {
    width: 16px;
    height: 16px;
    border: 1px solid #e8e8ea;
    border-radius: 10px;
}

.obz-ui.obz-listbox .dx-list-item-selected .dx-radiobutton-icon-dot {
    display: block;
    margin-top: -14px;
    margin-left: 4px;
    width: 10px;
    height: 10px;
    background: #0167ff;
    content: "";
    border-radius: 5px;
}

.obz-ui.obz-listbox .dx-list-select-radiobutton {
    padding-bottom: 6px;
}

.obz-ui.obz-listbox .dx-item.dx-state-hover .dx-radiobutton-icon::before {
    border-color: #B0D0ED;
}

.obz-ui.obz-listbox .dx-item.dx-state-focused:not(.dx-state-active) .dx-radiobutton-icon::before {
    border-color: #B0D0ED;
}

/* 2021-08-13 LYJ 
 * 아래 삭제 사항
 * 	font-family: Malgun Gothic, Helvetica Neue, Helvetica, Arial, sans-serif;
 */
.wj-listbox {
    font-size: 13px;
}

/* ANCHOR - 2020-12-01 GNH */
.obz-ui .dx-checkbox-checked .dx-checkbox-icon {
    font: 10px/11px DXIcons;
}

.obz-ui .dx-checkbox-icon {
    width: 15px;
    height: 15px;
}

.obz-ui .dx-texteditor-input {
    padding: 3px 5px 4px;
    min-height: 10px;
    font-size: inherit !important;
    font-family: inherit;
}

.obz-ui .dx-searchbox .dx-texteditor-input {
    padding-left: 24px;
}

/* IE - IE6 IE7 ANCHOR - 2020-12-07 YYM*/
/* 전체에 먹는 현상으로 주석
.obz-ui .dx-texteditor-input {
    
    margin-top: 2px;
}
*/
.obz-ui .dx-texteditor-input {
    /*IE8 IE9*/
    margin-top: 2px\0 / IE8 + 9;
}

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {

    /*IE10 IE11*/
    .obz-ui .dx-texteditor-input {
        padding: 1px 5px 4px;
        vertical-align: top;
        margin-top: 0px;
    }

    .custom-item .dx-texteditor-input {
        padding: 0px 5px 4px;
        vertical-align: top;
    }

    /**::-ms-backdrop, .dx-texteditor-input {
	    padding: 0px 5px 4px;
	    vertical-align: top;
	}*/
}

.obz-ui .dx-button-text {
    white-space: normal;
    line-height: 1.1;
}

.dx-template-wrapper {
    position: relative;
}

/*.dx-texteditor {
    vertical-align: sub !important;
}*/

/*.dx-checkbox-container {
    vertical-align: sub !important;
}*/

.search_area {
    border-style: solid;
    border-color: rgb(204, 204, 204);
    border-radius: 3px;
    padding: 10px;
    border-width: 1px;
    background-color: whitesmoke;
    margin-bottom: 10px;
}

/* Tabs CSS */
.obz-item .dx-tab {
    padding: 3px 5px;
    text-align: left;
}

.obz-item .dx-tab .dx-tab-text {
    padding: 0 3px;
}

.obz-item .dx-tab i {
    margin-top: -4px;
    margin-right: 5px;
}

.obz-item .dx-tabs {
    border-style: solid solid none solid !important;
    width: 100%;
    max-width: 100%;
    overflow: hidden !important;
}

.obz-item .tabs-content {
    padding: 10px;
    border-style: solid;
    border-color: #d3d3d3;
    border-width: 1px;
}


/**** LoadPanel CSS - obzloadpanel x ****/
/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	width: 100vw;
 * 	height: 100vh;
 * 	box-shadow: none;
 * 	border: 0px;
 * 	border-radius: 40px;
 * 	background-color: rgba(255, 255, 255, 0.8);
 * 	padding-bottom: 30px;
 * 아래 삭제 사항
 * 	box-shadow: 1px 5px 12px rgba(0, 0, 0, .10);
 * 	border: 0px;
 * 	border-radius: 8px;
 */
.dx-loadpanel-content {
    width: 100vw;
    height: 100vh;
    box-shadow: none;
    border: 0px;
    border-radius: 40px;
    background-color: rgba(255, 255, 255, 0.8);
    padding-bottom: 30px;
}

/* 2023-02-10 LEJ */
.obz-loadpanel {
    z-index: 999;
    position: absolute;
    height: 100% !important;
    width: 100% !important;
    left: 0;
    top: 0;
    overflow: hidden;
}
/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * 	font-size: 13px;
 * 	color: #787878;
 */
.obz-loadpanel .dx-loadpanel-message {
    margin-top: 1px;
    font-size: 14px;
    font-weight: bold;
    color: #616161;
    letter-spacing: -0.3px;
    white-space: pre;
}


/**** PopUp CSS - obzpopup x****/
.obz-dialog .obzbodyframe {
    margin-bottom: 0px;
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    opacity: 0;
}
/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	padding: 20px 35px 25px;
 * 아래 변경 사항
 *	box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
 */
.dx-popup .dx-popup-wrapper>.dx-overlay-content {
    border: 0px solid #909090;
    /* box-shadow: none; */
    border-radius: 17px;
    padding: 20px 35px 25px;
    padding: 0px;
    box-shadow: rgb(0 0 0 / 16%) 0px 5px 50px;
}

/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * 	margin: 0px 35px 0px;
 */
.dx-popup .dx-popup-title {
    border-bottom: 2px solid #f0f2f4;
    
    margin: 0px auto;
    padding: 20px 0px 12px;
    width: calc(100% - 70px);
}

.dx-popup-title.dx-toolbar .dx-toolbar-before {
    width: 100%;
}

.dx-popup .dx-popup-title.dx-toolbar .dx-toolbar-label {
    font-size: 19px;
    font-weight: 600;
    max-width: 100px !important;
}

.dx-popup .dx-popup-title .dx-toolbar-after {
    margin-right: -25px;
    margin-top: -12px;
}
/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * 	background: #F0F2F5;
 */
.dx-popup .dx-popup-title .dx-toolbar-after .dx-button {
    background: transparent;
    padding: 7px 5px;
    border-radius: 30px;
}

.dx-popup .dx-popup-title .dx-toolbar-after .dx-button.dx-state-hover {
    background: #F0F0F3;
}

.dx-popup .dx-popup-title .dx-toolbar-after .dx-button .dx-icon {
    color: #949BA3;
    font-size: 17px;
    width: 18px;
    height: 14px;
}

/*
.dx-popup .dx-button-content {
    padding: 2px;
}
*/

/* .popup .dx-button-default {
    background: #ffffff;
}

.popup .dx-button-default .dx-icon {
    color: #cfcfcf;
}

.popup .dx-button-default.dx-state-hover {
    background: #ffffff;
}

.popup .dx-button-default.dx-state-hover .dx-icon {
    color: #898989;
}

.popup .dx-button-default.dx-state-focused {
    background: #ffffff;
    border-width: 0px;
} */
/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	font-size: 13px;
 * 아래 변경 사항
 * 	padding: 0px 35px 25px;
 */
.dx-popup-content {
    padding: 0px 35px 30px;
    font-size: 13px;
}

/**** message box ****/
/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * 	padding: 10px 40px;
 * 	border-radius: 8px;
 * 아래 삭제 사항
 * 	border-top: 6px solid #19618c;	
 */
.dx-dialog.dx-popup .dx-overlay-content {
    padding: 20px 40px 23px;
    border-radius: 25px;
}
/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	border-bottom: 1px solid #C5C2C9;
 * 아래 변경 사항
 * 	padding: 6px 0px;
 * 	margin: 0px;
 */
.dx-dialog.dx-popup .dx-overlay-content .dx-toolbar.dx-popup-title {
    border: 0px;
    padding: 5px 0px 10px;
    margin-bottom: 15px;
    width: 100%;
    border-bottom: 1px solid #e8e8ea;
}

.dx-dialog.dx-popup .dx-overlay-content .dx-toolbar.dx-popup-title .dx-toolbar-label {
    font-size: 15px;
}
/* 2021-08-13 LYJ 
 * 아래 추가 사항
 *  color: #616161;
 * 	font-weight: 400;
 */
.dx-dialog.dx-popup .dx-dialog-message {
    white-space: pre-wrap;
    line-height: 20px;
    color: #444444;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
}

.dx-dialog.dx-popup .dx-popup-bottom.dx-toolbar .dx-toolbar-item, 
.dx-dialog.dx-popup .dx-rtl.dx-popup-bottom.dx-toolbar .dx-toolbar-menu-container {
    padding: 0 6px;
}

/* 2021-08-13 LYJ 
 * 아래 변경 사항
 *	border: 1px solid #D7DDE3;
 */
.dx-dialog.dx-popup .dx-popup-bottom .dx-item-content .dx-button {
    height: 34px;
    min-width: 100px;
    border-radius: 100px;
    border: 1px solid #eaeaec;
    background: #FFF;
    color: #737375;
    box-sizing: border-box;
    transition: background .1s;
}

.dx-dialog.dx-popup .dx-popup-bottom .dx-item-content .dx-button.dx-state-hover {
    background: #f8f8fa;
}

/* 2021-08-13 LYJ 
 * 아래 변경 사항
 *	border: 1px solid #2168CE;
 *	color: #fff;
 * 	font-weight: bold;
 * 아래 삭제 사항
 *	background: #2168CE; 
 */
.dx-dialog.dx-popup .dx-popup-bottom .dx-toolbar-center .dx-toolbar-button:first-child .dx-button {
    border: 1px solid #0267FD;
    background: #0267FD;
    color: #fff;
    font-weight: bold;
}

/* 2021-08-13 LYJ 
 * 아래 추가 사항
 *      color: #ffffff;	
 * 아래 변경 사항
 *	background: #194f9c;
 */
.dx-dialog.dx-popup .dx-popup-bottom .dx-toolbar-center .dx-toolbar-button:first-child .dx-button.dx-state-hover {
    background: #005adf;
    border-color: #005adf;
    color: #ffffff;
}
/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	font-size: 15px;
 * 아래 삭제 사항
 * 	padding: 5px;
 */
.dx-dialog.dx-popup .dx-popup-bottom .dx-item-content .dx-button-content {
    font-size: 14px;
    padding: 8px;
}

/* 2021-08-13 LYJ 
 * 아래 추가 사항 (클래스 전체)
 */
.dx-toolbar-label .dx-toolbar-item-content > div {
    font-weight: bold;
    color: #352741;;
    padding-left: 20px;
}

/* 2021-08-13 LYJ 
 * 아래 추가 사항 (클래스 전체)
 */
.dx-toolbar-label > div {
    text-align: center;
    font-weight: 500;
}

/**** message box ****/

.clsDivPage .dx-drawer .dx-toolbar-before{
    display: flex;
    flex-direction: column;
}

.clsDivPage .dx-drawer .dx-toolbar .dx-button-mode-contained.dx-button-default {
    /*background-color: #ffffff;*/
    background-color: transparent;
}

.clsDivPage .dx-drawer .dx-toolbar .dx-button-mode-contained.dx-button-default.dx-state-focused {
    /*background-color: #ffffff;*/
    background-color: transparent;
}
/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * 	font-size: 35px;
 */
.clsDivPage .dx-drawer .dx-toolbar .dx-button-mode-contained.dx-button-default .dx-icon {
    color: #909090;
    font-size: 25px !important;
    width: auto;
    height: auto;
    line-height: normal;
}
.clsDivPage .dx-drawer .dx-toolbar .dx-button-mode-contained.dx-button-default .dx-icon svg path {
	fill: #909090;
}

.clsDivPage .dx-drawer .dx-toolbar .dx-button-mode-contained.dx-button-default .dx-icon:hover svg path {
	fill: #666;
}

.clsDivPage .dx-drawer .dx-toolbar .dx-button-mode-contained.dx-button-default .dx-button-content {
    padding: 3px;
}

.clsDivPage .dx-drawer .obz-toolbar .dx-toolbar-before {
    font-size: 13px;
    padding: 6px 0px 6px 6px;
}

.clsDivPage .dx-drawer .dx-toolbar .dx-toolbar-after {
    padding: 2px 5px;
}

/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	padding: 10px 8px;
 */
.clsDivPage .dx-drawer .dx-drawer-panel-content {
    overflow: visible;
    background-color: #ffffff;
    border-radius: 0px;
    box-shadow: -10px 0px 20px 5px rgba(0, 0, 0, 0.1);
    z-index: 2;
}

.clsDivPage .dx-drawer .dx-drawer-content {
    z-index: 0;
}

/* 2021-10-01 LYJ 
 * 아래 추가 사항 (전체)
 */
.clsDivPage .dx-drawer .dx-toolbar {
    height: 15px !important;
    border-width: 0px;
}

.obz-drawer {
    background-color: transparent !important;
}

.obz-drawer .obzbodyframe {
    left: 10px;
    right: 10px;
    bottom: 0px;
}

/*.obzbodyframe>.dx-drawer-wrapper {
    margin-right: 40px;
}

.obzbodyframe.dx-drawer-opened>.dx-drawer-wrapper {
    margin-right: 0px;
}*/

.clsDivPage .dx-drawer-shader {
    background-color: rgba(0, 0, 0, .01);
	/* ANCHOR 2022-02-22 drawer가 열렸을 때 다른 탭으로 이동 후 왼쪽 영역이 선택되지 않는 현상 수정*/
	visibility: unset !important;
}



/* 
.dx-poopup .dx-button-mode-contained.dx-button-default {
    background-color: #ffffff;   
}

.dx-poopup .dx-button-mode-contained .dx-icon {
    color: #555555;
}

.dx-poopup .dx-button-mode-contained.dx-button-default.dx-state-hover {
    background-color: #ffffff;
}

.dx-poopup .dx-button-mode-contained.dx-button-default.dx-state-hover .dx-button-mode-contained .dx-icon{
    color: #000000;
} */

/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * 	background-color: rgba(255, 255, 255, 0.2);
 */
.dx-overlay-shader {
    background-color: rgba(255, 255, 255, 0.5);
}

/* Chart CSS */
.obz-ui.dxc-chart {
    margin-bottom: 20px;
}

.obz-ui.obz-chart {
    border-style: solid;
    border-width: 0;
    border-radius: 0;
}

/* Grid CSS */
/* set default grid height and some shadow */
.wj-flexgrid {
    background-color: #fff;
    /*box-shadow: 4px 4px 10px 0 rgba(50, 50, 50, 0.75);*/
    /*margin-left: 12px;*/
    /*margin-bottom: 12px;*/
}

/*columnHeader 영역에 대해 verticalAlign을 middle로 지정하는 효과*/
/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	font-weight: 500;
 */
.v-transform {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    font-weight: 500;
    /*white-space: pre-wrap;*/
}

/*.v-transform div {
    display: inline-block
}*/

/* create a 'custom-flex-grid' theme for the FlexGrid */
.obz-grid.custom-flex-grid .wj-header.wj-cell {
    color: #444;
    background-color: #eaeaea;
    /*border-bottom: solid 1px #404040;*/
    /*border-right: solid 1px #404040;*/
    font-weight: bold;
}

.obz-grid.custom-flex-grid .wj-cell {
    background-color: green;
    /*border: none;*/
    position: absolute;
    box-sizing: border-box;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 3px;
    border-right: 1px solid #c6c6c6;
    border-bottom: 1px solid #c6c6c6;
}

.obz-grid.custom-flex-grid .wj-alt:not(.wj-state-selected):not(.wj-state-multi-selected) {
    background-color: #f9f9f9;
}

.obz-grid.custom-flex-grid .wj-state-selected {
    /*background: #000;*/
    background: #0085c7;
    color: #fff;
}

.obz-grid.custom-flex-grid .wj-state-multi-selected {
    /*background: #222;*/
    background: #80adbf;
    color: #fff;
}

.row {
    margin-top: 40px;
    margin-bottom: 25px;
}

.wj-tooltip {
    border-radius: 0px;
    padding: 6px;
    color: #444;
    font-size: 12px;
    /*font-weight: bold;*/
    font-family: "Helvetica Neue", "Segoe UI", Helvetica, Verdana, sans-serif;
    background-color: #fff;
    box-shadow: none;
    border: 1px solid #888;
}

.dxc-tooltip {
    /* BC !!! */
    /* z-index: 999; */
    z-index: 400;
}

@media (max-width: 991px) {
    .header h1 {
        font-size: 22px;
        line-height: 1;
        margin-top: 7px;
        color: #fff;
    }

    h2 {
        font-size: 22px;
        margin: 10px 0 25px 0;
    }

    .obz-grid.wj-flexgrid {
        /*box-shadow: 2px 2px 8px 0 rgba(50, 50, 50, 0.5);*/
        box-shadow: none;
        /*margin-bottom: 12px;*/
    }

    .wj-dropdown {
        margin-bottom: 10px;
        width: 100%;
    }

    .dl-horizontal,
    .btn-group,
    .input-group {
        margin-bottom: 10px;
    }
}

@media (max-width: 767px) {
    body {
        font-size: 12px;
    }

    .dl-horizontal dd {
        width: 48%;
        float: right;
    }

    .dl-horizontal dt {
        width: 48%;
        float: left;
        text-align: right;
    }
}

/*/////////////////////////////////////////////////*/

.dx-datebox-with-calendar .dx-texteditor-input {
    padding-right: 0px !important;
}
/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	font-size: 12px;
 * 	letter-spacing: -0.01em;
 */
.dx-datebox:not(.dx-texteditor-empty).dx-auto-width.dx-dropdowneditor-button-visible .dx-texteditor-input {
    padding-right: 0px;
    font-size: 12px;
    letter-spacing: -0.01em;
}

.obz-ui.dx-selectbox.dx-state-hover .dx-texteditor-input {
    cursor: pointer; /* readonly일 경우에도 pointer 생기는 현상 */
}
.dx-selectbox .dx-textbox {
    border: 0px !important;
    height: 100%;
}

.obz-ui.dx-texteditor.dx-state-readonly {
    border-color: #d0d0d0;
}

.obz-ui.dx-state-readonly .dx-texteditor-input {
    color: #555 !important;
    /* background-color: #eee; */
}

.obz-ui.dx-state-disabled .dx-texteditor-input {
    color: #222 !important;
    /* background-color: #c0c0c0; */
}

.obz-textbox.obz-ui.dx-state-disabled,
.obz-mask.obz-ui.dx-state-disabled,
.obz-numeric.obz-ui.dx-state-disabled,
.obz-textarea.obz-ui.dx-state-disabled,
.obz-date.obz-ui.dx-state-disabled,
.obz-datetime.obz-ui.dx-state-disabled,
.obz-combo.obz-ui.dx-state-disabled {
    background-color: #c0c0c0;
}

.obz-date .dx-dropdowneditor-button {
    width: 20px;
    padding: 1px;
}

/* .obz-date .dx-texteditor-input {
    padding-right: 5px !important;
} */

/*.obz-ui .dx-texteditor-input {
    border-radius: 0px;
}*/

.obz-ui {
    display: inline-block;
    border-radius: 0px;
    transition: border-color .1s;
}

.obz-label {
    display: flex;
    box-sizing: border-box;
    min-height: 15px;
    padding-left: 3px;
    border-style: solid;
    border-width: 0px;
    border-radius: 0px;
    color: #66696B;
    font-size: 12px;
    font-weight: normal;
    vertical-align: text-bottom;
    /* cursor: text; */
    cursor: default;
    overflow: hidden;
    align-items: center;
}
/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	letter-spacing: -0.9px;
 */
.obz-check {
    border-style: solid;
    border-width: 0px;
    border-radius: 0px;
    border-color: #cbcbcb;
    vertical-align: text-bottom;
    letter-spacing: -0.9px;
}

/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * 	color: #ffffff;
 */
.obz-check .dx-checkbox-icon {
    color: #1768C1;
    border-color: #CBCBCB;
    /*background: #1768C1; */
}
.obz-check .dx-widget.dx-checkbox-checked .dx-checkbox-icon {
    /*background: #1768C1;*/
}
.obz-check .dx-checkbox-container > .dx-checkbox-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	padding : 0 10px;
 */
.obz-textbox {
    background-color: #ffffff;
    color: #333;
    border-width: 1px;
    border-style: solid;
    border-radius: 0;
    border-color: #ddd;
    vertical-align: super;
    /* padding : 0 10px;  */
}

.obz-textbox.dx-texteditor.dx-editor-outlined {
    border-style: solid;
    border-radius: 0px;
}

.obz-textbox .dx-texteditor-input,
.dx-numberbox .dx-texteditor-input {
    text-align: left;
    background: transparent;
    /* margin-right: 7px;*/ 
}

.obz-image {
    border-style: solid;
    border-width: 0px;
    border-radius: 0px;
    vertical-align: text-bottom;
}

.obz-image img {
    visibility: hidden;
    width: 100%;
    height: 100%;
}

.obz-shape {
    border-style: solid;
    border-width: 0px;
    border-radius: 0px;
    border-color: #a9a9a9;
}

.obz-progressbar {
    border-style: solid;
    border-width: 0px;
    border-radius: 0px;
}

.obz-progressbar .dx-trackbar-container {
    border-width: 1px;
    border-style: solid;
    border-color: #ddd;
    background-color: #ddd;
}

.obz-progressbar .dx-progressbar-range {
    border-color: #1768c1;
    background-color: #1768c1;
}

.obz-attachfile {
    border-style: solid;
    border-width: 0px;
    border-radius: 0px;
    box-sizing: border-box;
}

.obz-attachfile .input-container {
    position: absolute;
    left: 0px;
    right: 78px;
    height: 21px;
    padding: 0px;
}

.obz-attachfile .attachtxtFileName {
    position: absolute;
    width: 100%;
    height: 17px;
    border: 1px solid #ddd;
}

.obz-attachfile .attachselectFile {
    position: absolute;
    width: 70px;
    right: 0px;
    height: 21px;
}

.obz-attachfile .dx-fileuploader-wrapper {
    padding: 0px;
}

.obz-attachfile .dx-fileuploader-input-wrapper {
    padding: 0px;
    border: 0px;
}

.obz-attachfile .dx-fileuploader-button {
    height: 21px;
    border-radius: 0px;
}

.obz-attachfile .dx-fileuploader-container {
    display: block;
	table-layout: auto;
}

.obz-attachfile .dx-fileuploader-content {
	display: block;
	height: 100%;
}

.obz-attachfile .dx-fileuploader-button,
.obz-attachfile .dx-fileuploader-upload-button {
    display: none;
}

/* IE */
.obz-attachfile .dx-fileuploader-button .dx-button-content {
    /*IE6 IE7*/
    padding: 2px 10px 4px;
}

.obz-attachfile .dx-fileuploader-button .dx-button-content {
    /*IE8 IE9*/
    padding: 2px 10px 4px\0 / IE8 + 9;
}

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {

    /*IE10 IE11*/
    .obz-attachfile .dx-fileuploader-button .dx-button-content {
        padding: 2px 10px 4px;
    }
}

.obz-attachfile .btn-selectFile {
    position: absolute;
    width: 80px;
    height: 100%;
    right: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #efefef;
    color: #565656;
    border: 1px solid #ddd;
    box-sizing: border-box;
    cursor: pointer;
}

.obz-attachfile .btn-selectFile:hover {
    background: #f5f5f5;
    color: #565656;
}

.obz-textarea {
    background-color: #ffffff;
    color: #333;
    border-width: 1px;
    border-style: solid;
    border-radius: 0;
    border-color: #ddd;
}
/* 2021-08-13 LYJ 
 * 아래 추가 사항
 * 	padding: 5px;
 * 아래 변경 사항
 * 	border-radius: 0px;
 */

.obz-textarea.dx-texteditor.dx-editor-outlined {
    border-style: solid;
    border-radius: 15px;
    /* padding: 5px; */
}

.obz-date,
.obz-datetime {
    background-color: #ffffff;
    color: #333;
    border-width: 1px;
    border-style: solid;
    border-radius: 0;
    border-color: #ddd;
}

.obz-date {
    vertical-align: text-bottom;
}

.obz-date.dx-texteditor.dx-editor-outlined {
    border-style: solid;
    border-radius: 0px;
}

.obz-datetime {
    vertical-align: text-bottom;
}

.obz-datetime.dx-texteditor.dx-editor-outlined {
    border-style: solid;
    border-radius: 0px;
}

.obz-combo {
    background-color: #ffffff;
    border-width: 1px;
    border-style: solid;
    border-radius: 0px;
    border-color: #ddd;
    vertical-align: text-bottom;
}

.obz-combo.dx-texteditor.dx-editor-outlined {
    border-style: solid;
    border-radius: 0px;
}
/*YHS 20210215 불필요한 스타일 주석*/
/*.obz-combo .dx-texteditor-input {
    padding-right: 16px;
}*/

.obz-combo .dx-dropdowneditor-button {
    width: 16px;
}
.obz-combo .dx-dropdowneditor-input-wrapper {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}
.obz-combo .dx-texteditor-container {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}
.obz-combo .dx-texteditor-container .dx-texteditor-input-container { 
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

.obz-combo .dx-texteditor-container .dx-texteditor-input-container > input {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}
.obz-combo .dx-texteditor-container .dx-texteditor-input-container > .dx-placeholder { 
    font-size: inherit;
    font-weight: inherit;
    /* color: inherit; */ /*placeholder가 input 색이랑 동일한 현상으로 인해 수정*/ 
}
.obz-multicombo .dx-texteditor-container .dx-texteditor-input-container > input {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}
.obz-multicombo .dx-texteditor-container .dx-texteditor-input-container > .dx-placeholder { 
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

.obz-multicombo-popup .dx-popup-content {
	padding: 5px;	
}

.obz-multicombo-popup .dx-popup-content colgroup col:first-child {
	width: 34px !important;
}

.obz-multicombo-popup .dx-datagrid-headers .dx-datagrid-table .dx-row > td {
	border-bottom: 0px ;
	color: #333 ;
}
.obz-multicombo-popup .dx-datagrid-rowsview {
	border-top: 0px;
}

.dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item-content {
    padding: 5px 8px;
}
.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
    background: #f5f5f7;
    color: #333;
}
.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected {
    background: #f0f0f2;
}
.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active {
    background: #f5f5f7;
    color: #333; /* color: #fff;*/
}

.obz-radio {
    vertical-align: text-bottom;
    /*padding-top: 4px;*/
    overflow: hidden;
    border-style: solid;
    border-width: 0px;
    border-radius: 0px;
    border-color: #cbcbcb;
}

.obz-radio .dx-radiobutton {
    margin-right: 0px;
}

.obz-radio .dx-radio-value-container {
    padding-right: 4px;
}

.obz-radio .dx-radiobutton-icon {
    width: 18px;
    height: 18px;
}

.obz-radio .dx-radiobutton-icon::before {
    width: 16px;
    height: 16px;
    border: 1px solid #e8e8ea;
    border-radius: 50%;
}

.obz-radio.dx-radiobutton-checked .dx-radiobutton-icon-dot {
    width: 6px;
    height: 6px;
    margin-top: -10px;
    border-radius: 10px;
}

.obz-radio.dx-radiogroup-horizontal .dx-radiobutton {
    margin-right: 8px; /*13*/
    margin-top: 4px;
    margin-bottom: 4px;
}
.obz-radio.dx-radiogroup-horizontal.align-right .dx-widget.dx-collection {
    display: flex;
    width: 100%;
    justify-content: flex-end;
}
.obz-radio.dx-radiogroup-horizontal.align-right .dx-radiobutton {
    margin-left: 13px;
    margin-right: 0px;
}

.obz-radio.dx-radiogroup-vertical .dx-radiobutton {
    margin-right: 0px;
    margin-top: 4px;
    margin-bottom: 4px;
}

.obz-radio.dx-radiogroup-horizontal .dx-widget.dx-collection {
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
}

.obz-radio .dx-radiobutton .dx-item-content {
    margin-top: 2px;
}

.obz-button {
    background: #1768C1;
    color: #ffffff;
    text-align: center;
    vertical-align: text-bottom;
    box-sizing: border-box;
    border-style: solid;
    border-width: 0px;
    border-radius: 0px;
    border-color: #CBCBCB;
}

.obz-button.dx-state-hover {
    background: #1768C1;
    color: #ffffff;
}

.obz-button>.dx-button-content {
    padding: 5px;
    justify-content: center;
    align-items: center;
}

/* 2020-12-10 LEJ */
/* 2021-01-05 YYM */
.obz-button .dx-icon {
    display: none;
    color: #ffffff;
    /*margin-top: -10px;
    margin-left: -10px;
    margin-right: 0px;*/
}
/*2021-02-09 YHS
.obz-button .dx-icon>svg {
    margin-top: -5px;
    margin-left: -5px;
}*/

/*.dx-button-has-icon .dx-icon{
    width: 100%;
    height: 100%;
}*/

.obz-button.dx-button-has-text .dx-icon {
/*    margin-right: 10px;*/
    margin-right: 6px;
}

.obz-button .dx-icon path {
    fill: #ffffff;
}


/* TreeMap 스타일*/
.obz-ui.obz-treemap .treemap-header {
	display: none;
	height: 30px;
	background-color: #eee;
}
.obz-ui.obz-treemap .treemap-content {
	height: 100%;
}
.obz-ui.obz-treemap.header-used .treemap-header {
	display: flex;
}
.obz-ui.obz-treemap.header-used .treemap-header .treemap-back {
	display: none;
	cursor: pointer;
}
.obz-ui.obz-treemap.header-used .treemap-header .treemap-back svg > path {
	fill: #555;
}
.obz-ui.obz-treemap.header-used .treemap-header .treemap-title {
	font-size: 13px;
	color: #555;
	line-height: 30px;
	cursor: default;
}
.obz-ui.obz-treemap.header-used .treemap-content {
	height: calc(100% - 30px);
}

.obzeframe {
    width: 100%;
    height: 100%;
    position: absolute;
}

iframe {
    border: none;
}

.obz-tabs {
    background: transparent;
}

.obz-item .obz-tabs-container {
    position: relative;
    height: 30px;
    width: auto;
    border-bottom-width: 0px;
    background-color: #ffffff;
}

.obz-item .obz-tabs-content {
    position: relative;
    border-style: solid;
    border-color: #d3d3d3;
    border-width: 1px;
    /*height: calc(100% - 30px);*/
	height: calc(100% - 32px);
    background-color: #ffffff;
    box-sizing: border-box;
}

.obz-panel {
    padding: 0px;
    /* overflow: auto; */
	overflow: hidden;
    box-sizing: border-box;
    border-style: solid;
    border-width: 0px;
    background: #ffffff;
    border-color: #CBCBCB;
}

.obz-filterExplorer {
    overflow-x: hidden;
    overflow-y: auto;
    border: 1px solid #aaa;
}

.obz-filterExplorer table {
    width: 100%;
    height: auto;
    table-layout: auto;
    border-collapse: collapse;
}

.obz-filterExplorer td {
    padding: 5px 0px 5px 10px;
    border-bottom: 1px solid #d0d0d0;
}

.obz-filterExplorer .txt-searchexp,
.obz-filterExplorer .btn-searchexp {
    border-radius: 0px;
    border: 1px solid #bbb;
    margin: 2px;
}

/* filterExplorer check max-width */
.obz-filterExplorer .expcheck {
    height: 26px;
    margin-right: 4px;
    max-width: 100px;
    display: inline-block;
}

.obz-filterExplorer .expcheck.disabled label{
    opacity: 0.5;
}

/* 공통 스타일 */
.obz-filterExplorer .expcheck input[type="checkbox"] {
    display: none;
}
.obz-filterExplorer .expcheck input[type="checkbox"] + label {
    cursor:pointer;
 }

.obz-filterExplorer .expcheck input[type="checkbox"] + label > span {
    vertical-align: middle;
    padding-left: 5px;
 }

.obz-filterExplorer .expcheck input[type="checkbox"] + label:before {
    content:"";
    display:inline-block;
    width:10px;
    height:10px;
    border:2px solid #eaeaec;
    border-radius: 5px;
    vertical-align:middle;
    margin-right: 6px;
    padding: 1px 2px 3px 2px;
    background-color: #ffffff;
}
.obz-filterExplorer .expcheck input[type="checkbox"]:hover + label:before {
    border-color: #91BDFF;
}
.obz-filterExplorer .expcheck input[type="checkbox"]:active + label:before {
    border-color: #4D99E7;
}
.obz-filterExplorer .expcheck input[type="checkbox"]:checked + label:before {
    content:"\f005";
    background-color: #ffffff;
    font: 10px/12px DXIcons;
    font-family: 'DXIcons' !important;
    color: #0167FF;
    font-weight: bold;
}

/*.expcheck.chk-show {
	display: block;
}*/

.obz-filterExplorer .valuelist-check {
    margin: 7px;
}

.obz-filterExplorer .valuelist-check.chk-hide {
    display: none;
}

.obz-filterExplorer .valuelist-check .checkbox-text {
    vertical-align: text-top;
}

.obz-filterExplorer .td_title {
    width: 1%;
    white-space: nowrap;
    border-right: 1px solid #ccc;
    background-color: #ededed;
    min-width: 50px;
}

.obz-filterExplorer .td_cond {
    background-color: #fafafa;
}

.obz-filterExplorer .td_cond .cond-container {
    min-height: 30px;
    position: relative;
    overflow: hidden;
}

.obz-filterExplorer .td_more {
    background-color: #fafafa;
    padding: 5px;
    padding-top: 9px;
    text-align: center;
    vertical-align: top;
}

.obz-filterExplorer .btn-more,
.obz-filterExplorer .btn-pop {
    background: transparent;
    border: 0px;
}

.obz-filterExplorer .btn-more .dx-icon,
.obz-filterExplorer .btn-pop .dx-icon {
    color: #999999;
    font-size: 14px;
}

.valuelist-popup .dx-popup-content .valuelist-container {
    position: relative;
    width: 100%;
    height: 100%;
}

.obz-filterExplorer .td_grouptitle {
    background-color: #d0d4db;
    height: 22px;
    font-weight: bold;
    border-bottom: 1px solid #bbb;
}

.obz-filterExplorer .groupbtn {
    background-color: transparent;
    border-color: transparent;
}

.obz-filterExplorer .groupbtn .dx-button-content {
    padding: 3px 0px 4px;
}

.obz-filterExplorer .groupbtn .dx-icon {
    color: #606060;
}

/* filterExplorer check max-width */
.obz-filterExplorer .checkbox-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 80px;
    display: inline-block;
}

.obz-filterExplorer .obz-ui {
    margin: 3px;
}

.obz-filterExplorer .expSearch-container {
    position: relative;
    width: 100%;
    height: 30px;
    padding: 1px 0px;
    border-bottom: 1px solid #aaa;
}

.obz-filterExplorer .txt-searchexp {
    position: absolute;
    left: 1px;
    right: 31px;
    height: 26px;
}

.obz-filterExplorer .btn-searchexp {
    position: absolute;
    right: 1px;
    width: 31px;
    height: 26px;
}

.obz-filterExplorer .expTable-container {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    overflow: auto;
}

.obz-filterExplorer .dx-radiobutton {
    margin-right: 15px;
}

.obz-filterExplorer .dx-radio-value-container {
    width: 23px;
}

.obz-filterExplorer .obz-radio.dx-radiogroup-horizontal .dx-radiobutton{
    margin-top: 2px;
    margin-bottom: 2px;
}

.obz-filterExplorer .obz-ui.obz-combo .dx-placeholder::before{
    padding: 0px 5px;
    margin-top: -10px;
}

.obz-filterExplorer .obz-explorer-cover {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
    height: 100%;
    
    background: rgba(0,0,0,0.05);
}

.obz-grid {
    width: auto;
    border-radius: 0px;
}

.obzpicture {
    border-width: 0px;
}

.obzpicture .dx-icon {
    width: 100%;
    height: 100%;
    object-fit: none;
}

.obzbrtree {
    overflow: auto;
}

.div-container {
    display: flex;
}

/* Table Layout */
.obz-tablelayout {
    overflow: hidden;
}

.obz-tablelayout table {
    /*table {*/
    width: 100%;
    height: 100%;
}

.obz-tablelayout td {
    position: relative;
    height: 1px;
}

.obz-tablelayout td>div {
    height: 100%;
}

/* HTMLEditor */
.note-editor .btn-group {
    margin-bottom: 0px !important;
    margin-right: 2px !important;
}

.note-editor .note-btn {
    padding: 2px 6px;
}

.obz-tree {
    border-style: solid;
    border-width: 0px;
    height: auto;
}
.obz-tree .dx-searchbox .dx-placeholder::before {
    padding-top: 0;
}

.obz-treelist {}

.obz-treelist .dx-treelist-headers {
    border-bottom-width: 0;
}

.obz-treelist .dx-treelist-headers .dx-row>td {
    text-align: center !important;
}
.obz-treelist .dx-treelist-search-panel .dx-placeholder::before {
    padding-top: 0;
}


/* 2021-08-13 LYJ 
 * 아래 추가 사항
 *	font-family:  'DXIcons' !important;
 */
.obz-treelist .dx-treelist-rowsview .dx-treelist-content .dx-row .dx-treelist-empty-space {
    vertical-align: sub;
    font-family:  'DXIcons' !important;
    margin-right: 5px;
}

/* 2021-08-13 LYJ 
 * 아래 추가 사항
 *	font-family:  'DXIcons' !important;
 */

.obz-metatree.dx-treelist .dx-treelist-content, .obz-treelist.dx-treelist .dx-treelist-content {
    user-select: none;
}

/* SCROLL */
/* Chrome */

/* 2021-08-13 LYJ 
 * 아래 추가 사항
 *	 border-radius: 5px;
 */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 7px rgba(0, 0, 0, 0.1);
    background-color: #f5f5f5;
    border-radius: 10px;
}


/* 2021-08-13 LYJ 
 * 아래 변경 사항
 *	 width: 10px;
 */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background-color: #f5f5f5;
}

/* 2021-08-13 LYJ 
 * 아래 추가 사항 (클래스 전체)
 */
[class^="dx-scrollable-scroll"]{
    border-radius: 15px;
}

/* 2021-08-13 LYJ 
 * 아래 변경 사항
 *	 border-radius: 5px;
 * 아래 삭제 사항
 *	border: 1px #e5e5e5 solid;
 */
::-webkit-scrollbar-thumb {
    background-color: #bbb;
    border-radius: 10px;
}

/* IE */
html {
    scrollbar-base-color: #ccc;
    scrollbar-track-color: #f5f5f5;
    scrollbar-face-color: #ccc;
    scrollbar-arrow-color: #000;
    scrollbar-3dlight-color: #ccc;
    scrollbar-highlight-color: #ccc;
    scrollbar-shadow-color: #ccc;
    scrollbar-darkshadow-color: #ccc;
}

.obz-mask {
    background-color: #ffffff;
    color: #333;
    border-width: 1px;
    border-style: solid;
    border-radius: 0;
    border-color: #ddd;
}

.obz-mask.dx-texteditor.dx-editor-outlined {
    border-style: solid;
    border-radius: 0px;
}

.obz-mask .dx-texteditor-input {
    text-align: left;
}

.obz-mask.dx-invalid.dx-texteditor .dx-texteditor-container:after {
    display: none;
}

.obz-mask.dx-invalid.dx-texteditor .dx-texteditor-input {
    padding: 3px 5px 4px;
}

.obz-numbertext {
    background-color: #ffffff;
    color: #333;
    border-width: 1px;
    border-style: solid;
    border-radius: 0;
    border-color: #ddd;
}

/* ANCHOR - 2021-01-29 YYM default가 spin true이기 때문에 영역이 잡힐 수 밖에 없는 문제*/
.obz-numbertext .dx-numberbox-spin-container {
    width: 24px;
}

.obz-numbertext .dx-numberbox-spin-button,
.obz-numbertext .dx-numberbox-spin-down-icon, 
.obz-numbertext .dx-numberbox-spin-up-icon {
    border-radius: inherit;
}

.obz-numbertext .dx-texteditor-buttons-container {
    display: none;
}

.obz-numbertext.dx-numberbox-spin .dx-texteditor-buttons-container {
    display: block;
}

/* NullableDate CSS */
.obz-date .maskctl.dx-invalid.dx-texteditor .dx-texteditor-container:after {
    display: none;
}

.obz-date .datectl .dx-dropdowneditor-button {
    width: 23px;
}

/*.DockTop {
	top: 0;
	left: 0;
	right: 0;
}
.DockLeft {
	top: 0;
	left: 0;
	bottom: 0;
}
.DockBottom {
	left: 0;
	bottom: 0;
	right: 0;
}
.DockRight {
	top: 0;
	bottom: 0;
	right: 0;
}
.DockFill {
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}*/

/* ANCHOR - 2020-12-01 GNH */
/* 2021-08-13 LYJ 
 * 아래 변경 사항
 *	background: #337ab7;
 */
.obz-ui.obz-radio .dx-radiobutton-icon-checked .dx-radiobutton-icon-dot {
    display: block;
    margin-top: -14px;
    margin-left: 4px;
    width: 10px;
    height: 10px;
    background: #0167ff;
    content: "";
    border-radius: 5px;
}

/* 2021-08-13 LYJ 
 * 아래 추가 사항 (클래스 전체)
 */
.obz-radio .dx-radiobutton.dx-state-hover .dx-radiobutton-icon::before {
    border-color: #B0D0ED;
}

/* 2021-08-13 LYJ 
 * 아래 추가 사항 (클래스 전체)
 */
.obz-radio .dx-radiobutton.dx-state-focused:not(.dx-state-active) .dx-radiobutton-icon::before {
    border-color: #B0D0ED;
}

.obz-radio .dx-radiobutton.dx-state-active .dx-radiobutton-icon::before {
    background-color: #ffffff;
}

/* ANCHOR - 2020-12-03 YYM */
/* 2021-08-13 LYJ 
 * 아래 변경 사항
 *	top: calc(50% - 8px);
 */
.obz-check.dx-widget .dx-checkbox-icon {
    position: absolute;
    top: calc(40% - 8px);
}

/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * top: calc(50% - 8px);
 * 아래 삭제 사항
 * left: 15px;
 * 아래 추가 사항
 * margin: 0px;
 */
.obz-check.dx-widget .dx-checkbox-text {
    position: absolute;
    
    
    top: calc(50% - 10px);
    margin: 0px;

/* 2021-08-13 LYJ 
 * 아래 삭제 사항 (클래스 전체)
 * 	.obz-check.dx-widget.dx-checkbox-checked .dx-checkbox-icon {
 * 	   background: #1768C1;
 * 	}
 */
}

/* ANCHOR - 2021-01-27 YYM - check group*/
.obz-check.disabled .chkgroup-container {
    opacity: .7;
    pointer-events: none;
}
.obz-check .chkgroup-container>div {
    margin-top: 5px;
    margin-right: 10px;
}

.obz-check .chkgroup-container>div .dx-checkbox-text {
    white-space: nowrap;
}

.obz-check.obz-horizontal .chkgroup-container {
    white-space: nowrap;
}

.obz-check.obz-vertical .chkgroup-container>div {
    display: block;
}

/* 체크일 경우에는 ... 표시 체크 그룹일 때는 ... 표시 x */
.obz-check .chkgroup-container .dx-checkbox-container {
    text-overflow: clip;
}

/* 2021-08-13 LYJ 
 * 아래 삭제 사항
 *	background-color: #ffffff;
 *	border-style: solid;
 *	border-width: 0px;
 *	border-radius: 0px;
 *	border-color: #ddd;
 * 아래 추가 사항
 *	background-color: #1768C1;
 *	border-radius: 20px;
 *	box-shadow: rgb(0 0 0 / 15%) 0px 10px 20px;
 */
.obz-dropdownbutton {
    background-color: #2168CE;
    border-radius: 30px;
/*    box-shadow: rgb(0 0 0 / 15%) 0px 10px 20px;*/
}

.dx-dropdownbutton-popup-wrapper .dx-list-item-content {
    padding: 7px 10px !important;
}

/* 2021-08-23 LYJ 
 * 아래 추가 사항 : 전체
 */
 .obz-dropdownbutton .dx-button-mode-outlined .dx-icon {
    color : #ffffff !important;
}

.obz-dropdownbutton.obz-ui.dx-dropdownbutton-has-arrow .dx-buttongroup-wrapper {
    width: 93% !important;
}

/* ANCHOR - 2020-12-08 GNH (TextArea borderRadius 적용 시 잘림 현상으로 수정) */
.dx-widget textarea {
    background: transparent;
}

/* ANCHOR - 2020-12-14 GNH (DataGrid Default css) */
.obz-datagrid .dx-gridbase-container {
    border-style: solid;
    border-radius: 0px;
    border-width: 0px;
}

.obz-datagrid .dx-datagrid-headers {
    border-bottom-width: 0;
}

.obz-datagrid .dx-datagrid-rowsview {
    border-top-width: 0;
}

/* ANCHRO - 2021-02-23 YYM - grid header 감출 때 헤더 border도 사라지는 현상 방지*/
.obz-datagrid.obz-grid-header-hide .dx-datagrid-rowsview {
	border-top-width: 1px;
}

.obz-datagrid .dx-datagrid-rowsview .dx-data-row .dx-cell-modified::after {
    border-color: transparent;
}

.obz-datagrid .dx-datagrid-rowsview .dx-data-row .dx-cell-selected {
    position: relative;
}

.obz-datagrid .dx-datagrid-rowsview .dx-data-row .dx-cell-selected::after {
    left: 0;
    content: "";
    position: absolute;
    border: 2px solid transparent;
    top: 0;
    bottom: 0;
    right: 0;
    pointer-events: none;
    border-color: rgb(185 185 185);
}

.obz-datagrid .dx-datagrid-headers .dx-row>td {
    text-align: center !important;
}

.obz-datagrid .dx-datagrid-rowsview .dx-row {
    border-top: 0px;
}
.obz-datagrid .dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover:not(.dx-row-lines) > td, 
.obz-datagrid .dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):not(.dx-row-lines) > td {
    border-top: 0px;
}
.obz-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row > td, 
.obz-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row > tr > td {
    vertical-align: inherit;
}

.obz-datagrid .dx-datagrid-rowsview .dx-master-detail-row:not(.dx-datagrid-edit-form) .dx-master-detail-cell {
    background: #ececf1;
    /* background: #F9F9F9; */
}
.obz-datagrid .dx-searchbox .dx-placeholder::before {
    padding-top: 0;
}
.obz-datagrid .dx-datagrid-rowsview .dx-freespace-row {
    border: none !important;
}

/* 2021-08-13 LYJ 
 * 아래 추가 사항 (전체)
 */ /***********************************/
 .obz-datagrid 
 .dx-datagrid-borders > .dx-datagrid-filter-panel,
 .dx-datagrid-borders > .dx-datagrid-pager {
    border: none;
 }

/* ANCHOR index 사용 시 row index의 선은 항상 그려지도록 */
.obz-datagrid.obz-index .dx-datagrid-rowsview .dx-datagrid-content td[aria-colindex="1"] {
    border-right: 1px solid #ddd;
}

/* ANCHOR - 2020-12-15 YYM Default Line css */
.obz-line svg line {
    background: #ffffff01;
}

/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * 	stroke: #000000;
 */
.obz-line svg line {
/*    stroke: #bdbdbd;*/
    stroke: #f0f2f4;
    stroke-width: 1px;
}

/* ANCHOR - 2020-12-15 YYM dialog css */
body.obz-dialog {
    background-color: #ffffff;
}

/* Tooltip CSS - obztooltip*/
.obz-tooltip.dx-popup .dx-popup-wrapper>.dx-overlay-content {
    border: 1px solid #ececef;
    padding: 5px;
    border-radius: 6px;
}

.dx-popover-arrow::after {
    border: 1px solid #e8e8ea !important;
}

/* ANCHOR - 2021-01-06 YYM tooltip */
.obz-tooltip.dx-popup .dx-tooltip-wrapper .dx-popup-content {
    padding: 3px 7px 4px;
    /* border: 1px solid #ececef !important; */
}

.obz-tooltip.dx-popup .dx-tooltip-wrapper .dx-popup-content p {
    margin: 0px;
    font-size: 12px;
}

.obz-switch .dx-switch-container {
    min-height: 20px;
    border-style: solid;
    border-width: 1px;
    border-color: #ddd;
    border-radius: 100px;
    padding: 2px 4px 4px 4px;
}

.obz-switch.obz-ui .dx-switch-handle {
    /*flex-basis: 22% !important;*/
    height: 100% !important;
    margin-top: 2px;
}

.obz-switch.obz-ui .dx-switch-handle::before {
    border-radius: 100px;
}

.obz-switch.obz-ui .dx-switch-on {
    padding-right: 23%;
    font-size: 10px;
}

.obz-switch.obz-ui .dx-switch-off {
    padding-right: 20%;
    font-size: 10px;
}

.obz-switch.obz-ui .dx-switch-inner {
    align-items: center;
}

/*
.obz-switch .dx-switch-container {
    border-radius: 15px;
}

.obz-switch .dx-switch-handle::before {
    border-radius: 15px;
}

.obz-switch .dx-switch-on,
.obz-switch .dx-switch-off {
    visibility: hidden;
}*/

.obz-attachfile.obz-ui .input-container {
    /*height: calc(100% - 4px);*/
	height: 100%;
}

.obz-attachfile.obz-ui .input-container input {
	box-sizing: border-box;
    height: 100%;
}

.obz-attachfile.obz-ui .attachselectFile {
    height: 100%;
}

.obz-attachfile.obz-ui .dx-fileuploader-input-wrapper {
    height: 100%;
}

.obz-attachfile.obz-ui .dx-fileuploader-input-wrapper::before {
    padding-top: 0;
    margin-top: 0;
}

.obz-attachfile.obz-ui .dx-fileuploader-button {
    height: 100%;
}

.obz-attachfile.obz-ui .dx-fileuploader-files-container {
    display: none;
}

/* toggle button */
.obz-togglebutton.obz-ui.checked {
    background-color: #ffffff;
    font-size: 12px;
    color: #333;
    border-width: 1px;
    border-style: solid;
    border-color: #ddd;
    border-radius: 0px;
}

.obz-togglebutton.obz-ui.checked svg {
    fill: #333;
}

.obz-togglebutton.obz-ui.unchecked {
    background-color: #ffffff;
    font-size: 12px;
    color: #333;
    border-width: 1px;
    border-style: solid;
    border-color: #ddd;
    border-radius: 0px;
}

.obz-togglebutton.obz-ui.unchecked svg {
    fill: #333;
}



/* 2021-02-09 YYM FilterExplorer, Filtering*/
.obzadvancedfiltercontainer .obz-tabs-content .obz-treelist .dx-treelist-rowsview {
	border-width: 0;
}

.valuelist-container .obz-check .dx-checkbox-text {
	line-height: 15px !important;
}

.valuelist-container .button-search-icon .dx-icon {
	display: block;
	padding: 5px 0;
	color: #0167FF;
    font-size: 18px;
}

.valuelist-container .dx-radiobutton-icon-checked .dx-radiobutton-icon-dot {
    margin-top: -12px;
    margin-left: 4px;
}

.obz-filterExplorer .td_title {
    max-width: 84px;
    overflow: hidden;
    word-break: break-word;
    text-overflow: ellipsis;
}

.obz-filterExplorer .obz-ui {
	margin: 0px;
	padding: 3px;
}

.obz-filterExplorer td {
    padding: 5px 10px;
}

.obz-filterExplorer .dx-radio-value-container {
    width: 20px;
}

.obz-filterExplorer .obz-radio.dx-radiogroup-horizontal .dx-radiobutton {
	margin-right: 4px;
}

.obz-filterExplorer .td_cond .cond-container {
	padding: 1px 0;
}

.obz-filterExplorer .td_cond .cond-container > div {
    line-height: 23px;
}

.obz-filterExplorer .obz-radio.dx-radiogroup-horizontal .dx-widget.dx-collection {
    position: relative;
}

.obz-filterExplorer .popup-label {
    position: absolute;
    display: flex;
    align-items: center;
    font-size: 13px;
    color: #333;
    padding: 0 8px;
    min-height: 28px;
    cursor: default;
}
.obz-filterExplorer .popup-label:empty:before {
    content: "선택해주세요";
    color: #676767;
    line-height: 30px;
}

/* 2021-03-11 YYM treelist search box center 속성 */
.obz-ui.obz-treelist .dx-treelist-header-panel .dx-toolbar,
.obz-ui.obz-metatree .dx-treelist-header-panel .dx-toolbar {
    margin-top: 5px;
}

.obz-ui.obz-treelist .dx-treelist-header-panel .dx-toolbar .dx-toolbar-after,
.obz-ui.obz-metatree .dx-treelist-header-panel .dx-toolbar .dx-toolbar-after {
    width: 100%;
    padding-left: 0;
}

.obz-ui.obz-treelist .dx-treelist-search-panel,
.obz-ui.obz-metatree .dx-treelist-search-panel {
    margin: 0;
}


/* ====================== metatree ==============================*/
.obz-ui.obz-metatree {
	position: relative;
}

.obz-ui.obz-metatree .obz-metatree-wrap {
	position: relative;
	width:100%;
	height: 100%;
	border: 1px solid #ECECF1;
	box-sizing: border-box;
	background: #fff;
    border-radius: 7px;
}

.obz-ui.obz-metatree .obz-metatree-search {
	display:none;
	width:100%;
	height: 32px;
	border-bottom: 1px solid #ECECF1;
}

.obz-ui.obz-metatree .obz-metatree-search-box {
	position: absolute;
	top: 4px;
	left: 5px;
	right:60px;
	border: 0 !important;
	border-right: 1px solid #ddd;
}

.obz-ui.obz-metatree .obz-metatree-search-btn {
	position: absolute;
	top: 4px;
	width: 25px;
	height: 25px;
	right: 30px;
	background-color: transparent;
}

.obz-ui.obz-metatree .obz-metatree-search-btn i {
	display: block;
	color: #888;
	font-size: 15px;
}

.obz-ui.obz-metatree .obz-metatree-search-close {
	position: absolute;
	top: 4px;
	width: 25px;
	height: 25px;
	right: 5px;
	background-color: transparent;
}

.obz-ui.obz-metatree .obz-metatree-search-close i {
	display: block;
	color: #888;
	font-size: 15px;
}

.obz-ui.obz-metatree .obz-metatree-search-cont {
	position: absolute;
	display:none;
	width:100%;
	height: calc(100% - 33px);
}

.obz-ui.obz-metatree .obz-metatree-search-cont .dx-datagrid-headers,
.obz-ui.obz-metatree .obz-metatree-search-cont .dx-datagrid-rowsview {
	border: 0;
}

.obz-ui.obz-metatree .obz-metatree-cont {
	position: absolute;
	width:100%; 
	height:100%;
}

.obz-ui.obz-metatree .obz-metatree-cont .dx-treelist-rowsview {
	border: 0;
}

.obz-ui.obz-metatree.search .obz-metatree-search {
	display:block;
}

.obz-ui.obz-metatree.search .obz-metatree-search-cont {
	display:none;
}

.obz-ui.obz-metatree.search .obz-metatree-search-box .dx-placeholder {
    padding: 0;
}

.obz-ui.obz-metatree.search .obz-metatree-cont { 
	display:block;
	height: calc(100% - 33px);
}

.obz-ui.obz-metatree.show .obz-metatree-cont {
	display:none;
}

.obz-ui.obz-metatree.show .obz-metatree-search-cont {
	display:block;
}

/* ====================== filterdefine ==============================*/
.obz-filterdef .obz-filter-metatree {
}
.obz-filterdef .obz-filter-panel {
    display:none;
    overflow: hidden !important;
/*    border: 1px solid #ECECF1;*/
    background-color: #F8F8FA;
    border-radius: 7px;
}
.obz-filterdef.open .obz-filter-metatree {
    display: none;
}
.obz-filterdef.open .obz-filter-panel {
    display: flex;
}
.obz-filterdef.with-tree .obz-filter-metatree {
    display: block;
    top: 0 !important;
    width: 240px !important;
}
.obz-filterdef.with-tree.expand-tree .obz-filter-metatree {
    width: 100% !important;
}
.obz-filterdef.with-tree .obz-filter-panel {
    display: flex;
    left: 245px !important;
}
.obz-filterdef.with-tree.expand-tree .obz-filter-panel {
    display: none;
}
.obz-filterdef.with-tree .obz-filter-header {
    position: absolute;
    top: 0;
    left: 245px !important;
    width: calc(100% - 245px);;
}
.obz-filterdef.with-tree.expand-tree .obz-filter-header {
    display: none;
}
.obz-filterdef .item-container {
    background: #F8F8FA;
    border-radius: 7px;
}
.obz-filterdef .div-container {
    font-size: 13px;
}
.obz-filterdef .div-container .filterdef-title {
    color:#aaa;
    cursor:default;
}
.obz-filterdef.set .div-container .filterdef-title {
    display: none;
}
.obz-filterdef .div-container .filterdef-name {
    color: #454545;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.obz-filterdef .div-container .filterdef-desc {
    display: none;
}
.obz-filterdef .div-container .filterdef-return-btn {
    display: none;   
}
.obz-filterdef .div-container .filterdef-close-btn {
    display: none;   
}
.obz-filterdef.set .div-container .filterdef-return-btn {
    display: block;      
}
.obz-filterdef.open .div-container .filterdef-return-btn {
    display: none;      
}
.obz-filterdef.open .div-container .filterdef-close-btn {
    display: block;
}
.obz-filterdef.open.with-tree .div-container .filterdef-close-btn {
    display: none;
}
.obz-filterdef.with-tree .div-container .filterdef-return-btn {
    display: block;
}
.obz-filterdef .div-container .list-container {
/*    border: 1px solid #ECECF1;*/
    box-sizing: border-box;
    padding: 5px; 
}
.obz-filterdef .div-container .list-container.left {
/*    border-radius: 7px;*/
}
.obz-filterdef .div-container .list-container.right {
/*    border-radius: 7px;   */
}

.obz-filterdef .div-container .list-container.left {
    display: block;
    width: 100%;
}
.obz-filterdef .div-container .list-container.right {
    display: none;
}
.obz-filterdef .div-container .list-container.left.between {
    width:50%;
    border-right: 1px solid #e8e8ea;
}
.obz-filterdef .div-container .list-container.right.between {
    display: block;
    width:50%;
}
.obz-filterdef .div-container .input-container.left {
    display: block;
    width: 100%;
}
.obz-filterdef .div-container .input-container.right {
    display: none;
}
.obz-filterdef .div-container .input-container.field {
    display: none;
}
.obz-filterdef .div-container .input-container.hint {
    display: none;
}
.obz-filterdef .div-container .input-container.left.between {
    width:50%;
}
.obz-filterdef .div-container .input-container.right.between {
    display: block;
    width:50%;
}
.obz-filterdef .div-container .input-container.left.useField {
    width:calc(100% - 170px);
}
.obz-filterdef .div-container .input-container.field.useField {
    display: block;
}
.obz-filterdef .div-container .input-container.left.between.useField {
    width:calc(50% - 80px);
}
.obz-filterdef .div-container .input-container.right.between.useField {
    display: block;
    width:calc(50% - 80px);
}
.obz-filterdef .div-container .input-container.left.useHint {
    width:calc(100% - 210px);
}
.obz-filterdef .div-container .input-container.hint.useHint {
    display: block;
}
.obz-filterdef .div-container .input-container.left.between.useHint {
    width:calc(50% - 100px);
}
.obz-filterdef .div-container .input-container.right.between.useHint {
    display: block;
    width:calc(50% - 100px);
}

.obz-filterdef .div-container .input-container {
    border: 1px solid #ECECF1;
    padding: 2px 7px; 
    font-size: 13px;
    border-radius: 7px;
}
.obz-filterdef .optr-container {
    font-size: 13px;
    color: #454545;
}
.obz-filterdef.with-tree .optr-container .obz-radio {
    left: 50px !important;
}

.obz-filterdef .filterdef-pnlexample .filterdef-example p {
	height: 100%;
    color: #454545;
    word-break: keep-all;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.obz-filterdef .desc-container {
    display: none;
}
.obz-filterdef.open .desc-container {
    display: block;   
}
.obz-filterdef.with-tree .desc-container {
    display: block;
    left: 245px !important;
    width: calc(100% - 245px) !important;
}
.obz-filterdef.with-tree.expand-tree .desc-container {
    display: none;
}
.obz-filterdef .field-list {
    padding: 6px;
    border-radius: 7px;
    cursor: pointer;
}
.obz-filterdef .field-list:hover {
    background-color: #F1F2F4;
}
.obz-filterdef .ctllist-icon {
    
}
.obz-filterdef .field-list .ctllist-name {
    vertical-align: top;
    padding-left: 7px;
    cursor: pointer;
}
.obz-filterdef .field-tag {
    background: #F1F2F4;
    color: #333333;
    border-radius: 7px;
    padding: 4px 7px;
    word-break: keep-all;
    cursor: default;
}
.obz-filterdef .field-tag.field-error {
    background: #d565651a;
    color: #b38585;
}
.obz-filterdef .hint-wrap {
    color: #555;
    cursor: default;
}
.obz-filterdef .hint-list {
    height: 24px;
    padding: 4px 7px;
    font-size: 12px;
    color: #333;
    margin: 0 0px 4px;
    border-radius: 6px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
}
.obz-filterdef .hint-list:hover {
    background-color: #F1F2F4;
}
.obz-filterdef .hint-list.paste:hover {
    background: none;
}
.obz-filterdef .hide-check .dx-checkbox {
    display:none;
}
.obz-filterdef .hide-check .dx-treelist-icon-container.dx-editor-inline-block {
    padding-right: 5px;
}

.obz-filterdef .dx-placeholder {
    padding: 0 !important;
}
/*
.dx-popup-content .obz-filter-add {
    border-radius: 5px;
    height: 32px;
    background: #0167ff;
    color: #ffffff;
    font-size: 14px;
}
.dx-popup-content .obz-filter-add .dx-button-content {
    padding: 7px;
}
.dx-popup-content .obz-filter-add:hover {
    background: #025be1;
}
.obz-filterdef .div-container .dx-texteditor.dx-editor-outlined {
    border: 1px solid #e8e8ea;
    border-radius: 7px;
    padding: 0px;
}

.obz-filterdef .div-container .dx-texteditor.dx-editor-outlined.dx-state-hover,
.obz-filterdef .div-container .dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-hover .dx-checkbox-icon, 
.obz-filterdef .div-container .dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-focused .dx-checkbox-icon {
    border-color: #b0d0ed;
}
.obz-filterdef .div-container .dx-checkbox.dx-state-active .dx-checkbox-icon {
    background-color: #fff;
}
.obz-filterdef .div-container .dx-checkbox .dx-checkbox-icon {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border-color: #e8e8ea;
    color: #0167FF;
    font-weight: bold;
}
.obz-filterdef .div-container .dx-list-select-checkbox {
    margin-top: -2px;
}
.obz-filterdef .div-container .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before {
    margin-left: -5px;
}
.obz-filterdef .div-container .dx-checkbox .dx-checkbox-text {
    color: #444;
    line-height: 20px;
    padding-left: 22px;
}
.obz-filterdef .div-container .dx-checkbox.dx-state-hover .dx-checkbox-icon {
    border-color: #8ebbff;
}
.obz-filterdef .div-container .dx-checkbox.dx-state-focused .dx-checkbox-icon {
    border-color: #4D99E7;
}

.obz-filterdef .div-container .dx-dropdowneditor.dx-state-active .dx-dropdowneditor-icon, 
.obz-filterdef .div-container .dx-dropdowneditor.dx-state-hover:not(.dx-custom-button-hovered) .dx-dropdowneditor-icon,
.obz-filterdef .div-container .dx-state-hover.dx-numberbox-spin-button .dx-numberbox-spin-down-icon, 
.obz-filterdef .div-container .dx-state-hover.dx-numberbox-spin-button .dx-numberbox-spin-up-icon {
    background: #f0f0f2;
}
.obz-filterdef .div-container .dx-dropdowneditor-icon::before,
.obz-filterdef .div-container .dx-numberbox-spin-down-icon::before, 
.obz-filterdef .div-container .dx-numberbox-spin-up-icon::before {
    color: #606063;
}

.obz-filterdef .div-container .dx-texteditor.dx-editor-outlined input {
    font-family: 'Roboto', 'Pretendard';
    font-size: 13px;
}

.obz-filterdef .div-container .dx-texteditor.dx-editor-filled .dx-texteditor-input, 
.obz-filterdef .div-container .dx-texteditor.dx-editor-outlined .dx-texteditor-input {
    padding-left: 9px !important;
}
.obz-filterdef .div-container .dx-texteditor .dx-placeholder {
    padding-left: 5px;
    padding-top: 3px;
}
.obz-filterdef  .dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused).dx-column-lines > td {
    border-top-color: #F9F9FB;
    border-bottom-color: #F9F9FB;
    background: #F9F9FB;
}
*/
.obz-filterdef .layer-tree .dx-treelist-rowsview{
    border: 0;
}

#filterdef-popup .dx-popup-wrapper {
    z-index: 800 !important;
}

/* ====================== dataplanet ==============================*/
.obz-dataplanet {
    overflow: hidden;
}
.obz-dataplanet.designer {
    border: 1px solid #ddd;
	border-radius: 6px;
    overflow: hidden;
}


/* ====================== cardview ==============================*/
.obz-cardview {
	
}

.obz-cardview .dx-scrollview-content {
	width: 100%;
	height: 100%;
	overflow: auto;
}
.obz-cardview .dx-scrollview-content > .cv-item {
	position: relative;
    display: inline-block;
	overflow: hidden;
}
.obz-cardview.obz-click .dx-scrollview-content > .cv-item:hover {
	cursor: pointer;
}
.obz-cardview.obz-vertical .dx-scrollview-content {
	display: flex;
	flex-direction: column;
}
.obz-cardview.obz-vertical .dx-scrollview-content > .cv-item {
    flex: 0 0 auto;
}
.obz-cardview.obz-horizontal .dx-scrollview-content {
	display: flex;
}
.obz-cardview.obz-horizontal .dx-scrollview-content > .cv-item {
    flex: 0 0 auto;
}
.obz-cardview.disabled .dx-scrollview-content > .cv-item {
	opacity: 0.3;
	pointer-events: none;
}

.obz-cardview .cv-pager {
    display: flex;
    align-items: center;
}

.obz-cardview .cv-pager div {
    width: 32px;
    height: 32px;
    text-align: center;
    box-sizing: border-box;
    font-weight: bold;
    color: #bbbbbb;
    transition: all .1s;
}

.obz-cardview .cv-pager div.seperator {
    width: 16px;
    font-size: 20px;
    pointer-events: none;
}

.obz-cardview .cv-pager div.btn-prev,
.obz-cardview .cv-pager div.btn-next {
    font-size: 14px;
    padding: 8px 0px;
    border-radius: 50%;
}

.obz-cardview .cv-pager div.btn-page {
    font-size: 16px;
    font-weight: bold;
    color: #999;
    margin: 0px 3px;
    padding: 6px 0px;
    border-radius: 50%;
}

.obz-cardview .cv-pager div.btn-prev:hover,
.obz-cardview .cv-pager div.btn-next:hover,
.obz-cardview .cv-pager div.btn-page:hover {
    background: #f5f5f5 !important;
    cursor: pointer;
}

.obz-cardview .cv-pager div.btn-page.selected {
    color: #FFFFFF;
    background: #CE397D !important;
}


/* load panel */
/*.dx-loadpanel-content-wrapper {
    text-align: left;
}

.obz-loadpanel-white {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 30px 10px;
    border-radius: 32px;
}
.obz-loadpanel-white::before {
    height: 0;
}
.obz-loadpanel-wrap {
    display: inline-block;
    margin: 15px 0;
    vertical-align: middle;
}
.obz-loadpanel_icon{
    width:34px;
    height:38px;
    box-sizing:border-box;
    border-radius:50%;
    border-top:4px solid #e74c3c;
    position:relative;
    animation:a1 2s linear infinite;
}
  
.obz-loadpanel_icon:before,.obz-loadpanel_icon:after{
    content:'';
    width:34px;
    height:39px;
    position:absolute;
    left:0;
    top:-5px;
    box-sizing:border-box;
    border-radius:50%;
}
.obz-loadpanel_icon:before{
    border-top:4px solid #e67e22;
    transform:rotate(120deg);
}
.obz-loadpanel_icon:after{
    border-top:4px solid #3498db;
    transform:rotate(240deg);
}
.obz-loadpanel_icon span{
    text-align:center;
    width:34px;
    height:34px;
    position:absolute;
    line-height:200px;
    color:#fff;
    animation:a2 2s linear infinite;
}

@keyframes a1{
    to{
      transform:rotate(360deg);
    }
}
  
@keyframes a2{
    to{
      transform:rotate(-360deg);
    }
}*/

/**** LoadPanel Splash : LYJ ****/
.load-dots {
    width: auto;
    height: auto;
    position: absolute;
    top: 40%;
    bottom: 0;
    left: 50%;
    right: 0;
    margin: auto;
    outline: 1px solid red;
    filter: url(#goo);
    -o-filter: url(#goo);
    -ms-filter: url(#goo);
    -webkit-filter: url(#goo);
    -moz-filter: url(#goo);
}

.load-dot {
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
}
.load-dot:before {
    content: "";
    width: 30px; /*34*/
    height: 30px;
    border-radius: 49px;
    background: #1768C1;
    position: absolute;
    left: 50%;
    transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    margin-left: -15px; /*17.5*/
    margin-top: -15px;
}

.load-dot:nth-child(5):before {
    z-index: 100;
    width: 38px; /*44.5*/
    height: 38px;
    margin-left: -16px; /*21.75*/
    margin-top: -16px;
    animation: load-dot-colors 4.6s ease infinite;
    -o-animation: load-dot-colors 4.6s ease infinite;
    -ms-animation: load-dot-colors 4.6s ease infinite;
    -webkit-animation: load-dot-colors 4.6s ease infinite;
    -moz-animation: load-dot-colors 4.6s ease infinite;
}

.load-dot:nth-child(1) {
    animation: load-dot-rotate-1 4.6s 0s linear infinite;
    -o-animation: load-dot-rotate-1 4.6s 0s linear infinite;
    -ms-animation: load-dot-rotate-1 4.6s 0s linear infinite;
    -webkit-animation: load-dot-rotate-1 4.6s 0s linear infinite;
    -moz-animation: load-dot-rotate-1 4.6s 0s linear infinite;
}
.load-dot:nth-child(1):before {
    background-color: #2889da;  /* #7B68AB; */
    animation: load-dot-move 4.6s 0s ease infinite;
    -o-animation: load-dot-move 4.6s 0s ease infinite;
    -ms-animation: load-dot-move 4.6s 0s ease infinite;
    -webkit-animation: load-dot-move 4.6s 0s ease infinite;
    -moz-animation: load-dot-move 4.6s 0s ease infinite;
}

.load-dot:nth-child(2) {
    animation: load-dot-rotate-2 4.6s 1.15s linear infinite;
    -o-animation: load-dot-rotate-2 4.6s 1.15s linear infinite;
    -ms-animation: load-dot-rotate-2 4.6s 1.15s linear infinite;
    -webkit-animation: load-dot-rotate-2 4.6s 1.15s linear infinite;
    -moz-animation: load-dot-rotate-2 4.6s 1.15s linear infinite;
}
.load-dot:nth-child(2):before {
    background-color: #1c459c;  /* #4D4076; */
    animation: load-dot-move 4.6s 1.15s ease infinite;
    -o-animation: load-dot-move 4.6s 1.15s ease infinite;
    -ms-animation: load-dot-move 4.6s 1.15s ease infinite;
    -webkit-animation: load-dot-move 4.6s 1.15s ease infinite;
    -moz-animation: load-dot-move 4.6s 1.15s ease infinite;
}

.load-dot:nth-child(3) {
    animation: load-dot-rotate-3 4.6s 2.3s linear infinite;
    -o-animation: load-dot-rotate-3 4.6s 2.3s linear infinite;
    -ms-animation: load-dot-rotate-3 4.6s 2.3s linear infinite;
    -webkit-animation: load-dot-rotate-3 4.6s 2.3s linear infinite;
    -moz-animation: load-dot-rotate-3 4.6s 2.3s linear infinite;
}
.load-dot:nth-child(3):before {
    background-color: #2d2b5f;  /* #352741; */
    animation: load-dot-move 4.6s 2.3s ease infinite;
    -o-animation: load-dot-move 4.6s 2.3s ease infinite;
    -ms-animation: load-dot-move 4.6s 2.3s ease infinite;
    -webkit-animation: load-dot-move 4.6s 2.3s ease infinite;
    -moz-animation: load-dot-move 4.6s 2.3s ease infinite;
}

.load-dot:nth-child(4) {
    animation: load-dot-rotate-4 4.6s 3.45s linear infinite;
    -o-animation: load-dot-rotate-4 4.6s 3.45s linear infinite;
    -ms-animation: load-dot-rotate-4 4.6s 3.45s linear infinite;
    -webkit-animation: load-dot-rotate-4 4.6s 3.45s linear infinite;
    -moz-animation: load-dot-rotate-4 4.6s 3.45s linear infinite;
}
.load-dot:nth-child(4):before {
    background-color: #2168CE;  /* #1768C1; */
    animation: load-dot-move 4.6s 3.45s ease infinite;
    -o-animation: load-dot-move 4.6s 3.45s ease infinite;
    -ms-animation: load-dot-move 4.6s 3.45s ease infinite;
    -webkit-animation: load-dot-move 4.6s 3.45s ease infinite;
    -moz-animation: load-dot-move 4.6s 3.45s ease infinite;
}

@keyframes load-dot-move {
    0% {
        transform: translateY(0);
    }
    18%,
    22% {
        transform: translateY(-60px); /*68px*/
    }
    40%,
    100% {
        transform: translateY(0);
    }
}

@-o-keyframes load-dot-move {
    0% {
        -o-transform: translateY(0);
    }
    18%,
    22% {
        -o-transform: translateY(-60px);
    }
    40%,
    100% {
        -o-transform: translateY(0);
    }
}

@-ms-keyframes load-dot-move {
    0% {
        -ms-transform: translateY(0);
    }
    18%,
    22% {
        -ms-transform: translateY(-60px);
    }
    40%,
    100% {
        -ms-transform: translateY(0);
    }
}

@-webkit-keyframes load-dot-move {
    0% {
        -webkit-transform: translateY(0);
    }
    18%,
    22% {
        -webkit-transform: translateY(-60px);
    }
    40%,
    100% {
        -webkit-transform: translateY(0);
    }
}

@-moz-keyframes load-dot-move {
    0% {
        -moz-transform: translateY(0);
    }
    18%,
    22% {
        -moz-transform: translateY(-60px);
    }
    40%,
    100% {
        -moz-transform: translateY(0);
    }
}

@keyframes load-dot-colors {
    0% {
        background-color: #1768C1;
    }
    25% {
        background-color: #2889da;
    }
    50% {
        background-color: #1c459c;
    }
    75% {
        background-color: #2d2b5f;
    }
    100% {
        background-color: #1768C1;
    }
}

@-o-keyframes load-dot-colors {
    0% {
        background-color: #1768C1;
    }
    25% {
        background-color: #2889da;
    }
    50% {
        background-color: #1c459c;
    }
    75% {
        background-color: #2d2b5f;
    }
    100% {
        background-color: #1768C1;
    }
}

@-ms-keyframes load-dot-colors {
    0% {
        background-color: #1768C1;
    }
    25% {
        background-color: #2889da;
    }
    50% {
        background-color: #1c459c;
    }
    75% {
        background-color: #2d2b5f;
    }
    100% {
        background-color: #1768C1;
    }
}

@-webkit-keyframes load-dot-colors {
    0% {
        background-color: #1768C1;
    }
    25% {
        background-color: #2889da;
    }
    50% {
        background-color: #1c459c;
    }
    75% {
        background-color: #2d2b5f;
    }
    100% {
        background-color: #1768C1;
    }
}

@-moz-keyframes load-dot-colors {
    0% {
        background-color: #1768C1;
    }
    25% {
        background-color: #2889da;
    }
    50% {
        background-color: #1c459c;
    }
    75% {
        background-color: #2d2b5f;
    }
    100% {
        background-color: #1768C1;
    }
}

@keyframes load-dot-rotate-1 {
    0% {
        transform: rotate(-105deg);
    }
    100% {
        transform: rotate(270deg);
    }
}

@-o-keyframes load-dot-rotate-1 {
    0% {
        -o-transform: rotate(-105deg);
    }
    100% {
        -o-transform: rotate(270deg);
    }
}

@-ms-keyframes load-dot-rotate-1 {
    0% {
        -ms-transform: rotate(-105deg);
    }
    100% {
        -ms-transform: rotate(270deg);
    }
}

@-webkit-keyframes load-dot-rotate-1 {
    0% {
        -webkit-transform: rotate(-105deg);
    }
    100% {
        -webkit-transform: rotate(270deg);
    }
}

@-moz-keyframes load-dot-rotate-1 {
    0% {
        -moz-transform: rotate(-105deg);
    }
    100% {
        -moz-transform: rotate(270deg);
    }
}

@keyframes load-dot-rotate-2 {
    0% {
        transform: rotate(165deg);
    }
    100% {
        transform: rotate(540deg);
    }
}

@-o-keyframes load-dot-rotate-2 {
    0% {
        -o-transform: rotate(165deg);
    }
    100% {
        -o-transform: rotate(540deg);
    }
}

@-ms-keyframes load-dot-rotate-2 {
    0% {
        -ms-transform: rotate(165deg);
    }
    100% {
        -ms-transform: rotate(540deg);
    }   
}

@-webkit-keyframes load-dot-rotate-2 {
    0% {
        -webkit-transform: rotate(165deg);
    }
    100% {
        -webkit-transform: rotate(540deg);
    }
}

@-moz-keyframes load-dot-rotate-2 {
    0% {
        -moz-transform: rotate(165deg);
    }
    100% {
        -moz-transform: rotate(540deg);
    }
}

@keyframes load-dot-rotate-3 {
    0% {
        transform: rotate(435deg);
    }
    100% {
        transform: rotate(810deg);
    }
}

@-o-keyframes load-dot-rotate-3 {
    0% {
        -o-transform: rotate(435deg);
    }
    100% {
        -o-transform: rotate(810deg);
    }
}

@-ms-keyframes load-dot-rotate-3 {
    0% {
        -ms-transform: rotate(435deg);
    }
    100% {
        -ms-transform: rotate(810deg);
    }
}

@-webkit-keyframes load-dot-rotate-3 {
    0% {
        -webkit-transform: rotate(435deg);
    }
    100% {
        -webkit-transform: rotate(810deg);
    }
}

@-moz-keyframes load-dot-rotate-3 {
    0% {
        -moz-transform: rotate(435deg);
    }
    100% {
        -moz-transform: rotate(810deg);
    }
}

@keyframes load-dot-rotate-4 {
    0% {
        transform: rotate(705deg);
    }
    100% {
        transform: rotate(1080deg);
    }
}

@-o-keyframes load-dot-rotate-4 {
    0% {
        -o-transform: rotate(705deg);
    }
    100% {
        -o-transform: rotate(1080deg);
    }
}

@-ms-keyframes load-dot-rotate-4 {
    0% {
        -ms-transform: rotate(705deg);
    }
    100% {
        -ms-transform: rotate(1080deg);
    }
}

@-webkit-keyframes load-dot-rotate-4 {
    0% {
        -webkit-transform: rotate(705deg);
    }
    100% {
        -webkit-transform: rotate(1080deg);
    }
}

@-moz-keyframes load-dot-rotate-4 {
    0% {
        -moz-transform: rotate(705deg);
    }
    100% {
        -moz-transform: rotate(1080deg);
    }
}
/********************************/

/**** Toast ****/
/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * 	background-color: #1f8ddc;
 */
.dx-toast-info {
    background-color: #7a7d89e5;
}
.dx-toast-warning {
    background-color: #f7a207e8;
}
.dx-toast-error {
    background-color: #e53647e0;
}
.dx-toast-success {
    background-color: #146bebe0;
}
.dx-toast-message {
    font-size: 13px;
}

/* 2021-08-13 LYJ 
 * 아래 변경 사항
 * 	 border-radius: 15px;
 */
.dx-toast-content {
    cursor: default;
    min-height: 42px;
    font-weight: 400;
    padding: 4px 23px 5px 20px;
    border-radius: 20px;
}
.dx-toast-icon {
    display: block;
}

/* ============================ Calendar PopUp : LYJ (전체추가) ============================ */
/* #7B68AB => #195ab5 => #0167FF*/
.dx-calendar-navigator .dx-calendar-caption-button.dx-button .dx-button-content {
    color: #0167FF;
}

.dx-calendar-navigator-previous-view.dx-button .dx-icon, .dx-calendar-navigator-next-view.dx-button .dx-icon {
    color: #0167FF;
    font-family: 'DXIcons' !important;
}

.dx-calendar-cell.dx-calendar-selected-date, .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today{
    box-shadow: inset 0 0 0 1000px #0167FF;
}

.dx-calendar-cell.dx-calendar-selected-date.dx-calendar-contoured-date, .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today.dx-calendar-contoured-date {
    -webkit-box-shadow: inset 0 0 0 1000px #0167FF;
    box-shadow: inset 0 0 0 1000px #0167FF;
}


/* ============================ textbox 속성 : LYJ (전체추가) ============================ */
.obz-textbox.dx-texteditor.dx-editor-outlined {
    border : 1px solid #e0e0e0;
    /* border-radius: 13px; */
    /* padding: 0 5px; */
}

.obz-textbox.dx-texteditor.dx-state-active.dx-editor-filled, 
.obz-textbox.dx-texteditor.dx-state-active.dx-editor-outlined, 
.obz-textbox.dx-texteditor.dx-state-active.dx-editor-underlined, 
.obz-textbox.dx-texteditor.dx-state-focused.dx-editor-filled, 
.obz-textbox.dx-texteditor.dx-state-focused.dx-editor-outlined, 
.obz-textbox.dx-texteditor.dx-state-focused.dx-edotor-underlined {
    border-color: #2168CE;
}

.obz-textbox.dx-texteditor.dx-state-hover{
    border-color: #1768C150;
}

/* ============================ textarea 속성 : LYJ (전체추가) ============================ */
.obz-textarea.dx-texteditor.dx-editor-outlined {
    border-radius: 13px;
    border : 1px solid #e0e0e0;
}

.obz-textarea.dx-texteditor.dx-state-active.dx-editor-filled, 
.obz-textarea.dx-texteditor.dx-state-active.dx-editor-outlined, 
.obz-textarea.dx-texteditor.dx-state-active.dx-editor-underlined, 
.obz-textarea.dx-texteditor.dx-state-focused.dx-editor-filled, 
.obz-textarea.dx-texteditor.dx-state-focused.dx-editor-outlined, 
.obz-textarea.dx-texteditor.dx-state-focused.dx-edotor-underlined {
    border-color: #2168CE;
}

.obz-textarea.dx-texteditor.dx-state-hover{
    border-color: #1768C150; /* 룩앤필 적용되지 않아 수정 !important */
}

/* ============================ Paging 속성 : LYJ (전체추가) ============================ */
.wj-pager .wj-input-group .wj-form-control,
.wj-control .wj-input-group .wj-input-group-btn:last-child:not(:first-child)>.wj-btn, .wj-viewer .wj-control .wj-input-group .wj-input-group-btn:last-child:not(:first-child)>.wj-applybutton {
    border: 0px !important;
    color: #616161;
	font-weight: 500;
}

/*댓글 wrapper 클래스*/
.wj-content {
    border: none; /* !important */
    bottom: 18px;
}

.wj-control .wj-input-group .wj-input-group-btn:first-child:not(:last-child)>.wj-btn, .wj-viewer .wj-control .wj-input-group .wj-input-group-btn:first-child:not(:last-child)>.wj-applybutton {
    border: none;  /* !important */
}

.wj-control .wj-btn-group>.wj-btn.wj-btn-default, .wj-viewer .wj-control .wj-btn-group>.wj-btn-default.wj-applybutton, .wj-control .wj-input-group-btn>.wj-btn.wj-btn-default, .wj-viewer .wj-control .wj-input-group-btn>.wj-btn-default.wj-applybutton {
    color: #424242;
}

.obz-ui.obz-webframe {
    overflow: auto;
}

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active {
    background-color: #f0f2f4;
}
.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
/*    background-color: #2168CE;*/
    background-color: #f0f2f4;
    color: #333;
}
.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active .dx-icon,
.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused .dx-icon {
    color: #333;
}
/* ============================ 헤더 드롭다운 메뉴 : LYJ (전체추가) ============================ */
.obz-dropdownbutton .dx-buttongroup-item {
    background-color: #2168CE;
    color: #FFFFFF !important;
/*    font-weight: bold !important;*/
/*    font-size: 14px !important;*/
    border-radius: 30px !important;
    border: none !important;
}

.obz-dropdownbutton .dx-buttongroup-last-item >div {
    background-color: transparent !important;
}
.obz-dropdownbutton svg {
    width: 18px;
    height: 18px;
    margin-top: -3px;
}
.obz-dropdownbutton svg path {
    fill: #fff;
}
/* ============================ 아이콘 일괄 폰트 설정 ============================ */
.dx-icon {
	font-family: 'DXIcons' !important;
}

[class^='dx'][class$='icon']{
    font-family: 'DXIcons' !important;
}

[class$='icon']{
	font-family: 'DXIcons' !important;
}

.dx-icon-search {
    font-family: 'DXIcons' !important;
}

.dx-datagrid-group-closed, .dx-datagrid-group-opened {
    font-family: 'DXIcons' !important;
    font-size: 20px !important;
}

.dx-treelist-rowsview .dx-treelist-collapsed span {
    font-family:  'DXIcons' !important;
    font-size: 20px !important;
    line-height: 13px;
}

.dx-treelist-rowsview .dx-treelist-expanded span {
    font-family: 'DXIcons' !important;
    font-size: 20px !important;
    line-height: 13px;
}

.dx-treelist-rowsview .dx-treelist-adaptive-more {
    font-family: 'DXIcons' !important;
}

.dx-icon-edit::before {
    font-weight: 600;
}

.dx-icon-plus, 
.dx-filterbuilder-action,
.dx-filterbuilder-action-icon{
    font-family: 'DXIcons' !important;
}

.dx-pages .dx-next-button,
.dx-pages .dx-prev-button {
    font-family: 'DXIcons' !important;
    font-size: 20px !important;
    line-height: 20px !important;
}

.dx-treeview-toggle-item-visibility {
    font-family: 'DXIcons' !important;
}

.dx-menu .dx-menu-horizontal .dx-menu-item-popout::before {
    font-family: 'DXIcons' !important;
}

.dx-datagrid .dx-datagrid-adaptive-more {
    font-family: 'DXIcons' !important;
}

/* ============================ DateRangePicker ============================ */
.obz-daterangepicker{
	border: 2px solid #eee;
    border-radius: 10px;
    vertical-align: middle;
    line-height: 30px;
    padding-left: 5px;
} 
.obz-loadpanel-min-icon .load-dot:before {
            content: "";
            width: 13px; 
            height: 13px;
            border-radius: 15px;
            background: #2168CE;
            position: absolute;
            left: 50%;
            transform: translateY(0);
            -o-transform: translateY(0);
            -ms-transform: translateY(0);
            -webkit-transform: translateY(0);
            -moz-transform: translateY(0);
            margin-left: -7px; 
            margin-top: -7px;
        }
        
        .obz-loadpanel-min-icon .load-dot:nth-child(5):before {
            z-index: 100;
            width: 16px;
            height: 16px;
            margin-left: -8px;
            margin-top: -8px;
            animation: load-dot-colors 4.6s ease infinite;
            -o-animation: load-dot-colors 4.6s ease infinite;
            -ms-animation: load-dot-colors 4.6s ease infinite;
            -webkit-animation: load-dot-colors 4.6s ease infinite;
            -moz-animation: load-dot-colors 4.6s ease infinite;
        }

        .obz-loadpanel-min-icon .load-dot:nth-child(1) {
            animation: load-dot-rotate-1 4.6s 0s linear infinite;
            -o-animation: load-dot-rotate-1 4.6s 0s linear infinite;
            -ms-animation: load-dot-rotate-1 4.6s 0s linear infinite;
            -webkit-animation: load-dot-rotate-1 4.6s 0s linear infinite;
            -moz-animation: load-dot-rotate-1 4.6s 0s linear infinite;
        }
        .obz-loadpanel-min-icon .load-dot:nth-child(1):before {
            background-color: #2889da;   /* #7B68AB; */
            animation: load-dot-move-min 4.6s 0s ease infinite;
            -o-animation: load-dot-move-min 4.6s 0s ease infinite;
            -ms-animation: load-dot-move-min 4.6s 0s ease infinite;
            -webkit-animation: load-dot-move-min 4.6s 0s ease infinite;
            -moz-animation: load-dot-move-min 4.6s 0s ease infinite;
        }
        
        .obz-loadpanel-min-icon .load-dot:nth-child(2) {
            animation: load-dot-rotate-2 4.6s 1.15s linear infinite;
            -o-animation: load-dot-rotate-2 4.6s 1.15s linear infinite;
            -ms-animation: load-dot-rotate-2 4.6s 1.15s linear infinite;
            -webkit-animation: load-dot-rotate-2 4.6s 1.15s linear infinite;
            -moz-animation: load-dot-rotate-2 4.6s 1.15s linear infinite;
        }
        .obz-loadpanel-min-icon .load-dot:nth-child(2):before {
            background-color: #1c459c;  /* #4D4076; */
            animation: load-dot-move-min 4.6s 1.15s ease infinite;
            -o-animation: load-dot-move-min 4.6s 1.15s ease infinite;
            -ms-animation: load-dot-move-min 4.6s 1.15s ease infinite;
            -webkit-animation: load-dot-move-min 4.6s 1.15s ease infinite;
            -moz-animation: load-dot-move-min 4.6s 1.15s ease infinite;
        }
        
        .obz-loadpanel-min-icon .load-dot:nth-child(3) {
            animation: load-dot-rotate-3 4.6s 2.3s linear infinite;
            -o-animation: load-dot-rotate-3 4.6s 2.3s linear infinite;
            -ms-animation: load-dot-rotate-3 4.6s 2.3s linear infinite;
            -webkit-animation: load-dot-rotate-3 4.6s 2.3s linear infinite;
            -moz-animation: load-dot-rotate-3 4.6s 2.3s linear infinite;
        }
        .obz-loadpanel-min-icon .load-dot:nth-child(3):before {
            background-color: #2d2b5f;  /* #352741; */
            animation: load-dot-move-min 4.6s 2.3s ease infinite;
            -o-animation: load-dot-move-min 4.6s 2.3s ease infinite;
            -ms-animation: load-dot-move-min 4.6s 2.3s ease infinite;
            -webkit-animation: load-dot-move-min 4.6s 2.3s ease infinite;
            -moz-animation: load-dot-move-min 4.6s 2.3s ease infinite;
        }
        
        .obz-loadpanel-min-icon .load-dot:nth-child(4) {
            animation: load-dot-rotate-4 4.6s 3.45s linear infinite;
            -o-animation: load-dot-rotate-4 4.6s 3.45s linear infinite;
            -ms-animation: load-dot-rotate-4 4.6s 3.45s linear infinite;
            -webkit-animation: load-dot-rotate-4 4.6s 3.45s linear infinite;
            -moz-animation: load-dot-rotate-4 4.6s 3.45s linear infinite;
        }
        .obz-loadpanel-min-icon .load-dot:nth-child(4):before {
            background-color: #2168CE;
            animation: load-dot-move-min 4.6s 3.45s ease infinite;
            -o-animation: load-dot-move-min 4.6s 3.45s ease infinite;
            -ms-animation: load-dot-move-min 4.6s 3.45s ease infinite;
            -webkit-animation: load-dot-move-min 4.6s 3.45s ease infinite;
            -moz-animation: load-dot-move-min 4.6s 3.45s ease infinite;
        }
        
        @keyframes load-dot-move-min {
            0% {
                transform: translateY(0);
            }
            18%,
            22% {
                transform: translateY(-23px);
            }
            40%,
            100% {
                transform: translateY(0);
            }
        }
        
        @-o-keyframes load-dot-move-min {
            0% {
                -o-transform: translateY(0);
            }
            18%,
            22% {
                -o-transform: translateY(-23px);
            }
            40%,
            100% {
                -o-transform: translateY(0);
            }
        }
        
        @-ms-keyframes load-dot-move-min {
            0% {
                -ms-transform: translateY(0);
            }
            18%,
            22% {
                -ms-transform: translateY(-23px);
            }
            40%,
            100% {
                -ms-transform: translateY(0);
            }
        }
        
        @-webkit-keyframes load-dot-move-min {
            0% {
                -webkit-transform: translateY(0);
            }
            18%,
            22% {
                -webkit-transform: translateY(-23px);
            }
            40%,
            100% {
                -webkit-transform: translateY(0);
            }
        }
        
        @-moz-keyframes load-dot-move-min {
            0% {
                -moz-transform: translateY(0);
            }
            18%,
            22% {
                -moz-transform: translateY(-23px);
            }
            40%,
            100% {
                -moz-transform: translateY(0);
            }
        }


.obz-loadpanel-white.obz-loadpanel-fullsize {
    height: 100% !important;
}
.obz-loadpanel-white.obz-loadpanel-fullsize .dx-loadpanel-message {
    display:none !important;
}


/* ============================ DateRangePicker ============================ */
.obz-daterangepicker{
    display: flex;
    background-color: #ffffff;
	border: 2px solid #eee;
    border-radius: 10px;
    padding-left: 5px;
    align-items: center;
    cursor: pointer;
    overflow: hidden;
    box-sizing: border-box;
} 

.obz-daterangepicker:hover,
.obz-daterangepicker.active {
	border : 2px solid #0167FF;
	transition : .3s;
}

.obz-daterangepicker:hover .date-icon svg path,
.obz-daterangepicker.active .date-icon svg path {
	fill : #0167FF;
	transition : .3s;
}

.obz-daterangepicker.disabled {
    opacity: 0.8;
    pointer-events: none;
    cursor: default;
}

.obz-daterangepicker .date-value {
	margin-left: 5px;
}

.obz-daterangepicker .date-icon {
    background-color: transparent;
    min-width: 20px;
    min-height: 20px;
    cursor: pointer;
    padding: 9px 5px 0 5px;
}

.daterangepicker td.in-range{
	background-color : #e7f1ff !important;
}

.daterangepicker .ranges li.active{
	background-color: #0167FF !important;
	border-radius: 3px;
	margin-right: 1px;
}
.daterangepicker td.active,  
.daterangepicker td.active:hover{
	background-color: #0167FF !important;
}
.daterangepicker .calendar-table th{
	color: #3c3c3c;
}

.daterangepicker .calendar-table .next span, 
.daterangepicker .calendar-table .prev span{
    border: solid #5994ff !important;
    border-width: 0 2px 2px 0 !important;
}

.daterangepicker .drp-buttons .btn{
	border: none;
    border-radius: 5px;
    padding: 6px 15px !important;
	background-color: #F0F0F0 !important;
    cursor:pointer;
}

.daterangepicker .drp-buttons .btn:hover{
	background-color: #E9E8EA !important;
}

.daterangepicker .drp-buttons .btn:active{
	background-color: #F6F6F6 !important;
}


/* ============================ ToggleGroup ============================ */
.obz-toggle-group {
    display: flex;
    overflow: hidden;
    border-radius: 5px;
    box-sizing: border-box;
}

.obz-toggle-group.vertical {
    flex-direction: column;
}

.obz-toggle-group .obz-toggle-group-item {
    height: 100%;
    flex-grow: 1;
    flex-shrink: 1;
    transition: all .1s;
    background: #f8f8fa;
    font-size: inherit;
    color: #555;
    font-size: inherit;
    font-weight: inherit;
}
.obz-toggle-group .obz-toggle-group-item.selected {
    background: #0167FF;
    color: #fff;
}

.obz-toggle-group .obz-toggle-group-item:last-child {
    border-right: 0px !important;
}

.obz-toggle-group.text-invisible .obz-button.dx-button-has-text .dx-icon {
    margin-right: 0px;
}
.obz-toggle-group.text-invisible .dx-button-text {
    display: none;
}

.obz-toggle-group.disabled {
    pointer-events: none;
    opacity: 0.7;
}

/* ============================ DatePicker ============================ */
.obz-datepicker {
	border: 1px solid #ddd;
	border-radius: 4px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	cursor: pointer;
}

.obz-datepicker.obz-ui input {
	background: transparent;
	width: calc(100% - 24px);
	height: 100%;
	font-weight: inherit;
	font-size: inherit;
	color: inherit;
	border: 0px;
    padding: 4px 7px;
	box-sizing: border-box;
	cursor: pointer;
}
.obz-datepicker.obz-ui.disabled {
    pointer-events: none;
    opacity: 0.7;
}
.obz-datepicker.obz-ui .obz-datepicker-icon {
	height: 20px;
    width: 20px;
	margin-top: -1px;
}
.obz-datepicker.obz-ui .obz-datepicker-icon svg {
	width: 100%;
	height: 100%;
}
.obz-datepicker.obz-ui .obz-datepicker-icon path {
	fill: #777777;
}

.obz-datepicker.obz-ui:hover {
	border-color: #8EBBFF;
}
.obz-datepicker.obz-ui:hover .obz-datepicker-icon path {
	fill: #297df1;
}

/* -- DatePicker Popup -- */
.datepickers-container .datepicker {
	border: 1px solid #e8e8ea;
	border-radius: 8px;
	box-shadow: none;
}
.datepickers-container .datepicker--pointer {
	border-top: 1px solid #e8e8ea;
    border-right: 1px solid #e8e8ea;
}
.datepickers-container .datepicker--content {
    padding: 5px;
    padding-bottom: 10px;
}

.datepickers-container .datepicker--nav-title {
	color: #444444;
	font-weight: bold;
	font-size: 13px;
}
.datepickers-container .datepicker--nav-action path {
	stroke: #5994FF;
}
.datepickers-container .datepicker--nav-title:hover,
.datepickers-container .datepicker--nav-action:hover {
	background: #f3f3f5;
}
.datepickers-container .datepicker--day-name {
	color: #444444;
	font-weight: bold;
	font-size: 13px;
}

.datepickers-container .datepicker--cell {
	font-size: 13px;
}
.datepickers-container .datepicker--cell.-focus- {
	background: #f3f3f5;
}
.datepickers-container .datepicker--cell.-current- {
	color: #0167FF;
	font-weight: bold;
}
.datepickers-container .datepicker--cell.-selected- {
	background: #0167FF;
	color: #fff;
	font-weight: normal;
}

/*=================== AdvancedFilter ===================*/
.obz-filter {

}

.obz-filter-container {
    height: 100%;
    position: relative;
}

.obz-filter .obz-filter-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 5px;
    align-items: flex-end;
    position: absolute;
    top: 0px;
    width: 100%;
    height: 32px;
}

.obz-filter .obz-filter-header .obz-filter-title {
    font-size: 14px;
    font-weight: bold;
    color: #454545;
    padding: 7px 5px;
}

.obz-filter .obz-filter-header .obz-filter-add {
    border-radius: 7px;
    min-width: 100px;
    height: 32px;
    border: 1px solid #eaeaec;
    background: #fff;
    color: #404043;
    font-size: 13.5px;
}
.obz-filter .obz-filter-header .obz-filter-add .dx-button-content {
    padding: 7px;
}
.obz-filter .obz-filter-header .obz-filter-add .dx-button-content .dx-icon {
    width: 14px !important;
    height: 14px !important;
}
.obz-filter .obz-filter-header .obz-filter-add path {
    fill: #707073;
}

.obz-filter .obz-filter-header .obz-filter-add:hover {
    color: #2D7DF5;
    font-weight: bold;
}
.obz-filter .obz-filter-header .obz-filter-add:hover path {
    fill: #2D7DF5;
}

.obz-filter .obz-filter-content {
    position: absolute;
    top: 37px;
    bottom: 0px;
    width : 100%; 
    border-radius: 7px;
}

.obz-filter .obz-filter-content .dx-treelist-container {
    border-radius: inherit;
}

.obz-filter .obz-filter-content .dx-treelist-rowsview {
    border: 1px solid #e8e8ea;
    border-radius: inherit;
}

.obz-filter .obz-filter-content .filter-action,
.dx-sortable-clone .filter-action {
    display:flex;
    align-items: center;
    justify-content: center;
}
.obz-filter .obz-filter-content .filter-action .filter-icon-edit,
.dx-sortable-clone .filter-action .filter-icon-edit {
    width: 16px;
    height: 16px;
    cursor: pointer;
}
.obz-filter .obz-filter-content .filter-action .filter-icon-edit svg path,
.dx-sortable-clone .filter-action .filter-icon-edit svg path {
    fill: #818181;
    opacity: .5;
}
.obz-filter .obz-filter-content .filter-action .filter-icon-edit:hover svg path {
    opacity: 1;
}
.obz-filter .obz-filter-content .filter-action .filter-icon-delete, 
.dx-sortable-clone .filter-action .filter-icon-delete {
    width: 16px;
    height: 16px;
    margin-left: 6px;
    cursor: pointer;
}
.obz-filter .obz-filter-content .filter-action .filter-icon-delete svg path, 
.dx-sortable-clone .filter-action .filter-icon-delete svg path {
    fill: #818181;
    opacity: .5;
}
.obz-filter .obz-filter-content .filter-action .filter-icon-delete:hover svg path {
    opacity: 1;
}
.obz-filter .obz-filter-content .dx-treelist-rowsview td {
    /* padding: 8px 8px; */
    padding: 4px 8px;
    height: 34px;
    vertical-align: middle;
}
.dx-sortable-clone .dx-treelist-rowsview .filter-name {
    padding: 3px 0;
}
.dx-sortable-clone .dx-treelist-rowsview:has(.filter-name) td {
    padding: 4px 0 !important;
}
.dx-sortable-clone .dx-treelist-rowsview:has(.filter-name) .filter-action {
    padding: 3px 0px;
}
.obz-filter .obz-filter-content .dx-treelist-rowsview .dx-treelist-icon-container {
    margin-right: 0px;
}

.obz-filter .obz-filter-content .dx-treelist-rowsview .dx-treelist-empty-space {
    width: 18px;
}

.obz-filter .obz-filter-content .dx-treelist-rowsview .dx-treelist-text-content img {
    margin-top: -1px;
    margin-right: 1px;
}

.obz-filter .obz-filter-content .dx-treelist-rowsview .dx-row-focused.dx-data-row > td:not(.dx-focused), 
.obz-filter .obz-filter-content .dx-treelist-rowsview .dx-row-focused.dx-data-row > tr > td:not(.dx-focused) {
    border-bottom: 1px solid #eaeaec;
    background-color: #edf4fb;
    color: #045de1;
}
.obz-filter .obz-filter-content .dx-treelist-rowsview tr.dx-selection.dx-data-row td {
    background: transparent;
}

.obz-filter .obz-filter-content .dx-treelist-rowsview .dx-column-lines > td, 
.obz-filter .obz-filter-content .dx-treelist-rowsview .dx-row-lines > td,
.obz-filter .obz-filter-content .dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused).dx-row-lines > td {
    border-color: #eaeaec;
}

.obz-filter .obz-filter-content .dx-treelist-rowsview .dx-command-edit-with-icons .dx-link {
    color: #858588;
    background: transparent !important;
    margin: 1px 2px 0px !important;
    width: 15px !important;
    height: 15px !important;
    font-size: 15px !important;
    opacity: .8;
}
.obz-filter .obz-filter-content .dx-treelist-rowsview .dx-link:hover {
    opacity: 1;
}

.obz-filter .obz-filter-content .dx-treelist-rowsview tr.dx-row-focused.dx-data-row .dx-link {
    color: #045de1;
}

.obz-filter.header-hide .obz-filter-header {
    height: 0px;
}
.obz-filter.header-hide .obz-filter-content {
    top: 0px;
}

/* filter info style 
 * drag & drop 시에도 style 적용되어야 해서 parent 지정 x */
.dx-sortable-clone .dx-treelist-rowsview:has(.filter-error-item) {
    border-color: #ddd !important;
}
.dx-treelist-text-content:has(.filter-info-item),
.dx-treelist-text-content:has(.filter-error-item) {
    flex: 1;
}
.dx-row.dx-data-row:has(.filter-error-item) td {  
    background: #eb478a1c !important;
}
.dx-row.dx-data-row:has(.filter-info-item) td { 
    background: #e8f5ff !important;
}
.dx-row.dx-data-row td:has(.filter-info-item) td,
.dx-row.dx-data-row td:has(.filter-error-item) td {  
    display: flex;
    align-items: center;
}
.filter-error-item {
    flex: 1;
    color: #d72f6b !important;
    text-overflow: ellipsis;
    overflow: hidden;
}
.filter-info-item {
    flex: 1;
    color: #2d71f1 !important;
    text-overflow: ellipsis;
    overflow: hidden;
}
.filter-error-item-icon,
.filter-info-item-icon {
    width: 18px;
    height: 20px;
}
.filter-error-item-icon svg,
.filter-info-item-icon svg {
    width: 100%;
    height: 100%;
}
.filter-error-item-icon svg path {
    fill: #ff1e5a;
    opacity: .8;
}
.filter-info-item-icon svg path {
    fill: #216eff;
    opacity: .8;
}


/* AdvancedFilter - contextMenu */
.dx-context-menu.dx-menu-base.dx-treelist-container .dx-menu-item-content span.dx-menu-item-text {
    font-size: 13px;
    color: #606063;
}
.dx-context-menu.dx-menu-base.dx-treelist-container .dx-menu-item.dx-menu-item-has-text .dx-icon {
    margin-right: -12px;
}
.dx-context-menu.dx-menu-base.dx-treelist-container .dx-menu-item-content .dx-icon {
    font-size: 16px;
    color: #898989;
}

.dx-context-menu.dx-menu-base.dx-treelist-container .dx-menu-item.dx-state-hover .dx-menu-item-content .dx-icon,
.dx-context-menu.dx-menu-base.dx-treelist-container .dx-menu-item.dx-state-hover .dx-menu-item-content span.dx-menu-item-text {
    color: #256de0;
}

.obz-tagtextarea {
    border: 2px solid #EAEAEC;
    border-radius: 7px;
    padding: 3px 9px;
    line-height: 2;
    font-size: 13px;
    color: #333;
    overflow: auto;
    box-sizing: border-box;
    white-space: pre-line;
}
.obz-tagtextarea.new-line {
    padding: 3px 9px;
}
.obz-tagtextarea.obz-status-focus {
    border-color: #8EBBFF;
}
.obz-tagtextarea.obz-status-active {
    border-color: #4D99E7;
}
.obz-tagtextarea.disabled {
    pointer-events: none;
}
.obz-tagtextarea .obz-tagtextarea-tag {
    padding: 3px 5px;
    margin: 0 2px;
    border-radius: 6px;
    text-align: center;
    white-space: nowrap;
    cursor: default;
    background-color: #EDF4FB;
    color: #256dd9;
    background-color: #EDF4FB;
	caret-color: transparent
}
.obz-tagtextarea:empty:before {
    content: attr(placeholder);
    color: #959595;
}
/* Excel Viewer */
.obz-excelviewer {
    display: flex;
    flex-direction: column;
}
.obz-excelviewer .divexcelviewer {
    flex-basis: 100%;
    width: 100%;
}
.obz-excelviewer .divexceltab {
    width: 100%;
    flex-basis: 32px;
    background: #f8f8fa;
    position: relative;
    border-top: 1px solid #e8e8ea;
    padding: 0px 7px;
    box-sizing: border-box;
    background: #fff;
}

.obz-excelviewer .designtab {
    background: #f8f8fa;
    padding: 4px 11px;
    border: 1px solid #e8e8ea;
    position: relative;
    box-sizing: border-box;
    top: 4px;
    border-radius: 0px 0px 5px 5px;
    border-left-width: 0px;
    color: #777;
    cursor: pointer;
}
.obz-excelviewer .divexceltab span:first-child {
    border-left-width: 1px;
}
.obz-excelviewer .designtab.selected {
    background: #fff;
    color: #333;
    border-top-color: #fff;
}

.obz-excelviewer .zoom-container {
    position: absolute;
    padding: 5px 7px;
    width: 165px;
    right: 25px;
    top: 5px;
    background: #ffffff50;
    border-radius: 8px;
    transition: opacity .2s, background .2s, box-shadow .2s;
    opacity: .7;
    z-index: 1;
    display: flex;
    align-items: center;
}
.obz-excelviewer .zoom-container:hover {
    opacity: 1;
    background: #ffffffbf;
    box-shadow: #65425228 1px 4px 15px;
}
/* .obz-excelviewer .zoom-container .zoom-handle {
    position: relative;
    width: 24px;
    height: 24px;
    cursor: n-resize;
}
.obz-excelviewer .zoom-container .zoom-handle svg {
    width: 100%;
    height: 100%;
}
.obz-excelviewer .zoom-container .zoom-handle path {
    fill: #88888A;
} */
.obz-excelviewer .zoom-container>.obz-button {
    width: 30px;
    height: 28px;
}
.obz-excelviewer .zoom-container>.obz-button path {
    fill: #c1c1c1;
}
.obz-excelviewer .zoom-container>.obz-button:hover path {
    fill: #4987e3;
}
.obz-excelviewer .zoom-container>#lbZoom {
    margin: 0px 5px;
    font-weight: 400;
    font-size: 14px;
    color: #888;
    width: 33px;
    text-align: right;
    cursor: default;
}


/* ============================ sortable style ============================ */
.dx-sortable-clone .dx-treelist-empty-space {
    width: 0px;
}
.dx-sortable-clone .dx-treelist-empty-space:last-child {
    width: 14px;
}
.dx-sortable-clone .dx-treelist-rowsview .dx-row > td {
    padding-top: 10px;
    padding-bottom: 10px;
}
.dx-sortable-clone .dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused) > td, 
.dx-sortable-clone .dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused) > tr > td, 
.dx-sortable-clone .dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > td, 
.dx-sortable-clone .dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > tr > td {
    background-color: #fff;
}
.dx-sortable-clone .dx-treelist-rowsview .dx-row {
    border: none;
}





/* ============================ container popup ============================ */
.container-popup .ctl-wrap:first-child {
    margin-top: 20px;
}
.container-popup .ctl-wrap {
    display: flex;
    flex-direction: row;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
    height: 30px;
}
.container-popup .dx-popup-content .obz-label {
    width: 84px;
    margin-left: 10px;
}
.container-popup .dx-popup-content .obz-combo {
    flex: 1;
    margin: 0 10px;
    border-radius: var(--obz-radius-input);
}
.container-popup .dx-popup-content .obz-combo.dx-state-hover {
    border-color : var(--obz-color-input-border-hover);
}
.container-popup .dx-popup-content .obz-combo.dx-state-focused {
    border-color : var(--obz-color-input-border-focus);
}
.container-popup .dx-popup-content .obz-combo.dx-state-disabled {
    background-color: var(--obz-color-input-border-disable);
    border-color: var(--obz-color-input-border-disable);
}
.container-popup .dx-popup-content .obz-button {
    position: relative;
    top: 20px;
    left: 254px;
    width: 90px;
    height: 34px;
}



.obz-multipath-shape > svg {
    width: 100%;
    height: 100%;
}