@charset "UTF-8";

/* ===================================
	File Name   : top.css
	Discription : Top Page Layout CSS
	Editors     : Bface suzuki
	Last Editor : Bface suzuki
	Last Update : 2009/09/30
====================================== */

/*========== Style Contents ==========

	1. Individual Redefinition /* CSSの再定義（ロールオーバーや背景画像など）
	2. Section [TopCraySeries] Setting /* 以下、各セクションのCSS
	3. Section [VoiceAgency] Setting /*
	4. Section [TopInformation] Setting /*
	*. Clear Release /* このページで使っているFloatの解除（共通要素の解除はCommon.cssへ）
	
	**. Css Hack /*各ハック
	
====================================== */





/*===== ■1. Individual Redefinition =====*/
#Entirety {
	background: url(common/img/bg_entirety-top.jpg) repeat-y;
}

#GlovalNavi li a#GnHome { background-position: -186px 0px;}

.Section {
	clear: both;/* Dreamweber display */
}

ul.ToPageTop {
	background: url(common/img/bg_contents.jpg) repeat-y;
}





/*===== ■2. Section [TopCraySeries] Setting =====*/
#TopCraySeries {
	background: #E7E3A2;
	margin-top: 15px;
	padding-bottom: 5px;
}

#TopCraySeries h2 {
	margin-bottom: 0px;}

#TopCraySeries ul#SeriesNavi li {
	width: 128px;
	height: 151px;
	background: #F8F7E3;
	border: #FFFFFF 1px solid;
	text-align: center;
	margin: 5px 0px 0px 5px;
	float: left;
	display: inline;
}

#TopCraySeries ul#SeriesNavi li#SeriesNaviPaint {
	width: 263px;
}

#TopCraySeries ul#SeriesNavi li a {
	display: block;
	width: 128px;
	height: 122px;
}

#TopCraySeries ul#SeriesNavi li#SeriesNaviPaint a { width: 263px; background: url(img/btn_top-paint.jpg) no-repeat;}
#TopCraySeries ul#SeriesNavi li#SeriesNaviTexture a { background: url(img/btn_top-texture.jpg) no-repeat;}
#TopCraySeries ul#SeriesNavi li#SeriesNaviPlaster a { background: url(img/btn_top-plaster.jpg) no-repeat;}
#TopCraySeries ul#SeriesNavi li#SeriesNaviBoard a { background: url(img/btn_top-board.jpg) no-repeat;}

#TopCraySeries ul#SeriesNavi li#SeriesNaviPaint a:hover,
#TopCraySeries ul#SeriesNavi li#SeriesNaviTexture a:hover,
#TopCraySeries ul#SeriesNavi li#SeriesNaviPlaster a:hover,
#TopCraySeries ul#SeriesNavi li#SeriesNaviBoard a:hover { background-position: 0px -122px;}


#TopCraySeries ul#SeriesNavi li img {
	display: inline;
	padding-top: 2px;
}

#TopCraySeries dl {
	background: #F3F1D0;
	width: 325px;
	padding: 5px;
	float: left;
	display: inline;
	font-size: 93%;
}

#TopCraySeries dl dd p {
	padding-top: 5px;
	margin-bottom: 5px;
}

#TopCraySeries dl#Certificate {
	margin: 5px 0px 0px 5px;
}

#TopCraySeries dl#Certificate dt {
	margin: 2px 0px 0px 2px;
}

#TopCraySeries dl#Certificate dd p {
	margin-bottom: 15px;
}

#TopCraySeries dl#Certificate dd ul {
	margin: 10px 0px 0px 1px;
}

#TopCraySeries dl#Certificate ul li {
	float: left;
	display: inline;
	margin-right: 4px;
	width: 98px;
	background: #FFFFFF;
	border: #C2A485 1px solid;
	font-size: 77%;
	text-align: center;
	padding: 7px 2px 5px;
}

#TopCraySeries dl#Certificate ul li img {
	display: inline;
	padding-bottom: 3px;
}

#TopCraySeries dl#Certificate ul li a {
	display: block;
	text-align: center;
}

#TopCraySeries dl#Certificate ul li#Ecolabel img {
	float: left;
	text-align: left;
	padding: 7px 0px 0px 5px;
}

#TopCraySeries dl#Certificate ul li#Ecolabel a {
	float: left;
	margin: 13px 0px 0px 5px;
	text-align: left;
}

#TopCraySeries dl#TopColorChart {
	margin: 5px 5px 0px 0px;
	padding-left: 0px;
	width: 330px;
	background: #F3F1D0 url(img/bg_color-chart.jpg) no-repeat right top;
}

#TopCraySeries dl#TopColorChart dt {
	padding-left: 10px;
	border-left: #8D6D50 1px dotted;
	margin-top: 2px;
}

#TopCraySeries dl#TopColorChart dd {
	padding-left: 10px;
	border-left: #8D6D50 1px dotted;
}

#TopCraySeries dl#TopColorChart p sup {
	font-size: 74.5%;
}

#TopCraySeries dl#TopColorChart ul li {
	font-size: 91%;
	margin-bottom: 3px;
	background: url(common/img/mark_circle-green.gif) no-repeat left 4px;
	padding-left: 12px;
}

