/*- reset css -*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,
address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,
u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,
th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,
output,ruby,section,summary,time,mark,audio,video,hr{ margin:0; padding:0;  border:0;  outline:0;  font-size: 100%;  font:inherit;  vertical-align:middle; }

ul { list-style:none; }
a  { text-decoration:none; }
form[name='mainForm'] { display:flex; flex-direction: column; width: 100%; height: 100%; }

/* START :: COMMON STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
::selection { /*마우스 드래그 컬러 변경하기.*/
    color: #000; background: #cbd2e0;
}


/*- FONT STYLE -----------------------------------------------------------*/

/*FONT STYLE 02*/
/*@font-face {
  font-family: 'NanumSquare';
  src: url('../font/NanumSquareR.eot');
  src: url('../font/NanumSquareR.eot?#iefix') format('embedded-opentype'),
       url('../font/NanumSquareR.woff') format('woff'),
       url('../font/NanumSquareR.ttf') format('truetype');
  font-weight:500;
  font-style:normal;
}*/
@font-face {
    font-family: 'NanumSquare';
    src: url('../font/NanumSquareOTF_R.otf') format('opentype');}


/*En-Font*/
@font-face{
    font-family:'Poppins-semibold';
    src: url('../font/Poppins-SemiBold.ttf')format('truetype');}

@font-face{
    font-family:'Poppins-light';
    src: url('../font/Poppins-Light.ttf')format('truetype');}

@font-face{
    font-family:'Poppins-regular';
    src: url('../font/Poppins-Regular.ttf')format('truetype');}

@font-face{
    font-family:'Poppins-medium';
    src: url('../font/Poppins-Medium.ttf')format('truetype');}

strong { font-weight: 600; }
em { font-style: italic; }

/* ---------------------------------------------------------- FONT STYLE -*/

body{  box-sizing:border-box;   /* background-color:#f7f9fb; */ overflow: hidden; }
#wrapper { font-family:'Poppins-medium', 'NanumSquare', sans-serif; width: 100vw; height: 100vh; display: flex; flex-direction: column; overflow: hidden; }
#popupWrapper { font-family:'Poppins-medium', 'NanumSquare', sans-serif; display: flex; flex-direction: column; overflow-y: auto; }
#login_wrapper{ font-family:'Poppins-medium', 'NanumSquare', sans-serif; display: flex; width: 100%; height: 100vh; background-color: #f6f6f6; position: relative; justify-content: center; align-items: center; }


.space:not(img){ display:block; padding-top:40px; }
.space01{ display:block; padding-top:15px; clear:both; }
.space02{ display:block; padding-top:32px; }
.space03{ display:block; padding-top:60px; }
.space04{ display:inline-block; padding-left:120px; }
.space05{ display:block; padding-top:24px; }
.space06{ display:block; padding-top:8px; }
/* END :: COMMON STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/





/* START :: HEADER STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
#header {
    display: flex;
    flex-direction: column;
    min-height: 60px;
    max-height: 105px;
    flex-shrink: 0;
}

/*- Header Top Area -------------------------------------------------------------------------------------*/

#headerTop{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 60px; /*2021.04.08 60px edit*/
    padding: 0 25px;
    box-sizing: border-box;
    background-color: #313036;
}

.logoImage {
    display: flex;
    justify-content: center;
    color: #7f7f7f;
    align-items: center;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.logoImageWrap .logoImage {
    width: 100%;
    height: 100%;
}

#globalLogo {
    margin-right: 25px;
    min-width: 122px;
    height: 100%;
    background-image: url(../images/logo/logo_default.png);
}

a#globalLogo {
    cursor: pointer;
}

#globalLogo:after {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    font-size: 20px;
    font-weight: 600;
    color: #ececec;
    background-color: #313036;
}

/* Header Right Area -------------------------------------------------------------------------------------*/
.h_right_function{
    display:flex; /*width:50%;*/
    justify-content: flex-end;
    text-overflow:ellipsis;
    white-space:nowrap;
    vertical-align: middle;
}
.h_right_function > ul{ /*float:right;*/}
.h_right_function > ul > li{
    /*height:25px;*/
    display:inline-block;
    vertical-align: middle;
    text-align:center;
}


.h_separ{
    width:1px; height:24px;
    background-color:#364556;
    margin: 0 8px;
}

.h_userInfo{ font-size:15px; cursor:pointer; padding-right: 10px; border-radius: 5px; }
.userName{
    /*display: inline-block;*/
    height:30px;
    display: inline-block;
    background-image:url(../images/user_icon.png);
    background-position:8px center;
    background-repeat: no-repeat;
    padding:8px 0 0 50px;
    color: #d2d2d2;
}
.userName span{
    width:9px; height:6px; display:inline-block;
    background:url(../images/select_arrow02.png) center no-repeat;
}

/* USER DROP DOWN */
.dropdown {
    position: relative;
    display: inline-block;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 110px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    text-align:left;
}
.dropdown-content a {
    color: #545454;
    padding: 8px;
    text-decoration: none;
    display: block;
    border-bottom:1px solid #b5b5b5;
}
.dropdown-content a:hover{ background-color: #ddd;}
.show {display: block;}


.h_setting{
    width:30px; height:30px;
    background-image:url(../images/setting.png);
    background-position:center;
    background-repeat: no-repeat;
    cursor:pointer;
    border-radius: 5px;
}

.h_create {
    width:30px; height:30px;
    background-image:url(../images/toolbar_icon/new_light.png);
    background-position:center;
    background-repeat: no-repeat;
    cursor:pointer;
    border-radius: 5px;
}

.h_setting:hover, .h_favorite:hover, .h_userInfo:hover, .h_about:hover, .h_create:hover {
    background-color: #393643;
}

.logOut{
    width:22px; height:23px;
    background-image:url(../images/logout.png);
    background-position:center;
    background-repeat: no-repeat;
    cursor:pointer;
    padding-left:3px;
}

.h_favorite {
    width:30px; height:30px;
    background-image:url(../images/favorite.png);
    background-position:center;
    background-repeat: no-repeat;
    cursor:pointer;
    border-radius: 5px;
}

.h_about {
    width:30px; height:30px;
    background-image:url(../images/aboutpage_icon.png);
    background-position:center;
    background-repeat: no-repeat;
    cursor:pointer;
    border-radius: 5px;
}

.h_about div, .h_create div {
    width: 100%;
    height: 100%;
    margin: 0;
}

/*- Header Bottom Area -------------------------------------------------------------------------------------*/
#headerBottom{
    clear:both;
    height:50px; /*2021.04.08 60px edit*/
    padding-left:25px;
    background-color:#fff;
    border-bottom:1px solid #c3c7ca;
    box-shadow: 0px 2px 8px rgb(0,0,0, 0.15); /*2021.04.08 add*/
}

