@charset "utf-8";
* {
margin:0; /* マージン一括指定 */
padding:0; /* パディング一括指定 */
}
img {
border:none; /* ボーダー一括指定 */
vertical-align:middle; /* 垂直位置 */
}
a {
text-decoration:none; /* 下線など */
}
ul,ol {
list-style:none; /* 一括指定 */
}

html {
	font-family:sans-serif; /* フォントファミリー */
	line-height:1.5; /* 行幅 */
	font-size:87.5%; /* フォントサイズ */
	color:#666;				/* 文字色： */
	
}

BODY	{					/* ドキュメント全体 */
	background-color:white;			/* 背景色：白 */
	}
	
img {
	max-width:100%; /* 表示の横幅 */
}
#keytop{
	height:229px;				/* 表示の縦幅 */
	}
#keytop img{
	max-width:100%; /* 表示の横幅 */
	}

header{
	text-align:center; /* 文字揃え */
	margin-bottom:24px; /* 下マージン */
}
header h1{
	font-size:1.8em;			/*  フォントサイズ */
	font-family:serif; /* フォントファミリー */
	font-weight: normal;
	text-align:center; /* 文字揃え */
	line-height:3; /* 行幅 */
}
header h2{
	font-size:1.5em;			/*  フォントサイズ */
	font-family:sans-serif; /* フォントファミリー */
	font-weight: normal;
	text-align:center; /* 文字揃え */
	line-height:3; /* 行幅 */
}
.number {
	font-size:0.8em;			/*  フォントサイズ */
	background-color: #000;
	color: #fff;
	margin-right:0.5em; /* 右マージン */
	padding:0.2em;				/* 下パディング */
}
.indivi{
	background-color: #999;

}
.mille{
	background-color: #F19EC2;
}
.aries{
background-color: #F0844A;}

.fiore{
background-color: #87CAAC;}

.lamani{
background-color: #BB4140;}

.logi{
background-color: #4C8DCB;}

.dream{
background-color: #7C6E9A;}

.kimik{background-color: #7A6A56;}
.lumi{background-color: #803A51;}
.hana{background-color: #CAB15D;}
.yucc{background-color: #5DC2D0;}
.bell{background-color: #EE858F;}
.san{background-color: #A5A3D0;}
#contents{
	width:90%; /* 表示の横幅 */
	margin-left:auto; /* 左マージン */
	margin-right:auto; /* 右マージン */
	text-align:center; /* 文字揃え */
}

section {
	text-align:center; /* 文字揃え */
	font-weight:bold;			/* 太さ */
	padding-bottom:24px;				/* 下パディング */
	}
section p{
	line-height:1.5; /* 行幅 */
	margin-bottom:24px; /* 下マージン */
	}	
aside img{
	display:none;				/* 表示形式 */
		
}
footer{
	font-size: 0.6em;
	color:#fff; /* 文字色： */
	text-align:center; /* 文字揃え */
	padding:24px 0; /* パディング一括指定 */
	background-color:#2B231A; /* 背景色： */
	clear:both; /* 回り込み解除 */
}
header hr{
	width:90%; /* 表示の横幅 */
	margin-left:auto; /* 左マージン */
	margin-right:auto; /* 右マージン */
	border:1px #ccc solid;				/* ボーダー色 */
}
.p16{
	margin-bottom:4px; /* 下マージン */

}
.p16b{
	margin-bottom:4px; /* 下マージン */
	color:#a22b2b;
}
.p8{
	font-size: 0.75em;
	font-weight:normal;			/* 太さ */
	line-height:1.5; /* 行幅 */
}
section img{
	border:1px #ccc solid;				/* ボーダー色 */
	margin-bottom:8px; /* 下マージン */
}
section h3{
	line-height:3; /* 行幅 */
}

#contents a{
	color:#f00;				/* 文字色： */
	
}

@media screen and (min-width:400px){
/* 400～768pxまで */
#keytop{
	height:234px;				/* 表示の縦幅 */
	background-image:url(images/header_m.jpg);		/* 背景画像： */
	background-position:center;		/* 背景表示位置 */		
	background-repeat:repeat-x;		/* 背景画像繰り返し制御 */
	}
#keytop img{
	visibility:hidden;
	}
}



@media screen and (min-width:768px){
/* 768～1023pxまで */
html {
	font-family:sans-serif; /* フォントファミリー */
	line-height:1.5; /* 行幅 */
	font-size:100%; /* フォントサイズ */
	color:#666;				/* 文字色： */	
}
#keytop img{
	visibility:hidden;
	}

#keytop{
	height:234px;				/* 表示の縦幅 */
	background-image:url(images/header_l.jpg);		/* 背景画像： */
	background-position:center;		/* 背景表示位置 */		
	background-repeat:repeat-x;		/* 背景画像繰り返し制御 */
	}
#contents{
	text-align:left; /* 文字揃え */
}
#contents{
	width:74%; /* 表示の横幅 */
	margin-left:auto; /* 左マージン */
	margin-right:auto; /* 右マージン */
	overflow:hidden;
}
section {
	width:58%; /* 表示の横幅 */
	float:left;				/* フロートと回り込み */
	text-align:left; /* 文字揃え */
	font-weight:bold;			/* 太さ */
	margin-right:4%; /* 右マージン */
	}
.sponly{
	display:none;				/* 表示形式 */
}
aside img{
	margin-top:24px; /* 下マージン */
	display:inline;				/* 表示形式 */
	width:37%;				/* 表示の横幅 */
	border:1px #ccc solid;				/* ボーダー色 */
	margin-bottom:24px; /* 下マージン */
}

}