@charset "utf-8";
/* トップページ（index.php）の本文．元のトップページと同じく，背景の空の写真の上に直接文字を載せる */

/* mycss.css の .img は width: 100% で，body の margin（5%）と合わせて画面幅を超え，
   スマホで右端が切れる．幅は自動にする（背景の写真は画面全体に広がったまま） */
body.img {
  width: auto;
}

main.top {
  max-width: 960px;
  margin: 2rem auto 0;
}

.top-panel {
  margin-bottom: 2.5rem;
  text-align: left;
  color: #2b2322;
}

.top-panel h2 {
  font-size: 1.25rem;
  font-weight: bold;
  color: #0481A2;
  letter-spacing: 3px;
  margin: 0 0 0.75rem;
  padding-bottom: 0.25rem;
  border-bottom: 1px solid #0481A2;
}

.top-panel a {
  color: #2b2322;
}

.top-panel .more {
  text-align: right;
  margin: 0.5rem 0 0;
}

/* 今年度のお知らせと論文は，一定の高さを超えたら枠の中でスクロールする */
.top-scroll {
  max-height: 18rem;
  overflow-y: auto;
  border-bottom: 1px solid rgba(43, 35, 34, 0.3);
}

/* お知らせ */
ul.top-news {
  list-style: none;
  margin: 0;
  padding: 0;
}

ul.top-news li {
  display: flex;
  gap: 1em;
  padding: 0.4rem 0;
  border-bottom: 1px dotted #ccc;
}

ul.top-news .up_ymd {
  flex: none;
  white-space: nowrap;
}

ul.top-news .newMark {
  flex: none;
  color: #c00;
  font-size: 0.8em;
}

/* 研究テーマ */
dl.top-themes {
  margin: 0;
}

dl.top-themes dt {
  font-weight: bold;
  margin-top: 0.75rem;
}

dl.top-themes dd {
  margin: 0.25rem 0 0 1.5em;
}

/* 最近の論文 */
ol.top-papers {
  margin: 0;
  padding-left: 1.5em;
}

ol.top-papers li {
  margin-bottom: 0.75rem;
}

@media (max-width: 750px) {
  /* 題字が右上の MENU ボタンに重ならないようにする */
  header h1 {
    padding-right: 56px;
  }

  main.top {
    margin-top: 1rem;
  }

  /* 日付とタイトルを2行に分ける */
  ul.top-news li {
    flex-wrap: wrap;
    gap: 0 1em;
  }

  ul.top-news .title {
    flex-basis: 100%;
  }
}
