/* 葬儀事例の横スライド
   読み込むページ：トップページ、葬儀プラン関連のページ、斎場案内 */
/* お客様の声のカスタムCSS */
.flickity-parent1 {
	margin-bottom: 4.5rem !important;
}
.flickity-parent1 .flickity-carousel.p-postList.-type-card,
.flickity-carousel.p-postList.-type-thumb {
	display: block;
}
.flickity-parent1 .flickity-carousel li.p-postList__item {
	list-style-type: none;
	margin-bottom: 0 !important;
	padding: 0 1rem !important;
}
.flickity-parent1 .flickity-page-dots {
	bottom: 0;
	padding-left: 0 !important;
}

/* 数字のボタン */
.flickity-parent1 .flickity-prev-next-button.flickity-button {
  opacity: 1 !important;
  border: 2px solid var(--color_text) !important;
  background-color: var(--color_main_thin) !important;
  top: inherit !important;
  bottom: -3rem !important;
  width: 1.5rem !important;
  height: 1.5rem !important;
  z-index: 110;
}
.flickity-parent1 .flickity-prev-next-button.flickity-button.next {
  right: 0 !important;
}
.flickity-parent1 .flickity-prev-next-button.flickity-button.previous {
  left: 0 !important;
}
.flickity-parent1 .flickity-page-dots {
  padding-left: 0 !important;
  height: fit-content !important;
  bottom: -2.5rem !important;
}
.flickity-parent1 .flickity-page-dots .dot {
  width: 2rem !important;
  height: 2rem !important;
  margin: 0 0.25rem !important;
  background-color: var(--color_main) !important;
}
@media ( min-width:960px ) {
.flickity-parent1 .flickity-page-dots .dot {
  margin: 0 0.5rem !important;
}
}
.flickity-parent1 .flickity-page-dots > .dot:nth-child(1):before { content: "1"; }
.flickity-parent1 .flickity-page-dots > .dot:nth-child(2):before { content: "2"; }
.flickity-parent1 .flickity-page-dots > .dot:nth-child(3):before { content: "3"; }
.flickity-parent1 .flickity-page-dots > .dot:nth-child(4):before { content: "4"; }
.flickity-parent1 .flickity-page-dots > .dot:nth-child(5):before { content: "5"; }
.flickity-parent1 .flickity-page-dots > .dot:nth-child(6):before { content: "6"; }
.flickity-parent1 .flickity-page-dots > .dot:nth-child(7):before { content: "7"; }

.flickity-parent1 .flickity-page-dots .dot:before {
  width: 2rem !important;
  height: 2rem !important;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  color: #fff !important;
}
.flickity-parent1 .flickity-page-dots .dot.is-selected:before {
  font-size: 1rem;
}