@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap");

* {
  font-family: "Noto Sans CJK KR", sans-serif;
  font-size: 13px;
  font-weight: 400;
  text-shadow: none !important;
  letter-spacing: -0.5px;
  padding: 0;
  margin: 0;
}
a {
  text-decoration: none;
}

input:focus {
  outline: none;
}
textarea:focus {
  outline: none;
}
select:focus {
  outline: none;
}

select::-ms-expand {
  display: none; /*for IE10,11*/
}
/*********/

SELECT {
  height: 28px;
}
li {
  list-style: none;
}

textarea {
  resize: none;
}

button:focus {
  outline: none;
}

/**컨텐츠 페이지에 시작이 되는 div**/
.index {
  background-color: #eceff5;
  padding: 30px;
}
.header_title {
  height: 33px;
  font-weight: bold;
  font-size: 22px;
}
.div_menu {
  height: 34px;
  margin: 15px 0px;
}
.subtitle-wrap {
  width: 990px;
  height: 28px;
  margin-top: 20px;
  margin-bottom: 10px;
}
/**컨텐츠 페이지에 시작이 되는 div**/

/************* 공통 css *******************/
ul {
  list-style: none;
}
.cusor-point {
  cursor: pointer;
}
h3 {
  font-size: 14px;
  font-weight: normal;
}
/****** width **************/
.w-2 {
  width: 2%;
}
.w-3 {
  width: 3%;
}
.w-4 {
  width: 4%;
}
.w-5 {
  width: 5%;
}
.w-8 {
  width: 8%;
}
.w-9 {
  width: 9%;
}
.w-10 {
  width: 10%;
}
.w-11 {
  width: 11%;
}
.w-12 {
  width: 12%;
}
.w-12.5 {
  width: 12.5%;
}
.w-14 {
  width: 14%;
}
.w-15 {
  width: 15%;
}
.w-16 {
  width: 16%;
}
.w-17 {
  width: 17%;
}
.w-18 {
  width: 18%;
}
.w-80 {
  width: 80%;
}
.w-20 {
  width: 20%;
}
.w-22 {
  width: 22%;
}
.w-23 {
  width: 23%;
}
.w-24 {
  width: 24%;
}
.w-25 {
  width: 25%;
}
.w-26 {
  width: 26.6%;
}
.w-30 {
  width: 30%;
}
.w-33 {
  width: 33%;
}
.w-35 {
  width: 35%;
}
.w-40 {
  width: 40%;
}
.w-50 {
  width: 50%;
}
.w-60 {
  width: 60%;
}
.w-70 {
  width: 70%;
}
.w-90 {
  width: 90%;
}
.w-95 {
  width: 95%;
}
.w-100 {
  width: 100%;
}

.wp-990 {
  width: 990px;
}

.w-850px {
  width: 850px;
}
.w-900px {
  width: 900px;
}
.w-960px {
  width: 960px;
}
.w-30px {
  width: 30px;
}
.w-80px {
  width: 80px;
}

.w-60px {
  width: 60px;
}
.w-90px {
  width: 90px;
}
.w-100px {
  width: 100px;
}
.w-120px {
  width: 120px;
}
.w-140px {
  width: 140px;
}
.w-150px {
  width: 150px;
}
.w-160px {
  width: 160px;
}
.w-200px {
  width: 200px;
}
.w-220px {
  width: 220px;
}
.w-240px {
  width: 240px;
}
.w-380px {
  width: 380px;
}
.w-490px {
  width: 490px;
}
.w-600px {
  width: 600px;
}
.w-649px {
  width: 649px;
}
.w-670px {
  width: 670px;
}
.w-700px {
  width: 700px;
}
.w-1400px {
  width: 1400px;
}

