@charset "utf-8";

/* メンテナンスページ */

*,
*::before,
*::after {
	box-sizing :border-box;
}

html {
	font-size :16px;
}

body {
	margin                 :0;
	min-height             :100vh;
	display                :flex;
	flex-direction         :column;
	font-family            :"Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
	font-size              :1rem;
	line-height            :1.5;
	letter-spacing         :0.07em;
	color                  :#cccccc;
	background-color       :#131419;
	background-image       :url("../img/bg.jpg");
	background-repeat      :repeat;
	background-attachment  :fixed;
}

a {
	color           :#2faafb;
	text-decoration :underline;
}

a:visited {
	color :#8590ff;
}

a:hover,
a:active {
	color :#ff4080;
}

/* ---------- main ---------- */

main.mente-main {
	flex           :1 1 auto;
	display        :flex;
	align-items    :center;
	justify-content:center;
	width          :100%;
	padding        :2.5rem 1.25rem 3rem;
}

.mente-content {
	width  :min(100%, 720px);
	margin :0 auto;
}

.mente-logo {
	margin      :0 0 1.5rem;
	font-size   :0;
	line-height :0;
	text-align  :center;
}

.mente-logo img {
	display    :block;
	width      :240px;
	height     :auto;
	margin     :0 auto;
}

.mente-panel {
	width         :100%;
	margin        :0;
	padding       :2.5rem 2rem;
	border        :1px solid #888069;
	border-radius :4px;
	background    :rgba(0, 0, 0, 0.45);
	box-shadow    :
		0 8px 32px rgba(0, 0, 0, 0.45),
		inset 0 1px 0 rgba(255, 255, 255, 0.06);
	text-align    :left;
}

.mente-panel__date {
	margin      :0 0 0.75rem;
	font-size   :0.875rem;
	line-height :1.5;
	color       :#aaaaaa;
}

.mente-panel__title {
	margin         :0 0 1.5rem;
	padding-bottom :1rem;
	border-bottom  :1px solid rgba(136, 128, 105, 0.5);
	font-family    :"Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-size      :1.375rem;
	font-weight    :700;
	line-height    :1.5;
	color          :#ff5555;
	text-shadow    :
		0 0 3px rgba(220, 45, 50, 0.35),
		0 0 8px rgba(175, 30, 38, 0.2);
}

.mente-panel__period {
	display    :inline-block;
	font-size  :1.125rem;
	color      :#ff8888;
	white-space:nowrap;
}

.mente-panel__body p {
	margin      :0 0 1.125rem;
	font-size   :1rem;
	line-height :1.85;
}

.mente-panel__body p:last-child {
	margin-bottom :0;
}

/* ---------- footer (PC) ---------- */

footer.site-footer {
	flex-shrink :0;
	width       :100%;
	margin-top  :0;
	border-top  :0;
	background  :#131419;
	color       :#cccccc;
	text-align  :left;
}

.site-footer__line {
	height             :8px;
	background-image   :url("../img/ui_frm.png");
	background-repeat  :repeat-x;
	background-position:0 -120px;
}

.site-footer__bottom {
	display          :flex;
	align-items      :center;
	justify-content  :center;
	width            :100%;
	height           :100px;
	padding          :0 1rem;
	border-top       :1px solid #333333;
	background-color :#000000;
	box-sizing       :border-box;
}

.site-footer__copyright {
	margin         :0;
	color          :#ffffff;
	font-size      :0.9375rem;
	line-height    :1.5;
	letter-spacing :0.04em;
	text-align     :center;
}

/* ---------- responsive ---------- */

@media (max-width: 767px) {
	.mente-logo img {
		width :min(240px, 80vw);
	}

	.mente-panel {
		padding :2rem 1.25rem;
	}

	.mente-panel__title {
		font-size :1.125rem;
	}

	.mente-panel__period {
		display    :block;
		margin-top :0.35rem;
		font-size  :1rem;
		white-space:normal;
	}

	.site-footer__bottom {
		height     :auto;
		min-height :100px;
		padding    :1rem;
	}
}