/* ==============================
 * 変数定義とリセット
 * ============================== */
:root {
  /* 間隔・サイズ設定 - 一貫したマージン・パディングを維持するための変数 */
  --spacing-xs: 5px;               /* 超小型間隔 */
  --spacing-sm: 8px;               /* 小型間隔 */
  --spacing-md: 15px;              /* 中型間隔 */
  --spacing-lg: 20px;              /* 大型間隔 */
  --spacing-xl: 30px;              /* 特大間隔 */
  
  /* 境界線 - 一貫したボーダースタイルを維持するための変数 */
  --border-radius-sm: 4px;         /* 小型の角丸 */
  --border-radius-md: 8px;         /* 中型の角丸 */
  --border-radius-lg: 10px;        /* 大型の角丸 */
  
  /* フォントサイズ - 他のCSSファイルで定義されている可能性のあるサイズを補完 */
  --font-size-xs: 10px;            /* 超小型フォント */
  --font-size-sm: 12px;            /* 小型フォント */
  --font-size-md: 14px;            /* 中型フォント */
  --font-size-lg: 16px;            /* 大型フォント */
  
  /* 新規追加: 判定エリアのサイズ設定 */
  --notification-height-pc: 180px;   /* PC向け判定エリア高さ */
  --notification-height-mobile: 300px; /* モバイル向け判定エリア高さ */
  --notification-collapsed-height: 60px; /* 折りたたみ時の高さ */
}

/* ==============================
 * 共通ラッパー - 表と判定エリアの幅を一致させるための設定
 * ============================== */
/* 表全体に枠線を追加 */
.subsidy-content-wrapper .subsidy-table {
  border-collapse: collapse;
  border: 4px solid #ddd;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  /* table-layout: fixed; 重要: 列幅を固定レイアウトに */
}

.subsidy-content-wrapper .subsidy-table tr:last-child td {
  border-bottom: 4px solid #ddd;
}

/* 表組エリアの枠線 */
.subsidy-content-wrapper .subsidy-table th,
.subsidy-content-wrapper .subsidy-table td {
  border: 1px solid #ddd;
  padding: 8px;
  height: 2em;
}

/* ヘッダーに薄いグレーの背景色を設定 */
.subsidy-content-wrapper .subsidy-th {
  background-color: #f2f2f2;
  text-align: center;
  font-size: 15px;
}

/* 縦書きテキストセルの調整 */
/* .subsidy-content-wrapper .vertical-text {
  border: 1px solid #ddd;
} */

.subsidy-content-wrapper {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  box-sizing: border-box;
}

/* 注釈クラス */
.message-area {
  margin : 10px;
}
.notes {
  background-color: #ececec;
  padding: 10px;
}
span.thin-underline {
  text-decoration:underline;
}

/* ==============================
 * 表組みコンポーネント
 * ============================== */
.subsidy-table-container {
  overflow-x: auto;
  margin-bottom: var(--spacing-xl);
}

.vertical-header {
  width: 7%;
  max-width: 7%;
}

.target-work-header {
  width: 20%;
}

.subsidy-type-header {
  width: 38%;
}

.subsidy-amount-header {
  width: 12%;
}

.checkbox-header {
  width: 10%;
}

/* 縦書きテキスト - 事業区分用の縦書き表示 */
.vertical-text {
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  text-orientation: upright;
  -webkit-text-orientation: upright;
  white-space: nowrap;
  text-align: center;
  width: 20px;
  max-width: 25px;
  margin: auto;
}

/* テーブルカラムレイアウト */
.subsidy-table__subsidy-amount {
  text-align: right;
  font-weight: normal;
}

.subsidy-table__checkbox-cell {
  text-align: center;
  width: 60px;
}

/* 補助金種類に応じた背景色 */
/* 窓リノベ関連の背景 */
.bg-light-blue {
  background-color: #dceaf7;
  color: #1c90e7;
  font-weight: bold;
  font-size: 15px;
  /* writing-mode: vertical-rl; */
}

/* 給湯省エネ関連の背景 */
.bg-light-red {
  background-color: #fbe3d6;
  color: #ff7816;
  font-weight: bold;
  font-size: 15px;
  /* writing-mode: vertical-rl; */
}

/* グリーン住宅関連の背景 */
.bg-light-green {
  background-color: #d9f2d0; 
  color: #319b03;
  font-weight: bold;
  font-size: 15px;
}

