/* 基本設定 */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: sans-serif;
  overflow-x: hidden;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* ヘッダー：横並びを絶対に維持 */
.header {
  width: 100%;
  background: #fff;
  border-bottom: 1px solid #eee;
}

.header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5px 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.logo {
  width: 200px;
}

.gnav {
  display: flex;

  align-items: center;
  gap: 20px;
}

.gnav ul {
  display: flex;
  list-style: none;
  gap: 20px;
}

.gnav ul li a {
  color: #1a2347;
  /* 文字色 */
  text-decoration: none;
  /* ← 下線を削除 */
  font-size: 18px;
  /* ← 文字サイズ指定 */
  font-weight: 500;
  /* やや太字 */
  letter-spacing: 0.05em;
  /* 文字間隔 */
  transition: color 0.2s;
}

.gnav ul li a:hover {
  color: #2d5fb8;
  /* ホバー時に青に */
}

.btn-nav {
  padding: 8px 15px;
  background: #0d366a;
  color: #fff;
  border-radius: 20px;
  text-decoration: none;
  font-size: 18px;
}

/* FVエリア：ここが重要 */
.fv {
  width: 100%;
}

.fv-container {
  position: relative;
  width: 100%;
  max-width: 1536px;
  margin: 0 auto;
}

.main-img {
  width: 100%;
}

/* ボタンの浮かせ設定 */
.cta-overlay-fixed {
  position: absolute !important;
  /* 絶対配置 */
  z-index: 9999 !important;
  /* 何よりも手前に表示 */
  line-height: 0;
}

/* PC版：左下の隙間に配置 */
@media (min-width: 769px) {
  .cta-overlay-fixed {
    bottom: 5%;
    left: 3%;
    width: 480px;
  }


  .header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    max-width: 1200px;
    margin: 0 auto;
  }

}



/* スマホ版：経営者様必見！の横に配置 */
@media (max-width: 768px) {

  .logo-tagline,
  .gnav ul {
    display: none;
  }

  /* 不要なメニューを消す */

  .cta-overlay-fixed {
    top: 52%;
    /* 画像の上から半分より少し下 */
    right: 3%;
    /* 右端から少し離す */
    width: 58%;
    /* 隙間にフィットするサイズ */
  }

  .logo {
    width: 100px;
  }

  .btn-nav {
    font-size: 12px;
  }



}

/* 【スマホ版：確実に表示させる設定】 */
@media (max-width: 768px) {
  .fv-container {
    background-color: #031d45;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    /* 中央寄せに変更 */
    position: relative !important;
  }

  .cta-overlay-fixed {
    top: 48% !important;
    right: 2% !important;
    /* 右端に寄せる */
    width: 62% !important;
    /* 少し大きくして目立たせる */
    display: block !important;
  }
}

/* 【PC版：位置固定】 */
@media (min-width: 769px) {
  .cta-overlay-fixed {
    bottom: 5% !important;
    left: 3% !important;
    width: 480px !important;
  }
}

/* --- スマホ版でボタンを絶対に出現させる設定 --- */
@media screen and (max-width: 768px) {

  /* 親要素の崩れを防止 */
  .fv-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    /* 右寄せ */
    position: relative !important;
  }

  .cta-responsive {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    /* 空欄の幅に合わせて少し広げる */
    /* 位置の調整：丸い文字の下、空欄に収まるように引き上げ */
    margin-top: 1% !important;
    margin-left: 5% !important;

    margin-bottom: 10%;
    z-index: 9999 !important;
  }


}




/* --- PC版の設定（既存のものを維持） --- */
@media screen and (min-width: 769px) {
  .cta-responsive {
    position: absolute !important;
    bottom: 5px !important;
    left: 3% !important;
    width: 32% !important;
    max-width: 480px !important;
    z-index: 9999 !important;
  }
}

.cta-responsive img {
  width: 85% !important;
  margin-left: 5%;
  height: auto !important;
}


/* ===== ISSUES SECTION ===== */
.issues {
  position: relative;
  padding: 70px 40px 60px;
  background: #f4f8fd;
  overflow: hidden;
}

/* 左右の植物・ドット装飾 */
.issues::before,
.issues::after {
  content: '';
  position: absolute;
  top: 0;
  width: 120px;
  height: 100%;
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0.6;
}

.issues::before {
  left: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 700'%3E%3Cg fill='%234a7fd6' opacity='0.35'%3E%3Ccircle cx='15' cy='25' r='2.5'/%3E%3Ccircle cx='30' cy='25' r='2.5'/%3E%3Ccircle cx='45' cy='25' r='2.5'/%3E%3Ccircle cx='22' cy='40' r='2.5'/%3E%3Ccircle cx='37' cy='40' r='2.5'/%3E%3Ccircle cx='52' cy='40' r='2.5'/%3E%3C/g%3E%3Cpath d='M0,30 Q50,10 100,40 Q50,80 0,100 Z' fill='%234a7fd6' opacity='0.18'/%3E%3C/svg%3E");
}

.issues::after {
  right: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 700'%3E%3Cpath d='M140,15 Q90,25 70,55 Q105,85 140,75 Z' fill='%234a7fd6' opacity='0.18'/%3E%3C/svg%3E");
}

.issues-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* ISSUESラベル */
.issues-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-bottom: 8px;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  color: #2d5fb8;
}

.issues-label::before,
.issues-label::after {
  content: '';
  width: 36px;
  height: 1px;
  background: #2d5fb8;
}

/* 見出し */
.issues-title {
  text-align: center;
  font-family: 'Noto Serif JP', serif;
  font-size: 3rem;
  font-weight: 500;
  color: #1a2347;
  margin-bottom: 40px;
  letter-spacing: 0.05em;
}

.issues-title-accent {
  color: #112e6f;
  position: relative;
  display: inline-block;
  font-weight: 700;
}

/* 「お悩み」上の傍点 */
./issues-title-accent::before {
  content: '・ ・ ・';
  position: absolute;
  top: -0.55em;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 0.5em;
  letter-spacing: 0.4em;
  color: #112e6f;
  line-height: 1;
  font-weight: 700;
  padding-left: 0.2em;
}

/* === 6カード画像グリッド:横3×縦2 === */
.issues-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, auto);
  gap: 20px;
  margin-bottom: 44px;
}

/* カード1枚 = 画像1枚 */
.issues-card-image {
  display: block;
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
}

.issues-card-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* 結論メッセージ */
.issues-conclusion {
  text-align: center;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.9rem;
  font-weight: 500;
  color: #1a2347;
  letter-spacing: 0.05em;
  margin-bottom: 22px;
}

.issues-conclusion-accent {
  color: #112e6f;
  font-weight: 700;
}

/* ▼マーク */
.issues-arrow {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.issues-arrow-line {
  width: 220px;
  height: 1px;
  background: #c5d3eb;
}

.issues-arrow-icon {
  width: 44px;
  height: 26px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 30' fill='none'%3E%3Cpath d='M5 5 L25 22 L45 5' stroke='%234a7fd6' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10 14 L25 27 L40 14' stroke='%234a7fd6' stroke-width='4' stroke-linecap='round' stroke-linejoin='round' opacity='0.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* ===== レスポンシブ:スマホ版 (600px以下) ===== */
@media (max-width: 600px) {
  .issues {
    padding: 50px 16px 40px;
  }

  .issues::before,
  .issues::after {
    width: 50px;
    opacity: 0.4;
  }

  .issues-label {
    font-size: 1.1rem;
  }

  .issues-label::before,
  .issues-label::after {
    width: 24px;
  }

  .issues-title {
    font-size: 2rem;
    margin-bottom: 24px;
  }

  .issues-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 24px;
  }

  .issues-conclusion {
    font-size: 1.4rem;
    line-height: 1.7;
  }

  .issues-arrow-line {
    width: 130px;
  }
}

/* ===== ANSWER SECTION ===== */
.answer {
  position: relative;
  margin-top: -100px;
  padding: 100px 40px 60px;
  background: linear-gradient(135deg, #0a1838 0%, #142a5c 60%, #1e3a8a 100%);
  overflow: hidden;
  z-index: 20;
  clip-path: polygon(0 0, 50% 60px, 100% 0, 100% 100%, 0 100%);
}

/* 背景:青いウェーブ模様 */
.answer::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 900' fill='none' opacity='0.5'%3E%3Cpath d='M -100 150 Q 300 50 600 200 T 1300 250' stroke='%234a7fd6' stroke-width='1.5' fill='none' opacity='0.6'/%3E%3Cpath d='M -100 320 Q 350 220 700 380 T 1300 430' stroke='%234a7fd6' stroke-width='1.5' fill='none' opacity='0.5'/%3E%3Cpath d='M -100 480 Q 250 380 550 530 T 1300 580' stroke='%234a7fd6' stroke-width='1.5' fill='none' opacity='0.4'/%3E%3Cpath d='M -100 640 Q 300 540 650 690 T 1300 740' stroke='%234a7fd6' stroke-width='1.5' fill='none' opacity='0.3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: cover;
  pointer-events: none;
}

.answer-inner {
  position: relative;
  max-width: 1400px;
  margin: 0 auto;
  z-index: 1;
}

/* ANSWERラベル */
.answer-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 50px 0 18px;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  color: #c9a55b;
}

.answer-label::before,
.answer-label::after {
  content: '';
  width: 36px;
  height: 1px;
  background: #c9a55b;
}

/* === タイトル + 月桂冠 === */
.answer-title-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin-bottom: 50px;
}

.answer-title-wrap img {
  width: 60px;
  height: 200px;
}

/* 月桂冠 */
.answer-laurel {
  flex-shrink: 0;
  width: 110px;
  height: auto;
  pointer-events: none;
}

.answer-laurel-right {
  transform: scaleX(-1);
}

/* メインタイトル */
.answer-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3rem;
  font-weight: 500;
  color: #fff;
  line-height: 1.6;
  letter-spacing: 0.05em;
  text-align: center;
}

.answer-title-gold {
  color: #c9a55b;
  font-weight: 700;
}

/* === 「確かな実績」サブヘッダー === */
.answer-subheader {
  text-align: center;
  margin-bottom: 32px;
}

.answer-subheader-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3.6rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
  letter-spacing: 0.06em;
  margin-bottom: 12px;
}

.answer-subheader-text {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.8rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.6;
  letter-spacing: 0.04em;
}

