@charset "utf-8";

* {
    box-sizing: border-box;
    font-family: 'Noto Sans KR', sans-serif;
}


html {
    scroll-behavior: smooth
}

body {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 14px;
    font-weight: 400;
    /*color: #333*/
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600
}

a {
    text-decoration: none;
}

.hide {
    position: absolute;
    top: -999em;
}

.ir_pm {
    text-indent: -999em;
    white-space: nowrap;
    overflow: hidden;
    font-size: 0
}

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


/*----------input----------*/
label {
    cursor: pointer;
    user-select: none
}

input, select {
    display: inline-block;
    height: 25px;
    line-height: 25px;
    font-size: 1em;
    border: 1px solid #c3c3c3;
    padding-left: 4px;
}

select{
    height: 25px;
    line-height: 25px;
    font-size: 1em;
    padding-left: 2px;
    padding-right: 2px
}

input[type="checkbox"],
input[type="radio"] {
    width: 14px;
    height: 14px;
    cursor: pointer;
    border: none;
    padding: 0;
}

.radio_wrap input[type="radio"] {
    float: left;
    margin-top: 13px;
}
.radio_wrap label {
    float: left;
    margin-right: 6px
}

.search_ul .radio_wrap input[type="radio"],
.search_ul .radio_wrap input[type="checkbox"] {
    float: left;
    margin-top: 6px;
}
.search_ul .radio_wrap label {
    float: left;
    margin-top: 3px;
    margin-right: 6px
}

textarea {
    display: inline-block;
    height: 60px;
    font-size: 1em;
    border: 1px solid #c3c3c3;
    width: 100%;
    margin-top: 4px;
    resize: vertical;
}

input.datepicker {
    width: 76px;
    /*min-width: 90px;
    max-width: 90px;*/
    margin-right: 4px;
}

input.timepicker {
    width: 44px;
    /*min-width: 70px;
    max-width: 70px;*/
}

/*-----input[type="file"]-----*/
.btn_text {
    display: block;
    font-size: 12px;
    line-height: 26px;
    float: left;
    height: 26px;
    width: calc(54% - 80px);
    /*width: 250px;*/
    padding: 0 10px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border: 1px solid #C9CBCD;
    margin-right: 4px;
    margin-top: 6px;
    text-align: left
}

.input_ul .btn_text {
    margin-top: 8px;
}

.write_wrapper_send .btn_text,
.gen_input_table .btn_text {
    margin-top: 4px;
    margin-bottom: 4px;
}

.input_ul .img_file_li {
    height: 200px;
    float: right
}
.uploaded_img_wrap {
    background-color: #f9f9f9;
    width: calc(100% - 170px);
    height: 150px;
    float: left;
    padding: 40px 20px;
    user-select: none
}

.uploaded_img_wrap > img {
    width: auto;
    height: 100%;
    user-select: none
}

.file_input,
.upload_btn,
.file_check {
    display: none
}

.file_check {
    margin-left: 2px;
}


/*-------------------------inline_ul--------------------------*/
.inline_ul,
.inline_ul li {
    display:inline-block;
}


/*-------------------------input_ul--------------------------*/
.ul_wrap {
    width: 96%;
    margin: 0 2%;
    float: left;
    background-color: #fff;
    box-shadow: 4px 4px 8px 0 rgba(0,0,0,0.08);
}
.full_ul_wrap {
    width: 100%;
    float: left;
    background-color: #fff;
    box-shadow: 4px 4px 8px 0 rgba(0,0,0,0.08);
}
.ul_wrap_half {
    width: 47%;
    margin-left: 2%;
    margin-bottom: 2%;
    float: left;
    background-color: #fff;
    box-shadow: 4px 4px 8px 0 rgba(0,0,0,0.08);
    border: 1px solid #dedede
}
.ul_wrap_third {
    width: 30.66666%;
    margin-left: 2%;
    margin-bottom: 2%;
    float: left;
    background-color: #fff;
    box-shadow: 4px 4px 8px 0 rgba(0,0,0,0.08);
    border: 1px solid #dedede
}

