@media screen and (max-width: 900px) {
  /* ハンバーガー */
  /* 四角の部分 */
  .openbtn {
    position: fixed; /* 設置する位置を固定します */
    top: 16px; /* 上から10pxの位置 */
    right: 16px; /* 右から10pxの位置 */
    z-index: 9999; /* 一番手前に表示 */
    cursor: pointer; /* カーソルが上に来たらポインターに変身 */
    width: 50px; /* 横幅５０px */
    height: 50px; /* 縦幅５０px */
    background-color: #42bdd8; /* 四角の色 */
  }
  /* ３本線 */
  .openbtn span {
    display: inline-block;
    transition: all 0.4s; /* 変化速度 */
    position: absolute; /* 四角い箱に対して線の位置を調整するためのおまじない */
    left: 14px; /* 四角の箱の左から１４pxの位置 */
    width: 45%; /* 線の幅 */
    height: 3px; /* 線の太さ */
    border-radius: 2px; /* 線の角を少し丸く */
    background-color: #fff; /* 線の色 */
  }
  .openbtn span:nth-of-type(1) {
    top: 15px; /* １本目の線の四角い箱の上からの位置 */
  }
  .openbtn span:nth-of-type(2) {
    top: 23px; /* ２本目の線の四角い箱の上からの位置 */
  }
  .openbtn span:nth-of-type(3) {
    top: 31px; /* ３本目の線の四角い箱の上からの位置 */
  }
  /* ×に変化 */
  .openbtn.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg); /* １本目の線の角度と上からの位置の変更 */
    width: 30%;
  }
  .openbtn.active span:nth-of-type(2) {
    opacity: 0; /* ２本目の線を見えなくする */
  }
  .openbtn.active span:nth-of-type(3) {
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg); /* １本目の線の角度と上からの位置の変更 */
    width: 30%;
  }

  body {
    padding: 1rem;
  }
  #fst_view {
    width: 100%;
  }
  section#slider {
    margin-bottom: unset;
  }
  main {
    padding: 0;
  }
  #side {
    /* display: none; を削除し、以下のスタイルに変更 */
    position: fixed;
    top: 0;
    right: -100%; /* 初期状態では画面の右外に隠す */
    width: 80%;
    max-width: 300px;
    height: 100vh; /* 画面の高さいっぱいにする */
    background-color: #fff;
    z-index: 9998; /* ボタンよりは背面に */
    transition: all 0.5s; /* スライドアニメーション */
    overflow-y: auto; /* メニュー項目が多い場合にスクロールさせる */
  }
  #side.active {
    right: 0; /* activeクラスが付いたら画面内に表示 */
  }
  /* コンテンツ */
  #content {
    width: 100%;
    margin-left: unset;
    padding: 24px;
  }
  .item {
    margin: 1rem;
  }

  /* 開催概要 */
  .table .th,
  .table._2 .th {
    margin-bottom: 0.5rem;
  }

  .table .td,
  .table._2 .td {
    margin-left: 1rem;
  }
  .table .tr {
    display: block;
  }
  .table .td {
    max-width: 100%;
  }

  /* ニュース */
  #news ul li {
    display: flex;
    flex-direction: column;
  }
  #news ul a {
    margin-left: 0;
    margin-top: 0.5rem;
  }
  #news ul {
    height: 220px;
  }

  /* 協賛企業 */
  #k_bosyu table tr {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
  }

  /* フッターメニュー */
  #f_link ul {
    display: block;
    padding: 0.5rem;
  }
  #f_link ul li {
    display: block;
    margin: 0.5rem 0;
    border-right: unset;
  }
}
