/* @group base */

html {
	margin: 0;
	padding: 0;
}

body {
		background: url(./images/content_bg.gif) repeat-y 50% 0px #8b0e15;
	color: #feb;
	text-align: center;
	width: 100%;
	margin: 0;
	padding: 0;
}

body#top {
	background: none #8b0e15;
}

/* @group header */

#header {
	width: 740px;
	height: 60px;
	background: no-repeat url(./images/header.gif);
}

#header h1 {
	padding-top: 13px;
	padding-left: 32px;
	float: left;
	margin: 0;
}

#header h1 a {
	display: block;
	text-indent: -9999px;
	width: 172px;
	height: 32px;
}

#header ul {
	margin: 0;
	padding: 0;
	float: right;
	height: 60px;
	list-style: none;
}

#header ul li {
	float: left;
}

#header ul li a {
	text-indent: -9999px;
	display: block;
}

#header ul li#about a {
	width: 124px;
	height: 60px;
	background: no-repeat url(./images/header_about.gif);
}

#header ul li#about a#active {
	background: no-repeat url(./images/header_about_active.gif);
}

#header ul li#about a:hover {
	background: no-repeat url(./images/header_about.gif) 0px -60px
}

#header ul li#howto a {
	width: 124px;
	height: 60px;
	background: no-repeat url(./images/header_howto.gif);
}

#header ul li#howto a#active {
	background: no-repeat url(./images/header_howto_active.gif);
}

#header ul li#howto a:hover {
	background: no-repeat url(./images/header_howto.gif) 0px -60px;
}

#header ul li#soap a {
	width: 124px;
	height: 60px;
	background: no-repeat url(./images/header_soap.gif);
}

#header ul li#soap a#active {
	background: no-repeat url(./images/header_soap_active.gif);
}

#header ul li#soap a:hover {
	background: no-repeat url(./images/header_soap.gif) 0px -60px;
}

#header ul li#salon a {
	width: 90px;
	height: 60px;
	background: no-repeat url(./images/header_salon.gif);
}

#header ul li#salon {
	margin-right: 1px;
}

#header ul li#salon a#active {
	background: no-repeat url(./images/header_salon_active.gif);
}

#header ul li#salon a:hover {
	background: no-repeat url(./images/header_salon.gif) 0px -60px;
}
	
/* @end */

#container {
	text-align: center;
	width: 100%;
}

#content {
	width: 740px;
	margin-right: auto;
	margin-left: auto;
	text-align: left;
	background: url(./images/body_bg.gif) repeat-x;
}

body#top #content {
	width: 800px;
	padding-top: 30px;
	border-bottom-style: none;
	background: none;

}

p {
	padding: 0;
	margin: 10px 0 0;
}

br.clear {
	clear: both;
}

a {
	color: #feb;
	text-decoration: none;
}

a:hover {
	color: #feb;
	text-decoration: underline;
}

#footer {
	font-size: 10px;
	line-height: 30px;
	padding-bottom: 20px;
	padding-top: 40px;
	text-align: center;
}

/* @group movie */

#pageimg {
	position: relative;
	top: 0;
	left: 0;
}

a#movie {
	display: block;
	top: 43px;
	right: 56px;
	height: 84px;
	width: 176px;
	text-indent: -9999px;
	position: absolute;
}
	
/* @end */

img {
	border-style: none;
}
	
/* @end */

/* @group top */

/* @group tvcm */

body#top #pageimg {
	position: relative;
	top: 0;
	left: 0;
}

body#top a#tvcm {
	display: block;
	right: 21px;
	height: 84px;
	width: 176px;
	text-indent: -9999px;
	position: absolute;
	top: 373px;
}
	
/* @end */

#sb_newr {
	display: block;
	left: 21px;
	height: 84px;
	width: 176px;
	text-indent: -9999px;
	position: absolute;
	top: 373px;
	color: gray;
}

h1#topImage {
	width: 800px;
	height: 480px;
	margin: 0;
	padding: 0;
	background: no-repeat url(./images/top_image.jpg);
}

