@charset "utf-8";

/*

  キャリアアッププラン

                      */

#hl-career-top {
  width: 488px;
  margin: 80px auto 40px;
}
#hl-career-top img {
  width: 100%;
}
#career-top p {
  font-size: 26px;
  color: #ec7980;
  line-height: 1.4;
  text-align: center;
}
#career-content1 {
  width: 100%;
  background-color: #fffeee;
}
#career-chart {
  width: 920px;
  margin: 100px auto 0;
  padding: 80px 0 140px;
}
p#chart-start {
  font-size: 44px;
  color: #ec7980;
  text-align: center;
  margin-bottom: 10px;
}
#step1 {
  width: 100%;
  padding: 20px 0;
  font-size: 36px;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step1-wrap {
  position: relative;
}
#step1 span {
  font-size: 72%;
}
#step1-img {
  width: 268px;
  position: absolute;
  left: 0;
  top: -210px;
}
#step1-img img {
  width: 100%;
}
#step1-shikaku {
  padding: 4px 8px;
  font-size: 24px;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 40px);
  bottom: -30px;
}
#step2 {
  width: 100%;
  padding: 20px 0;
  font-size: 36px;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step2 span {
  font-size: 72%;
}
#step2-wrap {
  position: relative;
}
#step2-nintei {
  position: absolute;
  font-size: 25.92px;
  top: 68px;
  right:80px;
  color: #333333;
}
#step2-shikaku {
  padding: 4px 8px;
  font-size: 24px;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 40px);
  bottom: -30px;
}
#step3 {
  width: 100%;
  padding: 20px 0;
  font-size: 36px;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step3 span {
  font-size: 72%;
}
#step3-wrap {
  position: relative;
}
#step3-nintei {
  position: absolute;
  font-size: 25.92px;
  top: 68px;
  right:80px;
  color: #333333;
}
#step3-shikaku {
  padding: 4px 8px;
  font-size: 24px;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 40px);
  bottom: -30px;
}
#step4 {
  width: 100%;
  padding: 20px 0;
  font-size: 36px;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
/*
#step4 span {
  font-size: 72%;
}
*/
#step4-wrap {
  position: relative;
}
#step4-works {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 36px;
  line-height: 1;
  color: #ec7980;
}
#step4-shikaku {
  padding: 4px 8px;
  font-size: 24px;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 40px);
  bottom: -30px;
}
#step5 {
  width: 100%;
  padding: 20px 0;
  font-size: 36px;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step5 span {
  font-size: 72%;
}
#step5-wrap {
  position: relative;
}
#step5-shikaku {
  padding: 4px 8px;
  font-size: 24px;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 40px);
  bottom: -30px;
}
#step5-nintei {
  white-space:nowrap;
  font-size: 20px;
  line-height: 1.1;
  color: #333333;
  position: absolute;
  left: calc(50% + 40px);
  bottom: -80px;
}
#step6 {
  width: 100%;
  padding: 20px 0;
  font-size: 36px;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step6 span {
  font-size: 72%;
}
#step6-wrap {
  position: relative;
}
#step6-shikaku {
  padding: 4px 8px;
  font-size: 24px;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 40px);
  bottom: -30px;
}
#step6-nintei {
  white-space:nowrap;
  font-size: 20px;
  line-height: 1.1;
  color: #333333;
  position: absolute;
  left: calc(50% + 40px);
  bottom: -80px;
}
#step7 {
  width: 100%;
  padding: 20px 0;
  font-size: 58px;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step7-wrap {
  position: relative;
}
#step7-img {
  width: 216px;
  position: absolute;
  right: 0;
  bottom: 0;
}
#step7-img img {
  width: 100%;
}
#chart-bunki {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.chart-bunki-l {
  width: 420px;
}
.chart-bunki-r {
  width: 420px;
  height: auto;
}
.chart-arrow {
  width: 39px;
  margin: 0 auto;
}
.chart-arrow img {
  width: 100%;
}
.chart-arrow2 {
  width: 539px;
  margin: 0 auto;
}
.chart-arrow2 img {
  width: 100%;
}
.chart-arrow5 {
  width: 39px;
  margin: 0 auto;
}
.chart-arrow5 img {
  width: 100%;
}

#career-content2 {
  width: 100%;
  padding: 200px 0;
}
#career-content2-hl {
  margin: 0 auto;
  position: relative;
}
#career-content2-hl h2 {
  font-size: 62px;
  color: #008e5f;
  letter-spacing: 0.2em;
  text-align: center;
}
#career-content2-hl-img1 {
  width: 187px;
  position:absolute;
  left: calc(50% - 400px);
  bottom: 0;
}
#career-content2-hl-img1 img {
  width: 100%;
}
#career-content2-hl-img2 {
  width: 290px;
  position:absolute;
  left: calc(50% + 100px);
  bottom: -20px;
}
#career-content2-hl-img2 img {
  width: 100%;
}
#career-support {
  width: 594px;
  margin: 0 auto 0;
}
.support-wrap {
  width: 100%;
  margin-top: 60px;
}
.support-num {
  font-size: 44px;
  color: #008e5f;
  line-height:1.5;
  text-align: center;
}
.support-wrap h3 {
  font-size: 35px;
  color: #008e5f;
  line-height: 1.2;
  text-align: center;
  margin-bottom: 20px;
}
.support-wrap p {
  font-size: 18px;
  line-height: 1.5;
  text-align: justify;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
}
/* ----------1280px以下---------- */

