/* --- Ver 9.0 最終完結デザイン（共通） --- */
html body .kaitori-form { 
    width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; 
    box-sizing: border-box !important; font-family: sans-serif !important; font-size: 16px !important; color: #333 !important; 
}
/* CF7の自動挿入タグをリセット（display: block は削除） */
.kaitori-form p, .kaitori-form span { 
    margin: 0 !important; 
    padding: 0 !important; 
}
.kaitori-form br { display: none !important; }

/* field-labelはブロック要素として表示 */
html body .kaitori-form .field-label {
    display: block !important;
    width: 100% !important;
    font-weight: bold !important;
    margin-bottom: 10px !important; /* ラベル下の余白 */
    font-size: 1rem !important;
    color: #2d3748 !important;
}

/* CF7が自動生成する要素のリセット */
.kaitori-form .wpcf7-form-control-wrap { display: block !important; width: 100% !important; }
.kaitori-form .wpcf7-not-valid-tip { display: none !important; }
.kaitori-form .wpcf7-validation-errors { display: none !important; }

/* セクション（ゆとりのある余白） */
html body .kaitori-form .kaitori-form-section,
html body .kaitori-form .form-section-wrapper, 
html body .kaitori-form .bank-area { 
    width: 100% !important; 
    background: #ffffff !important; 
    border: 1px solid #e2e8f0 !important; 
    border-radius: 12px !important; 
    padding: 30px !important; 
    margin-bottom: 40px !important; /* セクション同士の大きな余白 */
    box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important; 
    box-sizing: border-box !important; 
}

