.h2-ttl {
  margin-bottom: 1.3333333333em;
  font-size: 1.875rem;
  font-size: 3rem;
  font-weight: 300;
  line-height: 1;
  letter-spacing: .1em;
  text-indent: .1em;
  text-align: center
}
.h2-ttl::after {
  content: "";
  display: block;
  width: 75px;
  height: 1px;
  margin: .5333333333em auto 0;
  background-color: currentColor
}
@media (max-width: 767.98px) {
  .h2-ttl {
    margin-bottom: 1.6em;
    font-size: 1.640625rem;
    font-size: 2.625rem;
    line-height: 1.3333333333;
    letter-spacing: .1em;
    text-indent: .1em
  }
  .h2-ttl::after {
    width: 66px;
    margin: .380952381em auto 0
  }
}
.lead {
  margin-bottom: .8333333333em;
  font-size: 1.5rem;
  font-size: 2.4rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-indent: .2em
}
@media (min-width: 767.99px) {
  .service .h2-ttl,
  .service .lead,
  .service .text {
    color: #333;
  }
  .service .h2-ttl::after {
    background-color: #666;
  }
}

@media (max-width: 767.98px) {
  .lead {
    margin-bottom: 1.6666666667em;
    font-size: 1.125rem;
    font-size: 1.8rem;
    line-height: 1.6666666667;
    letter-spacing: .1em;
    text-indent: .1em
  }
}
.text {
  margin-bottom: 3.375em;
  font-size: 1rem;
  font-size: 1.6rem;
  line-height: 1.875;
  letter-spacing: .15em;
  text-indent: .15em;
  font-weight: 500;
}
@media (max-width: 767.98px) {
  .text {
    margin-bottom: 2.8571428571em;
    font-size: .875rem;
    font-size: 1.4rem;
    line-height: 1.875;
    letter-spacing: .05em;
    text-indent: 0em;
    text-align: left
  }
}
.btn {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 250px;
  padding: 1em .875em .875em 1.625em;
  background-color: currentColor;
  border: solid 1px currentColor;
  border-radius: .1rem;
  text-align: center;
  line-height: 1.5
}
.btn .arr-btn {
  padding-right: 3em;
  padding-bottom: 0;
  border-bottom: 0px;
  font-size: 1.25rem;
  font-size: 2rem;
  letter-spacing: .1em;
  text-indent: .1em;
  line-height: 1.2;
  -webkit-transition: opacity 0.2s linear, background-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear;
  -o-transition: opacity 0.2s linear, background-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear;
  transition: opacity 0.2s linear, background-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear
}
@media (max-width: 767.98px) {
  .btn {
    max-width: 180px;
    margin: auto;
    padding: .3571428571em 0em .2857142857em .8571428571em
  }
  .btn .arr-btn {
    font-size: 1em;
    font-weight: 400;
    letter-spacing: .1em;
    text-indent: .1em
  }
}
#main {
  padding-top: 0
}
@media (max-width: 999.98px) {
  #main {
    padding-top: 90px
  }
}
.keyvisual {
  position: relative
}
.keyvisual .slick-slider {
  height: 100%;
  margin-bottom: auto;
  overflow: hidden
}
.keyvisual .slick-slider::after {
  content: "";
  display: block;
  clear: both
}
.keyvisual .slick-slider:not(.slick-initialized) .slide:not(:first-child) {
  display: none
}
.keyvisual .slick-slider .slide {
  position: relative;
  float: left;
  width: 100%;
  height: 100vh;
  max-height: 1000px;
  background: transparent no-repeat center center;
  background-size: cover
}
.keyvisual .slick-slider .slide .slide-img {
  width: 100%;
  height: 100%;
  background: transparent no-repeat center center;
  background-size: cover;
  -webkit-transition: transform 8s 0.5s ease-out;
  -o-transition: transform 8s 0.5s ease-out;
  transition: transform 8s 0.5s ease-out;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1)
}
.keyvisual .slick-slider .slide.slick-show .slide-img {
  -webkit-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1)
}
.keyvisual .slick-slider .slide img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: 100%;
  min-height: 800px;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%)
}
.keyvisual .slick-slider .slide-catch {
  position: absolute;
  top: 70%;
  left: 50%;
  width: 40%;
  max-width: 640px;
  background: transparent url(../images/index/catch-black.svg) no-repeat center center;
  background-size: contain;
  pointer-events: none;
  -webkit-transform: translate(-50%, -93.3333333333%);
  -ms-transform: translate(-50%, -93.3333333333%);
  transform: translate(-50%, -93.3333333333%)
}
@media (min-width: 1000px) {
  .keyvisual .slick-slider .slide-catch {
    min-width: 550px;
  }
}

