/*
Theme Name: SEIBO_WEB
*/


  
  /* 使用カラー */
  :root {
    --red:#C81A0F;
    --winered: #7D3640;
    --winered2: #8C4F53;
    --yellowgreen:#96BB3F;
    --green:#62971F;
    --olive:#BBB13F;
    --ivory:#FBEBAA;
    --light:#FBFBE2;
    --orange:#F9C214;
    --yelloworange:#F9DE97;
  }
  
  /* 使用フォント */
  :root {
    --NotoSans: 'Noto Sans JP', sans-serif;
    /* Regular 400 Medium 500 SemiBold 600 Bold 700 */
    --NotoSerif: 'Noto Serif JP', serif;
    /* Regular 400 Medium 500 Bold 700 */
    --ZenMaru: "Zen Maru Gothic", serif;
    /* Light 300 Regular 400 Medium 500 Bold 700 Black 900*/
  }
  
  
  body{
    min-height: 100vh;
    /* min-height: -webkit-fill-available; */
    font-family: var(--NotoSans);
    z-index: 0;
    position: relative;
    background-color: #fbfbe2;
  }
  
  html {
    font-size: min(calc(10 / 1280 * 100vw),10px);
    /* 画面幅1280pxで10px*/
    /* overflow-y: overlay; */
    color: var(--black);
    /* height: -webkit-fill-available; */
  
  }

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

  /*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 {
  opacity: 1;
}

.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;
    }
}
