@charset "UTF-8";
/* CSS Document */

html,body{
margin:0;
padding:0;
height:100%;
}

*{

font-size:14px;
line-height:1.5;

}

.wrap{
width:85%;
margin:4em auto;
}

a{
text-decoration:none;
display:block;
margin:2em auto 0;
}

h1{
  position: relative;
  padding: 1em 1em 1em 2em;
  border: 1px solid #ccc;
　margin-bottom:2em;
}

h1::after {
  position: absolute;
  top: .5em;
  left: .5em;
  content: '';
  width: 6px;
  height: -webkit-calc(100% - 1em);
  height: calc(100% - 1em);
  background-color: #3498db;
  border-radius: 4px;
}

table, th, td {
  border-collapse: collapse;
  border: 1px solid #ccc;
  line-height: 1.5;
}

table th {
  width: 300px;
  padding: 10px;
  font-weight: bold;
  vertical-align: top;
}
table td {
  width: 350px;
  padding: 10px;
  vertical-align: top;
 }

button{
padding:1em 2em;
display:block;
margin:0 auto;
width:300px;
cursor:pointer;
background:#0073aa;
color:#fff;
}

.center{
text-align:center;
}


button:hover{
opacity:0.8;
}

.f-box{
padding:2em;
background:#eaeaea;
}

footer{
padding:1em;
text-align:center;
background:#000;
color:#fff;
}


.fst-page .wrap{
margin:0;
width:100%;
padding:4em 0;
}

.fst-page button{
width:200px;
}

.fst-page .footer{
margin-top: auto;
width:100%;
}


@media (max-width: 768px){
.fst-page .wrap{
padding:3em 0;
}
.fst-page .footer{
position:relative;
bottom:0;
width:100%;
}

.fst-page .wrap{
padding-bottom:4em;
}

}

body{
 display: flex;
  flex-direction: column;
  min-height: 100vh;
}