﻿@charset "utf-8";
/* -----------------------------------------------------------------------------
CSS Information

 File name :  event-calendar.css
----------------------------------------------------------------------------- */
a {
	/* color: #990066; */
	color: #000;
}
a:link, a:visited {
	text-decoration: none;
}
a:hover, a:active {
	text-decoration: none;
}
#contentsArea img {
    width: 100%;
}
#contentsArea {
	float: none;
	max-width: 960px;
	margin: 0 0 0 20px;
}
#contentsArea * {
  box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}
#container {
	max-width: 960px;
	width: 100%;
	margin: 0 auto;
	padding-bottom: 26px;
	/* background: #ecebf4; */
}
#container_inner {
	/* background: url(../img/bg-calendar.jpg) top no-repeat; */
	background-size: contain;
	width: 100%;
	margin: 0 auto;
	padding:15px 0;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

.pc_message {
  background-color:#01003c;
  color:#ffffff;
  text-align:center;
  font-size:150%;
  line-height:1.8em;
  font-weight:bold;
}

.schedule {
	width: 96.8%;
	margin:0 auto;
	background: #fff;
	padding-bottom: 15px;
}
.calender_month{
	display: block;
	width: 50%;
	font-size: 1.4rem;
	font-weight: bold;
	color: #553c11;
	padding: 4% 0 0% 2%;
}

.schedule ul {
	display: flex;
	background: #fff;
	width: 98%;
	margin: 0 auto;
	padding-top: 15px;
	margin-bottom: 14px;

}
.schedule ul:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}
.schedule ul li {
	/* float: left; */
	height: 85px;
	width: 4%;
	/* margin-right: 0.58%; */
	margin-bottom: 6px;
	border: solid 1px #828181;
	border-right:none;
	border-left:none;
	background: #fff;
	color: #000;
	/* border-radius: 5px; */
}
.schedule ul li:nth-child(-n + 16) {
	border-left: solid 1px #828181;
}
.schedule ul li:nth-child( n + 16) {
	border-right: solid 1px #828181;
}
.schedule ul li:nth-child(12n) {
	margin-right: 0;
}
.schedule ul li{
  /* display:block; */
	padding: 30px 0;
  text-decoration: none;
  text-align: center;
  font-weight: bold;
	position: relative;
}
.schedule ul li a{
	display: block;
  position: absolute;
  top: 0;
  left: 0;
  padding: 26px 0;
  height: 100%;
  width: 100%;
}

.schedule ul li.active{
  background: #99ce82;
}
.schedule ul li a:hover,
.schedule ul li.holiday a:hover,
.schedule ul li.sat a:hover{
	background: #99ce82;
  transition: .3s;
}
.schedule ul li:hover,
.schedule ul li a:hover{
	color: #fff;
  transition: .3s;
}
.schedule ul li span{
  font-size:72%;
}
.schedule ul li .month_nav{
  display: none;
	font-size:100%;
}
.schedule ul li.sat {
  background: #7DCCF3;
}
.schedule ul li.sat,
.schedule ul li.holiday{
  color: #fff;
}
.schedule ul li.active a,
.schedule ul li.sat a,
.schedule ul li.holiday a{
  color: #fff;
}
.schedule ul li.sun,
.schedule ul li.holiday {
	background: #EB6D7B;
}

