@charset "utf-8";
@import url("/css/mes/comm/common.css");/** 공통 스타일 포함 **/

/* login
--------------------------------------------------------------------------------------------------------- */
.login-wrap {
  position:relative;
  display:table;
  width:100%; height:100%;
  background:#ebf0f3;
}
.login-wrap:before {
  content:'';
  position:absolute; bottom:0; left:0;
  width:100%; height:150px;
  background:url('/images/mes/comm/login/login_bg.png') no-repeat center center;
  background-size:100% 100%;
}
.login-wrap:after {
  content:'';
  position:absolute; bottom:22px; left:50%;
  margin-left:-121px;
  width:242px; height:30px;
  background:url('/images/mes/comm/login/g2works_logo_w.png') no-repeat center center;
  background-size:auto 100%;
  display:none;
}
.login-wrap > form {
  display:table-cell;
  vertical-align:middle;
}
#loginWrap {
}
#loginWrap .contents {
  overflow:hidden;
  margin:0 auto 30px; padding:65px 85px;
  width:720px;
  border-radius:0 0 3px 3px;
  border-top:5px solid #0871b9;
  box-sizing:border-box;
  background:#fff;
  box-shadow:0 0 5px rgba(0,0,0,.1);
  text-align:center;
}
#loginWrap .logo {
  margin-bottom:70px;
}
#loginWrap .logo img {
	/*max-width:303px;*/
	max-height:120px;
}
.login-type-select {
    margin: 0 auto 10px;
    width: 100%;
    border-top: 1px solid #dfe8f3;
    background: #f6f8f9;
    font-size: 0;
    text-align: center;
}
#loginWrap .login-type-select {
    margin: -20px auto 10px;
    width: 80%;
}
.login-type-select li {
    display: inline-block;
    margin: 0 10px;
    width: 60px;
    vertical-align: top;
}
.login-type-select input[type="radio"] {
  display:none;
}
input[type="radio"] {
    background-color: initial;
    cursor: default;
    appearance: auto;
    box-sizing: border-box;
    margin: 3px 3px 0px 5px;
    padding: initial;
    border: initial;
}
.login-type-select label {
  position:relative;
  display:block;
  font-weight:bold;
  font-size:12px; line-height:39px;
  color:#666;
  cursor:pointer;
}
.login-type-select input[type="radio"]:checked + label {
  color:#0871b9;
  cursor:pointer;
}
.login-type-select input[type="radio"]:checked + label:before {
  content:'';
  position:absolute; bottom:0; left:0;
  width:100%; height:3px;
  background:#0871b9;
}
#loginWrap .login-box {
  position:relative;
  margin:0 auto;
  width:80%;
  box-sizing:border-box;
}
#loginWrap .login-box ul li {
  position:relative;
  margin-bottom:10px;
}
#loginWrap .login-box ul li:nth-child(1):before {
  content:'';
  position:absolute; top:50%; left:20px;
  z-index:888;
  margin-top:-7px;
  width:14px; height:14px;
  background:url('/images/mes/comm/login/icon_id.png') no-repeat 0 0;
}
#loginWrap .login-box ul li:nth-child(2):before {
  content:'';
  position:absolute; top:50%; left:20px;
  z-index:888;
  margin-top:-7.5px;
  width:14px; height:15px;
  background:url('/images/mes/comm/login/icon_pw.png') no-repeat 0 0;
}
#loginWrap .login-box ul li input[type="text"],
#loginWrap .login-box ul li input[type="password"] {
	padding:0 10px 0 46px;
  width:100%; height:50px;
  border:1px solid #d3d9db;
  border-radius:3px;
  font-size:12px;
  color:#555;
}
#loginWrap .login-box .id-save {
	margin:10px 0 12px;
	text-align:left;
}
#loginWrap .login-box .id-save input {
	display:none;
}
#loginWrap .login-box .id-save label {
	position:relative;
	display:block;
	padding-left:20px;
	font-size:12px; line-height:14px;
	color:#888;
	cursor:pointer;
}
#loginWrap .login-box .id-save label:before {
  content:'\f00c';
  position:absolute; top:1px; left:0;
  display:inline-block;
  width:14px; height:14px;
  border:1px solid #ccc;
  box-sizing:border-box;
  border-radius:50%;
  font-size:10px; line-height:12px;
  font-family:'FontAwesome';
  color:#ccc;
  text-align:center;
}
#loginWrap .login-box .id-save input:checked + label:before {
  border-color:#4bc5c3;
  background:#4bc5c3;
  color:#fff;
}
#loginWrap .login-box .login-btn button {
  display:block;
  width:100%; height:50px;
  border-radius:3px;
  background:#0871b9;
  font-weight:bold; font-size:15px; line-height:50px;
  color:#fff;
  text-align:center;
}
#loginWrap .quick-board {
  float:right;
  padding-left:45px;
  width:50%;
  border-left:1px dashed #d3d9db;
  box-sizing:border-box;
}
#loginWrap .quick-board .notice-wrap {
	position:relative;
  width:100%;
  border:1px solid #dfe8f3;
  border-radius:3px;
  box-sizing:border-box;
  text-align:left;
}
#loginWrap .quick-board .notice-wrap h2 {
	padding:0 20px;
	background:#f6f8f9;
	font-weight:bold; font-size:13px; line-height:39px;
	color:#111;
}
#loginWrap .quick-board .notice-wrap ul {
	padding:10px 0;
}
#loginWrap .quick-board .notice-wrap ul li a {
	overflow:hidden;
	position:relative;
	display:block;
	padding-left:30px;
	max-width:95%;
	box-sizing:border-box;
	font-size:12px; line-height:27px;
	color:#444;
	white-space:nowrap;
	text-overflow:ellipsis;
}
#loginWrap .quick-board .notice-wrap ul li a:hover {
  color:#0871b9;
  text-decoration:underline;
}
#loginWrap .quick-board .notice-wrap ul li a:before {
	content:'';
	position:absolute; top:50%; left:20px;
	margin-top:-1.5px;
	width:3px; height:3px;
	border-radius:50%;
	background:#0871b9;
}
#loginWrap .quick-board .notice-wrap > a {
  position:absolute; top:9px; right:20px;
  z-index:33;
  width:20px; height:20px;
  border-radius:50%;
  background:#e7e8ed;
  font-size:0;
}
#loginWrap .quick-board .notice-wrap > a:before,
#loginWrap .quick-board .notice-wrap > a:after,
#loginWrap .quick-board .notice-wrap > a:before,
#loginWrap .quick-board .notice-wrap > a:after {
  content:'';
  position:absolute; top:50%; left:50%;
  background:#8e94a4;
}
#loginWrap .quick-board .notice-wrap > a:before,
#loginWrap .quick-board .notice-wrap > a:before {
  margin:-5px 0 0 -1px;
  width:2px; height:10px;
}
#loginWrap .quick-board .notice-wrap > a:after,
#loginWrap .quick-board .notice-wrap > a:after {
  margin:-1px 0 0 -5px;
  width:10px; height:2px;
}

#loginWrap .footer address {
  font-style:normal;
  font-size:12px; color:#333;
  text-align:center;
}
#loginWrap .footer address img {
	display:inline-block;
	vertical-align:sub;
	margin-right:10px;
}


/* layout
--------------------------------------------------------------------------------------------------------- */
#wrapper {
	overflow:hidden;
	background:#fff;
}

/* header
------------------------------------------------------ */
#header {
	width:100%; height:60px;
	background:#0871B9;
}

/* -------- header left -------- */
.header-left {
	display:flex;
	justify-content:flex-start;
	align-items:center;
	float:left;
	padding-left:20px;
	width:50%; height:60px;
	box-sizing:border-box;
	font-size:0;
}
/* logo */
.header-left h1 {
	margin-right:20px;
}
.header-left h1 a {
	display:block;
	line-height:0;
}
/* user */
.header-left .user-info {
	font-size:0;
}
.header-left .user-info a {
	display:block;
  font-size:0;
}
.header-left .user-info a > * {
	display:inline-block;
	vertical-align:middle;
}
.header-left .user-info .user-img {
  overflow:hidden;
  margin-right:10px;
  width:28px; height:28px;
  border-radius:50%;
}
.header-left .user-info .user-img img {
  width:100%; height:auto;
}
.header-left .user-info .user-name {
	font-size:12px; line-height:60px;
	color:#fff;
}
.header-left .user-info .user-name strong {
	font-weight:bold;
}

/* -------- header right -------- */
.header-right {
	display:flex;
	justify-content:flex-end;
	align-items:center;
	float:left;
	padding-right:20px;
	width:50%; height:60px;
	box-sizing:border-box;
	text-align:right;
}
/* icon button */
.header-right  .header-icon-btn {
}
.header-right  .header-icon-btn li {
	position:relative;
	display:inline-block;
	text-align:center;
	vertical-align:middle;
}
.header-right  .header-icon-btn li.on:before {
    content:'';
    position:absolute; top:-4px; right:0;
    width:10px; height:10px;
    border:2px solid #0871b9;
    border-radius:50%;
    background: #e60012 url('/images/mes/comm/header_icon/new_icon.png') no-repeat center center;
}
.header-right  .header-icon-btn li a {
	display:block;
	padding:0 5px;
	width:100%; height:100%;
	box-sizing:border-box;
}
.header-right  .header-icon-btn li span {
	display:block;
	margin-top:3px;
	font-size:10px; line-height:1.1;
	color:#fff;
}
/* search */
.header-search {
	position:relative;
	margin-left:12px;
	width:200px; height:28px;
	border-radius:2px;
	background:#064f81;
}
.header-search input {
	padding:0 36px 0 30px;
	width:100%; height:28px;
	box-sizing:border-box; border:0 none;
	background:url('/images/mes/comm/header_icon/icon_search.png') no-repeat 10px center;
	font-size:12px; line-height:100%;
	color:#fff;
	opacity: 1;
}
.header-search input::placeholder {
	color:#fff;
}
.header-search button {
	position:absolute; top:0; right:0;
	width:36px; height:28px;
	background:url('/images/mes/comm/header_icon/icon_search1.png') no-repeat center center;
	font-size:0;
}
/* bookmark */
.header-right .bookmark {
	line-height:0;
}
.header-right .bookmark a {
  display:block;
}
/* logout */
.header-right .logout-btn {
	margin-left:12px;
}
.header-right .logout-btn a {
	display:block;
	line-height:0;
}



