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


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

   特定箇所指定

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

#breakfast{
	margin-bottom: 75px;
}

@media screen and (max-width:550px) {

#breakfast{
	margin-bottom: 50px;
}
	
}

.fa-pagelines{
	color: #a8bf93;
	font-size: clamp(22px, 2vw, 30px);
}
.fa-concierge-bell{
	color: #a8bf93;
	font-size: clamp(20px, 2vw, 24px);
}



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

   こだわりの食材

--------------------------------------------------------------------------------------------- */
#kodawari{
	position: relative;
}

.kodawari-back{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50%;
	background-image: url(../restaurant-images/japanese-paper_00147.jpg);
	background-repeat: repeat;
	z-index: 1;
}

.kodawari-image{
	width: 100%;
	margin-bottom: 50px;
	position: relative;
	z-index: 5;
}

.kodawari-image li{
	float: left;
	width: 33.33%;
}

.kodawari-image li img{
	width: 100%;
	height: auto;
}

.kodawari-image .top_fade{
	margin-top: 5%;
}

#kodawari .text-20{
	width: 90%;
	text-align: center;
	position: relative;
	z-index: 5;
	letter-spacing: 0.25em;
	margin: 0 auto;
}


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

   Swiper-slideer ※swiper2.css に記述

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


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

   夕食メイン

--------------------------------------------------------------------------------------------- */
.dinner-main{
	width: 100%;
	height: 800px;
	background-image: url(../restaurant-images/dinner-main.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	margin-bottom: 75px; 
	border-radius: 0 50% 0 50%;
}

@media screen and (max-width:1250px) {
	
.dinner-main{
	height: 600px;
}
	
}

@media screen and (max-width:750px) {
	
.dinner-main{
	height: 400px;
	margin-bottom: 50px;
	border-radius: 0 25% 0 25%;
}
	
}

@media screen and (max-width:500px) {
	
.dinner-main{
	height: 350px;
}
	
}



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

   朝食メイン

--------------------------------------------------------------------------------------------- */
.breakfast-main{
	width: 100%;
	height: 800px;
	background-image: url(../restaurant-images/breakfast-main.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	margin-bottom: 75px;
	border-radius: 0 50% 0 50%;
}

@media screen and (max-width:1250px) {
	
.breakfast-main{
	height: 600px;
}
	
}

@media screen and (max-width:750px) {
	
.breakfast-main{
	height: 400px;
	margin-bottom: 50px;
	border-radius: 0 25% 0 25%;
}
	
}

@media screen and (max-width:500px) {
	
.breakfast-main{
	height: 350px;
}
	
}



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

   About ※全共通

--------------------------------------------------------------------------------------------- */
.about-leftBox{
	float: left;
	width: 45%;
}

.about-rightBox{
	float: right;
	width: 45%;
}

.meal-about th,.meal-about td.re-td{
	font-size: clamp(14px, 2vw, 16px);
	border-bottom: 0.5px solid #ccc;
	padding: 10px 5px;
}

.meal-about th{
	font-weight: normal;
	text-align: left;
	width: 20%;
}

.meal-about td.irre-td{
	font-size: clamp(10px, 2vw, 12px);
	line-height: 1.75 !important;
	border-bottom: 0.5px solid #ccc;
	padding: 10px 0;
}

@media screen and (max-width:1050px) {

.about-leftBox{
	float: none;
	width: 100%;
}
.about-rightBox{
	float: none;
	width: 100%;
}
	
.meal-about{
	margin-top: 50px;
}
	
}



/* 梅背景
------------------------------------------------------------*/
#dinner{
	position: relative;
}
#breakfast{
	position: relative;
}

.ume{
	position: absolute;
	top: 25px;
	right: 25px;
	width: 480px;
	height: 329px;
	background: url(../restaurant-images/ume.png) no-repeat 0 0;
}

@media screen and (max-width:950px) {

.ume{
	right: -150px;
}
	
}

@media screen and (max-width:550px) {

.ume{
	right: -25px;
	width: 240px;
	height: 165px;
	background: url(../restaurant-images/ume2.png) no-repeat 0 0;
}
	
}

@media screen and (max-width:450px) {

.ume{
	right: -50px;
}
	
}

@media screen and (max-width:400px) {

.ume{
	right: -75px;
}
	
}

@media screen and (max-width:350px) {

.ume{
	right: -100px;
}
	
}