
.dates {
  padding: 80px 32px;
}

.dates .container {
  gap: 80px !important;
}

.dates .content {
  width: 62.05% !important;
  gap: 32px !important;
}

.dates .content > * {
  max-width: 600px;
}
.dates .content > p {
  font-size: 16px;
  line-height: 24px;
}
.dates .title {
  gap: 8px !important;
}
.dates .content a {
  color: #2501c3;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.dates .content .list {
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.dates .list .date {
  display: flex;
}
.dates .list .date > span {
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 16px;
  width: 35%;
  border-radius: 4px 0 0 4px;
  background-color: #010741;
}
.dates .list .date > span p {
  font-weight: 600;
}
.dates .list .date > span > img {
  width: 32px;
  height: 32px;
}
.dates .list .date > span > * {
  color: #fff;
}
.dates .list .date > div {
  padding: 16px;
  display: flex;
  align-items: center;
  background-color: #fff;
  flex: 1 1 0%;
  border: 1px solid #c1c6d6;
  border-style: solid solid solid none;
  border-radius: 0 4px 4px 0;
}
.dates .list .date > div > p {
  font-size: 16px;
  line-height: 24px;
}

.dates .shadow {
  aspect-ratio: 421/432 !important;
}
.dates .image > img {
  aspect-ratio: 421/432 !important;
}

@media (max-width: 1399px) {
  .dates .container {
    gap: 63px !important;
  }
}
@media (max-width: 1149px) {
  .dates .list .date > span {
    width: 40%;
  }
  .dates .container {
    gap: 32px !important;
  }
}

@media (max-width: 1149px) {
  .dates .shadow {
    aspect-ratio: 343/224 !important;
  }
  .dates .image > img {
    aspect-ratio: 343/224 !important;
  }
}

@media (max-width: 767px) {
  .dates .container {
    flex-direction: column !important;
  }
  .dates .content {
    gap: 24px !important;
  }
  .dates .list .date {
    flex-direction: column;
  }
  .dates .list .date > span {
    width: 100%;
    border-radius: 4px 4px 0 0;
  }
  .dates .list .date > div {
    padding: 16px 16px 15px;
    width: 100%;
    border-style: none solid solid solid;
    border-radius: 0 0 4px 4px;
  }
}
