@charset "utf-8";
/* CSS Document */
/****************************************************************************/
/**							イベントページ用CSS								*/
/****************************************************************************/
#event_wrap {
	padding: 7% 0 7%;
}

#event_link {
	text-align: center;
	margin: 7% 0 5%;
}

#event_link li {
	width: 300px;
	height: 50px;
	line-height: 50px;
	background-color: #ffffff;
	border: 1px solid #d3c38f;
	border-radius: 5px;
	text-align: center;
	font-size: 2.0rem;
	display: inline-block;
	margin-left: 40px;
}

#event_link li.active {
	background-color: #d3c38f;
}

#event_link li a {
	display: block;
}

#event_link li i {
	margin-right: 15px;
}

#event_link li:first-child {
	margin-left: 0;
}


/* ----------------------------------------------------
		イベント一覧
---------------------------------------------------- */
#event_list {
	margin-top: -2%;
}

#event_list li {
	display: inline-block;
	vertical-align: top;
	width: 320px;
	background-color: #f3f5f8;
	margin: 5% 12px 0 0;
}

#event_list li:nth-child(3n) {
	margin-right: 0;
}

#event_list li div {
	padding: 10px;
}

#event_list li .event_period {
	font-size: 1.3rem;
	line-height: 1.2;
}

#event_list li h2 {
	font-size: 1.8rem;
	line-height: 1.2;
	margin: 10px 0 5px;
}

#event_list li p {
	line-height: 1.6;
}

.end_event_title {
    background-color: #d3c38f;
    color: #404040;
    min-height: 50px;
    border-radius: 5px;
    font-size: 20px;
    font-weight: 500;
    position: relative;
    padding: 15px 55px 15px 45px;
    box-sizing: border-box;
    line-height: 1.2;
    text-align: center;
}


/* ----------------------------------------------------
		イベントカレンダー
---------------------------------------------------- */
#event_calendar_head {
	display: table;
	width: 100%;
}

#event_calendar_head p {
	display: table-cell;
	width: 160px;
	vertical-align: middle;
}

#event_calendar_head h1 {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

.event_year {
	font-size: 2.2rem;
}

.event_month {
	font-size: 4.0rem;
	margin-left: 15px;
	display: inline-block;
}

.calendar_table {
	width: 100%;
	margin-top: 3px;
	border-collapse: collapse;
}

.calendar_table thead th {
	background-color: #d3c38f;
	color: #404040;
	border-bottom: 3px solid #ffffff;
	border-right: 3px solid #ffffff;
	padding: 12px 0;
	white-space: nowrap;
	box-sizing: border-box;
}
.calendar_table thead th:nth-child(3n) {
    min-width: 80px;
}

.calendar_table thead th:nth-of-type(1),
.calendar_table thead th:nth-of-type(2) {
	width: 70px;
}

.calendar_table thead th:nth-of-type(4) {
	width: 200px;
}

.calendar_table tbody th {
	vertical-align: middle;
	font-weight: normal;
	padding: 15px 0;
	border-bottom: 3px solid #ffffff;
	border-right: 3px solid #ffffff;
	box-sizing: border-box;
	background-color: #000000;
	color: #ffffff;
	font-size: 2.2rem;
}

.calendar_table th span {
	font-size: 1.6rem;
	display: block;
	margin-top: 3px;
}

.calendar_table td {
	background-color: #f3f5f8;
	padding: 10px;
	border-bottom: 3px solid #ffffff;
	border-right: 3px solid #ffffff;
	vertical-align: middle;
	font-size: 1.4rem;
	line-height: 1.5;
}

.calendar_table .sat th {
	color: #7eebf9;
}
.calendar_table .sun th {
	color: #ff9fa3;
}

.calendar_table td p {
	margin-top: 5px;
}

.calendar_table td p:first-child {
	margin-top: 0;
}

.calendar_table.monthly thead th:nth-child(2n) {
    min-width: 80px;
}

.calendar_table.monthly thead th:nth-of-type(1) {
    width: 70%;
}

.calendar_table.monthly thead th:nth-of-type(2){
	width: 30%;
}

.calendar_table.monthly .event_box h2 {
    font-size: 1.4rem;
    font-weight: normal;
}

.calendar_table.monthly .event_box h2 a {
    font-size: 1.6rem;
    font-weight: bold;
}

.event_spot_terms {
    font-weight: bold;
    line-height: 1;
}

.event_box {
	display: table;
	width: 100%;
	margin-top: 10px;
}

.calendar_table td .event_box:first-child {
	margin-top: 0;
}

.event_box p, .event_box h2 {
	display: table-cell;
	vertical-align: middle;
}

.event_box h2 a {
	text-decoration: underline;
	font-size: 1.4rem;
	font-weight: normal;
}

