html{
    font-size: 62.5%;
}
body {
    background-color: white;
    font-size:1.6rem;/* 16px*/
    line-height: 1.5;
}
img {
    max-width: 100%;
    height: auto;
}
h1 {
    font-size: 36px;/* IE8以下とAndroid4.3以下用フォールバック */
    font-size: calc(2.4rem + ((1vw - 0.64rem) * 2.1429));/* 24px~36pxで可変*/
    line-height: 1.3;
}
h2 {
    font-size: 24px;/* IE8以下とAndroid4.3以下用フォールバック */
    font-size: calc(2rem + ((1vw - 0.64rem) * 0.7143));/* 20px~24pxで可変*/
    line-height: 1.3;
}

table {
  margin-left: auto;
  margin-right: auto;
  border: solid 5px;
  border-top-color: darkgray;
  border-left-color: darkgray;
  border-bottom-color: dimgray;
  border-right-color: dimgray;
}
table.left {
  margin-left: 0;
  margin-right: auto;
}
table tr,th,td {
  border: 1px solid black;
}
table th.width5 {
  width: 5%;
}
table th.width8 {
  width: 8%;
}
table th.width10 {
  width: 10%;
}
table th.width18 {
  width: 18%;
}
table th.width20 {
  width: 20%;
}
table th.width25 {
  width: 25%;
}
table th.width30 {
  width: 30%;
}
table th.width40 {
  width: 40%;
}
table th.year { 
  text-align: center;
  background-color: #fffacd; // lightyellowからlemonchiffonに変更
}
table td.center {
  text-align: center;
}
table td.nowrap {
  white-space: nowrap;
}
table td.vcenter {
  vertical-align: center;
}
table td.center-bottom {
  text-align: center;
  vertical-align: bottom;
}
table td.right {
  text-align: right;
}
table td.year { 
  text-align: center;
  background-color: #fffacd; /* lightyellowからlemonchiffonに変更 */
}
table td.yellow { 
  background-color: #fffacd; /* lightyellowからlemonchiffonに変更 */
}
table td.white {
  background-color: #e0ffff; /* lightblueからlightcyanに変更 */
}
table td.width20 {
  width: 20%;
}
table td.width25 {
  width: 25%;
}
table td.white-width25 {
  width: 25%;
  background-color: #e0ffff;
}
table td.white-center {
  text-align: center;
  background-color: #e0ffff;
}
table td.red {
  background-color: #ffb6c1; /* lightpink, #ffb6c1 */
}
table td.red-width25 {
  width: 25%;
  background-color: #ffb6c1;
}
table td.red-center {
  text-align: center;
  background-color: #ffb6c1;
}
table td.red-bottom {
  vertical-align: bottom;
  background-color: #ffb6c1;
}
table td.lightgray {
  background-color: #d3d3d3; // lightgray
}
table.no-border {
  width: 100%;
  border: 0px none;
  border-collapse:collapse;
}
table.no-border tr {
  border: 0px none;
}
table.no-border th {
  border: 0px none;
}
table.no-border td {
  border: 0px none;
}
table.no-border td.year { 
  text-align: center;
  background-color: #fffacd;
} 
table.no-border td.white {
  background-color: #e0ffff;
} 
table.no-border td.red {
  background-color: #ffb6c1;
}
table.spfull {}
table.full {
  width: 100%;
}
table.wide {}
table.nowrap {
  white-space: nowrap;
}

.center {
  text-align: center;
}
.right {
  text-align:right;
}
.tight {
  margin-left: 0;
  margin-right: auto;
}
.nowrap {
  /* スマホ版のみ */
}

table.hoge {
  border-collapse: collapse;
  margin: 0 auto;
  //padding: 0;
  //width: 650px;
  table-layout: fixed;
}

table.hoge tr {
  background-color: #fff;
  //border: 1px solid #bbb;
  //padding: .35em;
}
table.hoge th,
table.hoge td {
  //padding: 1em 10px 1em 1em;
  //border-right: 1px solid #bbb;
}
table.hoge th {
  //font-size: .85em;
}
table.hoge thead tr{
  //background-color: #eee;
}
.txt{
   text-align: left;
   //font-size: .85em;
}
.time{
   text-align: right;
}


/*-- PC版表示CSS  --*/
@media (min-width: 1200px) {/* 1200px以上*/
    h1 {
        font-size: 3.6rem;/* 36px*/
    }
    h2 {
        font-size: 2.4rem;/* 24px*/
    }
}

/*-- スマホ版表示CSS  --*/
@media screen and (max-width: 599px) { 
  body{
    line-height: 1.8em;
    font-size 16pt
  }
  img {
    max-width: 100%; # iPhoneのgoogle chromeだと効かない？
    height: auto;
  }
  h1{
    font-size: 2.4rem;/* 24px*/
  }
  h2 {
    font-size: 2rem;/* 20px*/
  }

  table {
    margin-left: auto;
    margin-right: auto;
    border: solid 1px black;
    border-collapse:collapse;
  }
  table tr,th,td {
    font-size: 1.5rem;/* 1.6remだと16px*/
    border: 1px solid black;
    padding: 3px 6px;
  }
  table th,td {
    font-size: 1.5rem;/* 1.6remだと16px*/
    padding: 6px 8px;
  }
  table.spfull {
    width: 100%;
  }
  table.wide {
    width: 640px;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
  }

  table.tight {
    margin-left: 0;
    margin-right: auto;
    /* font-size: 80%; 効いてないように見える */
    line-height: 90%;
  }
  table.tight th,td {
    font-size: 1.4rem;/* 1.6remだと16px？ */
    padding: 3px 2px;
  }
  table.littletight {
    margin-left: 0;
    margin-right: auto;
    /* font-size: 90%; 効いてないように見える */
    line-height: 98%;
    padding: 6px 4px;
  }

  table.hoge {
    border: 0;
    width:100%
  }
  table.hoge th{
    background-color: #eee;
    display: block;
    border-right: none;
  }
  table.hoge thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  
  table.hoge tr {
    display: block;
    margin-bottom: .625em;
  }
  
  table.hoge td {
    border-bottom: 1px solid #bbb;
    display: block;
    font-size: .8em;
    text-align: right;
    position: relative;
    padding: .625em .625em .625em 4em;
    border-right: none;
  }
  
  table.hoge td::before {
    content: attr(data-label);
    font-weight: bold;
    position: absolute;
    left: 10px;
  }
  
  table.hoge td:last-child {
    border-bottom: 0;
  }
}