@charset "UTF-8";
/* -----------------------------
    CONTENTS
-------------------------------*/
#contents > div {
  position: relative;
  z-index: 1;
  background-color: var(--color-base);
}
.contentsInner {
  padding: 104px 24px 0 24px;
}
.contentsInner h2.nowrap {
  white-space: nowrap;
}

/* Main Visual    -------------*/

.mainVis .fadeinText span {
  opacity: 0;
  transform: translateY(40px);
  transition: 1.4s;
  -webkit-filter: blur(15px);
  -moz-filter: blur(15px);
  -ms-filter: blur(15px);
  -o-filter: blur(15px);
  filter: blur(15px);
  animation-timing-function: var(--easing);
}
.mainVis.is-loaded .fadeinText span {
  opacity: 1;
  transform: translateY(0);
  -webkit-filter: blur(0px) ;
  -moz-filter: blur(0px);
  -ms-filter: blur(0px);
  -o-filter: blur(0px);
  filter: blur(0px);
}
.mainVis.is-loaded .fadeinText .text_u {
  transition-delay: .4s;
}
.mainVis.is-loaded .fadeinText .text_dot {
  transition-delay: .8s;
}
.mainVis.is-loaded .fadeinText .text_is {
  transition-delay: 1.2s;
}
.mainVis.is-loaded .fadeinText .text_you {
  transition-delay: 1.6s;
}
.mainVis.is-loaded .copyTxt {
  transition-delay: 2.2s;
}
.fadeinText {
  position: absolute;
  z-index: 2;
  width: 100vw;
  height: 100vh;
}
.fadeinText .text_u {
  font-family: 'RobotoU', sans-serif;
  font-size: 480px;
  color: transparent;
  position: absolute;
  top: 94px;
  left: -50px;
  line-height: 0.625;
  letter-spacing: var(--letter-spacing);
  -webkit-text-stroke: 2px rgba(255, 255, 255, 0.65);
  text-stroke: 2px rgba(255, 255, 255, 0.65);
}
.fadeinText .text_dot {
  position: absolute;
  top: 406px;
  left: 239px;
  background-color: var(--color-theme);
  width: 25px;
  height: 25px;
  border-radius: 20px;
}
.fadeinText .text_is,
.fadeinText .text_you {
  font-family: var(--font-Roboto);
  font-weight: 500;
  font-size: 58px;
  letter-spacing: var(--letter-spacing);
  line-height: 0.862;
  position: absolute;
  top: 451px;
}
.fadeinText .text_is {
  left: 30px;
}
.fadeinText .text_you {
  left: 110px;
}
.mainVis .copyTxt {
  position: absolute;
  top: 529px;
  left: 24px;
  font-family: var(--font-Zen);
  letter-spacing: var(--letter-spacing);
  font-weight: 700;
  font-size: 24px;
  width: calc(100vw - 24px);
  text-align: left;
  line-height: 1.4;
}
.l-inner {
  position: relative;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 10rem;
}

.l-section .l-inner {
  padding-top: 8rem;
  padding-bottom: 8rem;
}

[class*=swiper]:focus {
  outline: none;
}

.slide-media {
  position: relative;
  overflow: hidden;
}
.slide-media img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.mv01 {
  margin-bottom: 16rem;
}
.mv01 .l-inner {
  padding-bottom: 0;
}
.mv01 .swiper-fade .swiper-slide {
  -webkit-transition-property: opacity, -webkit-transform !important;
  transition-property: opacity, -webkit-transform !important;
  transition-property: opacity, transform !important;
  transition-property: opacity, transform, -webkit-transform !important;
  pointer-events: none;
}
.mv01 .swiper-fade .swiper-slide-active {
  pointer-events: auto;
}
.mv01 .slide-media {
  height: 800px;
}
.mv01 .slide-media img {
  -webkit-transition: 5s 1s ease-out;
  transition: 5s 1s ease-out;
}
.mv01 .swiper-slide[class*=-active] .slide-media img {
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}

@-webkit-keyframes mv01-fadeIn {
  0% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
    opacity: 0;
    -webkit-filter: blur(300px);
            filter: blur(300px);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
    -webkit-filter: blur(0);
            filter: blur(0);
  }
}

@keyframes mv01-fadeIn {
  0% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
    opacity: 0;
    -webkit-filter: blur(300px);
            filter: blur(300px);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
    -webkit-filter: blur(0);
            filter: blur(0);
  }
}

@media only screen and (max-width: 1024px) {
  html {
    -webkit-text-size-adjust: 100%;
  }
  .l-inner {
    padding: 0 4rem;
  }
  .pc {
    display: none !important;
  }
  .mv01 {
    margin-bottom: 8rem;
  }
  .mv01 .slide-media {
    height: 480px;
  }
}

.mv01 .swiper-slide .img01 img {
  object-position: top center;
}
.mv01 .swiper-slide .img02 img {
  height: 113.92%;
  object-position: top -53px left calc(50vw - 432px);
}
.mv01 .swiper-slide .img03 img {
  height: 105%;
  object-position: top -12px left calc(50vw - 300px);
}

