@charset "UTF-8";
/* CSS Document */

/* ---------------------------------------------
  1. Global box-sizing
--------------------------------------------- */
*, *::before, *::after {
  box-sizing: border-box;
}

/* ---------------------------------------------
  2. HTML5 elements & basic reset
--------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp, small,
strike, strong, sub, sup, tt, var, b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  border: 0;
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
}

/* 必要なら残してOK（害はほぼなし） */
html,
body {
  width: 100%;
}

/* スクロールバーを常に出したい場合（デザインのゆれ防止） */
html {
  overflow-y: scroll;
  position: relative;
}

/* HTML5要素のdisplay指定（古いブラウザ対策・現状は問題なし） */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

/* 引用まわりリセット */
blockquote,
q {
  quotes: none;
}
blockquote::before,
blockquote::after,
q::before,
q::after {
  content: "";
}

/* フォーム要素の余白リセット */
input,
textarea {
  margin: 0;
  padding: 0;
}

/* リストの・を消す（デザイン保持のため残す） */
ol,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* テーブルリセット */
table {
  border-collapse: collapse;
  border-spacing: 0;
}
caption,
th,
td {
  font-weight: normal;
  text-align: left;
}

/* 画像リンクの境界線削除（昔のIE対策だが害はない） */
a img {
  border: 0;
}

/* マウス操作時のアウトラインだけ消す（フォーカスは消さない） */
a:active,
a:hover {
  outline: none;
}

/* 画像共通 */
img {
  max-width: 100%;
  vertical-align: bottom;
}

/* ---------------------------------------------
  3. Body & footer layout
--------------------------------------------- */
body {
  /* スマホで勝手に文字が大きくなる挙動を「ユーザー設定に任せる」 */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;

  /* footerをbottomに固定する処理 */
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* footerをページ最下部に押し下げる */
footer {
  margin-top: auto;
}

/* ---------------------------------------------
  4. PC/SP 表示切り替えユーティリティ
--------------------------------------------- */
:root {
  --display-block: block !important;
  --display-none: none !important;
}

.pc_only,
.pc_only02,
.pc_only03,
.pc_only04 {
  display: var(--display-block);
}

.mobile_only,
.mobile_only02,
.mobile_only03,
.mobile_only04 {
  display: var(--display-none);
}

@media (max-width: 1000px) {
  .pc_only02 {
    display: var(--display-none);
  }
  .mobile_only02 {
    display: var(--display-block);
  }
}

@media (max-width: 768px) {
  .pc_only {
    display: var(--display-none);
  }
  .mobile_only {
    display: var(--display-block);
  }
}

@media (max-width: 600px) {
  .pc_only03 {
    display: var(--display-none);
  }
  .mobile_only03 {
    display: var(--display-block);
  }
}

@media (max-width: 480px) {
  .pc_only04 {
    display: var(--display-none);
  }
  .mobile_only04 {
    display: var(--display-block);
  }
}