/* ===================================================
   MHシステム株式会社 コーポレートサイト
   single-post.css - 投稿詳細ページ（News記事など）専用スタイル
--------------------------------------------------- */

/* ---------------------------------------------------
   Page Header（見出し帯）
--------------------------------------------------- */
.mh-pagehead{
  background:#eef0f2;
  padding:64px 40px 56px;
}
.mh-pagehead__inner{max-width:820px;margin:0 auto;}
.mh-breadcrumb{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:13px;color:var(--mh-sub);margin:0 0 20px;
}
.mh-breadcrumb a{color:var(--mh-sub);}
.mh-breadcrumb a:hover{color:var(--mh-blue);}
.mh-breadcrumb .cur{color:var(--mh-blue);font-weight:700;}
.mh-pagehead__title{
  font-family:"Inter",sans-serif;font-weight:900;font-size:clamp(28px,4vw,44px);
  letter-spacing:-1px;margin:0;line-height:1.4;
}

.mh-article{
  padding:90px 40px 110px;
}
.mh-article__inner{
  max-width:820px;
  margin:0 auto;
}
.mh-article__meta{
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:20px;
}
.mh-article__date{
  font-size:14px;
  color:var(--mh-sub);
  font-weight:600;
}
.mh-article__tag{
  font-size:11px;
  font-weight:800;
  letter-spacing:.5px;
  color:var(--mh-blue);
  background:#eef3ff;
  padding:5px 12px;
  border-radius:4px;
}
.mh-article__body{
  font-size:16px;
  line-height:2;
  color:var(--mh-text);
}
.mh-article__body p{margin:0 0 28px;}
.mh-article__body img{
  max-width:100%;
  height:auto;
  border-radius:8px;
  margin:12px 0 32px;
}
.mh-article__body h2{
  font-size:22px;
  font-weight:800;
  margin:48px 0 20px;
}
.mh-article__body h3{
  font-size:18px;
  font-weight:800;
  margin:36px 0 16px;
}
.mh-article__body a{
  color:var(--mh-blue);
  text-decoration:underline;
}
.mh-article__back{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:56px;
  font-size:14px;
  font-weight:700;
  color:var(--mh-blue);
}
.mh-article__back svg{width:16px;height:16px;transform:scaleX(-1);}

/* ---------------------------------------------------
   他の投稿一覧（記事本文の下）
--------------------------------------------------- */
.mh-article__related{
  border-top:1px solid var(--mh-line);
  padding-top:48px;
  margin-top:64px;
}
.mh-article__related-title{
  font-family:"Inter",sans-serif;
  font-weight:900;
  font-size:20px;
  letter-spacing:-.5px;
  margin:0 0 8px;
  color:var(--mh-text);
}

@media (max-width:640px){
  .mh-article{padding:64px 24px 80px;}
}