.bg-gray {
  background-color: var(--secondBgColor);  /* 通常セルの背景 */
}

/* グリーン住宅のセル結合表現 - セルの視覚的な結合 */
.subsidy-table__merged-cell {
  background-color: #e8f5e9;
}

/* セル結合の境界線制御 - 詳細度を上げる */
.subsidy-table .subsidy-table__merged-cell--left {
  border-right: none;  /* 左側のセル結合 */
}

/* グリーン住宅支援 のborder */
.bg-light-green.subsidy-table__merged-cell--left.border_Bnone {
  border-bottom: none;
}
.bg-light-green.subsidy-table__merged-cell--right.border_Tnone {
  border-top: none;
  /* writing-mode: vertical-rl; */
  border-bottom: 4px solid #ddd;
}

.subsidy-table .subsidy-table__merged-cell--right {
  border-left: none;   /* 右側のセル結合 */
}


/* 条件バッジ - 必須条件などを示すラベル */
.condition-badge {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 0;
  font-size: var(--font-size-xs);
  font-weight: bold;
  margin-left: var(--spacing-xs);
  background-color: #ffffff;
  border: 1px solid;
}

.condition-badge--req1,
.condition-badge--req2 {
  color: var(--emphasisRed);
  border-color: var(--emphasisRed);  /* 必須条件のラベル */
  font-size: 12px;
  border: solid 2px #d70101;
  font-weight: normal;
}

.condition-badge--optional {
  color: var(--color-text);
  border-color: var(--color-text);       /* 任意条件のラベル */
  border: solid 2px #a6a6a6;
  color: #8b8b8b;
  font-size: 12px;
  font-weight: normal;
  width: 32px;
  text-align: center;
}

.subsidy-content-wrapper .subsidy-type-icon {
  display: none;
}
/* ==============================
 * 4. 判定エリアコンポーネント
 * ============================== */
/* プレースホルダーの設定 - JavaScriptとの互換性を保つ */
#resultAreaPlaceholder {
  width: 100%;
  /* 修正: プレースホルダーの高さと余白を0に設定 */
  height: 0;
  margin: 0;
  visibility: hidden;
  box-sizing: border-box;
}

/* 判定エリア基本レイアウト - 画面下部に固定表示される判定結果エリア */
.notification-area {
  position: fixed;
  padding: var(--spacing-md);
  background-color: #ffffff;
  border: 2px solid var(--dekiruGreen);
  border-radius: var(--border-radius-lg);
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  z-index: 1000;
  color: var(--color-text);
  box-sizing: border-box;
  bottom: 0;
  width: 100%;
  max-width: 1200px; 
  left: 50%;
  transform: translateX(-50%);
  /* 修正: 高さを固定 */
  /* height: var(--notification-height-pc); */
  height: 150px;
  overflow-y: auto;
  /* トランジションは透明度のみに */
  transition: opacity 0.3s ease;
}

/* 判定エリアの固定解除時のスタイル - 表の下に配置される時の設定 */
/* 詳細度を上げて !important を排除 */
.subsidy-content-wrapper .notification-area.notification-area-static {
  position: absolute;
  bottom: auto;
  /* 修正: 表示位置を調整 */
  left: 50%;
  transform: translateX(-50%);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1200px;
}

/* 判定エリア内容領域 - 判定結果と金額表示を含む領域 */
.notification-area__content {
  /* 修正: コンテンツレイアウトの調整 */
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  transition: opacity 0.3s ease;
  opacity: 1;
  /* 追加: 高さを設定、ボタンエリア分を引く */
  position: relative;
  height: calc(100% - 40px);
  width: 100%;
}

/* 左側の判定セクション - 各補助金の申請可否を表示 */
.notification-area__eligibility {
  flex: 0 1 auto;
  /* 追加: 内容がはみ出した場合のスクロール */
  /* max-height: 100%; */
  overflow-y: auto;
}

/* 右側の金額表示セクション - 補助金額を表示 */
.notification-area__amount {
  position: absolute;
  bottom: 0;
  right: 0;
  padding-bottom: 0px;
}

/* 金額表示のコンテナ - 補助金額表示を整理 */
.amount-display {
  display: flex;
  align-items: center;
}

/* 申請可能な補助額計、対象の補助額計 文言 */
.amount-display__label {
    font-size: 16px;
}

/* スラッシュ */
.amount-display__separator {
  font-size: 40px;
  color: #777;
  margin: 0 20px;
}