/* === 4カードグリッド(2×2) === */
.answer-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.answer-card {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

.answer-card img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .answer {
    padding: 40px 16px 36px;
  }

  .answer-label {
    font-size: 1.1rem;
    margin-bottom: 14px;
  }

  .answer-label::before,
  .answer-label::after {
    width: 24px;
  }

  .answer-title-wrap {
    gap: 10px;
    margin-bottom: 32px;
  }

  .answer-laurel {
    width: 50px;
  }

  .answer-title {
    font-size: 1.8rem;
    line-height: 1.6;
  }

  /* 「確かな実績」サブヘッダー(スマホ) */
  .answer-subheader {
    margin-bottom: 20px;
  }

  .answer-subheader-title {
    font-size: 2.4rem;
    margin-bottom: 8px;
  }

  .answer-subheader-text {
    font-size: 1.3rem;
  }

  /* スマホでは1カラム */
  .answer-cards {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

/* === 締めのメッセージ === */
.answer-conclusion {
  text-align: center;
  margin-top: 40px;
  padding: 28px 32px;
  backdrop-filter: blur(4px);
}

.answer-conclusion-text {
  font-family: 'Noto Serif JP', serif;
  font-size: 2rem;
  font-weight: 500;
  color: #fff;
  line-height: 1.8;
  letter-spacing: 0.05em;
}

/* 業務内容(企画設計〜報告書作成):ゴールドで強調 */
.answer-conclusion-accent {
  color: #c9a55b;
  font-weight: 700;
}

/* 「まるごとお任せ」:より大きくして強調 */
.answer-conclusion-strong {
  color: #f5d76e;
  font-weight: 700;
  font-size: 1.2em;
  letter-spacing: 0.08em;
}

/* スマホ版 */
@media (max-width: 768px) {
  .answer-conclusion {
    margin-top: 28px;
    padding: 20px 18px;
  }

  .answer-conclusion-text {
    font-size: 1.3rem;
    line-height: 1.8;
  }

  .answer-conclusion-strong {
    font-size: 1.15em;
  }
}

/* ===== PROOF SECTION ===== */
.proof {
  position: relative;
  padding: 60px 40px 40px;
  background: linear-gradient(135deg, #0a1838 0%, #142a5c 60%, #1e3a8a 100%);
  overflow: hidden;
}

/* 背景:ネットワーク模様 */
.proof::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(135deg, transparent 49%, rgba(120, 170, 230, 0.1) 49%, rgba(120, 170, 230, 0.1) 51%, transparent 51%),
    linear-gradient(45deg, transparent 49%, rgba(120, 170, 230, 0.08) 49%, rgba(120, 170, 230, 0.08) 51%, transparent 51%);
  background-size: 100px 100px, 70px 70px;
  opacity: 0.5;
  pointer-events: none;
}

/* 背景:ドット模様 */
.proof::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 15% 80%, rgba(74, 127, 214, 0.2) 0%, transparent 25%),
    radial-gradient(circle at 90% 20%, rgba(74, 127, 214, 0.15) 0%, transparent 25%);
  pointer-events: none;
}

.proof-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* メイン2カラム */
.proof-main {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-bottom: 32px;
}

/* 左:キャッチ + 人物イラスト */
.proof-left {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.proof-label {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  color: #c9a55b;
  margin-bottom: 4px;
}

.proof-label::after {
  content: '';
  width: 36px;
  height: 1px;
  background: #c9a55b;
}

.proof-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3rem;
  font-weight: 500;
  line-height: 1.5;
  color: #fff;
  letter-spacing: 0.03em;
  margin-bottom: 8px;
}

.proof-subtitle {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.3rem;
  line-height: 1.9;
  color: rgba(255, 255, 255, 0.85);
  font-weight: 400;
  letter-spacing: 0.02em;
}

/* 画像エリア共通 */
.proof-illustration,
.proof-stats,
.proof-case {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  display: block;
}

.proof-illustration img,
.proof-stats img,
.proof-case img {
  width: 100%;
  height: auto;
  display: block;
}

/* 右:画像3点を縦並び */
.proof-right {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* 下部メッセージバー */
.proof-message {

  border-radius: 8px;
  padding: 32px 28px;
  text-align: center;

}

.proof-message-sparkle {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23c9a55b'%3E%3Cpath d='M16 4 L17 14 L27 16 L17 18 L16 28 L15 18 L5 16 L15 14 Z'/%3E%3Cpath d='M24 6 L24.5 9 L27.5 9.5 L24.5 10 L24 13 L23.5 10 L20.5 9.5 L23.5 9 Z' opacity='0.6'/%3E%3Cpath d='M6 22 L6.5 25 L9.5 25.5 L6.5 26 L6 29 L5.5 26 L2.5 25.5 L5.5 25 Z' opacity='0.6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.proof-message-leaf {
  flex-shrink: 0;
  width: 32px;
  height: 28px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 28' fill='%234a7fd6'%3E%3Cpath d='M2 14 Q12 4 26 8 Q22 14 16 18 Q10 20 2 14Z' opacity='0.4'/%3E%3Cpath d='M2 14 L26 8' stroke='%234a7fd6' stroke-width='0.5' fill='none' opacity='0.6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.proof-message-text {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.8rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.7;
  letter-spacing: 0.04em;
}

.proof-message-accent {
  color: #c9a55b;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .proof {
    padding: 40px 16px 28px;
  }

  .proof-main {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-bottom: 24px;
  }

  .proof-label {
    font-size: 1.1rem;
  }

  .proof-label::after {
    width: 24px;
  }

  .proof-title {
    font-size: 1.9rem;
    line-height: 1.4;
    text-align: center;
  }

  .proof-subtitle {
    font-size: 1.2rem;
    line-height: 1.8;
  }

  .proof-right {
    gap: 10px;
  }

  .proof-message {
    padding: 14px 18px;
    flex-wrap: wrap;
  }

  .proof-message-text {
    color: #ffffff;
    font-size: 1.3rem;
    line-height: 1.4;
  }

  .proof-message-accent {
    color: #ffffff;
  }

  .proof-message-star {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12 2 L13.5 9 L20 10 L13.5 12 L12 22 L10.5 12 L4 10 L10.5 9 Z'/%3E%3C/svg%3E");
  }
}

/* ===== CASE STUDY SECTION ===== */
.case-study {
  position: relative;
  padding: 70px 40px 60px;
  background: #fafcff;
  overflow: hidden;
}

.case-study-inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  z-index: 1;
}

/* === ヘッダー === */
.case-study-header {
  text-align: center;
  margin-bottom: 40px;
}

/* CASE STUDYラベル */
.case-study-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  color: #c9a55b;
  margin-bottom: 14px;
}

.case-study-label::before,
.case-study-label::after {
  content: '';
  width: 36px;
  height: 1px;
  background: #c9a55b;
}

/* メインタイトル */
.case-study-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3.6rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.5;
  letter-spacing: 0.06em;
  margin-bottom: 16px;
}

/* サブテキスト */
.case-study-subtitle {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.4rem;
  line-height: 2;
  color: #1a2347;
  font-weight: 500;
  letter-spacing: 0.04em;
}

.case-study-subtitle-quote {
  color: #c9a55b;
}

/* === 10カードグリッド(2×5) === */
.case-study-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  /* 3 → 2 に変更 */
  gap: 20px;
}

.case-study-card {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 14px rgba(20, 42, 92, 0.08);
}

.case-study-card img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===== レスポンシブ:タブレット・スマホ (768px以下) ===== */
@media (max-width: 768px) {
  .case-study {
    padding: 50px 16px 40px;
  }

  .case-study-header {
    margin-bottom: 28px;
  }

  .case-study-label {
    font-size: 1.1rem;
  }

  .case-study-label::before,
  .case-study-label::after {
    width: 24px;
  }

  .case-study-title {
    font-size: 1.8rem;
    line-height: 1.4;
    margin-bottom: 12px;
  }

  .case-study-subtitle {
    font-size: 1.2rem;
    line-height: 1.9;
  }

  /* スマホでも2カラム維持(画面が狭ければ1カラムにも切替可能) */
  .case-study-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}

/* ===== スマホ縦持ち (480px以下):1カラム ===== */
@media (max-width: 480px) {
  .case-study-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
}






/* ===== WHY SECTION ===== */
.why {
  position: relative;
  padding: 70px 40px 60px;
  background: linear-gradient(180deg, #f4f8fd 0%, #e8f0fa 100%);
  overflow: hidden;
}

/* 背景:左上のネットワーク模様 */
.why::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 280px;
  height: 280px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 280' fill='none' stroke='%234a7fd6' stroke-width='0.5' opacity='0.35'%3E%3Cline x1='30' y1='40' x2='110' y2='80'/%3E%3Cline x1='110' y1='80' x2='180' y2='50'/%3E%3Cline x1='110' y1='80' x2='150' y2='160'/%3E%3Cline x1='30' y1='40' x2='60' y2='150'/%3E%3Cline x1='60' y1='150' x2='150' y2='160'/%3E%3Cline x1='150' y1='160' x2='220' y2='130'/%3E%3Cline x1='180' y1='50' x2='220' y2='130'/%3E%3Cline x1='60' y1='150' x2='100' y2='230'/%3E%3Cline x1='150' y1='160' x2='100' y2='230'/%3E%3Cline x1='150' y1='160' x2='200' y2='230'/%3E%3Ccircle cx='30' cy='40' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='110' cy='80' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='180' cy='50' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='60' cy='150' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='150' cy='160' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='220' cy='130' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='100' cy='230' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='200' cy='230' r='3' fill='%234a7fd6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  opacity: 0.6;
}

/* 背景:右下のネットワーク模様 */
.why::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 280px;
  height: 280px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 280' fill='none' stroke='%234a7fd6' stroke-width='0.5' opacity='0.35'%3E%3Cline x1='250' y1='40' x2='170' y2='80'/%3E%3Cline x1='170' y1='80' x2='100' y2='50'/%3E%3Cline x1='170' y1='80' x2='130' y2='160'/%3E%3Cline x1='250' y1='40' x2='220' y2='150'/%3E%3Cline x1='220' y1='150' x2='130' y2='160'/%3E%3Cline x1='130' y1='160' x2='60' y2='130'/%3E%3Cline x1='100' y1='50' x2='60' y2='130'/%3E%3Cline x1='220' y1='150' x2='180' y2='230'/%3E%3Cline x1='130' y1='160' x2='180' y2='230'/%3E%3Cline x1='130' y1='160' x2='80' y2='230'/%3E%3Ccircle cx='250' cy='40' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='170' cy='80' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='100' cy='50' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='220' cy='150' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='130' cy='160' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='60' cy='130' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='180' cy='230' r='3' fill='%234a7fd6'/%3E%3Ccircle cx='80' cy='230' r='3' fill='%234a7fd6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  opacity: 0.6;
}

.why-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* 見出し */
.why-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3rem;
  font-weight: 500;
  color: #1a2347;
  text-align: center;
  letter-spacing: 0.05em;
  margin-bottom: 16px;
}

.why-title-quote {
  color: #112e6f;
  font-weight: 700;
}

/* 装飾線(ダイヤ型マーカー付き) */
.why-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 36px;
}

