@charset "utf-8";
/*
2020.06.24

scripting by ailacia.

占쌍댐옙占쏙옙 占쏙옙占쏙옙 占쏙옙占쏙옙占싹댐옙 占싸븝옙占쏙옙 占쏙옙占쏙옙占쏙옙 占싹뤄옙占쏙옙 占쏙옙占쏙옙臼占쏙옙占�.
*/

@import url(reset.css);
@import url('https://fonts.googleapis.com/css2?family=Encode+Sans+Condensed:wght@100;200;300;400;500;600;700;800;900&display=swap');
@font-face {
    font-family: 'DWImpactamin';
    src: url('/common/fonts/DWImpactamin.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard-L';
    font-style: normal;
    src: url('/common/fonts/Pretendard-Light.woff2') format('woff2'),
    	 url('/common/fonts/PretendardVariable.ttf')  format('truetype');
}
@font-face {
    font-family: 'Pretendard-R';
    font-style: normal;
    src: url('/common/fonts/Pretendard-Regular.woff2') format('woff2'),
    	 url('/common/fonts/PretendardVariable.ttf')  format('truetype');
}
@font-face {
    font-family: 'Pretendard-M';
    font-style: normal;
    src: url('/common/fonts/Pretendard-Medium.woff2') format('woff2'),
    	url('/common/fonts/PretendardVariable.ttf')  format('truetype');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), 
	url('/common/fonts/Pretendard-Black.woff2') format('woff2'), 
	url('/common/fonts/Pretendard-Black.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), 
	url('/common/fonts/Pretendard-ExtraBold.woff2') format('woff2'), 
	url('/common/fonts/Pretendard-ExtraBold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), 
	url('/common/fonts/Pretendard-Bold.woff2') format('woff2'), 
	url('/common/fonts/Pretendard-Bold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), 
	url('/common/fonts/Pretendard-SemiBold.woff2') format('woff2'), 
	url('/common/fonts/Pretendard-SemiBold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), 
	url('/common/fonts/Pretendard-Medium.woff2') format('woff2'), 
	url('/common/fonts/Pretendard-Medium.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), 
	url('/common/fonts/Pretendard-Regular.woff2') format('woff2'), 
	url('/common/fonts/Pretendard-Regular.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), 
	url('/common/fonts/Pretendard-Light.woff2') format('woff2'), 
	url('/common/fonts/Pretendard-Light.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), 
	url('/common/fonts/Pretendard-ExtraLight.woff2') format('woff2'), 
	url('/common/fonts/Pretendard-ExtraLight.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), 
	url('/common/fonts/Pretendard-Thin.woff2') format('woff2'), 
	url('/common/fonts/Pretendard-Thin.woff') format('woff');
}

@font-face {
    font-family: "SpoqaHanSansNeo";
    font-style: normal;
    src: url('/common/fonts/SpoqaHanSansNeo-Light.otf') format('opentype');
}


/*
=== Common property ===
2020.06.18 maked by ailacia
ecosian tech-business lab
*/

* {
    box-sizing: border-box;
}
html, body {
    width: 100%;
    height: 100%;
    font-size: 14px;
    color: #333;
    background: #eaebef;
    font-family: 'Pretendard';
}
#wrapper {
    min-width: 1440px;
    display: flex;
    flex-direction: column;
    height: 100%;
}
body > #body > .wrapper{
	overflow-x:hidden;
}

/* .tab_iframe {min-width: 1440px;} */

/*=== tag property ===*/
/*=== tag property ===*/
/*=== tag property ===*/

/*clear*/

.clear:after {
    content: "";
    display: block;
    clear: both;
}

/*float*/

.floatL {
    float: left;
}
.floatR {
    float: right;
}

/*margin*/

.mgAuto {
    margin: auto;
}

.mg8 { margin: 8px; }
.mgt8 { margin-top: 8px; }
.mgl8 { margin-left: 8px; }
.mgb8 { margin-bottom: 8px !important; }
.mgr8 { margin-right: 8px !important; }

/*padding*/

.pd8 { padding: 8px; }
.pdt8 { padding-top: 8px; }
.pdl8 { padding-left: 8px; }
.pdb8 { padding-bottom: 8px; }
.pdr8 { padding-right: 8px; }

/*-----------------TextAlign-----------------*/

.txtL { text-align: left; }
.txtC { text-align: center; }
.txtR { text-align: right; }

/*button*/
button {cursor:pointer;}
.btnNor {
    background: transparent;
    border: 1px solid #234791;
    border-radius: 2px;
    color: #234791;
    font-size: 1.1em;
    font-weight: 500;
    font-family: 'Pretendard';
}
.btnNor:hover {
   border: 1px solid #ff3f40;
    color: #ff3f40;
   transition-duration: 0.3s;
}
.btnExl, #btnExcelUpload,#btnExcelUpload {
	height: 26px !important;
    border: 1px solid #ddd;
    font-size: 14px !important;
    padding: 0px 25px 0 6px;
    background: #fff;
    color: #666;
    background: url(/images/common/button_download.svg) no-repeat right;
    background-position-x: 95%;
    background-size: 21px;
    min-width: 66px !important;
    border-radius: 6px !important;
}
#btnExcelUpload{
	background: url(/images/common/button_upload.svg) no-repeat right;
	background-position-x: 95%;
    background-size: 21px;
}
.btnExl:hover {
	background: url(/images/common/button_download.svg) no-repeat right;
	background-position-x: 95%;
    background-size: 21px;
    opacity:1;
}
#btnExcelUpload:hover {
 	background: url(/images/common/button_upload.svg) no-repeat right;
 	background-position-x: 95%;
    background-size: 21px;
    opacity:1;
}
.btnEmp {
    background: #234791;
    border: none;
    border-radius: 2px;
    color: #fff;
    font-size: 1em;
}
.btnEmp:hover {
    transition-duration: 0.3s;
    opacity: 0.8;
}
.btnNeg {
/*     background: #d5dee8; */
    background: #dae3f4;
    border: none;
    border-radius: 2px;
    color: #2465a6;
    font-size: 1em;
}
.btnNeg:hover {
    opacity: 0.8;
    transition-duration: 0.3s;
}
.btnEmp:focus, .btnNor:focus, .btnNeg:focus{
	outline: 0;
}
.refresh {
	position: absolute;
	top: 5px;
    right:6px;
	margin-left:8px;
	width:32px;
	height:28px;
	border:none;
	background: url(/images/common/btn_refresh.svg)no-repeat center;
	outline:0;
	transition: all ease 1s;
	cursor:pointer;
}
.refresh:hover{
	transform: rotate( 180deg );
}

/*input*/
input {
    padding: 0 8px;
    border:none;
    border-radius: 2px;
    background: #f2f3f5;
    color:#222;
}
input:hover {
    outline: none;
    transition-duration: 0.3s;
}
select {
    padding: 0 24px 0 8px;
    border-radius: 2px;
    border:none;
    appearance: none;       
    -webkit-appearance: none; /*  chrome*/
    -moz-appearance: none;    /*  firefox*/
    -ms-appearance: none;    /*  firefox*/
    background: #f2f3f5 url('/images/common/selectArrow.png') no-repeat 100% 50%;
    background-position: 98%;
    background-size: auto;
    color:#222;
}
select::-ms-expand {
    display: none;
}
select:hover {
    outline: none;
    transition-duration: 0.3s;
}

sub {
    vertical-align: sub;
    font-size: smaller;
}

sup {
    vertical-align: top;
    font-size: smaller;
}

.table01 .AXanchor a{
	height: 53px !important;
}
/*=== header layout property ===*/
/*=== header layout property ===*/
/*=== header layout property ===*/

header {
    width: 100%;
}
.gnb {
    height: 24px;
    background: #ccc;
}
.gnb ul {
    float: right;
}
.gnb ul li {
    float: left;
}
.gnb ul li a {
    display: block;
    width: 120px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    text-decoration: none;
    font-size: 0.9em;
    color: #333;
}
.gnb ul li a:hover {
    background: #444;
    color: #fff;
    transition-duration: 0.3s;
}

.tnb {
    height: 64px;
    background: #e8e7e7;
}
.tnb ul li {
    float: left;
}
.tnb ul li a {
    display: block;
    width: 120px;
    height: 64px;
    line-height: 64px;
    background: #ddd;
    text-align: center;
    text-decoration: none;
    font-size: 1.1em;
    font-family: 'notoSansR',sans-serif;
    color: #333;
}
.tnb ul li a:hover {
    background: #e5e5e5;
    color: #333;
    transition-duration: 0.3s;
}
.tnb ul li a.logo,
.tnb ul li a.logo:hover {
    width: 200px;
    background: #ddd;
    color: #333;
}

/*=== section layout property ===*/
/*=== section layout property ===*/
/*=== section layout property ===*/

section {
    display: flex;
    flex: 1 0 auto;
}

#lnb {
    display: flex;
    flex: none;
    width: 200px;
    background: #e8e7e7;
}
#lnb .sectionTitle {
    width: 100%;
    height: 120px;
    line-height: 120px;
    text-align: center;
    border-bottom: 1px solid #aaa;
}
#lnb .sectionTitle img {
    vertical-align: middle;
    margin-right: 8px;
}
#lnb .sectionTitle span {
    font-size: 1.2em;
}
#lnb .sectionMenu {
    width: 100%;
}
#lnb .sectionMenu > li > a {
    display: block;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    text-decoration: none;
    background: #ccc;
    font-size: 1.1em;
    font-family: 'notoSansR',sans-serif;
    color: #333;
}
#lnb .sectionMenu > li > a:hover {
    background: #fbfbfb;
    color: #333;
    transition-duration: 0.3s;
}
#lnb .subMenu > li > a {
    display: block;
    width: 100%;
    height: 32px;
    line-height: 32px;
    text-align: center;
    text-decoration: none;
    background: #dedede;
    border-bottom: 1px solid #ccc;
    font-size: 1em;
    font-family: 'notoSansR',sans-serif;
    color: #333;
}
#lnb .subMenu > li > a:hover {
    background: #eee;
    color: #333;
    transition-duration: 0.3s;
}

