.p-first-funeral-intro {
  position: relative;
}

.p-first-funeral-intro__images {
  position: absolute;
  inset: 0;
  z-index: -1;
}

.p-first-funeral-intro__image {
  position: absolute;
  opacity: 0.3;
}
@media (min-width: 1536px) {
  .p-first-funeral-intro__image {
    opacity: 1;
  }
}
.p-first-funeral-intro__image:nth-of-type(1) {
  top: 19%;
  left: 8%;
  width: clamp(10rem, 15.625vw, 20rem);
}
.p-first-funeral-intro__image:nth-of-type(2) {
  top: 52%;
  left: 2%;
  width: clamp(12rem, 18.75vw, 24rem);
}
.p-first-funeral-intro__image:nth-of-type(3) {
  bottom: 7%;
  left: 14%;
  width: clamp(8rem, 12.5vw, 16rem);
}
.p-first-funeral-intro__image:nth-of-type(4) {
  top: 29%;
  right: 3%;
  width: clamp(11rem, 17.1875vw, 22rem);
}
.p-first-funeral-intro__image:nth-of-type(5) {
  right: 8%;
  bottom: 20%;
  width: clamp(10rem, 15.625vw, 20rem);
}

.p-first-funeral-attitude {
  position: relative;
}

.p-first-funeral-attitude__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}
.p-first-funeral-attitude__bg * {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-first-funeral-attitude__title {
  display: flex;
  justify-content: center;
  margin-bottom: clamp(2rem, 7.8125vw, 4rem);
}
.p-first-funeral-attitude__title img {
  max-width: clamp(20rem, 17.5vw, 28rem);
}

.p-first-funeral-attitude__list {
  display: grid;
  gap: 2rem clamp(2rem, 3.125vw, 4rem);
}
@media (min-width: 768px) {
  .p-first-funeral-attitude__list {
    grid-template-columns: repeat(2, 1fr);
  }
}

.p-first-funeral-attitude__item {
  justify-items: center;
  padding: clamp(1.5rem, 3.125vw, 5rem) clamp(2rem, 3.75vw, 6rem) clamp(2rem, 2.5vw, 4rem);
  background-color: #fff;
}

.p-first-funeral-attitude__item__image {
  display: grid;
  align-items: end;
  max-width: 50%;
  margin-top: 3rem;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  text-align: -webkit-center;
}
@media (min-width: 768px) {
  .p-first-funeral-attitude__item__image {
    max-width: 100%;
  }
}

.p-first-funeral-attitude__item__title {
  margin-bottom: clamp(1rem, 1.25vw, 2rem);
  font-family: var(--font-serif);
  font-size: clamp(1.8rem, 1.6875vw, 2.7rem);
  font-weight: 500;
  color: #7f4f8d;
  text-align: center;
  letter-spacing: 0.08em;
}

.p-first-funeral-attitude__item__balloon {
  position: relative;
  padding: 1rem 2rem;
  background: #eef0f7;
  border-radius: 3rem;
}
.p-first-funeral-attitude__item__balloon::before {
  content: "";
  position: absolute;
  right: 6rem;
  width: 3rem;
  height: 2.5rem;
  bottom: -4rem;
  background: #eef0f7;
  border-radius: 50%;
}
.p-first-funeral-attitude__item__balloon::after {
  content: "";
  position: absolute;
  right: 8rem;
  width: 2.3rem;
  height: 2rem;
  bottom: -6.5rem;
  background: #eef0f7;
  border-radius: 50%;
}
.p-first-funeral-attitude__item__balloon.me {
  background: #fff0c6;
}
.p-first-funeral-attitude__item__balloon.me::before {
  background: #fff0c6;
}
.p-first-funeral-attitude__item__balloon.me::after {
  background: #fff0c6;
}
.p-first-funeral-attitude__item__balloon.answer {
  justify-self: start;
  margin-top: 1rem;
  max-width: 15rem;
}
.p-first-funeral-attitude__item__balloon.answer::before {
  left: 4rem;
  width: 2rem;
  height: 1.8rem;
  bottom: -2.5rem;
}
.p-first-funeral-attitude__item__balloon.answer::after {
  left: 6rem;
  width: 1.3rem;
  height: 1.2rem;
  bottom: -3.5rem;
}
@media (min-width: 768px) {
  .p-first-funeral-attitude__item__balloon.answer {
    margin-top: 2rem;
  }
}
@media (min-width: 1280px) {
  .p-first-funeral-attitude__item__balloon.answer {
    margin-top: 3rem;
  }
  .p-first-funeral-attitude__item__balloon.answer::before {
    left: 8rem;
    bottom: -3rem;
  }
  .p-first-funeral-attitude__item__balloon.answer::after {
    left: 10rem;
    bottom: -4.5rem;
  }
}
.p-first-funeral-attitude__item__balloon .p-first-funeral-attitude__item__text {
  font-size: clamp(1.4rem, 1.0625vw, 1.7rem);
  line-height: 2;
  letter-spacing: 0.06em;
}
@media (min-width: 768px) {
  .p-first-funeral-attitude__item__balloon::before {
    right: 4rem;
    bottom: -5.5rem;
  }
  .p-first-funeral-attitude__item__balloon::after {
    right: 6rem;
    bottom: -8.5rem;
  }
}
@media (min-width: 1280px) {
  .p-first-funeral-attitude__item__balloon::before {
    right: 10rem;
    bottom: -4.5rem;
  }
  .p-first-funeral-attitude__item__balloon::after {
    right: 12rem;
    bottom: -7.5rem;
  }
}

.p-first-funeral-service {
  background-color: #cad0e4;
}

.p-first-funeral-service__list {
  --gap: clamp(2rem, calc(100vw * 40 / 1600), 4rem);
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap);
  justify-content: center;
}