.why-divider-line {
  width: 220px;
  height: 1px;
  background: #4a7fd6;
  opacity: 0.5;
}

.why-divider-diamond {
  width: 10px;
  height: 10px;
  background: #112e6f;
  transform: rotate(45deg);
}

/* 4カードグリッド */
.why-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 36px;
}

.why-card {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(20, 42, 92, 0.08);
}

.why-card img {
  width: 100%;
  height: auto;
  display: block;
}

/* 下部の説明文 */
.why-conclusion {
  text-align: center;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.7rem;
  font-weight: 500;
  color: #1a2347;
  line-height: 1.9;
  letter-spacing: 0.05em;
}

.why-conclusion-accent {
  color: #112e6f;
  font-weight: 700;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .why {
    padding: 40px 16px 36px;
  }

  .why::before,
  .why::after {
    width: 140px;
    height: 140px;
    opacity: 0.4;
  }

  .why-title {
    font-size: 1.8rem;
    margin-bottom: 12px;
  }

  .why-divider {
    margin-bottom: 24px;
  }

  .why-divider-line {
    width: 100px;
  }

  .why-divider-diamond {
    width: 8px;
    height: 8px;
  }

  .why-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-bottom: 28px;
  }

  .why-conclusion {
    font-size: 1.2rem;
    line-height: 1.8;
  }
}




/* ===== ROLE SECTION ===== */
.role {
  position: relative;
  padding: 50px 40px 60px;
  background: linear-gradient(180deg, #fafcff 0%, #f0f6fc 100%);
  overflow: visible;
}

/* 背景:左右のネットワーク模様 */
.role::before,
.role::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 220px;
  height: 220px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 280' fill='none' stroke='%234a7fd6' stroke-width='0.4' opacity='0.3'%3E%3Cline x1='30' y1='40' x2='110' y2='80'/%3E%3Cline x1='110' y1='80' x2='180' y2='50'/%3E%3Cline x1='110' y1='80' x2='150' y2='160'/%3E%3Cline x1='30' y1='40' x2='60' y2='150'/%3E%3Cline x1='60' y1='150' x2='150' y2='160'/%3E%3Cline x1='150' y1='160' x2='220' y2='130'/%3E%3Ccircle cx='30' cy='40' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='110' cy='80' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='180' cy='50' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='60' cy='150' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='150' cy='160' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='220' cy='130' r='2.5' fill='%234a7fd6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  opacity: 0.5;
}

.role::before {
  left: 0;
}

.role::after {
  right: 0;
  transform: translateY(-50%) scaleX(-1);
}

.role-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* === 見出しエリア === */
.role-header {
  position: relative;
  text-align: center;
  margin-bottom: 36px;
}

/* 月桂冠SVG */
.role-laurel {
  position: absolute;
  top: -10px;
  width: 50px;
  height: 150px;
  pointer-events: none;
}

.role-laurel-left {
  left: 50%;
  margin-left: -400px;
}

.role-laurel-right {
  left: 50%;
  margin-left: 300px;
  transform: scaleX(-1);
}

/* タイトル */
.role-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.8rem;
  font-weight: 500;
  color: #1a2347;
  line-height: 1.5;
  letter-spacing: 0.05em;
  margin-top: 10px;
  margin-bottom: 14px;
  position: relative;
  z-index: 2;
}

.role-title-accent {
  color: #112e6f;
  font-weight: 700;
}

/* 区切り線 */
.role-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.role-divider-line {
  width: 200px;
  height: 1px;
  background: #4a7fd6;
  opacity: 0.5;
}

.role-divider-diamond {
  width: 8px;
  height: 8px;
  background: #2d5fb8;
  transform: rotate(45deg);
}

/* === 3カードグリッド === */
.role-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-bottom: 32px;
}

.role-card {
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
  background: #f0f6fc;
  box-shadow: 0 4px 14px rgba(20, 42, 92, 0.08);
}

.role-card img {
  width: 100%;
  height: auto;
  display: block;
}

/* === 下部メッセージ === */
.role-message {


  padding: 22px 32px;
  display: flex;
  align-items: center;
  gap: 18px;
  box-shadow: 0 2px 8px rgba(20, 42, 92, 0.04);
  text-align: center;
  justify-content: center;
}

.role-message-icon {
  flex-shrink: 0;
  width: 200px;
  height: 200px;
  margin-top: -40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.role-message-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.role-message-icon svg {
  width: 80%;
  height: 80%;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
}

.role-message-text {
  font-family: 'Noto Serif JP', serif;
  /* ← 明朝体に変更 */
  font-size: 1.8rem;
  line-height: 1.5;
  color: #1a2347;
  font-weight: 500;
  letter-spacing: 0.04em;
  /* ← 明朝体に合わせて少し広げる */

}

.role-message-accent {
  color: #2d5fb8;
  font-weight: 700;
  font-size: 1.4em;
}


.role-arrow {
  display: flex;
  bottom: -30px;
  width: 100%;
  flex-direction: column;
  justify-content: center;
  /* ← 横方向の中央寄せを追加 */
  align-items: center;
  margin-top: 30px;
  /* ← メッセージとの間隔 */
  margin-bottom: -50px;
  /* ← 次のセクションに被せる(マイナス値) */
  position: relative;
  z-index: 10;
}

.role-arrow img {
  width: 300px;
  height: 70px;
  position: relative;
  z-index: 11;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .role {
    padding: 40px 16px 0px;
  }

  .role::before,
  .role::after {
    width: 100px;
    height: 100px;
    opacity: 0.3;
  }

  .role-header {
    margin-bottom: 24px;
    padding: 0;
    /* ← 月桂冠用の余白を削除 */
  }

  /* スマホでは月桂冠を非表示 */
  .role-laurel {
    display: none;
  }

  .role-laurel {
    padding: 0 10px;
    width: 60px;
    height: 150px;
    top: 0;
  }

  .role-laurel-left {
    margin-left: -160px;
  }

  .role-laurel-right {
    margin-left: 110px;
  }

  .role-title {
    padding: 0 10px;
    font-size: 1.8rem;
    line-height: 1.6;
  }

  .role-divider-line {
    width: 80px;
  }

  .role-divider-diamond {
    width: 6px;
    height: 6px;
  }

  .role-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 24px;
  }

  .role-message {
    padding: 16px 18px 0;
    gap: 12px;
    flex-direction: column;
    text-align: center;
  }

  .role-message-icon {
    width: 120px;
    height: 120px;
  }


  .role-message-text {
    font-family: 'Noto Serif JP', serif;
    /* ← 明朝体に変更 */
    font-size: 1.2rem;
    line-height: 1.6;
    color: #1a2347;
    font-weight: 500;
    letter-spacing: 0.04em;
    /* ← 明朝体に合わせて少し広げる */
  }
}

.role-arrow img {
  width: 200px;
  height: 50px;
}

/* ===== ASSET SECTION ===== */
.asset {
  position: relative;
  padding: 60px 40px 50px;
  overflow: visible;
  z-index: 1;
}

/* 背景:ネットワーク模様 */
.asset::before {
  content: '';
  position: absolute;
  top: 30%;
  left: 0;
  width: 250px;
  height: 250px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 280' fill='none' stroke='%234a7fd6' stroke-width='0.4' opacity='0.3'%3E%3Cline x1='30' y1='40' x2='110' y2='80'/%3E%3Cline x1='110' y1='80' x2='180' y2='50'/%3E%3Cline x1='110' y1='80' x2='150' y2='160'/%3E%3Cline x1='30' y1='40' x2='60' y2='150'/%3E%3Cline x1='60' y1='150' x2='150' y2='160'/%3E%3Cline x1='150' y1='160' x2='220' y2='130'/%3E%3Ccircle cx='30' cy='40' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='110' cy='80' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='180' cy='50' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='60' cy='150' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='150' cy='160' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='220' cy='130' r='2.5' fill='%234a7fd6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  opacity: 0.5;
}

.asset-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* 上部:左テキスト + 右フロー図 */
.asset-top {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: 40px;
  align-items: start;
  margin-bottom: 32px;
}

.asset-left {
  padding-top: 16px;
}

.asset-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.8rem;
  font-weight: 500;
  color: #1a2347;
  line-height: 1.3;
  letter-spacing: 0.05em;
  margin-bottom: 16px;
}

.asset-title-accent {
  color: #2d5fb8;
  font-weight: 700;
}

.asset-divider {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
}

.asset-divider-line {
  width: 80px;
  height: 1px;
  background: #4a7fd6;
  opacity: 0.5;
}

.asset-divider-diamond {
  width: 8px;
  height: 8px;
  background: #2d5fb8;
  transform: rotate(45deg);
}

.asset-subtitle {
  font-family: 'Noto Serif JP', serif;
  line-height: 1.7;
  color: #1a2347;
  font-weight: 500;
  letter-spacing: 0.02em;
}

/* 右:フロー図画像 */
.asset-flow {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  line-height: 1.5;
}

.asset-flow img {
  width: 100%;
  height: auto;
  display: block;
}

/* 中段:4カード */
.asset-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 32px;
}

.asset-card {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 12px rgba(20, 42, 92, 0.08);
}

.asset-card img {
  width: 100%;
  height: auto;
  display: block;
}

/* 下部バナー */
.asset-banner {

  padding: 24px 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  box-shadow: 0 2px 8px rgba(20, 42, 92, 0.04);
}

