input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
/* 알바친구 급여관리 */
.flex{
    display: flex;
}
.cursor {
    cursor: pointer;
}
div#payroll_management_list{
    width: 1500px; 
    height: 1103px;
    margin: 0px auto;
    position: relative;
    left: 0px;
    top:0px;
    /* background-color: saddlebrown; */
    background-color: #f4f5f8;
    /* background-color: rgb(110, 9, 9); */

}

.management_img{
    margin-left: -5.3%;
    left: 47.5% !important;
    top: -90px !important;
}

/* 직원등록 일러 */
.illustration{
    margin-top:7px;
}



/* 급여관리등록하기 */
div#salary_registration_wrap{
    width: 46%;
    height: 35px;
    float: right;
    position: relative;
    top: -42px;
    right: -5%;
    margin-right: 5%;
    box-sizing: border-box;
    /* background-color: rgb(211, 209, 205); */
}

ul.salary_registration_text_wrap{
    width: 100%;
    height: 100%;
}
ul.salary_registration_text_wrap>li{
    height: 100%;
    border-radius: 1em;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-right: 10px;
    position: relative;
    width: 380px;
    top: -79px;
}
.tip_wrap {
    margin-left: -124px;
}
.tip2_wrap{
    margin-left: 10px;
}


/* 버튼.. */
button.minimal {
    background-color: #ffffff;
    border:solid 0.1em #cbced1;
    border-radius: 0.1em;
    color: #67697a;
    font: bold 0.78em 'Noto sans KR';
    font-weight:500;
    padding: 0px 0.5em;
    height: 27px;
    width: 85px;
    margin: 0 5px;
}

button.minimal:hover {
    cursor: pointer;
    background-color: rgb(243, 244, 250);

}


.tooltip {
    width: 50%;
    display: inline;
    position: relative;
    /* background-color: darkblue; */
}
/*.tooltip:hover:after {
    background: rgb(70, 69, 78);
    border-radius: 2px;
    bottom: 33px;
    color: #fff;
    content: attr(title);
    content: "급여불러오기를 누르고나면 해당버튼은 급여명세서 발송 버튼으로 변경됩니다.";
    font: normal 0.78em 'Noto sans KR';
    font-weight: 300;
    left: -50%;
    padding: 3px 0.78em;
    box-sizing: border-box;
    position: absolute;
    z-index: 98;
    width: 198%;
    height: 60px;
}
*/
.tooltip.tip2:hover:after {
    background: rgb(70, 69, 78);
    border-radius: 2px;
    bottom: 33px;
    color: #fff;
    content: attr(title);
    content: "해당 직원의 급여 입력이 완료되었으면 급여명세서 발송버튼을 눌러 급여명세서를 직원에게 전송하세요.";
    font: normal 0.78em 'Noto sans KR';
    font-weight: 300;
    left: -50%;
    padding: 3px 0.78em;
    box-sizing: border-box;
    position: absolute;
    z-index: 98;
    width: 220%;
    height: 60px;
}
/*
.tooltip:hover:before {
    border: solid;
    border-color: rgb(70, 69, 78) transparent;
    border-width: 6px 6px 0 6px;
    bottom: 27px;
    content:"";
    left: 44px;
    position: absolute;
    z-index: 99;
}
*/






/* 급여정보 불러오기팝업 */

div#employee_popup_wrap2_pop{
    width:30%;
    height: 280px;
    position: fixed;
    right: 18%;
    top:300px;
    background-color: rgb(255, 255, 255);
    z-index: 99999999;
    box-shadow:2px 2px 12px #616161;
    display: none;
}
div#employee_popup_wrap2_pop i{
    width: 5%;
    height: 20px;
    float: right;
    margin-top: 14px;
    cursor: pointer;
    color: #b3b4c4;
    /* background-color: rgb(145, 145, 184); */
}
#pay_slip_close_icon{
    margin-top: -48px !important;
    margin-right: 5px !important;
}
div#employee_popup_text_wrap2{
    width: 100%;
    height: 150px;
    margin-top: 50px;
    /* background-color: darksalmon; */
}

div#employee_popup_text_wrap2 p{
    font: bold 1.1em 'Noto sans KR';
   text-align: center;
   /* padding-bottom: 10px; */
   box-sizing: border-box;
    color: rgb(77, 83, 122);
}

div.employee_popup_radio input{
    width: 6%;
    height: 30px;
    position: relative;
    top:10px;
  
    /* background-color: darkblue; */
}
div.employee_popup_radio p{
    font: normal 0.95em 'Noto sans KR'!important;
    color: #6b6e77 !important;
    /* background-color: darkblue !important; */
}
div.employee_popup_radio2 input{
    width: 5.5%;
    height: 30px;
    position: relative;
    top:10px;
    /* background-color: darkblue; */
}

div.employee_popup_radio{
    width: 50%;
    height: 27px;
    margin: 0px auto;
    margin-top: 10px;
    position: relative;
    left: -2.5%;
    color: #6b6e77;
    /* background-color: saddlebrown !important; */
}



/* From uiverse.io by @adamgiebl */
div#employee_popup_button2 button {
    width: 28%;
    height: 35px;
    background: -webkit-linear-gradient(-45deg, rgb(79, 102, 192) 1%,rgb(61, 95, 196) 50%,rgba(123,153,229,1) 100%);
    box-shadow: 0 -2px 5px rgb(79, 91, 138) inset;
    padding: 0.7em 5%;
    display: flex;
    margin-left: 36%;
    align-items: center;
    padding-left: 5%;
    border: none;
    position: relative;
    z-index: 9;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer;
    
   }
   div#employee_popup_button2 button p{
    /* background-color: #3B3993; */
    width: 100%;
    font: normal 1.1em 'Noto sans KR';
    color: #ffffff;
   }
#contract_detail button {
    width: 21%;
    height: 35px;
    background: -webkit-linear-gradient(-45deg, rgb(79, 102, 192) 1%,rgb(61, 95, 196) 50%,rgba(123,153,229,1) 100%);
    box-shadow: 0 -2px 5px rgb(79, 91, 138) inset;
    padding: 0.7em 5%;
    display: flex;
    margin-left: 39%;
    align-items: center;
    padding-left: 5%;
    border: none;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer;
    margin-top: 76px;
}
#contract_detail button p{
    /* background-color: #3B3993; */
    width: 100%;
    font: normal 1.1em 'Noto sans KR';
    color: #ffffff;
}
   /* 급여정보불러오기 버튼 */
div.salary_popup_button button {
    width:25%;
    height: 35px;
    background: -webkit-linear-gradient(-45deg, rgb(79, 102, 192) 1%,rgb(61, 95, 196) 50%,rgba(123,153,229,1) 100%);
    box-shadow: 0 -2px 5px rgb(79, 91, 138) inset;
    padding: 0.7em 5%;
    display: flex;
    margin-left: 36%;
    align-items: center;
    padding-left: 5%;
    border: none;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer; 
    
   }
   div.salary_popup_button button p{
    /* background-color: #3B3993; */
    width: 100%;
    font: normal 1.1em 'Noto sans KR';
    color: #ffffff;
}
#stub_delete_pop{
    width: 30%;
    height: 302px;
    margin-top: 154px;
    display: none;
    position: fixed;
    z-index: 999999;
    background-color: #fff;
}
#stub_delete_pop i{
    margin-left: 550px;
    margin-top: 10px;
    cursor: pointer;
    color: #595959;
}
/* 급여명세서 상세 팝업 */
.pay_stub_detail_pop{
    width: 25%;
    height: 870px;
    position: fixed;
    right: 22%;
    top: 50px;
    background-color: #F8F8F8;
    z-index: 999999;
    box-shadow: 2px 2px 12px #616161;
    display: none;
}
.pay_stub_detail_pop::before{
    content: "";
    display: block;
    width: 100%;
    height: 142px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}
.pay_stub_detail_pop::after{
    content: "";
    display: block;
    width: 89%;
    height: 718px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
}
div.transfer_list_wrap{
    width: 88%;
    height: 444px;
    margin-top: 50px;
    padding: 2px 0.3em;
    /* overflow: scroll; */
    position: relative;
    top: -21px;
    z-index: 99;
    left: 5.5%;
    box-sizing: border-box;
    /* background-color: #F8F8F8; */
    /* font: bold 4em 'Noto sans KR'; */
    overflow: scroll;
}
.transfer_list_wrap img{
    position: relative !important;
    width: 100%;
    height: 400px;
    left: 0 !important;
    top: 20px !important;
    
}
.pay_stub_wrap{
    
    padding: 10px 1em;
}
.back_color{
    background-color: #fff;
    padding: 10px;
}

