@charset "UTF-8";


/*****************************************************
　劇場主催　過去のイベント一覧　
*****************************************************/
/* page-maincontent 
------------------------------------------------- */
.page-main-content{
	margin:35px 0 0;
}
/* 絞り込み 
------------------------------------------------- */
.select-filter{
	margin:0 0 35px;
	text-align:center;
}
.select-filter select{
	/*-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;*/
	background:#fff;
	border:1px solid #080808;
	border-radius:0;
	box-sizing:border-box;
	font-size:15px;
	font-size:1.5rem;
	line-height:1.4;
	padding:6px 53px 6px 10px;
	text-align:right;
}
/* 過去イベントアイテム 
------------------------------------------------- */
/* ----- 年タイトル ----- */
.m_date-ttl{
	border-bottom:2px solid #c5c5c5;
	color:#080808;
	font-size:46px;
	font-size:4.6rem;
	font-weight:bold;
	letter-spacing:0.025em;
	line-height:1.4;
	margin:0 0 35px;
	padding:26px 30px 46px;
	position:relative;
}
.m_date-ttl:before{
	border-left:10px solid #000;
	content:'';
	display:block;
	height:calc(100% - 20px);
	left:0;
	position:absolute;
	top:0;
	width:10px;
	z-index:0;
}
/* ----- 各月アイテム ----- */
.ae-item-listarea{
	margin:0 0 20px;
}
.ae_itemarea{
	display:flex;
	flex-wrap:wrap;
}
/* 1アイテムレイアウト */
.ae-item{
	margin:0 5.3% 85px 0;
	max-width:243px;
	width:21%;
}
.ae-item:nth-child(4n){
	margin:0 0 85px;
}
.ae-item .thumb{
	position:relative;
}
.ae-item .status{
	background:#fff;
	border:2px solid #e28484;
	box-sizing:border-box;
	color:#e28484;
	display:inline-block;
	font-weight:700;
	letter-spacing:0.075em;
	line-height:31px;
	margin:0 0 5px;
	text-align:center;
	width:109px;
}
.ae-item .status.cancel,
.ae-item .status.enki,
.ae-item .status.end{
	background:#e28484;
	color:#fff;
}
.ae-item .label{
	bottom:9px;
	left:-10px;
	position:absolute;
	width:100%;
	z-index:2;
}
.ae-item .series{
	background:#fff;
	border:1px solid #060001;
	box-sizing:border-box;
	color:#222;
	letter-spacing:0.025em;
	line-height:1.4;
	text-align:center;
	padding:8px 8px 9px;
	width:80%;
}
.ae-item .series:before{
	border-top:5px solid #222;
	border-right:5px solid #222;
	border-bottom:5px solid transparent;
	border-left:5px solid transparent;
	bottom:-10px;
	content:'';
	display:block;
	height:0;
	left:-1px;
	width:0;
	position:absolute;
	z-index:0;
}
.ae-item .series span{
	display:block;
	font-size:14px;
	font-size:1.4rem;
}
.ae-item .series span + span{
	margin:5px 0 0;
}
.ae-item .category{
	margin:20px 0 0;
}
.ae-item .category span{
	background:#f8f4e6;
	border:1px solid #060001;
	color:#222;
	display:inline-block;
	font-size:14px;
	font-size:1.4rem;
	letter-spacing:0.025em;
	margin:0 8px 8px 0;
	padding:5px 25px;
}
.ae-item .category span.independent,
.ae-item .category span.cosponsor{
	background:#222;
	color:#fff;
}
.ae-item .ttl,
.ae-item .date,
.ae-item .place,
.ae-item .cast{
	display:block;
	font-weight:400;
	letter-spacing:0.025em;
	line-height:1.4;
}
.ae-item .place,
.ae-item .cast,
.ae-item .more{
	font-size:14px;
	font-size:1.4rem;
}
.ae-item .ttl{
	margin:2px 0 0;
}
.ae-item .place{
	margin:5px 0 0;
}
.ae-item .cast{
	margin:10px 0 0;
}
.ae-item .more{
	color:#222;
	margin:22px 0 0 auto;
	text-align:center;
	width:150px;
}
.ae-item .more a{
	display:block;
	padding:8px 0 9px;
	position:relative;
	transition:all 0.4s ease-out;
}
.ae-item .more a:hover{
	background:#222;
	color:#fff;
	opacity:1;
}
.ae-item .more a:before,
.ae-item .more a:after{
	background:#bbb;
	content:'';
	height:2px;
	transition:all 0.4s ease-out;
	position:absolute;
	width:100%;
}
.ae-item .more a:before{
	top:0;
	right:0;
}
.ae-item .more a:after{
	bottom:0;
	left:0;
}
.ae-item .more a:hover:before,
.ae-item .more a:hover:after{
	transition:all 0.6s ease-out;
	width:0;
}
/* もっと見るボタン 
------------------------------------------------- */
.ae-morebtn{
	border:1px solid #ccc;
	border-bottom-width:3px;
	box-sizing:border-box;
	cursor:pointer;
	margin:0 auto;
	max-width:455px;
	text-align:center;
	width:100%;
}
.ae-morebtn .morebtn_inner{
	color:#222;
	display:block;
	font-size:20px;
	font-size:2.0rem;
	letter-spacing:0.05em;
	padding:25px 0;
	position:relative;
}
.ae-morebtn .morebtn_inner:hover{
	opacity:1;
}
/* ----- マウスオーバー時ボーダー ----- */
.ae-morebtn .morebtn_inner .hover-border-1,
.ae-morebtn .morebtn_inner .hover-border-2{
	display:block;
	position:absolute;
	top:-1px;
	width:100%;
}
/* hover-border-1 */
.ae-morebtn .morebtn_inner .hover-border-1{
	height:calc(100% + 3px);
}
.ae-morebtn .morebtn_inner .hover-border-1:before,
.ae-morebtn .morebtn_inner .hover-border-1:after{
	border-top:1px solid #272727;
	content:'';
	display:block;
	height:0;
	opacity:0;
	position:absolute;
	width:0;
}
.ae-morebtn .morebtn_inner .hover-border-1:before{
	border-left:1px solid #272727;
	right:50%;
}
.ae-morebtn .morebtn_inner .hover-border-1:after{
	border-right:1px solid #272727;
	left:50%;
}
.ae-morebtn .morebtn_inner:hover .hover-border-1:before,
.ae-morebtn .morebtn_inner:hover .hover-border-1:after{
	opacity:1;
	animation:hover_border 0.4s;
	animation-fill-mode:forwards;
	animation-direction:normal;
}
/* hover-border-2 */
.ae-morebtn .morebtn_inner .hover-border-2{
	height:calc(100% + 4px);
}
.ae-morebtn .morebtn_inner .hover-border-2:before,
.ae-morebtn .morebtn_inner .hover-border-2:after{
	bottom:0;
	content:"";
	display:block;
	height:calc(100% + 4px);
	opacity:0;
	position:absolute;
	width:0;
}
.ae-morebtn .morebtn_inner .hover-border-2:before{
	border-bottom:3px solid #272727;
	right:0;
}
.ae-morebtn .morebtn_inner .hover-border-2:after{
	border-bottom:3px solid #272727;
	left:0;
}
.ae-morebtn .morebtn_inner:hover .hover-border-2:before,
.ae-morebtn .morebtn_inner:hover .hover-border-2:after{
	opacity:1;
	animation:hover_border_bottom 0.4s;
	animation-delay:0.4s;
	animation-fill-mode:forwards;
	animation-direction:normal;
}
/* 準備中 
------------------------------------------------- */
.page-main-content .none{
	text-align:center;
}


