@charset "UTF-8";
.p-about {
  padding-top: 50px;
}

.p-about__fv {
  aspect-ratio: 1266/436;
  height: 200px;
  margin-inline: auto;
  max-width: 1306px;
  padding-inline: 20px;
  width: 100%;
}

.p-about__inner {
  margin-inline: auto;
  max-width: 1138px;
  padding-inline: 20px;
  padding-top: 40px;
  width: 100%;
}

.p-about__title.c-title-line {
  font-size: 18px;
  line-height: calc(26 / 18);
}

.p-about__contents {
  align-items: flex-start;
  display: flex;
  flex-direction: column-reverse;
  gap: 20px;
  gap: calc(75 / 1366 * 100vw);
  margin-top: 20px;
  padding-bottom: 100px;
}

.p-about__left {
  align-items: flex-start;
  display: flex;
  justify-content: flex-end;
  width: 100%;
}

.p-about__img {
  height: 100%;
  overflow: hidden;
}
.p-about__img:nth-of-type(1) {
  aspect-ratio: 179/301;
  max-width: 179px;
}
.p-about__img:nth-of-type(2) {
  aspect-ratio: 230/301;
  margin-top: 40px;
  max-width: 230px;
}

.p-about__right {
  display: flex;
  flex-direction: column;
  gap: 19px;
}
.p-about__right p {
  font-size: 14px;
  font-weight: 500;
  line-height: calc(32 / 14);
}

.p-about-brand {
  border-top: solid 1px #d3d3d3;
  padding-bottom: 100px;
  padding-top: 60px;
}

.p-about-brand__title.c-top-title {
  align-items: flex-start;
}
.p-about-brand__boxs {
  -moz-column-gap: 10px;
       column-gap: 10px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin-top: 41px;
  row-gap: 25px;
  width: 100%;
}

.p-about-brand__box {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  width: 100%;
}

.p-about-brand__box-logo {
  align-items: center;
  aspect-ratio: 253/189;
  background-color: #fff;
  display: flex;
  justify-content: center;
  padding-inline: 11px;
  width: 100%;
}
.p-about-brand__box-logo img {
  -o-object-fit: contain;
     object-fit: contain;
}

.p-about-brand__box-title {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: calc(17 / 12);
  margin-top: 10px;
}

.p-about-brand__box-desc {
  color: #a3a3a3;
  font-size: 12px;
  line-height: calc(22 / 12);
  margin-top: 5px;
}

@media (min-width: 768px) {
  .p-about__contents {
    flex-direction: row;
    gap: 40px;
    margin-top: 45px;
  }
  .p-about__left {
    gap: calc(43 / 1366 * 100vw);
    justify-content: baseline;
  }
  .p-about__img:nth-of-type(1) {
    width: calc(179 / 1366 * 100vw);
  }
  .p-about__img:nth-of-type(2) {
    margin-top: 102px;
    width: calc(230 / 1366 * 100vw);
  }
  .p-about__right {
    margin-top: 45px;
  }
  .p-about-brand__boxs {
    -moz-column-gap: 29px;
         column-gap: 29px;
    grid-template-columns: repeat(4, 1fr);
    row-gap: 38px;
  }
  .p-about-brand__box-desc {
    font-size: 11px;
    letter-spacing: 0.08em;
  }
}

@media (min-width: 768px) and (min-width: 1024px) {
  .p-about__contents {
    gap: 75px;
    margin-top: 45px;
    padding-bottom: 136px;
  }
}

@media (min-width: 1024px) {
  .p-about__fv {
    height: 436px;
  }
  .p-about__inner {
    padding-top: 78px;
  }
  .p-about-brand {
    padding-bottom: 160px;
    padding-top: 100px;
  }
}

@media (min-width: 1366px) {
  .p-about__left {
    gap: 43px;
  }
  .p-about-brand__box-desc {
    font-size: 12px;
  }
}