.closeBtn{
    top: 56px !important;
    /* top: -94px !important; */
}
.transfer_x{
    top:-50px !important
}
.transfer_button.tb_X_btn{
    margin-top: -149px;
    width: 72%;
    margin-left: 15%;
}
.transfer_x p{
    /* background: darkblue; */
    position: relative;
    top: -49px !important;
    left: -88%;
    font: bold 1.1em 'Noto sans KR';
    text-align: center;
    color: #ffffff;
}
.correction_list3{
   position: relative !important;
   top:-28px !important;
}
#PDFVIEW_PAYSTUB{
    /* background-color: #000; */
    position: relative;
    top: -83px;
}
.pay_stub_title{
    font: bold 1.2em 'Noto sans KR';
    color: #455170;

}
.pay_stub_month{
    font: bold 0.9em 'Noto sans KR';
    text-decoration: underline;
    font-weight: 500;
    color: #8990a3;
}
.pay_stub_user{
    margin-top: 20px;
}
.display_flex{
    display: flex;
    text-align: center;
}
.pay_user_title{
    width: 30%;
    border: 1px solid;
    padding: 5px;
    font: bold 0.9em 'Noto sans KR';
}
.pay_user_content{
    width: 70%;
    border: 1px solid;
    border-left: none;
    padding: 5px;
    font: normal 0.9em 'Noto sans KR';
}
.pay_money_detail{
    margin-top: 20px;
}
.main_title{
    width: 50%;
    border: 1px solid #000;
    padding: 5px;
    background: #21417d;
    font: bold 0.9em 'Noto sans KR';
    color: #fff;
}
.sub_title{
    width: 25%;
    border: 1px solid #000;
    padding: 5px;
    border-top: none;
    font: normal 0.75em 'Noto sans KR';
    background: #3281bd;
    color: #fff;
}
.r{
    border-right: none !important;
}
.l{
    border-left: none;
}
.t{
    border-top: none;
}

.money_contents{
    width: 25%;
    border: 1px solid;
    border-top: none;
    padding: 5px;
    border-right: none;
    font: bold 0.7em 'Noto sans KR';
}

.money_contents_right{
    width: 25%;
    border: 1px solid;
    border-top: none;
    padding: 5px;
    font: normal 0.7em 'Noto sans KR';
}
.pay_money_mount{
    width: 25%;
    border: 1px solid;
    border-top: none;
    padding: 5px;
    font: normal 0.7em 'Noto sans KR';
}
.pay_money_mount_real{
    width: 82%;
    border: 1px solid;
    border-top: none;
    padding: 5px;
    font: bold 0.7em 'Noto sans KR';
}
.how_to_calc{
    margin-top: 20px;
}
.calc_title2{
    text-align: center;
    border: 1px solid #000;
    padding: 5px;
    background: #21417d;
    font: bold 0.9em 'Noto sans KR';
    color: #fff;
}
.calc_subtitle1{
    width: 30%;
    border: 1px solid;
    padding: 5px;
    border-top: none;
    font: bold 0.7em 'Noto sans KR';
}
.calc_calc_item{
    width: 35%;
    border: 1px solid;
    padding: 5px;
    border-left: none;
    border-top: none;
    font: normal 0.7em 'Noto sans KR';
}
/* 급여명세서발송 팝업 */

div#specification_pop{
    width:30%;
    height: 280px;
    position: fixed;
    right: 18%;
    top:300px;
    background-color: rgb(255, 255, 255);
    z-index: 99999999;
    box-shadow:2px 2px 12px #616161;
    display: none;
}

   div#specification_pop i{
    width: 5%;
    height: 20px;
    float: right;
    margin-top: 14px;
    cursor: pointer;
    color: #b3b4c4;
   }

div#stub_save_pop{
    width:30%;
    height: 280px;
    position: fixed;
    right: 18%;
    top:300px;
    background-color: rgb(255, 255, 255);
    z-index: 99999999;
    box-shadow:2px 2px 12px #616161;
    display: none;
}

div#stub_save_pop i{
    width: 5%;
    height: 20px;
    float: right;
    margin-top: 14px;
    cursor: pointer;
    color: #b3b4c4;
}

.calc_title{
    margin-top: -10px;
    margin-bottom: 20px;
}
.calc_container p{
    text-align: center; 
    font: bold 1.2em 'Noto sans KR';
    color: #424e8f;
}
.calc_items_container{
    width: 93%;
    margin: 0px auto;
    border-radius: 10px;
    /* border: solid 1px #e0dede; */
    position: relative;
    top: 479px;
    padding: 1px 0.3em;
    height: 415px;
    box-sizing: border-box;
    z-index: 9;
}
.calc_items_container_full{
       /* background: linear-gradient(274.42deg, #eaeeff 0%, #eff1fa 70%); */
       border-radius: 10px;
       padding: 10px 1em;
       position: relative;
       height: 145px;
       top: 369px;
}
.calc_items_container_short{
          /* background: linear-gradient(274.42deg, #eaeeff 0%, #eff1fa 70%); */
    border-radius: 10px;
    padding: 10px 2.2em;
    height: 230px;
    position: relative;
    margin-bottom: 10px;
    top: 412px;
}
.payment_popup_details_short{
    margin-top: 100px;
}
.payment_popup_details_short>li{
    position: relative;
    z-index: 19;
}

.calc_items {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 11.5px;
    font: normal 0.95em 'Noto sans KR';
    color: #494952;
}
.calc_items_title{
    width: 110px;
    font: bold 0.95em 'Noto sans KR';
    color: #494952;
    padding-left: 10px;
}
.calc_items input {
    padding: 10px;
    text-align: right;
    border: none;
    font: normal 12px 'Noto sans KR';
}
.pay_explain{
    width: 130px !important;
}
input::placeholder{
    font-size: 10px;
}
#payment_BTN{
    top: -158px !important;
}

div#employee_popup_wrap3{
    width:30%;
    height: 280px;
    position: fixed;
    right: 18%;
    top:300px;
    background-color: rgb(255, 255, 255);
    z-index: 99999999;
    box-shadow:2px 2px 12px #616161;
    display: none;
}
div#employee_popup_wrap3 i{
    width: 5%;
    height: 20px;
    float: right;
    margin-top: 14px;
    cursor: pointer;
    color: #b3b4c4;
    /* background-color: rgb(145, 145, 184); */
}

.closeBtn.send_statement button{
    background-color: #42497a;
    width: 25%;
    height: 30px;
    background: -webkit-linear-gradient(-45deg, rgb(79, 102, 192) 1%,rgb(61, 95, 196) 50%,rgba(123,153,229,1) 100%);
    box-shadow: 0 -2px 5px rgb(79, 91, 138) inset;
    padding: 0.7em 5%;
    display: flex;
    margin-top: -16px;
    margin-left: 37%;
    align-items: center;
    color: white;
    padding-left: 10%;
    border: none;
    position: relative;
    z-index: 9;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer;
}
.closeBtn.send_statement button p{
    font: bold 1.2em 'Noto sans KR';
    color: #ffffff;
}
/* 저장 */
div#employee_popup_save{
    width:30%;
    height: 280px;
    position: fixed;
    right: 18%;
    top:300px;
    background-color: rgb(255, 255, 255);
    z-index: 99999999;
    box-shadow:2px 2px 12px #616161;
    display: none;
}
div#employee_popup_save i{
    width: 5%;
    height: 20px;
    float: right;
    margin-top: 14px;
    cursor: pointer;
    color: #b3b4c4;
    /* background-color: rgb(145, 145, 184); */
}

/* 초대 취소 */
div#invite_cancel_pop{
    width:30%;
    height: 280px;
    position: fixed;
    right: 18%;
    top:300px;
    background-color: rgb(255, 255, 255);
    z-index: 99999999;
    box-shadow:2px 2px 12px #616161;
    display: none;
}
div#invite_cancel_pop i{
    width: 5%;
    height: 20px;
    float: right;
    margin-top: 14px;
    cursor: pointer;
    color: #b3b4c4;
    /* background-color: rgb(145, 145, 184); */
}

