@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif:ital,wght@0,100..900;1,100..900&family=Zen+Maru+Gothic&display=swap');

html {
  scroll-behavior: smooth;
}



body {
  font-family: "Noto Sans JP", sans-serif;
  margin: 0;
  padding: 0;
  background-color: #fff;
}

.inner {
  width: 90%;
  margin: 0 auto;
}


h2{
    color: #1F84A6;
    font-size: 46px;
    margin-bottom: 1.5rem;
    text-align: center;
    font-weight: 600;
}

/* モバイル共通: 全ての h2 を 34px に統一 */
@media (max-width: 767px) {
  h2 {
    font-size: 28px !important;
    line-height: 1.25 !important;
    margin-bottom: 1rem !important;
  }
}

@media (max-width: 768px) {
  #page_top {
    padding-top: 20px;
    width: 10vw;
    text-align: center;
    position: fixed;
    bottom: 18vw;
    right: 1vw;
    opacity: 0.8;
  }
  #page_top a {
    text-decoration: none;
  }
  #page_top .top_return {
    width: 100%;
  }
  #page_top img {
    width: 10vw;
  }
  #page_top .return_text {
    color: #184177;
    padding-top: 10px;
    font-size: 12px;
  }
}

@media (min-width: 768px) {
  #page_top{
    display: none !important;
  }
}

/* メインビジュアル */
.mainvisual {
  width: 100%;
  margin: 0 auto;
  position: relative;
  background-image: url("../img/background_image.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 10;
  /* スマートフォン版サイトのファーストビューエリア */
  aspect-ratio: 2/3.2;
}


@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual {
    /* // タブレット版サイトのファーストビューエリア */
    height: 47vw;
  }
}

@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual {
    /* // タブレット版サイトのファーストビューエリア */
    height: 65vw;
  }
}
@media (max-width: 500px){
  .mainvisual {
    height: 138vw;
  }
}

@media (min-width: 1200px) {
  .mainvisual {
    /* // デスクトップ版サイトのファーストビューエリア */
    height: 43vw;
  }
}
.mainvisual .mainvisual__person {
  /* // 画像の横幅をビューポートの半分に設定する */
  width: 54vw;
  position: absolute;
  top: 52vw;
  right: 0;
  z-index: 3;
}
@media (min-width: 768px) {
  .mainvisual .mainvisual__person {
    width: 43vw;
    top: auto;
    right: auto;
    bottom: 0;
    right: 2vw;
  }
}
@media (min-width: 1200px) {
  .mainvisual .mainvisual__person {
    width: 26vw;
    top: auto;
    right: auto;
    bottom: 0vw;
    left: 5vw;
  }
}

@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual .mainvisual__person {
    width: 26vw;
    top: auto;
    right: auto;
    bottom: 0vw;
    left: 5vw;
  }
}

@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__person {
    width: 35vw;
    top: auto;
    right: auto;
    bottom: 0vw;
    right: 12vw;
  }
}
@media (max-width: 500px){
  .mainvisual .mainvisual__person {
    width: 55vw;
    top: auto;
    right: auto;
    top: 40vw;
    right: 0vw;
  }
}

.mainvisual .mainvisual__fukidashi {
  /* // 画像の横幅をビューポートの半分に設定する */
  width: 20vw;
  position: absolute;
}
@media (max-width: 1200px) {
  .mainvisual .mainvisual__fukidashi {
    width: 15vw;
    top: 35vw;
    right: 31vw;
  }
}

@media (min-width: 1200px) {
  .mainvisual .mainvisual__fukidashi {
    width: 9vw;
    top: auto;
    right: auto;
    top: 17vw;
    left: 4vw;
  }
}

@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual .mainvisual__fukidashi {
    width: 9vw;
    top: auto;
    right: auto;
    top: 17vw;
    left: 4vw;
  }
}

@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__fukidashi {
    width: 12vw;
    top: auto;
    right: auto;
    top: 27vw;
    right: 36vw;
  }
}
@media (max-width: 500px){
  .mainvisual .mainvisual__fukidashi {
    display: none;
  }
}

.mainvisual .mainvisual__fukidashi_miginaname {
  /* // 画像の横幅をビューポートの半分に設定する */
  width: 20vw;
  position: absolute;
  z-index: 2;
}
@media (max-width: 767px) {
  .mainvisual .mainvisual__fukidashi_miginaname {
    width: 22vw;
    top: auto;
    left: auto;
    bottom: 75vw;
    right: 2vw;
  }
}
@media (min-width: 768px) {
  .mainvisual .mainvisual__fukidashi_miginaname {
    display: none;
  }
}
@media (min-width: 1200px) {
  .mainvisual .mainvisual__fukidashi_miginaname {
    display: none;
  }
}
@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__fukidashi_miginaname {
    display: none;
  }
}
@media (max-width: 500px) {
  .mainvisual .mainvisual__fukidashi_miginaname {
    width: 22vw;
    top: auto;
    left: auto;
    bottom: auto;
    top: 40vw;
    right: 2vw;
  }
}

/* LP 固有のレイアウト調整 */
/* 全体のコンテンツ幅を制限して中央寄せにする */
#lp-ivy .container{
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
  box-sizing: border-box;
  max-width: 1120px;
}

#lp-ivy .container-fluid{
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
  box-sizing: border-box;
}

/* スライダー内の画像が横幅いっぱいに収まるようにする */
.slider .box img,
.slider .box_inner img {
  width: 100%;
  height: auto;
  display: block;
}

/* スライダー全体の幅をコンテナ内に制限してはみ出しを防ぐ（slickの挙動には影響しない） */
.slider {
  box-sizing: border-box;
  max-width: 100%; /* コンテンツと同じ最大幅 */
  margin: 0 auto;
  padding: 0 16px; /* スライドの左右に余白を確保 */
  overflow: hidden; /* はみ出し部分を隠す */
}

/* slick内部のスライドに箱含めの計算を適用し、左右パディングを与える（見た目調整のみ） */
.slider .slick-list,
.slider .slick-track {
  box-sizing: border-box;
}
.slider .slick-slide {
  box-sizing: border-box;
  padding: 0 8px; /* スライド間のスペース（必要なら調整） */
}

@media (max-width: 768px) {
  .slider {
    width: 100%;
    max-width: 100%;
    padding: 0 12px;
  }
  .slider .slick-slide {
    padding: 0 6px;
  }
}

/* メリット画像がメインビジュアルに被る場合の対策: セクション内でのみ表示されるようz-indexを調整 */
#benefits_section {
  position: relative;
  z-index: 5; /* mainvisualより低くして被りを避ける（mainvisualは10） */
}
#benefits_section .right_picture_first,
#benefits_section .right_picture_second,
#benefits_section .right_picture_third,
#benefits_section .right_picture_fourth {
  z-index: 2;
}

/* 各リスト項目を基準にして右側のイラストを配置する（viewportではなくコンテナ内に収める） */
#benefits_section ol.row > li {
  position: relative;
}

/* 右側イラストの右位置をコンテナ内で調整（大きな画面では余白を確保） */
#benefits_section .right_picture_first { right: 40px; }
#benefits_section .right_picture_second { right: 40px; }
#benefits_section .right_picture_third { right: 40px; }
#benefits_section .right_picture_fourth { right: 40px; }

@media (min-width: 769px) and (max-width: 1199px) {
  #benefits_section .right_picture_first,
  #benefits_section .right_picture_second,
  #benefits_section .right_picture_third,
  #benefits_section .right_picture_fourth {
    right: 30px;
  }
}

@media (max-width: 767px) {
  #benefits_section .right_picture_first img,
  #benefits_section .right_picture_second img,
  #benefits_section .right_picture_third img,
  #benefits_section .right_picture_fourth img {
    width: 90px; /* 既存のスマホ用サイズを確保 */
  }
}

/* レスポンシブ調整: スライダーは小さい画面で1列表示 */
@media (max-width: 768px) {
  #lp-ivy .container,
  #lp-ivy .container-fluid {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.mainvisual .mainvisual__gold {
  width: 45vw;
  position: absolute;
  left: 3vw;
  top: 70vw;
  z-index: 2;
}
@media (min-width: 768px) {
  .mainvisual .mainvisual__gold {
    width: 25vw;
    left: auto;
    top: auto;
    top: 30vw;
    right: 0vw;
  }
}
@media (min-width: 1200px) {
  .mainvisual .mainvisual__gold {
    width: 20vw;
    top: auto;
    right: auto;
    top: 1vw;
    left: 3vw;
  }
}

@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual .mainvisual__gold {
    width: 23vw;
    top: auto;
    right: auto;
    top: 2vw;
    left: 2vw;
  }
}

@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__gold {
    width: 27vw;
    top: auto;
    right: auto;
    left: auto;
    top: 30vw;
    right: 0vw;
  }
}
@media (max-width: 500px){
  .mainvisual .mainvisual__gold {
    width: 45vw;
    top: auto;
    right: auto;
    left: auto;
    top: 40vw;
    left: 5vw;
  }
}

.mainvisual .mainvisual__seikyuu {
  width: 88vw;
  position: absolute;
  top: 23vw;
  right: 7vw;
  z-index: 3;
}
@media (min-width: 768px) {
  .mainvisual .mainvisual__seikyuu {
    width: 75vw;
    right: auto;
    bottom: auto;
    top: 8vw;
    left: 10vw;
  }
}
@media (min-width: 1200px) {
  .mainvisual .mainvisual__seikyuu {
    width: 53vw;
    top: auto;
    left: auto;
    top: 6vw;
    left: 26vw;
  }
}

@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual .mainvisual__seikyuu {
    width: 60vw;
    top: auto;
    left: auto;
    top: 5vw;
    left: 25vw;
  }
}
@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__seikyuu {
    width: 75vw;
    top: auto;
    left: auto;
    top: 7vw;
    left: 10vw;
  }
}
@media (max-width: 500px){
  .mainvisual .mainvisual__seikyuu {
    width: 90vw;
    top: auto;
    left: auto;
    top: 10vw;
    left: 3vw;
  }
}


.mainvisual .mainvisual__kokoro_anshin {
  width: 80vw;
  position: absolute;
  top: 0vw;
  right: 0vw;
  z-index: 3;
}

@media (min-width: 768px) {
  .mainvisual .mainvisual__kokoro_anshin {
    width: 75vw;
    right: auto;
    bottom: auto;
    top: 2vw;
    left: 10vw;
    transform: translateX(0%) translateY(0%);
  }
}
@media (min-width: 1200px) {
  .mainvisual .mainvisual__kokoro_anshin {
    width: 60vw;
    top: auto;
    left: auto;
    top: 1vw;
    left: 26vw;
  }
}

