@charset "UTF-8";
/* ==========================================================================
   記事本文のブロック
   --------------------------------------------------------------------------
   ブロックエディターで使用するブロックに対応させる。
   セレクタはブロックが出力するクラスそのもの。編集画面でも同じ見た目になる。

   強調は3種類に統一する（デザイン案の方針）
     マーカー       … 要点   段落：黄色マーカー
     注意ボックス   … リスク  タブ見出しボックス（色：赤 = .tcb-red）
     ポイントボックス … 補足  タブ見出しボックス（色：未指定 or 紫）

   使わないことにした装飾（.blank-box / .information-box）は、
   既存記事に残っている分が崩れない最低限だけ末尾に残してある。
   ========================================================================== */

/* --------------------------------------------------------------------------
   段落・本文中のリンク
   -------------------------------------------------------------------------- */
.entry-content > p{ margin: 0 0 1.5em; }

.entry-content > p a,
.entry-content > ul a,
.entry-content > ol a,
.tab-caption-box-content a{
  color:         var(--c-brand-dark);
  font-weight:   700;
  border-bottom: 1px solid var(--c-brand-line);
  text-decoration: none;
}
.entry-content > p a:hover,
.entry-content > ul a:hover,
.entry-content > ol a:hover,
.tab-caption-box-content a:hover{
  border-bottom-color: var(--c-brand);
  background:          var(--c-brand-pale);
}

/* --------------------------------------------------------------------------
   強調 1／3：マーカー ＝ 要点
   スクロールで伸びる演出は common.js が .on クラスで制御している（据え置き）。
   色は公式サイトと同じ #FFF55A（CTAの黄 #FCE94C とは別トークン）。
   -------------------------------------------------------------------------- */
.marker-under{
  background:        linear-gradient(transparent 62%, var(--c-marker) 62%);
  background-repeat: no-repeat;
  background-size:   0% 100%;
  display:           inline;
  font-weight:       700;
  transition:        background-size 1.5s;
}
.marker-under.on{ background-size: 100% 100%; }

/* 強調 2／3 の前に：赤太文字（インラインの注意喚起） */
.entry-content .red{ color: var(--c-alert); font-weight: 700; }

/* --------------------------------------------------------------------------
   強調 2・3／3：タブ見出しボックス
   Cocoon装飾ボックス →「タブ見出しボックス」
     色を「赤」にすると .tcb-red が付く  → 注意ボックス（リスク）
     色を指定しない／紫                  → ポイントボックス（補足）
   -------------------------------------------------------------------------- */
.entry-content .tab-caption-box{
  margin:        28px 0;
  padding:       0;
  border:        1px solid var(--c-brand-line);
  border-radius: var(--radius);
  background:    var(--c-bg);
  overflow:      hidden;
}

.entry-content .tab-caption-box-label{
  display:     flex;
  align-items: center;
  gap:         8px;
  margin:      0;
  padding:     9px 16px;
  border:      0;
  border-radius: 0;
  background:  var(--c-brand);
  color:       var(--c-on-dark);
  font-size:   13px;
  font-weight: 700;
  letter-spacing: .03em;
}
.entry-content .tab-caption-box-label-text{ color: inherit; }

.entry-content .tab-caption-box-content{
  padding:     18px 20px;
  border:      0;
  background:  transparent;
  font-size:   17px;          /* 本文と同サイズ。従来は本文より小さかった */
  line-height: 1.85;
}
.entry-content .tab-caption-box-content > :first-child{ margin-top: 0; }
.entry-content .tab-caption-box-content > :last-child{ margin-bottom: 0; }

/* 注意ボックス（色：赤） */
.entry-content .tab-caption-box.tcb-red{ border-color: var(--c-alert-line); }
.entry-content .tab-caption-box.tcb-red .tab-caption-box-label{ background: var(--c-alert); }
.entry-content .tab-caption-box.tcb-red .tab-caption-box-content{ background: var(--c-alert-pale); }

/* --------------------------------------------------------------------------
   付箋（段落：付箋青）
   ボックスより軽い、一文だけの補足。
   -------------------------------------------------------------------------- */