ul.appMenu{ display: flex; color: #333; justify-content: flex-start; max-width: 50vw; align-items: center; }

ul.appMenu li{
    display: flex;
    height: 80%;
    box-sizing:border-box;
    font-size: 18px; /*2021.04.08 20px edit*/
    color: #ececec;
    cursor: pointer;
    align-items: center;
    margin-right: 5px;
}

ul.appMenu li a {
    padding: 16px;
    white-space: nowrap;
}

ul.appMenu li.menuOn {
    background-color: #57545c;
    border-radius: 5px;
    font-weight: 600;
}

ul.appMenu li:hover{
    background-color: #444348;
    border-radius: 5px;
}

ul.appMenu>li:nth-child(5)>a>img,
ul.appMenu>li:nth-child(6)>a>img {
    margin-left: 5px;
}

div.level02Menu{
    box-sizing: border-box; height: 45px; /*2021.04.08 45px edit*/
    padding-left: 180px;
    padding-right: 25px;
    background-color: #f5f5f5;
}
div.level02Menu * {
    height: 100%;
}
div.level02Menu ul li{
    box-sizing: border-box;
    display:inline-block;
    padding: 8px;
    font-size:16px;
}
div.level02Menu ul li {
    display: inline-block;
    color: #959595;
    margin-right: 8px;
    cursor: pointer;
}
.level02Menu_on, div.level02Menu ul li a:hover{
    color: #555; font-weight:600;
    /* border-bottom:2px solid #2266ff; */
}


/* END :: HEADER STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/






/* START :: SIDE NAV AREA STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
#sidenavArea{
    background-color: #fff;
    width:280px; height: 100%;
    position: absolute;
    z-index: 1;
    /*top: 121px;*/
    left: 0;
    overflow-x: hidden;
    /*padding-top: 20px;*/
    box-sizing: border-box;
    border-right:1px solid #c3c7ca;
    float:left;
}
.level01Wrap{
    color:#293f4b; font-size:17px;
    /*height:56px;*/
    box-sizing: border-box;
    /*padding:16px;*/
    border-bottom:1px solid #c3c7ca;
    cursor:pointer;
}
.level01Wrap a{
    color:#293f4b; font-size:16px;
    width:100%;
    display: inline-block;
    padding: 12px 16px;
    box-sizing: border-box;
}
.level01Wrap:hover{ background-color:#e4efff; font-weight:600; }

.sideNav_on{
    /*background-color:#e4efff;*/ /*background-color:#98acc38c;*/
    background-color:#c8e1fd8c;
    font-weight:600;
}

.level02-group{ display:none; }
.level02{
    height:32px;
    color:#445f84;
    border-bottom:1px solid #dde1e8;
    padding-left:56px;
    background-color:#f6f9fd;
    font-size:15px;
}
.level02>span{ display:inline-block; padding-top:5px; }
.level02:hover, .level02_on{
    background-color:#dce4f5;
    color:#112d5a;
    font-weight:600;
    cursor:pointer;
}



/*icon style*/
.i_group{ background:url(../images/left_group.png) no-repeat left center; padding-left:40px; }
.i_save{ background:url(../images/left_save.png) no-repeat left center; padding-left:40px; }
.i_type{ background:url(../images/left_type.png) no-repeat left center; padding-left:40px; }
.i_log{ background:url(../images/left_log.png) no-repeat left center; padding-left:40px; }
.i_list{ background:url(../images/left_list.png) no-repeat left center; padding-left:40px; }
.i_list02{ background:url(../images/left_list02.png) no-repeat left center; padding-left:40px; }
.i_fileSave{ background:url(../images/left_fileSave.png) no-repeat left center; padding-left:40px; }
.i_app{ background:url(../images/left_app.png) no-repeat left center; padding-left:40px; }
.i_menu{ background:url(../images/left_menu.png) no-repeat left center; padding-left:40px; }
.i_approval{ background:url(../images/left_approval.png) no-repeat left center; padding-left:40px; }
.i_sysProperty{ background:url(../images/left_menu.png) no-repeat left center; padding-left:40px; }
.i_lifeCycle{ background:url(../images/left_menu.png) no-repeat left center; padding-left:40px; }
.i_workflow{ background:url(../images/left_menu.png) no-repeat left center; padding-left:40px; }
.i_policy{ background:url(../images/left_menu.png) no-repeat left center; padding-left:40px; }
.i_separ { width: 2px; height: 12px; background-color: #d2d2d2; }

/*관리자 메뉴 통합 아이콘*/
.i_admin_menu{background:url(../images/svg/admin_menu_i.svg) no-repeat left center; background-size:7px 14px; padding-left:28px;}
/* END :: SIDE NAV AREA STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/







/* START :: CONTENT STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
#content{
    position: relative;
    padding: 30px 20px;
}
#content_topLayout {
    padding: 20px;
}
#content, #content_topLayout{
    display: flex;
    width: 100%;
    height: 100%;
    min-height: calc(100vh - 115px);
    max-height: calc(100vh - 60px);
    /*padding:25px;*/
    box-sizing: border-box;/*2020.12.17 add */
    /*display:grid;*//*2020.12.17 add */
    /*background-color:#f3f6f8;/*2021.01.11 ADD*/
    /* background-color:#f7f9fb; *//*2021.01.11 ADD*/
}


.searchTableArea{ display: flex; flex-direction: column; width: 100%; height: 100%; /*padding: 0 20px;*/ padding: 0 20px 20px 20px; box-sizing: border-box; }
.subTitle{
    color: #333;
    font-weight:600; font-size:17px;
    /* padding-left: 10px; */
    box-sizing: border-box;
}

.bottomTableArea, .listArea { display:flex; flex-direction: column; flex: 1; white-space:nowrap; }
.bottomTableArea { width: 100%; min-height: 300px; }
.bottomTableArea_border{ border-top: 1px solid #d8dfe9; }
.bottomTableArea:after{ content:''; clear:both; }
.resultTableArea{ width:65%; float:left; /*padding-right:1%;*/ }
.resultTableAreaFull{ width:100%; height: 100%; padding-right:1%; }
#searchPanelDiv { display: flex; flex-direction: column; height: 100%; }

.resultTableAreaFull .tableTopDiv {
    display: flex;
    justify-content: space-between;
}

.folderFilterArea {
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box; background-color:#fff;
    overflow-x: auto; overflow-y: hidden;
    border-bottom:0;
    position: relative;
}

.folderFilterArea > .leftGridFilter {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-right: auto;
}

.folderFilterArea > .rightGridFilter {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-left: auto;
}

.tableWrap{
    display: flex;
    overflow-y:auto;
    /* height:383px; */
    /*border-right:1px solid #d8dfe9;*/
    padding:8px 8px 8px 8px;
    flex: 1;
}

.detailInfoArea{ width:29.5%; float:left; border:1px solid #d8dfe9;}
.empty_detailInfo{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    background: url(../images/no_document.png) no-repeat center;
    background-color: white;
    box-sizing: border-box;
}
.empty_detailInfo:after{
    font-size: 25px;
    font-weight: 300;
    color: #424d5a;
    text-align: center;
    box-sizing: border-box;
    padding-top: 130px;
    content: 'No Selection !';
    white-space: normal;
    text-overflow: ellipsis;
    overflow: hidden;
}


/* DETAIL TAB STYLE */
.detailInfoTab{
    height:36px;/*48px*/ padding-left:8px;
    /*border-top: 1px solid #d8dfe9;
    border-right: 1px solid #d8dfe9;
    border-left: 1px solid #d8dfe9;*/
    border-bottom: 2px solid #969696;
    white-space: nowrap;
    /*
    text-overflow: ellipsis;
    overflow:hidden;
    */
    overflow-x: auto;
    overflow-y: hidden;
}
.detailInfoTab a{
    text-decoration:none;
    color:#a0a0a0; font-size:15px; /*18px*/
    display:inline-block;
    padding:6px 6px 5px; box-sizing: border-box; height:36px; /*48px*/
}
.detailInfoTab_on, .detailInfoTab a:hover{
    color:#47565f !important; font-weight:600;
    cursor:pointer;
}
.detailInfoTab_on {
    border-bottom:3px solid #969696;
}
/*.detailInfoTab a.active{
  border-bottom:3px solid #3796f6; color:#47565f !important; font-weight:600;
}*/

.tabcontent {
    display: none;
    padding: 16px 5px;
}
.tablinks{
    text-decoration:none;
    color:#a0a0a0; font-size:16px;
    display:inline-block;
    padding:10px 16px 5px; box-sizing: border-box; height:48px;
}





/* DOC DETAIL --------------------------------------------------------------------------------*/
.doc_InfoArea{
    box-sizing: border-box;
    width:33.5%; /*float:right;*/
    display:inline-block;
    /*border:1px solid #d8dfe9;*/
    /* border: 1px solid #e8ecf3; */
    background-color: #fff;
    overflow: auto;
    z-index: 1;
}
.doc_info {
    display: flex;
    flex-direction: column;
    padding: 16px 0 10px 0;
}

.docInfoRow {
    display: flex;
    flex-display: column;
    justify-content: space-between;
}

.docInfoRow:not(:nth-of-type(1)) {
    margin-top: 10px;
}

.docInfoColumn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size:20px;
    font-weight:600;
}

.doc_info .doc_info_type {
    font-weight: 400;
    padding-right: 10px;
}

.doc_info .doc_info_dash {
    font-weight: 400;
}

.doc_info .doc_info_number {
    padding: 0 10px;
}

.doc_info .doc_info_name {
    /*
    cursor: pointer;
    color: #007bf7;
    */
    line-height: 25px;
    border-left: 2px solid #d2d2d2;
    padding: 0 10px;
    max-width: 500px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.doc_info .doc_info_name:hover {
    /*text-decoration: underline;*/
}

.doc_info .doc_info_version {
    padding: 0 10px;
    border-left: 2px solid #d2d2d2;
    line-height: 25px;
}

.doc_info .doc_info_state {
    padding: 0 10px;
    border-left: 2px solid #d2d2d2;
    line-height: 25px;
}

.docInfoRight {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.tabShortcutBtns {
    margin-right: 10px;
    height: 36px;
    background-color: #f2f2f2;
    border-radius: 5px;
    padding: 4px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tabShortcutBtns img.tabShortcutBtn {
    padding: 5px;
    cursor: pointer;
    margin-right: 2px;
    border-radius: 5px;
}

.tabShortcutBtns img.tabShortcutBtn:hover {
    background-color: #f2f2f2;
}

.tabShortcutBtns button[type=button].tabShortcutBtn {
    height: 100%;
    font-size: 13px;
    text-align: center;
    border-radius: 5px;
    font-weight: 600;
    cursor: pointer;
    min-width: 85px;
    border: none;
}

.tabShortcutBtns button[type=button].tabShortcutBtn:not(:last-of-type) {
    margin-right: 5px;
}

.tabShortcutBtns button[type=button].tabShortcutBtn:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.tabShortcutBtns span.tabShortcutBtnSepar {
    width: 1px;
    height: 12px;
    display: inline-block;
    margin-right: 5px;
    background-color: #d2d2d2;
}

.tabShortcutBtns button[type=button].tabShortcutBtn.activeTabBtn {
    background-color: #fff;
}

.changeObjectsTabBtns {
    margin-left: 20px;
    height: 36px;
    padding: 4px;
    display: flex;
    align-items: left;
    justify-content: left;
}

.changeObjectsTabBtns button[type=button].tabBtn:hover {
    color: #333333;
}

.changeObjectsTabBtns button[type=button].tabBtn {
	background-color:transparent;
    height: 100%;
    font-size: 15px;
    text-align: center;
    font-weight: 600;
    cursor: pointer;
    min-width: 85px;
    border: none;
    color : #B2B2B2;
}

.changeObjectsTabBtns button[type=button].tabBtn.activeTabBtn {
    color: #333333;
    border-bottom:2px solid #0073FF;
}

.doc_info #checkinAndSaveDetailBtn, .doc_info #saveDetailBtn, .doc_info #cancelUpdateDetailBtn {
    display: none;
}

.doc_info #cancelUpdateDetailBtn {
    margin-right: 5px;
}
.doc_info #saveDetailBtn {
    margin-left: 5px;
}

.toggleAllTabsBtns {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    height: 24px;
    background-color: transparent;
    margin-left: 5px;
}

.toggleAllTabsBtns button {
    border: none;
    width: 16px;
    height: 100%;
    cursor: pointer;
}

.toggleAllTabsBtns .expandAllTabsBtn {
    background: url(../images/not_collapsed.png) no-repeat center;
    margin-right: 10px;
}

.toggleAllTabsBtns .collapseAllTabsBtn {
    background: url(../images/collapsed.png) no-repeat center;
}

.accordionTabWrap {
    display: flex;
    flex-direction: column;
    width: 100%;
    overflow-y: auto;
}

.accordionTab {
    margin-bottom: 20px;
}

.accordionTab .accordionTabTop {
    display: flex;
    justify-content: space-between;
    background-color: #f2f2f2;
    border-radius: 5px;
    padding: 8px 16px;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 10px;
    cursor: pointer;
}

.accordionTab .accordionTabTop .accordionTabInfo .accordionTabIcon {
    margin-right: 5px;
}

.accordionTabTop .accordionTabTitle {
    font-size: 17px;
}

.accordionTabTop .toggleTabBtn {
    width: 25px;
    border: none;
    cursor: pointer;
}

.accordionTabTop .expandTabBtn {
    background: url(../images/not_collapsed.png) no-repeat center;
}

.accordionTabTop .collapseTabBtn {
    background: url(../images/collapsed.png) no-repeat center;
}

.accordionTabContent {
    display: none;
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
}

.docAttrTableWrap, .appDataTableWrap {
}

.docAttrTableWrap {
    min-height: 230px;
}

.docAttrTable, .appDataTable {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.docAttrTable select {
    padding: 3px 10px;
    font-size: 14px;
    background-position: 98% 50%;
}

.docAttrTable textarea {
    box-sizing: border-box;
}

.docAttrTable th, .docAttrTable td,
.appDataTable th, .appDataTable td {
    background-color: transparent;
    border: none;
    text-align: left;
    font-size: 15px;
    color: #000;
    line-height: 28px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.docAttrTable .updateMode,
.appDataTable .updateMode {
    display: none;
}

.docAttrTable .viewLocation {
    color: #007bf7;
    cursor: pointer;
}

.docAttrTable .viewLocation:hover {
    text-decoration: underline;
}

.itemCell.requiredCell:after {
    content: "*";
    color: red;
}

.primaryFileWrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.secondaryFileWrap ul {
    display: flex;
    flex-direction: column;
}

.secondaryFileWrap ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.primaryFileWrap .fileInfo,
.secondaryFileWrap .fileInfo {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.primaryFileWrap .primaryFileInfo,
.secondaryFileWrap .secondaryFileInfo {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    color: #007bf7;
    cursor: pointer;
    line-height: 2.5;
}

.primaryFileWrap .primaryFileInfo a:visited,
.secondaryFileWrap .secondaryFileInfo a:visited {
    color: #007bf7;
}

.primaryFileWrap .primaryFileInfo:hover,
.secondaryFileWrap .secondaryFileInfo:hover {
    text-decoration: underline;
}

.secondaryFileInfo {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    color: #007bf7;
    cursor: pointer;
    line-height: 2.5;
}

.secondaryFileInfo a:visited {
    color: #007bf7;
}

.secondaryFileInfo:hover {
    text-decoration: underline;
}

.doc_info .viewPrimaryFile,
.doc_info .downloadPrimaryFile,
.primaryFileWrap .viewPrimaryFile {
    width: 27px;
    height: 27px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    margin-left: 5px;
    border: none;
    border-radius: 5px;
}

.doc_info .viewPrimaryFile,
.primaryFileWrap .viewPrimaryFile {
    background-image: url(../images/viewer.png);
}

.doc_info .downloadPrimaryFile {
    background-image:url(../images/download.png);
}

.doc_info .viewPrimaryFile:hover,
.doc_info .downloadPrimaryFile:hover,
.primaryFileWrap .viewPrimaryFile:hover {
    background-color: #f2f2f2;
}

/* DOC DETAIL INFO BTN*/
.doc_info_btnArea {
    padding: 5px 0;
    margin: 10px 0;
    box-sizing: border-box;
    white-space: nowrap;
    overflow-x: auto;
}
/*.doc_info_btnArea > ul > li{
  float:left;
}*/
.doc_info_download, .doc_info_autovue, .doc_info_bom, .doc_info_detail, .doc_info_approval{
    border:1px solid #a4b2c4;
    border-radius:5px;
    height:36px;
    padding:8px 12px;
    box-sizing: border-box;
    color:#3e4967; font-size:14px;
    padding-left:30px;
    margin-right:4px;
    line-height: 18px;
    /*2021.04.04 add*/
    flex:auto;
    /*text-overflow:ellipsis;*/
    white-space:nowrap;
    overflow:hidden;
    /*
    width:100px;
    min-width:85px;
    */
}
.doc_info_download{
    background:url(../images/doc_i_download.png) no-repeat 8px center;
}
.doc_info_autovue{
    background:url(../images/svg/viewer.svg) no-repeat 8px center; padding-left:36px;
    background-size:24px;
    display: inline-block;
}
.doc_info_bom{
    background:url(../images/bom/part01.png) no-repeat 8px center; padding-left:36px;
    display: inline-block;
}
.doc_info_detail{
    background:url(../images/doc_i_datail.png) no-repeat 8px center;
    display: inline-block;
}
.doc_info_approval{
    background:url(../images/doc_i_approval.png) no-repeat 8px center;
    display: inline-block; margin-right:0;
}
.table_in_download{
    /* old style
    background:url(../images/toolbar_icon/download.png) no-repeat center;
    background-size:20px;
    border:none;
    border-radius:5px;
    height:20px;
    padding:8px;
    box-sizing: border-box;
    color:#3e4967; font-size:14px;
    padding-left:30px;
    margin-right:8px;
    line-height: 18px;
    vertical-align:middle;
    cursor:pointer;
    */
    color: #007bf7;
    cursor: pointer;
    border-bottom: 1px solid transparent;
}
.table_in_download:hover {
    border-bottom: 1px solid #007bf7;
}
.grid_in_download{
    /* old style */
    background: url(../images/toolbar_icon/download.png) no-repeat center;
    background-size: 15px;
    border: none;
    border-radius: 5px;
    width: 20px;
    height: 20px;
    /* padding:8px; */
    padding: 14px;
    box-sizing: border-box;
    color: #3e4967;
    font-size: 14px;
    /* padding-left:30px;
    margin-right:8px; */
    line-height: 18px;
    vertical-align:middle;
    cursor:pointer;
    /*
    color: #007bf7;
    cursor: pointer;
    border-bottom: 1px solid transparent;
     */
}
.grid_in_download:hover {
    /* border-bottom: 1px solid #007bf7; */
    background-color: #f2f2f2;
}
.grid_in_autovue {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(../images/viewer.png) no-repeat center;
    /*background-size: 20 px;*/
    border: none;
    border-radius: 5px;
    /* padding:8px; */
    box-sizing: border-box;
    color: #3e4967;
    font-size: 14px;
    padding: 14px;
    /* margin-right:8px; */
    vertical-align: middle;
    cursor: pointer;
}
.grid_in_folder{
    background:url(../images/file02_icon.png) no-repeat center;
    background-size:16px;
    display:inline-block;
    border:none;
    border-radius:5px;
    width:20px;
    height:20px;
    /* padding:8px; */
    box-sizing: border-box;
    color:#3e4967; font-size:14px;
    padding:14px;
    line-height: 18px;
    vertical-align:middle;
    cursor:pointer;
}
.grid_in_autovue:hover, .grid_in_folder:hover {
    background-color: #f2f2f2;
}
.grid_in_detail {
    width: 16px;
    height: 16px;
    border: none;
    background: url(../images/icon_detail.png) no-repeat center;
    margin-top: 10px;
    cursor: pointer;
}
.grid_in_modify {
    width: 16px;
    height: 16px;
    border: none;
    background: url(../images/icon_modify.png) no-repeat center;
    margin-top: 10px;
    cursor: pointer;
}
.grid_in_detail:focus {
    border: none;
}

.grid_in_download2{
	background:url(../images/toolbar_icon/download.png) no-repeat center;
    background-size:24px;
    display:inline-block;
    border:none;
    border-radius:5px;
    width:20px;
    height:20px;
    /* padding:8px; */
    box-sizing: border-box;
    color:#3e4967; font-size:14px;
    padding:14px;
    line-height: 18px;
    vertical-align:middle;
    cursor:pointer;
}
.grid_in_download2:hover {
    /* border-bottom: 1px solid #007bf7; */
    background-color: #f2f2f2;
}

.grid_in_doc_1 {
	background:url(../images/doc_object01.png) no-repeat center;
    background-size:24px;
    display:inline-block;
    border:none;
    border-radius:5px;
    width:24px;
    height:24px;
    /* padding:8px; */
    box-sizing: border-box;
    color:#3e4967; font-size:14px;
    padding:14px;
    line-height: 18px;
    vertical-align:middle;
    cursor:pointer;
}

.grid_in_doc_1:hover {
    /* border-bottom: 1px solid #007bf7; */
    background-color: #f2f2f2;
}

.grid_in_doc_2 {
    background:url(../images/grid_doc02.png) no-repeat center;
    background-size:24px;
    display:inline-block;
    border:none;
    border-radius:5px;
    width:24px;
    height:36px;
    /* padding:8px; */
    box-sizing: border-box;
    color:#3e4967; font-size:14px;
    padding:14px;
    line-height: 18px;
    vertical-align:middle;
    cursor:pointer;
}

.grid_in_doc_2:hover {
    /* border-bottom: 1px solid #007bf7; */
    background-color: #f2f2f2;
}

.grid_in_modify2{
    /* old style */
    background: url(../images/icon_modify.png) no-repeat center;
    background-size: 15px;
    border: none;
    border-radius: 5px;
    width: 20px;
    height: 20px;
    /* padding:8px; */
    padding: 14px;
    box-sizing: border-box;
    color: #3e4967;
    font-size: 14px;
    /* padding-left:30px;
    margin-right:8px; */
    line-height: 18px;
    vertical-align:middle;
    cursor:pointer;
    /*
    color: #007bf7;
    cursor: pointer;
    border-bottom: 1px solid transparent;
     */
}
.grid_in_modify2:hover {
    /* border-bottom: 1px solid #007bf7; */
    background-color: #f2f2f2;
}

.grid_in_delete{
    /* old style */
    background: url(../images/toolbar_icon/delete.png) no-repeat center;
    background-size: 15px;
    border: none;
    border-radius: 5px;
    width: 20px;
    height: 20px;
    /* padding:8px; */
    padding: 14px;
    box-sizing: border-box;
    color: #3e4967;
    font-size: 14px;
    /* padding-left:30px;
    margin-right:8px; */
    line-height: 18px;
    vertical-align:middle;
    cursor:pointer;
    /*
    color: #007bf7;
    cursor: pointer;
    border-bottom: 1px solid transparent;
     */
}
.grid_in_delete:hover {
    /* border-bottom: 1px solid #007bf7; */
    background-color: #f2f2f2;
}


/* DOC DERAIL INFO STATUS */
.doc_info_status{
    clear:both;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.doc_info_s01, .doc_info_s02, .doc_info_s03{
    border:1px solid #e0e6ee;
    border-radius:5px;
    box-shadow: 0 3px 7px rgba(0,0,0, .07);
    padding:10px 8px 10px 16px;
    box-sizing: border-box;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    /*  color:#31455c;
      font-size:14px;*/
}
.doc_info_s03{ margin-bottom:8px; }

.doc_icon_create{ /*문서생성*/
    display: inline-block;
    background:url(../images/doc_cerate.png) no-repeat center;
    width:20px; height:20px;
    vertical-align: middle;
}
.doc_icon_checkOut{ /*체크아웃*/
    display: inline-block;
    background:url(../images/doc_checkOut.png) no-repeat center;
    width:20px; height:20px;
    vertical-align: middle;
}
.doc_icon_workCycle{ /*작업중, 배포중, 결재중*/
    display: inline-block;
    background:url(../images/doc_workCycle.png) no-repeat center;
    width:24px; height:24px;
    vertical-align: top;
}
.doc_icon_re_work{ /*재작업*/
    display: inline-block;
    background:url(../images/doc_re_work.png) no-repeat center;
    width:24px; height:24px;
    vertical-align: top;
}
.doc_icon_complete{ /*배포됨*/
    display: inline-block;
    background:url(../images/doc_complete.png) no-repeat center;
    width:24px; height:24px;
    vertical-align: top;
}
.doc_icon_check_in{ /*체크인*/
    display: inline-block;
    background:url(../images/doc_check_in.png) no-repeat center;
    width:20px; height:20px;
    vertical-align: middle;
}


.doc_info_text{
    color:#31455c;
    font-size:14px;
    vertical-align: middle;
    white-space: normal;
    text-overflow: ellipsis;
    overflow: hidden;
}
.boldText_blue{ font-weight:600; color:#007fff; font-size:14px; }
.boldText_green{ font-weight:600; color:#01bf68; font-size:15px;}

.inlineSpace10{ padding-right:10px; }
.inlineSpace14{ padding-right:14px; }

#itemDetailDiv {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100vh;
    overflow: hidden;
    padding: 0px 30px 16px 30px;
    box-sizing: border-box;
    background-color: #fff;
}

/* FILE TYPE IMG STYLE */
.fileTypeImg_pdf{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -336px center;
    margin:0 auto;
}
.fileTypeImg_doc{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat 0 center;
    margin:0 auto;
}.fileTypeImg_docx{
     width:48px; height:63px;
     background:url(../images/file_type.png) no-repeat 0 center;
     margin:0 auto;
 }
.fileTypeImg_dwg{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -48px center;
    margin:0 auto;
}
.fileTypeImg_file{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -96px center;
    margin:0 auto;
}
.fileTypeImg_html{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -144px center;
    margin:0 auto;
}
.fileTypeImg_iso{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -192px center;
    margin:0 auto;
}
.fileTypeImg_jpg{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -240px center;
    margin:0 auto;
}
.fileTypeImg_json{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -288px center;
    margin:0 auto;
}
.fileTypeImg_png{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -384px center;
    margin:0 auto;
}
.fileTypeImg_ppt{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -432px center;
    margin:0 auto;
}.fileTypeImg_pptx{
     width:48px; height:63px;
     background:url(../images/file_type.png) no-repeat -432px center;
     margin:0 auto;
 }
.fileTypeImg_txt{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -480px center;
    margin:0 auto;
}
.fileTypeImg_svg{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -528px center;
    margin:0 auto;
}
.fileTypeImg_xml{
    width:48px; height:63px;
    background:url(../images/file_type.png) no-repeat -576px center;
    margin:0 auto;
}
.FileName{
    color:#315efb; font-size:17px;
    text-decoration:underline; font-weight:600;
    cursor:pointer;
    width: 80%;
    white-space: break-spaces;
    text-align: center;
    margin: 0 auto;
    padding: 10px;
    box-sizing: border-box;
    overflow-y: hidden;
    text-overflow: ellipsis;
}








/*- DashBoard Area -------------------------------------------------------------------------------------*/
.dashboard_statusArea{
    /*height:240px;*/
    padding-bottom: 20px;
    /*box-sizing: border-box;*/
}
.dashboard_statusArea ul.statusBox{
    margin:0 auto;
    /*width:1470px;*/
    /*width:80%;*/
    white-space:nowrap;
    text-overflow:ellipsis;
    text-align:center;
    display: flex;
    justify-content: center;
}
.dashboard_statusArea .statusBox > li.statusBoxList{
    width: 160px;
    height: 160px;
    border-radius: 15px;
    text-overflow: ellipsis;
    padding: 16px 20px 16px 20px;
    box-sizing: border-box;
    cursor: pointer;
    list-style: none;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 1px solid #d2d2d2;
    box-shadow: 0px 3px 10px rgb(0,0,0,0.1);
    font-weight: 500;
    /*
    float: auto;
    flex: auto;
    */
}
.dashboard_statusArea .statusBox li:not(:last-child){
    margin-right: 20px;
}

/* Status Box --------*/
.on_red{ border:2px solid #fe4212 !important; background-color: #f8f8f8 !important; }
.on_bk{ border:2px solid #202e3f !important; background-color: #f8f8f8 !important; }
.on_blue{ border:2px solid #0073ff !important; background-color: #f8f8f8 !important; }

.status_num{ /*font-weight:600; font-size: 56px;*/ font-family:'Poppins-semibold'; font-size:64px;  line-height: 1; text-align: center; overflow: hidden; text-overflow: ellipsis; }
.numRed{ color:#fe4212; }
.numBlue{ color:#0073ff; }

select.status_workName{ border: none; text-align: left; font-weight: 600; font-size: 16px; font-family: 'NanumSquare' !important; color: #37445b; text-overflow: ellipsis; white-space: nowrap; background-color: transparent; text-align: center; padding: 0px 15px 0px 5px; }
select.status_workName:focus { border: none; }
.status_workName{ display: flex; color:#333; font-size: 15px; /* text-overflow: ellipsis; overflow: hidden; */ white-space: normal; text-align: center; font-family: 'NanumSquare'; font-weight:600; margin-top: 10px; height: 30px; justify-content: center; align-items: center; }
.status_appName{ color:#333; font-size:16px; line-height:1.8; text-align:left; }

/* Dashboard bottom Area --------*/
.d_bottomArea{
    display: flex;
    flex-direction: column;
    height: 100%;
    box-sizing:border-box;
    max-height: calc(100% - 180px);
}
.d_bottomArea .listArea {
    max-height: calc(100% - 40px);
}
.resizerDragBar {
    width: 100%;
    height: 10px;
    margin-top: 10px;
    background-color: rgb(236, 236, 236);
    z-index: 997;
}
.dashboard_TableArea{
    border-width: 0 1px 0 1px;
    border-style: solid;
    border-color:#e7e7e7;
    border-radius:5px;
}



/*- Cabinet Area -------------------------------------------------------------------------------------*/
.cabinetArea{ box-sizing: border-box; }

/*- CABINET TREE -*/
.cabinet_treeArea{ display:flex; flex-direction: column; width: 20%; height: 100%; box-sizing: border-box; }
.cabinet_treeArea .dhxcombo_dhx_skyblue, .cabinet_popup_treeArea .dhxcombo_dhx_skyblue, .popup_content .searchTable div.dhxcombo_dhx_skyblue { width: 100% !important; }

.cabinet_popup_treeArea{ width:37%; margin-right: 20px; overflow: hidden; display: flex; flex-direction: column; }

.cabinet_treeWrap{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    border: 1px solid #d2d2d2;
    border-radius: 5px;
    box-sizing: border-box;
    overflow: hidden;
    /*border:1px solid #a0aaa9;*/
    /* border:1px solid #e8ecf3; */
}
.treeBtnArea{
    display: flex;
    width: 100%;
    justify-content: flex-end;
    /*background-color: #f2f2f2;*/
    height: 35px;
    box-sizing: border-box;
    padding: 4px 10px;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    border-radius: 5px 5px 0 0;
    border: 1px solid #d2d2d2;
}
.treeBtnArea02{
    display: flex;
    width: 100%;
    justify-content: flex-end;
    /*background-color: #f2f2f2;*/
    height: 35px;
    box-sizing: border-box;
    padding: 4px 10px;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
}
.cabinet_tree{
    padding:5px;
    overflow:auto;
    height: 100%;
    border-radius: 0 0 5px 5px;
}

/*- CABINET GRID -*/
.cabinetRight_Area{ /*2020.12.17 add */
    /*width: 85%;*/
    /*padding: 0 0 0 20px;*/
    /* width:83.5%; */
    display: flex;
    flex-direction: column;
}
.cabinetRight_popup_Area{ /*2020.12.17 add */
    /*width: 85%;*/
    /*padding: 0 0 0 20px;*/
    width:59.5%;
    display: flex;
    flex-direction: column;
    margin-left: 6px;
    overflow: hidden;
}
.cabinet_gridArea{
    width:62%;
    padding-right: 20px;
    /*--2020.12.17 del--*/
    /*padding:0 20px;*/
    /*box-sizing: border-box;*/
}
.folderRoute{
    display: flex;
    align-items: center;
    background-color: #f2f2f2;
    height:30px; /*36px*/
    border:1px solid #d2d2d2;
    border-radius: 5px;
    padding:5px 10px;
    box-sizing: border-box;
}
.routeText{ color:#575757; font-size:14px; /*margin-top: -3px;*/ }
.routeText a { color:#0073ff; }
.gridBtnArea{
    display: flex;
    justify-content: flex-start;
    vertical-align: middle;
    box-sizing: border-box;
    padding-left: 8px; padding-right: 8px;
    background-color:#fff;
    /* border:1px solid #e8ecf3;  */
    margin-bottom: 5px;
    overflow-x: auto;
    overflow-y: hidden;
}
.gridBtnArea > ul {
    display: flex;
    justify-content: flex-start;
}
.gridBtnArea li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    margin-right: 10px;
    border-radius: 5px;
}
.gridBtnArea li:hover,
.gridBtnArea li:focus {
    background-color: #f2f2f2;
}
.gridBtnArea02{
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box; padding:10px; background-color:#fff;
    /*border:1px solid #d5d5d5; border-bottom:0;*/
    border:1px solid #d2d2d2;
    border-radius: 15px 15px 0 0;
    border:1px solid #d2d2d2;
    border-radius: 15px 15px 0 0;
    overflow-x: auto; overflow-y: hidden;
    border-bottom:0;
}
.gridBtnArea02 > .leftGridBtns {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-right: auto;
}
.gridBtnArea02 > .rightGridBtns {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-left: auto;
}
.gridBtnArea02 input {
    margin-right: 5px;
}
.gridBtnArea02 > .rightGridBtns > input:last-child {
    margin-right: 0px;
}

.secondaryFileUl > .rightGridBtns {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-left: auto;
}

.cabinet_grid{ /* height:640px; */ border:1px solid #d5d5d5; }

.gridBtnArea03{
    border:1px solid #d5d5d5; background-color:#fff;
    height:48px; box-sizing: border-box;
    padding: 6px 6px 6px 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.gridBtnArea03 > button{
    vertical-align:middle;
}

.gridBtnArea04 {
    padding: 15px;
}

.gridBtnArea05{
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box; padding:10px; background-color:#fff;
    overflow-x: auto; overflow-y: hidden;
    border-bottom:0;
}

.gridBtnArea05 > .leftGridBtns {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-right: auto;
}
.gridBtnArea05 > .rightGridBtns {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-left: auto;
}
.gridBtnArea05 input {
    margin-right: 5px;
}
.gridBtnArea05 > .rightGridBtns > input:last-child {
    margin-right: 0px;
}


/*- CABINET DETAIL -*/
.cabinet_detailArea{
    /*width:21.8%;*/
    /*border:1px solid #d9d9d9;*/
    /*---2020.12.17 add---*/
    width: 38%;
    border: 1px solid #d9d9d9;
    height: 745px;
}




/*- ADMIN Area -------------------------------------------------------------------------------------*/
/*   #content_Type02{
  width:calc(100% - 280px);
  padding:25px 25px 16px 25px;
  background-color:#f7f9fb;
  box-sizing: border-box;
  white-space: nowrap;
  margin-left:280px;
  border-left:1px solid #c3c7ca;
  height:845px;
  }
 */
#content_Type02{
    padding: 0 40px;
    box-sizing: border-box;
    white-space: nowrap;
}

#content_Type03{
    padding: 0 40px;
    box-sizing: border-box;
    overflow: hidden;
    height: 100%;
}

.l_content{
    display: flex;
    flex-direction: column;
    /*display:inline-block;*/
    width:49%;/* height:100%;*/
    box-sizing: border-box;
    /*border:1px solid #d9d9d9;*/
    /* border:1px solid #e8ecf3; */
    background-color:#fff;
}
.slideBar_Wrap{
    width: 25px;
    height: 100%;
    box-sizing: border-box;
    position: relative;
    flex-shrink: 0;
    background-color: white;
}
.popup_content .slideBar_Wrap {
    height: auto;
}
.slideBar_Wrap2{
    width: 100%;
    height: 25px;
    box-sizing: border-box;
    position: relative;
    flex-shrink: 0;
    background-color: white;
}
.slideBar02{
    /*width:24px;*/
    /*float:left;*/
    cursor: col-resize;
    background:url(../images/slide_bar_vertical.png) no-repeat center;
    width: 100%;
    height: 100%;
}
.slideBar {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
}
.slideBar_vertical{
    cursor: col-resize;
    background:url(../images/slide_bar_vertical.png) no-repeat;
    top: 0;
    bottom: 0;
}
.popup_content .slideBar_vertical {
    background-position: 50% 76% !important;
}

.slideBar_horizontal{
    cursor: row-resize;
    background:url(../images/slide_bar_horizontal.png) no-repeat center;
    left: 0;
    right: 0;
}
.r_content{
    display: flex;
    flex-direction: column;
    width:49%;
    /*height:100%;*/
    /*border:1px solid #d9d9d9;*/
    /* border:1px solid #e8ecf3; */
    box-sizing: border-box;
    background-color:#fff;
    overflow: hidden;
}
.detail_wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 0 20px;
}
.detail_wrapper > .detail_content_wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow-y: auto;
    padding: 0 5px 10px 5px;
}
.searchTableArea .detail_wrapper {
    padding: 0 20px 20px 20px;
}
.red_mark{
    display:inline-block; width:8px; height:12px; padding:3px;
    background:url(../images/red_mark.png) no-repeat top center;
}
.grid_box{
    /*width:65%;*/
    padding:0 20px;
    box-sizing: border-box;
    border:1px solid #d5d5d5;
    height:460px;
}
.groupBox_area, .userBox_area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}
.groupBox_area li{
    /*float:left;*/
    box-sizing: border-box;
    display:inline-block;
}
.left_groupBox{ vertical-align: middle; }
.groupBox_btn{ /*width:30%;*/ text-align: center; padding:0 2%; vertical-align: text-top; }
.right_groupBox{ vertical-align: middle; height: 100%; }

/* BOX WIDTH SIZE */
.boxWidth10{ width:10%; }
.boxWidth15{ width:15%; }
.boxWidth20{ width:20%; }
.boxWidth25{ width:25%; }
.boxWidth30{ width:30%; }
.boxWidth35{ width:35%; }
.boxWidth36{ width:36%; }
.boxWidth37{ width:37%; }
.boxWidth38{ width:38%; }
.boxWidth39{ width:39%; }
.boxWidth40{ width:40%; }
.boxWidth41{ width:41%; }
.boxWidth42{ width:42%; }
.boxWidth43{ width:43%; }
.boxWidth44{ width:44%; }
.boxWidth45{ width:45%; }
.boxWidth50{ width:50%; }
.boxWidth54{ width:54%; }
.boxWidth60{ width:60%; }

.move_titleBox{
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 48px;
    box-sizing: border-box;
    padding:8px 0px;
    /*margin-bottom: 8px;*/
}
.move_title{
    padding-right:10px;
    font-size:15px; color:#575757;
    font-weight:600;
    vertical-align: sub;
}
.item_moveBox{
    height:330px;
    border:1px solid #c7c9cb;
    background: none;
}


/* END :: CONTENT STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/








/* START :: LOGIN PAGE STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
.login{
    width: 550px;
    height: 660px;
    background: #fff;
    border-radius: 15px;
    box-shadow: 0 3px 10px rgb(0 0 0/ 10%);
    padding: 80px 70px;
    box-sizing: border-box;
}
.login_box{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.login_bgImg{
    width: 62px;
    height: 62px;
    background-image: url(../images/astra_simbol.png);
    background-repeat: no-repeat;
    margin-bottom: 4px;
}
.login_title{
    font-family: 'Poppins';
    font-size: 44px;
    font-weight: 700;
    margin-bottom: 60px;
}
.login_id {
    display: block;
    width: 100%;
    height: 60px;
    color: #555;
    border: none;
    border-bottom: 2px solid #d2d2d2;
    box-sizing: border-box;
    padding: 8px 16px 8px 56px;
    font-size: 20px;
    background: url(../images/id_icon.png) no-repeat 24px center;
    margin-bottom: 20px;
}
.login_id::placeholder,
.login_pw::placeholder{color: #d2d2d2;}
.login_pw {
    display: block;
    width: 100%;
    height: 60px;
    color: #555;
    border: none;
    border-bottom: 2px solid #d2d2d2;
    box-sizing: border-box;
    padding: 8px 16px 8px 56px;
    font-size: 20px;
    background: url(../images/pw_icon.png) no-repeat 24px center;
    margin-bottom: 20px;
}
.login_checkbox_area{
    width: 100%;
    font-size: 16px;
    margin-bottom: 18%;
    display: flex;
    align-items: center;
}
.login_checkbox_area > #login_saveID{margin-right: 8px;}
.login_btn{
    width: 100%;
    padding: 14px 10px;
    border-radius: 30px;
    border: none;
    background: #0073FF;
    color: #fff !important;
    font-weight: 600;
    font-size: 18px;
}
/* END :: LOGIN PAGE STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/








/* START :: POPUP PAGE STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
.popup_header{
    display: flex;
    justify-content: space-between;
    width:100%; height:50px; /*63px*/
    background-color:#fff;
    color:#333;
    font-size:18px; /*18px*/
    font-weight:600;
    /* border-bottom:1px solid #d0d0d0; */
    box-sizing:border-box;
    /*
    background-image:url(../images/popup_bg03.png);
    background-repeat:no-repeat;
    background-position: right center;
    */
    /* padding:11px 0 8px 20px; */ /*16 0 8 20*/
    padding-top: 20px;
    padding-left: 20px;
}
.popup_content{
    font-family: 'Poppins-medium', 'NanumSquare', 'sans-serif';
    padding: 20px 25px 5px 25px; box-sizing: border-box;
    height: calc(100% - 50px);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}


/* APPROVAL POPUP -------------------------------------------------*/
.userBox_area li{
    float:left; box-sizing: border-box;
}
.left_userBox{
    width: 300px;
    margin-right: 10px;
}
.right_userBox{ width:450px; margin-bottom: auto; }

.user_inputBox{
    height: 48px; box-sizing: border-box; padding:8px 0;
}
.userSearch{
    width:100%;
    background:url(../images/search_02.png) no-repeat 8px center;
    padding-left:28px !important;
    box-sizing: border-box;
    height:32px;
}
.data_moveBox{
    height:433px;
    border:1px solid #c7c9cb;
    padding:8px;
    box-sizing: border-box;
}
.data_selected{
    padding:2px 3px;
    border:2px solid #000;
    border-radius:5px;
    box-sizing: border-box;
}
.approval_text{ color:#575757; font-weight:600; padding-bottom:5px;  }
.wrap_userApplyBox{
    overflow-y: auto;
    height:130px;
}
.userApplyBox{ padding-bottom:8px; }

.popup_r_contentArea{
    /* padding: 16px 30px; */
    box-sizing: border-box;
    width: 33.5%;
    /* float: right; */
    display: inline-block;
    /* border: 1px solid #d8dfe9; */
    /*border: 1px solid #e8ecf3;*/
    background-color: #fff;
}
.popup_docTitle{
    height: 60px;
    background-color: #f9fbff;
    font-size: 18px;
    font-weight: 600;
    color: #1e3045;
    padding: 16px 0 0 20px;
    box-sizing: border-box;
    border-bottom: 1px solid #dbdddf;
}
.popup_commentText{
    white-space: normal;
    line-height: 20px;
}


/* ERROR POPUP -------------------------------------------------*/

.error_popup_content{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.errorImg{
    width: 100px;
    height: 100px;
    background:url(../images/erroe_img.svg) no-repeat center;
}
.errorText{
    display: flex;
    flex-direction: column;
    width:50%;
    font-size:17px;
    color:#1a2420;
    font-weight:600;
    background-color:#f7f9fb;
    border:1px dashed #a2a2a2;
    border-radius:8px;
    padding: 17px;
    box-sizing: border-box;
    margin-top: 30px;
}


/* END :: POPUP PAGE STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/











/* START :: Table STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
table.info_table, table.searchTable, table.resultTable, table.detailInfoTable,
table.inTable, table.dashboard_Table, table.c_detailInfoTable, table.approval_grid,
table.detailInfoTable_default, table.datailInfo_topTable, table.detailInfoTable_addTable,
table.detailInfoTable_FileType,  table.doc_info_table{
    width:100%;
    /*white-space:nowrap;
    text-overflow:ellipsis;*/
    border-collapse: collapse;
    vertical-align:middle;
    table-layout:fixed;
}

table.searchTable th, table.searchTable td, table.resultTable th, table.resultTable td,
table.detailInfoTable th, table.detailInfoTable td,
table.detailInfoTable_default th, table.detailInfoTable_default td,
table.c_detailInfoTable th, table.c_detailInfoTable th{
    height:32px; /*2021.04.07 48px edit*/
    white-space:normal;
    /*text-overflow:ellipsis;*/
    /*overflow:hidden;*/
    vertical-align:middle;
    box-sizing: border-box;
}

table.searchTable td, table.resultTable td, table.detailInfoTable td{ color:#575757;  font-size:14px; }

table.inTable th, table.inTable td{
    height:36px;
    white-space:normal;
    /*text-overflow:ellipsis;
    overflow:hidden;*/
    vertical-align:middle;
    box-sizing: border-box;
}
table.dashboard_Table th{
    border-right:none; border-left:none;
    height:64px;
    vertical-align: middle;
}

table.dashboard_Table td{
    border-right:none; border-left:none;
    height:48px;
    vertical-align: middle;
}

table.datailInfo_topTable th, table.datailInfo_topTable td{
    height:24px;
    white-space:normal;
    /*text-overflow:ellipsis;
    overflow:hidden;*/
    vertical-align:middle;
    box-sizing: border-box;
}
table.datailInfo_topTable th{
    background-color:#f5fafa;
    border:1px solid #d8dfe9;
    padding:1px 3px;
    box-sizing: border-box; color:#879898;
    font-weight:600;
    font-size:14px;
}
table.datailInfo_topTable td{
    background-color:#fff;
    border:1px solid #d8dfe9;
    padding:1px 3px;
    box-sizing: border-box; color:#6a7a7a;
    font-size:14px;
}
table.doc_info_table th{
    border-right:1px solid #d8e1ec;
    color:#3e4967; text-align: center;
    font-size:15px; font-weight:600;
    white-space:normal;
    /*text-overflow:ellipsis;
    overflow:hidden;*/
}
table.doc_info_table td{
    color:#3e4967;
    font-size:14px;
    padding:5px 8px;
    white-space:normal;
    /*text-overflow:ellipsis;
    overflow:hidden;*/
}

/*Item th -------------------------------------------------------------------------------------*/
.itemCell{
    /*border:1px solid #d8dfe9;*/
    border: 1px solid #d2d2d2;
    color:#575757;
    font-size:15px;/*2021.04.08 17px edit*/ font-weight:600;
    text-align:right; padding-right:8px;
    /*background-color: #f5faff;*/
    /* background-color: #eff2f5; */ /*#eff2f5*/
    background-color: #f2f2f2;
}
.itemCell02{
    border:1px solid #d8dfe9;
    color:#575757;
    font-size:17px; font-weight:600;
    text-align:center;
    background-color: #f5faff;
}
.itemCell03{
    border:1px solid #d8dfe9;
    color:#6e6e6e;
    font-size:14px; font-weight:600;
    text-align:right; padding-right:8px;
    background-color: #f5faff;
}
.itemCell04{
    border: 1px solid #d8dfe9;
    color: #6e6e6e;
    font-size: 14px;
    font-family: 'Noto Sans KR-Bold';
    text-align: center;
    padding: 8px;
    background-color: #f5faff;
    vertical-align: middle;
    box-sizing: border-box;
    height: 36px;
}

.d_itemCell{
    border:1px solid #d8dfe9;
    color:#575757;
    font-size:17px; font-weight:600;
    text-align:center;
    background-color: #f5faff;
}


/*Data td -------------------------------------------------------------------------------------*/
.dataCell{
    /*border:1px solid #d8dfe9;*/
    border:1px solid #ccd2da;
    vertical-align:middle; background-color:#fff;
    padding: 4px;
}
.dataCell02{
    border:1px solid #d8dfe9;
    vertical-align:middle; text-align:center;
    color:#575757; font-size:16px; padding:5px 8px;
}
.dataCell03{
    border:1px solid #d8dfe9;
    vertical-align:middle; text-align:left;
    color:#98968e; font-size:14px; padding:5px 8px;
}
.dataCell04{
    border:1px solid #d8dfe9; vertical-align:middle;
    background-color:#f5fafa; padding:24px 8px 16px 8px;
    box-sizing: border-box;
}
.dataCell05{
    border:1px solid #d8dfe9;
    height:80px;
    vertical-align:middle; text-align:left;
    color:#98968e; font-size:14px; padding:5px 8px;
}



.d_dataCell{
    border:1px solid #d8dfe9;
    vertical-align:middle; text-align:center;
    color:#98968e; font-size:14px; padding:5px 8px;
}


.selectDataCell{ background-color:#e2efff; }
.selectDataText{ color:#315efb; font-weight:600; font-size:16px; }

.searchFormData, .dataCell{ padding: 4px; }

.infoData{
    border:1px solid #33373d;
    vertical-align:middle;
    padding: 8px 8px 8px 15px;
}



p.infoData_text{ color:#c5cace; font-size:13px; }

.searchFormBtnArea{ padding:30px 10px; border:1px solid #282c30; }
.searchFormBtnArea01{ padding:5px; border:1px solid #282c30; text-align: end; }

.addText{ font-size:13px; font-weight:600; color:#a3acb5; display:inline-block; margin-left:5px; }
.td_space{ width:5px; }

.itemLabel{ color:#575757; font-size:15px; font-weight:600; }




/* APPROVAL POPUP TABLE -------------------------------------------------------------------------------------*/
table.approval_grid th, table.approval_grid td{
    border:1px solid #dbdddf;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    vertical-align:middle;
    box-sizing: border-box;
    padding: 5px;
}
table.approval_grid th{
    text-align: right;
}

/* END :: Table STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/









/* START :: Input STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
input{ outline: none; box-sizing: border-box; }


input[type='text']{ /* Default Style */
    border:1px solid #d2d2d2;
    border-radius: 5px;
    padding:3px 10px; /*2021.04.04 8px 10px edit*/
    color:#5d5d5d;
    vertical-align:middle;
    font-size:14px;
    font-family:'Poppins-medium', 'NanumSquare', sans-serif;
}
input[type='date']{
    border:1px solid #bec7c6;
    border-radius: 3px;
    padding:5px 10px;
    color:#5d5d5d; font-family:'Noto Sans KR-Regular';
    vertical-align:middle;
    font-size:15px;
}
input[type='search']{
    border:1px solid #bec7c6;
    border-radius: 3px;
    color:#5d5d5d;
    padding:8px 10px;
    vertical-align:middle;
    font-size:15px;
    font-family:'Poppins-medium', 'NanumSquare', sans-serif;
}
input[type='number']{
    border:1px solid #bec7c6;
    border-radius: 3px;
    color:#5d5d5d;
    padding: 3px 5px;
    vertical-align:middle;
    font-size:14px;
    font-family:'Poppins-medium', 'NanumSquare', sans-serif;
}
.TextBox100 { width:99.9%; }
.TextBox99{ width:99%; }
.TextBox98{ width:98%; }
.TextBox97{ width:97%; }
.TextBox96{ width:96%; }
.TextBox95{ width:95%; }
.TextBox94{ width:94%; }
.TextBox93{ width:93%; }
.TextBox92{ width:92%; }
.TextBox91{ width:91%; }
.TextBox90, .inputDisabled01{ width:90%; }
.TextBox85{ width:85%; }
.TextBox84{ width:84%; }
.TextBox80, .inputDisabled02{ width:80%; }
.TextBox75{ width:75%; }
.TextBox60{ width:60%; }
.TextBox50{ width:50%; }
.TextBox45{ width:45%; }
.TextBox40{ width:40%; }
.TextBox35{ width:35%; }
.TextBox30{ width:30%; }
.TextBox25{ width:25%; }
.TextBox20{ width:20%; }


.TextBox90:invalid{ /* Input Error */
    border:1px solid #fe011f; border-radius: 0;
}

.inputError, .inputError:focus{ /* Input Error */
    border:1px solid #fe011f; border-radius: 0;
    color:#6d6d6d;
}

.inputDisabled01, .inputDisabled02{
    background-color:#2c3036; border-radius: 0;
    border:none;
    color:#2e364d;
    padding:8px 10px;
    vertical-align:middle;
    font-size:13px;
}

.inputSuccess{ border:1px solid #28353f; border-radius: 0; }




.search_btn{ margin-left:5px; vertical-align: middle; }
input[type='file']{ display:none; }
input[type='text'], select, textarea { outline:none; }
input[type='text']:focus, input[type='search']:focus, textarea:focus { border:1px inset #707070; border-radius: 3px; }
.inputDisabled01:focus, .inputDisabled02:focus{ border:none; }



select{
    width:100%; cursor:pointer;
    border:1px solid #d2d2d2; border-radius: 5px;
    height: 28px;
    padding: 0 5px;
    color:#5d5d5d;
    transform:skew(-0.1deg);
    font-size:15px;
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    background:url(../js/dhtmlx/dhtmlxSuite/codebase/imgs/dhxcombo_skyblue/dhxcombo_arrow_down.gif) no-repeat 98% 50%;
    background-color:#fff;
    font-family: 'Poppins-medium', 'NanumSquare', sans-serif !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

select::-ms-expand{ display:none; }
option{ padding:4px 10px; color: #5d5d5d; font-family:'Poppins-medium', 'NanumSquare', sans-serif;}

.multiSelect{ background:none; color:#575757; font-size:15px; }
.multiSelect:focus{ border:1px solid #bec7c6; }
.selectBox01{
    position: relative;
    top: -1px;
    height: 32px;
    margin-right: 2px;
}


.inputSelect01{ width:85%; }

.cabinet_Select{ height:40px; border:1px solid #a0aaa9; border-radius: 0; }


textarea{
    width:100%;
    resize:none;
    border:1px solid #d2d2d2; border-radius:5px;
    padding:8px 10px;
    color:#5d5d5d;
    font-size:14px;
    height:100%;
    background-color:#fff;
    font-family: 'Poppins-medium', 'NanumSquare', sans-serif;
    box-sizing: border-box;
    margin-top: 5px;
}

.wf_popup_content textarea {
    margin-top: 0px;
}

.dashedTextBox{
    border:1px dashed #bbbfbf !important;
    border-radius:3px;
}







/* Button Style -------------------------------------------------------------------------------------*/
.textBtn{
    font-size:14px;
    border-radius:3px; border:none; text-align:center;
    /*padding:8px 16px;*/ /*2021.04.07 edit*/
    padding:4px 10px; /*2021.04.07 add*/
    /*height:40px;*/ /*2021.04.07 edit*/
    white-space:nowrap;
}

.blueBtn{ background-color:#dae6ff; color:#315efb; }
.blueBtn:hover{ background-color:#315efb; color:#fff; }
.lightGrayBtn{ background-color:#dce0e2; color:#323536; }
.lightGrayBtn:hover{ background-color:#323536; color:#fff;}
.greenBtn{ background-color:#c4e7e7; color:#135f5f; }
.greenBtn:hover{ background-color:#135f5f; color:#fff; }
.darkblueBtn{ background-color:#b8cee5; color:#2e3b4a; }
.darkblueBtn:hover{ background-color:#6a92be; color:#fff; }

.workBtn{
    background-color:#293f4b; color:#fff;
    border-radius:5px; border:none; text-align:center;
    font-size:14px;
    padding:4px 8px;
    height:32px;
    float: right;
    margin-top: 8px;
    margin-right: 5px;
}

.treeBtnArea button, .treeBtnArea02 button {
    border:none;
    background-color:rgba(0,0,0,0);
    background-position: center;
    background-repeat:no-repeat;
    padding: 10px 15px;
}

.treeBtnArea button:focus {
    border:none;
}

.tree_addBtn{
    background-image:url(../images/not_collapsed.png);
}
.tree_delBtn{
    background-image:url(../images/collapsed.png);
}
.tree_reBtn{
    background-image:url(../images/refresh02.png);
}

.pw_reset{
    background-color:#cce4f1;
    border-radius:5px;
    color:#3d515c;
    padding:5px 38px 5px 8px;
    border:0;
    background-image:url(../images/reset.png);
    background-repeat: no-repeat;
    background-position:95% center;
    white-space:normal;
    text-align:left;
}
.g_undo{
    display:block;
    width:88px; height:32px;
    box-sizing: border-box;
    background-color:#697881;
    border-radius:16px;
    color:#fff;
    border:0;
    margin-bottom:10px;
    background-image:url(../images/g_undo.png);
    background-repeat:no-repeat;
    background-position: 13px center;
    padding-left:20px;
}
.g_redo{
    display:block;
    width:88px; height:32px;
    box-sizing: border-box;
    background-color:#697881;
    border-radius:16px;
    color:#fff;
    border:0;
    margin-bottom:10px;
    background-image:url(../images/g_redo.png);
    background-repeat:no-repeat;
    background-position: 16px center;
    padding-left:20px;
}
.g_next01, .g_next02, .g_pre01, .g_pre02 {
    width: 32px;
    height: 32px;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 16px;
    color: #fff;
    border: 1px solid #d2d2d2;
    display: block;
    margin-bottom: 10px;
}
.addBtn:hover, .g_next01:hover, .g_next02:hover, .g_pre01:hover, .g_pre02:hover {
    background-color: rgba(0, 0, 0, 0.05);
}
.g_next01{
    background-image:url(../images/g_next01.png);
    background-repeat:no-repeat;
    background-position: center;
    padding-left:20px;
}
.g_next02{
    background-image:url(../images/rightmove.png);
    background-repeat:no-repeat;
    background-position: center;
    padding-left:20px;
}
.g_pre01{
    background-image:url(../images/leftmove.png);
    background-repeat:no-repeat;
    background-position: center;
    padding-left:20px;
    margin-bottom: 0;
}
.g_pre02{
    background-image:url(../images/g_pre02.png);
    background-repeat:no-repeat;
    background-position: center;
    padding-left:20px;
}


.top_btn_area{ padding: 20px 5px 5px 20px; }
.bottom_btn_area{ padding:10px 0; text-align:right; clear:both; }
.botton_btn_area02{ padding:10px 8px 10px 0; text-align:right; }
button{ outline: none; cursor:pointer; font-weight:600; box-sizing:border-box; font-family:'Poppins-medium', 'NanumSquare', sans-serif;  }
button:active{ /* position:relative; top:1px; */ }
.gridBtnArea > button{
    /*
    border:none; padding:3px 8px; border-radius: 3px;
    margin-right: 3px;
    font-family:'Poppins-medium', 'NanumSquare', sans-serif;
    */
}

.imgButton {
    padding: 5px;
    vertical-align: middle;
    cursor : pointer;
}


/* FUNCTION BTN */
/* Activation */
.f_new{ width:22px; height:22px; background:url(../images/toolbar_icon/new.png) no-repeat center; display:inline-block; }
.f_refresh{ width:22px; height:22px; background:url(../images/toolbar_icon/refresh.png) no-repeat center; display:inline-block; }
.f_edit{ width:22px; height:22px; background:url(../images/toolbar_icon/update.png) no-repeat center; display:inline-block; }
.f_download{ width:22px; height:22px; background:url(../images/toolbar_icon/download.png) no-repeat center; display:inline-block; }
.f_checkin{ width:22px; height:22px; background:url(../images/toolbar_icon/checkin.png) no-repeat center; display:inline-block; }
.f_checkout{ width:22px; height:22px; background:url(../images/toolbar_icon/checkout.png) no-repeat center; display:inline-block; }
.f_undo{ width:26px; height:25px; background:url(../images/toolbar_icon/undocheckout.png) no-repeat center; display:inline-block; }
.f_edit_checkout{ width:25px; height:25px; background:url(../images/toolbar_icon/edit.png) no-repeat center;display:inline-block; }

.f_del{ width:22px; height:22px; background:url(../images/toolbar_icon/delete.png) no-repeat center; display:inline-block; }
.f_move{ width:25px; height:25px; background:url(../images/toolbar_icon/move.png) no-repeat center; display:inline-block; }
.f_favorite{ width:22px; height:22px; background:url(../images/toolbar_icon/favorite.png) no-repeat center; display:inline-block; }
.f_changeState{ width:24px; height:24px; background:url(../images/toolbar_icon/setstate.png) no-repeat center; display:inline-block; margin-top:-2px;  vertical-align: top;}
.f_approval{ width:23px; height:25px; background:url(../images/toolbar_icon/workflow.png) no-repeat center; display:inline-block; margin-top:-2px;  vertical-align: top;}
.f_approval02{ width:23px; height:25px; background:url(../images/toolbar_icon/ditribute.png) no-repeat center; display:inline-block; margin-top:-2px; vertical-align: top;}
.f_shortcut{ width:25px; height:25px; background:url(../images/toolbar_icon/shortcut.png) no-repeat center; display:inline-block; }
.f_multi_doc{ width:26px; height:24px; background:url(../images/svg/multi_create.svg) no-repeat center; display:inline-block; }
.f_folder{ width:26px; height:24px; background:url(../images/svg/folder.svg) no-repeat center; display:inline-block; }
.f_status{width: 26px; height: 26px; background:url(../images/svg/status.svg) no-repeat center; display:inline-block; }


.f_autovue{ width:20px; height:20px; background:url(../images/toolbar_icon/autovue.png) no-repeat center; display:inline-block; margin-right:12px;  }


/* Disable */
.d_f_new{ width:26px; height:24px; background:url(../images/svg/d_create.svg) no-repeat center; display:inline-block; margin-right:12px;   }
.d_f_refresh{ width:26px; height:24px; background:url(../images/svg/d_refresh.svg) no-repeat center; display:inline-block; margin-right:12px; }
.d_f_edit{ width:26px; height:24px; background:url(../images/svg/d_update.svg) no-repeat center; display:inline-block; margin-right:12px; }
.d_f_download{ width:26px; height:24px; background:url(../images/svg/d_download.svg) no-repeat center; display:inline-block; margin-right:12px;  }
.d_f_checkin{ width:26px; height:24px; background:url(../images/svg/d_checkin.svg) no-repeat center; display:inline-block; margin-right:12px;  }
.d_f_checkout{ width:26px; height:24px; background:url(../images/svg/d_checkout.svg) no-repeat center; display:inline-block; margin-right:12px; }
.d_f_undo{ width:30px; height:24px; background:url(../images/svg/d_undo_checkout.svg) no-repeat center; display:inline-block; margin-right:12px; }
.d_f_edit_checkout{ width:26px; height:24px; background:url(../images/svg/d_edit_checkout.svg) no-repeat center; display:inline-block; margin-right:12px; }

.d_f_del{ width:26px; height:24px; background:url(../images/svg/d_del.svg) no-repeat center; display:inline-block; margin-right:12px;  }
.d_f_move{ width:26px; height:24px; background:url(../images/svg/d_move.svg) no-repeat center;display:inline-block; margin-right:12px;   }
.d_f_favorite{ width:26px; height:24px; background:url(../images/svg/d_favorite.svg) no-repeat center; display:inline-block; margin-right:12px; }
.d_f_approval{ width:26px; height:27px; background:url(../images/svg/d_approval.svg) no-repeat center;display:inline-block; margin-right:12px; margin-top:-2px;  vertical-align: top;}
.d_f_approval02{ width:26px; height:27px; background:url(../images/svg/d_approval02.svg) no-repeat center; display:inline-block; margin-right:12px; margin-top:-2px; vertical-align: top;}
.d_f_shortcut{ width:26px; height:24px; background:url(../images/svg/d_shortcut.svg) no-repeat center; display:inline-block; margin-right:12px;  }
.d_multi_doc{ width:26px; height:24px; background:url(../images/svg/d_multi_create.svg) no-repeat center; display:inline-block; margin-right:12px; }
.d_f_folder{ width:26px; height:24px; background:url(../images/svg/d_folder.svg) no-repeat center; display:inline-block; margin-right:12px; }
.d_f_status{width: 26px; height: 26px; background:url(../images/svg/d_status.svg) no-repeat center; display:inline-block; margin-right:12px; }


.d_f_autovue{ width:24px; height:24px; background:url(../images/svg/d_viewer.svg) no-repeat center; display:inline-block; margin-right:12px; }



.f_separ { /* Function Btn Separate */
    width: 1px;
    height: 24px;
    background-color: #cacaca;
    margin: 0 20px 0 8px;
    display: inline-block;
}

.doc_object01{ display:block; height:24px; background:url(../images/doc_object01.png) no-repeat center; }
.doc_object02{ display:block; height:36px; background:url(../images/grid_doc02.png) no-repeat center; }
.doc_object03{ display:block; height:24px; background:url(../images/doc_object03.png) no-repeat center; }

.apply_btn{
    height:32px;
    padding:2px 8px 2px 28px;
    box-sizing: border-box;
    border:1px solid #293f4b;
    border-radius: 5px;
    color:#293f4b; font-size:15px;
    background:url(../images/apply.png) no-repeat 8px center;
}
.addBtn{
    /* width: 64px;
    height: 26px;
    border-radius: 13px;
    padding: 2px 8px 5px 2px;
    box-sizing: border-box;
    background: url(../images/g_next02.png) no-repeat 48px center;
    background-color: #6d869c;
    border: 0;
    color: #fff;
    font-size: 14px; */
    width: 26px;
    height: 26px;
    border: 1px solid #d2d2d2;
    border-radius: 15px;
    background: url(../images/g_next03.png) no-repeat center;
    vertical-align: middle;
    margin-left: 10px;
}
.delBtn{
    width:16px; height:16px;
    box-sizing: border-box; border:0;
    background:url(../images/del03.png) no-repeat center;
    vertical-align: middle;
}
.done_icon{
    /*width:40px; border:0;
    background:url(../images/done.svg) no-repeat center;
    vertical-align: middle;*/
    border:none;
    background-color:#daf0ef; color:#00948d;
    vertical-align: middle;
    font-size:15px;
    border-radius:5px;  text-align:center;
    padding:6px 12px;
}


/* END :: Input STYLE :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/







/*- Border Style-------------------------------------------------------------------------------------*/

.border_none_t{ border-top:none !important; }
.border_none_l{ border-left:none !important;; }
.border_none_r{ border-right:none !important;; }
.border_none_b{ border-bottom:none !important;; }




/*- TEXT Align Style -------------------------------------------------------------------------------------*/
.alignCenter{ text-align:center; }
.alignRight{ text-align:right; }
.alignLeft{ text-align:left; }





/* Paging Style -------------------------------------------------------------------------------------*/
.pageNumberArea{ /* 페이징 영역*/
    padding:7px 0;  clear:both;  box-sizing: border-box;
}

.gridBox_pageNumberArea{
    padding: 5px 10px 10px 10px;
    clear: both;
    border: none;
    border-top: 1px solid #d2d2d2;
    box-sizing: border-box;
    white-space: nowrap;
    text-overflow: ellipsis;
    background-color: #fff;
}

.pageNumberViewWrap{ /* 페이징뷰 선택박스 영역 */
    width:25%; float:left; /*padding-top:5px;*/ box-sizing: border-box;
}

.pageNumberView{/* 페이징뷰 선택박스*/
    width:144px;
}

.pageNumber{ /* 페이징 숫자 영역 */
    /*width:50%; float:left; padding-top:8px;*/
    width: 50%;
    float: left;
    padding: 2px;
    height: 33px;
    box-sizing: border-box;
}

/*.pageNumber>ul{ display:inline-block; }*/
.pageNumber>ul>li{
    width:30px; height:30px;
    box-sizing: border-box;
    border-radius: 15px;
    /*color:#6c6c6c;*/
    text-align:center;
    /*padding:10px 0;*/
    /*float:left;*/
    font-size:15px;
    cursor:pointer;
    display:table-cell;
    vertical-align: middle;
}

/*
.pageNumber>ul>li:hover{
  background-color:#d8d8d8;
  color:#555;
  font-weight:600;
}
 */

li.pageOn{ background-color:#d8d8d8; color:#555; font-weight:600; }

li.pagePre01{ background:url(../images/page_pre_01.png) no-repeat center; border-radius: 5px 0 0 5px; }
li.pagePre02{ background:url(../images/page_pre_02.png) no-repeat center; }
li.pageNext01{ background:url(../images/page_next_01.png) no-repeat center; }
li.pageNext02{ background:url(../images/page_next_02.png) no-repeat center; border-radius: 0 5px 5px 0; }



.pageText{
    /*text-align: end;
    vertical-align: baseline;
    display: inline-block;
    width: 25%;
    clear: both;*/
    text-align: end;
    vertical-align: baseline;
    display: inline-block;
    width: 25%;
    clear: both;
    height: 33px;
    box-sizing: border-box;
    padding: 6px 0;
}
.pageText>p{ /*padding-top:12px;*/ font-size:11pt; color:#667191; }




/* SCROLL STYLE -------------------------------------------------------------------------------------*/
body::-webkit-scrollbar, .scrollStyle::-webkit-scrollbar, .objbox::-webkit-scrollbar, .containerTableStyle::-webkit-scrollbar,
.gridBtnArea::-webkit-scrollbar, .gridBtnArea02::-webkit-scrollbar, .errorText::-webkit-scrollbar,
.doc_info_btnArea::-webkit-scrollbar, .treeBtnArea::-webkit-scrollbar, #sidenavArea::-webkit-scrollbar, .detailInfoTab::-webkit-scrollbar, .doc_InfoArea::-webkit-scrollbar,
.item_moveBox::-webkit-scrollbar, .menuList::-webkit-scrollbar, .filterListArea::-webkit-scrollbar, #myFavoritesMiddle::-webkit-scrollbar, #itemDetailDiv::-webkit-scrollbar,
#serviceStatusDiv div::-webkit-scrollbar, .detail_content_wrapper::-webkit-scrollbar, .accordionTabWrap::-webkit-scrollbar, #attrDefListDiv::-webkit-scrollbar, .filterTable::-webkit-scrollbar,
.dhtmlxMenu_dhx_skyblue_SubLevelArea_Polygon::-webkit-scrollbar {/*ScrollBar-Area*/
    width:18px; /*2024.01.15 8px edit*/
    height:8px;
}

body::-webkit-scrollbar-thumb, .scrollStyle::-webkit-scrollbar-thumb, .objbox::-webkit-scrollbar-thumb, .containerTableStyle::-webkit-scrollbar-thumb,
.gridBtnArea::-webkit-scrollbar-thumb, .gridBtnArea02::-webkit-scrollbar-thumb, .errorText::-webkit-scrollbar-thumb,
.doc_info_btnArea::-webkit-scrollbar-thumb, .treeBtnArea::-webkit-scrollbar-thumb, #sidenavArea::-webkit-scrollbar-thumb, .detailInfoTab::-webkit-scrollbar-thumb, .doc_InfoArea::-webkit-scrollbar-thumb,
.item_moveBox::-webkit-scrollbar-thumb, .menuList::-webkit-scrollbar-thumb, .filterListArea::-webkit-scrollbar-thumb, #myFavoritesMiddle::-webkit-scrollbar-thumb, #itemDetailDiv::-webkit-scrollbar-thumb,
#serviceStatusDiv div::-webkit-scrollbar-thumb, .detail_content_wrapper::-webkit-scrollbar-thumb, .accordionTabWrap::-webkit-scrollbar-thumb, #attrDefListDiv::-webkit-scrollbar-thumb, .filterTable::-webkit-scrollbar-thumb,
.dhtmlxMenu_dhx_skyblue_SubLevelArea_Polygon::-webkit-scrollbar-thumb {/*ScrollBar*/
    /*border-radius:2.5px;*/
    border-radius:4px;
    width:5px;
    /*height:5px;*/
    /*margin-top:2px;
    margin-bottom:2px;*/
    background-color:#afafaf;
    background-clip:padding-box;
    border:2px solid transparent;
}

body::-webkit-scrollbar-track, .scrollStyle::-webkit-scrollbar-track, .objbox::-webkit-scrollbar-track, .containerTableStyle::-webkit-scrollbar-track,
.gridBtnArea::-webkit-scrollbar-track, .gridBtnArea02::-webkit-scrollbar-track, .errorText::-webkit-scrollbar-track,
.doc_info_btnArea::-webkit-scrollbar-track, .treeBtnArea::-webkit-scrollbar-track, #sidenavArea::-webkit-scrollbar-track, .detailInfoTab::-webkit-scrollbar-track, .doc_InfoArea::-webkit-scrollbar-track,
.item_moveBox::-webkit-scrollbar-track, .menuList::-webkit-scrollbar-track, .filterListArea::-webkit-scrollbar-track, #myFavoritesMiddle::-webkit-scrollbar-track, #itemDetailDiv::-webkit-scrollbar-track,
#serviceStatusDiv div::-webkit-scrollbar-track, .detail_content_wrapper::-webkit-scrollbar-track, .accordionTabWrap::-webkit-scrollbar-track, #attrDefListDiv::-webkit-scrollbar-track, .filterTable::-webkit-scrollbar-track,
.dhtmlxMenu_dhx_skyblue_SubLevelArea_Polygon::-webkit-scrollbar-track {
    /*border-radius:8px;*/
    /*width:8px;*/
    background-color:rgba(0,0,0,0);
}


/* DIV STYLE -------------------------------------------------------------------------------------*/
.floatRightDiv{
    width:35px;
    float:right;
    padding: 5px 10px;
    background-color: rgba(0,0,0,0);
}

/*- CABINET DETAIL -*/
.popup_detailArea{
    /*width:100%;*/
    border:1px solid #d9d9d9;
}

/*- PASSWORD STYLE -*/
.passwordBox{
    border:1px solid #bec7c6;
    border-radius: 3px;
    padding:3px 10px; /*2021.04.04 8px 10px edit*/
    color:#5d5d5d;
    vertical-align:middle;
    font-size:14px;
    font-family:'Poppins-medium', 'NanumSquare', sans-serif;
}

/* added by gryu (2020.12.26) : textarea readOnly */
.readOnly {
    background-color:#efefef;
}

/* document detail textarea style */
.docDetailTextarea {
    font-family:'Noto Sans KR-Regular';
    border: 1px solid #d8e1ec;
    color:#3e4967;
    font-size:14px;
    width:85%;
}

/* added by gryu (2021.06.24) : inherited select option */
.inheritedOption {
    background-color:#efefef;
}

/* X2 REDESIGN STYLE -------------------------------------------------------------------------------------*/
/* added by mwjeon (2022.04.28) : splitter style */
.toggleBtnWrap {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    text-align: center;
    cursor: pointer;
    position: absolute;
    top: 0px;
    box-sizing: border-box;
}

.toggleBtnWrapVertical {
    flex-direction: column;
    border-right: 3px solid rgb(236, 236, 236);
    margin-top: 40px;
    height: calc(100% - 60px);
}

.popup_content .toggleBtnWrapVertical {
    margin-top: 45px;
    height: calc(100% - 45px);
}

.toggleBtnWrapHorizon {
    border-bottom: 3px solid rgb(236, 236, 236);
}

.toggleBtns {
    display: flex;
    align-items: center;
    background-color: #ececec;
    position: absolute;
}

.toggleBtnWrapVertical > .toggleBtns {
    width: 100%;
    border-radius: 5px 0 0 5px;
    flex-direction: column;
    right: -3px;
    z-index: 2;
}

.toggleBtnWrapHorizon > .toggleBtns {
    height: 100%;
    border-radius: 5px 5px 0 0;
    bottom: -3px;
    z-index: 2;
}

.toggleBtns .toggleBtn + .toggleBtnSepar {
    border: 1px solid #959595;
}

.toggleBtn {
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    border: none;
    cursor: pointer;
    z-index: 3;
}

.toggleBtnWrapVertical button.toggleBtn {
    width: 100%;
    height: 60px;
}

.toggleBtnWrapVertical .toggleBtn + .toggleBtnSepar {
    width: 60%;
}

.toggleBtnWrapHorizon button.toggleBtn {
    width: 60px;
    height: 100%;
}

.toggleBtnWrapHorizon .toggleBtn + .toggleBtnSepar {
    height: 60%;
}

.toggleBtnWrapVertical .collapseBtn {
    background-image: url(../images/arrow_right.png);
}

.toggleBtnWrapVertical .expandBtn {
    background-image: url(../images/arrow_left.png);
}

.toggleBtnWrapHorizon .collapseBtn {
    background-image: url(../images/arrow_down.png);
}

.toggleBtnWrapHorizon .expandBtn {
    background-image: url(../images/arrow_up.png);
}

.toggleBtnWrapVertical .bisectorBtn {
    height: 50px !important;
    background-image: url(../images/half_icon_vertical.png);
}

.toggleBtnWrapHorizon .bisectorBtn {
    width: 50px !important;
    background-image: url(../images/half_icon_horizontal.png);
}

.horizontal_container {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

.vertical_container {
    display: flex;
    flex-direction: row;
    height: 100%;
    overflow: hidden;
}

/* added by mwjeon (2022.04.28) : document detail info tab style */
#docTabContainer, #cadDocTabContainer {
    display: flex;
    flex-direction: column;
    flex: 1;
}

#docTabContainer .detailInfoTab,
#cadDocTabContainer .detailInfoTab {
    display: flex;
    justify-content: flex-start;
    padding: 0;
}

/* added by mwjeon (2022.04.28) : header style */
.h_left_function {
    display: flex;
    justify-content: flex-start;
    height: 100%;
}

.h_setting > a {
    display: block;
    width: 30px;
    height: 30px;
}

.h_srch {
    border: none !important;
    border-radius: 20px !important;
    width: 15vw;
    height: 32px;
    padding: 5px 8px 5px 35px !important;
    color: #333 !important;
    vertical-align: middle !important;
    font-size: 14px;
    background-color: #f2f2f2;
    background-image: url(../images/search_03.png);
    background-repeat: no-repeat;
    background-position: 10px center;
    /* administrator
    margin-right: 30px;*/
}

input[type='search']::-webkit-search-cancel-button {
    -webkit-appearance: none;
    width: 12px;
    height: 12px;
    background: url(../images/close.png) no-repeat center;
}

.adminMenuOn {
    background-color: #57545c;
}

.h_search input[type='search'] {
    background-color: #57545c;
    color: #d2d2d2 !important;
    background-image: url(../images/search_04.png);
}

/* added by mwjeon (2022.04.28) : grid style */
.border_grid:not(.bottom_rounded) + .gridBox_pageNumberArea {
    border: 1px solid #d2d2d2;
    border-top: 0;
    border-radius: 0 0 15px 15px;
}

.border_grid {
    border: 1px solid #d2d2d2 !important;
}

.none_border_grid {
    border: none !important;
}

.top_rounded {
    border-bottom: none;
    border-radius: 15px 15px 0px 0px !important;
}

.bottom_rounded {
    border-top: none;
    border-radius: 0 0 15px 15px !important;
}

.refreshBtn {
    width: 28px;
    height: 28px;
    border: none;
    background: url("../images/toolbar_icon/refresh.png") no-repeat center;
    background-size: 18px;
    border-radius: 5px;
    margin-left: 60px;
}

.refreshBtn:hover {
    border: none;
    background-color: #f2f2f2;
}

/* added by mwjeon (2022.05.02) : left side bar style */
.sideTab_container {
    border-bottom: 1px solid #d2d2d2;
}

.sideTab_container ul {
    display: flex;
    justify-content: center;
    margin: 20px 20px -1px 20px;
}

.sideTab_container ul > li:nth-child(1) {
    margin-right: 3px;
}

.sideTab_container ul > .sideTab {
    background-color: #E3E9EE;
    color: #8EA2AC;
    padding: 11px 27px;
    border-bottom: 1px solid #d2d2d2;
    font-size: 16px;
    font-weight: 400;
    box-sizing: border-box;
    cursor: pointer;
}

.sideTab_container ul > .sideTab_on {
    background-color: #fff;
    color: #293F4B;
    padding: 10px 27px;
    font-size: 16px;
    font-weight: 600;
    border: 1px solid #d2d2d2;
    border-bottom: 1px solid #fff;
    box-sizing: border-box;
    cursor: pointer;
}

/* added by mwjeon (2022.05.10) : common button style */
.pageNumberArea select {
    width: 100%;
    cursor: pointer;
    border: 1px solid #d2d2d2;
    border-radius: 15px;
    padding: 5px 15px;
    font-size: 14px;
    font-weight: 500;
    -webkit-appearance: none;
    background: url(../images/select_arrow02.png) no-repeat 90% 50%;
    background-color: #fff;
    font-family: 'Poppins-medium', 'NanumSquare', sans-serif !important;
    color: #555;
}

.roundedBtn {
    border: 1px solid #d2d2d2;
    padding: 3px 10px;
    border-radius: 15px;
    font-size: 13px;
    font-weight: 600;
    color: #555;
    background-color: #fff;
}

.roundedBtn + .roundedBtn {
    margin-left: 5px;
}

.roundedBtn:hover,
.roundedBtn:focus {
    border: 1px solid #555;
    color: #fff;
    background-color: #555;
    /*
    transition: ease .2s;
    */
}

/* 2024.03.30 (gryu) : roundedBtn 과 같이 씀 */
.gridTbarBtn {
	height: 25px;
    padding: 2px 10px;
    border-radius: 8px;
    font-size: 12px;
}

.searchBtn {
    min-width: 23px;
    width: 23px;
    height: 23px;
    background: url(../images/search.png) no-repeat center;
    /* background-position: center; */
    background-size: 17px;
    cursor: pointer;
    border: none;
    padding: 3px;
    background-color: transparent;
}

/* added by mwjeon (2022.05.10) : right side bar style */
#myInfoWrap {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

#myInfoWrap,
#myInfoWrap div {
    box-sizing: border-box;
    border-collapse: collapse;
}

#myInfoWrap #sideBarTop {
    width: 100%;
    height: 30%;
    position: relative;
    background-color: rgb(85, 85, 85);
}

#myInfoWrap #closeBtnArea {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    height: 15%;
    position: absolute;
    top: 0;
    background-color: transparent;
}

#myInfoWrap #closeBtnArea > img {
    padding: 10px;
    cursor: pointer;
}

#myInfoWrap #profileArea {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    color: #fff;
}

#myInfoWrap #profileArea p:nth-child(3) {
    font-size: 18px;
    font-weight: 400;
}

#myInfoWrap #sideBarMiddle {
    width: 100%;
    height: 65%;
    background-color: #fff;
}

#myInfoWrap #sideBarMiddle table {
    width: 90%;
    font-size: 14px;
    border-collapse: collapse;
    margin: 10px auto;
}

#myInfoWrap #sideBarMiddle th,
#myInfoWrap #sideBarMiddle td {
    height: 35px;
    padding: 5px 10px;
}

#myInfoWrap #sideBarMiddle th {
    text-align: left;
    font-weight: 300;
}

#myInfoWrap .passwordInputCell {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#myInfoWrap #sideBarMiddle .passwordInputArea {
    display: none;
    width: 100%;
    justify-content: center;
    align-items: center;
    position: relative;
}

#myInfoWrap #sideBarMiddle input[type='text'],
#myInfoWrap #sideBarMiddle input[type='password'],
#myInfoWrap #sideBarMiddle select {
    width: 100%;
    height: 35px;
}

input[type='password']::-ms-reveal {
    display: none;
}

#myInfoWrap #sideBarMiddle input#password,
#myInfoWrap #sideBarMiddle input#passwordChk {
    width: 100%;
    padding: 5px 10px;
    padding-right: 30px;
    outline: none;
    border: 1px solid #bec7c6;
    border-radius: 3px;
    font-size: 14px;
}

#myInfoWrap #sideBarMiddle #togglePasswordBtn {
    width: 18px;
    height: 18px;
    border: none;
    position: absolute;
    right: 15px;
    cursor: pointer;
}

#myInfoWrap #sideBarMiddle .showPassword {
    background: url(../images/see.png) no-repeat center;
}

#myInfoWrap #sideBarMiddle .hidePassword {
    background: url(../images/see_none.png) no-repeat center;
}

#myInfoWrap #sideBarMiddle #passwordBtnArea {
    margin-left: 5px;
}

#myInfoWrap #updateBtnArea {
    display: flex;
    justify-content: flex-end;
    padding: 0px 20px;
}

#myInfoWrap #updateBtnArea button{
    margin-left: 5px;
}

#myInfoWrap #sideBarBottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 5%;
    border-top: 1px solid rgb(230, 230, 230);
    background-color: #fff;
}

#myInfoWrap #sideBarBottom > span {
    padding: 10px;
    padding-left: 20px;
    cursor: pointer;
    font-size: 14px;
    color: rgb(76, 76, 76);
}

/* added by mwjeon (2022.05.23) : utilities style */
#utilitiesWrap,
#utilitiesWrap > div:not(#systemRightSideBarWrap) {
    width: 100%;
    box-sizing: border-box;
}

#utilitiesTop {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 60px 0px 60px;
    color: #333;
    margin-bottom: 10px;
}

#utilitiesBreadcrumb,
#utilitiesBreadcrumb * {
    font-size: 17px;
    font-weight: 600;
    text-decoration: none;
    color: #333;
}

#utilitiesBreadcrumb > span {
    cursor: default;
}

#utilitiesBreadcrumb > a {
    border-bottom: 2px solid transparent;
    color: #0073ff;
}

#utilitiesTopRight {
    display: flex;
    align-items: center;
}

#utilitiesTopRight #searchSiteBtn {
    width: 35px;
    height: 35px;
    background: url(../images/sitemenu_btn.png) no-repeat center;
    border: none;
    cursor: pointer;
    margin-left: 5px;
    border-radius: 5px;
}

#utilitiesTopRight #searchSiteBtn:focus,
#utilitiesTopRight #searchSiteBtn:hover {
    background-color: #efefef;
}

#utilitiesContent {
    margin-top: 20px;
    padding: 0px 60px;
}

#utilitiesContent .contentBoxWrap {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

#utilitiesContent .contentBox {
    display: inline-block;
    /* width: 15%; */
    width: 17%;
    max-width: 250px;
    min-width: 150px;
    height: 400px;
    border: 1px solid #d2d2d2;
    border-radius: 15px;
    padding: 20px 30px;
    box-shadow: 0px 3px 10px rgb(0 0 0 / 10%);
    margin-right: 1%;
    margin-bottom: 1%;
}

#utilitiesContent .menuCategory {
    width: 100%;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 10px;
    cursor: default;
}

#utilitiesContent .menuList {
    max-height: 90%;
    overflow-y: auto;
}

#utilitiesContent .menuListItem {
    font-size: 14px;
    margin-bottom: 5px;
    padding: 2px 15px;
    border-radius: 5px;
}

#utilitiesContent .menuListItem:focus,
#utilitiesContent .menuListItem:hover {
    background-color: #efefef;
}

#utilitiesContent .menuListItem > a {
    display: list-item;
    list-style: disc;
    list-style-position: inside;
    text-decoration: none;
    color: #333;
    text-indent: -22px;
    padding-left: 15px;
}


