@charset "utf-8";
/* CSS Document */

@charset "utf-8";

/* @group reset */

* { margin: 0; padding: 0}

a { text-decoration : none}
ul, ol { list-style : none}
img { vertical-align : middle}

/* @end */

/* @h1 img */

img { max-width : 100%}
	
/* @end */	

/* @font */

html {
    font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	
	font-size : 16px;
	line-heigh : 1.5;
	background-color: #f4f0e9;
	}

@font-face {
	font-family: 'icomoon';
	src:url('/fonts/icomoon.eot?-xokuqj');
	src:url('/fonts/icomoon.eot?#iefix-xokuqj') format('embedded-opentype'),
		url('/fonts/icomoon.woff?-xokuqj') format('woff'),
		url('/fonts/icomoon.ttf?-xokuqj') format('truetype'),
		url('/fonts/icomoon.svg?-xokuqj#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* @end */

/* @font margin */

h2 { margin-bottom : 14px} /* margin-bottom 16pxが基準　*/
h3,p { margin-bottom : 8px}

/* @font size 高さの基準がフォントの1.5倍、基準のフォントが16px h1は例外！*/

h1 { font-size : 18px; line-height : 2} /* 54px÷18px 18px(1.5倍)の高さが基準　*/
h2 { font-size : 16px; line-height : 1.5} /* サイズ 24px÷16px 16pxのサイズが基準　*/	
h3 { font-size : 14px; line-height :1.2857} /* 18px÷14px */
p { font-size : 12px; line-height : 1.5} /* 18px÷12px */

/* @end */	

/*  clearfix */

.clearfix:after {
content :"";
display :block;
clear :both;
}

/* IE6 clearfix */
.clearfix {zoom:1;}

/* IE7 clearfix */
:first-child+html .clearfix {zoom: 1;}

/*  clearfix @end */	

/* @header */
	   
/* @end */

/* @header nav */

/*header*/

header { width : 100%; margin : 0 auto; overflow : hidden; background-color: #624e48}

#wrapper { width : 94%; margin : 0 auto; background-color: #624e48}

header #logo img.sp {
  text-align: left;
  margin: 10px 0 5px;
  font-size: 26px;
  font-weight: normal;
  font-family: 'Alfa Slab One';
  color: #624e48;
}

#logo img.sp { display: block; border : none}  /* spを非表示 */
#logo img.tb { display: none; }  /* tbを非表示 */
#logo img.pc  { display: none; } /* pcを表示 */

.top-ornament{ 
  display: none;
}

/*navigation*/
#navControl{
  margin-top:-50px;
  text-align: right;
}
#navControl a {
  display: inline-block;
  overflow: hidden;
  width: 45px;
  height: 55px;
  text-indent: 100%;
  white-space: nowrap;
  vertical-align: bottom;
  background: url(../img_sp/navi-control.png) no-repeat 0 0;
}
.ie7 #navControl a{
  display: block;
}
#navControl a.active{
    background: url(../img_sp/navi-close.png) no-repeat 0 0;
}

@media (-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 1.5dppx) {
  #navControl a {
    background: url(../img_sp/navi-control-x2.png) no-repeat 0 0;
    -webkit-background-size: 45px 50px;
    background-size: 45px 50px;
  }
  #navControl a.active {
    background: url(../img_sp/navi-close-x2.png) no-repeat 0 0;
    -webkit-background-size: 45px 50px;
    background-size: 45px 50px;
  }
}


header nav{
  margin-bottom : 5px;
}
ul#globalNav {
  margin: 0;
  padding: 0;
}
ul#globalNav li{
  border-bottom: 1px solid #624e48;
}
ul#globalNav li a {
  font-family: 'Alfa Slab One';
  display: block;
  padding: 10px;
  background: #f4f0e9;
  color: #624e48;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(98,78,72,0.5);
}
ul#globalNav li a:hover{
  background-color: #f00;
}
#mainNav ul li a i{
  margin-right: 5px;
  vertical-align: middle;
}

.bottom-ornament{ 
  display: none;
}

	
/* @end */	



/* @contains */	   
	   
#contents { width : 100%; margin : 0 auto; background-color : #f4f0e9} 

#style { width : 94%; margin : 0 auto; background-color : #f4f0e9;  margin-top : 14px ; margin-bottom : 14px}