.input_ul {
    display: inline-block;
    width: 100%;
    float: left;
    background-color: #fff;
    /*border-top: 3px solid #2f3943*/
}

.input_ul > li {
    display: inline-block;
    width: 100%;
    height: 40px;
    line-height: 40px;
    border-bottom: 1px solid #dedede;
    float: left;
    margin: 0;
    font-size: 0.9em;
}

.input_ul > li.note_li {
    height: 96px;
}
.input_ul > li.note_li textarea {
    width: calc(100% - 170px);
    height: 80px;
    resize: none
}
.input_ul_half > li {
    width: 50%;
}
.input_ul_quarter > li {
    width: 25%;
}
.input_ul_third > li {
    width: 33.33333333%;
}
.input_ul_half > li.full_width,
.input_ul_third > li.full_width,
.input_ul_quarter > li.full_width {
    width: 100%;
}

.input_ul > li.half_width {
    width: 50%;
}
.input_ul > li.two_thirds_width {
    width: 66.66666666%;
}
.input_ul > li.three_quarters_width {
    width: 75%;
}

.input_ul label,
.label_sub,
.input_ul input ~ span {
    display: inline-block;
    height: 100%;
    line-height: 40px;
    font-size: 1em;
}

.input_title {
    display: inline-block;
    width: 150px;
    height: 100%;
    padding-left: 20px;
    font-weight: 500;
    color: #505f71;
    background-color: #f1f1f1;
    float: left;
    margin-right: 10px;
}
button.input_title {
    text-align: left;
    border: none;
    text-decoration: underline;
    font-weight: 500;
}

.input_ul input,
.input_ul textarea,
.input_ul select {
    margin-top: 8px;
    max-width: calc(100% - 170px);
}
.input_ul input[type="text"]:not(.datepicker){
    width: 180px;
}

.input_ul input[type="text"].timepicker {
    width: 70px;
}

.input_ul input[type="text"].full_width {
    width: calc(100% - 170px);
}

/*
.input_ul input[type="text"]:not(.datepicker) {
    width: calc(100% - 170px);
}
*/

.input_ul input[type="text"].timepicker {
    width: 70px;
}

.input_ul textarea {
    width: calc(100% - 200px);
    padding-left: 4px
}
.input_ul select {
    max-width: calc(100% - 170px);
}

/*.input_ul input[type="tel"] {
    width: 100px;
}*/
.input_ul input[type="email"] {
    width: calc(100% - 170px);
}
.input_ul input[type="number"] {
    width: 60px;
}

/*v_scr_wrap*/
.v_scr_wrap {
    padding: 0
}
.v_scr_wrap > span {
    display: block;
    width: 100%;
    height: 100%;
    padding: 10px;
    float: left;
    overflow-x: hidden;
    overflow-y: auto
}

.v_scr_wrap > textarea {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 10px;
    resize: none;
    border: none
}


/*----------buttons----------*/
button {
    cursor: pointer
}

/*-----center_btn_group-----*/
.center_btn_group {
    width: 100%;
    float: left;
    margin-top: 10px;
    display:inline-block;
    text-align: center
}

.center_btn_group > span {
    margin: 0 2px;
}

/*----------icon_btn----------*/
.btn_icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    /*float: left;*/
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 3px
}

/*-----------------buttons------------*/
.gen_btn {
    height: 24px;
    line-height: 18px;
    padding: 0 8px;
    border-radius: 2px;
    background-color: #f9f9f9;
    border: 1px solid #dedede;
    color: #202e3b;
    font-size: 0.9em
}

.gen_btn > .btn_icon {
    margin-top: 3px;
    margin-right: 6px
}

.gen_btn:hover {
    background-color: #f1f1f1;
    box-shadow: inset 2px 2px 2px rgba(255, 255, 255, 0.2),
                0 4px 6px 0 rgba(0,0,0,0.08),
                0 8px 10px 0 rgba(0,0,0,0.02);
}

.inner_btn {
    height: 24px;
    line-height: 18px;
    padding: 0 8px;
    border-radius: 2px;
    background-color: #2f3943;
    border: 1px solid #202e3b;
    color: #c3c3c3;
    font-size: 0.9em
}

