.table_design08 {
  border-collapse: collapse;
  table-layout: auto;
  width: 100%;
  max-width: 1000px;
  font-size: 132%;
}
.table_design08 th, .table_design08 td {
  border: 2px solid #fff;
  padding: 1em;
  text-align: left;
  background-color: #ffcccc;
}
.table_design08 thead th {
  background-color: #000033;
  color: #adff2f;
  border: 2px solid #4d9bc1;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  text-align: center;
  font-weight: bold;
}
.table_design08 thead th:last-of-type {
  border-right: 2px solid #4d9bc1;
}

@media screen and (max-width: 640px) {
  .table_design08 {
    text-align: left;
  }
  .table_design08 thead {
    display:none;
  }
  .table_design08 th, .table_design08 td {
    display: block;
    border: 0;
    border-bottom: 2px solid #e6f1f6;
    background-color: #ffcccc;
  }
  .table_design08 td::before{
    content: attr(data-label);
    color: #4d9bc1;
    font-weight: bold;
    display: inline-block;
    width: 25%;
    min-width: 4em;
  }
  .table_design08 tbody th {
  color: #adff2f;
  font-weight: bold;
  text-align: center;
  background: #000033;
  }
}






.table_design09 {
  border-collapse: collapse;
  table-layout: fixed;
  max-width: 1000px;
  font-size: 132%;
}
.table_design09 th{
  border: 2px solid #fff;
  padding: 1em;
  text-align: left;
  background-color: #ffdead;
  width: 100px;
}

.table_design09 td {
  border: 2px solid #fff;
  padding: 1em;
  text-align: left;
  background-color: #ffdead;
}

.table_design09 thead th {
  background-color: #ffffff;
  color: #adff2f;
  border: 2px solid #4d9bc1;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  text-align: left;
  font-weight: bold;

}
.table_design09 thead th:last-of-type {
  border-right: 2px solid #4d9bc1;
}

@media screen and (max-width: 640px) {
  .table_design09 {
    text-align: left;
  }
  .table_design09 thead {
    display:none;
  }
  .table_design09 th{
    display: auto;
    border: 0;
    border-bottom: 2px solid #e6f1f6;
    background-color: #ffdead;
  }
  .table_design09 td {
    display: block;
    border: 0;
    border-bottom: 2px solid #e6f1f6;
    background-color: #ffdead;
  }
  .table_design09 td::before{
    content: attr(data-label);
    color: #4d9bc1;
    font-weight: bold;
    display: block;
    width: 25%;
    min-width: 4em;
  }
  .table_design09 tbody th {
  color: #ddd;
  font-weight: bold;
  text-align: center;
  background: #003355;
  }
}








.table_design10 {
  border-collapse: collapse;
  table-layout: fixed;
  max-width: 1000px;
  font-size: 132%;
}
.table_design10 th{
  border: 2px solid #fff;
  padding: 1em;
  text-align: left;
  background-color: #fff;
  width: 100px;
}

.table_design10 td {
  border: 2px solid #fff;
  padding: 1em;
  text-align: left;
  background-color: #fff;
}

.table_design10 thead th {
  background-color: #fff;
  color: #adff2f;
  border: 2px solid #4d9bc1;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  text-align: left;
  font-weight: bold;

}
.table_design10 thead th:last-of-type {
  border-right: 2px solid #4d9bc1;
}

@media screen and (max-width: 640px) {
  .table_design10 {
    text-align: left;
  }
  .table_design10 thead {
    display:none;
  }
  .table_design10 th{
    display: auto;
    border: 0;
    border-bottom: 0px;
    background-color: #fff;
  }
  .table_design10 td {
    display: block;
    border: 0;
    border-bottom: 1px solid #e6f1f6;
    background-color: #fff;
  }
  .table_design10 td::before{
    content: attr(data-label);
    color: #4d9bc1;
    font-weight: bold;
    display: block;
    min-width: 4em;
  }
  .table_design10 tbody th {
  color: #ddd;
  font-weight: bold;
  text-align: center;
  background: #fff;
  }
}






.table_design01 {
  border-collapse: collapse;
  width: 100%;
  max-width: 1000px;
}
.table_design01 th, .table_design01 td {
  border: 2px solid #fff;
  background-color: #ffdead;
  padding: 1em;
}
.table_design01 th {
  background-color: #000033;
  color: #fff;
  font-weight: bold;
  text-align: center;
  width: 20%;
  min-width: 4em;
}








/* table01 */
.table01 tr {
  border-bottom: 1px solid #b5b1b1;
}

.table01 th,
.table01 td {
  padding: 24px 0;
  border: none;
}

.table01 th {
  width: 30%;
}

/* sp */
@media only screen and (max-width: 640px) {
  .table01 th,
  .table01 td {
    width: 100%;
    display: block;
  }

  .table01 th {
    width: 100%;
  }

  .table01 td {
    padding-top: 0;
  }
}
