@charset "UTF-8";

/*
	Reset CSS
-----------------------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
html{
	font-size:62.5%;
}
body{
	margin:0 auto;
	padding:0;
	font-size:1.5em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
	font-weight:700;
	font-feature-settings: "palt";
	overflow-wrap: break-word;
}
p{
	line-height: 1.6;
}
ol li, ul li{
	list-style: none;
}
@media screen and (min-width:813px){
	/* iPad背景切れ対策 */
	body{
		min-width:1200px;
	}
	/* 電話リンクなし */
	a[href^=tel]{
		pointer-events:none;
	}
}
*,*::before,*::after{
	box-sizing:border-box;
}
img {
	width: 100%;
	border: none;
	vertical-align: top;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
a {
	color: #000;
	text-decoration: none;
	transition: color 0.2s, opacity 0.2s;
}
a:link {
	color: var(--bk);
}
a:visited {
	color: var(--bk);
}
a:hover {
	color: var(--bk);
	opacity: 0.7;
	text-decoration: none;
}
/* 表示切替 */
.switch {
	visibility: hidden;
}
.sp{
	display:none;
}
@media screen and (max-width:812px){
	body{
		-webkit-text-size-adjust:100%;
	}
	.pc{
		display:none;
	}
	.sp{
		display:block;
	}
	br.sp{
		display:inline-block;
	}
}


/*
	common
-----------------------------------------------------------------------------------------------*/
:root{
	/* color */
	--bl: #00408f;
	--or: #ff8b02;
	--br: #74502e;
	--be: #c29135;
	--gr: #6c7900;
	--wh: #fff;
	--bk: #000;
	/* font */
	--light: 100;
	--medium: 500;
	--bold: 700;
	--exBold: 900;
}

/* テキストリンク */
a.txtLink{
	text-decoration:underline;
	transition:color 0.2s;
}
a[class^="txtLink"]:hover{
	text-decoration:none;
	opacity: 1.0;
}
a.txtLink:hover{
	color:#000;
}
a.txtLink_window{
	position: relative;
}
a.txtLink_window::after{
	content: "";
	width: 15px;
	height: 14px;
	background: url("../images/ico_window.svg") center center no-repeat;
	background-size: cover;
	position: absolute;
	top: 50%;
	right: -20px;
	transform: translateY(-50%);
}

/* flexBox */
.flexBox{
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.flexBox__jstCtt_btwn{
	-ms-justify-content: space-between;
	justify-content: space-between;
}
.flexBox__jstCtt_cntr{
	-ms-justify-content: center;
	justify-content: center;
}
.flexBox__jstCtt_end{
	-ms-justify-content: flex-end;
	justify-content: flex-end;
}
.flexBox__alinItm_cntr{
	-ms-align-items: center;
	align-items: center;
}
.flexBox__alinItm_top{
	-ms-align-items: flex-start;
	align-items: flex-start;
}
.flexBox__alinItm_end{
	-ms-align-items: flex-end;
	align-items: flex-end;
}
.flexBox__direction_colu{
	-ms-flex-direction: column;
	flex-direction: column;
}
.flexBox__direction_rore{
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
}

/* フェードイン */
.fadeIn {
	opacity : 0;
	transform: translateY(40px);
	transition: transform 1.0s;
}
@media screen and (max-width:812px){	
	.fadeIn {
	  transform: translateY(20px);
	}
}

/* コンテンツ */
#wrapper{
	min-width: 1300px;
	position: relative;
	overflow: hidden;
}
@media screen and (min-width:812px){
	/* iPad背景切れ対策 */
	#wrapper{
		min-width:1300px;
	}
}
.ctsArea{
	width: 1300px;
	margin: 0 auto;
	padding: 80px 30px;
}
@media screen and (max-width:812px){
	#wrapper{
		min-width: 100%;
	}
	.ctsArea{
		width: 100%;
		max-width: 500px;
		padding: 40px 20px;
	}
}

/* タイトル */
.tit__slash{
	margin-bottom: 20px;
	text-align: center;
}
.tit__slash span{
	display: inline-block;
	font-size: 2.4rem;
	font-weight: var(--bold);
	color: var(--br);
	position: relative;
}
.tit__slash span::before,
.tit__slash span::after{
	content: '';
	width: 3px;
	height: 100%;
	background-color: var(--br);
	position: absolute;
	bottom: 0;
}
.tit__slash span::before{
	left: -25px;
	transform: rotate(-45deg);
}
.tit__slash span::after{
	right: -25px;
	transform: rotate(45deg);
}
@media screen and (max-width:812px){
	.tit__slash{
		margin-bottom: 15px;
	}
	.tit__slash span{
		font-size: 2.0rem;
	}
	.tit__slash span::before,
	.tit__slash span::after{
		height: 90%;
	}
	.tit__slash span::before{
		left: -20px;
	}
	.tit__slash span::after{
		right: -20px;
	}
}

