/*
Theme Name: OMUSUBI JAPAN
*/

:root {
  /* Theme Color */
  --color-theme-lighten-2: #F1F9F9;
  --color-theme-lighten-1: #BBE3DF;
  --color-theme-base: #1BA193;
  --color-theme-darken-1: #087D71;
  --color-theme-darken-2: #035D54;

  /* Base Color */
  --color-base-lighten-3: #FFFFFF;
  --color-base-lighten-2: #F7F7F5;
  --color-base-lighten-1: #BDBDBD;
  --color-base-darken-1: #616161;
  --color-base-darken-2: #2D2A32;

  /* Accent Color / pink */
  --color-pink-lighten-2: #FFF2F4;
  --color-pink-lighten-1: #FAB7C3;
  --color-pink-darken-1: #EC788D;
  --color-pink-darken-2: #B95567;

  /* Accent Color / blue */
  --color-blue-lighten-2: #E5F7FF;
  --color-blue-lighten-1: #9ED8F9;
  --color-blue-darken-1: #4CC3FF;
  --color-blue-darken-2: #009ADC;

  /* Accent Color / orange */
  --color-orange-lighten-2: #FFF5E5;
  --color-orange-lighten-1: #FFD899;
  --color-orange-darken-1: #F29700;
  --color-orange-darken-2: #DC760A;

    /* Text / Icon */
  --text-mid: var(--color-base-darken-2);
  --text-low: var(--color-base-darken-1);
  --text-disable: var(--color-base-lighten-1);
  --text-accent: var(--color-theme-base);
  --text-strong: #B71C1C;
  --text-light: var(--color-base-lighten-3);

  /* Background */
  --bg-dark: var(--color-theme-base);
  --bg-subtle: #D3EDE2;
  --bg-base: var(--color-theme-lighten-2);
  --bg-disable: var(--color-base-lighten-1);
  --bg-alert: var(--text-strong);
  --bg-light: var(--color-base-lighten-3);

  /* Border */
  --border-primary: var(--color-base-lighten-1);
  --border-secondary: #E0E0E0;
  --border-accent: var(--color-theme-base);
}


/* 使用カラー */
:root {
  --white: #FFFFFF;
  --black: #2D2A32;
  --gray: #616161;
  --lightGray: #BDBDBD;
  --darkGreen: #035D54;
  --green: #1BA193;
  --lightGreen: #D3EDE2;
  --whiteGreen: #F1F9F9;
  --red: #B71C1C;
}


/* 使用フォント */
:root {
  /* --NotoSans: "Noto Sans JP", sans-serif; */
  --NotoSerif: "Noto Serif JP", serif;
  --BizUd: "BIZ UDGothic", sans-serif;
  --ZenMaru: "Zen Maru Gothic", sans-serif;
}


body {
  min-height: 100vh;
  /* font-family: var(--NotoSans); */
  /* font-family: var(--NotoSerif); */
  font-family: var(--ZenMaru);
  position: relative;
  overflow-x: hidden;
}

html {
  font-size: calc(10 / 1440 * 100vw);
  /* 画面幅1440pxで10px*/
  /* overflow-y: overlay; */
  color: black;
  /* height: -webkit-fill-available; */

}

img {
  width: 100%;
  object-fit: cover;
  height: 100%;
}


.pc_only {
  display: block;
}

.sp_only {
  display: none;
}

/*fade表示関連*/

.fade_in {
  opacity: 0;
  transition: opacity 1.5s cubic-bezier(0, 0.42, 0.58, 1);
}

.fade_up {
  transform: translateY(2vw);
  opacity: 0;
  transition: all 1.2s cubic-bezier(0, 0.42, 0.58, 1);
}

.fade_in.show,
.fv_js.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.fade_in,
.fv_js {
  opacity: 0;
  transition: .8s;
  transform: translateY(5rem);
}

.fade_up.show {
  opacity: 1 !important;
  transform: translateY(0) !important;
}


/* 下層ヘッダー */



@media screen and (max-width: 699.98px) {
  html {
    font-size: calc(10 / 375 * 100vw);
    /* 画面幅375pxで10px*/
  }

  .pc_only {
    display: none;
  }

  .sp_only {
    display: block;
  }



}