@charset "UTF-8";
/* ========== Document Setting ========== */
/* ========== Color ========== */
/* ========== Font Family ========== */
/* ======================================================================
メディア・コンテナークエリ
====================================================================== */
/* ======================================================================
テキスト
====================================================================== */
/* ---------- テキスト設定（ショートハンド） ---------- */
/* ---------- 見出し（大） ---------- */
/* ---------- 見出し（中） ---------- */
/* ---------- 見出し（小） ---------- */
/* ---------- 見出し（極小） ---------- */
/* ---------- テキスト（通常） ---------- */
/* ---------- テキスト（小） ---------- */
/* ---------- パーマリンク ---------- */
/* ---------- ナビゲーション ---------- */
/* ---------- ラベル ---------- */
/* ---------- 欧文見出し（大） ---------- */
/* ---------- 欧文見出し（大） ---------- */
/* ---------- 読み上げ専用テキスト（スクリーンリーダー対応） ---------- */
/* ======================================================================
アニメーション
====================================================================== */
/* ---------- アニメーション（アンダーライン - 長さ拡大） ---------- */
/* ---------- アニメーション（アイコン - スライドアップ） ---------- */
/* ======================================================================
擬似要素 - テキストループスライダー
====================================================================== */
/* ======================================================================
下層ページヘッダー
====================================================================== */
/* ======================================================================
セクションコンテンツ
====================================================================== */
/* ======================================================================
ユーティリティー
====================================================================== */
/* ---------- インナー（コンテンツ幅の制限あり） ---------- */
/* ---------- インナー（コンテンツ幅の制限なし） ---------- */
/* ---------- インナー（セクション幅） ---------- */
/* ======================================================================
ポジション
====================================================================== */
/* ---------- ポジション設定（ショートハンド） ---------- */
/* ======================================================================
アイコン
====================================================================== */
/* ---------- アイコン（内部リンク） ---------- */
/* ---------- アイコン（内部リンク） ---------- */
/* ---------- アイコン（外部リンク） ---------- */
/* ---------- アイコン（中央配置） ---------- */
/* ---------- リンク下線（Black） ---------- */
/* ---------- リンク下線（Gray） ---------- */
/* ======================================================================
コンポーネント
====================================================================== */
/* ---------- ボタン（Japanese） ---------- */
/* ---------- ボタン（English） ---------- */
/* ---------- パーマリンク（Japanese） ---------- */
/* ---------- パーマリンク（English） ---------- */
/* ==================================================
Document
================================================== */
html {
  text-align: left;
  font-family: heisei-kaku-gothic-std, sans-serif;
  font-size: 14px;
  font-weight: 300;
  color: #2F2F2F;
  line-height: 2;
  letter-spacing: 0.04em;
  scroll-behavior: smooth;
}
@media (max-width: 767px) {
  html {
    font-size: 12px;
  }
}

/* ==================================================
Body
================================================== */
body {
  position: relative;
  overflow-y: scroll;
  transition: all 0.2s;
  /* ----- 擬似要素：背景画像 ----- */
  /* ----- メニュー展開時スクロールロック ----- */
}
body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 101vh;
  background-color: #FAF9EE;
  z-index: -1;
}
@media (max-width: 767px) {
  body::before {
    background-color: #FAF9EE;
  }
}
body.js-scroll-lock {
  overflow-y: scroll;
}
@media (max-width: 1079px) {
  body.js-scroll-lock {
    overflow-y: hidden;
  }
}

/* ---------- フォーカス ---------- */
*:focus-visible {
  outline: 2px solid #1B39DB !important;
}

/* ---------- インラインブロック ---------- */
.inB {
  display: inline-block;
}

/* ---------- インナー（コンテンツ幅の制限あり） ---------- */
.cm-inner {
  width: 100%;
  padding-inline: max(40px, (100% - 1120px) / 2);
}
@media (max-width: 767px) {
  .cm-inner {
    padding-inline: max(20px, (100% - 1120px) / 2);
  }
}

/* ---------- インナー（コンテンツ幅の制限なし） ---------- */
.cm-inner--fluid {
  width: 100%;
  padding-inline: 40px;
}
@media (max-width: 767px) {
  .cm-inner--fluid {
    padding-inline: 20px;
  }
}

/* ================================================================================
 モーション（フェードイン）
================================================================================ */
*.js-fadeIn {
  opacity: 0;
}

*.js-fadeIn.js-motion {
  animation-name: motionFadeIn;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

@keyframes motionFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* ================================================================================
 モーション（フェードアップ）
================================================================================ */
*.js-fadeUp {
  opacity: 0;
}

*.js-fadeUp.js-motion {
  animation-name: motionFadeUp;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

@keyframes motionFadeUp {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/*# sourceMappingURL=common.css.map */