@charset "UTF-8";
@import url(reset.css);


/* =====================================================================
*	font adjustment
*
*	77% = 10px		108% = 14px		136% = 18px
*	85% = 11px		114% = 15px		152% = 20px
*	93% = 12px		122% = 16px		167% = 22px
*
*	182% = 24px		189% = 25px
* =================================================================== */
/* =====================================================================
*	Copyright (c) 2009, Yahoo! Inc. All rights reserved.
*	Code licensed under the BSD License:
*	http://developer.yahoo.net/yui/license.txt
*	version: 2.7.0
* =================================================================== */

body {
		font: 13px/1.231 arial,helvetica,clean,sans-serif;
		*font-size: small; /* for IE6/7 */
		*font: x-small; /* for IE Quirks Mode */
		color: #666;
		line-height: 1.6em;
		letter-spacing: 0.07em;
		word-spacing:0.15em;
		background: #0e0e22 url(../images/common/body_pattern.jpg) repeat-x top;
}


/* =====================================================================
*
*	EN/ INDEX
*
*
*		1. Whole Style
*
*		2. Header
*
*		3. Global Navigation
*
*		4. Main Contents
*
*		5. Footer
*
* 	--------------------------------------------------------------
*
*		6. MURASAKI Line Up
*
* =================================================================== */

/*Basic Style*/

a:link		{ color:#afafdd; text-decoration:underline; }
a:visited	{ color:#afafdd; text-decoration:underline; }
a:hover		{ color:#7171aa; text-decoration:none; }
a:active	{ color:#afafdd; text-decoration:underline; }

h1, h2, hr { display:none; }



/* =====================================================================
*
*    1. Whole Style
*
* =================================================================== */
#murasaki_jpn {
		text-align:center;
}



/* =====================================================================
*
*    2. Header
*
* =================================================================== */
.header_area {
		background: url(../images/index/header_bg.jpg) no-repeat top center;
		margin:0 auto;
		text-align:center;
}

		.header_area .header_box {
				width:850px;
				margin:0 auto;
				padding:0;
				line-height:0;
		}


/* =====================================================================
*
*    3. Global Navigation
*
* =================================================================== */

.gnav_area {
		background: url(../images/common/gnav_pattern.jpg) repeat-x left top;
		text-align:center;
}

		.gnav_area .gnav_box {
				width:1000px;
				height:50px;
				background:url(../images/common/gnav_bg.jpg) no-repeat 0% 50%;
				margin:0 auto;
				text-align:center;
		}
		
				.gnav_area .gnav_box .gnav_menu {
						width:850px;
						height:50px;
						margin:0 75px;
				}
				
				.gnav_area .gnav_box .gnav_menu ul:after {
						content:".";
						display:block;
						height:0;
						clear:both;
						visibility:hidden;
				}
				
				.gnav_area .gnav_box .gnav_menu ul {
						zoom:1;
				} /* IE */
				
				.gnav_area .gnav_box .gnav_menu ul {
						width:850px;
						height:50px;
						list-style:none;
				}
				
				.gnav_area .gnav_box .gnav_menu li {
						float:left;
						height:50px;
						list-style:none;
						display:block;
				}
				
				/* ---------------------------------
				*    Brand Story
				*/
				.gnav_area .gnav_box .gnav_menu #brandstory a		{ width:213px; height:50px; background: #3c3c88 url(../images/common/gnav.jpg) no-repeat 0px 0px; text-indent:-9999px; display:block; }
				.gnav_area .gnav_box .gnav_menu #brandstory a:hover	{ width:213px; background: #3c3c88 url(../images/common/gnav.jpg) no-repeat 0px -50px; }
					
				/* ---------------------------------
				*    Feature
				*/					
				.gnav_area .gnav_box .gnav_menu #feature a			{ width:212px; height:50px; background: #3c3c88 url(../images/common/gnav.jpg) no-repeat -213px 0px; text-indent:-9999px; display:block; }
				.gnav_area .gnav_box .gnav_menu #feature a:hover	{ width:212px; background: #3c3c88 url(../images/common/gnav.jpg) no-repeat -213px -50px; }
					
				/* ---------------------------------
				*    Online Shop
				*/						
				.gnav_area .gnav_box .gnav_menu #onlineshop a		{ width:212px; height:50px; background: #3c3c88 url(../images/common/gnav.jpg) no-repeat -425px 0px; text-indent:-9999px; display:block; }
				.gnav_area .gnav_box .gnav_menu #onlineshop a:hover	{ width:212px; background: #3c3c88 url(../images/common/gnav.jpg) no-repeat -425px -50px; }
					
				/* ---------------------------------
				*    Company
				*/					
				.gnav_area .gnav_box .gnav_menu #company a			{ width:213px; height:50px; background: #3c3c88 url(../images/common/gnav.jpg) no-repeat -637px 0px; text-indent:-9999px; display:block; }
				.gnav_area .gnav_box .gnav_menu #company a:hover	{ width:213px; background: #3c3c88 url(../images/common/gnav.jpg) no-repeat -637px -50px; }




/* =====================================================================
*
*    4. Main Contents
*
* =================================================================== */

.contents_area {
		clear:both;
		background: #303055 url(../images/common/page_bg.jpg) repeat-x 50% 100%;
		text-align:center;
}

		.contents_area .contents_wrap {
				clear:both;
				background: url(../images/common/cont_pattern.jpg) repeat-x top;
				text-align:center;
		}
		
				.contents_area .contents_wrap .contents_box {
						width:1000px;
						background: url(../images/common/cont_bg.jpg) no-repeat top center;
						margin:0 auto;
				}
				
						.contents_area .contents_wrap .contents_box .main_area {
								clear:both;
								width:1000px;
								background: url(../images/common/footer_bg.jpg) no-repeat bottom;
								padding-bottom:150px;
								text-align:center;
						}
						
								.contents_area .contents_wrap .contents_box .main_area .main_box {
										width:850px;
										background:#fff;
										margin:0 auto;
										padding:40px 0 0;
										text-align:left;
								}




/* =====================================================================
*
*    5. Footer
*
* =================================================================== */

.footer_box {
		clear:both;
		width:850px;
		margin:0 auto;
		padding:10px;
		color:#ccc;
		font-size:85%;
		text-align:left;
}

		.footer_box #footer_menu{
				float:left;
				width:415px;
		}
		
				.footer_box #footer_menu #footer_link{
						margin-bottom:5px;
				}
				
				.footer_box #footer_menu #language_box{
						color:#fff;
				}
				
		.footer_box #copyright{
				float:right;
				width:415px;
				text-align:right;
		}
		
		
		
		
