:root {
  --font-regular: "TsukuGoPr5N-R";
  --font-medium: "TsukuGoPr5N-M";
}

.asset-container {
  padding: 41px 0 230px;
}

.asset-section {
  display: grid;
  padding: 0 40px;
  gap: 40px;
  grid-template-columns: repeat(4, 1fr);
  line-height: 2.2em;
  & + hr {
    margin-top: 110px;
  }
  hr.slide-reveal {
    width: calc(100% + 40px);
  }
}

.asset-section-title {
  max-height: 40px;
  font-size: 1.4rem;
  font-family: var(--font-medium);
  letter-spacing: 0.22em;
}

.asset-list {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  grid-column: 2 / -1;
  width: calc(100% + 40px);
  font-weight: 200;
  &:last-child {
    padding-bottom: 0;
    border-bottom: none;
  }
}

.asset-list-title {
  width: calc((100vw - 200px - var(--scrollbar-width)) / 4);
  max-width: 250px;
  max-height: 40px;
}

.asset-list-content {
  flex: 1;
  min-width: 0;
  padding-right: 40px;
  font-feature-settings: 'palt';
  p {
    margin-bottom: 19px;
  }
}

.asset-info {
  display: flex;
  flex-wrap: wrap;
  row-gap: 8px;
  column-gap: 30px;
  dt {
    width: 75px;
  }
  dd {
    width: calc(100% - 105px);
  }
}

hr.slide-reveal {
  width: 100%;
  grid-column: 2 / -1;
  & + .asset-section {
    padding-top: 40px;
  }
}

@media screen and (max-width: 999px) {
  .asset-container {
    padding: 44px 0 155px;
  }
  .asset-section {
    padding: 0;
    grid-template-columns: none;
    gap: 39px;
    & + hr {
      margin-top: 60px;
    }
    hr.slide-reveal {
      width: 100%;
    }
  }
  .asset-section-title {
    padding: 0 30px 10px;
    font-size: 1.3rem;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .asset-list {
    width: 100%;
    flex-direction: column;
    gap: 38px;
    padding-bottom: 21px;
  }
  .asset-list-title,
  .asset-list-content {
    width: auto;
    max-width: none;
    padding: 0 30px;
    font-size: 1.3rem;
    letter-spacing: 0.1em;
  }
  .asset-list-content {
    line-height: 2em;
    font-feature-settings: normal;
    p {
      margin-bottom: 24px;
    }
  }
  .asset-info {
    row-gap: 17px;
    column-gap: 21px;
    dt {
      width: 58px;
    }
    dd {
      width: calc(100% - 79px);
    }
  }
  hr.slide-reveal {
    width: 100%;
    & + .asset-section {
      padding-top: 45px;
    }
  }
}