.entry-content p.is-style-sticky-blue{
  margin:      24px 0;
  padding:     14px 18px;
  border:      0;
  border-left: 4px solid var(--c-brand);
  border-radius: 0 var(--radius) var(--radius) 0;
  background:  var(--c-bg-sub);
  font-size:   16px;
  line-height: 1.85;
  color:       var(--c-ink-2);
}

/* --------------------------------------------------------------------------
   リスト
   通常の箇条書き／番号付きリストは、マーカーだけ紫にする。
   -------------------------------------------------------------------------- */
.entry-content .wp-block-list{
  margin:  0 0 1.5em;
  padding: 0 0 0 1.5em;
}
.entry-content .wp-block-list li{ margin-bottom: .5em; }
.entry-content .wp-block-list > li::marker{
  color:       var(--c-brand);
  font-weight: 700;
}

/* Cocoon のリストスタイル（チェック・丸・囲み番号）のアイコン色 */
.wp-block-list.is-style-icon-list-check > li::before,
.wp-block-list.is-style-icon-list-circle > li::before{ color: var(--c-brand); }
.wp-block-list.is-style-numeric-list-enclosed > li::before{ background-color: var(--c-brand); }

/* --------------------------------------------------------------------------
   手順ステップ
   番号付きリストに「背景色」を付けたときだけステップ表示にする。
   （編集画面：リスト → 色 → 背景色 を指定すると .has-background が付く）
   -------------------------------------------------------------------------- */
.entry-content ol.wp-block-list.has-background{
  counter-reset: step;
  margin:     28px 0;
  padding:    0;
  list-style: none;
  /* WordPress の色クラス（.has-background）は background-color を !important で
     出力するため、ここだけは !important でないと打ち消せない。
     地色は個々の li 側に持たせる。 */
  background-color: transparent !important;
}
.entry-content ol.wp-block-list.has-background > li{
  position:      relative;
  margin:        0 0 10px;
  padding:       14px 18px 14px 54px;
  border-radius: var(--radius);
  background:    var(--c-bg-sub);
  font-size:     17px;
  line-height:   1.75;
}
.entry-content ol.wp-block-list.has-background > li::marker{ content: none; }
.entry-content ol.wp-block-list.has-background > li::before{
  counter-increment: step;
  content:  counter(step);
  position: absolute;
  left:     16px;
  top:      14px;
  width:    26px;
  height:   26px;
  border-radius: 50%;
  background: var(--c-brand);
  color:      var(--c-on-dark);
  font-size:  13px;
  font-weight: 700;
  display:    grid;
  place-items: center;
}

/* 箇条書きに背景色を付けた場合は、囲みとしてだけ扱う */
.entry-content ul.wp-block-list.has-background{
  padding:       18px 20px 18px 40px;
  border-radius: var(--radius);
}

/* --------------------------------------------------------------------------
   画像
   -------------------------------------------------------------------------- */
.entry-content .wp-block-image{ margin: 28px 0; }
.entry-content .wp-block-image img{
  border:        1px solid var(--c-line);
  border-radius: var(--radius);
}
.entry-content .wp-element-caption,
.entry-content .wp-block-image figcaption{
  margin-top: 8px;
  font-size:  13px;
  line-height: 1.7;
  color:      var(--c-ink-3);
  text-align: center;
}

/* --------------------------------------------------------------------------
   テーブル
   -------------------------------------------------------------------------- */
/* Cocoon 側に figure{max-width:100%} があり、article.css の
   .entry-content > *{max-width:720px} に勝ってしまう。表だけ 768px のまま残って
   本文より 48px はみ出して見えるので、ここで明示的に絞る。 */
.entry-content > figure.wp-block-table,
.entry-content .wp-block-table{
  max-width: var(--w-read);
}
.entry-content .wp-block-table{
  margin:    28px 0;
  overflow-x: auto;           /* 狭い画面でページごと横に伸びないように */
}
.entry-content .wp-block-table table{
  width:           100%;
  border-collapse: collapse;
  font-size:       15px;
  line-height:     1.7;
}
.entry-content .wp-block-table th,
.entry-content .wp-block-table td{
  padding:      10px 14px;
  border:       1px solid var(--c-line);
  text-align:   left;
  vertical-align: top;
}
.entry-content .wp-block-table thead th,
.entry-content .wp-block-table tr:first-child td strong{ font-weight: 700; }
.entry-content .wp-block-table thead th{
  background: var(--c-brand-pale);
  color:      var(--c-ink);
}
.entry-content .wp-block-table tbody tr:nth-child(even) td{ background: var(--c-bg-sub); }