#downloadSoftwareContent {
	margin-top: 0px;
	padding: 0px;
}

#downloadSoftwareContent .contentBoxWrap {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

#downloadSoftwareContent .contentBox {
    display: inline-block;
    width: 100%;
    max-width: 100%;
    min-width: 150px;
    height: 350px;
    border: 1px solid #d2d2d2;
    border-radius: 15px;
    padding: 20px 30px;
    box-shadow: 0px 3px 10px rgb(0 0 0 / 10%);
    margin-right: 0%;
    margin-bottom: 0%;
}

#downloadSoftwareContent .menuCategory {
    width: 100%;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 10px;
    cursor: default;
}

#downloadSoftwareContent .menuList {
    max-height: 90%;
    overflow-y: auto;
}

#downloadSoftwareContent .menuListItem {
    font-size: 14px;
    margin-bottom: 5px;
    padding: 2px 15px;
    border-radius: 5px;
}

#downloadSoftwareContent .menuListItem:focus,
#downloadSoftwareContent .menuListItem:hover {
    background-color: #efefef;
}

#downloadSoftwareContent .menuListItem > a {
    display: list-item;
    list-style: disc;
    list-style-position: inside;
    text-decoration: none;
    color: #333;
    text-indent: -22px;
    padding-left: 15px;
}




