@charset "utf-8";
/* ==================================================== */
/*  welfare
/* ==================================================== */
.welfare .contents-tlt .tlt-en {
  max-width: 77.05px;
}

/* .contents-area */
.welfare .contents-area {
  margin-top: 97px;
  margin-bottom: 150px;
}
.welfare .contents-area .inner {
  margin-top: 97px;
}
.welfare .contents-area .point-area {
  max-width: 1134px;
  margin: 0 auto 64px;
}
.welfare .contents-area .point-area .flex {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.welfare .contents-area .point-area .flex .point-img {
  position: relative;
  width: 37.91%;
  max-width: 430px;
  margin-right: 4.2%;
}
.welfare .contents-area .point-area .flex .point-img span {
  position: absolute;
  top: -35px;
  left: -22px;
  display: block;
  width: 106.28px;
}
.welfare .contents-area .point-area .flex .point-img figure {
  width: 100%;
}
.welfare .contents-area .point-area .flex .point-txt {
  width: 56%;
}
.welfare .contents-area .point-area .flex .point-txt span {
  display: inline-block;
  /*width: 122px;*/
  margin-bottom: 5px;
}
.welfare .contents-area .point-area .flex .point-txt span img {
  height: 44px;
}
.welfare .contents-area .point-area .flex .point-txt h2 {
  position: relative;
  margin-bottom: 29px;
  padding-bottom: 14px;
  background-image: url(../img/welfare/repeat_border.svg);
  background-repeat: repeat-x;
  background-position: left bottom;
  font-size: var(--fs22);
  font-weight: bold;
}
.welfare .contents-area .point-area .flex .point-txt p {
  margin-bottom: 28px;
  font-size: var(--fs16);
  font-weight: 500;
  line-height: 2;
}
.welfare .contents-area .point-area .flex .point-txt .comment-box {
  display: flex;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-width: 615px;
  margin: 0 auto;

  gap: 3.4%;
}
.welfare .contents-area .point-area .flex .point-txt .comment-box img {
  /* width: 48.3%; */
  width: 297px;
}

/* ipad */
@media screen and (max-width: 1024px) {
  .welfare .contents-area .point-area .flex .point-txt .comment-box {
    align-items: center;
    flex-direction: column;

    gap: 10px 0;
  }
}

/* スマホ */
@media screen and (max-width: 767px) {
  .welfare .contents-area {
    margin-top: 45px;
    margin-bottom: 100px;
  }
  .welfare .contents-area .inner {
    margin-top: 70px;
    padding: 0 8%;
  }
  .welfare .contents-area .point-area .flex {
    flex-direction: column;

    gap: 30px;
  }
  .welfare .contents-area .point-area .flex .point-img {
    width: 84.76%;
    margin: 0 auto;
  }
  .welfare .contents-area .point-area .flex .point-img span {
    width: 74.4px;
  }
  .welfare .contents-area .point-area .flex .point-txt {
    width: 100%;
  }
  .welfare .contents-area .point-area .flex .point-txt h2 {
    margin-bottom: 19px;
    font-size: var(--fs20);
  }
  .welfare .contents-area .point-area .flex .point-txt p {
    font-size: var(--fs15);
  }

  .welfare .contents-area .point-area .flex .point-txt .comment-box img {
    width: 94.6%;
    max-width: 297px;
  }
}

/* .welfare-area */
.welfare .welfare-area {
  position: relative;
  padding-top: 47px;
  padding-bottom: 130px;
  background-color: #f4e9c8;
}
.welfare .welfare-area:before {
  position: absolute;
  top: -16px;
  left: 0;
  display: block;
  width: 100%;
  height: 21px;
  background-image: url(../img/welfare/welfare_top.svg);
  background-repeat: repeat-x;
  background-position: center;
  background-size: cover;
  content: "";
}
.welfare .welfare-area .welfare-mark {
  position: absolute;
  top: -42px;
  right: 15%;
  width: 449.72px;
}
.welfare .welfare-area .welfare-tlt {
  max-width: 1160px;
  margin: 0 auto 41px;
}
.welfare .welfare-area .welfare-tlt h2 {
  font-size: var(--fs38);
  font-weight: bold;
}
.welfare .welfare-area .welfare-tlt .tlt-en {
  width: 77.05px;
}
.welfare .welfare-area .welfare-box {
  max-width: 1146px;
  margin: auto;
  padding: 48px 7.5% 37px;
  border-radius: 24px;
  background-color: #fff;
}
.welfare .welfare-area .welfare-box .flex {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.welfare .welfare-area .welfare-box .flex .list {
  width: 29.59%;
  margin-bottom: 40px;
  padding: 0;
  padding: 0 1.9% 17px;
  border: 3px dotted #efc926;
  border-radius: 20px;
}
.welfare .welfare-area .welfare-box .flex .list h3 {
  margin-bottom: 17px;
  font-size: var(--fs20);
  font-weight: bold;
  line-height: 1.4;
  text-align: center;
  color: #ed7a42;
}
.welfare .welfare-area .welfare-box .flex .list p {
  font-size: var(--fs16);
  font-weight: 500;
  text-align: center;
  letter-spacing: normal;
}
.welfare .welfare-area .welfare-box .flex .list p.txt-r {
  padding-top: 10px;
  font-size: var(--fs13);
  text-align: right;
}
.welfare .welfare-area .welfare-box .flex .list:first-child figure {
  width: 29%;
  max-width: 68.59px;
  margin: 30px auto 18px;
}
.welfare .welfare-area .welfare-box .flex .list:nth-child(2) figure {
  width: 46%;
  max-width: 111.33px;
  margin: 21px auto 20px;
}
.welfare .welfare-area .welfare-box .flex .list:nth-child(3) figure {
  width: 56%;
  max-width: 136.84px;
  margin: 24px auto 15px;
}
.welfare .welfare-area .welfare-box .list-flex {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.welfare .welfare-area .welfare-box .list-flex .list {
  width: 30%;
  margin-bottom: 26px;
  padding: 0;
  border: none;
  border-radius: 0;
}
.welfare .welfare-area .welfare-box .list-flex h4 {
  margin-bottom: 11px;
  padding-bottom: 10px;
  border-bottom: 3px dotted #efc926;
  font-size: var(--fs16);
  font-weight: bold;
  line-height: 1.3;
  color: #ed7a42;
}
.welfare .welfare-area .welfare-box .flex.list-flex p {
  text-align: left;
}

/* スマホ */
@media screen and (max-width: 767px) {
  .welfare .welfare-area {
    padding-bottom: 90px;
  }
  .welfare .welfare-area .welfare-mark {
    right: 8%;
    width: 224.22px;
  }
  .welfare .welfare-area .welfare-tlt h2 {
    font-size: var(--fs26);
  }
  .welfare .welfare-area .welfare-box {
    padding: 25px 5.5% 30px;
  }
  .welfare .welfare-area .welfare-box .flex {
    flex-direction: column;
  }
  .welfare .welfare-area .welfare-box .flex .list {
    display: flex;
    width: 100%;
    margin-bottom: 23px;
    padding: 20px 3% 17px;
  }
  .welfare .welfare-area .welfare-box .flex .list figure {
    width: 40%;
  }
  .welfare .welfare-area .welfare-box .flex .list:first-child figure {
    max-width: 47.09px;
    margin: auto;
  }
  .welfare .welfare-area .welfare-box .flex .list:nth-child(2) figure {
    max-width: 75.29px;
    margin: auto;
  }
  .welfare .welfare-area .welfare-box .flex .list:nth-child(3) figure {
    max-width: 75.85px;
    margin: auto;
  }

  .welfare .welfare-area .welfare-box .flex .list .list-txt {
    width: 60%;
  }
  .welfare .welfare-area .welfare-box .flex .list h3 {
    margin-bottom: 5px;
    font-size: var(--fs16);
    text-align: left;
  }
  .welfare .welfare-area .welfare-box .flex .list p {
    font-size: var(--fs14);
    text-align: left;
  }
  .welfare .welfare-area .welfare-box .flex.list-flex {
    margin-top: 10px;
  }
  .welfare .welfare-area .welfare-box .flex.list-flex .list {
    display: block;
    padding: 0;
  }
  .welfare .welfare-area .welfare-box .list-flex h4 {
    font-size: var(--fs15);
  }
  .welfare .welfare-area .welfare-box .list-flex p {
    font-size: var(--fs14);
  }
}

/* .training-area */
.welfare .training-area {
  position: relative;
  padding-top: 90px;
  padding-bottom: 120px;
  background-image: url(../img/welfare/training_bg.png);
  background-repeat: repeat;
  background-size: contain;
}
.welfare .training-area .training-mark {
  position: absolute;
  top: -50px;
  right: 9vw;
  z-index: 2;
  width: 236.4px;
}
.welfare .training-area .flex {
  max-width: 1160px;
  margin: 0 auto 60px;
}
.welfare .training-area .flex .training-tlt {
  margin-top: -10px;
  margin-right: 60px;
}
.welfare .training-area .flex .training-tlt h2 {
  font-size: var(--fs38);
  font-weight: bold;
}
.welfare .training-area .flex .training-tlt .tlt-en {
  width: 86.82px;
}
.welfare .training-area .flex .read-txt {
  font-size: var(--fs16);
  line-height: 1.7;
}
.welfare .training-area .training-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-width: 1160px;
  margin: auto;
}
.welfare .training-area .training-flex figure {
  width: 30%;
  max-width: 360px;
}
.welfare .training-area .training-flex .r-box {
  width: 58.67%;
  margin-right: 3%;
}
.welfare .training-area .training-flex .r-box .list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 30px;
  padding-bottom: 20px;
  background-image: url(../img/welfare/training_repeat_border.svg);
  background-repeat: repeat-x;
  background-position: left bottom;
}
.welfare .training-area .training-flex .r-box .list h4 {
  width: 239px;
  font-size: var(--fs20);
  font-weight: bold;
  color: #ed7a42;
}
.welfare .training-area .training-flex .r-box .list p {
  width: 64%;
  font-size: var(--fs15);
  font-weight: 500;
  line-height: 1.9;
}

/* スマホ */
@media screen and (max-width: 767px) {
  .welfare .training-area .training-mark {
    right: 8%;
    width: 145.3px;
  }
  .welfare .training-area {
    padding-top: 50px;
    padding-bottom: 40px;
  }
  .welfare .training-area .inner {
    padding: 0 8%;
  }
  .welfare .training-area .flex {
    flex-direction: column;
    margin: 0 auto 50px;

    gap: 30px;
  }
  .welfare .training-area .flex .training-tlt h2 {
    font-size: var(--fs30);
  }
  .welfare .training-area .flex .training-tlt .tlt-en {
    width: 77.69px;
  }
  .welfare .training-area .flex .read-txt {
    font-size: var(--fs14);
  }
  .welfare .training-area .training-flex {
    flex-direction: column;

    gap: 40px;
  }
  .welfare .training-area .training-flex figure {
    width: 84.76%;
    margin: 0 auto;
  }
  .welfare .training-area .training-flex .r-box {
    width: 100%;
  }
  .welfare .training-area .training-flex .r-box .list {
    flex-direction: column;
    margin-bottom: 20px;
  }
  .welfare .training-area .training-flex .r-box .list h4 {
    margin-bottom: 15px;
    font-size: var(--fs18);
  }
  .welfare .training-area .training-flex .r-box .list p {
    width: 100%;
    margin-right: 0;
    font-size: var(--fs14);
  }
}