.modal-popup {
	display:flex; justify-content:center; align-items:center;
	position:fixed; top:0; left:0; bottom:0; right:0;
	background:none; overflow:auto;
	pointer-events:none;
	z-index:3000;
	opacity:0; zoom:1;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all 0s ease-in-out 0.3s;
	transition: all 0s ease-in-out 0.3s;
}

.modal-popup .popup-content {
	position:relative; padding:34px; box-sizing:border-box;
	-webkit-transform: scale(1);
	transform: scale(1);
	opacity:0;
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	z-index:3000;
}

.modal-popup .popup-content .popup-body {
	border-radius:3px; max-width:100%; max-height:90%; box-sizing:border-box;
	display:flex; flex-direction:column; position:relative;
	-webkit-transform: scale(0.7);
	transform: scale(0.7);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	z-index:3000;
}

.modal-popup .popup-content .popup-close {
	display:flex; justify-content:center; align-items:center;
	position:absolute; top:55px; right:55px; cursor:pointer;
	opacity:0; z-index:3001;
	-webkit-transform: scale(0.5) rotate(360deg);
	transform: scale(0.5) rotate(360deg);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}

.modal-popup .popup-content .popup-close i {
	font-size:34px; color:#333;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}

.modal-popup .popup-content .popup-close:hover i {
	color:#333;
	-webkit-transform: scale(1) rotate(180deg);
	transform: scale(1) rotate(180deg);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}

.modal-popup .popup-content .popup-close > svg {
	font-size:34px; color:#333; opacity:0.7;
	-webkit-transform: scale(0.8);
	transform: scale(0.8);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}

.modal-popup .popup-content .popup-close:hover > svg {
	color:#333; opacity:1;
	-webkit-transform: scale(0.8) rotate(180deg);
	transform: scale(0.8) rotate(180deg);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}

.modal-popup.show {
	opacity:1; zoom:1; top:0; left:0; bottom:0; right:0;
	background:rgba(55,55,55,0.5);
	-webkit-transform: scale(1);
	transform: scale(1);
	pointer-events:auto;
	-webkit-transition: all 0s ease-in-out 0s;
	transition: all 0s ease-in-out 0s;
	z-index:3000;
}

.modal-popup.show .popup-content {
	opacity:1;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}

.modal-popup.show .popup-content .popup-body {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all 0.3s cubic-bezier(-0.3, 0.7, 1.0, 0.1) 0s;
	transition: all 0.3s cubic-bezier(-0.3, 0.7, 1.0, 0.1) 0s;
	z-index:3000;
}

.modal-popup.show .popup-content .popup-close {
	top:55px; right:55px;
	opacity:0.6;
	-webkit-transform: scale(1) rotate(0deg);
	transform: scale(1) rotate(0deg);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}

.modal-popup.show .popup-content:hover .popup-close {
	opacity:1;
	-webkit-transform: scale(1) rotate(0deg);
	transform: scale(1) rotate(0deg);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}

.modal-popup .popup-content .popup-body .naver-login {
	background-color:#fff;
}

.modal-popup .popup-content .popup-body .naver-login iframe {
	border:0; background-color:#fff; width:100%; height:100%;
}

.modal-popup .popup-content .popup-body .kakao-login {
	background-color:#fff;
}

.modal-popup .popup-content .popup-body .kakao-login iframe {
	border:0; background-color:#fff; width:100%; height:100%;
}

@media only screen and (max-device-width: 600px) {

	.modal-popup .popup-content {

		zoom:1.3;

	}

/*
	.modal-popup .popup-content {
		padding:0; width:100%; height:100%;
	}

	.modal-popup .popup-content .popup-close {
		top:10px; right:10px;
	}

	.modal-popup.show .popup-content .popup-close {
		top:10px; right:10px;
	}
*/
}