@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual .mainvisual__kokoro_anshin {
    width: 55vw;
    top: auto;
    left: auto;
    top: 1vw;
    left: 25vw;
  }
}
@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__kokoro_anshin {
    width: 80vw;
    top: auto;
    left: auto;
    top: 1vw;
    left: 8vw;
  }
}
@media (max-width: 500px) {
  .mainvisual .mainvisual__kokoro_anshin {
    width: 95vw;
    top: auto;
    left: auto;
    top: 2vw;
    left: 1vw;
  }
}

.mainvisual .mainvisual__kokoro {
  display: none;
}
@media (min-width: 768px) {
  .mainvisual .mainvisual__kokoro {
    display: none;
  }
}

@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__kokoro {
    display: none;
  }
}

.mainvisual .mainvisual__anshin {
  display: none;
}
@media (min-width: 768px) {
  .mainvisual .mainvisual__anshin {
    display: none;
  }
}
@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__anshin {
    display: none;
  }
}


.mainvisual .mainvisual__support {
  width: 80vw;
  position: absolute;
  top: 40vw;
  right: 5vw;
  z-index: 3;
}
@media (min-width: 768px) {
  .mainvisual .mainvisual__support {
    width: 55vw;
    top: auto;
    right: auto;
    top: 21vw;
    right: 12vw;
  }
}
@media (min-width: 1200px) {
  .mainvisual .mainvisual__support {
    width: 40vw;
    right: auto;
    bottom: auto;
    top: 16vw;
    right: 12vw;
  }
}

@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual .mainvisual__support {
    width: 35vw;
    right: auto;
    bottom: auto;
    top: 16vw;
    right: 12vw;
  }
}

@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__support {
    width: 40vw;
    right: auto;
    bottom: auto;
    top: 21vw;
    right: 12vw;
  }
}
@media (max-width: 500px){
  .mainvisual .mainvisual__support {
    width: 60vw;
    right: auto;
    bottom: auto;
    top: 27vw;
    right: 6vw;
  }
}

.mainvisual .mainvisual__soudan {
  width: 35vw;
  position: absolute;
  top: 53vw;
  left: 5vw;
}
@media (min-width: 768px) {
  .mainvisual .mainvisual__soudan {
    width: 35vw;
    top: auto;
    left: auto;
    top: 30vw;
    left: 4vw;
  }
}
@media (min-width: 1200px) {
  .mainvisual .mainvisual__soudan {
    width: 18vw;
    left: auto;
    bottom: auto;
    top: 18vw;
    left: 25vw;
  }
}

@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual .mainvisual__soudan {
    width: 19vw;
    left: auto;
    bottom: auto;
    top : 17vw;
    left: 25vw;
  }
}

@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__soudan {
    width: 24vw;
    left: auto;
    bottom: auto;
    top : 25vw;
    left: 12vw;
  }
}
@media (max-width: 500px){
  .mainvisual .mainvisual__soudan {
    width: 35vw;
    left: auto;
    bottom: auto;
    top : 75vw;
    left: 7vw;
  }
}

.mainvisual .mainvisual__sns {
  width: 80vw;
  position: absolute;
  left: 8vw;
  bottom: 44vw;
  z-index: 3;
}
@media (min-width: 768px) {
  .mainvisual .mainvisual__sns {
    width: 50vw;
    bottom: auto;
    left: auto;
    left: 5vw;
    bottom: 33vw;
  }
}
@media (min-width: 1200px) {
  .mainvisual .mainvisual__sns {
    width: 40vw;
    bottom: auto;
    left: auto;
    right: 13vw;
    bottom: 17vw;
    transform: translateX(0%) translateY(0%);
  }
}

@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual .mainvisual__sns {
    width: 40vw;
    bottom: auto;
    left: auto;
    right: 10vw;
    bottom: 20vw;
    transform: translateX(0%) translateY(0%);
  }
}
@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__sns {
    width: 40vw;
    bottom: auto;
    left: auto;
    left: 7vw;
    bottom: 20vw;
    transform: translateX(0%) translateY(0%);
  }
}
@media (max-width: 500px) {
  .mainvisual .mainvisual__sns {
    width: 70vw;
    bottom: auto;
    left: auto;
    left: 50%;
    bottom: 34vw;
    transform: translateX(-50%) translateY(0%);
  }
}

.mainvisual .mainvisual__circle {
  width: 90vw;
  position: absolute;
  bottom: 15vw;
  left: 5vw;
  z-index: 3;
}
@media (min-width: 768px) {
  .mainvisual .mainvisual__circle {
    width: 55vw;
    bottom: auto;
    left: auto;
    left: 3vw;
    bottom: 15vw;
  }
}
@media (min-width: 1200px) {
  .mainvisual .mainvisual__circle {
    width: 45vw;
    bottom: auto;
    left: auto;
    right: 10vw;
    bottom: 2vw;
    transform: translateX(0%) translateY(0%);
  }
}

@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual .mainvisual__circle {
    width: 50vw;
    bottom: auto;
    left: auto;
    right: 5vw;
    bottom: 3vw;
    transform: translateX(0%) translateY(0%);
  }
}
@media (min-width: 500px) and (max-width: 768px) {
  .mainvisual .mainvisual__circle {
    width: 50vw;
    bottom: auto;
    left: auto;
    left: 1vw;
    bottom: 3vw;
  }
}
@media (max-width: 500px) {
  .mainvisual .mainvisual__circle {
    width: 90vw;
    bottom: auto;
    left: auto;
    left: 50%;
    bottom: 5vw;
    transform: translateX(-50%) translateY(0%);
  }
}

.mainvisual .notice {
  position: absolute;
  bottom: 10vw;
  left: 2vw;
  font-size: 12px;
}
@media (min-width: 768px) {
  .mainvisual .notice {
    width: 55vw;
    bottom: auto;
    left: auto;
    left: 4vw;
    bottom: 13vw;
  }
}
@media (min-width: 1200px) {
  .mainvisual .notice {
    width: 45vw;
    font-size: 14px;
    bottom: auto;
    left: auto;
    right: 9vw;
    bottom: 0.7vw;
    transform: translateX(0%) translateY(0%);
  }
}

@media (min-width: 769px) and (max-width: 1199px) {
  .mainvisual .notice {
    font-size: 1.3vw;
    bottom: auto;
    left: auto;
    left: 44vw;
    bottom: 1vw;
  }
}
@media (min-width: 500px) and (max-width:768px) {
  .mainvisual .notice {
    font-size: 1.4vw;
    bottom: auto;
    left: auto;
    left: 1vw;
    bottom: 1vw;
  }
}
@media (max-width: 499px) {
  .mainvisual .notice {
    font-size: 2.8vw;
    bottom: auto;
    left: auto;
    left: 5vw;
    bottom: 1vw;
  }
}

.mainvisual__ivy {
  width: 60vw;
  position: absolute;
  top: 0vw;
  right: 0vw;
  z-index: 1;
}
@media (min-width: 768px) {
  .mainvisual__ivy {
    width: 60vw;
    bottom: auto;
    left: auto;
    right: 0vw;
    top: 0vw;
    transform: translateX(0%) translateY(0%);
  }
}
@media (min-width: 1200px) {
  .mainvisual__ivy {
    width: 35vw;
    bottom: auto;
    left: auto;
    right: 0vw;
    top: 0vw;
    transform: translateX(0%) translateY(0%);
  }
}


/* iPhone SEなど高さが短いスマホ専用のスタイル */
@media (max-width: 500px) and (max-height: 667px) {
  .mainvisual {
    height: 122vw; /* 例として高さを調整 */
  }

  .mainvisual .mainvisual__person {
    width: 42vw;
    top: 39vw;
    right: 10vw;
  }

  .mainvisual .mainvisual__gold {
    width: 40vw;
    left: auto;
    top: auto;
    top: 35vw;
    left: 8vw;
  }

  .mainvisual .mainvisual__kokoro_anshin {
    width: 85vw;
    top: 2vw;
    left: 3vw;
  }

  .mainvisual .mainvisual__support {
    width: 60vw;
    right: auto;
    bottom: auto;
    top: 27vw;
    right: 8vw;
  }

  .mainvisual .mainvisual__soudan {
    width: 30vw;
    position: absolute;
    top: 65vw;
    left: 10vw;
  }

  .mainvisual .mainvisual__sns {
    width: 70vw;
    bottom: auto;
    left: auto;
    left: 50%;
    bottom: 33vw;
    transform: translateX(-50%) translateY(0%);
  }

  .mainvisual .mainvisual__circle {
    width: 85vw;
    bottom: auto;
    left: auto;
    left: 50%;
    bottom: 6vw;
    transform: translateX(-50%) translateY(0%);
  }
  .mainvisual .notice {
    font-size: 11px;
    bottom: auto;
    left: auto;
    left: 6vw;
    bottom: 2vw;
  }
}

/* CTA セクション */
#cta_area {
  width: 100%;
  position: fixed;
  display: flex;
  bottom: 0; /* ビューポートの下端に固定する場合 */
  left: 0; /* ビューポートの左端に固定する場合 */
  right: 0; /* ビューポートの右端に固定する場合（左右両端に固定する場合） */
  z-index: 10; /* 他の要素よりも前面に表示されるようにする */
  background-color: rgba(255, 255, 255, 0.6); /* 背景色を透明にする */
}

/* 初期は非表示、スクロールで .cta-visible を付与してフェードイン */
#cta_area {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.45s ease, transform 0.45s ease;
  will-change: opacity, transform;
}

#cta_area.cta-hidden {
  opacity: 0;
  transform: translateY(16px);
  pointer-events: none;
}

#cta_area.cta-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

@media (max-width: 768px) {
  #cta_area {
    display: none !important; /* タブレットサイズ以下の場合に非表示にする */
  }
}
#cta_area .phone_area {
  width: 36vw;
  color: #184177;
}

#cta_area .phone_area .phone_description {
  padding-top: 30px;
  text-align: center;
  font-size: 1.3vw;
  margin-bottom: 5px;
}

#cta_area .phone_area .phone_number {
  font-size: 3vw;
  font-weight: 600;
  text-align: center;
}

#cta_area .phone_area .phone_number img {
  width: 2vw;
  height: 2vw;
}

#cta_area .mail_area {
  width: 40vw;
  padding-bottom: 20px;
}

#cta_area .mail_area .cta_subtext {
  padding-top: 10px;
  text-align: center;
  color: #184177;
  font-size: 1.5vw;
  letter-spacing: 0.7vw;
  font-weight: 500;
}

#cta_area .mail_area .cta_subtext p{
  margin: 0;
}


#cta_area .mail_area .mail_button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px 20px;
  width: 29vw;
  max-width: 500px;
  background-color: #0F70B9;
  margin: 0px auto;
  text-align: center;
  border-radius: 40px;
  transition: background-color 0.3s ease;
}

