@-webkit-keyframes blink_animation {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink_animation {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

:root {
  --photo-content: 8;
  --slider-time: calc(4s * var(--photo-content));
  --slider-delay: calc(var(--slider-time) / var(--photo-content));
  --photo-angle:calc(0.56deg + .205deg * var(--photo-content));
}

.box1 .box-picarea {
  max-width: inherit;
  height: 31.2vw;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -o-transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1), -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -webkit-transform: translateY(5em);
      -ms-transform: translateY(5em);
          transform: translateY(5em);
  opacity: 0;
}

.box1 .box-picarea.show {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}

.box1 .photo-slider {
  display: grid;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.box1 .photo-slider__pic {
  width: 16.25vw;
  overflow: hidden;
  border-radius: 1.25vw;
  grid-area: 1/1/-1/-1;
  -webkit-transform-origin: center 1500%;
      -ms-transform-origin: center 1500%;
          transform-origin: center 1500%;
  pointer-events: none;
  -webkit-animation: slider var(--slider-time) linear infinite calc(var(--slider-delay) * var(--index) - var(--slider-time));
          animation: slider var(--slider-time) linear infinite calc(var(--slider-delay) * var(--index) - var(--slider-time));
}

.box1 .photo-slider__pic img {
  display: block;
}

@-webkit-keyframes slider {
  0% {
    -webkit-transform: rotate(calc( var(--photo-angle) * var(--photo-content)));
            transform: rotate(calc( var(--photo-angle) * var(--photo-content)));
  }
  100% {
    -webkit-transform: rotate(-10.65deg);
            transform: rotate(-10.65deg);
  }
}

@keyframes slider {
  0% {
    -webkit-transform: rotate(calc( var(--photo-angle) * var(--photo-content)));
            transform: rotate(calc( var(--photo-angle) * var(--photo-content)));
  }
  100% {
    -webkit-transform: rotate(-10.65deg);
            transform: rotate(-10.65deg);
  }
}

.box-title {
  margin-bottom: 5.5vw;
}

.box-title__main {
  font-size: 2.5vw;
  font-weight: bold;
  margin-bottom: 1.1vw;
  line-height: 1.1;
}

.box-title__sub {
  font-size: .875vw;
  font-weight: bold;
}

.box2 {
  margin-bottom: 12.5vw;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -o-transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1), -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -webkit-transform: translateY(5em);
      -ms-transform: translateY(5em);
          transform: translateY(5em);
  opacity: 0;
}

.box2.show {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}

.box2 .box-textarea {
  width: 66.6667%;
  margin: 0 auto 3.5vw;
}

.box2 .box-textarea .message-catch {
  font-size: 2.5vw;
  font-weight: bold;
  margin-bottom: 2.75vw;
}

.box2 .box-textarea .message-text p {
  font-size: 1.41vw;
  overflow: hidden;
}

.box2 .box-textarea .message-text p.show span {
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
}

.box2 .box-textarea .message-text p.show span::after {
  -webkit-transform: translateX(50vw);
      -ms-transform: translateX(50vw);
          transform: translateX(50vw);
}

.box2 .box-textarea .message-text p span {
  overflow: hidden;
  display: inline-block;
  padding: 0 .5vw;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#FF6B35), to(#FF6B35));
  background-image: -o-linear-gradient(#FF6B35 0%, #FF6B35 100%);
  background-image: linear-gradient(#FF6B35 0%, #FF6B35 100%);
  background-repeat: no-repeat;
  background-size: 100% 70%;
  background-position: 0% center;
  line-height: 2.15;
  position: relative;
  -webkit-transform: translateX(-50vw);
      -ms-transform: translateX(-50vw);
          transform: translateX(-50vw);
  -webkit-transition: -webkit-transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.1s * var(--index));
  transition: -webkit-transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.1s * var(--index));
  -o-transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.1s * var(--index));
  transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.1s * var(--index));
  transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.1s * var(--index)), -webkit-transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.1s * var(--index));
}

.box2 .box-textarea .message-text p span::after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#FF6B35), to(#FF6B35));
  background-image: -o-linear-gradient(#FF6B35 0%, #FF6B35 100%);
  background-image: linear-gradient(#FF6B35 0%, #FF6B35 100%);
  background-repeat: no-repeat;
  background-size: 100% 70%;
  background-position: 0% center;
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
  -webkit-transition: -webkit-transform 2s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.2s * var(--index) + 1s);
  transition: -webkit-transform 2s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.2s * var(--index) + 1s);
  -o-transition: transform 2s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.2s * var(--index) + 1s);
  transition: transform 2s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.2s * var(--index) + 1s);
  transition: transform 2s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.2s * var(--index) + 1s), -webkit-transform 2s cubic-bezier(0.22, 0.61, 0.36, 1) calc(.2s * var(--index) + 1s);
}

