/* ========= CTA ボタン共通 ========= */
.cta-button {
  display: inline-flex;
  align-items: center;
  font-size: 18px;
  font-weight: bold;
  color: #b48700;
  gap: 4px;
  cursor: pointer;
  text-decoration: none;
  margin: 30px auto 10px auto;
  justify-content: center;
}

.cta-button span {
  position: relative;
  top: 2px;
}

.cta-button svg circle {
  fill: none;
  transition: fill 0.8s ease-in-out;
}

.cta-button:hover svg circle {
  fill: #fffbe6;
}

.svg-arrow {
  transform-origin: 164px 30px;
}

.cta-button:hover .svg-arrow {
  /* animation: spinOnce 0.6s ease; */
}

@keyframes spinOnce {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* ========= 複数CTAボタン（オレンジ背景用） ========= */
.cta_02_row {
  display: flex;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
  margin-top: 40px;
}

.cta_02_btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  font-weight: bold;
  padding: 15px 30px;
  border-radius: 50px;
  color: #fff;
  text-decoration: none;
  background: linear-gradient(to right, #d1411e, #e46b22);
  transition: background 0.3s ease, transform 0.2s;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  text-align: center;
}

.cta_02_btn_h {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  font-weight: bold;
  padding: 15px 30px;
  border-radius: 50px;
  color: #fff;
  text-decoration: none;
  background: linear-gradient(to right, #d1411e, #e46b22);
  transition: background 0.3s ease, transform 0.2s;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  text-align: center;
}

.cta_02_btn_fix {
  font-size: 20px;
  width: 125px;
}


.cta_02_btn .icon {
  font-size: 20px;
}


.cta_02_btn .arrow {
  font-size: 18px;
}

.cta_02_btn:hover {
  background: linear-gradient(to right, #e1551f, #f4842c);
  transform: scale(1.05);
}


.estimate{
	width: 200px;
}

.contact{
	width: 200px;
	text-align: center;
	letter-spacing: 0.1em;
	
}

/* ========= 独自CTA：お客様の声・供養共通 ========= */
.toggle-button {
  display: inline-flex;
  align-items: center;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
}

.toggle-button .cta-arrow {
 transition: transform 0.6s ease;
}

.toggle-button.open .cta-arrow {
  transform: rotate(180deg); 
}

.toggle-button:hover .cta-arrow circle {
  fill: #fffbe6; /* 円の塗りを変える */
}

.toggle-button:hover .cta-arrow line {
  opacity: 0; /* 棒を消す */
}

.toggle-button:hover .svg-arrow {
  /*animation: spinOnce 0.6s ease;*/
}

@keyframes spinOnce {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.cta-arrow {
  min-width: 30px;
  min-height: 30px;
}

/* ========= お客様の声・供養セクション：テキスト調整 ========= */
.voice-toggle-wrapper span,
.faq-toggle-wrapper span {
  font-size: 18px;
  font-weight: bold;
  color: #b48700;
  margin-right: 10px;
}


.voice-toggle-wrapper,
.faq-toggle-wrapper {
  display: inline-flex;
  align-items: center;
  gap: 10px; /* テキストと矢印の間隔 */
}


/* ========= SVG矢印内の円・三角形へのアニメーション用 ========= */
.cta-arrow circle {
  fill: none;
  stroke: #b48700;
  stroke-width: 3;
}

.cta-arrow line {
  stroke: #b48700;
  stroke-width: 3;
}

.cta-arrow .svg-arrow {
  fill: none;
  stroke: #b48700;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.svg-arrow {
  transform-origin: center;
  transform-box: fill-box;
}

.faq-toggle-wrapper span {
  color: #b48700;
  transition: color 0.3s;
}

.faq-toggle-wrapper.open span {
  color: #b48700; /* 開いてる時と揃える色に */
}

/* ========= voice-list用補助ボタン（念のため） ========= */
.bt-control {
  margin-top: 30px;
}
.voice-toggle-wrapper span strong {
  color: #b48700;
}

/* ========= 旧式の丸囲み矢印ボタン（未使用化可） ========= */
.dli-caret-circle-fill-down,
.dli-caret-circle-fill-up,
button.dli-caret-circle-fill-down,
button.dli-caret-circle-fill-up {
  display: none !important;
}