#sectionArea {
    background: #eaebef; /*#eaebef; */
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    overflow: hidden;
   /*  background: linear-gradient( to bottom, #3b3a3e, #2f2e33 ); */
}
#sectionArea .contentTitle {
    width: 100%;
    height: 32px;
    line-height: 32px;
	background: #fff;
    border-bottom: 1px solid #ddd;
}
#sectionArea .contentTitle .btnFold {
    display: inline-block;
    float: left;
    width: 32px;
    height: 32px;
    margin-right: 8px;
    background: #eee url(/images/common/btnFold.png) no-repeat 50% 50%;
    background-size: auto;
    border: 1px solid #ccc;
    color: #fff;
    text-align: center;
    text-indent: -9999%;
}
#sectionArea .contentTitle .btnFold:hover {
    background: #fbfbfb url(/images/common/btnFold.png) no-repeat 50% 50%;
    background-size: auto;
    transition-duration: 0.3s;
}
#sectionArea .contentTitle .btnUnfold {
    display: inline-block;
    float: left;
    width: 32px;
    height: 32px;
    margin-right: 8px;
    background: transparent url(/images/common/btnUnfold.png) no-repeat 50% 50%;
    background-size: auto;
    border: 1px solid #ccc;
    color: #fff;
    text-align: center;
    text-indent: -9999%;
}
#sectionArea .contentTitle .btnUnfold:hover {
    background: #fbfbfb url(/images/common/btnUnfold.png) no-repeat 50% 50%;
    background-size: auto;
    transition-duration: 0.3s;
}
#sectionArea .contentTitle .btnNav {
    display: inline-block;
    position: relative;
    float: left;
    width: 32px;
    height: 32px;
    background: transparent;
    /*background: #eee url(/images/common/btnNav.png)no-repeat 50% 50%;
    background-size: auto;*/
    border: none;
    /* border-bottom: 1px solid #ccc; */
    color: #fff;
    text-align: center;
    text-indent: -9999%;
    outline:0;
}
#sectionArea .contentTitle .btnNav:after {
    content: "";
    width: 10px;
    height: 2px;
    background: #59585c;
    position: absolute;
    border-radius: 2px;
    top: 15px;
    left: 12px;
}
#sectionArea .contentTitle .btnHelp {
	display:none;
    /*display: inline-block;
    float: right;
    width:24px;
    height:24px;
    padding:0px;
    margin: 4px 4px 0px 0px;
    background: #eee url(/images/common/btnHelp.png)no-repeat 50% 50%;
    background-size: auto;
    border: 1px solid #ccc;
    color: #fff;
    text-align: center;
    text-indent999%;*/
}
#sectionArea .contentTitle .btnHelp:hover {
    background: #fbfbfb url(/images/common/btnHelp.png)no-repeat 50% 50%;
    background-size: auto;
    transition-duration: 0.3s;
}
#sectionArea .contentTitle .title {
    display: inline-block;
    font-size: 1.1em;
    font-family: 'notoSansR',sans-serif;
}
#sectionArea .contentTitle .nav {
    display: inline-block;
    font-size: 0.9em;
    color: #87868d;
}
#sectionArea .contentArea {
    position: relative;
}
.searchView {
	position: relative;
    display: block;
    width: 100%;
    margin-top:16px;
    margin-bottom:0px !important;
	padding: 10px 0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    background: #fff;
    color: #222;
    /* box-shadow: 0px 2px 5px rgba(0,0,0,0.1); */
}
/* .contentArea .searchView:after {
    content: "";
    width: 4px;
    height: 80%;
    background: #747379;
    position: absolute;
    border-radius: 5px;
    top: 10%;
    left:8px;
} */
#searchView {
    display: block;
    position: relative;
}
#searchView:after {
    content: "";
    display: block;
    clear: both;
}
.searchView ul {
    float: left;
    width: calc(100% - 120px);
    overflow: hidden;
}

.searchView .popul{
	float: left;
	width: calc(80% - 80px);
}

.searchView ul:after {
    content: "";
    display: block;
    clear: both;
}
.searchView ul li {
    float: left;
    display: inline-block;
    /* height: 32px; */
    line-height: 32px;
    margin-right: 4px;
    margin-left: 8px;
    vertical-align: middle;
}
.searchView ul li.date {
}
.searchView ul li.date input[type=date] {
    width: 150px;
    padding: 0px;
}
.searchView ul li label {
    /* margin-right: 16px; */
    text-align: left;
    width: 100%;
    display: block;
    font-size: 12px;
    height: 18px;
    line-height: 13px;
    color: #222;
    text-indent: 4px;
}
.searchView ul li.checks label {
	display: block;
	width: auto;
	height: 18px;
}
.searchView ul li input,
.searchView ul li select {
    display: inline-block;
    width: 100px;
    height: 28px;
    line-height: 28px;
    vertical-align: middle;
    font-size: 0.9em;
    outline: 0;
    border:none;
}
.searchView ul li input:focus, .searchView ul li select:focus{outline: 0;}
.searchView ul li input:hover, .searchView ul li select:hover{
	border: 1px solid #234791;
	transition: 0.3;
}

.searchView ul li select#siteCd,
.searchView ul li select#bldgPupsCd { width: 165px; }
.searchView ul li select#areaCdIq { width: 150px; }

.title select {
	margin: -6px 0 0 3px;
    padding: 0 24px 0 8px;
    border: none;
    border-radius: 2px;
    width: 120px;
    height: 28px;
    line-height: 28px;
    vertical-align: middle;
    font-size: 0.9em;
    outline: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    background: #f2f3f5 url(/images/common/selectArrow.png) no-repeat 100% 53%;
    background-size: auto;
}
.title select:first-of-type{
	width:150px;
}
.title select:nth-of-type(2), .title select:nth-of-type(3){
	width:80px;
}
.title>select::-ms-expand {
    display: none;
}
.title>select:hover,.title>select:focus {
    outline: 0;
	border: 1px solid #12b1b1;
	transition: 0.3;
}

.searchView ul li.radio h3,
.searchView ul li.checkbox h3 {
    width: 80px;
    display: inline-block;
}

.searchView ul li.checkbox input[type=checkbox] {
    display: none;
}
.searchView ul li.checkbox input[type=checkbox] + label {
    position: relative;
    text-indent: 24px;
    margin-right: 16px;
    color: #ccc;
    user-select: none;
}
.searchView ul li.checkbox input[type=checkbox] + label:hover,
.searchView ul li.checkbox input[type=checkbox]:checked + label {
    color: #333;
    transition-duration: 0.3s;
}
.searchView ul li.checkbox input[type=checkbox] + label:before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url(/images/common/chkBox.png)no-repeat center;
    background-size: contain;
    position: absolute;
    top: 8px;
    left: 0px;
    cursor: pointer;
    font-weight: 500;
    font-family: 'Pretendard';
}
.searchView ul li.checkbox input[type=checkbox]:checked + label:before {
    background: url(/images/common/chkBox_checked.png);
    background-size: contain;
    transition-duration: 0.3s;
}
.searchView ul li.checks span { 
	padding-right:20px;
	width:100%;
	height: 15px;
	display: block;
	font-size: 12px;
    line-height: 13px;
    color: #222;

}
.searchView ul li.checks input[type="radio"] {
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip:rect(0,0,0,0);
  border: 0;
}
.searchView ul li.checks input[type="radio"] + label {
  display: inline-block;
  position: relative;
  padding-left: 18px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  margin-top: 11px;
  font-size: 14px;
}
.searchView ul li.checks input[type="radio"] + label:before {
  content: '';
  position: absolute;
  left: 0;
  top: -3px;
  width: 16px;
  height: 16px;
  text-align: center;
  background: #fafafa;
  border: 1px solid #cacece;
  border-radius: 100%;
  box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
}
.searchView ul li.checks input[type="radio"] + label:active:before,
.searchView ul li.checks input[type="radio"]:checked + label:active:before  {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}
.searchView ul li.checks input[type="radio"]:checked + label:before {
  background: #E9ECEE;
  border-color: #adb8c0;
}
.searchView ul li.checks input[type="radio"]:checked + label:after {
  content: '';
  position: absolute;
  top: 0px;
  left: 3px;
  width: 12px;
  height: 12px;
  background: #234791;
  border-radius: 100%;
  box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);
}

