@charset "UTF-8";

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

html {
  font-size: 14px;
}

body {
  color: #222;
  font-family: 'Sulphur Point', YakuHanJP_Noto, 'Noto Sans JP', 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W6', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  transition: opacity .8s, transform .8s;
}

@media (max-width: 768px) {
  html {
    font-size: calc(6.3688px + 2.035vw);
  }
}

@media (max-width: 375px) {
  html {
    font-size: 14px;
  }
}

a,
a:hover,
a:active,
a:focus {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

input[type="button"],
input[type="checkbox"],
input[type="color"],
input[type="file"],
input[type="image"],
input[type="radio"],
input[type="reset"],
input[type="submit"],
button {
  cursor: pointer;
}

textarea,
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"] {
  cursor: text;
}

input[type="range"] {
  cursor: grab;
}

input[type="range"]:active {
  cursor: grabbing;
}

input:disabled {
  cursor: default !important;
}

.js-delayfadein {
  opacity: 0 !important;
  transform: translate3d(0, 15vh, 0) !important;
}

.js-delayfadein.js-ready {
  transition: opacity ease-in .8s, transform ease-in-out 1s;
}

.js-delayfadein.js-done {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) !important;
}

.hidden {
  display: none;
}

.visually-hidden {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 4px !important;
  height: 4px !important;
  opacity: 0 !important;
  overflow: hidden !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  visibility: visible !important;
}

textarea {
  width: 100%;
  max-width: 100%;
  height: 100%;
  padding: 0.57rem 0.42rem;
}