/* ========================================
   下層ページ共通：コンテナ・見出し
======================================== */

.subpageContainer {
  width: min(1120px, calc(100% - 80px));
  margin-right: auto;
  margin-left: auto;
}

.subpageLabel {
  margin: 0 0 12px;
  color: #758cab;
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.22em;
}

.subpageHeading {
  margin-bottom: 44px;
  text-align: center;
}

.subpageHeading h2 {
  margin: 0;
  color: #082f6d;
  font-size: 30px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: 0.08em;
}

.subpageHeading > p:last-child {
  margin: 15px 0 0;
  color: #415676;
  font-size: 13px;
  font-weight: 600;
  line-height: 2;
}


/* ========================================
   下層ページ共通：ページヘッダー
======================================== */

.subpageHero {
  padding: 76px 0 40px;
  text-align: center;
  background: linear-gradient(180deg, #f4f7fb 0%, #ffffff 100%);
}

.subpageHero small {
  display: block;
  margin-bottom: 16px;
  color: #b4822f;
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.26em;
}

.subpageHero h1 {
  margin: 0;
  color: #06265f;
  font-size: 36px;
  font-weight: 500;
  letter-spacing: 0.1em;
}

.subpageHero p {
  max-width: 560px;
  margin: 20px auto 0;
  color: #344c70;
  font-size: 13px;
  font-weight: 600;
  line-height: 2;
  letter-spacing: 0.08em;
}


/* ========================================
   下層ページ共通：パンくずリスト
======================================== */

.breadcrumbs {
  display: flex;
  align-items: center;
  width: min(1120px, calc(100% - 80px));
  margin: 22px auto 0;
  gap: 10px;
  color: #7d8ca3;
  font-size: 11px;
}

.breadcrumbs a {
  transition: opacity 0.25s;
}

.breadcrumbs a:hover {
  opacity: 0.6;
}

.breadcrumbs p {
  margin: 0;
}


/* ========================================
   下層ページ共通：無料相談CTA
======================================== */

.subpageCta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(1120px, calc(100% - 80px));
  margin: 0 auto 100px;
  padding: 45px 58px;
  border-radius: 14px;
  background: #eef4fa;
}

.subpageCtaCopy h2 {
  margin: 0 0 10px;
  color: #082f6d;
  font-size: 25px;
  font-weight: 500;
  line-height: 1.6;
}

.subpageCtaCopy > p:last-child {
  margin: 0;
  color: #40536d;
  font-size: 12px;
  font-weight: 600;
  line-height: 2;
}

.subpageCtaButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 310px;
  gap: 15px;
  padding: 18px 32px;
  border-radius: 999px;
  background: linear-gradient(135deg, #082c6b, #003b88);
  box-shadow: 0 12px 30px rgba(2, 42, 101, 0.15);
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
}


/* ========================================
   下層ページ共通：スマートフォン
======================================== */

@media (max-width: 700px) {
  .subpageContainer,
  .breadcrumbs,
  .subpageCta {
    width: calc(100% - 44px);
  }

  .subpageHero {
    padding: 56px 22px 30px;
  }

  .subpageHero h1 {
    font-size: 27px;
  }

  .subpageHero p {
    max-width: none;
    margin-left: 0;
    font-size: 11px;
    text-align: left;
  }

  .subpageHeading {
    margin-bottom: 30px;
  }

  .subpageHeading h2 {
    font-size: 23px;
  }

  .subpageHeading > p:last-child {
    font-size: 11px;
    text-align: left;
  }

  /* 各ページの「Intro」セクション本文（下部の説明文）を左揃えに */
  [class*="Intro"].subpageContainer > p:last-child {
    margin-left: 0;
    text-align: left;
  }

  .subpageCta {
    flex-direction: column;
    align-items: stretch;
    gap: 25px;
    margin-bottom: 70px;
    padding: 35px 24px;
    text-align: center;
  }

  .subpageCtaCopy h2 {
    font-size: 23px;
  }

  .subpageCtaButton {
    width: 100%;
    min-width: 0;
  }
}


