@charset "utf-8";

/* --------------------------------------------------
-------------------------------------------------- ページ全体 */
html {
	width: 100%;
	min-height: 100%;
	-webkit-text-size-adjust: 100%;
}
body {
	width: 100%;
	min-height: 100%;
	background: #000 url(/themes/kadokawa/lodoss30th/images/bg01.jpg) center top no-repeat fixed;
	background-size: cover;
	color: #000;
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "游ゴシック", YuGothic, sans-serif;
	font-size: 16px;
	line-height: 1.5;
	overflow: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-smoothing: antialiased;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
	-webkit-text-size-adjust: 100%;
}

a:link {
	color: #ff3399;
	text-decoration: underline;
}
a:visited {
	color: #ff3399;
	text-decoration: underline;
}
a:hover {
	color: #ff3399;
	text-decoration: none;
}
a:active {
	color: #ff3399;
	text-decoration: none;
}

a img {
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}
a img:hover {
	opacity: 0.6;
	-webkit-transition: 0.1s ease-in-out;
	transition: 0.1s ease-in-out;
}


/* --------------------------------------------------
-------------------------------------------------- Clearfix */
.cf:before, .cf:after {
	content: "";
	display: table;
}
.cf:after {
	clear: both;
}
.cf {
	*zoom: 1;
}


/* --------------------------------------------------
-------------------------------------------------- ページ全体 */
.inner {
	position: relative;
	margin: 0 auto;
	width: 840px;
}



/* --------------------------------------------------
-------------------------------------------------- SNS */
.sns ul {
	font-size: 0;
}
.sns ul li {
	display: inline-block;
}
.sns ul li:not(:last-of-type) {
	margin-right: 10px;
}

/* --------------------------------------------------
-------------------------------------------------- ヘッダー */
header .sns {
	position: absolute;
	top: 10px;
	right: -40px;
}


/* -------------------------------------------------- ページ全体 */
#wrapper {

}
#contents {
	position: relative;
	margin: 0 auto;
}


/* --------------------------------------------------
-------------------------------------------------- フッター */
footer {
	padding: 38px 0 20px 0;
	background: #0066cc;
	color: #fff;
	text-align: center;
}
footer .pagetop {
	display: block;
	margin-bottom: 30px;
}
footer .mf-logo {
	display: block;
	margin-bottom: 20px;
}
footer .sns {
	margin-bottom: 24px;
}
footer .sns ul {
	font-size: 0;
}
footer .sns ul li {
	display: inline-block;
}
footer .sns ul li:not(:last-of-type) {
	margin-right: 10px;
}
footer .banner ul {
	margin-bottom: 20px;
}
footer .banner ul li {
	display: inline-block;
}
footer small {
	font-size: 12px;
}

@media only screen and (max-width: 768px) {
/* --------------------------------------------------
-------------------------------------------------- ページ全体 */
.inner {
	width: auto;
}

img {
	width: 100%;
}

/* --------------------------------------------------
-------------------------------------------------- フッター */
footer {
	padding: 4% 0 4% 0;
	background: #0066cc;
	color: #fff;
	text-align: center;
}
footer .pagetop {
	margin-bottom: 6%;
}
footer .pagetop a {
	display: inline-block;
	width: 8%;
}
footer .sns {
	margin-bottom: 4%;
}
footer .sns ul li {
	margin-left: 0.5em;
}
footer .banner ul {
	margin-bottom: 4%;
}
footer .banner ul:first-of-type li {
	width: 14%;
}

footer .banner ul:last-of-type li {
	width: 80%;
}

}