.page-title { font-size: 1.6rem !important; font-weight: bold !important; text-align: center !important; margin-bottom: 35px !important; color: #1a202c !important; }
.panel-heading { font-size: 1.3rem !important; color: #0073aa !important; border-bottom: 2px solid #0073aa !important; padding-bottom: 12px !important; margin-bottom: 25px !important; font-weight: bold !important; }
/* セクションタイトル（左ボーダーと背景色、適切な余白） */
html body .kaitori-form .section-title { 
    display: block !important;
    font-size: 1.1rem !important;
    font-weight: bold !important;
    color: #0073aa !important;
    border-left: 4px solid #0073aa !important; /* 青い縦棒 */
    padding: 5px 15px !important;
    margin: 30px 0 20px 0 !important; /* 上下にゆとりのある余白 */
    background: #f7fafc !important;
}

/* ラベルと入力欄（詳細度を上げて上書き） */
html body .kaitori-form .field-label { 
    font-weight: bold !important; 
    display: block !important; 
    margin-bottom: 10px !important; 
    color: #2d3748 !important; 
    font-size: 1rem !important; 
}

/* 任意のラベル（バッジがないラベル）のスタイル - デフォルトで適用 */
html body .kaitori-form .field-label {
    font-weight: bold !important;
    color: #2d3748 !important;
}

/* 注釈ボックス */
.notice-box-warning { 
    background: #fff3cd !important; border-left: 5px solid #ffc107 !important; padding: 20px !important; 
    margin-bottom: 25px !important; border-radius: 8px !important; color: #856404 !important; font-size: 0.95rem !important; line-height: 1.8 !important; 
}
.notice-box-info { 
    background: #e3f2fd !important; border-left: 5px solid #2196f3 !important; padding: 20px !important; 
    margin-bottom: 25px !important; border-radius: 8px !important; color: #1565c0 !important; font-size: 0.95rem !important; line-height: 1.8 !important; 
}

/* 条件分岐の囲い */
html body .kaitori-form .conditional-wrap { 
    display: none; 
    margin-top: 15px !important; 
    padding: 25px !important; 
    background: #f7fafc !important; 
    border-left: 5px solid #0073aa !important; 
    border-radius: 8px !important; 
    width: 100% !important; 
    box-sizing: border-box !important; 
}

/* 条件分岐の表示状態（JSから制御） */
html body .kaitori-form .conditional-wrap.is-visible {
    display: block !important;
}

/* 全画面高級ローダー */
.wpcf7-custom-loader { display: none !important; position: fixed !important; top: 0; left: 0; width: 100% !important; height: 100% !important; background: rgba(10, 25, 41, 0.85) !important; backdrop-filter: blur(10px) !important; z-index: 100000; justify-content: center; align-items: center; flex-direction: column; }
.wpcf7-custom-loader.active { display: flex !important; }
.premium-spinner { width: 70px; height: 70px; border: 5px solid rgba(255, 255, 255, 0.1) !important; border-top: 5px solid #ffffff !important; border-radius: 50% !important; animation: spin 1s linear infinite; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

/* チェックボックス・ラジオ */
html body .kaitori-form .center-box { 
    background: #f0f7fa !important; 
    border: 1px solid #bcdff1 !important; 
    border-radius: 10px !important; 
    padding: 25px !important; 
    text-align: center !important; 
    margin: 25px 0 !important; 
}

/* CF7チェックボックスのスタイル */
html body .kaitori-form .wpcf7-checkbox {
    display: inline-block !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body .kaitori-form .wpcf7-list-item { 
    display: inline-block !important; 
    margin: 0 12px !important; 
    vertical-align: middle !important;
}

html body .kaitori-form .wpcf7-list-item-label { 
    font-weight: bold !important; 
    margin-left: 8px !important; 
    vertical-align: middle !important;
    font-size: 1rem !important;
    color: #2d3748 !important;
}

/* center-box内のチェックボックスラップ */
html body .kaitori-form .center-box .wpcf7-form-control-wrap {
    display: inline-block !important;
    width: auto !important;
    margin: 0 !important;
    vertical-align: middle !important;
}

html body .kaitori-form .center-box .wpcf7-checkbox {
    display: inline-block !important;
    width: auto !important;
    margin: 0 !important;
}

/* 通常のセクション内のチェックボックス */
html body .kaitori-form .wpcf7-form-control-wrap[data-name*="bank-check"],
html body .kaitori-form .wpcf7-form-control-wrap[data-name*="terms"] {
    display: block !important;
    width: 100% !important;
    margin-bottom: 0 !important; /* 余白を削除 */
    text-align: left !important;
}

/* center-box内のチェックボックスは中央揃え、余白なし */
html body .kaitori-form .center-box .wpcf7-form-control-wrap[data-name*="bank-check"],
html body .kaitori-form .center-box .wpcf7-form-control-wrap[data-name*="terms"] {
    text-align: center !important;
    margin-bottom: 0 !important;
}

/* 必須バッジ（テキストのすぐ横に配置） */
html body .kaitori-form .badge-req { 
    display: inline-block !important; 
    width: auto !important; 
    background: #e74c3c !important; /* 赤色 */
    color: #fff !important; 
    padding: 2px 8px !important; 
    border-radius: 4px !important; 
    font-size: 0.75rem !important; 
    margin-left: 8px !important; /* テキストとの間隔 */
    vertical-align: middle !important; 
    line-height: 1.5 !important;
    font-weight: normal !important;
}

/* 任意バッジ */
html body .kaitori-form .badge-opt { 
    display: inline-block !important; 
    width: auto !important; 
    background: #718096 !important; /* グレー */
    color: #fff !important; 
    padding: 2px 8px !important; 
    border-radius: 4px !important; 
    font-size: 0.75rem !important; 
    margin-left: 8px !important;
    vertical-align: middle !important; 
    line-height: 1.5 !important;
    font-weight: normal !important;
}
.flex-row { display: flex !important; gap: 25px !important; flex-wrap: wrap !important; margin-bottom: 10px !important; }
.flex-row > div { flex: 1 !important; min-width: 250px !important; }
#main-submit { background: #0073aa !important; color: #fff !important; font-size: 1.3rem !important; font-weight: bold !important; padding: 22px !important; border-radius: 50px !important; width: 100% !important; border: none !important; cursor: pointer !important; margin-top: 40px !important; }

/* セクション間の余白（重複削除） */

/* 入力フィールドの詳細度を高める（GeneratePress対策） */
html body .kaitori-form input[type="text"], 
html body .kaitori-form input[type="email"], 
html body .kaitori-form input[type="tel"], 
html body .kaitori-form select, 
html body .kaitori-form input[type="date"], 
html body .kaitori-form input[type="file"] { 
    height: auto !important;
    padding: 12px !important;
    width: 100% !important;
    border: 1px solid #cbd5e0 !important;
    border-radius: 8px !important;
    font-size: 1rem !important;
    box-sizing: border-box !important;
    margin-bottom: 10px !important; /* 入力フィールドの下の余白を調整 */
    transition: border-color 0.3s ease !important;
}
html body .kaitori-form input[type="text"]:focus, 
html body .kaitori-form input[type="email"]:focus, 
html body .kaitori-form input[type="tel"]:focus, 
html body .kaitori-form select:focus, 
html body .kaitori-form input[type="date"]:focus {
    outline: none !important;
    border-color: #0073aa !important;
    box-shadow: 0 0 0 3px rgba(0, 115, 170, 0.1) !important;
}
/* CF7が自動生成する要素にもスタイルを適用 */
html body .kaitori-form .wpcf7-form-control-wrap { 
    display: block !important; 
    width: 100% !important; 
    margin-bottom: 20px !important; /* 入力フィールドの間隔 */
}

/* アラートテキストの直前の入力フィールドの余白を調整 */
html body .kaitori-form .wpcf7-form-control-wrap:has(+ p[style*="color:#e53e3e"]),
html body .kaitori-form .wpcf7-form-control-wrap:has(+ p[style*="color: #e53e3e"]) {
    margin-bottom: 0 !important; /* アラートテキストが直後に来る場合は余白を削除 */
}

/* 互換性のため、特定のIDでも対応 */
html body .kaitori-form .wpcf7-form-control-wrap[data-name="ind-addr2"] {
    margin-bottom: 0 !important; /* 町名番地の入力フィールドの下の余白を削除 */
}

html body .kaitori-form .wpcf7-form-control { 
    width: 100% !important; 
}

/* D&Dエリア（mfile用） */
html body .kaitori-form .codedropz-upload-handler { 
    width: 100% !important; 
    min-height: 200px !important; 
    padding: 0 !important; 
    background: #f8fbfc !important; 
    border: 3px dashed #b3d9ea !important; 
    border-radius: 16px !important; 
    text-align: center !important; 
    margin: 15px 0 !important; 
    box-sizing: border-box !important;
    position: relative !important;
}

html body .kaitori-form .codedropz-upload-container {
    width: 100% !important;
    height: 100% !important;
    min-height: 200px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 60px 20px !important;
    box-sizing: border-box !important;
}

html body .kaitori-form .codedropz-upload-inner {
    width: 100% !important;
    text-align: center !important;
}

html body .kaitori-form .codedropz-upload-inner h3 {
    font-size: 1.2rem !important;
    font-weight: bold !important;
    color: #2d3748 !important;
    margin: 0 0 15px 0 !important;
    padding: 0 !important;
}

html body .kaitori-form .codedropz-upload-inner > span {
    display: block !important;
    color: #718096 !important;
    font-size: 0.95rem !important;
    margin: 15px 0 !important;
    padding: 0 !important;
}

html body .kaitori-form .codedropz-btn-wrap {
    margin: 20px 0 0 0 !important;
    padding: 0 !important;
}

html body .kaitori-form .cd-upload-btn { 
    background: #0073aa !important; 
    color: #fff !important; 
    border-radius: 50px !important; 
    padding: 12px 40px !important; 
    font-size: 1rem !important; 
    font-weight: bold !important; 
    display: inline-block !important; 
    text-decoration: none !important;
    transition: background-color 0.3s ease !important;
    border: none !important;
    cursor: pointer !important;
}

html body .kaitori-form .cd-upload-btn:hover {
    background: #005a87 !important;
    color: #fff !important;
}

/* アップロードカウンター */
html body .kaitori-form .dnd-upload-counter {
    position: absolute !important;
    right: 10px !important;
    background: rgba(0, 115, 170, 0.1) !important;
    color: #0073aa !important;
    padding: 4px 10px !important;
    border-radius: 15px !important;
    font-size: 0.8rem !important;
    font-weight: bold !important;
    z-index: 10 !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
    display: inline-block !important;
}

html body .kaitori-form .dnd-upload-counter span {
    color: #0073aa !important;
    font-weight: bold !important;
    display: inline !important;
}

/* セレクトボックスのスタイル強化 */
html body .kaitori-form select {
    background-color: #fff !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    padding-right: 40px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
}

/* 日付入力フィールドのスタイル */
html body .kaitori-form input[type="date"] {
    position: relative !important;
}
html body .kaitori-form input[type="date"]::-webkit-calendar-picker-indicator {
    cursor: pointer !important;
    opacity: 1 !important;
    margin-left: 10px !important;
}

/* ラジオボタンとチェックボックスのスタイル */
html body .kaitori-form input[type="radio"], 
html body .kaitori-form input[type="checkbox"] {
    width: auto !important; 
    margin-right: 8px !important; 
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    cursor: pointer !important;
    vertical-align: middle !important;
    flex-shrink: 0 !important;
}

html body .kaitori-form .wpcf7-list-item { 
    margin-bottom: 10px !important; 
    display: inline-flex !important;
    align-items: center !important;
    vertical-align: middle !important;
}

/* リンクのスタイル */
html body .kaitori-form a {
    color: #0073aa !important;
    text-decoration: underline !important;
    transition: color 0.3s ease !important;
}
html body .kaitori-form a:hover {
    color: #005a87 !important;
}

/* 補足テキスト・アラートテキスト */
html body .kaitori-form p[style*="color"] { 
    margin-top: 8px !important; 
    margin-bottom: 0 !important; 
    font-size: 0.85rem !important; 
    line-height: 1.5 !important;
    display: block !important;
}

/* アラートテキスト（赤色の警告）のスタイル - 入力フィールドの直下に配置 */
html body .kaitori-form p[style*="color:#e53e3e"],
html body .kaitori-form p[style*="color: #e53e3e"] {
    margin-top: 5px !important; /* 入力フィールドとの間隔を詰める */
    margin-bottom: 20px !important; /* 次の要素（建物名など）との間隔を広げる */
    padding: 0 !important;
    font-size: 0.85rem !important;
    font-weight: bold !important;
    color: #e53e3e !important;
    line-height: 1.5 !important;
    display: block !important;
}

/* 補足テキスト（グレー）のスタイル */
html body .kaitori-form p[style*="color:#718096"],
html body .kaitori-form p[style*="color: #718096"] {
    margin-top: 8px !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    font-size: 0.85rem !important;
    color: #718096 !important;
    line-height: 1.5 !important;
    display: block !important;
}

/* flex-row内のフィールドラベルと入力の調整 */
html body .kaitori-form .flex-row .field-label { 
    margin-bottom: 12px !important; 
}
html body .kaitori-form .flex-row .wpcf7-form-control-wrap { 
    margin-bottom: 0 !important; 
}

/* セクション内の余白調整 */
html body .kaitori-form .form-section-wrapper > div { 
    margin-bottom: 0 !important; 
}
html body .kaitori-form .form-section-wrapper > div:not(:last-child) { 
    margin-bottom: 25px !important; 
}

.submit-area { 
    margin-top: 40px !important; 
}

/* エラー表示 */
.input-error { border: 2px solid #e74c3c !important; background: #fee !important; }
.form-error-message { background: #fee !important; color: #c33 !important; padding: 15px !important; border-radius: 8px !important; margin-bottom: 20px !important; border-left: 5px solid #e74c3c !important; }

/* 送信完了メッセージのスタイル（シンプルで読みやすいデザイン） */
html body .kaitori-form .wpcf7-response-output {
    font-size: 1.1rem !important;
    line-height: 1.8 !important;
    padding: 25px 30px !important;
    margin: 40px 0 !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
    font-weight: 500 !important;
    letter-spacing: 0.02em !important;
}

/* 送信成功時のメッセージ（緑色の背景・洗練されたデザイン） */
html body .kaitori-form .wpcf7-response-output.wpcf7-mail-sent-ok {
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%) !important;
    border: 2px solid #22c55e !important;
    color: #166534 !important;
    text-align: center !important;
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.15) !important;
    animation: fadeInUp 0.5s ease-out !important;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 送信失敗時のメッセージ（赤色の背景・洗練されたデザイン） */
html body .kaitori-form .wpcf7-response-output.wpcf7-mail-sent-ng,
html body .kaitori-form .wpcf7-response-output.wpcf7-validation-errors {
    background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%) !important;
    border: 2px solid #ef4444 !important;
    color: #991b1b !important;
    text-align: center !important;
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.15) !important;
    animation: fadeInUp 0.5s ease-out !important;
}

/* 登録番号（インボイス番号）の接頭辞「T」のデザイン - 上書き禁止レベル */
html body .kaitori-form .registration-number-wrapper {
    display: flex !important;
    align-items: stretch !important;
    max-width: 320px !important;
    margin-top: 5px !important;
    width: 100% !important;
}

html body .kaitori-form .registration-prefix {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #eee !important;
    border: 1px solid #ccc !important;
    border-right: none !important;
    padding: 10px 15px !important;
    font-weight: bold !important;
    color: #333 !important;
    border-radius: 4px 0 0 4px !important;
    white-space: nowrap !important;
    font-size: 1.1rem !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    line-height: 1.5 !important;
    height: 100% !important;
}

html body .kaitori-form .registration-number-wrapper .wpcf7-form-control-wrap {
    flex: 1 !important;
    display: flex !important;
    align-items: stretch !important;
    margin: 0 !important;
}

html body .kaitori-form .registration-number-wrapper input[type="text"],
html body .kaitori-form .registration-number-wrapper input[type="tel"],
html body .kaitori-form input#ind-invoice-num,
html body .kaitori-form input#corp-invoice-num {
    flex: 1 !important;
    margin: 0 !important;
    border: 1px solid #ccc !important;
    border-left: none !important;
    border-radius: 0 4px 4px 0 !important;
    padding: 10px 15px !important;
    height: auto !important;
    box-sizing: border-box !important;
    line-height: 1.5 !important;
    min-height: 46px !important;
    width: 100% !important;
    font-size: 1rem !important;
}

html body .kaitori-form .registration-number-wrapper input[type="text"]:focus,
html body .kaitori-form .registration-number-wrapper input[type="tel"]:focus,
html body .kaitori-form input#ind-invoice-num:focus,
html body .kaitori-form input#corp-invoice-num:focus {
    border-left: none !important;
    outline: none !important;
    border-color: #0073aa !important;
}

html body .kaitori-form .registration-number-wrapper:focus-within .registration-prefix {
    border-color: #0073aa !important;
}

/* ===========================================
   個人口座警告メッセージ
   =========================================== */
html body .kaitori-form #corp-bank-individual-warning {
    display: none !important;
    background-color: #fee !important;
    border: 2px solid #e53e3e !important;
    padding: 20px !important;
    margin-bottom: 25px !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(229, 62, 62, 0.2) !important;
}

