@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=RocknRoll+One&family=Zen+Kurenaido&display=swap');

body {
	font-size: 2vw;
	font-family: "Noto Sans JP", sans-serif;
}

#logo {
	display: grid;
	align-items: center;
	justify-items: center;
	height: 80vh;
	text-align: center;

}

#logo svg {
	width: 50vw;
}

#logo h1 {
	font-size: 5vw;
	color: #f5989d;
	font-weight: bold;
	font-family: "Zen Kurenaido", sans-serif;
	margin-top: 2em;
}

#mes {
	text-align: center;
	margin: 10vw;
	border-radius: 3vw;
	padding-top: 1vw;
	padding-bottom: 2vw;
	background-color: #ffe484;
}

#mes h2 {
	margin: 1vw;
}


article {
	width: 90vw;
	display: grid;
	grid-template-columns: 40vw 1fr;
	margin: 10vw auto;
	gap: 2vw;
	border-top: solid 1px #f5989d;
	padding: 1em 0px;
	border-bottom: solid 1px #f5989d;

}

article .img img {
	width: 100%;
}

article .info h2 {
	font-family: "RocknRoll One", sans-serif;
	font-size: 2.5vw;
	background-color: #f5989d;
	color: #ffffff;
	padding: 0.5vw 2vw;
	border-radius: 5vw;
	margin: 0px;
	margin-bottom: 2vw;

}

article .info .catch {
	margin: 0px 1em;
}

article .info .dl {
	margin: 5vw;
	display: flex;
	gap: 3vw;
	justify-content: center;
	flex-wrap: wrap;

}

article .info .dl a {
	min-width: 5em;
	padding: 0.5em;
	border-radius: 3em;
	text-align: center;
	text-decoration: none;
	color: #ffffff;
	background-color: #f5989d;
	box-shadow: 0 4px 6px #f5989d4d;
}


article .info .shop {
	text-align: center;
	margin: 5vw;
}

article .info .shop a {
	display: inline-block;
	margin-top: 2vw;
	padding: 0px;
}

footer {
	background-color: #f5989d;
	color: #ffffff;
	text-align: center;
	font-size: 1vw;
	display: flex;
	gap: 1vw;
	justify-content: center;
}