#TopCraySeries dl#TopColorChart em {
	font-size: 74.5%;
}

/*===== ■3. Section [VoiceAgency] Setting =====*/
#VoiceAgency {
	width: 335px;
	float: left;
}

#VoiceAgency dl {
	margin-top: 10px;
}

#VoiceAgency dl#TopVoice {
	background: url(img/bg_board-middle.jpg) repeat-y;
	width: 335px;
	position: relative;
}

#VoiceAgency dl#TopVoice dt {
	height: 45px;
	background: url(img/bg_board-top.jpg) no-repeat bottom;
}

#VoiceAgency dl#TopVoice dt a {
	display: block;
	width: 335px;
	height: 35px;
	background: url(img/btn_top-voice.jpg) no-repeat;
}

#VoiceAgency dl#TopVoice dt a:hover { background-position: 0px -35px;}

#VoiceAgency dl#TopVoice dd {
	width: 325px;
	height: 125px;
	margin: 0px 5px;
	padding-bottom: 5px;
	background: url(img/bg_board-btm.jpg) no-repeat bottom;
}

#VoiceAgency dl#TopVoice dd #VoicePhoto {
	position: absolute;
	right: 0px;
	_right: -1px;
	top: 51px;
}

#VoiceAgency dl#TopVoice dd p {
	position: absolute;
	padding: 30px 0px 25px;
	margin-left: 10px;
	font-size: 93%;
	line-height: 160%;
}

#VoiceAgency dl#TopAgency {
	background: url(img/bg_agency-middle.jpg) repeat-y;
	width: 335px;
	position: relative;
}

#VoiceAgency dl#TopAgency dt {
	height: 50px;
	background: url(img/bg_agency-top.jpg) no-repeat bottom;
}

#VoiceAgency dl#TopAgency dt a {
	display: block;
	width: 335px;
	height: 40px;
	background: url(img/btn_top-agency.jpg) no-repeat;
}

#VoiceAgency dl#TopAgency dt a:hover { background-position: 0px -40px;}

#VoiceAgency dl#TopAgency dd {
	width: 335px;
	padding-bottom: 5px;
	background: url(img/bg_agency-btm.jpg) no-repeat bottom;
}

#VoiceAgency dl#TopAgency dd p {
	width: 180px;
	float: left;
	display: inline;
	font-size: 93%;
	line-height: 160%;
	margin: 15px 0px 5px 15px;
}

#VoiceAgency dl#TopAgency dd span {
	float: right;
	margin: 3px 5px 3px 0px;
}


/*===== ■4. Section [TopInformation] Setting =====*/
#TopInformation {
	width: 335px;
	float: right;
	clear:none;
	position: relative;
	margin-top: 10px;
	padding-bottom: 5px;
	background: url(img/bg_board-btm.jpg) no-repeat left bottom;
}

#TopInformation h3 {	
	width: 335px;
	height: 45px;
	background: url(img/ttl_top-information.jpg) no-repeat;
	position: relative;
	font-size: 0px;
	line-height: 0px;
	text-indent: -9999px;
}

#TopInformation h3 a#BtnInfoList {
	display: block;
	width: 51px;
	height: 15px;
	background: url(img/btn_top-info.jpg) no-repeat;
	position: absolute;
	right: 49px;
	top: 10px;
}

#TopInformation h3 a#BtnInfoList:hover { background-position: -51px 0px;}

#TopInformation em#Rss {
	position: absolute;
	right: 4px;
	top: 3px;
}

#TopInformation dl {
	width: 335px;
	background: url(img/bg_board-middle.jpg) repeat-y;
	padding-top: 10px;
	padding-bottom: 5px;
}

#TopInformation dl dt {
	width: 290px;
	margin: 0px 17px;
	color: #42470C;
	font-size: 77%;
	font-weight: bold;
	background: url(common/img/mark_border-pink.gif) no-repeat left 6px;
	padding: 0px 0px 3px 10px;
}

#TopInformation dl dd {
	width: 290px;
	margin-left: 27px;
	font-size: 93%;
}

#TopInformation dl dd p {
	font-size: 91%;
	margin: 0px;
	padding-top: 3px;
}

/*#TopInformation dl.Last {
	padding-bottom: 15px;
}*/



/*===== ■*.Clear Release  =====*/
#TopCraySeries ul#SeriesNavi:after,
#VoiceAgency dl#TopAgency dd:after,
#TopCraySeries dl#Certificate dd ul:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}

#TopCraySeries ul#SeriesNavi,
#VoiceAgency dl#TopAgency dd,
#TopCraySeries dl#Certificate dd ul {
	display: inline-block;
}

/* Hides from IE-mac ￥*/
*html #TopCraySeries ul#SeriesNavi,
*html #VoiceAgency dl#TopAgency dd,
*html #TopCraySeries dl#Certificate dd ul {
	height: 1%;
}

#TopCraySeries ul#SeriesNavi,
#VoiceAgency dl#TopAgency dd,
#TopCraySeries dl#Certificate dd ul {
	display: block;
}
/* End hides from IE-mac ￥*/