/*
.searchView ul li.radio input[type=radio] {
    display: none;
}
.searchView ul li.radio input[type=radio] + label {
    position: relative;
    text-indent: 24px;
    margin-right: 16px;
    color: #ccc;
    user-select: none;
}
.searchView ul li.radio input[type=radio] + label:before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url(/images/common/radioBox.png)no-repeat center;
    background-size: contain;
    position: absolute;
    top: 8px;
    left: 0px;
    cursor: pointer;
    user-select: none;
}
.searchView ul li.radio input[type=radio] + label:hover,
.searchView ul li.radio input[type=radio]:checked + label {
    color: #333;
    transition-duration: 0.3s;
}
.searchView ul li.radio input[type=radio]:checked + label:before {
    background: url(/images/common/radioBox_checked.png);
    background-size: contain;
    transition-duration: 0.3s;
}
*/
.searchView ul li button {
    width: 60px;
    height: 28px;
    line-height: 28px;
    vertical-align: middle;
    font-size: 0.9em;
    padding: 0px;
    border: none;
    border-radius: 2px;
    background: #6d6c72;
    color: #fbfbfb;
}
.searchView ul li button:hover {
    border: none;
    background: #919097;
    color: #fff;
    transition-duration: 0.3s;
}
.searchView ul li button:focus{
	outline: 0;
}
.searchView ul li button.active{
	border: 1px solid #12b1b1;
    background: #12b1b1;
    color: #fff;
    transition-duration: 0.3s;
}
.searchView > div .btnSearch {
    float: right;
    width: 65px;
    height: 26px;
    position: absolute;
    right: 11px;
    bottom: 0;
    color: #fff;
    /* font-size: 0; */
    border: none;
    border-radius: 4px;
    background: #234791 url(/images/common/button_search_white.svg)no-repeat center;
    background-position-x: 41px;
    outline: 0;
    background-size: 15px;
    cursor: pointer;
    transition-duration: 0.3s;
    text-indent: -18px;
    line-height: 25px;
}
.searchView > div .btnSearch:hover {
	background: #234791 url(/images/common/button_search_white.svg)no-repeat center;
    background-position-x: 41px;
	background-size: 15px;
	opacity: 0.8;
}
/* .searchView > div .btnSearch:after{
	content: "Search";
    display: inline-block;
    margin: 0px 5px;
    font-size: 14px;
    color: #fbfbfb;
} */
.searchView .searchDrop {
    float: left;
    width: 100%;
}
.searchView .searchDrop:after {
    content: "";
    display: block;
    clear: both;
}
.btnDrop {
    float: left;
    width: 100%;
    height: 16px;
    line-height: 16px;
    background: url(/images/common/btnUndrop.png)no-repeat center;
    background-size: contain;
    border: 1px solid #ccc;
    color: #fff;
    text-align: center;
    text-indent: -9999%;
    outline: none;
}
.btnUndrop {
    float: left;
    width: 100%;
    height: 16px;
    line-height: 16px;
    background: url(/images/common/btnDrop.png) no-repeat center;
    background-size: contain;
    border: 1px solid #ccc;
    border-top: none;
    color: #fff;
    text-align: center;
    text-indent: -9999%;
    outline: none;
}
.btnDrop:hover {
    background: #fff url(/images/common/btnUndrop.png) no-repeat center;
    background-size: contain;
    transition-duration: 0.3s;
}
.btnUndrop:hover {
    background: #fff url(/images/common/btnDrop.png) no-repeat center;
    background-size: contain;
    transition-duration: 0.3s;
}

.contentArea {
    flex: auto;
    padding:0 16px 5px 16px;
    position: relative;
}
#wrap { }

#innerPopup {
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    z-index: 100;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
}
#loadingPopup {
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    z-index: 100;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    transition-duration: 0.3s;
}
#loadingPopup img.loading {
    width: 80px;
    height: 80px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -20px;
    margin-left: -20px;
}
.contentArea .view {
    background: #fff;
    border:1px solid #eee;
    margin-top: 16px;
    padding-bottom: 8px;
}
.contentArea .view .detail>div:nth-of-type(1){
	/* border-bottom: 1px solid #ddd; */
}
.contentArea .view:after {
    content: "";
    display: block;
    clear: both;
}
.contentArea .view .title {
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-weight: 500;
    position: relative;
    padding: 0 8px;
    overflow: hidden;
}
.contentArea .view .title:before{
	content: "";
    width: 4px;
    height: 20px;
    position: absolute;
    left: 0;
    background: #254389;
    border-radius: 8px;
    top: calc(50% - 10px);
}

.contentArea .view .title span{
	 line-height: 40px;
	 color:#fff;
}
.contentArea .view .title #currentTime {
	margin-right:50px;
}

.contentArea .view .title > h3 {
	float: left;
	position: relative;
    display: inline-block;
    font-size: 16px;
    color: #222;
    font-weight: 500;
    font-family: 'Pretendard';
    padding-left: 4px;
}
.contentArea .view .title > h3.node {
	padding-top: 2px; 
}
/* .contentArea .view .title > h3:after{
	content: "";
    width: 10px;
    height: 10px;
    background: #737379;
    position: absolute;
    border-radius: 2px;
    top: 14px;
    left: 1%;
} */
.contentArea .view .detail:after {
    content: "";
    display: block;
    clear: both;
}
.contentArea .view .btnSet:after {
    content: "";
    display: block;
    clear: both;
}
.contentArea .view .btnSet button {
    min-width: 80px;
    margin-right: 5px;
    height: 28px;
    line-height: 24px;
    border-radius: 4px;
    cursor:pointer;
}
.contentArea .view .btnSet button:last-of-type {
    margin-right: 0px;
}

