:root {
  --c-teal:        #17BFBD;
  --c-teal-dark:   #12A09E;
  --c-teal-light:  #8FD8D8;
  --c-navy:        #1C4660;
  --c-accent:      #D9EE52;
  --c-cream:       #F5F0E8;
  --c-bg-light:    #F1F8FA;
  --c-bg-cyan:     #D9F0F5;
  --c-yellow:      #F5C842;
  --c-orange:      #F5842A;
  --c-red:         #E8445A;
  --c-border:      #CCCCCC;
  --c-text:        #1C4660;
  --c-text-sub:    #666666;
  --c-white:       #FFFFFF;

  --f-en:  'Raleway', serif;
  --f-ja:  'Noto Sans JP', sans-serif;
  --f-deco: 'Oooh Baby', 'Caveat', cursive;
  --f-num:  'Gaegu', 'Caveat', cursive;  /* PilGi fallback */
  --f-script: 'Caveat', cursive;

  --fs-h1:   38px;  --fs-h2:   36px;  --fs-h3:   28px;
  --fs-h4-l: 22px;  --fs-h4-s: 18px;
  --fs-h5:   16px;  --fs-h6:   14px;
  --fs-body: 15px;  --fs-sm:   13px;

  --w-content: 1200px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--f-ja);
  font-size: var(--fs-body);
  color: var(--c-text);
  background: var(--c-bg-light);
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, svg, video { display: block; max-width: 100%; height: auto; }

a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { background: none; border: none; font: inherit; color: inherit; cursor: pointer; }
input, textarea, select { font: inherit; color: inherit; }

h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.02em;
}

.container {
  max-width: var(--w-content);
  margin: 0 auto;
  padding: 0 24px;
}

@media (max-width: 640px) {
  body { font-size: 14px; }
  .container { padding: 0 16px; }
}