/* --------------------------------------------------------------------------
   引用
   -------------------------------------------------------------------------- */
.entry-content .wp-block-quote{
  margin:      28px 0;
  padding:     18px 20px;
  border:      0;
  border-left: 4px solid var(--c-line-strong);
  border-radius: 0 var(--radius) var(--radius) 0;
  background:  var(--c-bg-sub);
  font-size:   16px;
  line-height: 1.85;
  color:       var(--c-ink-2);
}
.entry-content .wp-block-quote > :first-child{ margin-top: 0; }
.entry-content .wp-block-quote > :last-child{ margin-bottom: 0; }
.entry-content .wp-block-quote cite{
  display:    block;
  margin-top: 10px;
  font-size:  13px;
  font-style: normal;
  color:      var(--c-ink-3);
}

/* --------------------------------------------------------------------------
   ボタン
   ブランドガイド 6.1 の CTA 階層に合わせる。
     通常   … Primary   ＝ 黄 ＋ 黒文字（登録・申込みの最優先アクション）
     枠線   … Tertiary  ＝ 白 ＋ 紫枠  （併記する補助アクション）
   -------------------------------------------------------------------------- */
.entry-content .wp-block-buttons{ margin: 28px 0; gap: 12px; }

.entry-content .wp-block-button__link{
  display:       inline-flex;
  align-items:   center;
  justify-content: center;
  min-height:    44px;
  padding:       0 24px;
  border:        0;
  border-radius: 999px;        /* 現状は角丸なしの黒い四角 */
  background:    var(--c-accent);
  color:         var(--c-on-accent);
  font-size:     15px;
  font-weight:   700;
  letter-spacing: .02em;
  text-decoration: none;
}
.entry-content .wp-block-button__link:hover{
  background:      var(--c-accent-deep);
  text-decoration: none;
}

.entry-content .wp-block-button.is-style-outline .wp-block-button__link{
  background: var(--c-bg);
  color:      var(--c-brand-dark);
  border:     1px solid var(--c-brand);
}
.entry-content .wp-block-button.is-style-outline .wp-block-button__link:hover{
  background: var(--c-brand-pale);
}

/* --------------------------------------------------------------------------
   カラム
   -------------------------------------------------------------------------- */
.entry-content .wp-block-columns{ margin: 28px 0; gap: 24px; }
.entry-content .wp-block-column > :first-child{ margin-top: 0; }
.entry-content .wp-block-column > :last-child{ margin-bottom: 0; }

/* --------------------------------------------------------------------------
   詳細（FAQ の開閉）
   -------------------------------------------------------------------------- */
.entry-content .wp-block-details{
  margin:        14px 0;
  padding:       0 18px;
  border:        1px solid var(--c-line);
  border-radius: var(--radius);
  background:    var(--c-bg);
}
.entry-content .wp-block-details summary{
  display:     flex;
  align-items: flex-start;
  gap:         10px;
  padding:     14px 0;
  font-size:   16px;
  font-weight: 700;
  line-height: 1.7;
  cursor:      pointer;
  list-style:  none;
}
.entry-content .wp-block-details summary::-webkit-details-marker{ display: none; }
.entry-content .wp-block-details summary::after{
  content:  "";
  flex:     none;
  width:    8px;
  height:   8px;
  margin-left: auto;
  margin-top:  .5em;
  border-right:  2px solid var(--c-ink-3);
  border-bottom: 2px solid var(--c-ink-3);
  transform:  rotate(45deg) translateY(-2px);
  transition: transform .15s;
}
.entry-content .wp-block-details[open] summary::after{
  transform: rotate(-135deg) translateY(2px);
}
.entry-content .wp-block-details > :not(summary){
  margin:      0 0 14px;
  padding-top: 2px;
  border-top:  1px solid var(--c-line);
  padding-top: 14px;
  font-size:   16px;
}

