@charset "UTF-8";
/* ================================
   blog.css（投稿：記事詳細 / 一覧 / カテゴリ / タグ）
   対象：is_home / is_category / is_tag / single(post)
================================ */

/* ------------------------------
   PC（デフォルト）
-------------------------------- */

/* 記事タイトル */
.single-post #post_title,
.category #post_title,
.tag #post_title,
.blog #post_title {
  font-size: 32px;
  line-height: 1.4;
  margin: 0 0 10px;
}

/* 本文ベース */
.single-post #article .post_content,
.category #article .post_content,
.tag #article .post_content,
.blog #article .post_content {
  line-height: 1.9;
}

/* 見出し装飾（class指定してる前提） */
.single-post .custom_h3,
.category .custom_h3,
.tag .custom_h3,
.blog .custom_h3 {
  /* margin: 45px 0 14px; */
  padding: 10px 14px;
  border-left: 6px solid #6c4eb1;
  background: #f7f4ff;
  font-size: 22px;
  line-height: 1.5;
}


.single-post h4.custom_h4,
.blog h4.custom_h4,
.category h4.custom_h4,
.tag h4.custom_h4 {
  position: relative;
  padding-left: 18px; /* 四角分の余白 */
  font-weight: 600;
}

/* 左の縦線をリセット */
.single-post h4.custom_h4::before,
.blog h4.custom_h4::before,
.category h4.custom_h4::before,
.tag h4.custom_h4::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 6px;          /* ← 四角のサイズ */
  height: 6px;
  background-color: #6c4eb1; /* 紫（サイト基調色） */
  transform: translateY(-50%);
  border-radius: 1px;  /* 角丸少し（完全な四角なら0） */
}


/* リスト */
.single-post .post_content ul,
.single-post .post_content ol {
  margin: 14px 0 18px;
  padding-left: 1.4em;
}

/* ------------------------------
   Tablet（〜1024px）
-------------------------------- */
@media screen and (max-width: 1024px) {

  .single-post #post_title,
  .category #post_title,
  .tag #post_title,
  .blog #post_title {
    font-size: 24px;
    line-height: 1.45;
  }

  .single-post .custom_h3,
  .category .custom_h3,
  .tag .custom_h3,
  .blog .custom_h3 {
    font-size: 20px;
    padding: 10px 12px;
    /* margin: 40px 0 12px; */
  }

  .single-post .custom_h4,
  .category .custom_h4,
  .tag .custom_h4,
  .blog .custom_h4 {
    font-size: 17px;
  }
}

/* ------------------------------
   SP（〜767px）
-------------------------------- */
@media screen and (max-width: 767px) {

  .single-post #post_title,
  .category #post_title,
  .tag #post_title,
  .blog #post_title {
    font-size: 22px;
    line-height: 1.55;
  }

  .single-post .custom_h3,
  .category .custom_h3,
  .tag .custom_h3,
  .blog .custom_h3 {
    font-size: 18px;
    padding: 9px 11px;
    border-left-width: 5px;
    /* margin: 30px 0 10px; */
  }

  .single-post .custom_h4,
  .category .custom_h4,
  .tag .custom_h4,
  .blog .custom_h4 {
    font-size: 16px;
    margin: 18px 0 8px;
  }

  .single-post #article .post_content,
  .category #article .post_content,
  .tag #article .post_content,
  .blog #article .post_content {
    line-height: 1.95;
  }
}