@charset "utf-8";

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


/* 기본 설정 */
* {
    box-sizing: border-box;
    font-family: 'Noto Sans KR', sans-serif;
    color: #333
}
html {
    scroll-behavior: smooth;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 14px;
}
body {
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 400;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 700;
    color: #333
}
a {
    text-decoration: none;
}

img {
    user-select: none;
    -webkit-user-drag: none;
}

/* 글자 혹은 개체 감추기 */
.hide {
    position: absolute;
    top: -999em;
}
.dp_none {
    display: none !important
}
.ir_pm {
    text-indent: -999em;
    white-space: nowrap;
    overflow: hidden;
    font-size: 0
}
.clearfix:after {
    content: "";
    clear: both;
    display: block;
}


/* input 기본 설정 */
label,
.label_sub {
    display: inline-block;
    cursor: pointer;
    user-select: none;
    font-size: 0.9rem;
    height: 26px;
    line-height: 26px;
}
input, select,
.check_sub, .radio_sub {
    display: inline-block;
    font-size: 0.9rem;
    height: 26px;
    line-height: 26px;
    border: 1px solid #ccd1d9;
}
input[type="checkbox"],
input[type="radio"] {
    width: 14px;
    height: 26px;
    cursor: pointer;
    margin: 0;
} 
    .check_sub,
    .radio_sub {
        width: 14px;
        height: 26px;
        margin: 0;
        border: none;
    } 
        .check_sub > span,
        .radio_sub > span {
            display: inline-block;
            width: 14px;
            height: 14px;
            border: 1px solid #888;
            border-radius: 4px;
            margin-top: 6px
        }
        .radio_sub > span {
            border-radius: 50%;
        }
        .check_sub.checked > span,
        .radio_sub.checked > span {
            background-color: #7b7b7b
        }
        .tbody_wrap:not(.input) td > .check_sub,
        .tbody_wrap:not(.input) td > .radio_sub {
            height: 14px
        }
            .tbody_wrap:not(.input) td > .check_sub > span,
            .tbody_wraps:not(.input) td > .radio_sub > span {
                margin-top: 0
            }


.check_wrap {
    display: flex;
    flex-direction: row;
}
.check_wrap.center {
    justify-content: center;
}
    .check_wrap.border {
        padding-left: 14px;
        border: 1px solid #ccd1d9;
        border-radius: 4px
    }
    .check_wrap > div {
        margin-right: 14px;
        display: flex;
        flex-direction: row;
    }
        .check_wrap label,
        .check_wrap .label_sub {
            display: flex;
            flex-direction: row;
        }
        .check_wrap input[type="checkbox"],
        .check_wrap .check_sub,
        .check_wrap input[type="radio"],
        .check_wrap .radio_sub {
            margin-right: 4px;
            height: 26px
        } 



textarea {
    display: inline-flex;
    height: 60px;
    font-size: 0.9rem;
    border: 1px solid #ccd1d9;
    width: 100%;
    resize: vertical;
    margin-top: 4px;
}
input.datepicker {
    width: 80px;
    text-align: center;
}
input.timepicker {
    width: 68px;
    text-align: center;
}
input.timepicker.timepicker_2 {
    width: 46px;
}
    .swung_dash {
        margin: 0 4px
    }
input.board_input {
    border: none;
}
input.board_input:focus {
    border-bottom: 1px solid #ccd1d9;
}
input.full_width,
select.full_width {
    width: 100%
}
input[type="text"].mail_input {
    border: none !important
}
    input[type="text"].mail_input:focus {
    border-bottom: 1px solid #0E72ED !important
}
#file {
    border: none
}
#attZone {
    width: 660px;
    height: 160px;
    padding: 0 10px 10px 10px;
    overflow-y: auto;
    border: 1px solid #ccd1d9;
    margin-bottom: 8px;
}

#attZone:empty:before {
    content: attr(data-placeholder);
    color: #999;
    font-size: 1rem;
}