.contentArea .view .btnSet {
	float: right;
	padding-top: 8px;
	text-align: right;
	border-top: 1px solid #eee;
	width: 100%;
}
.contentArea .view .btnTitle {
	float: right;
	height: 100%;
	display: flex;
	align-items: center;
}
.contentArea .view .btnTitle button {
	height: 28px;
    line-height: 24px;
    cursor: pointer;
    margin-left: 4px;
    margin-top: 0 !important;
}
.contentArea .view .btnTitle input {
	height: 26px ;
	line-height: 27px;
    cursor: pointer;
    background: #e8ebf4;
    color: #234791;
    border-radius: 4px;
}
.contentArea .view .btnTitle #btnExcelUpload {
	margin-top: 0  !important;
}
form:after {
    content: "";
    display: block;
    clear: both;
}
.table01 {
	width:100%;
}
.table01 tr {
	width:100%;
	vertical-align:middle;
	height:56px;
    border-bottom: 1px solid #ddd;
}
.table01 tr:last-of-type {
    border-bottom: none;
}
.table01 th {
    vertical-align: middle;
    text-align: left;
    text-indent: 24px;
    width:200px;
}
.table01 input {
    height:32px;
	line-height:32px;
    margin: 12px 0px;
    width:300px;
    vertical-align: middle;
    border: 1px solid #eee;
}
.table01 input::placeholder,
.table01 textarea::placeholder{color:#bbb;}

.table01 input[type="text"]:disabled {
	background: #ddd;
	border: none;
	color: #222;
}
.table01 input[type="text"]:disabled:hover{border:none;}

.table01 select {
    height:32px;
    width:300px;
	line-height:24px;
    margin: 12px 0px;
    border: 1px solid #eee;
}
.table01 select:disabled {
	background: #ddd;
    border: none;
    color: #222;
}
.table01 textarea {
    display: block;
    background: #f2f3f5;
    border: none;
    min-height: 100px;
    margin: 12px 0px;
	resize: none;
	width:300px;
	padding:8px;
	color: #222;
	border: 1px solid #eee;
}
.table01 textarea:hover,.table01 textarea:focus {border: 1px solid #afb9ce;}
.table01 input:focus , .table01 select:focus, .table01 textarea:focus {border: 1px solid #eee; outline: 0;}
.table01 input:hover , .table01 select:hover, .table01 textarea:hover{
   border: 1px solid #eee;
}
.table01 input:-webkit-autofill,
.table01 input:-webkit-autofill:hover,
.table01 input:-webkit-autofill:focus,
.table01 input:-webkit-autofill:active {
transition: background-color 5000s ease-in-out 0s;
-webkit-text-fill-color: #fbfbfb !important;
}
.table01 button {
    min-width: 65px;
    margin-right: 5px;
    height: 28px;
    line-height: 24px;
    border-radius: 4px;
}
.calc_table01 th, .calc_table01 tr, .calc_table01 td,
.calc_table02 th, .calc_table02 tr, .calc_table02 td{
    padding: 1px;
    font-size: 14px;
    box-sizing: border-box;
    vertical-align: Middle;
}
.calc_table01 td {
	width: 70px;
    height: 36px;
    text-align: center;
}
.calc_table01 button{
	width: 70px;
    height: 36px;
    display: block;
    background: #fbfbfb;
    border: 1px solid #bbb;
    border-radius: 2px;
    outline: none;
}
.calc_table01 button:hover{
	color: #12b1b1;
	border: 1px solid #12b1b1;
	transition-duration: 0.3s;
}

.calc_table01 td .bt_run {
	height: 111px;
}
.calc_table01 td .bt_run:hover{
	background: #12b1b1;
	color: #fff;
	transition-duration: 0.3s;
}

.calc_history {
	background: #eee;
}
.fmlaInput {
	background: #eee;
	border: 1px solid #ddd;
}
.fmlaInput:focus {
  outline: none;
}

/*------- reptSite Table ---------*/
.reptSiteTable { margin-top: 6px; }
.reptSiteTable .table01 tr { height:63px; border-bottom:2px solid #fff; }
.reptSiteTable .table01 tr:nth-child(even) { /* background: #5c5b5f; */ }
.reptSiteTable .table01 tr:nth-of-type(1) { height: 48px; /* background: #39383c; */ }
.reptSiteTable .table01 tr th {
	text-indent: 0;
	text-align: center;
	background: #f4f6f9;
	color: #222;
	border-right:2px solid #fff;
}
.reptSiteTable .table01 tr th:first-of-type {
	text-align: center; 
}
.reptSiteTable .table01 tr td { text-align:center; vertical-align: middle; color: #666; background: #fbfbfb;}

.reptSite .view:nth-of-type(n+2) .table01 th:first-of-type{ width: 80px; white-space: nowrap;}

.reptSiteTable .table01 tr td.minus:before {
    content: "\25BC";
    display: inline-block;
    color: #006ada;
    font-family: 'notoSansLight', sans-serif;
    font-size: 1.25rem;
    text-align: left;
    margin-right: 8px;
}
.reptSiteTable .table01 tr td.plus:before {
    content: "\25B2";
    display: inline-block;
    font-family: 'notoSansLight', sans-serif;
    font-size: 1.25rem;
    color: #ff474b;
    text-align: left;
     margin-right: 8px;
}
.reptSite .view:nth-of-type(1) .table01 tr td:after ,
.reptSite .view:nth-of-type(n+2) .table01 tr:nth-of-type(4) td:after {
    content: "%";
    display: inline-block;
    font-family: 'notoSansLight', sans-serif;
    font-size: 1rem;
    color: #666;
    margin-left: 5px;
}

.engyRdct {
	padding: 16px;
}
.engyRdct > div p {
	color: #234791;
}
.engyRdct > div:nth-of-type(1){
	margin-bottom: 16px;
	border-bottom: 1px solid #eee;
}
.engyRdct div p span{
	font-size: 16px;
    line-height: 56px;
}
.engyRdct div span{
    color: #aaaaaa;
    text-indent: 8px;
    display: inline-block;
}
.engyRdct > div p:nth-of-type(1) {
	font-size: 24px;
	padding-left: 8px;
	color: #222;
}
.engyRdct > div p:nth-of-type(2) {
	font-size: 48px;
	text-align: right;
	padding-right: 24px;
	line-height: 100px;
	font-family: "SpoqaHanSansNeo";
	font-weight: 600;
}
.engyRdct div p:nth-of-type(2):after {
    content: "";
    display: inline-block;
    font-family: 'notoSansLight', sans-serif;
    margin-left: 5px;
}
.engyRdct div:nth-of-type(1) p:nth-of-type(2):after {
    content: "kWh";
    font-size: 2.25rem;
}
.engyRdct div:nth-of-type(2) p:nth-of-type(2):after {
    content: "%";
    font-size: 2.25rem;
}


/*=======test==============================================*/
.searchView ul .test{
	width:100%;
	margin-bottom: 4px;
	font-size: 24px;
	font-weight: 100;
}
.contentArea .view2 {
    background: #f2f2f2; 
}
.contentArea .view2:after {
    content: "";
    display: block;
    clear: both;
}
.contentArea .view2 .title {
    width: 100%;
    height: 40px;
    line-height: 40px;
    background: #f2f2f2;
    /*background: #ededed;*/
    border-bottom: 3px solid #bababa;
    box-sizing:border-box;
    font-family: 'notoSansR',sans-serif;
    font-weight: 100;
}
.contentArea .view2 .title > h3 {
    display: inline-block;
    margin: 0px 8px;
    font-size: 18px;
    font-weight: 400;
}
.contentArea .view2 .detail>div:nth-of-type(1){
	border-bottom: 2px solid #bababa;
}
.contentArea .view2 .btnSet {
    float: right;
}
.contentArea .view2 .btnSet button {
    float: left;
    min-width: 120px;
    margin-right: 5px;
    height: 30px;

    border-radius: 30px;
}
.searchView > div .btnSearch2{
	float: left;
    width: 95px;
    height: 28px;
    position: absolute;
    bottom: 0px;
    right: 0px;
    border: 1px solid #ccc;
    border-radius: 30px;
    background: #fff;
}
.searchView > div .btnSearch2:focus{ outline:0;}
.searchView > div .btnSearch2:hover{
	background: #12b1b1;
    color:#fff;
    transition-duration: 0.3s;
}
.searchView > div .btnSearch2 span:nth-of-type(1){
	line-height: 29px;
}
.searchView > div .btnSearch2 span:nth-of-type(1):hover{
	color:#fff;
}
.searchView > div .btnSearch2 path:hover{
	fill:#fff;
}

/*======================main dashboard=======================*/
.dashboardWrap {padding-top: 10px;}

.dashboardWrap h3 {
	font-size: 16px !important; 
	font-weight: 600;
    font-family: 'Pretendard' !important; 
}

.dashboardWrap > div .view {
	margin-top: 0px;
	border-radius:5px;
	box-shadow: 0px 1px 5px 0px rgba(30, 39, 86, 0.15);
	overflow: hidden;
	background: transparent;
	padding-bottom: 0;
	border:none;
}
.dashboardWrap > div .view.dash02{
	height:100%; 
	background:#7CC0FF;
}
.dashboardWrap .view .title {
	height: 35px;
    line-height: 35px;
    font-size: 16px;
    font-weight: 400;
    font-family: 'DWImpactamin';
    color:#333;
    padding:0;
    background:#F4F8F9;
    border-bottom: 1px solid rgba(135, 138, 166, 0.15);
}
.dashboardWrap .view .title.flex{
	display:flex;
	justify-content: space-between;
}
.dashboardWrap .view .title.flex .state{
	display:flex;
	gap:0 20px; 
	font-size:12px; 
	color:#333;
	margin-right:10px;
}
.dashboardWrap .view .title.flex .state li{
	display:flex;
	align-items: center;
	gap:0 5px;
}
.dashboardWrap .view .title > h3{
	padding-left:0;
}
.dashboardWrap .view .title span.icon{
	display:inline-flex; align-items: center;  justify-content: center;
	background:#2F58CD;
	border-radius: 0px 30px 30px 0px;
	margin-right:8px;
	width:38px;
	height:35px;
}
.dashboardWrap .view .title:before{
	display:none;
}
.dashboardWrap .view .title .checks {
	margin-left: 10px;
	color: #222;
	float: right;
}
.dashboardWrap .view .title .checks span {
	display:inline-block;
	margin-right: 8px;
	color: #222;
}
.dashboardWrap .detail { 
	padding: 10px 10px 10px !important;
	height: calc(100% - 36px);
}
.dashboardWrap > div {
	display: flex;
	height: 606px;
    flex-direction: row;
	padding-bottom: 16px;
}
.dashboardWrap .dashLine1 { height: 206px; /* border-bottom: 1px solid #555458; */ }
.dashboardWrap > div:last-of-type {
	margin-bottom: 0;
}
.dashboardWrap div > div:last-of-type {
	margin-right:0;
}
.dashboardWrap div > div#dash02{
	display:flex;
	justify-content: space-between;
	flex-direction: column;
}
.dashboardWrap .data,
.dashboardWrap .dash06 .data .checks {
	margin-left: 10px;
	font-size: 14px; 
}
.dashboardWrap .data label {
	position: relative;
    top: -1.5px;
    color: #222;
}
.dashboardWrap .data input {
	width: 16px;
    height: 16px;
    position: relative;
    top: 2px;
    left: -4px;
}


/*------ dashLine1 ------*/

.dashboardWrap .dashLine1 .dash01 {
	background: #D3EEF8; 
	
}
.dashboardWrap .dashLine1 .dash01 .title{
	background: #D3EEF8;
	border-bottom:none;
}
.dashboardWrap .dashLine1 .dash02,
.dashboardWrap .dashLine1 .dash03 {
	background: #fff;
	/* background: linear-gradient(90deg, rgba(47,46,51,1) 23%, rgba(55,54,59,1) 48%, rgba(47,46,51,1) 74%);
	border-image: linear-gradient(to right, #2a292e 0%,#59585c 25%,#59585c 75%,#2a292e 100%) 1 stretch; */
	margin-top: 0;
	height: 100%;
}
.dashboardWrap .dashLine1 .dash01 .detail { 
	padding:10px !important; 
}
.dashboardWrap .dashLine1 .dash01 ul {
	display: flex;
	width: 100%;
	height: 100%;
}
.dashboardWrap .dashLine1 .dash01 ul li { 
	text-align: center; 
	background: #fff;
	height: 100%;
	border-radius: 0;
	color: #375394;
    font-weight: 600;
    padding:20px 0;
}
.dashboardWrap .dashLine1 .dash01 ul li:nth-of-type(1){
	width: 130px;
	margin-right:16px;
	background:#1E2756;
	border-radius:50px;
	color:#fff;
	position:relative;
	
}
.dashboardWrap .dashLine1 .dash01 ul li:nth-of-type(1):before{
	content:'';
	position:absolute; 
	right:0px; 
	top:-7px;
	width:44px;
	height:43px;
	background:url('/images/common/target_img.png')no-repeat 0 0;
	background-size:100%;
}
.dashboardWrap .dashLine1 .dash01 ul li:nth-of-type(1) span{
	color:#fff !important;
}
.dashboardWrap .dashLine1 .dash01 ul li:nth-of-type(2){
	border-radius:30px 0px 0px 30px;
}
.dashboardWrap .dashLine1 .dash01 ul li:nth-of-type(6){
	border-radius:0px 30px 30px 0px;
}
.dashboardWrap .dashLine1 .dash01 ul li:nth-of-type(n+2){
	width: calc(( 100% - ( 5px * 5 + 130px )) / 5 );
	margin-right:5px;
}
.dashboardWrap .dashLine1 .dash01 ul li:last-of-type{ margin-right:0; }
.dashboardWrap .dashLine1 .dash01 span { 
	display: block;
}
.dashboardWrap .dashLine1 .dash01 ul li:nth-of-type(-n+2) span,
.dashboardWrap .dashLine1 .dash01 ul li:nth-of-type(n+3) span{
	height: calc(100% / 2);
    /* line-height: 60px; */
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
}
.dashboardWrap .dashLine1 .dash01 ul li span:last-of-type{
	font-size:1.25vw;
	font-family: "SpoqaHanSansNeo";
	font-weight: bold;
	color: #222;
}
.dashboardWrap .dashLine1 .dash02 h3,
.dashboardWrap .dashLine1 .dash03 h3{
	font-size: 14px !important;
}

.dashboardWrap .dashLine1 .dash03 .detail {
	background: transparent;
}

.dashboardWrap .dashLine1 .title h3 { 
	width: auto; 
	display: flex;
    align-items: center;
    font-weight: 600;
	font-family: 'Pretendard';
}

.dashboardWrap .dashLine1 .dash02 .detail #chart01>div,
.dashboardWrap .dashLine1 .dash03 .detail #chart02>div{margin-top:0;}

.dashboardWrap .dashLine1 .dash02 .detail > div,
.dashboardWrap .dashLine1 .dash03 .detail > div {
	position: relative;
	height: 100%;
}
.dashboardWrap .dashLine1 .dash03 .detail > div{
	width:100%;
}
.dashboardWrap .dashLine1 .dash02 .detail > div .text,
.dashboardWrap .dashLine1 .dash03 .detail > div .text {
	width: auto;
    color: #222;
    left: 12px;
    top: 0;
    z-index: 100;
    background: rgba(255,255,255, 0.5);
}
.dashboardWrap  .detail > div .text p,
.dashboardWrap  .detail > div .text p{
	width: auto;
	font-weight: 600;
	display: inline-block;
	text-indent: 2px;
}
.dashboardWrap  .detail > div .text p:nth-of-type(1),
.dashboardWrap .detail > div .text p:nth-of-type(1){
	margin-bottom: 4px;
}
.dashboardWrap  .detail > div .text p:nth-of-type(2),
.dashboardWrap .detail > div .text p:nth-of-type(2){
	font-size: 14px;
	font-family: "SpoqaHanSansNeo";
    letter-spacing: 1px;
    float: right;
    background:#D9E9FF;
    padding:2px 8px;
    border-radius: 10px;
}
.dashboardWrap .dashLine1 .dash02 .detail > div .chart,
.dashboardWrap .dashLine1 .dash03 .detail > div .chart{
	height:120px;
	box-shadow: 0px 2px 5px rgb(0 0 0 / 10%);
}
.dashboardWrap .dashLine1 .dash02 .detail #chart02 > div{margin-top: 0;}
.dashboardWrap .dashLine1 .detail > div .text .kWh:after{
	content: "kWh";
	display: inline-block;
	font-size: 12px;
}

/*------ dashLine2 ------*/
.dashboardWrap .dashLine2 {
	background: #fff;
    border-radius: 5px;
    padding-bottom: 0;
}
.dashboardWrap .dashLine1 .dash02 { 
	width: 100%;
}

.dashboardWrap .dashLine1 .dash02 .info { 
	width: 100%;
    height: 100%;
    padding: 0;
    overflow-X: scroll;
    display: flex;
    flex-direction: row;
    gap:0 10px;
}
.dashboardWrap .dashLine1 .dash02 .info::-webkit-scrollbar-thumb{
	background:rgba(30,39,86,0.5);
	border-radius:5px;
}
.dashboardWrap .dashLine1 .dash02 .info > div { 
	border-radius: 5px;
	color: #222;
	width:150px;
	background:#fff;
	border-radius: 10px;
	box-shadow: 0px 1px 3px rgb(0 0 0 / 10%) ;
	position: relative;
	max-height: 142px;
	cursor: pointer;
	flex-shrink: 0;
	display: flex;
    flex-direction: column;
    gap:15px 0;
    justify-content: center;
    opacity:0.8;
}
.dashboardWrap .dashLine1 .dash02 .info > div p {
	position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    word-break: keep-all;
    line-height:1.2;
    height:45px;
    text-align: center;
    font-size: 15px;
    text-overflow: ellipsis;
    color:#333;
    font-family: 'DWImpactamin';
}
.dashboardWrap .dashLine1 .dash02 .info > div .icons{
	display:flex;
	justify-content: center;
	gap:0 10px;
}
.dashboardWrap .dashLine1 .dash02 .info > div .icons span{
	display:block;
	width:38px;
	height:38px;
	font-size:0;
	border-radius:4px;
	background-size:19px 19px;
	background-repeat:no-repeat;
	background-position:50% 50%;
}
.dashboardWrap .dashLine1 .dash02 .info > div .icons span.red{
	background-color:#E0E0E0;
}
.dashboardWrap .dashLine1 .dash02 .info > div .icons span.green{
	background-color:#D3EEF8;
}
.dashboardWrap .dashLine1 .dash02 .info > div .icons span:nth-child(1){
	background-image:url('/images/common/icon_target.svg');
}
.dashboardWrap .dashLine1 .dash02 .info > div .icons span:nth-child(2){
	background-image:url('/images/common/icon_wifi.svg');
}

.dashboardWrap .dashLine1 .dash02 .active {	
	opacity: 1 !important;
    background: #fff ;
    box-sizing: border-box;
    transition: 0.3s;
    overflow: hidden;
}

.dashboardWrap .dashLine1 .dash02 .active p {color: #222;}
.dashboardWrap .dashLine1 .dash02 .active:hover p:nth-of-type(1){
	color:#375394 !important; /*#5a75f8 */
}

.dashboardWrap .dashLine2 .dash04{
	width:100%;
}


/*------ dashLine3 ------*/
.dashboardWrap .dashLine3 h3 {
	width: auto; 
	display: flex !important;
    align-items: center;
}
.dashboardWrap .dashLine3 h3 span { float: right; margin-right: 18px; }

.dashboardWrap .dashLine3 .text p:after {font-size: 12px;}
.dashboardWrap .dashLine3 .kWhm2:after {
    content: "kWh/㎡ ";
    display: inline-block; 
    margin-left: 4px;
}
.dashboardWrap .dashLine3 .kWh:after,
.dashboardWrap .dashLine2 .kWh:after {
    content: "kWh ";
    display: inline-block;
    margin-left: 4px;
}
.dashboardWrap .dashLine3 .per:after {
    content: "%";
    display: inline-block;
    margin-left: 2px;
}

.dashboardWrap .dashLine3 {
  	flex-wrap: wrap;
    padding-bottom: 0;
}
.dashboardWrap .dashLine3 > div {
	height: calc(( 100% / 2 ) - ( 16px / 2 ));
	margin-bottom: 16px;
	background: #fff;
}
.dashboardWrap .dashLine3 > div:last-of-type { margin-bottom: 0; }

.dashboardWrap .dashLine3 > div .detail{
   display: flex;
    flex-direction: row;
}

.dashboardWrap .dashLine3 .dash05 .detail > div {
	width: 55%;
    height: 100%;
}
.dashboardWrap .dashLine3 .dash05 .detail > div:last-of-type {width:45%;}
.dashboardWrap .dashLine3 .dash05 .img { 
	padding-right: 8px;
}
.dashboardWrap .dashLine3 .dash05 .img img {
	width:100%;
	height:100%;
	object-fit: cover;
}
.dashboardWrap .dashLine3 .dash05 .img_no {
	background:#fbfbfb url(/images/common/icon_noImg.svg)no-repeat center; 
}

.dashboardWrap .dashLine3 .dash05 .img_no img {display:none;}

.dashboardWrap .dashLine3 .dash05 .info {
	width:100%;
	height:100%;
	font-size: 0.9rem;
	/* padding-left:8px; */
	display: flex;
    flex-direction: column;
    justify-content: space-between;
   /*  border-top: 6px solid #375394; */
/*     background: #f7f6fb;
    border-top: 6px solid #375394 !important; */
}
.dashboardWrap .dashLine3 .dash05 .info li {
	color: #222;
	display: flex;
    align-items: center;
    height: 27px;
	line-height: 27px;
	background: rgba(135, 138, 166, 0.10);
}
.dashboardWrap .dashLine3 .dash05 .info li:first-child{
	background:#fff;
}

.dashboardWrap .dashLine3 .dash05 .info li span {
	display:inline-block;
	height: 100%;
	font-weight: 600;
}
.dashboardWrap .dashLine3 .dash05 .info li span:first-of-type {
	width: 84px;
	color:#878AA6;
	text-indent: 8px;
	font-weight: 600;
} 
.dashboardWrap .dashLine3 .dash05 .info li span:last-of-type {
	width: calc(100% - 84px);
    padding: 0 8px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 14px;
    color: #666;
}
.dashboardWrap .dashLine3 .dash05 .info li:first-of-type span{
	width: 100%;
	text-align: center;
	background: #3689FF;
	font-size: 16px;
	height: 28px;
	line-height: 28px;
	color: #fff;
	border-radius: 15px 15px 0px 0px;
}
.dashboardWrap .dashLine3 .dash06 .detail > div {
	width: 100%;
	color: #222;
}
.dashboardWrap .dashLine3 .dash06 .detail .deta {
	height: 30px;
}
.dashboardWrap .dashLine3 .dash06 .detail .deta span {font-weight: 600;}
.dashboardWrap .dashLine3 .dash06 .detail .chartWrap {
	height: 100%;
}
.dashboardWrap .dashLine3 .dash06 .detail .chartWrap > div {
	position: relative;
	width: calc(50% - 8px);
	height: calc(50% - 8px);
	float: left;
	margin-right: 16px;
	margin-bottom: 16px;
}
.dashboardWrap .dashLine3 .dash06 .detail .chartWrap > div:nth-of-type(even){
	margin:0;
}
.dashboardWrap .dashLine3 .dash06 .detail .chartWrap > div:nth-of-type(n+3){
	margin-bottom: 0;
}
/* .dashboardWrap .dashLine3 .dash06 .detail .chartWrap > div > .text {
	position: absolute;
	top:0;
	left:0;
	font-weight: 600;
	font-family: 'Pretendard';
	z-index: 100;
    background: rgba(255,255,255, 0.5);
} */
.dashboardWrap .dashLine3 .dash06 .detail .chartWrap > div > .text P:last-of-type {
	letter-spacing: 1px;	
}
.dashboardWrap .dashLine3 .dash06 .detail .chartWrap > div > .chart {
	width:100%;
	height: calc(100% - 18px);
}
/* .dashboardWrap .dashLine3 .dash06 .detail .chartWrap > div > .text p:last-of-type{
	margin-top: 4px;
	font-size: 18px;
} */
.dashboardWrap .dashLine3 .dash07 .detail { 
	padding: 8px 16px 16px 16px;
	flex-wrap: wrap;
}
.dashboardWrap .dashLine3 .dash07 .detail > div {
	color:#222; 
	height:50%; 
}

 

/*===================== chart error =====================*/

.dataTitle {
	position: relative;
    text-align: center;
    vertical-align: text-bottom;
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    background:url(/images/common/icon_dataTitle.svg) no-repeat center;
    font-size: 0;
}
/*
.dataTitle p{
	position: absolute;
	 top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-top:80px;
    font-size:0px;
}
.dataTitle span:first-of-type {
	position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    line-height:60px;
    border-radius: 50%;
    background: #ddd;
    font-weight: bold;
    font-size: 48px;
    color: #fbfbfb;
    vertical-align: middle;
    z-index: 1;
}
 .dataTitle span:first-of-type:after{
	content: "조회된 데이터가 없습니다.";
	top:0;
	left:0;
	margin-left: -35px;
	color:#666;
	font-size: 14px;
	white-space: nowrap;
}
 */

/*=========highchart_grid css============*/
.contentArea .view .detail { 
	overflow: hidden; 
	width:100%; 
	padding: 0 10px; 
}

.contentArea .view .detail>#gridBase>div,
.contentArea .view .detail>#gridDetail>div,
.contentArea .view .detail>#gridPrmtDetail>div,
.contentArea .view .detail>#gridEqpDetail>div,
.contentArea .view .detail>#gridTree>div,
.contentArea .view .detail>#gridSub>div{
	width:calc(100% + 3px)!important;
	margin-left:-1px;
}

/* #chart01>div, #chart02>div, #lineChart>div{ margin-top:16px; } */

/*
=== footer layout property ===
 占쏙옙 footer area is in SectionArea 占쏙옙
*/
/*=== footer layout property ===*/
/*=== footer layout property ===*/

footer {
    margin-top: auto;
    padding-bottom:5px;
    text-align: right;
    padding-right: 16px;
    font-size: 13px;
    color: #888;
}
footer ul{
	display:flex;
	justify-content: flex-end;
	align-items: center;
	gap:0 20px;
}
footer ul li{
	display:flex;
	align-items: center;
	gap:0 5px;
}
footer ul li span{
	border-radius: 20px;
	background: #D9D9D9;
	height: 21px;
	line-height: 21px;
	color:#333;
	font-size:13px;
	padding:0 10px;
}

/*=== popup layout property ===*/
/*=== popup layout property ===*/
/*=== popup layout property ===*/

.popupWrap {
/*     display: flex; */
    width: 100%;
    height: 100%;
    padding: 8px;
    background: #eaebef;
    
}
.popupWrap:after {
    content: "";
    display: block;
    clear: both;
}
.popupWrap .view {
    display: flex;
    flex: 1 0 auto;
    flex-direction: column;
    background: #fff;
    border: 1px solid #eee;
}
.popupWrap .view:after {
    content: "";
    display: block;
    clear: both;
}
.popupWrap > .searchView:after {
    content: "";
   display:none;
}
.popupWrap .view .title, .popupWrap .searchView .title {
    width: 100%;
    height: 40px;
    line-height: 40px;
    /*background: #ededed;*/
    border-bottom: 2px solid #616b88;
    font-family: 'notoSansR',sans-serif;
}
.popupWrap .view .title > h3, .popupWrap .searchView .title > h3 {
    display: inline-block;
    margin: 0px 8px;
    line-height: 40px;
    color: #222;
    font-size: 16px;
  /*   background: url(/images/common/popup_icon.png)no-repeat left; */
    background-size: 20px;
    font-family: 'Pretendard-M';
}

.popupWrap .view .detail,.popupWrap .view .detail2 {
    display: flex;
    flex: 1 0 auto;
}
.popupWrap .view .detail:after {
    content: "";
    display: block;
    clear: both;
}
.popupWrap .view .detail form>div{
	/* width:100%; */
}
.popupWrap .view .detail2 form>div{
	width:100%;
}

.popupWrap .searchView ul {
	margin-top: 8px;
}


.popupWrap form {
	display: flex;
	flex-direction: column;
    width: 100%;
    /* margin-top:8px; */
}
.popupWrap form:after {
    content: "";
    display: block;
    clear: both;
}
.popupWrap .table01 {
	width:100%;
}
.popupWrap .table01 tr {
	width:100%;
	vertical-align:middle;
    border-bottom: 1px solid #bbb !important;
}
.popupWrap .table01 tr:last-of-type { 
    border-bottom: none;
}
.popupWrap .table01 th {
    vertical-align: middle;
    width: 170px;
}
.popupWrap .table01 input {
	width: 95%;
    height:32px;
	line-height:32px;
    margin: 12px 0px;
}
.popupWrap .table01 select {
	width: 95%;
    height:32px;
	line-height:32px;
    margin: 12px 0px;
   /*  border: 1px solid #ddd; */
}
.popupWrap .table01 textarea {
    display: block;
    width: 95%;
    min-height: 100px;
    margin: 12px 0px;
	resize: none;
	background: #f2f3f5;
	/* border: 1px solid #ddd; */
}
.popupWrap .table01 input:focus{
	border:1px solid #afb9ce;
}
.popupWrap .btnSet {
    /*margin-top: auto;*/
    float: right;
    margin-left: auto;
    padding: 0 8px;
}
.popupWrap .btnSet:after {
    content: "";
    display: block;
    clear: both;
}
.popupWrap .btnSet button {
    float: left;
    min-width: 86px;
    height: 28px;
    line-height: 24px;
    margin-right: 8px;
    border-radius: 4px;
    outline: 0;
}
.popupWrap .btnSet>#btnSave>button {
	margin-right: 8px;
}
.popupWrap .btnSet>#btnCancel>button {
	margin-right: 8px;
}
.popupWrap .btnSet button:last-of-type {
    margin-right: 0px;
}

.popupWrap .pupbtn{
	float:right;
	margin-top:10px;
	margin-right: 8px;
	padding: 0px 8px;
	height:20px;
	line-height:20px;
	border-radius:3px;
	background:#afb9ce;
	border:none;
	color:#fff;
	cursor:pointer;
}
.popupWrap .view .detail2 .btnSet button {
	float: right;
    margin-right: 8px;
}

.popupWrap .view .detail2 .btnSet:nth-of-type(1){
	margin-bottom: 20px;
	padding-bottom:16px;
	border-bottom: 1px solid #ddd;
}

.popupWrap .table01 .AXanchor a{
	height: 53px !important;
}

.popupWrap .searchView {
	border:none;
	background: transparent;
	padding: 0;
	box-shadow: none;
	margin-top: 0px;
}

.popupWrap .searchView .detail {
	background: transparent;
	position: relative;
}
.popupWrap .serchBtn {
	height: 32px;
}

.boxTitle {
    width: 100%;
    height: 40px;
    line-height: 40px;
    /* background: #ededed; */
    border-bottom: 2px solid #ddd;
    : 'notoSansR',sans-serif;
}
.boxTitle .fontTitle {
    padding-left: 8px;
/*     margin: 0px 8px; */
    line-height: 40px;
    font-weight: 600;
    font-size: 16px;
    width: 100%;
    /* background: url(/images/common/ic_popup.svg)no-repeat left; */
    color: #fff;
}

.AXButton { 
	margin-left: 8px !important;
	background: #bac4da !important; 
    border:none !important; 
    border-radius: 4px !important; 
    color: #222 !important;
    text-shadow: none !important;
}
.AXButton[disabled] { 
	background: #59585d !important; 
	border:none !important; 
	border-radius: 4px !important;
	color: #fbfbfb !important; 
}
.AXButton[disabled]:focus, 
.AXButton[disabled]:hover { background: #59585d !important; }
.AXButton.Blue{ 
	margin-top: 15px; 
	margin-left: 0px !important;
	background: #234791 !important; 
	border:none !important; 
	border-radius: 4px !important;
	color: #fff !important;
}
.AXButton.Blue:hover { 
	transition-duration: 0.3s;
    opacity: 0.8;
}

.popupWrap .AXButton.Blue{
	margin-top: 0; 
}
.popupWrap #AXPageUpload5 {
	padding: 0 8px;
}
.popupWrap .AXUpload5{
	margin: 8px 0;
}
.popupWrap #AXPageUpload5 div:nth-of-type(2) input {
	background: #fff !important;
    border: 1px solid #bbb !important;
    border-radius: 4px !important;
    color: #666!important;
    font-size: 1em !important;
    height: 24px!important;
    line-height: 26px !important;
    margin: 0;
    box-shadow: none;
    margin-top: 9px;
}
.popupWrap #AXPageUpload5 div:nth-of-type(2) input:hover {
	border: 1px solid #ef5c48 !important;
    color: #ef5c48 !important;
    transition-duration: 0.3s;
}
.popupWrap .AXUpload5QueueBox_list.allowDrop {
	border:none;
}
.popupWrap .AXUpload5QueueBox_list .AXUploadItem .AXUploadIcon {
	width: 80px !important;
    height: 80px !important;
}
.popupWrap .AXUpload5QueueBox_list .AXUploadItem .AXUploadTit {
	color: #222;
    margin-left: 80px;
    width: 357px;
    word-break: break-all !important;
    white-space: break-spaces !important;
    margin-top: 6px;
}
.popupWrap .AXUpload5QueueBox_list .AXUploadItem .AXUploadIcon {
	display: block;
	overflow: hidden; 
	margin-top: 10px;
    margin-left: 10px;
}
.popupWrap .AXUpload5QueueBox_list .AXUploadItem .AXUploadIcon img {
	width: 100%;
}
.popupWrap .AXUpload5QueueBox_list .AXUploadItem {
	overflow: hidden !important;
}
.popupWrap .AXUpload5QueueBox_list .AXUploadItem .AXUploadProcess {
	left: 74px !important;
    top: -14px !important;
}

