*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.header-name {
  margin: 0;
}


/* ヘッダエリア設定 */
.top {
  position: relative; 
  height: 40vh;
  min-height: 250px;
  max-height: 500px;     
  overflow: hidden; 
}

/* バナー設定 */
.banner-img {
  width: 100%;
  height: 100%;
  object-fit: cover;  
}

/* ヘッダ文字 */
.header-inner {
  position: absolute;
  top: 40%;           
  left: 50%;          
  transform: translate(-50%, -50%); 
  color: #ffffff;    
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); 
  text-align: center; 
}

.header-name {
  font-size: clamp(2rem, 8vw, 5rem);
  margin: 0;
}

.stage {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Meiryo", sans-serif;
  line-height: 1.7;
  max-width: 1000px; 
  margin: 0 auto;
  padding: 0 16px;
}
.stage p {
  padding-top: 1px;
  font-size: 20px;
  margin: 0 0 1.5em;
  word-break: break-word;
  color: #333;
}

.headline {  
  /* 文字サイズ */
  font-family: sans-serif;
  font-size: clamp(2rem, 3vw, 4rem); 
  text-align: left;
  padding-top: 5px;
  filter: saturate(140%);
}

.container {
  display: grid;[cite: 2]
 
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 16px;[cite: 2]
  margin-top: 16px;[cite: 2]
  align-items: start; 
}

.card {
  background-color: #f9f9f9;[cite: 2]
  border: 1px solid #ddd;[cite: 2]
  border-radius: 8px;[cite: 2]
  padding: 10px;[cite: 2]
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);[cite: 2]
  width: 100%; 
}.card > *:last-child {
  margin-bottom: 0;
}

/* フッター */
footer {
  text-align: center;
  padding: 20px;
  font-size: 0.85rem;
  color: #666;
}