@charset "UTF-8";
html {font-size: 62.5%;}
body {
	font-size: 1.6em;
	line-height: 1.4em;
	margin: auto;
	position: relative;
	min-width: 320px;
}
body * {
	color: #333;
	font-weight: 400;
	font-family: 'Shippori Mincho', serif;
	letter-spacing: .1rem;
}
img {max-width: 100%;}
a {text-decoration: none;}
a, a:hover, a img, a:hover img, a::after, a:hover::after, a::before, a:hover::before, a:hover span, a span {transition: 0.3s; -webkit-transition: 0.3s;}
.absolute {position: absolute;}
.relative {position: relative;}
a {outline: none;}
.flex {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.en {
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
}
.txtC {text-align: center;}
.inner {
	max-width: 1000px;
	margin: auto;
}

header {
	width: 100%;
	height: 100vh;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
header .bg {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(1.2);
	width: 100%;
	height: 100%;
	background-image: url(../images/mv.jpg);
	background-size: cover;
	background-position: center;
	transition: 2.2s;
	filter: blur(10px);
}
.after_load header .bg {
	filter: blur(0px);
	transform: translate(-50%, -50%) scale(1.02);
}
.iphone header .bg,
.android header .bg {background-image: none;}
.iphone header .bg::after,
.android header .bg::after {
	content: "";
	width: 100%;
	height: 100%;
	background-image: url(../images/mv_sp.jpg);
	background-size: cover;
	background-position: center;
	position: absolute;
	top: 0;
	left: 0;
}

header .txt {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	z-index: 2;
	width: calc(100% - 40px);
}
header .txt h1 {
	max-width: 160px;
	margin: auto;
	filter: drop-shadow(0 0 30px rgba(0, 0, 0, .2));
	transition: 1s;
	opacity: 0;
}
.after_load header .txt h1 {
	transition-delay: .3s;
	opacity: 1;
}
header .txt p {
	font-size: 2.3rem;
  color: #fff;
  letter-spacing: 0.5rem;
  line-height: 1.6;
	text-shadow: 0 0 30px rgba(0, 0, 0, .5);
	opacity: 0;
	transition: .5s;
	height: 0;
	margin: 0;
}
.after_load header .txt p {
	opacity: 1;
	transform: translateY(0px);
	transition-delay: 1.12s;
	margin: 4rem 0 2rem;
	height: auto;
}
header .txt .btn1 {
	opacity: 0;
	transition: .5s;
	height: 0;
}
.after_load header .txt .btn1 {
	opacity: 1;
	transform: translateY(0px);
	transition-delay: 1.16s;
	height: auto;
}
header .txt .coming {
	font-size: 2rem;
	background-color: rgba(0, 0, 0, 0.7);
	display: inline-block;
	padding: 5px 20px;
}
.after_load header .txt .coming {
	opacity: 1;
	transform: translateY(0px);
	transition-delay: 1.16s;
	margin-top:  4.5rem;
	height: auto;
}

.btn1 {text-align: center;}
.btn1 a {
	max-width: 240px;
	position: relative;
	display: block;
	margin: auto;
	padding: 10px;
	border-radius: 50px;
	overflow: hidden;
}
.btn1 a::after {
	content: "";
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.8);
	mix-blend-mode: multiply;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
}
.btn1 a span {
	font-size: 1.8rem;
	color: #fff;
	position: relative;
	z-index: 4;
	line-height: 1;
}
.btn1 a span::before {
	content: "";
	width: 2rem;
	height: 2rem;
	display: inline-block;
	margin-right: 5px;
	background-image: url(../images/icon_cart1.png);
	background-size: cover;
	background-repeat: no-repeat;
	vertical-align: top;
}
.btn1.mail a span::before {background-image: url(../images/icon_mail1.png);}

.btn2 a {
	max-width: 240px;
	position: relative;
	display: block;
	padding: 10px;
	border-radius: 50px;
	overflow: hidden;
	text-align: center;
}
.btn2 a::after {
	content: "";
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.8);
	mix-blend-mode: multiply;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
}
.btn2 a span {
	color: #fff;
	position: relative;
	z-index: 4;
	line-height: 1;
}


.wrap {
	background-color: #fff;
	position: relative;
	z-index: 2;
}
section {padding: 18rem 0;}
section.p0 {padding: 0;}