.schedule table {
	width: 98%;
	margin: 0 auto;
	border-top: 1px solid #D7C7A1;
	border-right: 1px solid #D7C7A1;
}
.schedule table th, .schedule table td {
	background-color: #ffffff;
	border-left: 1px solid #D7C7A1;
	border-bottom: 1px solid #D7C7A1;
}
.schedule table #date {
	width: 20%;
	font-weight: bold;
	background-color: #ffef5f;
	color: #553c11;
	text-align: center;
	border-right: 1px solid #f2eaed;
	font-size:120%;
}
.schedule table #event {
	background-color: #ffef5f;
  color: #553c11;
	font-weight: bold;
	padding-left: 25px;
	font-size: 120%;
	text-align: center;
}
.schedule table th {
	padding: 15px 5px;
}
/* 日付 */
.schedule table th.calendar {
	padding: 2.8%;
}
.schedule table .holiday th, .schedule table .holiday td {
	background-color: #FFFDE4;
}
.schedule table .holiday th span {
	color: #dd0009 !important;
}
.schedule table th.calendar span {
	display: block;
	margin: 0;
	padding: 0;
	line-height: 1;
}
.schedule table th {
	color: #553c11;
}
.schedule table th.blue {
	color: #09a1d9;
}
.schedule table th.red {
	color: #e93f3f;
}
.schedule table th.calendar .month {
	font-weight: bold;
}
.schedule table th.calendar .day {
	font-size: 192%;
	font-weight: bold;
	display: inline-block;
	padding-left: 43%;
}
.schedule table th.calendar .youbi {
	font-size: 100%;
	display: block;
	text-align:center;
	margin-top: 5px;
}
/* イベント */
.schedule table td {
	padding: 15px;
}
.schedule table td dl {
	margin: 0;
  padding: 3% 0;
	zoom: 1;
}
.schedule table td dl:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}
.schedule table td dl dt {
	float: left;
	width: 25%;
	max-width: 115px;
	margin-right: 2%;
}
.schedule table td dl dd {
	float: left;
	width: 73%;
}
.schedule table td dl dd .categories {
	padding-bottom: 5px;
}
.schedule table td dl dd .category {
	padding: 3px;
	background: #000;
	color: #fff;
	border-radius: 2px;
	font-size: 0.75em;
	display: inline-block;
	margin-left: 3px;
	margin-bottom: 3px;
}
.schedule table td dl dd .title {
	padding-bottom: 8px;
}
.schedule table td dl dd .ev_cont {
	padding-bottom: 0.7em;
	padding-left: 3em;
	text-indent: -2.9em;
}
.schedule table td dl dd .ev_cont .ev_hl {
	color: #000;
	border: 1px solid #c5c5c5;
	padding: 2px;
	margin-right: 10px;
}
.schedule table td dl dd .title a {
	color: #df6f6c;
	font-size: 105%;
	font-weight:bold;
	text-decoration: underline;
}
.schedule table td dl dd .title a:hover {
	text-decoration: none;
}
.schedule table td dl dd p {
	color: #010101;
	font-size: 117%;
	line-height: 1.3;
}
#contentsArea_inner .recommend h3 {
	position: relative;
}
#contentsArea_inner .recommend h3 a {
	position: absolute;
	top: 13%;
	right: 5px;
	width: 24%;
}
#contentsArea_inner .recommend ul {
	margin-top: 20px;
}
#contentsArea_inner .recommend ul:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}
#contentsArea_inner .recommend ul li {
	float: left;
	width: 49%;
	margin: 0 2% 37px 0;
}
#contentsArea_inner .recommend ul li:nth-child(2n) {
	margin-right: 0;
}
#contentsArea_inner .recommend ul li img {
	padding-bottom: 10px;
}
#contentsArea_inner .recommend ul li .title {
	padding-bottom: 5px;
}
#contentsArea_inner .recommend ul li .title a {
	color: #0094d6;
	font-size: 150%;
	text-decoration: underline;
}
#contentsArea_inner .recommend ul li .title a:hover {
	text-decoration: none;
}
#contentsArea_inner .recommend ul li p {
	color: #010101;
	font-size: 109%;
	line-height: 1.3;
}
.next_month_btn a{
	width: 40%;
	min-width: 285px;
	margin: 5% auto;
	display: block;
	text-align: center;
	text-decoration: none;
	font-size: 1em;
	font-weight: bold;
	color: #ffffff;
	background: #50a564;
	border-radius: 10px;
	padding: 18px 0;
	position: relative;
}@media screen and (max-width: 767px) {
.next_month_btn a{
 font-size: 0.8em;
}
}
.next_month_btn a:after{
	position: absolute;
  content: '';
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 10px solid #fff;
  border-left: solid 10px #000 transparent;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  top: 50%;
  right: 5%;
  margin-top: -5px;
}
.next_month_btn a:hover{
	transition: .5s;
  color: #99ce82;
  background: #fff;
}
.next_month_btn a:hover:after {
	transition: .5s;
  border-bottom: 10px solid #99ce82;
}
.this_month_btn a{
	width: 40%;
	min-width: 285px;
	margin: 5% auto;
	display: block;
	text-align: center;
	text-decoration: none;
	font-size: 1em;
	font-weight: bold;
	color: #ffffff;
	background: #50a564;
	border-radius: 10px;
	padding: 18px 0;
	position: relative;
}@media screen and (max-width: 767px) {
.this_month_btn a{
 font-size: 0.8em;
}
}
.this_month_btn a:after{
	position: absolute;
  content: '';
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 10px solid #fff;
  border-left: solid 10px #000 transparent;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  top: 50%;
  right: 5%;
  margin-top: -5px;
}
.this_month_btn a:hover{
	transition: .5s;
  color: #99ce82;
  background: #fff;
}
.this_month_btn a:hover:after {
	transition: .5s;
  border-bottom: 10px solid #99ce82;
}
 @media screen and (max-width: 1036px) and (min-width: 767px) {
.schedule ul li{
	/* width: 13.5%;
	margin-right: 0.8%; */
}
.schedule ul li:nth-child(12n) {
	/* margin-right: 0.8%; */
}
.schedule ul li:nth-child(7n) {
	/* margin-right: 0; */
}
	 
}
@media screen and (max-width: 985px) {
	.schedule table th.calendar {
	padding: 2%;
}
.schedule table th.calendar .month {
	font-size: 12px;
}
.schedule table th.calendar .day {
	font-size: 16px;
	display: block;
	padding-left: 0;
	text-align: center;
}
.schedule table th.calendar .youbi {
	font-size: 12px;
	display: block;
	text-align: center;
}
.schedule ul {
	display: block;
	margin-bottom: 10px;
	background: none;
}
.schedule ul li {
	height: 55px;
  text-align:center;
  font-weight:bold;
  font-size:100%;
	display: block;
  float: left;
  width: 13.5%;
	border-right: solid 1px #828181;
	border-left: solid 1px #828181;
	margin-right: 0.8%;
	margin-bottom: 6px;
  /* padding: 22px 0;
  background: #fe5eaa;
	border-radius: 5px; */
}
.schedule ul li:nth-child(7n) {
	margin-right: 0;
}
.schedule ul li:nth-child(12n) {
  margin-right: 0.8%;
}
.schedule ul li a{
	padding: 15px 0;
  /* display:block;
  width:100%;
  background-size:100% 25px;
  line-height:16px;
  text-decoration:none; */
}
.schedule ul li a:hover{
}
.schedule ul li span{
  font-size:72%;
}
.schedule ul li .month_nav{
  display: none;
	font-size:100%;
}
.schedule ul li.sat a{
  /* color:#fff; */
}
.schedule ul li.sun a,
.schedule ul li.holiday a{
  /* color:#fff; */
}

.schedule table #date {
	width: 20%;
}
.schedule table td {
	padding: 2%;
}
.schedule table td dl dt {
	width: 25%;
	margin-right: 2%;
	max-width: inherit;
}
.schedule table td dl dd {
	float: left;
	width: 73%;
}
.schedule table td dl dd .title a {
	font-size: 13px;
}
.schedule table td dl dd p {
	font-size: 12px;
}
.schedule table td dl dd .ev_cont{
	text-indent: -3.2em;
}
}
@media screen and (max-width: 767px) {
   
h3.sp_message#schedule02{
  background-color:#01003c;
  color:#ffffff;
  padding:10px 0 5px;
  text-align:center;
  font-weight:bold;
}
h3.sp_message#schedule02 .caution{
  display:block;
  font-size:84%;
  padding-top:5px;
}