/* footer
------------------------------------------------------ */
#footer {
	width:100%; height:30px;
	border-top:1px solid #cacaca;
	background:#ddd;
}
.footer-inner {
	padding: 0 20px;
	width:100%;
	box-sizing:border-box;
	font-size:0;
	text-align:right;
}
.footer-inner > * {
	display:inline-block;
	vertical-align:middle;
	margin-left:15px;
}
.footer-inner .footer-board {
	padding:0 3px;
	border-radius:20px;
	background:#B4B8BE;
}
.footer-inner .footer-board li {
	position:relative;
	display:inline-block;
	vertical-align:top;
}
.footer-inner .footer-board li:before {
	content:'';
	position:absolute; top:50%; left:0;
	margin-top:-3px;
	width:1px; height:8px;
	background:#6C727B;
}
.footer-inner .footer-board li:first-child:before {
	display:none;
}
.footer-inner .footer-board li a {
	display:block;
	padding:0 12px;
	font-size:11px; line-height:19px;
	color:#303945;
}
.footer-inner address {
	font-style:normal;
	font-size:11px; line-height:30px;
	color:#666;
}



/* leftmenu
------------------------------------------------------ */
#leftmenu {
	position:absolute; top:60px; left:0;
	width:237px; height:calc(100vh - 91px);
	background:#fff;
}

#lnb {
	width:calc(100% - 7px); height:100vh;
}

#lnb.on {
	position:relative;
}
#lnb.on:before {
	content:'';
	position:fixed; top:0; left:0;
	z-index:99999;
	width:100%; height:100%;
	background:rgba(0,0,0,.3);
}

.drag-wrap {
	position:absolute; top:60px; left:230px;
	z-index:9999;
	width:7px; height:calc(100vh - 91px);
	box-sizing:border-box;
	border:1px solid #ccc;
	border-width:0 1px;
	background:#eee url('/images/mes/comm/left_icon/drag.png') no-repeat center center;
	background-size:3px auto;
	cursor:col-resize;
}
.drag-wrap.on {
	cursor:auto;
}
.drag-wrap.on:before {
  content:'';
  position:absolute; top:0; left:-1px;
  z-index:99999;
  width:calc(100% + 2px); height:100%;
  background:rgba(0,0,0,.3);
  pointer-events:none;
}
.drag-wrap button {
  position:absolute; top:38px; left:100%;
  margin-left:1px;
  width:18px; height:40px;
  background:#0A3756;
  border-radius:0 5px 5px 0;
  border:0 none;
  font-size:0;
  opacity: 0.3;
}

.drag-wrap button:hover {
  opacity: 1;
}

.drag-wrap button:before {
	content:'';
	position:absolute; top:50%; left:50%;
	transform:translate(-50%,-50%);
  margin-left:-2px;
	width:0; height:0; border-style:solid; border-width:4px;
  border-color:transparent #fff transparent transparent;
}
.drag-wrap button.on:before {
  margin-left:2px;
  border-color:transparent transparent transparent #fff;
}

.menu-search {
	padding:0 10px 0 46px;
	width:100%; height:37px;
	box-sizing:border-box;
	background:#f5f5f5 url('/images/mes/comm/left_icon/leftmenu_icon_search.png') no-repeat 20px center;
	cursor: pointer;
}
.menu-search input[type="text"] {
	padding:0;
	width:100%; height:100%;
	border:0 none;
	background:#f5f5f5;
	font-size:11px; color:#666;
}

.gnb {
	height:calc(100vh - 37px);
}
.gnb .depth01 {
	width:100%;
	box-sizing:border-box;
}
.gnb .depth01:before {
	content:'';
	display:block;
	width:100%; height:1px;
	background:#ddd;
}
.gnb .depth01 > a {
	display:block;
	padding:0 20px;
	border-top:1px solid #fff;
	background:#f2f2f2 url('/images/mes/comm/left_icon/arrow-1.png') no-repeat 95% center;
	font-weight:bold; font-size:13px; line-height:41px;
	color:#2E3439;
	text-decoration:none;
	cursor:pointer;
}
.gnb .depth01.on > a {
  background:#f2f2f2 url('/images/mes/comm/left_icon/arrow.png') no-repeat 95% center;
}
.gnb .depth01 > a img {
	display:inline-block;
	margin-right:10px;
	vertical-align:middle;
}
.nav-wrap {
	display:none;
	border-top:1px solid #ddd;
}
.gnb .depth01.on .nav-wrap {
	overflow:auto;
	display:block;
	width:100%; height:calc(100vh - 209px);
}
#lnb.on .depth01.on .nav-wrap {
	overflow:hidden;
}



/* contents
------------------------------------------------------ */
#contents {
	padding-left:237px;
	height:calc(100vh - 91px);
}
#wrapper #contentsWrap {
	height:calc(100vh - 91px);
}
.conts-wrap {
	position:relative;
	min-height:100vh;
	box-sizing:border-box;
}

/* -------- page-navi -------- */
.page-navi {
	padding-top:7px;
	width:100%; height:37px;
	box-sizing:border-box;
	background:#0A3756;
}
.page-navi .home {
	float:left;
	width:30px; height:30px;
	border-radius:5px;
	line-height:30px;
	text-align:center;
}
.page-navi .home a {
	display:block;
}
.page-navi .home img {
	line-height:0;
}
.page-navi .home:hover {
	background:rgba(255,255,255,.15);
}

#contentTabs .btn_delete {
	display:inline-block;
	vertical-align:top;
	margin-left:5px;
  width:20px; height:30px;
  font-size:0;
  background:url('/images/mes/comm/close_off.png') no-repeat center center;
}
#contentTabs .tab_selected .btn_delete {
  background:url('/images/mes/comm/close_on.png') no-repeat center center;
}
#contentTabs .scroll_tab_over .btn_delete {
  background:url('/images/mes/comm/close_on.png') no-repeat center center;
}
#contentTabs .btn_bookmark {
  display:inline-block;
  vertical-align:top;
  width:18px; height:30px;
  font-size:0;
  background:url('/images/mes/comm/bookmark_off.png') no-repeat 0 center;
}
#contentTabs .btn_bookmark.on {
  background:url('/images/mes/comm/bookmark_on.png') no-repeat 0 center;
}
#contentTabs .tab_selected .btn_bookmark,
#contentTabs .scroll_tab_over .btn_bookmark {
  background:url('/images/mes/comm/bookmark_hover_off.png') no-repeat 0 center;
}
#contentTabs .tab_selected .btn_bookmark.on,
#contentTabs .scroll_tab_over .btn_bookmark.on {
  background:url('/images/mes/comm/bookmark_hover_on.png') no-repeat 0 center;
}

.page-navi .tab-wrap {
	overflow:hidden;
	float:left;
}
.page-navi .tab {
	float:left;
	margin-right:1px;
}
.page-navi .tab a {
	display:block;
	padding:0 5px 0 12px;
	border-radius:5px 5px 0 0;
	background:#3775A1;
	font-size:12px; line-height:30px;
	color:rgba(223,232,243,.8);
}
.page-navi .tab.on a {
	background:#fff;
	font-weight:bold;
	color:#2E3439;
}
.page-navi .tab button {
	display:inline-block;
	vertical-align:top;
	width:20px; height:30px;
	background:url('/images/mes/comm/close_off.png') no-repeat center center;
	font-size:0;
}
.page-navi .tab.on button {
	background:url('/images/mes/comm/close_on.png') no-repeat center center;
}



/* -------- index -------- */
.index-wrap {
	position:relative; left:-10px; top:-10px;
	margin-bottom:-20px; padding:25px;
	width:calc(100% + 20px); min-height:calc(100vh - 37px);
	box-sizing:border-box;
	background:#EBF0F3;
	font-size:0;
}
.index-data {
  display:inline-block;
  vertical-align:top;
  margin-left:33px;
  width:calc(100% / 6 - 28px);
}
.index-data:first-child {
	margin-left:0;
}
.index-data .data-box {
	position:relative;
	margin-bottom:33px; padding:20px;
	width:100%; height:230px;
	border-radius:5px;
	box-sizing:border-box;
	box-shadow:0 0 3px rgba(0,0,0,.1);
	background:#fff;
}
.index-data .data-box a {
	display:block;
}
/*
.index-data:nth-child(5) .data-box {
	height:493px;
}
*/
.index-data .data-box h3 {
  display:inline-block;
  padding:6px 20px;
  border-radius:15px;
  background:#f5f5f5;
  font-weight:bold; font-size:14px; line-height:1.3;
  color:#3A444A;
  word-break:keep-all;
}
.index-data .data-box p {
	margin:15px 0 0;
  font:700 60px/72px 'Roboto', 'Malgun Gothic', Dotum, sans-serif;
  color:#3D454B;
  letter-spacing:-1px;
}
.index-data .data-box .color-red {
	color:#EC4141;
}
.index-data .data-box .color-blue {
  color:#0871B9;
}
.index-data .data-box .icon {
	position:absolute; bottom:20px; right:20px;
}
.index-data .data-box table {
	margin-top:20px;
	width:100%;
	table-layout:fixed;
}
.index-data .data-box table th,
.index-data .data-box table td {
	height:40px;
  border:1px solid #B9B9B9;
  box-sizing:border-box;
  font-weight:normal; font-size:12px;
  color:#666;
  text-align:center;
  vertical-align:middle;
}