.popupWrap .AXUploadItem {
	
}
.popupWrap .AXUpload5QueueBox_list .AXUploadItem .AXUploadLabel {
	left: 431px !important;
}
.popupWrap .AXUpload5QueueBox_list .AXUploadItem .AXUploadSize {
	float: right;
    padding-right: 18px;
    color: #222;
    font-size: 12px !important;
}
.AXUpload5QueueBox_list .AXUploadItem.beSelected {
	background: #fff !important;
}

.popupWrap .zebCtfc .AXButton.Blue {
	/* margin-top: 13px; */
}
.popupWrap .zebCtfc .AXUpload5QueueBox_list .AXUploadItem .AXUploadIcon {
    width: 80px !important;
    height: 49px !important;
}
.popupWrap .zebCtfc .AXUpload5QueueBox_list .AXUploadItem .AXUploadProcess {
    left: 74px !important;
    top: -41px !important;
}

.popUpView {
	display: flex;
    flex: 1 0 auto;
    flex-direction: column;
    background: #49484c;
    border: 1px solid #59585c;
}
.popUpView .popUpTitle {
	border-bottom: 2px solid #616b88;
	height: 40px;
    line-height: 40px;
    color: #fff;
    padding-left: 8px;
}
.popUpView .detail input {padding: 4px;}
.popUpView #btnExcelUpload {
	background: transparent;
    border: 1px solid #7785ce;
    min-width: 95px;
    color: #fff;
    font-size: 16px;
    height: 30px !important;
    margin-left: 4px;
    margin-right: 4px;
}
.popUpView #btnExcelUpload:hover:before,
.popUpView #btnExcelUpload:hover:after {
	display:none;
}
.popUpView .btnEmp {
	width: 95px;
	margin: 0 auto;
    margin-top: 8px;
    height: 30px !important;
}
.popUpView p { 
	color: #ef5c48;
    margin-top: 12px;
    width: 100%;
    text-align: center;
}
/*=== sysUserPswdChange property ===*/
/*=== sysUserPswdChange property ===*/
/*=== sysUserPswdChange property ===*/

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