.event_box .event_img {
	width: 80px;
}

.event_box .event_area {
	width: 70px;
	white-space: nowrap;
	padding: 0 10px;
}
.toggle_box {
    margin: 4% 0 0 0;
}
.toggle_box .calendar_table {
    display: none;
}
.toggle_box h3 {
    text-align: center;
    margin-right: 3px;
}
.toggle_box.spring h3 {
    border-radius: 0;
    background: #EAB4AE;
}
.toggle_box.spring .calendar_table th {
    background: #F5DDDD;
    color: #333;
    font-weight: normal;
}
.toggle_box.summer h3 {
    border-radius: 0;
    background: #a9d9d4;
}
.toggle_box.summer .calendar_table th {
    background: #DDF5E8;
    color: #333;
    font-weight: normal;
}
.toggle_box.autumn h3 {
    border-radius: 0;
    background: #F5DA7E;
}
.toggle_box.autumn .calendar_table th {
    background: #F5F0DD;
    color: #333;
    font-weight: normal;
}
.toggle_box.winter h3 {
    border-radius: 0;
    background: #BED1E2;
}
.toggle_box.winter .calendar_table th {
    background: #DDECF5;
    color: #333;
    font-weight: normal;
}

.sat span {
	color: #96deff;
}

.sun span {
	color: #ffaba9;
}

#month_list li {
    display: inline-block;
}
#month_list li.active,
#month_list li a {
    display: inline-block;
    background-color: #d3c38f;
    color: #404040;
    padding: 12px 24px;
    white-space: nowrap;
    box-sizing: border-box;
    border-radius: 5px;
    margin: 0 2px 30px 0;
    width: 76px;
}
#month_list li.active {
    background-color: #FFF;
    padding: 11px 23px;
    border: 1px solid #d3c38f;
}
#month_list li:last-child.active,
#month_list li:last-child a {
    margin-right: 0;
}

#month_select {
	margin-bottom: 30px;
	float: right;
	display: none;
}

#guidance {
    margin-top: 15px;
    padding: 30px 20px;
    background-color: #ffbabd;
    text-align: center;
}

#guidance p {
    line-height: 1.7;
}

#guidance p span {
    font-weight: bold;
}


/* ----------------------------------------------------
        四季
---------------------------------------------------- */
.ico_spring,
.ico_summer,
.ico_autumn,
.ico_winter {
    background: url(/img/ja/event/ico_spring.png) no-repeat;
    display: inline-block;
    width: 26px;
    height: 24px;
    vertical-align: middle;
    margin-right: 10px;
}
.ico_summer {
    height: 14px;
    background: url(/img/ja/event/ico_summer.png) no-repeat;
}
.ico_autumn {
    height: 26px;
    background: url(/img/ja/event/ico_autumn.png) no-repeat;
}
.ico_winter {
    width: 18px
    height: 30px;
    background: url(/img/ja/event/ico_winter.png) no-repeat;
}
#season_comment,
.season_contents p {
    color: #4b2a2a;
    line-height: 1.6;
    margin-top: 60px;
}
.season_contents h3,
.season_contents h4 {
    font-size: 2.4rem;
    font-weight: bold;
    display: block;
    text-align: center;
    letter-spacing: .5rem;
    margin: 15% 0 20px;
}
.season_contents h4 {
    font-size: 2.2rem;
    font-weight: bold;
    letter-spacing: .3rem;
    text-align: left;
    margin: 60px 0 10px;
}
.season_contents ul {
    clear: both;
    overflow: hidden;
}
.season_contents li {
    float: left;
    display: inline-block;
    width: 320px;
    margin-right: 20px;
}
.season_contents li:nth-child(3n) {
    margin-right: 0;
}
.season_contents li h4 {
    font-size: 1.4rem;
    font-weight: normal;
    letter-spacing: 0;
    margin: 5px 0;
}
.season_contents li p {
    margin: 0;
}
.season_contents li .area,
.season_contents li .date {
    margin-top: 10px;
}

.season_contents li .date {
    font-size: 1.3rem;
    margin-left: 5px;
}
.season_contents li h5 {
    font-size: 1.8rem;
    margin: 10px 0 5px;
}
.season_contents img {
    width: 100%;
}
.season_contents .others {
    clear: both;
    overflow: hidden;
}
.season_contents .others li {
    margin-top: 10px;
}
.season_contents .others img {
    float: left;
    width: 100px;
}
.season_contents .others h5 {
    margin: 30px 0 20px 110px;
    font-size: 1.5rem;
    font-weight: normal;
}

@media screen and (max-width: 750px){
.season_contents li {
    display: inline-block;
    width: 100%;
}
}