@media only screen and (max-width:1280px) {
  #hl-career-top {
  width: 38.125vw;
  margin: 6.25vw auto 3.125vw;
}
#hl-career-top img {
  width: 100%;
}
#career-top p {
  font-size: 2.03vw;
  color: #ec7980;
  line-height: 1.4;
  text-align: center;
}
#career-content1 {
  width: 100%;
  background-color: #fffeee;
}
#career-chart {
  width: 71.875vw;
  margin: 7.8125vw auto 0;
  padding: 6.25vw 0 10.9375vw;
}
p#chart-start {
  font-size: 3.43vw;
  color: #ec7980;
  text-align: center;
  margin-bottom: 0.78vw;
}
#step1 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 2.81vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step1-wrap {
  position: relative;
}
#step1 span {
  font-size: 72%;
}
#step1-img {
  width: 20.94vw;
  position: absolute;
  left: 0;
  top: -16.41vw;
}
#step1-img img {
  width: 100%;
}
#step1-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 1.88vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step2 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 2.81vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step2 span {
  font-size: 72%;
}
#step2-wrap {
  position: relative;
}
#step2-nintei {
  position: absolute;
  font-size: 2.025vw;
  top: 5.3125vw;
  right:6.25vw;
  color: #333333;
}
#step2-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 1.88vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step3 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 2.81vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step3 span {
  font-size: 72%;
}
#step3-wrap {
  position: relative;
}
#step3-nintei {
  position: absolute;
  font-size: 2.025vw;
  top: 5.3125vw;
  right:6.25vw;
  color: #333333;
}
#step3-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 1.88vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step4 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 2.81vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step4 span {
  font-size: 72%;
}
#step4-wrap {
  position: relative;
}
#step4-works {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 2.81vw;
  line-height: 1;
  color: #ec7980;
}
#step4-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 1.88vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step5 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 2.81vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step5 span {
  font-size: 72%;
}
#step5-wrap {
  position: relative;
}
#step5-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 1.88vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step5-nintei {
  white-space:nowrap;
  font-size: 1.56vw;
  line-height: 1.1;
  color: #333333;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -6.25vw;
}
#step6 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 2.81vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step6 span {
  font-size: 72%;
}
#step6-wrap {
  position: relative;
}
#step6-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 1.88vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step6-nintei {
  white-space:nowrap;
  font-size: 1.56vw;
  line-height: 1.1;
  color: #333333;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -6.25vw;
}
#step7 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 4.53vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step7-wrap {
  position: relative;
}
#step7-img {
  width: 16.88vw;
  position: absolute;
  right: 0;
  bottom: 0;
}
#step7-img img {
  width: 100%;
}
#chart-bunki {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.chart-bunki-l {
  width: 32.81vw;
}
.chart-bunki-r {
  width: 32.81vw;
  height: auto;
}
.chart-arrow {
  width: 3.05vw;
  margin: 0 auto;
}
.chart-arrow img {
  width: 100%;
}
.chart-arrow2 {
  width: 42.11vw;
  margin: 0 auto;
}
.chart-arrow2 img {
  width: 100%;
}
.chart-arrow5 {
  width: 3.05vw;
  margin: 0 auto;
}
.chart-arrow5 img {
  width: 100%;
}

#career-content2 {
  width: 100%;
  padding: 15.63vw 0;
}
#career-content2-hl {
  margin: 0 auto;
  position: relative;
}
#career-content2-hl h2 {
  font-size: 4.84vw;
  color: #008e5f;
  letter-spacing: 0.2em;
  text-align: center;
}
#career-content2-hl-img1 {
  width: 14.61vw;
  position:absolute;
  left: calc(50% - 31.25vw);
  bottom: 0;
}
#career-content2-hl-img1 img {
  width: 100%;
}
#career-content2-hl-img2 {
  width: 22.66vw;
  position:absolute;
  left: calc(50% + 7.81vw);
  bottom: -1.56vw;
}
#career-content2-hl-img2 img {
  width: 100%;
}
#career-support {
  width: 46.41vw;
  margin: 0 auto 0;
}
.support-wrap {
  width: 100%;
  margin-top: 4.69vw;
}
.support-num {
  font-size: 3.44vw;
  color: #008e5f;
  line-height:1.5;
  text-align: center;
}
.support-wrap h3 {
  font-size: 2.73vw;
  color: #008e5f;
  line-height: 1.2;
  text-align: center;
  margin-bottom: 1.56vw;
}
.support-wrap p {
  font-size: 1.41vw;
  line-height: 1.5;
  text-align: justify;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
}
  
}

/* ----------700px以下---------- */