.asset-banner-sparkle {
  flex-shrink: 0;
  width: 32px;
  height: 28px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 28' fill='%23c9a55b'%3E%3Cpath d='M16 2 L17 12 L25 14 L17 16 L16 26 L15 16 L7 14 L15 12 Z'/%3E%3Cpath d='M24 4 L24.3 6 L26.3 6.3 L24.3 6.6 L24 8.6 L23.7 6.6 L21.7 6.3 L23.7 6 Z' opacity='0.6'/%3E%3Cpath d='M6 20 L6.3 22 L8.3 22.3 L6.3 22.6 L6 24.6 L5.7 22.6 L3.7 22.3 L5.7 22 Z' opacity='0.6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.asset-banner-leaf {
  flex-shrink: 0;
  width: 36px;
  height: 30px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 30' fill='%234a7fd6'%3E%3Cpath d='M2 15 Q14 4 30 8 Q26 16 18 20 Q10 22 2 15Z' opacity='0.45'/%3E%3Cpath d='M2 15 L30 8' stroke='%234a7fd6' stroke-width='0.5' fill='none' opacity='0.6'/%3E%3Cpath d='M8 13 L16 9' stroke='%234a7fd6' stroke-width='0.5' fill='none' opacity='0.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.asset-banner-text {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: #1a2347;
  letter-spacing: 0.08em;
  line-height: 1.5;
}

.asset-banner-quote {
  color: #2d5fb8;
  font-size: 1.4em;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .asset {
    padding: 60px 16px 36px;
    text-align: center;
  }

  .asset::before {
    width: 120px;
    height: 120px;
    opacity: 0.3;
  }

  .asset-top {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-bottom: 24px;
  }

  .asset-left {
    padding-top: 0;
  }

  .asset-title {
    font-size: 2.2rem;
    line-height: 1.4;
    margin-top: 30px;
  }

  .asset-divider-line {
    width: 100px;
    margin: 0 auto;

  }

  .asset-divider-diamond {
    width: 6px;
    height: 6px;

  }

  .asset-subtitle {
    font-size: 1.2rem;
    line-height: 1.9;
  }

  .asset-cards {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-bottom: 24px;
  }

  .asset-banner {
    padding: 16px 18px;
    gap: 12px;
    flex-wrap: wrap;
  }

  .asset-banner-sparkle {
    width: 22px;
    height: 20px;
  }

  .asset-banner-leaf {
    width: 26px;
    height: 22px;
  }

  .asset-banner-text {
    font-size: 1.2rem;
    letter-spacing: 0.05em;
  }
}

/* ===== CASE STUDY SECTION ===== */
.case {
  position: relative;
  padding: 60px 40px 50px;
  background-color: #ffece9;
  overflow: hidden;
}

/* 背景:左上のネットワーク模様 */
.case::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 200px;
  height: 200px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 280' fill='none' stroke='%234a7fd6' stroke-width='0.4' opacity='0.3'%3E%3Cline x1='30' y1='40' x2='110' y2='80'/%3E%3Cline x1='110' y1='80' x2='180' y2='50'/%3E%3Cline x1='110' y1='80' x2='150' y2='160'/%3E%3Cline x1='30' y1='40' x2='60' y2='150'/%3E%3Cline x1='60' y1='150' x2='150' y2='160'/%3E%3Cline x1='150' y1='160' x2='220' y2='130'/%3E%3Ccircle cx='30' cy='40' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='110' cy='80' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='180' cy='50' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='60' cy='150' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='150' cy='160' r='2.5' fill='%234a7fd6'/%3E%3Ccircle cx='220' cy='130' r='2.5' fill='%234a7fd6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  opacity: 0.5;
}

/* 背景:バナー周辺の放射状ライト */
.case::after {
  content: '';
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  max-width: 1100px;
  height: 180px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 180' fill='none' stroke='%234a7fd6' stroke-width='0.5' opacity='0.4' stroke-linecap='round'%3E%3Cline x1='400' y1='90' x2='40' y2='30'/%3E%3Cline x1='400' y1='90' x2='80' y2='60'/%3E%3Cline x1='400' y1='90' x2='130' y2='90'/%3E%3Cline x1='400' y1='90' x2='80' y2='130'/%3E%3Cline x1='400' y1='90' x2='40' y2='160'/%3E%3Cline x1='400' y1='90' x2='760' y2='30'/%3E%3Cline x1='400' y1='90' x2='720' y2='60'/%3E%3Cline x1='400' y1='90' x2='670' y2='90'/%3E%3Cline x1='400' y1='90' x2='720' y2='130'/%3E%3Cline x1='400' y1='90' x2='760' y2='160'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  opacity: 0.6;
}

.case-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* === ヘッダー部分 === */
/* ラベル(矢印付き) */
.case-label-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 12px;
}

.case-label-arrow {
  width: 24px;
  height: 1px;
  background: #2d5fb8;
  position: relative;
}

.case-label-arrow.left::after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 6px;
  height: 6px;
  border-left: 1px solid #2d5fb8;
  border-bottom: 1px solid #2d5fb8;
  transform: translateY(-50%) rotate(45deg);
}

.case-label-arrow.right::after {
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1px solid #2d5fb8;
  border-top: 1px solid #2d5fb8;
  transform: translateY(-50%) rotate(45deg);
}

.case-label {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.8rem;
  font-weight: 500;
  color: #1a2347;
  letter-spacing: 0.08em;
}

/* メインタイトル */
.case-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.8rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.5;
  letter-spacing: 0.04em;
  text-align: center;
  margin-bottom: 12px;
}

.case-title-quote {
  color: #2d5fb8;
}

/* サブテキスト */
.case-subtitle {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.2rem;
  line-height: 1.9;
  color: #1a2347;
  text-align: center;
  font-weight: 500;
  letter-spacing: 0.02em;
  margin-bottom: 28px;
}

/* === 3カードグリッド === */
.case-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-bottom: 36px;
  position: relative;
}

.case-card {
  width: 100%;
  border-radius: 10px;


}

.case-card img {
  width: 100%;
  height: auto;
  display: block;
}

/* === ツインバナー === */
.case-banner {
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 30px;
  position: relative;
  z-index: 2;

}

.case-banner img {
  width: 100%;
  height: auto;
  display: block;
}



/* 左:青いタグ */
.case-banner-tag {
  flex-shrink: 0;
  background: linear-gradient(135deg, #1e3a8a 0%, #2d5fb8 100%);
  color: #fff;
  padding: 22px 50px 22px 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.4;
  text-align: center;
  /* 右側を斜めにカット */
  clip-path: polygon(0 0, 100% 0, calc(100% - 24px) 100%, 0 100%);
  min-width: 220px;
}

/* 右:メインテキスト */
.case-banner-body {
  flex: 1;
  padding: 18px 36px 18px 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.case-banner-main {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: #1a2347;
  letter-spacing: 0.04em;
  line-height: 1.4;
  margin-bottom: 4px;
}

.case-banner-quote {
  color: #2d5fb8;
}

.case-banner-sub {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.2rem;
  line-height: 1.7;
  color: #1a2347;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.case-banner-sub-accent {
  color: #2d5fb8;
  font-weight: 700;
}

/* === 下部▼マーク === */
.case-arrow {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.case-arrow-icon {
  width: 50px;
  height: 26px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 30' fill='none'%3E%3Cpath d='M5 5 L25 22 L45 5' stroke='%234a7fd6' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10 14 L25 27 L40 14' stroke='%234a7fd6' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round' opacity='0.4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .case {
    padding: 40px 16px 36px;
  }

  .case::before {
    width: 100px;
    height: 100px;
    opacity: 0.3;
  }

  .case::after {
    width: 100%;
    bottom: 30px;
    height: 120px;
  }

  .case-label {
    font-size: 1.3rem;
  }

  .case-label-arrow {
    width: 16px;
  }

  .case-title {
    font-size: 1.8rem;
    line-height: 1.5;
  }

  .case-subtitle {
    font-size: 1.1rem;
    line-height: 1.8;
    margin-bottom: 22px;
  }

  .case-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 28px;
  }

  .case-banner {
    flex-direction: column;
    margin-bottom: 24px;
  }

  .case-banner-tag {
    width: 100%;
    min-width: 0;
    padding: 14px 16px;
    font-size: 1.4rem;
    clip-path: none;
  }

  .case-banner-body {
    padding: 16px;
  }

  .case-banner-main {
    font-size: 1.6rem;
  }

  .case-banner-sub {
    font-size: 1.1rem;
  }

  .case-arrow-icon {
    width: 40px;
    height: 22px;
  }
}

/* ===== SETUP SECTION ===== */
.setup {
  position: relative;
  padding: 70px 40px 60px;
  background: linear-gradient(180deg, #fafcff 0%, #f0f6fc 100%);
  overflow: hidden;
}

.setup-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* === 見出しエリア === */
.setup-header {
  position: relative;
  text-align: center;
  margin-bottom: 40px;
  padding-top: 30px;
}

/* 上部の放射状ライト(ゴールド) */
.setup-header::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 30px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 30' fill='none' stroke='%23c9a55b' stroke-width='1' stroke-linecap='round'%3E%3Cline x1='40' y1='28' x2='40' y2='4'/%3E%3Cline x1='40' y1='28' x2='28' y2='8'/%3E%3Cline x1='40' y1='28' x2='52' y2='8'/%3E%3Cline x1='40' y1='28' x2='18' y2='14'/%3E%3Cline x1='40' y1='28' x2='62' y2='14'/%3E%3Cline x1='40' y1='28' x2='10' y2='22'/%3E%3Cline x1='40' y1='28' x2='70' y2='22'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0.8;
}

/* タイトル */
.setup-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.8rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.4;
  letter-spacing: 0.08em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
}

/* 「3」の青色強調 */
.setup-title-num {
  color: #2d5fb8;
  font-size: 1.4em;
  font-weight: 900;
  letter-spacing: 0.02em;
}

/* タイトル前後のキラキラ装飾 */
.setup-title::before,
.setup-title::after {
  content: '';
  width: 100px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  flex-shrink: 0;
}

.setup-title::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 24' fill='none'%3E%3Cline x1='0' y1='12' x2='80' y2='12' stroke='%23c9a55b' stroke-width='0.8' opacity='0.7'/%3E%3Cpath d='M 88 12 L 89 8 L 93 7 L 89 6 L 88 2 L 87 6 L 83 7 L 87 8 Z' fill='%23c9a55b' opacity='0.9'/%3E%3Cpath d='M 88 12 L 89 16 L 93 17 L 89 18 L 88 22 L 87 18 L 83 17 L 87 16 Z' fill='%23c9a55b' opacity='0.9'/%3E%3C/svg%3E");
}

.setup-title::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 24' fill='none'%3E%3Cline x1='20' y1='12' x2='100' y2='12' stroke='%23c9a55b' stroke-width='0.8' opacity='0.7'/%3E%3Cpath d='M 12 12 L 13 8 L 17 7 L 13 6 L 12 2 L 11 6 L 7 7 L 11 8 Z' fill='%23c9a55b' opacity='0.9'/%3E%3Cpath d='M 12 12 L 13 16 L 17 17 L 13 18 L 12 22 L 11 18 L 7 17 L 11 16 Z' fill='%23c9a55b' opacity='0.9'/%3E%3C/svg%3E");
}

/* === 3カードグリッド === */
.setup-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.setup-card {
  width: 100%;
  border-radius: 10px;
  overflow: hidden;

}

.setup-card img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .setup {
    padding: 50px 16px 40px;
  }

  .setup-header {
    margin-bottom: 28px;
    padding-top: 24px;
  }

  .setup-header::before {
    width: 60px;
    height: 22px;
  }

  .setup-title {
    font-size: 2rem;
    gap: 8px;
    letter-spacing: 0.04em;
  }

  .setup-title::before,
  .setup-title::after {
    width: 40px;
    height: 18px;
  }

  .setup-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

/* ===== SCOPE SECTION ===== */
.scope {
  position: relative;
  padding: 70px 40px 50px;
  background: #ffffff;
  overflow: hidden;
}

