@charset "UTF-8";
/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    0.0.6
*/

/************************************
** 基本設定・フォント
************************************/
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Noto+Sans+JP:wght@400;500;700&display=swap');

html { scroll-behavior: smooth; }
body {
  font-family: 'Noto Sans JP','Inter',system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#2b2b2b;
  background:#fafafa;
  line-height:1.85;
}
a { color:#4E8098; text-decoration:none; }
a:hover { opacity:.85; transition:opacity .2s; }

/************************************
** Cocoonの初期装飾をクリーンアップ
************************************/
.wrap, .container, .content { max-width:1080px; margin:0 auto; }
.entry-title, .post-title, h1 {
  font-weight:700;
  letter-spacing:.02em;
}
article h2 {
  font-weight:700;
  font-size:1.45rem;
  margin:2.2rem 0 1rem;
  border-left:6px solid #4E8098;
  padding-left:.6rem;
}
article h3 {
  font-weight:700;
  font-size:1.15rem;
  margin:1.6rem 0 .6rem;
  border-bottom:1px solid #eee;
  padding-bottom:.4rem;
}

/************************************
** ヘッダー／ナビゲーション
************************************/
.header, .site-header, .navi {
  background:#ffffff;
  box-shadow:0 1px 8px rgba(0,0,0,.04);
}
.logo { padding:.6rem 0; }
.header .navi-in > ul > li > a {
  padding:.9rem 1rem;
  font-weight:600;
}
.header .navi-in > ul > li > a:hover {
  background:#f4f8f9;
  border-radius:8px;
}

/************************************
** ヒーローエリア
************************************/
.section-hero {
  background:#ffffff;
  border-radius:18px;
  padding:48px 28px;
  margin:28px 0 20px;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  display:flex;
  gap:24px;
  align-items:center;
  overflow:hidden;
}
.section-hero .hero-copy h1 {
  margin:0 0 8px;
  font-size:1.8rem;
}
.section-hero .hero-copy p {
  margin:0 0 18px;
  color:#4b5563;
}
.section-hero .hero-cta .btn-primary {
  background:#4E8098;
  color:#fff;
  padding:12px 18px;
  border-radius:10px;
  font-weight:700;
  display:inline-block;
}
.section-hero .hero-illus img {
  width:320px;
  height:auto;
  border-radius:14px;
  object-fit:cover;
}
@media(max-width:860px){
  .section-hero { flex-direction:column; text-align:center; }
  .section-hero .hero-illus img { width:100%; }
}

/************************************
** カテゴリーカード（病気/手術/予防/保険）
************************************/
.grid-cards {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin:18px 0 28px;
}
.card {
  background:#fff;
  border-radius:14px;
  padding:16px;
  box-shadow:0 6px 16px rgba(0,0,0,.06);
}
.card .card-title {
  font-weight:700;
  margin:0 0 6px;
}
.card .card-meta {
  color:#6b7280;
  font-size:.92rem;
}
.card .card-link {
  display:inline-block;
  margin-top:10px;
  font-weight:600;
}
@media(max-width:980px){ .grid-cards{ grid-template-columns:repeat(2,1fr);} }
@media(max-width:560px){ .grid-cards{ grid-template-columns:1fr; } }

/************************************
** 記事カード（entry-card）デザイン調整
************************************/
.entry-card-wrap, .entry-card, .related-entry-card {
  border-radius:14px;
  background:#fff;
  box-shadow:0 4px 14px rgba(0,0,0,.06);
  overflow:hidden;
}
.entry-card .entry-card-title {
  font-weight:700;
  line-height:1.5;
}
.entry-card-thumb { border-radius:0; }
.pagination a, .page-numbers a, .pager-links a {
  border-radius:8px;
}

/************************************
** CTAボタン
************************************/
.btn, .button, .btn-primary {
  background:#4E8098;
  color:#fff !important;
  border-radius:10px;
  padding:.75rem 1.1rem;
  font-weight:700;
}
.btn-outline {
  background:#fff;
  color:#4E8098;
  border:2px solid #4E8098;
  border-radius:10px;
  padding:.65rem 1rem;
  font-weight:700;
}

/************************************
** 表・注意ボックス
************************************/
.entry-content table {
  width:100%;
  background:#fff;
  border-collapse:separate;
  border-spacing:0;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.entry-content table th {
  background:#f3f7f9;
  font-weight:700;
  text-align:left;
}
.notice, .is-info, .is-warning {
  padding:14px 16px;
  border-radius:12px;
  margin:14px 0;
  background:#eef7fb;
  border:1px solid #d7e9f4;
}
.is-warning {
  background:#fff7ed;
  border-color:#fde2c5;
}

/************************************
** パンくず・フッター
************************************/
.breadcrumb {
  font-size:.92rem;
  color:#6b7280;
}
.breadcrumb a { color:#6b7280; }
.footer, .site-footer {
  background:#ffffff;
  color:#6b7280;
  border-top:1px solid #eee;
}
.footer a { color:#4E8098; }

/************************************
** 広告整形
************************************/
.ad-area, .ad-label, .adsense, .ad {
  border-radius:12px;
  overflow:hidden;
}
.ad-area iframe { border-radius:12px; }

/************************************
** ユーティリティ
************************************/
.mt-0{margin-top:0!important;}
.mt-16{margin-top:16px!important;}
.mb-0{margin-bottom:0!important;}
.mb-24{margin-bottom:24px!important;}
.p-0{padding:0!important;}
.text-center{text-align:center!important;}

/************************************
** 固定ページ・フロント非表示設定（既存）
************************************/
.home.page .entry-title,
.home.page .sns-share,
.home.page .sns-follow,
.home.page .post-date,
.home.page .post-update,
.home.page .author-info,
.home.page .toc {
  display:none;
}
.page .date-tags,
.page .author-info {
  display:none;
}

/************************************
** レスポンシブ補正
************************************/
@media screen and (max-width: 1240px){}
@media screen and (max-width: 1030px){}
@media screen and (max-width: 768px){}
@media screen and (max-width: 480px){}


/* === Category cards: Cocoon干渉ブロック＋横並び修正 === */
.ic-cards{
  display:flex; flex-wrap:wrap; gap:20px;
  margin:20px 0 40px;
}
.ic-card{
  flex:1 1 calc(25% - 20px);   /* 4列基準 */
  min-width:260px;
  background:#fff; border-radius:14px; height:100%;
  box-shadow:0 6px 16px rgba(0,0,0,.06);
  overflow:hidden;
}
/* aの既定スタイルを完全リセット */
.ic-card > a{
  display:flex; flex-direction:column; height:100%;
  text-decoration:none; color:inherit; padding:16px;
}
/* Cocoonの .entry-content a {display:block} 等の上書き対策 */
.entry-content .ic-card > a{ display:flex !important; }

/* テキスト */
.ic-card__title{ font-weight:700; margin:0 0 6px; color:#222; }
.ic-card__meta{ color:#6b7280; font-size:.95rem; line-height:1.65; }
.ic-card__link{ margin-top:10px; font-weight:600; color:#4E8098; }

/* ホバー */
.ic-card:hover{ transform:translateY(-3px); transition:transform .2s ease; }

/* レスポンシブ */
@media (max-width: 980px){
  .ic-card{ flex:1 1 calc(50% - 20px); }   /* 2列 */
}
@media (max-width: 560px){
  .ic-card{ flex:1 1 100%; }               /* 1列 */
}

/* 不要装飾の殺し屋：カード内の::before/::after等を無効化 */
.ic-card::before, .ic-card::after,
.ic-card *::before, .ic-card *::after{ content:none !important; background:none !important; }

/* Cocoonのa周りの余白・枠線系を局所無効化（保険） */
.entry-content .ic-cards a{ border:none !important; padding:0; }


/* ===== ヘッダータイトル周辺の余白削除 ===== */
.header, .site-header {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

.site-name {
  margin: 0 !important;
  padding: 4px 0 !important;   /* 少しだけ余裕 */
  font-size: 1.1rem !important;
  font-weight: 700;
  line-height: 1.3;
}

.site-description {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.1;
}

/* メニューとの間の段差を殺す */
.header .navi, .navi {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 背景と高さ調整 */
.header-container {
  min-height: auto !important;
  background: #fff !important;
}


body, .wrap { margin-top: 0 !important; }

/* ===== 上部の余白 完全削除パッチ ===== */
body, html {
  margin: 0 !important;
  padding: 0 !important;
}

.header-container,
.header,
.site-header {
  margin: 0 !important;
  padding: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  border: none !important;
}

.header-in,
.header-in-wrap,
.header-inner,
.header-container .wrap {
  margin: 0 !important;
  padding: 0 !important;
}

.site-name {
  margin: 0 !important;
  padding: 4px 0 !important;
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1.3;
}

.navi,
.global-nav,
.header .navi {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* Cocoonが出す「ヘッダー背景」「サイトヘッダー下マージン」を潰す */
.header-image,
.header-image-content,
.header-bottom,
.site-header-bottom {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 最上部の白帯を最優先で潰す総仕上げパッチ */
.header, .site-header, .header-container,
.header-in, .header-in-wrap,
.navi, .global-nav, .header .navi {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* ナビ直下の隙間をゼロ */
.navi-in, .global-nav .navi-in { margin: 0 !important; padding: 0 !important; }

/* 本文ラッパの“上だけ”を完全に詰める */
#main, .main, .container, .content, .content-in,
.entry, .entry-content, .l-content, .wrap {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* セクション先頭を引き上げ（安全幅） */
.entry-content > *:first-child { margin-top: 0 !important; }
.section-hero { margin-top: 0 !important; }

/* Cocoonが出すヘッダー下の飾り（あれば）を殺す */
.site-header-bottom, .header-bottom, .header-image, .header-image-content {
  display: none !important; height: 0 !important; margin: 0 !important; padding: 0 !important;
}

/* それでも2〜6px残る場合の最終手段：ヒーローを微マイナスで引き上げ */
.section-hero { margin-top: -6px !important; }  /* まだ隙間が見えるなら -8px までOK */