@charset "UTF-8";
.fwm {
  font-weight: 500;
}

.f17 {
  font-size: 1.7rem;
}

@media (max-width: 499px) {
  .f18 {
    font-size: 1.6rem;
  }
}

.f20 {
  font-size: 2rem;
}

.f22 {
  font-size: 2.2rem;
}

.f28 {
  font-size: 2.8rem;
}

@media screen and (max-width: 834px) {
  .f28 {
    font-size: 3vw;
  }
}
@media screen and (max-width: 450px) {
  .f28 {
    font-size: 2rem;
  }
}
.f34 {
  font-size: 3.4rem;
}

.f38 {
  font-size: 3.8rem;
}

@media screen and (max-width: 533px) {
  .f38 {
    font-size: 7vw;
  }
}
@media screen and (max-width: 474px) {
  .f38 {
    font-size: 6vw;
  }
}
.f48 {
  font-size: 4.8rem;
}

.f62 {
  font-size: 6.2rem;
}

@media screen and (max-width: 906px) {
  .f62 {
    font-size: 6vw;
  }
}
@media screen and (max-width: 450px) {
  .f62 {
    font-size: 3rem;
  }
}
.white-bg-box {
  border: 4px solid #f0e3da;
  background-color: #fff;
  border-radius: 20px;
}

.mb6 {
  margin-bottom: 6rem;
}

.mb4 {
  margin-bottom: 4rem;
}

.mt4 {
  margin-top: 4rem;
}

/* 改行 */
.br-834 {
  display: none;
}
@media (max-width: 834px) {
  .br-834 {
    display: block;
  }
}

.br-499 {
  display: none;
}
@media (max-width: 499px) {
  .br-499 {
    display: block;
  }
}

.no-br-499 {
  display: block;
}
@media (max-width: 499px) {
  .no-br-499 {
    display: none;
  }
}

/* 共通 */
.sec-about_hg-ttl.f48 {
  line-height: 1.4;
  font-size: clamp(3.2rem, 3vw, 4.8rem);
  white-space: nowrap;
}
@media (max-width: 499px) {
  .sec-about_hg-ttl.f48 {
    white-space: normal;
    font-size: 2.5rem;
  }
}

.sec-about_hg-sub-ttl {
  margin-bottom: 2.8rem;
}
@media (max-width: 834px) {
  .sec-about_hg-sub-ttl {
    margin-bottom: 1rem;
  }
}

/* わたしたちにできること */
.sec-about_intro {
  padding: 17rem 0 12rem;
}
@media (max-width: 834px) {
  .sec-about_intro {
    padding: 5rem 0;
  }
}

