body {
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  line-height: 1.8;
  color: #444;      
  margin: 0;
  padding: 0;
  background-color: #ededed;
}

.container {
  max-width: 960px;
  width: 100%;
  margin: 0 auto;
  padding: 0;        
  box-sizing: border-box;
  background-color: #fff;
  box-shadow: 0 5px 25px rgba(0,0,0,0.1); 
}

header {
  background: #3e3e3e;
  color: #fff;
  padding: 30px 0;   
  text-align: center;
}

header h1, main h1 {
  font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS Mincho E", serif;
  font-weight: normal; 
  letter-spacing: 0.1em;
}

nav ul {
  list-style: none;
  padding: 0;
  margin: 20px 0 0 0;
}

nav ul li {
  display: inline;
  margin: 0 20px; 
}

nav ul li a { 
  color: #ddd; 
  text-decoration: none;
  font-size: 0.95rem; 
  transition: color 0.3s;
}

nav ul li a:hover {
  color: #fff; 
}

main {
  padding: 60px 40px;
}

section {
  margin-bottom: 40px;
}

footer {
  text-align: center;
  padding: 20px 0;
  background: #3e3e3e;
  color: #aaa;       
  font-size: 0.8rem;
}

.video-wrap {
  width: 100%;           
  max-width: 800px;     
  margin: 0 auto;      
  aspect-ratio: 16 / 9; 
}

.video-wrap iframe {
  width: 100%;         
  height: 100%;       
}

/* プログラムリスト（次回演奏会用） */
.program-list {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
  table-layout: fixed;
}

.program-list th,
.program-list td {
  padding: 20px 10px;       /* 上下に広めの余白 */
  border-bottom: 1px dotted #ccc; /* 実線ではなく「点線」にして柔らかさを出す */
  vertical-align: top;      /* 文字を上揃えにする */
}

/* 作曲家名（左側） */
.program-list th {
  width: 30%;               /* 幅を全体の3割に */
  text-align: right;        /* 右寄せにして、曲名との距離を縮める */
  font-weight: normal;      /* 太字にしない */
  color: #666;              /* 少し薄い色 */
  font-family: serif;       /* 明朝体にして雰囲気アップ */
  padding-right: 20px;      /* 曲名との間に隙間を作る */
  box-sizing: border-box;
}

/* 曲名（右側） */
.program-list td {
  width: 70%;
  font-weight: bold;        /* 曲名は太く強調 */
  font-size: 1.1rem;        /* 文字を少し大きく */
  color: #333;
  box-sizing: border-box;
}

/* 曲名の下の楽章など（補足情報） */
.program-list .movement {
  display: block;           /* 改行させる */
  font-size: 0.85rem;       /* 文字を小さく */
  font-weight: normal;      /* 太字解除 */
  color: #888;
  margin-top: 5px;
}

/* ★スマホ対応：画面が狭い時は縦並びにする */
@media screen and (max-width: 600px) {
  .program-list th, 
  .program-list td {
    display: block;         /* マス目の性質を解除して積み木にする */
    width: 100%;            /* 幅いっぱい */
    text-align: left;       /* 左寄せに戻す */
    padding: 5px 0;         /* 余白を詰める */
    border: none;           /* 線を消す（または調整） */
  }
  
  .program-list th {
    padding-top: 20px;      /* 作曲家の上に余白 */
    width: 100%;
    font-size: 0.9rem;
  }
  
  .program-list td {
    padding-bottom: 20px;   /* 曲の下に余白 */
    border-bottom: 1px solid #eee; /* 曲の区切り線 */
    width: 100%;
  }
}

/* style.cssの一番下に追加 */

.last-updated {
  font-size: 0.7rem; /* 著作権表示より少し小さくする */
  opacity: 0.8;      /* 少しだけ色を薄くして控えめにする */
  margin-top: 5px;   /* 上の行との隙間を少し空ける */
}

/* ニュース欄のスタイル */
.news-list {
  list-style: none;     /* 点を消す */
  padding: 0;
  margin: 0;
  border-top: 1px solid #ddd; /* 一番上の線 */
}

.news-list li {
  border-bottom: 1px solid #ddd; /* 下線 */
  padding: 15px 0;      /* 上下の余白 */
  display: flex;        /* 横並びにする */
  align-items: baseline; /* ベースラインを揃える */
}

.news-list .date {
  width: 120px;         /* 日付の幅を固定 */
  font-weight: bold;
  color: #666;
  flex-shrink: 0;       /* 日付が潰れないようにする */
}

.news-list .text {
  flex-grow: 1;         /* 余った幅をテキストが使う */
  line-height: 1.6;
}

/* スマホ対応：画面が狭い時は縦並びにする */
@media screen and (max-width: 600px) {
  .news-list li {
    display: block;     /* 積み木のように縦に積む */
  }
  .news-list .date {
    display: block;
    margin-bottom: 5px; /* 日付の下に少し隙間 */
  }
}
/* スクロールボックスの設定 */
.scroll-box {
  height: 200px;        /* 枠の高さを固定 */
  overflow-y: scroll;   /* 縦方向にスクロールバーを出す */
  border: 1px solid #ddd; /* 枠線をつける */
  padding: 0 15px;      /* 枠内の左右に余白 */
  background-color: #fff;
}

/* スクロールの中では一番上の線は不要なので消す */
.scroll-box .news-list {
  border-top: none;
}