@charset "utf-8";
/* blog-detail データブロック出力用の外部CSS。
   blogdetail design にのみバインドする（common.css には置かない）。
   アイキャッチは画像未登録時に出力されず、:empty で非表示にする。 */
.blogdetail-eyecatch:empty {
  display: none;
}

.blogdetail-eyecatch img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  margin: 0 0 28px;
  object-fit: cover;
}

.news-detail-block,
.news-detail-block .webgene-item,
.news-detail-block .blogdetail-inner {
  max-width: 100%;
  min-width: 0;
}

.news-detail-block .blogdetail-inner,
.news-detail-block .blogdetail-inner h2,
.news-detail-block .blogdetail-inner p,
.news-detail-block .blogdetail-inner li {
  overflow-wrap: anywhere;
}

.news-detail-block .blogdetail-inner img,
.news-detail-block .blogdetail-inner iframe,
.news-detail-block .blogdetail-inner video {
  max-width: 100%;
}

@media (max-width: 600px) {
  .blogdetail-eyecatch img {
    height: auto;
    aspect-ratio: 4 / 3;
  }

  .news-detail-block .blogdetail-inner {
    padding: 28px 22px 34px !important;
  }

  .news-detail-block .blogdetail-inner h2 {
    font-size: 26px !important;
    line-height: 1.55 !important;
  }
}