.company-details table {
    width: 100%; /* テーブルの幅を100%に */
    border-collapse: collapse; /* セルの境界線を重ねる */
    margin-bottom: 30px; /* 下のマージン */
}

.company-details th,
.company-details td {
    border: 1px solid #ddd; /* セルの枠線 */
    
    text-align: left; /* テキストを左寄せ */
}

.company-details th {
    background-color: #f2f2f2; /* 見出しセルの背景色 */
    font-weight: bold; /* フォントを太く */
    width: 150px; /* 見出しセルの幅を固定 */
    text-align: center;
}

.company-details td {
    padding: 12px 20px 12px 20px; /* セルの内側のパディング */
}

.top-button {
    text-align: center; /* ボタンを中央寄せ */
    margin-top: 30px; /* 上のマージン */
}

.top-button .button {
    display: inline-block; /* インラインブロック要素に */
    background-color: #007bff; /* ボタンの背景色 */
    color: #fff; /* ボタンの文字色 */
    text-decoration: none; /* 下線を削除 */
    padding: 10px 20px; /* 内側のパディング */
    border-radius: 5px; /* 角を丸く */
    transition: background-color 0.3s ease; /* ホバー時の変化を滑らかに */
}

.top-button .button:hover {
    background-color: #0056b3; /* ホバー時の背景色 */
}



/* レスポンシブ対応（必要に応じてブレークポイントを追加・調整） */
@media (max-width: 768px) {
    header .container,
    footer .footer-content {
        flex-direction: column; /* 縦並びに変更 */
        text-align: center; /* テキストを中央寄せ */
    }

    header .logo,
    footer .footer-logo {
        margin-bottom: 10px; /* 下にマージン */
    }

    header nav ul,
    footer .footer-nav ul {
        flex-direction: column; /* 縦並びに変更 */
        align-items: center; /* 中央寄せ */
    }

    header nav ul li,
    footer .footer-nav ul li {
        margin: 5px 0; /* 上下のマージン */
    }

    .company-info-section .button-group {
        flex-direction: column; /* ボタンを縦並びに */
        align-items: center; /* 中央寄せ */
    }

    .company-info-section .button-group button {
        margin: 5px 0; /* 上下のマージン */
        width: 80%; /* 幅を調整 */
        max-width: 300px; /* 最大幅を設定 */
    }

    .company-details th {
        width: 100px; /* 見出しセルの幅を調整 */
    }
}