#cta_area .mail_area .mail_button:hover {
  background-color: #58A9D5; /* ホバー時に背景色を変更 */
}

#cta_area .mail_area .mail_button a {
  display: flex; /* Flexboxを有効にする */
  align-items: center; /* 垂直方向の中央揃え */
  justify-content: center; /* 水平方向の中央揃え */
  text-decoration: none;
  width: 100%; /* 親要素と同じ幅にする */
  height: 100%; /* 親要素と同じ高さにする */
}

#cta_area .mail_area .mail_button .mail_image {
  width: 3vw;
  height: 100%;
}

#cta_area .mail_area .mail_button .mail_image img {
  width: 2vw;
  height: 2vw;
}

#cta_area .mail_area .mail_button .mail_button_text {
  color: #fff;
  padding: 10px 20px;
  font-size: 2vw;
  margin: 0;
}

#cta_area .mail_area .mail_button .arrow_image {
  width: 3vw;
  height: 100%;
}

#cta_area .mail_area .mail_button .arrow_image img {
  width: 2vw;
  height: 2vw;
}

#cta_area .line_area {
  width: 40vw;
}

#cta_area .line_area .cta_subtext {
  padding-top: 10px;
  text-align: center;
  color: #184177;
  font-size: 1.5vw;
  letter-spacing: 0.7vw;
  font-weight: 500;
}

#cta_area .line_area .line_button {
  display: flex; /* Flexboxを有効にする */
  align-items: center; /* 垂直方向の中央揃え */
  justify-content: center; /* 水平方向の中央揃え */
  padding: 5px 20px;
  width: 29vw;
  max-width: 500px;
  background-color: #01CE2F;
  margin: 0 auto;
  text-align: center;
  border-radius: 40px;
  margin-top: 5px;
  transition: background-color 0.3s ease; /* 背景色の変化にアニメーションを追加 */
}

#cta_area .line_area .line_button:hover {
  background-color: #60E36A; /* 薄い緑色に変更 */
}

#cta_area .line_area .line_button a {
  display: flex; /* Flexboxを有効にする */
  align-items: center; /* 垂直方向の中央揃え */
  justify-content: center; /* 水平方向の中央揃え */
  text-decoration: none;
  width: 100%; /* 親要素と同じ幅にする */
  height: 100%; /* 親要素と同じ高さにする */
}

#cta_area .line_area .line_button .line_image {
  width: 3vw;
  height: 100%;
}

#cta_area .line_area .line_button .line_image img {
  width: 2vw;
}

#cta_area .line_area .line_button .line_button_text {
  color: #fff;
  padding: 10px 20px;
  font-size: 2vw;
  margin: 0;
}

#cta_area .line_area .line_button .arrow_image {
  width: 3vw;
  height: 100%;
}

#cta_area .line_area .line_button .arrow_image img {
  width: 2vw;
  height: 2vw;
}

#cta_area .top_return_area {
  padding-top: 20px;
  width: 10vw;
  text-align: center;
}

#cta_area .top_return_area a {
  text-decoration: none;
}

#cta_area .top_return_area .top_return {
  width: 7vw;
}

#cta_area .top_return_area .top_return img {
  width: 4vw;
}

#cta_area .top_return_area .return_text {
  color: #184177;
  padding-top: 10px;
  font-size: 12px;
}


@media (min-width: 769px) {
  .cta_sp_area {
    z-index: 10;
    display: none;
  }
}
.cta_sp_area .cta_sp_phone_area {
  height: 100%;
  width: 50vw;
  text-align: center;
  z-index: 10;
}

.cta_sp_area .cta_sp_phone_area a {
  text-decoration: none;
}

.cta_sp_area .cta_sp_phone_area .cta_sp_phone_text {
  font-size: 3vw;
  margin-top: 12px;
  color: #184177;
}

.cta_sp_area .cta_sp_phone_area .cta_sp_phone_text p {
  margin: 0;
}

.cta_sp_area .cta_sp_phone_area .cta_sp_phone_under_area {
  display: flex;
  justify-content: center;
  padding-bottom: 10px;
}

.cta_sp_area .cta_sp_phone_area .cta_sp_phone_image {
  margin-top: 5px;
  display: inline-block;
  display: flex;
  align-items: center;
  margin-right: 5px;
}

.cta_sp_area .cta_sp_phone_area .cta_sp_phone_image img {
  width: 4vw;
  display: inline-block;
}

.cta_sp_area .cta_sp_phone_area .cta_sp_phone_number {
  color: #184177;
  font-size: 5.5vw;
  font-weight: 600;
}

.cta_sp_area .cta_sp_phone_area .cta_sp_phone_number p {
  margin: 0;
}

.cta_sp_area .cta_sp_mail_area {
  height: 100%;
  background-color: #0F70B9;
  opacity: 0.8;
  width: 25vw;
  position: relative;
}

.cta_sp_area .cta_sp_mail_image {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 10px;
  z-index: 10;
  padding-bottom: 3px;
}

.cta_sp_area .cta_sp_mail_image img {
  width: 7vw;
}

.cta_sp_area .cta_sp_mail_text {
  color: #fff;
  font-size: 3vw;
  text-align: center;
  letter-spacing: 0.1em;
}

.cta_sp_area .cta_sp_line_area {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  background-color: #52B636;
  width: 25vw;
}

.cta_sp_area .cta_sp_line_image {
  text-align: center;
  padding-top: 95x;
}

.cta_sp_area .cta_sp_line_image img {
  width: 7vw;
}

.cta_sp_area .cta_sp_line_text {
  color: #fff;
  font-size: 3.2vw;
  letter-spacing: 0.1em;
  margin-top: 2px;
}

@media (max-width: 499px) {
  .cta_sp_area {
    height: 72px;
    width: 100%;
    text-align: center;
    z-index: 10;
    display: flex;
    position: fixed;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.8);
  }
  .cta_sp_area .cta_sp_phone_area {
    height: 100%;
    width: 50%;
    text-align: center;
    z-index: 10;
  }
  .cta_sp_area .cta_sp_phone_area a {
    text-decoration: none;
  }
  .cta_sp_area .cta_sp_phone_area .cta_sp_phone_text {
    font-size: 12px;
    margin-top: 12px;
    color: #184177;
  }
  .cta_sp_area .cta_sp_phone_area .cta_sp_phone_text p {
    margin: 0;
  }
  .cta_sp_area .cta_sp_phone_area .cta_sp_phone_under_area {
    display: flex;
    justify-content: center;
    padding-bottom: 10px;
  }
  .cta_sp_area .cta_sp_phone_area .cta_sp_phone_image {
    margin-top: 5px;
    display: inline-block;
    display: flex;
    align-items: center;
    margin-right: 5px;
  }
  .cta_sp_area .cta_sp_phone_area .cta_sp_phone_image img {
    width: 4vw;
    display: inline-block;
  }
  .cta_sp_area .cta_sp_phone_area .cta_sp_phone_number {
    color: #184177;
    font-size: 5.5vw;
    font-weight: 600;
  }
  .cta_sp_area .cta_sp_phone_area .cta_sp_phone_number p {
    margin: 0;
  }
  .cta_sp_area .cta_sp_mail_area {
    height: 100%;
    background-color: #0F70B9;
    opacity: 0.8;
    width: 25vw;
    position: relative;
  }
  .cta_sp_area .cta_sp_mail_image {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 12px;
    z-index: 10;
    padding-bottom: 3px;
  }
  .cta_sp_area .cta_sp_mail_image img {
    width:  5vw;
  }
  .cta_sp_area .cta_sp_mail_text {
    color: #fff;
    font-size: 14px;
    text-align: center;
    letter-spacing: 0.1em;
  }
  .cta_sp_area .cta_sp_line_area {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    background-color: #52B636;
    width: 24.5vw;
  }
  .cta_sp_area .cta_sp_line_image {
    text-align: center;
    margin-top: 5px;
  }
  .cta_sp_area .cta_sp_line_image img {
    width: 5vw;
  }
  .cta_sp_area .cta_sp_line_text {
    color: #fff;
    font-size: 14px;
    letter-spacing: 0.1em;
    margin-top: 2px;
  }
}

@media (min-width: 500px) and (max-width:768px){
  .cta_sp_area {
    height: 100px;
    width: 100%;
    text-align: center;
    z-index: 10;
    display: flex;
    position: fixed;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.8);
  }
  .cta_sp_area .cta_sp_mail_image img {
    width:  5vw;
  }
  .cta_sp_area .cta_sp_line_image img {
    width: 5vw;
  }
  .cta_sp_area .cta_sp_mail_image {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 10px;
    z-index: 10;
    padding-bottom: 3px;
  }
  #page_top img{
    width: 8vw;
  }
}


/* お悩みセクション */
#concern {
  background-color: #E0FAFF;
  height: 100%;
  padding-top: 100px;
}

#concern .concern_section_title {
  font-size: 3vw;
  text-align: center;
  letter-spacing: 8px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
}

#concern .concern_section_title span {
  font-size: 3vw;
  text-align: center;
  color: #1F84A6;
  border-bottom: 4px solid #1F84A6;
}

#concern .concern_section_title .second-line {
  font-size: 3vw;
  text-align: center;
  color: #000;
  border-bottom: none;
}

#concern .concern-table {
  text-align: center;
  width: 90vw;
}

#concern .concern-table .col-12 {
  display: flex;
  border: #1A70B9 1px solid;
  padding: 40px;
  border-radius: 30px;
  align-items: center;
}

#concern .concern-table .col-12:first-of-type {
  margin-top: 34px;
}

#concern .concern-table .check_image {
  width: 3vw;
  display: block;
}

#concern .concern-table .row img {
  width: 3vw;
  height: 100%;
}

#concern .concern-table .row p {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 0 !important;
  line-height: 2;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
}

#concern .concern-table .table_content {
  padding-left: 3vw;
  text-align: left;
}

#concern .concern_people {
  margin: 60px auto 0px;
  text-align: center;
  padding-bottom: 60px;
}

#concern .concern_people img {
  width: 30vw;
}

.full-screen-bubble {
  width: 90%;
  background-color: #0F70B9;
  margin: 0px auto 0;
  text-align: center;
  color: #fff;
  padding: 32px 0;
  border-radius: 20px;
  font-size: 3.5vw;
  position: relative;
}

/* 下向き三角形の追加 */
.full-screen-bubble::after {
  content: "";
  position: absolute;
  /* 三角形の高さ分だけ負の値にして、ピッタリくっつける */
  top: calc(100% - 1px);
  left: 50%;
  transform: translateX(-50%);
  border-left: 2vw solid transparent;
  border-right: 2vw solid transparent;
  border-top: 2vw solid #0F70B9; /* 三角形の色 */
}

