/* 旧 kes_top に近い素朴な見た目。手編集しやすいよう装飾は最小限。 */

body {
  /* 画面幅の 8 割を使い、中央に置く（56em で頭打ちにすると広い画面で余白ばかりになる） */
  width: 80%;
  margin: 1em auto 3em;
  font-family: "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 15px;
  line-height: 1.7;
  color: #111;
  background: #fff;
}

h1 {
  font-size: 1.6em;
  font-weight: bold;
  margin: 0 0 0.2em;
}

h2 {
  font-size: 1.15em;
  font-weight: bold;
  margin: 0 0 1em;
  color: #333;
}

h3 {
  font-size: 1.05em;
  font-weight: bold;
  margin: 1.4em 0 0.4em;
  border-bottom: 1px solid #999;
  padding-bottom: 0.15em;
}

p { margin: 0.6em 0; }
ul, ol { margin: 0.4em 0 0.8em 1.4em; padding: 0; }
li { margin: 0.2em 0; }

a { color: #003399; }
a:visited { color: #551a8b; }

hr {
  border: none;
  border-top: 1px solid #999;
  margin: 1.4em 0;
}

code {
  font-family: Consolas, "Courier New", monospace;
  font-size: 0.9em;
  word-break: break-all;
}

.note {
  border: 1px solid #c00;
  background: #fff8f8;
  padding: 0.5em 0.7em;
}

.event-notice {
  display: block;
  color: #c00;
  font-weight: bold;
  white-space: normal;
  max-width: 14em;
  margin-top: 0.15em;
  line-height: 1.35;
}
.event-cancelled {
  display: block;
  color: #666;
  font-weight: bold;
  margin-top: 0.15em;
}
table.history tr.is-cancelled .col-body {
  color: #666;
  text-decoration: line-through;
}

.nav, .toc { font-size: 0.95em; }
.nav a.here, .toc a.here { font-weight: bold; text-decoration: none; color: #111; }
.mute { color: #666; }
.foot { font-size: 0.85em; color: #555; }

/* 履歴表：Word/手書き HTML でも直しやすい単純テーブル */
table.history {
  width: 100%;
  border-collapse: collapse;
  margin: 0.4em 0 1em;
  font-size: 0.95em;
}

table.history th,
table.history td {
  border: 1px solid #999;
  padding: 0.35em 0.55em;
  vertical-align: top;
  text-align: left;
}

table.history th {
  background: #f0f0f0;
  font-weight: bold;
}

table.history .col-session { width: 7.5em; vertical-align: top; }
table.history .col-session .session-no { white-space: nowrap; }
table.history .col-date { width: 11em; white-space: nowrap; }

.talk + .talk { margin-top: 0.55em; padding-top: 0.45em; border-top: 1px dotted #bbb; }
.speaker { font-weight: bold; }
.affil { color: #444; }
.title { }
.docs { margin-top: 0.3em; font-size: 0.9em; }

/* 長い英単語や Zoom URL が桁を押し広げないように。入りきる限りは改行しない */
table.history .col-body,
a { overflow-wrap: break-word; }

/* 画面が狭いとき。表の形は変えず、桁を固定している指定だけ解く。
   これが無いと col-date の nowrap（約 158px）と col-session の 7.5em で
   本文の桁が潰れ、最小幅 460px 相当となって端末幅に追従しない。 */
@media (max-width: 40em) {
  /* 狭い画面では 8 割だと逆に細いので、余白を詰めてほぼ全幅を使う */
  body { width: auto; margin: 0.8em 0.9em 2.5em; }
}

@media (max-width: 30em) {
  table.history { font-size: 0.9em; }
  table.history th,
  table.history td { padding: 0.3em 0.35em; }
  table.history .col-session { width: 4.2em; }
  table.history .col-date { width: 6.5em; white-space: normal; }
  .event-notice { max-width: none; }
}
