/*
------------------

 .clearfix

------------------
*/
.clearfix {
	zoom:1;
}
.clearfix:after {
	content: ""; 
	display: block; 
	clear: both;
}
/*
------------------

 Lib.

------------------
*/
.hover .btn:hover{
	opacity:0.75;
	cursor:pointer;	
}
.fl{
	float:left;	
}
.fr{
	float:right;
}
.forPC{
	display:block;
}
.forSP{
	display:none;
}
.btn-right{
	position:relative;
	padding:10px 0 10px 20px;
	color:#414747;
}
.btn-right:before {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 0;
	height: 0;
	margin-top: -3px;
	margin-left: 5px;
	border-left: 6px solid #414747;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-right: 4px solid transparent;
}
.btn-right:hover{
	color:#32adc6;
}
.refrect-ud{
  -webkit-transform: scaleY(-1);
  -o-transform: scaleY(-1);
  -moz-transform: scaleY(-1);
  transform: scaleY(-1);
  filter: FlipV;
  -ms-filter: "FlipV";
}
.copyright{
	font-family: 'Abel', sans-serif;
	letter-spacing: 0.05em;
	font-size: 10px;
}
@media screen and (max-width: 960px) {
	.forPC{
		display:none;
	}
	.forSP{
		display:block;
	}
	.fl, .fr{
		float:none;
	}
}

/*
------------------

 basic

------------------
*/
html{
	overflow:auto;
	font-size:62.5%; /*10px*/
	letter-spacing: 0.1em;
	width:100%;
	height:100%;
	-webkit-overflow-scrolling: touch;
}
body{
	background-color: #fff;
	width:100%;
	height:100%;
	color:#603813;
	-webkit-overflow-scrolling: touch;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
}
img{ width:100%; height: auto; }
a{
	color:#069;
	text-decoration: none;
}
a:hover{
	color:#32adc6;
}
div.wrapper{
	width:100%;
	margin:0 auto;
	position: relative;
	border-top:4px solid #736357;
}
div.innner{
	width:100%;
	max-width: 960px;
	margin:0 auto;
	position: relative;
}
section{
	padding:100px 0 0 0;
	width:100%;
	max-width: 960px;
	margin:0 auto;
}
section h1{
	font-size:24px;
	letter-spacing: 0.2em;
	border-bottom:thin solid #dbccc3;
	text-align: center;
	padding-bottom: 15px;
}
section h2{
	padding:30px 2%;
}
section h2 > div:first-child{
	font-size:16px;
	line-height: 29px;
	float:left;
	width:54%;
}
section h2 > div:first-child p{
	margin-bottom: 20px;
}
section h2 > div:last-child{
	float:right;
	width:39.3%;
}
section h2 > div:last-child p{
	font-size:12px;
	margin-top:5px;
}

@media screen and (max-width: 960px) {
	div.innner{
		display: block;
		width:90vw;
		margin-left: 5vw;
	}
	section{
		padding:70px 0 0 0;
		width:90vw;
	}
	section h1{
		font-size: 5.9vw;
		letter-spacing: 0.1em;
	}
	section h2 > div{
		float: none!important;
		width:100%!important;
	}
}
/* HEADER */

div#header{
	width:100%;
	height: 125px;
	position:relative;
}
img#header_logo{
	width:140px;
	margin-top:30px;
	margin-left: 30px;
}
div#header > p{
	font-size:14px;
	letter-spacing: 0.2em;
	margin: 44px 0 0 36px;
	line-height: 22px;
}
div#header_toolbox{
	position:absolute;
	top:0;
	right:20px;
	z-index: 999;
}
div#header_toolbox > div{
	
}
div#btn-access_reserve{
	font-size:15px;
	line-height: 20px;
	color:#fff;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	background-color:#736357;
	padding:10px 25px;
	margin-right:5px;
	width:auto;
	text-align: center;
}
div#btn-access_reserve:hover{
	opacity: 0.8;
}

