body {
    background-image: url(./../img/index.png);
    /* 画像を常に天地左右の中央に配置 */
    background-position: center center;
    /* 画像をタイル状に繰り返し表示しない */
    background-repeat: no-repeat;
    /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
    background-attachment: fixed;
    /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
    background-size: cover;
    /* 背景画像が読み込まれる前に表示される背景のカラー */
    --text-link: #afc9ee;
    --link-hover: #ffef0c;
    font-family: "BIZ UDGothic", Meiryo,
    "Hiragino Kaku Gothic Pro", sans-serif;
    font-size: 17px;
    margin: 0;
    height: 100vh; /* 画面全体の高さを確保 */
}

.menu {
  z-index: 5;
  position: fixed; /* 画面に固定 */
  top: 0;
  left: 0;
  width: 100vw;    /* ビューポートの幅100% */
  height: 100vh;   /* ビューポートの高さ100% */
  background-color: transparent; /* 必要に応じて背景色 */
  display: flex;
  flex-direction: column;
}

.title {
  z-index: 10;
  font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
  font-size: 30px;
  position: absolute;
  top: 49.5%;
  left: 49.7%;
  transform: translate(-50%, -50%);
}

ul {
  z-index: 7;
  margin-top: auto; 
  padding: 0 0 2em 3em;
}

li {
  position: relative;
  background: transparent;/*背景色*/
  line-height: 1.05;
  padding: 0.4em 0em 0.4em 0em;
  list-style-type: none!important;/*ポチ消す*/
}

/* リンク */
A:link {
  color: var(--text-link);
  text-decoration: none;
}
A:visited {
  color: var(--text-link);
  text-decoration: none;
}
A:active {
  color: var(--text-link);
  text-decoration: none;
}
A:hover {
  color: var(--link-hover);
  text-decoration: none;
}