/******** width *******************/
/******** height ******************/
.h-28px {
  height: 28px;
}
.h-30px {
  height: 30px;
}
.h-100 {
  height: 100%;
}
/******** height ******************/
/********** color *********/
.ft_gray {
  color: #717d9b;
}
.ft_white {
  color: #ffffff;
}
.ft_snaby {
  color: #a0accb;
}
.ft_dark {
  color: #232c42;
}
.ft_dgray {
  color: #5a6581;
}
.ft_green {
  color: #38cb91;
}
.ft_waring {
  color: #f46737;
}
.ft_blue {
  color: #498cef;
}
.ft_rgay {
  color: #9aa4bc;
}
.ft_rrgray {
  color: #b4bdd3;
}
.ft_bwhite {
  color: #eceff5;
}
.ft_dwhite {
  color: #cad2e0;
}
.bg_waring {
  background-color: #f46737;
}
.bg_dgray {
  background-color: #e2e6ed;
}
.bg_white {
  background-color: #ffffff;
}
.bg_bnavy {
  background-color: #161c2c;
}
.bg_nomal {
  background-color: #eceff5;
}
.bg_rnavy {
  background-color: #28324a;
}
.bg_wblue {
  background-color: #f4f5f8;
}
.bg_disabled {
  background-color: #e3e2dc;
}
.bg_avgcolum {
  background: #e6dfff;
}
.bg_dnavy {
  background: #1d263c;
}
/********** size *********/
.ft_bold {
  font-weight: bold;
}
.fsize-7 {
  font-size: 7px;
}
.fsize-8 {
  font-size: 8px;
}
.fsize-10 {
  font-size: 10px;
}
.fsize-12 {
  font-size: 12px;
}
.fsize-14 {
  font-size: 14px;
}
.fsize-15 {
  font-size: 15px;
}
.fsize-16 {
  font-size: 16px;
}
.fsize-18 {
  font-size: 18px;
}
.fsize-13 {
  font-size: 13px;
}
.fsize-22 {
  font-size: 22px;
}
.fsize-26 {
  font-size: 26px;
}
.fsize-28 {
  font-size: 28px;
}
/******** padding ************/
.p-3 {
  padding: 3px;
}
.p-5 {
  padding: 5px;
}
.p-8 {
  padding: 8px;
}
.p-10 {
  padding: 10px;
}
.p-15 {
  padding: 15px;
}
.p-30 {
  padding: 30px;
}
.pl-5 {
  padding-left: 5px;
}
.pl-15 {
  padding-left: 15px;
}
.pt-5 {
  padding-top: 5px;
}
.pt-7 {
  padding-top: 7px;
}
.pt-20 {
  padding-top: 20px;
}
.pt-10 {
  padding-top: 10px;
}
.pb-5 {
  padding-bottom: 5px;
}
.pb-10 {
  padding-bottom: 10px;
}
.pb-15 {
  padding-bottom: 15px;
}
.pr-11 {
  padding-right: 11px;
}
.pr-15 {
  padding-right: 15px;
}
.p-y10 {
  padding: 10px 0px;
}
.p-4-6 {
  padding: 4px 6px;
}
/***********margin  ***********/
.m-5 {
  margin: 5px;
}
.m-15 {
  margin: 15px;
}
.ml-auto {
  margin-left: auto;
}
.ml-3 {
  margin-left: 3px;
}
.ml-5 {
  margin-left: 5px;
}
.ml-10 {
  margin-left: 10px;
}
.ml-15 {
  margin-left: 15px;
}
.ml-20 {
  margin-left: 20px;
}
.ml-30 {
  margin-left: 30px;
}
.ml-40 {
  margin-left: 40px;
}
.ml-50 {
  margin-left: 50px;
}
.ml-300px {
  margin-left: 300px;
}
.mr-5 {
  margin-right: 5px;
}
.mr-8 {
  margin-right: 8px;
}
.mr-9 {
  margin-right: 9px;
}
.mr-20 {
  margin-right: 20px;
}
.mr-25 {
  margin-right: 25px;
}
.mr-10 {
  margin-right: 10px;
}
.mr-11 {
  margin-right: 11px;
}
.mr-50 {
  margin-right: 50px;
}
.mr-15 {
  margin-right: 15px;
}
.mb-5 {
  margin-bottom: 5px;
}
.mb-10 {
  margin-bottom: 10px;
}
.mb-15 {
  margin-bottom: 15px;
}
.mb-20 {
  margin-bottom: 20px;
}
.mb-25 {
  margin-bottom: 25px;
}
.mt-5 {
  margin-top: 5px;
}
.mt-10 {
  margin-top: 10px;
}
.mt-15 {
  margin-top: 15px;
}
.mt-20 {
  margin-top: 20px;
}
.mt-25 {
  margin-top: 25px;
}
.mt-35 {
  margin-top: 35px;
}
.mt-40 {
  margin-top: 40px;
}
.mt-50 {
  margin-top: 50px;
}

.m-x10 {
  margin: 0px 10px;
}
/***************************************/
/**************float *********************/
.float-left {
  float: left;
}
.float-right {
  float: right;
}
/***************************************/
/************flex ************************/
.flex {
  display: flex;
}
.flex-end {
  justify-content: flex-end;
}
.flex-center {
  justify-content: center;
}
.flex-space-between {
  justify-content: space-between;
}
.flex-space-around {
  justify-content: space-around;
}
.flex_item_center {
  margin: auto 0;
}
.flex_width_item_center {
  margin: 0 auto;
}
.flex-wrap_wrap {
  flex-wrap: wrap;
}
.align-items_center {
  align-items: center;
}
/***************************************/

