/* ==================================================
   健康診断・予防接種ページ：表レイアウト調整
================================================== */

body.service03 #service-content .table-scroll {
  width: 100%;
  overflow-x: auto;
  margin: 20px 0;
  padding-bottom: 4px;
  -webkit-overflow-scrolling: touch;
}

body.service03 #service-content table.list01,
body.service03 #service-content table.list02,
body.service03 #service-content table.list03 {
  width: 100%;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  background: #fff;
  border: 1px solid #cbd8bc;
  font-size: 14px;
  line-height: 1.65;
  box-shadow: 0 2px 8px rgba(64, 92, 43, 0.08);
}

/* 見出しセル */
body.service03 #service-content table.list01 th,
body.service03 #service-content table.list02 th,
body.service03 #service-content table.list03 th {
  padding: 12px 10px;
  background: #8ecb43;
  color: #fff;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  vertical-align: middle;
  border-right: 1px solid rgba(255, 255, 255, 0.45);
  border-bottom: 1px solid #79b638;
  word-break: normal;
  overflow-wrap: break-word;
}

body.service03 #service-content table.list01 th:last-child,
body.service03 #service-content table.list02 th:last-child,
body.service03 #service-content table.list03 th:last-child {
  border-right: none;
}

/* 通常セル */
body.service03 #service-content table.list01 td,
body.service03 #service-content table.list02 td,
body.service03 #service-content table.list03 td {
  padding: 13px 12px;
  color: #444;
  background: #fff;
  line-height: 1.7;
  text-align: left;
  vertical-align: top;
  border-right: 1px solid #d9e2d0;
  border-bottom: 1px solid #d9e2d0;
  word-break: normal;
  overflow-wrap: break-word;
}

body.service03 #service-content table.list01 td:last-child,
body.service03 #service-content table.list02 td:last-child,
body.service03 #service-content table.list03 td:last-child {
  border-right: none;
}

body.service03 #service-content table.list01 tr:last-child td,
body.service03 #service-content table.list02 tr:last-child td,
body.service03 #service-content table.list03 tr:last-child td {
  border-bottom: none;
}

/* 行ごとに薄く背景色を変更 */
body.service03 #service-content table.list01 tr:nth-child(even) td,
body.service03 #service-content table.list02 tr:nth-child(even) td,
body.service03 #service-content table.list03 tr:nth-child(even) td {
  background: #f8fbf4;
}

/* 項目名のセルを強調 */
body.service03 #service-content table.list01 td:first-child,
body.service03 #service-content table.list02 td:first-child,
body.service03 #service-content table.list03 td:first-child {
  background: #f1f8e8;
  color: #3f6424;
  font-weight: bold;
  vertical-align: middle;
}

/* 回数など短い項目は中央寄せ */
body.service03 #service-content table.list02 td.column-2,
body.service03 #service-content table.list02 td.column-3,
body.service03 #service-content table.list03 td:nth-child(2) {
  text-align: center;
  vertical-align: middle;
}

/* 各表の列幅 */
body.service03 #service-content table.list01 th:nth-child(1),
body.service03 #service-content table.list01 td:nth-child(1) {
  width: 32%;
}

body.service03 #service-content table.list01 th:nth-child(2),
body.service03 #service-content table.list01 td:nth-child(2) {
  width: 48%;
}

body.service03 #service-content table.list01 th:nth-child(3),
body.service03 #service-content table.list01 td:nth-child(3) {
  width: 20%;
  text-align: center;
  vertical-align: middle;
}

body.service03 #service-content table.list02 th:nth-child(1),
body.service03 #service-content table.list02 td:nth-child(1) {
  width: 29%;
}

body.service03 #service-content table.list02 th:nth-child(2),
body.service03 #service-content table.list02 td:nth-child(2) {
  width: 13%;
}

body.service03 #service-content table.list02 th:nth-child(3),
body.service03 #service-content table.list02 td:nth-child(3) {
  width: 17%;
}

body.service03 #service-content table.list02 th:nth-child(4),
body.service03 #service-content table.list02 td:nth-child(4) {
  width: 41%;
}

body.service03 #service-content table.list03 th:nth-child(1),
body.service03 #service-content table.list03 td:nth-child(1) {
  width: 24%;
}

body.service03 #service-content table.list03 th:nth-child(2),
body.service03 #service-content table.list03 td:nth-child(2) {
  width: 13%;
}

body.service03 #service-content table.list03 th:nth-child(3),
body.service03 #service-content table.list03 td:nth-child(3) {
  width: 34%;
}

body.service03 #service-content table.list03 th:nth-child(4),
body.service03 #service-content table.list03 td:nth-child(4) {
  width: 29%;
}


/* ==================================================
   スマートフォン
================================================== */

@media screen and (max-width: 767px) {

  body.service03 #service-content .box1 {
    padding-left: 12px;
    padding-right: 12px;
  }

  body.service03 #service-content .table-scroll {
    position: relative;
    width: calc(100% + 4px);
    margin: 16px -2px 20px;
    padding: 0 2px 10px;
  }

  /* 横スクロールできることを案内 */
  body.service03 #service-content .table-scroll::before {
    display: block;
    margin: 0 0 7px;
    color: #6c765f;
    font-size: 11px;
    line-height: 1.4;
    text-align: right;
    content: "※表は横にスクロールできます";
  }

  body.service03 #service-content table.list01,
  body.service03 #service-content table.list02,
  body.service03 #service-content table.list03 {
    width: 100%;
    table-layout: fixed;
    font-size: 13px;
  }

  body.service03 #service-content table.list01 {
    min-width: 620px;
  }

  body.service03 #service-content table.list02 {
    min-width: 700px;
  }

  body.service03 #service-content table.list03 {
    min-width: 760px;
  }

  body.service03 #service-content table.list01 th,
  body.service03 #service-content table.list02 th,
  body.service03 #service-content table.list03 th {
    padding: 10px 8px;
    font-size: 12px;
  }

  body.service03 #service-content table.list01 td,
  body.service03 #service-content table.list02 td,
  body.service03 #service-content table.list03 td {
    padding: 11px 9px;
    font-size: 12px;
    line-height: 1.65;
  }

  /* 1文字ずつ縦に折り返されるのを防止 */
  body.service03 #service-content table th,
  body.service03 #service-content table td {
    writing-mode: horizontal-tb;
    word-break: normal;
    overflow-wrap: break-word;
  }

  /* スクロールバー */
  body.service03 #service-content .table-scroll::-webkit-scrollbar {
    height: 6px;
  }

  body.service03 #service-content .table-scroll::-webkit-scrollbar-track {
    background: #edf2e8;
    border-radius: 10px;
  }

  body.service03 #service-content .table-scroll::-webkit-scrollbar-thumb {
    background: #94c957;
    border-radius: 10px;
  }
}