/* ==========================================================
   FV（ファーストビュー）
   ※ 管理画面「追加CSS」から移設（2026-09-28）
   ========================================================== */
/* ===== FVポイント全体 ===== */
.HeroArea__lead{
  display:block;
  margin-top:-35rem;
	text-shadow: 0 0 23px rgba(13, 74, 74, 0.70);
font-family: "Shippori Mincho B1" !important;
}

/* ===== ポイント並び：重ねる ===== */
.fv-points {
  display: flex;
  align-items: center;
  gap: 0;            /* gapは0にして */
  padding: 0;
  margin: 35px 0 0;  /* コピーと丸の間隔 */
  list-style: none;
}
.fv-point:first-child .fv-point__em{
  letter-spacing: 0.2px !important; /* 0〜0.4で調整 */
}

/* 隣の丸を少し食い込ませる（重なり量） */
.fv-point + .fv-point{
  margin-left: -22px; /* ←重なり量（-16〜-30あたりで調整） */
}
.fv-point__line {
  line-height: 1.35 !important; 
  margin: 0;           /* 念のため */
}
.HeroArea__txt__head>span:first-child {
    margin-bottom: .5em;
}

/* ===== 共通丸デザイン ===== */
.fv-point {
  position: relative; /* z-index/影のため */
  z-index: 1;

  display: flex;
  width: 178px;
  height: 178px;

  padding: 22px 16px 14px; /* ←上にアイコン分のスペース確保 */
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 999px;
  background: rgba(93, 169, 169, 0.60);
  backdrop-filter: blur(5.5px);
  -webkit-backdrop-filter: blur(5.5px);

  border: 1px solid rgba(255,255,255,0.55); 
  box-sizing: border-box;

  color: #FFF;
  text-align: center;
  font-family: "Tsukushi A Round Gothic", "筑紫A丸ゴシック", sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 150%;
  letter-spacing: 1.02px;
}

/* アイコン（png） */
.fv-point__icon{
  height: auto;
  margin-bottom: 6px;
  display: block;
}
.fv-point img.fv-point__icon{
  width: 35px !important;
  height: 35px !important;
  max-width: none !important;
  display: block;
  margin: 0 auto 6px;
  object-fit: contain;
}
.fv-point:nth-child(3){
  position: relative;
  z-index: 5;
}
/* 3つ目の傘アイコンだけ上に上げる */
.fv-point:nth-child(3) img.fv-point__icon{
	transform: translateY(-9px);
margin-bottom: -2px;
}

/* ===== 真ん中（強調） ===== */
.fv-point--center {
  z-index: 3; /* 重なり時に中央を最前面へ */
  background: rgba(255, 255, 255, 0.40);
  color: #646E6E;

  font-size: 20px;
  letter-spacing: 1.2px;

  border: 1px solid rgba(255, 255, 255, 1);
  box-shadow: 0 16px 36px rgba(0,0,0,.18);

  transform: translateY(-6px);
}

.fv-point__em{
  display:inline-block;
  font-size: 22px;
  font-weight: 700;
  line-height: 150%;
  letter-spacing: 1.2px;
}

/* 中央（白背景）の強調文字だけ色変更 */
.fv-point--center .fv-point__em{
  color:#646E6E;
}
	.HeroArea__txt__head{
					margin-left: 1rem;
		margin-bottom: 0rem !important;
	}
.HeroArea__txt__head .fv-point .fv-point__line{
  display: inline !important;
}

@media (max-width: 896px) {
  /* SPで「文字が上へ移動」させる */
  .HeroArea__lead{
   margin-top: -50rem;
   font-size: 3.46rem;
    
  } 
	.HeroArea__txt__head{
					margin-left: 3rem;
		margin-bottom: 6rem;
	}

	.HeroArea__txt{
		bottom: -48%;
	}
		  .HeroBnr__Slider--pc 
.HeroArea__txt__head span {
    font-size: inherit !important;
  }
}
/* ===== SP ===== */
@media (max-width: 768px) {
  /* SPで「文字が上へ移動」させる */
  .HeroArea__lead{
    margin-top: -20rem;
  }
	 .HeroArea__lead{
   font-size: 3rem;
	}
	.HeroArea__txt{
		bottom: -37%;
	}

  .fv-point{
    width: 135px;
    height: 135px;
    font-size: 15px;
		gap: 3.2px;
    padding: 1px 10px 7px;
  }
	  .fv-points{
margin: 16px -1rem;
	}
  .fv-point--center{
    font-size: 12px;
    transform: translateY(-4px);
  }

  .fv-point__icon{
    width: 30px;
    margin-bottom: 5px;
  }

  /* 重なり量も少し弱めると崩れにくい */
  .fv-point + .fv-point{
    margin-left: -18px;
  }
		.HeroArea__txt__head{
					margin-left: 0rem;
		margin-bottom: 0rem;
	}
	.fv-point__em{
  font-size:19px !important;
	letter-spacing: 0.6px;
}
	.fv-point img.fv-point__icon {
    margin: 0 auto 1px;
}


}

