@charset "UTF-8";
/*------------------------------------
  event
------------------------------------*/
.block{
	padding: 6% 0 0;
}
h2 {
	font-size: 20px;
	font-weight: bold;
}
h3 {
	margin: 0 auto 0.8em;
	padding: 0 0 0 0.6em;
	font-size: 16px;
	font-weight: bold;
	line-height: 1;
	border-left: solid 1em #1d1d1d;
}
h3 a {
	font-size: 16px;
	font-weight: bold;
}

.eventlist {
	margin: 0 auto 5%;
	width: 97%;
}
.eventlist li {
	margin: 0 auto 2%;
	padding: 0 0 2%;
	border-bottom: dotted 1px #d2d2d2;
}

table {
	width: 100%;
}
tr {
	width: 50%;
	display: inline-table;
}
tr.wide {
	width: 100%;
}
th {
	padding: 1% 2%;
	width: 40%;
	text-align: center;
	background: #d2d2d2;
	vertical-align: middle;
}
tr.wide th {
	width: 19.8%;
}
td {
	padding: 1% 2%;
	width: auto;
	vertical-align: middle;
}
.caption {
	margin: 0 auto;
	font-size: 0.8em;
	font-weight: bold;
}
.eventlist .attention {
	margin: 0 auto 1em;
}
.eventlist .attention li {
	margin: 0 auto 0 1em;
	padding: 0;
	font-size: 0.8em;
	text-indent: -1em;
	border-bottom: none;
}
.btn {
	text-align: right;
}
.btn li {
	margin: 0 1%;
	width: 20%;
	display: inline-block;
	position: relative;
}
.btn li a {
	padding: 3%;
	text-align: center;
	border: solid 1px #1d1d1d;
	display: block;
	position: relative;
	cursor: pointer;
	z-index: 2;
}
.pc .btn li a:hover {
	color: #fff;
}
.btn li a .arrow {
	width: 3%;
	position: absolute;
	top: 36%;
	right: 2%;
}


@media only screen and (max-width:768px){
}
@media only screen and (max-width:414px){
.block{
	padding: 10% 0 0;
}
h2 {
	font-size: 16px;
}

.eventlist li {
	margin: 0 auto 5%;
	padding: 0 0 5%;
}

tr {
	width: 100%;
	display: table-row;
}

.btn {
	text-align: center;
}
.btn li {
	margin: 1%;
	width: 45%;
	position: relative;
}
}