.input_file_wrap {
    width: 100%;
    float: left;
    margin: 7px 0;
}
    .input_file_wrap input[type = "file"] {
        display: none
    }
    .input_file_wrap #selectFile {
        float: left
    }
    .input_file_wrap #fileCheck {
        display: none;
        margin-left: 4px;
        float: left
    }
    .input_file_wrap #selFileCnt {
        height: 26px;
        line-height: 26px;
        text-align: right;
        float: right;
        color: #0E72ED;
        color: #656d78;
        font-weight: 400;
        font-size: inherit;
        user-select: none
    }
#attFileArea {
    width: 100%;
    height: 70px;
    float: left;
    border: 1px solid #ccd1d9;
    border: 1px solid #D6DCEA;
    padding: 4px;
    overflow-y: auto;
    overflow-x: hidden;
    margin-bottom: 7px;
    position: relative;
    user-select: none
}
#attFileArea.free {
    min-height: 70px;
    height: auto
}
    #attFileArea #placeholder {
        width: 100%;
        text-align: center;
        color: #686868;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    #attFileArea > div {
        display: flex;
        width: 100%;
        height: 20px;
        line-height: 20px;
        font-size: 0.9rem;
        color: #434a54;
        align-items: center;
    }

        #attFileArea .canc_btn {
            margin: 4px 4px 4px 0 !important;
            width: 12px !important;
            height: 12px !important;
            flex: 0 0 12px;
        }

        #attFileArea .file_name {
            flex: 1;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        #attFileArea .file_size {
            width: 60px;
            flex: 0 0 60px;
            text-align: right;
        }

        #attFileArea .file_expire {
            width: 200px;
            flex: 0 0 200px;
            text-align: right;
        }
    

/* file_list */
.file_list {
    display: block;
    width: 100%;
    max-height: 70px;
    border: 1px solid #D6DCEA;
    padding: 4px;
    overflow-y: auto;
    overflow-x: hidden;
    margin-bottom: 7px;
    background-color: #f5f7fa;
}
    .file_list.free { 
        overflow-y: visible; max-height: none; 
    }
    .file_list.only_list { 
        margin-bottom: 0 !important; 
        border: none !important; 
        background-color: transparent; 
    }
    .file_list:empty { 
        display: none; 
    }
    .file_list li {
        display: flex;
        align-items: center;
        gap: 6px;
        width: 100%;
        height: 20px;
        line-height: 20px;
        font-size: 0.9rem;
        color: #434a54;
        padding: 0;
    }
        .file_list li .file_icon,
        .file_list li .doc_icon {
            flex: 0 0 12px;
            width: 12px;
            height: 12px;
            margin: 0;
        }
        .file_name_here {
            flex: 1 1 auto;
            min-width: 0;
            cursor: pointer;
        }
        .file_name_here { 
            cursor: pointer; 
        }
        .file_name_here:hover { 
            color: #2157d0; 
        }
            .file_list li .link_text,
            .file_name_here > a {
                display: block;
                max-width: 100%;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                line-height: inherit;
            }
            .file_name_here > a { 
                color: #333; 
            }
            .file_name_here > a:hover { 
                color: #2157d0; 
                cursor: pointer; 
            }
        .file_list li .file_size,
        .file_list li .expire_date {
            flex: 0 0 auto;
            margin-left: 10px;
            line-height: 20px;
        }
        .file_list li .expire_date {
            color: #d0213a
        }
        .file_name_here button {
            margin: 4px 0 4px 6px;
        }


/* att_file_toggle */
.att_file_toggle {
    display: none
}
#toggleBtn span::before {
    content: "\25B4";
    color: #656d78
}
#toggleBtn.down span::before {
    content: "\25BE";
    color: #656d78
}

.input_file {
    display: none
}
.uploaded_img_wrap {
    width: 100%;
    height: 200px;
    padding: 10px 0;
    border: 1px solid #D6DCEA;
    background-color: #FDFDFF;
    margin-top: 6px
}
    .uploaded_img_wrap img {
        width: auto;
        height: auto;
        max-width: 100%;
        max-height: 100%;
        user-select: none
    }
