:root {
	--color-text-01: #c21c03;
	--color-text-02: #0b0b49;
	--color-text-03: #757575;

	--normal-text : #333333;
	--light-text : #f1f2fa;
	--dark-text : #191919;
	--dark-bg-color : #444;
  }

  @import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

  .notosanskr * { 
   font-family: 'Noto Sans KR', sans-serif;
  }


* {
	font-family: 'Noto Sans KR','맑은고딕', sans-serif;
	color:#333;


}
*,
*::before,
*::after {
  box-sizing: border-box;
}

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

*:focus {
    outline: 0;
	background:transparent;
	-webkit-tap-highlight-color: transparent;

}

h3{
	font-weight:normal;
}
html,body{
	margin:0;
	padding:0;
	
}
body{

    width: 100%;
    min-height: 100vh;
    overflow-x: auto;
    overflow-y: scroll;
    min-width: 1880px;
}
.blind {
	font-size:14px;
	letter-spacing:2px;
}
table{
	border-collapse: collapse;
	width:100%;
}


input:focus,select:focus,textarea:focus{
    outline: 0;

	transition-property:all !important;transition-duration:.2s !important
}

input[type="text"],
input[type="password"]{
	background: #f1f2f7;
    padding: 5px 10px;
    line-height: 175%;
    border-radius: 4px;
    border: 0;
    resize: none;
}

.hidden-scroll {
	-ms-overflow-style: none; /* IE and Edge */
	scrollbar-width: none; /* Firefox */
}
.hidden-scroll::-webkit-scrollbar {
	display: none; /* Chrome, Safari, Opera*/
}
.hidden {height:100vh; overflow:hidden !important; touch-action:none;}
.ellipsis {
    display: block;
    text-decoration: none;
    color: #333;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden; 
}

.ellipsis2{
display:-webkit-box !important; 
word-wrap:break-word; 
-webkit-line-clamp:2; 
-webkit-box-orient:vertical; 
overflow:hidden; 
text-overflow:ellipsis; 
}

a {text-decoration:none;}
ul {padding:0;margin:0}
li {list-style:none;padding:0;margin:0}
.ani{
	transition-property:all !important;
	transition-duration:.2s !important
}
.ani-1s{transition-property:all;transition-duration:1s}
.center {text-align:center !important}
.highlight {
	position: relative;
	z-index:1;
}
.onoff-switch {
	position: absolute;
	visibility: hidden;
  }
  
  .onoff-switch + label {
	display: inline-block;
	position: relative;

	width: 54px;
	height: 26px;
	border-radius: 17px;
	background-color: #d1d2da;
	transition-duration: 0.2s;
  }
  
  .onoff-switch + label span {
	position: absolute;
	left: 4px;
	top: 3px;
	z-index: 1;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #fff;
	transition-duration: 0.2s;
  }
  
  .onoff-switch + label:before,
  .onoff-switch + label:after{
    position: absolute;
    top: -4px;
    width: 29px;
    font-size: 10px;
    line-height: 34px;
    color: #fff;
    text-align: center;
  }
  
  .onoff-switch + label:before {
	left: 0;
	content: 'ON';
  }
  
  .onoff-switch + label:after {
	right: 0;
	content: 'OFF';
  }
  
  .onoff-switch:checked + label {
	background-color: #0075ff;
  }
  
  .onoff-switch:checked + label span {
	/* left: 29px; */
	transform: translateX(26px);
  }


  i{
	vertical-align: -0.1em;
  }
/*******************/

.highlight::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 40%;
	background-color: #bfffa1;
	z-index: -1;
}

.modal-wrap {
	background:rgba(0, 0, 0, 0.75);
	position:fixed;
	width:100vw;
	height:100vh;
	left:0;
	right:0;
	top:0;
	z-index:99998;
	display:none;
}
.modal-box {
	z-index:99999;
	position:fixed;
	width:800px;
	left:calc(50vw - 400px);
	top:80px;
	background-color: #fff;
	border-radius: 8px;
	box-shadow: 10px 10px 30px 0 rgba(0, 0, 0, 0.2);
	max-height:calc(100vh - 160px);
	display:none;
	
}
.modal-sm {

	width:500px;
	left:calc(50vw - 250px);

	
}
.modal-box h3{
	margin:0;
	padding:30px;
	font-weight: 600;
	height:80px;
	overflow: hidden;
}
.modal-box p{
	padding:30px;
	padding-top:0;
	line-height:175%;
	margin:0;
	
}
.modal-content{
	
	max-height:calc(100vh - 310px);
	overflow: auto;
}

.modal-content textarea{
	margin:0 30px 30px 30px;
	width:calc(100% - 60px);
	background:#f1f2f7;
	padding:15px;
	line-height:175%;
	border-radius: 4px;
	border:0;
	resize: none;
}
.bottom-wrap {
	padding:15px 30px;
	border-top:1px solid #ddd;
	text-align:right;
	height:70px;
	overflow: hidden;
}