/* 회수 */
div#employee_popup_return{
    width:30%;
    height: 280px;
    position: fixed;
    right: 18%;
    top:300px;
    background-color: rgb(255, 255, 255);
    z-index: 99999999;
    box-shadow:2px 2px 12px #616161;
    display: none;
}
div#employee_popup_text_return{
    margin-top: 65px;
}
div#employee_popup_return i{
    width: 6%;
    height: 20px;
    float: right;
    margin-top: 14px;
    cursor: pointer;
    color: #b3b4c4;
    /* background-color: rgb(145, 145, 184); */
}

.employee2{
    width: 70% !important;
    text-align: center;
    margin-top: 40px !important;
    font: normal 0.92em 'Noto sans KR';
    color: #35353b;
    letter-spacing: 2%;
    margin-left: 17% !important;
    /* background-color: rgb(165, 165, 201); */
}

/* 급여명세서관리팝업  */

div.pay_slip_management_wrap{
    width: 25%;
    height: 560px;
    position: fixed;
    right: 22%;
    top: 200px;
    background-color: #F8F8F8;
    z-index: 99999;
    box-shadow: 2px 2px 12px #616161;
    display: none;
}
div.pay_slip_management_wrap::before{
    content: "";
    display: block;
    width: 100%;
    height: 142px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}

div.pay_slip_management_wrap::after{
    content: "";
    display: block;
    width: 89%;
    height: 387px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
}


div#pay_slip_text{
    width: 100%;
    height: 30px;
    margin-top: -102px;
    position: relative;
    z-index: 9;
    padding: 2px 0.4em;
    box-sizing: border-box;
    /* background-color: rgb(218, 218, 233); */
}
.add_employee_close_icon{
    margin-top: -48px !important;
    margin-right: 5px !important;
}
div#pay_slip_text p{
    font: bold 1.1em 'Noto sans KR';
    text-align: center;
    color: #ffffff;
}
div#pay_slip_text i{
    color: #ffffff;
    font-size: 0.87em;
    cursor: pointer;
    float: right;
    margin-top: -53px;
    margin-right: 1%;
}


#employee_payment_close_icon
,#employee_inquiry_contract_icon {
    margin-top: -54px !important;
    margin-right: 5px !important;
}
#employee_contract_close_icon{
    margin-top: -50px !important;
}
#salary_contract_x{
    margin-top: -55px !important;
}
div.pay_slip_list_wrap{
    width: 100%;
    height: 360px;
    margin-top: 25px;
    padding: 0px 2.5em;
    position: relative;
    box-sizing: border-box;
    z-index: 9;
    /* background-color: rgb(231, 231, 247); */
}
#contract_close_btn button {
    width: 28%;
    height: 35px;
    background: -webkit-linear-gradient(-45deg, rgb(79, 102, 192) 1%,rgb(61, 95, 196) 50%,rgba(123,153,229,1) 100%);
    box-shadow: 0 -2px 5px rgb(79 91 138) inset;
    padding: 0.7em 5%;
    display: flex;
    align-items: center;
    padding-left: 5%;
    border: none;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer;
    margin-left: 172px;
    color: #fff;
}
#contract_close_btn p{
    margin-left: 30px;
}
ul.pay_slip_list{
    width: 100%;
    height: 100%;
    margin-top: 18px;
    overflow: auto;
    /* background-color: rgb(236, 230, 213); */
}
ul.pay_slip_list::-webkit-scrollbar {
    width: 5px;
}
ul.pay_slip_list::-webkit-scrollbar-thumb {
    height: 15px !important; /* 스크롤바의 길이 */
    background: #d8dbe0; /* 스크롤바의 색상 */
    border-radius: 10px;
}
ul.pay_slip_list>li{
    width: 100%;
    height: 60px;
    border-radius: 10px;
    box-sizing: border-box;
    margin-top:22px;
    padding: 10px 1.9em;
    box-sizing: border-box;
    background: linear-gradient(274.42deg, #eaeeff 0%, #eff1fa 70%);
    
}
div.pay_slip_list_text_wrap{
    width: 70%;
    height: 100%;
   
    /* background-color: #8c93be; */
}
div.pay_slip_list_text_wrap p{
    font: bold 0.9em 'Noto sans KR';
    color: #484899;
}

.show_contract_payStub {
    position: relative;
    border: none;
    top: -26px;
    left: 70%;
    background: #ADB8E5;
    border-radius: 10px;
    color: #fff;
    font-size: 12px;
    cursor: pointer;
}

div.pay_slip_list_text{
    font: normal 0.79em 'Noto sans KR';
    color: #6c6c74;
}
.show_contract{
    position: relative;
    border: none;
    top: -26px;
    left: 220px;
    background: #afbeff;
    border-radius: 10px;
    color: #fff;
    font-size: 12px;
    cursor: pointer;
}
.show_contract_salery{
    position: relative;
    border: none;
    top: -26px;
    left: 59%;
    background: #afbeff;
    border-radius: 10px;
    color: #fff;
    font-size: 12px;
    cursor: pointer;
}
ul.pay_slip_list>li .send{
    width: 19%;
    height: 26px;
    border: none;
    border-radius: 1em;
    float: right;
    position: relative;
    top: -32px !important;
    /* left: -12%; */
    font: bold 0.8em 'Noto sans KR';
    font-weight: 500;
    color: #6c6c74;
    background: none;


}
ul.pay_slip_list>li .button{
    width: 18%;
    height: 26px;
    border: none;
    border-radius: 1em;
    float: right;
    position: relative;
    top:-32px;
    /*left: -12%;*/
    
    font: bold 0.8em 'Noto sans KR';
    font-weight:500;
    color: #ffffff;
    /* background: linear-gradient(274deg, #c5c5c5 20%, #c5c5c5 70%);  */
}
ul.pay_slip_list>li .nsend{
    width: 27%;
    height: 26px;
    border: none;
    border-radius: 1em;
    float: right;
    position: relative;
    top:-32px;
    /*left: -12%;*/
    font: bold 0.8em 'Noto sans KR';
    font-weight:500;
    background:none;
    color: #6c6c74;
    /* background: linear-gradient(274deg, #9898a8 20%, #9898a8 70%);  */
    text-align: right;
}
div.pay_slip_delete{
    width: 4%;
    height: 15px;
    float: right;
    margin-right: -20%;
    margin-top: -25px;
    cursor: pointer;
    color: #6e7699;
    /* background-color: saddlebrown; */
}
ul.pay_slip_list>li img{
    width: 30px;
    height: 30px;
    position: relative;
    left: 222px;
    top: -35px;
    cursor: pointer;
}

.pay_slip_button{
  
        margin-top: 36px;
}






/* 직원 급여지급 현황 부분  */
div#parttime_friend_payroll_wrap{
    width: 72%;
    height: 100%;
    position: absolute;
    left: 28%;
    top:0px;
    
    /* background-color: rgb(72, 72, 179); */
    background-color: white;
}
#parttime_friend_payroll_wrap_employee{
    width: 100%;
    height: 100%;
    position: absolute;
    top:0px;
}

/* 상단 급여지급현황  */
div.salary_payment_status{
    /* width: 100%;
    height: 105px;
    padding:30px 1.8em; */
    box-sizing: border-box;
    background-color: rgb(255, 255, 255);
    /* border-bottom: solid 1px rgb(218, 217, 221); */
    /* background-color: darkblue; */
}
div.salary_payment_text_box{
    width: 30%;
    height: 40px;
    margin-left: 2%;
    /* background-color: darkcyan; */
}
div.salary_payment_status p{
    font: bold 1.2em 'Noto sans KR';
    color: #424e8f;
}
div.salary_payment_status span{
    font: normal 0.9em 'Noto sans KR';
    color: #9b9da5;
}
div.month_wrap{
    width:50%;
    height: 30px;
    float:left;
    position: relative;
    left: 34%;
    top:-30px;
    /* background-color: darkgoldenrod; */
}
div.month_wrap p{
    width:45%;
    font: normal 0.9em 'Noto sans KR';
    color: #9b9da5;
    float: right;
    margin-top: 4px;
    /* background-color: darkcyan; */
}
div.month_wrap input{
    width: 50%;
    height: 100%;
    border: solid 0.5px #d3d3da;
    font: normal 0.9em 'Noto sans KR';
    color: #696b75;
    background-color: rgb(255, 255, 255);
}

