@charset "UTF-8";

/* ===== FV下の全幅写真 ===== */

.facilityHero {
  aspect-ratio: 21 / 9;
  overflow: hidden;
  background: var(--gradient-metal);
}

.facilityHeroImg,
.facilityHeroImg img {
  width: 100%;
  height: 100%;
}

.facilityHeroImg img {
  object-fit: cover;
  filter: brightness(.7);
}

/* ===== 弊社保有設備のご案内 ===== */

.facilityMessageHead {
  text-align: center;
}

.facilityMessageBody {
  max-width: 880rem;
  margin-right: auto;
  margin-left: auto;
  font-size: 17rem;
  font-weight: 700;
  line-height: 2.2;
  text-align: center;
}

.facilityMessageBody p + p {
  margin-top: 1.4em;
}

@media (max-width: 767px) {
  .facilityMessageBody {
    font-size: 15rem;
    line-height: 2;
    text-align: left;
  }
}

/* ===== 最先端技術 ===== */

.facilityTechInner {
  display: grid;
  grid-template-columns:
    1fr
    480rem;
  align-items: center;
  gap: 80rem;
}

.facilityTechNum {
  margin-top: 32rem;
  font-family: var(--font-en);
  font-size: 64rem;
  font-weight: 700;
  line-height: 1;
  color: var(--color-accent);
}

.facilityTechText {
  margin-top: 32rem;
}

.facilityTechText p + p {
  margin-top: 1em;
}

.facilityTechFigure {
  aspect-ratio: 1 / 1;
  background: var(--color-black);
}

@media (max-width: 767px) {
  .facilityTechInner {
    grid-template-columns: 1fr;
    gap: 40rem;
  }

  .facilityTechNum {
    margin-top: 20rem;
    font-size: 44rem;
  }
}

/* ===== 設備スペック ===== */

.facilityMachine {
  display: grid;
  grid-template-columns:
    440rem
    1fr;
  gap: 80rem;
  padding-top: 72rem;
  padding-bottom: 72rem;
  border-top: 1px solid var(--color-line-dark);
}

.facilityMachineHead {
  align-self: start;
}

.facilityMachineLabel {
  font-family: var(--font-en);
  font-size: 12rem;
  font-weight: 700;
  letter-spacing: .2em;
  color: var(--color-accent-light);
}

.facilityMachineName {
  margin-top: 12rem;
  font-size: 22rem;
  font-weight: 400;
  line-height: 1.6;
}

.facilityMachineModel {
  display: block;
  margin-top: 4rem;
  font-family: var(--font-en);
  font-size: 15rem;
  font-weight: 500;
  letter-spacing: .06em;
  color: var(--color-btn-text-dark);
}

.facilityMachinePhoto {
  aspect-ratio: 5 / 4;
  margin-top: 28rem;
}

.dataTableRow--head .dataTableHead,
.dataTableRow--head .dataTableData {
  font-size: 12rem;
  font-weight: 500;
  letter-spacing: .1em;
  color: var(--color-gray);
}

.facilityMachineTable .dataTableRow {
  padding: 18rem 0;
}

@media (max-width: 767px) {
  .facilityMachine {
    grid-template-columns: 1fr;
    gap: 32rem;
    padding-top: 48rem;
    padding-bottom: 48rem;
  }

  .facilityMachineName {
    font-size: 19rem;
  }

  .facilityMachineTable .dataTableRow {
    grid-template-columns:
      1fr
      auto;
    gap: 16rem;
    padding: 14rem 0;
  }

  .facilityMachineTable .dataTableHead {
    font-size: 13rem;
  }

  .facilityMachineTable .dataTableData {
    font-size: 14rem;
    text-align: right;
  }
}

/* ===== 弊社保有設備一覧（白地の表） ===== */

.facilityListTable {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid var(--color-line);
}

.facilityListTable th,
.facilityListTable td {
  padding: 22rem 16rem;
  font-size: 15rem;
  font-weight: 400;
  line-height: 1.8;
  text-align: left;
  border-bottom: 1px solid var(--color-line);
}

.facilityListTable thead th {
  font-size: 12rem;
  font-weight: 500;
  letter-spacing: .1em;
  color: var(--color-btn-text);
  background-color: var(--color-bg-gray);
}

.facilityListTable td {
  color: var(--color-text-sub);
}

.facilityListTable td:last-child,
.facilityListTable th:last-child {
  width: 100rem;
  text-align: center;
}

@media (max-width: 767px) {
  .facilityListScroll {
    overflow-x: auto;
  }

  .facilityListTable {
    min-width: 560rem;
  }

  .facilityListTable th,
  .facilityListTable td {
    padding: 16rem 12rem;
    font-size: 13rem;
  }

  .facilityListTable td:last-child,
  .facilityListTable th:last-child {
    width: 56rem;
  }
}