/* ======================================================
   1) フロントページの幅制限を解除
====================================================== */
body.home .wrap,
body.home .content,
body.home .content-in,
body.home #main {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.home #content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* ======================================================
   2) カテゴリーページもフル幅
====================================================== */
body.home .container,
body.category-fruits_front .container,
body.category-fruits_magazine .container,
body.category-fruits_news .container,
body.category-fruits_pilot .container {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ======================================================
   3) Cocoon の Header Wrap を完全無効化（安全版）
====================================================== */

/* wrap が幅制限をかけるので殺す */
#header-container .wrap,
header .wrap {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Cocoon の header-in を Tailwind 仕様に固定（最重要） */
header#header-container .header-in {
  display: flex !important;
  flex-direction: row !important;   /* ← 横並び強制 */
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding-left: 1rem !important;   /* Tailwind と揃える */
  padding-right: 1rem !important;
}

/* header 全体をフル幅に */
header#header-container {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* navi コンテナのみフル幅化（必要な場合だけ） */
#navi,
#navi-in,
#navi-in.wrap {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ===============================
   固定ページを確実にフル幅化
   =============================== */
body.page #content,
body.page #content-in,
body.page #main,
body.page #main .wrap,
body.page .wrap {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Cocoon のページ内余白を打ち消す */
body.page .container,
body.page .content,
body.page .content-in {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}