h1#topImage a {
	text-indent: -9999px;
	display: block;
	width: 191px;
	height: 152px;
	position: relative;
	top: 306px;
	left: 305px;
}

div#menu {
	width: 800px;
	margin-top: 10px;
	text-align: center;
}

div#menu ul {
	height: 60px;
	padding: 0;
	margin: 0px;
	background: no-repeat url(./images/menu.gif);
	list-style: none;
	text-align: left;
}

div#menu ul li {
	float: left;
	display: inline;
}

div#menu ul li#about {
	margin-left: 70px;
}

div#menu ul li#about a {
	width: 153px;
	height: 60px;
	display: block;
	text-indent: -9999px;
}

div#menu ul li#about a:hover {
	background: no-repeat url(./images/menu.gif) -70px -60px;
}

div#menu ul li#howto {
	margin-left: 81px;
}

div#menu ul li#howto a {
	width: 151px;
	height: 60px;
	display: block;
	text-indent: -9999px;
}

div#menu ul li#howto a:hover {
	background: no-repeat url(./images/menu.gif) -304px -60px;
	display: block;
	text-indent: -9999px;
}

div#menu ul li#soap {
	margin-left: 67px;
}

div#menu ul li#soap a {
	width: 210px;
	height: 60px;
	display: block;
	text-indent: -9999px;
}

div#menu ul li#soap a:hover {
	background: no-repeat url(./images/menu.gif) -522px -60px;
	display: block;
	text-indent: -9999px;
}
	
/* @end */

/* @group about */

body#about_ec h2 {
	background: no-repeat url(./images/about_h2.jpg);
	width: 740px;
	height: 410px;
	text-indent: -9999px;
	margin: 0;
	padding: 0;
}

body#about_ec h3 {
	background: no-repeat url(./images/h3_about.gif);
	width: 740px;
	height: 55px;
	text-indent: -9999px;
	margin: 0;
	padding: 0;
}

body#about_ec div#r_content {
	line-height: 24px;
	width: 320px;
	font-size: 11px;
	float: right;
	margin: 0;
	padding: 0 35px 0 0;
}

body#about_ec div#l_content {
	width: 320px;
	font-size: 11px;
	float: left;
	line-height: 24px;
	margin: 0;
	padding: 0 0 0 35px;
}
	
/* @end */

/* @group howto */

body#howto_ec h2 {
	background: no-repeat url(./images/howto_h2.jpg);
	width: 740px;
	height: 410px;
	text-indent: -9999px;
	margin: 0;
	padding: 0;
}

body#howto_ec h3 {
	width: 180px;
	height: 32px;
	text-indent: -9999px;
	margin-bottom: 15px;
	margin-top: 0;
}

body#howto_ec .box {
	font-size: 11px;
	line-height: 24px;
	width: 670px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}

body#howto_ec #gosiyou, body#howto #special {
	background: none;
	padding-left: 35px;
	padding-right: 35px;
}

body#howto_ec #gosiyou {
	background: no-repeat url(./images/gosiyou_photo.jpg) 0px 100%;
}

body#howto_ec #gosiyou .box {
	padding-bottom: 195px;
	text-align: left;
}

body#howto_ec #gosiyou h3 {
	background: no-repeat url(./images/gosiyouhouhou.gif);
}

body#howto_ec #special h3 {
	background: no-repeat url(./images/special.gif);
}
	
/* @end */

/* @group soap */

body#soap_ec h2 {
	background: no-repeat url(./images/soap_h2.jpg);
	width: 740px;
	height: 410px;
	text-indent: -9999px;
	margin: 0;
	padding: 0;
}

body#soap_ec h3 {
	background: no-repeat url(./images/h3_about.gif);
	width: 740px;
	height: 55px;
	text-indent: -9999px;
	margin: 0;
	padding: 0;
}

body#soap_ec div#r_content {
	line-height: 24px;
	width: 380px;
	font-size: 11px;
	float: right;
	margin: 0;
	padding: 0 35px 0 0;
}

body#soap_ec div#l_content {
	width: 280px;
	font-size: 11px;
	float: left;
	line-height: 24px;
	margin: 0;
	padding: 0 0 0 35px;
}
	
