/*  
Sticky Footer Solution
by Steve Hatcher 
http://stever.ca
http://www.cssstickyfooter.com
*/

* {margin:0;padding:0;} 

/* must declare 0 margins on everything, also for main layout components use padding, not 
vertical margins (top and bottom) to add spacing, else those margins get added to total height 
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body {
	height: 100%;
	font-size:86%;
	font-family: "ヒラギノ明朝 Pro W6", HiraMinPro-W6, "ヒラギノ明朝 Pro W3", HiraMinPro-W3, Meiryo, "MS Gothic" ,"細明朝体";
	color:#595132;
}
html>body {
	letter-spacing: 0.05em;
}
td {
	line-height:150%;
}
#ls {
	text-align:center;
	height: 100%;
	width:100%;
	margin:0 auto;
}

body > #ls {height: auto; min-height: 100%;}

#main {padding-bottom: 54px;}  /* must be same height as the footer */

#footer {
	position: relative;
	margin-top: -54px; /* negative value of footer height */
	height: 54px;
	clear:both;
	background:#fff;
} 

/* CLEAR FIX*/
.clearfix:after {content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


#content {
	width:972px;
	margin:20px auto;
}

/************ Global Nav ************/
#head {
	width:100%;
	height:100px;
	background: url(img/gnav_bg.jpg) repeat-x left top;
}
#gnav {
	margin:0 auto;
	width:972px;
	height:92px;
}
#gnav #logo {
	padding-top:11px;
	width:154px;
	text-align:center;
	float:left;
}
ul#global {
	padding-top:50px;
	width:808px;
	float:right;
}
ul#global li{
	padding-right:2px;
	height:40px;
	float:left;
	list-style-type:none;
	background: url(img/gnav_sep.gif) repeat-x left top;
	line-height:0;
	font-size:0;
}
ul#global li#global-shop{
	padding-right:0px;
	background: none;
}
#accentline {
	clear:both;
	width:100%;
	height:8px;
	background: url(img/accentline.jpg) repeat-x left top;
	line-height:0;
	font-size:0;
}
/************ Index Flash ************/
#index-flash {
	margin: 16px auto;
	width:968px;
	height:441px;
	padding:1px;
	border:1px solid #D5CDB8;
}
/************ Breadcrum ************/
#breadcrum {
	clear:both;
	width:100%;
	height:64px;
	background: url(img/breadcrum_bg.gif) repeat-x 0 1px;
	margin-bottom:25px;
}
#breadcrum #breadlink{
	clear:both;
	text-align:left;
	width:972px;
	margin:0 auto;
	padding-top:23px;
	font-size:85%;
}
html>body #breadcrum #breadlink{
	font-size:80%;
}
/************ Left Nav ************/
#lnav {
	width:340px;
	padding-top:12px;
	float:left;
	text-align:left;
	background: url(img/lnav_sep.gif) repeat-x left top;
}
#lnav h2{
	margin:15px 0px 8px 0px;
}
#lnav ul{
	width:340px;
	margin:0;
	padding:0;
	padding-bottom:12px;
	background: url(img/lnav_sep.gif) repeat-x left bottom;
	list-style-type:none;
}
#lnav ul li{
	width:340px;
	height:32px;
}

/************ Main Column ************/
#main-column {
	width:570px;
	float:right;
	text-align:left;
}
#page-title {
	margin-bottom:20px;
}
.photo {
	margin-bottom:30px;
	text-align:center;
}
.model {
	margin-bottom:20px;
	text-align:center;
}
h2.catch {
	padding-top:7px;
	margin-bottom:25px;
}
h2.catch-massage {
	padding-top:0px;
	margin-bottom:25px;
}
.arrow {
	margin:10px 0px 0px 100px;
}
.box {
	margin-top:25px;
	width:570px;
	border:1px solid #D5CDB8;
}
.box-content {
	width:528px;
	padding:20px;
	background: url(img/box_bg.jpg) repeat-y left top;
	border:1px solid #fff;
}
html>body .box-content {
}
.box-title {
	height:36px;
	margin-bottom:15px;
	background: url(img/accentline.jpg) no-repeat left 35px;
}
#option-menu {
	list-style-type:none;
	padding:0;
	margin:0;
}

/************ Intro ************/
.intro {
	width:972px;
}
.intro .catch{
	float:left;
}
.intro .catch h1{
	margin:0;
	padding:0;
	text-indent:-9999px;
}
.intro .picture{
	float:right;
	text-indent:-9999px;
}
#about-catch{
	width:972px;
	height:167px;
	background: url(img/catch_about.gif) no-repeat center top;
	text-indent:-9999px;
}
#shop-catch{
	width:972px;
	height:60px;
	background: url(img/catch_shop.gif) no-repeat center top;
	text-indent:-9999px;
}
#enhanced-catch{
	width:636px;
	height:250px;
	background: url(img/catch_enhanced.gif) no-repeat left top;
}
#pic-enhanced{
	width:336px;
	height:250px;
	background: url(img/pic_enhanced.jpg) no-repeat left top;
}
#daily-catch{
	width:527px;
	height:250px;
	background: url(img/catch_daily.gif) no-repeat left top;
}
#pic-daily{
	width:445px;
	height:250px;
	background: url(img/pic_daily.jpg) no-repeat left top;
}

