/* ==========================================
   Layout.css
   ページ全体の構造・幅・配置だけを管理
========================================== */

/* ===== 全体ラッパー ===== */
body {
  overflow-x: hidden;
}

/* ===== メインコンテンツ領域 ===== */
#content,
#main {
  width: 100%;
  margin: 0;
  padding: 0;
}

/* ===== コンテンツの中央寄せ（本文） ===== */
.content-in,
.entry-content,
.archive-entry-content {
  max-width: 900px;
  margin: 0 auto;
  padding: 24px;
  box-sizing: border-box;
}

/* ===== 一覧ページ（カード並び前提） ===== */
.archive .content-in {
  max-width: 1200px;
}

/* ===== 2カラム構成（必要な場合） ===== */
.has-sidebar {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 32px;
}

/* ===== サイドバー ===== */
.sidebar {
  width: 100%;
}

/* ===== フル幅セクション（ヒーロー等） ===== */
.full-width,
.section-full {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* サイト内のテキストリンクのホバー色を統一 */
a {
    transition: color 0.3s ease;
}

a:hover {
    color: #88B04B !important; /* brand-green のカラーコード */
}

.entry-content,
.article .entry-content {
  background-color: white;
}

/* ==============================================
   アーカイブページのサイドバー重複対策
   ============================================== */

/* 自作したサイドバー（#my-custom-sidebar）は表示したままにする */
#my-custom-sidebar {
   display: block !important;
}

/* タクソノミー「kininaru」ページの標準サイドバーを消して、自作サイドバーのみ表示
   （topic から kininaru に変更） */
.tax-kininaru #sidebar {
   display: none !important;
}

.tax-kininaru #my-original-sidebar {
   display: block !important;
}

/* きになるマガジン・ニュースページの標準サイドバーを消して、自作サイドバーのみ表示 */
/* Cocoon標準のサイドバー（#sidebarまたは.content-in直下以外の.sidebar）を非表示 */
.page-template-page-kininaru-magazine #sidebar,
.page-template-page-kininaru-news #sidebar,
.page-slug-kininaru-magazine #sidebar,
.page-slug-kininaru-news #sidebar,
.page-template-page-kininaru-magazine aside#sidebar,
.page-template-page-kininaru-news aside#sidebar,
.page-slug-kininaru-magazine aside#sidebar,
.page-slug-kininaru-news aside#sidebar,
/* Cocoonの2カラムレイアウトのサイドバーラッパー */
.page-template-page-kininaru-magazine .content-in > .sidebar,
.page-template-page-kininaru-news .content-in > .sidebar,
.page-slug-kininaru-magazine .content-in > .sidebar,
.page-slug-kininaru-news .content-in > .sidebar,
.page-template-page-kininaru-magazine #content-in > #sidebar,
.page-template-page-kininaru-news #content-in > #sidebar,
.page-slug-kininaru-magazine #content-in > #sidebar,
.page-slug-kininaru-news #content-in > #sidebar,
/* Cocoonのwrap内のサイドバー */
.page-template-page-kininaru-magazine .wrap > #sidebar,
.page-template-page-kininaru-news .wrap > #sidebar,
.page-slug-kininaru-magazine .wrap > #sidebar,
.page-slug-kininaru-news .wrap > #sidebar,
.page-template-page-kininaru-magazine .wrap .sidebar:not(#my-original-sidebar .sidebar-main):not(#my-original-sidebar .sidebar-scroll),
.page-template-page-kininaru-news .wrap .sidebar:not(#my-original-sidebar .sidebar-main):not(#my-original-sidebar .sidebar-scroll),
.page-slug-kininaru-magazine .wrap .sidebar:not(#my-original-sidebar .sidebar-main):not(#my-original-sidebar .sidebar-scroll),
.page-slug-kininaru-news .wrap .sidebar:not(#my-original-sidebar .sidebar-main):not(#my-original-sidebar .sidebar-scroll) {
   display: none !important;
}

/* カスタムサイドバーは常に表示 */
.page-template-page-kininaru-magazine #my-original-sidebar,
.page-template-page-kininaru-news #my-original-sidebar,
.page-slug-kininaru-magazine #my-original-sidebar,
.page-slug-kininaru-news #my-original-sidebar {
   display: block !important;
}

/* カスタムサイドバー内の要素は確実に表示 */
#my-original-sidebar .sidebar-main,
#my-original-sidebar .sidebar-scroll {
   display: block !important;
}

/* no-sidebarクラスがある場合、Cocoonの標準サイドバーを非表示 */
body.no-sidebar #sidebar,
body.no-sidebar aside#sidebar,
body.no-sidebar .content-in > #sidebar,
body.no-sidebar #content-in > #sidebar {
   display: none !important;
}

/* col1クラスでもサイドバーを非表示（Cocoon対策） */
body.col1 #sidebar,
body.col1 aside#sidebar {
   display: none !important;
}

.eye-catch-wrap{
  justify-content: center;
}
.eye-catch {
  width: 100%;
}
.eye-catch img,
.eye-catch amp-img{
  width: 100%;
  min-width: 100%;
  display: block;
}

/* ==============================================
   レスポンシブ改行クラス（Tailwindブレイクポイント準拠）
   ============================================== */

/* .sp-br: スマホのみ改行（768px未満で表示） */
.sp-br {
  display: none;
}
@media (max-width: 767px) {
  .sp-br {
    display: block;
  }
}

/* .md-br: タブレット以下で改行（1024px未満で表示） */
.md-br {
  display: none;
}
@media (max-width: 1023px) {
  .md-br {
    display: block;
  }
}

/* .pc-br: PC以上で改行（1024px以上で表示） */
.pc-br {
  display: none;
}
@media (min-width: 1024px) {
  .pc-br {
    display: block;
  }
}

html {
  font-size: 120%; /* 全体を1.1倍（約17.6px相当）に大きくする */
}