@media screen and (max-width: 1200px) {
  .index-data {
    margin-left:10px;
    width:calc(100% / 6 - 9px);
  }
  .index-data .data-box {
    margin-bottom:10px;
    padding:10px;
    height:189px;
  }
  .index-data .data-box h3 {
  }
  .index-data .data-box p {
    font-size:42px;
  }
  .index-data .data-box .icon {
    height:30px;
  }
}


.main-quick-menu {
}
.main-quick-menu h2 {
	padding:0 20px;
	box-sizing:border-box;
  background:#3A444A;
  font:700 24px/55px 'Roboto', 'Malgun Gothic', Dotum, sans-serif;
  color:#fff;
}
.main-quick-menu ul {
	width:100%; height:calc(100% - 60px);
	border-radius:0 0 5px 5px;
	background:#fff;
}
.main-quick-menu ul li {
	display:inline-block;
	vertical-align:middle;
	padding:20px;
	border-left:1px solid #e5e5e5;
	width:25%; height:100%;
	box-sizing:border-box;
	text-align:center;
}
.main-quick-menu ul li:first-child {
	border-left:0 none;
}
.main-quick-menu ul li a {
	display:table;
	padding:25px 0;
	width:100%; height:100%;
	border-radius:5px;
	box-sizing:border-box;
	background:#DFE8F3;
}
.main-quick-menu ul li a span {
	display:table-cell;
	vertical-align:middle;
  font-weight:bold; font-size:27px; line-height:1;
  color:#0871B9;
}
.main-quick-menu ul li a span:after {
	content:'';
	display:block;
	margin:20px auto 0;
	width:40px; height:40px;
	border-radius:50%;
	background:#fff url('/images/mes/main/quick_arrow.png') no-repeat center center;
}

@media screen and (max-width: 1200px) {
	.main-quick-menu ul li a span {
	 font-size:18px;
	}
	.main-quick-menu ul li a span:after {
	 margin:10 auto 0;
	 width:30px; height:30px;
	 background-size:auto 6px;
	}
}



/* -------- inner -------- */
.conts-wrap .inner {
	width:100%;
	box-sizing:border-box;
}
#indexFrame {
  padding:10px;
}

.grid-wrap {
	padding:0 10px 10px;
	height:calc(100vh - 78px);
	box-sizing:border-box;
}
.grid-wrap.full {
	padding:10px;
	height:100vh;
}
.grid-scroll-wrap {
  padding:0 10px 10px;
  height:100%;
  box-sizing:border-box;
}
.template2 .grid {
	height:50%;
}
.grid-box {
	height:100%;
	border:1px solid #e5e5e5;
  box-sizing:border-box;
}
.grid-box #jqxgrid ,
#splitter #jqxgrid {
	border:0 none;
}

#jqxWidget {
	width:100%; height:100%;
  box-sizing:border-box;
}
#jqxgrid {
  width:100%; height:100%;
	border:1px solid #e5e5e5;
  box-sizing:border-box;
}
#mainSplitter #jqxgrid {
	border:0 none;
}
.grid-wrap1 {
  padding:10px;
  height:calc(100vh - 20px);
}
.grid-wrap1 .grid {
  height:calc(100% - 76px);
}
.border > [id*="grid"] {
  border:1px solid #e5e5e5;
}

.conts-wrap .inner > iframe {
	display:block;
	height:calc(100vh - 37px);
}

/* -------- search-form -------- */
.search-form {
	padding:12px 15px;
	width:100%;
	box-sizing:border-box;
	border:1px solid #d3d3d3;
	background:#f3f3f3 url('/images/mes/comm/icon_search_form.png') no-repeat 15px center;
}
.search-form fieldset {
	font-size:0;
}
.search-form ul {
	display:inline-block;
	vertical-align:top;
	font-size:0;
}
.search-form ul li {
	position:relative;
	display:inline-block;
	vertical-align:top;
}
.search-form ul li:first-child {
	margin-left:0;
}
.search-form .form-wrap {
	padding-left:20px;
}
.search-form .form-wrap li {
	padding: 0 12px;
}
.search-form .form-wrap li:after {
	content:'';
	position:absolute; top:0; right:0;
	width:1px; height:30px;
	background:#e5e5e5;
}
.search-form ul li > * {
	display:inline-block;
	vertical-align:top;
}
.search-form ul li label {
	font-size:11px; line-height:30px;
}
.search-form ul li input[type="text"] ,
.search-form ul li select,
.search-form ul li input[type="date"] {
	padding:0 3px;
	min-width:120px; height:30px;
	border:1px solid #ccc;
	border-radius:3px;
	box-sizing:border-box;
	background:#fff;
	font-size:11px;
}
.search-form ul li input[type="text"] + input[type="text"] ,
.search-form ul li select + input[type="text"] {
	margin-left:5px;
}
.search-form ul li input[name*="Date"] ,
.search-form ul li input[type="date"] {
	min-width:auto;
	width:80px;
}
.search-form ul li input[type="text"] + span ,
.search-form ul li input[type="date"] + span {
  display:inline-block;
  vertical-align:top;
  padding:0 3px;
  font-size:11px; line-height:30px;
}
.search-form ul li input[type="checkbox"] {
	margin:8px 0 0 10px;
	width:14px; height:14px;
}
.search-form ul li input[type="radio"] {
  margin:8px 15px 0 5px;
}
.search-form .form-wrap > li > label + *,
.search-form .form-wrap > li > label ~ * {
	margin-left:10px;
}
.search-form ul li > [id*="Date"] {
	margin-left:10px;
  border-radius:3px 0 0 3px;
  border-color:#ccc !important;
}
.search-form ul li > [id$="Date"] .jqx-input-content {
	line-height:100%;
}
.search-form .form-wrap > li > [id$="Date"] + span {
	margin:0 -5px 0 5px;
	font-size:11px; line-height:30px;
}
.search-form .jqx-dropdownlist {
	width:120px !important;
	box-sizing:border-box;
	border-color:#ccc;
  background:#fff;
  color:#555;
}
.search-form ul li > .hasDatepicker {
	border-radius:3px 0 0 3px !important;
	font-size:13px !important;
	font-family:Verdana,Arial,sans-serif;
}
.search-form ul li > .ui-datepicker-trigger {
	margin-left:-1px !important;
	height:30px;
  background:#efefef;
  border:1px solid #aaa;
  border-left-color:#c7c7c7;
}

.search-form .btn-wrap {
  margin-left:12px;
}
.search-form.no-icon .btn-wrap {
	margin-left:0;
}
.search-form .btn-wrap li {
	margin-left:10px;
}
.search-form .btn-wrap li button {
	padding:0 10px;
	min-width:80px; height:30px;
	border-color:#2E6A95;
	background:#2E6A95;
	font-size:12px; color:#fff;
}
.search-form .btn-wrap li .search {
  background:#4DC0EE;
  border-color:#4DC0EE;
}
.search-form .btn-wrap li .submit {
	background:#4BC5C3;
	border-color:#4BC5C3;
}
.search-form .btn-wrap li .reset {
	background:#a3a3a3;
	border-color:#a3a3a3;
}
.search-form .btn-wrap li .modify {
  background:#a3a3a3;
  border-color:#a3a3a3;
}
.search-form .btn-wrap li .delete {
  background:#a3a3a3;
  border-color:#a3a3a3;
}

.search-form.no-icon {
  background:#f3f3f3;
}
.search-form.no-icon .form-wrap {
	padding-left:0;
	width:calc(100% - 80px);
}
.search-form .form-wrap.n3 {
  width:calc(100% - 260px);
}
.search-form.no-icon .form-wrap li:first-child {
	padding-left:0;
	width:calc(100% - 12px);
}
.search-form.no-icon .form-wrap li input[type="text"] {
	width:100%;
}


.inner-btn-wrap {
	padding:8px 12px;
  font-size:0;
}
.inner-btn-wrap h2 {
	position:relative;
	display:inline-block;
	padding-left:22px;
	width:250px;
	box-sizing:border-box;
	font-weight:bold; font-size:14px; line-height:24px;
	color:#3D454B;
	vertical-align:top;
	white-space:nowrap;
	cursor: url('/images/mes/comm/jqwidgets/icon-showpassword.png') 4 12, auto;
}
.inner-btn-wrap h2:before {
  content:'';
  position:absolute; top:50%; left:0;
  margin-top:-8.5px;
  width:17px; height:17px;
  border-radius:3px;
  background:#3D454B url('/images/mes/comm/title_icon.png') no-repeat center center;
}

.inner-btn-wrap h1 {
	position:relative;
	display:inline-block;
	padding-left:22px;
	width:250px;
	box-sizing:border-box;
	font-weight:bold; font-size:14px; line-height:24px;
	color:#3D454B;
	vertical-align:top;
	white-space:nowrap;
}
.inner-btn-wrap h1:before {
  content:'';
  position:absolute; top:50%; left:0;
  margin-top:-8.5px;
  width:17px; height:17px;
  border-radius:3px;
  background:#3D454B  center center;
}
.inner-btn-wrap .btn-wrap {
	text-align:right;
	font-size:0;
}
.inner-btn-wrap h2 ~ .btn-wrap {
	display:inline-block;
	width:calc(100% - 250px);
  vertical-align:top;
}
.inner-btn-wrap .btn-wrap li {
	display:inline-block;
	vertical-align:top;
}
.inner-btn-wrap .btn-wrap li button,
.inner-btn-wrap .btn-wrap li input[type="button"] {
  margin-left:5px; padding:0 10px;
  min-width:55px; height:24px;
  border:1px solid rgba(58,68,74,.8);
  box-sizing:border-box;
  border-radius:3px;
  background:#fff;
  font-size:12px; color:#3D454B;
  text-align:center;
}
.inner-btn-wrap .btn-wrap li button:hover,
.inner-btn-wrap .btn-wrap li input[type="button"]:hover {
  border-color:#3D454B;
  background:#3D454B;
  color:#fff;
}

