@charset "UTF-8";
/* CSS Document */

.schedule{
	background-image: url("../img/schedule.webp?25");
	background-size:  cover;
	background-attachment: fixed;
	background-position: 20% 0%;
}

.notice_box{
	width:56%;
	margin: auto 0 auto auto;
	padding: 40px 0 20px;
}

.notice_box .match{
	margin: auto;
	max-width: 400px;
	margin-bottom: 30px;
}

.notice_box .kontama{
	margin: auto;
	max-width: 600px;
	margin-bottom: 20px;
}
.notice_box .lenormand{
	margin: auto;
	max-width: 600px;
}

.schedule_box{
	padding: 20px 0 50px;
}

.schedule_line{
	width:56%;
	margin: auto 0 auto auto;
}

.inner_wrap{
	display: block;
	position: relative;
	color:#111;
	padding:30px 0 10px;
	transition: .3s;
}

.inner_wrap::after {
	position: absolute;
	left: 0;
	content: '';
	width: 100%;
	height: 2px;
	background: #111;
	bottom: -2px;
	transform: scale(1, 1);
	transform-origin: right top;
	transition: transform 0.3s;
}

a.inner_wrap::before {
	position: absolute;
	content: "";
	width: 10px;
	height: 10px;
	border-bottom: #333 2px solid;
	border-right: #333 2px solid;
	bottom: 25px;
	right: 15px;
	transform: rotate(-45deg);
	transition: 0.3s;
}

.inner_wrap span{
	margin: 0 5px 0 0;
	padding:2px 5px;
	font-size:14px;
	letter-spacing: 0.02em;
	border-radius: 3px;
	border:1px #222 solid;
	color:#222;
}
.inner_wrap span.note{
	background-color:#edba25;
	color:#333;
	font-weight:600;
	border:none;
}
.inner_wrap span.rakugo{
	color:#fff;
	background-color:#333;
	border:none;
}
.inner_wrap span.before{
	background-color:rgba(0,0,0,.4);
}

.inner_wrap h2{
	padding:0 20px;
}

.inner_wrap p img{
	width:21px;
	margin:0 4px -3px 2px;
}

@media only screen and (min-width: 767px){
	a.inner_wrap:hover{
		opacity: .6 !important;
	}
	
	a.inner_wrap:hover::after {
		transform: scale(0, 1);
	}
	a.inner_wrap:hover::before {
		border-bottom: rgba(255,255,255,0) 2px solid;
		border-right: rgba(255,255,255,0) 2px solid;
	}
}

@media only screen and (max-width: 767px) {
	.schedule{
		background-image:none;
		background-color:rgba(242,242,242,1);
	}
	.notice_box,
	.schedule_line{
		width:94%;
		margin: auto;
	}
	.notice_box img{
		padding: 0 20px;
	}
}

@media only screen and (max-width: 520px) {
	.schedule_box {
		padding-top: 0;
	}
	.inner_wrap::before {
		right: 10px;
	}
	.inner_wrap h2{
		font-size: 1.3em;
	}
	.inner_wrap span{
		font-size:90%;
	}
}

@media only screen and (max-width: 374px) {
	.inner_wrap h2{
		font-size: 1.2em;
	}
	.inner_wrap p{
		font-size: 80%;
	}
}