.btn_text {
    float: right;
    width: calc(100% - 160px);
    height: 26px;
    line-height: 26px;
    text-align: right;
    color: #656d78;
    font-weight: 400;
    font-size: 0.9rem;
    user-select: none
}

/* container */
.container {
    width: 96%;
    margin: 2% 0 0 2%;
    display: flex;
    flex-direction: column;
    /* float: left; */
}
    .container.multi {
        display: block;
        float: left
    }
.container_full {
    width: 100%;
    display: flex;
    flex-direction: column;
    /* float: left; */
}
.container_half {
    width: 47%;
    margin: 2% 0 0 2%;
    display: flex;
    flex-direction: column;
    /* float: left; */
}
.container_third {
    width: 30.666666%;
    margin: 2% 0 0 2%;
    display: flex;
    flex-direction: column;
    /* float: left; */
}
.container_auto {
    width: auto;
    display: flex;
    flex-direction: column;
}
.doc_container {
    width: 944px;
    margin: 2% auto;
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
    border: 1px solid #D6DCEA;
    box-shadow: 4px 4px 8px 0 rgba(0,0,0,0.04);
}
    .doc_container .draft_here {
        width: 100%;
        min-height: 670px;
    }
    .doc_container.landscape {
        width: 1330px !important;
        overflow-x: hidden;
        margin: 2%;
        display: flex;
        flex-direction: column;
        background-color: #ffffff;
        border: 1px solid #D6DCEA;
        box-shadow: 4px 4px 8px 0 rgba(0,0,0,0.04);
        float: left
    }
    /* .doc_container .draft_here {
        width: 100%;
        min-height: 939px;
    } */
        .ref_container {
            width: calc(94% - 1330px);
            min-height: 939px;
            overflow-y: auto;
            overflow-x: hidden;
            display: flex;
            flex-direction: column;
            background-color: #ffffff;
            border: 1px solid #D6DCEA;
            margin: 2% 0;
            float: left;
            padding: 20px;
        }
            .ref_container > article {
                width: 100%;
                margin-bottom: 2%
            }

.container.bg,
.container_full.bg,
.container_half.bg,
.container_third.bg {
    background-color: #ffffff;
    /* box-shadow: 4px 4px 8px 0 rgba(0,0,0,0.04); */
}
.container.last_container,
.container_full.last_container,
.container_half.last_container,
.container_third.last_container {
    margin-bottom: 2%
}