.scope-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* === 見出しエリア === */
.scope-header {
  text-align: center;
  margin-bottom: 40px;
}

.scope-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  color: #2d5fb8;
  margin-bottom: 14px;
}

.scope-label::before,
.scope-label::after {
  content: '';
  width: 36px;
  height: 1px;
  background: #2d5fb8;
}

.scope-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3.6rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.5;
  letter-spacing: 0.06em;
}

.scope-title-accent {
  color: #2d5fb8;
}

/* === カードエリア === */
.scope-cards {
  margin-bottom: 50px;
}

/* PC用カード(1枚画像) */
.scope-card-pc {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
}

.scope-card-pc img {
  width: 100%;
  height: auto;
  display: block;
}

/* スマホ用カード(2枚画像、デフォルトでは非表示) */
.scope-card-sp {
  display: none;
}

/* === 下部:人物画像 === */
.scope-bottom {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
}

.scope-bottom img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .scope {
    padding: 40px 16px 30px;
  }

  /* 見出し */
  .scope-header {
    margin-bottom: 24px;
  }

  .scope-label {
    font-size: 1.1rem;
  }

  .scope-label::before,
  .scope-label::after {
    width: 24px;
  }

  .scope-title {
    font-size: 2rem;
    line-height: 1.5;
  }

  /* カード:PC用を非表示、スマホ用を表示 */
  .scope-card-pc {
    display: none;
  }

  .scope-card-sp {
    display: block;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 16px;
  }

  .scope-card-sp:last-child {
    margin-bottom: 0;
  }

  .scope-card-sp img {
    width: 100%;
    height: auto;
    display: block;
  }

  .scope-cards {
    margin-bottom: 30px;
  }
}








/* ===== PRICE SECTION ===== */
.price {
  position: relative;
  padding: 60px 40px 50px;
  background: linear-gradient(180deg, #fafcff 0%, #f0f6fc 100%);
  overflow: hidden;
}

/* === サブタイトル === */
.price-subtitle {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.6rem;
  font-weight: 500;
  color: #1a2347;
  letter-spacing: 0.06em;
  line-height: 1.6;
  margin-top: -30px;
  margin-bottom: 50px;
}

.price-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* === 見出しエリア === */
.price-header {
  text-align: center;
  margin-bottom: 10px;
}

.price-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  color: #2d5fb8;
  margin-bottom: 8px;
}

.price-label::before,
.price-label::after {
  content: '';
  width: 36px;
  height: 1px;
  background: #2d5fb8;
}

.price-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3.2rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.4;
  letter-spacing: 0.08em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-bottom: 50px;
}

.price-title::before,
.price-title::after {
  content: '';
  width: 80px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  flex-shrink: 0;
}

.price-title::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 24' fill='none'%3E%3Cline x1='0' y1='12' x2='60' y2='12' stroke='%23c9a55b' stroke-width='0.8' opacity='0.7'/%3E%3Cpath d='M 70 12 L 71 7 L 76 6 L 71 5 L 70 0 L 69 5 L 64 6 L 69 7 Z' fill='%23c9a55b' opacity='0.9'/%3E%3Cpath d='M 70 12 L 71 17 L 76 18 L 71 19 L 70 24 L 69 19 L 64 18 L 69 17 Z' fill='%23c9a55b' opacity='0.9'/%3E%3C/svg%3E");
}

.price-title::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 24' fill='none'%3E%3Cline x1='20' y1='12' x2='80' y2='12' stroke='%23c9a55b' stroke-width='0.8' opacity='0.7'/%3E%3Cpath d='M 10 12 L 11 7 L 16 6 L 11 5 L 10 0 L 9 5 L 4 6 L 9 7 Z' fill='%23c9a55b' opacity='0.9'/%3E%3Cpath d='M 10 12 L 11 17 L 16 18 L 11 19 L 10 24 L 9 19 L 4 18 L 9 17 Z' fill='%23c9a55b' opacity='0.9'/%3E%3C/svg%3E");
}

/* === 3カードグリッド === */
.price-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 32px;
  align-items: stretch;
}

.price-card {
  width: 100%;
  border-radius: 10px;
  overflow: hidden;


}

.price-card img {
  width: 100%;
  height: auto;
  display: block;
}

/* 中央のスタンダードプランは少し浮き上がらせる */
.price-card.is-popular {
  transform: translateY(-8px);

}

/* === 最下部のメッセージ === */
.price-footer-message {
  text-align: center;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.8rem;
  font-weight: 500;
  color: #1a2347;
  letter-spacing: 0.05em;
  line-height: 1.8;
  margin-top: 32px;
  padding: 24px 20px;



}

.price-footer-message-accent {
  color: #2d5fb8;
  font-weight: 700;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .price {
    padding: 40px 16px 36px;
  }

  .price-label {
    font-size: 1rem;
  }

  .price-subtitle {
    font-size: 1.2rem;
    margin-top: -20px;
    margin-bottom: 30px;
  }

  .price-label::before,
  .price-label::after {
    width: 24px;
  }

  .price-title {
    font-size: 2.2rem;
    gap: 10px;
    letter-spacing: 0.04em;
  }

  .price-title::before,
  .price-title::after {
    width: 40px;
    height: 18px;
  }

  .price-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 24px;
  }

  .price-card.is-popular {
    transform: none;
  }

  .price-compare {
    grid-template-columns: 1fr;
    padding: 20px;
    gap: 14px;
  }

  .price-compare-item:not(:last-child)::after {
    right: auto;
    top: auto;
    bottom: -8px;
    left: 10%;
    transform: none;
    width: 80%;
    height: 1px;
  }

  .price-compare-item {
    padding: 0 8px 8px;
  }

  .price-compare-icon {
    width: 44px;
    height: 44px;
  }

  .price-compare-num {
    font-size: 1.8rem;
  }

  .price-footer {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .price-footer-text {
    font-size: 1.2rem;
  }

  .price-card img {
    width: 100%;
  }

  .price-footer-message {
    font-size: 1.3rem;
    margin-top: 24px;
    padding: 18px 16px;
    line-height: 1.8;
  }

  /* スマホでは改行を有効に */
  .price-br-sp {
    display: inline;
  }

}

/* ===== MERIT SECTION ===== */
.merit {
  position: relative;
  padding: 60px 30px 50px;
  background: linear-gradient(180deg, #fafcff 0%, #e8f0fa 100%);
  overflow: hidden;
}

.merit-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* === 見出しエリア === */
.merit-header {
  text-align: center;
  margin-bottom: 32px;
  padding-top: 16px;
  position: relative;
}

/* 上部のキラキラ装飾 */
.merit-header::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 20' fill='none'%3E%3Cpath d='M 28 10 L 29 6 L 33 5 L 29 4 L 28 0 L 27 4 L 23 5 L 27 6 Z' fill='%23c9a55b' opacity='0.9'/%3E%3Cpath d='M 40 12 L 41 8 L 45 7 L 41 6 L 40 2 L 39 6 L 35 7 L 39 8 Z' fill='%232d5fb8' opacity='0.9'/%3E%3Cpath d='M 52 10 L 53 6 L 57 5 L 53 4 L 52 0 L 51 4 L 47 5 L 51 6 Z' fill='%23c9a55b' opacity='0.9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
}

.merit-label {
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  color: #2d5fb8;
  margin-bottom: 6px;
}

.merit-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3.2rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.4;
  letter-spacing: 0.1em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.merit-title::before,
.merit-title::after {
  content: '';
  width: 60px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  flex-shrink: 0;
}

.merit-title::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 24' fill='none'%3E%3Cline x1='0' y1='12' x2='50' y2='12' stroke='%232d5fb8' stroke-width='1' opacity='0.6'/%3E%3Cpath d='M 50 12 L 56 8 L 56 16 Z' fill='%232d5fb8' opacity='0.7'/%3E%3C/svg%3E");
}

.merit-title::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 24' fill='none'%3E%3Cline x1='10' y1='12' x2='60' y2='12' stroke='%232d5fb8' stroke-width='1' opacity='0.6'/%3E%3Cpath d='M 10 12 L 4 8 L 4 16 Z' fill='%232d5fb8' opacity='0.7'/%3E%3C/svg%3E");
}

/* === メリットカード(縦に4つ) === */
.merit-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.merit-card {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(20, 42, 92, 0.08);
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
}

/* 左:テキストエリア */
.merit-card-body {
  padding: 36px 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.merit-card-num {
  font-family: 'Noto Serif JP', serif;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #e8f0fa;
  color: #2d5fb8;
  padding: 6px 14px;
  border-radius: 4px;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  margin-bottom: 16px;
  align-self: flex-start;
}

.merit-card-num-large {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1;
}

.merit-card-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.2rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.4;
  letter-spacing: 0.04em;
  margin-bottom: 16px;
}

/* 区切り線 */
.merit-card-divider {
  width: 50px;
  height: 2px;
  background: #2d5fb8;
  margin-bottom: 16px;
}

.merit-card-desc {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.4rem;
  line-height: 1.9;
  color: #1a2347;
  font-weight: 500;
  letter-spacing: 0.02em;
}

/* 右:写真エリア */
.merit-card-photo {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #e8f0fa;
  min-height: 220px;
}

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

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .merit {
    padding: 40px 16px 36px;
  }

  .merit-header {
    margin-bottom: 24px;
    padding-top: 12px;
  }

  .merit-header::before {
    width: 60px;
    height: 16px;
  }

  .merit-label {
    font-size: 1rem;
  }

  .merit-title {
    font-family: 'Noto Serif JP', serif;
    font-size: 2.2rem;
    gap: 8px;
    letter-spacing: 0.05em;
  }

  .merit-title::before,
  .merit-title::after {
    width: 30px;
    height: 18px;
  }

  .merit-list {
    gap: 14px;
  }

  .merit-card {
    grid-template-columns: 1fr;
  }

  .merit-card-body {
    padding: 24px 22px;
  }

  .merit-card-title {
    font-family: 'Noto Serif JP', serif;
    font-size: 1.4rem;
    margin-bottom: 12px;
  }

  .merit-card-divider {
    width: 40px;
    margin-bottom: 12px;
  }

  .merit-card-desc {
    font-size: 1rem;
    line-height: 1.8;
  }

  .merit-card-photo {
    min-height: 180px;
    order: -1;
    /* スマホでは写真を上に */
  }
}

/* ===== COST COMPARE SECTION ===== */
.cost {
  position: relative;
  padding: 60px 40px 40px;
  background: linear-gradient(180deg, #fafcff 0%, #f0f6fc 100%);
  overflow: hidden;
}

.cost-inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  z-index: 1;
}

/* === 上部キャッチ === */
.cost-header {
  text-align: center;
  margin-bottom: 36px;
  position: relative;
}

