/**
 * File: shop-symptoms.css
 * Usage: 当院で対応している症状セクション共通スタイル
 * 使用ページ: front-page, page-first, single-shop
 * ※ single-shop.css から抽出
 */

/* ========================================
   当院で対応している症状 (.ly_shopSymptoms)
   ※ CSS変数は base.css で一元管理
   ======================================== */
.ly_shopSymptoms {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #334B63;
  padding: 50px 0;
}

.bl_shopSymptoms_inner {
  max-width: var(--max-width-content);
  margin-inline: auto;
  padding-inline: var(--section-padding-inline);
  width: 100%;
}
.ly_shopSymptoms .bl_scroll_text {
  opacity: 0.05;
  font-size: 160px;
  margin-top: -110px;
}
.bl_symptomsIntro__shop {
  margin-bottom: 24px;
}

.bl_shopSymptoms_subttl {
  margin-bottom: 40px;
  font-weight: 700;
  color: #fff;
  text-align: center;
}

.bl_shopSymptoms_subttl span{
  background: #1A3550;
  border-radius: 60px;
  padding: 8px 30px;
}

.bl_symptomsSlider__shop {
  margin-bottom: 48px;
}

.bl_symptomsCatList__shop .bl_symptomsCatList_note {
  color: #fff;
}

/* ----------------------------------------
   タブレット (768px以上)
   ---------------------------------------- */
@media screen and (min-width: 768px) {
  .ly_shopSymptoms{
    padding: 120px 0;
  }

  .bl_symptomsIntro__shop {
    margin-bottom: 32px;
  }

  .bl_shopSymptoms_subttl {
    gap: var(--space-sm);
    margin-bottom: 32px;
    font-size: var(--font-xl);
  }

  .bl_shopSymptoms_subttl_icon {
    width: 28px;
  }

  .bl_symptomsSlider__shop {
    margin-bottom: 64px;
  }
}

/* ----------------------------------------
   PC (1024px以上)
   ---------------------------------------- */
@media screen and (min-width: 1024px) {
  .bl_symptomsIntro__shop {
    margin-bottom: 40px;
  }

  .bl_shopSymptoms_subttl {
    margin-bottom: 40px;
  font-size: 20px;
  }
}