/* subtitle_wrap */
.subtitle_wrap {
    width: 100%;
    float: left;
    margin-bottom: 10px;
    user-select: none;
}
    .subtitle_wrap select,
    .subtitle_wrap button {
        float: right;
        margin-left: 4px
    }
    .subtitle_wrap .v_bar {
        float: right;
        margin-right: 6px;
        margin-left: 10px;
    }
    .subtitle {
        height: 26px;
        line-height: 25px;
        float: left;
        font-size: 1.2rem;
        color: #202e3b;
    }   
    .subtitle.full_width {
        width: 100%;
    } 
        .subtitle_icon {
            display: block;
            width: 18px !important;
            height: 18px !important;
            float: left;
            margin: 4px 8px 4px 0 !important;
            background-position: center;
            background-size: contain;
            background-repeat: no-repeat;
        }
        .subtitle_icon.clipboard_icon {
            background-image: url("/images/icons/clipboard_icon_blue.png");
        }
        .subtitle_icon.board_icon {
            background-image: url("/images/icons/board_icon_blue.png");
        }
        .subtitle_icon.notice_icon {
            background-image: url("/images/icons/notice_icon_blue.png");
        }
        .subtitle_icon.notif_icon {
            background-image: url("/images/icons/notif_icon_blue.png");
        }
        .subtitle_icon.cs_icon {
            background-image: url("/images/icons/cs_icon_blue.png");
        }
        .subtitle_icon.doc_icon {
            background-image: url("/images/icons/doc_icon_blue.png");
        }
        .subtitle_icon.clipboard_icon {
            background-image: url("/images/icons/clipboard_icon_blue.png");
        }
        .subtitle_icon.diary_icon {
            background-image: url("/images/icons/diary_icon_blue.png");
        }
        .subtitle_icon.folder_icon {
            background-image: url("/images/icons/folder_icon_blue.png");
        }
        .subtitle_icon.folder_icon_2 {
            background-image: url("/images/icons/folder_icon.png");
        }
        .subtitle_icon.admin_icon {
            background-image: url("/images/icons/admin_icon_blue.png");
        }
        .subtitle_icon.user_icon {
            background-image: url("/images/icons/user_icon_blue.png");
        }
        .subtitle_icon.location_icon {
            background-image: url("/images/icons/location_icon_blue.png");
        }
        .subtitle_icon.mail_icon {
            background-image: url("/images/icons/mail_icon_blue.png");
        }
        .subtitle_icon.webmail_icon {
            background-image: url("/images/icons/webmail_icon_blue.png");
        }
        .subtitle_icon.help_icon {
            background-image: url("/images/icons/help_icon_blue.png");
        }
        .subtitle_icon.guide_icon {
            background-image: url("/images/icons/guide_icon_blue.png");
        }
        .subtitle_icon.clipboard_icon {
            background-image: url("/images/icons/clipboard_icon_blue.png");
        }
        .subtitle_icon.write_icon {
            background-image: url("/images/icons/write_icon_blue.png");
        }
        .subtitle_icon.sched_icon {
            background-image: url("/images/icons/sched_icon_blue.png");
        }
        .subtitle_icon.msgr_icon {
            background-image: url("/images/icons/msg_icon_blue.png");
        }
        .subtitle_icon.key_icon {
            background-image: url("/images/icons/key_icon_blue.png");
        }
        .subtitle_icon.search_icon {
            background-image: url("/images/icons/search_icon_blue.png");
        }
        .subtitle_icon.switch_icon {
            background-image: url("/images/icons/switch_icon_blue.png");
        }
        .subtitle_icon.shipment_icon {
            background-image: url("/images/icons/shipment_icon_blue.png");
        }
        .subtitle_icon.delivery_icon {
            background-image: url("/images/icons/delivery_icon_blue.png");
        }
        .subtitle_icon.menu_icon {
            background-image: url("/images/icons/menu_icon_blue.png");
        }
        .subtitle_icon.check_icon {
            background-image: url("/images/icons/check_icon_blue.png");
        }
        .subtitle_icon.plus_icon {
            background-image: url("/images/icons/plus_icon_blue.png");
        }
        .subtitle_icon.file_icon {
            background-image: url("/images/icons/file_icon_blue.png");
        }
        .subtitle_icon.upload_icon {
            background-image: url("/images/icons/upload_icon_blue.png");
        }
        .subtitle_icon.download_icon {
            background-image: url("/images/icons/download_icon_blue.png");
        }
        .subtitle_icon.setting_icon {
            background-image: url("/images/icons/setting_icon_blue.png");
        }
        .subtitle_icon.key_icon {
            background-image: url("/images/icons/key_icon_blue.png");
        }
        .subtitle_icon.pause_icon {
            background-image: url("/images/icons/pause_icon_blue.png");
        }
        .subtitle_icon.list_icon {
            background-image: url("/images/icons/list_icon_blue.png");
        }
        .subtitle_icon.balloon_icon {
            background-image: url("/images/icons/balloon_icon_blue.png");
        }
        .subtitle_icon.mustmac_icon {
            background-image: url("/images/logos/logo_m_navy.png");
        }
        .subtitle_icon.info_icon {
            background-image: url("/images/icons/info_icon_blue.png");
        }
        .subtitle_icon.card_icon {
            background-image: url("/images/icons/card_icon_blue.png");
        }
        .subtitle_icon.tax_icon {
            background-image: url("/images/icons/nts_icon.png");
        }
        .subtitle_icon.shortcut_icon {
            background-image: url("/images/icons/shortcut_icon_blue.png");
        }
        .subtitle_icon.fix_icon {
            background-image: url("/images/icons/fix_icon_blue.png");
        }
        .subtitle_icon.progress_icon,
        .subtitle_icon.chart_icon {
            background-image: url("/images/icons/progress_icon_blue.png");
        }
        .subtitle_icon.camera_icon {
            background-image: url("/images/icons/camera_icon_blue.png");
        }
        .subtitle_icon.img_icon {
            background-image: url("/images/icons/img_icon_blue.png");
        }
        .subtitle_icon.pc_icon {
            background-image: url("/images/icons/pc_icon_blue.png");
        }
        .subtitle_icon.desktop_icon {
            background-image: url("/images/icons/desktop_icon_blue.png");
        }
        .subtitle_icon.calc_icon {
            background-image: url("/images/icons/calc_icon_blue.png");
        }
        .subtitle_icon.laptop_icon {
            background-image: url("/images/icons/laptop_icon_blue.png");
        }
        .subtitle_icon.id_card_icon {
            background-image: url("/images/icons/id_card_icon_blue.png");
        }
        .subtitle_icon.doc_form_icon {
            background-image: url("/images/icons/doc_form_icon_blue.png");
        }


