/*青ヘッダ用テーブルcss*/
.tbl_d_i001 {
  border-collapse: collapse;
  border: solid 1px orange;/*表全体を線で囲う*/
#  table-layout: fixed;
  width: 100%;
  horizontal-align:middle;
  max-width: 600px;
  text-align: center;
  margin: auto 0;
}
.tbl_d_i001 th{
  background-color: #EAFFD4;
#  border: 1px solid #d2e8f1;
  color : #FF95C7;
#  padding: 1em;
}
.tbl_d_i001 td {
  border: 1px solid #d2e8f1;
#  padding: 1em;
}
.tbl_d_i001 thead th {
  background-color: #ABFF55;
  color: #FF95F5;
#  border: 1px solid #4d9bc1;
#  background-color: #C2E1FF;
#  color: #f;
#  border: 1px solid #C2E1FF;

  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
.tbl_d_i001 thead th:last-of-type {
  border-right: 1px solid #4d9bc1;
}
.tbl_d_i001 tbody td:last-of-type {
  border-right: 1px solid #4d9bc1;
}
.tbl_d_i001 tbody th {
  background-color: #EAFFD4;
  border: 1px solid #d2e8f1;
#  color: #4d9bc1;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 787px) {
  .tbl_d_i001 {
    text-align: center;
  }
  .tbl_d_i001 thead {
    display:none;
  }
  .tbl_d_i001 th, .tbl_d_i001 td {
    display: block;
    border: 0;
    border-bottom: 1px solid #e6f1f6;
  }
  .tbl_d_i001 tbody th{
    background: #4d9bc1;
    color:#fff;
  }
  .tbl_d_i001 td::before{
    content: attr(data-label);
    color: #4d9bc1;
    font-weight: bold;
    display: inline-block;
    width: 20%;
#    min-width: 4em;
  }
  .tbl_d_i002 {
    text-align: center;
  }
  .tbl_d_i002 thead {
    display:none;
  }
  .tbl_d_i002 th, .tbl_d_i002 td {
    display: block;
    border: 0;
    border-bottom: 1px solid #e6f1f6;
  }
  .tbl_d_i002 tbody th{
    background: #FF6879;
    color:#fff;
  }
  .tbl_d_i002 td::before{
    content: attr(data-label);
    color: #FF6879;
    font-weight: bold;
    display: inline-block;
    width: 20%;
#    min-width: 4em;
  }

/*赤ヘッダ用テーブルcss*/

}

.tbl_d_i002 {
  border-collapse: collapse;
#  table-layout: fixed;
  width: 100%;
  max-width: 400px;
  text-align: center;
}
.tbl_d_i002 th, .tbl_d_i002 td {
  border: 1px solid #d2e8f1;
#  padding: 1em;
}
.tbl_d_i002 thead th {
  background-color: #FF6879;
  color: #fff;
  border: 1px solid #FF6879;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
.tbl_d_i002 thead th:last-of-type {
  border-right: 1px solid #FF6879;
}
.tbl_d_i002 tbody th {
  color: #FF6879;
  font-weight: bold;
  text-align: center;
}
/*案内用の枠線*/
.box2 {
#    padding: 0.5em 1em;
#    margin: 2em 0;
#    font-weight: bold;
#    color: #6091d3;/*文字色*/
    color: 0;/*文字色*/
#    background: #FFF;
    border: solid 2px #C2E1FF;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.box2 p {
    margin: 0; 
    padding: 0;
    font-size:0.6em;
}

/*注意書き用の枠線*/
.box3 {
#    padding: 0.5em 1em;
#    margin: 2em 0;
#    font-weight: bold;
#    color: #6091d3;/*文字色*/
    color: 0;/*文字色*/
#    background: #FFF;
    border: solid 2px #FFB975;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.box3 p {
    margin: 0; 
    padding: 0;
    font-size:0.6em;
}



/*注意書き用の枠線 黄色*/
.box4 {
#    padding: 0.5em 1em;
#    margin: 2em 0;
#    font-weight: bold;
#    color: #6091d3;/*文字色*/
    color: 0;/*文字色*/
#    background: #FFF;
    border: solid 2px #FFF168;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.box4 p {
    margin: 0; 
    padding: 0;
    font-size:0.6em;
}

/*フォントサイズ レスポンシブ*/
/*最小値:1.1rem → 可変（0.9rem + 0.625vw（画面幅320px:2px, 800px:5px, 1200px:7.5px））→ 最大値:1.6rem*/
.font-size-S {
    font-size: clamp(1.1rem, calc(0.9rem + 0.625vw), 1.6rem);
}

/*最小値:1.2rem → 可変（1rem + 0.625vw（画面幅320px:2px, 800px:5px, 1200px:7.5px））→ 最大値:1.7rem*/
.font-size-M {
    font-size: clamp(1.2rem, calc(1rem + 0.625vw), 1.7rem);
}

/*最小値:1.6rem → 可変（2.2rem + 0.625vw（画面幅320px:2px, 800px:5px, 1200px:7.5px））→ 最大値:2.9rem*/
.font-size-L {
    font-size: clamp(2.4rem, calc(2.2rem + 0.625vw), 2.9rem);
}