@media (max-width: 768px) {
  #concern {
    background-color: #E0FAFF;
    height: 100%;
    padding-top: 50px;
  }
  #concern .concern_section_title {
    display:block;
    margin: 0 auto;
    font-size: 26px;
    letter-spacing: 8px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 500;
    line-height: 2;
    text-align: center;
    color: #222222;
    font-weight: 600;
  }
  #concern .concern_section_title span {
    font-size: 26px;
    text-align: center;
    color: #1F84A6;
    border-bottom: 4px solid #1F84A6;
    display: inline-block;
    padding-bottom: 4px;
    width: auto;
  }
  /* 2行目の「ありませんか？」を改行 */
  #concern .concern_section_title .second-line {
    font-size: 26px;
    color: #222222; /* 文字の色を変える場合 */
    border: none; /* 2行目には下線なし */
    display: inline-block; /* 強制的に改行させる */
    margin-top: 10px; /* 行間の余白 */
  }
  #concern .concern-table {
    text-align: center;
    width: 90vw;
  }
  #concern .concern-table .col-12 {
    display: flex;
    border: #1A70B9 1px solid;
    padding: 20px;
    border-radius: 30px;
    align-items: center;
    margin-bottom: 20px;
  }
  #concern .concern-table .check_image {
    width: 3vw;
    display: block;
    margin-right: 10px;
  }
  #concern .concern-table .row img {
    width: 4vw;
  }
  #concern .concern-table .row p {
    font-size: 16px;
    font-weight: 500;
    font-family: "Noto Sans JP", sans-serif;
  }
  #concern .concern-table .table_content {
    padding-left: 3vw;
    text-align: left;
  }
  #concern .concern_people {
    margin: 60px auto 0;
    text-align: center;
  }
  #concern .concern_people img {
    width: 50vw;
  }
  .triangle_end {
    width: 0;
    height: 0;
    border-left: 50vw solid transparent;
    border-right: 50vw solid transparent;
    border-top: 10vh solid #E0FAFF; /* 三角形の色を指定 */
  }
  .full-screen-bubble {
    width: 90%;
    background-color: #0F70B9;
    margin: 0 auto;
    text-align: center;
    color: #fff;
    padding: 32px 20px;
    border-radius: 20px;
    font-size: 26px;
    position: relative;
    line-height: 1.8;
  }
  /* 下向き三角形の追加 */
  .full-screen-bubble::after {
    content: "";
    position: absolute;
    /* 三角形の高さ分だけ負の値にして、ピッタリくっつける */
    top: calc(100% - 1px);
    left: 50%;
    transform: translateX(-50%);
    border-left: 2vw solid transparent;
    border-right: 2vw solid transparent;
    border-top: 2vw solid #0F70B9; /* 三角形の色 */
  }
}
@media (min-width: 768px) {
  #benefits_section .benefits_title {
    margin-top: 60px;
    margin-bottom: 40px;
    text-align: center;
    color: #1F84A6;
    font-size: 3.5vw;
    font-weight: 500;
  }
  #benefits_section .benefits_title .first-line,
  #benefits_section .benefits_title .second-line {
    display: inline; /* 通常表示では改行しない */
  }
  #benefits_section li {
    list-style-type: none;
  }
  #benefits_section .col-inner {
    width: 100%;
    height: 100%;
    border-top: 1px solid #707070;
    border-bottom: 1px solid #707070;
    padding: 5vw 50px;
    position: relative;
  }
  #benefits_section .right_picture_first {
    width: 7vw;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 7vw;
  }
  #benefits_section .right_picture_first img {
    width: 100%;
    height: 100%;
  }
  #benefits_section .right_picture_second {
    width: 15vw;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 3vw;
  }
  #benefits_section .right_picture_second img {
    width: 100%;
    height: 100%;
  }
  #benefits_section .right_picture_third {
    width: 15vw;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 5vw;
  }
  #benefits_section .right_picture_third img {
    width: 100%;
    height: 100%;
  }
  #benefits_section .right_picture_fourth {
    width: 12vw;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 5vw;
  }
  #benefits_section .right_picture_fourth img {
    width: 100%;
    height: 100%;
  }
  #benefits_section .col-inner h3 {
    font-size: calc(18px + 0.8vw);
    font-weight: 600;
    width: auto;
    display: flex;
    align-items: center;
    max-width: calc(100% - 220px); /* 右側イラスト分のスペースを確保 */
  }
  #benefits_section .col-inner .benefits_list_title {
    display: inline-block;
    margin-left: 30px;
    width: calc(100% - 120px);
    line-height: 1.5;
    font-size: 1.4rem;
  }
  #benefits_section .col-inner h3 span {
    background-color: #1F84A6;
    color: #fff;
    display: inline-block;
    width: 6vw;
    height: 6vw;
    border-radius: 15px;
    text-align: center;
    font-size: 3vw;
    line-height: 6vw;
  }
  #benefits_section .col-inner p {
    width: calc(100% - 20%);
    line-height: 2.2;
    margin-top: 20px;
    font-size: 1rem;
  }
}
@media (max-width: 767px) {
  /* スマートフォン向けのスタイル */
  #benefits_section .benefits_title {
    margin-top: 40px;
    text-align: center;
    color: #1F84A6;
    font-size: 7vw;
    font-weight: 700;
    line-height: 1.8;
  }
  /* スマホ表示時に改行を強制 */
  #benefits_section .benefits_title .first-line,
  #benefits_section .benefits_title .second-line {
    display: block; /* スマホ表示時にブロック要素として扱うことで改行 */
  }
  #benefits_section li {
    list-style-type: none;
  }
  #benefits_section .col-inner {
    width: 100%;
    height: 100%;
    border-bottom: 1px solid #707070;
    padding: 20px 20px;
    padding-bottom: 110px;
    position: relative;
    margin-bottom: 60px;
  }
  #benefits_section .col-inner:first-child {
    border-top: 1px solid #707070;
  }
  #benefits_section .underline_none {
    border-bottom: none;
  }
  #benefits_section .right_picture_first {
    position: absolute;
    bottom: auto;
    right: auto;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }
  #benefits_section .right_picture_first img {
    width: 90px;
  }
  #benefits_section .right_picture_second {
    position: absolute;
    bottom: auto;
    right: auto;
    bottom: 0vw;
    left: 50%;
    transform: translateX(-50%);
  }
  #benefits_section .right_picture_second img {
    width: 200px;
  }
  #benefits_section .right_picture_third {
    position: absolute;
    bottom: auto;
    right: auto;
    bottom: 0vw;
    left: 50%;
    transform: translateX(-50%);
  }
  #benefits_section .right_picture_third img {
    width: 200px;
  }
  #benefits_section .right_picture_fourth {
    position: absolute;
    bottom: auto;
    right: auto;
    bottom: 0vw;
    left: 50%;
    transform: translateX(-50%);
  }
  #benefits_section .right_picture_fourth img {
    width: 140px;
  }
  #benefits_section .col-inner h3 {
    font-size: 4vw;
    font-weight: 600;
    width: 100%;
    display: block;
    align-items: flex-start;
  }
  #benefits_section .col-inner .benefits_list_title {
    display: inline-block;
    width: 100%;
    line-height: 1.8;
    font-size: 18px;
    letter-spacing: 0.09em;
  }
  #benefits_section .col-inner h3 span {
    background-color: #1F84A6;
    color: #fff;
    display: inline-block;
    width: 60px;
    height: 60px;
    border-radius: 5px;
    text-align: center;
    font-size: 16px;
    line-height: 60px;
    display: block;
    margin-bottom: 10px;
  }
  #benefits_section .col-inner p {
    font-size: 16px;
    line-height: 2;
    letter-spacing: 0.09em;
    margin-top: 20px;
  }
}
@media (min-width: 768px) {
  #customer_voices {
    background-color: #E0FAFF;
    margin-top: 60px;
    margin-bottom: 80px;
    padding-bottom: 80px;
  }
  #customer_voices h2 {
    padding-top: 80px;
    font-size: 4vw;
  }
  #customer_voices .customer_voices_description {
    text-align: center;
    line-height: 1.8;
  }
  #customer_voices .customer-voice-b {
    margin: 40px auto 80px;
    text-align: center;
  }
  #customer_voices .customer-voice-b .customer-profile-b {
    position:relative;
    background-color: #fff;
    width: 51vw;
    margin: 0 auto;
    display: flex;
    align-items: center;
    box-shadow: 12px 12px 0px rgba(0, 0, 0, 0.16);
  }
  #customer_voices .customer-voice-b .customer-profile-b-icon {
    width: 21vw;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #customer_voices .customer-voice-b .customer-profile-b-icon img {
    width: 9vw;
    height: 9vw;
    -o-object-fit: contain;
    object-fit: contain;
  }

  #customer_voices .customer-profile-b .clip-image {
    position: absolute;
    top: -2%;
    right: 11px;
  }

  #customer_voices .customer-profile-b .clip-image img{
    width: 20px;
    height: auto;
  }


  #customer_voices .customer-voice-b .customer-profile-b-info {
    width: 40vw;
    text-align: left;
    padding-bottom: 20px;
  }
  #customer_voices .customer-voice-b .customer-profile-b-info-headline {
    padding-top: 20px;
    padding-bottom: 10px;
    font-size: 1.4vw;
    font-weight: 500;
    border-bottom: 1px solid #707070;
    margin: 0 10%;
  }
  #customer_voices .customer-voice-b .customer-profile-b-info-name {
    padding-top: 20px;
    font-size: 1.4vw;
    margin: 0 10%;
  }
  #customer_voices .customer-voice-b .customer-profile-b-info-list {
    padding-top: 10px;
    font-size: 1.3vw;
    letter-spacing: 0.1em;
    margin: 0 10%;
    list-style-type: none;
    line-height: 1.5;
  }
  #customer_voices .customer-voice-b .noda-area {
    background-color: #fff;
    margin-top: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative; /* 親要素を相対位置に設定 */
    width: 70%; /* 吹き出しの幅を調整 */
    margin: 0 auto;
  }
  #customer_voices .customer-voice-b .reverse img {
    width: 8vw;
  }
  #customer_voices .customer-voice-b .noda-area {
    background-color: #E0FAFF;
    margin-top: 60px;
    position: relative;
    margin-bottom: 40px;
  }
  #customer_voices .customer-voice-b .noda-area .noda-icon {
    position: absolute;
    left: -23%; 
    top: 50%;
    transform: translateY(-50%); 
    height: auto; 
    text-align: right;
  }
  #customer_voices .customer-voice-b .noda-area .noda-icon img {
    width: 80px;
    height: auto;
  }
  .noda-hukidashi {
    position: relative;
    width: 40vw;
    height: auto;
    background: #FFFFFF;
    padding: 30px;
    text-align: center;
    border: 1px solid #707070;
    color: #666666;
    font-size: 1.3vw;
    letter-spacing: 0.1em;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
  }
  .noda-hukidashi:after, .noda-hukidashi::before {
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    right: 100%;
    top: 50%;
  }
  .noda-hukidashi:after {
    border-color: rgba(255, 255, 255, 0);
    border-top-width: 20px;
    border-bottom-width: 20px;
    border-left-width: 10px;
    border-right-width: 10px;
    margin-top: -20px;
    border-right-color: #FFFFFF;
  }
  .noda-hukidashi:before {
    border-color: rgba(112, 112, 112, 0);
    border-top-width: 22px;
    border-bottom-width: 22px;
    border-left-width: 11px;
    border-right-width: 11px;
    margin-top: -22px;
    margin-right: 1px;
    border-right-color: #707070;
  }
  .noda-hukidashi-text {
    color: #2E2E80;
    margin: 0;
    text-align: left;
    font-weight: 500;
    font-size: 18px;
    line-height: 1.8;
    letter-spacing: 0.09em;
  }
  .center_text {
    text-align: center;
  }
  #customer_voices .customer-voice-b .bsama-area {
    background-color: #E0FAFF;
    margin-top: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 70%; /* 吹き出しの幅を調整 */
    margin: 0 auto;
  }
  .bsama-hukidashi {
    background-color: #fff;
    position: relative;
    width: 40vw;
    height: auto;
    background: #FFFFFF;
    padding: 30px;
    text-align: center;
    border: 1px solid #707070;
    color: #666666;
    font-size: 1.3vw;
    letter-spacing: 0.1em;
    line-height: 2;
  }
  .bsama-hukidashi:after, .bsama-hukidashi:before {
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    left: 100%;
    top: 50%;
  }
  .bsama-hukidashi:after {
    border-color: rgba(255, 255, 255, 0);
    border-top-width: 20px;
    border-bottom-width: 20px;
    border-left-width: 10px;
    border-right-width: 10px;
    margin-top: -20px;
    border-left-color: #FFFFFF;
  }
  .bsama-hukidashi:before {
    border-color: rgba(112, 112, 112, 0);
    border-top-width: 21px;
    border-bottom-width: 21px;
    border-left-width: 10px;
    border-right-width: 10px;
    margin-top: -21px;
    margin-left: 1px;
    border-left-color: #707070;
  }
  #customer_voices .customer-voice-b .bsama-area .bsama-icon {
    position: absolute; /* アイコンを絶対位置に設定 */
    right: -21%; /* 吹き出しの右にアイコンを配置 */
    top: 50%; /* 吹き出しの中央にアイコンを垂直に配置 */
    transform: translateY(-50%); /* 中央揃えのために調整 */
    height: auto; /* アイコンの高さを自動調整 */
  }
  #customer_voices .customer-voice-b .bsama-area .bsama-icon img {
    width: 80px;
  }
  .bsama-hukidashi-text {
    color: #222222;
    margin: 0;
    text-align: left;
    margin-bottom: 20px;
    font-size: 18px;
  }
  #customer_voices .container .customer-voice-b .arrow-indicator {
    margin: 0 auto;
  }
  #customer_voices .container .customer-voice-b .arrow-indicator .arrow_under_image {
    margin-top: 40px;
    display: block;
  }
  #customer_voices .container .customer-voice-b .arrow-indicator .arrow_under_image img {
    width: 6vw;
    height: 6vw;
  }
  #customer_voices .container .customer-voice-b .arrow-indicator .arrow_text {
    margin-top: 40px;
    display: block;
    font-size: 2vw;
    text-align: center;
  }
  #customer_voices .container .customer-voice-b .success-container {
    display: block;
    margin-top: 40px;
  }
  #customer_voices .container .customer-voice-b .success-container .happy-icon {
    display: flex;
    justify-content: center;
    width: 100%;
  }
  #customer_voices .container .customer-voice-b .success-container .happy-icon img {
    display: block;
    margin: 0 auto;
    width: 30vw;
  }
  #customer_voices .container .customer-voice-b .success-container .success-message {
    display: block;
    padding-top: 40px;
    padding-bottom: 60px;
    font-size: 3vw;
  }
  #customer_voices .container .customer-voice-b .colum_link {
    margin-top: 30px;
    width: 100%;
    margin: 60px auto 0;
    display: flex; /* フレックスボックスの適用 */
    justify-content: center; /* 水平方向に中央揃え */
    align-items: center;
  }
  #customer_voices .container .customer-voice-b .colum_link .image {
    width: 40.5vw;
    height: 12vw;
    background-image: url("../img/colum_button.png");
    background-size: cover;
    transition: background-image 0.3s ease-in-out;
  }
  #customer_voices .container .customer-voice-b .colum_link .image:hover {
    background-image: url("../img/colum_button_hover.png");
  }
}
@media (max-width: 767px) {
  #customer_voices {
    background-color: #E0FAFF;
    margin-top: 60px;
  }
  #customer_voices h2 {
    padding-top: 80px;
    font-size: 26px; /* 他のセクションのh2（モバイル）に合わせる */
    line-height: 1.2;
  }
  #customer_voices .customer_voices_description {
    text-align: left;
    line-height: 2;
  }
  #customer_voices .customer-voice-b {
    margin: 40px auto;
    text-align: center;
  }
  #customer_voices .customer-voice-b .customer-profile-b {
    position: relative;
    background-color: #fff;
    width: 90vw;
    max-width: 500px;
    height: auto;
    margin: 0 auto;
    display: flex;
    box-shadow: 12px 12px 0px rgba(0, 0, 0, 0.16);
    padding-bottom: 20px;
  }
  #customer_voices .customer-voice-b .customer-profile-b-icon {
    width: 21vw;
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 30px;
    padding-left: 20px;
  }
  #customer_voices .customer-voice-b .customer-profile-b-icon img {
    width: 21vw;
    -o-object-fit: contain;
       object-fit: contain;
  }

  #customer_voices .customer-profile-b .clip-image {
    position: absolute;
    top: -2%;
    right: 11px;
  }

  #customer_voices .customer-profile-b .clip-image img{
    width: 20px;
    height: auto;
  }

  #customer_voices .customer-voice-b .customer-profile-b-info {
    width: 70vw;
    text-align: left;
  }
  #customer_voices .customer-voice-b .customer-profile-b-info-headline {
    padding-top: 20px;
    padding-bottom: 10px;
    font-size: 16px;
    font-weight: 500;
    border-bottom: 1px solid #707070;
    margin: 0 10%;
  }
  #customer_voices .customer-voice-b .customer-profile-b-info-name {
    padding-top: 20px;
    font-size: 16px;
    margin: 0 10%;
  }
  #customer_voices .customer-voice-b .customer-profile-b-info-list {
    padding-top: 10px;
    font-size: 16px;
    margin: 0 10%;
    list-style-type: none;
    line-height: 1.4;
  }
  #customer_voices .customer-voice-b .noda-area {
    background-color: #fff;
    margin-top: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative; /* 親要素を相対位置に設定 */
    width: 80%; /* 吹き出しの幅を調整 */
    margin-left: auto;
    margin-right: auto;
  }
  #customer_voices .customer-voice-b .reverse img {
    width: 8vw;
  }
  #customer_voices .customer-voice-b .noda-area {
    background-color: #E0FAFF;
    margin-top: 60px;
    position: relative;
    margin-right: 0;
  }
  #customer_voices .customer-voice-b .noda-area .noda-icon {
    position: absolute;
    top: 50%;
    left: -26%;
    transform: translateY(-50%);
    height: auto;
  }
  #customer_voices .customer-voice-b .noda-area .noda-icon img {
    width: 16vw;
    object-fit: contain;
  }
  /* 画像が吹き出しの外に絶対配置されているため、親で切り取られないようにする */
  #customer_voices .customer-voice-b,
  #customer_voices .customer-voice-b .noda-area,
  #customer_voices .customer-voice-b .bsama-area {
    overflow: visible;
  }

  /* 親コンテナもはみ出しを許可（念のため） */
  #customer_voices .container {
    overflow: visible;
  }
  .noda-hukidashi {
    position: relative;
    width: 80vw;
    height: auto;
    background: #FFFFFF;
    padding: 20px;
    text-align: center;
    border: 1px solid #707070;
    color: #666666;
    font-size: 16px;
    border-radius: 10px;
    letter-spacing: 0.09em;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
  }
  .noda-hukidashi:after, .noda-hukidashi::before {
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    right: 100%;
    top: 50%;
  }
  .noda-hukidashi:after {
    border-color: rgba(255, 255, 255, 0);
    border-top-width: 20px;
    border-bottom-width: 20px;
    border-left-width: 10px;
    border-right-width: 11px;
    margin-top: -20px;
    border-right-color: #FFFFFF;
  }
  .noda-hukidashi:before {
    border-color: rgba(112, 112, 112, 0);
    border-top-width: 22px;
    border-bottom-width: 22px;
    border-left-width: 11px;
    border-right-width: 11px;
    margin-top: -22px;
    margin-right: 1px;
    border-right-color: #707070;
  }
  .noda-hukidashi-text {
    color: #2E2E80;
    margin: 0;
    text-align: left;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.8;
  }
  #customer_voices .customer-voice-b .bsama-area {
    background-color: #E0FAFF;
    margin-top: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative; /* 親要素を相対位置に設定 */
    width: 80%; /* 吹き出しの幅を調整 */
  }
  .bsama-hukidashi {
    max-width: 600px;
    background-color: #fff;
    position: relative;
    width: 73vw;
    height: auto;
    background: #FFFFFF;
    padding: 20px;
    text-align: center;
    border: 1px solid #707070;
    color: #666666;
    font-size: 16px;
    line-height: 1.6;
    letter-spacing: 0.09em;
  }
  .bsama-hukidashi:after, .bsama-hukidashi:before {
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    left: 100%;
    top: 50%;
  }
  .bsama-hukidashi:after {
    border-color: rgba(255, 255, 255, 0);
    border-top-width: 20px;
    border-bottom-width: 20px;
    border-left-width: 10px;
    border-right-width: 10px;
    margin-top: -20px;
    border-left-color: #FFFFFF;
  }
  .bsama-hukidashi:before {
    border-color: rgba(112, 112, 112, 0);
    border-top-width: 21px;
    border-bottom-width: 21px;
    border-left-width: 10px;
    border-right-width: 10px;
    margin-top: -21px;
    margin-left: 1px;
    border-left-color: #707070;
  }
  #customer_voices .customer-voice-b .bsama-area .bsama-icon {
    position: absolute;
    right:-30%;
    top: 50%;
    transform: translateY(-50%);
    height: auto;
  }
  #customer_voices .customer-voice-b .bsama-area .bsama-icon img {
    width: 16vw;
  }
  .bsama-hukidashi-text {
    color: #222222;
    margin: 0;
    text-align: left;
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 1.8;
    letter-spacing: 0.09em;
  }
  .bsama-hukidashi-text-second {
    color: #222222;
    margin: 0;
    text-align: left;
    margin-top: 10px;
  }
  #customer_voices .container .customer-voice-b .arrow-indicator {
    margin: 0 auto;
  }
  #customer_voices .container .customer-voice-b .arrow-indicator .arrow_under_image {
    margin-top: 40px;
    display: block;
    text-align: center;
  }
  #customer_voices .container .customer-voice-b .arrow-indicator .arrow_under_image img {
    width: 15vw;
    text-align: center;
  }
  #customer_voices .container .customer-voice-b .arrow-indicator .arrow_text {
    margin-top: 40px;
    display: block;
    font-size: 5vw;
  }
  #customer_voices .container .customer-voice-b .success-container {
    display: inline-block;
    margin-top: 40px;
  }
  #customer_voices .container .customer-voice-b .success-container .happy-icon {
    display: inline-block;
    width: 100%;
  }
  #customer_voices .container .customer-voice-b .success-container .happy-icon img {
    display: inline-block;
    width: 60vw;
  }
  #customer_voices .container .customer-voice-b .success-container .success-message {
    display: inline-block;
    font-size: 5vw;
    font-weight: 500;
    margin-top: 20px;
  }


  #customer_voices .container .customer-voice-b .colum_link {
    margin-top: 30px;
    width: 100%;
    margin: 40px auto 60px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #customer_voices .container .customer-voice-b .colum_link .image {
    width: 75.5vw;
    height: 22.5vw;
    background-image: url("../img/colum_button.png");
    background-size: cover;
    transition: background-image 0.3s ease-in-out;
  }

  #customer_voices .container .customer-voice-b .colum_link .image:hover {
    background-image: url("../img/colum_button_hover.png");
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  /* タブレット表示用のスタイルをここに記述 */
  #customer_voices .customer-voice-b .customer-profile-b {
  }
  #customer_voices .customer-voice-b .customer-profile-b-info {
    font-size: 16px;
    padding-bottom: 20px;
  }
  #customer_voices .customer-voice-b .customer-profile-b-info-headline {
    font-size: 16px;
  }
  #customer_voices .customer-voice-b .customer-profile-b-info-name {
    padding-top: 10px;
    font-size: 16px;
  }
  #customer_voices .customer-voice-b .customer-profile-b-info-list {
    padding-top: 5px;
    font-size: 16px;
  }
  .noda-hukidashi {
    width: 50vw;
  }
  .noda-hukidashi p {
    font-size: 16px;
  }
  .bsama-hukidashi {
    width: 50vw;
    padding: 30px;
  }
  .bsama-hukidashi p {
    font-size: 16px;
  }

  #customer_voices .customer-voice-b .noda-area .noda-icon img {
    width: 8vw;
    height: auto;
  }
  #customer_voices .customer-voice-b .bsama-area .bsama-icon img {
    width: 8vw;
    height: auto;
  }
  #customer_voices .container .customer-voice-b .arrow-indicator .arrow_text p {
    font-size: 20px;
  }
}


