@charset "utf-8";

/*===================
共通パーツ
===================*/
.inner-1060 {
  max-width: 1060px;
  width: calc(100% - 40px);
  margin: 0 auto;
}
.inner-1166 {
  max-width: 1166px;
  width: calc(100% - 40px);
  margin: 0 auto;
}
.inner-952 {
  max-width: 952px;
  width: calc(100% - 40px);
  margin: 0 auto;
}
.index__ttl {
  margin-bottom: 42px;
  font-size: 35px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.43;
  color: #002169;
}
.index__txt {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 2;
  color: #333;
}
.index__txt + .index__txt {
  margin-top: 26px;
}
.nextBtn {
  max-width: 260px;
  margin-top: 35px;
}
.nextBtn__link {
  display: block;
  padding: 16px 10px 19px;
  background: #002169;
  border: 1px solid #002169;
  border-radius: 999px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #fff;
  text-align: center;
  transition: 0.3s;
}
.nextBtn__link:hover {
  background: #fff;
  color: #002169;
}
.index_bg {
  background: url(../imgs/index/index_bg.png) top center / cover no-repeat;
}
@media screen and (max-width: 750px) {
  .inner-1060 {
    width: calc(100% - 30px);
  }
  .inner-1166 {
    width: calc(100% - 30px);
  }
  .inner-952 {
    width: calc(100% - 30px);
  }
  .index__ttl {
    font-size: 26px;
  }
  .nextBtn__link {
    font-size: 14px;
    padding: 10px 11px 11px;
  }
}
/*===================
fv
===================*/
.fv {
  width: 92.68%;
  margin-bottom: 150px;

  position: relative;
}

.fv__videoWrap {
  /* padding-top: 56.25%; */
  width: 100%;
  position: relative;
}
.fv__videoWrap video {
  width: 100%;
  height: 100%;
  max-height: 100vh;
  min-height: 100vh;
  border-radius: 0 25px 25px 0;
  /* position: absolute;
  top: 0px;
  left: 0px; */
  object-fit: cover;
}
.movie01__video::-webkit-media-controls {
  display: none !important;
  opacity: 0 !important;
}

.movie01__video::-webkit-media-controls-enclosure {
  display: none !important;
  opacity: 0 !important;
}
.fv__txtBox {
  max-width: 502px;
  width: 79%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  pointer-events: none;
  /* position: absolute;
  width: fit-content;
  top: 73px;
  left: 8%; */
}
/* .fv__txt {
  display: flex;
  flex-direction: column;
}
.fv__txtSpan {
  width: fit-content;
  padding-left: 9px;
  padding-bottom: 5px;
  display: inline-block;
  background: #fff;
  font-size: clamp(33px, 4.36vw, 60px);
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.2;
  color: #002169;
}
.fv__txtSpan + .fv__txtSpan {
  margin-top: 20px;
} */
.fv__txtPic {
  width: 100%;
}
.fv__img {
  min-height: 330px;
  height: calc(100vh - 150px);
  border-radius: 0 25px 25px 0;
  object-fit: cover;
}
@media screen and (max-width: 750px) {
  .fv {
    margin-bottom: 80px;
  }
  /* .fv__txtBox {
    top: 45px;
  } */
  .fv__img {
    height: auto;
  }
}

/*===================
intro
===================*/
.intro {
  padding: 99px 0 108px;
  background: url(../imgs/index/intro_bg.jpg) center center / cover no-repeat;
}
.intro__ttl {
  margin-bottom: 42px;
  font-size: 35px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.43;
  color: #002169;
}
.intro__txtBox {
  width: 65%;
}

@media screen and (max-width: 750px) {
  .intro {
    padding: 59px 0 108px;
  }
  .intro__ttl {
    font-size: 26px;
  }
  .intro__txtBox {
    width: 100%;
  }
  .intro__txt {
    text-shadow: 0px 0px 10px rgba(255, 255, 255, 1);
  }
}