div.month_wrap input:focus{
    outline: none;
}

div.month_wrap input[type="month"]::-webkit-calendar-picker-indicator{
    display: block;
    background: url(/images/taxpal_web/part_time_friend/attendance/circle-chevron-down-solid.svg) no-repeat;
    width: 8%;
    height: 20px;
    margin-top: 9px;
    cursor: pointer;
    /* border-width: thin; */
    /* background-color: darkblue; */
    position: relative;
    left: -7%;
}
/* 화살표 */
div.payroll_arrow_wrap{
    width: 10%;
    height: 30px;
    position: relative;
    right: -3%;
    top:-30px;
    float: right;
    /* background-color: rgb(169, 169, 202); */
}
span.arrow-prev,
.arrow-next {
    position: relative;
    float:left;
    background: #e7e9ee;
    width:30%;
    height:25px;
    border-radius: 100%;
    margin-right:10%;
}
span.arrow-prev:hover{
    background-color: #6c759c;
}
span.arrow-next:hover{
    background-color: #6c759c;
   
}
span.arrow-prev i{
    color: #a8a8a8;
    position: relative;
    top:1px;
    left: 30%;
    cursor: pointer; 
    /* background-color: #a8a8a8; */
}
span.arrow-prev i:hover{
    color: white;
}
span.arrow-next i{
    color: #a8a8a8;
    position: relative;
    top:1px;
    left: 30%;
    cursor: pointer; 
    /* background-color: #a8a8a8; */
}
span.arrow-next i:hover{
    color: white;
}

/* 급여wrap  */
div.salary_payment_status_wrap{
    width: 100%;
    height: 100%;
    padding:26px 2em;
    box-sizing: border-box;
    /* background-color: rgb(255, 255, 255); */
}
div.payment_status_text{
    width: 100%;
    height: auto;
    position: relative;
    top: 10px;
    padding-bottom: 6px;
    /* background-color: #d7d7d7; */
}
.number_of_payroll_text{
    width: fit-content;
    height: 0px;
    background-color: rgb(190, 214, 214);
}

.payment_tooltip{
    width: 7%;
    color: rgb(183 181 194);
    font-size: 1.2em;
    position: relative;
    top: -19px;
    left: 91%;
    /* float: right; */
    /* background-color: #4e588d; */
}
.tooltip_text{
    width: 251px;
    display: none;
    position: absolute;
    top: -60px;
    right: -23%;
    border: 1px solid;
    border-radius: 5px;
    padding: 7px;
    line-height: 19px;
    font-size: 0.64em;
    color: white;
    background: rgb(103, 104, 110);
}
.payment_tooltip:hover .tooltip_text {
    display: block;
  }

/* 우측 아이콘 --> */
div.payment_status_icon{
    width: 20%;
    height: 30px;
    float: right;
    margin-top: -40px;
    /* background-color: darkgoldenrod; */
}
div.payment_status_icon_list {
    width: 100%;
    height: 100%;
    color: #b3b3c0;
 
    /* background-color: darkblue; */
}
div.payment_status_icon_list p{
    font: normal 0.86em 'Noto sans KR';
    color: #858592;
    float: right;
    top:-2px;
    left: -1%;
    text-decoration-line: underline;
    text-decoration-color: rgb(192, 194, 197);
    position: relative;
    cursor: pointer;
    /* background-color: darkgreen; */
}

/* 이번달 총 급여 지급금액 */
.this_salary{
    width: 20%;
    height: 53px;
    position: relative;
    top: 3px;
    text-align: right;
    left: 77%;
    /* background-color: #e5e1d8; */
}
.this_salary .salary_text{
    position: relative;
    font: normal 0.95em 'Noto sans KR';
    color: #525062;
    left: -12%;
}
.this_salary .salary_num{
    font: bold 1.3em 'Noto sans KR';
    font-weight: 900;
    position: relative;
    color: #3B539D;
    top: -13px;
}


.salary_num .salary_num_list{
    font: bold 0.8em 'Noto sans KR';
    font-weight: 600;
    color: #3B539D;
}

/* 지급일 옵션 */
.salary_payment_date{
    width: 500px;
    height: 35px;
    position: relative;
    top: 14px;
    display: flex;
    align-items: center;
    /* background-color: darkgreen; */
}

.salary_payment_date .payment_date_css{
    width: 400px;
    text-indent: 6px;
    height: 100%;
    border-radius: 5px;
    border: solid 1px #c5c7d0;
    /* background-color: darkblue; */
}
.payment_date_css:focus{
    outline: none;
}


/* 급여관리 지급일 테이블 */
.ayment_date_table_wrap{
    width: 98.6%;
    height:72px;
    margin-top: 35px;
    background: #FDFDFD;
    border: 1px solid #D6D7E3;
    border-radius: 5px;
}
.ayment_date_table{
    width: 100%;
    height: 100%;
}
table.ayment_date_table thead{
    border-radius: 5px;
}
table.ayment_date_table thead th{
    /* width: 5%; */
    height: 28px;
    font: bold 0.85em 'Noto sans KR';
    font-weight: 500;
    color: white;
    /* color: rgb(68, 69, 77); */
    line-height: 2;
    /* border-radius: 5px; */
    border: solid 1px #d9d9dc;
    background-color: rgb(147 149 162);
    /* background-color: rgb(241, 241, 243); */
}
table.ayment_date_table tbody tr{
    /* width: 100%; */
    height: 100%;
}
table.ayment_date_table tbody td{
    /* width: 5%; */
    /* height: 20px; */
    font: normal 0.85em 'Noto sans KR';
    color: #5b5d6d;
    text-align: center;
    line-height: 3;
    border-right: solid 1px #c6c8d4;
    /* background-color: darkcyan; */
}
.pay_already_done{
    color: #3971cf;
    font: bold 1em 'Noto sans KR';
}

/* --------------- */
div.payment_status_text p{
    font: normal 1em 'Noto sans KR';
    color: #656572;
}
div.payment_status_text span{
    font: bold 1.1em 'Noto sans KR';
    color: #424e8f;
}
div.status_text{
    font: normal 0.86em 'Noto sans KR';
    color: #8e8e97;
    margin-top: 5px;
}


div.payment_status_text2 p{
    font: bold 1em 'Noto sans KR';
    color: #656572;
}


/* 지급금액/공제/근무/계약관리 --> */
ul.payment_status_list_wrap{
    width: 100%;
    height: 400px;
    margin-top: 25px;
    /* background-color: darkgray; */
}
ul.payment_status_list_wrap>li{
    width: 48.5%;
    height: 175px;
    float: left;
    margin-left: 2%;
    margin-top: 10px;
    border-radius: 5px;
    box-sizing: border-box;
    border: solid 1px rgb(212, 218, 224);
    background-color: #ffffff;
}
ul.payment_status_list_wrap>li::after{
    content: "";
    border-top: solid 38px #F5F5F5;
    border-bottom: solid 1px rgb(211, 219, 226);
    border-radius:  5px 5px 0px 0px;
    position: relative;
    top:-166px;
    display: block;
    /* background-color: darkblue; */
}


ul.payment_status_list_wrap>li:first-child{
    margin-left: 0px;
   
}
ul.payment_status_list_wrap>li:nth-child(2){
    margin-top: 0px;
}
ul.payment_status_list_wrap>li:nth-child(3){
    margin-left: 0px;
}


div.payment_status_list_tilte{
    width: 100%;
    height: 30px;
    padding: 8px 1.3em;
    z-index: 1;
    position: relative;
    
    box-sizing: border-box;
    /* background-color: sandybrown; */
}
div.payment_status_list_tilte p{
    font: bold 0.9em 'Noto sans KR';
    color: #4e4e69;
    /* background-color: #35353b; */
}
div.payment_view_details{
    width:20%;
    float: right;
    margin-top: -20px;
    margin-right: -4%;
    font: normal 0.8em 'Noto sans KR';
    color: #92929c;
    cursor: pointer;
    /* background-color:darkgoldenrod; */
}
div.payment_view_details i{
    margin-left: 9%;
    /* background-color: darkcyan; */
}