#pension_faq {
  margin-top: 80px;
  margin-bottom: 80px;
}


#pension_faq .pension_faq_description {
  text-align: center;
  font-size: 18px;
  line-height: 1.5;
  padding-top: 20px;
}

.shining_background {
  width: 100%;
  height: 20vw;
  background-image: url(../img/shining.png);
  background-size: cover;
  background-repeat: no-repeat;
}

.x_icon {
  margin: 0 auto 20px;
  text-align: center;
}

.x_icon img {
  height: 5vw;
}

.box_inner {
  padding: 20px;
}

.box_inner img {
  width: 100%;
  height: auto;
}

.x_profile_button {
  margin-top: 30px;
  width: 100%;
  margin: 60px auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.x_hover_image {
  width: 38.5vw;
  height: 11vw;
  background-image: url("../img/x_profile_button.png");
  background-size: cover;
  transition: background-image 0.3s ease-in-out;
}

.x_hover_image:hover {
  background-image: url("../img/x_profile_button_hover.png");
}

.insta_profile_button {
  margin-top: 30px;
  width: 100%;
  margin: 60px auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.insta_hover_image {
  width: 40.5vw;
  height: 12.5vw;
  background-image: url("../img/insta_profile_button.png");
  background-size: cover;
  transition: background-image 0.3s ease-in-out;
}

.insta_hover_image:hover {
  background-image: url("../img/insta_profile_button_hover.png");
}

.insta_area {
  margin-top: 80px;
  padding-bottom: 60px; /* ドット表示用のスペース確保 */
}

.insta_icon {
  margin: 0 auto 20px;
  text-align: center;
}

.insta_icon img {
  width: 4vw;
}

.x_area .slider,
.insta_area .slider {
  position: relative;
  margin-bottom: 10px; /* スライダー本体とドットの間隔 */
}

@media (max-width: 768px) {
  #pension_faq {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  #pension_faq .container h2 {
    font-size: 8vw;
  }
  #pension_faq .container .pension_faq_description {
    text-align: center;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.09em;
  }
  .shining_background {
    margin-top: 40px;
    width: 100%;
    height: 20vw;
    background-image: url(../img/shining.png);
    background-size: cover;
    background-repeat: no-repeat;
  }
  .x_icon {
    margin: 30px auto 0;
    text-align: center;
  }
  .x_icon img {
    height: 8vw;
  }
  .x_profile_button {
    margin: 60px auto;
    text-align: center;
  }
  .x_profile_button img {
    width: 46vw;
  }

  .x_hover_image{
    width: 72vw;
    height: 20.5vw;
  }

  .insta_area {
    margin-top: 80px;
    padding-bottom: 60px; /* モバイルでもドット表示用のスペース確保 */
  }
  .insta_icon {
    text-align: center;
  }
  .insta_icon img {
    width: 6vw;
  }

  .insta_hover_image{
    width: 70vw;
    height: 21.5vw;
  }
  s
}

