.access-info-container {
  display: flex; /* デフォルトは横並びにする */
  justify-content: center; /* アイテムを中央に寄せる */
  flex-wrap: wrap; /* 画面幅が狭い場合に折り返す */
}

.access-item {
  display: flex;
  align-items: center; /* テキストと線を中央揃えにする */
  white-space: nowrap; /* テキストが折り返さないようにする */
}

.access-item p {
  margin: 0; /* pタグのデフォルトマージンをリセット */
  padding-right: 10px; /* テキストと線の間の余白 */
  color: #333; /* テキストの色 */
}

.separator-line {
  width: 20px; /* 線の長さ */
  height: 6px; /* 線の太さ。太くしました。 */
  flex-shrink: 0; /* 縮小させない */
}

.another-strikethrough {
  text-decoration-line: line-through;
  text-decoration-style: dotted;
  text-decoration-thickness: 3px;
  font-weight: bold;
  text-decoration-color: #f18c1b;
}

/* スマートフォン向けの調整 */
@media (max-width: 768px) {
  .access-info-container {
    flex-direction: column; /* 縦並びにする */
    align-items: flex-start; /* 左寄せにする */
    gap: 0px; /* 縦並び時の間隔 */
    padding-top: 20px; /* 必要であれば上部に余白を追加 */
  }

  .access-item {
    width: 100%; /* 幅を100%にする */
    justify-content: flex-start; /* 左寄せにする */
  }

  .access-item p {
    padding-right: 5px; /* スマートフォンでの余白調整 */
  }
}

@media (min-width: 768px) {
  .access-info-container {
    padding-top: 20px; /* 必要であれば上部に余白を追加 */
    gap: 30px;
  }
}