/* ========================================
   Header (PC)
======================================== */
.header {
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(5px);
    width: 100%;
    padding: 20px 0; 
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    transition: padding 0.3s ease;
}
.header-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 4%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.logo { margin: 0; line-height: 1; }
.logo img { height: 105px; width: auto; position: relative; z-index: 102; } /* ★余白に合わせて少し調整 */

.hamburger { display: none; }
.global-nav ul { display: flex; gap: 40px; align-items: center; } 
.global-nav a { 
    font-size: 15px; 
    font-weight: bold; 
    color: #555; 
    position: relative;
    letter-spacing: 0.05em; 
    white-space: nowrap; 
}

.global-nav a::after {
    content: ''; position: absolute; bottom: -5px; left: 0; width: 0; height: 2px;
    background-color: var(--color-primary); transition: var(--transition);
}
.global-nav a:hover { color: var(--color-primary); }
.global-nav a:hover::after { width: 100%; }

/* ========================================
   タブレット・小さめのPC画面用 (1100px以下)
======================================== */
@media screen and (max-width: 1200px) {
    .global-nav ul { gap: 30px; }
    .global-nav a { font-size: 13px; }
    .logo img { height: 80px; }
}

/* ========================================
   スマートフォン・タブレット用対応
======================================== */
@media screen and (max-width: 768px) {
    .header { padding: 15px 0; }
    .logo img { height: 70px; }
    
    .hamburger {
        display: block; position: relative; width: 30px; height: 20px;
        background: transparent; border: none; cursor: pointer; z-index: 102;
    }
    .hamburger span { position: absolute; left: 0; width: 100%; height: 2px; background-color: #555; transition: all 0.3s; }
    .hamburger span:nth-of-type(1) { top: 0; }
    .hamburger span:nth-of-type(2) { top: 9px; }
    .hamburger span:nth-of-type(3) { bottom: 0; }
    
    .hamburger.is-active span:nth-of-type(1) { transform: translateY(9px) rotate(45deg); }
    .hamburger.is-active span:nth-of-type(2) { opacity: 0; }
    .hamburger.is-active span:nth-of-type(3) { transform: translateY(-9px) rotate(-45deg); }

    .global-nav {
        position: fixed; top: 0; right: -100%; width: 100%; height: 100vh;
        background-color: rgba(255, 255, 255, 0.98); transition: right 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
        z-index: 101; display: flex; justify-content: center; align-items: center;
    }
    .global-nav.is-active { right: 0; } 
    .global-nav ul { flex-direction: column; gap: 40px; text-align: center; }
    .global-nav a { font-size: 18px; }
}