body {
    height: 100vh; /* Full viewport height */
    background-image: url('/Image/Cover.jpg'); /* Replace with your image URL */
    background-size: cover; /* Cover the entire section */
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* No repeating */
    background-attachment: fixed;
    margin: 0;
    padding: 0;

    color: #ffffff;
}

#hero {
    height: 100vh; /* Full viewport height */
}

#date {
    height: 100vh; /* Full viewport height */
}

#join {
    height: 100vh;
}

#date .container {
    margin-top: auto;
    margin-bottom: auto;
}

.date div h2 {
    font-size: 30px;
}

.date div .day {
    font-size: clamp(50px, 4vw, 60px);
}

.date div .day .week {
    font-size: clamp(20px, 2vw, 30px);
}

.time {
    font-weight: bold;
    font-size: clamp(25px, 2vw, 30px);
}

.smallTag {
    display: block;
    font-size: clamp(10px, 1vw, 10px);
    font-weight: bold;
    color: rgb(255, 255, 255);
}

.logo {
    max-width: 1500px; /* Adjust this value based on your logo size */
    width: 100%;
    height: auto; /* Maintain aspect ratio */
}

.header {
    background-color: rgb(0, 0, 0, .8);
}

.card {
    background-color: #ffffff74;
}

.card-header {
    border-bottom: none;
}

.card-footer {
    border-top: none;
}

i {
    font-size: 3rem;
    color: white;
}

i:hover {
    color: rgb(173, 173, 173);
}

.sns {
    margin-bottom: 1.5rem;
}