@media screen and (max-width:1024px){
	/*****************************************************
	　劇場主催　過去のイベント一覧　
	*****************************************************/
	/* page-maincontent 
	------------------------------------------------- */
	.page-main-content{
		margin:4.37vw 0 0;
	}
	/* 絞り込み 
	------------------------------------------------- */
	.select-filter{
		margin:0 0 4.37vw;
		text-align:center;
	}
	.select-filter select{
		border-width:0.12vw;
		font-size:3vw;
		padding:6px 53px 6px 10px;
	}
	/* 過去イベントアイテム 
	------------------------------------------------- */
	/* ----- 年タイトル ----- */
	.m_date-ttl{
		border-width:0.25vw;
		font-size:5.75vw;
		margin:0 0 4.37vw;
		/*padding:26px 30px 46px;*/
		padding:3.25vw 3.75vw 5.75vw;
	}
	.m_date-ttl:before{
		border-width:1.25vw;
		height:calc(100% - 2.5vw);
		width:1.25vw;
	}
	/* ----- 各月アイテム ----- */
	.ae-item-listarea{
		margin:0 0 2.5vw;
	}
	/* 1アイテムレイアウト */
	.ae-item{
		margin:0 4vw 10.62vw;
		max-width:none;
		width:39.5vw;
	}
	.ae-item:nth-child(4n){
		margin:0 4vw 10.62vw;
	}
	.ae-item .thumb img{
		width:100%;
	}
	.ae-item .status{
		border-width:0.25vw;
		line-height:4.87vw;
		margin:0 0 0.62vw;
		width:15vw;
	}
	.ae-item .status.cancel,
	.ae-item .status.enki,
	.ae-item .status.end{
		background:#e28484;
		color:#fff;
	}
	.ae-item .label{
		bottom:1.87vw;
		left:-1.87vw;
	}
	.ae-item .series{
		border-width:0.12vw;
		padding:1.25vw;
		width:90%;
	}
	.ae-item .series span{
		font-size:3vw;
	}
	.ae-item .series:before{
		border-top:0.87vw solid #222;
		border-right:0.87vw solid #222;
		border-bottom:0.87vw solid transparent;
		border-left:0.87vw solid transparent;
		bottom:-1.87vw;
		left:0;
	}
	.ae-item .category{
		margin:3vw 0 0;
	}
	.ae-item .category span{
		border-width:0.12vw;
		font-size:2.8vw;
		margin:0 1.25vw 1.25vw 0;
		padding:5px 25px;
	}
	.ae-item .place,
	.ae-item .cast,
	.ae-item .more{
		font-size:2.8vw;
	}
	.ae-item .ttl{
		margin:0.62vw 0 0;
	}
	.ae-item .place{
		margin:0.62vw 0 0;
	}
	.ae-item .cast{
		margin:1.5vw 0 0;
	}
	.ae-item .more{
		font-size:2.75vw;
		margin:4.37vw auto 0;
		width:29.75vw;
	}
	.ae-item .more a{
		padding:1.62vw 0;
	}
	.ae-item .more a:before,
	.ae-item .more a:after{
		height:0.37vw;
	}
	/* もっと見るボタン 
	------------------------------------------------- */
	.ae-morebtn{
		border-width:0.12vw;
		border-bottom-width:0.37vw;
		max-width:none;
		width:56.87vw;
	}
	.ae-morebtn .morebtn_inner{
		font-size:3vw;
		padding:3.12vw 0;
	}
	/* ----- マウスオーバー時ボーダー ----- */
	.ae-morebtn .morebtn_inner .hover-border-1,
	.ae-morebtn .morebtn_inner .hover-border-2{
		top:-0.12vw;
	}
	/* hover-border-1 */
	.ae-morebtn .morebtn_inner .hover-border-1{
		height:calc(100% + 0.37vw);
	}
	.ae-morebtn .morebtn_inner .hover-border-1:before,
	.ae-morebtn .morebtn_inner .hover-border-1:after{
		border-width:0.12vw;
	}
	/* hover-border-2 */
	.ae-morebtn .morebtn_inner .hover-border-2{
		height:calc(100% + 0.5vw);
	}
	.ae-morebtn .morebtn_inner .hover-border-2:before,
	.ae-morebtn .morebtn_inner .hover-border-2:after{
		height:calc(100% + 0.5vw);
	}
	.ae-morebtn .morebtn_inner .hover-border-2:before,
	.ae-morebtn .morebtn_inner .hover-border-2:after{
		border-width:0.37vw;
	}
}