@charset "utf-8";
/* 目次 */
.p-toc.-border {
  padding: 1rem 0.5em !important;
}

/* hタグ */
h2 {
  font-size: 1.6rem !important;
  background-color: #857436 !important;
  color: #fff !important;
  padding: 0.5em 0 !important;
  width: 100vw !important;
  margin-left: -4vw !important;
}
h3 {
  font-size: 1.4rem !important;
}
@media (min-width: 960px) {
  h2 {
    margin-left: -16px !important;
    width: calc(100% + 32px) !important;
  }
}

/* ランキングのあしらい */
.ranking-ashirai1 span.swl-bg-color,
.ranking-ashirai2 span.swl-bg-color,
.ranking-ashirai3 span.swl-bg-color {
  padding: 0.4em 0.8em !important;
  border-radius: 6px !important;
}
.ranking-ashirai1 span.swl-bg-color {
  background-color: #fbc125 !important;
  color: #000000 !important;
}
.ranking-ashirai2 span.swl-bg-color {
  background-color: #a9a9a9 !important;
}
.ranking-ashirai3 span.swl-bg-color {
  background-color: #c59b6d !important;
}

/* フローティングバナーとフッター直前CTAの非表示 */
@media (min-width: 960px) {
  .eeat-content {
    font-size: 1.1em !important;
  }
  .eeat-name {
    font-size: 1.1rem !important;
  }
}

.p-blogParts[data-partsid="55"],
.p-blogParts[data-partsid="1115"] {
  display: none;
}
#footer {
  margin-bottom: 0 !important;
}

/* 監修者・著者ブロック自体のサイズを絞る */
.eeat-content {
  padding: 0.5rem 1rem !important;
}
.eeat-content figcaption {
  background-color: #313131;
  color: #ffffff;
  height: 1.8em;
  border-bottom: 3px solid #f2b50d;
  padding-top: 2px;
  position: relative;
  top: -0.75rem;
  margin-bottom: -1rem;
  opacity: 1;
  font-size: 0.8rem !important;
}
.eeat-content figcaption:before,
.eeat-content figcaption:after {
  border-style: solid;
  content: "";
  position: absolute;
  top: 0;
}
.eeat-content figcaption:before {
  border-color: transparent transparent transparent #f8f5ea;
  border-width: 0.74rem 0 0.74rem 0.25rem;
  left: 0;
}
.eeat-content figcaption:after {
  border-color: transparent #f8f5ea transparent transparent;
  border-width: 0.74rem 0.25rem 0.74rem 0;
  right: 0;
}
.eeat-name {
  margin-bottom: 0.25rem !important;
}
[data-partsid="6674"],
[data-partsid="6646"],
[data-partsid="6648"] {
  margin-bottom: 0.5em !important;
}

/* --- ベース設定（全デバイス共通） --- */
/* チェックボックスは常に非表示 */
.read-more-state {
  display: none;
}
/* PCなどではボタン（ラベル）を消しておく */
.read-more-trigger {
  display: none;
}

