/*
Theme Name: Astra Child
Author: Strike Studio
Template: astra
Version: 1.0.0
*/


/* ここから子テーマ専用スタイルを書く */


/* === STRIKE GLOBAL HEADER === */
.strike-header{
    position:fixed;top:0;left:0;right:0;
    background:rgba(255,255,255,.95);
    backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
    z-index:9999;padding:20px 0;
    transition:.3s;border-bottom:1px solid rgba(0,0,0,.05);
    box-shadow:0 2px 10px rgba(0,0,0,.05);
}

.strike-nav-container{
    max-width:1400px;margin:0 auto;padding:0 40px;
    display:flex;justify-content:space-between;align-items:center;
}

.strike-logo{font-size:24px;font-weight:900;color:#000;text-decoration:none;letter-spacing:-.5px;}

.strike-nav-menu{
    display:flex;gap:40px;list-style:none;margin:0;padding:0;
}
.strike-nav-menu li{position:relative;}
.strike-nav-menu a{
    color:#000;text-decoration:none;font-weight:500;font-size:15px;
    transition:opacity .2s;
}
.strike-nav-menu a:hover{opacity:.6;}

/* ドロップダウン */
.dropdown:hover .submenu{display:block;opacity:1;transform:translateY(0);}
.submenu{
    position:absolute;top:100%;left:0;min-width:220px;
    background:#fff;padding:20px;border-radius:8px;box-shadow:0 8px 25px rgba(0,0,0,.08);
    display:none;flex-direction:column;gap:12px;opacity:0;transform:translateY(10px);
}

/* モバイル */
.strike-mobile-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;}
.strike-mobile-toggle span{width:24px;height:3px;background:#000;border-radius:2px;}

@media(max-width:768px){
    .strike-nav-container{padding:0 20px;}
    .strike-nav-menu{
        display:none;position:absolute;top:100%;left:0;right:0;
        background:rgba(255,255,255,.98);backdrop-filter:blur(20px);
        flex-direction:column;padding:20px;gap:20px;border-bottom:1px solid rgba(0,0,0,.1);
    }
    .strike-nav-menu.active{display:flex;}
    .strike-mobile-toggle{display:flex;}
    /* ドロップダウンをタップ展開にしたい場合は JS 側で制御 */
}

/* ---------- 修正: Programs サブメニュー ---------- */
.strike-nav-menu li{position:relative;}          /* 既に入っていれば不要 */
.submenu{
    top:calc(100% + 8px);                       /* 親から 8px 下げる */
    left:50%; transform:translateX(-50%);       /* 常に中央寄せ */
    min-width:220px; width:max-content;         /* 内容に応じ拡張しつつ最小幅を確保 */
    z-index:1000;                               /* 他要素より前面に */
}
@media(max-width:768px){
    .submenu{position:relative;left:0;transform:none;top:0;}
}

/* ---------- 修正: 固定ヘッダー分の余白 ---------- */
body.admin-bar { --strike-header-h:84px; }   /* ログインバーあり */
body:not(.admin-bar){ --strike-header-h:64px; }

.site-content{
    padding-top:var(--strike-header-h);      /* 本文全体を下げる */
}

/* ---------- Sub‑menu fix : always vertical ---------- */
.submenu{
    display:none !important;          /* hover 時に block へ */
    position:absolute !important;
    top:100% !important;
    left:0 !important;
    flex-direction:column !important; /* 念のため縦並びを固定 */
    background:rgba(255,255,255,.98) !important;
    backdrop-filter:blur(20px) !important;
    border:1px solid rgba(0,0,0,.1) !important;
    border-radius:8px !important;
    padding:8px 0 !important;
    min-width:180px !important;
    box-shadow:0 8px 25px rgba(0,0,0,.15) !important;
    z-index:1000 !important;
}

.dropdown:hover .submenu{            /* PC 用ホバー */
    display:block !important;
    opacity:1 !important;
    transform:translateY(0) !important;
}

/* 各リンクを縦に並べる */
.submenu a{
    display:block !important;
    padding:12px 20px !important;
    font-size:14px !important;
    font-weight:500 !important;
    color:#333 !important;
    border-left:3px solid transparent !important;
    transition:.2s;
}
.submenu a:hover{
    background:rgba(102,126,234,.05) !important;
    border-left-color:#667eea !important;
    color:#667eea !important;
}

/* モバイル時は既存の column メニューを使う */
@media(max-width:768px){
    .submenu{
        position:static !important;
        display:block !important;    /* モバイルメニュー展開時に表示 */
        opacity:1 !important;
        transform:none !important;
        box-shadow:none !important;
        border:none !important;
        margin-top:8px !important;
        border-radius:6px !important;
    }
}

/* 1. Hero */
.strike-single-hero{position:relative;height:45vh;overflow:hidden;min-height:320px;}
.strike-hero-img{object-fit:cover;width:100%;height:100%;}
.strike-hero-overlay{
  position:absolute;inset:0;
  background:rgba(0,0,0,.45);
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;color:#fff;padding:0 20px;
}
.strike-single-title{font-size:40px;font-weight:800;margin-bottom:8px;}
.strike-meta{font-size:14px;opacity:.85;}

@media(max-width:768px){.strike-single-title{font-size:28px;}}
@media(max-width:768px){
    .strike-single-hero{
        height:55vh;                 /* スマホは少し縦長に */
        min-height:260px;
    }
}
/* 2. 本文 */
.strike-container{max-width:900px;margin:40px auto 0;padding:0 20px;background:#fff;border-radius:12px;box-shadow:0 8px 25px rgba(0,0,0,.05);}
.strike-article{padding:60px 0;}
.strike-article img{max-width:100%;border-radius:8px;margin:24px 0;}

.strike-share, .strike-post-cta{text-align:center;margin:40px 0;}
.strike-post-nav{display:flex;justify-content:space-between;border-top:1px solid #e9ecef;padding-top:30px;}
.strike-related{margin:80px 0;}
.strike-related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:30px;}
.strike-related-card{display:block;text-decoration:none;color:#000;border:1px solid #e9ecef;border-radius:10px;overflow:hidden;transition:.2s;}
.strike-related-card:hover{box-shadow:0 6px 18px rgba(0,0,0,.08);transform:translateY(-3px);}
.strike-related-card img{width:100%;height:160px;object-fit:cover;}
.strike-related-card h3{padding:16px;font-size:16px;font-weight:600;}

/* CTA ボタン再利用 */
.strike-btn{display:inline-block;background:#667eea;color:#fff;padding:14px 32px;border-radius:9999px;font-weight:700;text-decoration:none;transition:.2s;}
.strike-btn:hover{opacity:.85;}