/** 저장버튼 **/
.inner-btn-wrap .btn-wrap li  button.button_save ,
.inner-btn-wrap .btn-wrap li input[type="button"] {
  margin-left:5px; padding:0 10px;
  min-width:55px; height:24px;
  border:1px solid #64945a;
  box-sizing:border-box;
  border-radius:3px;
  background:#ffffff;
  font-size:12px; color:#64945a;
  text-align:center;
}
.inner-btn-wrap .btn-wrap li button.button_save:hover,
.inner-btn-wrap .btn-wrap li input[type="button"]:hover {
  border-color:#3D454B;
  background:#3D454B;
  color:#fff;
}

/**  복사 버튼 **/
.inner-btn-wrap .btn-wrap li  button.button_target ,
.inner-btn-wrap .btn-wrap li input[type="button"] {
  margin-left:5px; padding:0 10px;
  min-width:55px; height:24px;
  border:1px solid rgba(58,68,74,.8);
  box-sizing:border-box;
  border-radius:3px;
  background:#0b7ce3;
  font-size:12px; color:#ffffff;
  text-align:center;
}
.inner-btn-wrap .btn-wrap li button.button_target:hover,
.inner-btn-wrap .btn-wrap li input[type="button"]:hover {
  border-color:#3D454B;
  background:#3D454B;
  color:#fff;
}

/**  추가 버튼 **/
.inner-btn-wrap .btn-wrap li  button.button_insert ,
.inner-btn-wrap .btn-wrap li input[type="button"] {
  margin-left:5px; padding:0 10px;
  min-width:55px; height:24px;
  border:1px solid #0871b9;
  box-sizing:border-box;
  border-radius:3px;
  background:#ffffff;
  font-size:12px; color:#0871b9;
  text-align:center;
}
.inner-btn-wrap .btn-wrap li button.button_insert:hover,
.inner-btn-wrap .btn-wrap li input[type="button"]:hover {
  border-color:#3D454B;
  background:#3D454B;
  color:#fff;
}

/**  삭제 버튼 **/
.inner-btn-wrap .btn-wrap li  button.button_delete ,
.inner-btn-wrap .btn-wrap li input[type="button"] {
  margin-left:5px; padding:0 10px;
  min-width:55px; height:24px;
  border:1px solid #d9001c;
  box-sizing:border-box;
  border-radius:3px;
  background:#ffffff;
  font-size:12px; color:#d9001c;
  text-align:center;
}
.inner-btn-wrap .btn-wrap li button.button_delete:hover,
.inner-btn-wrap .btn-wrap li input[type="button"]:hover {
  border-color:#d9001c;
  background:#d9001c;
  color:#fff;
}

/**  인쇄 버튼 **/
.inner-btn-wrap .btn-wrap li  button.button_print ,
.inner-btn-wrap .btn-wrap li input[type="button"] {
  margin-left:5px; padding:0 10px;
  min-width:55px; height:24px;
  border:1px solid #000000;
  box-sizing:border-box;
  border-radius:3px;
  background:#167a8f;
  font-size:12px; color:#ffffff;
  text-align:center;
}
.inner-btn-wrap .btn-wrap li button.button_print:hover,
.inner-btn-wrap .btn-wrap li input[type="button"]:hover {
  border-color:#3D454B;
  background:#3D454B;
  color:#fff;
}

/**  엑셀 버튼 **/
.inner-btn-wrap .btn-wrap li  button.button_excel ,
.inner-btn-wrap .btn-wrap li input[type="button"] {
  margin-left:5px; padding:0 10px;
  min-width:55px; height:24px;
  border:1px solid #3d454b;
  box-sizing:border-box;
  border-radius:3px;
  background:#3d454b;
  font-size:12px; color:#ffffff;
  text-align:center;
}
.inner-btn-wrap .btn-wrap li button.button_excel:hover,
.inner-btn-wrap .btn-wrap li input[type="button"]:hover {
  border-color:#3D454B;
  background:#3D454B;
  color:#fff;
}

/* 버튼 비활성화 css */
.inner-btn-wrap .btn-wrap li button[disabled] {
  border-color: #adadad;
  background: #f0f0f0;
  color: #adadad;
  cursor: default;
}

.inner-btn-wrap .btn-wrap li button[disabled]:hover {
  border-color: #adadad;
  background: #f0f0f0;
  color: #adadad;
  cursor: default;
}

/** 버튼 영역 2줄 처리 **/


.inner-sub-btn-wrap {
	padding:0px 12px 8px 12px;
  font-size:0;
}
.inner-sub-btn-wrap .btn-wrap {
	text-align:right;
	font-size:0;
}
.inner-sub-btn-wrap h2 ~ .btn-wrap {
	display:inline-block;
	width:calc(100% - 250px);
  vertical-align:top;
}
.inner-sub-btn-wrap .btn-wrap li {
	display:inline-block;
	vertical-align:top;
}
.inner-sub-btn-wrap .btn-wrap li button,
.inner-sub-btn-wrap .btn-wrap li input[type="button"] {
  margin-left:5px; padding:0 10px;
  min-width:55px; height:24px;
  border:1px solid rgba(58,68,74,.8);
  box-sizing:border-box;
  border-radius:3px;
  background:#fff;
  font-size:12px; color:#3D454B;
  text-align:center;
}
.inner-sub-btn-wrap .btn-wrap li button:hover,
.inner-sub-btn-wrap .btn-wrap li input[type="button"]:hover {
  border-color:#3D454B;
  background:#3D454B;
  color:#fff;
}

/* 버튼 비활성화 css */
.inner-sub-btn-wrap .btn-wrap li button[disabled] {
  border-color: #cacaca;
  background: #cacaca;
  color: #fff;
  cursor: default;
}

.inner-sub-btn-wrap .btn-wrap li label {
  display:inline-block;
  vertical-align:top;
  margin-right:7px; margin-left:7px;
  font-size:12px; line-height:24px;
}
.inner-sub-btn-wrap .btn-wrap li:first-child label {
	margin-left:0;
}
.inner-sub-btn-wrap .btn-wrap li label + button {
	margin-left: 0;
}
.inner-sub-btn-wrap .btn-wrap li label + * {
	display:inline-block;
	vertical-align:middle;
}
.inner-sub-btn-wrap .btn-wrap li .jqx-input {
  display:inline-block;
  vertical-align:top;
  margin-right:5px;
}
.inner-sub-btn-wrap .btn-wrap li [id$="Date"] {
	margin-left:5px;
}
.inner-sub-btn-wrap .btn-wrap li label + [id$="Date"],
.inner-sub-btn-wrap .btn-wrap li label ~ [id$="Date"]
{
	margin-left:0;
}
.inner-sub-btn-wrap .btn-wrap li [id$="Text"] {
	margin-left:5px;
	padding-left:5px;
	width: 120px;
	height: 20px;
	border:1px solid #ccc;
	background:#fff;
	font-size:13px;
}
.inner-sub-btn-wrap .btn-wrap li label + [id$="Text"],
.inner-sub-btn-wrap .btn-wrap li label ~ [id$="Text"]
{
	margin-left:0;
}


.inner-sub-btn-wrap .inner-title {
  display:inline-block;
  vertical-align:top;
  width:150px;
  font-weight:bold; font-size:14px; line-height:24px;
  color:#3D454B;
}

.inner-sub-btn-wrap .inner-title + form {
  display:inline-block;
  vertical-align:top;
  width:calc(100% - 150px);
}



.default-button {
  display:inline-block;
  margin-left:5px; padding:0 10px;
  min-width:55px; height:24px;
  border:1px solid rgba(58,68,74,.8);
  box-sizing:border-box;
  border-radius:3px;
  background:#fff;
  font-size:12px; color:#3D454B;
  text-align:center;
}
.default-button:hover {
  border-color:#3D454B;
  background:#3D454B;
  color:#fff;
}
.inner-btn-wrap .btn-wrap li label {
  display:inline-block;
  vertical-align:top;
  margin-right:7px; margin-left:7px;
  font-size:12px; line-height:24px;
}
.inner-btn-wrap .btn-wrap li:first-child label {
	margin-left:0;
}
.inner-btn-wrap .btn-wrap li label + button {
	margin-left: 0;
}
.inner-btn-wrap .btn-wrap li label + * {
	display:inline-block;
	vertical-align:middle;
}
.inner-btn-wrap .btn-wrap li .jqx-input {
  display:inline-block;
  vertical-align:top;
  margin-right:5px;
}
.inner-btn-wrap .btn-wrap li [id$="Date"] {
	margin-left:5px;
}
.inner-btn-wrap .btn-wrap li label + [id$="Date"],
.inner-btn-wrap .btn-wrap li label ~ [id$="Date"] {
	margin-left:0;
}

.inner-btn-wrap .inner-title {
  display:inline-block;
  vertical-align:top;
  width:150px;
  font-weight:bold; font-size:14px; line-height:24px;
  color:#3D454B;
}
.inner-btn-wrap .inner-title + form {
  display:inline-block;
  vertical-align:top;
  width:calc(100% - 150px);
}

.inner-grid {
	/* overflow:auto; */
	height:100%;
}
.inner-btn-wrap + .inner-grid {
  height:calc(100% - 40px);
}
.has-tab .inner-btn-wrap + .inner-grid {
  height:calc(100% - 32px);
}
.grid-scroll-wrap .inner-btn-wrap + .inner-grid {
  height:calc(100% - 40px);
}

/* 버튼 2줄일 경우 sub-btn 추가 */
.inner-sub-btn-wrap + .inner-grid {
  height:calc(100% - 72px);
}
.has-tab .inner-sub-btn-wrap + .inner-grid {
  height:calc(100% - 32px);
}
.grid-scroll-wrap .inner-sub-btn-wrap + .inner-grid {
  height:calc(100% - 72px);
}


