@charset "utf-8";

@import "./css/default.css";
@import "./css/font.css";
@import "./css/common.css";


/* ---------- body ---------- */
#body{
	text-align:center;
}
/* ---------- #body ---------- */


/* ---------- wrapper ---------- */
#wrapper{
	width:860px;
	text-align:left;
	margin:0px auto;
	background:url(./images/background.jpg) no-repeat scroll top left;
}
/* ---------- #wrapper ---------- */


/* ---------- main-width ---------- */
#log,
#menu
{
	width:160px;
}

#title,
#contents
{
	width:670px;
}
/* ---------- #main-width ---------- */


/* ---------- logo ---------- */
#logo{
	float:left;
}

#logo img{
	margin-left:15px;
}
/* ---------- #logo ---------- */


/* ---------- title ---------- */
#title{
	float:right;
	margin-bottom:35px;
}

#title h2{
	padding:25px 0px 0px 0px;
}
/* ---------- #title ---------- */


/* ---------- contents ---------- */
#contents{
	float:right;
}

.contents-wrapper,
.contents-wrapper-no
{
	padding:0px 20px 10px 0px;
	margin-bottom:20px;
	margin-left:15px;
	clear:both;
}

.contents-wrapper{
	background:url(./images/block-line.gif) repeat-x scroll bottom left;
}

#contents h3{
	margin-bottom:15px;
}

#contents h4{
	margin-bottom:5px;
}

#contents-topimage{
	padding:0px 20px 10px 0px;
	margin-bottom:20px;
	clear:both;
}
/* ---------- #contents ---------- */


/* ---------- menu ---------- */
#menu{
	float:left;
}

#menu ul{
	list-style-type:none;
	margin:0px 0px 20px 0px;
}

#menu ul li{
}

#menu ul li span{
	display:none;
}

#menu ul li a{
	background-position:0px 0px;
	display:block;
	width:160px;
	height:56px;
}

#menu ul li a:hover{
	background-position:0px -56px;
}

#menu-lineup a{
	background:url(./images/menu-lineup.jpg) no-repeat scroll top left;
}

#menu-aromaskincare a{
	background:url(./images/menu-aromaskincare.jpg) no-repeat scroll top left;
}

#menu-skincareinfo a{
	background:url(./images/menu-skincareinfo.jpg) no-repeat scroll top left;
}

#menu-concept a{
	background:url(./images/menu-concept.jpg) no-repeat scroll top left;
}

#qr{
	text-align:center;
}

#qr img{
	margin:0px auto;
}
/* ---------- #menu ---------- */


/* ---------- footer ---------- */
#footer{
	clear:both;
	width:100%;
	text-align:right;
	padding:35px 0px 70px 0px;
	background:#ffffff url(./images/footer.jpg) no-repeat scroll top left;
}

#copyright{
	clear:both;
	padding-top:20px;
	color:#a5932b;
	margin:0px;
}

#copyright a{
	color:#a5932b;
	text-decoration:none;
}

#footer ul{
	width:385px;
	list-style-type:none;
	margin:0px;
	float:right;
}

#footer ul li{
	float:left;
	margin-left:20px;
}

#footer ul li span{
	display:none;
}

#footer ul li a{
	background-position:0px 0px;
	display:block;
}

#footer ul li a:hover{
	background-position:0px -20px;
}

#footer-compnay a{
	height:20px;
	width:78px;
	background:url(./images/footer-company.jpg) no-repeat scroll top left;
}

#footer-faq a{
	height:20px;
	width:44px;
	background:url(./images/footer-faq.jpg) no-repeat scroll top left;
}

#footer-contact a{
	height:20px;
	width:91px;
	background:url(./images/footer-contact.jpg) no-repeat scroll top left;
}

#footer-whatsnew a{
	height:20px;
	width:92px;
	background:url(./images/footer-whatsnew.jpg) no-repeat scroll top left;
}
/* ---------- #footer ---------- */


/* ---------- lineup ---------- */
#lineup-element-wrapper{
	background:url(./images/lineup-element.jpg) no-repeat scroll top center;
	margin-bottom:40px;
}

#lineup-element-wrapper h4{
	margin-bottom:5px;
}

.lineup-element-left{
	width:300px;
	float:left;
	margin-bottom:10px;
	margin-left:15px;
}