/* ボタン */
.btnBase{
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
	padding: 30px 0 0;
}
a.btnBase__item{
	display: block;
	width: 390px;
	padding: 30px;
	font-size: 1.9rem;
	font-weight: var(--bold);
	color: #2e1000;
	background-color: #cfa961;
	text-align: center;
	border-radius: 5px;
	filter: drop-shadow(0 0 10px rgba(0,0,0,.1));
	position: relative;
}
a.btnBase__item::after{
	content:' ';
	display:block;
	width:10px;
	height:10px;
	border-top:2px solid #2e1000;
	border-right:2px solid #2e1000;
	transform:translateY(-50%) rotate(45deg);
	transform-origin:0 0;
	position:absolute;
	top:50%;
	right:25px;
	margin-top: -2px;
}
a.btnBase__item_s{
	width: 300px;
	padding: 20px;
	font-size: 1.6rem;
	color: var(--wh);
	background-color: var(--em);
}
	a.btnBase__item_s::after{
		border-top:3px solid var(--wh);
		border-right:3px solid var(--wh);
	}

a.btnBase__item::before{
	content: "";
	width: 100%;
	height: 100%;
	border-radius: 50px;
	background: rgba(255, 255, 255, 0.15);
	transform-origin: center;
	transform: scaleX(0);
	position: absolute;
	left: 0;
	top: 0;
	transition: transform 0.3s;
}
a.btnBase__item:last-of-type{
	margin: 0;
}
@media screen and (max-width:812px){
	.btnBase{
		display: block;
		padding: 40px 0 0;
	}
	a.btnBase__item{
		width: 100%;
		padding: 20px;
		margin: 0 auto 10px auto;
		font-size: 1.6rem;
		filter: drop-shadow(0 0 10px rgba(0,0,0,.1));
	}
	a.btnBase__item::after{
		right:20px;
		margin:-2px 0 0 0;
	}
	a.btnBase__item:last-of-type{
		margin: 0 auto;
	}
}

/* 別窓リンク */
a.btnBase__item .window::after{
	content: " ";
	display: inline-block;
	width: 14px;
	height: 14px;
	margin: 0 0 0 5px;
	background:url(../images/ico_window.svg) center center no-repeat;
	background-size: contain;
}
@media screen and (max-width:812px){
	a.btnBase__item .window::after{
		width: 15px;
		height: 13px;
	}
}

/* table */
.tblBase{
	width:100%;
	border-collapse:collapse;
	border-top:1px solid #bec6c6;
	border-bottom:1px solid #bec6c6;
}
.tblBase th,.tblBase td{
	padding:25px 0;
	line-height:1.6;
	border-bottom:1px solid #bec6c6;
}
.tblBase th{
	width:160px;
	font-size: 1.6rem;
	font-weight:600;
	color: #0075C1;
	text-align: left;
	vertical-align: top;
}
@media screen and (max-width:812px){
	.tblBase{
		width:100%;
		border-top:none;
	}
	.tblBase tr,.tblBase th,.tblBase td{
		display:block;
	}
	.tblBase th,.tblBase td{
		width:100%;
	}
	.tblBase th{
		min-width:auto;
		padding:10px;
		border-top:1px solid #bec6c6;
		border-bottom:none;
		text-align: center;
		background-color: #F5F5F5;
	}
	.tblBase td{
		padding:10px 0 25px 0;
		border-bottom:none;
	}
}

/* list */
.listBase{
	margin: -5px 0 0;
	position:relative;
}
.listBase__item{
	display: inline-block;
	padding:5px 20px 0 15px;
	position: relative;
}
.listBase__item::before {
	content:'●';
	font-size:1.0rem;
	color:#06A33E;
	position:absolute;
	top: 8px;
	left:0;
}


/*
	header
-----------------------------------------------------------------------------------------------*/
#header{
	width: 100%;
	position: absolute;
	top: 0;
	z-index: 99;
}
#header__logo{
	width: 170px;
	margin: 25px 0 0 25px;
}
@media screen and (max-width:812px){
	#header__logo{
		width: 120px;
		margin: 15px 0 0 15px;
	}
}