.about {
	position: relative;
	overflow: hidden;
}
.about div.absolute {
	background-position: top center;
	background-image: url(../images/bg1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}
.iphone .about div.absolute,
.android .about div.absolute {background-image: url(../images/bg1_sp.jpg);}

.aboutTxt {
	margin-bottom: 10rem;
	justify-content: space-between;
	padding: 0 30px;
	position: relative;
	z-index: 2;
}
.aboutTxt > div {
	width: 50%;
}
.aboutTxt .image {
	max-width: 450px;
	position: relative;
}
.aboutTxt .image img {
	position: relative;
	z-index: 3;
}
.obj_ichimatsu {
	content: "";
	width: 80px;
	height: 80px;
	background-size: cover;
	position: absolute;
	display: block;
	z-index: 2;
}
.obj1 {
	background-image: url(../images/ichimatsu1.png);
	bottom: -60px;
	left: -60px;
}
.obj2 {
	background-image: url(../images/ichimatsu1.png);
	top: -60px;
	right: -60px;
}
.aboutTxt .ttl {
	display: flex;
	justify-content: right;
}
.aboutTxt h3 {
	margin-top: -3rem;
	opacity: 0;
	transition: 1.5s;
}
.aboutTxt h2 {
	-ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
	font-size: 2.2rem;
	color: #604a1d;
	line-height: 2;
	letter-spacing: 0.4rem;
	text-align: center;
	margin: 5rem 5rem 0 3rem;
	opacity: 0;
	transition: 1.5s;
}
.aboutTxt h2 span {
	color: #604a1d;
	display: block;
	margin-top: 6rem;
}
.aboutTxt h2 br {display: none;}
.aboutTxt p {
	line-height: 2.3;
	opacity: 0;
	transition: 1.5s;
	z-index: 3;
	position: relative;
}
.aboutTxt p span {display: inline-block;}
.show.aboutTxt h3,
.show.aboutTxt h2,
.show.aboutTxt p {opacity: 1;}
.show.aboutTxt h2 {transition-delay: .05s;}
.ill1 {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 3;
}
.ill1.sp {display: none;}
h3.ttl {
	-ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
	font-size: 2.6rem;
	color: #e54709;
	margin: 0 auto 30px;
	padding-top: 4rem;
	position: relative;
	letter-spacing: .3rem;
	opacity: 0;
	transition: 1s;
	z-index: 3;
	display: inline-block;
}
h3.ttl span {color: #e54709;}
h3.ttl::before {
	content: "";
	width: 11rem;
	height: 11rem;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	background-image: url(../images/ttl_bg.png);
	background-size: cover;
	background-repeat: no-repeat;
	z-index: 4;
}
h3.ttl small {
	position: absolute;
	bottom: 0;
	right: -3rem;
	letter-spacing: .2rem;
	font-size: 1.1rem;
	color: #e54709;
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	line-height: 1.2;
}
.show h3.ttl {opacity: 1;}
.lineup h3.ttl {height: 27rem;}
.eat h3.ttl {height: 30rem;}
.store h3.ttl {height: 16.5rem;}

#fixed-area {
  position: -webkit-sticky;
  position: sticky;
	top: 0px;
  width: 400px;
  height: 100vh;
	background-image: url(../images/bg2.jpg);
	background-size: cover;
	padding: 50px 20px;
	text-align: center;
}
#fixed-area::after {
	content: "";
	width: 100%;
	height: 40vh;
	position: absolute;
	bottom: 0;
	left: 0;
	background: rgb(255,255,255);
	background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 90%);
}
.lineup_link {
	text-align: center;
	position: relative;
	z-index: 3;
	margin-bottom: 30px;
}
.lineup_link li {margin-bottom: 15px;}
.lineup_link li:last-child {margin-bottom: 0;}
.lineup_link a {
	display: inline-block;
	color: #604a1d;
	font-size: 1.8rem;
	position: relative;
	padding-right: 2rem;
}
.lineup_link a::before{
	content: "";
	position: absolute;
	right: 0;
	top: 54%;
	transform: translateY(-50%);
	box-sizing: border-box;
	width: 1.5rem;
	height: 1.5rem;
	border: 1px solid #614a1d;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}
.lineup_link a::after{
	content: "";
	position: absolute;
  right: .8rem;
	top: 51%;
  width: .4rem;
  height: .4rem;
  border-top: 1px solid #614a1d;
  border-right: 1px solid #614a1d;
  -webkit-transform: rotate(45deg) translateY(-50%);
  transform: rotate(45deg) translateY(-50%);
}
#container {
	width:calc(100% - 400px);
	padding: 0 30px 0;
	min-height: 100vh;
}
#container article {
	max-width: 900px;
	margin: auto;
	position: relative;
	padding-top: 50px;
}
#container dl {margin-bottom: 80px;}
#container h4 {
	font-size: 2.3rem;
	text-align: center;
	color: #604a1d;
	letter-spacing: 0.5rem;
  line-height: 1.8;
  margin-bottom: 3rem;
}
#container h4 span {
	display: inline-block;
	color: #604a1d;
}
.lineup_image {
	max-width: 600px;
	padding: 30px 50px;
	margin: 0 auto;
	position: relative;
}
.lineup_image picture {
	position: relative;
	display: block;
	overflow: hidden;
}
.lineup_image picture::after {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: #faf7ee;
	transition: 1s;
}
.show .lineup_image picture::after {height: 0;}
.lineup_image img {
	transform: translateY(1.6rem);
	transition: 1s;
}
.show .lineup_image img {transform: translateY(0);}
.lineup_image div p {
	color: #604a1d;
	margin-top: 5px;
}
#container dd {
	opacity: 0;
	transition: 2s;
}
#container .show dd {
	opacity: 1;
	transition-delay: .1s;
}
#container dd p {
	line-height: 2;
	text-align: justify;
}
.obi {
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	line-height: 2;
	position: absolute;
	top: -2rem;
	right: -3rem;
	font-size: 1.8rem;
	z-index: 3;
}
.obi span {
	background-color: #604a1d;
	color: #fff;
	padding: 5px 3px;
	display: inline-block;
	line-height: 1.1;
	letter-spacing: .2rem;
	position: relative;
}
.obi span + span {margin-top: 2rem;}
.obi span::after {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: #604a1d;
	z-index: 4;
	transition: 1s;
}
.show .obi span::after {
	height: 0;
	transition-delay: .1s;
}
.show .obi br + span::after {transition-delay: .12s;}
.obi br.pc_none {display: none;}