/************ Model Picture (Not to display right-click menu) ************/
#pic-massage{
	width:570px;
	height:300px;
	background: url(img/pic_massage.jpg) no-repeat left top;
}
#pic-moist{
	width:570px;
	height:300px;
	background: url(img/pic_moist.jpg) no-repeat left top;
}
#pic-smooth{
	width:570px;
	height:300px;
	background: url(img/pic_smooth.jpg) no-repeat left top;
}
#pic-white{
	width:570px;
	height:300px;
	background: url(img/pic_white.jpg) no-repeat left top;
}
#pic-form{
	width:570px;
	height:300px;
	background: url(img/pic_form.jpg) no-repeat left top;
}
#pic-moist{
	width:570px;
	height:300px;
	background: url(img/pic_moist.jpg) no-repeat left top;
}
#pic-hand{
	width:570px;
	height:300px;
	background: url(img/pic_hand.jpg) no-repeat left top;
}
#pic-neck{
	width:570px;
	height:300px;
	background: url(img/pic_neck.jpg) no-repeat left top;
}
#pic-pore-tzone{
	width:229px;
	height:300px;
	background: url(img/p_pore1.jpg) no-repeat left top;
}
#pic-pore-uzone{
	width:229px;
	height:300px;
	background: url(img/p_pore2.jpg) no-repeat left top;
}

/************ Model Picture (Not to display right-click menu) ************/
#pic-makeoffcream{
	width:570px;
	height:170px;
	background: url(img/pic_makeoffcream.jpg) no-repeat center top;
}
#pic-makeoffoil{
	width:570px;
	height:327px;
	background: url(img/pic_makeoffoil.jpg) no-repeat center top;
}
#pic-treatment{
	width:570px;
	height:312px;
	background: url(img/pic_treatment.jpg) no-repeat center top;
}
#pic-oiltreatment{
	width:570px;
	height:285px;
	background: url(img/pic_oiltreatment.jpg) no-repeat center top;
}
#pic-balancing{
	width:570px;
	height:280px;
	background: url(img/pic_balancing.jpg) no-repeat center top;
}
#pic-dual{
	width:570px;
	height:298px;
	background: url(img/pic_dual.jpg) no-repeat center top;
}
#pic-vitalizing{
	width:570px;
	height:127px;
	background: url(img/pic_vitalizing.jpg) no-repeat center top;
}
#pic-dayprotectc{
	width:570px;
	height:52px;
	background: url(img/pic_dayprotectc.jpg) no-repeat center top;
}
#pic-dayprotectl{
	width:570px;
	height:203px;
	background: url(img/pic_dayprotectl.jpg) no-repeat center top;
}
#pic-decolletage{
	width:570px;
	height:281px;
	background: url(img/pic_decolletage.jpg) no-repeat center top;
}

/************ Background Block ************/
.bgblock {
	width:972px;
	padding:20px;
	margin-top:35px;
	background: #F7F6EF;
}
html>body .bgblock {
	width:932px;
}
.bgblock h2.titleline{
	width:932px;
	height:34px;
	text-align:left;
	background: url(img/titleline.jpg) no-repeat left bottom;
	margin-bottom:15px;
}
#about-menu {
	width:868px;
	height:154px;
	margin:20px 32px 0px 32px;
}
/************ Float ************/
.float-left{
	float:left;
}
.float-right{
	float:right;
}

/************ Skin Concern (Enhanced) ************/
.checkArrow {
	visibility:hidden;
	margin-left:31px;
}

/************ Step (Daily) ************/
#step {
	width:932px;
	height:397px;
	background: url(img/step_bg.gif) no-repeat left top;
	position:relative;
	left:0px;
	top:0px;
	text-align:left;
}
#step ul#step-item{
	list-style-type:none;
	line-height:0;
	font-size:0;
	position:absolute;
}
li#step-makeoffoil{
	position:absolute;
	left:16px;
	top:216px;
}
li#step-makeoffcream{
	position:absolute;
	left:101px;
	top:256px;
}
li#step-treatment{
	position:absolute;
	left:187px;
	top:104px;
}
li#step-oiltreatment{
	position:absolute;
	left:296px;
	top:236px;
}
li#step-balancing{
	position:absolute;
	left:391px;
	top:96px;
}
li#step-dual{
	position:absolute;
	left:520px;
	top:104px;
}
li#step-dayprotectl{
	position:absolute;
	left:633px;
	top:21px;
}
li#step-dayprotectc{
	position:absolute;
	left:715px;
	top:71px;
}
li#step-vitalizing{
	position:absolute;
	left:652px;
	top:251px;
}
li#step-decolletage{
	position:absolute;
	left:831px;
	top:104px;
}

