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

/*
************************************************************************
 デザイン基本設定
************************************************************************
*/

/*文字の色*/
*{
	color:#292123;
}

.pink{
	color: #ef5988;
}
/*基本 罫線の色*/
hr.st-border{
	border-top: 1px solid #462f2d;
}

@media screen and (min-width:421px){
	main:before{
		background-image:url("../_img/bg.jpg");
	}
}

article {
	background: #fef8f9;
}

/*
************************************************************************
 問い合わせ＆予約ボタンカラー
************************************************************************
*/

nav .contact{
	background:#f16185;
}
nav .reservation{
	background: #c6af47;
}

/*背景色が淡色で白文字が見えない場合
↓↓コメントアウト外して使用する*/
/*nav a span{
	color:#000;
}*/

nav .contact span:before{
	background-image:url("../_img/contact.svg");
}
nav .reservation span:before{
	background-image:url("../_img/reservation.svg");
}

/*
************************************************************************
 ギャラリー
************************************************************************
*/
.readmore-label:before{
	background-image: url(../_img/open.svg);
}

/*
************************************************************************
 ロケーション
************************************************************************
*/
/*画像右下　GALLERY　背景色↓↓*/
.location_block .image a .location_link {
	background: #F96B61;
}

/*
************************************************************************
 section title　フォント

各セクションのタイトル、ギャラリーのVIEW MORE、フッターの©️studiozeroのフォントは連動させる
************************************************************************
*/
h2.titleFont,
.readmore-label,
footer .copyright
{
	font-family: 'Libre Bodoni', serif!important;
}

/*フォント変更で文字サイズ調整が必要になった場合
下記を編集*/
h2.titleFont{
	font-size: 5.3em;
	margin: 20px 0;
}
.readmore-label{
	font-size: 3.2em;
	letter-spacing: 0.5px;
}
footer .copyright{
	font-size: 2.17em;
	line-height: 2.7;
}
@media screen and (min-width:421px){
	h2.titleFont{
		font-size: 3em;
		margin: 30px 0;
	}
	.readmore-label {
		font-size: 1.9em;
		letter-spacing: 0;
	}
	footer .copyright{
		font-size: 1.4em;
	}
}

h3.mincho {
	font-family: '游明朝','Yu Mincho','YuMincho','Hiragino Mincho Pro',serif;
}

/*
************************************************************************
 shoplist　
************************************************************************
*/


.shop_list .shop_block:before{
	background: url(../_img/link.svg)no-repeat;
}

/*下線の色*/
.shop_list .shop_block{
	border-bottom: 1px #1b2426 solid;
}

/*
************************************************************************
 shoplist　非表示の店舗

京都本店：kyoto　/　宇治：uji　/　大阪長堀橋：nagahori　/　大阪大仙：daisen
大阪堺：sakai　/　奈良：nara　/　神戸：kobe　/　姫路：himeji
岡山：okayama　/　香川：kagawa　/　横浜：yokohama　/　東京：tokyo
名古屋：nagoya

************************************************************************
*/
/*.shop_list li#nagoya{
	display:none;
}*/

/*複数店舗を非表示にしたい場合
カンマ(,)で繋げて記述する*/
/*.shop_list li#kyoto,
.shop_list li#uji,
.shop_list li#nara{
	display:none;
}*/



/*
************************************************************************
 location
************************************************************************
*/
section#location{
	background-image:url("../img/section-bg02.svg");
}
section#location h2{
	padding: 5px 0 35px;
}
section#location h2 img{
	width:87%;
}
.location_list{
	margin: 40px auto -10px;
}
.location_block{
	margin-bottom:16px;
}
.location_block a{
	display:block;
	width:100%;
	height:100%;
}
.location_block .image a img{
	border-radius: 8px;
}
.location_block .name{
	display: block;
	position: absolute;
	top: 12px;
	left: 12px;
	background: #fff;
	padding: 0.4em 0;
	writing-mode: vertical-rl;
	font-size: 2.7em;
	line-height: 1.5;
	letter-spacing:1px;
}
.location_block .name_sub {
	color: #725951;
	font-size: 1.75em;
	text-align: left;
	margin-top: -7px;
	margin-bottom: 27px;
}
.location_block .image a .location_link {
	color: #fff;
	font-size: 2em;
	letter-spacing: 1px;
	
	display: block;
	padding: 3px 5px 2px 9px;
	border-radius: 0 0 8px 0;
	position: absolute;
	bottom: 0;
	right: 0;
	background: #31bbdd;
}
.location_block .image a .location_link:after{
	content: "";
	background-image: url(../img/location_link.svg);
	background-repeat: no-repeat;
	background-size: 10px;
	float: right;
	width: 10px;
	height: 10px;
	margin: 3px;
}
@media screen and (min-width:421px){
	section#location h2 {
		margin: -15px 0 -5px -5px;
	}
	.location_block {
		margin-bottom: 19.2px;
	}
	.location_block .image:hover{
		opacity:0.7;
	}
	.location_block .name{
		font-size: 1.48em;
	}
	.location_block .name_sub{
		font-size:1em;
	}
	.location_block .image a .location_link {
		font-size: 1.2em;
		letter-spacing: 0;
		padding: 3px 3px 2px 9px;
	}
	.location_block .image a .location_link:after{
		width: 10px;
		height: 10px;
		margin: 3px;
	}

}

/*
************************************************************************
 thumbnail フェードイン
************************************************************************
*/

.fadeIn{
	animation-name:fadeInAnime;
	animation-duration:1s;
	animation-fill-mode:forwards;
	opacity:0;
}

@keyframes fadeInAnime{
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeInTrigger{
	opacity: 0;
}

/*
************************************************************************
 banner
************************************************************************
*/

.banner img {
	border-radius: 8px;
	transition: .2s;
	
}

.banner img:hover {
		transform: scale(.97);
		opacity:0.7;
		transition: .2s;
	}