.pswdForm {
	margin: auto 0;
	align-items: center;
	justify-content: center;
	width:50%;
	min-width: 500px;
	max-width: 50%;
	background: linear-gradient( 90deg, #1f1e22 23%, #262529 48%, #1f1e22 74%);
	border: none;
	border-radius: 5px;
	text-align: center;
}

.titleBox p {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #eee;
	vertical-align: middle;
	font-weight: bold;
	font-size: 48px;
	z-index:1;
}

.titleBox span{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: #fbfbfb;
}

.pswdForm h1 {
	display: inline-block;
	width: 80%;
	font-size: 24px;
	line-height: 60px;
	text-align: center;
	color: #7985d7;
	font-weight: 600;
	margin-bottom: 30px;
}

.pswdForm ul {
	margin-top: 16px;
	display: inline-block;
	text-align: center;
}

.pswdForm li {
	height: 48px;
	margin-bottom: 8px;
	vertical-align: middle;
	text-align: left;
}
.pswdForm label{
	margin-right: 30px;
	color: #696f73;
}

.pswdForm input {
	width: 270px;
	height: 36px;
	padding: 0px 8px;
	line-height: 28px;
	border-bottom: 1px solid #696f73;
	background: transparent;
	outline:0;
	color: #bbb;
}
.pswdForm input:hover,.pswdForm input:focus{
	border-bottom: 1px solid #696f73;
	outline:0;
}
.pswdForm .btnEmp {
	width: 250px;
	height: 40px;
	margin: 24px 0px 36px;
	border-top: 1px solid #999;
	background: #7985d7;
	border-radius: 5px;
}

.pswdForm .btnEmp:hover {
	background: #939fef;
}

/*=== login error property ===*/
/*=== login error property ===*/
/*=== login error property ===*/

#pageError {
	width:100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align:center;
	padding: 1%;
	color: #222;
}

