/* ================================================================== */
/*																	*/
/* ! Campaign - Index */
/*																	*/
/* ------------------------------------------------------------------
*
*	 1. Common
*
*	 2. Main
*   	2.1. Big Banner
*   	2.2. Contents
*
*	 3. Side Area
*
* =================================================================== */


/* ================================================================== */
/*																	*/
/* ! 1. Anything Slider */
/*																	*/
/* ================================================================== */

.anythingSlider	{
	width: 948px;
	height: 348px;
	position: relative;
	margin: 0;
}

.anythingSlider .anythingWrapper {
	width: 948px;
	height: 316px;
	overflow: hidden;
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
}

.anythingSlider .anythingWrapper ul {
	width: 10000px;
	height: 316px;
	list-style: none;
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
}

.anythingSlider .anythingWrapper ul li  {
	display: block;
	overflow: hidden;
	float: left;
	padding: 0;
	height: 316px;
	width: 948px;
	margin: 0;
}

.anythingSlider .arrow  {
	position: absolute;
	top: -198px;
	overflow: hidden;
	height: 32px;
	width: 32px;
}

.anythingSlider .arrow .cont {
	height: 32px;
	width: 32px;
	text-indent: -9999px;
	cursor: pointer;
}

.anythingSlider .forward { right: -16px; }
.anythingSlider .back    { left: -16px; }

	* html .anythingSlider .back { left: -490px; }

.anythingSlider .forward .cont { background: url(../images/slider_nav_arrow_r.png) no-repeat 0 0; }
.anythingSlider .back .cont    { background: url(../images/slider_nav_arrow_l.png) no-repeat 0 0; }

.anythingSlider .forward .cont:hover { background-position: 0 -32px; }
.anythingSlider .back .cont:hover    { background-position: 0 -32px; }

	* html .anythingSlider .forward .cont { background: url(../images/slider_nav_arrow_r_ie6.png) no-repeat; }
	* html .anythingSlider .back .cont    { background: url(../images/slider_nav_arrow_l_ie6.png) no-repeat; }

.thumbNav {
	position: relative;
	z-Index: 300;
	top: 340px;
	text-align: center;
}
* html .thumbNav { border: 1px solid #2D2D2D; }

.thumbNav li {
	display: inline;
}

.start-stop {
	display: none;
}

#anythingDots {
	position: absolute;
	top: 340px;
	left: 50%;
	z-index: 300;
	width: 90px;
	height: 8px;
	margin-left: -24px;
	padding-left: 6px;
}

#anythingDots a {
	float: left;
	padding: 0;
	height: 8px;
	width: 8px;
	margin: 0 6px 0 0;
	overflow: hidden;
	background: url(../images/slider_nav_bg.gif) no-repeat;
	text-indent: -9999px;
}
#anythingDots a.cur { background-image: url(../images/slider_nav_bg_h.gif); }


/* Prevents */

.anythingSlider .anythingWrapper ul ul {
	position: static;
	margin: 0;
	background: none;
	overflow: visible;
	width: auto;
	border: 0;
}

.anythingSlider .anythingWrapper ul ul li {
	float: none;
	height: auto;
	width: auto;
	background: none;
}


/* ================================================================== */
/*																	*/
/* ! 2. Campaign List */
/*																	*/
/* ================================================================== */

#contentsContainer {
	padding-top: 0;
	margin-top: 32px;
}

#contentsList {
	width: 632px;
}

#contentsList li {
	position: relative;
	float: left;
	width: 632px;
	height: 211px;
	overflow: hidden;
	margin: 0;
	padding: 0;
	cursor: pointer;
}

	#contentsList li:last-child { border-bottom: 1px solid #FAFCFD; }

#contentsList .new {
	position: absolute;
	z-index: 10;
	top: 9px;
	left: 179px;
}

#contentsList article {
	height: 210px;
	margin: 0;
	padding: 1px 1px 0 1px;
	background: #FAFCFD;
}

#contentsList figure {
	float: left;
	width: 210px;
	height: 210px;
	overflow: hidden;
}

#contentsList .desc {
	float: right;
	width: 380px;
	padding: 0 16px 0 0;
}

#contentsList h2 {
	margin-top: 24px;
	margin-bottom: 24px;
}

#contentsList .catch {
	line-height: 140%;
	font-weight: bold;
}


/* ------------------------------------------------------------------ */
/* ! ca1: 春の美白最前線「美白ケアを成功させる4つのステップ」 */
/* ------------------------------------------------------------------ */

#ca1s h2 a {
    height: 41px;
    background: url(/campaign/images/ca1_ttl_s.gif) no-repeat;
}
#ca1s .catch { color: #4C3D92; }
    

/* ------------------------------------------------------------------ */
/* ! ca2: サマーコフレで完成する夏のトレンド・メイクアップ */
/* ------------------------------------------------------------------ */

#ca2s h2 a {
    height: 39px;
    background: url(/campaign/images/ca2_ttl_s.gif) no-repeat;
}
#ca2s .catch { color: #BF4A98; }