.inner-tree-wrap {
	overflow:hidden;
  height:calc(100% - 76px);
}
.search-form + .inner-tree-wrap {
	margin-top:10px;
}
#jqxtree {
	overflow:auto;
}

.search-wrap {
  padding:12px 15px 12px 47px;
  width:100%;
  box-sizing:border-box;
  background:#f3f3f3 url('/images/mes/comm/icon_search_form.png') no-repeat 15px center;
}
.search-wrap p {
	overflow:hidden;
}
.search-wrap p input[type="text"] {
	float:left;
	width:calc(100% - 65px); height:30px;
  border:1px solid #ccc;
  border-radius:3px;
  box-sizing:border-box;
  background:#fff;
  font-size:11px;
}
.search-wrap p button {
  float:right;
  margin-left:5px; padding:0 10px;
  background:#4DC0EE;
  border:0 none;
  width:60px; height:30px;
  font-size:12px; color:#fff;
}
.search-wrap + .grid {
  height:calc(100% - 54px);
}



.data-table-wrap {
	margin-top:10px;
}
.data-table-wrap.scroll {
	overflow-x:hidden;
	margin-top:0;
	height:392px;
}
.data-table-wrap.scroll:last-of-type{
	height:calc(100vh - 579px)
}
.data-table-wrap table {
	width:100%;
	table-layout:fixed;
}
.data-table-wrap th,
.data-table-wrap td {
	padding:5px;
	box-sizing:border-box;
	border:1px solid #e0e0e0;
	text-align:center;
}
.data-table-wrap th {
	font-weight:normal; font-size:12px;
}
.data-table-wrap td {
	font-size:12px;
	color:#555;
}
.data-table-wrap thead th {
	border-bottom:0 none;
	background:#567593;
	color:#fff;
}
.data-table-wrap tbody th {
	background:#f0f0f0;
	text-align:right;
}
.data-table-wrap tbody tr:hover th,
.data-table-wrap tbody tr:hover td {
	background:#4BC5C3;
	color:#fff;
}


.form-panel {
	position:relative;
}
.panel-title {
	padding:0 15px;
  background:#3A444A;
}
.panel-title h3 {
  font-weight:bold; font-size:13px; line-height:40px;
  color:#fff;
}
.panel-button {
	position:absolute; bottom:0; left:0;
	padding:10px;
	width:100%; height:50px;
	border-top:1px solid #e0e0e0;
	box-sizing:border-box;
	background:#fff;
	text-align:right;
}
.panel-form {
	overflow-x:hidden;
	padding:5px;
	height:calc(100% - 50px);
	box-sizing:border-box;
	background:#f5f5f5;
}
.inner-btn-wrap + .panel-form {
	border-top:1px solid #e5e5e5;
  height:calc(100% - 40px);
}
.panel-title + .panel-form {
  height:calc(100% - 90px);
}
.panel-form.no-button {
  height:calc(100% - 40px);
  border-bottom:1px solid #e5e5e5;
}
.panel-form div[id*="form"] > table,
.panel-form div[id*="Form"] > table {
	height:100%;
	border:0 none !important;
}
.panel-button ul {
	font-size:0;
}
.panel-button ul li {
  display:inline-block;
  vertical-align:top;
}
.panel-button ul li button {
  margin-left:10px;
  padding:0 10px;
  min-width:80px; height:30px;
  font-size:12px;
  color:#fff;
  text-align:center;
}

.panel-button ul li button[disabled] {
    border-color: rgb(202, 202, 202);
    background: rgb(202, 202, 202);
    color: rgb(255, 255, 255);
    cursor: default;
}

.panel-button ul li #saveBtn ,
.panel-button ul li #saveBtnM {
  background:#4DC0EE;
}
.panel-button ul li #deleteBtn ,
.panel-button ul li #deleteBtnM {
  background:#3A444A;
}
.panel-button ul li #searchtBtn,
.panel-button ul li #closeBtnM,
.panel-button ul li #resetBtnM,
.panel-button ul li #insertBtnM {
  background:#8F8F8F;
}


/* -------- chart -------- */
.chart-grid {
	padding:0 1% 0.5%;
	width:100%; height:100%;
	box-sizing:border-box;
}
.chart-grid.no-padding {
	padding:0;
}
.chart-grid > div {
	width:100%; height:100%;
}


/* -------- help-wrap -------- */
.help-wrap {
	position:absolute; bottom:0; right:0;
	padding:0 10px;
	width:100%;
	box-sizing:border-box;
	border-top:1px solid #DFE8F3;
	background:#EBF0F3;
}
.help-wrap dl {
	padding:8px 0;
	font-size:0;
}
.help-wrap dl dt,
.help-wrap dl dd {
	display:inline-block;
	vertical-align:middle;
}
.help-wrap dl dt {
	position:relative;
	padding-left:26px;
	width:70px;
	border-radius:3px;
	box-sizing:border-box;
	background:#EC6941;
	font-weight:normal; font-size:12px; line-height:24px;
	color:#fff;
}
.help-wrap dl dt:before {
	content:'';
	position:absolute; top:50%; left:9px;
	margin-top:-7px;
	width:14px; height:14px;
	border-radius:50%;
	border:1px solid rgba(255,255,255,.8);
	box-sizing:border-box;
	background:url('/images/mes/comm/question_mark.png') no-repeat center 2px;
}
.help-wrap dl dd {
	margin-left:15px;
	font-size:12px; line-height:24px;
	color:#333;
}


/* -------- popup -------- */
.popupContents {
	box-sizing:border-box !important;
	width:100% !important;
	padding:10px !important;
	background:#f5f5f5 !important;
}
.popupContents.border > div {
	border:1px solid #e5e5e5;
}
.popupContents > div > table {
	border:0 none !important;
}
.popup-button {
	padding:10px 0 0;
	text-align:center;
	font-size:0;
}
.popup-button li {
	display:inline-block;
	vertical-align:top;
}
.popup-button li button {
  margin:0 5px; padding:0 10px;
  min-width:55px; height:24px;
  border:1px solid rgba(58,68,74,.8);
  box-sizing:border-box;
  border-radius:3px;
  background:#fff;
  font-size:12px; color:#3D454B;
  text-align:center;
}
.popup-button li button:hover {
  border-color:#3D454B;
  background:#3D454B;
  color:#fff;
}

.popup-grid {
	border:1px solid #e5e5e5;
}
.popup-grid .inner-btn-wrap {
	background:#fff;
}
.popup-grid + .jqx-widget {
  border:1px solid #e5e5e5;
  border-top:0 none;
}

.popupContents input[type="button"] {
	padding:0 10px;
  min-width:55px; height:24px !important;
  border:1px solid rgba(58,68,74,.8);
  box-sizing:border-box;
  border-radius:3px;
  background:#fff;
  font-size:12px;
  color:#3D454B;
  text-align:center;
}

.popupContentsBom2 .inner-btn-wrap {
	padding:0;
}
#formWrap {
	border:0 none !important;
}
.popupContents3 .popup-button {
  padding:0 0 8px;
  text-align:right;
}
.popupContents3 .popup-button li:last-child button {
	margin-right:0;
}

.jqx-popup #indexFrame {
	padding-top:0; padding-left:0; padding-right:0;
}
.jqx-popup .inner + .inner-grid {
	height:calc(100% - 66px);
}
.popup-button + .inner-grid {
	height:calc(100% - 32px);
}


/* -------- tab grid start-------- */
.tab-grid-wrap {
	padding:10px 0 0;
	height:100vh;
	box-sizing:border-box;
}
.inner + .tab-grid-wrap {
	padding-top:0;
	height:calc(100vh - 76px);
}
.tab-grid-wrap .tab-grid {
  height:calc(100vh - 62px);
  border:1px solid #e5e5e5;
  box-sizing:border-box;
}
.inner + .tab-grid-wrap .tab-grid {
	height:100%;
}
.tab-grid-wrap .tab-grid #indexFrame {
	padding:0;
}
.tab-grid-wrap .tab-grid .search-form {
	border:0 none;
}
.tab-grid-wrap .tab-grid .grid-wrap {
	padding:0;
  height:calc(100vh - 118px);
}
.grid-wrap .has-tab ,
.grid-scroll-wrap .has-tab {
	padding-top:10px;
  box-sizing:border-box;
}
.grid-wrap .has-tab .jqx-tabs-content ,
.grid-scroll-wrap .has-tab .jqx-tabs-content {
  padding:0;
}

.inner-tab-wrap .search-form {
	white-space:nowrap;
}
.inner-tab-wrap .search-form ul li input[type="text"],
.inner-tab-wrap .search-form ul li select,
.inner-tab-wrap .search-form ul li input[type="date"] {
	min-width:auto;
	width:80px !important;
}

.tab-conts-wrap {
	height:calc(100% - 76px);
}
.tab-conts-wrap .jqx-tabs-content {
  padding-left:0; padding-right:0;
  padding-bottom:0;
  box-sizing:border-box;
  height:calc(100% - 32px) !important;
}


/* -------- popover -------- */
.popover {
	display:none;
	position:absolute;
	z-index:99999;
	border:1px solid #555;
	background:#fff;
}
.popover .jqx-widget-header {
  background:#3D454B;
}



