@charset "UTF-8";

.nav-wrap{position: relative; top:0;left:0;}
 .clock { position:absolute; bottom:2%; width: 100%; left:0; margin:auto; text-align: center; }
 .clock .time_box { width: 100%; }
 .clock span { color: #fff; }
 .txt_lg { font-size: 24px; }
 .txt_sm { font-size: 8px; }
 .date_box { font-size: 12px;}
 #day { display: block; margin-top: 4px; }
 .mk { display: inline-block; vertical-align: top; height:40px; line-height: 30px; font-size: 20px; }
 .mark02 { display: inline-block; margin-left: -3px; }
	
 html, body {
  	overflow: auto; 
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
    font-size: 14px;
  }
 .custom-nav{
 	position : relative;
 	top:0;
 	left:0;
 }
  .custom-nav div.ul{
   	position : absolute;
 	width: 100%;
 } 
  #content{
 	
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
  }
  #wrapper #content-wrapper{
	overflow: hidden; 
  }
  #calendar-container {
    position: absolute;
    top: 12%;
    left: 1%;
    width:98%;
    height:75%;
  }
  .custom-footer{
   position: absolute;
   left:0;
   bottom:0;
   width:100%;
   height:auto;
  }
  /* The Modal (background) */
 .modal {
   display: none; /* Hidden by default */
   position: fixed; /* Stay in place */
   z-index: 111; /* Sit on top */
   padding-top: 100px; /* Location of the box */
   left: 0;
   top: 0;
   width: 100%; /* Full width */
   height: 100%; /* Full height */
   background-color: rgb(0,0,0); /* Fallback color */
   background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
 }	
 /* Modal Content */
 .modal-content {
   background-color: #fefefe;
   margin: auto;
   padding: 20px;
   border: 1px solid #888;
   width: 30%;
 }
  .applyModal-modal-content {
   background-color: #fefefe;
   margin: auto;
   padding: 20px;
   border: 1px solid #888;
   width: 50%;
 }
 .btn-circle{
  margin:0.5rem;
 }
 .navbar-nav{
  height: 100%;
 }
 .tbl-sv-list{
  margin-bottom:7%;
 }
 .tbl-sv-list tr{
  font-size: 0.9rem;
  vertical-align: middle;
 }
 select{
 width: 100%;
 padding:1rem;
 border: 2px solid #e3e6f0;
 border-radius : 10rem;
 font-family: inherit;
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;
 color: #6e707e;
 font-size: .8rem;
 }
 select::-ms-expand {
 	display: none;
 }
 .dataTables_filter label input{
 width: 100%;
 padding:0.6rem;
 border: 2px solid #e3e6f0;
 border-radius : 10rem;
 font-family: inherit;
 appearance: none;
 color: #6e707e;
 font-size: .8rem;
 }
.text-v{
	font-size: 0.8rem;
}
.tbl-at{
 margin-top:5%;
 width: 100%;
 text-align: center;
 color: #eee;
 font-size: .8rem;
}
.tbl-at tr td{
 padding: 3.5%;
}
.tr-border-top{  
 border-top: 1px solid rgba(255,255,255,.5);
}
.tr-border-btm{  
 border-bottom: 1px solid rgba(255,255,255,.5);
}
.big-font{
 font-size: 1.2rem;
}
.margin-padding-0{
 margin: 0;
 padding: 0;
}
.padding-0{
 padding: 0;	
}
.margin-top-10{
 margin-top:10%;	
}
.bg-black{
 background-color: #2C3E50;
 color: #fff;
}
#applyModal table {
    width: 100%;
    border: 1px solid #2C3E50;
    border-collapse: collapse;
  }
#applyModal th,  #applyModal td {
    text-align: center;
    border: 1px solid #2C3E50;
    padding: 5px;
    width: 30%;
  }
#applyModal td:nth-child(odd) {color: #2C3E50; width: 20%;}
.custome-modal{
	width:20%;
	text-align: center;
}
.btn-cancle{
	position: absolute;
	margin-top: -0.5%;
	margin-left: 7.5%;
}
#overTimeRest{
	display: none;
}
#overTimeRest span{
	text-align: left;
}
.pri-table th,.pri-table td{
	text-align: center;
	font-size: 0.9rem;
	font-weight: normal;
	vertical-align: middle;
}
.btn-weekend{
	width: 100%;
	margin-top: 5%;
	
}
.custom-group div p{
	margin :0;
    margin-top: 1rem;

}
.changeAttTime span{
	font-size: 0.6rem;
	
}
.menu-title {
    position: absolute;
    top: 0%;
    left: 0%;
  }
