@charset "UTF-8";

.p-fv {
  padding-top: clamp(96px, 16.7642752562vw, 229px);
  min-height: 500px;
  max-height: 800px;
  position: relative;
}

.p-fv__head {
  margin-left: clamp(20px, 7.8125vw, 60px);
  position: relative;
  padding-bottom: clamp(160px, 20.5710102489vw, 281px);
  color: #ffffff;
  z-index: 3;
}
@media screen and (min-width:768px) {
  .p-fv__head {
    margin-left: clamp(60px, 16.6178623719vw, 227px);
  }
}


.p-fv__title-en {
  font-family: "Noto Serif JP", serif;
  font-size: clamp(50px, 8.984375vw, 92px);
  line-height: 1.1956521739;
  letter-spacing: 4.2px;
  font-weight: 200;

}
@media screen and (min-width:768px) {
  .p-fv__title-en {
    letter-spacing: 9.2px;
  }
}

.p-fv__title-ja {
  margin-top: 14px;
  font-size: clamp(14px, 1.5625vw, 16px);
  line-height: 1.5;
  letter-spacing: 1.6px;
  font-weight: 700;
}
.p-fv__news-wrap {
  position: absolute;
  left: 0;
  bottom: -1px;
  padding-left: 30px;
  width: min(399px, 100%);
  aspect-ratio: 399/142;
  background: url(../images/fv-news.png) no-repeat bottom left/cover;
  z-index: 3;
}

.p-fv__news-title {
  margin-top: 42px;
  margin-bottom: 14px;
  font-family: "Quicksand", serif;
  color: #53C372;
  font-size: 16px;
  line-height: 1.4285714286;
  font-weight: 700;
}

.p-fv__item + .p-fv__item {
  margin-top: 11px;
}

.p-fv__item-title {
  padding-left: 22px;
  padding-right: 10px;
  font-size: 13px;
  line-height: 1.4615384615;
  font-weight: 500;
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.p-fv__item-title::before {
  content: "";
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  left: 0;
  width: 8px;
  height: 8px;
  background: #43C263;
  border-radius: 50%;
}

.p-fv__bg {
  position: absolute;
  top: -5.5px;
  left: 0;
  width: 100%;
  height: calc(100% + 5.5px);
  max-height: calc(100% + 5.5px);
  min-height: 500px;
}
.p-fv__bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url(../images/fv-filter.png) no-repeat center center/cover;
  pointer-events: none;
  z-index: 2;
}


.p-fv__swiper-slide {
  position: relative;
  z-index: 2;
}

.p-about {
  padding-top: clamp(80px, 15.234375vw, 156px);
  position: relative;
}

.p-about__container {
  padding-top: clamp(48px, 8.30078125vw, 85px);
  padding-bottom: clamp(120px, 17.67578125vw, 181px);
  padding-left: clamp(20px, 8.0833333333vw, 97px);
  padding-right: 20px;
  background: #F4F6F9;
  border-radius: 5px;
  position: relative;
}

.p-about__head {
  color: #393939;
  position: relative;
  z-index: 2;
}

.p-about__title {
  font-family: "Noto Serif JP", serif;
  font-size: clamp(22px, 3.125vw, 32px);
  line-height: 1.4375;
  letter-spacing: 3.2px;
  font-weight: 700;
}
.p-about__title + .p-about__title {
  margin-top: 15px;
}

.p-about__texts {
  margin-top: 41px;
  max-width: 621px;
}

.p-about__text {
  font-size: clamp(14px, 1.3333333333vw, 16px);
  line-height: 1.8125;
}
.p-about__text + .p-about__text {
  margin-top: 31px;
}

.p-about__btn {
  margin-top: 52px;
}