.bottom-wrap button{
	padding:10px 16px;
	font-size:15px;
	border-radius: 4px;
	border:1px solid transparent;
	margin-left:10px;
}
.bottom-wrap .modal-cancel{
	border:1px solid #aaa;
	background:#fff;;
}
.bottom-wrap .modal-save{
	background:#0075ff;
	color:#fff;
}
.modal-detail-table{
	width:calc(100% - 60px);
	margin:0 30px;
}
.modal-detail-table th{
	width:150px;
	text-align:left;
	font-size:14px;
	padding:14px;
}
.modal-detail-table td{
	padding:8px 0;
	font-size:14px;
	text-align: left;
	line-height:125%;
}
.help{
	color:#aaa;
	font-size:13px;
	display: block;
	margin:5px 0 0 0;
}

.modal-detail-table tr th,
.modal-detail-table tr td{
	border-bottom:1px solid #ddd;
}
.modal-detail-table .memo{
	width:100%;
	margin:0;
}
.modal-content iframe{
	width:calc(100% - 60px);
	height:350px;
	display:block;
	margin:0 auto;
}



header{
	height:48px;
	background:#0075ff;
	position:fixed;
	left:0;
	width:100%;
	top:0;
	
	z-index:89999;

}

nav{
	position: fixed;
	width:250px;
	height:calc(100vh - 48px);
	left:0;
	top:48px;
	border-right:1px solid rgba(0,0,0,.1);
	background-color: #f1f2fa;
}

nav > ul {
	padding:20px;
	font-size:14px;
}

nav > ul > li > ul > li{
	padding: 0px;

	margin:0;
}
nav > ul > li {
	margin-bottom:14px;
}
nav a {

	padding:12px 16px;
	display:block;
	border-radius: 4px;
	position: relative;
}
nav a > i {
	position: absolute;
	right:12px;
	top:12px;
	color:rgba(0, 0, 0, 0.2);

}
nav a:hover{
	background:rgba(0, 0, 0, 0.1);
}
nav span{
	font-size:12px;
	font-weight:600px;
	color:#aaa;
	margin-bottom:6px;
	display:block;
}

section{
	padding-left:250px;
	padding-top:48px;
	z-index:89999;
	
}
.logo {
	float:left;
	width:249px;
}


.logo > a {
	color:#fff;
	font-size:14px;
	font-weight:700;
	line-height:48px;
	width:250px;
	padding-left:20px;
}

header > a,
header > a > i{
	color:#fff;
}
header > a{
	font-size:14px;
	padding: 16px 14px;
	float:left;

}
header > a:hover{
	background-color: #005cc8;
}

header .right-info{
	color:#fff;
	font-size:14px;
	line-height:48px;
	padding-left:20px;
	float:right;
	overflow: hidden;
}
header .right-info strong{
	color:#fff;
}
header .right-info > a{
	color:#fff;
	font-size:14px;
	line-height:48px;
	padding:16px 14px;
	height:48px;
}
header .right-info > a:last-child{
	padding-right:20px;
}
header .right-info > a:hover{
	background-color: #005cc8;
}
.menu-btn {
	border-right:1px solid rgba(0,0,0,.1);
	border-left:1px solid rgba(0,0,0,.1);
	width:48px;
	height:48px;
	overflow:hidden;
	padding:0;
	text-align:center;
}
.menu-btn i{
	font-size:20px;
	text-align:center;
	display: block;
	margin-top:13px;
}

section{
	box-shadow: inset 12px 12px 20px 0 rgb(0 0 0 / 3%);
	min-height:100vh;
}

section .sec-header{
	position: relative;
}
section h3{
	padding:20px;
	margin:0;
	font-size:22px;
}
section h3 small{
	color:#aaa;
	font-size:14px;
}

section .table-rows th{
	font-size:14px;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
	padding:12px 0;
	font-weight:normal;
	text-align:center;
	color:#aaa;
}
section .table-rows td{
	font-size:14px;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
	padding:12px 0;
	font-weight:normal;
	text-align:center;
}
.btn-group {
	padding:8px 12px;
	font-size:14px;
}
.btn-group a {
	padding:8px;
	margin-right:4px;
	display: inline-block;
	border-radius: 4px;
}
.btn-group a i {
	vertical-align: -2px;
	margin-right:4px;
}
.btn-group a:hover{
	background:rgba(0,0,0,.1);
}

.circle-fill{
	width:8px;
	height:8px;
	background-color: #aaa;
	border-radius: 50%;
	display: inline-block;
	vertical-align: 1px;
}
section .table-rows tbody tr:hover {
	background:rgba(0,0,0,.1);
}

.step-green  {
	background:rgba(0,255,0,.1);
}
.step-green  .circle-fill{
	background-color: #1bd62b;
}
.step-blue  {
	background:rgba(0, 68, 255, 0.1);
}
.step-blue  .circle-fill{
	background-color: #1b56d6;
}
.step-red  {
	background:rgba(255, 0, 0, 0.1);
}
.step-red  .circle-fill{
	background-color: #d61b1b;
}
.step-gray  {
	background:rgba(255, 255, 255, 0.1);
}
.step-gray  .circle-fill{
	background-color: #aaa;
}

