/**
 * 今買う vs 頭金貯めて購入 計算機 固有スタイル
 *
 * 共通スタイルは以下から継承:
 * - common/style.css - グローバルスタイル
 * - common/common.css - 共通レイアウト
 * - common/calculator-common.css - 計算機共通スタイル
 *   - 2列レイアウト、操作メニュー、結果表示エリア
 *   - シミュレーションヘッダー
 *   - ダイアログ関連（保存・呼出）
 *   - 印刷対応
 *
 * このファイルには、今買うvs頭金貯めて購入計算機でのみ
 * 使用される固有のスタイルのみを定義しています。
 */

/* ===================================================================
   ページ固有スタイルのみ定義
   =================================================================== */

/* 注: 以下のスタイルはcalculator-common.cssで定義済み
 * - .compareArea (2列レイアウト)
 * - .compare (比較パネル基本)
 * - .compare table (テーブルレイアウト)
 * - #ope (操作メニュー)
 * - #openName (現在のデータ表示)
 * - #ans (結果表示エリア基本)
 * - 保存サブメニュー
 * - 再計算ボタン
 */

/* ========================================
   見出しスタイル
   ======================================== */

/* calculator-common.cssで定義済みのスタイル:
   .calc-section-title / .midashi - セクション見出し
   .calc-section-desc / .midashires - 見出し下の説明文
   必要に応じてこれらのクラスを使用できます */

/* 計算結果テーブルのカスタマイズ */
/* 基本スタイルは calculator-common.css から継承 */

/* now-vs-later 固有のテーブルスタイル */
#ans .ans table {
    width: 750px;
    margin: 0 auto 15px;
}

#ans .ans tr:not(:first-child):not(:last-child) {
    border-bottom: 1px solid #cbcbcb;
}

#ans .ans tr.total th,
#ans .ans tr.total td {
    border-top: 2px solid #999;
}

#ans .ans th,
#ans .ans td {
    padding: 7px 20px;
}

#ans .ans th {
    background: #f5f6fb;
    font-weight: normal;
}

/* 結果ラベルスタイルはcalculator-common.cssで定義済み
   (#ans .ans td label) - 削除済み */

/* 結果表示エリアのグラフコンテナ */
#ans .ans:first-child {
    padding: 30px 20px;
}

/* 残債額計算用の入力フィールド（ページ固有） */
/* 注: デフォルト幅(110px)はcalculator-common.cssで定義済み
   必要に応じて .txtNum--small (60px) や .txtNum--medium (80px) を使用可能 */
#txtZansaiAge {
    width: 60px !important;  /* .txtNum--smallと同じ幅 */
    font-size: 20px !important;
    padding: 2px 5px !important;
}

/* レスポンシブ・印刷対応はcalculator-common.cssで定義済み */