@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: 1160px; margin: 0 auto; background: #fff; overflow: hidden; opacity: 0; transform: scale(0.85); transition: opacity 0.25s ease 0.05s, transform 0.25s ease 0.05s; padding: 120px 40px 60px; border-radius: 16px; }
.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-close { display: inline-block; width: 48px; height: 48px; background: url(../images/sub/modal-close.png) center no-repeat; background-size: contain; border: none; position: absolute; right: 20px; top: 20px; }

/* 휘트니스 */
.ws-modal-inner h2 { text-align: center; font-size: 32px; font-weight: 600; line-height: 1.4em; color: #121212; margin-bottom: 40px; }
.ws-modal-inner .txtbox { padding: 20px 15px; font-size: 18px; line-height: 1.66em; color: #121212; font-weight: 400; border: 1px solid #ddd; text-align: center; }
.ws-modal-inner .group { margin-top: 50px; }
.ws-modal-inner .group h3 { font-size: 24px; font-weight: 600; line-height: 1.2em; color: #121212; margin-bottom: 25px; }
.ws-modal-inner .group h4 { line-height: 1.6em; font-size: 16px; font-weight: 600; }
.ws-modal-inner .group .txt { line-height: 1.87em; }
.ws-modal-inner .group .txt span.clr { color: #878787; }
.modal-tbl-wrap { overflow: auto; margin-top: 30px; }
.modal-tbl { width: 100%; border-collapse: collapse; border-top: 1px solid #ddd; text-align: center; }
.modal-tbl tr { border-bottom: 1px solid #ddd;}
.modal-tbl tr th { color: #fff; background: #008cd6; line-height: 1.7em; font-weight: 600; padding: 11px 10px;}
.modal-tbl tr td { line-height: 1.7em; padding: 11px 10px; border-right: 1px solid #ddd;}
.modal-tbl tr td:last-child { border-right: none;}
.complete-btn { margin: 50px auto 0; display: flex; align-items: center; justify-content: center; width: 200px; height: 50px; border-radius: 25px; background: #008cd6; color: #fff; line-height: 1.77em; font-size: 18px; font-weight: 600; border: none; }

/* 반응형 */
@media (max-width: 1024px) {
    .ws-modal-close { width: 26px; height: 26px; top: 10px; right: 10px; }
    .ws-modal-inner { padding: 25px 15px; border-radius: 5px; padding-top: 50px; }
    .ws-modal-inner h2 { margin-bottom: 20px; font-size: 22px; }
    .ws-modal-inner .txtbox { padding: 15px 10px; font-size: 14px; }
    .ws-modal-inner .group { margin-top: 30px; }
    .ws-modal-inner .group h3 { font-size: 18px; margin-bottom: 14px; }
    .ws-modal-inner .group h4 { font-size: 14px; }
}
@media (max-width: 640px) {
    .ws-donate-card { flex: 1 1 100%; }
    .ws-donate-card-tit { font-size: 15px; }
}
@media (max-width: 420px) {
    .ws-process .col { width: 100%;}
}