/* ================================
   Responsive Styles for ふつう研究サイト
   ================================ */

/* --------------------------------
   768px 以下（タブレット・スマホ横）
   -------------------------------- */
@media (max-width: 768px) {

  /* --- ヘッダー --- */
  header {
    padding: 1.5rem 1.5rem;
  }

  .site-title {
    font-size: 1.4rem;
  }

  /* --- 左側メニューを上部に戻す --- */
  .layout {
    display: block;
  }

  nav.accordion {
    width: 100%;
    min-height: auto;
    position: static;
    border-right: none;
    padding: 1rem 1.5rem;
  }

  nav.accordion summary {
    padding: 1rem 0;
    font-size: 1.1rem;
  }

  nav.accordion .panel {
    padding-left: 1rem;
  }

  /* --- 本文 --- */
  main {
    padding: 2rem 5%;
  }

  .page-title {
    font-size: 1.7rem;
  }

  h2 {
    font-size: 1.4rem;
  }

  /* --- 画像・動画 --- */
  img,
  video {
    margin: 1rem 0;
    max-width: 100%;
    height: auto;
  }

  /* --- 業績リスト --- */
  .publication-list li {
    font-size: 0.95rem;
    line-height: 1.7;
  }

  /* --- 上へ戻るボタン --- */
  .back-to-top-fixed {
    bottom: 12px;
    right: 12px;
    padding: 0.4rem 0.6rem;
    font-size: 0.8rem;
  }
}

/* --------------------------------
   480px 以下（スマホ縦）
   -------------------------------- */
@media (max-width: 480px) {

  main {
    padding: 1.5rem 3%;
  }

  .page-title {
    font-size: 1.5rem;
  }

  h2 {
    font-size: 1.25rem;
  }

  nav.accordion summary {
    padding: 1.1rem 0;
  }

  .publication-list li {
    font-size: 0.9rem;
    line-height: 1.65;
  }

  .back-to-top-fixed {
    bottom: 10px;
    right: 10px;
  }
}