.keyvisual .slick-slider .slide-catch.black {
  background-image: url(../images/index/catch-black.svg)
}
.keyvisual .slick-slider .slide-catch.white {
  background-image: url(../images/index/catch-white.svg)
}
.keyvisual .slick-slider .slide-catch::before {
  content: "";
  display: block;
  padding-bottom: 23.4375%
}
.keyvisual .slick-slider .slide-catch h2 {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(0px 0px 99.9% 99.9%);
  clip-path: inset(0px 0px 99.9% 99.9%)
}
.keyvisual .slick-slider .slide1 .slide-img {
  background-image: url(../images/index/slide1.jpg);
  background-position: left center
}
.keyvisual .slick-slider .slide2 .slide-img {
  background-image: url(../images/index/slide2.jpg);
  background-position: center center
}
.keyvisual .slick-slider .slide3 .slide-img {
  background-image: url(../images/index/slide3.jpg);
  background-position: left center
}
.keyvisual .slick-slider .slick-dots {
  bottom: 22px;
  line-height: 1
}
.keyvisual .slick-slider .slick-dots li {
  width: 100px;
  height: 48px;
  margin: 0 12px;
  background-color: transparent;
  vertical-align: bottom
}
.keyvisual .slick-slider .slick-dots .slider-progress {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 2px;
  background-color: #333;
  border-radius: 1px;
  overflow: hidden;
  pointer-events: none;
  -webkit-transform: translate(0%, -50%);
  -ms-transform: translate(0%, -50%);
  transform: translate(0%, -50%)
}
.keyvisual .slick-slider .slick-dots .slider-progress .progress {
  height: 2px;
  background-color: transparent
}
.keyvisual .slick-slider .slick-dots .slick-active .slider-progress .progress {
  background-color: #fff
}
.keyvisual .kv-skip {
  position: absolute;
  right: 0;
  bottom: 0
}
@supports (right: max(0px, env(safe-area-inset-right))) {
  .keyvisual .kv-skip {
    right: 0;
    right: max(0px, env(safe-area-inset-right, 0px))
  }
}
.keyvisual .kv-skip a {
  position: absolute;
  right: 0;
  bottom: 0;
  display: block;
  width: 42px;
  height: 42px;
  background-color: #0270d1;
  border-radius: 0px
}
.keyvisual .kv-skip a::before {
  content: "";
  position: absolute;
  display: block;
  top: 46.141%;
  left: 50%;
  width: 31.41%;
  height: 31.41%;
  border: solid 0px #fff;
  border-width: 1px 1px 0 0;
  border-color: #fff #fff transparent transparent;
  -webkit-transform: translate(-50%, -50%) rotate(135deg);
  -ms-transform: translate(-50%, -50%) rotate(135deg);
  transform: translate(-50%, -50%) rotate(135deg)
}
.keyvisual .kv-skip a span {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(0px 0px 99.9% 99.9%);
  clip-path: inset(0px 0px 99.9% 99.9%)
}
@media (max-width: 999.98px) {
  .keyvisual .slick-slider {
    position: relative;
    height: auto
  }
  .keyvisual .slick-slider .slide {
    height: auto
  }
  .keyvisual .slick-slider .slide::before {
    content: "";
    display: block;
    padding-bottom: calc(100vh - 90px - 110px)
  }
  .keyvisual .slick-slider .slide .slide-img {
    position: absolute;
    top: 0
  }
  .keyvisual .slick-slider .slide-catch {
    top: 40%;
    width: 82.6666666667%;
    max-width: 310px;
    background-image: url(../images/index/catch-black-sp.svg);
    -webkit-transform: translate(-50%, -188.961038961%);
    -ms-transform: translate(-50%, -188.961038961%);
    transform: translate(-50%, -188.961038961%)
  }
  .keyvisual .slick-slider .slide-catch.black {
    background-image: url(../images/index/catch-black-sp.svg)
  }
  .keyvisual .slick-slider .slide-catch.white {
    background-image: url(../images/index/catch-white-sp.svg)
  }
  .keyvisual .slick-slider .slide-catch::before {
    padding-bottom: 24.8387096774%
  }
  .keyvisual .slick-slider .slide1 .slide-img {
    background-image: url(../images/index/slide1-sp.jpg);
    background-position: center bottom
  }
  .keyvisual .slick-slider .slide2 .slide-img {
    background-image: url(../images/index/slide2-sp.jpg);
    background-position: center bottom
  }
  .keyvisual .slick-slider .slide3 .slide-img {
    background-image: url(../images/index/slide3-sp.jpg);
    background-position: center bottom
  }
  .keyvisual .slick-slider .slick-dots {
    bottom: 6px
  }
  .keyvisual .slick-slider .slick-dots li {
    width: 50px;
    margin: 0 6px
  }
  .keyvisual .slick-slider .slick-dots .slider-progress {
    height: 1px
  }
  .keyvisual .slick-slider .slick-dots .slider-progress .progress {
    height: 1px
  }
  .keyvisual .kv-skip {
    display: none
  }
}
.about {
  margin-bottom: 40px;
  background: transparent url(../images/index/about-bg.jpg) no-repeat center bottom;
  background-size: cover;
  color: #fff
}
.about .container {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center
}
.about .about-content {
  padding: 90px 10px 284px;
  text-align: center;
  font-size: 1rem;
  font-size: 1.6rem;
  line-height: 1.875;
  letter-spacing: .15em;
  text-indent: .15em
}
.about .about-content p {
  margin-bottom: 4.6875em;
  font-weight: 500;
}
.about .about-content .btn {
  background-color: #fff;
  border-color: #fff;
  color: #0270d1
}
.about .about-ttl {
  margin-bottom: 2.0833333333em;
  font-size: 1.5rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 2;
  letter-spacing: .2em;
  text-indent: .2em
}
@media (max-width: 767.98px) {
  .about {
    margin-bottom: 26px
  }
  .about .about-content {
    padding: 45px 10px 190px;
    font-size: .875rem;
    font-size: 1.4rem;
    line-height: 1.6428571429;
    letter-spacing: 0em;
    text-indent: 0em
  }
  .about .about-content p {
    margin-bottom: 2.7142857143em;
    text-align: left
  }
  .about .about-ttl {
    margin-bottom: 1.0566037736em;
    font-size: 1.1785714286rem;
    font-size: 1.65rem;
    line-height: 1.6060606061;
    letter-spacing: .1em;
    text-indent: 0em;
    text-align: left
  }
}
.service .service-content {
  margin: 0 24px 40px;
  padding: 38px 30px 58px;
  background: #659bb1 url(../images/index/service-bg.jpg) no-repeat center center;
  background-size: cover;
  color: #fff;
  text-align: center
}
@media (max-width: 999.98px) {
  .service .service-content {
    background: #659bb1 url(../images/index/service-bg.jpg) no-repeat right 30% top 20%;
    background-size: cover;
  }
}