@media only screen and (max-width:700px) {
#hl-career-top {
  width: 65vw;
  margin: 6.25vw auto 3.125vw;
}
#hl-career-top img {
  width: 100%;
}
#career-top p {
  font-size: 3.5vw;
  color: #ec7980;
  line-height: 1.4;
  text-align: center;
}
#career-content1 {
  width: 100%;
  background-color: #fffeee;
}
#career-chart {
  /*
  width: 71.875vw;
  */
  width: 90%;
  margin: 10vw auto 0;
  padding: 6.25vw 0 10.9375vw;
}
p#chart-start {
  font-size: 4vw;
  color: #ec7980;
  text-align: center;
  margin-bottom: 0.78vw;
}
#step1 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 4.5vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step1-wrap {
  position: relative;
}
#step1 span {
  font-size: 72%;
}
#step1-img {
  width: 26vw;
  position: absolute;
  left: 0;
  top: -20vw;
}
#step1-img img {
  width: 100%;
}
#step1-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 2.5vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step2 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 4.5vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step2 span {
  font-size: 72%;
  position: relative;
}
#step2-wrap {
  position: relative;
}
#step2-nintei {
  position: absolute;
  font-size: 2.8vw;
  top: 8.1vw;
  right:2vw;
  color: #333333;
}
#step2-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 2.5vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step3 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 4.5vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step3 span {
  font-size: 72%;
}
#step3-wrap {
  position: relative;
}
#step3-nintei {
  position: absolute;
  font-size: 2.8vw;
  top: 8.1vw;
  right: 2vw;
  color: #333333;
}
#step3-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 2.5vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step4 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 4.5vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step4 span {
  font-size: 72%;
}
#step4-wrap {
  position: relative;
}
#step4-works {
  position: absolute;
  width: 100%;
  text-align: center;
  top: 50%;
  /*left: 50%;*/
  transform: translate(-50%, -50%);
  font-size: 4.5vw;
  line-height: 1;
  color: #ec7980;
}
#step4-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 3vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -3.4vw;
}
#step5 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 4.5vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step5 span {
  font-size: 72%;
}
#step5-wrap {
  position: relative;
}
#step5-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 2.5vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step5-nintei {
  white-space:nowrap;
  font-size: 2.2vw;
  line-height: 1.1;
  color: #333333;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -8vw;
}
#step6 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 4.5vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step6 span {
  font-size: 72%;
}
#step6-wrap {
  position: relative;
}
#step6-shikaku {
  padding: 0.31vw 0.63vw;
  font-size: 2.5vw;
  color: #ffffff;
  background-color: #ec7980;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -2.34vw;
}
#step6-nintei {
  white-space:nowrap;
  font-size: 2.2vw;
  line-height: 1.1;
  color: #333333;
  position: absolute;
  left: calc(50% + 3.13vw);
  bottom: -8vw;
}
#step7 {
  width: 100%;
  padding: 1.56vw 0;
  font-size: 6.5vw;
  line-height: 1;
  color: #ec7980;
  text-align: center;
  background-color: #ffffff;
  border: solid 3px #ec7980;
}
#step7-wrap {
  position: relative;
}
#step7-img {
  width: 20vw;
  position: absolute;
  right: 0;
  bottom: 0;
}
#step7-img img {
  width: 100%;
}
#chart-bunki {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.chart-bunki-l {
  width: 43vw;
}
.chart-bunki-r {
  width: 43vw;
  height: auto;
}
.chart-arrow {
  width: 3.05vw;
  margin: 0 auto;
}
.chart-arrow img {
  width: 100%;
}
.chart-arrow2 {
  width: 42.11vw;
  margin: 0 auto;
}
.chart-arrow2 img {
  width: 100%;
}
.chart-arrow5 {
  width: 3.05vw;
  margin: 0 auto;
}
.chart-arrow5 img {
  width: 100%;
}

#career-content2 {
  width: 100%;
  padding: 15.63vw 0;
}
#career-content2-hl {
  margin: 0 auto;
  position: relative;
}
#career-content2-hl h2 {
  font-size: 7vw;
  color: #008e5f;
  letter-spacing: 0.2em;
  text-align: center;
}
#career-content2-hl-img1 {
  width: 18vw;
  position:absolute;
  left: calc(50% - 43vw);
  bottom: 0;
}
#career-content2-hl-img1 img {
  width: 100%;
}
#career-content2-hl-img2 {
  width: 30vw;
  position:absolute;
  left: calc(50% + 8vw);
  bottom: -1.56vw;
}
#career-content2-hl-img2 img {
  width: 100%;
}
#career-support {
  width: 90vw;
  margin: 0 auto 0;
}
.support-wrap {
  width: 100%;
  margin-top: 4.69vw;
}
.support-num {
  font-size: 5vw;
  color: #008e5f;
  line-height:1.5;
  text-align: center;
}
.support-wrap h3 {
  font-size: 6vw;
  color: #008e5f;
  line-height: 1.2;
  text-align: center;
  margin-bottom: 1.56vw;
}
.support-wrap p {
  font-size: 3.5vw;
  line-height: 1.5;
  text-align: justify;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
}

}