#contentsArea {
	float: none;
	width: 100%;
	margin: 0 auto;
}
#container {
	width: 100%;
	/* background-color: #f3e9ed; */
	background-size: contain;
}
#container_inner {
	/* background: url(../img/sp/bg-calendar.jpg) top no-repeat;
	    background-size: contain; */
	width: 100%;
	padding: 3%;
}
.calender_month{
	width: 50%;
	font-size: 1.4rem;
	padding: 4% 0 0% 2%;
}

#contentsArea_inner .recommend h3 a {
	top: 11%;
	width: 38%;
}
#contentsArea_inner .recommend ul li {
	float: none;
	width: 100%;
	margin: 0 auto 20px;
}
#contentsArea_inner .recommend ul li:nth-child(2n) {
	margin-right: auto;
}
#contentsArea_inner .recommend ul li img {
	padding-bottom: 10px;
}
#contentsArea_inner .recommend ul li .title a {
	font-size: 14px;
}
#contentsArea_inner .recommend ul li p {
	font-size: 12px;
}
#contentsArea img {
	width: 100%;
}
.schedule {
	width: 100%;
	margin:0 auto;
	background: none;
}
.schedule table {
	width:100%;
}
.schedule ul {
	width: 100%;
}
}
 @media screen and (max-width: 440px) {
/* .schedule ul li{
	width: 18%;
	margin-right: 2.4%;
	padding: 6px 0;
}
.schedule ul li:nth-child(7n) {
	margin-right: 2.4%;
}
.schedule ul li:nth-child(12n) {
	margin-right: 2.4%;
}
.schedule ul li:nth-child(5n) {
	margin-right: 0;
} */
}