/* subNav */
.subNav{
	position: absolute;
	right: 80px;
}
#subNav__top{
	top: 0;
}
#subNav__btm{
	top: -37px;
}
.subNav__item:first-of-type{
	margin-right: 10px;
}
a.subNav__btn{
	display: inline-block;
	padding: 12px 25px 12px 12px;
	font-size: 1.3rem;
	font-weight: var(--bold);
	color: var(--wh);
	line-height: 1.0;
	border-radius: 0 0 5px 5px;
	position: relative;
}
#subNav__btm a.subNav__btn{
	border-radius: 5px 5px 0 0;
}
a.subNav__btn::after{
	content:' ';
	display:block;
	width:8px;
	height:8px;
	margin-top: -2px;
	border-top:2px solid var(--wh);
	border-right:2px solid var(--wh);
	transform:translateY(-50%) rotate(45deg);
	transform-origin:0 0;
	position:absolute;
	top:50%;
	right:8px;
}
.subNav__btn_01{
	background-color: var(--bl);
}
/*.subNav__btn_02{
	background-color: var(--or);
}*/
@media screen and (max-width:812px){
	.subNav{
		right: 0;
		margin: 0 15px 0 0;
	}
	.subNav__item:first-of-type{
		margin-right: 0;
	}
}
/*
	kv
-----------------------------------------------------------------------------------------------*/
#kv{
	width: 100vw;
	min-width: 1300px;
	height: 740px;
	background:url("../images/kv_bg.png") center center no-repeat;
	background-size: cover;
	position: relative;
	z-index: 3;
}
.kv__inner{
	width: 100%;
	max-width: 1300px;
	height: 100%;
	margin: 0 auto;
	padding: 0 80px;
	position: relative;
}
.kv__logoArea{
	display: inline-block;
	margin-top: 85px;
	text-align: center;
}
.kv__logo{
	width: 765px;
}
.kv__txt{
	width: 400px;
	margin: 25px auto 0 80px;
}
.kv__phArea{
	position: absolute;
	right: -165px;
	bottom: 0;
}
.kv__phArea--inner{
	width: 866px;
	background:url("../images/kv_cafe_bg.png") bottom center no-repeat;
	background-size: contain;
}
.kv__ph__slider{
	width: 410px;
	margin: 0 150px 88px auto;
}
.kv__bnr{
	width: 244px;
	height: 222px;
	display: inline-block;
	position: absolute;
	right: 85px;
	bottom: -122px;
}
@media screen and (max-width:812px){
	#kv{
		width: 100%;
		height: 100%;
		min-width: 100%;
	}
	.kv__inner{
		width: 100%;
		padding: 20px 0 0 0;
	}
	.kv__logoArea{
		display: block;
		width: 95%;
		max-width: 350px;
		margin: 0 auto;
		padding-top: 70px;
		position: relative;
		z-index: 1;
	}
	.kv__logo{
		width: 100%;
	}
	.kv__txt{
		position: absolute;
		bottom: -80px;
		left: 10px;
		width: 80%;
		margin: 0;
	}
	.kv__phArea{
		position:static;
		height: 100%;
		display: flex;
		justify-content: flex-end;
		width: 100%;
		max-width: 450px;
		margin: 0 auto;
	}
	.kv__phArea--inner{
		width:95%;
		height: 95%;
		align-items: flex-end;
		margin: 0 -30px 0 0;
	}
	.kv__ph__slider{
		width: 60%;
		max-width: 200px;
		margin: 0 40px 45px auto;
	}
	.kv__bnr{
		width: 120px;
		height: auto;
		display: inline-block;
		position: absolute;
		right: 0;
		bottom: -60px;
	}
}

/*
	about
-----------------------------------------------------------------------------------------------*/
#about{
	background:url("../images/about_bg.png") bottom center no-repeat;
	background-size: cover;
	position: absolute;
	top:0;
}
#about.ctsArea{
	width: 100%;
	padding: 120px 30px 80px 30px;
}
.about__cts{
	text-align: center;
	margin-bottom: 70px;
}
.about__txtArea{
	color: var(--wh);
	width: 100%;
	letter-spacing: 0.1rem;
}
.about__tit{
	margin-bottom: 20px;
}
.about__tit-arche{
	width: 380px;
	margin: 0 auto 30px auto;
}
.about__tit-straight{
	font-size: 3.2rem;
	font-weight: var(--bold);
	letter-spacing: 0.3rem;
}
.about__txt{
	font-size: 1.7rem;
	font-weight: var(--medium);
	line-height: 2;
	letter-spacing: 0.2rem;
}
@media screen and (max-width:812px){
	.about__cts{
		max-width: 500px;
		margin: 0 auto 80px;
	}
	#about.ctsArea{
		width: 100%;
		max-width: 100%;
		padding: 80px 20px;
	}
	.about__tit{
		margin-bottom: 10px;
	}
	.about__tit-arche{
		width: 100%;
		max-width: 240px;
		margin: 0 auto 20px auto;
	}
	.about__tit span{
		margin-bottom: 5px;
		padding: 3px 10px;
		font-size: 2rem;
		line-height: 1.6;
		letter-spacing: 0.2rem;
	}
	.about__txt{
		font-size: 1.6rem;
		line-height: 1.4;
		letter-spacing: 0.1rem;
	}
}

