/*---------------------------------------------
page_stop
---------------------------------------------*/
.stop-note__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 20px;
  grid-row-gap: 0;
  margin-top: var(--gap-m);
  padding: 30px 0;
  border-top: 1px solid var(--color-gray);
  border-bottom: 1px solid var(--color-gray);
}
@media (max-width: 768px) {
  .stop-note__list {
    grid-template-columns: 1fr;
    grid-column-gap: 0;
    grid-row-gap: 20px;
  }
}
.stop-note__item {
  display: grid;
  grid-template-columns: 45px 1fr;
  grid-template-rows: auto 1fr;
  grid-column-gap: 22px;
  grid-row-gap: 10px;
}
.stop-note__item-color {
  grid-area: 1 / 1 / 3 / 2;
  display: block;
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
}
.stop-note__item-color[data-color="red"] {
  background-color: #e04444;
}
.stop-note__item-color[data-color="blue"] {
  background-color: #005bab;
}
.stop-note__item-title {
  grid-area: 1 / 2 / 2 / 3;
  font-size: 16px;
  letter-spacing: 0.1em;
}
.stop-note__item-text {
  grid-area: 2 / 2 / 3 / 3;
  font-size: 13px;
  letter-spacing: 0.03em;
  line-height: calc(20 / 13);
}
.stop__text {
  margin-top: 15px;
}

.stop__calendarwrap {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto;
  grid-column-gap: 35px;
  grid-row-gap: 53px;
  align-items: start;
  margin-top: var(--gap-l);
}
@media (max-width: 768px) {
  .stop__calendarwrap {
    grid-template-columns: 1fr;
    grid-column-gap: 0;
    grid-row-gap: 53px;
  }
}

.stop__calendar {
  width: 100%;
  border-right: 1px solid var(--color-gray);
}
.stop__calendar caption {
  margin-bottom: 16px;
  font-size: 16px;
  text-align: center;
}
.stop__calendar th {
  padding: 13px 0;
  background-color: #e3f1ff;
  border-left: 1px solid var(--color-gray);
  font-weight: 700;
  text-align: center;
}
.stop__calendar td {
  padding: 13px 0;
  border-left: 1px solid var(--color-gray);
  text-align: center;
}
.stop__calendar .sunday {
  color: #e04444;
}
.stop__calendar .saturday {
  color: #005bab;
}
.stop__calendar .pause {
  background: radial-gradient(circle 14px at 50% 50%, #e04444 95%, transparent 100%);

  border-radius: 50%;
  color: #fff;
}
.stop__calendar .mainte {
  background: radial-gradient(circle 14px at 50% 50%, #005bab 95%, transparent 100%);
  border-radius: 50%;
  color: #fff;
}