/* loading-overlay のスタイル */
#loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: black; /* これが真っ黒にする */
    z-index: 9999;           /* これが他の要素の上に表示させる */
    opacity: 1;              /* これが初期の不透明度 */
    transition: opacity 3s ease-out, visibility 0s 3s; /* opacity と visibility の両方 */
    pointer-events: none;    /* 下の要素をクリックできるようにする */
}

#loading-overlay.hidden {
    opacity: 0;              /* フェードアウト後の透明度 */
    visibility: hidden;      /* フェードアウト後に要素を非表示にする */
}


/* 全体の基本スタイル */
body {
  font-family: 'Arial', sans-serif;
  background-color:  black;
  color: white;
}

/* ライトモードのスタイル */
body.light-mode {
  background-color: white;
  color: black;
}


.non-header-link{
  text-decoration: underline;
  display: inline;
  color: steelblue;
}
/* 共通フッター */
footer{
  margin: 70px 0px 0px 0px;
  padding: 30px 0px 0px 0px;
  border-top:3px solid gray;
  width: 100%;
}

footer .footer_address_infomation p {
  font-size: 1.5vw;
  margin-bottom: 2vw;
}

.social-link {
  text-decoration: none; /* 下線を消す */
  color: inherit; /* 親要素の色を継承する */
}

.social-link :hover {
  color: #b09d9dcd; /*カーソルが上に来た際にTwitterカラーに変更 */
}

.social-links{
  justify-content: center; /* 水平方向に中央寄せ */
  align-items: center; /* 必要なら垂直方向にも中央揃え */
  width: 100%;
  padding-bottom: 2vw;
  display: flex; /*flexボックスにして制御する宣言 */
  gap: 20px;
}

.footer_section1{
  padding-left: 3.5vw;
  display: flex;
  justify-content: flex-start; /* 子要素を左寄せ */
  width: 100%;
}

.footer_navigations{
  display: flex; /* フレックスボックスを有効化 */
  justify-content: center; /* 水平方向に中央寄せ */
  align-items: center; /* 垂直方向に中央寄せ */
  gap: 1vw; /* 各リンク間の間隔 */
  height: 100%; /* 必要に応じて高さを指定 */
  width: 50%;
  font-size: 1.7vw;
}

p{
  margin-bottom: 0;
}

/*swichi lightmode and darkmode*/
.themes_content {
  transform: scale(0.4);
  position: fixed;
  margin-left: 60vw;
  margin-top: 4vw;
  width: 100%;
  z-index: 999;
}

/* モバイルスタイル */
@media (max-width: 650px) {
  body{
    /* padding-top: 0vw;
    padding-left: 0vw; */
    padding: 0;
    margin:0vw 0vw 0vw 0vw;
  }
  footer .footer_address_infomation p{
    font-size: 2.5vw;
  }
  .themes_content {
    margin-left: 51vw;
    margin-top: 70px;
  }
}

/*工事*/
.construction{
  text-align: center;
  font-size: 10vw;
  padding-top: 10vw;
  width: 100%;
  height: 100%;
}