@charset "UTF-8";

html{
  font-size:100%;
}
body{
    font-family:"HG明朝E","HG明朝B",sans-serif;
  line-height:1.7;
    color: #000000;
}
a{
  text-decoration: none;
}
img{
  max-width:20%;
}
.logo2{
  width:210px;
  margin-top:14px;
}
.home-content{
    text-align:center;
    margin-top:5%;
}
.home-content p{
  font-size:1.125rem;
  margin:10px 0 42px;
}
.page-title{
  font-size:5rem;
  font-family:'Philosopher',serif;
  text-transform:uppercase;
  font-weight:normal;
}
.button{
  font-size:1.375rem;
  background:#f8eb65;
  color:#1e2944;
  border-radius:5px;
  padding:18px 32px;
  margin-left: -46%;
}
.button:hover{
  animation-name:box-size;
  animation-duration:2s;
}
@keyframes box-size{
  0%{
    background: #f8eb65;
    color:#1e2944;
  }
  100%{
    background: #1e2944;
    color: #f8eb65;
  }
}
.sindan-content{
    text-align:center;
    margin-top:2%;
}
.sindan-button{
  font-size:1.375rem;
  background:#f8eb65;
  color:#1e2944;
  border-radius:5px;
  padding:18px 32px;
}
.sindan-button:hover{
  animation-name:box-size;
  animation-duration:2s;
}
.result-page-title{
  font-size:4rem;
  font-family:'Philosopher',serif;
  text-transform:uppercase;
  font-weight:normal;
  text-align:center;
}
.result-midasi{
  text-align:center;
}
.item{
  background: #fff;
  color:#000000;
  margin:10px;
  padding:10px;
  border-radius: 30px;
}
.container{
  display:flex;
  justify-content:space-around;

}

.yado-where{
  line-height:5px;
}
.yado-setu{
  line-height:5px;
}
.result-button{
  font-size:1.375rem;
  background:#f8eb65;
  color:#1e2944;
  border-radius:5px;
  padding:18px 32px;
}
.result-button:hover{
  animation-name:box-size;
  animation-duration:2s;
}
@keyframes box-size{
  0%{
    background: #f8eb65;
    color:#1e2944;
  }
  100%{
    background: #1e2944;
    color: #f8eb65;
  }
}
.result-content{
    text-align:center;
}
.big-bg{
  background-size: cover;
  background-position: center top;
}
#home{
  background-image: url(../images/home_back.jpg);

  min-height: 100vh;
}
#home
.page-title{
  text-transform: none;
}
.home-page-title{
  font-size:5rem;
  font-family:'Philosopher',serif;
  text-transform:uppercase;
  font-weight:normal;
  color: #f8eb65
}
#sindan{
  background-image: url(../images/sindan_back3.jpg);
}
#sindan .page-title{
  color:#e2ce8e;
  text-align:center;
  font-size:5rem;
  font-family:'Philosopher',serif;
  text-transform:uppercase;
  font-weight:normal;
  margin-top: 0%;
}
.result-midasi{
  font-size:25px;
  color:#4a387c
}
.sindan-content wrapper{
  background-image: url(../images/sindan_back2.png);
  margin-top:40%;
}
@media (max-width:60px){
  .main-nav{
    font-size: 1rem;
    margin-top: 10px;
  }
  .main-nav li{
    margin: 0 20px;
  }
  .home-content{
    margin-top: 20%;
  }
}
footer{
  background: #1e2944;
  text-align: center;
  padding: 12px 0;
  margin-top: 180px;
}
footer p{
  color: #e2ce8e;
  font-size: 0.875rem;
}
.home-page-title{
  font-family: 'Antic Didone', serif;
  margin-right: 45%;
}
.home-subtitle{
  color: #e2ce8e;
  margin-left: -46%;
}
.home-logo{
  margin-top: 8%;
  margin-bottom: -8%;
  margin-left: 17%;
}
@media(max-width:700px){
  .home-page-title{
    font-size:5rem;
    margin-top: 2%;
    margin-left: 18%  ;
    text-align:center;
  }
  .home-subtitle{
    margin-left: 1%  ;
    text-align:center;
    font-size: 20px;
  }
  .button{
    margin-left: 1%;
  }
  .home-logo{
    margin:auto;
  }

  .page-title{
    font-size: 45px;
    margin-left: 0%  ;
    text-align:center;
  }
  .result-page-title{
    font-size: 2.5rem;
  }
  .container{
    display:grid;
    margin: auto;
    justify-content:space-around;
  }
}
#result{
  background-color: #4db1ec;
  background-repeat: no-repeat;
  background-position: center;
  background-size:cover;
  background-blend-mode: screen;
  animation: bg-color 24s infinite;
  height: 100%;
}
@keyframes bg-color {
  0%{background-color: #b7aed6;}
  25%{background-color: #aeb5dc;}
  50%{background-color: #dbedf0;}
  75%{background-color: #fcc9ac;}
  100%{background-color: #b7aed6;}
}