.p-about__swiper-container {
  position: absolute;
  bottom: clamp(-300px, -32vw, -120px);
  left: clamp(60px, 36.5300146413vw, 499px);
  overflow: hidden;
}
@media screen and (min-width:768px) {
  .p-about__swiper-container {
    bottom: auto;
    top: clamp(200px, 72.9166666667vw, 640px);
  }
}
@media screen and (min-width:1200px) {
  .p-about__swiper-container {
    top: clamp(200px, 59.5703125vw, 610px);
  }
}
@media screen and (min-width:1367px) {
  .p-about__swiper-container {
    left: calc(499px + (100vw - 1366px) / 2);
  }
}

.p-about__swiper-wrapper {
  -webkit-transition-timing-function: linear;
          transition-timing-function: linear;
}

.p-about__swiper-slide {
  aspect-ratio: 615/420;
  max-width: clamp(320px, 51.25vw, 615px);
}

.p-about__bg-text {
  position: absolute;
  top: 0;
  right: 0;
  width: clamp(200px, 45.6808199122vw, 624px);
  aspect-ratio: 624/159;
}

.p-about__left {
  position: absolute;
  top: clamp(120px, 16.50390625vw, 169px);
  left: -48px;
  font-family: "Quicksand", serif;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 1.6px;
  font-weight: 600;
  rotate: 90deg;
}
@media screen and (min-width:768px) {
  .p-about__left {
    left: clamp(-58px, -7.5520833333vw, -48px);
  }
}

.p-equip {
  color: #393939;
  margin-top: clamp(360px, 33.1625183016vw, 453px);
  position: relative;
}