/* container */
/* search_wrap */
.search_wrap {
    width: 100%;
    padding: 8px 30px;
    color: #202e3b;
    background-color: #f5f7fa;
    border-radius: 6px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    border: 1px solid rgb(214, 220, 234);
}
.search_wrap2 {
    margin-top: 1%
}
    .search_wrap > div {
        margin-right: 20px;
        display: flex;
        flex-direction: row;
        padding: 4px 0;
    }
        .search_wrap > div > label,
        .search_wrap > div > .label_sub {
            font-weight: 500;
            color: #656d78;
        }
        .search_wrap > div > label:first-child,
        .search_wrap > div > .label_sub:first-child,
        .search_wrap > div > input,
        .search_wrap > div > select {
            margin-right: 4px;
        }
        .search_wrap input[type="checkbox"], 
        .search_wrap .check_sub, 
        .search_wrap input[type="radio"],
        .search_wrap .radio_sub {
            height: 26px
        }
        

/* content_wrap */
.content_wrap {
    width: 100%;
    float: left;
}
    .content_wrap.margin_l {
        margin-left: 2%
    }
    .content_wrap.margin_r {
        margin-right: 2%
    }
    .content_wrap.margin_t {
        margin-top: 2%
    }
    .content_wrap.margin_b {
        margin-bottom: 2%
    }
    .content_wrap.margin_auto {
        margin: 2% auto
    }
.content_wrap_half {
    width: 49%;
    margin-right: 2%;
    float: left;
}
.content_wrap_third {
    width: 32%;
    margin-right: 2%;
    float: left;
}
.content_wrap_two_thirds {
    width: 66%;
    margin-right: 2%;
    float: left;
}
.content_wrap_unset {
    width: auto;
    margin-right: 2%;
    float: left;
}
    .content_wrap_half:last-of-type,
    .content_wrap_third:last-of-type,
    .content_wrap_two_thirds:last-of-type,
    .content_wrap_unset:last-of-type {
        margin-right: 0
    }
    .content_wrap.bg,
    .content_wrap_half.bg,
    .content_wrap_third.bg {
        background-color: #ffffff;
    }

.btn_wrap button {
    margin-right: 6px
}
    #checkBtnWrap {
        display: none
    }

/* flex_item_wrap */
.flex_item_wrap {
    display: flex;
    width: 100%
}    
    .flex_item_wrap .item,
    .item {
        display: flex;
        margin-left: 4px
    }
    .flex_item_wrap .item:first-child {
        margin-left: 0
    }
    .flex_item_wrap .item.basis_auto,
    .item.basis_auto {
        flex-basis: auto
    }
    .flex_item_wrap .item.basis_zero,
    .item.basis_zero {
        flex-basis: 0
    }
    .flex_item_wrap .item.full,
    .item.full {
        flex: 1
    }
        


