/* 페이드인 */
@keyframes fadeIn {
	0% {opacity: 0; transform: translateY(50px);}
	100% {opacity: 1; transform: translateY(0);}
}

/* 배경페이드인 */
@keyframes fadeInBackground {
  0% {opacity: 0;}
  100% {opacity: 1;}
  }

/* 오른쪽에서 나타나게 */
@keyframes RightIn{
  0% {opacity: 0; transform: translateX(10%);}
  100% {opacity: 1;	transform: translateX(0);}
  }

  
/* 왼쪽에서 나타나게 */
@keyframes LeftIn{
  0% {opacity: 0; transform: translateX(-50%);}
  100% {opacity: 1;	transform: translateX(0);}
  }

 
/* 밑에서 나타나게 */
@keyframes BottomIn{
  0% {opacity: 0; transform: translateY(50%); }
  100% {opacity: 1;	transform: translateY(0);}
  }

/* 위에서 나타나게 */
@keyframes TopIn{
  0% {opacity: 0; transform: translateY(-50%); }
  100% {opacity: 1;	transform: translateY(0);}
  }

/* 확대되며 나타나게 */
@keyframes scaleIn {
  0% {transform: scale(0); opacity: 0;}
  100% {transform: scale(1); opacity: 1;}
}

/* 확대되며 나타나게 */
@keyframes scaleIn2 {
  0% {transform: scale(0.5); opacity: 0.5;}
  100% {transform: scale(1); opacity: 1;}
}



/* 메뉴 
.gnb-logo {opacity: 0; animation: fadeInBackground 1.5s ease-out forwards;}*/


/* 메인 */
.main .main-visual .tit {opacity: 0;  animation: opacity 4s ease-out, fadeIn 1s ease-out forwards; animation-delay: 0.5s}
.main .main-visual .video, .main-conts-el .wrap, .main-conts-me .wrap .youtube{opacity: 0;  animation: opacity 5s ease-out, fadeInBackground 1s ease-out forwards;  animation-delay: 0.1s}

.main-conts-wl .wrap .tit, .main-conts-el .wrap .tit, .main-conts-me .wrap .tit   {opacity: 0; animation: fadeIn 1.5s ease-out forwards;}
.main-conts-wl .wrap .tit.active , .main-conts-el .wrap .tit.active , .main-conts-me .wrap .tit.active, .main-conts-me .wrap .youtube.active, .main-conts-el .wrap.active {animation: BottomIn 2s ease-out forwards;}


.main-conts-wl .wiselife-wrap .item {opacity: 0; --delay: 0s; }
.main-conts-wl .wiselife-wrap .item.active {animation: BottomIn 1s ease-out forwards; animation-delay: var(--delay);}

.main-conts-wl .wiselife-wrap .item:nth-child(1) { --delay: 0.4s; }
.main-conts-wl .wiselife-wrap .item:nth-child(2) { --delay: 0.6s; }
.main-conts-wl .wiselife-wrap .item:nth-child(3) { --delay: 0.8s; }




/* 테블릿 */
@media (min-width: 600px) and (max-width: 1028px){



}

/* 모바일 */

@media (max-width: 599px){



}