ul#header_links{
	margin-top:10px;
	display: inline-block;
}
ul#header_links li{
	float:left;
	font-size:12px;
	color:#603813;
	margin-right:30px;
	letter-spacing: 0.2em;
	position: relative;
}
ul#header_links li:hover{
	opacity: 0.5;
}
ul#header_links li.links{
	
}
ul#header_links li.links:before {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: -10px;
	width: 0;
	height: 0;
	margin-top: -1px;
	margin-left: 0;
	border-left: 4px solid #603813;
	border-top: 2px solid transparent;
	border-bottom: 2px solid transparent;
	border-right: 2px solid transparent;
}
li.icn-sns{
	
}
li.icn-sns img{
	width:16px;
	margin-top:2px;
}
@media screen and (max-width: 960px) {
	div#header{
		height: 21vw;
	}
	div#header_toolbox, ul#header_links{
		display: none;
	}
	img#header_logo{
		width: 21vw;
		margin-left:6vw;
		margin-top: 5vw;
	}
	div#header > p{
		position: absolute;
		top:0;
		left:33vw;
		margin-left: 0;
		font-size: 3vw;
		margin-top: 6vw;
		line-height: 5vw;
	}
	
}
/* Navigation */

div#nav-cont{
	text-align: right;
	width:86%;
	margin-top:30px;
	position: absolute;
	bottom:20px;
	right:30px;
}
ul#nav{
	padding:3px 0;
	width:auto;
	display: inline-block;
}
ul#nav li{
	float:left;
	font-size:12px;
	color:#603813;
	margin-right:30px;
	letter-spacing: 0.2em;
	position: relative;
	padding-left:12px;
}
ul#nav li:hover{
	opacity: 0.5;
}
ul#nav > a:last-child li{
	margin-right:0;
}
ul#nav li:before {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 0;
	height: 0;
	margin-top: -3px;
	margin-left: 0;
	border-left: 6px solid #603813;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-right: 4px solid transparent;
}
@media screen and (max-width: 960px) {
	
	div#nav-cont{ display: none; }
}

/* for SP */
div#icon-menu,div#menu-sp{
	display:none;
}
@media screen and (max-width: 960px) {
	div#icon-menu{
		transform: scale(0.6);
		position: fixed;
		right: 0;
		top: 0;
		background-color: #fff;
		z-index: 999;
		padding: 10px;
		border-radius: 5px;
		display:block;
		transition: .5s;
	}
	div#icon-menu.hide{
		top:-100px;
	}
	.menu-trigger,
	.menu-trigger span {
	  display: inline-block;
	  transition: all .4s;
	  box-sizing: border-box;
	}
	.menu-trigger {
	  position: relative;
	  width: 50px;
	  height: 44px;
	}
	.menu-trigger span {
	  position: absolute;
	  left: 0;
	  width: 100%;
	  height: 4px;
	  background-color: #414747;
	  border-radius: 4px;
	}
	.menu-trigger span:nth-of-type(1) {
	  top: 0;
	}
	.menu-trigger span:nth-of-type(2) {
	  top: 20px;
	}
	.menu-trigger span:nth-of-type(3) {
	  bottom: 0;
	}
	.menu-trigger.active span:nth-of-type(1) {
	  width: 45%;
	  -webkit-transform: translate3d(2px, 10px, 0) rotate(45deg);
	  transform: translate3d(2px, 10px, 0) rotate(45deg);
	}
	.menu-trigger.active span:nth-of-type(2) {
	  -webkit-transform: translate3d(-1px, 0, 0) rotate(-45deg);
	  transform: translate3d(-1px, 0, 0) rotate(-45deg);
	}
	.menu-trigger.active span:nth-of-type(3) {
	  width: 45%;
	  -webkit-transform: translate3d(23px, -9px, 0) rotate(45deg);
	  transform: translate3d(23px, -9px, 0) rotate(45deg);
	}
	div#menu-sp{
		display: none;
		width:100%;
		position:fixed;
		top:0;
		right:0;
		z-index:998;
		background-color:#fff;
		border-bottom: thin solid #eeeff0;
	}
	div#menu-sp-header{
		height:auto;
	}
	div#menu-sp-header div#title_jp{
		float:none;
		width: 100vw;
		text-align: center;
		padding:10vw 0;
	}
	div#menu-sp-header div#title_jp img{
		width:20vw;
	}
	div#menu-sp-header div#btn-access_reserve-sp{
		font-size:16px;
		line-height: 20px;
		color:#fff;
		border-radius: 10px;
		background-color:#736357;
		padding:10px 0;
		width:90%;
		margin-left: 5%;
		text-align: center;
	}
	div#header_links-spcont{
		text-align: center;
	}
	div#menu-sp ul#header_links{
		float:none;
		font-size: 3.3vw;
		letter-spacing: 0.1em;
		line-height: 65px;
		display: inline-block;
	}
	div#menu-sp ul#header_links li{
		margin-right: 10vw;
	}
	div#menu-sp ul#nav{
		display:block;
		padding:0;
		width:97vw;
		margin-left:3vw;
	}
	div#menu-sp ul#nav li{
		font-size:4vw;
		width:94vw;
		float: none;
		padding:5vw;
		border-right: none;
		border-bottom: thin solid #eeeff0;
	}
	
}



