@charset "utf-8";
/*------------------------------------------------------------
	index
------------------------------------------------------------*/
.pagePath {
	margin-bottom: 45px;
}
#main {
	margin-bottom: 80px;
}
#main .topBox {
	margin-bottom: 70px;
}
#main .topBox h3 {
	margin-bottom: 25px;
	font-size: 3rem;
	line-height: 1.64;
	letter-spacing: 0.05em;
}
#main .topBox h3 sup {
	font-size: 1.8rem;
}
#main .topBox h3  span {
	color: #dc9643;
	display: inline-block;
}
#main .topBox .note {
	margin-bottom: 45px;
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1.71;
	letter-spacing: 0.05em;
	text-align: center;
}
#main .topBox .note a {
	text-decoration: underline;
}
#main .topBox .note a:hover {
	text-decoration: none;
}
#main .topBox .text {
	margin-bottom: 72px;
	font-weight: 500;
	text-align: center;
}
#main .topBox .textList {
	margin: -20px 0 30px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#main .topBox .textList::after {
	width: 288px;
	content: '';
}
#main .topBox .textList li {
	margin-top: 20px;
	padding-bottom: 225px;
	width: 288px;
	position: relative;
}
#main .topBox .textList li .ttl {
	margin-bottom: 25px;
	padding: 8px 10px 9px;
	position: relative;
	color: #fff;
	font-size: 1.8rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-align: center;
	background-color: #174E9E;
}
#main .topBox .textList li .ttl::before,
#main .topBox .textList li .ttl::after {
	width: 1px;
	height: calc(100% - 50px);
	position: absolute;
	left: 10px;
	top: 25px;
	background-color: #fff;
	content: '';
}
#main .topBox .textList li .ttl::after {
	left: auto;
	right: 10px;
}
#main .topBox .textList li p {
	font-size: 1.3rem;
	font-weight: 500;
	line-height: 2.46;
}
#main .topBox .textList li .pho {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
}
#main .topBox .option {
	margin-bottom: 50px;
}
#main .topBox .option .textList {
	margin-bottom: 17px;
}
#main .topBox .option .textList li {
	padding-bottom: 0;
}
#main .topBox .option .text {
	margin-bottom: 0;
	font-size: 1.8rem;
	text-align: center;
}
#main .topBox .movieBox {
	margin-bottom: 79px;
}
#main .topBox .movieBox h3 {
	margin-bottom: 35px;
	font-size: 1.5rem;
	letter-spacing: 0.1em;
}
#main .topBox .movieBox h3 span {
	margin-bottom: 8px;
}
#main .topBox .movieBox .movie {
	margin-bottom: 20px;
}
#main .topBox .movieBox .text {
	margin-bottom: 0;
	font-size: 1.8rem;
}
@media all and (min-width: 897px) {
	#main .banner a:hover {
		opacity: 0.7;
	}
}
@media all and (max-width: 896px) {
	.pagePath {
		margin-bottom: 20px;
	}
	#main {
		margin-bottom: 50px;
	}
	#main .topBox {
		margin-bottom: 40px;
	}
	#main .topBox h3 {
		margin-bottom: 28px;
		font-size: 1.6rem;
	}
	#main .topBox h3 sup {
		font-size: 1.1rem;
	}
	#main .topBox .text {
		margin-bottom: 50px;
		font-size: 1.4rem;
	}
	#main .topBox .note {
		margin-bottom: 30px;
		font-size: 1.1rem;
	}
	#main .topBox .note a:hover {
		text-decoration: underline;
	}
	#main .topBox .textList {
		margin-bottom: 20px;
		display: block;
	}
	#main .topBox .textList::after {
		display: none;
	}
	#main .topBox .textList li {
		margin-top: 20px;
		padding-bottom: 15px;
		width: auto;
	}
	#main .topBox .textList li .ttl {
		margin-bottom: 15px;
		padding: 5px 10px;
		font-size: 1.4rem;
	}
	#main .topBox .textList li .ttl::before,
	#main .topBox .textList li .ttl::after {
		height: calc(100% - 30px);
		top: 15px;
	}
	#main .topBox .textList li p {
		margin-bottom: 15px;
	}
	#main .topBox .textList li .pho {
		width: 100%;
		position: relative;
	}
	#main .topBox .textList li .pho img {
		width: 100%;
	}
	#main .topBox .option {
		margin-bottom: 50px;
	}
	#main .topBox .option .text {
		font-size: 1.4rem;
		line-height: 1.5;
	}
	#main .topBox .movieBox .text {
		font-size: 1.4rem;
		line-height: 1.5;
	}
}
@media all and (max-width: 374px) {
	#main .topBox .note {
		margin: 0 -5px 30px;
		font-size: 1rem;
	}
}
@media all and (-ms-high-contrast:none) {
	#main .topBox .textList li:not(:nth-of-type(3n)) .ttl {
		padding: 18px 10px;
	}
}