.inner_btn > .btn_icon {
    margin-top: 3px;
    margin-right: 6px
}

.inner_btn:hover {
    color: #12ffe4;
    background-color: #202e3b;
    box-shadow: inset 2px 2px 2px rgba(255, 255, 255, 0.2),
                0 4px 6px 0 rgba(0,0,0,0.08),
                0 8px 10px 0 rgba(0,0,0,0.02);
}

/*미리보기 버튼*/
.preview_btn .btn_icon {
    background-image: url(../images/icons/preview_icon.png);
}
.preview_btn:hover .btn_icon {
    background-image: url(../images/icons/preview_icon_hover.png);
}

/*저장 버튼*/
.save_btn .btn_icon {
    background-image: url(../images/icons/save_icon.png);
}
.save_btn:hover .btn_icon {
    background-image: url(../images/icons/save_icon_hover.png);
}

/*저장 버튼*/
.save_btn_navy .btn_icon {
    background-image: url(../images/icons/save_icon_navy.png);
}

/*인쇄 버튼*/
.print_btn .btn_icon {
    background-image: url(../images/icons/print_icon.png);
}
.print_btn:hover .btn_icon {
    background-image: url(../images/icons/print_icon_hover.png);
}

/*인쇄 버튼*/
.print_btn_navy .btn_icon {
    background-image: url(../images/icons/print_icon_navy.png);
}

/*인쇄 버튼*/
.print_btn_navy .btn_icon {
    background-image: url(../images/icons/print_icon_navy.png);
}

/*조회 버튼*/
.search_btn .btn_icon {
    background-image: url(../images/icons/search_icon_navy.png);
}
.search_btn:hover .btn_icon {
    background-image: url(../images/icons/search_icon_blue.png);
}

/*다운로드 버튼*/
.download_btn .btn_icon {
    background-image: url(../images/icons/download_icon.png);
}
.download_btn:hover .btn_icon {
    background-image: url(../images/icons/download_icon_hover.png);
}

/*다운로드 버튼*/
.download_btn_navy .btn_icon {
    background-image: url(../images/icons/download_icon_navy.png);
}

/*sms 버튼*/
.sms_btn .btn_icon {
    background-image: url(../images/icons/sms_icon.png);
}
.sms_btn:hover .btn_icon {
    background-image: url(../images/icons/sms_icon_hover.png);
}
.sms_btn_navy .btn_icon {
    background-image: url(../images/icons/sms_icon_navy.png);
}

/*sms 버튼*/
.fax_btn .btn_icon {
    background-image: url(../images/icons/fax_icon.png);
}
.fax_btn:hover .btn_icon {
    background-image: url(../images/icons/fax_icon_hover.png);
}
.fax_btn_navy .btn_icon {
    background-image: url(../images/icons/fax_icon_navy.png);
}

/*email 버튼*/
.email_btn .btn_icon {
    background-image: url(../images/icons/email_icon.png);
}
.email_btn:hover .btn_icon {
    background-image: url(../images/icons/email_icon_hover.png);
}

/*webmail 버튼*/
.webmail_btn .btn_icon {
    background-image: url(../images/icons/webmail_icon.png);
}
.webmail_btn:hover .btn_icon {
    background-image: url(../images/icons/webmail_icon_hover.png);
}
.webmail_btn_navy .btn_icon {
    background-image: url(../images/icons/webmail_icon_navy.png);
}

/*write 버튼*/
.write_btn .btn_icon {
    background-image: url(../images/icons/write_icon_navy.png);
}

/*schedule 버튼*/
.schedule_btn .btn_icon {
    background-image: url(../images/icons/schedule_icon.png);
}
.schedule_btn:hover .btn_icon {
    background-image: url(../images/icons/schedule_icon_hover.png);
}

/*home 버튼*/
.home_btn .btn_icon {
    background-image: url(../images/icons/home_icon.png);
}
.home_btn:hover .btn_icon {
    background-image: url(../images/icons/home_icon_hover.png);
}

/*user_info 버튼*/
.user_info_btn .btn_icon {
    background-image: url(../images/icons/user_icon.png);
}
.user_info_btn:hover .btn_icon {
    background-image: url(../images/icons/user_icon_hover.png);
}

