/* TOP page（index.html）: .centerスライダー内・全10スライド共通の
   写真キャプション表示ルール（英語表記削除・白フェード・文字サイズ統一）、
   YouTubeセクション背景写真。既存の.center/.slick-slide/.captionカスケードとは
   独立して動作するよう、位置・サイズ関連プロパティはこのファイル内で
   完結させている（他ページには影響しない）。Blogボタンはbusiness/patient.html
   に既存のものを使用するため、TOP page側には追加しない。
   2026-09-09: 全スライド統一に伴い、font-sizeを1.5remへ一本化し、
   ブレークポイント別のfont-size上書き（旧: 1.6rem/1.25rem/1.05rem）と
   「売店・コンビニ」専用--fixed15モディファイアを整理・撤去した。
   なお、font-sizeには!importantが必要：responsive-mobile.css（本ファイルより
   後に読み込まれる）に900px以下向けの`.slick-slide .caption{font-size:0.7rem}`
   という既存ルールがあり、本ファイルの`.slick-slide .p-top__photo-fade-caption`
   と詳細度が同点（クラス2つ）のため、!importantなしだと後読みの
   responsive-mobile.css側が勝ってしまう（実機検証で確認済み）。 */

.p-top__photo-fade {
  position: relative;
  display: block;
  overflow: hidden;
}

.p-top__photo-fade-overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 58%;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.75) 55%,
    #fff 100%
  );
  pointer-events: none;
  z-index: 1;
}

.p-top__photo-fade-caption,
.slick-slide .p-top__photo-fade-caption,
.slick-current .p-top__photo-fade-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 4%;
  width: 100%;
  margin: 0;
  text-align: center;
  color: #432;
  font-size: 1.5rem !important;
  font-weight: 700;
  line-height: 1.3;
  z-index: 2;
}

/* ---------- YouTubeセクション ----------
   2026-09-09: 背景写真・白オーバーレイを削除し通常の白背景に変更。
   背景写真の見栄えのために確保していた上下paddingも、写真前提でなくなった
   ことに伴いコンパクトな値へ縮小した（.p-top__youtube-topindex・iframe・
   リンク・アイコン自体のサイズ/内容は無変更）。 */
.p-top__youtube-photo-bg {
  padding: 1.5rem 1rem;
}
.p-top__youtube-photo-bg h2 {
  text-align: center;
  margin: 0 0 1rem;
}

@media screen and (max-width: 480px) {
  .p-top__photo-fade-overlay {
    height: 50%;
  }
}