/* 小タイトル(横線+テキスト) */
.cost-header-small {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  font-family: 'Noto Serif JP', serif;
  font-size: 2.2rem;
  font-weight: 500;
  color: #1a2347;
  letter-spacing: 0.04em;
  margin-bottom: 6px;
}

.cost-header-small::before,
.cost-header-small::after {
  content: '';
  width: 50px;
  height: 1px;
  background: #c9a55b;
}

/* メインタイトル */
.cost-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.8rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.4;
  letter-spacing: 0.04em;
  margin-bottom: 20px;
}

.cost-title-gold {
  color: #c9a55b;
}

/* ▽マーク */
.cost-arrow-down {
  width: 30px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 18' fill='%231a2347'%3E%3Cpath d='M0 0 L15 18 L30 0 Z' opacity='0.85'/%3E%3C/svg%3E") no-repeat center / contain;
  margin: 0 auto;
}

/* 横線(コンテンツとの区切り) */
.cost-divider-line {
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(201, 165, 91, 0.4) 50%, transparent 100%);
  margin-bottom: 30px;
}

/* === コスト比較画像エリア === */
.cost-compare-wrap {
  position: relative;
}

.cost-compare-img {
  width: 100%;
  overflow: hidden;
}

.cost-compare-img img {
  width: 100%;
  height: auto;
  display: block;
}

/* 「コストを約74%削減」金バッジ */
.cost-percent-badge {
  position: absolute;
  right: 30px;
  bottom: -30px;
  width: 110px;
  height: 110px;
  background: radial-gradient(circle at 35% 35%, #f5d76e 0%, #e8c44a 30%, #d4a943 65%, #a8853f 100%);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: 'Noto Serif JP', serif;
  text-align: center;
  line-height: 1.2;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
  border: 2px solid rgba(255, 255, 255, 0.5);
  z-index: 3;
}

.cost-percent-badge-label {
  font-size: 1.2rem;
  font-weight: 500;
  margin-bottom: 2px;
}

.cost-percent-badge-num {
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.cost-percent-badge-num strong {
  font-size: 2.4rem;
  font-weight: 900;
}

.cost-percent-badge-asterisk {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.85);
  margin-top: 1px;
}

/* === 下部:年間コスト削減バナー === */
.cost-banner-wrap {
  position: relative;
  margin-top: 36px;
  margin-bottom: 22px;
}

.cost-banner {
  background: linear-gradient(135deg, #0a1838 0%, #142a5c 60%, #1e3a8a 100%);
  border-radius: 8px;
  padding: 26px 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  box-shadow: 0 6px 18px rgba(20, 42, 92, 0.2);
  position: relative;
}

/* 左:「年間で」タグ */
.cost-banner-tag {
  flex-shrink: 0;
  background: #fff;
  color: #1a2347;
  padding: 14px 26px;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

/* 右:メインテキスト */
.cost-banner-text {
  font-family: 'Noto Serif JP', serif;
  font-size: 3rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.03em;
  line-height: 1.3;
}

.cost-banner-text-num {
  color: #f5d76e;
  font-size: 1.4em;
  font-weight: 900;
  margin: 0 4px;
}

.cost-banner-text-yen {
  color: #f5d76e;
  font-size: 0.95em;
  font-weight: 700;
}

/* 月桂冠装飾(右側) */
.cost-banner-laurel {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 60px;
  height: auto;
  pointer-events: none;
  opacity: 0.7;
}

/* === 注釈テキスト === */
.cost-note {
  text-align: center;
  font-size: 1.2rem;
  color: #6b7a96;
  line-height: 1.7;
  letter-spacing: 0.02em;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .cost {
    padding: 40px 16px 30px;
  }

  .cost-header {
    margin-bottom: 24px;
  }

  .cost-header-small {
    font-size: 1.4rem;
    gap: 8px;
    margin-bottom: 4px;
  }

  .cost-header-small::before,
  .cost-header-small::after {
    width: 24px;
  }

  .cost-title {
    font-size: 2.2rem;
    line-height: 1.4;
    margin-bottom: 14px;
  }

  .cost-arrow-down {
    width: 22px;
    height: 14px;
  }

  .cost-divider-line {
    margin-bottom: 20px;
  }

  .cost-percent-badge {
    width: 78px;
    height: 78px;
    right: 14px;
    bottom: -22px;
  }

  .cost-percent-badge-label {
    font-size: 0.9rem;
  }

  .cost-percent-badge-num {
    font-size: 1.1rem;
  }

  .cost-percent-badge-num strong {
    font-size: 1.8rem;
  }

  .cost-banner-wrap {
    margin-top: 28px;
  }

  .cost-banner {
    padding: 18px 16px;
    flex-direction: column;
    gap: 12px;
  }

  .cost-banner-tag {
    font-size: 1.4rem;
    padding: 8px 18px;
  }

  .cost-banner-text {
    font-size: 1.8rem;
    text-align: center;
  }

  .cost-banner-laurel {
    display: none;
  }

  .cost-note {
    font-size: 0.7rem;
  }
}






/* ===== FAQ SECTION ===== */
.faq {
  position: relative;
  padding: 60px 30px 50px;
  background: linear-gradient(180deg, #0a1838 0%, #142a5c 100%);
  overflow: hidden;
}

/* 背景:右上のドット模様 */
.faq::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 200px;
  height: 200px;
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0.15) 1.5px, transparent 1.5px);
  background-size: 14px 14px;
  pointer-events: none;
  opacity: 0.6;
  -webkit-mask-image: radial-gradient(ellipse at top right, #000 30%, transparent 70%);
  mask-image: radial-gradient(ellipse at top right, #000 30%, transparent 70%);
}

/* 背景:下部の波模様 */
.faq::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 200px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1100 200' fill='none' opacity='0.15'%3E%3Cpath d='M 0 100 Q 200 60 400 100 T 800 100 T 1100 100' stroke='%23ffffff' stroke-width='1' fill='none'/%3E%3Cpath d='M 0 130 Q 250 90 500 130 T 1000 130 T 1100 130' stroke='%23ffffff' stroke-width='1' fill='none'/%3E%3Cpath d='M 0 160 Q 200 120 400 160 T 800 160 T 1100 160' stroke='%23ffffff' stroke-width='1' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom;
  pointer-events: none;
  opacity: 0.5;
}

.faq-inner {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  z-index: 1;
}

.faq-header {
  text-align: center;
  margin-bottom: 36px;
  position: relative;
}

/* 背景透かし「Q&A」 */
.faq-watermark {
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'Noto Serif JP', serif;
  font-size: 13rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.05);
  letter-spacing: -0.05em;
  pointer-events: none;
  line-height: 1;
  z-index: 0;
  white-space: nowrap;
}

.faq-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  color: #c9a55b;
  margin-bottom: 8px;
  position: relative;
  z-index: 2;
}

.faq-label::before,
.faq-label::after {
  content: '';
  width: 28px;
  height: 1px;
  background: #c9a55b;
}

.faq-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3.6rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.4;
  letter-spacing: 0.1em;
  margin-bottom: 12px;
  position: relative;
  z-index: 2;
}

.faq-subtitle {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.3rem;
  color: rgba(255, 255, 255, 0.85);
  letter-spacing: 0.04em;
  margin-bottom: 8px;
  position: relative;
  z-index: 2;
}

.faq-subtitle-line {
  width: 60px;
  height: 2px;
  background: #4a7fd6;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

/* アコーディオン */
.faq-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.faq-item {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
  transition: box-shadow 0.3s;
}

.faq-item[open] {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

.faq-question {
  padding: 22px 30px;
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 18px;
}

.faq-question::-webkit-details-marker {
  display: none;
}

.faq-q-icon {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  background: #2d5fb8;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.8rem;
  font-weight: 700;
}

.faq-q-text {
  flex: 1;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.4rem;
  font-weight: 700;
  color: #1a2347;
  letter-spacing: 0.04em;
  line-height: 1.5;
}

.faq-divider-v {
  flex-shrink: 0;
  width: 1px;
  height: 24px;
  background: #d8e3f3;
}

/* +/- アイコン */
.faq-toggle-icon {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border: 2px solid #2d5fb8;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2d5fb8;
  transition: background 0.3s, color 0.3s;
  position: relative;
}

.faq-toggle-icon::before,
.faq-toggle-icon::after {
  content: '';
  position: absolute;
  background: currentColor;
  transition: transform 0.3s;
}

.faq-toggle-icon::before {
  width: 14px;
  height: 2px;
}

.faq-toggle-icon::after {
  width: 2px;
  height: 14px;
}

.faq-item[open] .faq-toggle-icon {
  background: #2d5fb8;
  color: #fff;
}

.faq-item[open] .faq-toggle-icon::after {
  transform: scaleY(0);
}

/* 回答エリア */
.faq-answer {
  padding: 0 30px 24px 30px;
}

.faq-answer-wrap {
  background: #f0f6fc;
  border-radius: 8px;
  padding: 22px 26px;
  display: flex;
  align-items: flex-start;
  gap: 18px;
  width: 100%;
}

.faq-a-icon {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  background: #c9d6ec;
  color: #2d5fb8;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.8rem;
  font-weight: 700;
}

.faq-a-text {
  font-family: 'Noto Serif JP', serif;
  flex: 1;
  font-size: 1.3rem;
  line-height: 2;
  color: #1a2347;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.faq-a-text strong {
  color: #2d5fb8;
  font-weight: 700;
}

.faq-a-text ul {
  margin: 8px 0;
  padding-left: 0;
  list-style: none;
}

.faq-a-text ul li {
  padding-left: 18px;
  position: relative;
  margin-bottom: 4px;
}

.faq-a-text ul li::before {
  content: '';
  position: absolute;
  left: 4px;
  top: 0.85em;
  width: 8px;
  height: 1px;
  background: #2d5fb8;
}

.faq-a-text p+p {
  margin-top: 10px;
}

/* ===== CTA SECTION ===== */
.cta-section {
  position: relative;
  overflow: hidden;
  min-height: 480px;
}

/* 背景画像 */
.cta-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.cta-bg img {
  width: 100%;

  object-fit: cover;
  display: block;
}

/* コンテンツ */
.cta-inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 40px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
  z-index: 2;
}

.cta-right {
  color: #fff;
  text-align: center;
  /* ← 追加 */
}

/* 上部:バッジ + タイトル */
.cta-header {
  display: flex;
  flex-direction: column;
  /* ← 縦積みに変更 */
  align-items: center;
  /* ← 中央寄せに変更 */
  gap: 16px;
  /* ← 縦の余白に調整 */
  margin-bottom: 36px;
}

.cta-badge {
  flex-shrink: 0;
  width: 100px;
  height: 100px;
  background: radial-gradient(circle at 35% 35%, #f5d76e 0%, #e8c44a 30%, #d4a943 65%, #a8853f 100%);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-align: center;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
  border: 2px solid rgba(255, 255, 255, 0.5);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.cta-header-text {
  flex: 1;
  text-align: center;
  /* ← 追加 */
}

.cta-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.2rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.4;
  letter-spacing: 0.06em;
  margin-bottom: 10px;
}

.cta-desc {
  font-size: 1.3rem;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.9);
  letter-spacing: 0.02em;
  text-align: center;
  /* ← 追加 */
}

/* CTAボタン(画像) */
.cta-btn-link {
  display: block;
  width: 100%;
  margin-bottom: 36px;
  transition: transform 0.2s, filter 0.2s;
}

.cta-btn-link:hover {
  transform: translateY(-2px);
  filter: brightness(1.05);
}

.cta-btn-link img {
  margin: 0 auto;
  width: 100%;
  max-width: 500px;
  height: auto;
  display: block;
}

/* 3つの安心ポイント */
.cta-points {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.cta-point {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 4px;
  position: relative;
}

.cta-point:not(:last-child)::after {
  content: '';
  position: absolute;
  right: -6px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 70%;
  background: rgba(255, 255, 255, 0.2);
}

.cta-point-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.85);
}