.box2 .box-textarea .message-text p span.list::before {
  content: '\30fb';
  display: inline-block;
  margin-right: .2em;
}

.box2 .box-textarea .message-text p span.list-second {
  padding-left: 1em;
}

.box2 .box-textarea .message-text p + p {
  margin-top: 2vw;
}

.box2 .box-picarea {
  margin-right: -6.24em;
  margin-top: -25vw;
  z-index: -1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.box2 .box-picarea__pic {
  width: 87.5vw;
  overflow: hidden;
  border-radius: 2.5vw 0 0 2.5vw;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -o-transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1), -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -webkit-transform: translateY(5em);
      -ms-transform: translateY(5em);
          transform: translateY(5em);
  opacity: 0;
}

.box2 .box-picarea__pic.show {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}

.box2 .box-picarea__pic img {
  display: block;
}

.box3 {
  margin-bottom: 12.5vw;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -o-transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1), -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -webkit-transform: translateY(5em);
      -ms-transform: translateY(5em);
          transform: translateY(5em);
  opacity: 0;
}

.box3.show {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}

.box3 .box-content {
  width: 66.66%;
  margin: 0 auto;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -o-transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1), -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -webkit-transform: translateY(5em);
      -ms-transform: translateY(5em);
          transform: translateY(5em);
  opacity: 0;
}

.box3 .box-content.show {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}

.box3 .position-itme {
  border-bottom: 1px solid #d8d8d8;
  padding: 2.5vw 0;
  font-size: 1vw;
}

.box3 .position-itme:first-of-type {
  border-top: 1px solid #d8d8d8;
}

.box4 {
  margin-bottom: 12.5vw;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -o-transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1), -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -webkit-transform: translateY(5em);
      -ms-transform: translateY(5em);
          transform: translateY(5em);
  opacity: 0;
}

.box4.show {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}

.box4 .box-content {
  width: 66.66%;
  margin: 0 auto;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -o-transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1), -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -webkit-transform: translateY(5em);
      -ms-transform: translateY(5em);
          transform: translateY(5em);
  opacity: 0;
}

.box4 .box-content.show {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}

.box4 .dl-innier {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  font-size: 1vw;
}

.box4 .dl-innier dt {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 27.5%;
      -ms-flex: 0 0 27.5%;
          flex: 0 0 27.5%;
  border-bottom: 1px solid #000;
  font-weight: bold;
}

.box4 .dl-innier dd {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 72.5%;
      -ms-flex: 0 0 72.5%;
          flex: 0 0 72.5%;
  border-bottom: 1px solid #d8d8d8;
  line-height: 1.87;
  padding: 2.1vw 0;
}

.box5 {
  margin-bottom: 12.5vw;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -o-transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1), -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -webkit-transform: translateY(5em);
      -ms-transform: translateY(5em);
          transform: translateY(5em);
  opacity: 0;
}

.box5.show {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}

.box5 .box-content {
  width: 66.66%;
  margin: 0 auto;
}

.box5 .box-content.show .methods-pic {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}

.box5 .box-content.show .methods-list {
  grid-template-rows: repeat(5, var(--methodsH));
  row-gap: 3.75vw;
}

.box5 .box-content.show .dl-innier {
  opacity: 1;
}

.box5 .methods-pic {
  aspect-ratio: 2953/3000;
  width: 19.5vw;
  margin: 0 auto 2.2vw;
  -webkit-transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -o-transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1), -webkit-transform 0.5s cubic-bezier(0.13, 0.38, 0.12, 1);
  -webkit-transform: translateY(5em);
      -ms-transform: translateY(5em);
          transform: translateY(5em);
  opacity: 0;
}

.box5 .methods-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(5, 4vw);
  -webkit-column-gap: 3.75vw;
     -moz-column-gap: 3.75vw;
          column-gap: 3.75vw;
  row-gap: 2vw;
  -webkit-transition: grid-template-rows 1s cubic-bezier(0.22, 0.61, 0.36, 1) 1.2s, row-gap 1s cubic-bezier(0.22, 0.61, 0.36, 1) 1.2s;
  -o-transition: grid-template-rows 1s cubic-bezier(0.22, 0.61, 0.36, 1) 1.2s, row-gap 1s cubic-bezier(0.22, 0.61, 0.36, 1) 1.2s;
  transition: grid-template-rows 1s cubic-bezier(0.22, 0.61, 0.36, 1) 1.2s, row-gap 1s cubic-bezier(0.22, 0.61, 0.36, 1) 1.2s;
  transition: grid-template-rows 1s cubic-bezier(0.22, 0.61, 0.36, 1) 1.2s, row-gap 1s cubic-bezier(0.22, 0.61, 0.36, 1) 1.2s, -ms-grid-rows 1s cubic-bezier(0.22, 0.61, 0.36, 1) 1.2s;
}

