:root {
  /* メインカラー */
  --m-yellow: #FDE029;
  --m-green: #208E66;
  --m-blue: #246FD1;

  /* バックカラー */
  --b-yellow: #F8F5D7;
  --b-green: #EBF3E5;
  --b-blue: #D9EAF6;

  /* テキストカラー */
  --black: #222;
}

html {
  font-size: 62.5%;
}

* {
  box-sizing: border-box;
}

body {
  font-family: 'YakuHanJP', 'Roboto', 'Noto Sans JP', sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.8;
  color: #222;
  overflow-x: hidden;
  background-color: #fff;
}

p {
  margin-block: 0.5em;
}

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

.sp-only {
  display: none;
}

button {
  cursor: pointer;
  color: #222;
  text-decoration: none;
  font-family: 'YakuHanJP', 'Roboto', 'Noto Sans JP', sans-serif;
}

a:hover {
  text-decoration: none;
}

a[href^="tel"] {
  color: inherit;
  text-decoration: none;
}

figure {
  margin: 0;
  margin-bottom: 3.0rem;
}

ruby {
  ruby-position: over;
  line-height: 1.8;
}

ruby rt {
  font-size: 0.6em;
  position: relative;
  transform: translateY(-0.25em);
}

hr {
  margin-block: 4.0rem;
  border-color: #ddd;
}

.maru {
  font-family: 'YakuHanJP', 'Noto Sans JP', sans-serif;
}

@media (max-width: 767px) {
  body {
    letter-spacing: 0.05em;
  }

  .sp-only {
    display: initial;
  }

  .pc-only {
    display: none;
  }


  hr {
    margin-block: 1.5em;
  }
}

@media (any-pointer: fine) {
  a[href^="tel"] {
    pointer-events: none;
  }
}