/* =====================================================================
*
*    6. MURASAKI Line Up
*
* =================================================================== */	

#murasaki_lineup{	
		margin: 0 0 0 15px;
}

		#murasaki_lineup ul {
			width:810px;
			list-style: none inside;
			zoom:1;
		}
		#murasaki_lineup ul:after {
		content:".";
		display:block;
		height:0;
		clear:both;
		visibility:hidden;
		}
		
		#murasaki_lineup li {
				float:left;
				width:260px;
				height:130px;
				margin-right: 10px;
				margin-bottom: 10px;
				display:block;
		}
		
		#murasaki_lineup a {
				display:block;
				height:130px;
		}
		
		.lineup_box {
				padding-top: 40px;
				margin-right: 10px;
				margin-left: 85px;
		}
		
		.brand_name {
				display: block;
				font-size: 11px;
				font-weight: normal;
		}
		
		.product_name {
				margin-bottom: 10px;
				font-size: 14px;
				font-weight: bold;
				display: block;
		}
		
		.btn_detail {
				background: #c6c6f4;
				color: #3c3c88;
				font-size: 12px;
				font-weight: normal;
				text-align: center;
				display: block;
		}
		
		
		/* ---------------------------------
		*    Cleansing Gel
		*/		
		#murasaki_lineup #banner_cleansinggel {
				background: url(../images/index/p_cleansinggel.jpg) no-repeat 10% 100%;
		}
				#murasaki_lineup #banner_cleansinggel a:link	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_cleansinggel a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_cleansinggel a:hover	{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Soap
		*/		
		#murasaki_lineup #banner_soap {
				background: url(../images/index/p_soap.jpg) no-repeat 6% 100%;
		}
				#murasaki_lineup #banner_soap a:link	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_soap a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_soap a:hover	{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Mask
		*/		
		#murasaki_lineup #banner_mask {
				background: url(../images/index/p_mask.jpg) no-repeat 1% 100%;
		}
				#murasaki_lineup #banner_mask a:link	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_mask a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_mask a:hover	{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Toninglotion
		*/		
		#murasaki_lineup #banner_toninglotion {
				background: url(../images/index/p_toninglotion.jpg) no-repeat 10% 100%;
		}
				#murasaki_lineup #banner_toninglotion a:link	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_toninglotion a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_toninglotion a:hover	{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Silky Essence
		*/		
		#murasaki_lineup #banner_silkyessence {
				background: url(../images/index/p_silkyessence.jpg) no-repeat 12% 100%;
		}
				#murasaki_lineup #banner_silkyessence a:link	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_silkyessence a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_silkyessence a:hover	{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Cream
		*/			
		#murasaki_lineup #banner_cream {
				background: url(../images/index/p_cream.jpg) no-repeat 5% 100%;
		}
				#murasaki_lineup #banner_cream a:link		{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_cream a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_cream a:hover		{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Eye Cream
		*/		
		#murasaki_lineup #banner_eyecream {
				background: url(../images/index/p_eyecream.jpg) no-repeat 13% 100%;
		}
				#murasaki_lineup #banner_eyecream a:link	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_eyecream a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_eyecream a:hover	{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Facial
		*/		
		#murasaki_lineup #banner_facial {
				background: url(../images/index/p_facialliftmask.jpg) no-repeat 2% 100%;
		}
				#murasaki_lineup #banner_facial a:link		{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_facial a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_facial a:hover		{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Trial
		*/		
		#murasaki_lineup #banner_trial {
				background: url(../images/index/p_trial.jpg) no-repeat 3% 100%;
		}
				#murasaki_lineup #banner_trial a:link		{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_trial a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_trial a:hover		{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    BB Cream 30g
		*/		
		#murasaki_lineup #banner_bbcream30 {
				background: url(../images/index/p_bbcream30.jpg) no-repeat 11% 100%;
		}
				#murasaki_lineup #banner_bbcream30 a:link		{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_bbcream30 a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_bbcream30 a:hover		{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    BB Cream 6g
		*/		
		#murasaki_lineup #banner_bbcream06 {
				background: url(../images/index/p_bbcream6.jpg) no-repeat 11% 100%;
		}
				#murasaki_lineup #banner_bbcream06 a:link		{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_bbcream06 a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_bbcream06 a:hover		{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Shampoo
		*/		
		#murasaki_lineup #banner_shampoo {
				background: url(../images/index/p_shampoo.jpg) no-repeat 10% 100%;
		}
				#murasaki_lineup #banner_shampoo a:link		{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_shampoo a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_shampoo a:hover	{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Treatment
		*/		
		#murasaki_lineup #banner_treatment {
				background: url(../images/index/p_treatment.jpg) no-repeat 10% 100%;
		}
				#murasaki_lineup #banner_treatment a:link		{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_treatment a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_treatment a:hover		{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
		
		/* ---------------------------------
		*    Hair Serum
		*/		
		#murasaki_lineup #banner_hairserum {
				background: url(../images/index/p_hairserum.jpg) no-repeat 13% 100%;
		}
				#murasaki_lineup #banner_hairserum a:link		{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_hairserum a:visited	{ border: 1px solid #cccccc; color: #3c3c88; text-decoration: none; }
				#murasaki_lineup #banner_hairserum a:hover		{ border: 1px solid #bb5599; color: #3c3c88; text-decoration: none; }
				
				
				
				
/* ---------------------------------
*    夏期休暇のお知らせ
*/
#summer_vacation{
	border:2px solid #e1cee7;
	background:#fff6fc;
	padding:13px 10px 10px;
	margin-bottom:25px;
}
#summer_vacation .vacation_info{
	background:#9275a0;
	padding:2px 5px;
	color:#fff;
}
#summer_vacation dt{
	margin:10px 0 5px;
	padding:0 0 2px 5px;
	border-bottom:1px solid #e1cee7;
	color:#664477;
	/*border-left:3px solid #cecee1;*/
}
#summer_vacation dd{
	padding:0 0 0 18px;
}