.fc-scrollgrid {
background-color: #fff;
}
.fc-col-header-cell-cushion, .fc-daygrid-day-number{
color:#2C3E50;
}
.fc-col-header tbody tr th:first-child .fc-col-header-cell-cushion { color: #e74a3b;}
.fc-col-header tbody tr th:last-child .fc-col-header-cell-cushion { color: #37B9CC; }
.fc-scrollgrid-sync-table tbody tr td:first-child .fc-daygrid-day-number{ color: #e74a3b;}
.fc-scrollgrid-sync-table tbody tr td:last-child .fc-daygrid-day-number{ color: #37B9CC;}
.fc-scrollgrid-sync-table tbody tr td:first-child { color: #e74a3b; background-color: rgba(231, 74, 59, 0.1);}
.fc-scrollgrid-sync-table tbody tr td:last-child { color: #37B9CC; background-color: rgba(55, 185, 204, 0.1);}
.fc-daygrid-dot-event div{
color:#2C3E50;
}
.paginate_button {
	cursor: pointer;
	margin-right: 1%;
}
#dataTable tr{
	font-size: 0.8rem;
}
.title-sv{
	position: absolute;
	left:46%;
	top:3%;
}
.btn-font-size{
	font-size: 0.9rem;
}
.startTimePicker{
	text-align: center;
}
.custom-font-size-small{
	font-size: 0.6rem;
}
.th-week{
	font-size: 0.4rem;
	margin-top:2%;
}
.custom-margin-0{
	margin:0;
}
.custom-margin-25{
	margin-top:25%;
}
.custom-btn-title{
	font-size: 0.9rem;
}
.custom-content{
  height: 100%;
  margin-bottom: 10%;
}
#navMenuTitle{
	font-weight: 800;
	color: #2C3E50;
}
.padding6{
	padding: 0.6rem;
}
#dataTable_paginate .current{ 
	font-weight: 900;
}
#content #systemTime{
	position: absolute;
	top:20%;
	left:44%;
	font-size: 24px;
	color: #2C3E50;
}
.custom-width8{
 width: 8%;
}
.custom-width8 input, .custom-width8 select{
	text-align: center;
}
.custom-tbody td{
	text-align: center;
	vertical-align: middle;
	padding: 0.2%;
}
.buy-table tbody tr:hover{
	 background-color : #2C3E50;
	 color : #fff;
	 cursor: pointer;
}
#link a:hover{
	 color : #fff;
}	
.buy-table tbody tr td{
	width: 10%;
}
.buy-table thead tr th{
	width: 10%;
}
.padding-topbtm{
 padding-top: 2%;
 padding-bottom: 2%;	
}
.display-none{
  display: none;
}
.display-block{
  display: block;
}
.mouseover-pointer:hover{
	cursor: pointer;
}
.mouseover-not-allowed:hover{
	cursor: not-allowed;
}
.display-none{
	display: none;
}
.display-block{
	display: block;
}
.mouseover-report-tr:hover{
	cursor: pointer;
	background-color: #2C3E50;
	color: #fff;
}

.text-navy{
	color: #2C3E50;
}


/* Tooltip text */
.tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 1;
  top: 100%;
  left: 50%;
  margin-left: -60px;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover + .tooltiptext {
  visibility: visible;
}
.custom-th{background-color: #cacbd9; color: #f2f2f7;}
.txt_red{color: #e74a3b;}
.txt_blue{color: #4e73df;}
.btn-wth-100{width: 100%;}
.bg-ligh-gray{background-color: #F8F9FC;}
.txt-bold{ font-weight: bold;}
#addProjectTableWrap {max-height:90%; overflow: auto;}
.deletP{cursor: pointer;}	  
#addProjectModal table tr td:first-child { color:#fff; width: 18%; text-align: center;}
#addProjectModal table tr td{ text-align: left; vertical-align: middle;}
.padding-right-0{padding-right: 0;}
.btn-navy{background-color: #2C3E50; color: #eee;}
.bg-white{background-color: #fff;}
.right-line{border-right: 1px solid #cacbd9;}

.tab-container{
	margin-top: 3%;
}
ul.tabs{
	margin: 0px;
	padding: 0px;
	list-style: none;
}

ul.tabs li{
    display: inline-block;
	background: #cecece;
	color: #6e707e;
	padding: 10px 15px;
	cursor: pointer;
	font-size: 0.8rem;
	border-radius:0.4rem 0.4rem 0 0;
}

ul.tabs li.current{
	background: #F8F9FC;
	color: #2C3E50;
	border-left: .25rem solid #1cc88a!important;
 }

.tab-content{
    display: none;
	padding: 12px;
}

.tab-content.current{
	display: inherit;
	background: #F8F9FC;
	color: #2C3E50;
}
.tab-content table{
	background: #FFF;
}
.birth-input{
	width:98%;
	margin: 0.5%;
	font-size: 0.8rem;
	padding: 0.2rme;
}
.padding-btm-5{padding-bottom: 0.5rem;}

.fc-more-popover {
  max-height: 95%;
  overflow-y: auto;
}