#style h1 {
	text-align : center;
	color : #eeb865;
	font-family: 'Alfa Slab One';
	font-size: 24px;
	background-color : #624e48;
	margin-bottom : 14px;
	font-weight: normal;
}	
#style h2 { text-align : left; color : #392322 ; margin-bottom : 14px}	
#style h3 { text-align :left; font-weight: bold}
#style p { text-align :left;}

#gallery{
	width:300px;
	height: 290px;
	margin-bottom : 14px;
	float: left;
	background-color : #f4f0e9;
}

#gallery .main {
	width: 210px;
	height: 290px;
	float: left;
}
#gallery .thumbnail {
	width: 70px;
	height: 290px;
	margin-top: 0px;
	margin-left: 230px;
}
#gallery .main img {
	border:3px solid #cccccc;
}

#gallery .thumbnail ul {
	display: inline;
	margin: 0;
	padding: 0;
}
#gallery .thumbnail li {
	background-color: #f4f0e9;
	margin-top: 0px;
	list-style-type: none;
	float: left;
	display: inline;
}

#gallery .thumbnail #front a{
	width: 60px;
	height: 80px;
	float: left;
	margin-top: 0px;
	display: inline;
	border:3px solid #cccccc;
    outline:none
}

#gallery .thumbnail #front a:hover{
	border:3px solid #eeb865;
}

#gallery .thumbnail #side a{
	width: 60px;
	height: 80px;
	float: left;
	margin-top: 14px;
	display: inline;
	border:3px solid #cccccc;
    outline:none
}

#gallery .thumbnail #side a:hover{
	border:3px solid #eeb865;
}

#gallery .thumbnail #back a{
	width: 60px;
	height: 80px;
	float: left;
	margin-top: 14px;
	display: inline;
	border:3px solid #cccccc;
    outline:none
}

#gallery .thumbnail #back a:hover{
	border:3px solid #eeb865;
}