/*
	merit
-----------------------------------------------------------------------------------------------*/
#merit.ctsArea__bg{
	background:url("../images/merit_bg.png") center center repeat;
	background-size: contain;
	padding: 580px 0 100px 0;
	position: relative;
	z-index: 2;
}
#merit.ctsArea__bg::before {
	bottom: -56px;
	background: url("../images/merit_bg_parts.png") center no-repeat;
	background-size: contain;
	content: "";
	width: 250px;
	height: 56px;
	left: 50%;
	position: absolute;
	transform: translateX(-50%);
	z-index: 2;
}
.merit__titArea{
	text-align: center;
}
.merit__tit{
	width: 344px;
	margin: 0 auto;
}
.merit__list-cts{
	width: 1180px;
	margin: 0 auto;
}
.merit__txt{
	color: var(--br);
	font-size: 3.2rem;
	font-weight: var(--bold);
	letter-spacing: 0.2rem;
}
.merit__item{
	width: 567px;
	display: flex;
	align-items: center;
	margin:0 0 40px 0;
}
.merit__item-cts{
	position: relative;
	z-index: 1;
}
.merit__item-txt{
	position: absolute;
	text-align: center;
	font-size: 2.4rem;
	color: var(--wh);
	z-index: 2;
	top: 50%;
	transform: translate(0,-50%);
	letter-spacing: 0.3rem;
	line-height: 1.6;
}
.item__txt-green{
	color: var(--gr);
}
.item__txt01{
	left: 70px;
	margin: 35px 0 0 0;
}
.item__txt02{
	left: 60px;
	margin: 80px 0 0 0;
}
.item__txt03{
	left: 50px;
	margin: 45px 0 0 0;
}
.item__txt04{
	left: 80px;
	margin: -20px 0 0 0;
}
.item__txt05{
	left: 80px;
	margin: -95px 0 0 0;
}
.item__txt06{
	left: 90px;
	margin: 70px 0 0 0;
}
@media screen and (max-width:812px){
	#merit.ctsArea__bg{
		width: 100%;
		position: relative;
		z-index: 2;
		padding: 500px 0 100px 0;
	}
	#merit.ctsArea__bg::before {
		bottom: -34px;
		width: 150px;
		height: 34px;
	}
	.merit__cts{
		padding: 0 20px;
	}
	.merit__list-cts{
		width: 100%;
	}
	.merit__list{
		justify-content: center;
	}
	.merit__titArea{
		margin: 0 0 40px 0;
	}
	.merit__tit{
		width: 80%;
		max-width: 300px;
	}
	.merit__txt{
		font-size: 2rem;
		letter-spacing: 0.1rem;
		line-height: 1.4;
	}
	.merit__item{
		width: 50%;
		margin:0 0 20px 0;
		max-width: 450px;
	}
	.merit__item-txt{
		font-size: 1.6rem;
		z-index: 2;
		letter-spacing: 0.2rem;
		line-height: 1.4;
	}
	.item__txt01{
		left: 10%;
		margin: 20px 0 0 0;
	}
	.item__txt02{
		left: 10%;
		margin: 40px 0 0 0;
	}
	.item__txt03{
		left: 10%;
		margin: 20px 0 0 0;
	}
	.item__txt04{
		left: 10%;
		margin: -15px 0 0 0;
	}
	.item__txt05{
		left: 10%;
		margin: -60px 0 0 0;
	}
	.item__txt06{
		left: 10%;
		margin: 40px 0 0 0;
	}
}
@media screen and (max-width:600px){
	.merit__item-txt{
		font-size: 1.7rem;
	}
	.merit__item{
		width: 100%;
		margin:0 0 20px 0;
		max-width: 450px;
	}
	.merit__item:nth-of-type(1){
		margin:0;
	}
	.merit__item:nth-of-type(2){
		margin:0 0 45px 0;
	}
	.merit__item:nth-of-type(3){
		margin:0 0 60px 0;
	}
	.merit__item:nth-of-type(4){
		margin:0 0 50px 0;
	}
	.merit__item:nth-of-type(5){
		margin:0 0 10px 0;
	}
	.merit__item:nth-of-type(6){
		margin:0;
	}
	.item__txt01{
		top: 60%;
		left: 10%;
		margin: 0;
	}
	.item__txt02{
		top: 55%;
		left: 10%;
		margin: 0;
	}
	.item__txt03{
		top: 60%;
		left: 10%;
		margin: 0;
	}
	.item__txt04{
		top: 45%;
		left: 10%;
		margin: 0;
	}
	.item__txt05{
		top: 25%;
		left: 10%;
		margin: 0;
	}
	.item__txt06{
		top: 65%;
		left: 10%;
		margin: 0;
	}
}
/*
	menu
-----------------------------------------------------------------------------------------------*/
#menu.ctsArea__bg{
	background:url("../images/menu_lineup_bg.png") center center repeat;
	background-size: contain;
	padding: 140px 0 800px 0;
	position: relative;
	z-index: 1;
}
.menu__titArea{
	text-align: center;
	margin: 0 0 60px 0;
}
.menu__tit{
	width: 606px;
	margin: 0 auto 16px auto;
}
.menu__item{
	position: relative;
}
.menu__item-onecolumn{
	width: calc((100% - 60px)/1);
}
.m__list02{
	margin: 130px 0 0 160px;
}
.m__list03{
	margin: -50px 80px 0 0;
}
.m__list04{
	margin: 300px 0 0 0;
}
.m__list05{
	margin: -50px 150px 0 0;
}
.menu__list-cts{
	width: 1040px;
	margin: 0 auto;
	position: relative;
}
.menu__txt{
	color: var(--bk);
	font-size: 2.4rem;
	font-weight: var(--bold);
	letter-spacing: 0.2rem;
	line-height: 1.8;
}
.menu__item-ph{
	display: block;
	cursor: pointer;
	width: 100%;
}
.m__item-ph01{
	width: 434px;
}
.m__item-ph02{
	width: 323px;
}
.m__item-ph03{
	width: 323px;
}
.m__item-ph04{
	width: 323px;
}
.m__item-ph05{
	width: 323px;
}
.menu__item-tit{
	position: absolute;
}
.m__item-tit01{
	width: 410px;
	top: 0;
	left: 370px;
}
.m__item-tit02{
	width: 288px;
	top: -50px;
	left: -115px;
}
.m__item-tit03{
	width: 297px;
	top: -50px;
	left: 100px;
}
.m__item-tit04{
	width: 261px;
	top: 100px;
	left: 280px;
}
.m__item-tit05{
	width: 319px;
	top: 250px;
	left: 160px;
}
.menu__item-txt{
	font-size: 1.7rem;
	font-weight: var(--medium);
	line-height: 2.2;
	letter-spacing: 0.2rem;
	position: absolute;
}
.m__item-txt01{
	width: 410px;
	left: 480px;
	top: 50%;
	margin: -30px 0 0 0;
	transform: translate(0,-50%);
}
.m__item-txt04{
	width: 323px;
	left: 350px;
	top: 50%;
	margin: 30px 0 0 0;
}
.menu__arrow-01{
	width: 213px;
	position: absolute;
	left: 350px;
	bottom: 150px;
}
.menu__arrow-02{
	width: 160px;
	position: absolute;
	left: -80px;
	bottom: 50px;
}
.menu__arrow-03{
	width: 160px;
	position: absolute;
	right: -110px;
	bottom: 180px;
}
.menu__arrow-04{
	width: 162px;
	position: absolute;
	right: -105px;
	bottom: 20px;
}
.menu__arrow-05{
	width: 44px;
	position: absolute;
	left: 80px;
	bottom: 250px;
}
.menu__list-parts01{
	width: 230px;
	position: absolute;
	top: -75px;
	right: -185px;
}
.menu__list-parts02{
	width: 188px;
	position: absolute;
	top: 50%;
	left: 220px;
	transform: translate(0,-50%);
	margin: 350px 0 0 0;
}
.menu__list-parts03{
	width: 102px;
	position: absolute;
	bottom: 0;
	right: -50px;
	margin: 150px 0 0 0;
}
.menu__list-parts04{
	width: 418px;
	position: absolute;
	bottom: -400px;
	left: -220px;
	margin: 150px 0 0 0;
}
.menu__list-parts05{
	width: 265px;
	position: absolute;
	bottom: -220px;
	right: 20px;
	margin: 150px 0 0 0;
}
.menu__recipe{
	width: 200px;
}
.m__recipe-link-inner {
	position: relative;
}
.m_recipe_link-txt{
	width: 130px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.m__recipe-link{
	width: 201px;
	height: auto;
	position: absolute;
}
.m__recipe-link01{
	bottom: 126px;
	left: 576px;
}
.m__recipe-link02{
	bottom: -60px;
	left: -230px;
}
.m__recipe-link03{
	bottom: 75px;
	right: -120px;
}
.m__recipe-link04{
	bottom: -80px;
	right: -250px;
}
.m__recipe-link05{
	top: 480px;
	right: -20px;
}
a.m__recipe-link{
	cursor: pointer;
}
#recipe01,
#recipe02,
#recipe03,
#recipe04,
#recipe05 {
	width: 100%;
}
#border01 path,
#border02 path,
#border03 path,
#border04 path,
#border05 path {
	fill:#c29135; /* 塗りの色 */
}
#mask01 path,
#mask02 path,
#mask03 path,
#mask04 path,
#mask05 path {
	fill:none; /* 塗りの色 */
	stroke:#fff; /* 線の色 */
	stroke-width:2.2px; /* 線幅 */
	stroke-linecap:round; /* 線端の形状 */
	stroke-linejoin:round; /* 角の形状 */
}
@media screen and (max-width:812px){
	.menu__list-cts{
		width: 100%;
		padding: 0 20px;
	}
	.menu__titArea{
		text-align: center;
		margin: 0 0 60px 0;
		padding: 0 20px;
	}
	.menu__tit{
		width: 100%;
		max-width: 606px;
	}
	.menu__txt{
	font-size: 2.3rem;
	line-height: 1.8;
	}
	.m__list02{
		margin: 100px 0 0 130px;
	}
	.m__list03{
		margin: -30px 70px 0 0;
	}
	.m__list04{
		margin: 200px 0 0 0;
	}
	.m__list05{
		margin: -30px 100px 0 0;
	}
	.m__item-ph01{
		width: 334px;
	}
	.m__item-ph02{
		width: 223px;
	}
	.m__item-ph03{
		width: 223px;
	}
	.m__item-ph04{
		width: 223px;
	}
	.m__item-ph05{
		width: 223px;
	}
	.m__item-tit01{
		width: 274px;
		top: 0;
		left: 300px;
	}
	.m__item-tit02{
		width: 192px;
		top: -35px;
		left: -80px;
	}
	.m__item-tit03{
		width: 198px;
		top: -35px;
		left: 50px;
	}
	.m__item-tit04{
		width: 174px;
		top: 50px;
		left: 190px;
	}
	.m__item-tit05{
		width: 210px;
		top: 170px;
		left: 100px;
	}
	.menu__arrow-01{
		width: 142px;
		left: 270px;
		bottom: 100px;
	}
	.menu__arrow-02{
		width: 107px;
		left: -60px;
		bottom: 0;
	}
	.menu__arrow-03{
		width: 107px;
		right: -60px;
		bottom: 140px;
	}
	.menu__arrow-04{
		width: 108px;
		right: -75px;
		bottom: 10px;
	}
	.menu__arrow-05{
		width: 30px;
		left: 60px;
		bottom: 190px;
	}
	.menu__item-txt{
		font-size: 1.6rem;
		line-height: 1.8;
	}
	.m__item-txt01{
		width: 220px;
		left: 380px;
		top: 50%;
		margin: -30px 0 0 0;
		transform: translate(0,-50%);
	}
	.m__item-txt04{
		width: 220px;
		left: 250px;
		top: 50%;
		margin: -20px 0 0 0;
	}
	.m_recipe_link-txt{
		width: 68%;
	}
	.m__recipe-link{
		width: 134px;
	}
	.m__recipe-link01{
		bottom: 70px;
		left: 430px;
	}
	.m__recipe-link02{
		bottom: -90px;
		left: -120px;
	}
	.m__recipe-link03{
		bottom: 35px;
		right: -65px;
	}
	.m__recipe-link04{
		bottom: -75px;
		right: -170px;
	}
	.m__recipe-link05{
		top: 315px;
		right: -15px;
	}
	.menu__list-parts01{
		width: 157px;
		top: -75px;
		right: -30px;
	}
	.menu__list-parts02{
		width: 126px;
		top: 50%;
		left: 220px;
		margin: 270px 0 0 0;
	}
	.menu__list-parts03{
		width: 68px;
		bottom: 0;
		right: 50px;
		margin: 150px 0 0 0;
	}
	.menu__list-parts04{
		width: 279px;
		bottom: -250px;
		left: -50px;
		margin: 0;
	}
	.menu__list-parts05{
		width: 177px;
		position: absolute;
		bottom: -150px;
		right: 100px;
		margin: 0;
	}
}
@media screen and (max-width:767px){
	#menu.ctsArea__bg{
	background-size: cover;
	padding: 100px 0 800px 0;
	position: relative;
	z-index: 1;
	}
	.menu__cts{
		padding: 0 20px;
	}
	.menu__titArea{
		width: 100%;
		margin: 0 0 100px 0;
	}
	.menu__tit{
		width: 100%;
	}
	.menu__txt{
		font-size: 2rem;
		line-height: 1.4;
		letter-spacing: 0.1rem;
	}
	.menu__list-cts{
		width: 100%;
	}
	.menu__list{
		display:flex;
		justify-content: center;
		position: relative;
		z-index: 1;
	}
	.menu__item-onecolumn{
		width: 100%;
		max-width: 350px;
	}
	.m__list02,
	.m__list03,
	.m__list04,
	.m__list05 {
		width: 100%;
		margin: 0;
		max-width: 350px;
	}
	.menu__item{
		margin: 0 0 100px 0;
		display: flex;
		flex-direction: column;
	}
	.menu__item:last-of-type{
		margin: 0;
	}
	.menu__item-ph {
		margin: 0 auto 20px auto;
	}
	.m__item-ph01,
	.m__item-ph02,
	.m__item-ph03,
	.m__item-ph04,
	.m__item-ph05,
	.m__item-ph06 {
		width: 100%
	}
	.m__item-tit01{
		width: 80%;
		max-width: 400px;
		top: -50px;
		left: 50%;
		transform: translate(-50%,0);
	}
	.m__item-tit02{
		width: 80%;
		max-width: 400px;
		top: -50px;
		left: 50%;
		transform: translate(-50%,0);
	}
	.m__item-tit03{
		width: 80%;
		max-width: 400px;
		top: -50px;
		left: 50%;
		transform: translate(-50%,0);
	}
	.m__item-tit04{
		width: 80%;
		max-width: 400px;
		top: -50px;
		left: 50%;
		transform: translate(-50%,0);
	}
	.m__item-tit05{
		width: 80%;
		max-width: 400px;
		top: -50px;
		left: 50%;
		transform: translate(-50%,0);
	}
	.m__item-tit06{
		width: 80%;
		max-width: 400px;
		top: -50px;
		left: 50%;
		transform: translate(-50%,0);
	}
	.m__item-txt01,
	.m__item-txt04{
		width:100%;
		position: static;
		transform:translate(0);
		margin: 0;
		order: 3;
		line-height: 1.6;
		letter-spacing: 0.1rem;
	}
	.menu__arrow-02,
	.menu__arrow-03,
	.menu__arrow-05{
		width: 107px;
		right: -25px;
		left: auto;
		bottom: 50px;
		transform:rotate(30deg);
	}
	.menu__arrow-01,
	.menu__arrow-04 {
		width: 107px;
		right: -25px;
		left: auto;
		bottom: 170px;
		transform:rotate(30deg);
	}
	.m__recipe-link02,
	.m__recipe-link03,
	.m__recipe-link05{
		width: 68%;
		max-width: 201px;
		height: auto;
		position: static;
		margin: 0 auto;
	}
	.m__recipe-link01,
	.m__recipe-link04{
		width: 68%;
		max-width: 201px;
		height: auto;
		position: static;
		margin: 0 auto 20px auto;
	}
	.menu__list-parts01{
		width: 230px;
		top: -80px;
		right: -70px;
	}
	.menu__list-parts02{
		width: 188px;
		top: 50%;
		left: -60px;
		margin: 450px 0 0 0;
	}
	.menu__list-parts03{
		width: 102px;
		bottom: 400px;
		right: -30px;
		margin: 0 0 0 0;
	}
	.menu__list-parts04{
		width: 418px;
		position: absolute;
		bottom: -150px;
		left: -220px;
		margin: 0;
	}
	.menu__list-parts05{
		width: 150px;
		bottom: -170px;
		right: -60px;
		margin: 0;
	}
}
/*
	cremia
-----------------------------------------------------------------------------------------------*/
#cremia.ctsArea__bg{
	padding: 140px 0;
	position: relative;
	width: 100%;
	margin: -400px auto 0 auto;
	z-index: 2;
}
#cremia.ctsArea__bg::before{
	content: "";
	position: absolute;
	top: -50px;
	left: 50%;
	transform: translate(-50%,0);
	width:500px;
	height:250px;
	display: inline-block;
	border-radius: 50% / 100% 100% 0 0;
	background: var(--wh);
}
.cremia_logotype{
	position: absolute;
	top:-150px;
	left: 50%;
	transform: translate(-50%,0);
	width:450px;
	margin: 0 0 0 -20px;
}
.cremia_Annotation{
	position: absolute;
	top:-230px;
	right: 0;
	width:210px;
}
.cremia__cts{
	width: 958px;
	position: relative;
	background: var(--wh);
	margin: 0 auto;
	padding: 80px;
	border-radius: 70px;
}
.cremia__cts-top{
	top:0;
	left: 0;
	position: relative;
}
.cremia__logo{
	position: absolute;
	width: 104px;
	margin: 0 0 25px 0;
}
.cremia__txtArea{
	margin: 140px 0 0 0;
}
.cremia__phArea{
	width: 260px;
	margin: -20px 20px 0 0;
}
.cremia__copy{
	font-size: 2.7rem;
	font-weight: var(--bold);
	letter-spacing: 0.5rem;
	line-height: 1.6;
	margin: 0 0 25px 0;
}
.cremia__txt{
	font-size: 1.7rem;
	font-weight: var(--medium);
	letter-spacing: 0.2rem;
	line-height: 2.2;
}
.cremia__cts-center{
	margin: 0 0 35px 0;
}
.cremia__point-list{
	display: flex;
}
.cremia__point-item{
	width: 100%;
	text-align: center;
	margin: 0 auto;
	border-right: 1px solid #000;
	border-left: 1px solid #000;
	padding: 20px;
}
.cremia__point-item:first-of-type{
	border-right: none;
	border-left: 1px solid #000;
}
.cremia__point-item:nth-of-type(2){
	min-width: 300px;
}
.cremia__point-item:last-of-type{
	border-right: 1px solid #000;
	border-left: none;
}
.cr__point-tit{
	width: 80px;
	margin: 0 auto 15px auto;
}
.cr__point-txt{
	font-size: 1.6rem;
	font-weight: var(--medium);
	letter-spacing: 0.2rem;
}
.cremia__menu-ph-list{
	gap: 35px;
}
.cr__menu-ph-item{
	width: 207px;
}
@media screen and (max-width:812px){
	#cremia.ctsArea__bg::before{
		display: none;
	}
	.cremia_logotype{
		top:-70px;
		width:85%;
		max-width:350px;
		margin: 0;
	}
	.cremia_Annotation{
		top:-350px;
		right: 50%;
		transform: translate(50%,0);
		width: 70%;
		max-width:200px;
	}
	.cremia__cts {
		width: 90%;
		border-radius: 35px;
		padding: 80px 30px;
	}
	.cremia__cts-top{
		padding: 0;
		flex-direction: column-reverse;
		margin: 0 0 50px 0;
	}
	.cremia__logo{
		width: 80px;
		top:0;
		left: 0;
		margin: 0;
	}
	.cremia__txtArea{
		margin: 0;
	}
	.cremia__phArea{
		width: 100%;
		max-width: 260px;
		margin: 0 auto;
	}
	.cremia__copy{
		font-size: 2rem;
		font-weight: var(--bold);
		letter-spacing: 0.3rem;
		line-height: 1.4;
		margin: 0 0 15px 0;
	}
	.cremia__txt{
		font-size: 1.6rem;
		line-height: 1.6;
		letter-spacing: 0.1rem;
	}
	.cremia__cts-center{
		margin: 0 0 50px 0;
	}
	.cremia__point-list{
		display: block;
	}
	.cr__point-tit{
	width: 70px;
	margin: 0 0 15px 0;
	}
	.cremia__point-item{
		width: 100%;
		border-right: none;
		border-left: none;
		border-bottom: 1px solid #000;
		padding: 40px 0;
		text-align: left;
	}
	.cremia__point-item:first-of-type,
	.cremia__point-item:nth-of-type(2),
	.cremia__point-item:last-of-type{
		border-right: none;
		border-left: none;
	}
	.cremia__point-item:first-of-type{
		padding: 0 0 40px 0;
	}
	.cremia__point-item:nth-of-type(2){
		min-width: auto;
	}
	.cremia__point-item:last-of-type{
		border-bottom: none;
		padding: 40px 0 0 0;
	}
	.cr__point-txt{
		font-size: 1.4rem;
		line-height: 1.4;
		letter-spacing: 0.1rem;
	}
	.cremia__menu-ph-list{
		gap: 20px;
	}
	.cr__menu-ph-item{
		width: 100%;
		max-width: 207px;
	}
}
/*
	事業者の方へ
-----------------------------------------------------------------------------------------------*/
#business.ctsArea__bg{
	background:url("../images/business_bg.png") center center repeat;
	background-size: cover;
	padding: 200px 0 150px 0;
	position: relative;
	border-radius: 54px 54px 0 0;
	z-index: 1;
	margin: -280px auto 0 auto;
}
.business__cts{
	width: 814px;
	position: relative;
	margin: 0 auto;
	border-radius: 70px;
}
.business__logo{
	width: 208px;
	margin: 0 auto 40px auto;
	opacity: 0.3;
}
.business__infoArea{
	position: relative;
}
.business__infoArea::before{
	content: "";
	width: 737px;
	height: 410px;
	background:url("../images/business_cafe_bg.png") center center no-repeat;
	background-size: cover;
	opacity: 0.5;
	position: absolute;
	top: 0;
	right: -250px;
}
.business__txtArea{
	position: relative;
	margin: 0 0 40px 0;
}
.business__copy{
	display: inline;
	color: var(--wh);
	font-size: 2.9rem;
	letter-spacing: 0.3rem;
	line-height: 2.2;
	border-bottom: 1px solid var(--wh);
	padding: 0 0 12px 0;
}
.business__txt{
	color: var(--wh);
	font-size: 1.8rem;
	font-weight: var(--medium);
	line-height: 2.2;
	letter-spacing: 0.2rem;
	margin: 30px 0 0 0;
}
.business__phArea{
	position: absolute;
	width: 248px;
	right: 50px;
	bottom: 0;
}
@media screen and (max-width:812px){
	#business.ctsArea__bg{
		border-radius: 35px 35px 0 0;
		padding: 200px 0 120px 0;
	}
	.business__txt{
		font-size: 1.6rem;
		text-align: left;
	}
	.business__cts{
		width: 100%;
		max-width: 620px;
		margin: 0 auto;
		padding: 0 20px;
	}
	.business__phArea{
		position: static;
		display: block;
		margin: 0 auto;
		width: 100%;
		max-width: 200px;
	}
	.business__copy{
		font-size: 2rem;
		line-height: 2;
		padding: 0 0 8px 0;
		letter-spacing: 0.2rem;
	}
	.business__txt{
		font-size: 1.6rem;
		line-height: 1.6;
		margin: 20px 0 0 0;
		letter-spacing: 0.1rem;
	}
}


