/*
Theme Name: Lightning Child
Theme URI: 
Template: lightning
Description: 
Author: 
Tags: 
Version: 0.6.0
*/

#bg-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
  overflow: hidden;
}

.bg-image {
  position: absolute;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity 2s ease-in-out;
}

.bg-image.active {
  opacity: 1;
}

html,
body {
  background: transparent !important;
  color: #fff !important;
  justify-content: center;   /* 横方向中央 */
  align-items: center;       /* 縦方向中央 */
  min-height: 100vh;         /* 画面の高さ全体を使用 */
  margin: 0;
  text-align: center;
}

#page {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  text-align: center;
}

.site-header,
#header,
#vk-mobile-nav-menu {
  background: transparent !important;
  box-shadow: none !important;
}

/* サイト名（ロゴ）の文字色を白に */
.site-title,
.site-title a,
.header-logo-text,
.header-logo-text a {
  color: #fff !important;
}

.site-header-container {
  background-color: transparent !important;
}
/* ヘッダーメニューの文字色を常に白に、サイズを大きく */
.header_menu a,
.header_menu a:visited,
.global-nav li a,
.navbar-nav > li > a {
  color: #fff !important;
  font-size: 18px !important; /* サイズはお好みで調整（例: 18px） */
}

/* ホバー時の色変更（少し明るくする場合） */
.header_menu a:hover,
.global-nav li a:hover,
.navbar-nav > li > a:hover {
  color: #f0f0f0 !important;
}

.vk_post_body, #site-header {
  color: #fff !important;
}

@media (min-width: 768px) {
  .site-header,
  #header {
    background-color: transparent !important;
  }
}