@charset "utf-8";

/* ========================================================================== 
   banner.css - シンプル画像バナーセクション
   ========================================================================== */

.banner-section {
    padding: 40px 20px;
    background-color: #fffaf5;
}

.banner-container {
    max-width: 850px;
    margin: 0 auto;
}

.banner-link {
    display: block;
    width: 100%;
    overflow: hidden;
    border: 1px solid #e0d5c5;
    transition: transform 0.3s ease, opacity 0.3s ease, box-shadow 0.3s ease;
}

.banner-link img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    transition: transform 0.4s ease;
}

@media (hover: hover) {
    .banner-link:hover {
        transform: translateY(-2px);
        opacity: 0.95;
        box-shadow: 0 8px 20px rgba(139, 94, 60, 0.08);
    }
    .banner-link:hover img {
        transform: scale(1.02);
    }
}