/*help 버튼*/
.help_btn .btn_icon {
    background-image: url(../images/icons/help_icon.png);
}
.help_btn:hover .btn_icon {
    background-image: url(../images/icons/help_icon_hover.png);
}
/*address_list 버튼*/
.address_list_btn .btn_icon {
    background-image: url(../images/icons/log_icon.png);
}
.address_list_btn:hover .btn_icon {
    background-image: url(../images/icons/log_icon_hover.png);
}

/*approval 버튼*/
.approval_btn .btn_icon {
    background-image: url(../images/icons/doc_icon.png);
}
.approval_btn:hover .btn_icon {
    background-image: url(../images/icons/doc_icon_hover.png);
}

/*log 버튼*/
.log_btn .btn_icon {
    background-image: url(../images/icons/log_icon.png);
}
.log_btn:hover .btn_icon {
    background-image: url(../images/icons/log_icon_hover.png);
}

/*닫기 버튼*/
.win_close_btn .btn_icon {
    background-image: url(../images/icons/close_icon.png);
}
.win_close_btn:hover .btn_icon {
    background-image: url(../images/icons/close_icon_hover.png);
}
/*닫기 버튼*/
.close_btn_navy .btn_icon {
    background-image: url(../images/icons/close_icon_navy.png);
}

/*이전 버튼*/
.prev_btn .btn_icon {
    background-image: url(../images/icons/prev_icon_navy.png);
}

/*다음단계 버튼*/
.next_btn .btn_icon {
    background-image: url(../images/icons/next_icon_navy.png);
}

/*플러스 버튼*/
.plus_btn .btn_icon {
    background-image: url(../images/icons/plus_icon.png);
}
.plus_btn:hover .btn_icon {
    background-image: url(../images/icons/plus_icon_hover.png);
}
/*플러스 버튼*/
.plus_btn_navy .btn_icon {
    background-image: url(../images/icons/plus_icon_navy.png);
}

/*마이너스 버튼*/
.minus_btn .btn_icon {
    background-image: url(../images/icons/minus_icon.png);
}
.minus_btn:hover .btn_icon {
    background-image: url(../images/icons/minus_icon_hover.png);
}
/*마이너스 버튼*/
.minus_btn_navy .btn_icon {
    background-image: url(../images/icons/minus_icon_navy.png);
}

/*삭제 버튼*/
.del_btn .btn_icon {
    background-image: url(../images/icons/del_icon.png);
}
.del_btn:hover .btn_icon {
    background-image: url(../images/icons/del_icon_hover.png);
}

/*삭제 버튼*/
.del_btn_navy .btn_icon {
    background-image: url(../images/icons/del_icon_navy.png);
}

/*내부 삭제 버튼*/
.inner_del_btn,
.inner_edit_btn {
    border: none;
    background-color: transparent;
    cursor: pointer
}
.inner_del_btn .btn_icon,
.inner_edit_btn .btn_icon {
    margin-right: 0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/icons/del_icon_navy.png);
}
.inner_edit_btn .btn_icon {
    background-image: url(../images/icons/write_icon_navy.png);
}
/*제출 버튼*/
.submit_btn .btn_icon {
    background-image: url(../images/icons/check_icon_navy.png);
}
.list_btn .btn_icon {
    background-image: url(../images/icons/list_icon_navy.png);
}

/*체크 버튼*/
.check_btn_navy .btn_icon {
    background-image: url(../images/icons/check_icon_navy.png);
}
/*체크 버튼*/
.check_btn .btn_icon {
    background-image: url(../images/icons/check_icon.png);
}
.check_btn:hover .btn_icon {
    background-image: url(../images/icons/check_icon_hover.png);
}
/*보내기 버튼*/
.send_btn .btn_icon {
    background-image: url(../images/icons/send_icon.png);
}
.send_btn:hover .btn_icon {
    background-image: url(../images/icons/send_icon_hover.png);
}
.send_btn_navy .btn_icon {
    background-image: url(../images/icons/send_icon_navy.png);
}
/*보내기 버튼*/
.msg_btn .btn_icon {
    background-image: url(../images/icons/msg_icon.png);
}
.msg_btn:hover .btn_icon {
    background-image: url(../images/icons/msg_icon_hover.png);
}
.msg_btn_navy .btn_icon {
    background-image: url(../images/icons/msg_icon_navy.png);
}
/*복사버튼*/
.dupe_btn_navy .btn_icon {
    background-image: url(../images/icons/dupe_icon_navy.png);
}
/*취소 버튼*/
.canc_btn_navy .btn_icon {
    background-image: url(../images/icons/canc_icon_navy.png);
}