ul.payment_status_list_wrap>li img{
    width: 25%;
    height: 80px;
    position: relative;
    left: 7%;
    top:34px;
    /* background-color: saddlebrown; */
}

ul.payment_status_list_wrap>li img img{
    width: 100%;
    display: block;
}

div.payment_view_num{
    width: 45%;
    height: 54px;
    font: bold 1.3em 'Noto sans KR';
    color: #3B3993;
    position: relative;
    left: 48%;
    top:-58px;
    text-align: center;
    line-height: 2.6;
    border-radius: 0.5em;
    background-color: #f5f5f8;
}
div.payment_view_num span{
    font: bold 0.76em 'Noto sans KR';
    color: #3B3993;
}

div.payment_view_details_list{
    width: 67%;
    height: 40px;
    font: normal 0.78em 'Noto sans KR';
    color: #9797a3;
   position: relative;
   top:-48px;
   right:7% ;
   float: right;
   text-align: right;
    /* background-color: darkgray; */
}

.payment_img1{
    width: 27%;
    /* background-color: #35353b; */
}

/* 지급금액팝업  */
div.payment_status_correction_wrap{
    width: 27%;
    height: 710px;
    position: fixed;
    left: 51%;
    top: 100px;
    z-index: 99999;
    display: none;
    background-color: #F8F8F8;
}

.payment_popup_details>li{
    position: relative;
    z-index: 9;
}
div.payment_status_correction_wrap::before{
    content: "";
    display: block;
    width: 100%;
    height: 142px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}
div.payment_status_correction_wrap::after{
    content: "";
    display: block;
    width: 89%;
    height: 460px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
}

.payment_status_correction_wrap input{
    text-align: right;
    height: 23px;
    line-height: 22px;
    border: 0.1em solid transparent;
    border-bottom-color: rgb(0 0 0);
    padding: 0.3em 1px !important;
    outline: none;
    background-color: transparent;
    color: #000;
    transition: .3s cubic-bezier(0.645, 0.045, 0.355, 1);
    font-size: 14px;
    margin-right: -5px;
    width: 100px;
}
.salary_input_wrap{
    font-size: 14px;
    margin-right: 10px;
}
.payment_status_correction_wrap .input_text{
    position: absolute;
    top: 4px;
    font-weight: bold;
    left: 140px;
}
.input_text{
    position: absolute;
    top: 4px;
    left: 135px;
    font-weight: bold;
    width: 50px;
}

.correction_x{
    top:-20px !important;
}

/* 정규직 */
div.payment_status_correction_full{
    width: 25%;
    height: 663px;
    position: fixed;
    left: 50%;
    top: 119px;
    z-index: 9999999;
    background-color: #F8F8F8;
    display: none;
}

div.payment_status_correction_full::before{
    content: "";
    display: block;
    width: 100%;
    height: 142px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}
div.payment_status_correction_full::after{
    content: "";
    display: block;
    width: 89%;
    height: 495px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
}

.payment_popup_details_full{
    margin-top: -14px;
}
.payment_popup_details_full>li{
    position: relative;
    z-index: 19;
}

#calc_logic_pop{
    position: relative;
    top: -374px;
    width: 90%;
    z-index: 9;
    margin: 0px auto;
}
.payment_status_correction_full input{
    text-align: right;
    height: 23px;
    line-height: 22px;
    border: 0.1em solid transparent;
    border-bottom-color: rgb(0 0 0);
    padding: 0.3em 1px !important;
    outline: none;
    background-color: transparent;
    color: #000;
    transition: .3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.payment_status_correction_full .input_text{
    position: absolute;
    top: 4px;
    font-weight: bold;
    left: 140px;
}
.input_text{
    position: absolute;
    top: 4px;
    left: 135px;
    font-weight: bold;
    width: 50px;
}

/* 단시간 */
div.payment_status_correction_short{
    width: 25%;
    height: 820px;
    position: fixed;
    left: 38%;
    top: 100px;
    z-index: 9999999;
    background-color: #F8F8F8;
    display: none;
}

div.payment_status_correction_short::before{
    content: "";
    display: block;
    width: 100%;
    height: 142px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}
div.payment_status_correction_short::after{
    content: "";
    display: block;
    width: 89%;
    height: 565px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
}
.payment_status_correction_short input{
    text-align: right;
    height: 23px;
    line-height: 22px;
    border: 0.1em solid transparent;
    border-bottom-color: rgb(0 0 0);
    padding: 0.3em 1px !important;
    outline: none;
    background-color: transparent;
    color: #000;
    transition: .3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.payment_status_correction_short .input_text{
    position: absolute;
    top: 4px;
    font-weight: bold;
    left: 140px;
}
.input_text{
    position: absolute;
    top: 4px;
    left: 135px;
    font-weight: bold;
    width: 50px;
}

/* 공제 */
div.payment_status_correction_wrap2{
    width: 27%;
    height: 710px;
    position: fixed;
    left: 51%;
    top: 100px;
    background-color: #F8F8F8;
    z-index: 99999;
    box-shadow: 2px 2px 12px #616161;
    display: none;
}

div.payment_status_correction_wrap2::before{
    content: "";
    display: block;
    width: 100%;
    height: 142px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}
div.payment_status_correction_wrap2::after{
    content: "";
    display: block;
    width: 89%;
    height: 411px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
}

/* 정규직 */
div.payment_status_correction_wrap2_full{
    width: 25%;
    height: 521px;
    position: fixed;
    /* position: absolute; */
    left: 50%;
    top: 120px;
   
    z-index: 999999;
    background-color: #F8F8F8;
    display: none;
    
    
}
.deductible{
    top:-7px !important;
}

#savesave{
    top: 14px !important;
}

div.payment_status_correction_wrap2_full::before{
    content: "";
    display: block;
    width: 100%;
    height: 142px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}
div.payment_status_correction_wrap2_full::after{
    content: "";
    display: block;
    width: 89%;
    height: 332px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
}
div.payment_status_correction_wrap2_short{
    width: 25%;
    height: 575px;
    position: fixed;
    /* position: absolute; */
    left: 50%;
    top: 120px;
    z-index: 9999999;
    background-color: #F8F8F8;
    display: none;
    
}

div.payment_status_correction_wrap2_short::before{
    content: "";
    display: block;
    width: 100%;
    height: 142px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}
div.payment_status_correction_wrap2_short::after{
    content: "";
    display: block;
    width: 89%;
    height: 441px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
}
/* #savesave{
    margin-top: 30px !important;
} */
/* 근무정보 */
div.payment_status_correction_wrap3{
    width: 25%;
    height: 600px;
    position: fixed;
    left: 50%;
    top: 175px;
    z-index: 9999999;
    background-color: #F8F8F8;
    display: none;
}

div.payment_status_correction_wrap3::before{
    content: "";
    display: block;
    width: 100%;
    height: 139px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}

div.payment_status_correction_wrap3::after{
    content: "";
    display: block;
    width: 89%;
    height: 441px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
}
div.correction_title{
    width: 100%;
    height: 27px;
    position: relative;
    z-index: 9;
    top: -104px;
    /* background-color: rgb(189, 235, 235); */
}
div.correction_title p{
    font: bold 1.1em 'Noto sans KR';
    text-align: center;
    color: rgb(255, 255, 255);
}
div.correction_title_icon{
    width: 5%;
    height: 100%;
    float: right;
    position: relative;
    top: -54px;
    right: 2%;
    /* background-color: rgb(152, 152, 216); */
}
.close_title_icon{
    margin-top: -58px !important;
    margin-right: -8px !important;
}
div.correction_title_icon i{
    color: #ffffff;
    font-size: 0.9em;
    position: relative;
    cursor: pointer;
    float: right;
    left: 0px;
    top: 0px;
}
#employee_inquiry_payStub_icon{
    color: #ffffff;
    font-size: 0.9em;
    position: relative;
    cursor: pointer;
    float: right;
    left: -6px;
    top: -97px;
}
#employee_payment_history_btn{
    position: relative;
    z-index: 99;
    top: 60px;
}
#vacation_detail_close_icon{
    margin-top: 8px;
}
div.correction_list_wrap{
    width: 100%;
    height: 515px;
    position: relative;
    padding-top: -21px;
    top: -54px;
    box-sizing: border-box;
    /* background-color: seashell; */
}
.move_deductible{
    text-align: right;
    position: absolute;
    top: 65px;
    left:62%;
    z-index: 99;
}
.move_deductible button{
    width: 100%;
    height: 30px;
    background-color: #f7f7f7;
    border: solid 1px #d1d1d5;
    cursor: pointer;
    border-radius: 5px;
    position: relative;
}