/* ------------------------------------------------------------------ */
/* ! ca3: 素肌の美しさの源は、「水」。あなたの夏肌の弱点をチェック */
/* ------------------------------------------------------------------ */

#ca3s h2 a {
    height: 40px;
    background: url(/campaign/images/ca3_ttl_s.gif) no-repeat;
}
#ca3s .catch { color: #1E9FD8; }


/* ------------------------------------------------------------------ */
/* ! ca4: アトリエメイド エターナルレメディから、待望のエッセンス、登場！ */
/* ------------------------------------------------------------------ */

#ca4s h2 a {
    height: 40px;
    background: url(/campaign/images/ca4_ttl_s.gif) no-repeat;
}
#ca4s .catch { color: #127296; }


/* ------------------------------------------------------------------ */
/* ! ca5: 最新アイラッシュトレンド */
/* ------------------------------------------------------------------ */

#ca5s h2 a {
    height: 16px;
    background: url(/campaign/images/ca5_ttl_s.gif) no-repeat;
}
#ca5s .catch { color: #786CAD; }


/* ------------------------------------------------------------------ */
/* ! ca6: 限定アイテムで表現する「フローレセント メイクアップ開花」 */
/* ------------------------------------------------------------------ */

#ca6s h2 a {
    height: 40px;
    background: url(/campaign/images/ca6_ttl_s.gif) no-repeat;
}
#ca6s .catch { color: #D06EA7; }

/* ------------------------------------------------------------------ */
/* ! ca7: ヘア&メイクアップ体験キャンペーン */
/* ------------------------------------------------------------------ */

#ca7s h2 a {
    height: 38px;
    background: url(/campaign/images/ca7_ttl_s.gif) no-repeat;
}
#ca7s .catch { color: #D61937; }
#ca7s strong { text-decoration: underline; }

/* ------------------------------------------------------------------ */
/* ! ca7: ヘア&メイクアップ体験キャンペーン */
/* ------------------------------------------------------------------ */

#ca8s h2 a {
    height: 39px;
    background: url(/campaign/images/ca8_ttl_s.gif) no-repeat;
}
#ca8s .catch { color: #007194; }

/* ------------------------------------------------------------------ */
/* ! ca9: ヘア&メイクアップ体験キャンペーン */
/* ------------------------------------------------------------------ */

#ca9s h2 a {
    height: 38px;
    background: url(/campaign/images/ca9_ttl_s.gif) no-repeat;
}
#ca9s .catch { color: #D04C8C; }

/* ------------------------------------------------------------------ */
/* ! ca10: コアフュール・マキユール ディレクター特集 */
/* ------------------------------------------------------------------ */

#ca10s h2 a {
    height: 38px;
    background: url(/campaign/images/ca10_ttl_s.gif) no-repeat;
}
#ca10s .catch { color: #666666; padding: 0 0 8px 0; }

/* ------------------------------------------------------------------ */
/* ! ca11: 2011年の運勢と開運カラー */
/* ------------------------------------------------------------------ */

#ca11s h2 a {
    height: 38px;
    background: url(/campaign/images/ca11_ttl_s.gif) no-repeat;
}
#ca11s .catch { color: #666666; padding: 0 0 8px 0; }

/* ------------------------------------------------------------------ */
/* ! ca12: 限定アイテムで楽しむ「モルフォリアム メイクアップ」 */
/* ------------------------------------------------------------------ */

#ca12s h2 a {
    height: 40px;
    background: url(/campaign/images/ca12_ttl_s.gif) no-repeat;
}
#ca12s .catch { color: #009944; padding: 0 0 8px 0; }

/* ------------------------------------------------------------------ */
/* ! ca14: シュウ ウエムラがこだわった “美しさへの水” */
/* ------------------------------------------------------------------ */

#ca14s h2 a {
    height: 43px;
    background: url(/campaign/images/ca14_ttl_s.gif) no-repeat;
}
#ca14s .catch { color: #00A3D9; padding: 0 0 8px 0; }

/* ------------------------------------------------------------------ */
/* ! ca15: シュウ ウエムラがこだわった “美しさへの水” */
/* ------------------------------------------------------------------ */

#ca15s h2 a {
    height: 39px;
    background: url(/campaign/images/ca15_ttl_s.gif) no-repeat;
}
#ca15s .catch { color: #666666; padding: 0 0 8px 0; }

/* ------------------------------------------------------------------ */
/* ! ca16: 私に似合う、ポイント メイクアップ 体験キャンペーン */
/* ------------------------------------------------------------------ */

#ca16s h2 a {
    height: 39px;
    background: url(/campaign/images/ca16_ttl_s.gif) no-repeat;
}
#ca16s .catch { color: #C30063; padding: 0 0 8px 0; }
#ca16s .catch strong { text-decoration: underline; }

/* ------------------------------------------------------------------ */
/* ! ca17: novadiva ノバディーバ */
/* ------------------------------------------------------------------ */