/* grid table
--------------------------------------------------------------------------------------------------------- */
.grid-data-table {
	position:relative;
	overflow:auto;
	width:100%; height:100%;
	border:1px solid #e5e5e5;
	box-sizing:border-box;
	font-family:verdana, 'Malgun Gothic', Dotum, sans-serif;
}
/* -------- header -------- */
.grid-header {
	position:sticky; top:0;
	width:100%;
}
/* title */
.grid-title {
	display:table;
	table-layout:fixed;
	width:100%;
}
.grid-title > li {
	position:relative;
	display:table-cell;
	vertical-align:middle;
	padding:0 4px;
	border:1px solid #e0e0e0;
	border-width:0 0 1px 1px;
	box-sizing:border-box;
	background:#567593;
	font-size:12px; line-height: 25px;
	color:#fff;
	text-align:center;
}
.grid-title > li:first-child {
	border-left-width:0;
}
.grid-title .control-wrap {
	position:absolute; top:0; right:-18px;
	font-size:0;
	transition:.3s;
}
.grid-title .arrow-button {
	display:none;
	vertical-align:top;
	width:18px; height:24px;
	background:url('/images/mes/comm/grid/icon-up_w.png') no-repeat center center;
}
.grid-title li.on {
	padding-right:17px;
}
.grid-title li.on .arrow-button {
	display:inline-block;
}
.grid-title .arrow-button.on {
	background:url('/images/mes/comm/grid/icon-down_w.png') no-repeat center center;
}
.grid-title .menu-button {
	display:inline-block;
	vertical-align:top;
	width:18px; height:24px;
	border:0 none;
	border-left:1px solid #e0e0e0;
	background:url('/images/mes/comm/grid/icon-menu-small-w.png') no-repeat center center;
	cursor:pointer;
}
.grid-title > li:hover .control-wrap {
	right:0;
}
.grid-title .menu-pop {
	display:none;
	position:absolute; top:100%; left:calc(100% - 18px);
	z-index:99;
	padding:2px;
	width:156px;
	border:1px solid #555;
	background:#efefef;
}
.grid-title .menu-pop li {
	margin:0 3px;
}
.grid-title .menu-pop li button {
	padding:4px 8px;
	width:100%;
	box-sizing:border-box;
	font-size:12px;
	color:555;
	text-align:left;
}
.grid-title .menu-pop li button img {
	display:inline-block;
	vertical-align:sub;
}
.grid-title .menu-pop li.selected button {
	border-radius:2px;
	border:1px solid #555;
}
.grid-title .menu-pop li.disabled {
	opacity:.55;
}
/* form */
.grid-form {
	display:table;
	table-layout:fixed;
	width:100%;
	background: #f0f0f0;
}
.grid-form > li {
	position:relative;
	display:table-cell;
	vertical-align:middle;
	padding:4px;
	border:1px solid #e0e0e0;
	border-bottom-color:#c5c5c5;
	border-width:0 0 1px 1px;
	box-sizing:border-box;
}
.grid-form > li:first-child {
	border-left-width:0;
}
.grid-form > li input[type="text"] {
	padding:0 4px;
	width:100%; height:27px;
	border:1px solid #e5e5e5;
	box-sizing:border-box;
	background: #fff;
	font-size:12px;
}
.grid-form .dropdown-list {
	position:relative;
	width:100%;
}
.grid-form .dropdown-list > strong {
	display:block;
	padding:0 5px;
	border-radius:3px;
	border:1px solid #aaa;
	box-sizing:border-box;
	background: #efefef url('/images/mes/comm/grid/icon-down.png') no-repeat right center;
	font-weight:normal; font-size:12px; line-height: 25px;
	color:#555;
	cursor:pointer;
}
.grid-form .dropdown-list ul {
	display:none;
	position:absolute; top:100%; left:0;
	width:100%; min-width:150px;
	border:1px solid #555;
	background: #fff;
}
.grid-form .dropdown-list ul li {
	padding:5px 3px;
	font-size:12px; line-height: 1.2;
}
.grid-form .dropdown-list ul .selected {
	border-radius:2px;
	border:1px solid #999;
	background: #d1d1d1;
}
.grid-form .dropdown-list ul li:hover {
	border-color:#4BC5C3;
	background:#4BC5C3;
	color:#fff;
}
.grid-form .date-input {
	padding-right:32px;
}
.grid-form .date-input + button {
	position:absolute; top:4px; right:4px;
	width:27px; height:27px;
	border:1px solid #c7c7c7;
	box-sizing:border-box;
	background: #efefef url('/images/mes/comm/grid/icon_calendar.png') no-repeat center center;
	font-size:0;
}

/* -------- contents -------- */
.grid-contents {
	position:relative;
	width:100%;
}
.grid-contents .row {
	display:table;
	table-layout:fixed;
	width:100%;
}
.grid-contents .row > li {
	display:table-cell;
	vertical-align:middle;
	padding:0 4px;
	border:1px solid #e0e0e0;
	border-width:0 0 1px 1px;
	box-sizing:border-box;
	font-size:12px; line-height: 25px;
	color:#555;
}
.grid-contents .row:hover > li {
	color:#fff;
}
.grid-contents .row > li:first-child {
	border-left-width:0;
}
.grid-contents .selected li {
	background:#d1d1d1 !important;
}
.grid-contents .row:hover li {
	background:#4BC5C3 !important;
}
.grid-contents .row .tAc {
	text-align:center;
}
.grid-contents .cell-fill {
	background:#f0f0f0;
}
.grid-contents ul:nth-child(even) .cell-fill {
	background: #e5e5e5;
}
.jqx-tabs-headerWrapper + .jqx-tabs-content {
	padding:10px;
}
.grid-wrap .jqx-tabs-headerWrapper + .jqx-tabs-content {
	padding:10px 0 0;
}
.grid-wrap .jqx-tabs-headerWrapper + .jqx-tabs-content .inner-btn-wrap {
  padding-top:0;
}


/* -------- custom tab -------- */
.custom-tab-wrap {
	position:relative;
  padding:10px 10px 0;
  font-size:0;
}
.custom-tab-wrap:after {
	content:'';
	position:absolute; bottom:0; left:0;
	width:100%; height:1px;
	background:#3775a1;
}
.custom-tab-wrap li {
	display:inline-block;
	vertical-align:top;
	margin-right:1px; min-width:100px;
	background:#f7f7f7;
	border:1px solid #f7f7f7;
	border-radius:3px 3px 0 0;
	font-size:11px; line-height:30px;
	color:#999;
	text-align:center;
	cursor:pointer;
}
.custom-tab-wrap li.on,
.custom-tab-wrap li:hover {
  border-color:#3775a1;
  border-bottom-color:#fff;
  background:#fff;
  font-weight:bold;
  color:#0a3756;
}
.customTab {
	height:calc(100vh - 42px);
}
.customTab .grid {
	padding:10px;
	height:calc(100vh - 42px);
	box-sizing:border-box;
}
.customTab .inner + .grid {
	padding-top:0;
	height:calc(100% - 76px);
}

.customTab .grid > [id*="grid"] {
	height:100%;
  border:1px solid #e5e5e5;
  box-sizing:border-box;
  border-radius:0;
}




/* form table 시작
--------------------------------------------------------------------------------------------------------- */
.inner-form-table {
	padding:8px 12px 8px 0;
	width:100%;
	box-sizing:border-box;
	background:#f5f5f5;
}
.inner-form-table .form-row {
	display:table;
	width:100%; height:35px;
	table-layout:fixed;
}
.inner-form-table .form-cell {
	display:table-cell;
	vertical-align:middle;
	padding:4px 0;
	width:100%;
	font-size:0;
}
.inner-form-table.n4 .form-cell {
	width:25%;
}
.inner-form-table.n3 .form-cell {
	width:calc(100% / 3);
}
.inner-form-table.n2 .form-cell {
	width:100%;
}
.inner-form-table .form-cell > label {
	display:inline-block;
	vertical-align:middle;
	padding-left:12px;
	width:125px;
	box-sizing:border-box;
	font-size:12px;
}
.inner-form-table .form-cell > label span {
	display:inline-block;
	vertical-align:middle;
	color:#ff0000;
}
.inner-form-table .form-cell > label + * {
	display:inline-block;
	vertical-align:middle;
	width:calc(100% - 125px);
	font-size:12px;
}
.inner-form-table .form-cell input[type="text"],
.inner-form-table .form-cell select {
	padding:0 7px;
	height:30px;
	border:1px solid #e5e5e5;
	box-sizing:border-box;
}
.inner-form-table .form-cell textarea {
	padding:7px;
	height:100px;
	border:1px solid #e5e5e5;
	box-sizing:border-box;
	font-size:12px;
}
.inner-form-table .form-cell .align-right {
	text-align:right;
}
.inner-form-table .form-cell .radio-wrap ,
.inner-form-table .form-cell .checkbox-wrap {
	font-size:0;
}
.inner-form-table .form-cell .radio-wrap input,
.inner-form-table .form-cell .radio-wrap label,
.inner-form-table .form-cell .checkbox-wrap input,
.inner-form-table .form-cell .checkbox-wrap label {
	display:inline-block;
	margin:0;
	vertical-align:middle;
}
.inner-form-table .forfm-cell .radio-wrap label,
.inner-form-table .form-cell .checkbox-wrap label {
	font-size:12px;
}
.inner-form-table .form-cell .radio-wrap input ,
.inner-form-table .form-cell .checkbox-wrap input {
	margin:0 20px 0 5px;
	width:16px; height:16px;
}
.inner-form-table .form-cell .radio-wrap input:last-of-type,
.inner-form-table .form-cell .checkbox-wrap input:last-of-type {
	margin-right:0;
}

/* form table 종료
--------------------------------------------------------------------------------------------------------- */

.template3 .grid:first-child {
	height:197px;
}
.template3 .grid:nth-child(2) {
	height:calc(100% - 197px);
}
.template3 .inner-btn-wrap {
  border:1px solid #e6e6e6;
  border-bottom:0 none;
}

.chart-wrap {
	position:relative;
	width:100%; height:100%;
}
.chart-wrap .chart-detail {
	position:absolute; top:50%; left:60%;
	margin-top:-79px;
	width:280px;
}
.chart-wrap .chart-detail table {
	width:100%;
	background:#fff;
}
.chart-wrap .chart-detail table th,
.chart-wrap .chart-detail table td {
	padding:10px;
	border:1px solid #e6e6e6;
	font-size:14px;
	color:#333;
	text-align:center;
}
.chart-wrap .chart-detail table th {
	background:#f5f5f5;
}
.chart-wrap .chart-detail table tfoot th {
  background:#DFE8F3;
}

