@charset "UTF-8";
/* basic.css */

/*** main wrapper ***/
body  {
	font: 100% 'MS PGothic', 'MS UI Gothic', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', osaka, sans-serif;
	margin: 0;
	padding: 0;
	text-align: center;
	color:#3F3131;
	line-height:180%;
	letter-spacing:0.1em;
	background:url(../images/bg_fade.gif) top repeat-x #E9EDDA fixed;
	vertical-align:bottom;
}

h1,h2,h3,h4,h5,p,ul,li,dl,dd,dt,strong{margin:0px; padding:0px;}
a{color:#176990; text-decoration:none;}
a:visited{color:#6256A8;}
a:hover{text-decoration:underline;}


.f01{background:fixed url(../images/flowers01.png) 150% 60px repeat-x;}
.f02{background:fixed url(../images/flowers02.png) 300% 130px repeat-x;}
.f03{background:fixed url(../images/flowers03.png) 90% 90px repeat-x;}

.twoCol #container{
	margin:0 auto;
	padding:0;
	width:850px;
	text-align:left;
	background:url(../images/bg_filter.png) repeat-y;
	}
	
.twoCol #innerWrapper{
	margin:0 auto;
	width:770px;
	border-left:1px solid #592B2C;
	border-right:1px solid #592B2C;
	background-color:#FFFFFF;
	}		
	
.twoCol #leftCol{
	float:left;
	width:189px;
	background-color:#FFFFFF;
	}
	
.twoCol #rightCol{
	float:left;
	width:579px;
	background-color:#FFFFFF;
	}
	
#footer{
	margin-top:25px;
	padding:15px 0;
	width:100%;
	border-top:1px dotted #CCCCCC;
	text-align:center;
	}
	
	

/*** leftCol ***/
#logo{
	height:150px;
	background:url(../images/logo01.gif) 20px 30px no-repeat;
	}

#logo a.logo_area{
	display:block;
	position:relative;
	top: 35px;
	left: 35px;
	height:100px;
	width:160px;
	}

/* menu */
#menu{
	margin-left:65px;
	line-height:0em;
	}
#menu ul.menulist li a{background:url(../images/menu_normal.gif) 0 0 no-repeat;}
#menu ul.menulist li a:hover,
#menu ul.menulist li a:active,
#menu ul.menulist li a:focus{background:url(../images/menu_mouseover.gif) 0 0 no-repeat;}
#menu ul.menulist li strong a,
#menu ul.menulist li strong a:hover{background:url(../images/menu_selelcted.gif) 0 0 no-repeat;}	
#menu ul.menulist li{list-style-type:none;}
#menu ul.menulist li a{
	display:block;
	position:relative;
	left:-35px;
	height:50px;
	width:145px;}
	
/*#menu ul.menulist li strong a{
	display:block;
	position:relative;
	left:-35px;
	height:50px;
	width:145px;}*/


#menu ul.menulist li a.menuTop{background-position:0 0;}
#menu ul.menulist li a.menuConcept,#menu ul.menulist li strong a.menuConcept:hover{background-position:0 -50px;}
#menu ul.menulist li a.menuStaff,#menu ul.menulist li strong a.menuStaff:hover{background-position:0 -100px;}
#menu ul.menulist li a.menuMenu,#menu ul.menulist li strong a.menuMenu:hover{background-position:0 -150px;}
#menu ul.menulist li a.menuStyle,#menu ul.menulist li strong a.menuStyle:hover{background-position:0 -200px;}
#menu ul.menulist li a.menuGallery,#menu ul.menulist li strong a.menuGallery:hover{background-position:0 -250px;}
#menu ul.menulist li a.menuLinks,#menu ul.menulist li strong a.menuLinks:hover{background-position:0 -300px;}
#menu ul.menulist li a.menuAccess,#menu ul.menulist li strong a.menuAccess:hover{background-position:0 -352px;}

/*** banner_area ***/
#bn_area{
	line-height:10px;
	margin:0 20px 0 0;
	text-align:right;
	}
	
#bn_area div{margin:10px 0 0 0;}

/*** rightCol ***/
#copy{
	margin:70px 0 30px 30px;
	height:52px;	
	}
	