.sec-about_intro-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 10%;
}
@media (max-width: 930px) {
  .sec-about_intro-flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.sec-about_intro-flex-item:nth-of-type(2) {
  margin-top: 16rem;
}
@media (max-width: 930px) {
  .sec-about_intro-flex-item:nth-of-type(2) {
    margin-top: 9rem;
  }
}
@media (max-width: 499px) {
  .sec-about_intro-flex-item:nth-of-type(2) {
    margin-top: 6rem;
  }
}

.sec-about_intro-hg {
  margin-bottom: 9rem;
}
@media (max-width: 834px) {
  .sec-about_intro-hg {
    margin-bottom: 6rem;
  }
}
@media (max-width: 499px) {
  .sec-about_intro-hg {
    margin-bottom: 2rem;
  }
}

.sec-about_intro-img01 {
  position: relative;
  display: block;
  margin-left: 14%;
  width: 76%;
}
@media (max-width: 930px) {
  .sec-about_intro-img01 {
    margin-left: 0;
  }
}
@media (max-width: 499px) {
  .sec-about_intro-img01 {
    margin-inline: auto;
  }
}
.sec-about_intro-img01 img {
  border-radius: 20px;
}
.sec-about_intro-img01::after {
  background: url(../img/about/intro04.svg) no-repeat center;
  background-size: contain;
  content: "";
  display: inline-block;
  position: absolute;
  width: 34%;
  aspect-ratio: 181/154;
  bottom: -33px;
  right: -15%;
  z-index: 1;
}
@media (max-width: 930px) {
  .sec-about_intro-img01::after {
    width: 31%;
    right: unset;
    left: 337px;
  }
}
@media (max-width: 639px) {
  .sec-about_intro-img01::after {
    right: -15%;
    left: unset;
  }
}
@media (max-width: 499px) {
  .sec-about_intro-img01::after {
    width: 38%;
  }
}

.sec-about_intro-img02 {
  margin-top: 10rem;
  margin-left: auto;
  width: 80%;
}
@media (max-width: 930px) {
  .sec-about_intro-img02 {
    margin-top: 3rem;
    margin-left: 0;
  }
}
.sec-about_intro-img02 img {
  border-radius: 20px;
}

.sec-about_intro-txt {
  position: relative;
}
@media (max-width: 499px) {
  .sec-about_intro-txt {
    font-size: 1.6rem;
  }
}
.sec-about_intro-txt::after {
  background: url(../img/about/intro03.svg) no-repeat center;
  background-size: contain;
  content: "";
  display: inline-block;
  position: absolute;
  width: 30%;
  aspect-ratio: 156/120;
  top: -133px;
  right: -30px;
  z-index: 1;
}
@media (max-width: 930px) {
  .sec-about_intro-txt::after {
    width: 20%;
    top: -54px;
    left: 62vw;
  }
}
@media (max-width: 639px) {
  .sec-about_intro-txt::after {
    top: -63px;
    left: 74vw;
  }
}
@media (max-width: 499px) {
  .sec-about_intro-txt::after {
    top: unset;
    bottom: -61vw;
  }
}

/* about */
.sec-about_about {
  background: #f7eee8;
  padding: 9rem 0 15rem;
}
@media (max-width: 834px) {
  .sec-about_about {
    padding: 5rem 0;
  }
}
@media (max-width: 499px) {
  .sec-about_about {
    padding-bottom: 2rem;
  }
}

.sec-about_about-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 3rem;
}
@media (max-width: 1024px) {
  .sec-about_about-flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: 4rem;
  }
}

.sec-about_about-flex-item {
  width: 46%;
}
@media (max-width: 1024px) {
  .sec-about_about-flex-item {
    width: 100%;
  }
}

.sec-about_about-service-label {
  background: #93243a;
  color: #fff;
  border-radius: 3px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  padding: 6px 12px;
  display: inline-block;
}

.sec-about_about-service-logo {
  margin: 4rem 0 5rem;
  width: 312px;
}
@media (max-width: 499px) {
  .sec-about_about-service-logo {
    margin: 2rem 0;
  }
}
.sec-about_about-service-logo img {
  width: 100%;
}

.sec-about_about-catch {
  line-height: 1.4;
  margin-bottom: 4rem;
  font-size: clamp(2.4rem, 2vw, 3.2rem);
}
@media (max-width: 499px) {
  .sec-about_about-catch {
    font-size: 2rem;
    margin-bottom: 2rem;
  }
}
.sec-about_about-catch span {
  font-size: clamp(2.6rem, 2.6vw, 4rem);
}

@media (max-width: 1024px) {
  .sec-about_about-flex-img {
    width: 70%;
    margin-inline: auto;
  }
}

/* ヴェルズ高屋の特徴 */
.sec-about_feature {
  padding-top: 16rem;
}
@media (max-width: 834px) {
  .sec-about_feature {
    padding-top: 5rem;
  }
}
@media (max-width: 499px) {
  .sec-about_feature {
    padding-top: 3rem;
  }
}

.sec-about_feature-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin-bottom: 10rem;
}
@media (max-width: 1024px) {
  .sec-about_feature-flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    margin-bottom: 5rem;
  }
}

.sec-about_feature-hg {
  width: 44%;
}
@media (max-width: 1024px) {
  .sec-about_feature-hg {
    width: 100%;
  }
}

