@media screen and (max-width: 767px) {
  .law-table tbody tr {
    display: grid;
  }
}
.law-table tbody tr th,
.law-table tbody tr td {
  padding: 20px;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.6;
  vertical-align: top;
  color: var(--main);
}
@media screen and (max-width: 767px) {
  .law-table tbody tr th,
  .law-table tbody tr td {
    padding: 4vw;
    font-size: 3.7333333333vw;
  }
}
.law-table tbody tr th {
  width: 30%;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  .law-table tbody tr th {
    width: 100%;
    color: #fff;
    background-color: var(--main);
  }
}
@media screen and (max-width: 767px) {
  .law-table tbody tr td {
    padding-block: 4vw 8vw;
  }
}
.law-table tbody tr td dl {
  padding-left: 1.5em;
}
.law-table tbody tr td dl div + div {
  margin-top: 40px;
}
.law-table tbody tr td dl dt,
.law-table tbody tr td dl dd {
  font-weight: 500;
  color: var(--main);
}
.law-table tbody tr td dl dt {
  position: relative;
  font-size: 18px;
}
@media screen and (max-width: 767px) {
  .law-table tbody tr td dl dt {
    font-size: 4vw;
  }
}
.law-table tbody tr td dl dt::before {
  position: absolute;
  top: 0.4em;
  left: -1.5em;
  display: block;
  width: 1em;
  height: 1em;
  content: "";
  background-color: var(--primary-color);
  border-radius: 50%;
}
.law-table tbody tr td dl dd {
  margin-top: 5px;
}
@media screen and (max-width: 767px) {
  .law-table tbody tr td dl dd {
    margin-top: 1.3333333333vw;
    font-size: 3.7333333333vw;
  }
}