@charset "UTF-8";

/* ---------------------------------------------------------------------------
   sidebar-posts.css
   出所: 旧 WPCode スニペット316「サイドバー」の $css。内容は変更していない。
   --------------------------------------------------------------------------- */

/* ===== Jaycee Sidebar Posts (layout v2) ===== */
.jaycee-sb-wrap{ width:100% !important; }

/* Elementor等が混入する余計なp/br対策（崩れ原因潰し） */
.jaycee-sb-wrap p{
  margin:0 !important;
  margin-block-start:0 !important;
  margin-block-end:0 !important;
  padding:0 !important;
}
.jaycee-sb-wrap p:empty{ display:none !important; }
.jaycee-sb-wrap br{ display:none !important; }

/* リスト */
.jaycee-sb-list{
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
}

/* 1アイテム（画像＋本文、下に開催日ブロックを“全幅”で配置） */
.jaycee-sb-item{
  padding:12px 0 !important;
  border-bottom:1px solid #e9e9e9 !important;
}
.jaycee-sb-item:last-child{ border-bottom:none !important; }

/* 上段（画像＋本文） */
.jaycee-sb-top{
  display:flex !important;
  align-items:flex-start !important;
  gap:14px !important;
}

/* 縦長サムネ（約 80x111） */
.jaycee-sb-thumb{
  flex:0 0 80px !important;

  border-radius:8px !important;
  overflow:hidden !important;
  background:#f2f2f2 !important;
  display:block !important;
}
.jaycee-sb-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important; /* デフォは cover */
  display:block !important;
}

/* news時：contain＋余白背景 #F2F2F2 */
.jaycee-sb-item.is-news .jaycee-sb-thumb{
  background:#F2F2F2 !important;
}
.jaycee-sb-item.is-news .jaycee-sb-thumb img{
  object-fit:contain !important;
  background:#F2F2F2 !important;
}

/* 本文 */
.jaycee-sb-main{
  flex:1 1 auto !important;
  min-width:0 !important;
}

.jaycee-sb-date{
  font-size:12px !important;
  color:#777 !important;
  line-height:1.2 !important;
  margin:0 0 8px 0 !important;
}

.jaycee-sb-title{
  margin:0 !important;
  font-size:13px !important;
  font-weight:800 !important;
  line-height:1.35 !important;
  color:#111 !important;

  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  overflow:hidden !important;
}
.jaycee-sb-title a{
  color:inherit !important;
  text-decoration:none !important;
}
.jaycee-sb-title a:hover{ text-decoration:underline !important; }

/* カテゴリバッジ：枠＋文字色のみ（指定色） */
.jaycee-sb-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  margin-top:12px !important;
  padding:6px 16px !important;
  border-radius:10px !important;

  font-size:11px !important;
  font-weight:600 !important;
  line-height:1 !important;

  background:#fff !important;
  border:2px solid currentColor !important;
  white-space:nowrap !important;

  /* ★ここが原因になりやすいので「固定色」はやめる */
  color:inherit !important;
}

/* ===== カテゴリー色（ここで確実に指定色にする） ===== */
.jaycee-sb-item.is-news  .jaycee-sb-badge{ color:#888888 !important; }
.jaycee-sb-item.is-annai .jaycee-sb-badge{ color:#0097D7 !important; }
.jaycee-sb-item.is-hokoku .jaycee-sb-badge{ color:#EDBE38 !important; }

/* ===== 開催日ブロック（全幅 / 枠線で囲む / 開催日背景 #F2F2F2） ===== */
.jaycee-sb-event{
  width:100% !important;
  margin-top:12px !important;

  border:2px solid #cccccc !important;
  border-radius:10px !important;
  overflow:hidden !important;

  /* border-top は削除（指定） */
  border-top:2px solid #cccccc !important;
}

.jaycee-sb-event-label{
  width:100% !important;
  text-align:center !important;
  font-size:10px !important;
  font-weight:400 !important;
  color:#333 !important;

  background:#F2F2F2 !important;   /* 開催日背景 */
  padding:5px 5px !important;
}

.jaycee-sb-event-pill{
  width:100% !important;
  display:block !important;
  text-align:center !important;
  font-size:10px !important;
  font-weight:400 !important;
  color:#333 !important;

  background:#fff !important;      /* 開催日時背景は白 */
  padding:5px 5px !important;
}

/* SP微調整（カード内が詰まりすぎないように） */
@media (max-width:767px){
  .jaycee-sb-top{ gap:12px !important; }
  .jaycee-sb-thumb{
    width:76px !important;
    height:106px !important;
    flex-basis:76px !important;
  }
  .jaycee-sb-title{ font-size:16px !important; }
  .jaycee-sb-badge{ font-size:15px !important; padding:6px 14px !important; }
  .jaycee-sb-event-label{ font-size:13px !important; padding:9px 10px !important; }
  .jaycee-sb-event-pill{ font-size:15px !important; padding:11px 10px !important; }
}