/**
 * フォーム共通コンポーネントCSS
 * register / contact / auth / profile で共有されるフォーム要素
 */

/* ==========================================================================
   入力要素ベース
   ========================================================================== */
.c-form-control,
.c-form-select,
.c-form-textarea {
    box-sizing: border-box;
    width: 100%;
    padding: var(--space-12) var(--space-16);
    font-size: var(--font-size-base);
    font-family: inherit;
    color: var(--color-text);
    border: 1px solid #D2DEEF;
    border-radius: var(--border-radius-md);
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    background: var(--color-white);
}

/* フォーカス */
.c-form-control:focus,
.c-form-select:focus,
.c-form-textarea:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(40, 115, 201, 0.15);
}

/* フォーカス（profile：box-shadow なし） */
.p-profile-form :is(.c-form-control, .c-form-select):focus {
    box-shadow: none;
}

/* エラー状態 */
.c-form-control.is-error,
.c-form-select.is-error,
.c-form-textarea.is-error {
    border-color: var(--color-error);
}

/* プレースホルダー */
.c-form-control::placeholder,
.c-form-textarea::placeholder {
    color: var(--color-gray);
}

/* セレクトボックス共通リセット */
.c-form-select {
    appearance: none;
    background-image: url('../images/icon/arrow_down_mini.svg');
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 20px;
    padding-right: 40px;
    cursor: pointer;
}

/* 都道府県セレクト幅 */
#prefecture {
    width: 277px;
    max-width: 100%;
}

/* 日付入力（カレンダーアイコン非表示） */
input[type="date"].c-form-control {
    appearance: none;
}

input[type="date"].c-form-control::-webkit-calendar-picker-indicator {
    display: none;
}

input[type="date"].c-form-control::-webkit-inner-spin-button {
    display: none;
}

/* パスワード入力ラッパー（トグルボタン付き） */
.c-form-input-wrap {
    position: relative;
    display: block;
}

.c-form-input-wrap .c-form-control {
    padding-right: 40px;
}

/* ==========================================================================
   ラベル
   DEPRECATED: auth移行後に削除（auth.js が .c-form-label を参照）
   ========================================================================== */
.c-form-label {
    font-size: var(--font-size-sub);
    font-weight: 500;
    color: var(--color-text);
}

/* ==========================================================================
   フィールドコンテナ
   DEPRECATED: auth移行後に削除（auth.js が .c-form-field を参照）
   ========================================================================== */
.c-form-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.c-form-field--half {
    flex: 1;
    min-width: 0;
}

/* ==========================================================================
   エラーメッセージ
   ========================================================================== */
.c-form-error {
    font-size: var(--font-size-small);
    color: #FC4545;
}

.c-form-error:empty {
    display: none;
}

/* ==========================================================================
   フォームコンテナ
   ========================================================================== */
.c-form {
    display: flex;
    flex-direction: column;
    gap: var(--space-32);
}

/* ==========================================================================
   フィールドセットリセット
   DEPRECATED: auth移行後に削除
   ========================================================================== */
.c-form-fieldset {
    border: none;
    padding: 0;
    margin: 0;
}

/* ==========================================================================
   レジェンド
   DEPRECATED: auth移行後に削除
   ========================================================================== */
.c-form-legend {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    margin-bottom: var(--space-16);
    padding: 0;
}

.c-form-legend-text {
    font-size: var(--font-size-base);
    font-weight: 600;
    color: var(--color-text);
}

/* ==========================================================================
   入力カード: PCでラベルと入力を横並び（register / contact）
   DEPRECATED: auth移行後に削除（旧 .p-form__card--inline-fields 系）
   ========================================================================== */
.p-form__card--inline-fields[data-form-card="input"] {
    --form-label-width: 176px;
}

.p-form__card--inline-fields[data-form-card="input"] .c-form-fieldset:not([hidden]) {
    display: flex;
    align-items: center;
    gap: var(--space-24);
}

.p-form__card--inline-fields[data-form-card="input"] .c-form-fieldset > .c-form-legend {
    flex-shrink: 0;
    width: var(--form-label-width);
    margin-bottom: 0;
}