#selectSitesWrap {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

#selectSitesWrap > div {
    width: 100%;
    box-sizing: border-box;
}

#selectSitesTop {
    display: flex;
    padding: 10px 15px;
    justify-content: space-between;
}

#selectSitesTop span {
    font-size: 18px;
    font-weight: 600;
}

#systemUtilitesBtnArea,
#closeSideBarBtnArea {
    cursor: pointer;
    z-index: 2;
}

#selectSitesMiddle {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 20px;
}

#searchSiteArea .siteSearchInput {
    border-radius: 20px !important;
    width: 100% !important;
    height: 32px;
    padding: 8px 15px 8px 35px !important;
    vertical-align: middle !important;
    font-size: 14px;
    background-image: url(../images/search_03.png);
    background-repeat: no-repeat;
    background-position: center left 15px;
}

/* added by mwjeon (2022.06.17) : popup toolbar style */
#toolbarMenuArea div {
    display: flex;
    justify-content: center;
    align-items: center;
}

#toolbarMenuArea,
#toolbarMenuArea * {
    margin: 0;
    padding: 0;
}

#toolbarMenuArea {
    width: auto;
    height: auto;
    padding: 3px;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    cursor: pointer;
}

#toolbarMenuArea:hover,
#toolbarMenuArea:focus {
    background-color: #f2f2f2;
}