/* ========================================
   料金プランページ
======================================== */

.planIntro {
  padding: 74px 0 20px;
  text-align: center;
}

.planIntro h2 {
  margin: 0 0 22px;
  color: #082f6d;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: 0.08em;
}

.planIntro > p:last-child {
  max-width: 680px;
  margin: 0 auto;
  color: #344c70;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.15;
}

.planCardsSection {
  padding: 66px 0 90px;
}

.planCards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  max-width: 820px;
  margin: 0 auto;
  gap: 24px;
}

.planCard {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 44px 32px 36px;
  border: 1px solid #e0e7f0;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 14px 40px rgba(8, 47, 109, 0.05);
}

.planCardBadge {
  position: absolute;
  top: -15px;
  left: 50%;
  padding: 7px 20px;
  border-radius: 999px;
  background: #b89251;
  color: #ffffff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  white-space: nowrap;
  transform: translateX(-50%);
}

.planCardName {
  margin: 0 0 8px;
  color: #8da1bd;
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.planCardTitle {
  margin: 0 0 22px;
  color: #082f6d;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.06em;
}

.planCardPrice {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin: 0 0 6px;
}

.planCardPrice strong {
  color: #06265f;
  font-family: Georgia, "Yu Mincho", serif;
  font-size: 36px;
  font-weight: 400;
}

.planCardPrice span {
  color: #5b6d89;
  font-size: 12px;
  font-weight: 600;
}

.planCardInitialFee {
  margin: 0 0 26px;
  padding: 14px 18px;
  border-radius: 10px;
  background: #f4f7fb;
}

.planCardInitialFeeMain {
  margin: 0;
  color: #082f6d;
  font-size: 13px;
  font-weight: 700;
}

.planCardInitialFeeMain strong {
  margin: 0 1px;
  color: #06265f;
  font-family: Georgia, "Yu Mincho", serif;
  font-size: 22px;
  font-weight: 500;
}

.planCardInitialFeeNote {
  margin: 4px 0 0;
  color: #8194ad;
  font-size: 10px;
  font-weight: 600;
}

.planCardList {
  flex: 1;
  margin: 0 0 30px;
  padding: 0;
  list-style: none;
}

.planCardList li {
  position: relative;
  margin-bottom: 12px;
  padding-left: 22px;
  color: #344c70;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.8;
}

.planCardList li::before {
  position: absolute;
  top: 0;
  left: 0;
  color: #b89251;
  font-weight: 700;
  content: "✓";
}

.planCardLink {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 14px;
  padding-bottom: 6px;
  border-bottom: 1px solid #8295af;
  color: #082f6d;
  font-size: 12px;
  font-weight: 700;
  transition: opacity 0.25s;
}

.planCardLink:hover {
  opacity: 0.6;
}

.planFeeSection {
  padding: 90px 0;
  background: #f7f9fc;
}

.planSupportHeading {
  margin-top: 64px;
}

.planFeeTableWrap {
  overflow-x: auto;
}

.planFeeTable {
  width: 100%;
  border-collapse: collapse;
  background: #ffffff;
  border: 1px solid #e0e7f0;
  border-radius: 10px;
  overflow: hidden;
}

.planFeeTable th,
.planFeeTable td {
  padding: 20px 24px;
  border-bottom: 1px solid #e0e7f0;
  font-size: 13px;
}

.planFeeTable tr:last-child th,
.planFeeTable tr:last-child td {
  border-bottom: 0;
}

.planFeeTable thead th {
  background: #06265f;
  color: #ffffff;
  font-weight: 500;
  text-align: center;
}

.planFeeTable thead th:first-child {
  text-align: left;
}

.planFeeTable tbody th {
  width: 240px;
  color: #082f6d;
  font-weight: 500;
  text-align: left;
  background: #eef2f8;
}

.planFeeTable tbody td {
  color: #40536d;
  font-weight: 600;
  text-align: center;
}

.planFeeTable tbody td strong {
  color: #06265f;
  font-family: Georgia, "Yu Mincho", serif;
  font-size: 17px;
  font-weight: 500;
}

.planCompareSubLabel {
  display: block;
  margin-top: 4px;
  color: #8194ad;
  font-size: 10px;
  font-weight: 600;
}

.planFeeNote {
  margin: 22px 4px 0;
  color: #8194ad;
  font-size: 11px;
  font-weight: 600;
}


/* ========================================
   料金プランページ：タブレット
======================================== */

@media (max-width: 980px) {
  .planCards {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}


/* ========================================
   料金プランページ：スマートフォン
======================================== */

@media (max-width: 700px) {
  .planIntro {
    padding: 54px 0 10px;
  }

  .planIntro h2 {
    font-size: 22px;
  }

  .planIntro > p:last-child {
    font-size: 12px;
  }

  .planCardsSection {
    padding: 46px 0 64px;
  }

  .planFeeSection {
    padding: 60px 0;
  }

  .planSupportHeading {
    margin-top: 44px;
  }

  .planFeeTable {
    min-width: 520px;
  }

  .planFeeTable th,
  .planFeeTable td {
    padding: 16px 18px;
    font-size: 12px;
  }

  .planFeeTable tbody th {
    width: 130px;
  }
}


/* ========================================
   成婚者の声ページ
======================================== */

.voiceIntro {
  padding: 74px 0 20px;
  text-align: center;
}

.voiceIntro h2 {
  margin: 0 0 22px;
  color: #082f6d;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: 0.08em;
}

.voiceIntro > p:last-child {
  max-width: 680px;
  margin: 0 auto;
  color: #344c70;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.15;
}

.voiceSection {
  padding: 26px 0 96px;
  border-top: 1px solid #edf1f6;
}

.voiceGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}

.voiceCard {
  position: relative;
}

.voiceCardVisual {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  aspect-ratio: 4 / 3;
}

.voiceCardVisual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.voiceCard > .voiceCardBody {
  position: relative;
  padding: 26px 6px 0;
}

.voiceQuote {
  position: absolute;
  top: -8px;
  right: 2px;
  color: #e6edf6;
  font-family: Georgia, serif;
  font-size: 56px;
  line-height: 1;
}

.voiceCard h3 {
  position: relative;
  z-index: 1;
  margin: 0 0 14px;
  padding-right: 34px;
  color: #082f6d;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.75;
}

.voiceCardBody > p.voiceCardLead {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #40536d;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 2;
}


/* ---- カード展開（インタビューを読む） ---- */

.voiceCardToggle {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
  padding: 0;
  border: 0;
  background: none;
  color: #082f6d;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  cursor: pointer;
}

.voiceCardToggleIcon {
  font-size: 13px;
  font-weight: 400;
}

.voiceCardToggle:hover {
  opacity: 0.7;
}

.voiceCardPanel {
  position: relative;
  z-index: 1;
  margin-top: 26px;
  padding-top: 26px;
  border-top: 1px solid #e6ebf2;
}

.voiceCardQAItem {
  margin: 0 0 20px;
}

.voiceCardQAItem:last-child {
  margin-bottom: 0;
}

.voiceCardQANum {
  margin: 0 0 4px;
  color: #b4822f;
  font-family: Arial, sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.voiceCardQAItem h4 {
  margin: 0 0 6px;
  color: #082f6d;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.voiceCardQAItem p {
  margin: 0;
  color: #40536d;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.95;
}


/* ========================================
   成婚者の声ページ：写真スライダー（共通）
======================================== */

.photoSlider {
  position: absolute;
  inset: 0;
}

.photoSliderTrack {
  display: flex;
  height: 100%;
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.photoSliderTrack img {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.photoSliderDots {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 14px;
  left: 0;
  display: flex;
  justify-content: center;
  gap: 7px;
}

.photoSliderDots button {
  width: 7px;
  height: 7px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.55);
  cursor: pointer;
}

.photoSliderDots button.isActive {
  background: #ffffff;
}


/* ========================================
   成婚者の声ページ：ピックアップ（特集記事として2件）
======================================== */

.voicePickupSection {
  padding: 50px 0 78px;
}

.voicePickupGrid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 56px;
}

.voicePickupCard {
  position: relative;
}

.voicePickupVisual {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  aspect-ratio: 16 / 10;
}

.voicePickupVisual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.voicePickupBody {
  padding: 28px 4px 0;
}

.voicePickupBadge {
  margin: 0 0 10px;
  color: #b4822f;
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.24em;
}

.voicePickupProfile {
  margin: 0 0 16px;
  color: #8194ad;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.voicePickupProfile span {
  margin: 0 9px;
  color: #ccd4e1;
}

.voicePickupProfile span:first-child {
  margin-left: 0;
}

.voicePickupCard h3 {
  margin: 0 0 30px;
  color: #082f6d;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.75;
  letter-spacing: 0.02em;
}


/* ---- インタビュー本文 ---- */

.voicePickupInterview {
  max-width: 760px;
}

.voicePickupQAItem {
  margin: 0 0 32px;
}

.voicePickupQAItem:last-child {
  margin-bottom: 0;
}

.voicePickupQANum {
  margin: 0 0 6px;
  color: #b4822f;
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.voicePickupQAItem h4 {
  margin: 0 0 10px;
  color: #082f6d;
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.voicePickupQAItem p {
  margin: 0;
  color: #40536d;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 2.1;
}

.voicePickupPullQuote {
  margin: 40px 0;
  padding-left: 22px;
  border-left: 1px solid #d9c08f;
}

.voicePickupPullQuote p {
  margin: 0;
  color: #082f6d;
  font-size: 19px;
  font-weight: 500;
  line-height: 1.75;
  letter-spacing: 0.02em;
}


/* ========================================
   成婚者の声ページ：タブレット
======================================== */

@media (max-width: 980px) {
  .voicePickupGrid {
    grid-template-columns: 1fr;
    gap: 60px;
  }

  .voiceGrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 36px;
  }
}


/* ========================================
   成婚者の声ページ：スマートフォン
======================================== */

@media (max-width: 700px) {
  .voiceIntro {
    padding: 54px 0 10px;
  }

  .voiceIntro h2 {
    font-size: 22px;
  }

  .voiceIntro > p:last-child {
    font-size: 12px;
  }

  .voicePickupSection {
    padding: 34px 0 54px;
  }

  .voicePickupGrid {
    gap: 44px;
  }

  .voicePickupBody {
    padding: 22px 2px 0;
  }

  .voicePickupBadge {
    font-size: 10px;
  }

  .voicePickupProfile {
    font-size: 11px;
  }

  .voicePickupCard h3 {
    margin-bottom: 24px;
    font-size: 17px;
  }

  .voicePickupQAItem {
    margin-bottom: 26px;
  }

  .voicePickupQAItem p {
    font-size: 12.5px;
    line-height: 2;
  }

  .voicePickupPullQuote {
    margin: 30px 0;
    padding-left: 18px;
  }

  .voicePickupPullQuote p {
    font-size: 16px;
  }

  .voiceSection {
    padding: 20px 0 64px;
  }

  .voiceGrid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .voiceCardBody {
    padding: 22px 2px 0;
  }

  .voiceCard h3 {
    font-size: 15px;
  }

  .voiceCardPanel {
    margin-top: 22px;
    padding-top: 22px;
  }
}


/* ========================================
   ご成婚までの流れページ
======================================== */

.flowIntro {
  padding: 74px 0 20px;
  text-align: center;
}

.flowIntro h2 {
  margin: 0 0 22px;
  color: #082f6d;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: 0.08em;
}

.flowIntro > p:last-child {
  max-width: 680px;
  margin: 0 auto;
  color: #344c70;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.15;
}

.flowTimelineSection {
  padding: 66px 0 90px;
}

.flowTimeline {
  max-width: 760px;
  margin: 0 auto;
}

.flowStep {
  position: relative;
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 32px;
  padding-bottom: 56px;
}

.flowStepLast {
  padding-bottom: 0;
}

.flowStep:not(.flowStepLast)::after {
  position: absolute;
  top: 96px;
  left: 47px;
  width: 1px;
  height: calc(100% - 96px);
  background: #d6e0ed;
  content: "";
}

.flowStepIcon {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: #f4f6fb;
  color: #0c3677;
  font-size: 34px;
}

.flowStepIcon svg {
  width: 40px;
  height: 40px;
}

.flowStepContent {
  padding-top: 14px;
}

.flowStepNumber {
  margin: 0 0 8px;
  color: #b4822f;
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.flowStepContent h3 {
  margin: 0 0 8px;
  color: #082f6d;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.06em;
}

.flowStepDuration {
  margin: 0 0 14px;
  color: #8194ad;
  font-size: 11px;
  font-weight: 600;
}

.flowStepText {
  margin: 0 0 14px;
  color: #40536d;
  font-size: 13px;
  font-weight: 600;
  line-height: 2;
}

.flowStepListBox {
  margin: 0 0 14px;
  padding: 18px 22px;
  border-radius: 10px;
  background: #f4f7fb;
}

.flowStepListTitle {
  margin: 0 0 10px;
  color: #082f6d;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.flowStepList {
  margin: 0;
  padding: 0;
  list-style: none;
}

.flowStepList li {
  position: relative;
  margin-bottom: 10px;
  padding-left: 18px;
  color: #40536d;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.9;
}

.flowStepList li:last-child {
  margin-bottom: 0;
}

.flowStepList li::before {
  position: absolute;
  top: 0;
  left: 0;
  color: #b4822f;
  content: "・";
}


/* ========================================
   ご成婚までの流れページ：スマートフォン
======================================== */

@media (max-width: 700px) {
  .flowIntro {
    padding: 54px 0 10px;
  }

  .flowIntro h2 {
    font-size: 22px;
  }

  .flowIntro > p:last-child {
    font-size: 12px;
  }

  .flowTimelineSection {
    padding: 46px 0 64px;
  }

  .flowStep {
    grid-template-columns: 64px 1fr;
    gap: 18px;
    padding-bottom: 40px;
  }

  .flowStep:not(.flowStepLast)::after {
    top: 64px;
    left: 31px;
    height: calc(100% - 64px);
  }

  .flowStepIcon {
    width: 64px;
    height: 64px;
    font-size: 24px;
  }

  .flowStepIcon svg {
    width: 28px;
    height: 28px;
  }

  .flowStepContent {
    padding-top: 4px;
  }

  .flowStepContent h3 {
    font-size: 18px;
  }

  .flowStepText {
    font-size: 12px;
  }

  .flowStepListBox {
    padding: 14px 16px;
  }

  .flowStepList li {
    font-size: 11px;
  }
}


/* ========================================
   よくあるご質問ページ
======================================== */

.faqIntro {
  padding: 74px 0 20px;
  text-align: center;
}

.faqIntro h2 {
  margin: 0 0 22px;
  color: #082f6d;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: 0.08em;
}

.faqIntro > p:last-child {
  max-width: 680px;
  margin: 0 auto;
  color: #344c70;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.15;
}

.faqSection {
  padding: 66px 0 90px;
}

.faqList {
  max-width: 820px;
  margin: 0 auto;
}

.faqItem {
  border-bottom: 1px solid #e0e7f0;
}

.faqItem:first-child {
  border-top: 1px solid #e0e7f0;
}

.faqItem summary {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 26px 4px;
  list-style: none;
  cursor: pointer;
  color: #082f6d;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.03em;
}

.faqItem summary::-webkit-details-marker {
  display: none;
}

.faqBadge {
  display: grid;
  flex-shrink: 0;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  font-family: Georgia, serif;
  font-size: 14px;
  font-weight: 400;
}

.faqBadgeQ {
  background: #06265f;
  color: #ffffff;
}

.faqBadgeA {
  background: #f4f6fb;
  color: #b4822f;
}

.faqQuestionText {
  flex: 1;
  line-height: 1.7;
}

.faqChevron {
  flex-shrink: 0;
  color: #8194ad;
  font-size: 18px;
  transition: transform 0.25s;
}

.faqItem[open] .faqChevron {
  transform: rotate(90deg);
}

.faqAnswer {
  display: flex;
  gap: 20px;
  padding: 0 4px 28px 4px;
}

.faqAnswer p {
  flex: 1;
  margin: 4px 0 0;
  color: #40536d;
  font-size: 13px;
  font-weight: 600;
  line-height: 2;
}

.faqAnswer a {
  border-bottom: 1px solid #8295af;
  color: #082f6d;
}


/* ========================================
   よくあるご質問ページ：スマートフォン
======================================== */

@media (max-width: 700px) {
  .faqIntro {
    padding: 54px 0 10px;
  }

  .faqIntro h2 {
    font-size: 22px;
  }

  .faqIntro > p:last-child {
    font-size: 12px;
  }

  .faqSection {
    padding: 46px 0 64px;
  }

  .faqItem summary {
    gap: 14px;
    padding: 20px 0;
    font-size: 13px;
  }

  .faqBadge {
    width: 26px;
    height: 26px;
    font-size: 12px;
  }

  .faqAnswer {
    gap: 14px;
    padding: 0 0 22px;
  }

  .faqAnswer p {
    font-size: 12px;
  }
}


/* ========================================
   無料相談（お問い合わせ）ページ
======================================== */

.contactIntro {
  padding: 74px 0 20px;
  text-align: center;
}

.contactIntro h2 {
  margin: 0 0 22px;
  color: #082f6d;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: 0.08em;
}

.contactIntro > p:last-child {
  max-width: 680px;
  margin: 0 auto;
  color: #344c70;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.15;
}

.contactMainSection {
  padding: 66px 0 110px;
}

.contactLineCard {
  max-width: 560px;
  margin: 0 auto;
  padding: 56px 48px;
  border: 1px solid #d9f2e3;
  border-radius: 20px;
  background: linear-gradient(135deg, #f0fbf4 0%, #ffffff 60%);
  box-shadow: 0 20px 50px rgba(6, 199, 85, 0.12);
  text-align: center;
}

.contactLineLabel {
  margin: 0 0 14px;
  color: #06c755;
  font-family: Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.24em;
}

.contactLineTitle {
  margin: 0 0 20px;
  color: #082f6d;
  font-size: 26px;
  font-weight: 500;
  letter-spacing: 0.06em;
}

.contactLineText {
  margin: 0 0 32px;
  color: #40536d;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.1;
}

.contactLineButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 14px;
  padding: 20px 32px;
  border-radius: 999px;
  background: linear-gradient(135deg, #06c755, #05b34c);
  box-shadow: 0 14px 32px rgba(6, 199, 85, 0.32);
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  transition:
    opacity 0.25s,
    transform 0.25s;
}

.contactLineButton:hover {
  opacity: 0.9;
  transform: translateY(-2px);
}

.contactLineButton span {
  font-size: 22px;
  line-height: 1;
}

.contactLineNote {
  margin: 18px 0 0;
  color: #8194ad;
  font-size: 11px;
  font-weight: 600;
}


/* ========================================
   無料相談（お問い合わせ）ページ：スマートフォン
======================================== */

@media (max-width: 700px) {
  .contactIntro {
    padding: 54px 0 10px;
  }

  .contactIntro h2 {
    font-size: 22px;
  }

  .contactIntro > p:last-child {
    font-size: 12px;
  }

  .contactMainSection {
    padding: 46px 0 70px;
  }

  .contactLineCard {
    padding: 40px 26px;
  }

  .contactLineTitle {
    font-size: 21px;
  }

  .contactLineButton {
    padding: 18px 24px;
    font-size: 14px;
  }
}


/* ========================================
   代表紹介ページ（About）
======================================== */

.aboutIntro {
  padding: 74px 0 20px;
  text-align: center;
}

.aboutIntro h2 {
  margin: 0 0 22px;
  color: #082f6d;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: 0.08em;
}

.aboutIntro > p:last-child {
  max-width: 680px;
  margin: 0 auto;
  color: #344c70;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.15;
}


/* ご縁を始めた理由 */

.aboutStorySection {
  padding: 90px 0;
}

.aboutStory {
  display: grid;
  grid-template-columns: 38% 62%;
  align-items: center;
  gap: 60px;
}

.aboutStoryVisual {
  position: relative;
  padding-bottom: 26px;
}

.aboutStoryVisual img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  border-radius: 8px;
  object-fit: cover;
  object-position: center top;
  box-shadow: 0 22px 55px rgba(7, 45, 101, 0.14);
}

.aboutStoryCaption {
  position: absolute;
  right: -10px;
  bottom: 0;
  min-width: 230px;
  padding: 18px 22px;
  border-radius: 6px;
  background: #073676;
  box-shadow: 0 12px 30px rgba(7, 45, 101, 0.2);
  color: #ffffff;
}

.aboutStoryCaption span {
  display: block;
  margin-bottom: 7px;
  color: #d6b67a;
  font-family: Arial, sans-serif;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.2em;
}

.aboutStoryCaption p {
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.7;
}

.aboutStoryContent h2 {
  margin: 12px 0 24px;
  color: #082f6d;
  font-size: 27px;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.06em;
}

.aboutStoryText p {
  margin: 0 0 16px;
  color: #344c70;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.15;
}

.aboutStoryText p:last-child {
  margin-bottom: 0;
}


/* 僧侶だからこそできること */

.aboutApproachSection {
  padding: 92px 0;
  background: #f7f9fc;
}

.aboutApproachList {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.aboutApproachItem {
  padding: 38px 32px;
  border: 1px solid #e0e7f0;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 14px 40px rgba(8, 47, 109, 0.05);
}

.aboutApproachNumber {
  margin: 0 0 18px;
  color: #d6e0ed;
  font-family: Georgia, serif;
  font-size: 32px;
  font-weight: 400;
}

.aboutApproachBody h3 {
  margin: 0 0 14px;
  color: #082f6d;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 0.04em;
}

.aboutApproachBody p {
  margin: 0;
  color: #40536d;
  font-size: 12px;
  font-weight: 600;
  line-height: 2;
}


/* お寺について */

.aboutTempleSection {
  padding: 92px 0;
}

.aboutTemple {
  display: grid;
  grid-template-columns: 42% 58%;
  align-items: center;
  gap: 60px;
}

.aboutTempleVisual img {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  object-fit: cover;
}

.aboutTempleContent h2 {
  margin: 12px 0 20px;
  color: #082f6d;
  font-size: 25px;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.06em;
}

.aboutTempleContent > p {
  margin: 0;
  color: #344c70;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.15;
}

.aboutTempleInfo {
  display: grid;
  grid-template-columns: repeat(2, auto);
  gap: 8px 44px;
  margin: 26px 0;
}

.aboutTempleInfo dt {
  margin: 0 0 4px;
  color: #8194ad;
  font-family: Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.aboutTempleInfo dd {
  margin: 0;
  color: #082f6d;
  font-size: 15px;
  font-weight: 700;
}

.aboutExternalLink {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid #8295af;
  color: #082f6d;
  font-size: 12px;
  font-weight: 700;
  transition: opacity 0.25s;
}

.aboutExternalLink:hover {
  opacity: 0.6;
}


/* 宗教勧誘について */

.aboutAssuranceSection {
  padding: 0 0 92px;
}

.aboutAssurance {
  position: relative;
  display: flex;
  align-items: center;
  gap: 44px;
  padding: 50px 56px;
  overflow: hidden;
  border-radius: 16px;
  background: linear-gradient(120deg, #06265f, #0b438c);
}

.aboutAssuranceContent .subpageLabel {
  color: #b9cdeb;
}

.aboutAssuranceContent h2 {
  margin: 0 0 14px;
  color: #ffffff;
  font-size: 23px;
  font-weight: 500;
  line-height: 1.6;
}

.aboutAssuranceContent p {
  margin: 0;
  max-width: 640px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 13px;
  font-weight: 600;
  line-height: 2;
}


/* 代表プロフィール */

.aboutProfileSection {
  padding: 0 0 100px;
}

.aboutProfileHeading {
  margin-bottom: 44px;
  text-align: center;
}

.aboutProfileBody {
  display: grid;
  grid-template-columns: 30% 70%;
  gap: 50px;
  align-items: start;
  padding: 48px;
  border: 1px solid #e0e7f0;
  border-radius: 16px;
  background: #f7f9fc;
}

.aboutProfileName {
  text-align: center;
}

.aboutProfilePhoto {
  width: 100%;
  max-width: 190px;
  margin: 0 auto 22px;
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 14px 34px rgba(7, 45, 101, 0.18);
}

.aboutProfilePhoto img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center top;
}

.aboutProfileName small {
  display: block;
  color: #8194ad;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.8;
}

.aboutProfileName h3 {
  margin: 10px 0 4px;
  color: #082f6d;
  font-size: 26px;
  font-weight: 500;
  letter-spacing: 0.1em;
}

.aboutProfileName p {
  margin: 0;
  color: #b4822f;
  font-family: Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;
}

.aboutProfileText p {
  margin: 0 0 18px;
  color: #40536d;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.15;
}

.aboutProfileText p:last-child {
  margin-bottom: 0;
}

.aboutProfileMessage {
  color: #082f6d !important;
  font-weight: 700 !important;
}


/* ========================================
   代表紹介ページ：タブレット
======================================== */

@media (max-width: 980px) {
  .aboutStory,
  .aboutTemple {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .aboutStoryVisual {
    max-width: 360px;
    margin: 0 auto;
  }

  .aboutApproachList {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .aboutAssurance {
    flex-direction: column;
    text-align: center;
    gap: 24px;
  }

  .aboutProfileBody {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .aboutProfileName {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}


/* ========================================
   代表紹介ページ：スマートフォン
======================================== */

@media (max-width: 700px) {
  .aboutIntro {
    padding: 54px 0 10px;
  }

  .aboutIntro h2 {
    font-size: 22px;
  }

  .aboutIntro > p:last-child {
    font-size: 12px;
  }

  .aboutStorySection {
    padding: 64px 0;
  }

  .aboutStoryCaption {
    right: 0;
    min-width: 0;
    padding: 14px 16px;
  }

  .aboutStoryContent h2 {
    font-size: 21px;
  }

  .aboutApproachSection {
    padding: 64px 0;
  }

  .aboutApproachItem {
    padding: 30px 26px;
  }

  .aboutTempleSection {
    padding: 64px 0;
  }

  .aboutTempleContent h2 {
    font-size: 21px;
  }

  .aboutAssuranceSection {
    padding: 0 0 64px;
  }

  .aboutAssurance {
    padding: 36px 28px;
  }

  .aboutAssuranceContent h2 {
    font-size: 20px;
  }

  .aboutProfileSection {
    padding: 0 0 70px;
  }

  .aboutProfileBody {
    padding: 32px 24px;
    text-align: left;
  }

  .aboutProfileName {
    text-align: center;
  }

  .aboutAssuranceContent p {
    text-align: left;
  }
}