/* ===== ヘッダー(2段構成・英語/日本語ページ共通) ===== */

/* テンプレート(styles.css)の header / nav 設定を打ち消す */
#container .site-header,
#container .site-header .main-nav,
#container .site-header .main-nav ul,
#container .site-header .main-nav li {
  float: none; position: static; width: auto; height: auto;
  margin: 0; padding: 0; background: none; border: 0; box-shadow: none;
}

/* ---------- 上段:ロゴと言語切替 ---------- */
#container .header-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 0; }
#container .logo img { width: 280px; max-width: 100%; height: auto; display: block; }
#container .lang-switch { flex-shrink: 0; font-size: .85em; color: #005580; border: 1px solid #005580; border-radius: 3px; padding: 4px 10px; text-decoration: none; }
#container .lang-switch:hover { background: #005580; color: #fff; }

/* ---------- 下段:青い帯のメニュー ---------- */
#container .site-header .main-nav { background: #005580; }
#container .site-header .main-nav ul { display: flex; list-style: none; }

/* 帯の幅いっぱいに均等配置 */
#container .site-header .main-nav li { flex: 1 1 auto; }
#container .site-header .main-nav a {
  display: block; padding: 13px 8px; text-align: center; text-decoration: none;
  font-size: .95em; font-weight: normal; color: #fff;
  background: none; border: 0; border-radius: 0; transform: none;
}

/* 項目間の短い縦線 */
#container .site-header .main-nav li + li { position: relative; }
#container .site-header .main-nav li + li::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 1px; height: 1.3em; background: rgba(255,255,255,.35); pointer-events: none;
}

/* マウスを乗せたとき・現在のページ */
#container .site-header .main-nav a:hover { background: rgba(255,255,255,.2); }
#container .site-header .main-nav a[aria-current="page"] { font-weight: bold; background: rgba(255,255,255,.15); box-shadow: inset 0 -3px 0 #fff; }

/* ---------- スマホなど画面が狭いとき:3列ずつ折り返す ---------- */
@media (max-width: 700px) {
  #container .logo img { width: 200px; }
  #container .site-header .main-nav ul { flex-wrap: wrap; }
  #container .site-header .main-nav li { flex: 1 1 33%; }
  #container .site-header .main-nav li + li::before { display: none; }
  #container .site-header .main-nav a { padding: 10px 6px; font-size: .9em; border-bottom: 1px solid rgba(255,255,255,.15); }
}

/* ===== フッター(英語/日本語ページ共通) ===== */
/* テンプレートの footer 設定を打ち消したうえで指定 */
footer.site-footer {
  float: none; position: static; width: auto; height: auto;
  margin: 40px 0 0; padding: 0; border: 0; box-shadow: none;
  background: #003f5f; color: #e6eef3; font-size: .9em; line-height: 1.7; text-align: left;
}
footer.site-footer p,
footer.site-footer address { margin: 0; padding: 0; font-style: normal; }
footer.site-footer a { color: #fff; }

/* 上段:研究室名・住所・連絡先と、アクセスページへのボタン */
footer.site-footer .footer-inner {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px 40px;
  max-width: 1000px; margin: 0 auto; padding: 28px 20px 20px;
}
footer.site-footer .footer-name { font-size: 1.1em; font-weight: bold; color: #fff; margin-bottom: 6px; }
footer.site-footer .footer-access a {
  display: inline-block; padding: 6px 14px; text-decoration: none;
  border: 1px solid rgba(255,255,255,.6); border-radius: 3px;
}
footer.site-footer .footer-access a:hover { background: rgba(255,255,255,.15); }

/* 下段:著作権表示とテンプレートのクレジット */
footer.site-footer .footer-bottom {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 24px;
  max-width: 1000px; margin: 0 auto; padding: 12px 20px 16px;
  border-top: 1px solid rgba(255,255,255,.2); font-size: .85em; color: #b8cbd6;
}
footer.site-footer .footer-credit a { color: #b8cbd6; }
footer.site-footer .footer-counter { display: flex; align-items: center; }
footer.site-footer .footer-counter img { display: block; height: auto; border: 0; }