.ri-check-line{
	color:green
}

section .table-rows .detail-view{
	padding:0;
}
section .table-rows .detail-view button{
	border:0;
	background-color: transparent;
	padding:4px 6px;
	border-radius: 4px;
	color:#aaa;
}
section .table-rows .detail-view button:hover{

	background-color: #fff;
	color:#333;
	cursor: pointer;
}
section .table-rows .detail-view button i{
	margin-right:4px;
	vertical-align: -2px;
	
	color:inherit;
}
.string-limit,
.string-limit > button {
	width:200px;
}

.string-limit > button:hover {
	cursor:pointer;
}

section .table-rows .nice-select{
	font-size: 14px;
    border: 0;
    height: 26px;
    line-height: 26px;
    background: transparent;
	width:120px;
	margin:0 auto;
	display: inline-block;
}
section .table-rows .nice-select .current{
	color:#aaa
}
section .table-rows .nice-select:hover{
	background:#fff;
	
}
section .table-rows .nice-select:hover .current{
	color:#333;
}
.select-td {
	text-align: center;
	width:120px;
	padding:0 4px !important;
}
.select-td select{
	display: none;
}
.search-area{
	border-radius:4px;
	position:absolute;
	right:20px;
	bottom:-30px;
	font-size:14px;
	padding:10px;
}

.search-area button{
	border:0;
	background-color: transparent;
}
.search-area input{
	border:0;
	padding:3px 5px;
}
.search-area button i{
	vertical-align: -2px;
}

.paging-wrap{
	text-align:center;
	margin-top:30px;
}
.paging-wrap li{
	display: inline-block;
	font-size:14px;
}
.paging-wrap li a i{
	vertical-align: -2px;
}
.paging-wrap li a {
	width:32px;
	height:32px;
	display: block;
	line-height:32px;
	border-radius: 4px;
	color:#333;
}

.paging-wrap li a:hover,
.paging-wrap .on a{
	background:#ddd;
}

.nice-select {
    height: 28px;
    line-height: 27px;
    border: 0;
    background-color: #f1f2f7;
    border-radius: 4px;
}


.table-cols th{
	width:172px;
	color:#333;
	padding:16px 24px;
	text-align:left;
	font-size:14px;
	font-weight: 600;
}
.table-cols td{
	text-align:left;
	font-size:14px;
	padding:16px 0;
}
.my-info-btm {
	border:0;
	margin-top:30px;
}

section .tbl-col-line {
	padding:24px 0;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
}

.calendar {
	font-size:14px;
}
.calendar th{
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
	text-align:left;
	padding:10px 20px;
}

.calendar td{
	
	border-bottom:1px solid #ddd;
	padding:5px 20px;
	height:144px;
	vertical-align: top;
}

.line-box > div{
	padding:4px 6px;
	margin:4px 0;
	background: #f1f2fa;
	font-weight:normal;
}
.line-box > div > span{
	float:right;
}
.line-box > div:first-child{
	background: rgba(0, 0, 0, 0.1);
}

.week-0,
.week-1,
.week-2,
.week-3,
.week-4,
.week-5,
.week-6{

	font-weight: 800;
}

.week-0 > span {
	color:crimson !important;
}
.week-6 > span {
	color:rgb(20, 53, 220) !important;
}
.prev-date,
.prev-date + div,
.next-date,
.next-date + div{
	opacity: .25;
}
.show-ym,
.show-ym i{
	font-size:20px
}
.show-ym i{
	vertical-align: -0.1em;
	color:#aaa;
}
.stat-table{
	width:calc(100% - 40px);
	margin:20px;
	display: inline-table;
	font-size: 15px;
	margin-top: 50px;
}
.stat-table td{
	border-bottom:1px solid #eee;
	height:100px;
	text-align:center;
	position: relative;
}
.stat-table tr:first-child td{
	border-top:1px solid #eee;
}
.stat-table tr:last-child td{
	border-bottom:0;
}
.stat-table th{
	width:100px;
	position: relative;
}
.stat-table th span{
	position: absolute;
	text-align: right;

	font-weight: normal;
	font-size:15px;
	right: 50px;
    top: -12px;
}
.stat-table tr:last-child td,
.stat-table tr:last-child th
{
	height:70px;
	vertical-align: middle;
}
.chart-bar {
	width:100%;
	position: absolute;
	bottom:0;
	text-align: center;
	font-size:0;
}
.chart-bar > div{
	display: inline-block;
	width:35%;
	background-color: #77777777;
	vertical-align: bottom;
	
	font-size:15px;
	position: relative;
}
.chart-bar > div:first-child{
	margin-right:8px;
	background-color: #eb0e2160;
}
.chart-bar > div:last-child{
	background-color: #1974db5d;
}
.chart-bar > div > span{
	width:100%;
	position: absolute;
	color:#777777;
	left:0;
	top:-20px;
}
.one-bar > div {
	width:70%;
	background-color: #77777777 !important;
}