/* 申請可能な補助額計 */
.total-amount {
  color: var(--emphasisRed);
  font-weight: bold;
  font-size: 32px;
}
.total-amount .currency {
  font-size: 18px;
}
.total-target-amount .currency {
  font-size: 18px;
}

/* 補助額必須項目 */
.subsidy_required_item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: none;
}

/* 工事個所 */
.subsidy-table__checkbox-cell.bg-gray select#item_small_window,
.subsidy-table__checkbox-cell.bg-gray select#item_medium_window,
.subsidy-table__checkbox-cell.bg-gray select#item_large_window,
.subsidy-table__checkbox-cell.bg-gray select#item_clean_toilet,
.subsidy-table__checkbox-cell.bg-gray select#item_water_saving_toilet,
.subsidy-table__checkbox-cell.bg-gray select#item_water_saving_faucet,
.subsidy-table__checkbox-cell.bg-gray select#item_aircon_small,
.subsidy-table__checkbox-cell.bg-gray select#item_aircon_medium,
.subsidy-table__checkbox-cell.bg-gray select#item_aircon_large {
  height: 40px;
  width: 40px;
  border: solid 2px #bfbfbf !important;
  border-radius: 0;
}

input#item_eco_cute_basic,
.subsidy-table__checkbox-cell input#item_eco_cute_a,
.subsidy-table__checkbox-cell input#item_eco_cute_b,
.subsidy-table__checkbox-cell input#item_eco_cute_ab,
.subsidy-table__checkbox-cell input#item_ecojaws,
.subsidy-table__checkbox-cell input#item_dishwasher,
.subsidy-table__checkbox-cell input#item_clean_range_hood,
.subsidy-table__checkbox-cell input#item_auto_stove,
.subsidy-table__checkbox-cell input#item_auto_ih,
.subsidy-table__checkbox-cell input#item_bath_dryer {
  height: 28px;
  width: 28px;
  margin-top: 8px;
}

/* checkbox改修 */
/* .renovation_checkbox {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 28px;
  height: 28px;
  margin-top: 8px;
  position: absolute;
  opacity: 0;
}

.styled-label {
  display: inline-block;
  width: 28px;
  height: 28px;
  background: #fff;
  border: 2px solid #bfbfbf;
  margin-top: 8px;
  position: relative;
  cursor: pointer;
}

.renovation_checkbox:checked + .styled-label {
  background-color: #007bff;
  border-color: #007bff;
}

.renovation_checkbox:checked + .styled-label::after {
  content: "✔";
  position: absolute;
  top: -3px;
  left: 6px;
  font-size: 20px;
  color: #fff;
  font-weight: bold;
  font-family: "Segoe UI Symbol", "Arial Black", system-ui, sans-serif;
} */

  /* ベースのチェックボックスを非表示にする */
input.renovation_checkbox {
  display: none;
}

/* ラベルの中のカスタムチェックボックス */
.styled-label {
  display: inline-block;
  position: relative;
  width: 28px;
  height: 28px;
  cursor: pointer;
}

.styled-label .check {
  position: absolute;
  top: 0;
  left: 0;
  width: 28px;
  height: 28px;
  background-color: #fff;
  border: 2px solid #bfbfbf;
  margin-top: 3px;
}

/* チェックマーク */
.styled-label .check::after {
  content: "";
  position: absolute;
  display: none;
  left: 9px;
  top: 3px;
  width: 9px;
  height: 14px;
  border: solid white;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}

/* チェック時の背景色とチェックマーク表示 */
input.renovation_checkbox:checked + .styled-label .check {
  background-color: var(--dekiruGreen);
  border-color: var(--dekiruGreen);
}

input.renovation_checkbox:checked + .styled-label .check::after {
  display: block;
}

.adjust_border_b {
  border-bottom: 4px solid #ddd;
}


/* 対象の補助額計 */
.total-target-amount {
  font-weight: bold;
  font-size: 20px;
  color: #555;
}

/* 金額表示の各行 - 各種補助金額の表示行 */
.amount-display__row {
  display: flex;
  flex-direction: column;
}


/* 判定項目 - 各補助金種類の判定結果行 */
.eligibility-item {
  margin: var(--spacing-sm) 0;
  display: flex;
  align-items: flex-start;
  line-height: 1;
}

