.main {
    width: 100%;
    z-index: 10;
    position: relative;
}

.main p {
    font-size: 1.6rem;
}

.banner {
    width: 100%;
    position: relative;
}

.banner-img {
    width: 100%;
    height: 25rem;
}

.banner-img img{
    width: 100%;
    object-fit: cover;
    height: 100%;
}

.banner-message {
    position: absolute;
    background-color: var(--color-light-blue-1);
    right: 0;
    bottom: -4rem;
    width: 75%;
    color: var(--color-gray-banner);
    padding: 2rem;
    border-radius: 1rem 0 0 1rem;
    z-index: 20;
    font-size: 1.6rem ;
}

@media (min-width: 461px) {
    .banner-message {
        bottom: -3rem;
    }
}

@media (min-width: 669px) {
    .banner-message {
        width: 60%;
    }
}

@media (min-width: 835px) {
    .banner-message {
        width: 50%;
    }
}

@media (min-width: 961px) {
    .banner-message {
        width: 40%;
    }
}

@media (min-width: 1253px) {
    .banner-message {
        width: 30%;
    }
}

@media (min-width: 1328px) {
    .main {
        width: 1327px;
        margin: auto;
    }
    .header {
        width: 1327px;
        margin: auto;
    }

}