/*
	pageTop
-----------------------------------------------------------------------------------------------*/
a#pageTop{
	width:70px;
	height:70px;
	margin-bottom: 45px;
	background:url("../images/pageTop.svg") center no-repeat;
	position: absolute;
	right: 30px;
	z-index: 98;
}
@media screen and (max-width:812px){
	a#pageTop{
		width:60px;
		height:60px;
		margin: 0 0 30px 0;
		right: 15px;
	}
}


/*
	footer
-----------------------------------------------------------------------------------------------*/
#footer{
	padding: 30px;
	font-weight: var(--medium);
	background: #f8f3e9;
	position: relative;
	z-index: 2;
}
.footer__top{
	margin: 0 0 15px;
}
@media screen and (max-width:812px){
	#footer{
		display: block;
		padding: 15px 20px;
		text-align: center;
	}
	.footer__top{
		display: block;
	}
	.footer__btm{
		display: block;
	}
	#footer_copyright{
		margin: 10px 0 0;
	}
}

a.footer__txtLink{
	padding: 0 0 0 20px;
	position: relative;
}
.footer__txtLink::before{
	content: "";
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: var(--bk);
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
}
.footer__txtLink::after{
	content: "";
	width: 4px;
	height: 4px;
	border-top: 1px solid var(--wh);
	border-right: 1px solid var(--wh);
	position: absolute;
	top: 50%;
	transform: translateY(-50%) rotate(45deg);
	left: 5px;
}
@media screen and (max-width:812px){
	a.footer__txtLink{
		display: inline-block;
		margin: 10px 0 0;
	}
}

#footer__list li{
	margin: 0 15px 0 0;
	padding: 0 20px 0 0;
	font-size: 1.3rem;
	position: relative;
}
#footer__list li:last-of-type{
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}
#footer__list li::after{
	content:'|';
	position: absolute;
	right: 0;
}
#footer__list li a{
	text-decoration: underline;
}
#footer__list li a:hover{
	opacity: 1.0;
	text-decoration: none;
}
#footer__list li:last-of-type::after{
	content:none;
}
@media screen and (max-width:812px){
	#footer__list{
		-ms-justify-content: center;
		justify-content: center;
		margin: 0 0 -5px;
	}
	#footer__list li{
		margin: 0 15px 5px 0;
	}
	#footer__list li:last-of-type{
		margin: 0 0 5px 0;
	}
}