@charset "UTF-8";
/* CSS Document */

.about-hero{
  height: min(500px,51.28vw);
}
.about-hero img{
  object-fit: cover;
  height: 100%;
  object-position: center;
}
.about-contents{
  display: grid;
  grid-template-columns: 100%;
  gap:min(160px,20vw);
  background-image: url( "../images/about/wall.webp");
  background-size: 100%;
  background-repeat: repeat-y;
  background-position: left top;
}

.page-about_detail{
  display: grid;
  grid-template-columns: 100%;
  gap:min(50px,11vw);
}
#link03.page-about_detail{
  background-color: var(--wall_blue);
  padding-bottom: min(160px,20vw);
  color: var(--clr-main);
}
.page-about__desc{
  display: flex;
  flex-direction: column;
  text-align: center;
  gap:min(80px,11vw);
  padding-left: min(50px, 6.8vw);
  padding-right: min(50px, 6.8vw);
}
.about-title{
/*  font-size: clamp(22px, 4vw, 34px);*/
  font-size: clamp(22px, 5.641vw, 30px);
  line-height: calc(50/34);
  letter-spacing: .15em;
}
@supports (text-box-trim: trim-start) {
  .about-title{
    text-box-trim: trim-start;
    text-box-edge: text;
  }
}
.page-about__desc .lead-title{
  font-size: clamp(16px, 4.103vw, 25px);
}
.page-about__desc .lead-text{
  font-size: clamp(12px, 3.077vw, 16px);
}
.page-about__desc .desc-box{
  display: flex;
  flex-direction: column;
  gap:min(48px,6vw);
}

.about-image_box{
/*  width: min(1440px,100%);*/
  width: 100%;
  margin-inline:auto;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap:min(16px,4vw);
}
.about-image_box figure img{
  object-fit: cover;
  height: 100%;
  object-position: center;
}

.page-about_pairing{
  display: grid;
  grid-template-columns: min(632px,100%);
  justify-content: center;
  gap:min(64px,8vw);
}
.page-about_pairing > li{
  display: flex;
  flex-direction: column;
  gap:min(24px,4.12vw);
  color: var(--clr-main);
  text-align: center;
}
.pairing-title{
  font-size: clamp(16px, 4vw, 22px);
  line-height: calc(26/22);
  letter-spacing: .2em;
  font-weight: 500;
}
.page-about_pairing  .lead-text{
  line-height: 150%;
/*  font-size: clamp(10px, 2.564vw, 15px);*/
  font-size: clamp(9.6px, 2.564vw, 15px);
}
@media(max-width:768px){
  .about-image_box{
    gap:0;
  }
  .about-image_box figure{
    aspect-ratio:1;
  }
}