.place-table {
  margin: 20px auto 0;
  border-collapse: collapse;
  vertical-align: middle; }
  .place-table td {
    border: 1px solid #ededed;
    padding: 1em 0.5em; }
  .place-table .row-head {
    text-align: center;
    background: #E8F1FF; }

.sche-table {
  margin: 20px auto 0;
  text-align: center;
  border-collapse: collapse;
  vertical-align: middle;
  width: 100%;
  font-size: 0.85em; }
  .sche-table td, .sche-table th {
    border-left: 1px solid #ededed;
    border-right: 1px solid #ededed;
    border-bottom: 1px solid #005bac;
    padding: 1.2em 0.5em; }
  .sche-table .table-head {
    background: #005bac;
    color: #fff;
    border: 1px solid #fff;
    padding: 1em 0.4em 0.5em;
    text-align: center;
    font-weight: 500; }
  .sche-table .table-bg {
    background: #E8F1FF;
    border-bottom: none; }
  .sche-table .table-bg-sp {
    background: #E8F1FF; }
  .sche-table .table-dl {
    color: #F3416D;
    font-weight: bold; }
  @media only screen and (max-width: 768px) {
    .sche-table {
      display: block;
      overflow-x: scroll;
      white-space: nowrap; } }

#table01.chara-table {
  margin: 20px auto 0;
  text-align: center;
  border-collapse: collapse;
  vertical-align: middle; }
  #table01.chara-table td, #table01.chara-table th {
    border: 1px solid #ededed;
    padding: 0.8em 0.6em;
    background: #fff; }
  #table01.chara-table tr:nth-child(odd) td {
    background: #F6F7F9; }
  #table01.chara-table .table-head {
    background: #005bac;
    color: #fff;
    font-size: 1.1em;
    border: 1px solid #fff;
    text-align: center;
    font-weight: 500; }
  #table01.chara-table .table-btn {
    background: #17a2b8;
    border-radius: 7px;
    padding: 0.6em;
    font-size: 80%; }
    #table01.chara-table .table-btn a {
      color: #fff; }
  #table01.chara-table .table-btn:hover {
    transition: 0.2s;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -o-transition: 0.2s;
    -ms-transition: 0.2s;
    background: #51b9c9; }
  #table01.chara-table .table-text {
    text-align: left; }
  #table01.chara-table .example-taxt {
    color: #0D3558;
    font-size: 95%; }
  @media only screen and (max-width: 768px) {
    #table01.chara-table {
      display: block;
      overflow-x: scroll;
      white-space: nowrap; /*横スクロール*/ } }

#table02.chara-table {
  margin: 20px auto 0;
  text-align: center;
  border-collapse: collapse;
  border: 2px solid #005bac;
  vertical-align: middle; }
  #table02.chara-table td, #table02.chara-table th {
    border: 1px solid #005bac;
    padding: 0.8em 0.6em;
    color: #005bac;
    font-weight: bold; }
  #table02.chara-table .table-head {
    background: #005bac;
    color: #fff;
    font-size: 0.8em;
    border: 1px solid #fff;
    text-align: center; }
  #table02.chara-table .table-text {
    text-align: left;
    color: black;
    font-weight: normal; }
  #table02.chara-table .table-bg {
    background: #DAEAFF;
    border-top: 1px solid #005bac;
    border-bottom: 1px solid #fff; }
  #table02.chara-table .row-head1, #table02.chara-table .row-head2, #table02.chara-table .row-head3 {
    color: #fff;
    border: 1px solid #fff;
    font-size: 1em; }
  #table02.chara-table .row-head1 {
    background: linear-gradient(#89C6D8, 30%, #2FA8D7); }
  #table02.chara-table .row-head2 {
    background: linear-gradient(#6DA9DB, 30%, #308ECB); }
  #table02.chara-table .row-head3 {
    background: linear-gradient(#026EB9, 30%, #015CAB); }
  @media only screen and (max-width: 768px) {
    #table02.chara-table {
      display: block;
      overflow-x: scroll;
      /*white-space: nowrap; スマホサイズ時、表の「段階」・「意思疎通」部分が横書きになる*/ } }

.table-arrow {
  position: relative; }
  .table-arrow .text {
    color: #F3416D;
    text-align: right;
    font-size: 1.2rem; }
    @media only screen and (max-width: 768px) {
      .table-arrow .text {
        font-size: 0.8rem; } }
  .table-arrow .line {
    width: 6px;
    height: 96%;
    background-color: #DAEAFF;
    position: absolute;
    top: 2%;
    left: 11px; }
  .table-arrow .bottom-triangle, .table-arrow .top-triangle {
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    position: absolute;
    left: 4px; }
  .table-arrow .bottom-triangle {
    border-top: 10px solid #DAEAFF;
    bottom: 0.5%; }
  .table-arrow .top-triangle {
    border-bottom: 10px solid #DAEAFF;
    top: 0.5%; }
