h1 {
    font-size: 140%;
    padding: 0.4em 0.5em;/*文字の上下 左右の余白*/
    color: #494949;/*文字色*/
    background: #f4f4f4;/*背景色*/
    border-left: solid 5px #7db4e6;/*左線*/
    border-bottom: solid 3px #d7d7d7;/*下線*/
  }
  
  h2 {
    font-size: 130%;
    border-bottom: solid 3px #cce4ff;
    position: relative;
  }
  
  h2:after {
    position: absolute;
    content: " ";
    display: block;
    border-bottom: solid 3px #5472cd;
    bottom: -3px;
    width: 20%;
  }
  h3 {
    font-size: 115%;
    position: relative;
    padding: 4px 4px 4px 42px;
    background: #77c3df;
    color: white;
    margin-left: -33px;
    line-height: 1.3;
    z-index:-1;
  }
  
  h3:before {
    position: absolute;
    content: '';
    left: -2px;
    top: -2px;
    border: none;
    border-left: solid 40px white;
    border-bottom: solid 79px transparent;
    z-index:-2
  }

  @media (max-width: 767px) {
    .tbl-responsive {
      border-collapse: separate;
      border-spacing: 0  20px;
    }
    .tbl-responsive thead {
      display: none;
    }
    .tbl-responsive tr {
      background-color: #f6f6f6;
    }
    .tbl-responsive td {
      border: none;
      display: block;
      width: 100%;
      box-sizing: border-box;
      border-bottom: 1px solid #dddddd;
    }
    .tbl-responsive td:before {
      content: attr(data-label);
    }
  }