.ect {
	padding: 0 0 0 15px;
	margin-top: 20px;
	border-left: 1px solid;
}
.ect li {
	padding: 5px 0;
	font-size: 1.4rem;
	line-height: 1.2;
	text-indent: -1.4rem;
  padding-left: 1.4rem;
}
#container .btn1 {margin-top: 20px;}

.eat {
	padding-bottom: 8rem;
	position: relative;
}
.eat .box {
	display: flex;
	align-items: flex-start;
	max-width: 1200px;
  margin: auto;
}
.eat_bg {
	width: 0%;
	height: 35%;
	position: absolute;
	bottom: 0;
	left: 0;
	background-image: url(../images/bg3.png);
	background-size: auto 100%;
	z-index: -1;
	transition: 1s;
}
.show .eat_bg {
	transition-delay: .5s;
	width: 100%;
}
.eat .multiple-items {
	width: calc(100% - 300px);
	max-width: 1400px;
	margin-top: 100px;
	padding-left: 15px;
	opacity: 0;
	transform: translateY(20px);
	transition: 1s;
}
.show.eat .multiple-items {
	opacity: 1;
	transform: translateY(0px);
}
.eat .slick-slide {
	background-color: #fff;
	margin: 0 15px;
}
.eat .multiple-items img {width: 100%;}
.eat .multiple-items p {
	color: #604a1d;
	padding: 8px;
}
.eat .slick-prev, .eat .slick-next {
	transform: translate(0);
	top: inherit;
	bottom: -50px;
	width: 45px;
	height: 45px;
	background-color: #614a1d;
	border-radius: 50%;
}
.eat .slick-prev {
	left: inherit;
  right: 70px;
}
.eat .slick-next {
	right: 15px;
}
.eat .slick-prev:before, .eat .slick-next:before {
	opacity: 1;
	color: transparent;
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
	display: block;
	width: 100%;
	height: 100%;
	transition: .3s;
}
.eat .slick-prev:before {background-image: url(../images/eat_arwL.png);}
.eat .slick-next:before {background-image: url(../images/eat_arwR.png);}

