@charset "UTF-8";
/*
* レイアウト
*/
#jobs {
  
}
#jobs .commonBgColor {
  width: 100%;
  background-color: #FFFFFF;
}


/*
* まえがき
*/
#preface {
  position: relative;
  margin: 0;
  padding: 0 0 100px 0;
}
#preface .wrap {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  gap: 0;
}
#preface p {
  margin: 0;
  padding: 0;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
}



/*
* リスト
*/
#list {
  position: relative;
  margin: 0;
  padding: 0 0 40px 0;
}
#list ul {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
}
/* 行動 */
#list ul li.act {
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: #F5F9FF;
}
#list ul li.act .wrap {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: stretch;
  gap: 80px;
  margin: 0 auto;
}
/* 矢印 下に矢印 */
#list .arrow {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 220px;
  margin: -20px 0 10px 0;
  text-align: center;
  color: #FFFFFF;
  font-size: 22px;
  font-weight: 500;
  background-color: #1B74C1;
  border-radius: 8px 8px 0 0;
}
#list .arrow.thin {
  font-weight: 400;
}
#list .arrow::after {
  content: '';
  position: absolute;
  bottom: 1px;
  left: 50%;
  transform: translate(-50%, 100%);
  width: 0;
  height: 0;
  border-left: 110px solid transparent;
  border-right: 110px solid transparent;
  border-top: 40px solid #1B74C1;
}
/* 見出し */
#list .head {
  width: 390px;
  margin: 0;
  padding: 40px 0;
}
#list .head h4 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 0 0 40px 0;
  padding: 0;
  font-size: 22px;
  font-weight: 500;
  line-height: 2;
}
#list .head h4 en {
  font-family: 'Red Hat Display', sans-serif;
  color: #1B74C1;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
}
#list .head img.pict {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border-radius: 8px;
}
/* 本文 */
#list .body {
  flex: 1;
  margin: 0;
  padding: 40px 0;
}
#list .body p {
  margin: 0 0 40px 0;
  padding: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
}
#list .body .point {
  margin: 0;
  padding: 20px;
  background-color: #FFFFFF;
  border-radius: 8px;
}
#list .body .point h4 {
  display: flex;
  align-items: center;
  margin: 0 0 10px 0;
  padding: 0;
  color: #1B74C1;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
}
#list .body .point h4::before {
  content: '';
  display: inline-block;
  margin: 0 10px 0 0;
  width: 40px;
  height: 40px;
  background-image: url(../img/iconPoint01.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
#list .body .point p {
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
}
/* ステータス */
#list ul li.state {
  width: 100%;
  margin: 0;
  padding: 0;
}
#list ul li.state .wrap {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: stretch;
  gap: 80px;
  margin: 0 auto;
}
/* 矢印 下に矢印 */
#list ul li.state .arrow {
  margin: 40px 0 70px 0;
  padding: 20px 0 0 0;
  color: #465565;
  background-color: #DBE5F0;
}
#list ul li.state .arrow::after {
  border-top: 40px solid #DBE5F0;
}
#list ul li.state .blank {
  flex: 1;
}
/* 最後は矢印なし */
#list li:last-child .arrow {
  padding: 20px !important;
  border-radius: 8px;
}
#list li:last-child .arrow::after {
  display: none;
}


/*
* 色変更
*/
/* ブロック 関連情報 */
#blockRelatedContent {
  background-color: #FFFFFF;
}
#blockRelatedContent::after {
  background-color: #F5F9FF;
}
/* ブロック パンくずリスト */
#blockBreadcrumb {
  background-color: #F5F9FF;
}
/* 世界へ */
#toWorld .upperArch {
  background-color: #F5F9FF;
}





/*
* スマホ用 
*/


@media screen and (max-width:992px){

  
  /*
  * まえがき
  */
  #preface {
    padding: 0 0 60px 0;
  }
  #preface p {
    font-size: 15px;
  }


  /*
  * リスト
  */
  #list {
    padding: 0 0 40px 0;
  }
  #list ul {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
  }
  /* 行動 */
  #list ul li.act .wrap {
    flex-direction: column;
    gap: 0px;
    margin: 0 auto;
    padding: 0 0 40px 0;
  }
  /* 矢印 下に矢印 */
  #list .arrow {
    width: 100%;
    margin: -20px 0 10px 0;
    padding: 10px 0 0 0;
    font-size: 18px;
  }
  #list .arrow::after {
    border-left: calc(50vw - 18px) solid transparent;
    border-right: calc(50vw - 18px) solid transparent;
    border-top: 30px solid #1B74C1;
  }
  /* 見出し */
  #list .head {
    width: 100%;
    margin: 0;
    padding: 30px 0 20px 0;
  }
  #list .head h4 {
    align-items: center;
    text-align: center;
    margin: 0 0 10px 0;
    font-size: 18px;
  }
  #list .head h4 en {
    font-size: 12px;
  }
  #list .head img.pict {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    border-radius: 8px;
  }
  /* 本文 */
  #list .body {
    padding: 0;
  }
  #list .body p {
    margin: 0 0 40px 0;
    font-size: 15px;
  }
  #list .body .point {
    margin: 0;
    padding: 20px;
  }
  #list .body .point h4 {
    margin: 0 0 10px 0;
    font-size: 16px;
  }
  #list .body .point p {
    font-size: 15px;
  }
  /* ステータス */
  #list ul li.state {
    width: 100%;
    margin: 0;
    padding: 0;
  }
  #list ul li.state .wrap {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: stretch;
    gap: 80px;
    margin: 0 auto;
  }
  /* 矢印 下に矢印 */
  #list ul li.state .arrow {
    margin: 40px 0 70px 0;
    padding: 20px 0 0 0;
    color: #465565;
    background-color: #DBE5F0;
  }
  #list ul li.state .arrow::after {
    border-top: 40px solid #DBE5F0;
  }
  #list ul li.state .blank {
    display: none;
  }
  /* 最後は矢印なし*/
  #list ul li.state:last-child .arrow {
    padding: 10px 0;
    border-radius: 8px;
  }
  #list ul li.state:last-child .arrow::after {
    display: none;
  }













}
