/* バナー画像をレスポンシブにして見切れないようにする */
header[class*="cover"] {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    min-height: 40vh;
}

/* 暗いオーバーレイを削除 */
header[class*="cover"] > div {
    background-color: transparent !important;
}

/* ヘッダーのナビゲーションメニューを黒に */
header[class*="cover"] nav a,
header[class*="cover"] nav {
    color: #000000 !important;
}

/* AboutページとLinksページで日付を非表示に */
body.page-about time,
body.page-links time {
    display: none !important;
}

/* バナーとInstagram Feedの隙間を詰める */
body > main > article:first-of-type {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

body > main > section.instagram-feed-fullwidth,
body > main > section:has(.instagram-feed-fullwidth) {
    padding-top: 0 !important;
    padding-bottom: 1rem !important;
}

/* ナビゲーションメニューのレスポンシブ対応 */
nav.pv3 {
    position: relative;
}

/* ナビゲーションメニューのリンクを調整 */
nav ul li {
    transition: all 0.3s ease;
}

/* モバイルデバイスでの調整 */
@media screen and (max-width: 768px) {
    header[class*="cover"] {
        min-height: 30vh;
    }
    
    /* モバイルでのナビゲーション調整 - 横並びを維持 */
    nav.pv3 {
        padding: 0.75rem !important;
    }
    
    nav .flex-l {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
    }
    
    nav a.f3 {
        font-size: 1rem !important;
        margin-bottom: 0;
    }
    
    nav ul {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        padding: 0 !important;
        margin: 0 !important;
        flex-wrap: wrap !important;
    }
    
    nav ul li {
        display: inline-block !important;
        padding: 0.25rem 0.5rem !important;
        margin: 0 !important;
        border-bottom: none !important;
    }
    
    nav ul li a {
        font-size: 0.85rem !important;
        white-space: nowrap !important;
    }
    
    /* ヘッダータイトルのフォントサイズ調整 */
    header h1 {
        font-size: 1.5rem !important;
    }
    
    header h2 {
        font-size: 1rem !important;
    }
}

/* タブレットサイズでの調整 - 横並びを維持 */
@media screen and (min-width: 769px) and (max-width: 1024px) {
    nav .flex-l {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
    }
    
    nav ul {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
    }
    
    nav ul li {
        display: inline-block !important;
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }
    
    nav ul li a {
        font-size: 0.95rem !important;
    }
}

/* より大きな画面での調整 */
@media screen and (min-width: 1200px) {
    header[class*="cover"] {
        min-height: 50vh;
    }
    
    nav a.f3 {
        font-size: 1.5rem !important;
    }
}

/* ソーシャルリンクのスタイリング */
.social-links-section {
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.social-links-section h2 {
    color: #333;
    font-size: 1.8rem;
    margin: 2rem 0 1.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #e0e0e0;
}

.social-links-section h2 i {
    margin-right: 0.5rem;
}

.social-link-item {
    margin: 1rem 0;
    padding: 1.2rem 1.5rem;
    border-radius: 12px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.social-link-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.social-link-item.instagram {
    background: linear-gradient(135deg, #f9f9f9 0%, #fff 100%);
    border-left: 4px solid #E1306C;
}

.social-link-item.instagram:hover {
    background: linear-gradient(135deg, #ffeef5 0%, #fff5f9 100%);
}

.social-link-item.twitter {
    background: linear-gradient(135deg, #f9f9f9 0%, #fff 100%);
    border-left: 4px solid #000000;
}

.social-link-item.twitter:hover {
    background: linear-gradient(135deg, #f0f0f0 0%, #f7f7f7 100%);
}

.social-link-item.line {
    background: linear-gradient(135deg, #f9f9f9 0%, #fff 100%);
    border-left: 4px solid #06C755;
}

.social-link-item.line:hover {
    background: linear-gradient(135deg, #e6ffe6 0%, #f0fff0 100%);
}

.social-link-item.shop {
    background: linear-gradient(135deg, #f9f9f9 0%, #fff 100%);
    border-left: 4px solid #FF6B6B;
}

.social-link-item.shop:hover {
    background: linear-gradient(135deg, #ffe6e6 0%, #fff0f0 100%);
}

.social-link-item a {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #333;
    font-size: 1.2rem;
    font-weight: 500;
    transition: color 0.3s ease;
}

.social-link-item a:hover {
    color: #000;
}

.social-link-item.instagram a i {
    color: #E1306C;
    font-size: 1.8rem;
    margin-right: 1rem;
    transition: transform 0.3s ease;
}

.social-link-item.twitter a i {
    color: #000000;
    font-size: 1.8rem;
    margin-right: 1rem;
    transition: transform 0.3s ease;
}

.social-link-item.line a i {
    color: #06C755;
    font-size: 1.8rem;
    margin-right: 1rem;
    transition: transform 0.3s ease;
}

.social-link-item.shop a i {
    color: #FF6B6B;
    font-size: 1.8rem;
    margin-right: 1rem;
    transition: transform 0.3s ease;
}

.social-link-item:hover a i {
    transform: scale(1.15);
}

/* モバイル対応 */
@media screen and (max-width: 768px) {
    .social-links-section h2 {
        font-size: 1.4rem;
    }
    
    .social-link-item a {
        font-size: 1rem;
    }
    
    .social-link-item.instagram a i,
    .social-link-item.twitter a i,
    .social-link-item.line a i,
    .social-link-item.shop a i {
        font-size: 1.5rem;
        margin-right: 0.8rem;
    }
    
    .social-link-item {
        padding: 1rem 1.2rem;
    }
}