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


#HERO {
position: relative;
height: 100vh;
background-image: url("../img/hero/hondo.jpg");
background-size: cover;
background-position: center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: white;
text-align: center;

/*filter: saturate(30%);*/
/*filter: grayscale(.5);*/

}

#HERO .hero-content {
display: flex;
flex-direction: column;
justify-content: space-around;
text-align: center;
max-width: 800px;
height: 100%;
padding: 0 20px;
}

#HERO h1 {
margin-bottom: 20px;
filter: drop-shadow(1px 1px 3px #000);
}
#HERO a {
display: inline-block;
text-decoration: none;
color: white;
transition: all 0.3s ease;

}
#HERO a:hover {
color: var(--light-gray);
transform: scale(1.1);
}
#HERO .hero-content .red{
font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
color: red;
font-weight: 700;
padding-left: 12px;
}
#HERO .hero-top-info{
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
}
#HERO p {
display: inline;
filter: drop-shadow(2px 2px 4px #000);
padding: 6px 16px 9px;
background-color: rgba(0,0,0,.4);
margin-bottom: 16px;
}
#HERO table {
filter: drop-shadow(2px 2px 4px #000);
padding: 6px 16px 9px;
background-color: rgba(0,0,0,.4);
margin-bottom: 16px;
}
#HERO table td{
padding: 4px;
}
#HERO .hero-news{
display: flex;
flex-direction: column;
gap:16px;
}
/*HEROテキストアニメーション*/
.text-animation {
    display: inline-block;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.5s forwards;
  }
  
  @keyframes fadeInUp {
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  .text-container {
    position: relative;
    overflow: hidden;
  }