@charset "utf-8";

/* modal */
/* .ws-modal-open,
.ws-modal-open body { overflow: hidden; } */

.ws-modal-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; position: fixed; top: 0; left: 0; z-index: 1000; width: 100%; height: 100%; overflow: hidden; background: rgba(0,0,0,.7); opacity: 0; transition: opacity 0.25s ease;}
.ws-modal-wrap.ws-modal-visible { opacity: 1; }
.ws-modal-wrap.ws-modal-leave { opacity: 0; }

.ws-modal-outer {position:relative; flex:0 0 auto; width:100%; max-height:100%; padding:20px; overflow:auto; -ms-overflow-style:none;/* IE and Edge */ scrollbar-width:none;/* Firefox */}
.ws-modal-outer::webkit-scrollbar {display:none;}

.ws-modal-inner { position: relative; width: 100%; max-width: 480px; margin: 0 auto; background: #fff; border-radius: 24px; overflow: hidden; opacity: 0; transform: scale(0.85); transition: opacity 0.25s ease 0.05s, transform 0.25s ease 0.05s; padding: 40px 50px; text-align: center; }
.ws-modal-wrap.ws-modal-visible .ws-modal-inner { opacity: 1; transform: scale(1); }
.ws-modal-wrap.ws-modal-leave .ws-modal-inner { opacity: 0; transform: scale(0.85); transition-delay: 0s; }

/* 프로그램 신청완료 */
.ws-modal-inner .tit { font-family: var(--cafe); font-size: var(--font-size28); font-weight: 700; line-height: 1.5em; color: #2c2c2c; margin: 24px 0 34px; }
.ws-modal-inner .tit span { color: var(--color-primary); }
.ws-modal-inner p { font-size: var(--font-size18); font-weight: 400; line-height: 1.66em; margin-bottom: 34px; }
.ws-modal-close { display: inline-block; padding: 16px 34px; line-height: 1.5em; border-radius: 50px; background: #F4F4F4; box-shadow: -4px -4px 0 0 rgba(0, 0, 0, 0.20) inset; color: var(--color-primary); font-weight: 800; border: none; letter-spacing: -.02em;}

/* 반응형 */
@media (max-width: 480px) {
    .ws-modal-outer { padding: 15px;}
    .ws-modal-inner { border-radius: 5px; padding: 30px 15px;}
    .ws-modal-inner img { height: 55px; }
    .ws-modal-inner .tit { margin: 15px 0 20px;}
}