/* h2 title */	
#copy .h2_Concept{height:40px; background:url(../images/title_contents.gif) 0 5px no-repeat;}
#copy .h2_Staff{height:40px; background:url(../images/title_contents.gif) 0 -31px no-repeat;}
#copy .h2_Menu{height:40px; background:url(../images/title_contents.gif) 0 -69px no-repeat;}
#copy .h2_Style{height:40px; background:url(../images/title_contents.gif) 0 -105px no-repeat;}
#copy .h2_Gallery{height:40px; background:url(../images/title_contents.gif) 0 -141px no-repeat;}
#copy .h2_Links{height:40px; background:url(../images/title_contents.gif) 0 -177px no-repeat;}
#copy .h2_Access{height:40px; background:url(../images/title_contents.gif) 0 -215px no-repeat;}
#copy .h2_Privacy{height:40px; background:url(../images/title_contents.gif) 0 -250px no-repeat;}


#mainphoto{
	position:relative;
	top:0;
	left:2px;
	width:579px;
	}
	
.Top #mainphoto{height:305px; background:url(../images/img_top.jpg) 0 0 no-repeat;}
.Concept #mainphoto{height:387px; background:url(../images/img_concept.jpg) 0 0 no-repeat;}
.Menu #mainphoto{height:150px; background:url(../images/image_menu.jpg) 0 0 no-repeat;}

/* news */
#news{
	margin:30px 0 0 0;
	}
#news .logo{
	height:32px;
	background:url(../images/title_top.gif) 0 0 no-repeat;
	}
#news ul{
	margin:15px 40px 0 33px;
	font-size:0.85em;
	list-style-image:url(../images/dot.gif);
	}
.news_date{
	font-size:0.80em;
	}

/* about refuge */
#about_ref{margin:30px 0 20px 0;}
#about_ref .logo{
	height:32px;
	background:url(../images/title_top.gif) 0 -40px no-repeat;
	}
#about_ref h3{
	margin:15px 0 0 33px;
	font-weight:bold;
	font-size:0.85em;
	}
#about_ref dl{
	margin:0 0 0 33px;
	font-size:0.85em;}
#about_ref dt{
	float:left;
	width:80px;
	color:#918D8D;	
	}
#about_ref dd{margin-left:20px;}


/* motto */
#motto{margin:30px 33px ;}
#motto p{font-size:0.85em;}


/* staff */
#staff01, #staff02, #staff03, #staff04, #staff05{
	clear:left;
	display:block;
	position:relative;
	margin:60px 0 0 0;
	padding-bottom:60px;
	border-top:1px solid #53200c;
	font-size:0.85em;
	}

#staff .s_photo{
	display:block;
	position:absolute;
	width:200px;
	height:170px;
	background:url(../images/img_staff.jpg) 0 0 no-repeat;
	top:-31px;
	left:20px;
	}
#staff01 .s_photo{background-position:0 0;}
#staff02 .s_photo{background-position:-200px 0;}
#staff03 .s_photo{background-position:-800px 0;}
#staff04 .s_photo{background-position:-400px 0;}
#staff05 .s_photo{background-position:-600px 0;}

#staff .s_name{
	display:block;
	position:absolute;
	width:359px;
	height:49px;
	background:url(../images/img_staffname.jpg) 0 0 no-repeat;
	top:-31px;
	right:-2px;
	}
#staff01 .s_name{background-position:0 0;}
#staff02 .s_name{background-position:0 -50px;}
#staff03 .s_name{background-position:0 -200px;}
#staff04 .s_name{background-position:0 -100px;}
#staff05 .s_name{background-position:0 -150px;}

#staff .intro{margin:40px 30px 0px 250px;}
#staff .catch{
	float:left;
	margin:160px 0 60px 33px;
	width:180px;
	font-weight:bold;
	color:#567616;
	}
#staff dl{margin:0;}
#staff dt{
	float:left;
    color:#567616;
	}
#staff dt.nf{float:none;}

/* menu */
#cut,#perm,#color,#esthe{
	position:relative;
	margin:30px 0 0 0;
	}

#cut .logo{
	height:32px;
	background:url(../images/title_top.gif) 0 -80px no-repeat;
	}
#perm .logo{
	height:32px;
	background:url(../images/title_top.gif) 0 -120px no-repeat;
	}
#color .logo{
	height:32px;
	background:url(../images/title_top.gif) 0 -160px no-repeat;
	}
#esthe .logo{
	height:32px;
	background:url(../images/title_top.gif) 0 -200px no-repeat;
	}			

.Menu .menu_list{
	margin:15px 40px 0 33px;
	font-size:0.85em;
	list-style-image:url(../images/dot.gif);
	}

.menu_list img{vertical-align:middle;}
.price{
		position:absolute;
		width:100px;
		left:400px;}
.price img{
		position:absolute;
		right:-50px;
		}

/*** links ***/
.Links dl{
		margin:0 40px 0 33px;
		font-size:0.85em;
		}	
		
.Links dt{ font-weight:bold;}
.Links dd{ margin:0 0 2em 0;}