.lineup-element-right{
	width:300px;
	float:right;
	margin-bottom:10px;
	margin-right:15px;
}

.lineup-image{
	float:left;
	width:160px;
	height:200px;
}

.lineup-detail{
	float:right;
	width:470px;
}

.lineup-detail img{
	margin-bottom:0px;
}

.lineup-attention{
	color:#a5932b;
	font-size:77%;
	line-height:120%;
}
/* ---------- #lineup ---------- */


/* ---------- aroma-skincare ---------- */
#aroma-element-wrapper{
	background:url(./images/aroma-element.jpg) no-repeat scroll top center;
	margin-bottom:40px;
}

#aroma-element-wrapper h4{
	margin-bottom:5px;
	height:15px;
}

#aroma-element-wrapper p{
	margin-bottom:0px;
}

.aroma-element-left{
	width:300px;
	float:left;
	margin-bottom:10px;
	margin-left:15px;
}

.aroma-element-right{
	width:300px;
	float:right;
	margin-bottom:10px;
	margin-right:15px;
}

.aroma-element-mental{
	margin:0px;
	background:#fffebe;
	display:inline;
	padding:0px 5px 0px 3px;
	font-weight:bold;
}

.aroma-element-potency{
	margin:0px;
	background:#ffd8d8;
	display:inline;
	padding:0px 5px 0px 3px;
	font-weight:bold;
}

.aroma-element-detail{
	margin-left:0px;
}
/* ---------- #aroma-skincare ---------- */


/* ---------- company ---------- */
#company{
	margin-bottom:50px;
	
}

#company th{
	text-align:right;
	vertical-align:top;
	padding:6px 0px 10px 0px;
}

#company td{
	vertical-align:top;
	text-align:left;
	padding:1px 0px 11px 20px;
}

#company .mail{
	padding:6px 0px 1px 20px;
}
/* ---------- #company ---------- */


/* ---------- faq ---------- */
.faq-question{
	background:url(./images/faq/question.jpg) no-repeat scroll top left;
	padding:4px 0px 5px 35px;
	margin-bottom:5px;
}

.faq-question span{
	display:block;
	background:#e8e8ff;
	padding:0px 0px 0px 5px;
	font-weight:bold;
}

.faq-answer{
	background:url(./images/faq/answer.jpg) no-repeat scroll top left;
	padding:4px 0px 5px 35px;
}
/* ---------- #faq ---------- */


/* ---------- news ---------- */
#news{
	list-style-type:none;
	width:95%;
	margin:0px 0px 0px 0px;
}

#news li{
	background:url(./images/block-line.gif) repeat-x scroll bottom left;
	padding:10px 0px 10px 20px;
}

#news span{
	margin-right:20px;
}

#news a{
	font-weight:bold;
	color:#2a8023;
	text-decoration:none;
}

#news a:hover{
	font-weight:bold;
	color:#2a8023;
	text-decoration:none;
}

#news a:visited{
	font-weight:bold;
	color:#2a8023;
	text-decoration:none;
}

#news-entry{
}

#news-entry h2{
	margin:0px 0px 20px 0px;
	padding:0px 0px 5px 0px;
	border-bottom:1px solid #a5932b;
}
/* ---------- #news ---------- */


/* ---------- skincare-info ---------- */
a.skincare-info-point:link{
	color:#27811f;
	font-weight:bold;
	text-decoration:none;
}

a.skincare-info-point:active{
	color:#27811f;
	font-weight:bold;
	text-decoration:none;
}

a.skincare-info-point:hover{
	color:#27811f;
	font-weight:bold;
	text-decoration:none;
}

a.skincare-info-point:visited{
	color:#27811f;
	font-weight:bold;
	text-decoration:none;
}
/* ---------- #skincare-info ---------- */


/* ---------- contact ---------- */
#contact-info{
}

#contact{
	margin-bottom:25px;
}

#contact th{
	text-align:left;
	padding:5px 15px 5px 5px;
	vertical-align:top;
}

#contact td{
	padding:5px 15px 5px 5px;
}

#contact textarea{
	width:100%;
}

#contact-send{
	width:500px;
	text-align:center;
}

#contact-error{
}
/* ---------- #contact ---------- */



.gold{
	color:#a5932b;
}

.green{
	color:#27811f;
}
