.theater .c-inner {
  opacity: 0;
}
.theater .c-inner.-reveal {
  opacity: 1;
}

.theater__list {
  border-top: 0.125rem solid rgba(153, 153, 153, 0.5);
  margin-top: 5rem;
}

.theater__item {
  border-bottom: 0.125rem solid rgba(153, 153, 153, 0.5);
}
.theater__item a {
  transition: all 0.3s ease;
  position: relative;
  display: block;
  font-weight: 500;
  line-height: 1;
  padding-block: 2.25rem;
}
.theater__item a::after {
  position: absolute;
  inset: 0 0.625rem 0 auto;
  aspect-ratio: 1;
  border-right: 0.25rem solid #b4b4b4;
  border-top: 0.25rem solid #b4b4b4;
  content: "";
  height: 1.25rem;
  margin-block: auto;
  rotate: 45deg;
  transition: right 0.2s;
}
@media (min-width: 960px) {
  .theater__item a:hover {
    background: rgba(153, 153, 153, 0.2);
  }
}
@media (min-width: 960px) {
  .theater__item a:hover::after {
    right: 5px;
  }
}

.theater__item__place {
  color: #cccccc;
  font-size: 1.875rem;
  letter-spacing: -0.02em;
}
.theater__item__place strong {
  font-weight: 900;
}

.theater__item__state {
  color: #b4b4b4;
  font-size: 1.625rem;
  margin-top: 1rem;
}

.theater__btn {
  margin-top: 5rem;
}
.theater__btn a {
  align-items: center;
  border: 0.125rem solid rgba(153, 153, 153, 0.5);
  border-radius: 100vmax;
  color: #cccccc;
  display: flex;
  font-size: 1.875rem;
  font-weight: bold;
  height: 7.5rem;
  justify-content: center;
  padding-bottom: 0.1em;
  position: relative;
}
.theater__btn a:after {
  position: absolute;
  top: 50%;
  right: 3.125rem;
  aspect-ratio: 1;
  border-right: 0.125rem solid #b3b3b3;
  border-top: 0.125rem solid #b3b3b3;
  content: "";
  rotate: 45deg;
  translate: 0 -50%;
  width: 1.75rem;
}