/* added by mwjeon (2022.07.07) : search filter style */
.searchFilterWrap {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 20px;
    align-items: center;
}

#filterTitleArea .subTitle {
    font-size: 17px;
}

.filterArea {
    position: relative;
}

.filterArea .filterBtn {
    width: 23px;
    height: 23px;
    background: url(../images/search.png) no-repeat;
    background-position: center;
    cursor: pointer;
    margin: 0 5px;
    padding: 3px;
    background-size: 60%;
}

.filterArea .filterBtn:hover {
    background-color: #f2f2f2;
    border-radius: 5px;
}

.filterArea .filterTableWrap {
    display: none;
    flex-direction: column;
    position: absolute;
    width: 590px;
    z-index: 4;
    padding: 20px 30px 0px 30px;
    box-sizing: border-box;
    border: 1px solid #d2d2d2;
    border-radius: 10px;
    box-shadow: 0px 3px 10px rgb(0 0 0 / 10%);
    background-color: white;
    margin-top: 5px;
    margin-left: 5px;
    max-height: 500px;
    /*
    transform: scale(0);
    transform-origin: left;
    transition: .3s ease-out;
    */
}

.filterArea .filterTableWrap .filterResizer {
    position: absolute;
    box-sizing: border-box;
    background: transparent;
    z-index: 5;
}