/* MainImage */

div#mainimg-cont{
	position: relative;
	border-bottom:thin solid #dbccc3;
	border-top:thin solid #dbccc3;
	padding:1px 0;
	opacity: 0;
	transition-duration: 3s;
	height: 40vw;
}
div#mainimg-cont p{
	background-color:#fff;
	z-index: 999;
	padding:10px 20px;
	position: absolute;
	top:20px;
}
/* SLICK */
div#mainimg-cont .slick-dots{
	bottom: 0px!important;
}
div#mainimg-cont .slick-dots li button:before{
	color:#fff!important;
}
div#mainimg-cont .slick-dotted.slick-slider{
	margin-bottom:0!important;
}
div#mainimg-cont .slick-next, div#mainimg-cont .slick-prev{
	display:none!important;
}
@media screen and (max-width: 960px) {
	div#mainimg-cont{
		overflow: hidden;
		height: 70vw;
	}
	ul.mainimg{
		width:175vw;
		margin-left:-37.5vw;
	}
}
/*
------------------

 T O P I C S

------------------
*/
div#topics{
	width:100%;
	max-width:1000px;
	margin:0 auto;
	margin-top:50px;
}
div.topic-line{
	display: block;
}
div.topic{
	width:300px;
	float:left;
	margin-right:50px;
	margin-bottom:50px;
}
div#topics div.topic:nth-child(3),div#topics div.topic:nth-child(6){
	margin-right: 0;
}
div.topic-head{
	width:100%;
	margin-bottom: 15px;
}
div.topic-head h2{
	font-size:19px;
	float:left;
	letter-spacing: 0.1em;
	text-align: center;
}
div.topic-head a div.btn{
	width: 65px;
	border: thin solid #ccc;
	float: right;
	text-align: center;
	font-size: 16px;
	padding: 6px 5px;
	line-height: 16px;
	letter-spacing: 0.1em;
	color:#000;
	background-color: #fff;
}
div.topic-body-txt a div.btn{
	width: 70%;
	margin:0 auto;
	border: thin solid #ccc;
	text-align: center;
	font-size: 16px;
	padding: 6px 0;
	line-height: 16px;
	letter-spacing: 0.1em;
	color:#000;
	background-color: #fff;
}
div.topic-body-txt a{
	color:#4196d3;
}
.hover div.topic-body-txt a:hover{
	color:#006699;
}
.hover　div.topic-head div.btn:hover, .hover div.topic-body-txt div.btn:hover{
	border-color:#000;
	color:#000;
}
div.topic-img-container{
	width:100%;
	height:300px;
	position:relative ;
}
div.topic-img-container a img{
	width:100%;
	height: auto;
	vertical-align: bottom;
	-webkit-transition:all 0.25s ease-in-out;
    transition:all 0.25s ease-in-out;
}
.hover div.topic-img-container a img:hover{
	opacity: 0.8;
	transform:translate(-0%, -0%) scale(1.05,1.05);
	-webkit-transform:translate(-0%, -0%) scale(1.05,1.05);
	-moz-transform:translate(-0%, -0%) scale(1.05,1.05);
	-ms-transform:translate(-0%, -0%) scale(1.05,1.05);
	-o-transform:translate(-0%, -0%) scale(1.05,1.05);
}
.slick-prev:before, .slick-next:before{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0;
	height: 0;
	margin-top: -5px;	
}
.slick-prev:before{
	border-left: 5px solid transparent;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-right: 6px solid #000;
	margin-left: -6px;
}
.slick-next:before{
	border-left: 6px solid #000;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-right: 5px solid transparent;
	margin-left: -3px;
}
.slick-dots{
	display: none;
	bottom: 0;
}
.slick-dots li{
	margin: 0 2px!important;
}
.slick-dots li button:before, .slick-dots li.slick-active button:before{
	color:#fff;
}
.slick-dotted.slick-slider{
	margin-bottom: 0;
}
div.topic-body{
	font-size:12px;
	line-height: 21px;
	letter-spacing:0.1em;
	height: 100px;
	margin-top:10px;
	overflow: hidden;
	color:#988683;
}
div.topic-body p{
	margin-bottom: 15px;
}
div.topic-date{
	font-size:10px;
	font-family: Georgia, "Times New Roman", Times, "serif";
	text-align: right;
	padding:8px 0;
	letter-spacing: 1px;
	color:#666;
	font-style: italic;
}
span.inst-like, span.inst-comment{
	float: left;
	padding-left:15px;
	margin-right: 5px;
}
span.inst-like{
	background:url("/img/inst-like.svg") no-repeat left;
}
span.inst-comment{
	background:url("/img/inst-comment.svg") no-repeat left;
}