/* ===== SP：コピー（.hero-copy はSP用マークアップのみで使用） ===== */
@media (max-width: 768px) {
/* コピー全体 */
.hero-copy{
  text-align: center;
  color:#fff;
  font-family: "Shippori Mincho B1", serif;
  text-shadow: 0 0 23px rgba(13, 74, 74, 0.70);
  letter-spacing: .08em;
  line-height: 1.55;
  margin: 0;              /* 余計なズレ防止 */
}

/* 行の基本サイズ */
.hero-copy__small{
  font-size: 20px;
  font-weight: 600;
  display: inline-block;
  white-space: nowrap;    /* ←ここが重要：意図しない折返しを防ぐ */
}

/* 強調（根本原因など） */
.hero-copy__big{
  font-size: 30px;
  font-weight: 600;
  display: inline-block;
  white-space: nowrap;    /* ←強調語も折返しさせない */
  letter-spacing: .10em;
}
/* 1行目を固定で1段目にする */
.fv-point__line--top{
  display:block;
  margin-bottom: 2px;
}

/* 2行目は「専門家 在籍」を同じ行で保持 */
.fv-point__lineGroup{
  display:inline-flex !important;
  align-items: baseline;   /* 文字サイズ違いでも揃う */
  gap: 4px;                /* 「専門家」と「在籍」の間 */
  white-space: nowrap;     /* ここが肝：2行目を割らない */
}

/* lineはブロック解除（縦積みをやめる） */
.fv-point__line{
  display:inline;
}


.br-sp{ display:none; }
 .hero-copy{
  text-align: center;
  color: #fff;
  font-family: "Shippori Mincho B1", serif;
  text-shadow: 0 0 23px rgba(13, 74, 74, 0.70);
  line-height: 1.55;
  letter-spacing: .08em;
  margin: 0;
}
	.HeroBnr{
    height: auto !important;
    min-height: 0 !important;
		margin-bottom: 4rem;
  }

/* 通常サイズ */
.hero-copy__small{
  font-size: clamp(18px, 5vw, 22px);
  font-weight: 600;
  display: block;
}

.hero-copy__big{
  font-size: clamp(28px, 7.5vw, 36px);
  font-weight: 600;
  display: block;
  line-height: 1.45;
  letter-spacing: .10em;
	}
  .hero-copy{
    line-height: 1.6;
  }
	.fv-point__line {
    line-height: 1.1 !important;
		font-size:16px;
}
}

/* ===== SP：FVを画面の左右中央に配置 ===== */
@media (max-width: 768px) {
  /* 中身の幅で広がって画面右にはみ出さないよう、スライド幅に固定 */
  .HeroBnr__cont{
    left: 0;
    right: 0;
  }
  .fv-points{
    justify-content: center;
  }
  /* 長いコピー（例：どんな世代も通いやすい）が枠に収まるよう左右10pxずつ広げる */
  .hero-copy{
    margin-left: -10px;
    margin-right: -10px;
  }
}

/* ===== SP：ヘッダー被り・Drの顔被りの調整 ===== */
/* ヘッダー（position:fixed・高さ60px）の分、480px以下は main.css の body{padding-top:60px} で下がっている。
   481〜768px はその指定がなくスライド上部がヘッダーの裏に隠れるため、ここで同じ分だけ下げる */
@media (min-width: 481px) and (max-width: 768px) {
  .HeroBnr{
    margin-top: 60px;
  }
}
/* コピー・丸は元の位置（丸がDrの目元より上）を基本に、文字が大きくなる広めの画面だけ少し下げてヘッダー被りを防ぐ */
@media (max-width: 768px) {
  .HeroBnr__Slider--sp .HeroBnr__cont{
    bottom: calc(100px - clamp(0px, calc((100vw - 390px) * 0.6), 24px));
  }
}

/* ===== SP（388px以下）：丸3つが画面に収まるよう全体を比率で縮小 ===== */
/* 丸の幅 = (画面幅 - 20px) × 15/41 … 389px以上では従来どおり135px */
@media (max-width: 388px) {
  .fv-points{
    --fv-w: calc((100vw - 20px) * 15 / 41);
  }
  .fv-point{
    width: var(--fv-w);
    height: var(--fv-w);
    font-size: calc(var(--fv-w) * 15 / 135);
    padding: calc(var(--fv-w) * 1 / 135) calc(var(--fv-w) * 10 / 135) calc(var(--fv-w) * 7 / 135);
  }
  .fv-point + .fv-point{
    margin-left: calc(var(--fv-w) * -18 / 135);
  }
  .fv-point__line{
    font-size: calc(var(--fv-w) * 16 / 135);
  }
  .fv-point__em{
    font-size: calc(var(--fv-w) * 19 / 135) !important;
  }
  .fv-point img.fv-point__icon{
    width: calc(var(--fv-w) * 35 / 135) !important;
    height: calc(var(--fv-w) * 35 / 135) !important;
  }
  /* 大きいコピーは11文字（12.1em）が画面幅に収まるサイズまでに抑える */
  .hero-copy__big{
    font-size: min(clamp(28px, 7.5vw, 36px), calc((100vw - 20px) / 12.1));
  }
}