.year-month { text-align: center; padding: 12px 0;}
.year-month p { display: inline-block; border-bottom: 1px solid #0200ff; padding: 0 8px; font-size: clamp(18px, calc(18px + 3 * ((100vw - 771px) / 253)), 21px);}

.calendar-wrap {
    display: flex;
    margin: 0 auto;
    max-width: 1110px;
    gap: 40px;
    margin-top: 32px;
    overflow: auto;
    margin-left: 40px;
}
.calendar-wrap > div { width: 100%;}

.calendar {
  width: 100%;
  border-collapse: collapse;
}
.calendar th,
.calendar td {
  border: 1px solid #000;
  text-align: center;
  padding: 10px;
  font-size: 14px;
  font-weight: bold;
}
.calendar th {
  padding: 6px 10px;
}
.calendar td {}

.calendar .sun {
  color: #e17f7e;
  background-color: #f8e4e2;
}
.calendar .sat {
  color: #7ab6f3;
  background-color: #e7f6fd;
}
.calendar .holi {
  color: #e17f7e;
  background-color: #f8e4e2;
}
.calendar .mute {
  color: #aaa;
}
.calendar .today {
  background-color: #7d7d7d;
}
.calendar .off {
  background-color: #fadcdb;
}

@media screen and (max-width:770px){
    /*.calendar-wrap{ flex-direction: column;}*/
}