﻿@charset "UTF-8";

/*
 * ================================================
 *
 * [event]
 *
 * ================================================
 */

/**
 * eventList
 */
.eventList {
	margin: 30px 0;
}
	.eventList li {
		overflow: hidden;
		border-bottom: 1px solid #000;
		padding: 0 0 20px 0;
		margin-bottom: 20px;
	}
		.eventList li h3 {
		    font-size: 17px;
			background: none;
			color: #000;
			margin: 0 0 15px 0;
			padding: 0 0 15px 10px;
			border-bottom: 1px dashed #000;
			text-align: left;
			font-weight: bold;
		}
		.eventList li .eventInfo ul {
			padding: 0 10px;
		}
			.eventList li .eventInfo ul li {
				border-bottom: none;
				padding: 0;
				margin-bottom: 0;
			}
		.eventList li .eventInfo p.notes {
			font-size: 14px;
			margin-top: 1em;
			padding: 0 10px;
		}
	/**
	 * big
	 */
	.eventList li.big .eventInfo {
		width: 360px;
		float: left;
	}
	.eventList li.big .eventImage {
		width: 320px;
		height: 280px;
		overflow: hidden;
		position: relative;
		float: right;
		background: #E9EBEE;
	}
		.eventList li.big .eventImage figure {
			position: relative;
			top: 50%;
			-webkit-transform: translateY(-50%);
			-ms-transform: translateY(-50%);
			transform: translateY(-50%);
			text-align: center;
		}
		.eventList li.big .eventImage figure img {
			max-width: 320px;
			max-height: 280px;
			height: auto;
		}


/*---------------------------
*	larger 1000
*----------------------------*/
@media screen and (min-width: 1000px) {
	
	.eventList{}
		.eventList li.big .eventInfo:last-child {
			width: 100%;
		}
}

/*---------------------------
*	タブレット
*----------------------------*/
@media screen and (min-width: 641px) and (max-width: 999px) {
	.eventList{}
		.eventList li.big .eventInfo {
			width: 50%;
		}
		.eventList li.big .eventImage {
			width: 45%;
		}
}

/*---------------------------
*	スマートフォン
*----------------------------*/
@media screen and (max-width: 640px) {
	.eventList{}
		.eventList li.big .eventInfo {
			width: 100%;
			float: none;
			margin-bottom: 15px;
		}
		.eventList li.big .eventImage {
			width: 96.53%;
			margin: 0 auto;
			float: none;
		}
}