@charset "UTF-8";
/* 共通パーツ（調整）
---------------------------------------------------------------------------- */
.m-btn04 {
  min-height: 5rem;
  padding-inline: 3.6rem 1.4rem;
}

.m-btn04 ._txt {
  font-size: 1.8rem;
  line-height: 1.4444444444;
}

.m-btn04 ._arrow {
  width: 2.2rem;
  height: 2.2rem;
}

.m-btn04 ._arrow::before {
  width: 0.5rem;
}

@media screen and (max-width: 767px) {
  .m-btn04 {
    min-height: 10.9333333333vw;
    padding-inline: 7.7333333333vw 3.2vw;
  }
  @supports (-moz-appearance: none) {
    .m-btn04 {
      padding-inline: 5.8666666667vw 3.2vw;
    }
  }
  .m-btn04 ._txt {
    font-size: 3.4666666667vw;
    line-height: 1.4615384615;
  }
  .m-btn04 ._arrow {
    width: 4.5333333333vw;
    height: 4.5333333333vw;
  }
  .m-btn04 ._arrow::before {
    width: 1.0666666667vw;
  }
}
/* p-bg
---------------------------------------------------------------------------- */
.p-bg {
  background-color: #F6F3EF;
}

/* p-about-top
---------------------------------------------------------------------------- */
.p-about-top {
  padding-block: 8rem 10.5rem;
}