div.topic-expand{
	width:100%;
	border-bottom:thin solid #dbccc3;
	border-left:thin solid #dbccc3;
	border-right:thin solid #dbccc3;
	background-color: #fff;
	text-align: center;
	height:32px;
	margin-top:10px;
	cursor: pointer;
}
.hover div.topic-expand:hover{
	opacity: 0.75;
}
div.topic-expand img{
	width:14px;
	height: auto;
	margin-top:10px;
}
@media screen and (max-width: 800px) {
	div.topic, div#topics div.topic:nth-child(3),div#topics div.topic:nth-child(6){
		float: none;
		margin:40px auto;
	}
	div.topic-body{
		font-size:12px;
		line-height: 18px;
		letter-spacing:0.1em;
		
		padding:2px 5px;
		margin-top:10px;
		overflow: hidden;
	}
}



/* SPACE */

p#space-script{
	width: 100%;
	text-align: right;
	font-size:14px;
	margin-top:10px;
}

div#space-body{
	font-size: 22px;
	line-height: 2em;
	text-align: center;
	letter-spacing: 0.2em;
	padding:10px 0 40px 0;
}

/* Gallery */

div.photogallery{
	width:100%;
}
div.photogallery img{
	float: left;
	width:18%;
	height: auto;
	margin-right: 2.5%;
	margin-bottom: 2.5%;
}
.hover div.photogallery img:hover{
	opacity: 0.5;
}
div.photogallery a:nth-child(5) img, div.photogallery a:nth-child(10) img, div.photogallery a:nth-child(15) img{
	margin-right: 0;
}

/* SJR */