#pageError div {
	margin: auto 0;
}

.errorTitle {
	position: relative;
	padding-top:8%;
}
.errorTitle h1 {
	margin-left: -7px;
	font-size:8.5rem;
	line-height:280px;
	color:#eee;
}
.errorTitle div {
	width: 280px;
    height: 280px;
    border-radius: 50%;
    background: #fff;
}
.errorBox p {
	margin-top:8%;
	font-size:18px;
	color: #7d7d7d;
}
#pageError .btnLogin {
	margin-top:13%;
	padding: 8px 40px;
	display:inline-block;
	background: #869ce7;
	color: #fbfbfb;
	border-radius: 5px;
	text-decoration: none;
	font-size: 18px;
}
#pageError h4 {
	padding-top:100px;
}


/*=== login layout property ===*/
/*=== login layout property ===*/
/*=== login layout property ===*/

#loginWrap {
    /* min-width: 1300px;
    min-height: 900px; */
    display: flex;
    height: 100%;
    overflow: hidden;
}
#loginWrap form{
	display: flex;
    width: 100%;
}
#loginWrap .loginImage {
	display: flex;
	align-items: center;
    flex: 1 1 auto; 
    background:url(/images/common/login_background.jpg)no-repeat center center; 
    background-size:cover;
    padding-left: 19%;
}
/*
#loginWrap .loginImage .text {
    width: 100%;
    height: 100%;
    background: rgba(256, 256, 256, 0.5);
    line-height: 100%;
    font-weight: 900;
    padding: 120px;
    color: #333;
}
#loginWrap .loginImage .text .main {
    display: block;
    font-size: 5em;
    margin-bottom: 48px;
}
#loginWrap .loginImage .text .sub {
    display: block;
    font-size: 2em;
}
*/
#loginWrap .loginBox {
	position: relative;
	width:800px;
	height: 100%;
    display: flex;
    flex-direction: column;
    
}
#loginWrap .loginBox > div{
	display: flex;
    align-items: center;
    justify-content: center;
	width: 100%;
    height: 100%;
    background: #fff;
    z-index:10005;
    border-radius: 400px 0 0 0;
    box-shadow: 0 1rem 1rem hsl(0deg 0% 0% / 9%);
}
#loginWrap .loginBox .logo {
    margin: 56px 0 48px 0;
    text-align:center;
}
#loginWrap .loginBox .logo h1 {
	position: relative;
	color: #102759;
	font-size:56px;
	font-weight: 700;
	font-family: 'Encode Sans Condensed', sans-serif;
}
#loginWrap .loginBox .logo h1:before{
	content: "";
	position: absolute;
	top: -2px;
    left: 178px;
	width:36px;
	height:36px;
    background: url(/images/common/login_logo.svg)no-repeat center;
    background-size: 130%;
}
#loginWrap .loginBox .logo img {
    width: 200px;
    background-repeat: no-repeat;
    background-size: contain;
}
#loginWrap .loginBox ul {
    margin: auto;
    width: 500px;
    text-align:center;
}


#loginWrap .loginBox ul li p { margin:25px auto 0; background: transparent; }
#loginWrap .loginBox ul li p { position:relative; width:100%; height:70px; } 
#loginWrap .loginBox ul li p input { 
    box-sizing:border-box; 
    width:100%; 
    height:100%; 
    border-bottom: 2px solid #333;
    outline:none; 
    background: #fff; 
    color:#222;
    border-radius: 0;
    font-family: 'Encode Sans Condensed', sans-serif;
    font-weight:600;
    font-size:22px;
}
#loginWrap .loginBox ul li p input::placeholder {
	color: #C2C2C2;
}


#loginWrap .loginBox ul li p input:-webkit-autofill,
#loginWrap .loginBox ul li p input:-webkit-autofill:hover,
#loginWrap .loginBox ul li p input:-webkit-autofill:active {
	  transition: background-color 5000s ease-in-out 0s;
    -webkit-text-fill-color: #222 !important;
}
   
#loginWrap .loginBox ul li .btnSign {
    width: 400px;
    height: 80px;
    line-height: 80px;
    margin:54px auto 30px;
    background: #1E2756;
    border:none;
    border-radius: 10px;
    outline-style:none;
    color: #D3EEF8;
    font-size: 30px;
    font-weight: 600;
    font-family: 'Encode Sans Condensed', sans-serif;
}
#loginWrap .loginBox ul li .btnSign:hover{
	background: #3d5996;
	transition-duration: 0.3s;
}
#loginWrap .loginBox ul li.checkbox {
	float: left;
	margin-top: 38px;
}
#loginWrap .loginBox ul li.checkbox input[type="checkbox"]  {
	position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0
}
#loginWrap .loginBox ul li.checkbox input[type="checkbox"] + label  {
	display:inline-block; 
	vertical-align:middle; 
	line-height:35px; 
	position:relative; 
	padding-left:45px; 
	cursor:pointer; 
	-webkit-user-select:none; 
	-moz-user-select:none; 
	-ms-user-select:none;
	font-size:22px; 
	color: #C2C2C2;
	font-weight: 600;
    font-family: 'Encode Sans Condensed', sans-serif;
}
#loginWrap .loginBox ul li.checkbox input[type="checkbox"] + label:before{
	content:'';
	position:absolute;
	left:0px;
	top:0px;
	margin:0;
	width:35px;
	height:35px;
	text-align:center;
	box-sizing:border-box;
	 border-radius:6px; 
	 background-color: #D3EEF8; 
	 border:1px solid #D3EEF8; 
	 transition: background-color .15s ease-in-out,background-position .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
#loginWrap .loginBox ul li.checkbox input[type="checkbox"]:checked + label:before {
	background:#1E2756; border-color:#1E2756;
}
#loginWrap .loginBox ul li.checkbox input[type="checkbox"]:checked + label:after {
	content:""; display:block; 
	position:absolute; 
	left:2px; 
	top:2px; 
	width:31px; 
	height:31px; 
	background:url('/images/common/icon_check.svg')no-repeat 50% 50%;
	background-size:cover;
}
#loginWrap footer {
    margin-top: auto;
    height: 24px;
    line-height: 24px;
    text-align: center;
    padding-left: 8px;
    font-size: 14px;
    color: #888;
}

/*=== calender ===*/
.AXbindDateExpandBox {
	box-shadow: 4px 5px 5px rgb(0 0 0 / 28%) !important;
	padding: 8px !important;
	border-radius: 3px !important;
}

.AXbindDateExpandBox .dateControlBox { 
	border: none !important;
    background: #fff !important;
    font-weight: 600;
}
.AXbindDateExpandBox .dateControlBox a {
	color: #222 !important;
	text-shadow: none !important;
}

.AXbindDateExpandBox .dateDisplayBox,
.AXCalendar table.calendarPage thead td,
.AXCalendar table.calendarPage tbody td {
	border: none !important;
	font-weight: 600;
}
.AXCalendar table.calendarPage thead td.dayofweek_0,
.AXCalendar table.calendarPage tbody td.bodyCol_0 A.calendarDate {
	color: red !important;
}
.AXCalendar table.calendarPage thead td.dayofweek_6 {
	color: #0000ff !important;
}

