/* base.css */

@charset "UTF-8";

/* ===============================
   リセット & ボックスモデル
=============================== */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* ===============================
   HTML & Body基本設定
=============================== */
html {
  font-size: 62.5%; /* → 1rem = 10px（16px × 0.625） */
  line-height: 1.6;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  font-size: 1.6rem; /* = 16px相当 */
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", sans-serif;
  color: #000;
  background-color: #fff;
}

/* ===============================
   要素デフォルト調整
=============================== */
a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

ul, ol {
  list-style: none;
}

button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  outline: none;
}

/* ===============================
   タイポグラフィ
=============================== */
h1, h2, h3, h4, h5, h6 {
  font-weight: bold;
  line-height: 1.4;
}

/* 共通ベース：読みやすさ重視 */
body {
  font-family: 'Noto Sans JP', sans-serif;
}

/* 丸ゴ → 優しい印象に */
.zenmaru {
  font-family: 'Zen Maru Gothic', sans-serif;
}
.kosugi {
  font-family: 'Kosugi Maru', sans-serif;
}


/* 明朝 → 和風・おしゃれ系に */
.serif {
      font-family: source-han-serif-japanese, 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.montserrat {
  font-family: 'Montserrat', sans-serif;
}
.heebo{
font-family: 'Heebo', sans-serif;
}



:root {
  --fs-1:  clamp(0.75rem, 0.75rem + 0.2vw, 0.875rem);
  --fs-2:  clamp(0.875rem, 0.875rem + 0.25vw, 1rem);
  --fs-3:  clamp(1rem, 1rem + 0.3vw, 1.125rem);
  --fs-4:  clamp(1.125rem, 1.125rem + 0.35vw, 1.25rem);
  --fs-5:  clamp(1.25rem, 1.25rem + 0.4vw, 1.375rem);
  --fs-6:  clamp(1.375rem, 1.375rem + 0.45vw, 1.5rem);
  --fs-7:  clamp(1.5rem, 1.5rem + 0.5vw, 1.625rem);
  --fs-8:  clamp(1.625rem, 1.625rem + 0.55vw, 1.75rem);
  --fs-9:  clamp(1.75rem, 1.75rem + 0.6vw, 1.875rem);
  --fs-10: clamp(1.875rem, 1.875rem + 0.65vw, 2rem);
  --fs-11: clamp(2rem, 2rem + 0.7vw, 2.125rem);
  --fs-12: clamp(2.125rem, 2.125rem + 0.75vw, 2.25rem);
  --fs-13: clamp(2.25rem, 2.25rem + 0.8vw, 2.375rem);
  --fs-14: clamp(2.375rem, 2.375rem + 0.85vw, 2.5rem);
  --fs-15: clamp(2.5rem, 2.5rem + 0.9vw, 2.625rem);
  --fs-16: clamp(2.625rem, 2.625rem + 0.95vw, 2.75rem);
  --fs-17: clamp(2.75rem, 2.75rem + 1vw, 2.875rem);
  --fs-18: clamp(2.875rem, 2.875rem + 1.05vw, 3rem);
  --fs-19: clamp(3rem, 3rem + 1.1vw, 3.125rem);
  --fs-20: clamp(3.125rem, 3.125rem + 1.15vw, 3.25rem);
  --fs-21: clamp(3.25rem, 3.25rem + 1.2vw, 3.375rem);
  --fs-22: clamp(3.375rem, 3.375rem + 1.25vw, 3.5rem);
  --fs-23: clamp(3.5rem, 3.5rem + 1.3vw, 3.625rem);
  --fs-24: clamp(3.625rem, 3.625rem + 1.35vw, 3.75rem);
  --fs-25: clamp(3.75rem, 3.75rem + 1.4vw, 3.875rem);
  --fs-26: clamp(3.875rem, 3.875rem + 1.45vw, 4rem);
  --fs-27: clamp(4rem, 4rem + 1.5vw, 4.125rem);
  --fs-28: clamp(4.125rem, 4.125rem + 1.55vw, 4.25rem);
  --fs-29: clamp(4.25rem, 4.25rem + 1.6vw, 4.375rem);
  --fs-30: clamp(4.375rem, 4.375rem + 1.65vw, 4.5rem);
}



/* ===============================
   メディアクエリによる文字サイズ縮小
=============================== */
@media screen and (max-width: 1024px) {
  html {
    font-size: 56.25%; /* → 1rem = 9px（タブレット） */
  }
}

@media screen and (max-width: 600px) {
  html {
    font-size: 56.25%; /* → 1rem = 9px にしてタブレットと揃える */
  }
}

.delay-time01 { animation-delay: 0.2s; }
.delay-time02 { animation-delay: 0.4s; }
.delay-time03 { animation-delay: 0.6s; }
.delay-time04 { animation-delay: 0.8s; }
.delay-time05 { animation-delay: 1.0s; }