.up_btn span::before {
    content: "\25B4"
}

.down_btn span::before {
    content: "\25BE"
}
/*tab btn*/
.tab {
    padding: 0;
    float: left;
    overflow: hidden;
    margin-bottom: 10px;
}
.tab button {
    float: left;
    margin-right: 4px
}
.tab button:hover {
   /* background-color: #f9f9f9;*/
}
.tab button.active {
    background-color: #202e3b;
    color: #c3c3c3
}


/*--------------------icons--------------------*/
.env_icon {
    display: block;
    width: 16px;
    height: 16px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/icons/env_icon.png);
    float: left
}

.env_icon_opened {
    display: block;
    width: 16px;
    height: 16px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/icons/env_icon_opened.png);
    float: left
}

.env_icon_closed {
    display: block;
    width: 16px;
    height: 16px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/icons/env_icon_closed.png);
    float: left
}

.file_icon {
    display: block;
    width: 14px;
    height: 14px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/icons/file_icon.png);
    float: left
}

.del_icon {
    display: block;
    width: 14px;
    height: 14px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/icons/del_icon_navy.png);
    float: left;
    cursor: pointer
}

.x_icon::before {
    display:inline-block;
    color: #202e3b;
    margin-left: 4px;
    content: "\2715";
}
.x_icon_b::before {
    display:inline-block;
    color: #202e3b;
    margin-left: 6px;
    content: "\2716";
}
.x_icon_b:hover::before {
    color: #d0213a;
}



/*----------stamp_icon----------*/
.stamp1,
.stamp2,
.stamp3,
.stamp4,
.stamp5,
.stamp6 {
    display: inline-block;
    height: 20px;
    width: 100%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin-top: 4px
}
.stamp1 {
    background-image: url(../images/stamps/stamp1.png);
}
.stamp2 {
    background-image: url(../images/stamps/stamp2.png);
}
.stamp3 {
    background-image: url(../images/stamps/stamp3_blue.png);
}
.stamp4 {
    background-image: url(../images/stamps/stamp4_blue.png);
}
.stamp5 {
    background-image: url(../images/stamps/stamp5.png);
}
.stamp6 {
    background-image: url(../images/stamps/stamp6.png);
}



/*----------------------popup--------------------*/
/*-----modal-----*/
.modal {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: none;
    z-index: 999;
    background-color: rgba(0, 0, 0, 0.3)
}

/*popup 사이즈와 위치 등을 설정*/
.popup {
    width: 660px;
    padding: 20px 30px 30px 30px ;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    background-color: #fff;
    display: none;
    box-shadow: 0px 0px 20px 5px rgba(64,64,64,0.4);
    border: 1px solid #dedede;
}


.full_popup {
    width: 60%;
}
.full_popup2 {
    width: 80%;
    /*background-color: #f9f9f9*/
}
.popup .input_title,
.popup .note_cation,
.popup .input_title_container,
.popup .input_table th {
    background-color: #f9f9f9
}


.sub_popup {
    width: 90%;
    height: 80%;
    padding: 30px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    background-color: #fff;
    display: none;
    box-shadow: 0px 0px 20px 5px rgba(64,64,64,0.5);
}

.show_popup {
    display: block
}

.x_btn {
    display: block;
    width: 22px;
    height: 22px;
    background-color: transparent;
    border: none;
    position: absolute;
    top: 20px;
    right: 20px;
    cursor: pointer
}

.x_btn > span {
    content: "";
    display: block;
    width: 20px;
    height: 2px;
    background-color: #2f3943;
    position: absolute;
    top: 10px;
    right: 0px;
}

