@charset "shift_jis";

/***********************************************
　アットコスメ2009年3月特集
　“春の色ってむずかしい！？”
　					      --- create 2009/02/26
　					      --- update 2009/02/27
************************************************/

/*=============================================
　setup
===============================================*/
#spc0903_cts {
	width: 930px;
	text-align: left;
	font-size: 12px;
	line-height: 150%;
	color: #000;
	position: relative;
}
p.rate img {
	vertical-align: baseline;
}

/*=============================================
　clearfix
===============================================*/
.cmn_clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; font-size:0; line-height:1; overflow:hidden; }
.cmn_clearfix { display:inline-block; }
/*\*/
* html .cmn_clearfix { height:1%; }
.cmn_clearfix { display:block; }
/**/


/*=============================================
　font
===============================================*/
#spc0903_cts a,
#spc0903_cts a:hover {
	color: #000;
	text-decoration: underline;
}
#spc0903_cts span.strong { font-weight: bold; font-size: 16px; }
#spc0903_cts span.emp { color: #f68; }

#spc0903_cts span.txtgrn { color: #480; }
#spc0903_cts span.txtorg { color: #f63; }
#spc0903_cts span.txtble { color: #78c; }
#spc0903_cts span.txt14 { font-size: 14px; }
#spc0903_cts span.txt13 { font-size: 13px; }
#spc0903_cts span.txt12 { font-size: 12px; }


/*=============================================
　groval navi(header)
===============================================*/
#spc0903_cts #spc0903_header {
	width: 930px; height: 210px;
	background: url( ../images/cmn/spc0903_cmn_hdr_bg.gif) no-repeat left top;
}
#spc0903_cts #spc0903_header h2 a {
	display: block;
	width: 360px; height: 0;
	padding: 70px 0 0 0;
	background: url( ../images/cmn/spc0903_cmn_hdr_title.gif) no-repeat left top;
	overflow: hidden;
	
	position: absolute;
	left: 514px; top: 52px;
}
#spc0903_cts #spc0903_header ul {
	list-style: none;
	position: absolute;
	left: 45px; top: 131px;
}
#spc0903_cts #spc0903_header ul li {
	display: block;
	float: left;
}
#spc0903_cts #spc0903_header ul li a,
#spc0903_cts #spc0903_header ul li p {
	display: block;
	padding: 78px 0 0 0;
	overflow: hidden;
	
	background: url( ../images/cmn/spc0903_cmn_hdr_menu.gif) no-repeat 0 0;
}
#spc0903_cts #spc0903_header ul li a:hover {
	background: url( ../images/cmn/spc0903_cmn_hdr_menu_on.gif) no-repeat 0 0;
}
#spc0903_cts #spc0903_header ul li p.active {
	background: url( ../images/cmn/spc0903_cmn_hdr_menu_act.gif) no-repeat 0 0;
}
#spc0903_cts #spc0903_header ul li.vol01 a,
#spc0903_cts #spc0903_header ul li.vol01 p {
	width: 208px; height: 0;
	background-position: 0 0;
}
#spc0903_cts #spc0903_header ul li.vol01 a:hover {
	background: url( ../images/cmn/spc0903_cmn_hdr_menu_on.gif) no-repeat 0 0;
}
#spc0903_cts #spc0903_header ul li.vol02 a,
#spc0903_cts #spc0903_header ul li.vol02 p {
	width: 210px; height: 0;
	background-position: -209px 0;
}
#spc0903_cts #spc0903_header ul li.vol02 a:hover {
	background: url( ../images/cmn/spc0903_cmn_hdr_menu_on.gif) no-repeat -209px 0;
}
#spc0903_cts #spc0903_header ul li.vol03 a,
#spc0903_cts #spc0903_header ul li.vol03 p {
	width: 212px; height: 0;
	background-position: -419px 0;
}
#spc0903_cts #spc0903_header ul li.vol03 a:hover {
	background: url( ../images/cmn/spc0903_cmn_hdr_menu_on.gif) no-repeat -419px 0;
}
#spc0903_cts #spc0903_header ul li.vol04 a,
#spc0903_cts #spc0903_header ul li.vol04 p {
	width: 212px; height: 0;
	background-position: -630px 0;
}
#spc0903_cts #spc0903_header ul li.vol04 a:hover {
	background: url( ../images/cmn/spc0903_cmn_hdr_menu_on.gif) no-repeat -630px 0;
}