html body .kaitori-form #corp-bank-individual-warning.is-visible {
    display: block !important;
}

html body .kaitori-form #corp-bank-individual-warning p {
    margin: 0 0 10px 0 !important;
    font-size: 1rem !important;
    line-height: 1.6 !important;
}

html body .kaitori-form #corp-bank-individual-warning a {
    display: inline-block !important;
    margin-top: 10px !important;
    font-size: 0.95rem !important;
}

/* ===========================================
   商品写真見本画像
   =========================================== */
html body .kaitori-form img[alt="撮影の見本"] {
    max-width: 40% !important;
    height: auto !important;
    border: 2px solid #cbd5e0 !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    display: block !important;
    margin: 20px auto !important;
}

/* 高齢者・初心者向け：フォントサイズと余白の拡大 */
html body .kaitori-form .notice-box-info,
html body .kaitori-form .notice-box-warning {
    font-size: 1rem !important;
    line-height: 1.8 !important;
    padding: 20px !important;
}

html body .kaitori-form .notice-box-info ul,
html body .kaitori-form .notice-box-warning ul {
    font-size: 1rem !important;
    line-height: 1.8 !important;
    padding-left: 25px !important;
    margin: 10px 0 !important;
}

/* ===========================================
   モバイル表示の最適化
   =========================================== */
@media screen and (max-width: 768px) {
    /* 左右の余白を狭くする */
    html body .kaitori-form .kaitori-form-section,
    html body .kaitori-form .form-section-wrapper, 
    html body .kaitori-form .bank-area {
        padding: 20px 15px !important;
    }
    
    /* 撮影の見本画像を100%にする */
    html body .kaitori-form img[alt="撮影の見本"] {
        max-width: 100% !important;
    }
}