.x_btn > span:first-child {
    transform: rotate(-45deg)
}

.x_btn > span:last-child {
    transform: rotate(45deg)
}
.popup_link {
    color: #2157d0;
    cursor: pointer
}
th.popup_link {
    color: #505f71;
    text-decoration: underline;
    cursor: pointer;
}
th.popup_link:hover {
    font-weight: 600
}
.popup_link:hover,
.underline_link:hover {
    text-decoration: underline;
    cursor: pointer
}

.popup_btn_area {
    width: 100%;
    float: left;
    margin-top: 40px;
    display:inline-block;
    text-align: center
}
.popup_btn_area > span {
    margin: 0 2px;
}
.popup_btn_area > span > button {
    width: 90px;
}

.arrow_icon::before {
    width: 30px;
    float: left;
    margin-right: 10px;
    font-size: 2.2em;
    text-align: center;
    margin-top: 180px;
    color: #505f71;
    content: "\279C"
}

.checked_icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 3px;
    border: 1px solid #505f71;
    background-color: #505f71
}

.no_checked_icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 3px;
    border: 1px solid #505f71;
    background-color: #c3c3c3
    /* background-color: #f1f1f1 */
}



/*---------------subtitle----------------*/
.subtitle_wrap {
    width: 100%;
    float: left;
    margin-bottom: 10px;
}

.subtitle {
    display: inline-block;
    font-size: 1.2em;
    height: 24px;
    line-height: 24px;
    margin-right: 4px;
    font-weight: 500;
    float: left
}

.popup .subtitle{
    width: 100%;
    margin-bottom: 10px;
}

.subtitle_icon {
    display: inline-block;
    width: 24px;
    height: 16px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    float: left;
    margin: 4px 2px 0 0
}



/*----------------------subtitle_icon----------------------*/
.sub_wrapper_req .subtitle_icon,
.write_wrapper_req .subtitle_icon {
    background-image: url(../images/icons/cs_icon_navy.png)
}

.sub_wrapper_board .subtitle_icon,
.sub_wrapper_board_view .subtitle_icon {
    background-image: url(../images/icons/notice_icon_navy.png)
}

/*----------------------table-----------------------*/
table {
    width: 100%;
    float: left;
    font-size: 0.9em;
    table-layout: fixed;
    background-color: #fff;
}

th {
    height: 30px;
    padding: 0 10px;
    font-weight: 500;
    color: #505f71;
}

td {
    height: 30px;
    padding: 5px 10px;
    text-align: center;
    word-break: break-all
}

.note_table_caption {
    height: 40px;
    line-height: 40px;
    font-weight: 500;
    color: #505f71;
    background-color: #f1f1f1;
    border-bottom: 1px solid #dedede
}
.popup .note_table_caption {
    background-color: #f9f9f9
}

.gen_th {
    width: 80px;
}
.gen_th_2 {
    width: 160px;
}

/*---------------plain_table-------------*/
.plain_table th {
    border-bottom: 3px solid #dedede;
}
.plain_table td {
    border-bottom: 1px solid #dedede;
}

/*-----------------border_table-----------------*/
.border_table thead th {
    border: 1px solid #dedede;
    border-bottom: 3px solid #dedede;
}
.border_table td,
.border_table tbody th {
    border: 1px solid #dedede;
}


/*-------------------input_table-------------------*/
.input_table th {
    background-color: #f1f1f1;
    border: 1px solid #dedede;
    padding-left: 20px;
    text-align: left
}
.input_table td {
    border: 1px solid #dedede;
    text-align: left
}

.input_table th.no_b_border,
.input_table td.no_b_border {
    border-bottom: none
}
.input_table td input[type="text"]:not(.datepicker),
.input_table td select,
.input_table td input[type="tel"] {
    max-width: 100%
}
.input_table td input[type="text"].timepicker {
    width: 70px;
}
.input_table input[type="text"].full_width {
    width: 100%;
}

/*write_wrapper_send*/
.write_wrapper_send .ul_wrap:last-child {
    margin-top: 2%;
}