.sec-about_feature-hg-ttl {
  line-height: 1.5;
  font-size: clamp(2.6rem, 2.6vw, 4rem);
}
@media (max-width: 1024px) {
  .sec-about_feature-hg-ttl {
    margin-bottom: 4rem;
  }
}
@media (max-width: 499px) {
  .sec-about_feature-hg-ttl {
    margin-bottom: 2rem;
  }
}

.sec-about_feature-flex-txt {
  width: 52%;
}
@media (max-width: 1024px) {
  .sec-about_feature-flex-txt {
    width: 100%;
  }
}

.sec-about_feature-diagram {
  max-width: 1120px;
  width: 80%;
  margin: 0 auto 11rem;
}
@media (max-width: 1024px) {
  .sec-about_feature-diagram {
    width: 100%;
  }
}
@media (max-width: 499px) {
  .sec-about_feature-diagram {
    margin-bottom: 5rem;
  }
}

.sec-about_feature-table-area {
  text-align: center;
}
.sec-about_feature-table-area h3 {
  text-align: center;
  margin-bottom: 4rem;
  font-size: clamp(2.2rem, 2.2vw, 3.2rem);
}
@media (max-width: 834px) {
  .sec-about_feature-table-area h3 {
    line-height: 1.4;
  }
}
@media (max-width: 499px) {
  .sec-about_feature-table-area h3 {
    font-size: 2.5rem;
    margin-bottom: 2rem;
    text-align: left;
  }
}
@media (max-width: 834px) {
  .sec-about_feature-table-area p {
    text-align: left;
  }
}

.sec-about_feature-table-img {
  margin: 6rem 0 8rem;
}
@media (max-width: 930px) {
  .sec-about_feature-table-img {
    overflow-x: auto;
  }
  .sec-about_feature-table-img img {
    display: block;
    width: 1000px;
    height: auto;
    max-width: none;
  }
}
@media (max-width: 499px) {
  .sec-about_feature-table-img {
    margin: 3rem 0 5rem;
  }
}

.sec-about_feature-detail {
  padding: 8rem 8%;
  border-radius: 20px;
  background: url(../img/about/feature-box-bg.png) no-repeat center center/cover;
  display: grid;
  grid-template-columns: 6fr 3fr;
  gap: 14rem;
}
@media (max-width: 1024px) {
  .sec-about_feature-detail {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5%;
  }
}
@media (max-width: 834px) {
  .sec-about_feature-detail {
    padding: 5rem 5rem 6rem;
  }
}
@media (max-width: 499px) {
  .sec-about_feature-detail {
    padding: 2rem 2rem 3rem;
  }
}

.sec-about_feature-detail-body h3 {
  line-height: 1.4;
  margin: 3rem 0;
  font-size: clamp(2.5rem, 2.2vw, 3.2rem);
}
@media (max-width: 499px) {
  .sec-about_feature-detail-body h3 {
    margin-top: 1rem;
    font-size: 2.3rem;
    margin-bottom: 2rem;
  }
}

@media (max-width: 499px) {
  .sec-about_feature-detail-body hgroup {
    text-align: center;
  }
}

.sec-about_feature-detail-label {
  line-height: 1;
  padding: 6px 12px;
  border-radius: 3px;
  background-color: #debcaa;
  display: inline-block;
  color: #fff;
  font-size: clamp(1.3rem, 1.3vw, 1.8rem);
}
@media (max-width: 1024px) {
  .sec-about_feature-detail-label {
    font-size: 1.5rem;
  }
}
@media (max-width: 499px) {
  .sec-about_feature-detail-label {
    font-size: 1.3rem;
    line-height: 1.4;
    text-align: center;
  }
}

.sec-about_feature-detail-img-wrap .c-btn02 {
  max-width: 300px;
  width: 300px;
  margin-top: -28px;
  margin-left: auto;
  position: relative;
}
@media (max-width: 1024px) {
  .sec-about_feature-detail-img-wrap .c-btn02 {
    margin-inline: auto;
  }
}

@media (max-width: 1024px) {
  .sec-about_feature-detail-flex-img {
    margin-inline: auto;
    width: 60%;
  }
}/*# sourceMappingURL=about.css.map */