.filterArea .filterTableWrap .filterResizer.filterWidthResizer {
    width: 20px;
    height: 95%;
    top: 0;
    right: -10px;
    cursor: e-resize;
}

.filterArea .filterTableWrap .filterResizer.filterHeightResizer {
    width: 95%;
    height: 20px;
    left: 0;
    bottom: -10px;
    cursor: n-resize;
}

.filterArea .filterTableWrap .filterResizer.filterWidthHeightResizer1 {
    width: 20px;
    height: calc(5% + 10px);
    right: -10px;
    bottom: -10px;
    cursor: nw-resize;
}

.filterArea .filterTableWrap .filterResizer.filterWidthHeightResizer2 {
    width: calc(5% + 10px);
    height: 20px;
    right: -10px;
    bottom: -10px;
    cursor: nw-resize;
}

.filterArea .filterTableWrap .ghostSearchFilterWrap {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 10px;
    background-color: rgba(0, 0, 0, 0.1);
}

.filterArea .filterTableWrap .filterTable {
    overflow-x: hidden;
    overflow-y: auto;
}

.filterArea .filterTableWrap .filterTable input[type=number]::-webkit-outer-spin-button,
.filterArea .filterTableWrap .filterTable input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.filterArea .filterTableWrap .filterTable input[type=number] {
    -moz-appearance: textfield;
}

