@charset "utf-8";

/* modal */
.ws-modal-open,
.ws-modal-open body {_overflow:hidden; /*사이트에 position:sticky 사용으로 인해서 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); transition:.2s;}

.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:1400px; margin:0 auto; padding:var(--size60) var(--size100) var(--size80); background:#fff;}
.ws-modal-inner .wrap .items {display:flex; flex-wrap:wrap; margin:calc(0px - var(--size10));}
.ws-modal-inner .wrap .item {width:50%; padding:var(--size10);}
.ws-modal-inner .wrap .item.wide {width:100%;}

.ws-modal-inner .btns {margin-top:var(--size40); text-align:center;}

.modal-title {margin-bottom:var(--size25);}
.modal-title h3 {font-size:clamp(20px, calc(26/ var(--inner) * 100vw ),26px); font-weight:700; line-height:1.2; color:#222;}

/* 반응형 */
@media (max-width: 1024px) {

}

@media (max-width: 640px) {	
	.ws-modal-open,
	.ws-modal-open body {overflow:hidden;}
	.ws-modal-inner {padding:20px 15px;}
	.ws-modal-inner .wrap .items {display:block;}
	.ws-modal-inner .wrap .item {width:100%; padding:0; margin-bottom:10px;}
	.ws-modal-inner .wrap .item:last-child {margin-bottom:0;}

}