@charset "UTF-8";
/* text
************************************************/
a:link {
	color: #333;
	text-decoration: underline;
	font-weight: 100;
}
a:visited {
	color: #333;
	text-decoration: underline;
	font-weight: 100;
}
a:hover {
	color: #CCC;
	text-decoration: underline;
	font-weight: 100;
}
a:active {
	color: #333;
	text-decoration: underline;
	font-weight: 100;
}
/* body
************************************************/
body {
	margin: 0;
	padding: 0;
	font-size: 12px;
	text-align:center;
	background: #300;
}



#container {
	margin: 0 auto;
	padding: 0;
	width: 930px;
	background: #fff;
	text-align: left;
	line-height: 140%;
}

p, img, p img, a img{
	margin: 0;
	padding: 0;
	border: none;
}


.rollover{}

p.to_top{
	clear: both;
	text-align: right;
	margin: 3px 5px;
	font-size: 10px;
	color: #300;
}

span.small{
	font-size: 10px;
}

/*header
*************************************************/
#header{
	margin: 0;
	padding: 0;
}

#header .back{
	position: relative;
	background: url(../img/header2.jpg) 0 0 no-repeat;
	height: 246px;
}

#header .back p{
	position: absolute;
	top: 191px;
	left: 144px;
	color: #fff;
}

/*media
*************************************************/
.media{
	background: url(../img/media.jpg) 0 0 no-repeat;
	height: 313px;
}

.media ul.pre{
	padding: 150px 0 5px 40px;
}
.media ul.info{
	padding: 0 0 1px 40px;
	line-height: 110%;
	clear: both;
	overflow: hidden;
}

.media ul.info li.date{
	float: left;
	margin: 0 20px 0 0;
}

.media ul.info li.se{
	float: left;
}


/* pagelink
*************************************************/
.pagelink{
	overflow: hidden;
	clear: both;
}

.pagelink .left{
	position: relative;
	width: 465px;
	float: left;
	height: 80px;
	background: url(../img/page_link1.jpg) 0 0 no-repeat;
}

.pagelink .left p{
	position: absolute;
	top: 19px;
	left: 257px;
}

.pagelink .right{
	position: relative;
	width: 465px;
	float: right;
	height: 80px;
	background: url(../img/page_link2.jpg) 0 0 no-repeat;
}

.pagelink .right p{
	position: absolute;
	top: 19px;
	left: 313px;
}



/* blog
*************************************************/
.blog{
	clear: both;
	overflow: hidden;
	height: 1042px;
}

.blog .blogs{
	clear: both;
	overflow: hidden;
	height: 950px;
}

.blog .blogs .one1{
	position: relative;
	float: left;
	width: 465px;
	height: 463px;
	background: url(../img/blog1.jpg) 0 0 no-repeat;
}
.blog .blogs .one1 p{
	position: absolute;
	top: 237px;
	left: 307px;
}

.blog .blogs .one2{
	position: relative;
	float: left;
	width: 465px;
	height: 463px;
	background: url(../img/blog2.jpg) 0 0 no-repeat;
}
.blog .blogs .one2 p{
	position: absolute;
	top: 237px;
	left: 292px;
}

.blog .blogs .one3{
	position: relative;
	float: left;
	width: 465px;
	height: 487px;
	background: url(../img/blog3.jpg) 0 0 no-repeat;
}
.blog .blogs .one3 p{
	position: absolute;
	top: 240px;
	left: 307px;
}

.blog .blogs .one4{
	position: relative;
	float: left;
	width: 465px;
	height: 487px;
	background: url(../img/blog4.jpg) 0 0 no-repeat;
}
.blog .blogs .one4 p{
	position: absolute;
	top: 240px;
	left: 292px;
}


/*lineup
*************************************************/
.lineup{
	margin: 10px 0 0;
	 overflow: hidden;
	 clear: both;
	 color: #666;
}

.lineup .left{
	float: left;
}

.lineup .right{
	float: right;
}


.lineup .lotion{
	position: relative;
	height: 206px;
	width: 385px;
	background: url(../img/lineup1.jpg) 0 0 no-repeat;
}

.lineup .lotion p.price{
	padding: 39px 0 12px 155px;
	font-size: 10px;
}
.lineup .lotion p.se{
	padding: 0 0 0 155px;
}

.lineup .lotion p.btn{
	position: absolute;
	top: 134px;
	left: 162px;
	height: auto;
}

.lineup .essence{
	position: relative;
	height: 211px;
	width: 385px;
	background: url(../img/lineup2.jpg) 0 0 no-repeat;
}
.lineup .essence p.price{
	padding: 52px 0 12px 155px;
	font-size: 10px;
}
.lineup .essence p.se{
	padding: 0 0 0 155px;
}
.lineup .essence p.btn{
	position: absolute;
	top: 141px;
	left: 162px;
	height: auto;
}



