/*--------------------------------------------------------------------
	blog.css
	お知らせ一覧（blog.html）／お知らせ詳細（blog-detail.html）共通の
	追加スタイル。共通CSS（reset/basis/structure/parts/dark-theme）で
	足りない最小限のページ固有スタイルのみをここに記述する。
--------------------------------------------------------------------*/

/* ---- お知らせ詳細：日付・カテゴリー ---- */
.blogDetailMeta01 {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}

/* ---- お知らせ詳細：タイトル ---- */
.blogDetailTitle01 {
  font-size: 1.6rem;
  line-height: 1.6;
  margin-bottom: 30px;
}

/* ---- お知らせ詳細：メイン画像（登録時のみ表示） ---- */
.blogDetailImgWrap01 {
  margin-bottom: 30px;
}

.blogDetailImg01 {
  width: 100%;
  display: block;
  object-fit: cover;
}

/* ---- お知らせ詳細：本文（リッチエディタのHTMLをそのまま表示） ---- */
.blogDetailBody01 {
  font-size: 0.9rem;
  line-height: 2;
  color: #4a4a4a;
}

.blogDetailBody01 p {
  margin-bottom: 1.6em;
}

.blogDetailBody01 h2,
.blogDetailBody01 h3 {
  font-weight: 700;
  line-height: 1.6;
  margin: 2em 0 1em;
}

.blogDetailBody01 h2 { font-size: 1.2rem; }
.blogDetailBody01 h3 { font-size: 1.05rem; }

.blogDetailBody01 ul,
.blogDetailBody01 ol {
  margin: 0 0 1.6em 1.4em;
}

.blogDetailBody01 li {
  margin-bottom: .5em;
}

.blogDetailBody01 a {
  color: #142148;
  text-decoration: underline;
}

.blogDetailBody01 strong {
  font-weight: 700;
}

.blogDetailBody01 img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 1.6em 0;
}

@media screen and (max-width: 767px) {
  .blogDetailTitle01 { font-size: 1.25rem; }
}