body{
  margin: 0; /* 余白をリセット */
  padding: 0;
  box-sizing: border-box; /* ボックスサイズを安定させる */
  font-family: Arial, sans-serif; /* 任意のフォント */
  background-color:  #2b3e2f; /* 背景色（任意） */
}
td p{
  color: #2b3e2f;
}
h2 {
  margin-top: 100px;
            color: #6b8e23;
            text-align: center;
            font-size: 2rem;
            margin-bottom: 50px;
        }

        table {
            width: 100%;
            border-collapse: collapse;
            overflow: hidden;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        }

        th, td {
            padding: 15px;
            text-align: left;
            font-size: 1.1rem;
        }

        th {
            background-color: #a1c349;
            color: #fff;
            font-weight: bold;
        }

        tr {
            background-color: #ffffff;
            cursor: pointer;
            transition: background-color 0.3s;
        }

        tr:hover {
            background-color: #f1f1f1;
        }

        .hidden-content {
            display: none;
            padding-top: 10px;
            padding-bottom: 10px;
            background-color: #f1f1f1;
            border-top: 1px solid #ddd;
            border-bottom: 1px solid #ddd;
            font-size: 1rem;
            color: #555;
        }

        td {
            background-color: #f9f9f9;
            border: 1px solid #e3e3e3;
            color: #2b3e2f;
        }

        td:nth-child(1) {
            background-color: #eaf3d1;
        }

        td:nth-child(2) {
            background-color: #eaf3d1;
        }

        /* アイコンのスタイル */
        .toggle-icon {
            font-size: 1.5rem;
            color: #6b8e23;
            margin-left: 10px;
            transition: transform 0.3s ease;
        }

        .expanded .toggle-icon {
            transform: rotate(180deg); /* 矢印を180度回転 */
        }

        .hidden-content .toggle-icon {
            display: none;
        }
        /* 動画コンテナの設定 */
      .video-container {
          width: 100%;
          max-width: 960px; /* 最大幅960px（PC向け） */
          margin: 0 auto; /* 中央揃え */
          background-color: #000; /* 動画が読み込まれる前に黒背景を表示 */
      }

      /* 動画自体の設定 */
      video {
          width: 100%; /* 横幅100%に設定 */
          height: auto; /* 高さは自動で調整 */
          display: block; /* 下部に余白ができないように */
        }

        /* レスポンシブ対応：スマホ向けの設定 */
        @media (max-width: 768px) {
            .video-container {
                max-width: 100%; /* スマホでは最大幅100%に設定 */
            }
        }