@charset "UTF-8";

/*
// career.css
*/

.career{
  overflow: hidden;
}

.career .common__line{
  top: 183.5rem;
}


/* kv */

.career__kv{
  margin: 0 0 19rem;
}
.career__kv .common__pages__kv__text{
  margin: 0 0 5rem 7.5rem;
}


/* step */

.career__step{
  margin: 0 0 19.5rem;
}
.career__step .common__pages__section-title{
  margin: 0 auto 17rem;
}
.career__step__list-wrap{
  
}
.career__step__list{
  background: rgba(255,255,255,0.9);
  border:0.2rem solid #aec6cf;
  margin: 0 auto 12rem;
  opacity: 0;
  padding: 6rem 0 0;
  position: relative;
  transform: translateY(10rem);
  transition: 1s;
  transition-delay: .5s;
  width: 100%;
}
.career__step__list.active{
  opacity: 1;
  transform: translateY(0);
}
.career__step__list--01{
  height: 54.6rem;
  margin: 0 0 18.5rem;
}
.career__step__list--01:after{
  background: url("../img/career/career__step__list career__step__list__arrow.svg") no-repeat center/100% auto;
  bottom: -13.6rem;
  content:'';
  height: 8.1rem;
  left:50%;
  position: absolute;
  transform: translateX(-42%);
  width: 21.73013rem;
}
.career__step__list--02{
  height: 59.1rem;
}
.career__step__list__title{
  margin: 0 auto 3rem;
  position: relative;
}
.career__step__list__title__icon{
  left: 5rem;
  position: absolute;
  top: -18.5rem;
  width:23.2rem;
}
.career__step__list__title__text{
  font-size:4rem;
  font-weight: normal;
  text-align: center;
}
.career__step__list__item{
 
}
.career__step__list__item__text{
  font-size:2.8rem;
  line-height: 1.4;
  margin: 0 auto 4.5rem;
  text-align: center;
}
.career__step__list__item__image{
  left: 10.5rem;
  position: absolute;
  top: 21.5rem;
  width:45rem;
}
.career__step__list--02 .career__step__list__item__image{
  top: 25.5rem;
}
.career__step__list__item__note{
  font-size:2.4rem;
  line-height: 1.6;
  margin: 0 0 0 59rem;
}
.career__step__list__item__note__elm{
  display: inline-block;
  margin: 1rem 0 0;
}


/* model */

.career__model{
  margin: 0 0 17rem;
}
.career__model .common__pages__section-title{
  margin: 0 auto 6rem;
}
.career__model__example{
  background: #e4ecef;
  opacity: 0;
  transform: translateY(10rem);
  transition: 1s;
  transition-delay: .5s;
  padding: 6rem 0 0;
}
.career__model__example.active{
  opacity: 1;
  transform: translateY(0);
}
.career__model__example__title{
  font-size:3.2rem;
  margin: 0 0 1.5rem;
  text-align: center;
}
.career__model__example__text{
  font-size:2.4rem;
  margin: 0 0 0.5rem;
  text-align: center;
}
.career__model__example__chart{
  width: 100%;
}


/* skils */

.business__skils{
  margin: 0 0 17rem;
}
.business__skils .common__pages__section-title{
  margin: 0 auto 5.5rem;
}
.business__skils__list--wrap{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: auto;
  width: 85.8rem;
}
.business__skils__list{
  align-items: center;
  background: #fff;
  border:1px solid #42a0d9;
  display: flex;
  flex-direction: column;
  height: 14.2rem;
  justify-content: center;
  margin: 0 0 3.5rem;
  opacity: 0;
  overflow: hidden;
  position: relative;
  text-align: center;
  width: 41.4rem;
}
.business__skils__list:after{
  background: #42a0d9;
  content:'';
  height: 3.4rem;
  left:-1.7rem;
  position: absolute;
  top:-1.7rem;
  transform: rotate(45deg);
  width: 3.4rem;
}
.business__skils__list.active{
  opacity: 1;
}
.business__skils__list__title{
  font-size:3.1rem;
  font-weight: normal;
  margin: 0 0 1rem;
}
.business__skils__list__text{
  font-size:1.8rem;
}


/* flow */