/********** 버튼 ************************/
.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  opacity: 1;
}
.in_btn {
  display: inline-block;
  padding: 2px 10px;
  margin-bottom: 0;
  font-size: 13px;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  opacity: 1;
}
.inline_btn_gray {
  background-color: #717d9b;
  color: #ffffff;
  border: 1px solid transparent;
  border-radius: 4px;
}
/* 인사 관리에서 사용하는 버튼*/
.Person_btn_fixed {
  width: 46px;
  height: 22px;
  color: #ffffff;
  background: #38cb91;
  border: 1px solid #38cb91;
  border-radius: 4px;
}
.Person_btn_delete {
  width: 46px;
  height: 22px;
  color: #cad2e0;
  background: #ffffff;
  border: 1px solid #cad2e0;
  border-radius: 4px;
}
.Person_btn_save {
  width: 46px;
  height: 22px;
  color: #ffffff;
  background-color: #498cef;
  border-radius: 4px;
  border: 0;
}

.btn-blue {
  width: 60px;
  height: 30px;
  background-color: #498cef;
  color: #ffffff;
}
.btn-save {
  background-color: #498cef;
  color: #ffffff;
}
.btn-init {
  background: #cad2e0;
  color: #ffffff;
}
.btn_delete {
  color: #498cef;
  border: 2px solid #498cef;
}
.btn_gray {
  background-color: #717d9b;
  color: #ffffff;
}
.btn_reset {
  width: 61px;
  height: 30px;
  background-color: #cad2e0;
  color: #ffffff;
  display: inline-block;
  padding: 4px 12px 5px 12px;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  opacity: 1;
}
.btn_search {
  width: 61px;
  height: 30px;
  background-color: #717d9b;
  color: #ffffff;
  display: inline-block;
  padding: 4px 12px 5px 12px;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  opacity: 1;
}
.Inline_Print_btn {
  width: 61px;
  height: 30px;
  background: #38cb91;
  color: #ffffff;
  display: inline-block;
  padding: 4px 12px 5px 12px;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  opacity: 1;
}
.btn_whitegray {
  width: 61px;
  height: 30px;
  background: #38cb91;
  color: #ffffff;
  display: inline-block;
  padding: 4px 12px 5px 12px;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  opacity: 1;
}

.btn_excel {
  width: 104px;
  height: 40px;
  background: #38cb91;
  color: #ffffff;
  display: inline-block;
  padding: 5px 10px 5px 10px;
  margin-bottom: 0;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  opacity: 1;
}
.a_btn_excel {
  width: 104px;
  height: 30px;
  background: #38cb91;
  color: #ffffff;
  display: inline-block;
  padding: 5px 10px 5px 10px;
  margin-bottom: 0;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  opacity: 1;
}

.btn_Delete_Data {
  width: 104px;
  height: 40px;
  background-color: #cad2e0;
  color: #ffffff;
  display: inline-block;
  padding: 5px 10px 5px 10px;
  margin-bottom: 0;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  opacity: 1;
}

.btn_Fix_Data {
  width: 104px;
  height: 40px;
  background-color: #498cef;
  color: #ffffff;
  display: inline-block;
  padding: 5px 10px 5px 10px;
  margin-bottom: 0;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  opacity: 1;
}

/* 메뉴바 */
.div_menu li {
  text-align: center;
  display: inline-block;
  line-height: 34px;
  border-radius: 17px;
}
.menu_items {
  width: 110px;
  height: 34px;
}
.menu_active {
  background-color: #498cef;
  border: 1px solid #498cef;
}
.menu_active a {
  color: #ffffff;
  font-weight: bold;
  font-size: 15px;
}

.menu_noactive {
  background: #ffffff;
  border: 1px solid #ffffff;
}
.menu_noactive a {
  color: #717d9b;
  font-size: 15px;
}
/* 메뉴바 */
/********* border ************/
.no_border {
  border: none;
}
.border_gray {
  border: 1px solid #c2cbde;
}
.border_wgray {
  border: 1px solid #e2e6ed;
}

.border_dark {
  border: 1px solid #cad2e0;
}
.bor_b_gray {
  border-bottom: 1px solid #f4f5f8;
}
/***************************/
/****** raudis *************/
.radius10 {
  border-radius: 10px;
}
.radius4 {
  border-radius: 4px;
}
/*************************/

/********** checkbox style *********/
.check_wrap input[type="checkbox"] {
  display: none;
}
.check_wrap input[type="checkbox"] + label {
  display: inline-block;
  width: 18px;
  height: 18px;
  background: transparent url("https://os.bizpayroll.co.kr/Manage2/Image/uncheked.png") 0% 0% no-repeat padding-box;
  vertical-align: -3px;
}
.check_wrap input[type="checkbox"]:checked + label {
  background: transparent url("https://os.bizpayroll.co.kr/Manage2/Image/cheked.png") 0% 0% no-repeat padding-box;
}
/********************************/

