:root {
	--color-text: black;
}

html, body {
	margin: 0;
	padding: 0;
}

body {
	font-family: /* HuiFont29 */ "メイリオ", "Meiryo", verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
	font-weight: normal;
	font-style: normal;
	color: var(--color-text);
	font-size: 16px;
	text-align: center;
}

ul, li {
	margin: 0;
	padding: 0;
	list-style: none;
}

img {
	max-width: 100%;
	height: auto;
}

body.page-winter {
	background: #ffffff url(../../2030_winter/shared/images/back.jpg) top left repeat;
	background-size: cover;
	background-attachment: fixed;
	--color-text: #000080;
}
body.page-sport {
	background: #ffffff url(../../2030_sport/shared/images/back.jpg) top left repeat;
	background-size: cover;
	background-attachment: fixed;
	--color-text: #ff0000;
}
body.page-science {
	background: #ffffff url(../../2030_science/shared/images/back.jpg) top left repeat;
	background-size: cover;
	background-attachment: fixed;
	--color-text: #003300;
}
body.page-japan {
	background: #ffffff url(../../2030_japan_class/shared/images/back.jpg) top left repeat;
	background-size: cover;
	background-attachment: fixed;
	--color-text: #800000;
}
body.page-theater {
	background: #ffffff url(../../2030_theatre/shared/images/back.jpg) top left repeat;
	background-size: cover;
	background-attachment: fixed;
	--color-text: white;
}

/* general */

body::selection {
	color: white;
	background-color: var(--color-text);
}

header nav {
	padding: 15px 0;
}

footer {
	margin-top: 30px;
}

footer nav,
header nav {
	display: flex;
	justify-content: center;
}

footer ul,
header ul {
	display: flex;
	gap: 15px;
	flex-wrap: wrap;
	justify-content: center;
}

footer a,
header a {
	color: var(--color-text);
	font-weight: bold;
	font-size: 14px;
}

header h2 {
	display: none;
}

.container {
	padding: 0 15px;
}

article p {
	margin: 0;
	font-weight: bold;
}

article {
	display: flex;
	justify-content: center;
}

article ul {
	display: flex;
	flex-direction: column;
	gap: 1em;
	align-items: center;
}

.gotop a,
article li {
	background: #ffffff44;
	backdrop-filter: blur(10px);
	border-radius: 10px;
	padding: 20px;
	box-shadow: 0 2px 5px rgba(100, 100, 100, 0.5);
}

article li {
	max-width: 755px;
}

article img {
	border-radius: 10px;
}

.gotop a {
	position: fixed;
	bottom: 30px;
	right: 30px;
	color: white;
	text-decoration: none;
	font-weight: bold;
	transition: 0.4s all ease;
}

.gotop a:hover {
	background: #00000044;
	color: black;
}