/* --------------------------------------------------------------------------
   コード・整形済みテキスト
   -------------------------------------------------------------------------- */
.entry-content .wp-block-code,
.entry-content .wp-block-preformatted{
  margin:        24px 0;
  padding:       16px 18px;
  border:        1px solid var(--c-line);
  border-radius: var(--radius);
  background:    var(--c-bg-sub);
  overflow-x:    auto;
  font-family:   ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:     14px;
  line-height:   1.8;
  color:         var(--c-ink);
}

/* --------------------------------------------------------------------------
   埋め込み（YouTube・X など）
   -------------------------------------------------------------------------- */
.entry-content .wp-block-embed{ margin: 28px 0; }
.entry-content .wp-block-embed__wrapper{ max-width: 100%; }
.entry-content .wp-block-embed.wp-has-aspect-ratio .wp-block-embed__wrapper{ position: relative; }
.entry-content .wp-block-embed iframe{
  max-width:     100%;
  border-radius: var(--radius);
}

/* --------------------------------------------------------------------------
   記事中CTA（Cocoon の登録済みテンプレート）
   マークアップは <div class="cta-btn"><a><span class="bold">…</span></a></div> で、
   色・角丸・padding が a タグの style 属性に直接書かれている。
   インラインスタイルには詳細度では勝てないので、ここだけ !important を使う。

   ブランドガイド 6.1 の Primary（黄 ＋ 黒文字）に合わせる。
   現状は幅いっぱいの紫のベタ帯で、本文中のどのボタンよりも強い見た目だった。

   ※ 将来的にはテンプレート側の style 属性を外すのが本筋。
      アイコン＋文言＋ボタンの細帯にするのは P6（記事内CTA）で扱う。
   -------------------------------------------------------------------------- */
.entry-content .cta-btn{
  display:         flex;
  justify-content: center;
  margin:          32px 0;
}
.entry-content .cta-btn a{
  display:         inline-flex !important;
  align-items:     center;
  justify-content: center;
  min-height:      50px;
  padding:         0 32px !important;
  border-radius:   999px !important;
  background-color: var(--c-accent) !important;
  color:           var(--c-on-accent) !important;
  font-size:       16px;
  font-weight:     700;
  line-height:     1.4;
  text-align:      center;
}
.entry-content .cta-btn a:hover{ background-color: var(--c-accent-deep) !important; }

/* テンプレートの文言は「詳しくはコチラ▶」で、矢印が文字列の一部として入っている。
   CSS では最後の1文字だけを選べないため、字間を少し空けて矢印に余白を持たせる。
   ※ テンプレートから「▶」を外せば、下の .cta-btn a::after で
     きれいな矢印を gap 付きで描ける（そのときは letter-spacing を戻す）。 */
.entry-content .cta-btn a .bold{
  font-weight:    700;
  letter-spacing: .08em;
}

/* P4 で検討した「▶ をCSSの矢印に置き換える案（.has-css-arrow）」は
   採用しなかったため削除。テンプレート側の文字「▶」に letter-spacing で
   間隔を空ける方式を採っている。 */

/* テンプレートの入れ物。中身の空段落が余白を作らないようにする */
.entry-content .template-box{ margin: 32px 0; }
.entry-content .template-box > p:empty,
.entry-content .template-box > p.p1:empty{ display: none; }

/* --------------------------------------------------------------------------
   使わないことにした旧装飾
   今後は使わないが、既存記事に残っている分が浮かないよう配色だけ揃える。
   （.blank-box 黄枠／赤枠、.information-box 水色）
   padding は触らない。Cocoon 側がアイコンぶんの余白を持っているため、
   上書きすると .information-box のⓘアイコンと本文が重なる。
   -------------------------------------------------------------------------- */
.entry-content .blank-box,
.entry-content .information-box{
  margin:        24px 0;
  border-radius: var(--radius);
  font-size:     16px;
  line-height:   1.85;
}
.entry-content .blank-box.bb-red{
  border-color: var(--c-alert-line);
  background:   var(--c-alert-pale);
}
.entry-content .blank-box.bb-yellow{
  border-color: var(--c-line-strong);
  background:   var(--c-bg-sub);
}
.entry-content .information-box{
  border-color: var(--c-brand-line);
  background:   var(--c-brand-pale);
}
/* ⓘアイコン（FontAwesome \f05a）と、その右の区切り線。
   Cocoon 既定はアイコン #87CEFA・罫 #BDE4FC の水色で浮くので紫系へ */
