@charset "utf-8";

/* --- table --- */
table {
  border-collapse: separate;
  border-spacing: 1px;
  background-color: #ccc;
  word-wrap: break-word;
}
table th {
  background-color: #efece7;
  border: 1px solid #fff;
  vertical-align: middle;
  font-weight: normal;
  text-align: left;
  padding: 6px;
}
table td {
  background-color: #fff;
  border: 1px solid #fff;
  padding: 6px;
}
@media screen and (min-width: 768px){
  table th {
    width: 25%;
  }
}
@media not all and (min-width: 768px){
  table th {
    width: 30%;
  }
}

/* --- .fBox --- */
.fBox div p {
  margin-bottom: 20px;
}
.fBox figure figcaption {
  text-align: center;
}
@media screen and (min-width: 768px){
  .fBox {
    display: -webkit-box;
    display: flex;
  }
  .fBox div {
    width: calc((100% - 20px) * 0.6);
  }
  .fBox figure {
    width: calc((100% - 20px) * 0.4);
    margin-left: 20px;
  }
  .fBox figure figcaption {
    font-size: calc(15 / 16 * 1rem);
  }
}
@media not all and (min-width: 768px){
  .fBox figure {
    margin-top: 20px;
  }
}