/* tab */
.tab {
    overflow: hidden;
    width: 100%;
    /* height: 30px; */
    border: 1px solid #e9efff;
    border-bottom: 3px solid #e9efff;
    display: flex;
    flex-direction: row;
    background-color: #f5f7fa;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    overflow: hidden
}
    .tab > button {
        flex: 1;
        color: #0e72ed;
        font-weight: 500;
        background-color: #ffffff;
        background-color: #f5f7fa;
        /* border: 1px solid #e9efff; */
        /* border-bottom: none; */
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        height: 100%;
        padding: 8px 14px;
        font-size: 1rem;
    }
        .tab > button > span {
            color: #0e72ed;
        }
    .tab > button:hover {
        background-color: #E9F2FF;
    }
    .tab > button.selected {
        background-color: #0E72ED;
        color: #f5f7fa;
    }
        .tab > button.selected > span {
            color: #f5f7fa;
        }
.tabcontent {
    width: 100%;
    display: none;
    overflow-y: auto
}

/* align */
.align_l {
    text-align: left !important
}
.align_r {
    text-align: right !important
}
.align_c {
    text-align: center !important
}

/* writing-mode */
.vertical_lr {
    writing-mode: vertical-lr !important;
}
.vertical_rl {
    writing-mode: vertical-rl !important;
}
.sideways_lr {
    writing-mode:sideways-lr !important
}
.sideways_rl {
    writing-mode:sideways-rl !important
}

/* weight */
.thin {
    font-weight: 200 !important
}
.bold {
    font-weight: 500 !important
}
.bold_2 {
    font-weight: 700 !important
}

