@charset "utf-8";

@media not all and (min-width: 768px){
  .fBox ul li {
    font-size: calc(15 / 16 * 1rem);
  }
}

/* === .fBox (flexBox) === */
@media screen and (min-width: 768px){
  .fBox {
    display: -webkit-box;
    display: flex;
  }
  .fBox > * {
    width: calc((100% - 12px) / 2);
  }
  .fBox table {
    margin-left: 12px;
  }
}
@media not all and (min-width: 768px){
  .fBox table {
    margin-top: 12px;
  }
}

/* === table === */
table th,
table td {
  font-weight: normal;
  border: 2px solid #d1d1d1;
  vertical-align: middle;
}
table th {
  color: #231815;
  background-color: #efece7;
  text-align: left;
  width: 30%;
}
table td {
  width: 70%;
}
@media screen and (min-width: 768px){
  table th,
  table td {
    padding: 12px;
  }
}
@media not all and (min-width: 768px){
  table th,
  table td {
    padding: 8px;
  }
}