/* 팝업 */
.modal_pop .close {width:39px; height:39px; position:absolute; top:30px; right:40px; font-size:0; text-indent:-999999; overflow:hidden; cursor:pointer; background:#fff url('/img/sub/pop_close_icon.png') 50% 50% no-repeat; border:none; border-radius:100%; z-index:1;}
.modal_pop {position:fixed; top:0; right:0; left:0; bottom:0; z-index:1000; visibility:hidden;} 
.modal-body {position:absolute; left:50%; top:50%; z-index:100;}
.modal-body02 {position:absolute; left:50%; top:50%; z-index:100;}
.modal-inner {opacity:0; -webkit-transform:scale(.5); webkit-transition:.2s ease-in-out; -moz-transform:scale(.5); -moz-transition:.2s ease-in-out; -ms-transform:scale(.5); -ms-transition:.2s ease-in-out; -o-transform:scale(.5); -o-transition:.2s ease-in-out; transform:scale(.5); transition:.2s ease-in-out;}
.modal-overlay {position:absolute; top:0; right:0; bottom:0; left:0; visibility:hidden; opacity:0; background:#000; -webkit-transition:.15s ease-in-out; -moz-transition:.15s ease-in-out; -ms-transition:.15s ease-in-out; -o-transition:.15s ease-in-out; transition:.15s ease-in-out;}
.modal-inner {-webkit-transform:scale(.95); -moz-transform:scale(2); -ms-transform:scale(.95); -o-transform:scale(.95); transform:scale(.95);}
.modal_pop.active {visibility:visible; height:100vh; display:block;}
.modal_pop.active .modal-body {-webkit-animation: popperIn .45s; -moz-animation: popperIn .45s; -ms-animation: popperIn .45s; -o-animation: popperIn .45s; animation: popperIn .45s;}

/* study */
.modal01 {width:304px; height:304px; margin-left:-152px; margin-top:-152px; text-align: center;}
.modal01 .modal-inner{width:204px; height:204px; background:white; border-radius:100%; padding:50px;}
.modal01 .modal-inner strong{display:table-cell; width:204px; height:204px; vertical-align:middle; font-size:25px; color:#231f1e; font-weight:600; line-height:100%; text-align:center; position:relative; padding-top:50px;}
.modal01 .modal-inner strong:before{content:''; position:absolute; top:40px; left:50%; margin-left:-40px; width:80px; height:80px;}
.modal01 .modal-inner strong p.score {font-size:.9em; margin-top:10px;}
.modal01 .modal-inner.fantastic strong:before{background:url('/img/sub/pop_icon01.png') 0 0 no-repeat;}
.modal01 .modal-inner.tryagain strong:before{background:url('/img/sub/pop_icon02.png') 0 0 no-repeat;}
.modal01 .modal-inner.fail strong:before{background:url('/img/sub/pop_icon02.png') 0 0 no-repeat;}
.modal01 > a{display:inline-block; font-size:14px; color:white; font-weight:500; line-height:100%; text-decoration:underline; margin-top:18px;}

/* sweet alert 필수 css */
.swal2-popup{width: auto; max-width: 600px; padding: 45px 60px; border-radius: 20px;}
.swal2-html-container{margin: 0 auto; font-size: 18px;}
.swal2-html-container img{padding: 10px 0;}
.swal2-html-container p {padding: 10px 0; line-height: 1.5; color: #231f1e;}
.swal2-html-container p strong{font-weight: 700;}
.swal2-title{font-size: 20px;}
.swal2-actions {margin: 0 auto;}
.swal2-styled.swal2-confirm{margin: 15px auto; padding: 0; width: 144px; height: 45px; line-height: 45px; border-radius: 22.5px; text-align: center; font-size: 18px; color: white; font-weight: 800; background-color: #231f1e;}
.swal2-icon{width: 3.5em; height: 3.5em; line-height: 3.5em;}
.swal2-icon.swal2-warning{border-color: #ec5253; color: #ec5253;}
/* .swal2-close {width: 39px; height: 39px; position: absolute; top: 30px; right: 40px; font-size: 0; text-indent: -999999; overflow: hidden; cursor: pointer; background: #fff url(/img/sub/pop_close_icon.png) 50% 50% no-repeat; border: none; border-radius: 100%; z-index: 1;} */
.swal2-footer{text-align:center; padding:1em 0 0;}


@-webkit-keyframes popperIn {
  0% {
    opacity:0;
    -webkit-transform:scale(2.06);
  }
  40% { opacity:1; }
 
  100% {
    -webkit-transform:scale(1);
  }
}

@-moz-keyframes popperIn {
  0% {
    opacity:0;
    -moz-transform:scale(2.06);
  }
  40% { opacity:1; }
 
  100% {
    -moz-transform:scale(1);
  }
}

@keyframes popperIn {
  0% {
    opacity:0;
    transform:scale(2.06);
  }
  40% { opacity:1; }
 
  100% {
    transform:scale(1);
  }
}

@-webkit-keyframes popperOut {
  0% {
    opacity:1;
    -webkit-transform:scale(1);
  }
  30% { opacity:1; }
  40% {
    -webkit-transform:scale(1.25);
  }
  
  100% {
    opacity:0;
    -webkit-transform:scale(1.35);
  }
}

@-moz-keyframes popperOut {
  0% {
    opacity:1;
    -moz-transform:scale(1);
  }
  30% { opacity:1; }
  40% {
    -moz-transform:scale(1.25);
  }
  
  100% {
    opacity:0;
    -moz-transform:scale(1.35);
  }
}

@keyframes popperOut {
  0% {
    opacity:1;
    transform:scale(1);
  }
  30% { opacity:1; }
  40% {
    transform:scale(1.25);
  }
  
  100% {
    opacity:0;
   transform:scale(1.35);
  }
}

.modal_pop.active .modal-inner {
	opacity:1;
	-webkit-transform: scale(1);
	-webkit-transition:.15s ease-in-out;
	-webkit-transition-delay:.13s;
	-moz-transform: scale(1);
	-moz-transition:.15s ease-in-out;
	-moz-transition-delay:.13s;
	-ms-transform: scale(1);
	-ms-transition:.15s ease-in-out;
	-ms-transition-delay:.13s;
	-o-transform: scale(1);
	-o-transition:.15s ease-in-out;
	-o-webkit-transition-delay:.13s;
	transform: scale(1);
	transition:.15s ease-in-out;
	transition-delay:.13s;
  
}

.modal_pop.active .modal-overlay {
  opacity:.8;
  visibility:visible;
}

.modal_pop.leave .modal-body {
	opacity:0;
	-webkit-animation: popperOut .5s;
	-webkit-transition:.3s ease-in-out;
	-webkit-transition-delay:.2s;
	-webkit-transform:scale(.95);
	-moz-animation: popperOut .5s;
	-moz-transition:.3s ease-in-out;
	-moz-transition-delay:.2s;
	-moz-transform:scale(.95);
	-ms-animation: popperOut .5s;
	-ms-transition:.3s ease-in-out;
	-ms-transition-delay:.2s;
	-ms-transform:scale(.95);
	animation: popperOut .5s;
	transition:.3s ease-in-out;
	transition-delay:.2s;
	transform:scale(.95);
}

.modal_pop.leave .modal-inner {
	opacity:0;
	-webkit-transform:scale(.95);
	-webkit-transition:.15s ease-in-out;
	-moz-transform:scale(.95);
	-moz-transition:.15s ease-in-out;
	-ms-transform:scale(.95);
	-ms-transition:.15s ease-in-out;
	-o-transform:scale(.95);
	-o-transition:.15s ease-in-out;
	transform:scale(.95);
	transition:.15s ease-in-out;
}

/* PC */
@media all and (min-width:1025px){
}
/* 태블릿 공통*/
@media all and (max-width:1280px){
}
/* 모바일 */
@media all and (max-width:1000px){
}
/* 모바일 */
@media all and (max-width:860px){
}
/* 모바일 */
@media all and (max-width:768px){
}