﻿@media screen and (min-width:641px){
.calendar_list {
    text-align: left;
    vertical-align: top;
    width: 100%;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 0px 0px;
    }
.calendar_list > div {
    position: relative;
    z-index: 98;
    text-align: left;
    vertical-align: top;
    width: calc(49% - 20px);
    display: inline-block;
    /display: inline;
    /zoom: 1;
    margin: 0px 10px 10px 10px;
    padding: 0px;
    }
.calendar_list > div > div > span {
    position: relative;
    padding: 0px 0px 0px 35px;
    font-size: 18px;
    }
.calendar_list > div > div > span::before {
    content: "";
    position: absolute;
    top: 5px;
    left: 15px;
    width: 8px;
    height: 8px;
    border: 2px solid rgb(151,151,172);
    border-radius: 3px;
    }
.calendar_list > div > div > .January::before {
    background-color: rgb(255,0,0);
    }
.calendar_list > div > div > .February::before {
    background-color: rgb(255,255,255);
    }
.calendar_list > div > div > .March::before {
    background-color: rgb(124,252,0);
    }
.calendar_list > div > div > .April::before {
    border: 2px solid rgb(151,151,172);
    background-color: rgb(255,100,193);
    }
.calendar_list > div > div > .May::before {
    border: 2px solid rgb(151,151,172);
    background-color: rgb(34,139,34);
    }
.calendar_list > div > div > .June::before {
    border: 2px solid rgb(151,151,172);
    background-color: rgb(128,0,128);
    }
.calendar_list > div > div > .July::before {
    border: 2px solid rgb(151,151,172);
    background-color: rgb(0,206,209);
    }
.calendar_list > div > div > .August::before {
    border: 2px solid rgb(151,151,172);
    background-color: rgb(255,255,0);
    }
.calendar_list > div > div > .September::before {
    border: 2px solid rgb(151,151,172);
    background-color: rgb(0,0,255);
    }
.calendar_list > div > div > .October::before {
    border: 2px solid rgb(151,151,172);
    background-color: rgb(255,160,0);
    }
.calendar_list > div > div > .November::before {
    border: 2px solid rgb(151,151,172);
    background-color: rgb(139,69,19);
    }
.calendar_list > div > div > .December::before {
    border: 2px solid rgb(151,151,172);
    background-color: rgb(0,0,70);
    }
.calendar_list > div > .calendar {
    padding: 0px 0px 0px 0px;
    text-align: left;
    border: 2px solid rgb(51,51,72);
    width: calc(100% - 14px);
    margin: 0px 5px 0px 5px;
    }
.calendar_list > div > .calendar > li {
    color: rgb(180,180,180);
    width: calc(100% / 7 - 4px);
    padding: 5px 0px 5px 0px;
    margin: 0px 2px 0px 2px;
    font-size: 16px;
    text-align: center;
    display: inline-block;
    /display: inline;
    /zoom: 1;
    }
.calendar_list > div > .calendar > li > span {
    color: rgb(12,12,12);
    font-size: 18px;
    }
.calendar_list > div > .calendar > .wd_t {
    color: rgb(102,102,102);
    border-bottom: 3px solid rgb(102,102,102);
    }
.calendar_list > div > .calendar > .st_t {
    color: rgb(51,51,153);
    border-bottom: 3px solid rgb(51,51,153);
    }
.calendar_list > div > .calendar > .sn_t {
    color: rgb(223,51,51);
    border-bottom: 3px solid rgb(223,51,51);
    }
.calendar_list > div > .calendar > .wd > a {
    color: rgb(51,51,51);
    font-weight: bold;
    }
.calendar_list > div > .calendar > .st > a {
    color: rgb(51,51,153);
    font-weight: bold;
    }
.calendar_list > div > .calendar > .sn > a {
    color: rgb(223,51,51);
    font-weight: bold;
    }
.calendar_list > div > .memo {
    position: absolute;
    text-align: left;
    vertical-align: top;
    width: 300px;
    z-index: 99;
    margin: 0px 0px 0px 0px;
    padding: 0px;
    top: 0px;
    left: 0px;
    }
.calendar_list > div > .memo > li {
    list-style: none;
    text-align: left;
    vertical-align: top;
    width: calc(300px - 4px);
    z-index: 99;
    border: 2px solid rgb(51,51,72);
    padding: 0px 0px 0px 0px;
    background-color: rgb(255,255,255);
    }
.calendar_list > div > .memo > li > .close {
    text-align: right;
    vertical-align: top;
    width: calc(100% - 6px);
    padding: 5px 3px 5px 3px;
    font-size: 12px;
    color: rgb(255,255,255);
    border-bottom: 2px solid rgb(51,51,72);
    }
.calendar_list > div > .memo > li > .close > span {
    padding: 0px 0px 0px 0px;
    }
.calendar_list > div > .memo > .sn > .close {
    background-color: rgb(255,51,4);
    }
.calendar_list > div > .memo > .st > .close {
    background-color: rgb(2,81,255);
    }
.calendar_list > div > .memo > .wd > .close {
    background-color: rgb(152,152,155);
    }
.calendar_list > div > .memo > li >  div > span {
    cursor: pointer;
    }
.calendar_list > div > .memo > li > .date {
    text-align: left;
    vertical-align: top;
    width: calc(100% - 6px);
    padding: 0px 0px 0px 0px;
    font-size: 15px;
    font-weight: bold;
    color: rgb(51,51,72);
    margin: 5px 0px 0px 5px;
    }
.calendar_list > div > .memo > li > .text {
    text-align: left;
    vertical-align: top;
    width: calc(100% - 6px);
    padding: 3px 3px 5px 3px;
    color: rgb(51,51,72);
    }
.calendar_list > div > .memo > li > .text > div {
    text-align: left;
    width: calc(100% - 0px);
    padding: 0px 0px 0px 0px;
    border-bottom: 1px dotted rgb(51,51,72);
    }
}
@media screen and (max-width:640px){
.calendar_list {
    text-align: left;
    vertical-align: top;
    width: 100%;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 0px 0px;
    }
.calendar_list > div {
    position: relative;
    width: calc(100% - 20px);
    margin: 0px 10px 10px 10px;
    padding: 0px;
    }
.calendar_list > div > div > span {
    position: relative;
    padding: 0px 0px 0px 35px;
    font-size: 18px;
    }
.calendar_list > div > div > span::before {
    border: 2px solid rgb(151,151,172);
    }
.calendar_list > div > .calendar {
    padding: 0px 0px 0px 0px;
    text-align: left;
    border: 2px solid rgb(51,51,72);
    width: calc(100% - 14px);
    margin: 0px 5px 0px 5px;
    }
.calendar_list > div > .calendar > li {
    color: rgb(152,152,152);
    width: calc(100% / 7 - 4px);
    padding: 5px 0px 5px 0px;
    margin: 0px 2px 0px 2px;
    font-size: 16px;
    text-align: center;
    display: inline-block;
    /display: inline;
    /zoom: 1;
    }
.calendar_list > div > .calendar > li > span {
    color: rgb(12,12,12);
    font-size: 18px;
    }
.calendar_list > div > .calendar > .wd_t {
    color: rgb(102,102,102);
    border-bottom: 3px solid rgb(102,102,102);
    }
.calendar_list > div > .calendar > .st_t {
    color: rgb(51,51,153);
    border-bottom: 3px solid rgb(51,51,153);
    }
.calendar_list > div > .calendar > .sn_t {
    color: rgb(223,51,51);
    border-bottom: 3px solid rgb(223,51,51);
    }
.calendar_list > div > .calendar > .wd > a {
    color: rgb(51,51,51);
    font-weight: bold;
    }
.calendar_list > div > .calendar > .st > a {
    color: rgb(51,51,153);
    font-weight: bold;
    }
.calendar_list > div > .calendar > .sn > a {
    color: rgb(223,51,51);
    font-weight: bold;
    }
.calendar_list > div > .memo {
    position: absolute;
    text-align: left;
    vertical-align: top;
    width: 100%;
    z-index: 99;
    margin: 0px 0px 0px 0px;
    padding: 0px;
    top: 0px;
    left: -5px;
    }
.calendar_list > div > .memo > li {
    list-style: none;
    text-align: left;
    vertical-align: top;
    width: calc(100% - 14px);
    z-index: 99;
    border: 2px solid rgb(51,51,72);
    padding: 0px 0px 0px 0px;
    background-color: rgb(255,255,255);
    }
.calendar_list > div > .memo > li > .close {
    text-align: right;
    vertical-align: top;
    width: calc(100% - 6px);
    padding: 5px 3px 5px 3px;
    font-size: 12px;
    color: rgb(255,255,255);
    border-bottom: 2px solid rgb(51,51,72);
    }
.calendar_list > div > .memo > .sn > .close {
    background-color: rgb(255,51,4);
    }
.calendar_list > div > .memo > .st > .close {
    background-color: rgb(2,81,255);
    }
.calendar_list > div > .memo > .wd > .close {
    background-color: rgb(152,152,155);
    }
.calendar_list > div > .memo > li >  div > span {
    cursor: pointer;
    }
.calendar_list > div > .memo > li > .date {
    text-align: left;
    vertical-align: top;
    width: calc(100% - 6px);
    padding: 0px 3px 0px 3px;
    font-size: 15px;
    font-weight: bold;
    color: rgb(51,51,72);
    margin: 5px 0px 0px 5px;
    }
.calendar_list > div > .memo > li > .text {
    text-align: left;
    vertical-align: top;
    width: calc(100% - 10px);
    padding: 5px 5px 5px 5px;
    color: rgb(51,51,72);
    }
.calendar_list > div > .memo > li > .text > div {
    text-align: left;
    width: calc(100% - 0px);
    padding: 0px 0px 0px 0px;
    border-bottom: 1px dotted rgb(51,51,72);
    }
.calendar_list > div > .memo > li > .text > div > .news {
    background: rgb(255,55,113);
    font-size: 10px;
    border: 2px solid rgb(51,51,72);
    color: rgb(255,255,255);
    margin-right: 8px;
    padding: 2px 2px 2px 2px;
    }
.calendar_list > div > .memo > li > .text > div > .event {
    background: rgb(255,105,213);
    font-size: 10px;
    border: 2px solid rgb(51,51,72);
    color: rgb(255,255,255);
    margin-right: 8px;
    padding: 2px 2px 2px 2px;
    }
.calendar_list > div > .memo > li > .text > div > .store {
    background: rgb(5,205,23);
    font-size: 10px;
    border: 2px solid rgb(51,51,72);
    color: rgb(255,255,255);
    margin-right: 8px;
    padding: 2px 5px 2px 5px;
    }
}
