@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/* ▼埋め込み要素の高さを確保してCLSを防ぐ */
.entry-content iframe,
.wp-block-embed__wrapper iframe {
  aspect-ratio: 16/9;
  width: 100%;
  height: auto;
  display: block;
}

/* ▼広告枠の高さを先取り（必要に応じて調整） */
.ad-fixed {
  min-height: 300px;
}
/* ▼ヘッダー・通知バー・アピールエリアの高さを先取り */
.header-container { min-height: 60px; }   /* 固定ヘッダーを使う場合 */
.notice, .notice-area { min-height: 40px; } /* 通知バーがある場合 */
.appeal, .appeal-in { min-height: 80px; }   /* アピールエリアがある場合 */

/* ▼目次・ブログカードの最低高を確保 */
.toc { min-height: 120px; }        /* 目次ブロック */
.blogcard { min-height: 120px; }   /* ブログカード */
.blogcard-thumbnail img {
  aspect-ratio: 16/9;
  width: 100%;
  height: auto;
  display: block;
}

/* ▼記事中の画像のズレ防止 */
.entry-content img { display: block; }