/* ===== Concrete Image Slider (ResponsiveSlides) ===== */

/* 1) スライダーをナビ(.container)幅に合わせて中央寄せ */
ul[id^="ccm-image-slider-"].rslides {
  width: 100% !important;
  max-width: 1170px !important;  /* PCのcontainer相当 */
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 15px !important;
  padding-right: 15px !important;

  /* 2) まず基本は「画像に合わせて高さ自動」 */
  height: auto !important;
  overflow: hidden !important;
}

/* 画像は比率維持（切らない） */
ul[id^="ccm-image-slider-"].rslides img,
ul[id^="ccm-image-slider-"].rslides picture {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: initial !important;
}

/* （任意）PCだけ高さ上限を付けたい場合：枠を高くし過ぎない */
@media (min-width: 992px) {
  ul[id^="ccm-image-slider-"].rslides {
    max-height: 650px !important; /* 好みで調整 */
  }
  ul[id^="ccm-image-slider-"].rslides img,
  ul[id^="ccm-image-slider-"].rslides picture {
    max-height: 650px !important;
    object-fit: contain !important;
  }
}

/* スマホは絶対に高さ固定しない（空白巨大化防止） */
@media (max-width: 768px) {
  ul[id^="ccm-image-slider-"].rslides {
    height: auto !important;
    max-height: none !important;
  }
}

/* Elemental のアクセント背景エリアを無効化 */
.ccm-page .area-content-accent {
  display: none !important;
}

/* 表示モードだけに効かせるテスト */
body:not(.ccm-edit-mode) .ccm-page .area-content-accent {
  outline: 10px solid red !important;
}



/* ===== loom-notice アコーディオン最終版 ===== */

.loom-notice {
  border: 1px solid #ddd;
  margin: 10px 0;
  background: #fff;
}

/* summaryのデフォルトマーカー(= ? )を徹底的に消す */
.loom-notice > summary {
  cursor: pointer;
  font-weight: 700;
  padding: 12px 0;
  outline: none;

  list-style: none !important;      /* 古いブラウザ対策 */
  display: block;                   /* 念のため */
}

.loom-notice > summary::-webkit-details-marker {
  display: none !important;         /* Chrome/Safari */
}

.loom-notice > summary::marker {
  content: "" !important;           /* Firefox */
  font-size: 0 !important;
}

/* ===== loom-notice アコーディオン 最終・安定版 ===== */

.loom-notice {
  border: 1px solid #ddd;
  margin: 10px 0;
  background: #fff;
}

/* summary 本体 */
.loom-notice > summary {
  position: relative;
  cursor: pointer;
  font-weight: 700;
  padding: 12px 0 12px 28px; /* 左にアイコン分の余白 */
  list-style: none !important;
  outline: none;
  display: block;
}

/* ブラウザ標準マーカー完全無効化 */
.loom-notice > summary::-webkit-details-marker {
  display: none !important;
}
.loom-notice > summary::marker {
  content: "" !important;
  font-size: 0 !important;
}

/* ?（閉じている時） */
.loom-notice > summary::before {
  content: "?";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

/* ▼（開いている時） */
.loom-notice[open] > summary::before {
  content: "▼";
}

/* 本文 */
.loom-notice__body {
  padding-bottom: 12px;
  line-height: 1.7;
}

.loom-notice__body .container {
  padding-top: 10px;
}

/* ===== loom-notice（安定版：矢印はUnicodeで指定） ===== */

.loom-notice {
  border: 1px solid #ddd;
  margin: 10px 0;
  background: #fff;
}

.loom-notice > summary {
  position: relative;
  cursor: pointer;
  font-weight: 700;
  padding: 12px 0 12px 28px; /* 左にアイコン分 */
  list-style: none !important;
  outline: none;
  display: block;
}

/* ブラウザ標準マーカーを消す */
.loom-notice > summary::-webkit-details-marker { display: none !important; }
.loom-notice > summary::marker { content: "" !important; }

/* ここが重要：?/▼ を “文字” ではなくUnicodeコードで */
.loom-notice > summary::before {
  content: "\25B6"; /* ? */
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.loom-notice[open] > summary::before {
  content: "\25BC"; /* ▼ */
}

.loom-notice__body {
  padding: 0 0 12px 0;
  line-height: 1.7;
  margin-top: 10px;
}

.loom-notice__body {
  transition: all 0.2s ease;
}

.loom-notice[open] {
  background: #fafafa;
}