.box5 .dl-innier {
  counter-increment: mycounter;
  -webkit-transition: opacity 0.5s ease-out calc(.05s * var(--index));
  -o-transition: opacity 0.5s ease-out calc(.05s * var(--index));
  transition: opacity 0.5s ease-out calc(.05s * var(--index));
  opacity: 0;
  overflow: hidden;
}

.box5 .dl-innier::before {
  content: counter(mycounter, decimal-leading-zero);
  font-size: .875vw;
  font-weight: bold;
  color: #aba9a8;
  font-family: "Inter", sans-serif;
  line-height: 1;
  display: block;
  margin-bottom: .9vw;
}

.box5 .dl-innier dt {
  font-size: 1.875vw;
  font-weight: bold;
  line-height: 1;
  margin-bottom: 1.25vw;
}

.box5 .dl-innier dd {
  font-size: 1vw;
  line-height: 1.875;
}

@media screen and (max-width: 768px) {
  .box1 .box-textarea {
    margin-bottom: 9.5vw;
  }
  .box1 .box-picarea {
    height: 53vw;
  }
  .box1 .photo-slider__pic {
    width: 31.5vw;
    border-radius: 2.4vw;
  }
  .box-title {
    margin-bottom: 11.2vw;
  }
  .box-title__main {
    font-size: 6.64vw;
    letter-spacing: -0.015em;
    line-height: 1.1;
    margin-bottom: 2.5vw;
  }
  .box-title__sub {
    font-size: 2.9334vw;
  }
  .box2 {
    margin-bottom: 7vw;
  }
  .box2 .box-textarea {
    width: 100%;
    margin: 0 auto;
  }
  .box2 .box-textarea .message-catch {
    font-size: 5.3334vw;
    margin-bottom: 5.25vw;
  }
  .box2 .box-textarea .message-text p {
    font-size: 3.3vw;
  }
  .box2 .box-textarea .message-text p.show span::after {
    -webkit-transform: translateX(90vw);
        -ms-transform: translateX(90vw);
            transform: translateX(90vw);
  }
  .box2 .box-textarea .message-text p span {
    padding: 1.25vw 1vw;
    background-size: 100% 100%;
    line-height: .95;
    -webkit-transform: translateX(-90vw);
        -ms-transform: translateX(-90vw);
            transform: translateX(-90vw);
  }
  .box2 .box-textarea .message-text p span::after {
    background-size: 100% 100%;
  }
  .box2 .box-textarea .message-text p + p {
    margin-top: 6vw;
  }
  .box2 .box-picarea {
    margin-right: -5.3vw;
    margin-left: -5.3vw;
    margin-top: -4vw;
  }
  .box2 .box-picarea__pic {
    width: 100%;
    border-radius: 0;
  }
  .box3 {
    margin-bottom: 7vw;
  }
  .box3 .box-content {
    width: 100%;
  }
  .box3 .position-itme {
    padding: 5.6vw 0;
    font-size: 3.4667vw;
  }
  .box4 {
    margin-bottom: 7vw;
  }
  .box4 .box-content {
    width: 100%;
  }
  .box4 .dl-innier {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-bottom: 4.7vw;
    font-size: 3.4667vw;
  }
  .box4 .dl-innier dt {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    border: none;
    margin-bottom: 3.6vw;
    line-height: 1.3;
  }
  .box4 .dl-innier dd {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    padding-top: 0;
    padding-bottom: 4.4vw;
    border-bottom: 0.3vw solid #d8d8d8;
    line-height: 1.53;
  }
  .box5 {
    margin-bottom: 20vw;
  }
  .box5 .box-content {
    width: 100%;
  }
  .box5 .box-content.show .methods-list {
    grid-template-rows: auto;
    row-gap: 9.5vw;
  }
  .box5 .methods-pic {
    width: 41.6vw;
    margin: 0 auto 13vw;
  }
  .box5 .methods-list {
    grid-template-columns: repeat(1, 1fr);
    height: auto;
    grid-template-rows: auto;
    row-gap: 9.5vw;
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
  }
  .box5 .dl-innier::before {
    font-size: 3.2vw;
    margin-bottom: 3vw;
  }
  .box5 .dl-innier dt {
    font-size: 5.3334vw;
    margin-bottom: 6vw;
  }
  .box5 .dl-innier dd {
    font-size: 3.4667vw;
    line-height: 1.307;
  }
}
/*# sourceMappingURL=career.css.map */
