@charset "UTF-8";
/* thesalon.jp top.css */


body {
	position: relative;
	background: #fff;
	color: #333;
}

/*----------------------------------------
	a
----------------------------------------*/

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

::-moz-selection{
	background: #333;
	color: #fff;
}

::selection{
	background: #333;
	color: #fff;
}

/*----------------------------------------
	float clearfix
----------------------------------------*/

ul#menu,
ul#footerMenu {
    zoom: 1;/*for IE 5.5-7*/
}

ul#menu:after,
ul#footerMenu:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/*----------------------------------------
	layout
----------------------------------------*/

div#page {
	position: relative;
	margin: 0 auto;
	width: 960px;
}

div#headerTop {
	margin: 0 0 250px;
	padding: 121px 0 0 23px;
	width: 500px;
}

div#contentsTop {
	padding: 0 0 0 30px;
	height: 145px;
}

div#footerTop {
	margin: 50px 0 100px 712px;
	clear: both;
	width: 248px;
}

/*----------------------------------------
	header 
----------------------------------------*/

h1 {
	margin: 0 0 26px 7px;
	width: 322px;
	height: 65px;
}

	h1 a {
		display: block;
		width: 322px;
		height: 65px;
		background: url(../../img/thesalon/menu.gif);
		background-position: 580px 171px;
		text-decoration: none;
		text-indent: -9999px;
		outline: none;
	}

/*----------------------------------------
	contents
----------------------------------------*/

ul#menu {
	width: 530px;
}

ul#menu li {
	display: block;
	float: left;
	height: 19px;
}

	ul#menu li#menuTopics { width: 45px; }
	ul#menu li#menuInfo { width: 86px; }
	ul#menu li#menuPhilosophy { width: 69px; }
	ul#menu li#menuCca { width: 168px; }
	ul#menu li#menuWork { width: 82px; }
	ul#menu li#menuContact { width: 52px; }

ul#menu li a {
	display: block;
	height: 19px;
	background: url(../../img/thesalon/menu.gif);
	text-indent: -9999px;
	text-decoration: none;
	outline: none;
}

	ul#menu li#menuTopics a{ width: 45px; background-position: 546px 94px; }
	ul#menu li#menuInfo a{ width: 86px; background-position: 501px 94px; }
	ul#menu li#menuPhilosophy a{ width: 69px; background-position: 415px 94px; }
	ul#menu li#menuCca a{ width: 168px; background-position: 346px 94px; }
	ul#menu li#menuWork a{ width: 82px; background-position: 178px 94px; }
	ul#menu li#menuContact a{ width: 52px; background-position: 96px 94px; }
	
ul#menu li a:hover {
	text-decoration: none;
}

	ul#menu li#menuTopics a:hover { background-position: 546px 64px; }
	ul#menu li#menuInfo a:hover { background-position: 501px 64px; }
	ul#menu li#menuPhilosophy a:hover { background-position: 415px 64px; }
	ul#menu li#menuCca a:hover { background-position: 346px 64px; }
	ul#menu li#menuWork a:hover { background-position: 178px 64px; }
	ul#menu li#menuContact a:hover { background-position: 96px 64px;}
	
p#thesalonTopImage {
	position: absolute;
	top: 40px; right: 0;
	width: 410px;
	height: 562px;
}

div#topInfo dl dt,
div#topInfo dl dd {
	display: inline;
	font-size: 10px;
	font-family: "Times New Roman", Times, serif;
	font-style: italic;
	line-height:1.7;
}

div#twitter dl dt,
div#twitter dl dd,
div#facebook dl dt,
div#facebook dl dd,
div#tumblr dl dt,
div#tumblr dl dd {
	font-size: 10px;
	font-family: "Times New Roman", Times, serif;
	line-height:1.3;
}

div#twitter dl dt {
	padding: 30px 0px 3px 0px;
}

div#facebook dl dt {
	padding: 12px 0px 3px 0px;
}

div#tumblr dl dt {
	padding: 12px 0px 3px 0px;
}

div#twitter dl dd a,
div#facebook dl dd a,
div#tumblr dl dd a{
	text-decoration: none;
	}

div#twitter dl dt a {
	display: block;
	width: 70px;
	height: 16px;
	background: url(/common/img/thesalon/twitter.gif) 0px 0px;
	text-indent: -9999px;
	text-decoration: none;
	outline: none;
	}
	
div#tumblr dl dt a{
	padding-left: 76px;
	display: block;
	width: 150px;
	height: 16px;
	background: url(/common/img/thesalon/tumblr.gif) 0px 0px no-repeat;
	text-decoration: none;
	outline: none;
	font-weight: bold;
	font-size: 12px;
	line-height: 150%;
	color: #777;
	}
	
div#facebook dl dt a{
	display: block;
	width: 66px;
	height: 16px;
	background: url(/common/img/thesalon/facebook.gif) 0px 0px;
	text-indent: -9999px;
	text-decoration: none;
	outline: none;
	}
	
div#twitter dl dt a:hover,
div#facebook dl dt a:hover,
div#tumblr dl dt a:hover{
	background-position: 0px -16px;
	text-decoration: none;
	color: #aaa;
	}

/*----------------------------------------
	footer
----------------------------------------*/

ul#footerMenu {
	margin: 0 0 4px;
	width: 248px;
	height: 25px;
	border-bottom: 1px solid #333;
}

ul#footerMenu li#footerMenuThemagazine {
	float: left;
	width: 167px;
	height: 25px;
}

	ul#footerMenu li#footerMenuThemagazine a{
		display: block;
		width: 153px;
		height: 25px;
		background: url(../../img/thesalon/menu_footer.gif);
		background-position: 305px 50px;
		text-indent: -9999px;
		text-decoration: none;
		outline: none;
	}
	
	ul#footerMenu li#footerMenuThemagazine a:hover{
		background-position: 305px 25px;
		text-decoration: none;
	}

ul#footerMenu li#footerMenuThenews {
	float: left;
	width: 81px;
	height: 25px;
}

	ul#footerMenu li#footerMenuThenews a{
		display: block;
		width: 81px;
		height: 25px;
		background: url(../../img/thesalon/menu_footer.gif);
		background-position: 138px 50px;
		text-indent: -9999px;
		text-decoration: none;
		outline: none;
	}
	
	ul#footerMenu li#footerMenuThenews a:hover{
		background-position: 138px 25px;
		text-decoration: none;
	}

p#footerContact {
	margin: 0 0 18px 212px;
	width: 36px;
	height: 18px;
}

	p#footerContact a{
		display: block;
		width: 36px;
		height: 18px;
		background: url(../../img/thesalon/menu_footer.gif);
		background-position: 39px 43px;
		text-indent: -9999px;
		text-decoration: none;
		outline: none;
	}
	
	p#footerContact a:hover{
		background-position: 39px 18px;
		text-decoration: none;
	}

address {
	display: block;
	margin: 0 0 0 59px;
	width: 189px;
	height: 11px;
	text-indent: -9999px;
	background: url(../../img/thesalon/copyright.gif) no-repeat;
}