.move_to_be_paid{
    justify-content: flex-end;
    display: flex;
       
}
.move_to_be_paid button{
    width: 31%;
    height: 30px;
    background-color: #f7f7f7;
    border: solid 1px #d1d1d5;
    cursor: pointer;
    border-radius: 5px;
    margin-left: 3%;
    margin-right: 15px;
    position: relative;
    z-index: 19;
}
div.correction_list_wrap2{
    width: 89%;
    height: 612px;
    margin: 0px auto;
    position: relative;
    top: -63px;
    z-index: 9;
}

/* 스크롤바 막대 설정*/

div.correction_list_wrap2::-webkit-scrollbar {
    width: 5px;  /* 스크롤바의 너비 */
}

div.correction_list_wrap2::-webkit-scrollbar-thumb {
    height: 15px !important; /* 스크롤바의 길이 */
    background: #d8dbe0; /* 스크롤바의 색상 */
    border-radius: 10px;
}



div.correction_list_rhdwp{
    width: 87%;
    height: 40px;
    padding: 10px 2em;
    margin: 0px auto;
    /* padding: 7px 4%; */
    box-sizing: border-box;
    margin-top: -200px;
    /* background: linear-gradient(274.42deg, #eaeeff 0%, #eff1fa 70%); */
    background-color: #e8e8e8;
    border-radius: 10px;
    position: relative;
}
.correction_list_rhdwp p{
    font: bold 1em 'Noto sans KR';
    color: #42497a;
    margin-top: -3px;
}
.correction_list2{
    width: 100%;
    height: 40px;
    padding: 10px 1.5em;
    box-sizing: border-box;
    /* background-color: darkgoldenrod; */
    margin-top: 40px;
}
.correction_list2 p{
    margin-left: 10px;
}
div.correction_list p{
    width: 22%;
    font: bold 1em 'Noto sans KR';
    color: #42497a;
    margin-left: 4%;
    /* background-color: darkblue; */
}
div.correction_list_num{
    width: 60%;
    height: 100%;
    text-align: end;
    font: bold 1em 'Noto sans KR';
    color: #42497a;
    margin-top: -25px;
    position: absolute;
    top: 32px;
    left: 120px;
}
div.correction_list_num2{
    width: 60%;
    height: 100%;
    text-align: end;
    font: bold 1em 'Noto sans KR';
    color: #42497a;
    margin-top: -25px;
    position: absolute;
    top: 32px;
    left: 122px;
}
ul.payment_popup_details2{
    width: 100%;
    /* height: 190px; */
    
    /* background-color: rgb(247 248 248); */
}
ul.payment_popup_details{
    width: 86%;
    height: 521px;
    margin-top: -22px;
    /* background-color: rgb(247 248 248); */
    padding-top: 1px;
    margin: 0 auto;
    position: relative;
    padding-bottom: 5px;
    /* background: linear-gradient(274.42deg, #eaeeff 0%, #eff1fa 70%); */
    position: relative;
    top: 66px;
    border-radius: 7px;
    margin-bottom: 75px;
    z-index: 19;
}
.payment_popup_wrap{
    height: 620px;
    width: 100%;
    position: relative;
    /* overflow: scroll; */
    overflow-x: hidden;
    top: -100px;
}
.payment_popup_wrap_full{
    height: 385px;
    width: 100%;
    z-index: 9;
}
.underLine{
    padding: 38px 0.5em;
    width: 90%;
    /* position: relative; */
    margin: 0px auto;
    /* top: -2px; */
    /* margin-top: -9px; */
    /* background: #bdbdce; */
}
.salary_line{
    display: flex;
    width: 100%;
    margin-top: -48px;
    position: relative;
    /* padding-bottom: 12px; */
    flex-direction: row;
    align-items: baseline;
    justify-content: space-between;
    top: 13px;
}
.middle{
    display: flex;
    width: 100%;
    margin-top: 0px;
    position: relative;
    /* padding-bottom: 12px; */
    flex-direction: row;
    align-items: baseline;
    justify-content: space-between;
    top: 12px;
    font: bold 0.95em 'Noto sans KR';
    color: #494952;
}
._4th_insurance_salary li {
    height: 30px;
    margin-top: 15px;
    margin-left: 30px;
}
.salary_tax{
    height: 150px;
    background: #f7f8f8;
    margin-top: 50px;
    background: linear-gradient(274.42deg, #eaeeff 0%, #eff1fa 70%);
    border-radius: 10px;
}
.salary_tax li{
    height: 30px;
    margin-top: 10px;
    margin-left: 30px;
}
ul.payment_popup_details_2{
    width: 100%;
    height: 280px;
    margin-top: -30px;
    background-color: rgb(247 248 248);
}
ul.payment_popup_details_vacation{
    width: 100%;
    height: 365px;
    margin-top: -4px;
    position: relative;
    z-index: 9;
    padding-top: 30px;
    /* background: linear-gradient(274.42deg, #eaeeff 0%, #eff1fa 70%); */
    border-radius: 10px;
}
.payment_popup_details_vacation_text{
    margin-top: 10px;
}
.vacation_info_text{
    background-color: #eaecf0;
    width: 81%;
    margin: 0 auto;
    margin-bottom: 34px;
    margin-top: 30px;
    margin-left: 9%;
    border-radius: 7px;
    padding: -2px;
    display: flex;
    justify-content: center;
}
/*.payment_popup_text{
    font: bold 0.95em 'Noto sans KR';
    color: #494952;
}*/
.employee_vacation_info_container{
    margin-top: 30px;
    margin-bottom: 50px;
}
ul.payment_popup_details p{
    font: normal 1em 'Noto sans KR';
    color: #494952;
}
ul.payment_popup_details_vacation p{
    font: bold 1em 'Noto sans KR';
    color: rgb(94, 95, 112);
    font-weight: 500;
}
ul.payment_popup_details>li{
    width: 100%;
    height: 50px;
    border-radius: 0.2em;
    box-sizing: border-box;
    margin-top: 10px;
    /* padding: 10px 1.9em; */
    box-sizing: border-box;
    /* background-color: #F7F8F8; */
}
ul.payment_popup_details_vacation>li{
    width: 100%;
    height: 50px;
    border-radius: 0.2em;
    box-sizing: border-box;
    margin-top: 18px;
    padding: 10px 1.9em;
    box-sizing: border-box;
    background-color: #F7F8F8;
}
ul.payment_popup_details2>li{
    width: 100%;
    height: 50px;
    border-radius: 0.2em;
    box-sizing: border-box;
    margin-top: 18px;
    padding: 10px 1.9em;
    box-sizing: border-box;
    background-color: #F7F8F8;
}

ul.payment_popup_details>li p{
    width: 37%;
    font: bold 0.95em 'Noto sans KR';
    font-weight: 500;
    color: #2e2e31;
    position: relative;
    top: 4px;
}
ul.payment_popup_details_vacation>li p{
    width: 37%;
    font: normal 0.95em 'Noto sans KR';
    color: #64646d;
}
ul.payment_popup_details2>li p{
    width: 33%;
    font: normal 0.95em 'Noto sans KR';
    color: #64646d;
}
div.payment_popup_num{
    width: 40%;
    height: 36px;
    float: right;
    margin-top: -24px;
    margin-right: 15px;
    font: normal 14px 'Noto sans KR';
    color: #000000;
    position: relative;
    /* background-color: rgb(228, 228, 240); */
}

.payment_popup_num input.paymentp_input{
      /* background-color: #262e41; */
      position: relative;
      left: -78%;
      top: -33px;
}

div.payment_popup_num_vacation{
    width: 40%;
    height: 36px;
    /* float: right; */
    margin-top: -24px;
    margin-right: 7%;
    font: normal 0.9em 'Noto sans KR';
    color: #64646d;
    position: relative;
    /* background-color: rgb(228, 228, 240); */
}
.search_popup_num{
    width: 40%;
    height: 36px;
    float: right;
    margin-top: -24px;
    margin-right: 5%;
    font: normal 0.9em 'Noto sans KR';
    color: #64646d;
    position: relative;
}
.salary_won{
    position: absolute;
    top: 8px;
    left: 135px;
    color: #000;
}
.vacation_info{
    margin-left: 110px;
    margin-top: 1px;
    font: normal 1.1em 'Noto sans KR';
    color: #262e41;
    padding-left: 12%;
    width: 110%;
    /* margin-left: 86%; */
}
.vacation_info_text_day{
    display: flex;
    justify-content: space-evenly;
    margin-top: 10px;
}
.vacation_info_text_day li:first-child{
    /* margin-left: 25px; */
}
.vacation_info_text_time{
    margin-top: 10px;
}
#payment_popup_button{
    margin-top: -47px;
    position: relative;
    z-index: 9;
}