#ca17s h2 a {
    height: 40px;
    background: url(/campaign/images/ca17_ttl_s.gif) no-repeat;
}
#ca17s .catch { color: #666666; padding: 0 0 8px 0; }

/* ------------------------------------------------------------------ */
/* ! ca18: 美人常識クイズ */
/* ------------------------------------------------------------------ */

#ca18s h2 a {
    height: 39px;
    background: url(/campaign/images/ca18_ttl_s.gif) no-repeat;
}
#ca18s .catch { color: #666666; padding: 0 0 8px 0; }

/* ------------------------------------------------------------------ */
/* ! ca19: アンチエイジング ハンドマッサージ 体験キャンペーン */
/* ------------------------------------------------------------------ */

.ca19 .bigBanner {
	position: relative;
    background: url(/campaign/hand_massage/images/bigbnr_bg.jpg) no-repeat;
}

.ca19 .bigBanner h1 {
	position: absolute;
	left: 16px;
	top: 24px;
    width: 546px;
    height: 79px;
    background: url(/campaign/hand_massage/images/bigbnr_ttl.png) no-repeat;
}	

.ca19 .bigBanner .desc {
	position: absolute;
	left: 16px;
	top: 116px;
    width: 386px;
	height: 178px;
    background: url(/campaign/hand_massage/images/bigbnr_desc.png) no-repeat;
}

.ca19 .bigBanner .date {
	position: absolute;
	left: 442px;
	top: 267px;
	width: 493px;
	height: 29px;
    background: url(/campaign/hand_massage/images/bigbnr_date.png) no-repeat;
}

#ca19s h2 {
    height: 38px;
    background: url(/campaign/images/ca19_ttl_s.gif) no-repeat;
}

#ca19s .catch { color: #666666; padding: 0 0 8px 0; }

#ca19s strong { color: #1D8BB7; }

/* ------------------------------------------------------------------ */
/* ! ca20: ヘアカラーとコーディネートして魅せる、ウィンター メイクアップ */
/* ------------------------------------------------------------------ */

#ca20s h2 a {
    height: 63px;
    background: url(/campaign/images/ca20_ttl_s.gif) no-repeat;
}
#ca20s .catch { color: #666666; padding: 0 0 8px 0; }

/* ------------------------------------------------------------------ */
/* ! ca21: セレスチャル ガーデン 〜天空の庭〜 */
/* ------------------------------------------------------------------ */

#ca21s h2 a {
    height: 63px;
    background: url(/campaign/images/ca21_ttl_s.gif) no-repeat;
}
#ca21s .catch { color: #666666; padding: 0 0 8px 0; }


/* ------------------------------------------------------------------ */
/*                                                                    */
/* ! 2.1. Backnumber List */
/*                                                                    */
/* ------------------------------------------------------------------ */

#backnumberList {
	width: 600px;
	margin: 32px 0 0 0;
	padding: 24px 16px 24px 16px;
	background: #FAFCFD;
}

#backnumberList h2 {
	height: 16px;
	background: url(/campaign/images/backnumber_ttl.gif) no-repeat;
}

#backnumberList dl {
	width: 600px;
	padding: 24px 0 0 0;
}

#backnumberList dt {
	clear: both;
	float: left;
	width: 179px;
	padding: 0 0 8px 0;
	text-align: right;
	font-weight: bold;
	color: #666666;
}

#backnumberList dd {
	float: right;
	width: 380px;
	padding: 0 0 8px 0;
	text-align: left;
}

#backnumberList a:link    { color: #262626 !important; }
#backnumberList a:visited { color: #262626 !important; }
#backnumberList a:hover   { color: #D02022 !important; }
#backnumberList a:active  { color: #D02022 !important; }


/* ================================================================== */
/*                                                                    */
/* ! 3. Side Area */
/*                                                                    */
/* ================================================================== */

/* ---------------------------------
*    Update Tree    */

ul.updateTree {
	position: relative;
	z-index: 100;
	width: 272px;
	margin: 0 27px 23px 16px;
	padding: 24px 0 19px 0;
	border-top: #444444 3px solid;
	border-bottom: #444444 3px solid;
}

.updateTree a:link    { color: #CCCCCC !important; text-decoration: none; }
.updateTree a:visited { color: #CCCCCC !important; text-decoration: none; }
.updateTree a:hover   { color: #FBFBFB !important; text-decoration: underline; }
.updateTree a:active  { color: #FBFBFB !important; text-decoration: underline; }

.updateTree li h5 {
	padding-bottom: 16px;
	height: 21px;
	background: url(/campaign/images/update_ttl.png) no-repeat;
}

.updateTree ul.secondlayer li {
	width: 240px;
	padding-left: 16px;
	padding-bottom: 8px;
	background: url(/common/images/li_arrow.gif) 2px 0 no-repeat;
	line-height: 150%;
	color: #999999;
}

ul.updateTree li span {
	color: #CCCCCC;
}


/* ---------------------------------
*    Big Banner    */

aside .bigbnr {
	margin-top: 0;
	margin-bottom: 28px;
	padding-top: 0;
}