body {
    margin: 0;
    font-family: 'Arial', sans-serif;
    background-color: #1a1a1a;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    overflow: hidden; /* 스크롤 방지 */
    text-align: center;
}

.landing-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 900px; /* 컨테이너 최대 너비 */
    padding: 20px;
}

/* 로고 애니메이션 Wrapper */
.logo-animation-wrapper {
    width: 450px; /* 로고 이미지의 원본 너비에 맞게 조정 */
    height: 164px; /* 로고 이미지의 원본 높이에 맞게 조정 */
    margin-bottom: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    /* 이 부분은 로고의 크기에 따라 조절해야 합니다. */
    /* 로고가 너무 크다면 width, height를 줄이세요. */
    /* background-color: rgba(255, 255, 255, 0.1); /* 디버깅용 */ */
}

@media (max-width: 767px) {
	.logo-animation-wrapper {
        width: 350px; /* 로고 이미지의 원본 너비에 맞게 조정 */
        height: 128px; /* 로고 이미지의 원본 높이에 맞게 조정 */
      
      	margin-bottom: 40px;
      	margin-top: 40px;
    }
}

#dynamicLogoFill {
    width: 100%;
    height: 100%;
    background-size: cover; /* 배경 이미지가 div를 채우도록 */
    background-position: center;
    background-repeat: no-repeat;
    
    /* 여기서 logo.png 파일을 마스크 이미지로 사용합니다. */
    /* 로고 파일 경로를 정확히 입력하세요. */
    -webkit-mask-image: url('logo_2603061.png'); /* 웹킷 브라우저 (크롬, 사파리) */
    mask-image: url('logo_2603061.png'); /* 표준 */
    
    -webkit-mask-size: contain; /* 마스크 이미지가 요소에 맞춰지도록 */
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.coming-soon-text h1 {
    font-size: 3em;
    margin-bottom: 10px;
    color: #e0e0e0;
}

.coming-soon-text p {
    font-size: 1.2em;
    line-height: 1.6;
    color: #b0b0b0;
}

.countdown {
    font-size: 2em;
    margin: 30px 0;
    font-weight: bold;
    color: #00bcd4; /* 강조 색상 */
}

.subscribe-form {
    margin-top: 30px;
    display: flex;
    justify-content: center;
    gap: 10px; /* 입력 필드와 버튼 사이 간격 */
}

.subscribe-form input[type="email"] {
    padding: 12px 20px;
    border: 1px solid #555;
    background-color: #333;
    color: #eee;
    border-radius: 5px;
    font-size: 1em;
    width: 280px;
    max-width: 70%;
}

.subscribe-form button {
    padding: 12px 25px;
    background-color: #00bcd4;
    color: #ffffff;
    border: none;
    border-radius: 5px;
    font-size: 1em;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.subscribe-form button:hover {
    background-color: #00a4b8;
}

.social-links {
    margin-top: 40px;
}

.social-links a {
    margin: 0 10px;
    display: inline-block;
}

.social-links img {
    width: 30px; /* 소셜 아이콘 크기 */
    height: 30px;
    transition: transform 0.2s ease;
}

.social-links img:hover {
    transform: scale(1.1);
}