/*
   이 파일은 서버에 위치 하면서 동적 로딩하게 한다
   파일명 : /css/add_css.css
 */

.input_window_up { /* 입력 시스템 팝업을 위로 올릴때  */
	animation-name				: input_window_up;	
	animation-duration			: 0.6s;
	animation-iteration-count	: 1;	
	animation-timing-function	: ease;	
	animation-delay					: 0s;				
	animation-direction			: normal;		
	animation-play-state		: running;		
	animation-fill-mode			: forwards; /* 올라간 상태에서 머물러야 한다.  none 하면 원래데로 가버림 */			
}
@keyframes input_window_up
{
	0%
	{
		transform : translateY(720px);
	}
	100%	
	{
		transform : translateY(451px);

	}
}


.input_window_down { /* 입력 시스템 팝업을 낼릴때  */
	animation-name				: input_window_down;	
	animation-duration			: 0.6s;
	animation-iteration-count	: 1;	
	animation-timing-function	: ease;	
	animation-delay					: 0s;				
	animation-direction			: normal;		
	animation-play-state		: running;		
	animation-fill-mode			: forwards; /* 내려간 상태에서 머물러야 한다.  none 하면 원래데로 가버림 */		
}
@keyframes input_window_down
{
	0%
	{
		transform : translateY(451px);
	}
	100%	
	{
		transform : translateY(720px);
	}
}

/* 길드 채팅창에서 시간표시 */
.chat_time
{
	font-size : 13px;
}

/*길드 채팅창에서 날짜표시 */
.chat_date
{
	left : 249px;
	width: 160px;
	font-size : 13px;
	color : #1a1a1a;
	text-align : center;
	background : #708e8b;
    border-radius: 14px;
	position : relative;	
}

/*길드시즌순위 1등 뒤에 빙글빙글 도는 불빛*/
/* ?(깜짝상자팝업) 나타날때 빙글빙글 돌면서 확대 된다. */ /*사용안함*/
.light_circle {
	animation-name				: light_circle;
	animation-duration			: 7.0s;
	animation-iteration-count	: infinite; /*애니메이션 반복 횟수 지정, 0이면 1회임, 양수: 정수로 횟수 표기.  횟수만큼 애니메이션 반복 실행 후 정지. infinite: 무한 반복.*/
	animation-timing-function:linear;/*애니메이션 진행 속도 linear | ease | ease-in | ease-out | ease-in-out | step-start | step-end | steps(int,start|end) | cubic-bezier(n,n,n,n) 중 한가지 선택 가능*/
	animation-direction			: normal;/*애니메이션 재생 방향  normal: 정방향 재생 reverse: 역방향 재생 alternate: 정방향과 역방향으로 한 번씩 번갈아 재생(정 방향 시작) alternate-reverse: 역방향과 정방향으로 한 번씩 번갈아 재생(역방향 시작)*/
	animation-fill-mode			: backwards; /*애니메이션 시작 전, 종료 후 적용할 CSS 스타일을 지정. "none"은 요소의 CSS 스타일을 유지하며, 그 외에는 키프레임 애니메이션의 CSS 스타일을 유지함 none forwards backwards both*/
	animation-play-state		: running;		 
}
@keyframes light_circle
{
    from { transform: rotate(0deg);	opacity: 1;}
	to		{ transform: rotate(360deg); opacity: 1;}
}



/* ======= loading 화면 구현 KT로딩에서 이걸로 변경함. 20240910_ywlee */
#loading-screen 
{
  position: fixed;
  top: 0;
  left: 0;
  width: 1280px;
  height: 720px;
  background-color: rgba(0, 0, 0, 0.7); /* 배경 어둡게 설정 */
  display: flex;
  justify-content: center;
  align-items: center;
}
#loading-text 
{
  margin-top: 0px; /* 아이콘 아래 여백 */
  color: #fff; /* 텍스트 색상 */
  font-size: 12px;
  position : absolute;
}
#loading-icon 
{
  width: 70px;
  height: 70px;
  border: 10px solid #f3f3f3;
  border-top: 10px solid #3498db;
  border-radius: 50%; /* 이게 원으로 만들어 준다. 없으면 사각형이다.*/
  animation: spin 1s linear infinite;
  align-items: center;
}
@keyframes spin 
{
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}