/*=============================================
　groval navi(footer)
===============================================*/
#spc0903_cts #spc0903_footer {
	width: 930px; height: 129px;
	background: url( ../images/cmn/spc0903_cmn_ftr_bg.gif) no-repeat left top;
	position: relative;
}
#spc0903_cts #spc0903_footer ul {
	list-style: none;
	position: absolute;
	left: 45px; top: 1px;
}
#spc0903_cts #spc0903_footer ul li {
	display: block;
	float: left;
}
#spc0903_cts #spc0903_footer ul li a,
#spc0903_cts #spc0903_footer ul li p {
	display: block;
	padding: 78px 0 0 0;
	overflow: hidden;
	
	background: url( ../images/cmn/spc0903_cmn_ftr_menu.gif) no-repeat 0 0;
}
#spc0903_cts #spc0903_footer ul li a:hover {
	background: url( ../images/cmn/spc0903_cmn_ftr_menu_on.gif) no-repeat 0 0;
}
#spc0903_cts #spc0903_footer ul li p {
	background: url( ../images/cmn/spc0903_cmn_ftr_menu_cls.gif) no-repeat 0 0;
}
#spc0903_cts #spc0903_footer ul li p.active {
	background: url( ../images/cmn/spc0903_cmn_ftr_menu_act.gif) no-repeat 0 0;
}
#spc0903_cts #spc0903_footer ul li.vol01 a,
#spc0903_cts #spc0903_footer ul li.vol01 p {
	width: 208px; height: 0;
	background-position: 0 0;
}
#spc0903_cts #spc0903_footer ul li.vol01 a:hover {
	background: url( ../images/cmn/spc0903_cmn_ftr_menu_on.gif) no-repeat 0 0;
}
#spc0903_cts #spc0903_footer ul li.vol02 a,
#spc0903_cts #spc0903_footer ul li.vol02 p {
	width: 210px; height: 0;
	background-position: -209px 0;
}
#spc0903_cts #spc0903_footer ul li.vol02 a:hover {
	background: url( ../images/cmn/spc0903_cmn_ftr_menu_on.gif) no-repeat -209px 0;
}
#spc0903_cts #spc0903_footer ul li.vol03 a,
#spc0903_cts #spc0903_footer ul li.vol03 p {
	width: 212px; height: 0;
	background-position: -419px 0;
}
#spc0903_cts #spc0903_footer ul li.vol03 a:hover {
	background: url( ../images/cmn/spc0903_cmn_ftr_menu_on.gif) no-repeat -419px 0;
}
#spc0903_cts #spc0903_footer ul li.vol04 a,
#spc0903_cts #spc0903_footer ul li.vol04 p {
	width: 212px; height: 0;
	background-position: -630px 0;
}
#spc0903_cts #spc0903_footer ul li.vol04 a:hover {
	background: url( ../images/cmn/spc0903_cmn_ftr_menu_on.gif) no-repeat -630px 0;
}


/*=============================================
　アンケート
===============================================*/
#spc0903_cts #spc0903_enquete {
	width: 930px; height: 137px;
	background: url( ../images/cmn/spc0903_cmn_enq_bg.gif) no-repeat left top;
	position: relative;
}
#spc0903_cts #spc0903_enquete p.title {
	width: 200px; height: 0;
	padding: 20px 0 0 0;
	background: url( ../images/cmn/spc0903_cmn_enq_title.gif) no-repeat left top;
	overflow: hidden;
	
	position: absolute;
	left: 60px; top: 35px;
}
#spc0903_cts #spc0903_enquete p.txt {
	width: 580px;
	font-size: 11px;
	position: absolute;
	left: 63px; top: 62px;
}
#spc0903_cts #spc0903_enquete a {
	display: block;
	width: 200px; height: 0;
	padding: 35px 0 0 0;
	background: url( ../images/cmn/spc0903_cmn_enq_btn.gif) no-repeat left top;
	overflow: hidden;
	
	position: absolute;
	left: 663px; top: 52px;
}
#spc0903_cts #spc0903_enquete a:hover {
	background-position: 0 -35px;
}


/*=============================================
　ページTOPへ
===============================================*/
#spc0903_cts a.pagetop {
	display: block;
	width: 86px; height: 0;
	padding: 18px 0 0 0;
	background: url( ../images/cmn/spc0903_cmn_pagetop.gif) no-repeat 0 0;
	overflow: hidden;
	
	position: absolute;
	left: 799px;
}
#spc0903_cts a.pagetop:hover {
	background: url( ../images/cmn/spc0903_cmn_pagetop.gif) no-repeat 0 -18px;
}