.ACLoadingImage {
animation: ACLoadingImage;
animation-iteration-count: 4;
animation-duration: 1s;
animation-fill-mode: forwards;
animation-timing-function: ease;
background-image:linear-gradient(to right, white 0.5%, transparent 0.5%);
}
@keyframes ACLoadingImage {
0% {background-image:linear-gradient(to right, white 0.5%, transparent 0.5%);}
10% {background-image:linear-gradient(to right, white 1%, transparent 1%);}
20% {background-image:linear-gradient(to right, white 2%, transparent 2%);}
30% {background-image:linear-gradient(to right, white 25%, transparent 25%);}
40% {background-image:linear-gradient(to right, white 55%, transparent 55%);}
50% {background-image:linear-gradient(to right, white 60%, transparent 60%);}
60% {background-image:linear-gradient(to right, white 77%, transparent 77%);}
70% {background-image:linear-gradient(to right, white 97%, transparent 97%);}
80% {background-image:linear-gradient(to right, white 98%, transparent 98%);}
90% {background-image:linear-gradient(to right, white 99%, transparent 99%);}
100% {background-image:linear-gradient(to right, white 100%, transparent 100%);}
}
.ACLo-z5 {
z-index:5;
}
.ACLo-z6 {
z-index:6;
}
.ACLoading-LDtext1 {
animation: ACLoading-LDtext1;
animation-iteration-count: 2;
animation-duration: 2s;
animation-fill-mode: forwards;
animation-timing-function: ease;
opacity:1;
}
@keyframes ACLoading-LDtext1 {
from {opacity:1;}
50% {opacity:0;}
to {opacity:1;}
}
.ACLoading-LDimg1 {
animation: ACLoading-LDimg1;
animation-iteration-count: infinite;
animation-duration: 3s;
animation-fill-mode: forwards;
animation-timing-function: ease;
filter: brightness(0.9);
}
@keyframes ACLoading-LDimg1 {
from {filter: brightness(0.9);}
50% {filter: brightness(1.8);}
to {filter: brightness(0.9);}
}
.ACLoading-LDP {
display:inherit;
z-index:5;
animation: ACLoading-LDP;
animation-delay: 5s;
animation-iteration-count: 1;
animation-duration: 0.4s;
animation-fill-mode: forwards;
animation-timing-function: ease;
overflow:hidden;
height:100vh;
opacity:1;
}
@keyframes ACLoading-LDP {
from {height:100vh;opacity:1; z-index:5;display:inherit;}
to {height:0px;opacity:0; z-index:-1;display:none;}
}
.ACLoading-bgnoise {
animation: ACLoading-bgnoise;
animation-iteration-count: infinite;
animation-duration: 1s;
animation-timing-function: ease;
animation-fill-mode: backwards;
}
@keyframes ACLoading-bgnoise {
0% {background:#282828; background-image:repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 1px, rgba(0, 0, 0, 0.2) 4px, rgba(0, 0, 0, 0.3) 10px, rgba(0, 0, 0, 0.1) 12px), linear-gradient(to bottom, rgba(55, 55, 55, 0.2) 8%, rgba(0, 5, 5, 0.3) 11%, rgba(5, 20, 55, 0.2) 13%, rgba(55, 55, 55, 0.2) 20%, rgba(55, 55, 55, 0.2) 60%, rgba(55, 55, 55, 0.3) 70%, rgba(20, 20, 20, 0.3) 72%, rgba(20, 20, 20, 0.3) 73%, rgba(55, 55, 55, 0.3) 75%, rgba(55, 55, 55, 0.2) 85%, rgba(10, 10, 10, 0.2) 88%, rgba(10, 10, 10, 0.2) 95%, rgba(55, 55, 55, 0.2) 95%);}
15% {background:#363636; background-image:repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 4px, rgba(0, 0, 0, 0.3) 1px, rgba(0, 0, 0, 0.3) 10px, rgba(0, 0, 0, 0.1) 10px), linear-gradient(to bottom, rgba(55, 55, 55, 0.3) 5%, rgba(0, 5, 5, 0.2) 8%, rgba(5, 20, 55, 0.1) 15%, rgba(55, 55, 55, 0.1) 17%, rgba(55, 55, 55, 0.3) 65%, rgba(55, 55, 55, 0.1) 68%, rgba(20, 20, 20, 0.2) 77%, rgba(20, 20, 20, 0.2) 79%, rgba(55, 55, 55, 0.2) 80%, rgba(55, 55, 55, 0.1) 85%, rgba(10, 10, 10, 0.1) 92%, rgba(10, 10, 10, 0.3) 97%, rgba(55, 55, 55, 0.3) 100%);}
45% {background:#282828; background-image:repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 2px, rgba(0, 0, 0, 0.3) 6px, rgba(0, 0, 0, 0.1) 8px, rgba(0, 0, 0, 0.2) 11px), linear-gradient(to bottom, rgba(55, 55, 55, 0.3) 3%, rgba(0, 5, 5, 0.2) 5%, rgba(5, 20, 55, 0.3) 6%, rgba(55, 55, 55, 0.1) 8%, rgba(55, 55, 55, 0.1) 10%, rgba(55, 55, 55, 0.3) 15%, rgba(20, 20, 20, 0.3) 23%, rgba(20, 20, 20, 0.2) 44%, rgba(55, 55, 55, 0.2) 48%, rgba(55, 55, 55, 0.15) 60%, rgba(10, 10, 10, 0.15) 62%, rgba(10, 10, 10, 0.1) 76%, rgba(55, 55, 55, 0.1) 78%);}
50% {background:#282828; background-image:repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 1px, rgba(0, 0, 0, 0.2) 4px, rgba(0, 0, 0, 0.3) 10px, rgba(0, 0, 0, 0.1) 12px), linear-gradient(to bottom, rgba(55, 55, 55, 0.2) 8%, rgba(0, 5, 5, 0.3) 11%, rgba(5, 20, 55, 0.2) 13%, rgba(55, 55, 55, 0.2) 20%, rgba(55, 55, 55, 0.2) 60%, rgba(55, 55, 55, 0.3) 70%, rgba(20, 20, 20, 0.3) 72%, rgba(20, 20, 20, 0.3) 73%, rgba(55, 55, 55, 0.3) 75%, rgba(55, 55, 55, 0.2) 85%, rgba(10, 10, 10, 0.2) 88%, rgba(10, 10, 10, 0.2) 95%, rgba(55, 55, 55, 0.2) 95%);}
75% {background:#282828; background-image:repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 2px, rgba(0, 0, 0, 0.3) 6px, rgba(0, 0, 0, 0.1) 8px, rgba(0, 0, 0, 0.2) 11px), linear-gradient(to bottom, rgba(55, 55, 55, 0.3) 3%, rgba(0, 5, 5, 0.2) 5%, rgba(5, 20, 55, 0.3) 6%, rgba(55, 55, 55, 0.1) 8%, rgba(55, 55, 55, 0.1) 10%, rgba(55, 55, 55, 0.3) 15%, rgba(20, 20, 20, 0.3) 23%, rgba(20, 20, 20, 0.2) 44%, rgba(55, 55, 55, 0.2) 48%, rgba(55, 55, 55, 0.15) 60%, rgba(10, 10, 10, 0.15) 62%, rgba(10, 10, 10, 0.1) 76%, rgba(55, 55, 55, 0.1) 78%);}
80% {background:#282828; background-image:repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 4px, rgba(0, 0, 0, 0.3) 1px, rgba(0, 0, 0, 0.3) 10px, rgba(0, 0, 0, 0.1) 10px), linear-gradient(to bottom, rgba(55, 55, 55, 0.3) 5%, rgba(0, 5, 5, 0.2) 8%, rgba(5, 20, 55, 0.1) 15%, rgba(55, 55, 55, 0.1) 17%, rgba(55, 55, 55, 0.3) 65%, rgba(55, 55, 55, 0.1) 68%, rgba(20, 20, 20, 0.2) 77%, rgba(20, 20, 20, 0.2) 79%, rgba(55, 55, 55, 0.2) 80%, rgba(55, 55, 55, 0.1) 85%, rgba(10, 10, 10, 0.1) 92%, rgba(10, 10, 10, 0.3) 97%, rgba(55, 55, 55, 0.3) 100%);}
100% {background:#282828; background-image:repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 1px, rgba(0, 0, 0, 0.2) 4px, rgba(0, 0, 0, 0.3) 10px, rgba(0, 0, 0, 0.1) 12px), linear-gradient(to bottom, rgba(55, 55, 55, 0.2) 8%, rgba(0, 5, 5, 0.3) 11%, rgba(5, 20, 55, 0.2) 13%, rgba(55, 55, 55, 0.2) 20%, rgba(55, 55, 55, 0.2) 60%, rgba(55, 55, 55, 0.3) 70%, rgba(20, 20, 20, 0.3) 72%, rgba(20, 20, 20, 0.3) 73%, rgba(55, 55, 55, 0.3) 75%, rgba(55, 55, 55, 0.2) 85%, rgba(10, 10, 10, 0.2) 88%, rgba(10, 10, 10, 0.2) 95%, rgba(55, 55, 55, 0.2) 95%);}
}
.ASULoadImage-2 {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 0;
background: linear-gradient(180deg, transparent, #ff0000); /* 시작 색상과 끝 색상을 조절하세요 */
animation: ASULoadImage-2 5s linear forwards; /* 애니메이션 지속 시간과 이징을 조절하세요 */
}
@keyframes ASULoadImage-2 {
0% {
height: 0;
}
100% {
height: 100%;
}
}
@media screen and (min-width: 450px) {
.ACLoading-WebDisplay {
display:inherit;
}
}
@media screen and (min-width: 450px) {
.ACLoading-MobileDisplay {
display:none;
}
}
@media screen and (max-width: 450px) {
.ACLoading-WebDisplay {
display:none;
}
}
@media screen and (max-width: 450px) {
.ACLoading-MobileDisplay {
display:inherit;
}
}