/*
Theme Name: JOB NAVI
*/



/* 使用カラー */
:root {
  --black:#333333;
  --purple:#634B6D;
  --red:#BB4747;  
}


/* 使用フォント */
:root {
  --NotoSans: "Noto Sans JP", sans-serif;
  --NotoSerif: "Noto Serif JP", sans-serif;
  --Alegreya: "Alegreya Sans SC", sans-serif;
}


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

html {
  /* font-size: min(calc(10 / 1280 * 100vw), 10px); */
  font-size: calc(10 / 1280 * 100vw);
  /* 画面幅1280pxで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 {
  opacity: 1;
}

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


/* 下層ヘッダー */
/* タイトル -----------------------------------*/
.area_title {
    width: 100%;
    height: calc(30rem - 8rem);
    font-size: 3.5rem;
    font-weight: 900;
    background-color: #172a88;
    color: #FFFFFF;
    padding: 0 12rem 0 12rem;
    margin-top: 8rem;
    display: flex;
    align-items: center;
    font-weight: 900;
}

.area_title::before {
    content: "";
    display: inline-block;
    width: 0.4rem;
    height: 11rem;
    background-color: #FFFFFF;
    margin-right: 4rem;
}


.wp-block-heading{
  margin-top: 3rem;
}

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

  .pc_only {
    display: none;
  }

  .sp_only {
    display: block;
  }

  .area_title {
      font-size: 2.2rem;
      padding-left: 4.5rem;
      padding-right: 4.5rem;
      height: 14rem;
  }

  .area_title::before {
      height: 5.2rem;
      margin-right: 1.9rem;
  }

}