@charset "utf-8";
/* CSS Document */


/*-------------------------------

font body 全般

-------------------------------*/

/* IE */
@font-face {
	font-family:tenderness;
	src:url(../font/tenderness.otf);
}
/* Firefox, Opera, Safari */
@font-face {
	font-family:tenderness;
	src: url(../font/tenderness.otf) format("truetype");
}


body{
 background-image: url(../images/hp/b3.png);
	background-repeat:repeat;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#663300;/* 焦げ茶色 */
	/*color:#996633;/* 薄茶色 */
	text-align:center;/* 中央 */
} 

#drop{
	width:980px;
	background-image:url(../images/hp/drop.png);
	background-repeat:repeat-y;
	background-position:top;
		margin-left:auto;/* 中央 */
	margin-right:auto;/* 中央 */
		height:auto;
}

header,nav,ul,li,article,aside,section,footer{
display:block; 
}


#container{
	margin-left:auto;/* 中央 */
	margin-right:auto;/* 中央 */
	width:960px;/* 中央 */
	height:auto;
	text-align:left;/* 中央 */
	 background-image: url(../images/hp/b1.png);
}




/*-------------------------------

 Span系　文字装飾とか

-------------------------------*/

.komoji{
	font-size:9px;
}
.komoji2{
	font-size:10px;
}

/*-------------------------------

 header用

-------------------------------*/

header{
	width:960px;
	height:170px;
	/*background-image:url(../images/hp/header.png);*/
	position: relative;
	margin-bottom:30px;
}

#logo{
	top:25px;
	left:10px;
	position: absolute;
	z-index:0;
	float:left;
}

#yoyaku{
	top:80px;
	left:700px;
	position: absolute;
}

h1{
	top:80px;
	left:286px;
	position: absolute;
	line-height:30px;
}

#leaf{
	top:10px;
	left:830px;
	position: absolute;
	z-index:300;
}





/*-------------------------------

 navi 用

-------------------------------*/

nav{
	position:absolute;
 margin-top:-70px;
	margin-left:250px;
	/*width:710px;
	height:70px;
	top: 172px;*/
	text-align: center;
	z-index:999;

}

nav ul {
 font-size:21px;
	font-weight:bold;
 font-family:tenderness;
}

nav ul li {
	width:130px;
	height:70px;
	line-height:70px;
	display:inline-block;
 *display: inline;
	*zoom: 1;
}

nav a{
	width:130px;
	height:70px;
	line-height:70px;
	color:#630;
 background-position:center;
	display:inline-block;
}

.on{
	color:#663300;
	text-align:center;
	background-image:url(../images/hp/hasami.png);
 background-repeat:no-repeat;
	background-position:center;
}


/*-------------------------------

contens 用

-------------------------------*/

article{
	display:block;
}

#main_content{
	width:740px;
	height:auto;
	float:left;
	margin:0px 5px 0px 5px;
	_margin:0px 2px 0px 2px;
	/*background-color:#CCC; 見えやすいように記載　*/
}


/*------------------------------

 side 用

-------------------------------*/

aside{
	width:200px;
	min-height:1000px;
	float:left;
	font-size:14px;
	margin:0px 5px 0px 5px;
	_margin:0px 2px 0px 2px;
}

.s_top{
	margin:0px 0px 10px 0px; 
}

.s_map{
	margin:0px 0px 0px 0px;
}

.s_blog{
	margin:20px 0px 7px 0px;
}

.s_coupon{
	margin:0px 0px 6px 0px;
}

.s_la_casta{
	margin:0px 0px 6px 0px;
}

aside .social_area i{
	font-size: 26pt;
	margin: 0 10px 0 10px;
}

aside .social_area a.social_icon{
	font-size: 26pt;
	color:#663300;
}
aside .social_area a.social_icon:hover{
	font-size: 26pt;
	color:#900;
}

/*------------------------------

 footer 用

-------------------------------*/

footer{
	width:960px;
	height:169px;
	text-align:center;
	color:#fff;
	 	position: relative;
			background-image:url(../images/hp/b1.png);
		
}

footer img{
		height:169px;
		margin:0px 0px -40px 0px;
}

footer ul {
	text-align:center;
}
footer ul#footer_navi {
	margin:-10px 0px 4px 0px;
}
footer ul#footer_navi li {
	display:inline;
}
footer ul#footer_navi li a {
	color:#fff;
	text-decoration: none;}
footer ul#footer_navi li a:hover {
	text-shadow: 0px 0px 3px #fff;
	color:#fff;
}


/*------------------------------

hover 用

-------------------------------*/

aside a img{
background:none!important;
			-moz-transition-duration:1s;
			-webkit-transition-duration:1s;
			-o-transition-duration:1s;
			-ms-transition-duration:1s;
			-moz-transition-timing-function:ease-in-out;
			-webkit-transition-timing-function:ease-in-out;
			-o-transition-timing-function:ease-in-out;
			-ms-transition-timing-function:ease-in-out;
}
 
aside a:hover img {
opacity:0.5;
 Filter: Alpha(Opacity=50);opacity:.50;
 filter:alpha(opacity=50);
 -ms-filter: "alpha( opacity=40 )";
background:none!important;
			-moz-transition-duration:1s;
			-webkit-transition-duration:1s;
			-o-transition-duration:1s;
			-ms-transition-duration:1s;
			-moz-transition-timing-function:ease-in-out;
			-webkit-transition-timing-function:ease-in-out;
			-o-transition-timing-function:ease-in-out;
			-ms-transition-timing-function:ease-in-out;
}


nav a:hover{
	color: #900;
	text-align:center;
	background-image:url(../images/hp/hasami.png);
 background-repeat:no-repeat;
	background-position:center;
}

/*-------------------------------

dasoku

-------------------------------*/

#topback{
	background-image:url(../images/hp/topback.png);
 background-repeat:repeat-x;
	width:auto;
	height:100px;
	margin-bottom:-100px;
/*		margin-bottom:-100px;*/
}

#bottomback{
	background-image:url(../images/hp/bottomback.png);
 background-repeat:repeat-x;
	width:auto;
	height:150px;
	margin-top:-150px;
/*		margin-top:-150px;*/
}










