@charset "utf-8";

/*
	font-family: 'Pretendard';
*/
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css');
/*
	font-family: 'Noto Sans KR';
*/
@import url('https://fonts.googleapis.com/earlyaccess/notosanskr.css');
/* 
  font-family: 'Poppins';
*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, p {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
}
:focus {
	outline: 0;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}


a { text-decoration: none; }
a:hover { color:inherit; }
a:link { color:inherit; }
a:visited { color:inherit; }

ol, ul { list-style:none; }
table {	border-collapse:separate;	border-spacing:0; }
caption, th, td { text-align:left; font-weight:normal;}
caption { display:none; }
img { 
	border:0; vertical-align:middle; 
	image-rendering: -moz-crisp-edges;         /* Firefox */
	image-rendering: -o-crisp-edges;         /* Opera */
	image-rendering: -webkit-optimize-contrast;/* Webkit 표준 X */
	image-rendering: crisp-edges;
	-ms-interpolation-mode: nearest-neighbor;  /* IE 표준 X */
}
button { cursor:pointer; }




body {
	width:100%; text-align:center; margin:0; padding:0; 
	font-family:"Pretendard","Noto Sans KR","돋움",Arial,sans-serif; font-style:normal; font-weight:300;
	color:#111111; font-size:16px; word-break:keep-all;
	background:#FFFFFF;
}

.mobile { display:none; }
br.web {	
  display: none;
}

strong { font-weight:800; }

#wapper {
    position:relative; margin:0 auto; 
}


.mask_layer {
	position:absolute; width:100%; height:100%; left:0; top:0; z-index:999;
	background-color:rgba(0,0,0,0.8);
	display:none;
}
.mask_layer .modal_popup { 
	position:absolute; width:auto; z-index:10000;
}
.mask_layer .modal_popup .closebtn { 
	position:absolute; top:0px; right:-50px; z-index:9;
}


.mask_layer .modal_popup .alertmsg {
	opacity:0; transition-duration:1s; text-align:center; width:100%;
}
.mask_layer .modal_popup .alertmsg.on {
	opacity:1;
}
.mask_layer .modal_popup .alertmsg span {
	display:inline-block; padding:0.2em 1.5em 0.3em; background:#ff9e1a; border-radius:15px;
	color:#ffffff; font-size:28px; font-weight:300;
	opacity:0.9;
}

@media screen and (max-width: 640px) { 
	br.mobile {
		display:block;
	}
	.mask_layer .modal_popup { 
		width:96%;
	}
	.mask_layer .modal_popup .closebtn { 
		position:absolute; top:-50px; right:0px; z-index:9;
	}
}
	



/* effect */

@keyframes View {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes View {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes View {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes View {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}


@keyframes NonView {
    from {
        opacity:1;
    }
    to {
        opacity:0;
    }
}
@-moz-keyframes NonView {
    from {
        opacity:1;
    }
    to {
        opacity:0;
    }
}
@-webkit-keyframes NonView {
    from {
        opacity:1;
    }
    to {
        opacity:0;
    }
}
@-o-keyframes NonView {
    from {
        opacity:1;
    }
    to {
        opacity:0;
    }
}



@keyframes InUp {
    from {
        transform: translate3d(0,0,0);
    }
    to {
        transform: translate3d(0,-70%,0);
    }
}
@-moz-keyframes InUp {
    from {
        transform: translate3d(0,0,0);
    }
    to {
        transform: translate3d(0,-70%,0);
    }
}
@-webkit-keyframes InUp {
    from {
        transform: translate3d(0,0,0);
    }
    to {
        transform: translate3d(0,-70%,0);
    }
}
@-o-keyframes InUp {
    from {
        transform: translate3d(0,0,0);
    }
    to {
        transform: translate3d(0,-70%,0);
    }
}




@keyframes FadeIn {
    from {
		opacity: 0;
        transform: scale(0.2);
    }
    to {
		opacity: 1;
		transform: scale(1);
    }
}
@-moz-keyframes FadeIn {
    from {
		opacity: 0;
        transform: scale(0.2);
    }
    to {
		opacity: 1;
		transform: scale(1);
    }
}
@-webkit-keyframes FadeIn {
    from {
		opacity: 0;
        transform: scale(0.2);
    }
    to {
		opacity: 1;
		transform: scale(1);
    }
}
@-o-keyframes FadeIn {
    from {
		opacity: 0;
        transform: scale(0.2);
    }
    to {
		opacity: 1;
		transform: scale(1);
    }
}


@keyframes FadeInDown {
    from {
		opacity: 0;
        transform: translate3d(0,-2vh,0);
    }
    to {
		opacity: 1;
        transform: translate3d(0,0,0);
    }
}
@-moz-keyframes FadeInDown {
    from {
		opacity: 0;
        transform: translate3d(0,-2vh,0);
    }
    to {
		opacity: 1;
        transform: translate3d(0,0,0);
    }
}
@-webkit-keyframes FadeInDown {
    from {
		opacity: 0;
        transform: translate3d(0,-2vh,0);
    }
    to {
		opacity: 1;
        transform: translate3d(0,0,0);
    }
}
@-o-keyframes FadeInDown {
    from {
		opacity: 0;
        transform: translate3d(0,-2vh,0);
    }
    to {
		opacity: 1;
        transform: translate3d(0,0,0);
    }
}



@-webkit-keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
	opacity:1;
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -2vh, 0);
    transform: translate3d(0, -2vh, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -1vh, 0);
    transform: translate3d(0, -1vh, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -0.4vh, 0);
    transform: translate3d(0, -0.4vh, 0);
  }
}

@keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
	opacity:1;
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
	opacity:0.5;
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -5vh, 0);
    transform: translate3d(0, -5vh, 0);
  }

  70% {
	opacity:0.7;
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -3vh, 0);
    transform: translate3d(0, -3vh, 0);
  }

  90% {
	opacity:1;
    -webkit-transform: translate3d(0, -0.4vh, 0);
    transform: translate3d(0, -0.4vh, 0);
  }
}



@keyframes FadeIn {
    from {
		opacity: 0;
        transform: scale(0.2);
    }
    to {
		opacity: 1;
		transform: scale(1);
    }
}
@-moz-keyframes FadeIn {
    from {
		opacity: 0;
        transform: scale(0.2);
    }
    to {
		opacity: 1;
		transform: scale(1);
    }
}
@-webkit-keyframes FadeIn {
    from {
		opacity: 0;
        transform: scale(0.2);
    }
    to {
		opacity: 1;
		transform: scale(1);
    }
}
@-o-keyframes FadeIn {
    from {
		opacity: 0;
        transform: scale(0.2);
    }
    to {
		opacity: 1;
		transform: scale(1);
    }
}


@keyframes rotate_s {
    from {
		opacity: 1;
        transform: rotate(-20deg);
    }
    50% {
		opacity: 1;
        transform: rotate(20deg);
    }
    to {
		opacity: 1;
        transform: rotate(-20deg);
    }
}
@-moz-keyframes rotate_s {
    from {
		opacity: 1;
        transform: rotate(-20deg);
    }
    50% {
		opacity: 1;
        transform: rotate(20deg);
    }
    to {
		opacity: 1;
        transform: rotate(-20deg);
    }
}
@-webkit-keyframes rotate_s {
    from {
		opacity: 1;
        transform: rotate(-20deg);
    }
    50% {
		opacity: 1;
        transform: rotate(20deg);
    }
    to {
		opacity: 1;
        transform: rotate(-20deg);
    }
}
@-o-keyframes rotate_s {
    from {
		opacity: 1;
        transform: rotate(-20deg);
    }
    50% {
		opacity: 1;
        transform: rotate(20deg);
    }
    to {
		opacity: 1;
        transform: rotate(-20deg);
    }
}




@keyframes light_left {
    from, to {
		opacity:1; transform:rotate(-15deg); transform-origin:0% 0%;
    }
    50% {
		opacity:1; transform:rotate(0deg); transform-origin:0% 0%;
    }
}
@-moz-keyframes light_left {
    from, to {
		opacity:1; transform:rotate(-15deg); transform-origin:0% 0%;
    }
    50% {
		opacity:1; transform:rotate(0deg); transform-origin:0% 0%;
    }
}
@-webkit-keyframes light_left {
    from, to {
		opacity:1; transform:rotate(-15deg); transform-origin:0% 0%;
    }
    50% {
		opacity:1; transform:rotate(0deg); transform-origin:0% 0%;
    }
}
@-o-keyframes light_left {
    from, to {
		opacity:1; transform:rotate(-15deg); transform-origin:0% 0%;
    }
    50% {
		opacity:1; transform:rotate(0deg); transform-origin:0% 0%;
    }
}

@keyframes light_right {
    from, to {
		opacity:1; transform:rotate(0deg); transform-origin:100% 0%;
    }
    50% {
		opacity:1; transform:rotate(15deg); transform-origin:100% 0%;
    }
}
@-moz-keyframes light_right {
    from, to {
		opacity:1; transform:rotate(0deg); transform-origin:100% 0%;
    }
    50% {
		opacity:1; transform:rotate(15deg); transform-origin:100% 0%;
    }
}
@-webkit-keyframes light_right {
    from, to {
		opacity:1; transform:rotate(0deg); transform-origin:100% 0%;
    }
    50% {
		opacity:1; transform:rotate(15deg); transform-origin:100% 0%;
    }
}
@-o-keyframes light_right {
    from, to {
		opacity:1; transform:rotate(0deg); transform-origin:100% 0%;
    }
    50% {
		opacity:1; transform:rotate(15deg); transform-origin:100% 0%;
    }
}



@keyframes pulse {
    from, to {
		transform: scale(0.95);
	}
	70% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
	}
}
@-moz-keyframes pulse {
    from, to {
		transform: scale(0.95);
	}
	70% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
	}
}
@-webkit-keyframes pulse {
    from, to {
		transform: scale(0.95);
	}
	70% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
	}
}
@-o-keyframes pulse {
    from, to {
		transform: scale(0.95);
	}
	70% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
	}
}