/*占쏙옙占쏙옙占쏙옙 占싸듸옙*/
#loading-page {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../images/progress/bigcircleball.gif') 50% 50% no-repeat #fff;
}

.uploader {
  display: block;
  clear: both;

  width: 100%;
  max-width: 600px;
}
.uploader label {

  clear: both;
  width: 100%;
  padding: 2rem 1.5rem;
  text-align: center;
  background: #fff;
  border-radius: 7px;
  border: 3px solid #eee;
  transition: all 0.2s ease;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.uploader label:hover {
  border-color: #454cad;
}
.uploader label.hover {
  border: 3px solid #454cad;
  box-shadow: inset 0 0 0 6px #eee;
}
.uploader label.hover #start i.fa {
  transform: scale(0.8);
  opacity: 0.3;
}
.uploader #start {
  float: left;
  clear: both;
  width: 100%;
}
.uploader #start.hidden {
  display: none;
}
.uploader #start i.fa {
  font-size: 50px;
  margin-bottom: 1rem;
  transition: all 0.2s ease-in-out;
}
.uploader #response {
  float: left;
  clear: both;
  width: 100%;
}
.uploader #response.hidden {
  display: none;
}
.uploader #response #messages {
  margin-bottom: 0.5rem;
}
.uploader #file-image {
  display: inline;
  margin: 0 auto 0.5rem auto;
  width: auto;
  height: auto;
  max-width: 180px;
}
.uploader #file-image.hidden {
  display: none;
}
.uploader #notimage {
  display: block;
  float: left;
  clear: both;
  width: 100%;
}
.uploader #notimage.hidden {
  display: none;
}
.uploader progress,
.uploader .progress {
  display: inline;
  clear: both;
  margin: 0 auto;
  width: 100%;
  max-width: 180px;
  height: 8px;
  border: 0;
  border-radius: 4px;
  background-color: #eee;
  overflow: hidden;
}
.uploader .progress[value]::-webkit-progress-bar {
  border-radius: 4px;
  background-color: #eee;
}
.uploader .progress[value]::-webkit-progress-value {
  background: linear-gradient(to right, #393f90 0%, #454cad 50%);
  border-radius: 4px;
}
.uploader .progress[value]::-moz-progress-bar {
  background: linear-gradient(to right, #393f90 0%, #454cad 50%);
  border-radius: 4px;
}
.uploader input[type=file] {
  display: none;
}
.uploader div {
  margin: 0 0 0.5rem 0;
  color: #5f6982;
}
.uploader .btn {
  display: inline-block;
  margin: 0.5rem 0.5rem 1rem 0.5rem;
  clear: both;
  font-family: inherit;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  text-transform: initial;
  border: none;
  border-radius: 0.2rem;
  outline: none;
  padding: 0 1rem;
  height: 36px;
  line-height: 36px;
  color: #fff;
  transition: all 0.2s ease-in-out;
  box-sizing: border-box;
  background: #454cad;
  border-color: #454cad;
  cursor: pointer;
}

/* dragAndDrop */
.dragAndDropDiv {
	
    border: 2px dashed #92AAB0;
    width: 500px;
    height: 290px;
    color: #92AAB0;
    text-align: center;
    vertical-align: middle;
    padding: 10px 0px 10px 10px;
    font-size:200%;
    display: table-cell;
    margin-top: 12px;
    margin-right: 50px;
}
.progressBar {
    width: 200px;
    height: 22px;
    border: 1px solid #ddd;
    border-radius: 5px; 
    overflow: hidden;
    display:inline-block;
    margin:0px 10px 5px 5px;
    vertical-align:top;
}
 
.progressBar div {
    height: 100%;
    color: #fff;
    text-align: right;
    line-height: 22px; /* same as #progressBar height if we want text middle aligned */
    width: 0;
    background-color: #0ba1b5; border-radius: 3px; 
}
.statusbar{
   
    min-height:25px;
    width:99%;
    padding:10px 10px 0px 10px;
    vertical-align:top;
}
.statusbar:nth-child(odd){
    background:#EBEFF0;
}
.filename{
    display:inline-block;
    vertical-align:top;
    width:250px;
}
.filesize{
    display:inline-block;
    vertical-align:top;
    color:#30693D;
    width:100px;
    margin-left:10px;
    margin-right:5px;
}
.abort{
    background-color:#A8352F;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;display:inline-block;
    color:#fff;
    font-family:arial;font-size:13px;font-weight:normal;
    padding:4px 15px;
    cursor:pointer;
    vertical-align:top
}

/* searchArea */
.searchArea {
	border: 1px solid #c8c8c8;
	
}
.searchArea2 {
	border-bottom: 1px solid #c8c8c8;
	padding: 5px;
}


.hidden {display:none}
.datepicker {z-index: 9999 !important;}
.datepicker-area .ui-datepicker-trigger img {width: 24px; z-index: 9999 !important;}

.dynamicTable {
	width: 90%;
}
.fs {
	font-size: 12px;
}

/* table thead fix tbody scroll */
.table-fixed{

}



.table-scroll-y {height: 196px; overflow: hidden; overflow-y: auto;}
.table-scroll-x {overflow: hidden; overflow-x: auto;}
.table-scroll-x .table {width: 150%;}
.table-success td {font-weight: 700;}

.readonly {background-color:#ababab}

/* 占쏙옙占쏙옙占쏙옙占쏙옙占싱쇽옙 */
.tabulator .tabulator-footer {
	justify-content: center!important;
	display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: .25rem;
}
.tabulator .tabulator-footer .tabulator-paginator, .tabulator .tabulator-footer .tabulator-paginator .tabulator-pages {
	display: flex;
}
.tabulator .tabulator-footer .tabulator-page {
	position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #c0c5d1;
    background-color: #fff;
    border: 1px solid #dee2e6;
}
.tabulator .tabulator-footer .tabulator-page.active {
	background-color: #707070;
    border-color: #707070;
    color: #fff;
}
.tabulator .tabulator-footer .tabulator-page-size {
	position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #c0c5d1;
    background-color: #fff;
    border: 1px solid #dee2e6;
}
.tabulator-paginator label {
	color: #6c757d;
	margin: auto;
    padding: 10px;	
}


/* modal fullsize */
.modal-dialog.modal-fullsize {
  max-width: 1600px;
  width: 100%;
  height: 100%;
/*   margin: 0; */
  padding: 0;
}
.modal-content.modal-fullsize {
  height: auto;
  min-height: 100%;
  border-radius: 0; 
  width: 1000px;
}
.modal.modal-center {
  text-align: center;
}
.modal-dialog.modal-center {
  display: inline-block;
  text-align: left;
  vertical-align: middle; 
}

/* 占싸듸옙占쏙옙 */
.loading-modal {position: fixed; top: 50%; width: 100%; max-width: 100%; margin-top: -40px;}
.loading-modal .modal-content {border: 0; text-align: center; background-color: transparent;}
.loading-modal .modal-content .modal-body {border: 0;}


.table>:not(:last-child)>:last-child>* {border-bottom-color: #e5e5e5;}


/* Adding asterisk to required fields */
/* To display an asterisk on the right of the label */
.form-group.required .control-label:after { 
    color: #d00;
    content: "*";
    position: absolute;
    margin-left: 8px;
    top:7px;
}

/* to the left of the label */
.form-group.required .control-label:before {
   color: red;
   content: "*";
   position: absolute;
   margin-left: -15px;
}

.form-group.required .control-label:after { 
    color: #d00;
    content: "*";
    position: absolute;
    margin-left: 8px;
    top:7px;
}

.required:after {
  content:" *";
  color: red;
}


.header .user-function button.msg { width: 22px; height: 22px;border: 2px solid #567293; border-radius: 100%;}
.user-function .msg {display: inline-block; color: #fff; position: relative; padding-left: 32px; font-size: 12px; background-size: 17px;}
.user-function .msg .value {position: absolute; top: 8px; left: 10px; display: inline-block; width: 16px; height: 16px; line-height: 16px; font-size: 10px; border-radius: 100%; background: #e60012; text-align: center; color: #fff; font-style: normal;}

/* notice */
.notice-list li {border-bottom: 1px solid #d4d4d4;}
.notice-list.ui-helper-reset {padding: 0 20px; }
.notice-list.ui-accordion .ui-accordion-header {padding: 15px 30px 15px 0; font-family: 'Noto Sans', sans-serif, serif, '�븷�뵆 SD �궛�룎怨좊뵓 Neo', 'Apple SD Gothic Neo', 'AppleGothic', "�룍��", Dotum; font-size: 14px; letter-spacing: -1px; background: url('../images/arrow-down.png') no-repeat right 24px; background-size: 18px 10px; font-weight: 700;}
.notice-list.ui-accordion .ui-accordion-header .new {display: inline-block; overflow: hidden; background: #f53600; width: 16px; height: 16px; border-radius: 50%; -webkit-border-radius: 50%; margin-top: -3px; vertical-align: middle; color: #f53600;}
.notice-list.ui-accordion .ui-accordion-header .new:before {content: "N"; text-align: center; display: inline-block; width: 14px; height: 16px; color: #fff; font-size: 10px; line-height: 16px; vertical-align: top;}
.notice-list.ui-accordion .ui-accordion-header .date {display: block; padding-top: 6px; font-size: 15px; color: #989898;}
.ui-state-active .ui-icon, .ui-button:active .ui-icon {display: none;}
.notice-list .ui-icon, .ui-widget-content .ui-icon {display: none;}
.notice-list .ui-state-default.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {border: 0; background: url('../images/arrow-up.png') no-repeat right 24px; background-size: 18px 10px; color: #f53600;}
.notice-list .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {border: 0; background: #fff; color: #000;}
.notice-list.ui-accordion .ui-accordion-content {border: 0; padding: 30px 20px; background: #f7f7f7; color: #5c5c5c; letter-spacing: -1px;}


/* 2022-08-31 수정 */

.main-section {position: relative; z-index: 0; min-height: 120vh; padding: 0 0 0 0;}
.sub-section {min-height: 120vh; padding: 30px 30px 0 270px;}
.sub-section .contents {min-height: 120vh;}
.new-section {position: relative; z-index: 0; min-height: 120vh; padding: 0 30px;}

.aside-menu.open {min-height: 1100px;}
.aside-menu.open.first {transition: none;}
.aside-menu .nav-list > li.open > a .menu {color:#fff;}

h2 {margin: 0;}
.searchTable th {width:8%;}
.searchTable td.searchTd1, .searchTable td.searchTd3 {width:20%;}
.searchTable td.searchTd2 {width:36%;}

.searchTable .form-check {padding-left: 25px;}

#evalSheet tbody tr.select td {background: #90acc7; color: #fff;}

.modal.ht-s {height: 400px;}
.modal.ht-m {height: 700px;}
.modal-xxl {max-width: 1800px;}
.modal-xxl .contents {overflow-y: scroll;}
.modal-content.h-full {max-height: fit-content;}

.number {text-align : right !important;}
.minusNumber {color:red;}
.chart-container {width:600px;}
.chart-container #line-chart {position: relative;height: 600px;overflow: hidden;}

.chart-container2 {width:800px;}

.chart-container2 #stick-chart {position: relative;height:600px;overflow:hidden;}

.chart-container2 #result_coment {border-radius: 6px;text-align: center;background: #eee;height: 60px;padding: 14px;}
.chart-container2 #result_coment span#result_span {font-size: 18px;}
.chart-container2 #result_list {flex-direction: row;}
.chart-container2 #result_list ul.result {border: 1px solid #ccc;border-radius: 20px;width: 150px;height: 100px;text-align: center;}
.chart-container2 #result_list ul.result li.result_top {border-bottom: 1px solid #ccc;height: 50px;padding: 10px;font-size: 20px;background: #ccc;border-radius: 20px 20px 0 0;color:#fff;}
.chart-container2 #result_list ul.result li.result_bottom {padding: 10px;font-size: 20px;}

.customHeader span.req:after {content:"*";color:#ff0000;display:inline-block;margin-left:5px;}

.datePicker , .dateRangePicker {background: url('../images/datepicker.png') no-repeat center center / contain;background-position: right 8px top 50%;background-size: 21px;}
div.datepicker {width:275px;}
div.datepicker table {width:100%;}
.datepicker td, .datepicker th {font-size: 16px;}

#topBtn {position: fixed;bottom: 150px;right: 50px;z-index: 99;	display: inline-block;	width: 50px;height: 50px;line-height: 50px;text-align: center;text-decoration: none;background: #272e48;opacity: 0.7;color: #fff;font-size:15px;}
Button.btn.up-btn {margin-right:5px;height:100%;}

/* 메뉴 고정 */
.header {position: fixed;top: 0;width: 100%;}
/* .aside-menu {position: fixed;top: 50px;left: 0;} */
.aside-menu {padding-top: 100px;}
.sub-section {padding: 65px 30px 0 270px;}
.new-section {padding: 30px 30px 0px 30px;}
.contents-inner {padding: 70px 0 0 0;}

@media screen and (max-width: 1300px) {
	
/* 	.header .btn-menu { width: 50px;padding-left: 20px;} */
/* 	.header h1 {width: 130px;padding-left: 15px;height: 50px;} */
/* 	.header h1 img {width: 100px;} */
	
	.wrapper {min-width: 95%;}
	.top-navigation {display: none;}
	.header .user-function .user-name {display: block;}
/* 	.top-navigation .nav-list > li {width: 83px;} */
/* 	.top-navigation .nav-list > li > a {padding: 0;font-size: 11px;} */
/* 	.top-navigation .nav-list > li > ul li a {font-size: 13px;} */
	
	.aside-menu {min-height: 860px;}
	
	.sub-section {padding: 75px 30px 0 110px;}
	
	.contents-wrap {padding-right: 0;}
	.contents-inner {padding: 70px 0 0 80px;}
	.search-data-section {padding: 40px 16px 40px 81px;}
	
	.table td, .table th {padding: 0.25rem;}
	.table.data-type tbody tr th {padding-left: 5px;}
	.table.data-type tbody tr td { padding: 2px;}
	.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {padding: 0;}

	#subTable1 .tabulator .tabulator-tableHolder {overflow-y: hidden;overflow-x: auto;}
	.footer {margin: 0;}
	
	.chart-container2 #result_coment {padding: 20px;}
 	.chart-container2 #result_coment span#result_span {font-size: 15px;} 
 	.chart-container2 #result_list ul.result li.result_top {font-size: 18px;}
 	.chart-container2 #result_list ul.result li.result_bottom {font-size: 16px;}
 	
 	.modal-xxl {max-width: 1100px;}
 	.modal-body { padding: 2rem;}
 	
}