.service .btn {
  background-color: rgba(0, 105, 249, 0.51)
}
@supports (mix-blend-mode: multiply) {
  .service .btn {
    background-color: transparent
  }
  .service .btn::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(0, 105, 249, 0.51);
    mix-blend-mode: multiply;
    -webkit-transition: obackground-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear;
    -o-transition: obackground-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear;
    transition: obackground-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear
  }
  .service .btn .arr-btn {
    z-index: 2
  }
}
.service .btn:hover, .service .btn:focus, .service .btn:active {
  opacity: 1;
  border-color: rgba(255, 255, 255, 0.7);
  color: rgba(255, 255, 255, 0.7);
  background-color: rgba(0, 105, 249, 0.357)
}
@supports (mix-blend-mode: multiply) {
  .service .btn:hover, .service .btn:focus, .service .btn:active {
    background-color: transparent
  }
  .service .btn:hover::after, .service .btn:focus::after, .service .btn:active::after {
    background-color: rgba(0, 105, 249, 0.357)
  }
  .service .btn:hover .arr-btn, .service .btn:focus .arr-btn, .service .btn:active .arr-btn {
    color: #fff;
    opacity: .7
  }
}
@media (max-width: 767.98px) {
  .service .service-content {
    margin: 0 0 26px;
    padding: 44px 30px 30px;
    background-image: url(../images/index/service-bg-sp.jpg)
  }
}
.result .result-content {
  margin: 0 24px 40px;
  padding: 38px 30px 58px;
  background: #42b89f url(../images/index/result-bg.jpg) no-repeat center bottom;
  background-size: cover;
  color: #fff;
  text-align: center
}
.result .btn {
  background-color: rgba(0, 105, 249, 0.53)
}
@supports (mix-blend-mode: multiply) {
  .result .btn {
    background-color: transparent
  }
  .result .btn::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(0, 105, 249, 0.53);
    mix-blend-mode: multiply;
    -webkit-transition: obackground-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear;
    -o-transition: obackground-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear;
    transition: obackground-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear
  }
  .result .btn .arr-btn {
    z-index: 2
  }
}
.result .btn:hover, .result .btn:focus, .result .btn:active {
  opacity: 1;
  border-color: rgba(255, 255, 255, 0.7);
  color: rgba(255, 255, 255, 0.7);
  background-color: rgba(0, 105, 249, 0.371)
}
@supports (mix-blend-mode: multiply) {
  .result .btn:hover, .result .btn:focus, .result .btn:active {
    background-color: transparent
  }
  .result .btn:hover::after, .result .btn:focus::after, .result .btn:active::after {
    background-color: rgba(0, 105, 249, 0.371)
  }
  .result .btn:hover .arr-btn, .result .btn:focus .arr-btn, .result .btn:active .arr-btn {
    color: #fff;
    opacity: .7
  }
}
@media (max-width: 767.98px) {
  .result .result-content {
    margin: 0 0 26px;
    padding: 44px 30px 30px;
    background-image: url(../images/index/result-bg-sp.jpg)
  }
}
.pickup {
  padding-top: 20px;
  padding-bottom: 50px
}
.pickup .pickup-content {
  overflow: hidden
}
.pickup .h2-ttl {
  font-size: 2.25rem;
  font-size: 3.6rem
}
.pickup .columns {
  margin-left: -3.4166666667%;
  margin-right: -3.4166666667%
}
.pickup .columns .col {
  padding: 0 3.1981279251% 3.1981279251%;
  text-align: center
}
.pickup .columns .col a {
  display: block
}
.pickup .columns .col .thumbs {
  max-width: 345px;
  margin: auto;
  text-align: left
}
.pickup .columns .col .thumbs img {
  margin-bottom: 10px
}
.pickup .columns .col .thumbs h3 {
  font-size: 1.25rem;
  font-size: 2rem;
  line-height: 1.6;
  letter-spacing: .1em
}
@media (max-width: 767.98px) {
  .pickup {
    padding-top: 30px;
    padding-bottom: 50px
  }
  .pickup .h2-ttl {
    font-size: 1.640625rem;
    font-size: 2.625rem
  }
  .pickup .columns .col {
    padding-bottom: 8%
  }
  .pickup .columns .col .thumbs {
    max-width: 241px
  }
  .pickup .columns .col .thumbs h3 {
    font-size: .875rem;
    font-size: 1.4rem;
    line-height: 1.7142857143;
    letter-spacing: .1em
  }
}
.recruit .recruit-content {
  margin: 0 24px 40px;
  padding: 38px 30px 58px;
  background: #a193ce url(../images/index/recruit-bg.jpg) no-repeat center bottom;
  background-size: cover;
  color: #fff;
  text-align: center
}
.recruit .btn {
  background-color: rgba(0, 105, 249, 0.53)
}
@supports (mix-blend-mode: multiply) {
  .recruit .btn {
    background-color: transparent
  }
  .recruit .btn::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(0, 105, 249, 0.53);
    mix-blend-mode: multiply;
    -webkit-transition: obackground-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear;
    -o-transition: obackground-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear;
    transition: obackground-color 0.2s linear, broder-color 0.2s linear, color 0.2s linear
  }
  .recruit .btn .arr-btn {
    z-index: 2
  }
}
.recruit .btn:hover, .recruit .btn:focus, .recruit .btn:active {
  opacity: 1;
  border-color: rgba(255, 255, 255, 0.7);
  color: rgba(255, 255, 255, 0.7);
  background-color: rgba(0, 105, 249, 0.371)
}
@supports (mix-blend-mode: multiply) {
  .recruit .btn:hover, .recruit .btn:focus, .recruit .btn:active {
    background-color: transparent
  }
  .recruit .btn:hover::after, .recruit .btn:focus::after, .recruit .btn:active::after {
    background-color: rgba(0, 105, 249, 0.371)
  }
  .recruit .btn:hover .arr-btn, .recruit .btn:focus .arr-btn, .recruit .btn:active .arr-btn {
    color: #fff;
    opacity: .7
  }
}
@media (max-width: 767.98px) {
  .recruit .recruit-content {
    margin: 0 0 26px;
    padding: 44px 30px 30px;
    background-image: url(../images/index/recruit-bg-sp.jpg)
  }
}
.news {
  padding-top: 20px;
  padding-bottom: 80px
}
.news .news-content {
  text-align: center;
  overflow: hidden
}
.news .h2-ttl {
  font-size: 2.5rem;
  font-size: 4rem
}
.news .news-list {
  max-width: 900px;
  margin: auto auto 50px;
  text-align: left
}
.news .news-list li {
  padding: .375em 0 .375em 270px;
  font-size: 1rem;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .2em;
  text-align: justify
}
.news .news-list li > a {
  display: inline-block
}
.news .news-list li time {
  display: inline-block;
  width: 170px;
  margin-left: -170px;
  text-decoration: none
}
.news .btn {
  background-color: #666;
  color: #fff
}
@media (max-width: 767.98px) {
  .news .h2-ttl {
    font-size: 1.640625rem;
    font-size: 2.625rem
  }
  .news .news-list {
    margin-bottom: 30px
  }
  .news .news-list li {
    padding-left: 104px;
    font-size: .875rem;
    font-size: 1.4rem;
    letter-spacing: 0em
  }
  .news .news-list li > a {
    text-decoration: underline;
    text-underline-position: under
  }
  .news .news-list li time {
    width: 104px;
    margin-left: -104px
  }
} /*! Built by PIXBATON pixbaton.jp */