@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){
  /*必要ならばここにコードを書く*/
}

/* ---- mobile wrappers normalize (match sub site) ---- */
@media screen and (max-width: 767px) {
  .container,
  .wrap,
  .content,
  .content-in,
  .main,
  .entry-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;   /* サブと同じ：左右0 */
    padding-right: 0 !important;  /* サブと同じ：左右0 */
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box;
  }
}

/* ==== FORCE: Mobile side spacing unify (match sub) ==== */
@media (max-width: 767px){

  /* WPのグローバル余白（ブロックテーマ系の変数）を潰す保険 */
  :root{
    --wp--style--root--padding-left: 0 !important;
    --wp--style--root--padding-right: 0 !important;
  }
  .wp-site-blocks{ padding-left:0 !important; padding-right:0 !important; }

  /* Cocoon系ラッパーを総ざらいで0～フル幅に固定 */
  body #container, body .container,
  body .wrap,
  body #content, body .content, body .content-in,
  body .main, body #main,
  body .article, body .entry,
  body .entry-content{
    width:100% !important;
    max-width:100% !important;
    padding-left:0 !important;
    padding-right:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box;
  }

  /* ブロック系の内側余白＆横はみ出しもゼロに */
  body .wp-block-group__inner-container,
  body .wp-block-cover__inner-container{
    padding-left:0 !important; padding-right:0 !important;
    margin-left:0 !important;  margin-right:0 !important;
  }

  /* 幅を広げがちな代表ブロックを抑制 */
  body .alignwide, body .alignfull,
  body .wp-block-columns, body figure.wp-block-image{
    max-width:100% !important; width:100% !important;
    margin-left:0 !important;  margin-right:0 !important;
  }
}

/* PCだけ本文をフル幅にしたい場合（すでに設定済みの再掲） */
@media (min-width: 769px){
  .single-post .entry-content{ max-width:none; width:100%; }
}

/* ==== Mobile side spacing: 10px & 正しく中央に ==== */
@media (max-width: 767px){

  /* WPの全体余白 変数は念のためゼロ化 */
  :root{
    --wp--style--root--padding-left: 0 !important;
    --wp--style--root--padding-right: 0 !important;
  }
  .wp-site-blocks{ padding-left:0 !important; padding-right:0 !important; }

  /* ラッパーは 100% + padding-inline、中央寄せ（100vwは使わない） */
  #container, .container, .wrap, #content, .content, .content-in,
  #main, .main, article, .article, .post, .page, .entry {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: max(10px, env(safe-area-inset-left)) !important;
    padding-right: max(10px, env(safe-area-inset-right)) !important;
    box-sizing: border-box;
  }

  /* 内側の二重余白は打消し */
  .entry-content,
  .wp-block-group__inner-container,
  .wp-block-cover__inner-container{
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* はみ出しがちな要素の幅を親に収める */
  .alignwide, .alignfull, .wp-block-columns, figure.wp-block-image,
  img, iframe, video{
    max-width: 100% !important;
    width: 100% !important;
  }
}

/* ==== スマホ時の見出し・タイトルを18pxに統一 ==== */
@media (max-width: 767px) {
  h1, h2, h3, h4, h5, h6,
  .entry-title {
    font-size: 18px !important;
    line-height: 1.6; /* 読みやすさ調整、任意 */
  }
}