div#profile-cont{
	position: relative;
	padding:2%;
	border: thin solid #dbccc3;
}
div#profimg{
	float:left;
	width: 22.5%;
}
div#profname{
	float: left;
	position: relative;
}
div#profname img{
	width:146px;
	position:absolute;
	top: 50px;
left: 110px;
	margin-left:-73px;
	margin-top: 24px;
	text-align: center;
}
div#profbody{
	float:right;
	font-size: 15px;
	line-height: 1.75em;
	width:50%;
}
@media screen and (max-width: 960px) {
	div#profile-cont{
		padding:5%;
		margin-top:30px;
	}
	div#profimg{
		width:40%;
	}
	div#profname{
		width:40%;
		margin-left: 10%;
	}
	div#profname img{
		top:0; left:0;
		position: relative;
		width:100%;
		margin:0;
		margin-top:35%;
	}
	div#profbody{
		clear: both;
		width:100%;
		margin-top:20px;
	}
}

/* MENU */
div#menu-cont{
	padding:30px 2%;
}
div#menu-img{
	width:50%;
}
div#menu-body{
	width:44%;
	font-size:14px;
	line-height: 1.5em;
	margin-left: 4%;
}
div#menu-body h3{
	font-size:22px;
	padding: 40px 0;
}
div#menu-body p{
	margin-bottom: 20px;
}
p.menu-discription{
	
}
p.menu-discription span{
	font-size: 12px;
}
div#menu-body p#menu-price{
	text-align: right;
	padding: 10px 0;
}
div#menu-body p#menu-price span{
	font-size: 26px;
	font-family: 'Abel', sans-serif;
	letter-spacing: 0.2em;
}
div#menu-prices{
	margin-top:30px;
	margin-bottom:40px;
}
div.menu-line{
	border-top: thin solid #dbccc3;
	padding:10px 2%;
	display: table;
	width: 100%;
	height:60px;
}
div.menu-line > div{
	vertical-align: middle;
	display: table-cell;
}
div.menu-line div.menu-title{
	width:26%;
	font-size:24px;
	letter-spacing: 0.3em;
}
div.menu-line div.menu-title span{
	font-size: 14px;
	letter-spacing: 0.1em;
}
div.menu-line div.menu-contents{
	width:46%;
	font-size:12px;
	line-height: 1.5em;
}

div.menu-line div.price{
	width:30%;
	font-size:14px;
	text-align: right;
	display: table-cell;
	line-height: 26px;
}
div.menu-line div.price span{
	font-size: 26px;
	font-family: 'Abel', sans-serif;
	letter-spacing: 0.2em;
	padding:0 5px 0 20px;
}
h1.menu-single-h1{
	border: none;
	padding-top:30px;
}
div.menu-single div.menu-line div.menu-title{
	width:25%;
	letter-spacing: 0.1em;
	font-size:20px;
}
div.menu-single div.menu-line div.menu-contents{
	width:45%;
}
div.menu-single div.menu-line div.menu-price{
	width:20%;
}
div#menu-footer{
	text-align: center;
	font-size:22px;
	letter-spacing: 0.2em;
	margin-top:30px;
	width:96%;
	padding:2%;
	border: thin solid #dbccc3;
}

@media screen and (max-width: 960px) {
	div#menu-img{
		width:100%;
	}
	div#menu-body{
		width:100%;
		margin-left: 0;
	}
	h1.menu-single-h1{
		margin-top:50px;
	}
	div.menu-line > div{
		display: block!important;
		width:100%!important;
	}
	div.menu-line div.menu-contents{
		padding:10px 0;
	}
	div#menu-footer{
		font-size: 3.5vw;
		text-align: left;
		letter-spacing: 0.1em;
	}
}

/* ACCESS RESERVE */

div#access{
	width:48%;
}
div#adress-box{
	padding:10px 0 10px 0;
	float:none;
}
div#adress-box img{
	width:140px;
}
div#adress-box p{
	margin-left: 50px;
	line-height: 22px;
	text-align: left;
}

