@charset "utf-8";

/* custom properties ----------------------------------------------------------------*/
:root {
  --site-color-main: #039;
  --site-color-subA: #4378e2;
  --site-color-subB: #1da4b4;
  --site-color-baseA: #fff;
  --site-color-baseB: #f8f8f8;
  --site-color-text: #000;
  --site-color-link: #6795d6;
  --site-color-caution: #cf0101;
  --site-color-member: #007575;
  --site-table-th1: #e6e6e6;
  --site-table-th2: #f3f3f3;
  --site-table-bg-accent1: #e2e6ec;
  --site-table-border1: #ccc;

  --header-height: 90px;
  --visual-bottom-margin: 140px;

  --hover-transition: ease 0.2s;
  --hover-opacity: 0.7;
  --ani-cb-01: cubic-bezier(0.27, 0.14, 0.02, 0.99);
}
@media screen and (max-width: 767px) {
  :root {
    --header-height: 0px;
  }
}
/* reset ----------------------------------------------------------------*/
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
:where(button) {
  all: unset;
}
:where(button:focus:not(:focus-visible)) {
  outline: revert;
}
:where(button:focus-visible) {
  outline: revert;
}
:where(input, button, textarea, select) {
  font: inherit;
  color: inherit;
}
:where(textarea) {
  resize: vertical;
  resize: block;
}
:where(button, label, select, summary, [role='button'], [role='option']) {
  cursor: pointer;
}
:where(:disabled) {
  cursor: not-allowed;
}
:where(label:has(> input:disabled), label:has(+ input:disabled)) {
  cursor: not-allowed;
}
:where(a) {
  color: inherit;
}
:where(ul, ol) {
  list-style: none;
}
:where(img, picture, svg, video) {
  max-width: 100%;
  vertical-align: middle;
}
:where(em) {
  font-style: normal;
}
/* animation ----------------------------------------------------------------*/
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeInSlideUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  30% {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}
/* base ----------------------------------------------------------------*/
html {
  font-size: 62.5%;
  height: 100%;
}
@media screen and (max-width: 374px) {
  html {
    font-size: 50%;
  }
}
body {
  background-color: var(--site-color-baseA);
  color: var(--site-color-text);
  min-height: 100%;
}
.ff-robot,
.robot {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
}
.ff-robot-bold {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
}
:where(em, strong) {
  font-weight: 700;
}
:where(button) {
  text-decoration: none;
}
:where(button:hover) {
  text-decoration: none;
}
:where(main a) {
  text-decoration: underline;
  color: var(--site-color-link);
}
:where(main a:hover) {
  text-decoration: none;
}
:where(body) {
  font-family: 'Noto Sans', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN',
    'Yu Gothic', 'Meiryo', sans-serif;
  font-size: 1.6rem;
  line-height: 1.5;
  font-weight: 400;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; /* Safari */
}
:lang(ja) body {
  font-family: 'Noto Sans JP', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN',
    'Yu Gothic', 'Meiryo', sans-serif;
  font-size: 1.6rem;
  line-height: 1.5;
  font-weight: 400;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; /* Safari */
}
:lang(zh-hans) body {
  font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
  font-size: 1.6rem;
  line-height: 1.5;
  font-weight: 400;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; /* Safari */
}
html.prevent-scroll :where(main) {
  padding-right: var(--scrollbar-width, 0px);
}

/* regional -----*/
:where(body.is-regional) {
  font-family: 'Roboto', sans-serif;
  font-size: 1.6rem;
  line-height: 1.5;
  font-weight: 400;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; /* Safari */
}
:lang(ko) :where(body.is-regional) {
  font-family: 'Roboto', 'Apple SD Gothic Neo', Gulim, 'Malgun Gothic',
    sans-serif;
}
:lang(zh-hant) :where(body.is-regional) {
  font-family: 'Roboto', 'PingFang TC', 'Hiragino Sans CNS',
    'Microsoft JhengHei', sans-serif;
}
:lang(th) :where(body.is-regional) {
  font-family: 'Roboto', Leelawadee, thonburi, Tahoma, sans-serif;
}