@charset "utf-8";

.month-wrap
{font-size:1.2rem;}
.month-wrap p.month
{font-size:3rem;font-weight:bold;}
.month-wrap .paging
{width:calc(100%/2);float:left;}
.month-wrap .paging:first-of-type
{text-align:left;}
.month-wrap .paging:last-of-type
{text-align:right;}
.month-wrap table
{width:100%;border-right:1px solid #ccc;border-bottom:1px solid #ccc;margin:10px auto 20px;clear:both;}
.month-wrap table th, .month-wrap table td
{border-top:1px solid #ccc;border-left:1px solid #ccc;width:calc(100%/7);}
.month-wrap table td div
{width:98%;min-height:80px;padding:3% 1% 1%;}
.month-wrap table td a
{display:block;width:100%;height:100%;}
.month-wrap table td > div
{background:#ddd;}
.month-wrap table th, .month-wrap table td span, .month-wrap table td a span
{font-weight:bold;}
.month-wrap table th.sunday, .month-wrap table .sunday span, .month-wrap table .sunday a span
{color:#dc3545;}
.month-wrap table th.satday, .month-wrap table .satday span, .month-wrap table .satday a span
{color:#007bff;}
.month-wrap table span, .month-wrap table a span
{background:#272727;color:white;display:block;width:100%;padding:1% 0;}
.month-wrap table .sunday span, .month-wrap table .sunday a span
{background:#dc3545;color:white;}
.month-wrap table .satday span, .month-wrap table .satday a span
{background:#007bff;color:white;}
#calendar-msg
{font-size:2rem;margin-bottom:20px;padding:0 1%;}
#calendar-msg p
{font-size:2.2rem;font-weight:bold;color:red;}
@media screen and (max-width: 480px) {
	.month-wrap table td div
	{min-height:50px;font-size:8px;}
	#calendar-msg
	{font-size:1.4rem;}
	#calendar-msg p
	{font-size:1.6rem;}
}