@charset "utf-8";
body{
       background-image: url(100img/index.jpg);
       background-repeat: no-repeat;
       background-position: center center;
       background-attachment: fixed;
       background-size: cover;
       line-height: 2;
       font-size: 3vh;
       font-family: serif;
       height:100%;
       width:100%;
       text-align: center;
}
a{
       text-decoration: none;
       margin-right: 20px;
       color: #ffffff;
}

a:hover{
       text-decoration: underline;
}

body h1{
       padding:5vh 0;
       font-size: 10vh;
       line-height:0.1;
       color: #ffffff;
       margin-bottom: 5vh;
}

header{
       max-width: 100%;
       height: 100px;
       margin: 0 auto;
       text-align: center;
       font-size: 2vh;
}

#wrap{
       clear: both;
}

.content{
       max-width: 100%;
       margin:0 auto;
       margin-top: 5vh;
}

p{
       color: #ffffff;
}

#exp-all p{
       font-size: 2vh;
}
#exp p{
       text-align: left;
       width: 80vw;
       margin-left: 10vw;
}
#expr p{
       text-align: right;
       margin-right:10vw;
}
#ebutton_o p:hover{
       text-decoration: underline;
}
#ebutton_c p:hover{
       text-decoration: underline;
}

.btn{
       text-align: center;
}

.btn a{
       color:#ffffff;
       font-size: 3vh;
       font-family: 'Bitter',serif;
       width: 22vw;
       display: inline-block;
       text-align: center;
       line-height: 50px;
       margin-top: 20px;
       border-radius: 5px;
       margin-right: 50px;
}

#past{
       background-color: #38b38b;
       border: 3px solid #38b38b;
}
#past:hover{
       text-decoration: none;
       background-color: #ffffff;
       color: #38b38b;
}

#now{
       background-color: #e6b422;
       border: 3px solid #e6b422;
}
#now:hover{
       text-decoration: none;
       background-color: #ffffff;
       color: #e6b422;
}

#future{
       background-color: #f0908d;
       border: 3px solid #f0908d;
}
#future:hover{
       text-decoration: none;
       background-color: #ffffff;
       color: #f0908d;
}
.br_hidden{
       display: none;
}
@media screen and (max-width: 912px){
  .br_hidden{
    display: block;
  }
  .btn a{
    width: 90vw;
    margin-right: 5vw;
    margin-left: 5vw;
  }
  body h1{
       width:100%;
       color: #ffffff;
       margin-bottom: 5vh;
       font-size:8vw;
}
}