@charset "UTF-8";
@-webkit-keyframes fadeInAnime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeInAnime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.header__item:first-child .header__link {
  opacity: 1;
}
.header__item:first-child .header__link::after {
  bottom: -4px;
  opacity: 1;
  visibility: visible;
}

.footer__item:first-child .footer__link {
  opacity: 1;
}
.footer__item:first-child .footer__link::after {
  bottom: -4px;
  opacity: 1;
  visibility: visible;
}

body::before {
  height: 750px;
}
@media only screen and (max-width: 750px) {
  body::before {
    height: 42%;
  }
}

.sp_menu li a {
  position: relative;
}

.sp_menu li:first-child a::after {
  content: "";
  position: absolute;
  bottom: 8px;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 40px;
  height: 1px;
  background-color: #fff;
}

.main {
  display: block;
  height: 747px;
  overflow: hidden;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .main {
    margin: 0 auto;
    height: auto;
  }
}
@media only screen and (min-width: 751px) {
  .main::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 75%;
    height: 100%;
    background: #444;
  }
}
@media only screen and (min-width: 751px) and (min-width: 1301px) {
  .main::after {
    width: 700px;
  }
}
.main__inner {
  max-width: 1080px;
  width: calc(100% - 40px);
  margin: 0 auto;
  width: 80vw;
  height: 100%;
  position: relative;
  align-items: center;
  z-index: 2;
  background-color: #444;
  border-radius: 0 20px 20px 0;
}
@media only screen and (min-width: 751px) {
  .main__inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
@media only screen and (min-width: 1301px) {
  .main__inner {
    margin: 0 0 0 130px;
  }
}
@media only screen and (max-width: 750px) {
  .main__inner {
    width: calc(100% - 20px);
    margin: 0;
    background-color: rgba(0, 0, 0, 0);
  }
}
.main__h2 {
  max-width: 650px;
  margin-bottom: 35px;
}
@media only screen and (max-width: 750px) {
  .main__h2 {
    width: 90%;
    margin-bottom: 25px;
  }
}
.main__mv {
  width: 20%;
  height: 100%;
  border-radius: 0 20px 20px 0;
  background: url(../img/bg_mv.png) no-repeat;
}
@media only screen and (max-width: 750px) {
  .main__mv {
    width: 100%;
    height: 160px;
    border-radius: 0 0 15px 0;
    background: url(../img/sp/bg_mv.png) #ccc no-repeat center/100%;
  }
}
.main__text {
  max-width: 700px;
  width: calc(100% - 40px);
  margin: 0 auto;
  width: 72%;
  color: #fff;
  margin: -5% 0 0;
}
@media only screen and (max-width: 750px) {
  .main__text {
    width: 100%;
    padding: 8% 5%;
    box-sizing: border-box;
    background-color: #444;
    border-radius: 0 15px 0 0;
    margin: 0;
  }
}
.main__bld {
  font-size: 60px;
  line-height: 115%;
  display: block;
  font-weight: 700;
  margin-bottom: 20px;
}
@media only screen and (max-width: 750px) {
  .main__bld {
    font-size: 7vw;
    margin-bottom: 30px;
  }
}
.main__bun {
  font-size: 20px;
  line-height: 160%;
}
@media only screen and (max-width: 750px) {
  .main__bun {
    font-size: 3.5vw;
  }
}
.main__ttl {
  width: 100%;
  position: absolute;
  bottom: 0;
  color: #fff;
  padding: 15px 40px;
  font-size: 24px;
  font-weight: bold;
  line-height: 140%;
  box-sizing: border-box;
  background-color: rgba(0, 0, 0, 0.4);
}
@media only screen and (max-width: 750px) {
  .main__ttl {
    padding: 10px 15px;
    font-size: 14px;
    line-height: 150%;
  }
}
.main__link {
  display: block;
  max-width: 160px;
  width: 100%;
  height: 100%;
  color: #fff;
  font-size: 16px;
  line-height: 48px;
  text-align: center;
  border-radius: 8px;
  float: right;
  margin-top: 60px;
}
@media only screen and (max-width: 750px) {
  .main__link {
    line-height: 35px;
    margin-top: 40px;
  }
}
@media only screen and (max-width: 550px) {
  .main__link {
    max-width: 130px;
    font-size: 14px;
    line-height: 30px;
    border-radius: 6px;
    margin-top: 20px;
  }
}
.main__link:hover {
  opacity: 0.7;
}

.body-content {
  position: relative;
  overflow: hidden;
}

.feature {
  background-color: #F8F8F8;
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  padding: 100px 0;
}
@media only screen and (max-width: 750px) {
  .feature {
    padding: 50px 0;
  }
}
.feature__h3 {
  font-size: 120px;
}
@media only screen and (max-width: 750px) {
  .feature__h3 {
    font-size: 19.2vw;
    line-height: 100%;
    padding-bottom: 20px;
  }
}
.feature__inner {
  max-width: 840px;
  width: calc(100% - 40px);
  margin: 0 auto;
}
.feature__ttl {
  margin: 0 auto 40px;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .feature__ttl {
    margin: 0 auto 40px;
  }
}
.feature__ttl::before {
  content: "";
  position: absolute;
  top: 75px;
  left: -100px;
  width: 80px;
  height: 4px;
  background-color: #c9c9c9;
  -webkit-animation-name: fadeInAnime;
          animation-name: fadeInAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}
@media only screen and (max-width: 1080px) {
  .feature__ttl::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
@media only screen and (max-width: 1080px) {
  .feature__ttl::before {
    display: none;
  }
}
.feature__dt {
  margin-bottom: 20px;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .feature__dt {
    font-size: 5.4vw;
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 1080px) {
  .feature__h3::before {
    content: "";
    position: absolute;
    top: 75px;
    left: -100px;
    width: 80px;
    height: 4px;
    background-color: #c9c9c9;
    -webkit-animation-name: fadeInAnime;
            animation-name: fadeInAnime;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    opacity: 0;
  }
}
@media only screen and (max-width: 1080px) and (max-width: 1080px) {
  .feature__h3::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
.feature__dd {
  line-height: 52px;
}
@media only screen and (max-width: 750px) {
  .feature__dd {
    line-height: 140%;
  }
}
.feature__text {
  max-width: 520px;
  width: 62%;
}
@media only screen and (max-width: 750px) {
  .feature__text {
    max-width: 100%;
    width: 100%;
  }
}
.feature__em {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 20px;
  display: block;
  font-style: normal;
}
@media only screen and (max-width: 750px) {
  .feature__em {
    font-size: 20px;
    margin-bottom: 10px;
  }
}
.feature__sub {
  margin-bottom: 20px;
}
.feature__up {
  margin-bottom: 10px;
  display: block;
}
.feature__box {
  background-color: #fff;
  border-radius: 10px;
}
.feature__pict {
  margin: 0 auto;
}
.gap {
  padding: 40px 45px 50px;
  background-color: #fff;
  border-radius: 10px;
  margin-bottom: 40px;
}
@media only screen and (max-width: 750px) {
  .gap {
    padding: 30px 30px 35px;
    position: relative;
  }
}
@media only screen and (min-width: 751px) {
  .gap__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
.gap__ttl {
  font-size: 40px;
  font-weight: bold;
  text-align: center;
  color: #4ac7ab;
  margin: 0 auto 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-width: 750px) {
  .gap__ttl {
    font-size: 18px;
    position: absolute;
    right: 10px;
    top: 50%;
    margin: -43px 0 0;
    background: #fff;
    z-index: 2;
    display: block;
    padding: 0 10px;
  }
}
.gap__ttl::before, .gap__ttl::after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 50px;
  background: url(../img/icon_tri.jpg) no-repeat center/100%;
}
@media only screen and (max-width: 750px) {
  .gap__ttl::before, .gap__ttl::after {
    width: 10px;
    height: 23px;
    display: block;
  }
}
.gap__ttl::before {
  margin-right: 30px;
}
@media only screen and (max-width: 750px) {
  .gap__ttl::before {
    margin: 0 auto;
    transform: rotate(90deg);
  }
}
.gap__ttl::after {
  margin-left: 30px;
  transform: scale(-1, 1);
}
@media only screen and (max-width: 750px) {
  .gap__ttl::after {
    margin: 0 auto;
    transform: rotate(-90deg);
  }
}
.gap__list {
  position: relative;
}
.gap__list::after {
  content: "";
  width: 1px;
  height: 360px;
  background-color: #c9c9c9;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0px;
  margin: 0 auto;
}
@media only screen and (max-width: 750px) {
  .gap__list::after {
    display: none;
  }
}
.gap__item {
  max-width: 330px;
  width: 44%;
}
@media only screen and (max-width: 750px) {
  .gap__item {
    max-width: 100%;
    width: 100%;
  }
  .gap__item:nth-child(1) {
    margin-bottom: 40px;
    padding-bottom: 35px;
    border-bottom: solid #c9c9c9 1px;
  }
}
.gap__bld {
  font-weight: bold;
  font-size: 40px;
  line-height: 130%;
  text-align: center;
}
.gap__sub {
  margin-bottom: 15px;
}
.gap__txt {
  font-weight: bold;
}

.function {
  width: 100%;
  overflow: hidden;
  margin: 40px auto 100px;
}
@media only screen and (max-width: 750px) {
  .function {
    margin: 60px auto;
  }
}
.function__ttl {
  max-width: 840px;
  width: calc(100% - 40px);
  margin: 0 auto;
  margin: 0 auto 40px;
  position: relative;
}
.function__ttl::before {
  content: "";
  position: absolute;
  top: 75px;
  left: -100px;
  width: 80px;
  height: 4px;
  background-color: #c9c9c9;
  -webkit-animation-name: fadeInAnime;
          animation-name: fadeInAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}
@media only screen and (max-width: 1080px) {
  .function__ttl::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
@media only screen and (max-width: 1080px) {
  .function__ttl::before {
    display: none;
  }
}
@media only screen and (max-width: 750px) {
  .function__ttl {
    margin: 0 auto 20px;
  }
}
.function__dt {
  padding-bottom: 10px;
}
@media only screen and (max-width: 750px) {
  .function__dt {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 1080px) {
  .function__h3::before {
    content: "";
    position: absolute;
    top: 75px;
    left: -100px;
    width: 80px;
    height: 4px;
    background-color: #c9c9c9;
    -webkit-animation-name: fadeInAnime;
            animation-name: fadeInAnime;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    opacity: 0;
  }
}
@media only screen and (max-width: 1080px) and (max-width: 1080px) {
  .function__h3::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
.function__dd {
  max-width: 840px;
  width: calc(100% - 40px);
  margin: 0 auto;
}
.function__list {
  max-width: 840px;
  width: calc(100% - 40px);
  margin: 0 auto;
  justify-content: space-between;
  margin-bottom: 80px;
}
@media only screen and (min-width: 751px) {
  .function__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
@media only screen and (max-width: 750px) {
  .function__list {
    margin-bottom: 40px;
  }
}
.function__item {
  max-width: 400px;
  width: 48%;
}
@media only screen and (min-width: 751px) {
  .function__item:nth-child(n+3) {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 750px) {
  .function__item {
    width: 100%;
    margin: 0 auto;
  }
  .function__item:nth-child(n+2) {
    margin-top: 30px;
  }
}
.function__pict {
  margin: 0 auto 25px;
}
@media only screen and (max-width: 750px) {
  .function__pict {
    margin: 0 auto 15px;
  }
}
.function__ex {
  line-height: 140%;
}
.function__em {
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
  margin-bottom: 10px;
  display: block;
  font-style: normal;
}
@media only screen and (max-width: 750px) {
  .function__em {
    font-size: 20px;
    line-height: 26px;
    margin-bottom: 5px;
  }
}

.users {
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .users {
    margin: 0 auto 50px;
  }
}
.users::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 50%;
  height: 765px;
  z-index: -1;
  background: linear-gradient(135deg, #153B6E 0%, #2C6095 50%, #4283BA 100%);
  border-radius: 0 20px 0 0;
}
@media only screen and (max-width: 750px) {
  .users::before {
    width: 90%;
  }
}
.users__inner {
  max-width: 1080px;
  width: calc(100% - 40px);
  margin: 0 auto;
  width: 90%;
  margin-top: 130px;
  border-radius: 20px 20px 0 0;
  padding: 100px 7% 100px 15%;
  background-color: #fff;
  box-sizing: border-box;
}
@media only screen and (max-width: 750px) {
  .users__inner {
    margin-top: 40px;
    width: 90%;
    padding: 40px 0 50px 8%;
  }
}
.users__ttl {
  max-width: 740px;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .users__ttl {
    margin: 0 auto;
  }
}
.users__ttl::before {
  content: "";
  position: absolute;
  top: 75px;
  left: -100px;
  width: 80px;
  height: 4px;
  background-color: #c9c9c9;
  -webkit-animation-name: fadeInAnime;
          animation-name: fadeInAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}
@media only screen and (max-width: 1080px) {
  .users__ttl::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
@media only screen and (max-width: 1080px) {
  .users__ttl::before {
    display: none;
  }
}
.users__dt {
  margin-bottom: 20px;
}
@media only screen and (max-width: 750px) {
  .users__dt {
    margin-bottom: 40px;
  }
}
.users__txt {
  margin-bottom: 30px;
}
@media only screen and (max-width: 1080px) {
  .users__txt {
    margin: 0 auto 20px;
  }
}
@media only screen and (max-width: 1080px) {
  .users__h3::before {
    content: "";
    position: absolute;
    top: 75px;
    left: -100px;
    width: 80px;
    height: 4px;
    background-color: #c9c9c9;
    -webkit-animation-name: fadeInAnime;
            animation-name: fadeInAnime;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    opacity: 0;
  }
}
@media only screen and (max-width: 1080px) and (max-width: 1080px) {
  .users__h3::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
.users__dd {
  width: 100%;
  margin-bottom: 20px;
}
.users__pict {
  max-width: 740px;
  border-radius: 10px;
  overflow: hidden;
}
.team {
  background-color: #444;
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  padding: 100px 0;
}
@media only screen and (max-width: 750px) {
  .team {
    padding: 50px 0;
  }
}
.team__h3 {
  font-size: 90px;
}
@media only screen and (max-width: 750px) {
  .team__h3 {
    font-size: 14vw;
    line-height: 100%;
    padding-bottom: 20px;
  }
}
.team__inner {
  max-width: 840px;
  width: calc(100% - 40px);
  margin: 0 auto;
  color: #fff;
}
.team__ttl {
  position: relative;
  margin-bottom: 40px;
}
.team__ttl::before {
  content: "";
  position: absolute;
  top: 75px;
  left: -100px;
  width: 80px;
  height: 4px;
  background-color: #c9c9c9;
  -webkit-animation-name: fadeInAnime;
          animation-name: fadeInAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
  top: 49%;
}
@media only screen and (max-width: 1080px) {
  .team__ttl::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
@media only screen and (max-width: 1080px) {
  .team__ttl::before {
    display: none;
  }
}
@media only screen and (max-width: 750px) {
  .team__dt {
    font-size: 5.4vw;
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 1080px) {
  .team__h3::before {
    content: "";
    position: absolute;
    top: 75px;
    left: -100px;
    width: 80px;
    height: 4px;
    background-color: #c9c9c9;
    -webkit-animation-name: fadeInAnime;
            animation-name: fadeInAnime;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    opacity: 0;
  }
}
@media only screen and (max-width: 1080px) and (max-width: 1080px) {
  .team__h3::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
.team__dd {
  line-height: 52px;
  margin-bottom: 40px;
}
@media only screen and (max-width: 750px) {
  .team__dd {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 750px) {
  .team__list {
    max-width: 400px;
    margin: 0 auto;
  }
}
.team__item {
  align-items: center;
}
@media only screen and (min-width: 751px) {
  .team__item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
.team__item:nth-child(n+2) {
  margin-top: 40px;
}
@media only screen and (max-width: 750px) {
  .team__item:nth-child(n+2) {
    margin-top: 30px;
  }
}
.team__pict {
  max-width: 260px;
  width: 31%;
}
@media only screen and (max-width: 750px) {
  .team__pict {
    max-width: 100%;
    width: 100%;
    margin: 0 auto 20px;
  }
}
.team__text {
  max-width: 540px;
  width: 64%;
}
@media only screen and (max-width: 750px) {
  .team__text {
    max-width: 100%;
    width: 100%;
  }
}
.team__em {
  font-style: normal;
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 5px;
  display: block;
  display: flex;
  align-items: center;
}
@media only screen and (max-width: 750px) {
  .team__em {
    font-size: 24px;
    margin-bottom: 5px;
  }
}
.team__icon {
  max-width: 8px;
  height: 8px;
  display: inline-flex;
  margin-left: 7px;
}
.team__link {
  border: solid 1px #fff;
  color: #fff;
  border-radius: 15px;
  height: 22px;
  font-size: 12px;
  padding: 0 13px;
  margin-left: 10px;
  font-weight: 100;
  box-sizing: border-box;
  line-height: 20px;
}
.team__link:hover {
  opacity: 0.7;
}
.team__posi {
  padding-left: 15px;
  position: relative;
  margin-bottom: 15px;
}
.team__posi::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0px;
  width: 8px;
  height: 1px;
  background-color: #fff;
}
.team__ex {
  color: #fff;
  line-height: 130%;
}
/*全体*/
.hidden_box {
  padding: 0;
  color: #fff;
  /*ボタンホバー時*/
  /*チェックは見えなくする*/
  /*中身を非表示にしておく*/
  /*クリックで中身表示*/
}
.hidden_box .u-line::after {
  background-color: #fff;
}
.hidden_box__link {
  margin: 60px auto 0;
  border: solid 1px #fff;
  cursor: pointer;
  width: 100%;
  padding: 22px 0;
  color: #fff;
  font-size: 16px;
  background: rgba(0, 0, 0, 0);
  box-sizing: border-box;
  position: relative;
}
.hidden_box__more {
  line-height: 120%;
}
.hidden_box label:hover {
  opacity: 0.7;
}
.hidden_box input {
  display: none;
}
.hidden_box .hidden_show {
  height: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  transition: 0.8s;
}
.hidden_box input:checked ~ .hidden_show {
  padding: 40px 0;
  height: auto;
  opacity: 1;
}
.hidden_box input:checked ~ label {
  display: none;
}

.fa:before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
}
.fa--arrow {
  padding-left: 20px;
}
.fa--arrow:before {
  content: "\f078";
  font-size: 12px;
}
.fa--link {
  display: inline-flex;
  margin-left: 7px;
  opacity: 0.6;
}
.fa--link:before {
  content: "\f35d";
  font-size: 10px;
}

.concept {
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  padding: 100px 0;
}
@media only screen and (max-width: 750px) {
  .concept {
    padding: 60px 0;
  }
}
.concept__inner {
  max-width: 840px;
  width: calc(100% - 40px);
  margin: 0 auto;
  position: relative;
}
.concept__inner::before {
  content: "";
  position: absolute;
  top: 75px;
  left: -100px;
  width: 80px;
  height: 4px;
  background-color: #c9c9c9;
  -webkit-animation-name: fadeInAnime;
          animation-name: fadeInAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}
@media only screen and (max-width: 1080px) {
  .concept__inner::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
@media only screen and (max-width: 1080px) {
  .concept__inner::before {
    display: none;
  }
}
.concept__dt {
  margin-bottom: 20px;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .concept__dt {
    font-size: 5.4vw;
    margin-bottom: 30px;
  }
}
.concept__dd {
  margin-bottom: 20px;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .concept__dd {
    font-size: 5.4vw;
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 1080px) {
  .concept__h3::before {
    content: "";
    position: absolute;
    top: 75px;
    left: -100px;
    width: 80px;
    height: 4px;
    background-color: #c9c9c9;
    -webkit-animation-name: fadeInAnime;
            animation-name: fadeInAnime;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    opacity: 0;
  }
}
@media only screen and (max-width: 1080px) and (max-width: 1080px) {
  .concept__h3::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
.concept__sub {
  border-bottom: solid 1px #e8e8e8;
  padding-bottom: 60px;
  position: relative;
}
.concept__sub::before {
  content: "";
  width: 80px;
  height: 1px;
  position: absolute;
  bottom: -1px;
  left: 0;
  display: block;
  background-color: #444;
}
.concept__item {
  align-items: center;
  justify-content: flex-start;
  border-bottom: solid 1px #e8e8e8;
  padding: 38px 30px;
}
@media only screen and (min-width: 751px) {
  .concept__item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
@media only screen and (max-width: 750px) {
  .concept__item {
    max-width: 400px;
    margin: 0 auto;
    padding: 20px 0px;
  }
}
.concept__dl {
  max-width: 310px;
  width: 43%;
  margin-right: 3%;
}
.concept__dl--03 {
  max-width: 380px;
  width: 52%;
}
@media only screen and (max-width: 750px) {
  .concept__dl {
    max-width: 100%;
    width: 100%;
  }
}
.concept__ttl {
  margin-bottom: 10px;
}
@media only screen and (max-width: 750px) {
  .concept__ttl {
    font-size: 7.5vw;
    line-height: 100%;
  }
}
.concept__text {
  padding-left: 15px;
  line-height: 120%;
  position: relative;
}
.concept__text::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 10px;
  height: 1px;
  background-color: #444;
}
@media only screen and (max-width: 750px) {
  .concept__text {
    line-height: 110%;
    margin-bottom: 20px;
  }
}
.concept__pict {
  max-width: 416px;
  width: 54%;
}
.concept__pict--03 {
  max-width: 345px;
  width: 45%;
}
@media only screen and (max-width: 750px) {
  .concept__pict {
    max-width: 100%;
    width: 100%;
    margin: 0 auto 20px;
  }
}

.recruit {
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  padding: 100px 0;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .recruit {
    padding: 50px 0;
  }
}
.recruit::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0px;
  width: 50%;
  height: 100%;
  background-color: #F8F8F8;
  z-index: -1;
  border-radius: 20px 0 0 0;
}
@media only screen and (max-width: 1080px) {
  .recruit::before {
    width: 64%;
  }
}
.recruit__inner {
  max-width: 840px;
  width: calc(100% - 40px);
  margin: 0 auto;
  position: relative;
}
.recruit__inner::before {
  content: "";
  position: absolute;
  top: 75px;
  left: -100px;
  width: 80px;
  height: 4px;
  background-color: #c9c9c9;
  -webkit-animation-name: fadeInAnime;
          animation-name: fadeInAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}
@media only screen and (max-width: 1080px) {
  .recruit__inner::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
@media only screen and (max-width: 1080px) {
  .recruit__inner::before {
    display: none;
  }
}
.recruit__ttl {
  margin: 0 auto 40px;
}
.recruit__dt {
  margin-bottom: 20px;
}
@media only screen and (max-width: 750px) {
  .recruit__dt {
    font-size: 5.4vw;
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 1080px) {
  .recruit__h3::before {
    content: "";
    position: absolute;
    top: 75px;
    left: -100px;
    width: 80px;
    height: 4px;
    background-color: #c9c9c9;
    -webkit-animation-name: fadeInAnime;
            animation-name: fadeInAnime;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    opacity: 0;
  }
}
@media only screen and (max-width: 1080px) and (max-width: 1080px) {
  .recruit__h3::before {
    top: auto;
    left: 0;
    bottom: 0;
    height: 3px;
  }
}
@media only screen and (max-width: 750px) {
  .recruit__text {
    max-width: 100%;
    width: 100%;
  }
}
.recruit__h4 {
  margin-bottom: 20px;
}
@media only screen and (max-width: 750px) {
  .recruit__ex {
    max-width: 400px;
    margin: 0 auto;
  }
}
.recruit__btn {
  margin: 80px auto 0;
}/*# sourceMappingURL=style.css.map */