@media (max-width: 500px) {
  .x_icon img{
    width: 15vw;
    height: auto;
  }

  .x_hover_image{
    width: 82vw;
    height: 23.5vw;
  }

  .insta_area {
    margin-top: 80px;
    padding-bottom: 60px; /* 500px以下でもドット表示用のスペース確保 */
  }
  .insta_icon {
    text-align: center;
  }
  .insta_icon img {
    width: 10vw;
  }

  .insta_hover_image{
    width: 80vw;
    height: 24.5vw;
  }
  
}

#price {
  background-color: #E0FAFF;
  margin-top: 60px;
  margin-bottom: 80px;
  padding-top: 80px;
  padding-bottom: 80px;
}

#pricing_area {
  margin: 20px auto;
  max-width: 1200px;
}

#price .content-box {
  margin-top: 60px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.price_description {
  margin-top: 40px;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.09em;
  text-align: center;
}
.price_description span {
  color: #E26928;
  font-weight: 600;
}

.pricing-item {
  width: 25%;
  max-width: 300px;
  background-color: #45CAE3;
  padding: 30px;
  border-radius: 8px;
  color: #fff;
  line-height: 1.2;
  font-size: 26px;
  text-align: center;
}

.pricing-item p span{
  font-size: 60px;
  color: #FF442C;
  font-weight: 600;
}

.plus-sign{
  display: flex;
  align-items: center;
  padding: 0 20px;
  height: auto;
  padding-top: 60px;
}

.contract-box {
  width: 300px; /* 任意の幅に調整 */
  border: 1px solid #707070;
  border-radius: 8px;
  background-color: #fff;
  text-align: center;
  overflow: hidden;
}

.contract-header {
  background-color: #44CAE3;
  color: #345888;
  padding: 20px;
  font-size: 16px;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
}

.contract-body {
  padding: 20px 10px;
  margin: 0 auto;
}

.initial-fee {
  font-size: 18px;
  font-weight: 600;
  color: #E26928;
  margin: 0;
  padding-bottom: 5px;
}

.fee-amount {
  letter-spacing: 0.09em;
  font-size: 16px;
  color: #345888;
  margin: 5px 0;
  display: block;
}

.fee-amount span{
  font-size: 36px;
  margin: 5px 0;
}

.tax-note {
  font-size: 16px;
  color: #345888;
  margin: 0;
  display: inline-block;
}

.reward-fee {
  font-size: 18px;
  color: #E26928;
  margin-bottom: 20px;
  font-weight: 600;
}

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

.reward-item {
  width: 90%;
  border: 1px solid #707070;
  border-radius: 8px;
  overflow: hidden;
}

.reward-header {
  text-align: center;
  background-color: #1B5AA3;
  color: #fff;
  padding: 10px;
  font-size: 16px;
  font-weight: bold;
  height: 40px;
  letter-spacing: 0.09em;
}

.reward-content {
  padding: 15px 10px;
  color: #345888;
  line-height: 1.5;
}

.reward-content p {
  margin: 5px 0;
}

.reward-detail {
  font-size: 16px;
}

.small-text {
  font-size: 16px;
  color: #345888;
}

.or-text {
  margin: 10px 0;
  font-size: 16px;
  color: #345888;
}

.footer-text {
  font-size: 14px;
  color: #345888;
  margin-top: 20px;
  letter-spacing: 0.09em;
}

@media screen and (min-width: 500px) and (max-width: 1024px) {
  /* タブレット用のスタイルをここに書きます */
  .plus-sign{
    margin: 0;
  }
}

@media (max-width: 699px) {
  #price h2 {
    font-size: 40px;
  }

  .content-box {
    flex-direction: column; /* 縦並びに変更 */
    align-items: center;    /* 中央揃えにする */
  }

  #price .content-box{
    align-items: center;
  }

  .pricing-item{
    width: 90%;
    margin: 0 auto;
  }
  .contract-box{
    width: 90%;
  }

  .plus-sign{
    padding: 30px 0;
    font-size: 30px;
  }
}


@media (max-width: 500px) {
  .pricing-item img{
    width: 60vw;
  }

  .pricing-item-after img{
    width: 60vw;
  }

  .price_description{
    text-align: left;
  }
}