.p-first-funeral-service__card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 1.171875vw, 1.5rem);
  justify-content: flex-end;
  min-height: min(23.4375vw, 30rem);
  padding: clamp(1.5rem, 1.875vw, 3rem) clamp(4rem, 5vw, 8rem) clamp(1.5rem, 1.875vw, 3rem) clamp(1.5rem, 1.875vw, 3rem);
  color: #fff;
  text-decoration: none;
  background-color: #0d396b;
  transition: opacity var(--transition-duration) var(--transition-timing-function);
}
.p-first-funeral-service__card:focus-visible {
  opacity: 0.8;
}
@media (any-hover: hover) {
  .p-first-funeral-service__card:hover {
    opacity: 0.8;
  }
}
@media (min-width: 768px) {
  .p-first-funeral-service__card {
    flex-basis: calc((100% - var(--gap) * 1) / 2);
  }
}
@media (min-width: 1024px) {
  .p-first-funeral-service__card {
    flex-basis: calc((100% - var(--gap) * 2) / 3);
  }
}

.p-first-funeral-service__card__image {
  position: absolute;
  top: clamp(1rem, 1.25vw, 2rem);
  right: clamp(1rem, 1.25vw, 2rem);
  max-width: clamp(6.5rem, 11.0625vw, 17.7rem);
}

.p-first-funeral-service__card__title {
  font-size: clamp(1.6rem, 1.5vw, 2.4rem);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.06em;
}
.p-first-funeral-service__card__title small {
  font-size: 0.6666666667em;
}

.p-first-funeral-service__card__text {
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.5);
  letter-spacing: 0.06em;
}

.p-first-funeral-service__card__icon {
  position: absolute;
  right: clamp(1rem, 1.25vw, 2rem);
  bottom: clamp(1rem, 1.25vw, 2rem);
  width: clamp(2.5rem, 3.125vw, 5rem);
}

.p-first-funeral-voice__contents {
  display: grid;
}
@media (min-width: 768px) {
  .p-first-funeral-voice__contents {
    grid-template-columns: repeat(2, 1fr);
  }
}

.p-first-funeral-voice__content {
  padding: clamp(2.5rem, 3.125vw, 5rem) clamp(1.5rem, 4.6875vw, 7.5rem);
}
.p-first-funeral-voice__content:first-of-type {
  background-color: #eef0f7;
}
.p-first-funeral-voice__content:last-of-type {
  background-color: #e9deed;
}

.p-first-funeral-voice__content__title {
  margin-bottom: clamp(2rem, 2.34375vw, 3rem);
  font-family: var(--font-serif);
  font-size: clamp(1.6rem, 1.5625vw, 2rem);
  font-weight: 500;
  text-align: center;
  letter-spacing: 0.08em;
}
.p-first-funeral-voice__content__title:where(.p-first-funeral-voice__content:first-of-type *) {
  color: #0d396b;
}
.p-first-funeral-voice__content__title:where(.p-first-funeral-voice__content:last-of-type *) {
  color: #7f4f8d;
}

.p-first-funeral-voice__content__list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.p-first-funeral-voice__content__item {
  display: grid;
  grid-template-columns: 5rem 1fr;
  gap: clamp(1.5rem, 1.875vw, 3rem);
  align-items: center;
  padding: clamp(2rem, 1.5625vw, 2.5rem) clamp(2.5rem, 3.125vw, 5rem);
  background-color: #fff;
  border: 1px solid rgba(13, 57, 107, 0.2);
  border-radius: 0.5rem;
}

.p-first-funeral-voice__content__text {
  min-height: 2lh;
  font-size: clamp(1.4rem, 1.40625vw, 1.8rem);
  font-weight: 300;
  line-height: 1.5555555556;
  letter-spacing: 0.06em;
}

/*# sourceMappingURL=first-funeral.css.map */