.lineup .cream{
	position: relative;
	height: 214px;
	width: 385px;
	background: url(../img/lineup3.jpg) 0 0 no-repeat;
}
.lineup .cream p.price{
	padding: 52px 0 12px 155px;
	font-size: 10px;
}
.lineup .cream p.se{
	padding: 0 0 0 155px;
}
.lineup .cream p.btn{
	position: absolute;
	top: 141px;
	left: 162px;
	height: auto;
}


.lineup .mask{
	position: relative;
	height: 312px;
	width: 545px;
	background: url(../img/lineup4.jpg) 0 0 no-repeat;
}
.lineup .mask p.price{
	padding: 72px 0 12px 277px;
	font-size: 10px;
}
.lineup .mask p.se{
	padding: 0 0 0 277px;
}
.lineup .mask p.btn{
	position: absolute;
	top: 241px;
	left: 318px;
	height: auto;
}


.lineup .drink{
	position: relative;
	height: 319px;
	width: 545px;
	background: url(../img/lineup5.jpg) 0 0 no-repeat;
}
.lineup .drink p.price{
	padding: 75px 0 12px 277px;
	font-size: 10px;
}
.lineup .drink p.se{
	padding: 0 0 0 277px;
}
.lineup .drink p.btn{
	position: absolute;
	top: 246px;
	left: 318px;
	height: auto;
}



/*secret
*************************************************/
.secret{
	overflow: hidden;
	clear: both;
	color: #666;
	height: 685px;
}

.secret .left{
	float: left;
	width: 393px;
}

.secret .right{
	float: right;
}


.secret .secret1{
	width: 393px;
	height: 326px;
	background: url(../img/secret1.jpg) 0 0 no-repeat;
}

.secret .secret1 p{
	padding: 70px 26px 0 31px;
}


.secret .secret2{
	width: 393px;
	height: 240px;
	background: url(../img/secret2.jpg) 0 0 no-repeat;
}

.secret .secret2 p{
	padding: 67px 196px 0 31px;
}

.secret .secret3{
	width: 537px;
	height: 181px;
	background: url(../img/secret3.jpg) 0 0 no-repeat;
}

.secret .secret3 p{
	padding: 70px 158px 0 19px;
}


.secret .secret4{
	position: relative;
	width: 537px;
	height: 248px;
	background: url(../img/secret4.jpg) 0 0 no-repeat;
}

.secret .secret4 p{
	padding: 82px 177px 0 221px;
}

.secret .secret4 p.link{
	position: absolute;
	top: 197px;
	left: 378px;
	margin: 0;
	padding: 0;
}


/* text
************************************************/
.secret .secret4 p.link a:link {
	color: #39C;
	text-decoration: underline;
	font-weight: 100;
}
.secret .secret4 p.link a:visited {
	color: #39C;
	text-decoration: underline;
	font-weight: 100;
}
.secret .secret4 p.link a:hover {
	color: #666;
	text-decoration: underline;
	font-weight: 100;
}
.secret .secret4 p.link a:active {
	color: #39C;
	text-decoration: underline;
	font-weight: 100;
}



.secret .secret5{
	width: 537px;
	height: 137px;
	background: url(../img/secret5.jpg) 0 0 no-repeat;
}

.secret .secret5 p{
	padding: 55px 146px 0 19px;
}




/*footer
*************************************************/
#footer{
}

/*btn
*************************************************/
.btn{
	overflow: hidden;
	clear: both;
	height: 260px;
}

.btn .left{
	position: relative;
	float: left;
	background: url(../img/btn01.jpg) 0 0 no-repeat;
	width: 546px;
	height: 260px;
}

.btn .left p{
	position: absolute;
	top: 45px;
	left: 317px;
	line-height: 150%;
}

.btn .right{
	position: relative;
	float: right;
	background: url(../img/btn02.jpg) 0 0 no-repeat;
	width: 384px;
	height: 260px;
}

.btn .right p.se{
	position: absolute;
	top: 110px;
	left: 64px;
	font-size: 10px;
	line-height: 120%;
}

.btn .right p.btn{
	height: auto;
	position: absolute;
	top: 182px;
	left: 31px;
}

/*footer
*************************************************/
#footer{
	clear: both;
	overflow: hidden;
	background: url(../img/footer.jpg) 0 0 repeat-x;
	height: 74px;
	color: #fff;
}

#footer p.left{
	float: left;
	padding: 22px 0 0 26px;
}


#footer p.right{
	float: right;
	padding: 22px 26px 0 0;
}

/* text
************************************************/
#footer a:link {
	color: #fff;
	text-decoration: underline;
	font-weight: 100;
}
#footer a:visited {
	color: #fff;
	text-decoration: underline;
	font-weight: 100;
}
#footer a:hover {
	color: #CCC;
	text-decoration: underline;
	font-weight: 100;
}
#footer a:active {
	color: #fff;
	text-decoration: underline;
	font-weight: 100;
}