.filterArea .filterTable .attrDefCondtionWrap > li:last-child {
    margin-bottom: 0px;
}

.filterArea .filterTable .conditionList {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}

.filterTable .conditionList label {
    min-width: 100px;
    font-size: 14px;
}

.filterTable .conditionList .attrConditionWrap {
    display: flex;
    flex-direction: column;
    flex: 1;
    margin-left: 5px;
    align-items: stretch;
    justify-content: space-between;
}

.filterTable .conditionList .attrConditionWrap > .attrConditionRow,
.filterTable .conditionList .attrConditionWrap > .attrConditionRow div {
    display: flex;
}

.filterTable .conditionList .attrConditionWrap > .attrConditionRow {
    overflow: hidden;
    position: relative;
}

.filterTable .conditionList .attrConditionWrap > .attrConditionRow:not(:nth-of-type(1)) {
    margin-top: 5px;
}

.filterTable .conditionList .attrConditionWrap div.attrConditionColumn:nth-of-type(1) {
    flex: 1;
}

.filterTable .conditionList .attrConditionWrap div.attrConditionColumn.attrConditionBtnArea {
    background-color: #f2f2f2;
    margin-left: 5px;
    border-radius: 5px;
}

.filterTable .conditionList .attrConditionWrap div.attrConditionColumn > .conditionRowBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    cursor: pointer;
    background-color: transparent;
    border: none;
    border-radius: 0 5px 5px 0;
    font-size: 18px;
    color: #777;
    border-left: 1px solid #d2d2d2;
}

.filterTable .conditionList .attrConditionWrap div.attrConditionColumn > .operatorSelector {
    width: 85px;
    margin: auto 0;
    font-size: 12px;
    border: none;
    background-color: transparent;
    background-position-x: 95%;
    border-radius: 5px;
    padding: 0px 15px 0 5px;
}

.filterTable .conditionList .attrConditionWrap div.attrConditionColumn > .operatorSelector.logicalOperator {
    width: 55px;
    border-left: 1px solid #d2d2d2;
}

.filterTable .conditionList .attrConditionWrap div.attrConditionColumn > .operatorSelector:hover,
.filterTable .conditionList .attrConditionWrap div.attrConditionColumn > .conditionRowBtn:hover {
    background-color: #d2d2d2;
}

.filterTable .conditionList .attrConditionWrap div.attrConditionColumn > .operatorSelector > option {
    background-color: white !important;
}

.filterTable .conditionList .attrConditionWrap div.attrConditionColumn > .addConditionRowBtn:after {
    content: '+';
}

.filterTable .conditionList .attrConditionWrap div.attrConditionColumn > .removeConditionRowBtn:after {
    content: '-';
}


.conditionList input:not([type=checkbox]), .conditionList select, .conditionList span, .conditionList span div.dhxcombo_dhx_skyblue {
    width: 100%;
    border-radius: 5px;
}

.conditionList #userFieldWrap {
    display: flex;
}

.searchFilter_btn_area {
    display: flex;
    justify-content: space-between;
    position: sticky;
    bottom: 0;
    background: white;
    align-items: center;
    padding: 10px 0 15px 0;
}

.filterListArea {
    white-space: nowrap;
    max-width: 80%;
    overflow-x: auto;
}

.filterListArea ul {
    display: flex;
}

.filterListArea .filterBubble,
.participantBubble {
    display: flex;
    margin-right: 5px;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    background-color: #f2f2f2;
    border-radius: 5px;
    padding: 4px 10px;
    font-size: 15px;
    transform: scale(0);
    transition: .3s ease-in;
}

/* 프로세스 참여자 선택용 스타일 */
.participantBubble {
    font-size: 13px;
}

.filterBubble img,
.participantBubble img {
    width: 14px;
    height: 14px;
    padding: 3px;
    cursor: pointer;
    margin-left: 3px;
}

.filterBubble img:hover,
.participantBubble img:hover {
    background-color: #e2e2e2;
    border-radius: 3px;
}

.filterBubble .filterKeyword {
    max-width: 300px;
    text-overflow: ellipsis;
    overflow: hidden;
    font-weight: 600;
    white-space: nowrap;
}

/* added by mwjeon (2022.07.12) : date field style. */
/* modified by gryu (2023.05.17) : # 을 . 으로 교체. */
.dateRangeFieldsWrap {
    display: flex;
}

.dateRangeFieldsWrap span {
    margin: 0 10px;
}

.dateFieldWrap {
    display: flex;
    align-items: center;
    position: relative;
}

.dateFieldWrap input {
    margin-right: 5px;
    border-radius: 5px;
}

.dateFieldWrap .imgButton {
    padding: 4px;
    cursor: pointer;
}

.dateFieldWrap .selectDateButton:hover {
    background-color: #f2f2f2;
    border-radius: 5px;
}

.dateFieldWrap .clearDateButton {
    display: none;
    position: absolute;
    right: 32px;
    top: 2px;
}


/* workflow - designer popup style - start */
.wf_popup_header{
    width:100%;
    background-color:#fff;
    color:#333;
    font-size:18px;
    font-weight:600;
    box-sizing:border-box;
    padding-top: 20px;
    padding-left: 25px;
    padding-bottom: 10px;
}
.wf_popup_content{
    padding: 10px 20px 5px 20px;
    box-sizing: border-box;
}
.wf_process_title{
    float: left;
    margin-right: 7px;
    margin-top: 2px;
}
.wf_properties_div{
    float: left;
    width: 29%;
    height:85vh;
    border: 1px solid #d8dfe9;
    border-left: none;
    overflow: scroll;
}
.wf_properties_content{
    padding:16px;
}
.wf_gridDiv{
    display: flex;
    flex-direction: column;
    height:240px;
}
/* workflow - designer popup style - end */

/* added by mwjeon (2022.08.03) : common side bar style */
.sidebarWrap {
    display: none;
    flex-direction: column;
    position: absolute;
    z-index: 99;
    transition: ease .8s;
    box-shadow: 0px 3px 10px rgb(0,0,0,0.1);
    background: #fff;
    bottom: 0;
}

.ghostSidebarWrap {
    position: absolute;
    z-index: 1001;
    background-color: rgba(0, 0, 0, 0.1);
    bottom: 0;
    margin: auto;
    border-radius: 10px;
    box-sizing: border-box;
}

.leftSidebar {
    left: 0;
}

.rightSidebar {
    right: 0;
}

.sidebarTop {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 30px;
    background-color: transparent;
    position: absolute;
    box-sizing: border-box;
    padding: 10px 10px 0 0;
}

.sidebarTop .sidebarCloseBtn {
    width: 26px;
    height: 26px;
    cursor: pointer;
    box-sizing: border-box;
    border-radius: 5px;
    z-index: 1000;
}

.sidebarTop .lightSidebarCloseBtn {
    background: url(../images/close03.png) no-repeat center;
}

.sidebarTop .lightSidebarCloseBtn:hover {
    background-color: #f2f2f2;
}

.sidebarTop .darkSidebarCloseBtn {
    background: url(../images/close.png) no-repeat center;
}

.sidebarTop .darkSidebarCloseBtn:hover {
    background-color: #444;
}

.sidebarContent {
    display: flex;
    height: 100%;
    transition: ease .2s;
}

.sidebarResizer {
    position: absolute;
    width: 20px;
    height: 100%;
    opacity: 0;
    cursor: w-resize;
    background-color: black;
    transition: .2s ease-out;
}

/* added by mwjeon (2022.08.03) : my favorite side bar style */
#myFavoritesWrap {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

#myFavoritesTop {
    display: flex;
    padding: 20px 20px 0 30px;
}

#myFavoritesTop .myFavoritesTitle h2 {
    font-size: 18px;
    font-weight: 600;
}

#myFavoritesMiddle {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow-y: auto;
    padding: 40px 30px 30px 30px;
}

.globalFavoriteTabBtns {
    display: flex;
    justify-content: flex-end;
    padding: 5px;
    padding-top: 0px;
}