.write_wrapper_send .input_table th,
.write_wrapper_send .input_table td,
.gen_input_table th,
.gen_input_table td {
    height: 40px
}

.write_wrapper_send .input_table input[type="text"].full_width {
    width: 100%;
    border: none;
    height: 100%;
}
.write_wrapper_send .input_table input[type="text"].full_width:focus,
.input_table input[type="text"].recvClick:focus {
    border-bottom: 1px solid #202e3b;
}
.input_table input[type="text"].recvClick {
    width: 200px;
    border: none;
    height: 24px;
}

.sel_addr_btn {
    width: 50px
}
.sel_addr_btn_2 {
    width: 72px
}
.input_table td .sel_addr_btn_wrap,
.input_table td .sel_addr_btn_wrap_2 {
    display: block;
    width: 60px;
    padding-left: 10px;
    padding-top: 4px;
    height: 100%;
    float: right;
}
.input_table td .sel_addr_btn_wrap_2 {
    width: 82px;
}
.input_table td .receiver_wrap,
.input_table td .receiver_wrap_2 {
    display: block;
    width: calc(100% - 60px);
    height: 100%;
    float: left;
    padding-top: 4px;
    /*padding-bottom: 3px*/
}
.input_table td .receiver_wrap_2 {
    width: calc(100% - 82px);
}
.input_table td .receiver_wrap .gen_btn,
.input_table td .receiver_wrap_2 .gen_btn {
    margin-bottom: 4px;
}
.write_wrapper_send .select_file,
.write_wrapper_send .file_check,
.gen_input_table .select_file,
.gen_input_table .file_check {
    margin-top: 4px
}

.write_wrapper_send .file_list,
.gen_input_table .file_list {
    display: none
}

.write_wrapper_send .toggle_span,
.gen_input_table .toggle_span {
    display: inline-block;
    width: 100%;
    height: 100%;
    line-height: 42px;
    float: left
}
.write_wrapper_send .toggle_span > span,
.gen_input_table .toggle_span > span {
    display: inline-block;
    width: 100%;
    cursor: pointer;
}
.write_wrapper_send .toggle_span > span::after,
.gen_input_table .toggle_span > span::after {
    /*content: "\25BC";*/
    /*content: "\25BE";*/
    content: "+";
    margin-left: 4px;
    font-weight: 700
}
.write_wrapper_send .toggle_span > .toggle_up::after,
.gen_input_table .toggle_span > .toggle_up::after {
    /*content: "\25B2";*/
    /*content: "\25B4";*/
    content: "-";
    margin-left: 4px;
    font-weight: 700;
}

/*-------------------merge_table-------------------*/
.merge_table_wrap {
    width: 96%;
    margin: 0 2%;
    float: left;
}
.merge_table {
    box-shadow: 4px 4px 8px 0 rgba(0,0,0,0.08);
    background-color: #fff
}
.merge_capt {
    padding-bottom: 8px;
    border: none;
    background-color: transparent;
    color: #202e3b;
}
.l_capt {
    float: left
}
.r_capt {
    float: right
}
.l_capt span,
.r_capt span {
    font-weight: 400
}
.merge_table tbody {
    border-bottom: 2px solid #dedede
}
.merge_table td,
.merge_table th {
    border: 1px solid #dedede
}
.merge_table thead th {
    background-color: #f1f1f1
}
.merge_table tbody th {
    color: #7b7b7b
}



/*-------------------scroll_table----------------*/
.scroll_table,
.scroll_table thead,
.scroll_table tbody,
.scroll_table tfoot,
.scroll_table tr {
    display: block;
    width: 100%;
    float: left
}
.scroll_table {
    overflow-x: auto;
    overflow-y: hidden
}
.scroll_table tbody {
    height: 450px;
    overflow-x: hidden;
    overflow-y: auto
}
.scroll_table td,
.scroll_table th {
    min-width: 300px;
    max-width: 300px;
    line-height: 16px;
    word-break: break-all;
    padding-top: 2px;
    padding-bottom: 2px
}
.scroll_table input[type="number"],
.scroll_table input[type="date"],
.scroll_table input[type="text"]:not(.datepicker),
.scroll_table select,
.scroll_table textarea {
    width: 100%;
}



