:root{
  --container: 1200px;
  --gutter: 24px;

  --text: #111;
  --muted: #666;
  --line: #e8e8e8;

  --accent: #19a6c7;
  --accent2: #0b6e88;

  --radius: 10px;

  --shadow: 0 10px 30px rgba(0,0,0,.08);
}

body{
  font-family: system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  color: var(--text);
  line-height: 1.8;
  background: #fff;
}

.container{
  width: min(var(--container), calc(100% - var(--gutter) * 2));
  margin-inline: auto;
}

a:focus-visible,
button:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

@media (max-width: 640px){
  :root{ --gutter: 16px; }
}

/* =========================
  Shared
========================= */
:root{
  --tk-max: 1200px;
  --tk-pad: clamp(18px, 4vw, 60px);
  --tk-accent: #00bffe;
}

.tk-section{
  padding: clamp(48px, 6vw, 0px) 0;
}

.tk-wrap{
  width: min(100%, var(--tk-max));
  margin-inline: auto;
  padding-inline: var(--tk-pad);
}