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

/*===============================================
●共通
===============================================*/
.wf-loading {visibility: hidden;}
.wf-active {visibility: visible;}
.bkgKigou {
	background-color: #b9c3c9;
	text-align: center;
}
.slideBox li img {width: 100%;}

/* pageContents
-----------------------------------------------*/
#pageContents .flexBox .img {position: relative;}
#pageContents .textBox h3 {letter-spacing: 0.2em;}
#cuisinesBox #resutaurantLogo p {color: #fff;}

/* cuisinesWrap */
#cuisinesBox #resutaurantLogo {
	background-color: #778288;
	text-align: center;
}

/*===============================================
●画面の横幅が729px以下(スマホのみ)
===============================================*/
@media screen and (max-width: 769px) {
	
	#mainImage > div {height: auto;}
	
	/* firstWrap
	-----------------------------------------------*/
	#firstWrap.inner {padding: 0.5em 0 2em;}
	#firstWrap .pageTitle {margin-left: 1em;}
	#firstWrap .flexBox p {
		font-size: 1.1em;
		text-align: center;
	}
	#firstWrap .flexBox .text > p:first-of-type {margin-bottom: 2em;}
	#firstWrap .flexBox .text > p:nth-of-type(2) {margin-bottom: 3em;}
	#firstWrap .flexBox .text .flexBox .btnLeft {margin-bottom: 1.5em;}
	#firstWrap .text p {padding: 0 1em;}

	/* bkgKigou */
	.bkgKigou {padding: 0.5em 0;}
	.bkgKigou img {width: 70%;}
	
	/* pageContents
	-----------------------------------------------*/
	#pageContents {padding: 0;}
	#pageContents section h2 {
		font-size: 1.4em;
		margin-bottom: 1em;
	}
	#pageContents section {padding-top: 5.5em;}
	#pageContents section .textBox {text-align: center;}
	#pageContents section h3 {
		font-size: 1.2em;
		margin-bottom: 3em;
		line-height: 1.75;
	}
	#pageContents section .conIntro {
		padding: 2.75em 3.25em 0;
		letter-spacing: 0.2em;
	}
	
	/* cuisinesWrap */
	#cuisinesBox {margin-bottom: 7em;}
	#cuisinesBox #resutaurantLogo {
		height: 215px;
		display: flex;
		justify-content: flex-end;
		align-items: flex-end;
	}
	#cuisinesBox #resutaurantLogo p {
		font-size: 0.54em;
		padding: 3em;
		text-align: center;
	}
	#cuisinesBox .conIntro {margin-bottom: 5.6em;}
	#pageContents section .conIntro {
		font-size: 1.1em;
		line-height: 2em;
		text-align: center;
	}

	/* --------------------------------------------------------
	英語版ページの微調整
	-------------------------------------------------------- */

	body.englishPage #pageContents .textBox h3 br {
		display: none;
	}
}

/*===============================================
●画面の横幅が770px以上(PCのみ)
===============================================*/
@media screen and (min-width: 770px) {
	
	#conceptWrap section {margin-bottom: 10em;}
	.flexBox {
		display: flex;
		justify-content: center;
	}
	.slideBox {width: 100%;}
	.bx-viewport {max-height: 900px;}
	#mainImage {height: auto;}
	#pageContents .bx-viewport {height: 400px!important;}
	#pageContents .slideBox {width: 100%;}
	#pageContents .slideBox li {width: 700px!important;}

	/* firstWrap
	-----------------------------------------------*/
	#firstWrap .flexBox .img {
		width: 15%;
		margin-right: 7%;
	}
	#firstWrap .flexBox .text {
		width: 50%;
		min-width: 465px;
	}
	#firstWrap .flexBox .text > p {
		font-size: 1.15em;
	}
	#firstWrap .flexBox .text > p:first-of-type {margin-bottom: 2em;}
	#firstWrap .flexBox .text > p:nth-of-type(2) {margin-bottom: 2.8em;}
	#firstWrap .flexBox .text .flexBox {justify-content: unset;}
	#firstWrap .flexBox .text .flexBox .btnLeft {margin-right: 1.5em;}
	#firstWrap .linkBtn {width: 35%;}
	#firstWrap .linkBtn a {width: 100%;}
	#firstWrap .linkBtn a p {text-align: center;}
	
	/* bkgKigou */
	.bkgKigou  {
		padding: 2em 0;
		margin-bottom: 10em;
	}
	.bkgKigou img {width: 30%;}
	
	/* pageContents
	-----------------------------------------------*/
	#pageContents {margin-bottom: 15em;}
	#pageContents .flexBox .textBox {
		width: 25%;
		text-align: center;
	}
	#pageContents .flexBox .img,
	#pageContents .conIntro {
		padding-top: 3em;
		line-height: 2.5;
	}
	#pageContents .conIntro {
		font-size: 1.2em;
	}
	#pageContents .flexBox .img {width: 75%;}
	#pageContents .textBox h2 {
		font-size: 1.4em;
		margin: 3em 0 4em;
	}
	#pageContents .textBox h3 {
		font-size: 1.25em;
		line-height: 2.5em;
		writing-mode: vertical-rl;
		display: inline-block;
		text-align: justify;
	}
	
	/* landScapeWrap */
	#landScapeWrap .flexBox .img {text-align: right;}
	
	/* relaxationWrap */
	#relaxationWrap .flexBox {flex-direction: row-reverse;}
	#relaxationWrap .flexBox .img .conIntro {
		padding-left: 5%;
		text-align: right;
	}
	
	/* cuisinesWrap */
	#cuisinesWrap {padding-top: 4em;}
	#cuisinesWrap .textBox h2 {margin-top: 1em;}
	#cuisinesBox {width: 75%;}
	#cuisinesBox #resutaurantLogo {
		height: 400px;
		background-color: #778288;
		text-align: center;
		padding-top: 7em;
	}
	#cuisinesBox #resutaurantLogo  div {margin-top: -1em;}
	#cuisinesBox #resutaurantLogo  div img:not(:last-child) {margin-right: 10em;}
	#cuisinesBox #resutaurantLogo p {
		display: inline-block;
		text-align: center;
		padding-top: 4.5em;
	}
	#cuisinesBox > p {margin-bottom: 3em;}
	#cuisinesBox .linkBtn {text-align: left;}
	#cuisinesBox .linkBtn a {padding: 0.8em 4em 0.7em;}
	#cuisinesBox .linkBtn p {padding: 0;}
	
	/* --------------------------------------------------------
	英語版ページの微調整
	-------------------------------------------------------- */

	body.englishPage .contentsWrap .contentsHead h3 {
		line-height: 2;
	}

	/* firstWrap */
	body.englishPage #firstWrap .linkBtn {
		width: unset;
	}
}