@charset "UTF-8";

.memorial-top__h1Block {
  text-shadow:
    0px 0px 10px #000000,
    0 0 10px #000000;
  background: url(/butsudan/assets/img/memorial/top/mv-bg.webp) no-repeat center / cover;
  color: #ffffff;
  h1 {
    text-align: center;
  }
}
@media (max-width: 68.7rem) {
  .memorial-top__h1Block {
    aspect-ratio: 750 / 610;
    background-image: url(/butsudan/assets/img/memorial/top/mv-bg-sp.webp);
  }
}

.memorial-top__cardList {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  li {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .memorial__btn {
    width: 100%;
    max-width: 320px;
  }
  p {
    text-align: justify;
  }
}
@media (max-width: 68.7rem) {
  .memorial-top__cardList {
    flex-direction: column;
    li {
      max-width: 630px;
      margin-inline: auto;
    }
    .memorial__h3{
      font-size: 2.0rem;
    }
  }
}

/* 3つの供養タイプ
----------------------------------------------------- */
.memorial-top__serviceList {
  gap: 35px;
  li {
    flex: 1 1 calc(100% / 3 - 70px);
    gap: 13px;
    background-color: #f9f7f3;
    padding: 0 18px 34px;
  }
  .memorial-top__serviceText {
    margin-bottom: 20px;
  }
  .memorial__btn {
    margin-top: auto;
  }
}
.memorial-top__serviceImage {
  width: calc(100% + 36px);
  margin-left: -18px;
  margin-right: -18px;
  margin-bottom: 5px;
  max-width: none;
  display: block;
}
@media (min-width: 68.8rem) {
  .memorial-service {
  width: 90%;
}
  .memorial-top__serviceList {
    li {
      max-width: 407px;
    }
  }
}
@media (max-width: 1235px) {
  .memorial-top__serviceList {
    gap: 25px;
    li {
      flex: 1 1 calc(100% / 3 - 50px);
    }
  }
}

/* くらしの友が選ばれる4つのポイント
----------------------------------------------------- */
.reasons {
  .memorial__btn {
    margin: 90px auto 0;
  }
}
.memorial-top__reasonsList {
  gap: 50px 0;
  li {
    flex: 1 1 calc(50% - 25px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }
}
.memorial-top__reasonsImage {
  margin-bottom: 5px;
}
.memorial-top__reasonsText {
  padding-inline: 30px;
}
@media (min-width: 68.8rem) {
  .memorial-top__reasonsList {
    padding-inline: 60px;
    gap: 50px 40px;
  }
}
@media (max-width: 68.7rem) {
  .reasons {
    .memorial__btn {
      margin-top: 65px;
    }
  }
  .memorial-top__reasonsList {
    gap: 60px;
  }
}
@media (max-width: 768px) {
  .memorial-top__reasonsText {
    padding-inline: 0;
  }
}

/* お墓じまいの流れ
----------------------------------------------------- */
.memorial__flowList {
  li:last-of-type {
    .memorial__flowText {
      line-height: 1.25;
    }
  }
}
.memorial__flowText-br-sp {
  display: none;
}
@media (max-width: 68.7rem) {
  .closure-flow__lead{
    text-align: justify;
  }
  .memorial__flowText {
    line-height: 1.25;
  }
  .memorial__flowList {
    li:last-of-type {
      .memorial__flowText {
        line-height: 1.1;
      }
    }
  }
}
@media (max-width: 768px) {
  .memorial__flowText-br-pc {
    display: none;
  }
  .memorial__flowText-br-sp {
    display: block;
  }
}