@charset "utf-8";

@import "../../../share/css/base.css";

/* --- base layout --- */
body {
	background-color: #000;
}

#top {
	margin: 0 auto;
	width: 750px;
	background-color: #000;
	position: relative;
}

#header {
}


#contents {
}

#contents .contents_left {
	float: left;
	width: 258px;
}

#contents .contents_right {
	float: right;
	width: 492px;
}

#footer {
	clear: both;
	width: 700px;
	margin: 0 auto;
}

/* --- header --- */
#top_btn {
	width: 20px;
	height: 150px;
	position: absolute;
	top: 0;
	left: 750px;
}

#top_btn li a {
	display: block;
	width: 20px;
	height: 150px;
	background: url(../../images/top_btn.png) 0 0 no-repeat;
	text-indent: -5000em;
	overflow: hidden;
}

#index #header h1 {
	width: 750px;
	height: 354px;
	background: url(../images/sa08_01.jpg) 0 0 no-repeat;
	text-indent: -5000em;
}


/* --- contents --- */
/*トップ*/
#index #contents .contents_left h2 {
	width: 258px;
	height: 359px;
	background: url(../images/sa08_02.jpg) 0 0 no-repeat;
	text-indent: -5000em;
}

#index #contents .contents_left p {
	text-indent: -5000em;
}

#index #contents .contents_right p {
	width: 492px;
	height: 147px;
	background: url(../images/sa08_03.jpg) 0 0 no-repeat;
	text-indent: -5000em;
}

#index #contents .contents_right ul {
	padding-left: 15px;
}

#index #contents .contents_right ul li {
	float: left;
	width: 205px;
	height: 202px;
	padding-right: 30px;
}

#index #contents .contents_right ul li a {
	display: block;
	width: 205px;
	height: 202px;
	border: 1px solid #000;
	text-indent: -5000em;
	overflow: hidden;
}

#index #contents .contents_right ul li a:hover,
#index #contents .contents_right ul li a:active {
	border: 1px solid #fff;
}

#index #contents .contents_right ul li#winding a {
	background: url(../images/sa08_04.jpg) 0 0 no-repeat;
}

#index #contents .contents_right ul li#stylist a {
	background: url(../images/sa08_05.jpg) 0 0 no-repeat;
}

/*スタイリスト*/
#stylist #header h1 {
	width: 750px;
	height: 226px;
	background: url(../images/sa08_08.jpg) 0 0 no-repeat;
	text-indent: -5000em;
}

#stylist #contents #main {
	margin-bottom: 15px;
	padding: 0 30px;
	background: url(../images/sa08_09.jpg) 0 0 no-repeat;
	overflow: hidden;
}

#stylist #contents #main h2 {
	width: 699px;
	height: 59px;
	margin-bottom: 15px;
	background: url(../images/sa08_10.jpg) 0 10px no-repeat;
	text-indent: -5000em;
}

#stylist #contents #main .msg {
	float: right;
	width: 280px;
	color: #fff;
	text-align: left;
	letter-spacing: -1px;
}

#stylist #contents #main .photo_area {
	float: left;
	width: 386px;
	padding-left: 5px;
}

#stylist #contents #main .photo_area img {
	padding-right: 10px;
}

#stylist #contents #main .rank_area {
	width: 679px;
	margin-top:15px;
	padding: 20px 0;
	background-color: #ebe4da;
}

#stylist #contents #main .rank_area ul.rank2 {
	margin-top: 15px;
}

#stylist #contents #main .rank_area ul li {
	display: inline;
	width: 130px;
	padding: 0 3px;
}

/*ワインディング*/
#winding #header h1 {
	width: 750px;
	height: 226px;
	background: url(../images/sa08_23.jpg) 0 0 no-repeat;
	text-indent: -5000em;
}

#winding #contents #main {
	margin-bottom: 15px;
	padding: 0 30px;
	background: url(../images/sa08_24.jpg) 0 0 no-repeat;
	overflow: hidden;
}

#winding #contents #main h2 {
	width: 699px;
	height: 59px;
	margin-bottom: 15px;
	background: url(../images/sa08_25.jpg) 0 10px no-repeat;
	text-indent: -5000em;
}

#winding #contents #main .msg {
	float: right;
	width: 280px;
	padding-top: 20px;
	color: #fff;
	text-align: left;
	letter-spacing: -1px;
}

#winding #contents #main .photo_area {
	float: left;
	width: 386px;
	padding-left: 5px;
}

#winding #contents #main .photo_area img {
	padding-right: 10px;
}

#winding #contents #main .rank_area {
	width: 679px;
	margin-top:15px;
	padding: 20px 0;
	background-color: #ebe4da;
}

#winding #contents #main .rank_area ul li {
	display: inline;
	width: 130px;
	padding: 0 3px;
}

/*共通*/
#contents h3 {
	clear: both;
}

#contents .section {
	margin-bottom: 10px;
	overflow: hidden;
}

#contents #navi {
	padding: 15px 0 15px 200px;
}

#contents #navi li {
	float: left;
	width: 219px;
	height: 78px;
	margin-left: 20px;
}

#contents #navi li a {
	display: block;
	width: 217px;
	height: 76px;
	border: 1px solid #000;
	text-indent: -5000em;
	overflow: hidden;
}

#contents #navi li a:hover,
#contents #navi li a:active {
	border: 1px solid #fff;
}

#contents #navi li#top_page a {
	background: url(../images/sa08_21.jpg) 0 0 no-repeat;
}

#contents #navi li#winding a {
	background: url(../images/sa08_22.jpg) 0 0 no-repeat;
}

#contents #navi li#stylist a {
	background: url(../images/sa08_33.jpg) 0 0 no-repeat;
}

/* --- footer --- */
#footer {
	border-top: 1px solid #666;
}

#footer ul {
	float: left;
	width: 97px;
	padding: 10px 0;
}

#footer ul li {
	width: 97px;
}

#footer ul li a {
	display: block;
	width: 97px;
	height: 36px;
	background: url(../images/sa08_06.gif) 0 0 no-repeat;
	text-indent: -5000em;
	overflow: hidden;
}

#footer p {
	float: left;
	width: 244px;
	height: 11px;
	margin: 33px 0 0 15px;;
	background: url(../images/sa08_07.gif) 0 0 no-repeat;
	text-indent: -5000em;
}