/* color */
.red {
    color: #d0213a !important;
}
.blue {
    color: #2157d0 !important;
}
.blue_2 {
    color: #0e72ed !important;
}
.black {
    color: #333333 !important;
}
.gray {
    color: #7b7b7b !important;
}
.th_gray {
    color: #656d78 !important;
}
.lightgray {
    color: #c3c3c3 !important;
}
.pink {
    color: #dd666f !important;
}    
.yellow {
    color: #ecb246 !important;
}
.green {
    color: #4b9b8e !important;
}    
.deepblue {
    color: #4b679b !important;
}
.stamp_red {
    color: #cd2f2f !important;
}
.stamp_blue {
    color: #28288b !important;
}
.text_inherit {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

.link_text,
.link_text > span,
.popup_link,
.popup_link > span {
    cursor: pointer;
    color: #2157d0;
}
    .link_text:hover,
    .popup_link:hover {
        text-decoration: underline;
    }


/* background */
.bg_gray {
    background-color: #f5f7fa
}
.bg_lightgray {
    background-color: #FBFBFB
}
.bg_bluegray {
    background-color: #e9eff8
}
.bg_aqua {
    background-color: #ecf2ff
}
.bg_blue {
    background-color: #E9F2FF
}
.bg_pink {
    background-color: #FFECF2;
}
.bg_yellow {
    background-color: #fdedce;
}
.bg_green {
    background-color: #cdf4ed;
}
.bg_th {
    background-color: #f5f7fa;
}
.no_bg {
    background: none !important;
}

.f_size_1 {
    font-size: 1rem !important;
}
.f_size_09 {
    font-size: 0.9rem !important;
}
.f_size_08 {
    font-size: 0.8rem !important;
}
.f_size_07 {
    font-size: 0.7rem !important;
}
.f_size_06 {
    font-size: 0.6rem !important;
}
.f_size_05 {
    font-size: 0.5rem !important;
}

/* fix */
.suffix {
    margin-left: 6px !important
}
.prefix {
    margin-right: 6px !important
}
.affix {
    margin: 0 6px !important;
}
.affix_2 {
    margin: 0 10px !important;
}

/* indent */
.indent_1 {
    text-indent: 1rem 
}
.indent_2 {
    padding-left: 2rem
}
.indent_3 {
    padding-left: 3rem
}
.indent_4 {
    padding-left: 4rem
}
.indent_5 {
    padding-left: 5rem
}
.indent_6 {
    padding-left: 6rem
}

/*ellipsis*/
.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
    .ellipsis:not(.align_c) {
        text-align: left
    }
.multiline_ellipsis {
    width: 100%; 
    overflow: hidden; 
    color: inherit;
    line-height: inherit;
    text-align: left; 
    text-overflow: ellipsis; 
    word-break: break-all; 
    display: -webkit-box;
    -webkit-box-orient: vertical
}
    .multiline_ellipsis.line_1 {
        -webkit-line-clamp: 1;
    }
    .multiline_ellipsis.line_2 {
        -webkit-line-clamp: 2;
    }
    .multiline_ellipsis.line_3 {
        -webkit-line-clamp: 3;
    }
    .multiline_ellipsis.line_4 {
        -webkit-line-clamp: 4;
    }
    .multiline_ellipsis.line_5 {
        -webkit-line-clamp: 5;
    }
    .multiline_ellipsis.line_6 {
        -webkit-line-clamp: 6;
    }
.e_toggle {
    text-align: left
}

/*border*/
.border {
    border: 1px solid #D6DCEA !important;
}
    .border_r {
        border-right: 1px solid #D6DCEA !important;
    }
    .border_l {
        border-left: 1px solid #D6DCEA !important;
    }
    .border_t {
        border-top: 1px solid #D6DCEA !important;
    }
    .border_b {
        border-bottom: 1px solid #D6DCEA !important;
    }
.no_border {
    border: none !important;
}
.no_border_r {
        border-right: none !important;
    }
    .no_border_l {
        border-left: none !important;
    }
    .no_border_t {
        border-top: none !important;
    }
    .no_border_b {
        border-bottom: none !important;
    }

/* guide */
.guide {
    display: inline-block;
    width: auto;
    font-size: 0.9rem;
    /* font-weight: 300; */
    font-weight: 400;
    color: #686868;
}
.guide_container {
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 10px;
}
    .guide_container > li {
        font-size: 0.9rem;
        /* font-weight: 300; */
        font-weight: 400;
        color: #686868;
    }
    .guide_container span {
        font-weight: 500;
    }

/* highlight */
.highlight_b::before,
.highlight_a::after,
.highlight_n::after {
    content: "*";
    font-size: 1.2em;
    font-weight: 700;
    color: #d0213a;
}
    .highlight_b::before {
        margin-right: 4px;
    }
    .highlight_a::after {
        margin-left: 4px;
    }
    .highlight_n::after {
        margin-left: 4px;
        color: transparent;
    }

/* width and height */
.auto_height {
    height: auto !important
}
.auto_width {
    width: auto !important
}
.full_height {
    height: 100% !important
}
.full_width {
    width: 100% !important
}
.max_full_height {
    max-height: 100% !important
}
.max_full_width {
    max-width: 100% !important
}

/* float */
.float_l {
    float: left !important;
}
.float_r {
    float: right !important;
}
.float_r_n, 
.no_float {
    float: none !important;
}

/* margin */
.margin_t {
    margin-top: 2%
}
.margin_b {
    margin-bottom: 2%
}
.margin_l {
    margin-left: 2%
}
.margin_r {
    margin-right: 2%
}
.no_margin {
    margin: 0 !important
}
    .no_margin_l {
        margin-left: 0 !important
    }
    .no_margin_r {
        margin-right: 0 !important
    }
    .no_margin_t {
        margin-top: 0 !important
    }
    .no_margin_b {
        margin-bottom: 0 !important
    }
.margin_auto {
    margin: 0 auto
}
.margin_auto_2 {
    margin: 2% auto
}

/* padding */
.no_padding {
    padding: 0 !important
}
.no_padding_l {
    padding-left: 0 !important
}
.no_padding_r {
    padding-right: 0 !important
}
.no_padding_t {
    padding-top: 0 !important
}
.no_padding_b {
    padding-bottom: 0 !important
}
    .padding {
        padding: 2% !important
    }
    .padding_l {
        padding-left: 2% !important
    }
    .padding_r {
        padding-right: 2% !important
    }
    .padding_t {
        padding-top: 2% !important
    }
    .padding_b {
        padding-bottom: 2% !important
    }
    .padding_b_04 {
        padding-bottom: 4px !important
    }

/* no_scroll */
.no_scroll {
    overflow: hidden !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
}

.hidden {
    visibility: hidden !important;
}

/* icon */
.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;
}

