.container-body { margin: 0 auto; width: 80%; padding: 0; display: flex; align-content: center;}
.container-body * { font-size: 13px !important; }
.container-body .main_container { width: 100%; padding: 10px; }
/* .container-body * { font-size: 13px !important; margin: 0 auto; width: 80%; padding: 0;} */

/* .flexArea { display: flex; align-items: center; width: 100%; margin-bottom: 10px;} */
/* .flexArea > * {height: 35px;} */
/* .flexArea > label:not([for="searchEndDate"]) {
  width: 80px ;
  align-content: center;
  margin: 0 10px;
  font-weight: bold;
} */

/* .flexArea .flexRow-Three {
  display: flex;
  width: 33.33%;
  padding-right: 10px;
} */

.rowArea .rowAreaTree {
  display: flex;
  width: 33.33%;
  padding-right: 10px;
  margin-top: 10px;
}

.rowArea .rowAreaTree > label:not([for="searchEndDate"]) {
  width: 20%;
  align-content: center;
  font-weight: bold;
}

.rowArea label[for="searchEndDate"] {
  align-content: center;
  margin: 0 10px;
  font-weight: bold;
  width: 10px ;
  margin-top: 8px;
}

.rowArea label[for="searchStartDate"] {
  margin-top: 10px;
}

.rowArea .selectArea {
  width: 50%;
}

/* .flexArea .flexRow-Three > label:not([for="searchEndDate"]) {
  width: 80px ;
  align-content: center;
  font-weight: bold;
} */
/* label[for="searchEndDate"] {
  align-content: center;
  margin: 0 10px;
  font-weight: bold;
} */

/* .flexArea .flexRow-Half {
  display: flex;
  width: 50%;
  align-items: center;
} */

/* .flexArea .flexRow-Half > label {
  width: 100px;
  align-content: center;
  font-weight: bold;
} */

/* .flexArea .flexRow-Half > label:not(:nth-child(1)) {
  margin-left: 10px;
} */

/* .flexArea .flexRow-Three > label:not(:nth-child(1)) {
  margin-left: 10px;
} */

/* .flexArea .flexRow-Three > label:nth-child(1) {
  margin-right: 10px;
} */


#detailed-search { background-color: rgba(255, 255, 255, 0.9); border: 1px solid #ccc; margin-top: 10px; padding: 10px; width: 100%; }
#detailed-search {
  display: block;
  /* flex-wrap: wrap; */
  /* justify-content: space-between; */
}


.flexArea .dateArea {
  align-items: center;
  text-align: center;
  /* height: 100%; */
  /* width: 40%; */
  /* flex-shrink: 0; */
  /* font-weight: bold; */
  max-width:  max-content;
}

.flexArea .frontArea  {
  /* width: 38%;  */
  text-align: left;
  flex : 1;
}
.flexArea .backArea  {text-align: left;  flex:  2;}
.flexArea .centerArea  {
  width: 150px; 
  text-align: center;

}

/* #detailed-search > div > label {
  width: 55px;
  margin-right: 10px;
  flex-shrink: 0;
  font-weight: bold;
} */


#searchTable { margin-top: 10px; width: 80%; margin-left: auto; margin-right: auto; font-size: 13px;}

#costAppSit > thead,
#searchTable > thead { background-color: hsl(215, 30%, 74%); color: white; }

#costAppSit > thead > tr > th,
#searchTable > thead > tr > th { text-align: center; font-weight: bold;  vertical-align: middle;}


#costAppSit > tbody > tr.active { background-color: #f8f8f8; }
#costAppSit > tbody > tr { cursor: default; background-color: none; }
#costAppSit > tbody > tr:hover { cursor: pointer; background-color: #f8f8f8;}

#costAppSit th:nth-child(1) {text-align: center; vertical-align: middle;}
#costAppSit td:nth-child(1) {text-align: center;}  /* 순서  */

#costAppSit th:nth-child(2) {text-align: center; vertical-align: middle;}
#costAppSit td:nth-child(2) {text-align: center;} /* 부서  */

#costAppSit th:nth-child(3) {text-align: center; vertical-align: middle;}
#costAppSit td:nth-child(3) {text-align: center;} /* 사번  */

#costAppSit th:nth-child(4) {text-align: center; vertical-align: middle;} 
#costAppSit td:nth-child(4) {text-align: center;}  /* 사원명  */

#costAppSit th:nth-child(5) {text-align: center;}
#costAppSit td:nth-child(5) {text-align: right;} /* 합계  */

#costAppSit th:nth-child(6) {text-align: center;}
#costAppSit td:nth-child(6) {text-align: right;} /* 주유비  */

#costAppSit th:nth-child(7) {text-align: center;}
#costAppSit td:nth-child(7) {text-align: right;}  /* 통행료 */

#costAppSit th:nth-child(8) {text-align: center;}
#costAppSit td:nth-child(8) {text-align: right;} /* 주차비  */

#costAppSit th:nth-child(9) {text-align: center;}
#costAppSit td:nth-child(9) {text-align: right;} /* 통신비  */

#costAppSit th:nth-child(10) {text-align: center;}
#costAppSit td:nth-child(10) {text-align: right;}  /* 일반교통비  */

#costAppSit th:nth-child(11) {text-align: center;}  
#costAppSit td:nth-child(11) {text-align: right;}  /* 소액접대비  */

#costAppSit th:nth-child(12) {text-align: center;}  
#costAppSit td:nth-child(12) {text-align: right;}  /* 출장숙박비  */

#costAppSit th:nth-child(13) {text-align: center;}  
#costAppSit td:nth-child(13) {text-align: right;}  /* 출장대중교통비  */