/* 下層ページの文字・表・スケジュール。写真仕様は各施設のphoto-layout.cssに置く。 */
.doho-readable {
  --readable-font: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", sans-serif;
  --readable-accent: #94cfd1;
  --readable-band: #edf8f8;
  --readable-activity-band: #e5f5fc;
  --readable-age-band: #e5f5fc;
  font-synthesis: none;
}
.doho-readable[data-readability-theme="pink"] {
  --readable-accent: #f5b1ad;
  --readable-band: #fff0ef;
  --readable-activity-band: #fce5e3;
  --readable-age-band: #ffd0d0;
}
.doho-readable body {
  font-family: var(--readable-font);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;
}
.doho-readable #global-nav1 a,
.doho-readable .menu_text,
.doho-readable .logo_text,
.doho-readable button,
.doho-readable input,
.doho-readable select {
  font-family: var(--readable-font);
}
.doho-readable .mainBody {
  word-break: normal;
  line-break: strict;
  text-wrap: wrap;
}
/* Safariでも重要な語句を分断しない。長い文全体には付けない。 */
.doho-readable .readable-phrase {
  white-space: nowrap;
  color: inherit;
}
.doho-readable .mainBody :is(p, li, .col1, .col2, .box, .ver1, .ver2) {
  font-size: 16px;
  line-height: 1.8;
}
.doho-readable .main_title2 h1 {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.5;
}
.doho-readable .mainBody .page_h1 {
  padding: 16px 24px;
  margin-top: 48px;
  margin-bottom: 24px;
  background: var(--readable-band);
  border: 0;
  border-radius: 12px;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
  color: #5f5f5f;
}
.doho-readable .page_h1::before,
.doho-readable .page_h1::after {
  content: none;
  border: 0;
}
.doho-readable .mainBody :is(h3, h4) {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.6;
}
.doho-readable .mainBody :is(td, th) {
  font-size: 15px;
  line-height: 1.8;
  vertical-align: top;
}
.doho-readable .mainBody th { font-weight: 700; vertical-align: middle; }
.doho-readable .mainBody td :is(p, li) { font-size: inherit; }
.doho-readable .readable-fees { table-layout: fixed; }
.doho-readable .readable-fees col:first-child { width: 14%; }
.doho-readable .readable-fees col:last-child { width: 27%; }
.doho-readable .readable-fees :is(td, th) { padding: 12px 10px; }
.doho-readable .readable-fees th { width: auto; }
.doho-readable .readable-fees td { text-align: left; }
.doho-readable .readable-fees :is(.readable-category, .readable-amount) {
  white-space: nowrap;
  vertical-align: middle;
}
.doho-readable .readable-category { text-align: center; }
.doho-readable .readable-amount { font-variant-numeric: tabular-nums; }
.doho-readable .readable-overview,
.doho-readable .readable-history { table-layout: fixed; }
.doho-readable .readable-overview th { width: 24%; white-space: nowrap; }
.doho-readable .readable-overview th.readable-label-wrap { white-space: normal; }
.doho-readable .readable-history th { width: 30%; }
.doho-readable .readable-overview td { overflow-wrap: anywhere; }
.doho-readable .readable-links th { width: 34%; }
.doho-readable .readable-links :is(th, td) { text-align: left; }
/* 2列の概要・沿革・リンク表は短い本文も行内の中央へ。長文は行の高さを決める。 */
.doho-readable .mainBody :is(.readable-overview, .readable-history, .readable-links) td {
  vertical-align: middle;
}
.doho-readable .mainBody .timeBar p {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.8;
  font-variant-numeric: tabular-nums;
}
.doho-readable .schedule-activities { flex: 1; min-width: 0; }
.doho-readable .schedule-activity + .schedule-activity { margin-top: 24px; }
.doho-readable .schedule-activity h3 {
  display: block;
  margin: 0 0 8px;
  padding: 8px 12px;
  border: 0;
  background: var(--readable-activity-band);
  color: #5f5f5f;
}
.doho-readable .schedule-slot .schedule-activity h3 {
  background: var(--readable-age-band);
  text-align: center;
}
.doho-readable .schedule-activity ul {
  list-style: disc outside;
  padding-left: 1.4em;
  margin: 0;
}
.doho-readable .schedule-activity li + li { margin-top: 6px; }
.doho-readable .mainBody .schedule-note {
  display: block;
  font-size: 14px;
  line-height: 1.8;
}
.doho-readable .schedule-activity .schedule-description { margin: 0 0 12px; }
.doho-readable .schedule-activity .schedule-description:last-child { margin-bottom: 0; }
.doho-readable .schedule-activity li .schedule-note { margin-top: 2px; }
.doho-readable .readable-ordered {
  list-style: decimal outside;
  padding-left: 1.6em;
  margin-top: 24px;
}
.doho-readable .readable-ordered li + li { margin-top: 20px; }
.doho-readable .mainBody .en_content p,
.doho-readable .mainBody figcaption {
  font-size: 14px;
  line-height: 1.8;
}
.doho-readable .readable-jumps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: 80%;
  margin: 28px auto;
}
.doho-readable .readable-jumps a {
  padding: 8px 16px;
  color: inherit;
  background: var(--readable-band);
  border: 1px solid var(--readable-accent);
  border-radius: 8px;
  font-weight: 700;
  text-underline-offset: .2em;
}
.doho-readable .readable-season { scroll-margin-top: 160px; }
.doho-readable .readable-season .month_box1 { display: block; }
/* 表の固定列幅による折返しで写真が下段へ落ちないよう、PCの左右配置を保つ。 */
@media (min-width: 768px) {
  .doho-readable .month.readable-season {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    column-gap: 24px;
  }
  .doho-readable .month.readable-season > .month_box1 { min-width: 0; }
}
.doho-readable .readable-season-title {
  padding: 8px 0;
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.5;
  text-align: left;
  color: #5f5f5f;
}
/* 既存の児童館ページにも同じ区分階層を使う。左の線・疑似要素は付けない。 */
.doho-readable .mainBody h2 { font-size: 24px; line-height: 1.5; }
.doho-readable .mainBody .readable-section-title {
  display: block;
  margin: 40px 0 20px;
  padding: 16px 24px;
  border: 0;
  border-radius: 12px;
  background: var(--readable-band);
  font-weight: 700;
}
.doho-readable .mainBody :is(.readable-section-title, .readable-season-title)::before,
.doho-readable .mainBody :is(.readable-section-title, .readable-season-title)::after {
  content: none;
  border: 0;
}
.doho-readable .mainBody .readable-season-title { font-size: 22px; }
.doho-readable .mainBody [id] { scroll-margin-top: 160px; }
.doho-readable .mainBody :is(.msg, .table-detail, .guide-table-note, .table-note, .caption, .photomsg .msg) {
  font-size: 14px;
  line-height: 1.8;
}
.doho-readable .mainBody .table-detail { display: block; }
.doho-readable .mainBody .tab_item { height: auto; min-height: 44px; line-height: 1.8; padding: 8px; }
.doho-readable .readable-data-table { table-layout: fixed; width: 100%; font-size: 15px; }
.doho-readable .readable-data-table :is(th, td) { width: auto; padding: 12px 10px; text-align: left; }
.doho-readable .readable-two-columns th:first-child { width: 42%; }
.doho-readable .readable-times :is(th, td):first-child { width: 25%; }
.doho-readable .readable-times :is(th, td):not(:first-child) { width: 37.5%; }
.doho-readable .readable-fees-detailed col:first-child { width: 17%; }
.doho-readable .readable-fees-detailed col:last-child { width: 36%; }
.doho-readable .readable-weekly :is(th, td):first-child { width: 4em; white-space: nowrap; }
.doho-readable .readable-age-table { table-layout: fixed; width: 100%; }
.doho-readable .readable-age-table :is(th, td) { text-align: left; padding: 18px; }
.doho-readable .readable-age-table tr th { width: 43%; text-align: center; }
.doho-readable .readable-age-table .schedule-time-heading { width: 14%; }
.doho-readable .readable-age-table .schedule-slot { vertical-align: middle; }
.doho-readable .readable-age-table .schedule-time-cell {
  font-size: 20px;
  line-height: 1.8;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  padding-inline: 8px;
  text-align: center;
  vertical-align: middle;
}
.doho-readable .schedule-slot .schedule-activity li { font-size: 16px; line-height: 1.8; }
.doho-readable .schedule-slot-label { display: none; }
.doho-readable .readable-age-jumps,
.doho-readable .readable-age-flows { display: none; }
/* 監査で既に枠外だった3画像だけ、元の表示比率で縮める。元画像・切取り設定は保持。 */
@media (max-width: 360px) {
  .doho-readable .en_content .readable-constrained-image { max-width: 100%; height: auto; aspect-ratio: 33 / 23; }
}
.doho-readable .month_text { width: 100%; }
.doho-readable .month_text th { white-space: nowrap; }
.doho-readable .month_text td { text-align: left; }
/* 月ラベルと各行事の先頭行をそろえ、季節ごとの自動列幅をなくす。 */
.doho-readable .mainBody table.readable-events {
  table-layout: fixed;
  width: 100%;
  margin: 0;
  padding: 0;
  border-collapse: collapse;
  border-spacing: 0;
}
.doho-readable .mainBody table.readable-events :is(th, td) {
  padding: 10px 0;
  vertical-align: top;
  text-align: left;
  line-height: 1.8;
}
.doho-readable .mainBody table.readable-events th {
  width: 4em;
  padding-right: 12px;
  white-space: nowrap;
}
.doho-readable .mainBody table.readable-recurring-events th { width: 6em; }
.doho-readable .mainBody .readable-event-list {
  margin: 0;
  padding-left: 1.1em;
  list-style: disc outside;
}
.doho-readable .mainBody .readable-event-list > li {
  margin: .3em 0 0;
  padding: 0;
  line-height: 1.8;
}
.doho-readable .mainBody .readable-event-list > li:first-child { margin-top: 0; }
.doho-readable .mainBody table.readable-events td.readable-event-empty { padding-left: 1.1em; }
/* 年間行事の補足も本文と同じ太さのリストにする。見出しだけ階層を付ける。 */
.doho-readable .mainBody .readable-event-notes {
  display: block;
  text-align: left;
  font-weight: 400;
}
.doho-readable .mainBody .readable-event-notes :is(ul, p) {
  margin: 0;
  font-weight: 400;
}
.doho-readable .mainBody .readable-event-notes h3 { margin: 0 0 10px; }
.doho-readable .mainBody .readable-event-notes > * + * { margin-top: 24px; }
/* 行事の項目は点なしで1件1行。案内ページのスケジュール等には適用しない。 */
.doho-readable .mainBody table.readable-events .readable-event-list,
.doho-readable .mainBody .readable-event-notes .readable-event-list {
  list-style: none;
}
/* 既存の季節背景・写真枠を共通トークンにし、小さい文字は濃い同系色で読む。 */
.doho-readable :is(.spring-bg, .gakudo-spring, .readable-jumps a[href="#season-spring"], .readable-jumps a[href="#gakudo-season-1"]) {
  --event-bg: #fcebee;
  --event-accent: #ef7788;
  --event-ink: #9c2949;
}
.doho-readable :is(.summer-bg, .gakudo-summer, .readable-jumps a[href="#season-summer"], .readable-jumps a[href="#gakudo-season-2"]) {
  --event-bg: #fef9ed;
  --event-accent: #efc760;
  --event-ink: #715000;
}
.doho-readable :is(.autumn-bg, .gakudo-autumn, .readable-jumps a[href="#season-autumn"], .readable-jumps a[href="#gakudo-season-3"]) {
  --event-bg: #f8f1e4;
  --event-accent: #cf8801;
  --event-ink: #895500;
}
.doho-readable :is(.winter-bg, .gakudo-winter, .readable-jumps a[href="#season-winter"], .readable-jumps a[href="#gakudo-season-4"]) {
  --event-bg: #edf7ff;
  --event-accent: #4a97d3;
  --event-ink: #21638e;
}
.doho-readable .mainBody :is(.spring-bg, .summer-bg, .autumn-bg, .winter-bg, .gakudo-season) {
  background-color: var(--event-bg);
  border-color: var(--event-accent);
}
.doho-readable .mainBody :is(.spring-bg, .summer-bg, .autumn-bg, .winter-bg, .gakudo-season) :is(h2, h3, th) {
  color: var(--event-ink);
  border-color: var(--event-accent);
}
.doho-readable .mainBody :is(.spring-bg, .summer-bg, .autumn-bg, .winter-bg, .gakudo-season) img {
  border-color: var(--event-accent);
}
.doho-readable .mainBody .readable-jumps a[href^="#season-"],
.doho-readable .mainBody .readable-jumps a[href^="#gakudo-season-"] {
  background-color: var(--event-bg, var(--readable-band));
  border-color: var(--event-accent, var(--readable-accent));
  color: var(--event-ink, #3e3e3e);
}
.doho-readable .mainBody .readable-jumps a:is([href^="#season-"], [href^="#gakudo-season-"]):is(:hover, :focus-visible) {
  background-color: var(--event-ink, #3e3e3e);
  border-color: var(--event-ink, #3e3e3e);
  color: #fff;
}
.doho-readable .mainBody .readable-jumps a:is([href^="#season-"], [href^="#gakudo-season-"]):focus-visible {
  outline: 3px solid var(--event-ink, #3e3e3e);
  outline-offset: 3px;
}
.doho-readable .gakudo-events > .readable-jumps { width: 100%; }
.doho-readable .mainBody .events-category-title { margin-inline: auto; }
.doho-readable .events-category-title + .readable-jumps { width: 70%; }
@media (max-width: 767px) {
  .doho-readable .events-category-title + .readable-jumps { width: calc(100% - 32px); }
  .doho-readable .readable-jumps:has(> a:is([href="#season-spring"], [href="#gakudo-season-1"])) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .doho-readable .readable-jumps:has(> a[href="#season-spring"]):has(> a:nth-child(5)) {
    grid-template-columns: minmax(0, 1fr);
  }
  .doho-readable .readable-jumps:has(> a:is([href="#season-spring"], [href="#gakudo-season-1"])) > a {
    display: grid;
    place-items: center;
    min-width: 0;
    min-height: 44px;
    text-align: center;
  }
}
.doho-readable #news { font-size: 16px; }
.doho-readable .mod-news-date {
  font-size: 14px;
  line-height: 1.8;
}
.doho-readable .mod-news-tile { min-width: 0; padding-left: 0; }
.doho-readable .mod-news-tile a[target="_blank"] { font-size: 14px; }
.doho-readable .mainBody button { font-size: 14px; line-height: 1.8; }
.doho-readable .footer_area { height: auto; min-height: 180px; padding-bottom: 16px; }
.doho-readable footer p {
  max-width: calc(100% - 24px);
  margin-inline: auto;
  font-size: 14px;
  line-height: 1.8;
  transform: none;
}
@media (max-width: 610px) {
  .doho-readable .footer_area { min-height: 100px; }
}
@media (max-width: 360px) {
  .doho-readable .menu-trigger { width: 44px; margin-right: 8px; }
}
@media (max-width: 767px) {
  .doho-readable .main_title2 h1 { font-size: 24px; padding-inline: 12px; }
  .doho-readable .mainBody .page_h1 {
    width: 90%;
    padding: 14px 16px;
    margin-top: 32px;
    margin-bottom: 20px;
    font-size: 22px;
  }
  .doho-readable .content > .col1 { width: 90%; }
  .doho-readable .mainBody :is(th, td) { font-size: 14px; }
  .doho-readable .readable-fees col:first-child { width: 3.7em; }
  .doho-readable .readable-fees col:last-child { width: 7.3em; }
  .doho-readable .readable-fees :is(th, td) { padding: 10px 5px; }
  .doho-readable .readable-overview th { width: 28%; }
  .doho-readable .readable-history th { width: 38%; }
  .doho-readable .readable-links,
  .doho-readable .readable-links tbody,
  .doho-readable .readable-links tr,
  .doho-readable .readable-links :is(th, td) { display: block; width: 100%; }
  .doho-readable .readable-links tr + tr { margin-top: 20px; }
  .doho-readable .readable-links th { padding: 12px; border-radius: 8px 8px 0 0; }
  .doho-readable .readable-links td { padding: 12px; }
  .doho-readable .readable-jumps { width: 90%; }
  .doho-readable .readable-jumps a { padding: 8px 12px; }
  .doho-readable .mod-newsList-item { flex-direction: column; gap: 6px; }
  .doho-readable .mainBody h2 { font-size: 22px; }
  .doho-readable .mainBody .readable-section-title { padding: 14px 16px; }
  .doho-readable .tabs { width: 90%; }
  .doho-readable .tab_content { padding: 20px 0 16px; overflow: visible; }
  .doho-readable .readable-data-table { font-size: 14px; }
  .doho-readable .readable-data-table :is(th, td) { padding: 10px 5px; }
  .doho-readable .readable-fees-detailed col:first-child { width: 5.5em; }
  .doho-readable .readable-fees-detailed col:last-child { width: 7.3em; }
  .doho-readable .readable-fees-detailed :is(th, td) { padding-inline: 3px; }
  /* 区分は全幅、品名と金額は2列。PCのセルとrowspanはそのまま使う。 */
  .doho-readable .readable-fees {
    display: grid;
    grid-template-columns: minmax(0, 42fr) minmax(0, 58fr);
  }
  .doho-readable .readable-fees :is(thead, tbody, tr) { display: contents; }
  .doho-readable .readable-fees colgroup,
  .doho-readable .readable-fees .readable-fee-category-heading,
  .doho-readable .readable-fees .readable-fee-continuation { display: none; }
  .doho-readable .readable-fees :is(th, td) {
    min-width: 0;
    width: auto;
    padding: 10px 8px;
    border-radius: 0;
    border: 0;
    border-bottom: 1px solid var(--readable-accent);
  }
  .doho-readable .readable-fees .readable-fee-category {
    grid-column: 1 / -1;
    background: var(--readable-band);
    font-weight: 700;
    text-align: left;
  }
  .doho-readable .readable-times :is(th, td):first-child { width: 25%; }
  .doho-readable .readable-times :is(th, td):not(:first-child) { width: 37.5%; }
  .doho-readable .schedule-table { border: 0; background: transparent; width: 90%; }
  .doho-readable .readable-age-table,
  .doho-readable .readable-age-table tbody,
  .doho-readable .readable-age-table tr { display: block; }
  .doho-readable .readable-age-table tr:first-child,
  .doho-readable .readable-age-table .schedule-time-cell { display: none; }
  .doho-readable .readable-age-table .schedule-slot {
    display: block;
    width: 100%;
    margin: 0 0 20px;
    padding: 16px;
    border: 1px solid var(--readable-accent);
    border-radius: 12px;
    background: #fff;
  }
  .doho-readable .schedule-slot-label {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    padding-bottom: 12px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--readable-accent);
    font-weight: 700;
  }
  .doho-readable .schedule-slot-time { font-size: 20px; font-variant-numeric: tabular-nums; }
  .doho-readable .has-age-flows .readable-age-table { display: none; }
  .doho-readable .has-age-flows .readable-age-jumps { display: flex; width: 100%; margin: 0 0 20px; }
  .doho-readable .readable-age-jumps a { flex: 1; text-align: center; }
  .doho-readable .has-age-flows .readable-age-flows { display: block; }
  .doho-readable .readable-age-flow > h3 { font-size: 22px; }
  .doho-readable .readable-age-flow .schedule-slot {
    padding: 16px;
    margin: 0 0 20px;
    border: 1px solid var(--readable-accent);
    border-radius: 12px;
    background: #fff;
  }
}

/* PCで時刻列を先頭へ移しても、角丸は表の外周だけに置く。 */
.doho-readable .readable-age-table th { border-radius: 0; }
.doho-readable .readable-age-table th:first-child { border-radius: 25px 0 0 0; }
.doho-readable .readable-age-table th:last-child { border-radius: 0 25px 0 0; }
@media (max-width: 767px) {
  .doho-readable .firstContent > .bunen {
    width: fit-content;
    max-width: calc(100% - 32px);
    margin-right: 16px;
    padding-inline: 12px;
  }
}
/* SPの表内で生成される「内容」「対象など」も14px以上。 */
.doho-readable .gwrap .ptable.hiroba td::before { font-size: 14px; line-height: 1.8; }

/* 外枠と最終行の区切り線を重ねない。末尾の注記行にも適用する。 */
.doho-readable .mainBody table > :is(thead, tbody, tfoot):last-child > tr:last-child > :is(th, td),
.doho-readable .mainBody table > tr:last-child > :is(th, td) {
  border-bottom: 0;
}
/* セルの背景・縦罫線も、既存の角丸外枠の内側に収める。 */
.doho-readable .mainBody .ichiGo_jikan { overflow: hidden; }
@media (min-width: 768px) {
  .doho-readable .mainBody .schedule-table { overflow: hidden; }
}
@media (max-width: 767px) {
  /* SPの区分セルは品名・金額より上の見出し行なので、内部の線を保つ。 */
  .doho-readable .mainBody .readable-fees tr:last-child > .readable-fee-category {
    border-bottom: 1px solid var(--readable-accent);
  }
}

/* 見出し帯と本文の列幅を共有する。段落だけを狭め、リストを残さない。 */
.doho-readable .mainBody {
  --readable-column-width: 75%;
  --readable-column-gutter: 12.5%;
  --readable-column-padding: 24px;
}
.doho-readable .mainBody:not(:has(h2)) {
  --readable-column-width: 80%;
  --readable-column-gutter: 10%;
}
.doho-readable .mainBody:has(> .readable-season) {
  --readable-column-width: 70%;
  --readable-column-gutter: 15%;
}
.doho-readable .mainBody :is(.content, .hosyou) > .col1 {
  width: var(--readable-column-width);
  margin-inline: auto;
  padding-inline: var(--readable-column-padding);
}
.doho-readable .mainBody :is(.content, .hosyou) > .col1 > :is(p, h3, ol, ul) {
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
}
.doho-readable .firstContent > .bunen {
  width: fit-content;
  max-width: var(--readable-column-width);
  margin-left: auto;
  margin-right: var(--readable-column-gutter);
  padding-inline: var(--readable-column-padding);
}
.doho-readable .mainBody .shisetu > .shisetuGaiyo,
.doho-readable .mainBody .access > .ggmap,
.doho-readable .mainBody > .gintro,
.doho-readable .mainBody > .en_photo.gallery-uniform {
  max-width: var(--readable-column-width);
  margin-inline: auto;
}
.doho-readable .mainBody > .readable-jumps {
  width: var(--readable-column-width);
}
.doho-readable .mainBody .newsPage {
  max-width: 80%;
  margin-inline: auto;
}
@media (max-width: 767px) {
  .doho-readable .mainBody {
    --readable-column-width: 90%;
    --readable-column-gutter: 5%;
    --readable-column-padding: 16px;
  }
  .doho-readable .mainBody:has(> .readable-season) {
    --readable-column-width: 80%;
    --readable-column-gutter: 10%;
  }
}
/* 固定幅330pxの旧写真ペアは、列に2枚入らない中間幅では縦に並べる。 */
@media (min-width: 768px) and (max-width: 960px) {
  .doho-readable .mainBody .en_photo.readable-fixed-pair {
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }
  .doho-readable .readable-fixed-pair > .en_content {
    width: 330px;
    max-width: 100%;
    margin-inline: auto;
  }
}