/*** gallery ***/
.Gallery #sum{
	position:relative;
	top:0;
	left:2px;
	width:579px;
	text-align:center;
	}

.Gallery #sum div{ margin:0 0 10px 0;}

.Gallery #sum img{
	margin:0 10px 0 0;
	border:none;
	}
		
.Gallery #sum img.right{ margin:0 0 0 0;}

.Gallery p{font-size:0.80em;}

/*** style ***/
.Style{
	text-align:center;
	}

.Style img{
	margin-bottom:10px;
	border:1px solid #e3e3e3;
	}

.Style p{
	margin:10px 0;
	font-size:0.80em;
	}

.stylePh img:hover{
	border-left:1px solid #4a1402;
	}


/*** access ***/
#access_info{
	position:relative;
	top:0;
	left:2px;
	width:579px;
	background:url(../images/img_gallery01.jpg) 279px 0 no-repeat;
	}

.b_hours{
	position:relative;
	width:350px;
	margin:0 0 0 33px;
	border:none;
	font-size:0.85em;
	vertical-align:top;
	text-align:justify;
	}
.b_hours dt{
	color:#567616;
	font-weight:bold;
	}

#access_info .c_box{margin:0 0 0 33px;}

.Access h3{
	margin:0 0 1em 33px;
	font-weight:bold;
	font-size:0.85em;
	}
	
.Access h4{
	font-size:0.85em;
	color:#567616;
	font-weight:bold;	
	}

.c_box p, .c_box table{ font-size:0.85em;}

.h_calender{
	margin:1.0em 0 0 0;
	width:579px;
	}

.h_calender div{float:left;}
.h_calender div.plt{margin-right:19px;}	
.h_calender table{
	width:160px;
	text-align:center;
	border-collapse:collapse;
	border:1px solid #CCCCCC;
	}
.h_calender table th{background:#FFFFFF;}
.h_calender table th.sun{color:#E1627F;}
.h_calender table th.sat{color:#3366CC;}
.h_calender table td.holiday{background:#FFCCCC;}
	
#access_info .pl{ margin:2.0em 0 0 0;}
.wd{
	position:absolute;
	right:0;
	width:200px;
	}
.address{
	margin:2.0em 0 0 33px;}

.address dt{
	color:#567616;
	font-weight:bold;
	}
	
.address dl{font-size:0.85em;}
.map{
	margin:10px 0 0 0;
	text-align:left;
	}

/*** privacy policy ***/
.Privacy p{
	margin:0 33px 3em 33px;
	font-size:0.85em;
	}
.Privacy ul{
	margin:0 33px 3em 50px;
	font-size:0.85em;
	}

.Privacy h3{
	margin:0 0 1em 33px;
	font-weight:bold;
	font-size:0.85em;
	color:#567616;
	}


/*** footer ***/
#footer address{
	font-size:0.7em;
	color:#999999;
	font-style:normal;
	}

#footer a{
	text-decoration:underline;
	}

		
/*** space ***/
#main .s1p{margin-top:1.5em;}	

/*** skip ***/
#main .skip{
	display:none;
	text-indent:-9999px;
	overflow:hidden;
	}
	
	
/*** clearfloat ***/
.clearfloat { 
	clear:both;
    height:0;
    font-size: 1psx;
    line-height: 0px;
}













.twoColFixLt #container { 
	width: 780px;  /* 最大幅である 800px より 20px 小さくすることにより、ブラウザクロームの使用が可能となり、水平スクロールバーが表示されなくなります */
	background: #FFFFFF;
	margin: 0 auto; /* 自動マージン（幅と連動）により、ページが中央揃えになります */
	border: 1px solid #000000;
	text-align: left; /* この設定は body エレメントの text-align: center より優先されます。 */
}
.twoColFixLt #sidebar1 {
	float: left; /* このエレメントはフローティングエレメントであるため、幅が設定されている必要があります */
	width: 200px; /* 標準に準拠したブラウザまたは Internet Explorer の標準モードでは、この div の実際の幅には、幅に加えて余白と境界線も含まれます */
	background: #EBEBEB; /* 背景色は、列内のコンテンツの長さにわたって表示されます */
	padding: 15px 10px 15px 20px;
}
.twoColFixLt #mainContent { 
	margin: 0 0 0 250px; /* この div エレメントの左マージンにより、ページの左側に #sidebar1 div が設定されます。#sidebar1 div に含まれるコンテンツの量に関係なく、#sidebar1 div のスペースは維持されます。#sidebar1 のコンテンツが終了した後のスペースに #mainContent div のテキストを挿入するには、このマージンを削除します。 */
	padding: 0 20px 20px; /* 余白は div ボックスの内側のスペース、マージンは div ボックスの外側のスペースです */
} 
.fltrt { /* このクラスは、ページ上でフローティングエレメントを右側に配置するのに使用できます。プローティングエレメントは、ページ上でその横に配置されるエレメントの前に配置される必要があります。 */
	float: right;
	margin-left: 8px;
}
.fltlft { /* このクラスは、ページ上でフローティングエレメントを左側に配置するのに使用できます */
	float: left;
	margin-right: 8px;
}

 
</style>[if IE 5]>
<style type="text/css"> 
/* この条件分岐コメントに IE 5* を対象とした css ボックスモデルのフィックスを配置します */
.twoColFixLt #sidebar1 { width: 230px; }
</style>
<![endif][if IE]>
<style type="text/css"> 
/* この条件分岐コメントにすべてのバージョンの IE を対象とした css のフィックスを配置します */
.twoColFixLt #sidebar1 { padding-top: 30px; }
.twoColFixLt #mainContent { zoom: 1; }
/* 上述の専用のズームプロパティにより、いくつかのバグを回避するのに必要な hasLayout が IE に対して設定されます */
</style>
<![endif]