.favoriteTab {
    display: flex;
    flex-direction: column;
    padding: 10px 0;
    border-top: 1px solid #d2d2d2;
    box-sizing: border-box;

}
.favoriteTab:last-child {
    border-bottom: 1px solid #d2d2d2;
}

.favoriteTabTitle {
    display: flex;
    justify-content: space-between;
    height: 25px;
    font-weight: 600;
    padding-right: 5px;
}

.favoriteTabTitle h3 {
    display: flex;
    align-items: center;
}

.favoriteTabTitle span {
    padding: 2px 8px;
    margin: 0 10px;
    border-radius: 5px;
    background-color: #efefef;
    font-size: 13px;
    line-height: 20px;
}

.expandFavoriteTabBtn, .openFavoriteTabBtn {
    width: 25px;
    height: 25px;
    background: url(../images/arrow01_menu.png) no-repeat center;
    cursor: pointer;
    border-radius: 5px;
}

.expandFavoriteTabBtn {
    margin-right: 5px;
}

.collapseFavoriteTabBtn, .closeFavoriteTabBtn {
    width: 25px;
    height: 25px;
    background: url(../images/arrow02_menu.png) no-repeat center;
    cursor: pointer;
    border-radius: 5px;
}

.openFavoriteTabBtn:hover, .closeFavoriteTabBtn:hover,
.expandFavoriteTabBtn:hover, .collapseFavoriteTabBtn:hover {
    background-color: #f2f2f2;
}

.favoriteTab ul {
    display: none;
}

.favoriteItem {
    display: flex;
    justify-content: space-between;
    padding: 5px;
    height: 25px;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 5px;
    padding-left: 10px;
}

.favoriteItem:hover {
    background-color: #efefef;
}

.favoriteItem span {
    max-width: 250px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.favoriteItem .deleteFavoriteBtn {
    display: none;
    width: 25px;
    background: url(../images/favclose.png) no-repeat center;
    border: none;
    padding: 0;
    cursor: pointer;
}
/* shortcutDetail */
#itemDetail_shortcutDiv{
    height: 280px;
}
#itemDetail_shortcutDiv > p{
    padding: 0 20px;
    font-size: 16px;
}
.shortcutDetail{
    width: 100%;
    overflow: hidden;
}
.shortcutDetail h3{
    float: left;
}
.shortcutDetail img{
    float: left;
    padding: 24px 0;
}
.doc_info_name_shortcut{
    font-size: 20px;
    font-weight: 600;
    padding: 20px 10px 10px 20px;
}

.localizationBtnWrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}

#localizedMsgFieldWrap, #localizedLogoFieldWrap {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 100%;
}

.localizationBtn {
    background: url(../images/global.png) no-repeat center;
    background-size: contain;
    width: 25px;
    height: 25px;
    vertical-align: middle;
    cursor: pointer;
    border: none;
}

#displayMessage + .localizationBtn {
    margin-left: 5px;
}

.localizationBtn:hover {
    border-radius: 5px;
    background-color: #f2f2f2;
}

.selectMenuImageDiv {
    display: flex;
    width: 100%;
    height: 100%;
    background: url(../images/selectMenu_icon.png) no-repeat center;
    justify-content: center;
    align-items: center;
    padding-top: 20%;
    font-size: 25px;
    color: #424d5a;
}

#localizedLogoFieldWrap {
}

.logoImageWrap {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #313036;
    border-radius: 5px;
    margin-right: 5px;
    min-width: 300px;
    max-width: 100%;
    height: 60px;
    box-sizing: border-box;
    padding: 10px;
}

/* about page popup style - start */
#aboutWrap {
    width: 1080px;
    height: 840px;
    font-family: 'Poppins';
    font-size: 14px;
    border-radius: 15px;
    box-shadow: 0px 3px 10px rgb(0 0 0 / 10%);
    position: relative;
    overflow-x: hidden;
    margin: auto;
}

#aboutWrap::-webkit-scrollbar, #aboutWrap *::-webkit-scrollbar {
    width: 4px; /*스크롤바의 너비*/
}

#aboutWrap::-webkit-scrollbar-thumb, #aboutWrap *::-webkit-scrollbar-thumb {
    background-color: #b2b2b2; /*스크롤바의 색상*/
}

#aboutWrap::-webkit-scrollbar-track, #aboutWrap *::-webkit-scrollbar-track {
    background-color: #e8e8e8; /*스크롤바 트랙 색상*/
}

#aboutWrap .bn{
    width: 1080px;
    height: 360px;
    background: url(../images/about_bg.png);
    background-repeat: no-repeat;
    border-radius: 15px 15px 0 0;
}

#aboutWrap .bn_title{
    width: 29%;
    display: flex;
    height: 70px;
    margin: 0 auto;
    padding-top: 5%;
}

#aboutWrap .bn_title > img{
    width: 216px;
    height: 68px;
    float: left;
    margin: 0 auto;
    margin-right: 20px;
}

#aboutWrap .bn_title > h1{
    font-size: 44px;
    font-weight: 600;
    color: #086771;
}

#aboutWrap section{
    padding: 20px;
    color: #333;
    height: 50%;
}

#aboutWrap .cr_textWrap{
    color: #555;
    border: 1px solid #d2d2d2;
    border-radius: 15px;
    padding: 20px;
    padding-right: 0;
    height: 76%;
}

#aboutWrap .cr_text{
    padding-right: 20px;
    overflow-y: scroll;
    height: 100%;
}

#aboutWrap .cr_text > h3{
    font-size: 22px;
    margin-bottom: 30px;
    font-weight: bold;
}

#aboutWrap .tb_title{
    padding: 0 20px;
}

#aboutWrap .tb_title > h3{
    font-size: 18px;
    margin-top: 40px;
    font-weight: bold;
}

#aboutWrap .cr_text table{
    margin-top: 20px;
    border: 1px solid #d2d2d2;
    width: 100%;
    text-align: left;
    border-spacing: 0;
    border-collapse: collapse;
}

#aboutWrap .cr_text table th {
    font-weight: bold;
}

#aboutWrap .cr_text table .item,
#aboutWrap .cr_text table .data{
    padding: 4px 10px;
    border-right: 1px solid #d2d2d2;
    border-bottom: 1px solid #d2d2d2;
}

#aboutWrap .cr_text table .item.right{
    width: 90px;
}

#aboutWrap .adress{margin-top: 40px;}

#aboutWrap footer{
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    position: absolute;
    bottom: 0;
}

#aboutWrap .ft_text{
    width: 50%;
    height: 40px;
    float: left;
    box-sizing: border-box;
}

#aboutWrap .ft_text > span{
    font-weight: 600;
    color: #086771;
}

#aboutWrap .ft_text > p{
    color: #555;
    font-size: 12px;
}

#aboutWrap .ft_btn{
    width: 50%;
    height: 40px;
    float: right;
}

#aboutWrap .ft_btn > input[type="button"]{
    border: 1px solid #d2d2d2;
    text-align: center;
    padding: 3px 10px;
    border-radius: 15px;
    background-color: #fff;
    font-weight: 600;
    font-size: 13px;
    color: #555;
    cursor: pointer;
    box-sizing: border-box;
    float: right;
    margin-top: 10px;
}

#aboutWrap .ft_btn > input[type="button"]:hover{
    background-color: #555;
    color: #fff;
    border: 1px solid #555;
}

/* confirm process, submit ticket popup style - start */
/* TODO: 추후 모든 팝업에 적용할 공통 스타일로 전환 */

#confirmProcessContent.popup_content .popup_detailArea/*,
#submitTicketWrap.popup_content .popup_detailArea*/ {
    border: none;
}

#confirmProcessContent.popup_content .popup_detailArea .detailInfoTab/*,
#submitTicketWrap.popup_content .popup_detailArea .detailInfoTab*/ {
    padding-left: 0;
}

#confirmProcessContent.popup_content .searchTable/*,
#submitTicketWrap.popup_content .searchTable */{
    border-collapse: separate;
    border-spacing: 10px;
}

#confirmProcessContent.popup_content .searchTable .itemCell/*,
#submitTicketWrap.popup_content .searchTable .itemCell */{
    text-align: left;
    padding-left: 10px;
    background: none;
    border: none;
}

#confirmProcessContent.popup_content .searchTable .dataCell + .itemCell/*,
#submitTicketWrap.popup_content .searchTable .dataCell + .itemCell */{
    border-left: 2px solid #d2d2d2;
}

#confirmProcessContent.popup_content .searchTable tr:nth-last-child(1) .itemCell,
/*#submitTicketWrap.popup_content .searchTable tr:nth-last-child(1) .itemCell,*/
#confirmProcessContent.popup_content .searchTable tr:nth-last-child(2) .itemCell/*,
#submitTicketWrap.popup_content .searchTable tr:nth-last-child(2) .itemCell*/ {
    vertical-align: top;
}

#confirmProcessContent.popup_content .searchTable .dataCell/*,
#submitTicketWrap.popup_content .searchTable .dataCell*/ {
    border: none;
}

#submitTicketWrap.popup_content #contentTabContainer + p {
    margin-top: 5px;
    font-size: 13px;
}

#submitTicketWrap.popup_content .bottom_btn_area,
#saveBizItemWrap.popup_content .bottom_btn_area {
    display: flex;
    justify-content: space-between;
}

#submitTicketWrap.popup_content .bottom_btn_area {
    padding: 15px 0 10px 0;
}

#submitTicketWrap.popup_content .bottom_btn_area .bottom_btn_area_left,
#saveBizItemWrap.popup_content .bottom_btn_area .bottom_btn_area_left {
    padding-left: 10px;
    font-size: 13px;
}

/* added by mwjeon (2023.03.20) : rich text editor style */
#submitTicketWrap.popup_content .ql-toolbar.ql-snow {
    border: 1px solid #d2d2d2;
    border-radius: 5px 5px 0 0;
}

#submitTicketWrap.popup_content .ql-container.ql-snow {
    border: 1px solid #d2d2d2;
    border-top: none;
    border-radius: 0 0 5px 5px;
}

#submitTicketWrap.popup_content .ql-snow.ql-toolbar:after,
#submitTicketWrap.popup_content .ql-snow .ql-formats:after {
    display: none;
}

/* added by mwjeon (2023.03.03) : service status page style */
#serviceStatusDiv {
    height: 100%;
    overflow: hidden;
    display: flex;
    justify-content: space-evenly;
}

#serviceStatusDiv > div.service_status_panel {
    padding: 20px;
    overflow-x: hidden;
    overflow-y: auto;
    border: 1px solid #d2d2d2;
    border-radius: 15px;
    flex: 1;
}

#serviceStatusDiv > div:nth-child(2) {
    margin: 0 10px;
}

#serviceStatusDiv .wrap_sub_top {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #d2d2d2;
}

#serviceStatusDiv .wrap_sub.manager .wrap_sub_top {
    margin-bottom: 15px;
}

#serviceStatusDiv .wrap_sub h3 {
    font-size: 17px;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
}

#serviceStatusDiv .wrap_sub {
    margin-bottom: 20px;
}

#serviceStatusDiv .profile_wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

#serviceStatusDiv .profile {
    padding: 14px 20px;
    border: 1px solid #d2d2d2;
    border-radius: 10px;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: .5s ease-out;
    box-sizing: border-box;
    margin-left: 10px;
    flex: 1;
}
#serviceStatusDiv .profile:hover {
    background-color: #f2f2f2;
}
#serviceStatusDiv .profile > img {
    float: left;
    margin-right: 10px;
}

#serviceStatusDiv #termTable{
    text-align: left;
    margin-left: 20px;
}
#serviceStatusDiv #termTable th{
    width: 120px;
    padding: 2px;
}
#serviceStatusDiv #termTable td{
    width: 200px;
    padding: 2px;
}
#serviceStatusDiv .wrap_status {
    display: flex;
}
#serviceStatusDiv .wrap_status span {
    color: #444;
}
#serviceStatusDiv .wrap_per_bar {
    display: flex;
    flex-direction: column;
    margin-top: 6px;
    margin-right: 5px;
}
#serviceStatusDiv .wrap_per_bar > div {
    margin-left: 20px;
    margin-right: 6px;
    display: flex;
}
#serviceStatusDiv .per_bar{
    background-color: #f2f2f2;
    width: 230px;
    height: 10px;
    border-radius: 20px;
    float: left;
    position: relative;
}
#serviceStatusDiv .per_bar > span{
    display: block;
    width: 0%;
    height: 10px;
    background-color: #0073ff;
    border-radius: 20px;
    transition: 1s ease-out;
}

#serviceStatusDiv .status_detail {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-left: 20px;
    margin-top: 3px;
}
#serviceStatusDiv .status_detail_left {
    font-size: 14px;
}
#serviceStatusDiv .status_detail_left span.currentSize {
    color: #0073ff;
}

#serviceStatusDiv .status_detail_right > span {
    font-size: 13px;
    color: #a2a2a2;
}

/* added by mwjeon (2023.05.18) : linked item accordion tab style */
.linkedItemTableWrap {
    display: flex;
    flex-direction: column;
    padding: 0 10px;
}

table.searchTable + div#attrValuesDiv > table,
table.searchTable + div#attrValuesDiv > table > tbody > tr:first-child > th,
table.searchTable + div#attrValuesDiv > table > tbody > tr:first-child > td,
div#attrValuesDiv + table.searchTable,
div#attrValuesDiv + table.searchTable > tbody > tr:first-child > th,
div#attrValuesDiv + table.searchTable > tbody > tr:first-child > td {
    border-top: none;
}

div.selectFolderDiv {
    width: 100%;
    display: flex;
}

div.selectFolderDiv > input[type=button] {
    margin-left: 5px;
}

/* added by mwjeon (2023.09.11) : debug tooltip box style */

div#debugTooltipBoxWrap {
    display: none;
    position: absolute;
    background-color: #f2f2f2;
    padding: 5px;
    border: 1px solid #d2d2d2;
    border-radius: 5px;
    font-size: 13px;
    z-index: 100000;
}

div#debugTooltipBoxWrap > div {
}

div#debugTooltipBoxWrap .guideTextArea {
    border-top: 1px solid #b2b2b2;
    margin-top: 5px;
    padding-top: 2px;
}

div#debugTooltipBoxWrap p.guideText {
    display: none;
}

div#debugTooltipBoxWrap p.guideText.on {
    display: block;
}

/* added by mwjeon (2023.09.14) : related objects tab style */

div.relatedObjetsMenuGroupDiv {
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    cursor: pointer;
    margin-right: 5px;
    padding: 0;
}

div.relatedObjetsMenuGroupDiv:hover span {
    color: #fff !important;
}

/* 2024.01.04 (mwjeon) : added. button for picker style */

.openPickerBtn {
    margin: 0 5px;
    background: url(../images/search.png) no-repeat;
    width: 17px;
    height: 17px;
    border: none;
    background-color: transparent;
    background-size: contain;
}

/* 2024.01.21 (gryu) : for multi-line form label td */
.formFieldLabelTd {
	padding-top: 6px;
	vertical-align: top !important;
}

.detailFieldLabelTd {
	padding-top: 6px;
	vertical-align: top !important;
}

/* 2024.02.26 (mwjeon) : added. for IxGrid Counting Text */
.countingText {
    font-size: 13px;
}

/* 2024.03.19 (gryu) */
.enabledDisplay {
	color : #3B7D23
}
.disabledDisplay {
	color : #C00000
}