.cta-point-icon svg {
  width: 50%;
  height: 50%;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
}

.cta-point-text {
  color: #fff;
  line-height: 1.4;
}

.cta-point-label {
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.75);
  letter-spacing: 0.04em;
  margin-bottom: 2px;
}

.cta-point-main {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.4rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.03em;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {

  /* FAQ */
  .faq {
    padding: 40px 16px 36px;
  }

  .faq::before {
    width: 100px;
    height: 100px;
  }

  .faq-watermark {
    font-size: 7rem;
    top: 0;
  }

  .faq-label {
    font-size: 1rem;
  }

  .faq-label::before,
  .faq-label::after {
    width: 20px;
  }

  .faq-title {
    font-size: 1.8rem;
  }

  .faq-subtitle {
    font-size: 1.1rem;
  }

  .faq-question {
    padding: 16px 18px;
    gap: 12px;
  }

  .faq-q-icon {
    width: 32px;
    height: 32px;
    font-size: 1.5rem;
  }

  .faq-q-text {
    font-size: 1.1rem;
  }

  .faq-divider-v {
    display: none;
  }

  .faq-toggle-icon {
    width: 26px;
    height: 26px;
  }

  .faq-toggle-icon::before {
    width: 10px;
  }

  .faq-toggle-icon::after {
    height: 10px;
  }

  .faq-answer {
    padding: 0 18px 18px 18px;
  }

  .faq-answer-wrap {
    padding: 16px 18px;
    gap: 12px;
  }

  .faq-a-icon {
    width: 32px;
    height: 32px;
    font-size: 1.5rem;
  }

  .faq-a-text {
    font-size: 1rem;
    line-height: 1.9;
  }

  /* CTA */
  .cta-section {
    background-image: url(images/cta_back.png);
    background-repeat: no-repeat;
    background-position: left;
    background-size: cover;
    min-height: 0;
    position: relative;
  }

  .cta-bg {

    display: none;
  }

  .cta-inner {
    grid-template-columns: 1fr;
    gap: 0;
    padding: 24px 20px 30px;
  }

  .cta-left {
    display: none;
  }

  .cta-header {
    flex-direction: column;
    align-items: center;
    gap: 14px;
    margin-bottom: 24px;
    text-align: center;
  }

  .cta-badge {
    width: 76px;
    height: 76px;
    font-size: 1.3rem;
  }

  .cta-title {
    font-size: 1.3rem;
    line-height: 1.5;
  }

  .cta-desc {
    font-size: 1.0rem;
    line-height: 1.7;
  }

  .cta-btn-link {
    margin-bottom: 24px;
  }

  .cta-points {
    gap: 6px;
  }

  .cta-point {
    flex-direction: column;
    gap: 6px;
    text-align: center;
  }

  .cta-point:not(:last-child)::after {
    right: -3px;
    height: 80%;
  }

  .cta-point-icon {
    width: 30px;
    height: 30px;
  }

  .cta-point-label {
    font-size: 0.9rem;
  }

  .cta-point-main {
    font-size: 1.1rem;
  }
}





/* ===== ミニCTAセクション ===== */
.cta-mini {
  position: relative;
  padding: 60px 40px;
  background: #ffffff;
  overflow: hidden;
}

.cta-mini-inner {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
}

/* 上部:小タイトル(斜め線で挟む) */
.cta-mini-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-bottom: 18px;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.8rem;
  font-weight: 700;
  color: #1a2347;
  letter-spacing: 0.05em;
}

.cta-mini-label::before,
.cta-mini-label::after {
  content: '';
  width: 1px;
  height: 32px;
  background: #1a2347;
}

.cta-mini-label::before {
  transform: rotate(-20deg);
}

.cta-mini-label::after {
  transform: rotate(20deg);
}

.cta-mini-label-orange {
  color: #f57b1a;
}

/* メインタイトル */
.cta-mini-title {
  text-align: center;
  font-family: 'Noto Serif JP', serif;
  font-size: 2.6rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.5;
  letter-spacing: 0.04em;
  margin-bottom: 18px;
}

/* 「止まる事務局」の下線アンダーライン */
.cta-mini-title-underline {
  position: relative;
  display: inline-block;
}

.cta-mini-title-underline::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 8px;
  background: rgba(245, 215, 110, 0.5);
  z-index: -1;
}

/* サブタイトル(点線で挟む) */
.cta-mini-sub {

  align-items: center;
  text-align: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 28px;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.7rem;
  font-weight: 500;
  color: #1a2347;
  letter-spacing: 0.04em;
}

.cta-mini-sub::before,
.cta-mini-sub::after {
  content: '';
  width: 80px;
  height: 1px;
  background: repeating-linear-gradient(90deg, #1a2347 0, #1a2347 3px, transparent 3px, transparent 7px);
}

.cta-mini-sub-orange {
  color: #f57b1a;
  font-weight: 700;
}

/* CTAボタン(画像) */
.cta-mini-btn-link {
  display: block;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  transition: transform 0.2s, filter 0.2s;
}

.cta-mini-btn-link:hover {
  transform: translateY(-2px);
  filter: brightness(1.05);
}

.cta-mini-btn-link img {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
  height: auto;
  display: block;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .cta-mini {
    padding: 40px 16px;
  }

  .cta-mini-btn-link img {
    max-width: 90%;
  }

  .cta-mini-label {
    font-size: 1.2rem;
    /* 1.9rem → 1.2rem に縮小 */
    gap: 8px;
    /* 18px → 8px に縮小 */
    margin-bottom: 14px;
    flex-wrap: nowrap;
    /* ← 折り返さない */
    white-space: nowrap;
    /* ← テキスト内も改行させない */
  }

  .cta-mini-label::before,
  .cta-mini-label::after {
    height: 18px;
  }

  .cta-mini-title {
    font-size: 1.8rem;
    line-height: 1.5;
    margin-bottom: 12px;
  }

  .cta-mini-title-underline::after {
    height: 5px;
  }

  .cta-mini-sub {
    font-size: 1.1rem;
    /* 1.2rem → 1.1rem */
    gap: 8px;
    margin-bottom: 10px;
    flex-wrap: nowrap;
  }

  .cta-mini-sub::before,
  .cta-mini-sub::after {
    width: 20px;
    flex-shrink: 0;
  }
}

/* ===== REPRESENTATIVE SECTION ===== */
.rep {
  position: relative;
  padding: 100px 40px 80px;
  background: linear-gradient(180deg, #fafcff 0%, #f0f6fc 100%);
  overflow: hidden;
}

.rep-inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  z-index: 1;
}

/* === 上部タイトル === */
.rep-header {
  text-align: center;
  margin-bottom: 36px;
}

.rep-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.8rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.5;
  letter-spacing: 0.06em;
  margin-bottom: 30px;
}

.rep-title-quote {
  color: #2d5fb8;
}

/* タイトル下のドット装飾 */
.rep-title-dots {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.rep-title-dots::before,
.rep-title-dots::after {
  content: '';
  width: 30px;
  height: 1px;
  background: #c9a55b;
}

.rep-title-dots-icons {
  display: inline-flex;
  gap: 4px;
}

.rep-title-dot {
  width: 4px;
  height: 4px;
  background: #c9a55b;
  border-radius: 50%;
}

/* === メイン:左右2カラム === */
.rep-main {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 40px;
  align-items: stretch;
}

/* 左:写真エリア */
.rep-photo {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  background: #e8f0fa;
  position: relative;
  aspect-ratio: 1 / 1.2;
}

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

/* 右:プロフィール */
.rep-profile {
  display: flex;
  flex-direction: column;
}

/* 役職ラベル */
.rep-position {
  font-size: 1.3rem;
  font-weight: 500;
  color: #1a2347;
  letter-spacing: 0.1em;
  margin-bottom: 10px;
}

/* 名前 + サイン */
.rep-name-wrap {
  display: flex;
  align-items: baseline;
  gap: 18px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.rep-name {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.8rem;
  font-weight: 700;
  color: #1a2347;
  letter-spacing: 0.15em;
}

.rep-name-en {
  font-family: 'Brush Script MT', 'Snell Roundhand', cursive;
  font-size: 2.2rem;
  color: #c9a55b;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0.02em;
}

/* 紹介文(冒頭) */
.rep-intro {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.5rem;
  line-height: 1.9;
  color: #1a2347;
  font-weight: 500;
  letter-spacing: 0.04em;
  margin-bottom: 28px;
}

.rep-intro-accent {
  color: #1a2347;
  font-weight: 700;
  background: linear-gradient(transparent 60%, rgba(245, 215, 110, 0.4) 60%);
}

/* 区切り線 */
.rep-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, #c9a55b 30%, #c9a55b 70%, transparent 100%);
  margin-bottom: 24px;
}

/* === プロフィール詳細(左:バッジ・右:本文) === */
.rep-detail {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 28px;
}

/* 左:実績バッジリスト */
.rep-badges {
  display: flex;
  flex-direction: column;
  gap: 14px;
  border-right: 1px solid #c9d6ec;
  padding-right: 24px;
}

.rep-badge {
  display: flex;
  align-items: center;
  gap: 10px;
}

.rep-badge-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  background: #e8f0fa;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2d5fb8;
}

.rep-badge-icon svg {
  width: 55%;
  height: 55%;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
}

/* 実績・経験(濃紺背景) */
.rep-badge-icon.is-highlight {
  background: #142a5c;
  color: #c9a55b;
}

.rep-badge-text {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.3rem;
  font-weight: 500;
  color: #1a2347;
  line-height: 1.4;
}

.rep-badge-text-strong {
  font-weight: 700;
  font-size: 1.4rem;
}

