/*!
 * Bootstrap v3.3.7 (http://getbootstrap.com)
 * Copyright 2011-2016 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */

.hidden { display: none!important }

.modalBtn { display: inline-block; padding: 10px 20px; color: #fff!important; border-radius: 5px }
.modalBtn.blue { background-color: #337ab7; border-color: #2e6da4 }
.modalBtn.blue:hover { color: #fff; background-color: #286090; border-color: #204d74 }
.modalBtn.grey { background-color: #707676; border-color: #5a5f5f }
.modalBtn.grey:hover { color: #fff; background-color: #5a5f5f; border-color: #4b5050 }

.modal-close {color: #000; background-color: var(--gray-400); position: absolute; right: 20px; top: 9px; width: 34px; height: 34px; border-radius: 50%;  display: flex; align-items: center; justify-content: center; transition: .3s; opacity: .4; font-size: 22px; font-weight: bold; padding-bottom: 3px;}
.modal-close:hover,
.modal-close:focus {color: #000; opacity: .8 }

.modal-btnArea {position: absolute; top: 9px; right: 90px; display: flex;}
.modal-btnArea > * {margin-left: 4px;}
.modal-btnArea:after {content: ''; width: 1px; position: absolute; top: 7px; bottom: 7px; right: -20px; background: var(--gray-400);}



.modal-open { overflow: hidden }


.modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; display: none; overflow: hidden; -webkit-overflow-scrolling: touch; outline: 0 }
.eacc-line { top: -22px;!important;}
.modal.fade .modal-dialog { -webkit-transition: -webkit-transform .3s ease-out; -o-transition: -o-transform .3s ease-out; transition: transform .3s ease-out; -webkit-transform: translate(0, -25%); -ms-transform: translate(0, -25%); -o-transform: translate(0, -25%); transform: translate(0, -25%) }
.modal.in .modal-dialog { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0) }
.modal-open .modal { overflow-x: hidden; overflow-y: hidden }
.modal-dialog { position: relative; margin: 1.75rem auto }

.modal-content { max-height: calc(100vh - 3.5rem); overflow-y: hidden; position: relative; display: flex; -ms-flex-direction: column; flex-direction: column; background-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, .2); border-radius: 6px; outline: 0; -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5); box-shadow: 0 3px 9px rgba(0, 0, 0, .5) }
.modal-header,
.modal-sch,
.modal-footer { -ms-flex-negative: 0; flex-shrink: 0 }

.modal-header { padding: 0 15px; border-bottom: 1px solid #e5e5e5; height: 50px; line-height: 50px }

.modal-sch {border-bottom: 1px solid rgba(var(--gray-400-rgb),.6); padding: 8px 20px 0; background: var(--gray-100);}

.modal-body { position: relative; overflow-y: auto; flex: 1 1 auto; padding: 15px 20px }
.modal-body.tree { overflow: hidden; padding: 0 }
.modal-bodyIn { padding: 0 15px; height: 100%;}
.modal-bodyIn > .modal-section { width: 100% !important; height: 98% !important }

.modal-footer { display: flex; height: 45px; justify-content: center; align-items: center; border-top: 1px solid #e5e5e5 }
.modal-footer > .btn  { margin: 0 3px }
.modal-footer .modalBtn { padding: 8px 10px; display: inline }

.modal-title { font-size: 1.7rem }
.modal-search { padding: 8px 20px }

.modal-box { padding: 10px; border: 1px solid #d4d5d6; border-top: none; background: #f7f7f7; position: relative }




.modal-scrollbar-measure { position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll }

.modal-header:before,
.modal-header:after,
.modal-footer:before,
.modal-footer:after { display: table; content: " " }
.modal-header:after,
.modal-footer:after { clear: both }

.modal.fade.in { opacity: 1; -webkit-backface-visibility: hidden }

.modal-backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: #000 }
.modal-backdrop.fade { filter: alpha(opacity=0); opacity: 0 }
.modal-backdrop.in { filter: alpha(opacity=40); opacity: .4 }



/* 인쇄 */
@media screen {
    #printSection {display: none; }
}

@media print {

    html, body {
        margin: 0 !important;
        padding: 0 !important;
        width: 100%;
        height: 100%;
        overflow: visible !important;
    }

    .modal-open > *:not(#printSection) {
        display: none;
    }

    #printSection, #printSection * {
        visibility: visible;
    }

    #printSection {
        position: absolute;
        left: 0;
        top: 0;
    }

    .modal-dialog {
        display: none;
    }

    .type-scl {
        display: none;
    }

    /* background image print */
    * {
        -webkit-print-color-adjust: exact;
        color-adjust: exact !important;
    }

    /* Chrome, Safari, Firefox */
    #print {
        width: 100%;
        margin-top: 10px;
    }

    #print .tb-st th,
    #print .tb-st td {
        padding: 4px;
        font-size: 10px;
    }

    #print .approval-tb-st th,
    #print .approval-tb-st td {
        padding: 4px;
        font-size: 10px;
    }

    #printTable {
        width: 100%;
        margin-top: 10px;
    }

    .tb-wrap .tb-st th,
    .tb-wrap .tb-st td {
        line-height: 1.2;
        padding: 4px;
        font-size: 10px;
        height: 30px;
    }

    .panelArea .tb-st th,
    .panelArea .tb-st td {
        line-height: 1.2;
        padding: 4px;
        font-size: 10px;
        height: 30px;
    }

    /* 인쇄 시 댓글 숨김 */
    .comWrap {
        display: none;
    }

    .MultiFile-label span, .MultiFile-label a {
        font-size: 10px;
    }
}


/* 메인 Office Map 모달  */
.edit-from {box-sizing: border-box; display: flex; align-items: center; margin-bottom: 15px; border: 1px solid #ccc; border-radius: 5px;}

.form-title {box-sizing: border-box; display: flex; justify-content: center; align-items: center; flex-basis: 15%; min-width: 120px; border-right: 1px solid var(--grayColor);}
.form-body {box-sizing: border-box; display: flex; width: 100%; padding: 10px;}
.form-btn {height: 28px; line-height: 30px; border: 1px solid #cccccc; border-radius: 4px; padding-left: 16px; padding-right: 16px; user-select: none; cursor: pointer; transition: 150ms all ease-in-out;}

.form-body__save {height: 30px;line-height: 31px; background-color: var(--grayDarkColor); color: #fff; border-radius: 4px; padding-left: 16px; padding-right: 16px; user-select: none; cursor: pointer; transition: 150ms all ease-in-out;}
.form-body__save:hover {background-color: var(--grayLightColor);}

.form-body__attach {border-color: var(--grayLightColor);}
.form-body__attach:hover {border-color: var(--grayLightColor); background-color: var(--mainlineonColor);}

.maps {display: flex; justify-content: center; box-sizing: border-box;}
.map-img {max-width: 100%;}
.no-img {height: 100px; line-height: 100px; color: var(--grayColor); font-size: medium; user-select: none;}

.form-body__title {display: flex; padding: 8px; flex-grow: 1; overflow: hidden; font-size: 1.2rem !important; align-items: center;}
.form-body__del-btn {border-radius: 4px; width: 16px; height: 16px; line-height: 16px; background-color: var(--mainColor); color: white; margin-left: 4px; text-align: center; user-select: none; cursor: pointer; font-size: 8px; transition: 150ms all ease-in-out;}
.form-body__del-btn:hover {background-color: var(--mainonColor);}