/*===================
point
===================*/
.point {
  padding: 80px 0 84px;
  background: #e4eaf3;
}
.point .index__ttl {
  margin-bottom: 15px;
}
.point__list {
  margin-top: 22px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.point__item {
  width: 100%;
  padding: 25px 27px 41px;
}
.point__item:nth-child(1),
.point__item:nth-child(3),
.point__item:nth-child(6),
.point__item:nth-child(8) {
  background: #fff;
}
.point__item:nth-child(2),
.point__item:nth-child(4),
.point__item:nth-child(5),
.point__item:nth-child(7) {
  background: #f4f6fa;
}

.point__heading {
  margin-bottom: 14px;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.25;
  color: #011645;
  text-align: center;
}
.point__txt {
  font-size: 14px;
  letter-spacing: 0.02em;
  line-height: 1.714;
}
.point__icon01 {
  max-width: 92px;
  margin: 0 auto 40px;
}
.point__icon02 {
  max-width: 92px;
  margin: 0 auto 13px;
}
.point__icon03 {
  max-width: 110px;
  margin: 0 auto 15px;
}
.point__icon04 {
  max-width: 89px;
  margin: 0 auto 41px;
}
.point__icon05 {
  max-width: 75px;
  margin: 0 auto 13px;
}
.point__icon06 {
  max-width: 98px;
  margin: 0 auto 38px;
}
.point__icon07 {
  max-width: 178px;
  margin: 0 auto 49px;
}
.point__icon08 {
  max-width: 81px;
  margin: 0 auto 19px;
}
@media screen and (max-width: 970px) {
  .point__list {
    grid-template-columns: repeat(2, 1fr);
  }
  .point__item:nth-child(1),
  .point__item:nth-child(4),
  .point__item:nth-child(5),
  .point__item:nth-child(8) {
    background: #fff;
  }
  .point__item:nth-child(2),
  .point__item:nth-child(3),
  .point__item:nth-child(6),
  .point__item:nth-child(7) {
    background: #f4f6fa;
  }
}
@media screen and (max-width: 750px) {
  .point__item {
    padding: 16px 13px 24px;
  }
  .point__heading {
    font-size: 17px;
  }
  .point__icon01 {
    max-width: 82px;
  }
  .point__icon02 {
    max-width: 82px;
  }
  .point__icon03 {
    max-width: 100px;
  }
  .point__icon04 {
    max-width: 79px;
  }
  .point__icon05 {
    max-width: 65px;
  }
  .point__icon06 {
    max-width: 88px;
  }
  .point__icon07 {
    max-width: 168px;
  }
  .point__icon08 {
    max-width: 71px;
  }
}
@media screen and (max-width: 470px) {
  .point__list {
    grid-template-columns: repeat(1, 1fr);
  }
  .point__item:nth-child(1),
  .point__item:nth-child(3),
  .point__item:nth-child(5),
  .point__item:nth-child(7) {
    background: #fff;
  }
  .point__item:nth-child(2),
  .point__item:nth-child(4),
  .point__item:nth-child(6),
  .point__item:nth-child(8) {
    background: #f4f6fa;
  }
}

/*===================
top-works
===================*/
.top-works {
  padding: 170px 0 0;
}
.top-works__deco {
  position: relative;
  padding-bottom: clamp(70px, 22.327vw, 305px);
}
.top-works__deco::after {
  display: block;
  content: "WORKS";
  font-weight: bold;
  font-size: clamp(60px, 16.105vw, 220px);
  letter-spacing: 0.05em;
  color: rgba(0, 0, 0, 0);
  -webkit-text-stroke: 1px rgba(1, 23, 69, 0.15);
  text-stroke: 1px rgba(1, 23, 69, 0.15);
  position: absolute;
  right: -64px;
  bottom: 0;
  z-index: -1;
}
.top-works__wrap {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 6%;
}
.top-works .index__ttl {
  margin-bottom: 32px;
}
.top-works__txt {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 2;
}
.top-works__pic {
  max-width: 600px;
  width: 51%;
}

.top-works__box {
  max-width: 343px;
  padding-top: 30px;
}
@media screen and (max-width: 1320px) {
  .top-works__deco::after {
    right: 0;
  }
}
@media screen and (max-width: 900px) {
  .top-works__wrap {
    flex-direction: column;
  }
  .top-works__pic {
    width: 100%;
    margin: 0 auto;
  }
  .top-works__box {
    margin: 0 auto;
  }
}
@media screen and (max-width: 750px) {
  .top-works {
    padding-top: 80px;
  }
}

/*===================
top-service
===================*/
.top-service {
  padding: 35px 0 0;
}
.top-service__deco {
  position: relative;
  padding-bottom: clamp(70px, 22.327vw, 305px);
}
.top-service__deco::after {
  display: block;
  content: "SERVICE";
  font-weight: bold;
  font-size: clamp(60px, 16.105vw, 220px);
  letter-spacing: 0.05em;
  color: rgba(0, 0, 0, 0);
  -webkit-text-stroke: 1px rgba(1, 23, 69, 0.15);
  text-stroke: 1px rgba(1, 23, 69, 0.15);
  position: absolute;
  left: -46px;
  bottom: 0;
  z-index: -1;
}
.top-service__wrap {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 7%;
}
.top-service .index__ttl {
  margin-bottom: 32px;
}
.top-service__txt {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 2;
}
.top-service__pic {
  max-width: 600px;
  width: 52%;
}

.top-service__box {
  max-width: 434px;
  padding-top: 25px;
}
@media screen and (max-width: 1300px) {
  .top-service__deco::after {
    left: 0;
  }
}
@media screen and (max-width: 900px) {
  .top-service__wrap {
    flex-direction: column-reverse;
  }
  .top-service__pic {
    width: 100%;
    margin: 0 auto;
  }
  .top-service__box {
    margin: 0 auto;
  }
}
@media screen and (max-width: 750px) {
}

/*===================
top-about
===================*/
.top-about {
  padding: 39px 0 76px;
}
.top-about__deco {
  position: relative;
  padding-bottom: clamp(70px, 24.011vw, 328px);
}
.top-about__deco::after {
  display: block;
  content: "ABOUT US";
  font-weight: bold;
  font-size: clamp(49px, 16.105vw, 220px);
  letter-spacing: 0.05em;
  color: rgba(0, 0, 0, 0);
  -webkit-text-stroke: 1px rgba(1, 23, 69, 0.15);
  text-stroke: 1px rgba(1, 23, 69, 0.15);
  position: absolute;
  right: -137px;
  bottom: 0;
  z-index: -1;
}
.top-about__wrap {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  /* gap: 5%; */
}
.top-about .index__ttl {
  margin-bottom: 32px;
}
.top-about__txt {
  max-width: 380px;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 2;
}
.top-about__youtubeContainer {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}
.top-about__youtubeBox {
  width: 86%;
}
.top-about__youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.top-about__youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border-radius: 0 25px 25px 0;
}
.top-about__box {
  width: 448px;
  padding-top: 48px;
  flex-shrink: 0;
}
@media screen and (max-width: 1470px) {
  .top-about__deco::after {
    right: 0;
  }
}
@media screen and (max-width: 900px) {
  .top-about__wrap {
    flex-direction: column;
  }
  .top-about__box {
    margin: 0 auto;
    width: fit-content;
  }
  .top-about__youtubeContainer {
    width: 100%;
    margin-left: 0;
  }
  .top-about__youtubeBox {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
  }
  .top-about__youtube iframe {
    border-radius: 25px;
  }
}
/*===================
between
===================*/
.between .img {
  min-height: 280px;
  object-fit: cover;
}