/********* selectbox style ********/
.select_mode_1 {
  border: 1px solid #c3cce3;
  border-radius: 4px;
}

/*******************************/

/************ line-height **********/
.line-10 {
  line-height: 10px;
}
.line-25 {
  line-height: 25px;
}
.line-30 {
  line-height: 30px;
}
.line-50 {
  line-height: 50px;
}
/************ line-height **********/

/********* align *******************/
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
/*********************************/
/*************** text-decoration *******************/
.text-underline {
  text-decoration: underline;
}

/***********************************/
/* cusor */
.hand {
  cursor: hand;
}
.move {
  cursor: move;
}
/* cusor */

/*****************display *********************/
.d-none {
  display: none;
}
/********************************************/

/* base_wrap */
.button_wrap {
  width: 990px;
}

.index_wrap {
  width: 990px;
}

.Base_wrap {
  width: 960px;
  padding: 15px;
  border-radius: 10px;
}
.NoWidth_wrap {
  padding: 15px;
  border-radius: 10px;
}

/*************** min-height *****************/
.min-h-289 {
  min-height: 289px;
}
.min-h-500 {
  min-height: 500px;
}
/******************************************/

/************** table **********************/
.Post_table {
  border-collapse: collapse;
}
.Post_table th {
  padding: 4px 6px;
  color: #5a6581;
  border: 1px solid #cad2e0;
  background: #e2e6ed;
  opacity: 1;
  height: 24px;
}
.Post_table td {
  padding: 4px 6px;
  border: 1px solid #cad2e0;
  opacity: 1;
  height: 24px;
  color: #232c42;
}

/*****************************************/

/************** selectbox *****************/
.print_content_table {
  border-collapse: collapse;
}
.print_content_table select {
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
}

.print_content_table select option {
  text-align: left;
  color: #232c42;
  opacity: 1;
  border-bottom: 1px solid #cad2e0;
  vertical-align: middle;
  height: 21px;
  padding: 4px 6px;
}
.print_content_table select option:checked {
  background: #dae6f7 -webkit-linear-gradient(bottom, #dae6f7 0%, #dae6f7 100%);
}

.code_select_wrap {
  border-collapse: collapse;
}
.code_select_wrap select {
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
}

.code_select_wrap select option {
  text-align: left;
  color: #232c42;
  opacity: 1;
  border: 1px solid #cad2e0;
  vertical-align: middle;
  height: 21px;
  padding: 4px 6px;
}
.code_select_wrap select option:checked {
  background: #dae6f7 -webkit-linear-gradient(bottom, #dae6f7 0%, #dae6f7 100%);
}
/************** selectbox *****************/

/************ upload *******************/
.filebox input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.filebox label {
  display: inline-block;
  padding: 5px 8px;
  color: #5a6581;
  font-weight: bold;
  line-height: normal;
  vertical-align: middle;
  background-color: #cad2e0;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: 4px;
}

/* named upload */
.filebox .upload-name {
  display: inline-block;
  padding: 5px 8px; /* label의 패딩값과 일치 */
  background-color: #ffffff;
  color: #cad2e0;
  line-height: normal;
  vertical-align: middle;
  border: 0;
  -webkit-appearance: none; /* 네이티브 외형 감추기 */
  -moz-appearance: none;
  appearance: none;
}

.filebox2 input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.filebox2 label {
  display: inline-block;
  padding: 5px 8px;
  color: #5a6581;
  font-weight: bold;
  line-height: normal;
  vertical-align: middle;
  background-color: #cad2e0;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: 4px;
}

/* named upload */
.filebox2 .upload-name2 {
  display: inline-block;
  padding: 5px 8px; /* label의 패딩값과 일치 */
  background-color: #ffffff;
  color: #cad2e0;
  line-height: normal;
  vertical-align: middle;
  border: 0;
  -webkit-appearance: none; /* 네이티브 외형 감추기 */
  -moz-appearance: none;
  appearance: none;
}

.upload_btn {
  width: 100px;
  color: #ffffff;
  padding: 5px 6px;
  height: 30px;
  background: #38cb91;
  border-radius: 4px;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
}

/* 컨텐츠가 넘칠때 */
.overflow_table {
  overflow-x: auto;
  white-space: nowrap;
}

/* 급여기초에 사용되는 table 디자인1 */
.table_mode_1 {
  border-collapse: collapse;
}
.table_mode_1 td {
  padding-bottom: 10px;
  border-bottom: 1px solid #f4f5f8;
  opacity: 1;
}
.table_mode_1 input {
  padding: 3px 5px;
}
.table_mode_1 select {
  border: 1px solid #e2e6ed;
}
/* 급여기초에 사용되는 table 디자인1 */