.lineWrap {
  padding-top: 28px;
  text-align: center;
  background-color: transparent !important;
}
.lineWrap span {
  display: block;
  margin: 0 auto;
  width: 1px;
  height: 80px;
  background: var(--color-black);
}
/* service     -------------*/
.service {
  padding-top: 64px;
}
.service .serviceList {
  text-align: left;
}
.serviceList li {
  margin-bottom: 56px;
}
.serviceList li:last-child {
  margin-bottom: 0;
}
.serviceList li h3 {
  padding-top: 27px;
  font-family: var(--font-Zen);
  font-size: var(--fontsize-service-heading);
  letter-spacing: var(--letter-spacing);
  line-height: 1.5;
  display: inline-block;
  position: relative;
  margin-bottom: 32px;
}
.serviceList li h3::before {
  counter-increment: cnt;
  content: counter(cnt, decimal-leading-zero);
  color: var(--color-theme);
  font-family: var(--font-Roboto);
  font-weight: bold;
  font-size: var(--fontsize-heading-min);
  line-height: 1.5;
  position: absolute;
  top: 0;
  left: 0;
}
.serviceList li h3::after {
  position: absolute;
  content: '';
  right: -18px;
  bottom: 0;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: var(--color-theme);
}
.serviceList .imgWarp {
  text-align: center;
}
.serviceList li img {
  width: 100%;
  max-width: 375px;
  height: auto;
  margin-bottom: 24px;
}

/* people     -------------*/
.people {
  padding-bottom: 32px;
}
.peopleMain {
  margin: 0 -24px;
  position: relative;
}
.peopleMain p,
.peopleMain .btnWrap {
  position: absolute;
  width: 100%;
  text-align: center;
}
.peopleMain .btnWrap {
  bottom: -32px;
}
.peopleMain img {
  margin: 0 -24px;
}

/* company     -------------*/
.company .basicTxt {
  margin-bottom: 24px;
}
.company .imgWrap {
  position: relative;
  width: 89.6vw;
  max-width: 430px;
  margin: 0 auto;
}
.company .imgWrap span {
  position: absolute;
  z-index: -1;
  font-family: var(--font-Roboto);
}
.company .imgWrap .txt5 {
  font-size: 70px;
  font-weight: 700;
  top: 115px;
  left: 15px;
  opacity: 0.2;
}
.company .imgWrap .txtU {
  font-size: 400px;
  font-weight: 500;
  top: 62px;
  left: -100px;
  opacity: 0.2;
  color: var(--color-theme);
  line-height: 0.75;
}
.company .imgWrap .txt241 {
  font-size: 140px;
  font-weight: 700;
  top: -38px;
  right: -46px;
  opacity: 0.3;
  color: var(--color-base);
}
.company .imgWrap .imgFit {
  width: 89.6vw;
  height: 300px;
  border-radius: 8px;
  overflow: hidden;
  margin: 0 0 24px 36px;
  position: relative;
  z-index: -2;
}
.company .imgWrap .imgFit img {
  display: block;
  width: 100%;
  height: auto;
}

/* work environment     -------------*/
.workEnv {
  margin-bottom: 104px;
}
.workEnv p {
  margin-bottom: 24px;
}
.workEnv .innerSlide.swiper {
  width: 100vw;
  height: 200px;
  margin-left: -24px;
  margin-bottom: 24px;
}
.workEnv .innerSlide.swiper .swiper-wrapper {
  transition-timing-function: linear !important;
}
.workEnv .innerSlide.swiper .slideWrap div {
  width: 200px;
  height: 200px;
  border-radius: 8px;
  overflow: hidden;
}
.workEnv .innerSlide.swiper .slideWrap div + div {
  margin-left: 8px;
}
.workEnv .innerSlide.swiper .slideWrap div img {
  width: 100%;
  height: 100%;
}

.alighLeft {
  text-align: left;
}

/* recruitment     -------------*/
.contentsInnerWrap {
  padding-bottom: 288px;
}
.recruitment {
  background: linear-gradient(to bottom, transparent 50%, var(--color-theme-darken) 50%);
  color: var(--color-base);
  position: relative;
  overflow: hidden;
  padding-top: 56px;
}
.circleBg {
  position: absolute;
  z-index: 0;
  width: 176vw;
  background: var(--color-theme-darken);
  content: '';
  height: 176vw;
  top: 0;
  border-radius: 50% 50% 0 0;
  z-index: -1;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
.recruitment h2 {
  margin-bottom: 48px;
}
.recruitment .basicTxt {
  margin-bottom: 29px;
}
.recruitment .imgWarp {
  width: 100%;
  max-width: 327px;
  height: 218px;
  border-radius: 8px;
  overflow: hidden;
  margin: 0 auto 24px auto;
}
.recruitment .imgWarp img {
  display: block;
  object-fit: cover;
  object-position: -112px -70px;
}
.recruitment .btnWrap + .basicTxt {
  margin-bottom: 24px;
}
.recruitment .pcImgWrap + .btnWrap {
  margin-bottom: 56px;
}
.recruitment .guidelineInner {
  background: url('../img/guideline_bg.png') repeat-x;
  background-size: 375px auto;
  background-position: bottom left;
  padding: 0 24px 120px 24px;
  margin: 0 -24px;
}
.entryBlock {
  position: absolute;
  width: calc(100% - 48px);
  bottom: 106px;
  left: 50%;
  border-radius: 8px;
  -webkit-box-shadow: var(--box-shadow);
  box-shadow: var(--box-shadow);
  background: var(--color-base);
  padding: 40px 0;
  max-width: 800px;
}
.entryBlock .ereaTxt {
  font-family: var(--font-Zen);
  font-weight: 700;
  text-align: center;
  font-size: var(--fontsize-basic);
  line-height: 1.5;
  letter-spacing: var(--letter-spacing);
  margin-bottom: 24px;
}
.sa.entryBlock {
  transform: translate3d(-50%,2.0rem,0) rotate(0.001deg);
}
.sa.show.entryBlock {
  -webkit-transform: translate3d(-50%,0,0) rotate(.001deg) ;
  transform: translate3d(-50%,0,0) rotate(.001deg);
}