/* ===========================
  Base: リセット・変数・タイポグラフィ
=========================== */

:root {
  --color-green:        #009068;
  --color-green-light:  #3D8A64;
  --color-green-dark:   #005840;
  --color-background:   #E0EDEB;
  --color-bg-green:     #F3F8F7;
  --color-purple:       #5542C0;
  --color-purple-hover: #6F5EC9;
  --color-arrow:        #4FA882;
  --color-white:        #FFFFFF;
  --color-text:         #262626;
  --color-text-muted:   #6B7280;
  --color-border:       #E7E7E7;
  --color-gray:         #888888;
  --color-bg-box:       #FAFAF9;
  --color-link:         #00633D;
  --color-red:          #E60039;

  --font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, 'Hiragino Kaku Gothic ProN',
    'Hiragino Sans', 'Yu Gothic', Meiryo, sans-serif;

  --radius-pill:   9999px;
  --radius-card:   20px;
  --radius-drawer: 32px;

  --shadow-header: 0 8px 16px 0 rgba(0, 0, 0, 0.03), 0 1px 2px 0 rgba(0, 0, 0, 0.08);
  --shadow-drawer: 0 8px 40px rgba(0, 0, 0, 0.14);
  
  --header-bg: rgba(255, 255, 255, 0.90);
  --header-height: 80px;
  --header-top:    20px;

  --btn-font-size:        18px;
  --btn-font-size-mobile: 16px;
  --btn-font-weight:      500;
  --btn-padding:          21px 68px;
  --btn-padding-mobile:   9px 44px;
  --btn-border-width:     2px;
  --btn-transition:       0.3s ease;
  --shadow-btn:           0 8px 32px 0 rgba(0, 0, 0, 0.08);
}

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

html {
  font-size: 15px;
  -webkit-text-size-adjust: 100%;
  scrollbar-gutter: stable;
}

body {
  font-family: var(--font-family);
  color: var(--color-text);
  line-height: 1.7;
  min-height: 100vh;
}

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

a {
  color: inherit;
  text-decoration: none;
  transition: opacity 0.3s;
}

a:hover {
  opacity: 0.5;
}

ul,
ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

button {
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  color: inherit;
}

.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}

body.drawer-open {
  overflow: hidden;
}

/* ===========================
  表示・非表示ユーティリティ
=========================== */

/* SP (〜767px) のみ表示 */
.for-sp {
  display: block;
}

/* PC (768px〜) のみ表示 */
.for-pc {
  display: none;
}

@media (min-width: 768px) {
  .for-sp {
    display: none;
  }

  .for-pc {
    display: block;
  }
}