/*===================
top-news
===================*/
.top-news {
  padding: 89px 0 170px;
}
.top-news__wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}
.top-news__ttlBox {
  width: fit-content;
}
.top-news .index__ttl {
  margin-bottom: 0;
}
.top-news__ttl--en {
  display: block;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: rgba(1, 23, 69, 0.5);
  text-align: center;
}
.top-news__list {
  max-width: 680px;
  width: 72%;
  margin-right: 17px;
}
.top-news__item {
}
.top-news__itemLink {
  padding: 30px 0 30px 15px;
  border-bottom: 1px solid #d2d2d2;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  transition: 0.3s;
}
.top-news__itemLink:hover .top-news__arrowBox {
  background: #002169;
}
.top-news__itemLink:hover .top-news__arrow {
  background: #fff;
}
.top-news__itemLink:hover .top-news__arrow::before,
.top-news__itemLink:hover .top-news__arrow::after {
  background: #fff;
}
.top-news__dateBox {
  width: 108px;
}
.top-news__dateSml {
  display: block;
  padding-left: 3px;
  font-size: 15px;
  font-weight: 300;
  letter-spacing: 0.05em;
  line-height: 1;
}
.top-news__dateBig {
  display: block;
  font-size: 56px;
  font-weight: 300;
  letter-spacing: 0.05em;
  line-height: 1;
}
.top-news__detailBox {
  flex: 1;
  padding-right: 15px;
  margin-top: 9px;
}
.top-news__catWrap {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 5px;
}
.top-news__cat {
  display: block;
  width: fit-content;
  padding: 0px 6px;
  margin-bottom: 8px;
  border: 1px solid #011645;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #011645;
}
.top-news__heading {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.75;
}
.top-news__arrowBox {
  width: 65px;
  height: 65px;
  background: #fff;
  border-radius: 50%;
  position: relative;
  transition: 0.3s;
}
.top-news__arrow {
  position: relative;
  display: inline-block;
  width: 1px;
  height: 24px;
  border-radius: 9999px;
  background-color: #002169;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
  -ms-transform: translate(-50%, -50%) rotate(45deg);
  transition: 0.3s;
}

.top-news__arrow::before,
.top-news__arrow::after {
  content: "";
  position: absolute;
  top: 0;
  left: calc(50% - 0.5px);
  width: 1px;
  height: 12px;
  border-radius: 9999px;
  background-color: #002169;
  transform-origin: 50% 0.5px;
  transition: 0.3s;
}

.top-news__arrow::before {
  transform: rotate(45deg);
}

.top-news__arrow::after {
  transform: rotate(-45deg);
}
.view-more {
  margin-right: 17px;
}
.view-more__link {
  display: block;
  color: #002169;
  font-size: 13px;
  font-weight: 700;
  text-align: right;
  width: 100%;
  max-width: 1038px;
  margin: 0 auto;
  padding-top: 34px;
  line-height: 2;
  letter-spacing: 0.08em;
}
@media screen and (max-width: 750px) {
  .top-news {
    padding: 60px 0 60px;
  }
  .top-news__wrap {
    flex-direction: column;
  }
  .top-news__list {
    width: 100%;
    margin-right: 0;
  }
  .top-news__itemLink {
    align-items: flex-end;
    flex-wrap: wrap;
  }
  .top-news__dateBox {
    width: 100%;
  }
  .top-news__dateBig {
    font-size: 38px;
  }
  .top-news__arrowBox {
    width: 40px;
    height: 40px;
  }
  .top-news__arrow {
    height: 19px;
  }
  .top-news__arrow::before,
  .top-news__arrow::after {
    height: 9px;
  }
}