@charset "utf-8";

:root {
	--white: #fff;
	--black: #000;
	--bg: #d6daf5;
	--accent: #1ea479;
	--accent2: #5b1580;
	--txt-p: #f55b8f;
	--key: #15206f;
	--key2: #060e33;
	--fontFamily-M: "MFW-PAotoGothicStdN-Medium", "ヒラギノ角ゴ Pro W3";
	--fontFamily-DB: "MFW-PAotoGothicStdN-DeBold", "ヒラギノ角ゴ Pro W3";
	--fontFamily-B: "MFW-PAotoGothicStdN-Bold", "ヒラギノ角ゴ Pro W3";
	--fontFamily-EB: "MFW-PAotoGothicStdN-ExBold", "ヒラギノ角ゴ Pro W3";
	--fontFamily-po: "Passion One", sans-serif;
	--transition: all .5s cubic-bezier(0.33, 1, 0.68, 1);
}

/*上書き・打消し
---------------------------------------------------------- */
a {
	color: inherit;
	text-decoration: none;
}
img {
	height: auto;
}
#container {
	min-width: inherit;
	min-height: calc(100vh - 200px);
	font-size: 1.8rem;
	font-family: var(--fontFamily-M);
	font-weight: 500;
	font-style: normal;
	background-color: transparent;
}
.footer_simple {
	background-color: transparent;
}
.footer_simple .copyright {
	color: var(--key2);
}

@media screen and (min-width: 751px) {
	body {
		width: 100%;
		min-width: 1080px;
	}
}

@media screen and (max-width: 750px) {
	#container {
		min-height: calc(100dvh - 150px);
		padding-bottom: 30px;
		font-size: 1.4rem;
	}
	img {
		width: 100%;
	}
}

/*アウトライン
---------------------------------------------------------- */
.o-wrapper {
	width: 100%;
	max-width: 1080px;
	margin-inline: auto;
	padding-inline: 30px;
}

@media screen and (max-width: 750px) {
	.o-wrapper {
		padding-inline: 3%;
	}
}
/*共通
---------------------------------------------------------- */
.txt-s {
	font-size: 0.8em !important;
}
.txt-l {
	font-size: 1.2em !important;
}
.txt-b {
	font-family: var(--fontFamily-B);
	font-weight: 800;
}
.txt-p {
	color: var(--txt-p);
	font-family: var(--fontFamily-B);
	font-weight: 800;
}
.indent01 {
	padding-left: 1em;
	text-indent: -1em;
}
/*メインビジュアル／リード文
---------------------------------------------------------- */
.hero-block {
	width: 100%;
	background-color: var(--key2);
}
.hero-title {
	width: min(1280px, 100%);
	margin-inline: auto;
}
.txt-lead p {
	line-height: 1.8;
	color: var(--key2);
}
@media screen and (min-width: 751px) {
	.txt-lead p {
		text-align: center;
	}
}

/*申し込み要項
---------------------------------------------------------- */
.o-wrapper h2 {
	position: relative;
	bottom: -20px;
	width: min(339px, 70%);
	margin-inline: auto;
}
.dataList-wrap {
	width: min(720px, 100%);
	margin-inline: auto;
	padding: 50px 40px 180px;
	background: var(--bg) url('../img/overview-deco.png') no-repeat center bottom;
	background-size: contain;
	border-radius: 30px;
	color: var(--key);
}
.dataList {
	font-family: var(--fontFamily-B);
	font-weight: 800;
	font-size: 2rem;
}
.dataList-title {
	padding: 0 0.5em;
	background-color: var(--key);
	color: var(--white);
}
.dataList-note li {
	padding: 0.3em 0 0.3em 1em;
	text-indent: -1em;
}
.dataList-note li::before {
	content: "★";
	color: var(--accent);
}
.button {
	display: grid;
	place-items: center;
	width: min(340px, 80%);
	margin: 0 auto;
	padding: 25px 60px;
	background-color: var(--accent);
	border-radius: 34px;
	color: var(--white);
	text-align: center;
	font-size: 2.4rem;
	font-family: var(--fontFamily-B);
	transition: all 0.4s cubic-bezier(0.19, 0.64, 0.4, 0.89);
}
span.button {
	background-color: #75778b;
}
.family-ticket {
	padding: 0.5em 0.6em;
	background-color: rgba(255, 255, 255, 0.8);
	& .ticket-ttl {
		text-align: center;
	}
	& p,
	& dl {
		font-size: 1.5rem;
		font-family: var(--fontFamily-M);
		font-weight: 500;
		letter-spacing: -0.02em;
	}
	& p {
		padding: 0.5em 0;
	}
}
.dot-list {
	padding: 0.5em 0;
	border-top: 2px solid var(--bg);
	border-bottom: 2px solid var(--bg);
	& dt {
		font-family: var(--fontFamily-B);
		font-weight: 800;
		&::before {
			content: '◆';
		}
	}
	& dd {
		padding-left: 1em;
		text-indent: -1em;
		line-height: 1.3;
		&::before {
			content: '・';
		}
	}
}
@media screen and (min-width: 751px) {
	.dataList {
		display: flex;
		flex-wrap: wrap;
		gap: 1em;
		align-items: flex-start;
	}
	.dataList-title {
		width: 6em;
		border-radius: 1.5em;
		text-align: center;
	}
	.dataList-data {
		width: calc(100% - 7em);
	}
	a.button:hover {
		background-color: var(--accent2);
	}
}
@media screen and (max-width: 750px) {
	.dataList-wrap {
		border-radius: 20px;
		padding: 25px 5% 100px;
	}
	.dataList {
		font-size: 1.6rem;
	}
	.dataList-title {
		width: 5em;
		margin-top: 1em;
		border-radius: 0 1.5em 1.5em 0;
	}
	.button {
		border-radius: 15px;
		font-size: 1.8rem;
		padding: 15px 20px;
	}
	.family-ticket {
		& p,
		& dl {
			font-size: 1.4rem;
		}
	}
}
.end {
	padding: 2em 1em;
	background-color: #e6c7d1;
	color: #b10a41;
	font-size: 1.6em;
	text-align: center;
}