div#reserve{
	width:48%;
}
div#reserve p{
	font-size:16px;
}
div#btn-map{
	border: thin solid #dbccc3;
	border-radius: 10px;
	width:92%;
	padding:10px 4%;
	text-align: center;
	line-height:50px;
	font-size: 20px;
	font-family: 'Abel', sans-serif;
	letter-spacing: 0.1em;
	color:#736357;
}
div#btn-map:hover{
	border: thin solid #736357;
}
p#adress-script{
	font-size: 12px;
}
div#telbox{
	background-color:#736357;
	border: thin solid #dbccc3;
	border-radius: 10px;
	display: table;
	color:#fff;
	font-size:20px;
	width:92%;
	padding:10px 4%;
	margin-top:30px;
}
div#telbox > div{
	display: table-cell;
	vertical-align: middle;
}
div#telbox > div:first-child{
	width:40%;
	font-size:16px;
}
div#telbox > div:first-child span{
	font-size:12px;
}
div#telbox > div:last-child{
	font-size: 20px;
	font-family: 'Abel', sans-serif;
	letter-spacing: 0.2em;
	width:35%;
}
p#access-script{
	text-align: center;
	font-size:12px!important;
}
p#reserve-script{
	text-align: center;
	font-size:12px!important;
}

@media screen and (max-width: 960px) {
	div#adress-box{
		text-align: center;
	}
	div#adress-box p{
		margin-left: 0;
		text-align: center;
		margin-top:20px;
	}
	div#btn-map{
		line-height: 40px;
	}
	div#telbox > div{
		display: block!important;
		width: 100%!important;
		text-align: center;
	}
	div#telbox > div:last-child{
		margin-top:5px;
	}
	p#access-script, p#reserve-script{
		font-size:2vw;
		text-align: left;
		line-height: 1.5em;
		margin-top: 5px;
	}
}


/* Gallery */
div#gallery{
	padding: 30px 0;
	position: relative;
}
div#gallery p.title{
	padding:0 0 30px 0;
}
img#loading-gallery{
	position: absolute;
	left:50%;
	margin-left: -30px;
	top:50%;
	margin-top: -30px;
	opacity: 0.5;
}
div#gallery-images{
	width:100%;
	overflow: hidden;
	background-color: #fff;
}
div#gallery-images div.trim{
	width:25%;
	overflow: hidden;
	position: relative;
	float:left;
}
div#gallery-images div.trim:before{
	content:"";
    display: block;
    padding-top: 100%;
}
div#gallery-images a{
	
}
div#gallery-images img{
	vertical-align: bottom;
	-webkit-transition:all 0.25s ease-in-out;
    transition:all 0.25s ease-in-out;
}
img.inst-square{
	width:100%;
	height:100%;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
img.inst-horizontal{
	/* 横長のイメージ */
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: auto;
	height: 100%;
}
img.inst-vertical{
	/* 縦長のイメージ */
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
	height: auto;
}
.hover div#gallery-images img:hover{
	opacity: 0.8;
	transform:translate(-50%, -50%) scale(1.05,1.05);
	-webkit-transform:translate(-50%, -50%) scale(1.05,1.05);
	-moz-transform:translate(-50%, -50%) scale(1.05,1.05);
	-ms-transform:translate(-50%, -50%) scale(1.05,1.05);
	-o-transform:translate(-50%, -50%) scale(1.05,1.05);
}
div#gallery-footer{
	text-align: center;
	width:100%;
	position:relative;
}
div#gallery ul{
	margin-top:30px;
	display: inline-block;
}
div#gallery ul li{
	color: #77031c;
	float: left;
	font-style: italic;
	font-family: 'Abel', sans-serif;
	font-size: 16px;
	letter-spacing: 1px;
	margin-right:50px;
}


@media screen and (max-width: 800px) {
	div#gallery{
		padding-top: 66px;
	}
	div#gallery-images div.trim{
		width:50%;
	}
}