.entry-content .information-box::before{
  color:        var(--c-brand);
  border-right: 1px solid var(--c-brand-line);
}

/* --------------------------------------------------------------------------
   ブログカード（記事内の内部リンク 1018枚・外部リンク 60枚）

   マニュアルサイトと同じ「1行リンク」型に揃える。
   サムネイルは出さず、左に角丸のマーク・右にシェブロンだけを置く。

   ■ 色
   すべてトークン経由にする。色替えの複製サイトは tokens-brand.css だけを
   差し替える約束なので、ここに hex を書かない。
   アイコンは SVG を「マスク（抜き型）」として使い、色は background-color から
   与える。SVG の中の stroke='black' は抜き型を作るためだけのもので、
   画面には出ない（data URI に色を埋め込むと複製サイトで色が変わらなくなる）。

   ■ 詳細度
   Cocoon の指定はすべて (0,1,0) なので、.entry-content を頭に付けた (0,2,0)
   で !important なしで上書きできる。

   ■ .cf との関係
   .blogcard には Cocoon の clearfix クラス .cf が付いていて
   .cf::after{content:"";display:table} が入る。ここでは ::after を
   アイコンとして absolute で作り直すので、flex の項目として数えられない。
   -------------------------------------------------------------------------- */
.entry-content .blogcard{
  /* アイコンの抜き型。色は持たせない */
  --icon-book:     url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 7v14'/%3E%3Cpath d='M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z'/%3E%3C/svg%3E");
  --icon-chevron:  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E");
  --icon-external: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h6'/%3E%3C/svg%3E");

  box-sizing:    border-box;
  min-height:    80px;
  padding:       16px 52px 16px 84px;
  border:        1px solid var(--c-line);
  border-radius: 12px;
  background:    var(--c-bg);
  box-shadow:    0 1px 2px rgba(28, 27, 34, .04),
                 0 8px 20px -14px rgba(28, 27, 34, .22);
  position:      relative;

  /* min-height で余った分を上下へ均等に配るので、文字が上下中央に来る */
  display:         flex;
  flex-direction:  column;
  justify-content: center;

  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

/* サムネイル・抜粋・フッター（サイト名と日付）は出さない */
.entry-content .blogcard-thumbnail,
.entry-content .blogcard-snippet,
.entry-content .blogcard-footer{ display: none; }

.entry-content .blogcard-wrap{
  width:      auto;          /* Cocoon 既定の width:90% を解除 */
  max-width:  600px;
  margin:     2em auto;
}

/* 左のアイコンの地（角丸の四角） */
.entry-content .blogcard::before{
  content:       "";
  position:      absolute;
  left:          20px;
  top:           50%;
  transform:     translateY(-50%);
  width:         48px;
  height:        48px;
  border-radius: 12px;
  background:    var(--c-brand-tint);
}

/* 左のアイコン本体。地の上に重ねる */
.entry-content .blogcard::after{
  content:    "";
  position:   absolute;
  left:       32px;
  top:        50%;
  transform:  translateY(-50%);
  width:      24px;
  height:     24px;
  background-color: var(--c-brand);
  -webkit-mask: var(--icon-book) no-repeat center / 24px 24px;
          mask: var(--icon-book) no-repeat center / 24px 24px;
}

.entry-content .blogcard-content{
  margin-left:   0;          /* Cocoon 既定の margin-left:170px を解除 */
  min-height:    auto;       /* 同 min-height:100px */
  max-height:    none;       /* 同 max-height:140px */
  overflow:      visible;    /* 同 overflow:hidden */
  padding-right: 0;
}

/* 上の小さいラベル */
.entry-content .blogcard-content::before{
  content:        "関連記事";
  display:        block;
  color:          var(--c-brand);
  font-size:      11px;
  font-weight:    700;
  letter-spacing: .04em;
  line-height:    1.5;
  margin-bottom:  2px;
}

/* 右のシェブロン。.blogcard の ::after はアイコンで使っているので
   .blogcard-content の ::after に置く（位置の基準は .blogcard）。 */
.entry-content .blogcard-content::after{
  content:    "";
  position:   absolute;
  right:      20px;
  top:        50%;
  transform:  translateY(-50%);
  width:      20px;
  height:     20px;
  background-color: var(--c-brand);
  -webkit-mask: var(--icon-chevron) no-repeat center / 20px 20px;
          mask: var(--icon-chevron) no-repeat center / 20px 20px;
  transition: right .2s ease;
}

.entry-content .blogcard-title{
  margin:         0;
  color:          var(--c-ink);
  font-size:      15px;
  font-weight:    700;
  line-height:    1.5;
  letter-spacing: 0;
  text-align:     left;
  transition:     color .2s ease;
}

/* ホバー：枠と文字がブランド色になり、少し浮いてシェブロンが右へ動く */
.entry-content .blogcard-wrap:hover .blogcard{
  border-color: var(--c-brand);
  /* 1行目は color-mix 非対応ブラウザ用の控え。対応ブラウザは2行目で上書きされる */
  box-shadow:   0 6px 18px -10px rgba(28, 27, 34, .30);
  box-shadow:   0 6px 18px -10px color-mix(in srgb, var(--c-brand) 45%, transparent);
  transform:    translateY(-2px);
}
.entry-content .blogcard-wrap:hover .blogcard-title{ color: var(--c-brand); }
.entry-content .blogcard-wrap:hover .blogcard-content::after{ right: 16px; }

/* 外部サイトへのカードは行き先が違うので、ラベルとアイコンを分ける */
.entry-content .external-blogcard .blogcard-content::before{ content: "参考リンク"; }
.entry-content .external-blogcard::after{
  -webkit-mask-image: var(--icon-external);
          mask-image: var(--icon-external);
}

/* --------------------------------------------------------------------------
   SP（834px以下）
   本文を 16px に下げたぶん、ボックスや手順リストも一段下げて揃える。
   -------------------------------------------------------------------------- */
@media screen and (max-width: 834px){
  .entry-content .tab-caption-box{ margin: 24px 0; }
  .entry-content .tab-caption-box-label{ padding: 8px 14px; font-size: 12.5px; }
  .entry-content .tab-caption-box-content{ padding: 14px 16px; font-size: 16px; }

  .entry-content p.is-style-sticky-blue{ padding: 12px 14px; font-size: 15px; }

  .entry-content ol.wp-block-list.has-background > li{
    padding:   12px 14px 12px 48px;
    font-size: 16px;
  }
  .entry-content ol.wp-block-list.has-background > li::before{
    left: 12px;
    top:  12px;
  }
  .entry-content ul.wp-block-list.has-background{ padding: 14px 16px 14px 34px; }

  .entry-content .wp-block-table table{ font-size: 14px; }
  .entry-content .wp-block-table th,
  .entry-content .wp-block-table td{ padding: 8px 10px; }

  .entry-content .wp-block-quote{ padding: 14px 16px; font-size: 15px; }

  .entry-content .wp-block-button__link{ min-height: 50px; font-size: 15px; }

  /* 2カラムは縦積み */
  .entry-content .wp-block-columns{ gap: 16px; }

  .entry-content .wp-block-details summary{ font-size: 15px; }
  .entry-content .wp-block-details > :not(summary){ font-size: 15px; }

  .entry-content .wp-block-code,
  .entry-content .wp-block-preformatted{ padding: 14px; font-size: 13px; }

  /* ブログカード。アイコンと余白を一段小さくする */
  .entry-content .blogcard{
    min-height: 72px;
    padding:    14px 44px 14px 70px;
  }
  .entry-content .blogcard::before{ left: 16px; width: 40px; height: 40px; }
  .entry-content .blogcard::after{
    left:   26px;
    width:  20px;
    height: 20px;
    -webkit-mask-size: 20px 20px;
            mask-size: 20px 20px;
  }
  .entry-content .blogcard-content::after{
    right:  16px;
    width:  18px;
    height: 18px;
    -webkit-mask-size: 18px 18px;
            mask-size: 18px 18px;
  }
  .entry-content .blogcard-title{ font-size: 14px; }
}