@media (min-width: 700px) {
  #consultant_profile {
    text-align: center;
  }

  #consultant_profile .container-fluid{
    margin-top: 40px;
  }
  
  
  .profile-photo {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .profile-photo img {
    width: 19vw;
    height: 19vw;
    border-radius: 50%; /* 丸くする */
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 40% 32%;
    object-position: 13% 15%;
    border: 2px solid #ccc; /* 写真に枠をつける */
  }
  .profile-details {
    text-align: left;
    padding: 20px;
    width: 100%;
  }
  
  /* ホワイトボード */
  .is-style-whiteboard1 {
    width: 100%;
    position: relative;
    padding: 20px;
    border: 10px solid transparent;
    border-radius: 4px;
    background: linear-gradient(white, white), linear-gradient(#4d4d4d, #4d4d4d) no-repeat 100% 100% / 30px 30px, linear-gradient(#4d4d4d, #4d4d4d) no-repeat 0 100% / 30px 30px, linear-gradient(#4d4d4d, #4d4d4d) no-repeat 100% 0 / 30px 30px, linear-gradient(#4d4d4d, #4d4d4d) no-repeat 0 0 / 30px 30px, linear-gradient(#e6e6e6, #e6e6e6);
    background-clip: padding-box, border-box, border-box, border-box, border-box, border-box;
    background-origin: border-box;
    text-align: left;
  }
  .is-style-whiteboard1:before,
  .is-style-whiteboard1:after ,
  .is-style-whiteboard1 .wp-block-group__inner-container:before,
  .is-style-whiteboard1 .wp-block-group__inner-container:after {
    display: inline-block;
    position: absolute;
    content: "";
  }
  .is-style-whiteboard1:before {
    right: 10px;
    bottom: 16px;
    width: 52px;
    height: 8px;
    border-radius: 2px 2px 0 0;
    background: #5a95f5;
  }
  .is-style-whiteboard1:after {
    right: 11px;
    bottom: 1px;
    width: 50px;
    height: 15px;
    border-radius: 0 0 4px 4px;
    background: #d2e2fc;
  }
  .is-style-whiteboard1 .wp-block-group__inner-container:before {
    right: 71px;
    bottom: 1px;
    width: 48px;
    height: 8px;
    background: linear-gradient(90deg, #ea4335 8%, #f2f2f2 8%, #f2f2f2 70%, #ea4335 70%);
  }
  .is-style-whiteboard1 .wp-block-group__inner-container:after {
    right: 98px;
    bottom: 9px;
    width: 48px;
    height: 8px;
    background: linear-gradient(90deg, #333 8%, #f2f2f2 calc(8% + 1px), #f2f2f2 70%, #333 calc(70% + 1px));
    transform: rotate(-20deg);
  }

  /* ホワイトボードここまで */

  .profile-title {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    letter-spacing: 0.1em;
    line-height: 1.5;
  }
  .profile-name {
    font-size: 20px;
    margin: 20px 40px 20px;
    letter-spacing: 0.1em;
    font-weight: 600;
    line-height: 1.5;
  }
  .profile-intro {
    height: auto;
    padding: 5px 40px 20px;
    margin: 0;
  }
  .profile-intro li {
    list-style-type: disc;
    font-size: 18px;
    margin-bottom: 10px;
    letter-spacing: 0.1em;
    line-height: 2;
  }
  
  .message-container {
    background-color: #f8efcc;
    position: relative;
    width: 80%;
    margin: 80px auto;
  }

  .pen_image{
    position: absolute;
    top: 4vw;
    right: 10vw;
  }

  .pen_image img{
    width: 45px;
  }

  .message-text {
    width: 80%;
    margin: 0 auto;
    font-family: "dnp-shuei-mgothic-std", sans-serif;
    text-align: left;
    font-size: 18px;
    line-height: 2;
    letter-spacing: 0.1em;
    font-weight: 500;
    padding-top: 3%;
    padding-bottom: 90px;
  }
  
  .message-text p {
    margin: 0;
    text-decoration: underline;
    text-decoration-style: dashed;
    text-underline-offset: 5px;
  }

  .message-text span {
    font-weight: 600;
  }

  .space {
    padding-bottom: 30px;
  }
  .message-signature {
    display: flex;
    justify-content: flex-end; /* 右寄せにする */
    align-items: center;
    position: absolute;
    bottom: 2%;
    right: 5%;
    padding-top: 40px;
  }
  .signature-img {
    width: 100%; /* サイン画像の幅を設定 */
    height: auto;
    margin-right: 20px; /* ハンコとの間に余白を追加 */
  }
  .signature-img img {
    width: 12vw; /* サイン画像の幅を設定 */
    height: auto;
    margin-right: 20px; /* ハンコとの間に余白を追加 */
  }
  .hanko-img {
    width: 100%; /* ハンコ画像の幅を設定 */
    height: auto;
  }
  .hanko-img img {
    width: 4vw; /* ハンコ画像の幅を設定 */
    height: auto;
  }
}
@media (max-width: 768px) {
  #consultant_profile {
    text-align: center;
    margin-bottom: 80px;
  }
  #consultant_profile h2 {
    font-size: 34px;
  }
  .profile-container {
    margin: 0 auto;
  }
  .profile-photo {
    margin-top: 20px;
    margin-bottom: 20px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .profile-photo img {
    width: 25vw;
    height: 25vw;
    border-radius: 50%; /* 丸くする */
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 40% 32%;
    object-position: 13% 15%;
    border: 1px solid #707070;
  }
  .profile-details {
    text-align: left;
  }
  /* ホワイトボード */
  .is-style-whiteboard1 {
    width: 100%;
    position: relative;
    padding: 20px;
    border: 10px solid transparent;
    border-radius: 4px;
    background: linear-gradient(white, white), linear-gradient(#4d4d4d, #4d4d4d) no-repeat 100% 100% / 30px 30px, linear-gradient(#4d4d4d, #4d4d4d) no-repeat 0 100% / 30px 30px, linear-gradient(#4d4d4d, #4d4d4d) no-repeat 100% 0 / 30px 30px, linear-gradient(#4d4d4d, #4d4d4d) no-repeat 0 0 / 30px 30px, linear-gradient(#e6e6e6, #e6e6e6);
    background-clip: padding-box, border-box, border-box, border-box, border-box, border-box;
    background-origin: border-box;
    text-align: left;
  }
  .is-style-whiteboard1:before,
  .is-style-whiteboard1:after ,
  .is-style-whiteboard1 .wp-block-group__inner-container:before,
  .is-style-whiteboard1 .wp-block-group__inner-container:after {
    display: inline-block;
    position: absolute;
    content: "";
  }
  .is-style-whiteboard1:before {
    right: 10px;
    bottom: 16px;
    width: 52px;
    height: 8px;
    border-radius: 2px 2px 0 0;
    background: #5a95f5;
  }
  .is-style-whiteboard1:after {
    right: 11px;
    bottom: 1px;
    width: 50px;
    height: 15px;
    border-radius: 0 0 4px 4px;
    background: #d2e2fc;
  }
  .is-style-whiteboard1 .wp-block-group__inner-container:before {
    right: 71px;
    bottom: 1px;
    width: 48px;
    height: 8px;
    background: linear-gradient(90deg, #ea4335 8%, #f2f2f2 8%, #f2f2f2 70%, #ea4335 70%);
  }
  .is-style-whiteboard1 .wp-block-group__inner-container:after {
    right: 98px;
    bottom: 9px;
    width: 48px;
    height: 8px;
    background: linear-gradient(90deg, #333 8%, #f2f2f2 calc(8% + 1px), #f2f2f2 70%, #333 calc(70% + 1px));
    transform: rotate(-20deg);
  }

  /* ホワイトボードここまで */
  .profile-title {
    margin: 20px;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #333;
    letter-spacing: 0.1em;
  }
  .profile-name {
    font-size: 16px;
    letter-spacing: 0.1em;
    font-weight: 600;
    margin-left: 20px;
    margin-top: 10px;
  }
  .profile-intro {
    height: auto;
    padding: 20px 40px 20px;
    margin: 0;
  }
  .profile-intro li {
    list-style-type: disc;
    font-size: 16px;
    margin-bottom: 10px;
    letter-spacing: 0.1em;
    line-height: 2;
  }
  
  .message-container {
    margin: 0 auto;
    background-color: #f8efcc;
    background-repeat: repeat-x;
    position: relative;
    width: 90%;
    margin-top: 80px;
    margin-bottom: 80px;
    padding-bottom: 80px;
  }

  .pen_image{
    position: absolute;
    top: 6vw;
    right: 15vw;
  }

  .pen_image img{
    width: 40px;
  }


  .message-text {
    width: 85%;
    margin: 0 auto;
    font-family: "dnp-shuei-mgothic-std", sans-serif;
    text-align: left;
    font-size: 1.3vw;
    line-height: 2;
    letter-spacing: 0.1em;
    font-weight: 500;
    padding-top: 8%;
  }
  .note-content img {
    width: 100%;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
  }
  .message-text p {
    margin: 0;
    font-size: 16px;
    text-decoration: underline;
    text-decoration-style: dashed;
    text-underline-offset: 5px;
  }

  .message-text span {
    font-weight: 600;
  }
  .space {
    padding-bottom: 30px;
  }
  .message-signature {
    display: flex;
    justify-content: flex-end; /* 右寄せにする */
    align-items: center;
    position: absolute;
    bottom: 3%;
    right: 5%;
    padding-top: 40px;
  }
  .signature-img {
    width: 100%; /* サイン画像の幅を設定 */
    height: auto;
    margin-right: 20px; /* ハンコとの間に余白を追加 */
  }
  .signature-img img {
    width: 18vw; /* サイン画像の幅を設定 */
    height: auto;
    margin-right: 20px; /* ハンコとの間に余白を追加 */
  }
  .hanko-img {
    width: 100%; /* ハンコ画像の幅を設定 */
    height: auto;
  }
  .hanko-img img {
    width: 7vw; /* ハンコ画像の幅を設定 */
    height: auto;
  }
}



@media (max-width: 500px) {
  .profile-photo img{
    width: 37vw;
    height: 37vw;
  }

  .message-container{
    margin-top: 60px;
  }

  .pen_image{
    position: absolute;
    top: 9vw;
    right: 10vw;
  }

  .pen_image img{
    width: 30px;
  }


  #consultant_profile h2{
    margin: 0;
  }
  .signature-img img{
    width: 28vw;
  }

  .hanko-img img{
    width: 9vw;
  }
}


#free-consult-banner {
  background-color: #E0FAFF; /* 淡い青色の背景 */
  padding: 60px 0;
  text-align: center;
}

.banner-title {
  font-size: 30px;
  font-weight: bold;
  color: #333;
  margin-bottom: 60px;
  letter-spacing: 0.1em;
}

.banner-title .highlight {
  color: #AA4E4E;
}

.banner-content {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 20px;
}

.circle-info {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 20px;
}

.circle {
  background-color: #345888;
  border-radius: 50%;
  width: 18vw;
  height: 18vw;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: white;
  font-weight: bold;
}

.circle-text-upper {
  padding-top: 40px;
  font-size: 24px;
  line-height: 1.2;
}

.circle-text-lower {
  padding-bottom: 40px;
  font-size: 16px;
  line-height: 1.2;
}

.circle span {
  display: inline;
  font-size: 7vw;
}

.banner-image {
  flex: 1;
  margin: 0 20px;
  text-align: left;
}

.banner-image img {
  width: 10vw;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

.banner-description {
  flex-basis: 100%;
  margin-top: 40px;
}

.banner-description p {
  font-size: 18px;
  margin: 0;
  padding: 0 20px;
  line-height: 1.8;
}

@media (max-width: 768px) {
  #free-consult-banner {
    background-color: #E0FAFF; /* 淡い青色の背景 */
    padding: 60px 0;
    text-align: center;
  }
  .banner-title {
    font-size: 20px;
    font-weight: bold;
    color: #333;
    margin-bottom: 60px;
    letter-spacing: 0.1em;
  }
  .banner-title .highlight {
    color: #AA4E4E;
  }
  .banner-content {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 20px;
  }
  .circle-info {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 20px;
  }
  .circle {
    background-color: #345888;
    border-radius: 50%;
    width: 36vw;
    height: 36vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    font-weight: bold;
  }
  .circle-text-upper {
    padding-top: 60px;
    font-size: 16px;
    line-height: 1.2;
  }
  .circle-text-lower {
    padding-bottom: 40px;
    font-size: 16px;
    line-height: 1.0;
  }
  .circle span {
    display: inline;
    font-size: 50px;
  }
  .banner-image {
    flex: 1;
    margin: 0 20px;
    text-align: left;
  }
  .banner-image img {
    width: 15vw;
    height: auto;
    -o-object-fit: contain;
       object-fit: contain;
  }
  .banner-description {
    flex-basis: 100%;
    margin-top: 40px;
  }
  .banner-description p {
    font-size: 16px;
    margin: 0;
    padding: 0 20px;
    line-height: 1.8;
  }
}



#contact-form-section {
  margin-top: 80px;
}

.privacy-policy {
  width: 80%;
  max-width: 800px;
  height: 350px;
  padding: 2em !important;
  border: 2px solid #111;
  overflow-y: scroll;
  text-align: left;
  margin: 0 auto;
}

.privacy-policy__box {
  padding-bottom: 20px !important;
}

/* フッター全体のスタイル */
#information-footer {
  background-color: #E0FAFF;
  padding: 40px 20px 0px;
  color: #333;
  height: auto;
}

/* フッターのコンテナ */
.footer-container {
  display: flex;
  justify-content: space-between;
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap; /* スマホで折り返し */
  padding: 40px 0;
}

.footer-section {
  flex: 1;
  padding: 20px;
  min-width: 250px; /* スマホでも適切な最小幅を確保 */
}

.footer-title {
  font-size: 1.2rem;
  font-weight: bold;
  margin-bottom: 20px;
}

.footer-section p {
  margin: 20px 0;
  font-size: 1rem;
}

.service-region {
  margin-top: 40px;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
  #footer {
    background-color: #E0FAFF;
    color: #333;
  }
  .footer-container {
    padding-bottom: 60px;
  }
  .footer-section {
    text-align: center;
    padding: 10px;
  }

}

