/* === 修理料金ページ専用スタイル === */
td.price {
  white-space: nowrap;
}

/* PC表示時の列幅指定（4列） */
@media screen and (min-width: 769px) {
  table th:nth-child(1),
  table td:nth-child(1) {
    width: 20%;
  }
  table th:nth-child(2),
  table td:nth-child(2) {
    width: 35%;
  }
  table th:nth-child(3),
  table td:nth-child(3) {
    width: 20%;
  }
  table th:nth-child(4),
  table td:nth-child(4) {
    width: 25%;
  }
}

/* === 修理料金一覧 スマホ表示（768px以下） === */
@media screen and (max-width: 768px) {
  /* 品名セル：折り返し表示 */
  #repairTable th:nth-child(2),
  #repairTable td:nth-child(2) {
    white-space: normal;
    word-break: break-word;
  }

  /* 修理料金セル：データは折り返さず中央揃え、見出しは折り返し */
  #repairTable th:nth-child(3) {
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
  }

  #repairTable td:nth-child(3) {
    white-space: nowrap;
    text-align: center;
  }
}

/* === 修理料金一覧 PC表示（769px以上） === */
@media screen and (min-width: 769px) {
  /* 修理料金セル：見出しは折り返し、データは折り返さず中央揃え */
  #repairTable th:nth-child(3) {
    white-space: normal;
    word-break: break-word;
  }

  #repairTable td:nth-child(3) {
    white-space: nowrap;
    text-align: center;
  }
}


/* === 修理金額一覧 スマホ表示時の4列目（備考）スタイル修正 === */
@media screen and (max-width: 768px) {
  #repairTable th:nth-child(4),
  #repairTable td:nth-child(4) {
    border: 1px solid #ccc !important;
    padding: 8px !important;
    word-break: break-word !important;
    box-sizing: border-box;
  }
}

/* === スマホ表示（768px以下）修理料金テーブル列幅と折り返し === */
@media screen and (max-width: 768px) {
  /* 1列目: 型名 */
  #repairTable th:nth-child(1),
  #repairTable td:nth-child(1) {
    width: 25%;
    word-break: break-word; /* 折り返しOK */
  }

  /* 2列目: 品名 */
  #repairTable th:nth-child(2),
  #repairTable td:nth-child(2) {
    width: 25%;
    word-break: break-word; /* 折り返しOK */
  }

  /* 3列目: 価格 */
  #repairTable th:nth-child(3) {
    width: 28%;
    white-space: normal; /* 見出しは折り返しOK */
    text-align: center;  /* 見出し中央寄せ */
  }

  #repairTable td:nth-child(3) {
    width: 28%;
    white-space: nowrap; /* データは折り返さない */
    text-align: center;  /* データ中央寄せ */
  }

  /* 4列目: 備考 */
  #repairTable th:nth-child(4),
  #repairTable td:nth-child(4) {
    width: 22%;
    word-break: break-word; /* 折り返しOK */
  }

}