/* @end */

/* @group salon list */

body#salon_list h2 {
	background: no-repeat url(./images/salon_h2.gif);
	width: 300px;
	height: 80px;
	text-indent: -9999px;
	padding: 0;
	margin: 0;
}

body#salon_list h3 {
	font-size: 11px;
}

body#salon_list p#senbai {
	background: no-repeat url(./images/senbai.gif);
	width: 300px;
	height: 45px;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
}

body#salon_list div#box {
	background: url(./images/eclairer.jpg) no-repeat 100% 0;
	height:480px;
	width: 100%;
}

body#salon_list div#inbox {
	padding-left: 35px;
	font-size: 11px;
	line-height: 24px;
}

body#salon_list div#l_content p {
	margin-top: 5px;
	font-size: 10px;
	line-height: 20px;
}

/* @group area menu */

ul#area {
	list-style:none;
	padding: 0;
	margin: 20px 0 0;
}

ul#area li {
	font-size: 12px;
	line-height: 28px;
	margin: 0;
	padding: 0;
}

ul#area li span {
	background: no-repeat url(./images/area_line.gif);
	font-size: 10px;
	margin: 0 0 0 7px;
	padding: 0 0 0 23px;
}

ul#area li a {
	color: #ffeebb;
	text-decoration: none;
	font-weight: bold;
	background: no-repeat url(./images/area_list.gif);
	padding-left: 12px;
	letter-spacing: 1px;
}

ul#area li a:hover {
	color: #ffeebb;
	text-decoration: underline;
}

ul#areanavi {
	list-style: none;
	margin: 0;
	padding: 0 0 0 25px;
}

ul#areanavi li {
	font-size: 12px;
	float: left;
	margin-left: 10px;
	padding: 0;
}

ul#areanavi li a {
	color: #ffeebb;
	text-decoration: none;
	background: no-repeat url(./images/area_list.gif);
	padding-left: 8px;
}

ul#areanavi li a.active {
	color: #f4d400;
	font-weight: bold;
	background: no-repeat url(./images/area_list_navi.gif);
}

ul#areanavi li a:hover {
	color: #ffeebb;
	text-decoration: underline;
}
	
/* @end */

/* @group area */

div#wrap {
	font-size: 11px;
	clear: both;
	padding: 20px 35px 0;
	margin: 0;
}

div#salonList1_2 {
	width: 446px;
	float: left;
}

div#salonList1 {
	width: 223px;
	float: left;
}

div#salonList2 {
	width: 223px;
	float: right;
}

div.continue {
	padding-top: 50px;
}

div#salonList3 {
	width: 223px;
	float: right;
}

div#wrap div h3 {
	background: no-repeat url(./images/h3_salon_list.gif);
	height: 30px;
	font-size: 12px;
	line-height: 28px;
	letter-spacing: 2px;
	margin-top: 20px;
}

div#salonList1 h3 {
	margin-right: 20px;
}

div#salonList2 h3 {
	margin-right: 10px;
	margin-left: 10px;
}

div#salonList3 h3 {
	margin-right: 0;
	margin-left: 20px;
}

div#salonList1 div {
	margin-right: 20px;
}

div#salonList1 div.salon_name, div#salonList2 div.salon_name, div#salonList3 div.salon_name {
	font-size: 12px;
	font-weight: bold;
	margin-top: 15px;
	margin-bottom: 5px;
	color: #ebdb80;
}

div#salonList1 div.salon_info, div#salonList2 div.salon_info, div#salonList3 div.salon_info {
	line-height: 15px;
	font-size: 10px;
}

div#salonList1 div {
	margin: 0 20px 0 0;
}

div#salonList2 div {
	margin: 0 10px;
}

div#salonList3 div {
	margin: 0 0 0 20px;
}
	
/* @end */
	
/* @end */

/* @group tvcm */

body#tvcm {
	background: none #8b0e15;
}

#tvcm div#close {
	margin-top: 20px;
	padding-right: 20px;
	text-align: right;
}

#tvcm div#container {
	padding-top: 20px;
}
	
/* @end */