/* PC Layout */
@media (min-width: 1024px) {
    .mobile-header {
        display: none;
    }
    
    .left-column, .right-column {
        display: block !important;
    }
    
    .container-wrapper {
        max-width: 100vw;
        margin: 0 auto;
    }
    
    .mobile-menu, .mobile-menu-overlay {
        display: none !important;
    }
    
    .main-content {
        max-width: 480px;
        padding: 2rem 1rem;
    }
    
    .sub-banners {
        display: flex;
        flex-direction: row !important; /* 強制的に横並び */
        justify-content: space-between;
        flex-wrap: nowrap !important; /* 折り返しを禁止 */
    }
    
    .sub-banner-container {
        width: 220px;
        height: 300px;
        flex: 0 0 auto; /* サイズを固定 */
    }
}

/* Tablet Layout */
@media (min-width: 768px) and (max-width: 1023px) {
    .mobile-header {
        display: flex;
    }
    
    .left-column, .right-column {
        display: none;
    }
    
    .main-content {
        max-width: 480px;
        margin: 0 auto;
        padding: 1.5rem;
    }
    
    .sub-banners {
        display: flex;
        flex-direction: row !important;
        justify-content: space-between;
        flex-wrap: nowrap !important;
        gap: 10px;
    }
    
    .sub-banner-container {
        width: 220px;
        height: 300px;
        flex: 0 0 auto;
    }
    
    .sponsors-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile Layout */
@media (max-width: 767px) {
    .mobile-header {
        display: flex;
    }
    
    .left-column, .right-column {
        display: none;
    }
    
    .main-content {
        max-width: 480px;
        margin: 0 auto;
        padding: 1rem;
    }
    
    .sub-banners {
        display: flex;
        flex-direction: row !important; /* 横並びを強制 */
        justify-content: center;
        flex-wrap: nowrap !important; /* 折り返し禁止 */
        gap: 10px;
        overflow-x: auto; /* 横スクロールを許可 */
        padding: 10px 0;
    }
    
    .sub-banner-container {
        width: 180px; /* モバイルでは少し小さく */
        height: 245px; /* 比率を維持 */
        flex: 0 0 auto; /* サイズ固定 */
    }
    
    .sub-banner {
        width: 180px;
        height: 245px;
    }
    
    .sub-banner-link {
        width: 180px;
        height: 245px;
    }
    
    .sponsors-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .footer-links {
        flex-direction: column;
    }
    
    .footer-link {
        margin: 0.5rem 0;
    }
}

/* Small Mobile Layout */
@media (max-width: 480px) {
    .main-content {
        padding: 0.75rem;
    }
    
    /* サブバナーは横並びを維持、さらに小さく */
    .sub-banners {
        justify-content: flex-start; /* 左寄せ */
        padding-bottom: 10px; /* スクロールバーのスペース確保 */
    }
    
    .sub-banner-container {
        width: 160px; /* より小さく */
        height: 218px;
    }
    
    .sub-banner {
        width: 160px;
        height: 218px;
    }
    
    .sub-banner-link {
        width: 160px;
        height: 218px;
    }
    
    .news-item a {
        display: flex;
    }
    
    .news-thumbnail {
        width: 80px;
        height: 80px;
        margin-right: 1rem;
    }
    
    .sponsors-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}