/* 上揃え: ラベルを入力フォームの上端に配置 */
.p-form__card--inline-fields[data-form-card="input"] .c-form-fieldset--align-top {
    align-items: flex-start;
}

.p-form__card--inline-fields[data-form-card="input"] .c-form-fieldset > :not(.c-form-legend) {
    flex: 1;
    min-width: 0;
}

/* ==========================================================================
   インラインサブラベル（姓名・セイメイ: PC/SP共に横並び）
   DEPRECATED: auth移行後に削除（旧 .c-form-field--inline 系）
   ========================================================================== */
.c-form-field--inline {
    flex-direction: row;
    align-items: start;
    gap: var(--space-8);
}

.c-form-field--inline > .c-form-label {
    flex-shrink: 0;
    width: auto;
    padding: var(--space-12) 0;
    border: 1px solid transparent;
}

.c-form-field__body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* インラインレスポンシブ（所属情報: PCは横並び、SPは縦並び） */
.c-form-field--inline-responsive {
    flex-direction: row;
    align-items: start;
    gap: var(--space-8);
}

.c-form-field--inline-responsive > .c-form-label {
    flex-shrink: 0;
    width: auto;
    padding: var(--space-12) 0;
    border: 1px solid transparent;
}

/* ==========================================================================
   必須バッジ
   DEPRECATED: auth移行後に削除（新規は .c-form-group__label--required::after を使用）
   ========================================================================== */
.c-form-required {
    display: inline-block;
    padding: 2px 8px;
    font-size: var(--font-size-small);
    font-weight: 500;
    color: var(--color-white);
    background: var(--color-error);
    border-radius: var(--border-radius-sm);
}

/* ==========================================================================
   フォームページ共通レイアウト（register / contact / mypage）
   ========================================================================== */
.p-form-main {
    min-height: calc(100vh - var(--header-height) - var(--footer-height));
    background-color: var(--color-white, #FFFFFF);
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0 auto;
}

.p-form-page__title {
    width: 100%;
}

.p-form-page__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.p-form-page__inner {
    box-sizing: border-box;
    width: min(var(--container-max-width), calc(100% - (var(--gutter) * 2)));
}

/* ==========================================================================
   ステップインジケーター（profile / register / contact 共通）
   ========================================================================== */
.p-form-steps {
    --profile-step-number-size: 48px;
    --profile-step-number-font-size: 32px;
    --profile-step-label-font-size: 20px;
    --profile-step-line-thickness: 4px;
    --profile-step-gap: clamp(40px, 12vw, 180px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: var(--profile-step-gap);
    margin-bottom: 0;
}

.p-form-steps__item {
    display: flex;
    flex: 0 0 var(--profile-step-number-size);
    flex-direction: column;
    align-items: center;
    position: relative;
    text-align: center;
    gap: var(--space-8);
}

.p-form-steps__number {
    width: var(--profile-step-number-size);
    height: var(--profile-step-number-size);
    border-radius: 50%;
    background: #DAE4F2;
    color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--profile-step-number-font-size);
    font-weight: bold;
    line-height: 0.1;
    position: relative;
    z-index: 1;
    transition: all 0.3s ease;
}

.p-form-steps__number-text {
    display: inline-block;
    line-height: 1;
    margin-top: -3px;
}

.p-form-steps__item.is-active .p-form-steps__number,
.p-form-steps__item.is-completed .p-form-steps__number {
    background: var(--color-primary);
    color: var(--color-white);
}

.p-form-steps__label {
    font-size: var(--profile-step-label-font-size);
    color: #5B5B5B;
    font-weight: 400;
}

.p-form-steps__item.is-active .p-form-steps__label,
.p-form-steps__item.is-completed .p-form-steps__label {
    color: var(--color-primary);
    font-weight: bold;
}

.p-form-steps__line {
    position: absolute;
    top: calc((var(--profile-step-number-size) / 2) - (var(--profile-step-line-thickness) / 2));
    left: var(--profile-step-number-size);
    width: var(--profile-step-gap);
    height: var(--profile-step-line-thickness);
    background: #DAE4F2;
}

.p-form-steps__line.is-completed,
.p-form-steps__item.is-active .p-form-steps__line,
.p-form-steps__item.is-completed .p-form-steps__line {
    background: var(--color-primary);
}

/* ==========================================================================
   ステップ + フォーム/メッセージのフロー（register / contact / profile 共通）
   ========================================================================== */
.p-form__flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    padding: 40px 0;
    width: 100%;
}