.career__flow{
  margin: 0 0 15rem;
}
.career__flow__list-wrap{
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
  margin: 0 0 6.5rem;
  width: 100%;
}
.career__flow__list{
  opacity: 0;
  width: 33rem;
}
.career__flow__list.active{
  opacity: 1;
}
.career__flow__list__title{
  align-items: center;
  background: linear-gradient(180deg,#a8d8d8,#42a0d9);
  border-radius: 50%;
  display: flex;
  font-size:3.2rem;
  height: 33rem;
  justify-content: center;
  margin: 0 0 1.5rem;
  padding: 0 0 0.5em;
  position: relative;
  text-align: center;
  width: 33rem;
}
.career__flow__list__title:after{
  background: url("../img/career/career__flow__list__arrow--pc.svg") no-repeat center/100% auto;
  content:'';
  height: 1.79356rem; 
  position: absolute;
  right: -4.2rem;
  top: 14rem;
  width: 8.49663rem;
}
.career__flow__list:last-child .career__flow__list__title:after{
  content:none;
}
.career__flow__list__text{
  margin: auto;
  width: 27rem;
}
.career__flow__list__text__title{
  font-size:2.8rem;
  font-weight: normal;
  margin: 0 0 1.5rem;
  text-align: center;
}
.career__flow__list__text__description{
  font-size:2rem;
  line-height: 1.5;
  text-align: justify;
}
.career__flow__list__footnote{
  font-size:1.6rem;
  margin: 0 0 0 3rem;
}


/* support */

.career__support{
  margin: 0 0 14rem;
}
.career__support__list-wrap{
  display: flex;
  justify-content: space-between;
  margin: auto;
  width: 93.6rem;
}
.career__support__list{
  opacity: 0;
  transform: translateY(10rem);
  transition: 1s;
  transition-delay: .5s;
  width: 44.4rem;
}
.career__support__list.active{
  opacity: 1;
  transform: translateY(0);
}
.career__support__list__image{
  margin: 0 0 1.5rem;
}
.career__support__list__title{
  font-size:2.6rem;
  font-weight: normal;
  margin: 0 0 1rem;
}
.career__support__list__text{
  font-size:2rem;
  text-align: justify;
}


/* subpage-footer */

.career .subpage-footer__obj{
  left: -129rem;
}



@media screen and (max-width:767px) {
  .career .common__line{
    top: 238rem;
  }

  .design{
    background: url("https://recruit.a-l-c.jp/wp-content/themes/alc/img/career/career--sp.png") no-repeat top center/75rem auto;
    height: 954.4rem;
    left:0;
    opacity: 0.5;
    position: absolute;
    max-width: 75rem;
    min-width: auto;
    top:0;
    transform: translateX(0%);
    z-index: -1;
  }
  
  
  /* kv */

  .career__kv{
    margin: 0 0 18.5rem;
  }
  .career__kv .common__pages__kv__text{
    margin: 0 0 3rem 7.5rem;
  }


  /* step */

  .career__step{
    margin: 0 0 20rem;
  }
  .career__step .common__pages__section-title{
    margin: 0 auto 19rem;
  }
  .career__step__list-wrap{

  }
  .career__step__list{
    background: rgba(255,255,255,0.5);
    border:0.2rem solid #aec6cf;
    margin: 0 auto 12rem;
    padding: 10.5rem 0 5rem;
    position: relative;
    width: 68.7rem;
  }
  .career__step__list--01{
    height: auto;
    margin: 0 auto 31rem;
  }
  .career__step__list--01:after{
    bottom: -11.6rem;
    transform: translateX(-50%);
  }
  .career__step__list--02{
    height: auto;
  }
  .career__step__list__title{
    margin: 0 auto 2.5rem;
  }
  .career__step__list--02 .career__step__list__title{
    margin: 1rem auto 3rem;
  }
  .career__step__list__title__icon{
    left: 50%;
    top: -26rem;
    transform: translateX(-50%);
  }
  .career__step__list__title__text{
    font-size:4rem;
    font-weight: normal;
    text-align: center;
  }
  .career__step__list__item{

  }
  .career__step__list__item__text{
    font-size:2.8rem;
    margin: 0 auto 2.5rem;
  }
  .career__step__list--02 .career__step__list__item__text{
    line-height: 1.5;
  }
  .career__step__list__item__image{
    margin: 0 auto 1.5rem;
    position: static;
    width:60.6rem;
  }
  .career__step__list__item__note{
    font-size:2.4rem;
    line-height: 1.6;
    margin: 0 auto 0;
    width:60.6rem;
  }
  .career__step__list__item__note .sp_only{
    display: inline-block !important;
  }
  .career__step__list__item__note__elm{
    margin: 0;
  }


  /* model */

  .career__model{
    margin: 0 0 18.5rem;
  }
  .career__model .common__pages__section-title{
    margin: 0 auto 5rem;
  }
  .career__model__example{
    /*background: #e4ecef;*/
    padding: 5rem 0 10rem;
  }
  .career__model__example__title{
    font-size:3.8rem;
    margin: 0 0 2.5rem;
    text-align: center;
  }
  .career__model__example__text{
    font-size:2.7rem;
    line-height: 1.4;
    margin: 0 0 4rem;
  }
  .career__model__example__chart{
    width: 100%;
  }
  .career__model__example__chart .splide__track{
    margin: auto;
    width: 68.7rem;
  }
  .career__model__example__chart__arrow--prev,
  .career__model__example__chart__arrow--next{
    height: 5.3rem;
    top: 53.5rem;
    width: 1.83597rem;
  }
  .career__model__example__chart__arrow--prev{
    background: url("../img/career/career__model__example__chart__arrow_prev.svg") no-repeat center/100% auto;
    left: 6rem;
  }
  .career__model__example__chart__arrow--next{
    background: url("../img/career/career__model__example__chart__arrow_next.svg") no-repeat center/100% auto;
    right: 6rem;
  }
  .career__model__example__chart__arrow--prev svg,
  .career__model__example__chart__arrow--next svg{
    display: none;
  }
  .career__model__example__chart__pagination{
    bottom:-4.5rem;
  }
  .career__model__example__chart__pagination .splide__pagination__page{
    background: #fff;
    margin: 0.55rem;
    height: 1.6rem;
    width: 1.6rem;
  }
  .career__model__example__chart__pagination .splide__pagination__page.is-active{
    background: #42a0d9;
    transform: scale(1);
  }


  /* skils */

  .business__skils{
    margin: 0 0 15rem;
  }
  .business__skils .common__pages__section-title{
    margin: 0 auto 5.5rem;
  }
  .business__skils__list--wrap{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: auto;
    width: 62.55157rem;
  }

  .business__skils__list{
    height: 21.54368rem;
    margin: 0 0 2.5rem;
    width: 100%;
  }
  .business__skils__list:after{
    background: #42a0d9;
    content:'';
    height: 5.1rem;
    left:-2.6rem;
    position: absolute;
    top:-2.6rem;
    transform: rotate(45deg);
    width: 5.1rem;
  }
  .business__skils__list__title{
    font-size:4.68109rem;
    margin: 0 0 1.5rem;
  }
  .business__skils__list__text{
    font-size:2.71805rem;
  }


  /* flow */

  .career__flow{
    margin: 0 0 11.5rem;
  }
  .career__flow .common__pages__section-title{
    margin: 0 auto 6.5rem;
  }
  .career__flow__list-wrap{
    display: block;
    margin: 0 0 3rem;
    width: 100%;
  }
  .career__flow__list{
    margin: 0 0 14.5rem;
    position: relative;
    width: 100%;
  }
  .career__flow__list:after{
    background: url("../img/career/career__flow__list__arrow--sp.svg") no-repeat center/100% auto;
    bottom: -13rem;
    content:'';
    height: 10.19599rem; 
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 2.15228rem;
  }
  .career__flow__list:last-child{
    margin: 0;
  }
  .career__flow__list:last-child:after{
    content:none;
  }
  .career__flow__list__title{
    font-size:4.5rem;
    height: 39.5rem;
    margin: 0 auto 1.5rem;
    padding: 0 0 0.5em;
    width: 39.5rem;
  }
  .career__flow__list__title:after{
    content:none;
  }
  .career__flow__list__text{
    width: 100%;
  }
  .career__flow__list__text__title{
    font-size:3.8rem;
    font-weight: normal;
    margin: 0 0 1.5rem;
    text-align: center;
  }
  .career__flow__list__text__description{
    font-size:2.8rem;
    line-height: 1.5;
    text-align: center
  }
  .career__flow__list__footnote{
    font-size:2rem;
    margin: 0;
    text-align: center;
  }


  /* support */

  .career__support{
    margin: 0 0 9.5rem;
  }
  .career__support__list-wrap{
    display: block;
    margin: auto;
    width: 60.4rem;
  }
  .career__support__list{
    margin: 0 0 9.5rem;
    width: 100%;
  }
  .career__support__list:last-child{
    margin: 0;
  }
  .career__support__list__image{
    margin: 0 0 1.5rem;
  }
  .career__support__list__title{
    font-size:3.8rem;
    margin: 0 0 1.5rem;
  }
  .career__support__list__text{
    font-size:2.8rem;
  }


  /* subpage-footer s*/

  .career .subpage-footer__obj{
    left: -7rem;
  }
}