.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_blue.png");
    float: left
}
.file_icon:not(.subtitle_icon),
.canc_icon:not(.subtitle_icon),
.del_icon:not(.subtitle_icon),
.write_icon:not(.subtitle_icon),
.msg_icon:not(.subtitle_icon),
.key_icon:not(.subtitle_icon),
.pause_icon:not(.subtitle_icon),
.balloon_icon:not(.subtitle_icon),
.check_icon:not(.subtitle_icon),
.doc_icon:not(.subtitle_icon) {
    display: block;
    width: 14px;
    height: 14px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    float: left !important
}
.file_icon {
    background-image: url("/images/icons/file_icon_blue.png");
}
    .file_icon.inline {
        width: 12px !important;
        height: 12px !important;
        margin: 0 4px 0 0 !important;
        display: inline-block !important;
        float: none !important
    }
.canc_icon {
    background-image: url("/images/icons/canc_icon_blue.png");
}
.del_icon {
    background-image: url("/images/icons/del_icon_blue.png");
}
.write_icon {
    background-image: url("/images/icons/write_icon_blue.png");
}
.msg_icon {
    background-image: url("/images/icons/msg_icon_blue.png");
}
.key_icon {
    background-image: url("/images/icons/key_icon_blue.png");
    margin-top: 4px;
    margin-right: 4px
}
.pause_icon {
    background-image: url("/images/icons/pause_icon_blue.png");
    margin-top: 4px;
    margin-right: 4px
}
.balloon_icon {
    background-image: url("/images/icons/balloon_icon_blue.png");
}
.check_icon {
    background-image: url("/images/icons/check_icon_blue.png");
}
.doc_icon {
    background-image: url("/images/icons/doc_icon_blue.png");
}


.v_bar {
    color: #0E72ED;
    color: #D6DCEA;
}

.user_select_text {
    user-select: text !important;
}

.stamp1,
.stamp2,
.stamp3,
.stamp4,
.stamp5,
.stamp6,
.stamp7,
.stamp8 {
    display: inline-block;
    height: 20px;
    width: 100%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin-top: 5px
}
.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");
}
.stamp7 {
    background-image: url("/images/stamps/stamp7_blue.png");
}
.stamp8 {
    background-image: url("/images/stamps/stamp8.png");
}
.mustmac_stamp {
    display: inline-block;
    height: 60px;
    line-height: 60px;
    width: 100%;
    background-size: contain;
    background-position: right;
    background-repeat: no-repeat;
    margin-top: 6px;
    padding-right: 40px;
    background-image: url("/images/stamps/mustmac_stamp.png");
}


/* loader */
.loader {
    border: 7px solid #f3f3f3;
    border-radius: 50%;
    border-top: 7px solid #12ffe4;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
    @keyframes spin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }





@media print {
    button,
    .note_write_table,
    .search_wrap,
    .bottom_btn_group,
    #top,
    #bottom,
    #snb,
    .no_print {
        display: none !important;
    }

    .link_text,
    .link_text > span,
    .popup_link,
    .popup_link > span {
        color: #222 !important;
    }

    button,
    .no_print  {
        display: none !important;
    }    

    td {
        color: #222;
    }

    /* #top,
    #bottom,
    #snb,
    .search_wrap,
    .subtitle_wrap,
    .b ottom_btn_group,
    .container {
        display: none
    }

    #middle,
    #contentArea,
    .wrapper,
    .sub_wrapper,
    .container_group,
    .container,
    .doc_container,
    .draft_here {
        position: inherit;
        float: left;
        padding: 0;
        margin: 0
    }

    #contentArea,
    .doc_container,
    .draft_here {
        width: 100%;
        height: 100%;
        padding: 0;
        margin: 0;
        border: none;
        background-color: transparent;
    } */
}