.p-form__flow > .p-profile-alert {
    box-sizing: border-box;
    width: 100%;
    max-width: 800px;
    margin: 0;
}

/* ==========================================================================
   ステッパーラッパー（共通）
   ========================================================================== */
.p-form__step {
    width: 478px;
    max-width: 100%;
    text-align: center;
}

.p-form__step .p-form-steps {
    margin-bottom: 0;
}

/* 後方互換: 旧クラス名 */
.p-register__stepper,
.p-contact__stepper {
    width: 478px;
    max-width: 100%;
    text-align: center;
}

.p-register__stepper .p-form-steps,
.p-contact__stepper .p-form-steps {
    margin-bottom: 0;
}

/* ==========================================================================
   フォームカード（register / contact / profile 共通）
   ========================================================================== */
.p-form__card {
    box-sizing: border-box;
    width: 100%;
    max-width: 1240px;
    margin: 0;
    background: var(--color-white);
    border-radius: var(--border-radius-lg);
    border: 1px solid #D2DEEF;
    font-size: 18px;
}

/* カードバリアント: 入力 */
.p-form__card[data-form-card="input"] {
    padding: 30px 64px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* カードバリアント: 確認 */
.p-form__card[data-form-card="confirm"] {
    padding: 30px 64px;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

/* カードバリアント: 完了 */
.p-form__card[data-form-card="complete"] {
    padding: var(--space-32) var(--space-64);
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* 入力カード: ラベル幅固定
   DEPRECATED: auth移行後に削除 */
.p-form__card[data-form-card="input"] .c-form-label,
.p-form__card[data-form-card="input"] .p-profile-form__label {
    flex-shrink: 0;
    width: 176px;
}

/* 姓名セイメイ サブラベル: 36px固定（PC/SP共通）
   DEPRECATED: auth移行後に削除 */
.p-form__card[data-form-card="input"] .c-form-field--inline > .c-form-label {
    width: 36px;
}

/* サブグループラベル（所属情報・本人確認等）: 96px固定（PC）
   DEPRECATED: auth移行後に削除 */
.p-form__card[data-form-card="input"] .c-form-field--inline-responsive > .c-form-label {
    width: 96px;
}

/* 確認カード: ラベル幅固定
   DEPRECATED: auth移行後に削除 */
.p-form__card[data-form-card="confirm"] .c-form-label {
    flex-shrink: 0;
    width: 288px;
}

/* ==========================================================================
   名前グリッド（register / contact 共通）
   DEPRECATED: auth移行後に削除（新規は .c-form-group__row を使用）
   ========================================================================== */
.p-register__name-group,
.p-contact__name-group {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-50);
}

/* ==========================================================================
   行間gap統一: 入力カード内の form は 16px
   ========================================================================== */
.p-form__card[data-form-card="input"] > form {
    gap: 24px;
}

/* ==========================================================================
   c-form-group: フォーム行 Component（register / contact / profile 共通）
   ========================================================================== */

/* hidden属性の強制適用 */
.c-form-group[hidden] {
    display: none !important;
}

/* --- 行コンテナ --- */
.c-form-group {
    display: flex;
    align-items: flex-start;
    gap: var(--space-24);
}

/* 上揃えバリアント（名前、本人確認、所属情報、お問い合わせ内容）
   ※ 基底が flex-start のため実質同値だが、セマンティクスとして残す */
.c-form-group--top {
    align-items: flex-start;
}

/* --- ラベル --- */
.c-form-group__label {
    display: block;
    flex-shrink: 0;
    width: var(--form-label-width, 176px);
    font-size: var(--font-size-base);
    font-weight: bold;
    color: #333333;
    /* inputと高さを揃えるための padding + transparent border */
    padding: var(--space-12) 0;
    border: 1px solid transparent;
}

/* 必須バッジ (::after擬似要素) */
.c-form-group__label--required::after {
    content: '必須';
    display: inline-block;
    background: var(--color-error);
    color: var(--color-white);
    font-size: var(--font-size-tag, 11px);
    padding: 4px 6px;
    line-height: 1;
    border-radius: var(--border-radius-sm);
    margin-left: var(--space-8);
    font-weight: normal;
    vertical-align: middle;
}

/* --- 入力領域 --- */
.c-form-group__field {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* 所属情報など複数サブグループを持つ場合 */
.c-form-group__field--subgroups {
    gap: var(--space-24);
}

/* --- コントロールラッパー (input + error 縦並び) --- */
.c-form-group__control {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 4px;
}

/* --- サブラベル（姓名/セイメイ: PC/SP共に横並び） --- */
.c-form-group__sublabel {
    display: block;
    flex-shrink: 0;
    width: 36px;
    font-size: var(--font-size-base);
    font-weight: bold;
    color: #333333;
    white-space: nowrap;
    padding: var(--space-12) 0;
    border: 1px solid transparent;
}

/* レスポンシブサブラベル（所属情報: PCは横並び、SPは縦並び） */
.c-form-group__sublabel--responsive {
    width: 96px;
}

/* --- 名前行（2カラム横並び） --- */
.c-form-group__row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-16);
}

/* 名前セクションの行間調整 */
.c-form-group__field--name {
    gap: var(--space-12);
}

/* --- インライン入力（sublabel + control 横並び） --- */
.c-form-group__inline {
    display: flex;
    align-items: flex-start;
    gap: var(--space-12);
}

/* --- サブグループ（所属情報の各項目: PCは横並び） --- */
.c-form-group__subgroup {
    display: flex;
    align-items: flex-start;
    gap: var(--space-8);
}

/* --- ヒントテキスト --- */
.c-form-group__hint {
    font-size: var(--font-size-small);
    color: var(--color-gray);
    line-height: 1.5;
    margin: 0;
}

/* 施設名・施設住所ヒント */
.c-form-group__field--subgroups .c-form-group__hint {
    color: #1E3A5F;
}

/* --- ラジオボタングループ --- */
.c-form-radio-group {
    display: flex;
    gap: var(--space-24);
    flex-wrap: wrap;
    padding: var(--space-12) 0;
    border: 1px solid transparent;
}

.c-form-radio {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    cursor: pointer;
}

.c-form-radio input[type="radio"] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
    border: 1px solid #D2DEEF;
    appearance: none;
    border-radius: 50%;
    background: var(--color-white);
    flex-shrink: 0;
    cursor: pointer;
}

