@charset "UTF-8";
/*インポート*/
/*ブレイクポイント指定*/
ul.workingStyle > li,
ul.holiday > li,
ul.career > li,
ul.benefits > li {
  opacity: 0;
  transform: translateY(50px);
  transition: 1.5s;
  /*showのクラス追加で表示される*/
}
ul.workingStyle > li.show,
ul.holiday > li.show,
ul.career > li.show,
ul.benefits > li.show {
  opacity: 1;
  transform: translateX(0);
}
/*カラー*/
.system > ul > li.workingStyle__0 {
  background-color: #ff9496;
  color: #ff9496;
}
.system > ul > li.holiday__0 {
  background-color: #50b2fc;
  color: #50b2fc;
}
.system > ul > li.career__0 {
  background-color: #88cc91;
  color: #88cc91;
}
.system > ul > li.benefits__0 {
  background-color: #FFC64F;
  color: #FFC64F;
}

.system > ul.workingStyle > li {
  color: #ff9496;
}
.system > ul.holiday > li {
  color: #50b2fc;
}
.system > ul.career > li {
  color: #88cc91;
}
.system > ul.benefits > li {
  color: #FFC64F;
}

ul.workingStyle,
ul.holiday,
ul.career,
ul.benefits {
  background-color: #fff;
  display: flex; /*Flexbox(liの親)*/
  flex-direction: row; /*横並び*/
  flex-wrap: wrap; /*折り返す*/
  justify-content: center; /*左右*/
  vertical-align: top;
  margin: 0 5%;
}

