input.has-error,
select.has-error,
textarea.has-error {
  border-color: #ef4444 !important;
}

.custom-chk-container {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  user-select: none;
}

/* 本物のチェックボックスを画面外へ飛ばして完全に消す */
.custom-chk-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* 偽物の箱（未チェック時） */
.custom-chk-box {
  height: 23px;
  width: 23px;
  background-color: #fff;
  border: 1px solid #e2e1da;
  border-radius: 2px;
  position: relative;
  flex-shrink: 0;
}

/* チェックを入れた時の背景（黄色） */
.custom-chk-container input:checked ~ .custom-chk-box {
  background-color: #fefa01;
  border-color: #fefa01;
}

/* チェックマーク（最初は隠す） */
.custom-chk-box:after {
  content: "";
  position: absolute;
  display: none;
}

/* チェックされたらマークを表示 */
.custom-chk-container input:checked ~ .custom-chk-box:after {
  display: block;
}

.custom-chk-box:after {
  content: "";
  position: absolute;
  left: 50%; /* 中央寄せに調整 */
  top: 50%; /* 中央寄せに調整 */
  transform: translate(-50%, -50%); /* 中央寄せ */
  width: 12px;
  height: 9px;
  /* SVGを背景として読み込み */
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="9" viewBox="0 0 12 9" fill="none"><path d="M10.4456 0.248883L4.30326 5.98174L1.55346 3.41582C1.1978 3.08387 0.621829 3.08387 0.266749 3.41582C-0.0889162 3.74778 -0.0889162 4.28535 0.266749 4.61676L3.6593 7.7837C3.83625 7.94886 4.07004 8.03307 4.30266 8.03307C4.53528 8.03307 4.7679 7.95049 4.94603 7.7837L11.7317 1.45038C12.0874 1.11842 12.0874 0.580851 11.7317 0.249443C11.3772 -0.0830566 10.8013 -0.0830697 10.4456 0.248883Z" fill="%233D3D3D"/></svg>');
  background-repeat: no-repeat;
  background-size: contain;
  /* 以前のボーダー設定をリセット */
  border: none;
  transform: translate(-50%, -50%) rotate(0deg);
}
/* テキストのスタイル */
.custom-chk-text {
  font-size: 16px;
  font-weight: 500;
  color: #3d3d3d;
  font-family: "Noto Sans JP", sans-serif;
}

.custom-text-responsive {
  /* --- 基本は「SP（スマホ）」の数値 --- */
  color: #3d3d3d;
  font-family: "Noto Sans JP", sans-serif;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt" on; /* SPでも文字詰めあり */

  font-size: 15px; /* SPサイズ */
  font-weight: 500; /* SP太さ */
  line-height: 2; /* SP行間 200% */
  letter-spacing: 0.3px; /* SP文字間隔 */

  /* --- 画面幅が768px以上なら「PC」の数値に自動で切り替え --- */
  @media (min-width: 768px) {
    font-size: 20px; /* PCサイズ */
    font-weight: 700; /* PC太さ */
    line-height: 1.65; /* PC行間 165% */
    letter-spacing: 0.4px; /* PC文字間隔 */
    /* PCでは文字詰めをオフにする場合は以下を追加（デザイン通りならそのままでOK） */
    /* font-feature-settings: normal; */
  }
}

.custom-text-bold-responsive {
  /* --- 基本設定（共通） --- */
  color: #3d3d3d;
  font-family: "Noto Sans JP", sans-serif;
  font-style: normal;
  font-weight: 700;
  line-height: 1.65; /* 165% */
  -webkit-font-smoothing: antialiased;

  /* --- SP（スマホ）サイズ --- */
  font-size: 18px;
  letter-spacing: 0.36px;

  /* --- PCサイズ（768px以上） --- */
  @media (min-width: 768px) {
    font-size: 20px;
    letter-spacing: 0.4px;
  }
}