/************ Popup Window ************/
#ls-pop {
	margin: 10px 10px 10px 10px;
	width:370px;
}

/************ link ************/
a {
	color:#595132;
}
a:visited {
	color:#595132;
	text-decaration:underline;
}
a:hover {
	color:#bb9900;
	text-decaration:underline;
}

/************ Shop List ************/
#shoplist{
	width:861px;
	margin:35px auto;
}
#shoplist .region{
	width:96px;
	height:230px;
	background: #F7F6EF url(img/shop_sep.gif) repeat-y 94px top;
	float:left;
}
#shoplist #kyushu{
	width:92px;
	float:right;
}
ul.prefecture{
	padding:10px 0 0 0;
	line-height:180%;
	list-style-type:none;
}

/************ How to Use ************/
ol.howto{
	margin:8px 0 0 24px;
	line-height:150%;
}
ol.howto li{
	margin:0 0 4px 0;
}



/************ Subwin ************/
#subwin-head {
	width:100%;
	height:85px;
	background: url(img/gnav_bg.jpg) repeat-x left -15px;
}
#subwin-toparea {
	margin:0 auto;
	width:377px;
	height:77px;
}
#subwin-head #logo {
	padding-top:8px;
	width:66px;
	text-align:left;
	float:left;
}
#subwin-head #headline {
	padding-top:40px;
	float:left;
}
#subwin-content {
	width:377px;
	margin:20px auto 0px auto;
	text-align:left;
}
#subwin-content h2{
	margin-bottom:15px;
}
#massage-course {
	position:relative;
	width:377px;
	height:418px;
}
#mask-course {
	position:relative;
	width:377px;
	height:524px;
}
#mask-course #allmenu{
	position:absolute;
	left:0px;
	top:0px;
	z-index:1;
}
#pore{
	position:absolute;
	left:0px;
	top:40px;
	z-index:2;
}
#mask-course #white{
	position:absolute;
	left:8px;
	top:251px;
	z-index:2;
}
#mask-course #form{
	position:absolute;
	left:189px;
	top:251px;
	z-index:2;
}
#mask-course #smooth{
	position:absolute;
	left:8px;
	top:283px;
	z-index:2;
}
#mask-course #moist{
	position:absolute;
	left:189px;
	top:283px;
	z-index:2;
}
#mask-course #neck{
	position:absolute;
	left:0px;
	top:353px;
	z-index:2;
}
#massage-course #neck{
	position:absolute;
	left:0px;
	top:244px;
	z-index:2;
}

/************ Subwin All************/
#allwin-head {
	width:100%;
	height:85px;
	background: url(img/gnav_bg.jpg) repeat-x left -15px;
}
#allwin-toparea {
	margin:0 auto;
	width:600px;
	height:77px;
}
#allwin-head #logo {
	padding-top:8px;
	width:66px;
	text-align:left;
	float:left;
}
#allwin-head #headline {
	padding-top:40px;
	float:left;
}
#allwin-content {
	width:600px;
	margin:20px auto 0px auto;
	text-align:left;
}
#allwin-content h2{
	width:600px;
	padding-bottom:5px;
	margin-bottom:15px;
	background: url(img/all_hr.gif) no-repeat left bottom;
}
#allwin-content .course{
	height:125px;
	padding-left:145px;
}
ul.course-list {
	width:600px;
	height:185px;
	margin:0;
	padding:0;
	list-style-type:none;
	margin-bottom:30px;
}
ul.course-list li{
	width:300px;
	height:96px;
	margin:0;
	padding:0;
	list-style-type:none;
	float:left;
}
/************ OLD! ************/

.content-swf {
	width:760px;
	padding:0px;
	background-color:#f2ebe8;
	border-bottom: 1px solid #b6b189;
	border-right: 1px solid #b6b189;
	border-left: 1px solid #b6b189;
	}
.content-lnav {
	width:760px;
	padding:20px 20px 20px 10px;
	background-color:#f2ebe8;
	border-bottom: 1px solid #b6b189;
	border-right: 1px solid #b6b189;
	border-left: 1px solid #b6b189;
	}
.pagetop{
	width:458px;
	padding:5px 0px 0px 0px;
	border-top: 1px solid #b6b189;
	}
.tx-copy{
	margin-top:1em;
	line-height:175%;
}
.tx-s{
	font-size:80%;
	line-height:175%;
}
p {
	margin-top:20px;
}

.t5 {
	margin-top:5px;
	}
.t10 {
	margin-top:10px;
	}
.t15 {
	margin-top:15px;
	}
.t20 {
	margin-top:20px;
	}
.t25 {
	margin-top:20px;
	}
.t30 {
	margin-top:25px;
	}
.t50 {
	margin-top:50px;
	}
.l20 {
	margin-left:20px;
	}

.clear-both {
	clear:both;
	line-height:1;
	height:0;
	font-size:1;
}