/* 계약관리 */
div.payment_status_correction_wrap4{
    width: 25%;
    height: 600px;
    position: fixed;
    left: 53%;
    top: 200px;
    z-index: 9999999;
    background-color: #F8F8F8;
    display: none;
}

div.payment_status_correction_wrap4::before{
    content: "";
    display: block;
    width: 100%;
    height: 142px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}
div.payment_status_correction_wrap4::after{
    content: "";
    display: block;
    width: 89%;
    height: 419px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
}

p.payment_popup_text2{
   width: 39% !important;
    font: normal 0.9em 'Noto sans KR' !important;
    color: #64646d;
    margin-top: 5px;
}

div.payment_popup_num2{
    width: 54%;
    height: 22px;
    float: right;
    margin-top: -23px;
    margin-right: -4%;
    text-align: right;
    font: normal 0.85em 'Noto sans KR';
    color: #a0a0af;
    /* background-color: rgb(228, 228, 240); */
}








   /* 금액입력칸 */
   div.payment_popup_num input {
    width: 100px;
    height: 24px;
    line-height: 28px;
    margin-left: 24%;
    border: 0.1em solid transparent;
    border-bottom-color: rgb(0 0 0);
    padding: 0.2em 0;
    outline: none;
    background-color: transparent;
    color: rgb(66, 66, 66);
    transition: .3s cubic-bezier(0.645, 0.045, 0.355, 1);
    /* background-color: darkblue; */
    font-size: 14px;
    font: normal 0.95em'Noto sans KR';
   }
   /*
   div.payment_popup_num input:focus, div.payment_popup_num input:hover {
    outline: none;
    border-radius: 0.5em;
    border-color: #bfc1cc;
   }
   */
   div.payment_popup_num input::placeholder {
    color: rgb(177, 177, 177);
    letter-spacing: -0.1em;
   }

   div.search_popup_num input {
    width: 59%;
    height: 23px;
    line-height: 22px;
    margin-left: 26%;
    border: 0.1em solid transparent;
    border-bottom-color: rgb(0 0 0);
    padding: 0.3em 1px !important;
    outline: none;
    background-color: transparent;
    color: #000;
    transition: .3s cubic-bezier(0.645, 0.045, 0.355, 1);
    /* background-color: darkblue; */
   }
   
   div.search_popup_num input:focus, div.search_popup_num input:hover {
    outline: none;
    border-radius: 0.5em;
    /*border-color: #bfc1cc; */
   }
   
   div.search_popup_num input::placeholder {
    color: rgb(177, 177, 177);
    letter-spacing: -0.1em;
   }
   
   div.payment_insurance{

    height: 20px;
    position: relative;
    padding-bottom: 20px;
    left: -2%;
    top:10px;
    /* background-color: darkblue; */
   }
   div.payment_insurance p{
    font: bold 1em 'Noto sans KR';
    font-weight: 500;
    color: #000000;
    float: right;
    margin-left: auto;
    width: 60px;
    padding-right: 6px;
   }


.correction_list{
    width: 88%;
    height: 40px;
    margin: 0px auto;
    margin-top: 15px;
    padding: 7px 4%;
    position: relative;
    box-sizing: border-box;
    border-radius: 5px;
    background-color: #eaeaec;
    z-index: 9;
    border-radius: 10px;
    top: -248px;
}
.salary_payment_calc_how{
    margin-top: 460px;
    border: 1px solid;
    padding: 5px;
    margin-left: 20px;
    margin-right: 20px;
}
.salary_payment_calc_how2{
    margin-top: 40px;
    border: 1px solid;
    padding: 5px;
    margin-left: 25px;
    width: 90%;
}
.salary_title_wrap{
    justify-content: space-evenly;
    border: 1px solid;
    border-bottom: none;
}
.salary_calc_how_sub_container_title{
    padding: 5px;
    display: flex;
    border-right: 1px solid;
    background: #57648a;
}
.salary_calc_how_sub_container{
    padding: 5px;
    display: flex;

}
.salary_calc_how_sub{
    width: 30%;
    
}
.salary_calc_hoe_content{
    width: 70%;
    text-align: center;
}
.salary_title_wrap_bottom{
    border: 1px solid;
}
div#payment_popup_button button {
    width: 30%;
    height: 35px;
    background: -webkit-linear-gradient(-45deg, rgb(79, 102, 192) 1%,rgb(61, 95, 196) 50%,rgba(123,153,229,1) 100%);
    box-shadow: 0 -2px 5px rgb(79 91 138) inset;
    padding: 0.2em 5%;
    display: flex;
    margin-left: 36%;
    margin-top: -9px;
    position: relative;
    align-items: center;
    top: 37px;
    padding-left: 5%;
    border: none;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer;
}
div#employee_payment_history_btn button {
    width: 34%;
    height: 35px;
    background: -webkit-linear-gradient(-45deg, rgb(79, 102, 192) 1%,rgb(61, 95, 196) 50%,rgba(123,153,229,1) 100%);
    box-shadow: 0 -2px 5px rgb(79, 91, 138) inset;
    padding: 0.2em 5%;
    display: flex;
    margin-left: 33%;
    margin-top: -9px;
    align-items: center;
    padding-left: 5%;
    border: none;
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer;
    margin-top: -105px;
    z-index: 9;
}
div#commute_btn button {
    width: 29%;
    height: 35px;
    background: -webkit-linear-gradient(-45deg, rgb(79, 102, 192) 1%,rgb(61, 95, 196) 50%,rgba(123,153,229,1) 100%);
    box-shadow: 0 -2px 5px rgb(79, 91, 138) inset;
    padding: 0.2em 5%;
    display: flex;
    /* margin-left: 4%; */
    /* margin-top: -9px; */
    position: relative;
    top: -5px;
    align-items: center;
    padding-left: 5%;
    border: none;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer;
    /* margin-top: 5px; */
}
div#commute_btn button:not(:last-child){
    margin-right: 5%;
}

div#payment_detail_popup_button button {
    width:34%;
    height: 35px;
    background: -webkit-linear-gradient(-45deg, rgb(79, 102, 192) 1%,rgb(61, 95, 196) 50%,rgba(123,153,229,1) 100%);
    box-shadow: 0 -2px 5px rgb(79, 91, 138) inset;
    padding: 0.2em 5%;
    display: flex;
    margin-left: 34%;
    margin-top: -9px;
    align-items: center;
    padding-left: 5%;
    border: none;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer; 
    margin-top: 6px;
}

   .popup_button2{
    margin-top: 20px;
   }
   .popup_button3{
    position: relative;
    top: -136px;
    z-index: 9;
   }
   .popup_button4{
    margin-top: -120px;
   }

  


   div#payment_popup_button button p{
    /* background-color: #3B3993; */
    width: 100%;
    font: normal 1em 'Noto sans KR';
    color: #ffffff;
   }
   div#employee_payment_history_btn button p{
    /* background-color: #3B3993; */
    width: 100%;
    font: normal 1em 'Noto sans KR';
    color: #ffffff;
   }
   div#payment_detail_popup_button button p{
    /* background-color: #3B3993; */
    width: 100%;
    font: normal 1em 'Noto sans KR';
    color: #ffffff;
   }
   div#commute_btn button p{
    /* background-color: #3B3993; */
    width: 100%;
    font: normal 1em 'Noto sans KR';
    color: #ffffff;
   }
 
   



/* 김알바님의 급여 평균입니다. */
div#salary_average_wrap{
width: 100%;
height: 310px;
margin-top: 37px;
/* background-color: rgb(212, 212, 212); */
}