.p-equip__body {
  padding-top: clamp(60px, 7.421875vw, 76px);
  border-top: 1px solid #f4f6f9;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 32px;
  position: relative;
  
}
@media screen and (min-width:768px) {
  .p-equip__body {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

.p-equip__content {
  max-width: 410px;
}
@media screen and (min-width:768px) {
  .p-equip__content {
    padding-top: clamp(42px, 6.588579795vw, 90px);
  }
}

.p-equip__text {
  margin-top: clamp(32px, 5.2083333333vw, 40px);
  font-size: 14px;
  line-height: 2.1428571429;
}
@media screen and (min-width:768px) {
  .p-equip__text {
    margin-left: 23px;
  }
}

.p-equip__btn {
  margin-top: clamp(32px, 2.9282576867vw, 40px);
}
@media screen and (min-width:768px) {
  .p-equip__btn {
    margin-left: 23px;
  }
}

.p-equip__img-wrap {
  max-width: 630px;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-inline: auto;
}
@media screen and (min-width:768px) {
  .p-equip__img-wrap {
    margin-inline: 0;
  }
}

.p-equip__img {
  max-width: 310px;
  aspect-ratio: 1/1;
  border-radius: 5px;
}
.p-equip__img img {
  border-radius: 5px;
}

.p-equip__bg-text {
  position: absolute;
  top: clamp(-121px, -11.81640625vw, -42px);
  left: 50%;
  translate: -50%;
  width: clamp(300px, 94.921875vw, 972px);
  aspect-ratio: 972/121;
}

.p-company {
  margin-top: clamp(120px, 16.0833333333vw, 193px);
  padding-top: clamp(80px, 10.75vw, 129px);
  padding-bottom: clamp(96px, 11.5vw, 138px);
  padding-inline: 20px;
  color: #ffffff;
  position: relative;
}

.p-company__content {
  max-width: 558px;
  margin-inline: auto;
    position: relative;
  z-index: 2;
}

.p-company__title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
@media screen and (min-width:768px) {
  .p-company__title {
    margin-left: clamp(20px, 15.625vw, 131px);
  }
}
@media screen and (min-width:1200px) {
  .p-company__title {
    margin-left: clamp(20px, 12.109375vw, 93px);
  }
}
.p-company__title .c-section__title-ja {
  padding-left: clamp(96px, 9.8096632504vw, 134px);
}

.p-company__text {
  margin-top: clamp(24px, 3.515625vw, 36px);
  font-size: 14px;
  line-height: 1.9285714286;
}

.p-company__btn {
  margin-top: 50px;
  margin-inline: auto;
}

.p-company__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.p-company__bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url(../images/top-company-filter.png) no-repeat center center/cover;
  pointer-events: none;
  z-index: 1;
}

.p-recruit {
  padding-top: clamp(80px, 11.0833333333vw, 133px);
  padding-bottom: clamp(40px, 7.8125vw, 60px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20px;
  color: #ffffff;
  background: #414141;
  border-radius: 5px;
}
@media screen and (min-width:768px) {
  .p-recruit {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
@media screen and (min-width:1367px) {
  .p-recruit {
    padding-inline: calc((100vw - 1366px) / 2);
  }
}

.p-recruit__content {
  margin-inline: 20px;
  max-width: 634px;
}
@media screen and (min-width:768px) {
  .p-recruit__content {
    margin-right: 0;
    margin-left: clamp(60px, 8.78477306vw, 120px);
  }
}

.p-recruit__text {
  margin-top: clamp(24px, 3.41796875vw, 35px);
  font-size: 14px;
  line-height: 1.9285714286;
  max-width: 538px;
}

.p-recruit__link-wrap {
  margin-top: clamp(60px, 9.765625vw, 100px);
  border-bottom: 1px solid #707070;
}

.p-recruit__link {
  border-top: 1px solid #707070;
  padding-left: 33px;
  padding-bottom: 58px;
  position: relative;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.p-recruit__link::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 40px;
  height: 24px;
  background: url(../images/top-recruit-right.png) no-repeat bottom right/contain;
}
@media (any-hover: hover) {
  .p-recruit__link:hover {
    opacity: 1;
    background-color: rgba(255, 255, 255, 0.3);
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
}

.p-recruit__link-num {
  padding-top: 13px;
  font-family: "Quicksand", serif;
  font-size: 18px;
  line-height: 1.2777777778;
  letter-spacing: 2.8px;
    width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
}
.p-recruit__link-num::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: #43C263;
}

.p-recruit__link-body {
  margin-top: 34px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
}
@media screen and (min-width:1200px) {
  .p-recruit__link-body {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

.p-recruit__link-title {
  font-size: clamp(24px, 3.90625vw, 30px);
  line-height: 1.5;
  letter-spacing: 3px;
}

.p-recruit__link-text {
  font-size: 14px;
  line-height: 2;
  max-width: 312px;
}

.p-recruit__swiper-container {
  margin-left: auto;
  width: clamp(240px, 38.579795022vw, 527px);
}
@media screen and (min-width:768px) {
  .p-recruit__swiper-container {
    margin-left: 0;
  }
}

.p-recruit__swiper {
  width: 100%;
  aspect-ratio: 0.5323232323;
}

.p-recruit__swiper .swiper-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.p-recruit__swiper-wrapper {
  -webkit-transition-timing-function: linear;
          transition-timing-function: linear;
}

.p-news {
  margin-right: 28.2576866764%;
  margin-bottom: clamp(72px, 19.53125vw, 200px);
  padding-top: clamp(80px, 12.5vw, 128px);
  padding-bottom: clamp(140px, 31.34765625vw, 321px);
  background: #f4f6f9;
  border-radius: 5px;
  position: relative;
}
@media screen and (min-width:768px) {
  .p-news {
    padding-bottom: clamp(240px, 31.34765625vw, 321px);
    margin-bottom: clamp(72px, 26.0416666667vw, 200px);
  }
}
@media screen and (min-width:1367px) {
  .p-news {
    padding-left: calc((100vw - 1366px) / 2);
    margin-right: calc(386px + (100vw - 1366px) / 2);
  }
}


.p-news__content {
  padding-left: 20px;
}
@media screen and (min-width:768px) {
  .p-news__content {
    padding-left: clamp(60px, 8.78477306vw, 120px);
  }
}

.p-news__text {
  margin-top: clamp(24px, 3.41796875vw, 35px);
  margin-left: 21px;
  font-size: 14px;
  line-height: 1.8571428571;
  max-width: 245px;
}

.p-news__category-wrap {
  margin-top: 25px;
  margin-left: 21px;
}
.p-news__category-wrap .webgene-blog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 10px;
}
.p-news__cat span {
  display: inline-block;
  padding: 7px 11px;
  color: #43c263;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0.96px;
  font-weight: 500;
  text-align: center;
  min-width: 88px;
  background: #ffffff;
  -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
          box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
  border-radius: 10px;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media (any-hover: hover) {
  .p-news__cat:hover span {
    background: #43c263;
    color: #ffffff;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
}

.p-news__btn {
  margin-top: 43px;
  width: 121px;
  position: relative;
}
.p-news__btn::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 38px;
  height: 38px;
  background: url(../images/btn-arrow-ball.png) no-repeat center center/contain;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media (any-hover: hover) {
  .p-news__btn:hover::after {
    translate: 10px 0;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
}

.p-news__btn-text {
  padding-top: 6px;
  padding-bottom: 3px;
  font-size: 14px;
  line-height: 1.4285714286;
  letter-spacing: 0.7px;
  font-weight: 500;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
}
.p-news__btn-text::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: #333333;
}


.p-news__link-container {
  margin-top: 40px;
  margin-left: 20px;
  padding-top: clamp(40px, 7.8125vw, 60px);
  padding-bottom: clamp(40px, 9.375vw, 72px);
  padding-left: clamp(20px, 5.859375vw, 60px);
  padding-right: clamp(20px, 5.859375vw, 60px);
  background: #ffffff;
  border-radius: 5px;
  width: calc(100vw - 20px);
  position: relative;
  z-index: 2;
}
@media screen and (min-width:768px) {
  .p-news__link-container {
    position: absolute;
    top: max(18.5064935065%, 171px);
    right: clamp(-366px, -26.7935578331vw, -120px);
    margin: 0;
    width: 100%;
    max-width: 74.1666666667%;
  }
}
@media screen and (min-width:1024px) {
  .p-news__link-container {
    padding-top: clamp(60px, 11.71875vw, 120px);
    padding-bottom: clamp(72px, 14.84375vw, 152px);
  }
}
@media screen and (min-width:1200px) {
  .p-news__link-container {
    max-width: clamp(500px, 65.8857979502vw, 900px);
    padding-left: clamp(20px, 8.0527086384vw, 110px);
    padding-right: clamp(20px, 7.1666666667vw, 86px);
  }
}

.p-news__link-wrap {
  width: 100%;
  max-width: 704px;
  border-top: 1px solid #e7e6e6;
}

.p-news__item {
  padding-block: clamp(30px, 3.6666666667vw, 44px);
  border-bottom: 1px solid #e7e6e6;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 10px;
  position: relative;
}
@media screen and (min-width:1024px) {
  .p-news__item {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    gap: 22px;
  }
}
.p-news__item::after {
  content: "";
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  right: 0;
  width: 34px;
  height: 33px;
  background: url(../images/top-news-link-right.png) no-repeat center center/contain;
}

.p-news__item-meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 12px;
}

.p-news__item-date {
  font-size: 13px;
  line-height: 1.4615384615;
  letter-spacing: 0.26px;
  font-weight: 500;
  color: #372710;
}

.p-news__item-tag span {
  padding: 3px 8px;
  color: #43c263;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0.96px;
  font-weight: 500;
  text-align: center;
  border: 1px solid #43c263;
  border-radius: 12px;
}

.p-news__item-title {
  padding-right: 44px;
  color: #372710;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 1.28px;
  font-weight: 500;
  text-decoration: underline;
    -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}



.p-news__bg-text {
  position: absolute;
  bottom: 0;
  left: -4.296875%;
  width: clamp(120px, 45.41015625vw, 465px);
  aspect-ratio: 465/121;
}