/*--------------------note_table--------------------*/
/*.note_table tr {
    display: inline-block;
    min-height: 40px;
    max-height: 200px;
}*/





/*-------------------table_wrap----------------*/
.table_wrap,
.full_table_wrap {
    width: 96%;
    margin: 0 2%;
    box-shadow: 4px 4px 8px 0 rgba(0,0,0,0.08);
    float: left;
    background-color: #fff
}
.full_table_wrap {
    width: 100%;
    margin: 0
}
.full_table_wrap th,
.thead_wrap th {
    border: 1px solid #dedede;
    border-bottom: 3px solid #dedede;
}
.full_table_wrap td,
.tbody_wrap td{
    border: 1px solid #dedede;
    border-top: none
}
.thead_wrap {
    width: 100%;
    height: 33px;
    overflow-x: hidden;
    overflow-y: scroll;
    float: left;
}
.tbody_wrap {
    width: 100%;
    height: 451px;
    overflow-x: hidden;
    overflow-y: scroll;
    float: left;
}
.table_wrap tbody tr.active {
    cursor: pointer;
    /*background-color: rgba(18, 255, 246, 0.2)*/
    background-color: #f5ffff;
}
.full_table_wrap tbody tr.active {
    cursor: pointer;
    /*background-color: rgba(18, 255, 246, 0.2)*/
    background-color: #f5ffff;
}
.table_wrap tbody tr:hover:not(.active)  {
    background-color: #f1f1f1;
    cursor: pointer;
}
.full_table_wrap tbody tr:hover:not(.active)  {
    background-color: #f1f1f1;
    cursor: pointer;
}

#activeTbody tr,
#activeTbodyAll tr {
    cursor: pointer;
}
#activeTbody tr.active,
#activeTbodyAll tr.active {
    background-color: #ecf2ff;
    cursor: pointer;
}
/*#activeTbody tr:hover:not(.active)  {
    background-color: #f1f1f1;
    cursor: pointer;
}*/


/*----------text_properties----------*/
.align_l {
    text-align: left
}

.align_r {
    text-align: right
}

.prefix {
    margin-right: 4px;
}
.suffix {
    margin-left: 4px;
}

.bold {
    font-weight: 500
}

th.bold {
    font-weight: 700
}

.red {
    color: #d0213a;
}

.blue {
    color: #2157d0;
}

.gray {
    color: #7b7b7b;
}

.border {
    border: 1px solid #dedede;
}
.border > li:last-child {
    border-bottom: none
}

.v_bar {
    margin: 0 10px
}

.indent_1 {
    padding-left: 26px
}
.indent_2 {
    padding-left: 46px
}


.bg_gray {
    background-color: #f9f9f9
}
.bg_aqua {
    background-color: rgba(18, 255, 246, 0.2)
}
.bg_yellow {
    background-color: rgb(255, 255, 0, 0.4)
}

.bg_1 {
    background-color: #16224b
}
.bg_2 {
    background-color: #146c8f
}
.bg_3 {
    background-color: #108c99
}
.bg_4 {
    background-color: #68a89a
}
.bg_5 {
    background-color: #c9b13f
}
.bg_6 {
    background-color: #f9a61a
}
.bg_7 {
    background-color: #eb6929
}
.bg_8 {
    background-color: #e73923
}
.bg_9 {
    background-color: #c20138
}
.bg_10 {
    background-color: #8b0c3c
}
.bg_11 {
    background-color: #541743
}

/*-----guide-----*/
.guide_box {
    display: block;
    width: 100%;
    padding: 8px;
    float: left;
}

.guide {
    display: block;
    width: calc(100% - 8px);
    font-size: 0.9em;
    font-weight: 400;
    color: #686868;
    float: left
}

.highlight::after {
    content: "*";
    font-size: 1.2em;
    font-weight: 700;
    color: #d0213a;
}

.loader {
    border: 7px solid #f3f3f3;
    border-radius: 50%;
    border-top: 7px solid #d0213a;
    width: 50px;
    height: 50px;
    animation: spin 2s linear infinite;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}