.guide {
	max-width: 1200px;
	margin: auto;
	overflow: hidden;
	padding-left: 30px;
	padding-right: 30px;
}
.guide .flex {
	width: calc(100% + 50px);
}
.guide a {
	width: calc(50% - 50px);
	margin-right: 50px;
	padding: 45px 20px;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	transition: 1s;
	background-color: #000;
}
.guide a::before {
	content: "";
	width: 100%;
	height: 100%;
	background-image: url(../images/bg4.jpg);
	background-size: cover;
	position: absolute;
	top: 0;
	left: 0;
}
.guide a::after {
	content: "";
	width: 25px;
	height: 6px;
	background-image: url(../images/guide_arw.png);
	background-size: 96%;
	background-repeat: no-repeat;
	background-position: center;
	position: absolute;
	bottom: 10px;
	right: 10px;
}
.guide a span {
	font-size: 2.2rem;
	color: #fff;
	position: relative;
	padding-left: 8rem;
	display: inline-block;
	letter-spacing: .3rem;
}
.guide a span::before {
	content: "";
	width: auto;
	width: 6rem;
	height: 4rem;
	background-image: url(../images/icon_track.png);
	background-size: auto 100%;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.guide a.no2 span {padding-left: 6.5rem;}
.guide a.no2 span::before {background-image: url(../images/icon_guide.png);}
.guide a small {
	display: block;
	color: #fff;
	font-size: 1.6rem;
	margin-top: 5px;
	letter-spacing: .3rem;
}

.store {
	position: relative;
	padding: 8rem 0 0;
	overflow: hidden;
}
.store .bg {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: bottom center;
	background-image: url(../images/bg5.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	z-index: -1;
}
.iphone .store .bg,
.android .store .bg {background-image: url(../images/bg5_sp.jpg);}
.store h3.ttl {margin-bottom: 5rem;}
.store h3.ttl small {
	bottom: -2rem;
	right: -3.6rem;
}
.store .flex {
	align-items: center;
	justify-content: center;
	max-width: 1000px;
	margin: auto;
	padding: 0 30px;
}
.store .flex > div {width: 50%;}
.store .image {position: relative;}
.store .image img {
	position: relative;
	z-index: 3;
	opacity: 0;
	transition: .8s;
	transform: translateY(10px);
}
.store .txt {
	padding-left: 50px;
	opacity: 0;
	transition: .8s;
	transform: translateY(10px);
}
.store h4 {
	font-size: 2.4rem;
	line-height: 1.8;
	letter-spacing: .3rem;
}
.store h4 small {
	font-size: 1.6rem;
	display: block;
}
.store .show .image img {
	opacity: 1;
	transform: translateY(0);
	transition-delay: .1s;
}
.store .show .txt {
	opacity: 1;
	transform: translateY(0);
	transition-delay: .15s;
}
.obj3 {
	width: 90px;
	height: 90px;
	background-image: url(../images/ichimatsu3.png);
	top: -65px;
	left: -65px;
}

.info {margin: 20px 0;}
.info li {margin-bottom: 10px;}
.info li:last-child {margin-bottom: 0;}
.info li > * {
	position: relative;
	display: inline-block;
	padding-left: 2.3rem;
	line-height: 1.2;
}
.info li > *::before {
	content: "";
	width: 2rem;
	height: 2rem;
	display: inline-block;
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
	position: absolute;
	top: 0px;
	left: 0;
}
.info li.add a::before {background-image: url(../images/icon_info1.png);}
.info li.tel-link span::before,
.info li.tel-link a::before {background-image: url(../images/icon_info2.png);}

.sns {
	display: flex;
	margin: 20px 0 0;
}
.sns li {margin-right: 10px;}
.sns a {
	border: 1px solid #333;
	padding: 8px;
	display: block;
	border-radius: 50%;
	overflow: hidden;
}

.copy {
	padding: 4rem 0;
	font-size: 1.2rem;
	text-align: center;
}




.hidden1 {overflow: hidden;}
.sp_menu {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 9990;
	opacity: 0;
	transform: translateY(-20px);
	transition: .5s;
	width: 100%;
}
.after_load .sp_menu {
	transition-delay: 1.3s;
	opacity: 1;
	transform: translateY(0);
}
.sp_menu button {
	display: block;
	border: none;
	width: 4rem;
	height: 4rem;
	cursor: pointer;
	position: fixed;
	top: 12px;
	right: 15px;
	outline: none;
	background-color: transparent;
	z-index: 9998;
	padding: 0;
}
.sp_menu button span.bar {
	display: block;
	height: 1px;
	width: 3.5rem;
	background-color: #fff;
	margin: auto;
	transition: .2s;
	transform-origin: 0 0;
}
.sp_menu button span.bar2 {margin: 12px auto;}
.sp_menu button.active span.bar {
	width: 5rem;
	transform-origin: center left;
}
.sp_menu button.active .bar1 {
	transform: rotate(45deg) translate(4px, -4px);
}
.sp_menu button.active .bar2 {opacity: 0;}
.sp_menu button.active .bar3 {
	transform: rotate(-45deg) translate(4px, 4px);
	margin-top: 2.1rem;
}
.sp_menu button.active .menu {display: none;}
.sp_menu .icon {
	position: fixed;
	top: 60px;
	right: 15px;
	width: 4rem;
	height: 10rem;
}
.sp_menu .icon a {
	width: 4rem;
	height: 4rem;
	display: block;
	margin: 1rem 0;
	background-size: 100%;
	border-radius: 50%;
	overflow: hidden;
}
.sp_menu .icon .mail a {background-image: url(../images/icon_menu1W.png);}
.sp_menu .icon .cart a {background-image: url(../images/icon_menu2W.png);}
.sp_menu .icon img {opacity: 0;}

.hidden1 .icon .mail a {background-image: url(../images/icon_menu1G.png);}
.hidden1 .icon .cart a {background-image: url(../images/icon_menu2G.png);}
.hidden1 button span.bar {background-color: #604a1d;}
.isActive.sp_menu .icon .mail a {background-image: url(../images/icon_menu1G.png);}
.isActive.sp_menu .icon .cart a {background-image: url(../images/icon_menu2G.png);}
.isActive.sp_menu button span.bar {background-color: #604a1d;}

.sp_menu nav {
	position: fixed;
	top: 0;
	right: 0;
	transition: 1s cubic-bezier(0.16, 1, 0.3, 1);
	background-image: url(../images/bg6.jpg);
	background-size: cover;
	background-position: center;
	visibility: hidden;
	width: 100%;
	height: 100vh;
	box-sizing: border-box;
	opacity: 0;
}
.sp_menu nav.open {
	visibility: visible;
	opacity: 1;
	overflow: scroll;
	transition: 1s cubic-bezier(0.16, 1, 0.3, 1);
	min-width: 320px;
}
.sp_menu nav > div {
	display: flex;
	justify-content: space-around;
	align-items: flex-start;
	position: absolute;
	max-width: 900px;
	width: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: 30px;
}
.sp_menu h1 {margin: 0 0 0 30px;}
.sp_menu h1 a {display: inline-block;}
.sp_menu .btns {
	/* width: 260px;
	margin: 0 80px 0 0;
	transform: translateY(50%); */
	transition: .5s;
	opacity: 0;
	margin-top: 20px;
}
.sp_menu .sns {margin-top: 20px;}
.sp_menu .rl {
	 -ms-writing-mode: tb-rl;
 	writing-mode: vertical-rl;
}
.sp_menu .rl li {margin: 0 3.5rem;}
.sp_menu .rl li::before {
	content: "";
	width: .8rem;
	height: .8rem;
	background-color: #e54709;
	border-radius: 50%;
	margin-bottom: 10px;
	display: inline-block;
}
.sp_menu .rl a {
	color: #5e4e32;
	letter-spacing: 0.5rem;
	display: inline-block;
	line-height: 1;
	position: relative;
}
.sp_menu .guide_link a {font-size: 2rem;}
.sp_menu .page_link a {font-size: 2.5rem;}
.sp_menu .rl a::before {
	content: "";
	width: 1.9rem;
	height: 1.9rem;
	position: absolute;
	top: -2.4rem;
	left: 0.2rem;
	border: 1px solid #e54a0f;
	border-radius: 50%;
	transform: scale(0);
}
.sp_menu .rl.guide_link a::before {left: 0;}
.sp_menu .rl a::after {
	content: "";
	width: 1rem;
	height: 2rem;
	background-image: url(../images/menu_arw.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto 100%;
	display: inline-block;
}
.sp_menu .btn1.mail {margin-top: 10px;}
.sp_menu nav .guide_link,
.sp_menu nav .page_link,
.sp_menu nav h1 {
	opacity: 0;
	transform: translateY(20px);
	transition: .5s;
}
.sp_menu nav.open .guide_link,
.sp_menu nav.open .page_link,
.sp_menu nav.open h1 {
	opacity: 1;
	transform: translateY(0px);
}
.sp_menu nav.open .guide_link {transition-delay: .2s;}
.sp_menu nav.open .page_link {transition-delay: .15s;}
.sp_menu nav.open h1 {transition-delay: .1s;}
.sp_menu nav.open .btns {
	margin-top: 0;
	opacity: 1;
	transition-delay: .25s;
}


/* ----------- */
@media screen and (min-width: 801px) {
	.sp_menu h1 a:hover {opacity: .6;}
	.sp_menu .rl a:hover {color: #e54a0f;}
	.sp_menu .rl a:hover::after {transform: translateY(5px);}
	.sp_menu .rl a:hover::before {transform: scale(1);}
	.sp_menu .icon a:hover  {background-color: rgba(104, 82, 40, .1);}
	.isActive.sp_menu .icon a:hover  {background-color: rgba(104, 82, 40, .1);}
	.btn1 a:hover::after,
	.btn2 a:hover::after {background-color: rgba(104, 82, 40, .8);}
	.guide a:hover::before {opacity: .6;}
	.sns a:hover {background-color: rgba(104, 82, 40, .1);}
	.lineup_link a:hover {color: #e54a0f;}
	.lineup_link a:hover::before {border: 1px solid #e54a0f;}
	.lineup_link a:hover::after {border-color: #e54a0f;}
	.eat .slick-next:hover::before, .eat .slick-prev:hover::before {opacity: .9;}
	.sp_menu button:hover span.bar2 {margin: 6px auto;}
	.sp_menu button.active:hover span.bar2 {margin: 12px auto;}
}/* 801px */



/* ----------- */
@media screen and (max-width: 1250px) {
	.guide .flex {width: calc(100% + 30px);}
	.guide a {width: calc(50% - 30px); margin-right: 30px; padding: 45px 10px;}
	.guide a span {padding-left: 6.5rem;}
	.guide a span::before {width: 5.5rem; height: 3.5rem;}
}/* 1250px */

@media screen and (max-width: 1200px) {
	#fixed-area {width: 300px;}
	#container {width: calc(100% - 300px);}
	.eat .multiple-items {width: calc(100% - 200px); padding-left: 0;}
	.sp_menu h1 {margin: 0;}
}/* 1200px */

@media screen and (max-width: 1100px) {
	.sp_menu .btns {margin: 0 30px 0 0;}
}/* 1100px */

@media screen and (max-width: 900px) {
	html {font-size: 60%;}
	.sp_menu nav > div {flex-wrap: wrap; max-width: 680px; justify-content: center;}
	.sp_menu h1 {margin: 0; width: 20%; min-width: 90px;}
	.sp_menu .btns {order: 4; width: 100%; margin: auto;}
	.sp_menu nav.open .btns {margin-top: 20px;}
	.sp_menu .sns {justify-content: center; margin-top: 20px;}
	#fixed-area {width: 250px;}
	#container {width: calc(100% - 250px);}
	.lineup_image {padding: 30px 40px;}
	.obi {right: -2rem;}

}/* 900px */

@media screen and (max-width: 800px) {
	section {padding: 12rem 0;}

	.aboutTxt {margin-bottom: 5rem;}
	.aboutTxt > div {width: 100%;}
	.aboutTxt .ttl {order: 1;}
	.aboutTxt h2 {margin: 5rem 3rem 0 3rem; text-align: left; font-size: 2.4rem;}
	.aboutTxt h2 span {margin-top: 0;}
	.aboutTxt h2 br {display: block;}
	.aboutTxt h3 {width: 25%; min-width: 170px;}
	.aboutTxt.no1 .image {margin-top: -10%;}
	.aboutTxt.no2 .image {margin: 5rem 0 0 20%;}
	.aboutTxt .image {order: 2; width: 60%;}
	.aboutTxt p {text-align: center; line-height: 2; font-size: 1.8rem;}
	.ill1 {bottom: -20%; width: 26%;}
	.ill1.pc {display: none;}
	.ill1.sp {display: block;}

	.lineup {padding-top: 50px;}
	#fixed-area {position: relative; width: 100%; height: auto; padding: 0 15px; background-image: url(../images/bg2_sp.jpg);}
	#fixed-area .ttl {margin-top: 5rem;}
	.lineup_link a::after {right: 0.7rem; top: 48%; border-top: 0; border-bottom: 1px solid #614a1d; border-right: 1px solid #614a1d;}
	#container {width: 100%;}
	.lineup_image {padding: 30px 0px;}
	.obi {right: -3rem;}

	h3.ttl.spBR {line-height: 1.2; order: 1;}
	h3.ttl.spBR::before {transform: translateX(-40%);}
	h3.ttl.spBR span {display: block; margin-top: 8.5rem;}
	h3.ttl.spBR small {bottom: 1.9rem; right: -2rem;}
	.lineup h3.ttl {height: 22rem;}
	.eat h3.ttl {height: 25rem;}
	.store h3.ttl {height: 16.5rem;}

	.eat .box {flex-wrap: wrap;}
	.eat .multiple-items {order: 2; width: 100%; margin-top: 0; padding: 0 15px;}

	.guide .flex {width: 100%;}
	.guide a {width: 100%; margin: 0 0 30px; padding: 30px 20px;min-height: 110px;}

	.store .flex > div {width: 100%; max-width: 500px;}
	.store h3.ttl {margin-bottom: 5rem;}
	.store .txt {padding-left: 0; order: 1; text-align: center; margin-bottom: 3rem;}
	.store .image {order: 2;}
	.store .image::before {content: ""; width: 90px; height: 90px; position: absolute; bottom: -65px; right: -65px; background-image: url(../images/ichimatsu3.png); background-size: cover; z-index: 2; mix-blend-mode: multiply;}
	.btn2 a {margin: auto;}
	.sns {justify-content: center;}
}/* 800px */

@media screen and (max-width: 700px) {
}/* 700px */

@media screen and (max-width: 600px) {
	.sp_menu nav > div {padding: 0 20px; max-width: 400px;}
	.sp_menu h1 {order: 1; width: 100%; text-align: center; margin-bottom: 20px;}
	.sp_menu h1 img {max-width: 80px;}
	.sp_menu .page_link {order: 3;}
	.sp_menu .guide_link {order: 2;}
	.sp_menu .page_link a {font-size: 1.9rem;}
	.sp_menu .guide_link a {font-size: 1.6rem;}
	.sp_menu .rl li {margin: 0 2rem;}
	.sp_menu .btns {transform: translateY(20px);}


}/* 600px */

@media screen and (max-width: 500px) {
	html {font-size: 57%;}
	header .txt h1 {width: 35%; min-width: 120px;}
	header .txt p {font-size: 4.5vw;}
	section {padding: 8rem 0;}

	.aboutTxt {padding: 0 15px;}
	.aboutTxt h3 {min-width: 160px; z-index: 3;}
	.aboutTxt h2 {margin: 95px 20px 0 0; line-height: 1.7; font-size: 2.2rem;}
	.aboutTxt p {font-size: 1.6rem;}
	.aboutTxt .image {width: 76%;}
	.aboutTxt.no1 .image {margin-top: 7%;}
	.aboutTxt.no2 .image {margin: 5rem 0 0 12%;}
	.ill1 {width: 30%; bottom: -10%;}

	#container {padding: 0 15px 0;}
	#container dl {margin-bottom: 20px;}
	.lineup_image {padding: 0 0 30px;}
	.obi {position: relative; -ms-writing-mode: inherit; writing-mode: inherit; top: 2rem; right: inherit;}
	.btn1 a {max-width: 100%;}
	.eat .multiple-items {padding: 0 5px;}
	.guide {padding-left: 15px; padding-right: 15px;}
	.store .flex {padding: 0 15px;}
	.store .image {padding: 0 15px;}
	.obj3 {width: 56px; height: 56px; top: -40px; left: -26px;}
	.store .image::before {width: 56px; height: 56px; bottom: -40px; right: -26px;}
}/* 500px */

@media screen and (max-width: 400px) {
	.obi br.pc_none {display: block; line-height: 0.2;}
	.sp_menu h1 img {max-width: 60px;}
	.sp_menu nav.open .btns {margin-top: 10px;}
	.w400txtR {text-align: right;}
}/* 400px */

@media screen and (max-width: 350px) {
	.aboutTxt h3 {min-width: 140px;}
}/* 350px */