#calendar th {
  border: 1px solid #CCC;
  border-top: 1px solid #CCC;
  border-right: 1px solid #CCC;
  border-left: 1px solid #CCC;
  text-align: center;
}

#calendar td {
  width: 80px;
  height: 80px;
  border: 1px solid #CCC;
  border-top: 1px solid #CCC;
  border-right: 1px solid #CCC;
  border-left: 1px solid #CCC;
  text-align: center;
  font-size: 24px;
  position: relative;
}

#calendar .application {
  position: absolute;
  border: 2px solid #70B059;
  width: 36px;
  height: 36px;
  left: 22px;
  top: 20px;
  border-radius: 34px;
  margin: auto;
  z-index: 1;
}

#calendar .application::before {
  content: '申込受付日';
  font-size: 12px;
  width: 100px;
  margin-left: -34px;
  margin-top: -21px;
  color: #70B059;
  display: block;
  z-index: 1;
}

#calendar .purchase {
  position: absolute;
  border: 2px solid #6E34C6;
  width: 44px;
  height: 44px;
  left: 18px;
  top: 16px;
  border-radius: 34px;
  margin: auto;
  z-index: 1;
}

#calendar .purchase::after {
  content: '買付・約定日';
  font-size: 12px;
  width: 100px;
  margin-top: 44px;
  margin-left: -30px;
  color: #6E34C6;
  display: block;
  z-index: 1;
}

#calendar .settlement {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 24px;
  height: 24px;
}

#calendar .saturday {
  background-color: #D1EDF9;
  color: #1B8DC9;
  border: 1px solid #CCC;
}

#calendar .holiday {
  background-color: #FADDD9;
  color: #D43A30;
  border: 1px solid #CCC;
}

#calendar .not-applicable {
  background-color: #FEEDA5;
  color: #353229;
  border: 1px solid #CCC;
}


/**
 解約カレンダー
 ※大元でidが振られている為、解約カレンダー用に一部再定義
**/
#calendar2 th {
  border: 1px solid #CCC;
  border-top: 1px solid #CCC;
  border-right: 1px solid #CCC;
  border-left: 1px solid #CCC;
  text-align: center;
}

#calendar2 td {
  width: 80px;
  height: 80px;
  border: 1px solid #CCC;
  border-top: 1px solid #CCC;
  border-right: 1px solid #CCC;
  border-left: 1px solid #CCC;
  text-align: center;
  font-size: 24px;
  position: relative;
}

#calendar2 .application {
  position: absolute;
  border: 2px solid #70B059;
  width: 36px;
  height: 36px;
  left: 22px;
  top: 20px;
  border-radius: 34px;
  margin: auto;
  z-index: 1;
}

#calendar2 .application::before {
  content: '申込受付日';
  font-size: 12px;
  width: 100px;
  margin-left: -34px;
  margin-top: -21px;
  color: #70B059;
  display: block;
  z-index: 1;
}

#calendar2 .exchange {
  position: absolute;
  border: 2px solid #6E34C6;
  width: 44px;
  height: 44px;
  left: 18px;
  top: 16px;
  border-radius: 34px;
  margin: auto;
  z-index: 1;
}

#calendar2 .exchange::after {
  content: '換金日';
  font-size: 12px;
  width: 100px;
  margin-top: 44px;
  margin-left: -30px;
  color: #6E34C6;
  display: block;
  z-index: 1;
}

#calendar2 .settlement {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 24px;
  height: 24px;
}

#calendar2 .saturday {
  background-color: #D1EDF9;
  color: #1B8DC9;
  border: 1px solid #CCC;
}

#calendar2 .holiday {
  background-color: #FADDD9;
  color: #D43A30;
  border: 1px solid #CCC;
}

#calendar2 .not-applicable {
  background-color: #FEEDA5;
  color: #353229;
  border: 1px solid #CCC;
}