@charset "utf-8";

:root {
  /* メインカラー（ディープティール） */
  --color-primary: #2A8C8C;       /* ブランド色・大きいボタン・アイコン */
  --color-primary-dark: #227373;  /* 小さい文字のボタン・リンク・押した時 */
  --color-primary-light: #E6F3F3; /* 背景・選択中・お客様の吹き出しなど */

  /* 差し色（レモンイエロー）：白文字は乗せない。濃い文字と組み合わせる */
  --color-accent: #F2C94C;

  /* 文字・背景 */
  --color-text: #1F2D2D;          /* 本文（白背景でコントラスト比14.27） */
  --color-text-sub: #5B6B6B;      /* 補足テキスト（白背景で5.58） */
  --color-bg: #FFFFFF;
  --color-border: #D5E2E2;
  --color-bg-sub: #F3F7F7;              /* 画面の背景（白いカードを乗せる下地） */
  --color-shadow: rgba(31, 107, 107, 0.35);   /* カードやメッセージの影 */
}

/* スクロールデザイン */
::-webkit-scrollbar {
  width: 0;
  height: 0;
}
::-webkit-scrollbar-track {
  background-color: transparent;
}
::-webkit-scrollbar-thumb {
  background-color: transparent;
}
/* --------------------------- */

html {
  overflow: hidden;
}

.set-height {
  height: calc(var(--dvh, 1dvh) * 100);   /* --dvh が無い時は 1dvh */
}

input, textarea {
  user-select: text;
  -webkit-user-select: text;
}
input:focus,
select:focus, 
textarea:focus {
  outline: none;
  box-shadow: none;
}

body {
  width: 100%;
  overflow-x: hidden;
  overflow-y: hidden;
  font-family: "IBM Plex Sans JP", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  user-select: none;
  color: var(--color-text);
}

/* ボタンの基本（reset.css で消えたものを戻す） */
button {
  font: inherit;          /* ページと同じフォントを使う */
  color: inherit;
  text-align: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;   /* Android でタップした時の青い枠を消す */
}