/* どちらかにチェックを入れるメッセージ */
.radio-instruction {
    font-size: 16px;
    font-weight: bold;
    color: #007bff; /* 青色 */
    margin-bottom: 5px; /* 下のラジオボタンとの間隔を狭める */
}

/* ラジオボタンのグループ */
.radio-group {
    display: flex;
    align-items: center;
    gap: 8px; /* ラジオボタン同士の間隔を調整 */
    margin-bottom: 10px;
}

/* 各ラジオボタンとラベルの配置 */
.radio-group label {
    display: flex;
    align-items: center;
    gap: 4px; /* ボタンとラベルの間隔を微調整 */
    font-size: 16px;
    cursor: pointer;
}

/* ラジオボタンのサイズ */
.radio-group input[type="radio"] {
    width: 16px;
    height: 16px;
    accent-color: #28a745; /* チェック時の色 */
    cursor: pointer;
}

/* チェックボックスとテキストを左揃え */
.checkbox-group {
    display: flex;
    align-items: flex-start; /* 上寄せ配置 */
    gap: 3px; /* チェックボックスとテキストの間隔をコンパクトに */
    justify-content: flex-start;
}

/* チェックボックスのサイズ */
.checkbox-group input[type="checkbox"] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-top: 2px; /* ラベルの高さに合わせる */
}

/* テキスト（ラベル + プライバシーポリシー）の配置 */
.checkbox-label {
    display: flex;
    flex-direction: column; /* 縦並び */
    align-items: flex-start; /* 左揃え */
    gap: 1px; /* 「利用規約に同意します。」と「プライバシーポリシー」の間隔を最小に */
}

/* プライバシーポリシーのリンク */
.privacy-link {
    font-size: 12px; /* 文字サイズを小さく */
    color: #007bff; /* リンク色 */
    text-decoration: none;
    margin-top: 0; /* 位置を適切に調整 */
}

.privacy-link:hover {
    text-decoration: underline;
}

/* レスポンシブデザインのために幅を調整 */
@media (max-width: 600px) {
    .radio-group, .checkbox-group {
        flex-direction: column; /* 小さい画面で縦並びに変更 */
        gap: 6px;
    }

    .radio-group label, .checkbox-group label {
        font-size: 14px; /* フォントサイズを少し小さく */
    }
}
/* ラジオボタンを横並びに */
.radio-group {
    display: flex;
    flex-direction: row;  /* 横並びに変更 */
    align-items: center;
    gap: 20px;  /* ラジオボタンの間隔を調整 */
}

/* 小さい画面（スマホ）でも横並びを強制 */
@media (max-width: 600px) {
    .radio-group {
        flex-direction: row;  /* 横並び */
        justify-content: flex-start;  /* 左揃えにする */
    }

    .radio-group label {
        font-size: 16px;  /* ラベルのフォントサイズ調整 */
    }
}
/* チェックボックスとテキストを横並びに */
.checkbox-group {
    display: flex;
    flex-direction: row;  /* 横並びに変更 */
    align-items: center;
    gap: 10px;  /* チェックボックスとラベルの間隔を調整 */
}

/* スマホサイズ（600px以下）でも横並びを強制 */
@media (max-width: 600px) {
    .checkbox-group {
        flex-direction: row;  /* 横並び */
        justify-content: flex-start;  /* 左揃えにする */
    }

    .checkbox-group label {
        font-size: 16px;  /* フォントサイズ調整 */
    }
}