@charset "UTF-8";

.app-header__logo > .ml-auto { margin-left: inherit !important;}

.form-control::placeholder { color: #ced4da; }

/* footer */

.footer-logo {
    width: 129px;
    /* height: 37px; */
    /* background-position: 0 -100px; */
    /* margin: 16px 0 2px; */
    display: inline-block;
    color: transparent;
    overflow: hidden;
    vertical-align: top;
    background-image: url(/dist/img/logo2.png);
    /* -webkit-background-size: 196px 182px; */
    background-size: 100% 37px;
    background-repeat: no-repeat;
}

/* 메인 */

.search-edit { width: auto !important; overflow: hidden;margin-right:0; }
.non-user-img { 
    width: 42px;
    height: 42px;
    display: inline-block;
    background-color: #eee;
    border-radius: 2rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.non-user-img > img { 
    position: absolute;
    top: 0;
    left: 0;
    width: 42px;
    height: 42px;
}
.non-user-img > i { color: #aba9a9;font-size: 1rem;margin-top: 32%; }
.mem-user { background-repeat: no-repeat; background-position: center; }
.sport-box { 
    background-color: #dbdada;
    font-size: 0.7rem;
    padding: 0.3rem 0.4rem;
    border-radius: 0.2rem;
    margin-right:5px;
}
.search-wrapper.active .input-holder { width:100%;max-width:290px; }
.search-wrapper .input-holder .search-icon span::before { background: #495057;}
.search-wrapper .input-holder .search-icon span::after { border: 2px solid #495057}

.monitor-box {
    display: block;
    width: 100%;
    /* overflow-x: auto; */
    position: relative;
    border: 1px solid #dbdbdb;
    padding: 1rem;
    border-radius: 1rem;
}

/* datepicker */

.datepicker table { margin:0 auto !important; }

/* modal */

.modal-user-name { 
    font-weight: bold;
    color: rgba(0,0,0,0.8);
    margin-top: 5px;
    opacity: .8; 
}
.modal-user-num { 
    font-size: .7rem;
    color: rgba(0,0,0,0.8);
    opacity: 0.5;
    margin-top: 5px;
}

/* loading */

.loading {
    height: 100%;
    width: 100%;
    /* border: 1px solid; */
    position: absolute;
    max-height: 250px;
    transition: opacity 0.15s linear;
    background-color: #fff;
    opacity: .5;
    background-image: url(/dist/img/loading.gif);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px;
}

/* custom-combobox */

.custom-combobox {
    position: relative;
    display: inline-block;
}

.custom-combobox-toggle {

    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    padding: 0;

}
.custom-combobox-input {
    margin: 0;
    padding: 5px 10px;
}

.ui-widget.ui-widget-content {
    overflow-y: auto;
    max-height: 200px;
    overflow-x: hidden;
}

/* 모니터링 창 */
.monitor-table {
    overflow-y:scroll;
    max-height:250px;
    position:relative;
}

/* 검진차트 */

.info-his-list-box { width: 100%; }
.info-his-list-box > ul { clear:both; }
.info-his-list-box > ul > li { 
    display:inline-block;
    font-size:0.9rem;
    background-color: #e9ecef;
    padding: 0rem 0.3rem 0.1rem 0.4rem;
    border-radius: 0.2rem;
    margin-right: 5px;
}

.top-dashed { border-top: 1px dashed #dbdbdb; }

.info-toggle {
    clear: both;
    overflow: auto;
    margin-bottom: 1rem;
}

.info-toggle > a { font-size: 1.5rem; }

.text-line {
    width: 100%;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

/* input ballon */
.ballon {
    position: relative;
    width: 250px;
    background-color: #fff;
    color: #212529;
    border-radius: 5px;
    padding: 0.5rem;
    margin-top: 11px;
    text-align: center;
    border: 1px solid rgba(26,54,126,0.125);
    font-size:0.7rem;
}

.ballon:before {
    border-top: 10px solid transparent;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid transparent;
    content: "";
    position: absolute;
    top: -9px;
    left: 28px;
    transform: rotate(540deg);
    border-width: 0.5rem 0.5rem 0;
    border-style: solid;
    border-top-color: rgba(0,0,0,0.25);
}
.ballon:after {
    border-color: transparent;
    content: "";
    position: absolute;
    display: block;
    content: "";
    top: -8px;
    left: 28px;
    border-top-color: #fff;
    border-style: solid;
    border-width: 0.5rem 0.5rem 0;
    transform: rotate(540deg);
}

/* table */
.table thead th {
    min-width: 100px;
}

@media screen and (max-width: 991.98px) {
    /* select form */
    .select-form-inline {
        display: inline-block !important;
        width: 100%;
    }
    .select-form-inline > .custom-combobox {
        width: 100%;
    }
    .select-form-inline > .custom-combobox > input {
        width: 90.5% !important;
    }
    .select-form-inline > button {
        margin-left: 0 !important;
        width: 100%;
        margin-top: 0.5rem;
    }
    .select-form-inline > .form-check-inline {
        margin-left: 0rem !important;
        margin-top: 0.5rem;
        width: 100%;
        justify-content: left !important;
    }
    .app-header .app-header__content {
        visibility: visible !important;
        opacity: 1 !important;
        top: 0px !important;
        right: 0;
        left: auto !important;
        width: auto !important;
        background: none !important;
        box-shadow: none !important;
    }
    /* header */
    .dropdown-menu {
        top: 115px !important;
    }

    table > tbody > tr > td {
        min-width: 150px;
    }
}


/* 회원가입 */

.sel-custom-box span.custom-combobox { 
    width:95%; 
    height: calc(2.25rem + 2px);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
}
.sel-custom-box span.custom-combobox input { 
    background: #fff; 
    width: 100%; 
    border: 1px solid #ced4da; 
    padding: .375rem .75rem; 
    border-top-left-radius: 0.25rem; 
    border-bottom-left-radius: 0.25rem; 
}
.sel-custom-box span.custom-combobox a.ui-button { 
    background: #fff; 
    border: 0px;
    border-right: 1px solid #ced4da; 
    border-top: 1px solid #ced4da; 
    border-bottom: 1px solid #ced4da; 
    width: 5.3%;
}

.mem-sport-div { display: flex; width: 100%; }
.mem-sport-div > select:first-child { margin-right: 5px; }

@media (max-width: 768px) {
    .mem-sport-div { display: inline-block; }
    .mem-sport-div > select:first-child { margin-bottom: 5px; }
}