/* 判定チェックボックス - 申請可否を表示するアイコン */
.eligibility-checkbox {
  width: 20px;
  height: 20px;
  margin-right: var(--spacing-sm);
  border-radius: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #ececec;
  color: #ffffff;
  position: relative;
  flex-shrink: 0;
  margin-top: 2px;
  transition: background-color 0.2s ease;
}

.eligibility-checkbox.active {
  background-color: var(--dekiruGreen);  /* 申請可能時の緑色表示 */
}

.eligibility-checkbox:after {
  content: '✓';
  font-size: 14px;
  font-weight: bold;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* 項目テキスト - 判定メッセージ表示用 */
.eligibility-item span {
  display: inline-block;
  line-height: 20px;
  vertical-align: top;
  white-space: nowrap;
  color: var(--color-text);
  position: relative;
  top: 1px;
}

/* 補助金アイコン - 補助金種類を示すラベル */
.subsidy-icon {
  display: inline-flex;
  background-color: #ffffff;
  color: var(--dekiruGreen);
  border: 1px solid var(--dekiruGreen);
  height: 20px;
  padding: 0 var(--spacing-sm);
  border-radius: var(--border-radius-sm);
  font-size: 13px;
  font-weight: bold;
  margin-right: var(--spacing-sm);
  text-align: center;
  min-width: 100px;
  white-space: nowrap;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}

/* グリーン住宅エラー表示 - グリーン住宅の判定メッセージ用 */
.green-eligibility-items {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

.green-eligibility-item {
  display: flex;
  align-items: center;
}

/* クリアボタン */
.clear-button-container {
  position: absolute;
  top: 100px;
  right: 15px;
  z-index: 2;
  display: flex;
  flex-direction: row;
}


.clear-button {
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: var(--border-radius-sm);
  padding: var(--spacing-sm) var(--spacing-md);
  margin-right: 10px;
  font-size: var(--font-size-sm);
  cursor: pointer;
  color: var(--color-text);
  transition: all 0.3s;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.clear-button:hover {
  background-color: #e0e0e0;
}

/* 未入力メッセージ - 工事個所未選択時のメッセージ */
.no-input-message {
  font-size: var(--font-size-md);
  font-weight: bold;
  color: var(--color-text);
  text-align: left;
  margin: var(--spacing-md) 0;
  padding-left: var(--spacing-sm);
}

.subsidy-content-wrapper + .el_hdg3 {
  margin-top: 20px;
}

.icon_detail_sp {
  display: none;
}

/* ビューポートサイズが変更されたときのテーブル調整 */
@media (min-width: 769px) and (max-width: 1024px) {
  /* タブレット向け調整 */
  .target-work-header,
  .subsidy-table__target-work {
    width: 30%;
  }
  
  .subsidy-type-header,
  .subsidy-table__subsidy-type {
    width: 28%;
  }
  
  .subsidy-amount-header,
  .subsidy-table__subsidy-amount {
    width: 22%;
  }
  
  .checkbox-header,
  .subsidy-table__checkbox-cell {
    width: 10%;
  }
}


/* ==============================
 * 5. レスポンシブ対応（モバイル）
 * !important を排除するためにセレクタの詳細度を上げる
 * ============================== */
@media (max-width: 768px) {
  /* コンテンツラッパーのモバイル表示設定 */
  .subsidy-content-wrapper {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  
  /* テーブル構造のモバイル最適化 - スマホ表示用のテーブル調整 */
  .subsidy-content-wrapper .subsidy-table {
    /* width: 100%; */
    /* table-layout: fixed; */
  }

  .subsidy-content-wrapper .subsidy-table {
  border-collapse: collapse;
  border: 4px solid #ddd;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border-right: none;
  border-left: none;
  /* table-layout: fixed; 重要: 列幅を固定レイアウトに */
}
  
  /* 縦書きセルとヘッダーの非表示 - モバイル表示では不要な要素を隠す */
  /* .subsidy-content-wrapper .vertical-text,
  .subsidy-content-wrapper .vertical-header,
  .subsidy-content-wrapper .subsidy-table thead tr th:first-child {
    display: none;
    width: 0;
    padding: 0;
    margin: 0;
    border: none;
  } */
  
  /* 「ヶ所」テキストの非表示 - モバイル表示ではスペース節約のため非表示 */
  .subsidy-content-wrapper .subsidy-table__checkbox-cell .place-text {
    display: none;
  }
  
  /* 列幅の最適化 - モバイル表示での各列の幅調整 */
  .subsidy-content-wrapper .target-work-header,
  .subsidy-content-wrapper .subsidy-table__target-work {
    width: 41%;
    min-width: 41%;
    max-width: 41%;
    word-break: break-word;
  }
  
  .subsidy-content-wrapper .subsidy-type-header,
  .subsidy-content-wrapper .subsidy-table__subsidy-type {
    width: 34%;
    min-width: 34%;
    max-width: 34%;
    word-break: break-word;
  }

  .subsidy_required_item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }
  
  .subsidy-content-wrapper .subsidy-amount-header,
  .subsidy-content-wrapper .subsidy-table__subsidy-amount {
    width: 20%;
    min-width: 20%;
    max-width: 20%;
    padding-right: 2px;
    white-space: nowrap;
  }
  
  .subsidy-content-wrapper .checkbox-header,
  .subsidy-content-wrapper .subsidy-table__checkbox-cell {
    width: 11%;
    min-width: 11%;
    max-width: 11%;
    padding-left: 1px;
    padding-right: 1px;
  }
  
  /* 入力要素の表示を最適化 */
  .subsidy-content-wrapper .subsidy-table__checkbox-cell select,
  .subsidy-content-wrapper .subsidy-table__checkbox-cell input[type="checkbox"] {
    transform: scale(0.9);
    margin: 0;
  }
  
  /* セル内容の最適化 - モバイル表示でのセル内余白調整 */
  .subsidy-content-wrapper .subsidy-table th,
  .subsidy-content-wrapper .subsidy-table td {
    /* padding: 2px 6px; */
    overflow: hidden;
    text-overflow: ellipsis;
  }
  
  /* アイコン表示の最適化 - モバイル表示での補助金種類アイコン */
  .subsidy-content-wrapper .subsidy-type-icon {
    display: inline-flex;
    width: 20px;
    height: 20px;
    border-radius: 0;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    margin: 0 1px 0 0;
    padding: 0;
    color: white;
    font-weight: bold;
    flex-shrink: 0;
  }
  
  /* アイコン背景色 - 補助金種類を色で識別 */
  .subsidy-content-wrapper .icon-window { background-color: #3faafa; }  /* 窓リノベアイコン */
  .subsidy-content-wrapper .icon-kyutou { background-color: #ff7816; }  /* 給湯省エネアイコン */
  .subsidy-content-wrapper .icon-green { background-color: #77cc00; }   /* グリーン住宅アイコン */
  
  /* テキスト部分を非表示 - モバイル表示ではアイコンのみ表示 */
  .subsidy-content-wrapper .subsidy-text { display: none; }
  
  /* 通貨単位の非表示 - モバイル表示では「円」を非表示 */
  .subsidy-content-wrapper .subsidy-table__subsidy-amount .currency {
    display: none;
  }
  
  /* 補助金アイコンの最適化 - モバイル表示での判定エリアのアイコン */
  .subsidy-content-wrapper .subsidy-icon {
    min-width: 70px;
    padding: 0 4px;
    font-size: 10px;
    margin-right: 6px;
  }
  
  /* 条件バッジの最適化 - モバイル表示での条件表示 */
  .subsidy-content-wrapper .condition-badge {
    margin-left: 2px;
    padding: 2px 4px;
    font-size: 11px;
    line-height: 1.2;
  }
  
  /* 判定エリアのモバイル最適化 - スマホ表示での判定エリア */
  .subsidy-content-wrapper .notification-area {
    width: 100%;
    position: fixed;
    /* 修正: 高さを可変から固定に変更 */
    height: auto; /* 修正: 可変に変更 */
    overflow-y: auto;
    will-change: transform;
    display: flex;
    flex-direction: column;
    padding: 5px 10px;
  }


  
  .green-eligibility-item span {
    white-space: normal !important;
    word-break: break-word;
    line-height: 1.3;
    flex: 1;
  }
  
  /* クリアボタンのレイアウト - モバイル用ボタン配置 */
  .subsidy-content-wrapper .clear-button-container {
    position: static;
    display: flex;
    justify-content: flex-end;
    width: 100%;
    /* margin-bottom: 15px; */
    order: -1;
    display: none;
  }
  
  .subsidy-content-wrapper .clear-button {
    font-size: 13px;
    padding: 5px 15px;
    white-space: nowrap;
    flex: 1;
    margin-right: 10px;
    max-width: 25%;
}

  /* 判定エリア内容のレイアウト - モバイル表示での内容配置 */
  .subsidy-content-wrapper .notification-area__content {
    flex-direction: column;
    width: 100%;
    /* margin-top: 15px; */
    order: 1;
    /* 修正: モバイル時はposition:relativeのままで */
    position: relative;
    height: auto;
  }
  
  .subsidy-content-wrapper .notification-area__eligibility {
    width: 100%;
    margin-bottom: 0;
    padding: 0;
    /* 修正: スクロールを無効化（コンテナでスクロール） */
    max-height: none;
    overflow-y: visible;
  }
  
  /* 金額表示 - モバイル表示での金額表示領域 */
  .subsidy-content-wrapper .amount-display {
    flex-direction: row;
    justify-content: flex-end;
    width: 100%;
    margin-top: 5px;
  }
  
  .subsidy-content-wrapper .amount-display__separator {
    display: block;
    font-size: var(--font-size-md);
    margin: 0 10px;
  }
  
  .subsidy-content-wrapper .amount-display__row {
    width: auto;
    margin: 0;
    text-align: right;
  }
  
  .subsidy-content-wrapper .amount-display__label {
    font-size: 11px;
    /* margin-bottom: 2px; */
  }
  
  .subsidy-content-wrapper .total-amount {
    font-size: 28px;
    text-align: right;
  }
  
  .subsidy-content-wrapper .total-target-amount {
    color: var(--color-text);
    font-size: 18px;
    text-align: right;
  }
  
  .subsidy-content-wrapper .notification-area__amount {
    position: relative;
    bottom: auto;
    right: auto;
    border-top: 1px solid #eee;
    padding-top: 0;
    width: 100%;
    display: flex;
    justify-content: flex-end;
  }

  /* かんたん検索集計 */

  .notification-area.with-transition.visible {
    width: calc(100% - 20px) !important;
    margin-left: 10px;
    margin-right: 10px;
  }
  .notification-area.with-transition.visible.notification-area-static {
    width: calc(100% - 20px) !important;
    margin-left: 0;
    margin-right: 0;
  }

  select:first-child {
      margin-bottom: 0 ! important;
  }

  /* 工事個所 */
  td select#item_small_window {
    height: 40px;
    width: 40px;
    border: solid 2px #bfbfbf;
  }

  /* ヘッダーに薄いグレーの背景色を設定 */
  .subsidy-content-wrapper .subsidy-table .subsidy-th {
    background-color: #f2f2f2;
    text-align: center;
    font-size: 14px;
    line-height: 1.2;
    padding: 10px;
  }

  .icon_detail_sp {
    display: flex;
    flex-wrap: wrap;
    padding: 10px;
    gap: 5px 15px;
  }
  .icon_detail_sp .subsidy-type-icon {
    margin-right: 5px;
  }
  .icon_detail_sp .icon_detail_sp_text {
    display: flex;
  }
  .icon_detail_sp .icon_detail_sp_text:first {
    margin-right: 5px;
  }


  /* ベースのチェックボックスを非表示にする */
input.renovation_checkbox {
  display: none;
}

/* ラベルの中のカスタムチェックボックス */
.styled-label {
  display: inline-block;
  position: relative;
  width: 28px;
  height: 28px;
  cursor: pointer;
}

.styled-label .check {
  position: absolute;
  top: 0;
  left: -2px;
  width: 26px;
  height: 26px;
  background-color: #fff;
  border: 2px solid #bfbfbf;
  margin-top: 3px;
}

/* チェックマーク */
.styled-label .check::after {
  content: "";
  position: absolute;
  display: none;
  left: 10px;
  top: 6px;
  width: 7px;
  height: 12px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* チェック時の背景色とチェックマーク表示 */
input.renovation_checkbox:checked + .styled-label .check {
  background-color: var(--dekiruGreen);
  border-color: var(--dekiruGreen);
}

input.renovation_checkbox:checked + .styled-label .check::after {
  display: block;
}

.hp_pcNone {
  display: inline-block;
}

  /* SP非表示 */
  .bg-light-green.subsidy-table__merged-cell--left.border_Bnone {
    display: none;
  }
  .bg-light-blue {
    display: none;
  }
  .bg-light-red {
    display: none;
  }
  .bg-light-green.subsidy-table__merged-cell--right.border_Tnone {
    display: none;
  }
  .subsidy-th.vertical-header {
    display: none;
  }

}