.details  { width : 94%; margin-top : 14px ; margin-bottom : 14px; background-color : #f4f0e9}

.details  dl{
	clear: both; 
	background-color : #f4f0e9;
}

.details  dt {
	float: left;
    clear: both;
	font-size: 14px;
	color: #000;
	background-color : #f4f0e9;
}
.details  dd {
	margin: 0;
	padding-left: 100px;
	font-size: 14px;
	color: #666;
	background-color : #f4f0e9;
}

.return a { 
    width : 60%;
    margin : 0 auto;
	margin-top : 20px;
	margin-bottom : 20px;	
	font-family: 'Alfa Slab One', cursive;
	display : block;
	color : #c87548;
	padding : 5px 0;
	text-align: center;
	font-size: 14px;
	background-color : #eeb865;
	border:1px solid #ca9b52;
	border-radius: 5px; 
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}


.shop01 { width : 94%; margin : 0 auto; background-color : #f4f0e9}
.shop01 h1 {
	text-align : center;
	color : #eeb865;
	font-family: 'Alfa Slab One';
	font-size: 18px;
	background-color : #624e48;
	margin-bottom : 14px;
	font-weight: normal;
}	
.shop01 h2 { text-align : left;  color : #624e48 ;margin-bottom : 14px}	
.shop01 h3 { text-align :left;  color : #624e48 ;font-weight: normal}
.shop01 .comment { text-align :left; color : #392322; margin-top : 10px; margin-bottom : 10px}

.menu dl {
    clear: both;
}
.menu dt {
    float: left;
    clear: both;
	color : #624e48;
	font-size: 14px;
}
.menu dd {
	margin: 0;
	padding-left: 80px;
	color : #624e48;
	font-size: 14px;
}

.shop02 { width : 94%; margin : 0 auto; background-color : #f4f0e9}
.shop02  h1 {
	text-align : center;
	color : #eeb865;
	font-family: 'Alfa Slab One';
	font-size: 18px;
	background-color : #624e48;
	margin-bottom : 14px;
	font-weight: normal;
}	
.shop02  h2 { text-align : left;  color : #624e48 ;margin-bottom : 14px}	
.shop02  h3 { text-align :left;  color : #624e48 ;font-weight: normal}
.shop02 p { text-align :left; color : #F00; margin-top : 10px; margin-bottom : 0px}

.shop dl {
    clear: both;
}
.shop dt {
    float: left;
    clear: both;
	color : #624e48;
	font-size: 14px;
}
.shop dd {
	margin: 0;
	padding-left: 100px;
	color : #624e48;
	font-size: 14px;
}

.telephone { width : 100%; margin : 0 auto; background-color : #f4f0e9; margin-bottom : 14px}
.telephone a { 
    width : 60%;
    margin : 0 auto;
	margin-top : 20px;
	margin-bottom : 20px;	
	font-family: 'Alfa Slab One', cursive;
	display : block;
	color : #c87548;
	padding : 5px 0;
	text-align: center;
	font-size: 14px;
	background-color : #eeb865;
	border:1px solid #ca9b52;
	border-radius: 5px; 
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

.icon-calling:before {
	content: "\e602";
	font-family:"icomoon";
	color : #c87548;
	font-size: 16px;
	padding-right : 5px;

}

.shop03 { width : 94%; margin : 0 auto; background-color : #f4f0e9}
.shop03 h1 {
	text-align : center;
	color : #eeb865;
	font-family: 'Alfa Slab One';
	font-size: 18px;
	background-color : #624e48;
	margin-bottom : 14px;
	font-weight: normal;
}	
.shop03 h2 { text-align : left;  color : #624e48 ;margin-bottom : 14px}	
.shop03 h3 { text-align :left;  color : #624e48 ;font-weight: normal}
.shop03 p { text-align :left; color : #624e48; margin-top : 10px; margin-bottom : 0px}


.googlemap-sp { width : 100%; margin : 0 auto; background-color : #f4f0e9; margin-bottom : 14px}
.googlemap-sp  a { 
    width : 50%;
    margin : 0 auto;
	margin-top : 20px;
	margin-bottom : 20px;	
	font-family: 'Alfa Slab One', cursive;
	display : block;
	color : #c87548;
	padding : 5px 0;
	text-align: center;
	font-size: 14px;
	background-color : #eeb865;
	border:1px solid #ca9b52;
	border-radius: 5px; 
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

.icon-google-pin:before {
	content: "\e603";
	font-family:"icomoon";
	color : #c87548;
	font-size: 16px;
	padding-right : 5px;

}

footer { background-color : #624e48}
footer p { padding : 12px 0; text-align : center; margin-bottom : 0px}


/* 768px */
@media screen and (min-width : 768px){	

/*  clearfix */

.clearfix:after {
content :"";
display :block;
clear :both;
}

/* IE6 clearfix */
.clearfix {zoom:1;}

/* IE7 clearfix */
:first-child+html .clearfix {zoom: 1;}

/*  clearfix @end */	

header { width : 100%; margin : 0 auto; overflow : hidden; background-color: #f4f0e9; }

#wrapper { width : 100%; margin : 0 auto; background-color: #f4f0e9;}

#logo img.sp { display: none; }  /* spを非表示 */
#logo img.tb { display: block; border : none}  /* tbを表示 */
#logo img.pc { display: none; } /* pcを非表示 */

.top-ornament{ 
  display: block;
  margin-top : 15px;
  border-style: solid;
  background-color: #624e48;
  border-top: 1px;
  border-right: 0px;
  border-left: 0px;
  border-bottom: 0px;
  height: 1px;
}

header #logo img.tb {
  position: absolute ;
  margin-top : 0px;
  top: 0; 
  left: 40%;
  z-index: 100;
}

/*navigation*/
#navControl{
  margin-top:0px;
  display: none;
}

ul#globalNav {
  display: block !important;
  width : 100%; margin : 0 auto; 
  margin-top : 5px;
  margin-bottom : 5px;
}
ul#globalNav li{
  width : 20%;
  float : left; 
  border-top: 5px solid #624e48;
  border-bottom: 5px solid #624e48;
}

ul#globalNav li:nth-child(2){
	padding-right : 78px ;
}
ul#globalNav li:nth-last-child(2){
	padding-left : 78px ;
}

ul#globalNav li a {
	font-family: 'Alfa Slab One', cursive;
	display : block;
	color : #624e48;
	padding : 12px 0;
	text-align: center;
	font-size: 16px;
}
ul#globalNav li a:hover{
  color : #FFF ; background-color : #a9bfbd;
}
#mainNav ul li a i{
  margin-right: 5px;
  vertical-align: middle;
}

.bottom-ornament{ 
  display: block;
  margin-bottom : 15px;
  border-style: solid;
  background-color: #624e48;
  border-top: 0px;
  border-right: 0px;
  border-left: 0px;
  border-bottom: 1px;
  height: 1px;
}

/* @end */

#contents { width : 100%; margin : 0 auto; background-color : #f4f0e9}

#style { width : 96%; margin : 0 auto; background-color : #f4f0e9;  margin-bottom : 14px ; margin-bottom : 14px}

.details  { float : left ; width : 55% ; margin-left : 4% }

.shop01,.shop02 {
  float: left;
  display: inline;
  margin-left: 2%;
}
.shop01,.shop02 {width: 47%; margin-bottom : 2%}
.shop01 first {margin-left: 2%;clear: left;}

.telephone { display : none;}

.shop03 { width : 96%; margin : 0 auto; background-color : #f4f0e9;   clear:both;}	

}
/* 768px @end */	

/* 960px */
@media screen and (min-width : 960px){


/*  clearfix */

.clearfix:after {
content :"";
display :block;
clear :both;
}

/* IE6 clearfix */
.clearfix {zoom:1;}

/* IE7 clearfix */
:first-child+html .clearfix {zoom: 1;}

/*  clearfix @end */	


/*header*/

header { width : 940px; margin : 0 auto; overflow : hidden; background-color: #f4f0e9; }

#wrapper { width : 940px; margin : 0 auto; background-color: #f4f0e9;}

.top-ornament{ 
  display: block;
  margin-top : 15px;
  border-style: solid;
  background-color: #624E48;
  border-top: 1px;
  border-right: 0px;
  border-left: 0px;
  border-bottom: 0px;
  height: 1px;
}

header #logo img.pc {
  position: absolute ;
  margin-top : 0px;
  top: 0; 
  left: 44%;
  z-index: 100;
}

/*navigation*/
#navControl{
  margin-top:0px;
  display: none;
}

ul#globalNav {
  display: block !important;
  width : 100%; margin : 0 auto; 
  margin-top : 5px;
  margin-bottom : 5px;
}
ul#globalNav li{
  width : 20%;
  float : left; 
  background-color : #f4f0e9;
  border-top: 5px solid #624E48;
  border-bottom: 5px solid #624E48;
}

ul#globalNav li:nth-child(2){
	padding-right : 94px ;
}
ul#globalNav li:nth-last-child(2){
	padding-left : 94px ;
}

ul#globalNav li a {
	font-family: 'Alfa Slab One', cursive;
	display : block;
	color : #624E48;
	padding : 12px 0;
	text-align: center;
	font-size: 16px;
}
ul#globalNav li a:hover{
  color : #f4f0e9 ; background-color : #a9bfbd;
}
#mainNav ul li a i{
  margin-right: 5px;
  vertical-align: middle;
}

.bottom-ornament{ 
  display: block;
  margin-bottom : 15px;
  border-style: solid;
  background-color: #624E48;
  border-top: 0px;
  border-right: 0px;
  border-left: 0px;
  border-bottom: 1px;
  height: 1px;
}

	
/* @end */	

#logo img.sp { display: none; }  /* spを非表示 */
#logo img.tb { display: none; }  /* tbを非表示 */
#logo img.pc { display: block; border : none} /* pcを表示 */

#logo .pc a:hover { background-color : f00}

#contents { width : 940px; margin : 0 auto; background-color : #f4f0e9}

#style { width : 940px; margin : 0 auto; background-color : #f4f0e9;  margin-bottom : 20px ; margin-bottom : 14px}

#gallery { width : 300px}

.details  { width : 620px; margin : 0 auto; margin-top : 0px ; margin-left : 20px ; margin-bottom : 20px; background-color : #f4f0e9 ; float : left}

.details  dt {
	float: left;
    clear: both;
	font-size: 14px;
	padding-bottom : 10px;
	color: #000;
	background-color : #f4f0e9;
}
.details  dd {
	margin: 0;
	padding-left: 100px;
	font-size: 14px;
	padding-bottom : 10px;
	color: #666;
	background-color : #f4f0e9;
}

#info { width: 940px; margin: 0 auto; background-color : #f4f0e9; margin-bottom : 20px}

.shop01,.shop02,.shop03 {
  float: left;
  display: inline;
  margin-left: 20px;
}
.shop03 { clear : none}

.shop01,.shop02,.shop03 {width: 300px;}
.first {margin-left: 0;clear: left;}

.telephone { display : none;}

.googlemap-sp { display : none;}
	

}
/* 960px @end */	

/* #contents */background:url(../img_sp/960_grid_12_col.png) repeat-y top center