.data-table {
	width:100%;
}
.data-table th,
.data-table td {
	padding:10px;
  border:1px solid #e6e6e6;
  font-size:14px;
  color:#666;
}
.data-table thead th {
	background:#567593;
	font-weight:bold;
	color:#fff;
	text-align:center;
}
.data-table tbody th,
.data-table tfoot th {
	text-align:left;
}
.data-table tfoot th,
.data-table tfoot td {
	background:#f2f6fb;
}
.data-table tbody td,
.data-table tfoot td {
  text-align:center;
}


/* menu search form */
.menu-search-form {
	padding:10px;
  width:100%;
  box-sizing:border-box !important;
}
.menu-search-form input[type="text"] {
	padding-left:5px !important;
	border-color:#aaa !important;
}
.menu-search-form .jqx-fill-state-normal {
  line-height:30px;
}
.menu-search-form .jqx-fill-state-normal img {
	height:16px;
}
.menu-search-form ~ .jqx-tree {
	height:calc(95% - 51px) !important;
}


/* touch pc
--------------------------------------------------------------------------------------------------------- */
/* contents */
.touch-pc-wrap {
	position:relative;
  padding:10px; padding-bottom:150px;
  width:100%; height:100vh;
  box-sizing:border-box;
}

.touch-pc-process {
	margin-bottom:20px;
	width:100%; min-height:112px;
}
.touch-pc-process h2 {
  position:relative;
  display:inline-block;
  margin-bottom:8px; padding-left:22px;
  width:200px;
  box-sizing:border-box;
  font-weight:bold; font-size:14px; line-height:24px;
  color:#3d454b;
  vertical-align:top;
}
.touch-pc-process h2:before {
  content:'';
  position:absolute; top:50%; left:0;
  margin-top:-8.5px;
  width:17px; height:17px;
  border-radius:3px;
  background:#3D454B url('/images/mes/comm/title_icon.png') no-repeat center center;
}
.process-flow {
  overflow:auto;
  overflow-y:hidden;
  width:100%;
}
.touch-pc-process ul {
	display:table;
	min-width:1200px; width:100%; height:80px;
	table-layout: fixed;
}
.touch-pc-process ul li {
	position:relative;
	display:table-cell;
	padding-left:35px;
	box-sizing:border-box;
	background:#F3F3F3;
	font-size:20px;
	color:#999;
	text-align:center;
	vertical-align:middle;
}
.touch-pc-process ul li:first-child {
	padding-left:0;
}
.touch-pc-process ul li.on {
  background:#FF7A5A;
  color:#fff;
}
.touch-pc-process ul li.ing {
  background:#C9D255;
  color:#fff;
}
.touch-pc-process ul li:before {
  content:'';
  position:absolute; top:0; left:100%;
  z-index:2;
  width: 0;
  height: 0;
  border-top: 40px solid transparent;
  border-bottom: 40px solid transparent;
  border-left: 35px solid #F3F3F3;
}
.touch-pc-process ul li.on:before {
  border-left-color:#FF7A5A;
}
.touch-pc-process ul li.ing:before {
  border-left-color:#C9D255;
}
.touch-pc-process ul li:after {
  content:'';
  position:absolute; top:-4px; left:100%;
  z-index:1;
  width: 0;
  height: 0;
  border-top: 44px solid transparent;
  border-bottom: 44px solid transparent;
  border-left: 38px solid #fff;
}
.touch-pc-process ul li:last-child:before,
.touch-pc-process ul li:last-child:after {
  display:none;
}
.touch-pc-process ul li em {
  position:relative; top:-3px;
  display:inline-block;
  margin-right:5px;
  width:20px; height:20px;
  border-radius:50%;
  background:#999;
  font-style:normal; font-size:13px; line-height:20px;
  color:#fff;
  text-align:center;
}
.touch-pc-process ul li.on em {
  background:#fff;
  color:#FF7A5A;
}
.touch-pc-process ul li.ing em {
  background:#fff;
  color:#C9D255;
}
.touch-pc-process ul li.finish span:after {
  content:'\f058';
  display:inline-block;
  margin-left:15px;
  font-size:30px;
  font-family: 'FontAwesome';
  vertical-align:baseline;
}

.touch-pc-header {
  padding:8px 12px;
  width:100%;
  border:1px solid #E0E0E0;
  box-sizing:border-box;
  font-size:0;
}
.touch-pc-header h2 {
  position:relative;
  display:inline-block;
  padding-left:22px;
  width:200px;
  box-sizing:border-box;
  font-weight:bold; font-size:14px; line-height:30px;
  color:#3d454b;
  vertical-align:top;
}
.touch-pc-header h2:before {
  content:'';
  position:absolute; top:50%; left:0;
  margin-top:-8.5px;
  width:17px; height:17px;
  border-radius:3px;
  background:#3D454B url('/images/mes/comm/title_icon.png') no-repeat center center;
}
.touch-pc-header ul {
  display:inline-block;
  width:calc(100% - 200px);
  text-align:right;
  vertical-align:top;
  font-size:0;
}
.touch-pc-header ul li {
	display: inline-block;
	margin-left:10px;
	vertical-align:top;
}
.touch-pc-header ul li button {
  padding:0 15px;
  min-width:55px; height:30px;
  border:1px solid rgba(58,68,74,.8);
  box-sizing:border-box;
  border-radius:3px;
  background:#fff;
  font-size:14px; color:#3D454B;
  text-align:center;
  cursor:pointer;
}
.touch-pc-header ul li button[disabled] {
	border-color:#e5e5e5;
	background:#e5e5e5;
	color:#aaa;
}

.touch-pc-form {
	width:100%;
	table-layout:fixed;
	border:1px solid #e0e0e0;
  background:#fff;
}
.popupContents .touch-pc-form {
  border:1px solid #e0e0e0 !important;
}
.touch-pc-header + .touch-pc-form-wrap .touch-pc-form {
	border-top:0 none;
}
.touch-pc-form tr {
	border-top:1px solid #e0e0e0;
}
.touch-pc-form tr:first-child {
	border-top:0 none;
}
.touch-pc-form th,
.touch-pc-form td {
	height:70px;
	box-sizing:border-box;
	vertical-align:middle;
}
.touch-pc-form th {
	padding:0 20px;
	background:#f0f0f0;
	font-weight:normal; font-size:15px;
	color:#555;
	text-align:left;
}
.touch-pc-form th span {
	color:#ff0000;
}
.touch-pc-form td {
	padding:0 12px;
}
.touch-pc-form td .dangerous {
	font-weight:bold;
	color:red;
}
.touch-pc-form input[type="text"],
.touch-pc-form select,
.touch-pc-form button,
.touch-pc-form input[type="date"] {
	padding:0 10px;
	height:58px;
	box-sizing:border-box;
}
.touch-pc-form input[type="text"],
.touch-pc-form input[type="date"],
.touch-pc-form select {
	width:100%; border:1px solid #e0e0e0;
	font-size:15px;
}
.touch-pc-form td input[type="radio"] {
	position:relative;
	display:inline-block;
	vertical-align:middle;
  margin:0 10px 0 20px;
	width:20px; height:20px;
	border-radius:50%;
	border:1px solid #ccc;
}
.touch-pc-form td input[type="radio"]:checked:before {
	content:'';
	position:absolute; top:50%; left:50%;
	margin:-6px 0 0 -6px;
	width:12px; height:12px;
  border-radius:50%;
	background:#4BC5C3;
}
.touch-pc-form td input[type="checkbox"] {
  position:relative;
  display:inline-block;
  vertical-align:middle;
  margin:0 10px 0 20px;
  width:20px; height:20px;
  border:1px solid #ccc;
}
.touch-pc-form td input[type="checkbox"]:checked:before {
  content:'';
  position:absolute; top:50%; left:50%;
  margin:-6px 0 0 -6px;
  width:12px; height:12px;
  background:#4BC5C3;
}
.touch-pc-form td input[type="radio"]:first-child,
.touch-pc-form td input[type="checkbox"]:first-child {
	margin-left:0;
}
.touch-pc-form td input[type="radio"] + label ,
.touch-pc-form td input[type="checkbox"] + label {
	display:inline-block;
	line-height:20px;
}
.touch-pc-form td .button-wrap {
  font-size:0;
}
.touch-pc-form td .button-wrap > * {
	display:inline-block;
	vertical-align:top;
}
.touch-pc-form td .button-wrap > :first-child {
	width:50%;
}
.touch-pc-form td .button-wrap button {
	margin-left:10px;
	width:calc(49% - 10px);
	border:0 none;
	background:#2E6A95;
	font-size:15px;
	color:#fff;
	text-align:center;
	cursor:pointer;
}
.touch-pc-form td .button-wrap button.search {
  background:#4BC5C3;
}
.touch-pc-form td .button-wrap button.btn-light-blue {
  background:#4DC0EE;
}
.touch-pc-form td .button-wrap button.btn-green {
  background:#009966;
}
.touch-pc-form td .button-wrap button.btn-brown {
  background:#593E1A;
}
.touch-pc-form td .button-wrap button.btn-purple {
  background:#663399;
}
.touch-pc-form td .button-wrap button.btn-red {
  background:#b80028;
}
.touch-pc-form td .button-wrap button[disabled] {
  background:#999 !important;
  cursor:default;
}
.touch-pc-form td dl {
	position:relative;
	left:-12px;
}
.touch-pc-form td dl dt,
.touch-pc-form td dl dd {
	display:inline-block;
	vertical-align:middle;
	font-size:18px;
}
.touch-pc-form td dl dd {
	font-weight:bold;
	color:#0871B9;
}