.system > ul > li {
  /*制度のスタイル*/
  width: 360px;
  border-radius: 13px;
  border: 1.5px solid;
  margin: 10px;
  padding: 20px;
  position: relative;
  /*ダミー*/
  /*2列表示できるとき*/
  /*項目見出しスタイル*/
}
.system > ul > li div[class$="--title"] {
  text-align: center;
  font-size: 1.69em;
  font-weight: bold;
}
.system > ul > li div[class$="--text"] {
  color: #333;
  margin-top: 20px;
  font-size: 0.97em;
  text-align: left;
  padding: 0 13px;
  line-height: 24px;
}
.system > ul > li div[class$="--text"] .clause li {
  line-height: 22px;
  margin-bottom: 6px;
}
.system > ul > li span.small {
  font-size: 0.7em;
}
.system > ul > li.workingStyle__dummy, .system > ul > li.holiday__dummy, .system > ul > li.career__dummy, .system > ul > li.benefits__dummy {
  display: none;
  border: 0;
}
.system > ul > li .iCD_img,
.system > ul > li .parenting_img,
.system > ul > li .erubosi_img {
  text-align: right;
  margin-right: 10px;
}
.system > ul > li .iCD_img img,
.system > ul > li .parenting_img img,
.system > ul > li .erubosi_img img {
  width: 80px;
}
@media screen and (min-width: 675px) {
  .system > ul > li {
    /*制度のスタイル*/
    margin: 15px 18px;
    padding-top: 30px;
    /*デフォルト*/
    /*それぞれ調節*/
    /*挿絵*/
  }
  .system > ul > li.workingStyle__1, .system > ul > li.workingStyle__2, .system > ul > li.workingStyle__3, .system > ul > li.workingStyle__4, .system > ul > li.workingStyle__5, .system > ul > li.workingStyle__6, .system > ul > li.workingStyle__7, .system > ul > li.workingStyle__8, .system > ul > li.workingStyle__9, .system > ul > li.workingStyle__dummy, .system > ul > li.holiday__1, .system > ul > li.holiday__2, .system > ul > li.holiday__3, .system > ul > li.holiday__4, .system > ul > li.holiday__5, .system > ul > li.holiday__6, .system > ul > li.holiday__7, .system > ul > li.holiday__8, .system > ul > li.holiday__9, .system > ul > li.holiday__dummy, .system > ul > li.career__1, .system > ul > li.career__2, .system > ul > li.career__3, .system > ul > li.career__4, .system > ul > li.career__5, .system > ul > li.career__6, .system > ul > li.career__7, .system > ul > li.career__8, .system > ul > li.career__9, .system > ul > li.career__dummy, .system > ul > li.benefits__1, .system > ul > li.benefits__2, .system > ul > li.benefits__3, .system > ul > li.benefits__4, .system > ul > li.benefits__5, .system > ul > li.benefits__6, .system > ul > li.benefits__7, .system > ul > li.benefits__8, .system > ul > li.benefits__9, .system > ul > li.benefits__dummy {
    width: 260px;
    height: 300px;
  }
  .system > ul > li.workingStyle__7, .system > ul > li.workingStyle__8, .system > ul > li.workingStyle__9 {
    height: 330px;
  }
  .system > ul > li.career__5 {
    width: 556px;
    height: 380px;
  }
  .system > ul > li.career__4, .system > ul > li.career__3 {
    height: 390px;
  }
  .system > ul > li.workingStyle__dummy {
    display: block;
  }
  .system > ul > li .workingStyle__img2 {
    width: 230px;
  }
  .system > ul > li .workingStyle__img3 {
    display: none;
  }
}
@media screen and (min-width: 1004px) {
  .system > ul > li {
    /*挿絵*/
  }
  .system > ul > li.career__3 {
    height: 300px;
  }
  .system > ul > li.career__4, .system > ul > li.career__5 {
    height: 400px;
  }
  .system > ul > li.workingStyle__dummy {
    display: none;
  }
  .system > ul > li.benefits__dummy {
    display: block;
    width: 556px;
  }
  .system > ul > li .benefits__img2 {
    display: none;
  }
  .system > ul > li .benefits__img3 {
    display: block;
    width: 480px;
  }
}
@media screen and (min-width: 1333px) {
  .system > ul > li {
    /*それぞれ調節*/
    /*挿絵*/
  }
  .system > ul > li.workingStyle__5, .system > ul > li.workingStyle__6, .system > ul > li.workingStyle__7, .system > ul > li.workingStyle__8, .system > ul > li.workingStyle__9 {
    height: 330px;
  }
  .system > ul > li.career__4 {
    width: 556px;
  }
  .system > ul > li.career__4, .system > ul > li.career__5 {
    height: 370px;
  }
  .system > ul > li.workingStyle__dummy {
    display: block;
    width: 852px;
  }
  .system > ul > li.holiday__dummy {
    display: block;
    width: 556px;
  }
  .system > ul > li.career__dummy {
    display: block;
    padding: 10px 0;
  }
  .system > ul > li .workingStyle__img2 {
    display: none;
  }
  .system > ul > li .workingStyle__img3 {
    display: block;
    width: 770px;
  }
  .system > ul > li .holiday__img2 {
    width: 480px;
  }
  .system > ul > li .career__img2 {
    width: 240px;
  }
}
.system > ul > li.workingStyle__0, .system > ul > li.holiday__0, .system > ul > li.career__0, .system > ul > li.benefits__0 {
  text-align: center;
  width: 100%;
  height: 50px;
  border-radius: 30px;
  margin-bottom: 40px;
  padding: 8px;
}
@media screen and (min-width: 675px) {
  .system > ul > li.workingStyle__0, .system > ul > li.holiday__0, .system > ul > li.career__0, .system > ul > li.benefits__0 {
    width: 625px;
  }
}
@media screen and (min-width: 1004px) {
  .system > ul > li.workingStyle__0, .system > ul > li.holiday__0, .system > ul > li.career__0, .system > ul > li.benefits__0 {
    width: 900px;
  }
}
@media screen and (min-width: 1333px) {
  .system > ul > li.workingStyle__0, .system > ul > li.holiday__0, .system > ul > li.career__0, .system > ul > li.benefits__0 {
    width: 1197px;
  }
}
.system > ul > li.workingStyle__0 h4[class$="--head"], .system > ul > li.holiday__0 h4[class$="--head"], .system > ul > li.career__0 h4[class$="--head"], .system > ul > li.benefits__0 h4[class$="--head"] {
  color: #fcfcfc;
  font-size: 1.9em;
  font-weight: bold;
}

.contents > ul {
  margin-bottom: 60px;
  /*image描いてから調整*/
  /*image描いてから調整ここまで*/
}
@media screen and (min-width: 675px) {
  .contents > ul {
    margin-top: 100px;
    margin-bottom: 100px;
  }
}
.contents > ul .workingStyle__0 img,
.contents > ul .career__0 img,
.contents > ul .holiday__0 img,
.contents > ul .benefits__0 img {
  color: #333;
  position: absolute;
  width: 110px;
}
.contents > ul .workingStyle__0 img,
.contents > ul .career__0 img {
  top: -83px;
  left: 10%;
}
.contents > ul .holiday__0 img,
.contents > ul .benefits__0 img {
  top: -90px;
  right: 10%;
}
@media screen and (min-width: 1662px) {
  .contents {
    width: 1644px;
  }
}