@charset "utf-8";

/* 로딩바 */
.loading_mask {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 101;
	background: rgba(0, 0, 0, 0.65);
	overflow: hidden;
}
#loading_wrap {
	position: relative;
	top: 40%;
	left: 50%;
	transform: translate(-50%);
	width: 1920px;
	height: 118px;
	z-index: 102;
	/* background: pink; */
}
.loading_line {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
	background: url(../images/loading/line.svg) no-repeat left top / 100%;
}

.loading_line::before {
  content: attr(data-text);
  position: absolute;
  width: 100%;
  height: 100%;
  animation: loading_line 3s ease-in-out infinite;
  background: url(../images/loading/line_w.svg) no-repeat left top / 100%;
}

@keyframes loading_line {
  0% {
		clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  }
  100% {
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}

.loading_line img {
	width: 100%;
}

.car_name {
  position: absolute;
	left: 31%;
	bottom: -4%;
}
.car_name p {
	font-weight: 700;
	font-size: 33px;
	color: #111;
	letter-spacing: -0.5px;
}
.car_name p::before {
	content: attr(data-text);
	position: absolute;
	overflow: hidden;
	white-space: nowrap;
	color: #fff;
	animation: loading 3s ease-in-out infinite;
}

.loading_txt {
	position: absolute;
	left: 53.5%;
	bottom: -1%;
}

.loading_txt p {
	font-weight: normal;
	font-size: 20px;
	color: rgb(175, 175, 175)
}

@keyframes loading {
	0% {
			width: 0;
	}
	100% {
		width: 100%;
	}
}
/*모바일-테블릿*/
@media screen and (max-width:1024px){ 

/* 로딩바 */
.aside-wrapper {
	z-index: 0;
}
#loading_wrap {
	width: 1520px;
	transform: translate(-46%);
	/* background: pink; */
}
.car_name {
	bottom: 14%;
}
.car_name p {
	font-size: 27px;
}
.loading_txt {
  bottom: 18%;
}
.loading_txt p {
	font-size: 15px;
}

}


@media screen and (max-width: 739px){
	/* 로딩바 */
	.aside-wrapper {
		z-index: 0;
	}
	#loading_wrap {
		width: 950px;
		transform: translate(-45%);
		/* background: pink; */
	}
	.car_name {
		bottom: 48%;
	}
	.car_name p {
		font-size: 16px;
	}
	.loading_txt {
		left: 52.5%;
		bottom: 51%;
	}
	.loading_txt p {
		font-size: 11px;
	}

}
@media screen and (max-width: 280px){
	#loading_wrap {
		width: 720px;
		transform: translate(-44%);
		/* background: pink; */
	}
	.car_name {
		bottom: 59%;
	}
	.car_name p {
		font-size: 12px;
	}
	.loading_txt {
		bottom: 61%;
	}
	.loading_txt p {
		font-size: 9px;
	}
}