.c-form-radio input[type="radio"]:checked {
    border-color: var(--color-primary);
    background: var(--color-white);
    box-shadow: inset 0 0 0 4px var(--color-primary);
}

.c-form-radio span {
    font-size: var(--font-size-base);
    color: var(--color-text);
}

/* 性別ラジオラベルのみボールド */
.c-form-radio input[name="gender"] + span {
    font-weight: bold;
}

/* ==========================================================================
   c-form-confirm: 確認画面 Component（register / contact / profile 共通）
   ========================================================================== */

/* --- 確認画面フォームラッパー（form要素がc-form-confirmとactionsを包む場合） --- */
.c-form-confirm-flow {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

/* --- コンテナ --- */
.c-form-confirm {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

/* --- 行（ラベル + 値） --- */
.c-form-confirm__item {
    display: flex;
}

/* --- ラベル列 --- */
.c-form-confirm__label {
    flex: 0 0 var(--form-confirm-label-width, 288px);
    font-weight: 600;
    font-size: 18px;
    color: var(--color-text);
}

/* --- 値列 --- */
.c-form-confirm__value {
    flex: 1;
    min-width: 0;
    font-size: 18px;
    color: var(--color-text);
    word-break: break-word;
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

/* サブアイテム間のgapを広げる（所属情報等） */
.c-form-confirm__value--gap-lg {
    gap: 32px;
}

/* テキストエリア内容の改行保持 */
.c-form-confirm__value--pre {
    white-space: pre-wrap;
}

/* --- 名前行（姓/名、セイ/メイ） --- */
.c-form-confirm__name {
    display: flex;
    gap: var(--space-12);
    align-items: baseline;
}

.c-form-confirm__name > span:not(.c-form-confirm__name-label) {
    display: inline-block;
    width: 224px;
}

.c-form-confirm__name-label {
    font-size: 18px;
    font-weight: 600;
    color: var(--color-text);
    min-width: 36px;
    flex-shrink: 0;
}

/* --- サブ項目行（所属情報・本人確認等） --- */
.c-form-confirm__subitem {
    display: flex;
    gap: var(--space-12);
    align-items: baseline;
}

.c-form-confirm__subitem--vertical {
    flex-direction: row;
    gap: var(--space-12);
}

.c-form-confirm__sublabel {
    font-size: 18px;
    font-weight: 600;
    color: var(--color-text);
    min-width: 96px;
    flex-shrink: 0;
}

.c-form-confirm__sublabel--wide {
    width: 96px;
}

/* --- ファイル表示 --- */
.c-form-confirm__file {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    color: #1E3A5F;
}

.c-form-confirm__file-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* --- アイコン表示 --- */
.c-form-confirm__icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    overflow: hidden;
}

.c-form-confirm__icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* --- アクションボタンエリア --- */
.c-form-confirm__actions {
    display: flex;
    justify-content: center;
    gap: 16px;
}

.c-form-confirm__actions .c-gi-btn {
    width: 246px;
    box-sizing: border-box;
    border-radius: var(--border-radius-button);
    justify-content: center;
    text-align: center;
    box-shadow: none;
}

.c-form-confirm__actions .c-gi-btn::after {
    display: none;
}

/* ==========================================================================
   c-form-complete: 完了画面 Component（register / contact / profile 共通）
   ========================================================================== */

/* --- コンテナ --- */
.c-form-complete {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-16);
    text-align: center;
}

.c-form-complete__message p {
    font-size: var(--font-size-large);
    line-height: 1.8;
    color: var(--color-text);
    margin: 0;
}

/* --- アクションボタン --- */
.c-form-complete__actions {
    display: flex;
    justify-content: center;
}

.c-form-complete__actions .c-gi-btn {
    width: 246px;
    box-sizing: border-box;
    border-radius: var(--border-radius-button);
    justify-content: center;
    text-align: center;
    box-shadow: none;
}

.c-form-complete__actions .c-gi-btn::after {
    display: none;
}

/* ==========================================================================
   レスポンシブ (SP: 768px以下)
   ========================================================================== */
@media screen and (max-width: 768px) {
    .p-form__flow {
        gap: 16px;
        padding: 32px 0;
    }

    .p-form-steps {
        --profile-step-number-size: 32px;
        --profile-step-number-font-size: 20px;
        --profile-step-label-font-size: 14px;
        --profile-step-gap: 42px;
    }

    /* ステッパーラッパーSP */
    .p-form__step,
    .p-register__stepper,
    .p-contact__stepper {
        width: 182px;
    }

    /* フォームカードSP */
    .p-form__card {
        font-size: 14px;
    }

    .p-form__card[data-form-card="input"] {
        padding: 24px 10px;
        gap: 20px;
    }

    .p-form__card[data-form-card="confirm"] {
        padding: 24px 10px;
        gap: 20px;
    }

    .p-form__card[data-form-card="complete"] {
        padding: var(--space-24) var(--space-16);
        gap: 20px;
    }

    /* SP時はラベル幅を自動に
       DEPRECATED: auth移行後に削除 */
    .p-form__card[data-form-card="input"] .c-form-label,
    .p-form__card[data-form-card="input"] .p-profile-form__label,
    .p-form__card[data-form-card="confirm"] .c-form-label {
        width: auto;
    }

    /* SP時も姓名セイメイは36px維持
       DEPRECATED: auth移行後に削除 */
    .p-form__card[data-form-card="input"] .c-form-field--inline > .c-form-label {
        width: 36px;
    }

    /* SP時はregister / contact入力フォームを縦並びに戻す
       DEPRECATED: auth移行後に削除 */
    .p-form__card--inline-fields[data-form-card="input"] .c-form-fieldset {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

    .p-form__card--inline-fields[data-form-card="input"] .c-form-fieldset > .c-form-legend {
        margin-bottom: 0;
    }

    /* SP時はインラインレスポンシブを縦並びに
       DEPRECATED: auth移行後に削除 */
    .c-form-field--inline-responsive {
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
    }

    .c-form-field--inline-responsive > .c-form-label {
        padding: 0;
        border: none;
    }

    /* 入力カード内formのSP gap */
    .p-form__card[data-form-card="input"] > form {
        gap: 20px;
    }

    .c-form-confirm__subitem--vertical {
        flex-direction: row;
        gap: var(--space-4);
    }

    /* 医療関連法定免許等: SP時はラベルとファイルを縦並び */
    .c-form-confirm__subitem--file {
        flex-direction: column;
    }

    .c-form-confirm__sublabel--wide {
        width: 68px;
    }

    /* =========== c-form-group SP対応 =========== */

    /* 全行縦並び */
    .c-form-group {
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
    }

    /* ラベルリセット */
    .c-form-group__label {
        width: auto;
        padding: 0;
        border: none;
        font-size: 14px;
    }

    /* サブラベル（姓名セイメイ・所属情報）はSPで12px */
    .c-form-group__sublabel {
        font-size: 12px;
        width: 24px;
        padding: 0;
        border: none;
    }

    /* 姓名セイメイ: 入力フォーム中央揃え、gap 4px */
    .c-form-group__inline {
        align-items: center;
        gap: 4px;
    }

    /* 姓名のみ右揃え */
    .c-form-group__field--name > .c-form-group__row:first-child .c-form-group__sublabel {
        text-align: right;
    }

    /* ラジオラベルはSPで12px */
    .c-form-radio span {
        font-size: 12px;
    }

    /* 名前行は2カラム維持 */
    .c-form-group__row {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-12);
    }

    /* サブグループ間の余白をSPで詰める */
    .c-form-group__field--subgroups {
        gap: 4px;
    }

    /* サブグループ（所属情報）はSPで縦並び */
    .c-form-group__subgroup {
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
    }

    /* 施設情報のヒントテキストはSPで非表示 */
    .c-form-group__field--subgroups .c-form-group__hint {
        display: none;
    }

    .c-form-group__sublabel--responsive {
        width: auto;
        padding: 0;
        border: none;
    }

    /* ラジオもSPではpadding/borderリセット */
    .c-form-radio-group {
        padding: 0;
        border: none;
        gap: 16px;
    }

    .c-form-radio {
        gap: 4px;
    }

    /* 入力要素SP */
    .c-form-control,
    .c-form-select,
    .c-form-textarea {
        font-size: 14px;
        padding: 4px 8px;
    }

    /* =========== c-form-confirm SP対応 =========== */

    .c-form-confirm {
        gap: 16px;
    }

    /* 確認画面: 行を縦並び */
    .c-form-confirm__item {
        flex-direction: column;
        gap: var(--space-8);
    }

    /* ラベルリセット */
    .c-form-confirm__label {
        flex: none;
        font-size: 14px;
        font-weight: 700;
    }

    /* 値のフォントサイズ */
    .c-form-confirm__value {
        font-size: 13px;
    }

    .c-form-confirm__value--gap-lg {
        gap: var(--space-8);
    }

    .c-form-confirm__name > span:not(.c-form-confirm__name-label) {
        width: 80px;
    }

    /* サブグループのフォントサイズ */
    .c-form-confirm__name-label,
    .c-form-confirm__sublabel {
        font-size: 12px;
    }

    /* サブラベル幅: 所属情報（都道府県等） */
    .c-form-confirm__sublabel {
        min-width: 53px;
    }

    /* サブラベル幅: 本人確認（登録番号 第等） */
    .c-form-confirm__sublabel--wide {
        min-width: 68px;
    }

    /* アクションボタン: 縦並び（戻るが上、登録/送信が下） */
    .c-form-confirm__actions {
        flex-direction: column;
    }

    .c-form-confirm__actions .c-gi-btn {
        width: 100%;
        min-width: auto;
    }

    /* =========== c-form-complete SP対応 =========== */

    .c-form-complete {
        gap: var(--space-16);
    }

    .c-form-complete__message p {
        font-size: var(--font-size-small);
    }

    .c-form-complete__actions .c-gi-btn {
        width: 100%;
    }
}