.AXCalendar table.calendarPage tbody td.bodyCol_0 A.calendarDate.notThisMonth, 
.AXCalendar table.calendarPage tbody td.bodyCol_1 A.calendarDate.notThisMonth, 
.AXCalendar table.calendarPage tbody td.bodyCol_2 A.calendarDate.notThisMonth, 
.AXCalendar table.calendarPage tbody td.bodyCol_3 A.calendarDate.notThisMonth,
.AXCalendar table.calendarPage tbody td.bodyCol_4 A.calendarDate.notThisMonth, 
.AXCalendar table.calendarPage tbody td.bodyCol_5 A.calendarDate.notThisMonth, 
.AXCalendar table.calendarPage tbody td.bodyCol_6 A.calendarDate.notThisMonth {color: #bfbfc1!important;}

.AXCalendar table.calendarPage tbody td {
	background: #fff !important;
}
.AXCalendar table.calendarPage tbody td a {
	font-weight: normal !important;
}

.AXCalendar table.calendarPage tbody td A.calendarDate
.AXCalendar table.calendarPage tbody td A.calendarDate.selected, 
.AXCalendar table.calendarPage tbody td A.calendarDate:active {
	background: #dae3f4 !important;
    color: #254389 !important;
    box-shadow: none !important;
    font-weight: 600 !important;
}

.AXCalendar table.calendarPage tbody td.setDate {
	background: #dae3f4 !important;
    border-radius: 50%;
    color: #254389 !important;
}
.AXCalendar table.calendarPage tbody td.setDate > a {font-weight: 600 !important;}
.AXCalendar table.calendarPage tbody td A.calendarDate:hover {
	 border-radius: 50%;
}
.AXbindDateExpandBox .dateControlBox .prevbutton:hover,
.AXbindDateExpandBox .dateControlBox .nextbutton:hover {
	background-position-y: 0px !important;
}

.AXCalendar table.calendarPageMonth tbody td.setDate {
	background: #dae3f4 !important;
    color: #254389 !important;
}
.AXCalendar table.calendarPageMonth tbody td {
	background : #fcfcfc !important;
}
.AXCalendar table.calendarPageMonth tbody td {
	border-right: 1px solid #eee !important;
    border-bottom: 1px solid #eee !important;
}
.AXCalendar table.calendarPageMonth tbody td A.calendarMonth:hover {
    background: #dae3f4 !important;
}


/*=== custom layout property ===*/
/*=== custom layout property ===*/
/*=== custom layout property ===*/

.main-header .nav-link{
	 font-family: 'DWImpactamin';
}
.content-tabs .page-tabs a span,
.content-tabs button ,
.sidebar-menu .treeview-menu > li > a{
	font-weight: 500;
	font-family: 'Pretendard';
}

/*-----   size   -----*/

.w10 {width: 100px !important;}     .w110 {width: 110px !important;}
.w20 {width: 20px !important;}     .w120 {width: 120px !important;}
.w30 {width: 30px !important;}     .w130 {width: 130px !important;}
.w40 {width: 40px !important;}     .w140 {width: 140px !important;}
.w50 {width: 50px !important;}     .w150 {width: 150px !important;}
.w60 {width: 60px !important;}     .w160 {width: 160px !important;}
.w70 {width: 70px !important;}     .w170 {width: 170px !important;}
.w80 {width: 80px !important;}     .w180 {width: 180px !important;}
.w90 {width: 90px !important;}     .w190 {width: 190px !important;}
.w100 {width: 100px !important;}   .w200 {width: 200px !important;}
.w300 {width: 300px !important;}

.w100p { float: left; width: 100%; }
.w20L { float: left; width: 20%; margin-right: 16px; }
.w30L { float: left; width: 30%; margin-right: 16px; }
.w40L { float: left; width: 40%; margin-right: 16px; }
.w45L { float: left; width: 45%; margin-right: 16px; }
.w50L { float: left; width: 50%; margin-right: 16px; }
.w60L { float: left; width: 60%; margin-right: 16px; }
.w70L { float: left; width: 70%; margin-right: 16px; }
.w80L { float: left; width: 80%; margin-right: 16px; }

.w20R { float: left; width: calc(20% - 16px); }
.w30R { float: left; width: calc(30% - 16px); }
.w40R { float: left; width: calc(40% - 16px); }
.w50R { float: left; width: calc(50% - 16px); }
.w55R { float: left; width: calc(55% - 16px); }
.w60R { float: left; width: calc(60% - 16px); }
.w70R { float: left; width: calc(70% - 16px); }
.w80R { float: left; width: calc(80% - 16px); }

.w200fixL { float: left; width: 200px; margin-right: 8px; }
.w200fixR { float: left; width: calc(100% - 208px); }
.w300fixL { float: left; width: 300px; margin-right: 8px; }
.w300fixR { float: left; width: calc(100% - 308px); }
.w400fixL { float: left; width: 400px; margin-right: 8px; }
.w400fixR { float: left; width: calc(100% - 408px); }


/*-----   resize   -----*/
/*etc*/
/*etc*/
/*etc*/

@-webkit-keyframes slide-left {
      0% { opacity: 0; -webkit-transform: translateX(-100%); }
    100% { opacity: 1; -webkit-transform: translateX(0); }
}
@-moz-keyframes slide-left {
      0% { opacity: 0; -moz-transform: translateX(-100%); }
    100% { opacity: 1; -moz-transform: translateX(0); }
    
/*=================================  mediaQuarry  =================================*/

@media (max-width: 1600px){
	/*=== login layout property ===*/
	#loginWrap {background-position-y: 30%;}
}


@media (max-width: 1440px){
	/*=== login layout property ===*/
	#loginWrap .loginBox {}
	#loginWrap .loginBox .left {height: 100%;}
	#loginWrap .loginBox .right {
		margin-left: 0;
		display: flex;
    	align-items: center;
    	flex-direction: column;
    }
	#loginWrap .loginBox .logo {margin-top: 30px;}
}

@media (max-width: 1290px){
	/*=== login layout property ===*/
	#loginWrap {min-width: auto;}
	#loginWrap .loginBox {width: 100vw; justify-content: center;}
	#loginWrap .loginBox .left {width:60%; overflow: hidden;}
	#loginWrap .loginBox .right {width:40%;}
	
	#loginWrap form{ width: 100vw;}
	#loginWrap .loginBox ul {width:80%;}
	#loginWrap .loginBox ul li input { height: 48px; line-height: 48px; }
	#loginWrap .loginBox .logo img { width: 80%; }
	#loginWrap .loginBox ul li .btnSign { padding: 0; font-size: 14px; }
}

@media (max-width: 1240px) {
	#loginWrap .loginBox .logo h1 span:nth-of-type(1) {font-size: 4.5rem;}
	#loginWrap .loginBox .logo h1 span:nth-of-type(2) {letter-spacing: 0.05rem;}
	#loginWrap .loginBox .left {width: 50%;}
	#loginWrap .loginBox .left .img {width: 100%; background-size: 100%;}
}


@media (max-width: 1024px) {
	#loginWrap {background:#f2f7fa;}
	#loginWrap .loginBox { position: relative; height: 100vh;}
	#loginWrap .loginBox .left {
/* 		width: 60%; 
		height: 75%;
		position: absolute; 
		background: #b5c5d2;
    	opacity: 0.2;
    	border-radius: 8px; */
    	display: none;
    }
	#loginWrap .loginBox .right { 
		background: rgba(181,197,210,0.2); 
		width: 60%; 
		max-width: 460px;
		border-radius: 4px; 
		z-index:10;
	}
	#loginWrap .loginBox .logo {margin-top: 15%;}
	#loginWrap .loginBox .logo h1 span {text-align: center; text-indent: 8%;}
	#loginWrap .loginBox .logo h1 span:nth-of-type(2) {text-indent:0;}
	
	#loginWrap .loginBox .logo h1 span:nth-of-type(1):hover:after {display: none;}
	
	#loginWrap .loginBox ul { width: 80%; }
	#loginWrap .loginBox ul li input,
	#loginWrap .loginBox ul li label,
	#loginWrap .loginBox ul li .btnSign {width:100%;}
	
	#loginWrap footer {padding-right: 0;}
}


@media (max-width: 670px){
	/*=== login layout property ===*/
	#loginWrap .loginBox .left,	
	#loginWrap .loginBox .right {width:70%;}
	#loginWrap .loginBox .logo h1 span:nth-of-type(1){font-size: 4rem;}
	#loginWrap .loginBox .logo h1 span:nth-of-type(2){text-indent:0;}
}


@media (max-width: 540px){
	/*=== login layout property ===*/
	#loginWrap .loginBox .logo h1 span:nth-of-type(1){font-size: 3rem; letter-spacing: 1rem; margin-bottom: 8px;}
	#loginWrap .loginBox .logo h1 span:nth-of-type(2) {font-size: 0.75rem;}
	#loginWrap .loginBox ul li {margin-bottom: 16px;}
	#loginWrap footer {font-size: 0.5rem;}
	#loginWrap .loginBox .logo h1 span:nth-of-type(2) {letter-spacing:0;}
}

@media (max-width: 414px){
	/*=== login layout property ===*/
	#loginWrap .loginBox .logo h1 span:nth-of-type(2) {font-size: 0.5rem;}
	#loginWrap .loginBox ul li label {font-size:12px;}
	#loginWrap .loginBox ul li input {height: 36px; line-height: 36px;}
	#loginWrap .loginBox .logo h1 span {text-indent: 6%;}
}

@media (max-width: 320px){
	/*=== login layout property ===*/
	#loginWrap .loginBox .left, #loginWrap .loginBox .right {width: 85%;}
}

@media (max-width: 280px){
	/*=== login layout property ===*/
	#loginWrap .loginBox .logo h1 span {text-indent: 3%;}
	#loginWrap .loginBox .logo h1 span:nth-of-type(2){text-indent: -3%;}
}