/*** for IE6 ***/
* html .twoCol #container{
	margin:0 auto;
	padding:0;
	width:850px;
	text-align:left;
	background:url(../images/bg_filter.png) repeat-y;
	}
	
* html .twoCol #innerWrapper{
	margin:0 auto;
	width:773px;
	border-left:1px solid #592B2C;
	border-right:1px solid #592B2C;
	background-color:#FFFFFF;
	}		
	
* html .twoCol #leftCol{
	float:left;
	width:189px;
	background-color:#FFFFFF;
	}
	
* html .twoCol #rightCol{
	float:none;
	width:579px;
	background-color:#FFFFFF;
	}
	
* html #menu{
	margin-left:0px;
	padding-left:0px;
	line-height:0em;
	}

* html #menu ul, * html #menu li{
	margin:0;
	padding:0;
	}

* html #menu ul.menulist li a{
	display:block;
	position:relative;
	left:35px;
	height:50px;
	width:189px;}
	
* html #menu ul.menulist li a.menuConcept:hover{background-position:0 -50px;}
* html #menu ul.menulist li a.menuStaff:hover{background-position:0 -100px;}
* html #menu ul.menulist li a.menuMenu:hover{background-position:0 -150px;}
* html #menu ul.menulist li a.menuStyle:hover{background-position:0 -200px;}
* html #menu ul.menulist li a.menuGallery:hover{background-position:0 -250px;}
* html #menu ul.menulist li a.menuLinks:hover{background-position:0 -300px;}
* html #menu ul.menulist li a.menuAccess:hover{background-position:0 -352px;}

* html .h_calender{
	margin:1.0em 0 0 0;
	width:579px;
	width:auto;
	}
	
	
* html #staff01, #staff02, #staff03, #staff04, #staff05{
	clear:left;
	display:block;
	position:relative;
	margin:60px 0 0px 0;
	border-top:1px solid #53200c;
	font-size:0.85em;
	}

* html #staff .s_photo{
	display:block;
	position:absolute;
	width:200px;
	height:170px;
	background:url(../images/img_staff.jpg) 0 0 no-repeat;
	top:-30px;
	left:-190px;
	}
* html #staff01 .s_photo{background-position:0 0;}
* html #staff02 .s_photo{background-position:-200px 0;}
* html #staff03 .s_photo{background-position:-800px 0;}
* html #staff04 .s_photo{background-position:-400px 0;}
* html #staff05 .s_photo{background-position:-600px 0;}

* html #staff .s_name{
	display:block;
	position:absolute;
	width:359px;
	height:49px;
	background:url(../images/img_staffname.gif) 0 0 no-repeat;
	top:-30px;
	right:-2px;
	}
* html #staff05 .s_name{
	display:block;
	position:absolute;
	width:359px;
	height:49px;
	background:url(../images/img_staffname.gif) 0 0 no-repeat;
	top:-30px;
	right:208px;
	}
* html #staff01 .s_name{background-position:0 0;}
* html #staff02 .s_name{background-position:0 -50px;}
* html #staff03 .s_name{background-position:0 -200px;}
* html #staff04 .s_name{background-position:0 -100px;}
* html #staff05 .s_name{background-position:0 -150px;}

* html #staff .intro{margin:40px 30px 30px 250px;}
* html #staff .catch{
	float:left;
	margin:160px 0 60px 15px;
	width:180px;
	font-weight:bold;
	color:#567616;
	}