/* 월평균 급여 그래프 -->/ */
div.salary_average_list{
    width: 100%;
    height: 310px;
    margin-top: 20px;
    border-radius: 5px;
    border: solid 1px rgb(209, 216, 223);
    background-color: rgb(255, 255, 255);
    /* background-color: darkblue; */
}
div.salary_average_text{
    width: 40%;
    height: 100%;
    padding: 20px 2em;
    box-sizing: border-box;
    /* background-color: rgb(177, 177, 207); */
}
div.salary_average_text p{
    font: bold 0.9em 'Noto sans KR';
    color: #656572;
}
div.salary_average_text_box{
    width: 90%;
    height: 70px;
    border: solid 0.5px #D4D3E1;
    border-radius: 5px;
    margin-top: 12px;
    padding: 0px 4%;
    box-sizing: border-box;
    background-color: #F8F8FA;
    position: relative;
}
#up_img{
    /* top: 20px; */
    left: 20%;
}
div.salary_average_text_box .inbox_text{
    width: 100%;
    margin-left: 10px;
    margin-top: 15px;
    align-items: center;
    /* background-color: #35353b; */
}

div.salary_average_text_box .inbox_img{
    position: absolute !important;
    top: 16px;
    right: 16px;
    width: 40%;
    text-align: center;
}
div.salary_average_text_box .inbox_img p {
    font: bold 0.7em 'Noto sans KR';
}
div.salary_average_text_box .inbox_img p:nth-child(2){
    font: bold 0.85em 'Noto sans KR';
}
div.salary_average_text_box p{
    /* width: 70%; */
    font: bold 1em 'Noto sans KR';
    color: #52599b;
    position: relative;
    /* background-color: #35353b; */
    /* left: 34%; */
    /* top:13px; */
}
div.salary_average_text_box span{
    font: normal 0.85em 'Noto sans KR';
    color: #656572;
    margin-right: 80px;
}

div.salary_average_text_box .inbox_text .last_month_compare{
    margin-top: 25px;
    display: block;
}

div.salary_average_text_box .inbox_text #up_img{
    position: absolute !important;
}
div.salary_average_text2{
    font: normal 0.83em 'Noto sans KR';
    color: #9595a3;
    margin-top: 10px;
}
.inbox_text2{
    width: 100%;
    margin-left: 4%;
    /* background-color: #35353b; */
}

/* 그래프 */
div.payroll_bargraph{
    width: 58%;
    height: 100%;
    float: right;
    position: relative;
    right: 1%;
    top:-193px;
    /* background-color: rgb(232, 238, 238); */
}
canvas#payroll_bar{
    /* width: 100%; */
    /* height: 184px !important; */
    /* margin-top: 7px; */
    /* background-color: darkblue; */
    display: block;
    box-sizing: border-box;
    height: 260px !important;
    width: 472px;
    margin-top: -90px;
}
.no_data_alba{
    top: 22px;
    left: 135px;
    position: absolute;
    display: flex;
    align-items: center;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color: #434659;
    justify-content: center;
    flex-direction: column;
    font-family: 'Noto sans KR';
}
.vacation_box{
    border: 1px solid #cacaca;
    padding: 14px;
    border-radius: 7px;
    width: 77%;
    height: 155px;
    margin: 0 auto;
}
.vacation_box p{
    color: #64646d;
}
.vacation_box table{
    margin-top: 15px;
    font: normal 0.9em 'Noto sans KR';
}
.vacation_table{
    width: 100%;
    text-align: center;
}
.vacation_title{
    border: 1px solid #dbdbdb;
    height: 30px;
    background-color: #556a9d;
    color: #fff;
}
.vacation_contents{
    border: 1px solid #dbdbdb;
    height: 30px;
    background-color: #fff;
}
.vacation_title td{
    padding: 0.5em;
}
.vacation_contents td{
    padding: 0.7em;
    /* box-sizing: border-box; */
}
.reason_css{
    white-space: nowrap;
    width: 96px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.reason_css{
    white-space: nowrap;
    width: 96px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 알바 급여 근태 */
div.month_wrap2.paymonth{
    width:71%; 
    height: 50px;
    margin: 0px auto;
    /*margin-top: -4px; */
    margin-top: 12px;
    position: relative;
    left: 0%;
    
    /* background-color: darkgoldenrod; */
}

/* 켈린더 추가 CSS */
.fc .fc-button:focus {box-shadow: none !important;}
.fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events {position: absolute !important; bottom: 1px !important; display: flex; flex-direction: column; align-items: flex-start;justify-content: flex-end; width: 100%;}
.fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events .fc-daygrid-event-harness {width: 100%; }
.fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events .fc-daygrid-event-harness a{padding: 1px 3px;}
.fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events .fc-daygrid-event-harness a .fc-event-title{font-weight: bold; font-size: 12px; text-align-last: justify; padding: 0 4px; width: 100%;}
.fc .fc-prev-button, .fc .fc-next-button { background: unset; border: none; margin: 0 10px; }
.fc .fc-header-toolbar { background: #3f4c6a; padding: 1.5em 0; margin-bottom: 0 !important; border: 1px solid #ddd; }
.fc .fc-toolbar-title {color: #fff; font-weight: bold;}
.fc .fc-col-header-cell-cushion {font-weight: bold;}

/* 급여 명세서 작성 팝업 */
.write_pay_stub{
    width: 30%;
    height: auto;
    position: fixed;
    right: 35%;
    top: 230px;
    background-color: #F8F8F8;
    z-index: 9;
    box-shadow: 2px 2px 12px #616161;
    display: none;
}
.write_pay_stub::before{
    content: "";
    display: block;
    width: 100%;
    height: 142px;
    position: relative;
    top: 0px;
    background: linear-gradient(95.05deg, #5c688d 1.66%, rgb(58 76 119 / 99%) 105.24%);
}
/* .write_pay_stub::after{
    content: "";
    display: block;
    width: 89%;
    height: 337px;
    margin: 0px auto;
    position: absolute;
    top: 85px;
    left: 5%;
    border-radius: 20px;
    background-color: #ffffff;
} */

.write_pay_stub_icon{
    float: right;
    margin-top: -130px;
    margin-right: 10px;
    color: white;
    z-index: 9;
    position: relative;
}

.write_pay_stub_title{
    font: bold 1.1em 'Noto sans KR';
    text-align: center;
    color: rgb(255 255 255);
    padding: 20px;
    z-index: 9;
    position: relative;
    top: -122px;
}

.pay_stub_detail{
    display: flex;
    justify-content: space-between;
    margin-bottom: 9px;
    padding: 8px;
    align-items: center;
}
.pay_stub_duration{
    display: flex;
}

.pay_stub_contents{
    z-index: 9;
    position: relative;
    top: -121px;
}
.pay_stub_contents_wrap{
    width: 90%;
    margin-left: 5%;
}
.stub_wrap{
    padding: 19px 2em;
    width: 100;
    background: #ffffff;
    border-radius: 23px;
    margin-top: 10px;
}
.pay_stub_button{
    display: flex;
    justify-content: center;
    position: relative;
    top: -61px !important;
    position: relative;

}
.pay_stub_detail input{
    width: 80px;
    padding: 8px;
    /* border-radius: 11px; */
    /* border-color: #d3d3d5; */
    border: none;
    border-bottom: 1px solid #cacacc;
}
.pay_stub_detail input:focus{
    outline: none;
}
.text_info_input{
    position: relative;
    top: 8px;
    font: normal 1em 'Noto sans KR';
    color: #85858f;
    margin-left: 10px;
}
.text_info{
    font: bold 1em 'Noto sans KR';
    color: #52526b;
}
.text_info_contents{
    font: normal 1em 'Noto sans KR';
    color: #85858f;
}
.text_info_contents_input{
    font: normal 0.9em 'Noto sans KR';
    color: #85858f;
}
.pay_stub_button button{
    /* margin-top: 25px; */
    width: 20%;
    height: 35px;
    background: -webkit-linear-gradient(-45deg, rgb(79, 102, 192) 1%,rgb(61, 95, 196) 50%,rgba(123,153,229,1) 100%);
    align-items: center;
    border: none;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer;
    margin-right: 10px;
    font: bold 0.9em 'Noto sans KR';
    font-weight: 500;
    color: #fff;
}

#specification_pop #salaryMonth{
    color: rgb(77, 83, 122);
    font-size: 14px;
}