/*----------------------------------------変数----------------------------------------*/
:root {
  --theme-color: #6EAD1A;
  --theme-color-light: #A8D84A;
  --theme-color-deep: #4D7A0F;
  --hover-color: var(--theme-color-light);

  --a-color: var(--theme-color);
  --a-color-hover: var(--theme-color-light);
  --a-color-active: var(--theme-color-deep);
  --a-color-visited: var(--theme-color-deep);
  --a-color-focus: var(--theme-color-light);

  --font-color: #333;
  --font-size: 1.6rem;
  --inner: 1280px;

  --btn-color: #fff;
  --btn-bg: var(--theme-color);

  --side-padding: 0;
  --section-margin: 10rem;
  --content-margin: 3em;
  --text-margin: 2em;

  /* 青スケールは deep(#8094DD) 基準。light/mid は旧パレットと同じ明度差、title は旧比で一段暗い文字色 */
  --medix-blue-light: #C7D6F0;
  --medix-blue-mid: #9CB3E4;
  --medix-blue-deep: #8094DD;
  --medix-on-blue: #fff;
  --medix-title-en: #3453C3;
  --medix-solution-bar-1: linear-gradient(90deg, #FF6B7F 0%, #FFB347 100%);
  --medix-solution-bar-2: linear-gradient(90deg, #FFB347 0%, #FFE566 100%);
  --medix-solution-bar-3: linear-gradient(90deg, #5BC0EB 0%, #7ED957 100%);
  --medix-solution-bar-4: linear-gradient(90deg, #4A90D9 0%, #5BC0EB 100%);
  --medix-footer-bg: #ebebeb;
  --medix-footer-accent: #E86162;
  --medix-footer-link: #8094dd;
  --medix-footer-muted: #888;

  /* カード系シャドウ（常時・画面内は黒／ホバーのみ青） */
  --medix-card-shadow: 0 3px 12px rgba(0, 0, 0, 0.06);
  --medix-card-shadow-inview: 0 5px 16px rgba(0, 0, 0, 0.1);
  --medix-card-shadow-hover: 0 10px 28px rgba(128, 148, 221, 0.28);

  /* 固定ヘッダー下余白用（JS が実測で上書き。未設定だと calc が無効になりパンくずが後ずれする） */
  --header-height: 125px;
}

@media screen and (max-width: 1280px) {
  :root {
    --side-padding: 3%;
  }
}

@media screen and (max-width: 768px) {
  :root {
    --font-size: 1.4rem;
    --section-margin: 5rem;
    --side-padding: 5%;
    --header-height: 115px;
  }
}