/* 右:本文 */
.rep-detail-text {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.3rem;
  line-height: 2.1;
  color: #1a2347;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.rep-detail-text-accent {
  color: #c9a55b;
  font-weight: 700;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .rep {
    padding: 40px 16px 36px;
  }

  .rep-title {
    font-size: 1.8rem;
    line-height: 1.5;
    margin-bottom: 10px;
  }

  .rep-title-dots::before,
  .rep-title-dots::after {
    width: 18px;
  }

  .rep-main {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .rep-photo {
    aspect-ratio: 1 / 1;
  }

  .rep-photo img {
    object-position: left;
    /* 右寄せ */
  }

  .rep-position {
    font-size: 1.1rem;
  }

  .rep-name {
    font-size: 1.8rem;
  }

  .rep-name-en {
    font-size: 1.8rem;
  }

  .rep-intro {
    font-size: 1.1rem;
    line-height: 1.8;
    margin-bottom: 20px;
  }

  .rep-detail {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .rep-badges {
    border-right: none;
    border-bottom: 1px solid #c9d6ec;
    padding-right: 0;
    padding-bottom: 16px;
    gap: 10px;
  }

  .rep-badge-icon {
    width: 30px;
    height: 30px;
  }

  .rep-badge-text {
    font-size: 1.1rem;
  }

  .rep-badge-text-strong {
    font-size: 1.3rem;
  }

  .rep-detail-text {
    font-size: 1.1rem;
    line-height: 2;
  }
}

/* ===== COMPANY SECTION ===== */
.company {
  position: relative;
  padding: 70px 60px 60px;
  background: #ffffff;
}

.company-inner {
  max-width: 1100px;
  margin: 0 auto;
}

/* === ブロック共通スタイル === */
.company-block {
  margin-bottom: 50px;
}

.company-block:last-child {
  margin-bottom: 0;
}

/* タイトル(日本語) */
.company-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.4rem;
  font-weight: 500;
  color: #1a2347;
  letter-spacing: 0.05em;
  padding-bottom: 8px;
  border-bottom: 2px solid #2d5fb8;
  display: inline-block;
  margin-bottom: 16px;
}

/* サブタイトル(英語) */
.company-subtitle {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.4rem;
  color: #1a2347;
  letter-spacing: 0.05em;
  margin-bottom: 24px;
  font-weight: 400;
  font-style: italic;
}

/* === テーブル === */
.company-table {
  width: 100%;
  border-collapse: collapse;
}

.company-table tr {
  border-top: 1px solid #d8e3f3;
}

.company-table tr:last-child {
  border-bottom: 1px solid #d8e3f3;
}

.company-table th,
.company-table td {
  font-family: 'Noto Serif JP', serif;
  padding: 18px 20px;
  text-align: left;
  vertical-align: top;
  line-height: 1.7;
  font-size: 1.4rem;
  color: #1a2347;
  letter-spacing: 0.02em;
}

/* ラベル(項目名) */
.company-table th {
  width: 200px;
  font-weight: 700;
}

/* 値 */
.company-table td {
  font-weight: 500;
}

/* リンク */
.company-table td a {
  color: #1a2347;
  text-decoration: none;
  transition: color 0.2s;
}

.company-table td a:hover {
  color: #2d5fb8;
  text-decoration: underline;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .company {
    padding: 40px 20px 36px;
  }

  .company-block {
    margin-bottom: 36px;
  }

  .company-title {
    font-size: 1.6rem;
    padding-bottom: 6px;
    margin-bottom: 12px;
  }

  .company-subtitle {
    font-size: 1.0rem;
    margin-bottom: 18px;
  }

  .company-table th,
  .company-table td {
    display: block;
    width: 100%;
    padding: 14px 8px;
  }

  .company-table th {
    padding-bottom: 6px;
    font-size: 1.1rem;
  }

  .company-table td {
    padding-top: 0;
    padding-bottom: 14px;
    font-size: 1.1rem;
    line-height: 1.7;
  }

  .company-table tr {
    display: block;
  }
}

/* ===== FOOTER ===== */
.footer {
  position: relative;
  background: linear-gradient(180deg, #0a1838 0%, #060f24 100%);
  color: #fff;
  overflow: hidden;
}

/* 上部右:ドット模様の装飾 */
.footer::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 240px;
  height: 240px;
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0.1) 1.2px, transparent 1.2px);
  background-size: 16px 16px;
  pointer-events: none;
  opacity: 0.5;
  -webkit-mask-image: radial-gradient(ellipse at top right, #000 30%, transparent 70%);
  mask-image: radial-gradient(ellipse at top right, #000 30%, transparent 70%);
}

.footer-inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 40px 0;
  z-index: 1;
}

/* === メインエリア:左右2カラム === */
.footer-main {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 60px;
  padding-bottom: 50px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

/* 左:ロゴ + 会社情報 */
.footer-brand {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.footer-logo {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.8rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.06em;
  line-height: 1;
}

.footer-logo-tag {
  color: #c9a55b;
  font-size: 0.6em;
  letter-spacing: 0.4em;
  margin-left: 6px;
  font-weight: 500;
}

.footer-tagline {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.4rem;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.7;
  letter-spacing: 0.04em;
}

.footer-info {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.2rem;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.9;
  letter-spacing: 0.02em;
  margin-top: 4px;
}

.footer-info a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  transition: color 0.2s;
}

.footer-info a:hover {
  color: #c9a55b;
}

/* 右:ナビゲーション */
.footer-nav-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}

.footer-nav-block-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.4rem;
  font-weight: 700;
  color: #c9a55b;
  letter-spacing: 0.1em;
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(201, 165, 91, 0.3);
}

.footer-nav {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-nav a {
  font-family: 'Noto Serif JP', serif;
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  font-size: 1.3rem;
  letter-spacing: 0.04em;
  line-height: 1.5;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: color 0.2s, transform 0.2s;
}

.footer-nav a::before {
  content: '';
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  background: #c9a55b;
  border-radius: 50%;
  transition: transform 0.2s;
}

.footer-nav a:hover {
  color: #c9a55b;
  transform: translateX(2px);
}

/* === 下部:コピーライト === */
.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 0;
  flex-wrap: wrap;
  gap: 12px;
}

.footer-copyright {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.2rem;
  color: rgba(255, 255, 255, 0.6);
  letter-spacing: 0.04em;
  font-family: 'Noto Serif JP', serif;
}

.footer-legal {
  display: flex;
  gap: 24px;
  list-style: none;
}

.footer-legal a {
  color: rgba(255, 255, 255, 0.6);
  text-decoration: none;
  font-size: 1.2rem;
  letter-spacing: 0.04em;
  transition: color 0.2s;
}

.footer-legal a:hover {
  color: #c9a55b;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .footer::before {
    width: 140px;
    height: 140px;
  }

  .footer-inner {
    padding: 40px 20px 0;
  }

  .footer-main {
    grid-template-columns: 1fr;
    gap: 36px;
    padding-bottom: 30px;
  }

  .footer-logo {
    font-size: 1.5rem;
  }

  .footer-tagline {
    font-size: 0.9rem;
  }

  .footer-info {
    font-size: 0.9rem;
  }

  .footer-nav-wrap {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }

  .footer-nav-block-title {
    font-size: 0.9rem;
    margin-bottom: 12px;
  }

  .footer-nav a {
    font-size: 0.9rem;
  }

  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 18px 0;
  }

  .footer-copyright {
    font-size: 0.7rem;
  }

  .footer-legal {
    gap: 16px;
  }

  .footer-legal a {
    font-size: 1.0rem;
  }
}


/* ===== REASONS SECTION ===== */
.reasons {
  position: relative;
  padding: 70px 40px 60px;
  background: linear-gradient(180deg, #fafcff 0%, #f0f6fc 100%);
  overflow: hidden;
}

.reasons-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* === 見出しエリア === */
.reasons-header {
  text-align: center;
  margin-bottom: 40px;
}

/* REASONラベル */
.reasons-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  color: #c9a55b;
  margin-bottom: 14px;
}

.reasons-label::before,
.reasons-label::after {
  content: '';
  width: 36px;
  height: 1px;
  background: #c9a55b;
}

/* メインタイトル */
.reasons-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3.6rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.5;
  letter-spacing: 0.06em;
}

.reasons-title-accent {
  color: #2d5fb8;
}

/* === 3つの理由カード === */
.reasons-list {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.reasons-card {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
}

.reasons-card img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .reasons {
    padding: 40px 16px 36px;
  }

  .reasons-header {
    margin-bottom: 24px;
  }

  .reasons-label {
    font-size: 1.1rem;
  }

  .reasons-label::before,
  .reasons-label::after {
    width: 24px;
  }

  .reasons-title {
    font-size: 2.2rem;
    line-height: 1.5;
  }

  .reasons-list {
    gap: 12px;
  }
}

/* ===== FLOW SECTION ===== */
.flow {
  position: relative;
  padding: 70px 40px 60px;
  background: #ffffff;
  overflow: hidden;
}

.flow-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  z-index: 1;
}

/* === 見出しエリア === */
.flow-header {
  text-align: center;
  margin-bottom: 40px;
}

/* FLOWラベル */
.flow-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  color: #c9a55b;
  margin-bottom: 14px;
}

.flow-label::before,
.flow-label::after {
  content: '';
  width: 36px;
  height: 1px;
  background: #c9a55b;
}

.flow-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 3.6rem;
  font-weight: 700;
  color: #1a2347;
  line-height: 1.5;
  letter-spacing: 0.06em;
}

/* === 4ステップエリア === */
.flow-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* 各ステップ(画像コンテナ) */
.flow-item {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
}

.flow-item img {
  width: 100%;
  height: auto;
  display: block;
}

/* === 矢印(各ステップ間) === */
.flow-arrow {
  text-align: center;
  padding: 8px 0;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.flow-arrow-icon {
  width: 36px;
  height: 22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 22' fill='none'%3E%3Cpath d='M4 4 L18 16 L32 4' stroke='%232d5fb8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' opacity='0.7'/%3E%3Cpath d='M8 11 L18 19 L28 11' stroke='%232d5fb8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' opacity='0.4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* ===== レスポンシブ:スマホ版 (768px以下) ===== */
@media (max-width: 768px) {
  .flow {
    padding: 40px 16px 36px;
  }

  .flow-header {
    margin-bottom: 24px;
  }

  .flow-label {
    font-size: 1.1rem;
  }

  .flow-label::before,
  .flow-label::after {
    width: 24px;
  }

  .flow-title {
    font-size: 2.2rem;
    line-height: 1.5;
  }

  .flow-arrow {
    height: 28px;
    padding: 4px 0;
  }

  .flow-arrow-icon {
    width: 26px;
    height: 16px;
  }
}