/* --- ▼ 599px以下（スマホ）の時だけ適用 ▼ --- */
@media screen and (max-width: 599px) {
  /* 初期状態（閉じている時）の設定 */
  .read-more-wrap .eeat-content {
    height: 7rem; /* 高さ制限 */
    overflow: hidden; /* はみ出しを隠す */
    position: relative;
    transition: height 0.5s ease;
  }

  /* グラデーション（ボカシ） */
  .read-more-wrap .eeat-content::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4rem;
    background: linear-gradient(transparent, #fff);
    pointer-events: none;
    opacity: 1;
    transition: opacity 0.5s;
  }

  /* ボタン（ラベル）を表示させてスタイリング */
  .read-more-trigger {
    display: block;
    color: #0073e6;
    font-weight: bold;
    font-size: 0.8rem;
    position: absolute;
    bottom: 0.25rem;
    right: 0.25rem;
    background-color: #fff;
    padding: 0 0.5rem;
  }
  .read-more-trigger::after {
    content: "...続きを読む";
  }

  /* --- クリックして開いた時の挙動 --- */

  /* コンテンツを全表示 */
  .read-more-state:checked ~ .eeat-content {
    height: auto;
  }

  /* グラデーションを消す */
  .read-more-state:checked ~ .eeat-content::before {
    opacity: 0;
  }

  /* ★変更点: 開いた後はボタン自体を消す（閉じるボタン不要） */
  .read-more-state:checked ~ .read-more-trigger {
    display: none;
  }

  /* チェックが入ったら（開いたら）、ボタン（label）を消す */
  .read-more-state:checked ~ .read-more-trigger {
    display: none !important;
  }
  /* パターンA：labelが裸の場合 */
  .read-more-state:checked ~ .read-more-trigger {
    display: none !important;
  }

  /* パターンB：labelが <p> タグに囲まれている場合（今回のケース） */
  .read-more-state:checked ~ p .read-more-trigger {
    display: none !important;
  }

  /* おまけ：pタグごときれいに消す（対応ブラウザ用） */
  .read-more-state:checked ~ p:has(.read-more-trigger) {
    display: none !important;
  }
}

/* 葬儀社の選び方 */
.caution-accordion {
  /* z-index: -10; */
  position: relative;
  margin-top: -0.5rem !important;
}
.caution-accordion summary {
  background: linear-gradient(
    -45deg,
    transparent 25%,
    #fff 25%,
    #fff 50%,
    transparent 50%,
    transparent 75%,
    #fff 75%,
    #fff
  );
  background-clip: padding-box;
  background-size: 1.5rem 1.5rem;
  position: relative;
  background-color: #fef3b0 !important;
  color: var(--color_text) !important;
  border: 0.4rem solid #fede01;
  padding: 1.25rem 1rem;
}

/* アニメーション */
.fuwafuwa {
  animation: fuwafuwa-scale 2.8s ease-in-out infinite;
  will-change: transform;
  z-index: 100;
}
@keyframes fuwafuwa-scale {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}

/* 口コミ */
.is-style-icon_good {
  background: #fff2f6;
  border-color: #fc477a;
}
.is-style-icon_good:before {
  color: #fc477a;
}
.is-style-icon_good:after {
  border-right-color: #fc477a;
}

/* ふきだしブロック表示崩れ修正 */
.-speaking.-border-none .c-balloon__after {
  left: -12px !important;
  top: -2px !important;
  display: block !important;
  border-width: 10px 12px 10px 0 !important;
}
.-bln-left .c-balloon__body.-speaking {
  padding-right: 0 !important;
  padding-left: 1rem !important;
}

/* ランキングテーブル */
.ranking-table thead tr > th:nth-child(2),
.ranking-table tbody tr > td:nth-child(2),
.ranking-table thead tr > th:nth-child(3),
.ranking-table tbody tr > td:nth-child(3) {
  width: 4rem;
}

.ranking-table thead tr > th:nth-child(4),
.ranking-table tbody tr > td:nth-child(4) {
  width: 10rem;
}

.ranking-table thead tr > th:nth-child(5),
.ranking-table tbody tr > td:nth-child(5),
.ranking-table thead tr > th:nth-child(6),
.ranking-table tbody tr > td:nth-child(6),
.ranking-table thead tr > th:nth-child(7),
.ranking-table tbody tr > td:nth-child(7),
.ranking-table thead tr > th:nth-child(8),
.ranking-table tbody tr > td:nth-child(8) {
  width: 8.5rem;
}

/* 市区町村リスト（.ranking-table-list）のスマホ最適化 */
.ranking-table-list {
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  gap: 0px 15px !important;
}
.ranking-table-list > * {
  white-space: nowrap !important;
}

/* その他記事一覧 */
/* .other-article .-list-flex {
  row-gap: 0 !important;
  column-gap: 2em !important;
} */
