@charset "utf-8";

.logo_wrap {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	height: 100%;
	background: #000;
	z-index: 4000;

}
/* .logo_wrap.on {animation: logo_fade .3s 1 forwards; z-index: -1;} */
.logo_wrap{opacity:1;transition:all 0.6s ease}
.logo_wrap.on{opacity:0;visibility:hidden}

@media (max-width: 768px) {
	.logo_wrap img {width: 64.8438vw;}
}



@keyframes logo_fade {
	0% { opacity: 1;}

	100% { opacity: 0;}
}

.logo_wrap img {position: absolute; top: 50%; left: 50%; transform: translate(-50% , -50%);}


.global-loading-aniwrap.on {opacity: 0; z-index: -1;}
	/* 애니메이션 영역 */
	.global-loading-aniwrap {
	  pointer-events: none;
	  position: fixed;
	  left: 0;
	  right: 0;
	  top: 0;
	  bottom: 0;
	  z-index: 3000;

	 
	}

	.bar-wrap,
	.line-wrap {
	  position: absolute;
	  top: 0;
	  left: 25px;
	  right: 25px;
	  bottom: 0;

	}

	.line-wrap {
	  border-left: 1px solid rgba(255, 255, 255, 0.05);
	  border-right: 1px solid rgba(255, 255, 255, 0.05);
	  -webkit-transition: opacity .5s, visibility .5s;
	  transition: opacity .5s, visibility .5s;
	}

	.line-wrap.gray {
	  border-left: 1px solid rgba(255, 255, 255, 0.05);
	  border-right: 1px solid rgba(255, 255, 255, 0.05);
	}

	@media screen and (min-width: 992px) {
	  .bar-wrap,
	  .line-wrap {
		left: 0;
		right: 0;
	  }
	  .line-wrap {
		border-left: none;
		border-right: none;
	  }
	}

	.line-wrap.disabled {
	  visibility: hidden;
	  opacity: 0;
	}

	/* 최초 진입 애니메이션 바 */
	.global-loading-aniwrap .bar {
	  position: absolute;
	  top: 0;
	  bottom: 0;
	  display: block;
	  width: 25%;
	  background-color: black;
	  -webkit-transition: transform 0.7s cubic-bezier(0, 0.78, 0, 1);
	  transition: transform 0.7s cubic-bezier(0, 0.78, 0, 1);
	}

	.global-loading-aniwrap .bar:nth-child(odd) {
	  transform-origin: 100% 0;
	}

	.global-loading-aniwrap .bar:nth-child(even) {
	  transform-origin: 100% 100%;
	}

	.global-loading-aniwrap .bar:nth-child(1) {
	  left: 0;
	}

	.global-loading-aniwrap .bar:nth-child(2) {
	  left: 25%;
	}

	.global-loading-aniwrap .bar:nth-child(3) {
	  left: 50%;
	}

	.global-loading-aniwrap .bar:nth-child(4) {
	  left: 75%;
	}

	.global-loading-aniwrap .bar:nth-child(5) {
	  right: -25%;
	}

	.global-loading-aniwrap .bar:nth-child(6) {
	  left: -25%;
	}

	.global-loading-aniwrap .bar.main-ani-end {
	  -webkit-transform: scaleY(0);
	  transform: scaleY(0);
	  -webkit-transition: transform 1.2s cubic-bezier(0.77, 0, 0.175, 1);
	  transition: transform 1.2s cubic-bezier(0.77, 0, 0.175, 1);
	}

	.global-loading-aniwrap .bar-wrap.sub-ani-end .bar {
	  -webkit-transform: scaleX(0);
	  transform: scaleX(0);
	  -webkit-transition: transform 0.8s cubic-bezier(0.77, 0, 0.175, 1);
	  transition: transform 0.8s cubic-bezier(0.77, 0, 0.175, 1);
	}

	@media screen and (min-width: 992px) {
	  .global-loading-aniwrap .bar {
		width: 20%;
	  }
	  .global-loading-aniwrap .bar:nth-child(1) {
		left: 0;
	  }
	  .global-loading-aniwrap .bar:nth-child(2) {
		left: 20%;
	  }
	  .global-loading-aniwrap .bar:nth-child(3) {
		left: 40%;
	  }
	  .global-loading-aniwrap .bar:nth-child(4) {
		left: 60%;
	  }
	  .global-loading-aniwrap .bar:nth-child(5) {
		display: block;
		right: 0;
	  }
	  .global-loading-aniwrap .bar:nth-child(6) {
		display: none;
	  }
	}

	/* 최초 진입 애니메이션 라인 */
	.global-loading-aniwrap .line {
	  position: absolute;
	  top: 0;
	  bottom: 0;
	  width: 25%;
	  background-color: transparent;
	  border-right: 1px solid rgba(255, 255, 255, 0.05);
	  -webkit-transition: transform 1.2s;
	  transition: transform 1.2s;
	  -webkit-transform: scaleY(0);
	  transform: scaleY(0);
	}

	.global-loading-aniwrap.gray .line {
	  border-right: 1px solid rgba(242, 242, 242, 0.5);
	}

	.global-loading-aniwrap .line:last-of-type {
	  border-right: none;
	}

	.global-loading-aniwrap .line:nth-child(1) {
	  left: 0;
	}

	.global-loading-aniwrap .line:nth-child(2) {
	  left: 25%;
	}

	.global-loading-aniwrap .line:nth-child(3) {
	  left: 50%;
	}

	.global-loading-aniwrap .line:nth-child(4) {
	  display: none;
	  left: 75%;
	}

	.global-loading-aniwrap .line:nth-child(5) {
	  display: none;
	  right: 0;
	}

	.global-loading-aniwrap .line:nth-child(odd) {
	  transform-origin: 0 0;
	}

	.global-loading-aniwrap .line:nth-child(even) {
	  transform-origin: 100% 100%;
	}

	.global-loading-aniwrap.main-ani-on .line {
	  -webkit-transform: scaleY(1);
	  transform: scaleY(1);
	}

	.global-loading-aniwrap.subAniwrap .line {
	  -webkit-transform: scaleY(1);
	  transform: scaleY(1);
	}

	.global-loading-aniwrap.subAniwrap .line-wrap.sub-ani-end {
	  opacity: 0;
	}

	.global-loading-aniwrap .line:before {
	  content: "";
	  position: absolute;
	  right: 0;
	  top: 0;
	  bottom: 0;
	  width: 1px;
	  background-color: rgba(255, 255, 255, 0.6);
	  -webkit-transition: transform 1.5s 0.3s cubic-bezier(0.775, -0.005, 0.34, 0.995);
	  transition: transform 1.5s 0.3s cubic-bezier(0.775, -0.005, 0.34, 0.995);
	}

	.global-loading-aniwrap .line:last-of-type::before {
	  content: none;
	}

	.global-loading-aniwrap .line:nth-child(even):before {
	  transform-origin: 0 0;
	  -webkit-transform: translateY(100%);
	  transform: translateY(100%);
	}

	.global-loading-aniwrap .line:nth-child(odd):before {
	  transform-origin: 100% 100%;
	  -webkit-transform: translateY(-100%);
	  transform: translateY(-100%);
	}

	.global-loading-aniwrap.main-ani-on .line:nth-child(even):before {
	  -webkit-transform: translateY(-120%);
	  transform: translateY(-120%);
	}

	.global-loading-aniwrap.main-ani-on .line:nth-child(odd):before {
	  -webkit-transform: translateY(120%);
	  transform: translateY(120%);
	}

	@media screen and (min-width: 992px) {
	  .global-loading-aniwrap .line {
		width: 20%;
	  }
	  .global-loading-aniwrap .line:nth-child(1) {
		left: 0;
	  }
	  .global-loading-aniwrap .line:nth-child(2) {
		left: 20%;
	  }
	  .global-loading-aniwrap .line:nth-child(3) {
		left: 40%;
	  }
	  .global-loading-aniwrap .line:nth-child(4) {
		display: block;
		left: 60%;
	  }
	  .global-loading-aniwrap .line:nth-child(5) {
		display: block;
		right: 0;
	  }
	}