@media (min-width: 769px) {
  #footer {
    background-color: #153C71;
    padding: 30px 0;
  }
  .footer_inner {
    max-width: 1200px;
    margin: 0 auto;
  }
  .footer_nav {
    background-color: transparent;
    padding: 20px 0;
    display: flex;
    justify-content: center;
  }
  .footer_nav_list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 40px;
  }
  .footer_nav_item a {
    color: #FFFFFF;
    text-decoration: none;
    font-size: 14px;
    letter-spacing: 0.1em;
    transition: opacity 0.3s ease;
  }
  .footer_nav_item a:hover {
    opacity: 0.8;
  }
  .copyright {
    background: transparent;
    text-align: center;
    margin-top: 10px;
    padding: 0;
    height: auto;
  }
  .copyright p {
    color: #FFFFFF;
    margin: 0;
    font-size: 14px;
    letter-spacing: 0.1em;
  }
  /* TOPページのみyohakuを表示 */
  body.home .yohaku {
    background-color: #fff;
    height: 130px;
  }
  /* それ以外のページはyohakuを非表示 */
  body:not(.home) .yohaku {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: hidden !important;
    overflow: hidden !important;
  }
}
@media (max-width: 768px) {
  #footer {
    background-color: #153C71;
    padding: 15px 0;
  }
  .footer_nav {
    background-color: transparent;
    padding: 15px 0;
    display: flex;
    justify-content: center;
  }
  .footer_nav_list {
    list-style: none;
    margin: 0;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }
  .footer_nav_item a {
    color: #FFFFFF;
    text-decoration: none;
    font-size: 16px;
    letter-spacing: 0.1em;
    transition: opacity 0.3s ease;
  }
  .footer_nav_item a:hover {
    opacity: 0.8;
  }
  .copyright {
    background: transparent;
    text-align: center;
    height: 200px;
    width: 100%;
  }
  .copyright p {
    color: #FFFFFF;
    margin: 0 auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    padding-top: 40px;
    line-height: 1.8;
    width: 80%;
  }
  .yohaku {
    display: none;
  }
}/*# sourceMappingURL=style.css.map */


/* thanks.htmlのcss */


/* Google レビュー セクション */
.reviews-section {
  padding: 80px 0;
}

.reviews-header {
  text-align: center;
  margin: 60px auto 80px;
}

/* リード文 */
.reviews-lead {
  font-size: 16px;
  line-height: 1.8;
  margin: 0 0 36px;
}

@media (max-width: 768px) {
    .reviews-lead {
    font-size: 16px;
    line-height: 1.8;
    margin: 0 0 36px;
    text-align: left;
  }
}

/* ★5.0 と注意書きをまとめたボックス */
.reviews-summary {
  display: inline-block;
  padding: 30px 32px;
  border-radius: 12px;
  border: 1px solid #c7e0f5;
  background-color: #ffffff;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.04);
}

.reviews-summary-score {
  margin: 0;
  font-size: 36px;       /* 見出しよりは小さく、十分目立つサイズ */
  font-weight: 700;
  color: #FABB04;
}

.reviews-summary-score span {
  font-size: 18px;
  font-weight: 500;
}

.reviews-summary-note {
  margin: 10px 0 0;
  font-size: 12px;       /* 小さめ */
  color: #666666;
}

/* 口コミカードのグリッドレイアウト：2列で大きめに */
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  margin-bottom: 40px;
}

/* テキスト用の口コミカード */
.review-card {
  background-color: #ffffff;
  border-radius: 18px;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.08);
  padding: 20px 24px;
}

/* 上部：名前＋評価エリア */
.review-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
}

.reviewer-name {
  font-size: 16px;
  font-weight: 700;
}

/* ★評価 */
.review-rating {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: #f4b400; /* 星らしい黄色 */
}

.review-stars {
  letter-spacing: 2px;
}

.review-score {
  margin-left: 8px;
  font-size: 14px;
  color: #333333;
}

/* 日付 */
.review-date {
  margin: 0 0 8px;
  font-size: 13px;
  color: #777777;
}

/* 本文：文字を大きく＆行間広めに */
.review-body {
  font-size: 18px;
  line-height: 1.9;
  color: #333333;
}


/* ボタンをやや大きめに */
.reviews-button-area {
  text-align: center;
}

.btn-google-review {
  display: inline-block;
  padding: 18px 40px;      /* 高さ・横幅ともに拡大 */
  border-radius: 999px;
  font-size: 17px;         /* 少し大きめ */
  font-weight: 600;
  text-decoration: none;
  background-color: #4285f4;  /* Google系ブルー */
  color: #ffffff;
  box-shadow: 0 8px 22px rgba(66, 133, 244, 0.45);
  transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.btn-google-review:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(66, 133, 244, 0.5);
  opacity: 0.96;
}

@media (max-width: 640px) {
  .reviews-section {
    padding: 56px 0;
  }

  .reviews-grid {
    grid-template-columns: 1fr;
  }

  .review-card {
    padding: 18px;
  }

  .reviews-summary {
    padding: 12px 20px;
  }

  .reviews-summary-score {
    font-size: 20px;
  }

  .reviews-summary-score span {
    font-size: 16px;
  }
}

/* --- LP mobile fixes: profile centering and page-top visibility --- */
@media (max-width: 767px) {
  /* 強制的にプロフィール写真を中央に配置 */
  #consultant_profile .profile-photo {
    justify-content: center !important;
  }
  #consultant_profile .profile-photo img {
    margin: 0 auto;
    display: block;
  }
  /* トップへ戻るボタンを他の固定要素より前面に表示 */
  #page_top {
    z-index: 9999 !important;
    display: block !important;
  }
}

/* 追加: モバイルで #page_top が他要素に隠れないように強制表示と位置調整 */
@media (max-width: 768px) {
  #page_top {
    position: fixed !important;
    display: block !important;
    right: 22px !important;
    bottom: 84px !important; /* モバイルの CTA（下部固定）より上に表示 */
    z-index: 10050 !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  #page_top img {
    width: 46px !important;
    height: auto !important;
    display: block;
  }
  #page_top .return_text {
    display: block !important;
    font-size: 12px !important;
    color: #184177 !important;
    text-align: center !important;
    margin-top: 6px !important;
  }
}


@media (min-width: 500px) and (max-width: 768px){
  #page_top {
    position: fixed !important;
    display: block !important;
    right: 22px !important;
    bottom: 100px !important; /* モバイルの CTA（下部固定）より上に表示 */
    z-index: 10050 !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}


/* ========================================
   Slick Slider ドット（インジケーター）のスタイル
   ======================================== */

/* ドットの外側コンテナ */
.slick-dots {
  position: absolute;
  bottom: -5px;
  display: block;
  width: 100%;
  margin-top: 20px;
  margin: 0;
  list-style: none;
  text-align: center;
}

.slick-dots li {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}

.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 20px;
  height: 20px;
  padding: 5px;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: none;
  background: transparent;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}

.slick-dots li button:before {
  font-size: 12px;
  line-height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  content: '●';
  text-align: center;
  opacity: 0.25;
  color: #1F84A6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-dots li.slick-active button:before {
  opacity: 0.75;
  color: #1F84A6;
}

/* レスポンシブ対応：スマホでのドット表示調整 */
@media (max-width: 768px) {
  .slick-dots {
    height: 32px;
  }
  
  .slick-dots li {
    width: 16px;
    height: 16px;
    margin: 0 4px;
  }
  
  .slick-dots li button {
    width: 16px;
    height: 16px;
  }
  
  .slick-dots li button:before {
    font-size: 10px;
    line-height: 16px;
    width: 16px;
    height: 16px;
  }

  .container .contact-title{
    margin-top: 60px;
  }
}