@charset "utf-8";

/* ======================
fv
========================= */
.fv {
  height: 56.72vw;
  max-height: 100vh;
  min-height: 750px;
}
.fv__inner {
  width: 100%;
  min-width: 1440px;
  height: 56.72vw;
  min-height: 100%;

  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.fv__ttl {
  width: 28.02%;
  position: absolute;
  top: 46.5%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}
.fv__bg img {
  opacity: 0;
  transform: translateY(40px);
}
.fv.bg-active .fv__bg img {
  animation: bgFadeUp 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes bgFadeUp {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.fv:not(.is-active) .fv__ttl img {
  transform: scale(0.8);
  opacity: 0;
}
.fv.is-active .fv__ttl img {
  animation: fvTtlPoyon 0.8s cubic-bezier(0.34, 1.6, 0.64, 1) forwards;
}
@keyframes fvTtlPoyon {
  0% {
    transform: scale(0.8);
    opacity: 0;
  }
  60% {
    transform: scale(1.08);
    opacity: 1;
  }
  80% {
    transform: scale(0.97);
  }
  100% {
    transform: scale(1);
  }
}

.fv__imgCircle {
  position: absolute;
}
.fv__imgCircle.circle1 {
  width: 6.98%;
  top: 36%;
  right: 2.6%;
  transform: translate(50%, -50%);
}
.fv__imgCircle.circle2 {
  width: 9.22%;
  top: 16%;
  left: 4.2%;
  transform: translate(-50%, -50%);
}
.fv__imgCircle.circle3 {
  width: 8.39%;
  top: 7%;
  left: 38%;
  transform: translate(-50%, -50%);
}
.fv__imgCircle.circle4 {
  width: 5.52%;
  top: 95.5%;
  right: 45%;
  transform: translate(50%, -50%);
}
.fv.float-active .fv__imgCircle .fv__imgInner {
  animation: floatCircle 3s ease-in-out infinite;
}
@keyframes floatCircle {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}
.fv__imgCircle img {
  opacity: 0;
  transform: scale(0);
}
.fv__imgCircle.circle-show img {
  animation: circleFadeIn 0.9s ease-out forwards;
}
@keyframes circleFadeIn {
  0% {
    opacity: 0;
    transform: scale(0.7);
  }
  40% {
    opacity: 1;
    transform: scale(1.05);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.fv__img {
  position: absolute;
}
.fv__img.img1 {
  width: 8.7%;
  top: 6%;
  left: 17%;
  transform: translate(-50%, -50%);
}
.fv__img.img2 {
  width: 11.09%;
  top: 20%;
  left: 27.5%;
  transform: translate(-50%, -50%);
}
.fv__img.img3 {
  width: 14.22%;
  top: 35%;
  left: 14.5%;
  transform: translate(-50%, -50%);
}
.fv__img.img4 {
  width: 11.82%;
  top: 60%;
  left: 4.8%;
  transform: translate(-50%, -50%);
}
.fv__img.img5 {
  width: 18.18%;
  top: 66.5%;
  left: 23.8%;
  transform: translate(-50%, -50%);
}

.fv__img.img6 {
  width: 9.53%;
  top: 85.7%;
  left: 11%;
  transform: translate(-50%, -50%);
}
.fv__img.img7 {
  width: 7.92%;
  top: 86.7%;
  left: 35.5%;
  transform: translate(-50%, -50%);
}
.fv__img.img8 {
  width: 6.35%;
  top: 10%;
  right: 6%;
  transform: translate(50%, -50%);
}
.fv__img.img9 {
  width: 7.5%;
  top: 14%;
  right: 30.4%;
  transform: translate(50%, -50%);
}

.fv__img.img10 {
  width: 17.29%;
  top: 27.6%;
  right: 17%;
  transform: translate(50%, -50%);
}
.fv__img.img11 {
  width: 10.42%;
  top: 54.4%;
  right: 25.5%;
  transform: translate(50%, -50%);
}
.fv__img.img12 {
  width: 12.14%;
  top: 56%;
  right: 9%;
  transform: translate(50%, -50%);
}
.fv__img.img13 {
  width: 13.28%;
  top: 80%;
  right: 29%;
  transform: translate(50%, -50%);
}
.fv__img.img14 {
  width: 9.38%;
  top: 79%;
  right: 15%;
  transform: translate(50%, -50%);
}

.fv.float-active .fv__img.img1 .fv__imgInner,
.fv.float-active .fv__img.img2 .fv__imgInner,
.fv.float-active .fv__img.img4 .fv__imgInner,
.fv.float-active .fv__img.img6 .fv__imgInner,
.fv.float-active .fv__img.img7 .fv__imgInner,
.fv.float-active .fv__img.img8 .fv__imgInner,
.fv.float-active .fv__img.img9 .fv__imgInner,
.fv.float-active .fv__img.img11 .fv__imgInner,
.fv.float-active .fv__img.img14 .fv__imgInner {
  animation: floatSmall 3.5s ease-in-out infinite;
}
@keyframes floatSmall {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}
.fv.float-active .fv__img.img3 .fv__imgInner,
.fv.float-active .fv__img.img5 .fv__imgInner,
.fv.float-active .fv__img.img10 .fv__imgInner,
.fv.float-active .fv__img.img12 .fv__imgInner,
.fv.float-active .fv__img.img13 .fv__imgInner {
  animation: floatLarge 5s ease-in-out infinite;
}
@keyframes floatLarge {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-18px);
  }
}

.fv__img img {
  opacity: 0;
  transform: scale(0);
}
.fv.is-active .fv__img img {
  animation: fvImgPoyon 0.7s cubic-bezier(0.34, 1.6, 0.64, 1) forwards;
}
@keyframes fvImgPoyon {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  60% {
    opacity: 1;
    transform: scale(1.15);
  }
  80% {
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
.fv.is-active .img1 img {
  animation-delay: 0.6s;
}
.fv.is-active .img2 img {
  animation-delay: 0.9s;
}
.fv.is-active .img3 img {
  animation-delay: 0.7s;
}
.fv.is-active .img4 img {
  animation-delay: 1.1s;
}
.fv.is-active .img5 img {
  animation-delay: 0.8s;
}
.fv.is-active .img6 img {
  animation-delay: 1.2s;
}
.fv.is-active .img7 img {
  animation-delay: 0.95s;
}
.fv.is-active .img8 img {
  animation-delay: 1.05s;
}
.fv.is-active .img9 img {
  animation-delay: 0.75s;
}
.fv.is-active .img10 img {
  animation-delay: 1.15s;
}
.fv.is-active .img11 img {
  animation-delay: 0.85s;
}
.fv.is-active .img12 img {
  animation-delay: 1.25s;
}
.fv.is-active .img13 img {
  animation-delay: 0.9s;
}
.fv.is-active .img14 img {
  animation-delay: 1.3s;
}
/* ======================
index-common
========================= */
.index .sec_heading:not(.bottom_recruit__heading) {
  gap: 0.8em;
  margin-bottom: max(16px, 0.4em);
}

.index .sec_heading-txt {
  line-height: 1.78;
  margin-bottom: 1.5em;
}

/* ======================
about
========================= */
.about {
  padding: 70px 0 clamp(50px, 13.89vw, 100px);
}
.scroll-infinity__item {
  width: 100vw;
  max-width: 640px;
  aspect-ratio: 640 / 449;
  overflow: hidden;
}
.scroll-infinity-pic {
  position: absolute;
  top: 0;
}
.about__headingbk {
  max-width: 564px;
  padding: 34px 20px 0 clamp(20px, 5.56vw, 38px);
  margin-bottom: 24px;
  border-radius: clamp(20px, 6.11vw, 40px) clamp(20px, 6.11vw, 40px) 0 0;
  position: relative;
  z-index: 2;
}
.about__headingbk-flex {
  display: flex;
  align-items: center;
  gap: clamp(18px, 5vw, 33px);
}
.about__heading {
  width: 69px;
  flex-shrink: 0;
}
.about__txtbk {
  padding-top: 1em;
}
.about__txtbk p {
  font-size: clamp(16px, 3.33vw, 20px);
  line-height: 1.5;
  margin-bottom: 1em;
}

.about__txtbk p span {
  display: inline-block;
}
.about__catch {
  font-size: clamp(35px, 7.29vw, 50px);
  line-height: 1.56;
  letter-spacing: 0.05em;
  padding-left: clamp(20px, 5.56vw, 38px);
  margin-bottom: 40px;
}
.about__catch .spbr {
  display: none;
}
.about__catch span {
  display: inline-block;
}
.about .bk_btn {
  margin-left: clamp(20px, 5.56vw, 34px);
}
/* ======================
	message
========================= */
.message {
  padding: 140px 0 130px;
}
.message::before {
  content: "";
  width: 100%;
  aspect-ratio: 75/37;
  position: absolute;
  top: 50%;
  left: 50%;
  background: url(../imgs/index/message_bg.svg) no-repeat center / cover;
  transform: translate(-50%, -50%);
  z-index: -1;
}
.message__inner {
  display: flex;
  gap: max(17px, 4.72vw) 4.7vw;
  width: 100%;
}
.message__imgbk {
  width: 757px;
  aspect-ratio: 757 / 664;
  position: relative;
}
.message__imgbk img {
  width: 102.5%;
  position: absolute;
  right: 0;
}
.message__imgbk img.inv_mov {
  opacity: 0;
  transform: scale(0.9);
}
.message__imgbk img.inv_mov.mov {
  animation: messageZoomFade 1s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes messageZoomFade {
  0% {
    opacity: 0;
    transform: scale(0.9);
  }
  60% {
    opacity: 1;
    transform: scale(1.03);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
.message__headingbk {
  padding: 5vw 4vw 0 0;
}
.message .bk_btn {
  width: 80%;
  margin: 0 auto;
}

/* ======================
	voice
========================= */
.other_voices {
  padding: clamp(34px, 9.44vw, 96px) 0 clamp(84px, 23.33vw, 258px);
  background: transparent;
}
.voice__headingbk {
  margin-bottom: clamp(36px, 10vw, 55px);
}
/* ======================
	service
========================= */
.service {
  padding: max(218px, 11.35vw) 0 max(100px, 22.66vw);
}
.service::before {
  content: "";
  display: block;
  width: 100%;
  min-width: 801px;
  height: 47.19vw;
  min-height: 376px;
  background: url(../imgs/index/service_bg.jpg) no-repeat top center/100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%);
  z-index: -1;
}

.service__imgbk {
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%);
  z-index: -1;
}

.service__headingbk {
  background: url(../imgs/index/service_txt_bg.jpg) no-repeat center/cover;
  padding: clamp(4px, 1.11vw, 7px);
  border-radius: 20px;
  width: 100%;
  max-width: 512px;
}
.service__headingbk-inner {
  border-radius: 19.5px;
  padding: 5% 6% 11% 8%;
}
.service_heading {
  gap: 0.8em;
  margin-bottom: max(16px, 0.4em);
  align-items: flex-start;
}
.service .sec_heading-txt {
  line-height: 1.78;
  margin-bottom: 1.5em;
}
.service .bk_btn {
  width: 100%;
}
/* ======================
	news
========================= */
.news {
  margin-bottom: clamp(94px, 26.11vw, 225px);
}
.news__heading {
  align-items: flex-start;
  width: 397px;
}
.news__list {
  width: calc(100% - 427px);
  max-width: 721px;
  position: absolute;
  top: 0;
  right: 0;
}
.news__item {
  border-bottom: 1px solid #000;
}
.news__item a {
  font-size: clamp(16px, 3.33vw, 18px);
  display: flex;
  align-items: first baseline;
  gap: 0 2.1em;
  padding: 1.04em 0;
  transition: 0.3s;
}
.news__item a:hover {
  opacity: 0.7;
}
.news__title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.news .bk_btn {
  margin-top: 45px;
}

@media screen and (max-width: 1830px) {
  /* ======================
	message
	========================= */
  .message {
    background: url(../imgs/index/message_bg.svg) no-repeat right top / cover;
  }
  .message::before {
    content: none;
  }
}
@media screen and (max-width: 1440px) {
  /* ======================
	news
	========================= */
  .news .content,
  .no_contents {
    width: 62%;
    max-width: 626px;
  }
}
@media screen and (max-width: 1100px) {
  .about {
    padding-top: clamp(165px, 45.83vw, 336px);
  }
  .about__headingbk-flex {
    flex-direction: column;
  }
  .about__heading {
    width: 72.22vw;
    max-width: 356px;
  }
  .about__heading .pc {
    display: none;
  }

  .about__heading .sp {
    display: block;
  }
  .about__catch .spbr {
    display: block;
  }
}
@media screen and (max-width: 980px) {
  /* ======================
	news
	========================= */
  .news__heading {
    width: 100%;
  }
  .news__list {
    width: 100%;
    max-width: initial;
    position: static;
  }
  .news .bk_btn {
    margin: 45px auto 0;
  }
}
@media screen and (max-width: 880px) {
  /* ======================
fv
========================= */
  .fv {
    height: 204.44vw;
    max-height: 100svh;
    min-height: 480px;
  }
  .fv__inner {
    min-width: initial;
    height: 204.44vw;
    max-height: 1298px;
    top: 50%;
    transform: translate(-50%, -50%);
  }

  .fv__ttl {
    width: 63.61%;
    max-width: 404px;
    top: 50%;
    transform: translate(-50%, -54%);
  }
  .fv__bg {
    width: 133.89%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .fv__bg .pc {
    display: none;
  }
  .fv__bg .sp {
    display: block;
  }
  .fv__imgCircle.circle1 {
    width: 15.28%;
    top: 48%;
    right: 1.6%;
  }
  .fv__imgCircle.circle2 {
    display: none;
  }
  .fv__imgCircle.circle3 {
    width: 18.06%;
    top: -1%;
    left: 44%;
  }
  .fv__imgCircle.circle4 {
    width: 6.94%;
    top: 93%;
    right: 38%;
  }

  .fv__img.img4,
  .fv__img.img9 {
    display: none;
  }
  .fv__img.img1 {
    width: 18.89vw;
    max-width: 119px;
    top: 8%;
    left: 18%;
  }
  .fv__img.img2 {
    width: 23.89vw;
    max-width: 152px;
    top: 7%;
    right: 16%;
    left: auto;
    transform: translate(50%, -50%);
  }
  .fv__img.img3 {
    width: 30.83vw;
    max-width: 195px;
    top: 23%;
    left: 11%;
  }
  .fv__img.img5 {
    width: 39.44vw;
    max-width: 249px;
    top: 18%;
    left: 52%;
  }
  .fv__img.img6 {
    width: 20.56vw;
    max-width: 131px;
    top: 45%;
    left: 4%;
  }
  .fv__img.img7 {
    width: 17.22vw;
    max-width: 109px;
    top: 23%;
    right: 14%;
    left: auto;
    transform: translate(50%, -50%);
  }
  .fv__img.img8 {
    width: 13.89vw;
    max-width: 88px;
    top: auto;
    bottom: 34%;
    right: 12%;
    transform: translate(50%, 50%);
  }
  .fv__img.img10 {
    width: 37.5vw;
    max-width: 237px;
    top: auto;
    bottom: 21%;
    right: 37%;
    transform: translate(50%, 50%);
  }
  .fv__img.img11 {
    width: 22.5vw;
    max-width: 143px;
    top: auto;
    bottom: 23%;
    right: auto;
    left: 16%;
    transform: translate(-50%, 50%);
  }
  .fv__img.img12 {
    width: 26.11vw;
    max-width: 166px;
    top: auto;
    bottom: 20%;
    right: -7%;
    transform: translate(50%, 50%);
  }
  .fv__img.img13 {
    width: 28.61vw;
    max-width: 182px;
    top: auto;
    bottom: 10%;
    left: 34%;
    right: auto;
    transform: translate(-50%, 50%);
  }
  .fv__img.img14 {
    width: 20.28vw;
    max-width: 129px;
    top: auto;
    bottom: 9%;
    right: 14%;
    left: auto;
    transform: translate(50%, 50%);
  }
  /* ======================
	message
	========================= */
  .message {
    padding: 55px 0 166px;
    background: url(../imgs/index/message_bg_sp.svg) no-repeat top center/ auto 100%;
  }

  .message__inner {
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
  }
  .message__imgbk {
    max-width: 506px;
    width: 94%;
  }
  .message__headingbk {
    width: 92%;
    padding: 0;
  }
  /* ======================
	service
	========================= */
  .service {
    padding-top: 298px;
  }
}
@media screen and (max-width: 768px) {
}
@media screen and (max-width: 480px) {
  /* ======================
	about
	========================= */
  .about .bk_btn {
    margin: 0 auto;
  }
  /* ======================
	service
	========================= */
  .service__list {
    justify-content: center;
  }
  .service__item {
    width: calc((100% - 10px) / 2);
    max-width: 160px;
  }
  /* ======================
	news
	========================= */
  .news__item a {
    flex-direction: column;
  }
}

@media screen and (max-width: 375px) {
  /* ======================
	message
	========================= */
  .message .bk_btn {
    width: 100%;
    max-width: 280px;
    min-width: initial;
  }
}