/* ============================================
   皮膚科ページ 専用CSS（.subject-lp--derm）
   --------------------------------------------
   subject.css（共通base）の「後」に header.php が自動読込。
   対象URL：/subjects/derm/（SEO版）および /subjects/lp/derm/（広告LP・作成時）
   ※ このファイルは assets/css/subjects/ 配下のため、画像参照は ../../img/... 基準
     （base の subject.css は assets/css/ 直下なので ../img/... 基準。1階層ぶん深い点に注意）

   方針：
   - 共通の見た目は subject.css（触らない）。皮膚科だけの微調整をここに書く。
   - すべて .subject-lp--derm 配下に書く（他科目に影響させない）。
   - まずは「耳鼻科ベースのまま」で表示確認 → 崩れた箇所だけ下の雛形を有効化して調整。
   ============================================ */


/* ============================================
   ★ FV（ファーストビュー）
   ============================================ */

/* --------------------------------------------
   メインキャッチの文字数調整
   - 科目名やコピーの文字数が耳鼻科と変わると、改行位置・サイズが崩れることがある。
   - 必要になったらコメントを外して微調整。
   -------------------------------------------- */
/*
.subject-lp--derm .fv-title {
  font-size: 00px;
}
.subject-lp--derm .fv-pc-title {
  font-size: 00px;
}
*/

/* --------------------------------------------
   FVの女性画像（差し替え時の位置・サイズ調整）
   - 画像を差し替えると縦横比・立ち位置が変わって崩れやすい。SP/PC両方で確認。
   - 下記は耳鼻科と同じ初期値。皮膚科の fv_woman.webp に合わせて表示確認後に微調整。
   -------------------------------------------- */
/* SP（〜767px） */

.subject-lp--derm .fv-fg-woman {
  left: -10%;
  bottom: -10%;}

/* PC（768px〜） */
.subject-lp--derm .fv-pc-fg-woman {
    left: 0;
    bottom: -86px;
    width: 300px;
}

@media (min-width: 768px) {
  .subject-lp--derm .fv-pc-fg-woman {
    left: 10px;
    bottom: -75px;
  }
}

/* --------------------------------------------
   症状サークル：2番目の丸（アトピー）のテキストだけ 14px
   - SP用（.fv-symptom-label）／ PC用（.fv-pc-symptom-label）の両方を対象
   - :nth-child(2) で3つのうち2番目の丸だけに限定
   -------------------------------------------- */
.subject-lp--derm .fv-symptoms .fv-symptom:nth-child(3) .fv-symptom-label {
  font-size: 14px;
}
@media (min-width: 480px) {
    .subject-lp--derm .fv-pc-symptoms .fv-pc-symptom:nth-child(3) .fv-pc-symptom-label {
        font-size: 16px;
        letter-spacing: 0.72px;
    }
}

/* ============================================
   ★ その他セクションの微調整
   - 必要になったら .subject-lp--derm 配下に追記していく。
   ============================================ */