html,
body {
  height: 100%;
  color: #ffffff;
  background-color: #929292;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.main-content {
  flex: 1 0 auto;
}

.company-info {
  max-width: 800px;
  margin: 0 auto;
  line-height: 1.8;
}

.company-info table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.2rem;
  margin: 0 auto;
  max-width: 800px;
}

.company-info th,
.company-info td {
  border-bottom: 1px solid #ffffff;
  padding: 18px 12px;
  text-align: left;
  vertical-align: top;
}

.company-info th {
  font-weight: bold;
  width: 180px;
}

@media (max-width: 768px) {
  .main-content {
    display: flex;
    flex-direction: column; /* 縦並びにする */
    align-items: flex-start; /* 左寄せ */
  }

  .company-info table {
    width: 100%; /* テーブルを全幅に */
    border-collapse: collapse; /* テーブルの隙間をなくす */
  }

  .company-info tr {
    display: flex; /* trをflexコンテナに */
    flex-direction: column; /* 縦並びにする */
    margin-bottom: 16px; /* 各行の間にスペースを追加 */
  }

  .company-info th,
  .company-info td {
    padding: 8px; /* セルのパディング */
    text-align: left; /* 左寄せ */
    width: 100%; /* セルを全幅に */
  }

  .company-info th {
    font-weight: bold;
    width: auto; /* 見出しの幅を自動調整 */
  }
}