.touch-pc-footer {
	/* position:fixed; bottom:0; left:0; */
	width:100%;
	text-align:center;
}
.touch-pc-footer ul {
	padding:25px 0;
	font-size:0;
}
.touch-pc-footer ul li {
	display:inline-block;
	margin:0 10px;
	vertical-align:top;
}
.touch-pc-footer ul li > * {
	width:230px; height:65px;
  border:1px solid #3D454B;
  border-radius:3px;
  background:#fff;
  font-size:20px;
  color:#3D454B;
  cursor:pointer;
}
.touch-pc-footer ul li button[disabled] {
  border-color: #cacaca;
	background: #cacaca;
  color: #fff;
  cursor: default;
}


.custom-form-wrap {
	padding:10px;
}
.custom-form {
  width:100%;
  font-size:0;
}
.custom-form > * {
	display:inline-block;
	vertical-align:middle;
}
.custom-form label {
	width:70px;
	font-size:12px; line-height:30px;
	color:#555;
}
.custom-form label + * {
	width:calc(100% - 70px);
}
.custom-form input[type="text"] {
	padding:0 5px;
	height:30px;
	border:1px solid #e5e5e5;
	box-sizing:border-box;
	font-size:12px;
}
.file-upload .fileup-btn {
	overflow:hidden;
	position:relative;
  display:block;
  margin:15px 0 10px; padding:20px 0;
  width:100%;
  border:2px dashed #e0e0e0;
  border-radius:3px;
  box-sizing:border-box;
  background:#fff;
}
.file-upload .fileup-btn .text {
  display:block;
	width:100%;
	font-size:12px;
	text-align:center;
}
.file-upload .fileup-btn .text:before {
	content:'';
	display:block;
	margin:0 auto 15px;
	width:50px; height:55px;
	background:url('/images/mes/sub/file_upload.png') no-repeat center center;
}
.file-upload .fileup-btn .text:after {
	content:'파일선택';
	display:block;
	margin:15px auto 0; padding: 0 10px;
	width: 70px;
	height: 24px;
	border: 1px solid rgba(58,68,74,.8);
	box-sizing: border-box;
	border-radius: 3px;
	background: #fff;
	font-size: 12px; line-height:22px;
	color: #3D454B;
	text-align: center;
}

/* popup login */
.jqx-popup #loginForm {
	padding: 0;
}
.jqx-popup .login-type-select {
  margin-top: 25px;
  width:calc(100% - 50px);
}
.popup-login {
	padding:0 25px 25px;
}
.popup-login ul li {
  position:relative;
  margin-bottom:10px;
}
.popup-login ul li:nth-child(1):before {
  content:'';
  position:absolute; top:50%; left:20px;
  z-index:888;
  margin-top:-7px;
  width:14px; height:14px;
  background:url('/images/mes/comm/login/icon_id.png') no-repeat 0 0;
}
.popup-login ul li:nth-child(2):before {
  content:'';
  position:absolute; top:50%; left:20px;
  z-index:888;
  margin-top:-7.5px;
  width:14px; height:15px;
  background:url('/images/mes/comm/login/icon_pw.png') no-repeat 0 0;
}
.popup-login ul li input[type="text"],
.popup-login ul li input[type="password"] {
  padding:0 10px 0 46px;
  width:100%; height:50px;
  border:1px solid #d3d9db;
  border-radius:3px;
  box-sizing:border-box;
  font-size:12px;
  color:#555;
}
.popup-login .id-save {
  margin:10px 0 12px;
  text-align:left;
}
.popup-login .id-save input {
  display:none;
}
.popup-login .id-save label {
  position:relative;
  display:block;
  padding-left:20px;
  font-size:12px; line-height:14px;
  color:#888;
  cursor:pointer;
}
.popup-login .id-save label:before {
  content:'\f00c';
  position:absolute; top:1px; left:0;
  display:inline-block;
  width:14px; height:14px;
  border:1px solid #ccc;
  box-sizing:border-box;
  border-radius:50%;
  font-size:10px; line-height:12px;
  font-family:'FontAwesome';
  color:#ccc;
  text-align:center;
}
.popup-login .id-save input:checked + label:before {
  border-color:#4bc5c3;
  background:#4bc5c3;
  color:#fff;
}
.popup-login .login-btn button {
  display:block;
  width:100%; height:50px;
  border-radius:3px;
  background:#0871b9;
  font-weight:bold; font-size:15px; line-height:50px;
  color:#fff;
  text-align:center;
}


/*
  사원정보
*/
.user-form {
	position:relative; top:5px; left:5px;
	padding:3px 10px;
	width:calc(100% - 10px); height:calc(100% - 10px);
	box-sizing:border-box !important;
	border-radius:5px;
	background:#fff;
}
.user-form table {
  background:none !important;
}
.user-form table td {
	color:#333;
}
.user-form [id*="label_el_"] {
  padding:5px 15px;
  min-width:85px;
  border-radius:20px;
  box-sizing:border-box;
  background:#f5f5f5;
	color:#666;
	text-align:center !important;
}


/*
  북마크팝업
*/
.bookmark-list {
}
.bookmark-list .jqx-widget-header > div:first-child {
	padding-left:16px;
  background:url('/images/mes/comm/bookmark_title.png') no-repeat 0 center;
}
.bookmark-list .add_folder {
	position:relative;
  float:left;
  margin-left:10px; padding-left:10px;
  font-size:11px; line-height:16px;
  color:#fff;
}
.bookmark-list .add_folder:before {
	content:'';
	position:absolute; top:50%; left:0;
	margin-top:-5px;
	width:1px; height:10px;
	background:rgba(255,255,255,.5);
}


.bookmark-list .popupContents {
	overflow:hidden;
	padding:0 !important;
	height:calc(100% - 31px) !important;
	box-sizing:border-box !important;
  background:#fff !important;
}
.bookmark-list .addbook + .jqx-tree {
	height:calc(100% - 40px) !important;
}

.addbook {
  padding:7px;
  width:100%;
  box-sizing:border-box;
  border-bottom:1px solid #e5e5e5;
  background:#f3f3f3;
  font-size:0;
}
.addbook input {
  display:inline-block;
  vertical-align:top;
  padding:0 3px;
  width:calc(100% - 36px); height:25px;
  border:1px solid #e5e5e5;
  box-sizing:border-box;
  background:#fff;
  font-size:11px;
}
.addbook button {
  display:inline-block;
  vertical-align:top;
  width:36px; height:25px;
  box-sizing:border-box;
  background:#3A444A;
  font-size:11px;
  color:#fff;
}

.bookmark-list .jqx-tree-dropdown-root {
	padding:5px;
	width:100% !important;
	box-sizing:border-box !important;
}
.bookmark-list .jqx-tree-dropdown-root li {
	box-sizing:border-box;
	font-size:0;
}
.bookmark-list .jqx-tree-dropdown-root li > .draggable {
  display:inline-block;
	position:relative; top:0; left:-18px;
	margin-right:-8px;
	padding-left:18px;
	width:calc(100% - 42px);
	box-sizing: border-box;
  font-size:11px;
	text-overflow:ellipsis;
  vertical-align:top;
}
.bookmark-list .jqx-tree-dropdown-root li > .draggable:before {
	content:'';
	position:absolute;
	left:0; top:0;
	width:18px; height:17px;
  background:url(/images/mes/comm/left_icon/folder.png) no-repeat center 4px;
}
.bookmark-list .jqx-tree-dropdown-root .jqx-disableselect > .draggable:before {
  display:none;
}


.bookmark-list .jqx-tree-dropdown-root li > .abc {
  display:inline-block;
	position:relative; top:0; left:-18px;
	margin-right:-8px;
	padding-left:18px;
	width:calc(100% - 42px);
	box-sizing: border-box;
  font-size:11px;
	text-overflow:ellipsis;
  vertical-align:top;
}
.bookmark-list .jqx-tree-dropdown-root li > .abc:before {
	content:'';
	position:absolute;
	left:0; top:0;
	width:18px; height:17px;
  background:url(/images/mes/comm/left_icon/icon.png) no-repeat center 4px;
}

.bookmark-list .jqx-tree-dropdown-root .jqx-disableselect > .abc:before {
  display:none;
}

.bookmark-list .jqx-tree-dropdown-root li > span + .abc {
	width:calc(100% - 60px);
}


.bookmark-list .jqx-tree-dropdown-root li > span + .draggable {
	width:calc(100% - 60px);
}
.bookmark-list .jqx-tree-dropdown-root li > span {
  display:inline-block;
	position:relative; z-index:11;
  vertical-align:top;
}
.bookmark-list .jqx-tree-dropdown-root li .delbook {
  display:inline-block;
	margin-top:2px;
	width:40px;
	border:1px solid #ccc;
	border-radius:3px;
	font-size:11px; line-height:16px;
	text-align:center;
  vertical-align:top;
}
.bookmark-list .jqx-tree-dropdown-root li .jqx-tree-dropdown {
	display:block;
}
.bookmark-list .jqx-tree-dropdown-root .jqx-icon-arrow-down,
.bookmark-list .jqx-tree-dropdown-root .jqx-icon-arrow-down-hover,
.bookmark-list .jqx-tree-dropdown-root .jqx-icon-arrow-down-selected {
  background:url('/images/mes/comm/left_icon/open.png') no-repeat 4px center;
}
.bookmark-list .jqx-tree-dropdown-root .jqx-icon-arrow-right,
.bookmark-list .jqx-tree-dropdown-root .jqx-icon-arrow-right-hover,
.bookmark-list .jqx-tree-dropdown-root .jqx-icon-arrow-right-selected {
  background:url('/images/mes/comm/left_icon/close.png') no-repeat 4px 2px;
}


.form-button-color-blue {
  background:#4DC0EE;
}
.form-button-color-dark {
  background:#3A444A;
}
.form-button-color-gray {
  background:#8F8F8F;
}

.imageCenter {
  text-align: center;
  display: block;
}