@charset "UTF-8";

/* ==========================================================================
   言葉のかけ算作文教室 2026年度実施レポート（2ページ目）
   design: lecture/newsource/lucture2026ー.pdf（2ページ目）
   ========================================================================== */

/* --------------------------------------------------------------------------
   キービジュアル
   -------------------------------------------------------------------------- */

.lecture26-kv {
  /* 固定ヘッダー（--pc-header-height: 96px）の下から 44px 空ける */
  background-color: #fffce8;
  padding: 140px 0 56px;
}

.lecture26-kv__inner {
  width: 92%;
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
  line-height: 0;
}

.lecture26-kv__inner img {
  width: 100%;
  height: auto;
}

/* --------------------------------------------------------------------------
   読み物パート（言葉って楽しい／言葉のかけ算／相手思いの「読書推せん文」）
   -------------------------------------------------------------------------- */

.lecture26-story {
  background-color: #fff;
  padding: 80px 0 110px;
}

.lecture26-story__inner {
  width: 92%;
  max-width: 660px;
  margin: 0 auto;
}

.lecture26-article + .lecture26-article {
  margin-top: 100px;
}

.lecture26-article__title {
  display: table;
  margin: 0 auto 44px;
  padding-bottom: 10px;
  border-bottom: 2px solid #00b3a0;
  color: #00b3a0;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}

.lecture26-article__text {
  margin: 0;
  color: #000;
  font-size: 1.2rem;
  line-height: 1.8;
  text-align: justify;
  text-justify: inter-ideograph;
  text-indent: 1em;
}

.lecture26-article__text + .lecture26-article__text {
  margin-top: 22px;
}

/* --- 写真グループ --- */

.lecture26-photos {
  margin: 50px auto 0;
  max-width: 610px;
}

.lecture26-photos + .lecture26-article__text {
  margin-top: 50px;
}

.lecture26-photos__grid,
.lecture26-photos__pair {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.lecture26-photos__grid {
  gap: 9px;
}

.lecture26-photos__main {
  -webkit-box-flex: 0;
  /* 左の大写真と右2点の合計高さがそろう比率 */
  -ms-flex: 0 0 64.5%;
  flex: 0 0 64.5%;
  line-height: 0;
}

.lecture26-photos__side {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  /* 右列2点の合計高さが左の大写真とそろうよう詰める */
  gap: 8px;
  line-height: 0;
}

/* 相手思いの「読書推せん文」の写真2点（横並び・自然な高さでそろう） */

.lecture26-photos__pair {
  gap: 3.1%;
}

.lecture26-photos__pair > picture:first-child {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 44.6%;
  flex: 0 0 44.6%;
}

.lecture26-photos__pair > picture:last-child {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

/* 左右の高さがそろうよう、写真の縦横比に比例した幅を与える */

.lecture26-photos__pair--talk > picture:first-child {
  -ms-flex: 0 0 50.6%;
  flex: 0 0 50.6%;
}

.lecture26-photos__pair--kakezan > picture:first-child {
  -ms-flex: 0 0 46.9%;
  flex: 0 0 46.9%;
}

/* --- 写真4点（2×2） --- */

.lecture26-photos__grid4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 9px;
}

.lecture26-photos__grid4 > picture {
  -ms-flex: 0 0 calc((100% - 9px) / 2);
  flex: 0 0 calc((100% - 9px) / 2);
  display: block;
  line-height: 0;
}

.lecture26-photos__grid4 img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  -o-object-fit: cover;
  object-fit: cover;
}

/* 主役が中央から外れている写真は、切れないよう表示位置をずらす */

.lecture26-photos__grid4 img[src$="lecture26_writing_02.jpg"] {
  -o-object-position: 72% center;
  object-position: 72% center;
}

.lecture26-photos__grid4 img[src$="lecture26_writing_04.jpg"] {
  -o-object-position: 40% center;
  object-position: 40% center;
}

/* --- 本文の右に写真を置く2カラム --- */

.lecture26-article__text + .lecture26-aside {
  margin-top: 22px;
}

.lecture26-aside {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 24px;
}

.lecture26-aside__text {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

.lecture26-aside__photo {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 270px;
  flex: 0 0 270px;
  line-height: 0;
}

.lecture26-aside__photo img {
  width: 100%;
  height: auto;
}

.lecture26-photos picture {
  display: block;
  line-height: 0;
}

.lecture26-photos img {
  width: 100%;
  height: auto;
}

.lecture26-photos__caption {
  /* 写真の左右端よりわずかに内側に入れる */
  margin: 9px 0 0;
  padding: 0 20px;
  color: #000;
  font-size: 1rem;
  line-height: 1.7;
  text-align: justify;
  text-justify: inter-ideograph;
}

.lecture26-photos__caption--center {
  text-align: center;
}

/* --- 図版（読書推せん文とは／設計図） --- */

.lecture26-fig {
  margin: 46px auto;
  line-height: 0;
  text-align: center;
}

.lecture26-fig img {
  width: 100%;
  height: auto;
}

.lecture26-fig--target {
  max-width: 640px;
}

.lecture26-fig--blueprint {
  margin-bottom: 0;
  max-width: 520px;
}

/* --------------------------------------------------------------------------
   実施レポート（各校）
   -------------------------------------------------------------------------- */

.lecture26-report {
  background-color: #fffdee;
  padding: 96px 0 120px;
}

.lecture26-report__inner {
  width: 92%;
  max-width: 660px;
  margin: 0 auto;
}

.lecture26-report__lead {
  margin: 0;
  /* PCで4行に収まるよう左右をわずかに詰めている */
  padding: 30px 26px;
  border: 1px solid #00b0a8;
  background-color: #fff;
  color: #000;
  font-size: 21px;
  line-height: 2;
  text-align: justify;
  text-justify: inter-ideograph;
}

.lecture26-report__nav {
  margin: 100px 0 0;
  text-align: center;
  line-height: 2;
}

/* アーカイブページのページ内スクロールリンクと同じ見た目にそろえる */

.lecture26-report__nav .contents-section {
  padding-top: 0;
  color: #000;
  font-size: 21px;
  text-decoration: underline;
  -webkit-transition: all .3s 0s ease;
  transition: all .3s 0s ease;
}

.lecture26-report__nav .contents-section:hover {
  color: #34b8dc;
}

/* --- 学校カード --- */

.lecture26-school {
  margin-top: 100px;
  border: 1px solid #ddd;
  border-radius: 14px;
  background-color: #fff;
  overflow: hidden;
}

.lecture26-school__head {
  padding: 26px 20px 22px;
  text-align: center;
}

.lecture26-school__name {
  margin: 0;
  color: #000;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.4;
}

.lecture26-school__meta {
  margin: 12px 0 0;
  color: #000;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.6;
}

.lecture26-school__body {
  padding: 42px 44px 46px;
}

.lecture26-school__title {
  display: table;
  margin: 0 auto 34px;
  padding-bottom: 10px;
  border-bottom: 1px solid #000;
  color: #000;
  /* 見出し（1.8rem）から一段階下げる */
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}

.lecture26-school__text {
  margin: 0;
  color: #000;
  font-size: 1.2rem;
  line-height: 1.8;
  text-align: justify;
  text-justify: inter-ideograph;
  text-indent: 1em;
}

.lecture26-school__text + .lecture26-school__text {
  margin-top: 22px;
}

.lecture26-school__photo {
  margin-top: 40px;
  line-height: 0;
}

.lecture26-school__photo img {
  width: 100%;
  height: auto;
}

.lecture26-school__photo + .lecture26-school__photo {
  margin-top: 20px;
}

/* --- 学校ごとの色 --- */

.lecture26-school--oohara {
  border-color: #fdeccd;
}

.lecture26-school--oohara .lecture26-school__head {
  background-color: #faca73;
}

.lecture26-school--mizue {
  border-color: #e2f2fc;
}

.lecture26-school--mizue .lecture26-school__head {
  background-color: #c7e8fa;
}

.lecture26-school--nakadai {
  border-color: #d7e9b6;
}

.lecture26-school--nakadai .lecture26-school__head {
  background-color: #c3de99;
}

.lecture26-school--mihara {
  border-color: #fbdcec;
}

.lecture26-school--mihara .lecture26-school__head {
  background-color: #f9b3d6;
}

.lecture26-school--kasori {
  border-color: #dedcfb;
}

.lecture26-school--kasori .lecture26-school__head {
  background-color: #c0bdf7;
}

.lecture26-school--caritas {
  border-color: #fbf5bd;
}

.lecture26-school--caritas .lecture26-school__head {
  background-color: #f7ec7d;
}

/* --- 最初のページに戻る --- */

.lecture26-report__back {
  margin: 90px 0 0;
  font-size: 21px;
  line-height: 1.6;
  text-align: center;
}

.lecture26-report__back a {
  color: #000;
  text-decoration: underline;
  -webkit-transition: opacity .3s 0s ease;
  transition: opacity .3s 0s ease;
}

.lecture26-report__back a:hover {
  opacity: .7;
}

/* ==========================================================================
   タブレット
   ========================================================================== */

@media (max-width: 900px) {
  .lecture26-school__name {
    font-size: 24px;
  }

  .lecture26-school__title {
    font-size: 21px;
  }

  .lecture26-school__body {
    padding: 36px 30px 40px;
  }
}

/* ==========================================================================
   スマートフォン
   ========================================================================== */

@media (max-width: 767px) {
  .lecture26-kv {
    padding: 25vw 0 8vw;
  }

  .lecture26-kv__inner {
    width: 88%;
  }

  .lecture26-story {
    padding: 12vw 0 16vw;
  }

  .lecture26-story__inner,
  .lecture26-report__inner {
    width: 88%;
  }

  .lecture26-article + .lecture26-article {
    margin-top: 13vw;
  }

  .lecture26-article__title {
    margin-bottom: 6vw;
    padding-bottom: 1.5vw;
    font-size: 4.2vw;
  }

  .lecture26-article__text,
  .lecture26-school__text {
    font-size: 4vw;
    line-height: 1.8;
  }

  .lecture26-article__text + .lecture26-article__text,
  .lecture26-school__text + .lecture26-school__text {
    margin-top: 4vw;
  }

  .lecture26-photos {
    margin-top: 7vw;
    max-width: none;
  }

  .lecture26-photos + .lecture26-article__text {
    margin-top: 7vw;
  }

  .lecture26-photos__grid {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 3vw;
  }

  .lecture26-photos__main {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
  }

  .lecture26-photos__side {
    gap: 3vw;
    width: 100%;
  }

  .lecture26-photos__pair,
  .lecture26-photos__grid4 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 3vw;
  }

  .lecture26-photos__pair > picture:first-child,
  .lecture26-photos__pair--talk > picture:first-child,
  .lecture26-photos__pair--kakezan > picture:first-child,
  .lecture26-photos__grid4 > picture {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 100%;
  }

  /* SPは1枚ずつ縦に並ぶので、切り抜かず元の比率で見せる */
  .lecture26-photos__grid4 img {
    aspect-ratio: auto;
    -o-object-fit: fill;
    object-fit: fill;
  }

  .lecture26-aside {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 5vw;
  }

  .lecture26-aside__photo {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 100%;
  }

  .lecture26-photos__caption {
    margin-top: 1.7vw;
    padding: 0 1.5vw;
    font-size: 3vw;
  }

  .lecture26-fig {
    margin: 7vw auto;
  }

  .lecture26-fig--blueprint {
    max-width: 76vw;
  }

  .lecture26-report {
    padding: 14vw 0 16vw;
  }

  .lecture26-report__lead {
    padding: 5vw 5vw;
    font-size: 3.5vw;
    line-height: 2;
  }

  .lecture26-report__nav {
    margin-top: 14vw;
  }

  .lecture26-report__nav a.contents-section {
    font-size: 3.5vw;
  }

  .lecture26-school {
    margin-top: 14vw;
    border-radius: 2.5vw;
  }

  .lecture26-school__head {
    padding: 5vw 4vw 4.5vw;
  }

  .lecture26-school__name {
    font-size: 4.5vw;
  }

  .lecture26-school__meta {
    margin-top: 2.5vw;
    font-size: 3vw;
  }

  .lecture26-school__body {
    padding: 7vw 6vw 8vw;
  }

  .lecture26-school__title {
    margin-bottom: 6vw;
    padding-bottom: 1.5vw;
    /* 本文（4vw）より小さくならないよう、記事見出しと同じ大きさにそろえる */
    font-size: 4.2vw;
  }

  .lecture26-school__photo {
    margin-top: 6vw;
  }

  .lecture26-school__photo + .lecture26-school__photo {
    margin-top: 3vw;
  }

  .lecture26-report__back {
    margin-top: 14vw;
    font-size: 3.5vw;
  }
}