.invalid-message {
    position: absolute;
}
.invalid-message .arrow {
    position: relative; width: 25px; margin-left: 15px; padding-bottom: 17.68px; overflow: hidden;
}
.invalid-message .arrow div {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; border: 1px solid #999; transform: rotate(45deg); transform-origin: 0 100%; z-index: 1;
}
.invalid-message .content-wrap {
    display: inline-block; padding: 10px; border: 1px solid #999; margin-top: -1px; background-color: #fff; border-radius: 3px;
}
.invalid-message .content-wrap i {
    color: red;
}
.invalid-message .content-wrap .content {
    margin-left: 5px; font-size: 0.9rem; font-weight: 500;
}
.loading-wrap {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); z-index: 9999;
}
.loading-wrap div {
    position: absolute; top: calc(50% - 25px); left: calc(50% - 25px); width: 50px; height: 50px; text-align: center; background-color: #fff; border-radius: 15px;
}
.loading-wrap div i {
    display: block; margin-top: 10px; font-size: 30px;
}
.alert-wrap {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); z-index: 9999;
}
.alert-wrap > div {
    position: absolute; top: 150px; left: calc(50% - 175px); width: 350px; text-align: center; background-color: #fff; border-top: 30px solid #1d81e1; border-radius: 10px;
}
.alert-wrap .msg {
    padding: 40px 20px 30px; line-height: 20px;
}
.alert-wrap .btn-wrap {
    margin: 0 20px 20px;
}
.alert-wrap .btn-wrap .button {
    padding: 10px 15px; border-radius: 5px;
}


/*        레이어 팝업 공통     */
.layer-popup {
    display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1050; overflow: auto; background-color: rgba(0, 0, 0, 0.3);
}
.layer-popup .inner {
    position: relative; max-width: 500px; margin: 100px auto 50px; padding: 20px; background-color: #fff;
}
.layer-popup .inner.large {
    max-width: 900px;
}
.layer-popup .inner .title {
    margin-top: 0;
}
.layer-popup .popup-close {
    position: absolute; top: 15px; right: 25px; font-size: 1.5rem; cursor: pointer;
}
.layer-popup .popup-header {
    margin-bottom: 20px; font-size: 1.2rem;
}
.layer-popup .popup-content {
    max-height: calc(100vh - 350px); overflow-y: auto;
}
.layer-popup .popup-footer {
    margin-top: 20px; text-align: right;
}

.popup.on {
    display: block !important;
}