.top-catch {
  text-align: center;
  color: var(--color-charcoal);
  padding: 28px 0;
}
@media print, screen and (768px <= width) {
  .top-catch {
    padding: 44px 0;
  }
}
.top-catch + .top-catch {
  padding-top: 0;
}
.top-catch-ttl {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
}
.top-catch-label {
  display: inline-block;
  color: var(--color-cream);
  letter-spacing: 0.5em;
  text-indent: 0.5em;
  background-color: var(--color-brown);
  border-radius: 0.2em;
  padding: 0.5em 1em;
}
.top-catch-main {
  font-size: var(--font-size24);
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.05em;
  margin: 15px 0 0;
}
@media print, screen and (768px <= width) {
  .top-catch-main {
    margin: 20px 0 0;
  }
}
.top-catch-sub {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.05em;
  margin: 15px 0 0;
}
@media print, screen and (768px <= width) {
  .top-catch-sub {
    font-size: 16px;
    margin: 20px 0 0;
  }
}

.top-topics-list {
  display: grid;
  grid-template-columns: 100%;
  gap: 1em 0;
  font-size: var(--font-size16);
  line-height: 1.6;
}
@media print, screen and (768px <= width) {
  .top-topics-item {
    display: flex;
    gap: 0 2em;
  }
}
.top-topics-date {
  flex-shrink: 0;
  letter-spacing: 0.1em;
}
.top-topics-text {
  margin: 0.25em 0 0;
}
@media print, screen and (768px <= width) {
  .top-topics-text {
    margin: 0;
  }
}
.top-topics-link {
  color: var(--color-brown02);
}

.top-about-box {
  font-size: var(--font-size16);
}
@media print, screen and (768px <= width) {
  .top-about-box {
    border-style: solid;
    border-color: var(--color-cream);
    border-width: 16px;
    padding: 20px 30px;
  }
}

.top-news-list {
  border-style: solid;
  border-color: var(--color-cream);
  border-width: 1px 0;
}
.top-news-item {
  border-style: solid;
  border-color: var(--color-gray);
  border-width: 0 0 1px;
}
.top-news-item:last-child {
  border-width: 0;
}
.top-news-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2em 1.5em;
  line-height: 1.6;
  padding: 15px 0;
  list-style: none;
  cursor: pointer;
}
.top-news-head::-webkit-details-marker {
  display: none;
}
.top-news-date {
  flex-shrink: 0;
  font-size: 14px;
  color: var(--color-gray02);
  letter-spacing: 0.05em;
}
.top-news-ttl {
  flex: 1 1 15em;
  font-weight: 700;
  color: var(--color-charcoal);
}
.top-news-icon {
  flex-shrink: 0;
  width: 1.2em;
  height: 1.2em;
  background-color: var(--color-charcoal);
  mask: url(../img/icon/chevron-down.svg) no-repeat center/contain;
  transition: transform 0.2s;
}
.top-news-item[open] .top-news-icon {
  transform: rotate(180deg);
}
.top-news-desc {
  padding: 0 0 15px;
}