.p-about-top-read {
  font-size: 1.6rem;
  line-height: 1.5625;
  letter-spacing: 0.06em;
  font-weight: 500;
  text-align: center;
}
.p-about-top-read em {
  font-weight: 900;
  color: #C90909;
  background-image: linear-gradient(to bottom, transparent 60%, #FFEF6E 60%);
  background-repeat: no-repeat;
}

.p-about-top-items {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0 3.3rem;
  margin-top: 4rem;
}

.p-about-top-item {
  display: flex;
  flex-direction: column;
}

.p-about-top-item a {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.8rem;
  transition: filter 0.3s ease;
}
@media (any-hover: hover) {
  .p-about-top-item a:hover {
    filter: brightness(1.1);
  }
}

.p-about-top-item-img {
  width: 100%;
  aspect-ratio: 275/172;
  border-radius: 1rem;
  overflow: hidden;
}
.p-about-top-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.p-about-top-item-body {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.p-about-top-item-ttl {
  flex: 1;
  font-size: 2.5rem;
  line-height: 1.52;
  font-weight: 700;
  color: #C90909;
  text-align: center;
  align-content: center;
}

.p-about-top-item-txt {
  font-size: 1.6rem;
  line-height: 1.5625;
  letter-spacing: 0.06em;
  font-weight: 500;
  color: #333;
  margin-top: 1.5rem;
}

.p-about-top-item-button {
  width: 100%;
  margin-top: 3rem;
}

@media screen and (max-width: 767px) {
  .p-about-top {
    padding-block: 9.8666666667vw 13.3333333333vw;
  }
  .p-about-top-read {
    font-size: 4vw;
    line-height: 1.5333333333;
    text-align: left;
  }
  .p-about-top-items {
    grid-template-columns: repeat(2, 1fr);
    gap: 5.3333333333vw 4vw;
    margin-top: 5.3333333333vw;
  }
  .p-about-top-item a {
    gap: 2.6666666667vw;
  }
  .p-about-top-item-img {
    border-radius: 2.6666666667vw;
  }
  .p-about-top-item-ttl {
    font-size: 5.3333333333vw;
    line-height: 1.5;
  }
  .p-about-top-item-txt {
    font-size: 4vw;
    line-height: 1.5333333333;
    margin-top: 2.1333333333vw;
  }
  .p-about-top-item-button {
    margin-top: 2.6666666667vw;
  }
}
/* p-about-service
---------------------------------------------------------------------------- */
.p-about-service {
  padding-block: 8rem 10rem;
}

.p-about-service-read {
  font-size: 1.6rem;
  line-height: 1.5625;
  letter-spacing: 0.06em;
  font-weight: 500;
  text-align: center;
  margin-top: 4rem;
}

.p-about-service-items-wrap {
  margin-top: 8rem;
}

.p-about-service-items-ttl {
  display: grid;
  grid-template-columns: auto auto 1fr;
  font-size: 2.4rem;
  line-height: 1.5;
  letter-spacing: 0.06em;
  font-weight: 700;
  padding-bottom: 0.7rem;
  border-bottom: 1px solid #E8E8E4;
  margin-bottom: 3rem;
}

.p-about-service-items-ttl::before,
.p-about-service-items-ttl::after {
  content: "";
  width: 0.3rem;
  height: 100%;
  background-color: #C90909;
  border-radius: calc(infinity * 1px);
  overflow: hidden;
}

.p-about-service-items-ttl::before {
  grid-column: 1/2;
  grid-row: 1/2;
  margin-right: 0.4rem;
}

.p-about-service-items-ttl::after {
  grid-column: 2/3;
  grid-row: 1/2;
  margin-right: 1rem;
}

.p-about-service-items {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4rem 3.7rem;
}

.p-about-service-item a {
  display: flex;
  flex-direction: column;
  gap: 1.9rem;
}

.p-about-service-item-img {
  width: 100%;
  aspect-ratio: 375/154;
}
.p-about-service-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.p-about-service-item-txt {
  font-size: 1.5rem;
  line-height: 1.5333333333;
  letter-spacing: 0.06em;
  font-weight: 400;
  color: #333;
}
.p-about-service-item-txt em {
  font-weight: 700;
  color: #C90909;
}

@media screen and (max-width: 767px) {
  .p-about-service {
    padding-block: 13.3333333333vw 13.8666666667vw;
  }
  .p-about-service-read {
    font-size: 4vw;
    line-height: 1.5333333333;
    margin-top: 7.4666666667vw;
  }
  .p-about-service-items-wrap {
    margin-top: 10.6666666667vw;
  }
  .p-about-service-items-ttl {
    font-size: 4.8vw;
    line-height: 1.5555555556;
    padding-bottom: 2.4vw;
    margin-bottom: 5.3333333333vw;
  }
  .p-about-service-items-ttl::before,
  .p-about-service-items-ttl::after {
    width: 0.8vw;
  }
  .p-about-service-items-ttl::before {
    margin-right: 1.0666666667vw;
  }
  .p-about-service-items-ttl::after {
    margin-right: 2.6666666667vw;
  }
  .p-about-service-items {
    grid-template-columns: repeat(2, 1fr);
    gap: 5.3333333333vw 2.9333333333vw;
  }
  .p-about-service-item a {
    gap: 2.1333333333vw;
  }
  .p-about-service-item-txt {
    font-size: 4vw;
  }
}
/* p-about-overview
---------------------------------------------------------------------------- */
.p-about-overview {
  padding-block: 8rem;
  background-color: #F6F3EF;
}

.p-about-overview-box {
  padding-bottom: 0.8rem;
  border-bottom: 1px solid #E8E8E4;
  margin-top: 4rem;
}

.p-about-overview-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 4rem;
  margin-inline: auto;
  margin-top: 3rem;
}

.p-about-overview-wrapper-img {
  display: block;
  width: 33rem;
  aspect-ratio: 330/220;
}
.p-about-overview-wrapper-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.p-about-overview-wrap-ttl {
  font-size: 1.8rem;
  line-height: 1.5;
  letter-spacing: 0.06em;
  font-weight: 700;
  color: #C90909;
}

.p-about-overview-wrap-button-wrap {
  display: grid;
  grid-template-columns: 27.5rem 27.5rem;
  gap: 0 2rem;
  margin-top: 1.5rem;
}

.p-about-overview-wrap-button {
  width: 100%;
}

.p-about-overview-wrap-button .m-btn04 {
  min-height: 5rem;
}

.p-about-overview-wrap-button .m-btn04 ._txt {
  font-size: 1.8rem;
  line-height: 1.4444444444;
  font-weight: 700;
}

.p-about-overview-wrap-button .m-btn04 ._blank {
  width: 2.4rem;
  height: 2.4rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url(./../../images/about/icn_blank.svg);
}

@media screen and (max-width: 767px) {
  .p-about-overview {
    padding-block: 13.3333333333vw;
  }
  .p-about-overview-box {
    padding-bottom: 2.1333333333vw;
    margin-top: 8vw;
  }
  .p-about-overview-wrapper {
    flex-direction: column;
    gap: 5.3333333333vw;
    margin-top: 5.3333333333vw;
  }
  .p-about-overview-wrapper-img {
    width: 100%;
    aspect-ratio: 335/110;
  }
  .p-about-overview-wrapper-img {
    width: 100%;
  }
  .p-about-overview-wrap {
    width: 89.3333333333vw;
    margin-inline: auto;
  }
  .p-about-overview-wrap-ttl {
    font-size: 4.2666666667vw;
    line-height: 1.5;
  }
  .p-about-overview-wrap-button-wrap {
    grid-template-columns: 1fr;
    gap: 4.8vw;
    margin-top: 4vw;
  }
  .p-about-overview-wrap-button {
    width: 100%;
  }
  .p-about-overview-wrap-button .m-btn04 {
    min-height: 14.6666666667vw;
  }
  .p-about-overview-wrap-button .m-btn04 ._txt {
    font-size: 4.2666666667vw;
    line-height: 1.5;
  }
  .p-about-overview-wrap-button .m-btn04 ._blank {
    width: 5.8666666667vw;
    height: 5.8666666667vw;
  }
}