@charset "UTF-8";

/* 全体 */
* {
	font-family: "Sawarabi Gothic", Trebuchet, Century Gothic, Arial,"ヒラギノ角ゴシック", "Hiragino Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
body {
	background-color: #F1E0E0;
	font-family: "Kiwi Maru", serif;
}

a {
	color: #8F2F5B;
}

a:hover {
	color: #C1D2D2;
}

.wrapper {
	margin: 0 auto 0 auto;
}

/* ヘッダー */
.header {
	position: fixed;
	opacity: 0.40;
	top:170px;
	width: 100%;
	height: 100px;
	background-color: #FFFFFF;
}

#title {
	font-family: "New Tegomin", serif;
	font-size: 66px;
	opacity: 0.49;
	color: #D98BA9;
	text-align: center;
	margin: 0px auto auto auto;
	z-index : 30;
}
	
/* メイン */
.main {
	overflow: hidden;
	width: 94%;
	margin: 200px auto 200px auto;
	text-align: center;
}

#pagetitle {
	font-family: "Hina Mincho", serif;
	font-size: 18px;
	text-align: center;
	color: #8F2F5B;
}

#yomigana {
	font-family: "Hina Mincho", serif;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-align: center;
	color:#8F2F5B;
}

#subtitle {
	font-family: 'stylish', serif;
	font-size: 18px;
	letter-spacing: 0.04em;
	text-align: center;
	color:#8F2F5B;
}

#subtitlecaption {
	font-family: "Kiwi Maru", serif;
	font-size: 13px;
	text-align: center;
	color:#8F2F5B;
}		

#month {
	font-family: 'stylish', serif;
	font-size: 11px;
	text-align: center;
	letter-spacing: 0.05em;
	color: #225659;
}

#caption {
	font-family: "Hina Mincho", serif;
	font-size: 9px;
	text-align: center;
	color: #4E8C8A;
	padding: 10px;
}

p {
	font-family: "Kiwi Maru", serif;
	font-size: 16px;
	line-height: 1.9;
	color: #8F2F5B;
}

.text-center {
    text-align: center;
}


/* フッター */
.footer {
	padding: 60px 0px 150px 0px;
	opacity: 0.44;
	background-color: #87D2BB;
	text-align: center;
}

.footer a {
	font-family: 'stylish', serif;
 	text-decoration: none;
	letter-spacing: 0.05em;
	font-size: 16px;
	color: #187759;
}

.footer a:hover {
	color: #FFFFFF;
}

@media (max-width: 767px) {

	.main {
		margin: 200px 15px 200px 15px;
	}

#title {
	font-size: 60px;
}

p {
	font-size: 15px;
}

}

@media(min-width: 768px) and (max-width: 1024px){

	.main {
		margin: 200px auto 200px auto;
		width: 500px;
	}

p {
	font-size: 15px;
}

}

@media(min-width: 1025px) and (max-width: 1279px){

	.main {
		margin: 200px auto 200px auto;
		width: 500px;
	}

p {
	font-size: 15px;
}

}

@media(min-width:1280px){

	.main {
		margin: 200px auto 200px auto;
		width: 500px;
	}

p {
	font-size: 15px;
}

}