:root{
	--pink:#ef73c4;
	--viola:#a91cc4;
	--orange:#EF9D61;
	--yellow:#EFDE0A;
}


.wrapper{
	width:100%;
	overflow-x:hidden}



/* ---------- reset ---------- */
*, *::before, *::after {
	box-sizing: border-box;
}
html {
	-webkit-text-size-adjust: 100%;
}
body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, figure, blockquote {
	margin: 0;
	padding: 0;
	color:#292943;
}
h1, h2, h3, h4, h5, h6 {
	font-size: inherit;
	font-weight: inherit;
}
h2{	font-weight: 700;
	line-height: 1.3em;
	margin-bottom:1em;
	font-size:2.25rem}
	h2 small{
	display: block;
	margin-bottom: -.4em;
	font-size: clamp(3rem, 6.5vw, 6rem);
	font-weight: 700;
	line-height: 1em;
	letter-spacing: .1em;
	color: var(--pink);
	opacity: .25;
	}
	#page-up{
		position:fixed;
		right:0;
		bottom:50px;
	}
	p{
		line-height:1.8em}
ul, ol {
	list-style: none;
}
a {
	color: inherit;
	text-decoration: none;
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
button, input, select, textarea {
	font: inherit;
	color: inherit;
}
/* ---------- base ---------- */
body {
	text-align: center;
	font-family: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", "Meiryo", sans-serif;
	color: #292943;
}
/* ---------- header ---------- */
header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 10;
	padding: 15px 3% 70px;
	background: linear-gradient(rgba(0, 0, 0, .55), rgba(0, 0, 0, 0));
	pointer-events: none;
}
header a {
	display: block;
	width: 320px;
	pointer-events: auto;
}
.logo {
	--logo-sub: #ab54d6;
	--logo-main: #525050;
	display: block;
	width: 100%;
	height: auto;
}
header .logo {
	--logo-sub: #fff;
	--logo-main: #fff;
}


/* ---------- kv ---------- */
.kv {
	display: grid;
}
.kv h1 {
	grid-area: 1 / 1;
	align-self: center;
	justify-self: center;
	z-index: 1;
	width: 47%;
	margin: 0;
	padding: 0;
	pointer-events: none;
}
.kv h1 img {
	display: block;
	width: 100%;
}
.kv picture {
	grid-area: 1 / 1;
	padding: 0 .3em;
}

.kv p strong{
	font-weight:normal;
	font-size:110%}
.kv picture img {
	display: block;
	width: 100%;
	max-width: 1990px;
	margin: auto;
}
.kv p {
	text-align: left;
	grid-area: 2 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2em;
	max-width: 1000px;
	margin: 1.5em auto 2em;
	padding: 2em 1em;
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1.9em;
}
.kv p img {
	flex-shrink: 0;
	display: block;
	width: 160px;
	height: auto;
}
/* ---------- shops ---------- */
.shops {
	overflow: hidden;
	padding: 4em 0;
	background: #f8f2e6 url(../images/scroll-bg.webp) center;
}
.shops ul {
	display: flex;
	width: max-content;
	animation: shops-scroll 40s linear infinite;
	will-change: transform;
}
.shops li {
	flex-shrink: 0;
	margin-right: 4em;
}
.shops img {
	display: block;
	width: auto;
	height: 200px;
}/*
.shops:hover ul {
  animation-play-state: paused;
}*/
@keyframes shops-scroll {
 from {
 transform: translateX(0);
}
to {
	transform: translateX(-50%);
}
}
@media (prefers-reduced-motion: reduce) {
.shops {
	overflow-x: auto;
}
.shops ul {
	animation: none;
}
}
.event-area {
	padding: 100px 0
}

/* ---------- about ---------- */
.about {
	text-align: left;
	position: relative;
	isolation: isolate;
	display: grid;
	grid-template-columns: 1fr min(1200px, 94%) 1fr;
	padding: 8em 0 16em;
	background: url(../images/about-bg.webp) no-repeat left bottom / 38% auto;
}
.about h2 {
	grid-column: 2;
}
.about > img {
	position: absolute;
	top: 1.9em;
	right: -5%;
	z-index: -1;
	width: calc(50% + 254px);
	height: 780px;
	object-fit: cover;
	object-position: left center;
	border-radius: 50px 0 0 50px;
}
.about article {
	grid-column: 2;
	width: 59%;
	margin-top: .4em;
	padding: 2.2em 1.5em 3.2em 2.6em;
	border-radius: 50px;
	background: #f9f6ec url(../images/about-sake.png) no-repeat right 1.8em top .5em / 140px auto;
}
.about h3 {
	margin-bottom: .75em;
	font-size:2.25rem;

	font-weight: 700;
	line-height: 1.5em;
	color: var(--pink);
}
.about p {
	font-weight: 500;
}
.about p + p {
	margin-top: 1.8em;
}
/* ---------- store ---------- */
.store {
	position: relative;
	isolation: isolate;
	display: grid;
	grid-template-columns: 1fr min(1200px, 94%) 1fr;

	background: #f8eaf3;
}
.store::before {
	content: "";
	position: absolute;
	top: -107px;
	left: 50%;
	z-index: -1;
	width: 418px;
	aspect-ratio: 1;
	transform: translateX(-50%);
	border-radius: 50%;
	background: inherit;
}
.store > * {
	grid-column: 1 / -1;
	text-align: center;
}
.store .catch {
	margin-top: -3em;
	font-size: 1.8rem;
	font-weight: 700;
	line-height: 1.3em;
}
.store h2 {
	margin-top: .6em;
}

.store > img {
	display: block;
	justify-self: center;
	width: 154px;
	height: auto;
	margin: 3em auto;
}
.store article {
	display: grid;
	grid-template-columns: 467fr 676fr;
	grid-template-areas: "name photo"  "tag photo"  "desc photo"  "sub photo";
	column-gap: 60px;
	padding: 6em calc((100% - min(1200px, 94%)) / 2);
	text-align: left;
	background: #fbdde8;
}

.store article:nth-of-type(even) {
	background: #fffbea;
	grid-template-columns: 676fr 467fr;
	grid-template-areas: "photo name"  "photo tag"  "photo desc"  "photo sub";

}
.store article h3 {
	grid-area: name;
	margin-bottom: .5em;
	font-size: 2.1rem;
	font-weight: 700;
	line-height: 1.4em;
	letter-spacing: .05em;

}
.store article ul {
	grid-area: tag;
	display: flex;
	flex-wrap: wrap;
	gap: .5em;
	margin-bottom: 1.75em;
}
.store article li {
	padding: .4em 1em;
	border-radius: 4px;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.4em;
	color: #fff;
	background: var(--pink);
}
.store article p {
	grid-area: desc;
	margin-bottom: 1.9em;
}
.store article img {
	display: block;
	height: auto;
	border-radius: 40px;
	border:6px solid var(--pink);
}
.store article img:first-of-type {
	grid-area: photo;
	width: 100%;
}
.store article img:last-of-type {
	grid-area: sub;
	width: 94%;
}
/* ---------- hopping ---------- */
.hopping {
	text-align: left;
	padding: 160px 0;
	background: #000 url(../images/gaikan.webp) no-repeat 70% center / auto 100%;

}
.hopping > * {
	width:1200px; margin:auto;
color:#FFF;
}
.hopping h2 {

	font-weight: 700;
	line-height: 1.4em;
	letter-spacing: .08em;
}
.hopping p {
	margin-top: 1.4em;

}

/* ---------- experience ---------- */
.experience {
	padding: 6.8em 0 0;
	text-align: center;
}

.experience > p {
	margin-top: .9em;
	font-size: 1.3rem;
	
}
.experience ul {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	width: min(1200px, 94%);
	margin: 3.6em auto 0;
	text-align: left;
}
.experience li {
	display: grid;
	grid-template-columns: 200fr 130fr;
	grid-template-rows: auto auto auto 1fr auto;
	column-gap: 10px;
	padding: 1.4em 1.25em 1.6em;
	border-radius: 10px;
	background: #fff;
	border:4px solid var(--pink);
	box-shadow: 0 4px 16px rgba(239, 115, 196, .5);
}
.experience li > * {
	grid-column: 1 / -1;
}
.experience li img {
	width: 100%;
	height: auto;
	aspect-ratio: 34 / 22;
	object-fit: cover;
	margin-bottom: 1.4em;
}
.experience li small {
	background:var(--orange);
	color:#FFF;
	padding: .2em .8em;
	border-radius:4px;
	padding: 0 .8em;
 font-size: .75rem;
	line-height: 1.4em;
	width:30%;
	text-align:center;
	margin:0 0 .6em;
	
}
.experience li h3 {
	margin-bottom: 1.6em;
	padding: 0 .65em;
 font-size: .95rem;
	font-weight: 700;
	line-height: 1.4em;
	letter-spacing: .05em;
}
.experience li p {
	margin-bottom: 2.4em;
 font-size: .85rem;
	line-height: 1.65em;
	
}
.experience li a {
	grid-column: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	border-radius: 6px;
 font-size: .875rem;
	font-weight: 500;
	background: #FFF;
	border:2px solid var(--pink);
	transition: opacity .2s;
}
.experience li a:first-of-type {
	font-weight: 700;
	color: #fff;
	background:var(--pink);
}
.experience li a:hover, .experience li a:focus-visible {
 opacity: .8;
}
.experience p.more{
	padding: 2em 0;
}
.experience p.more a{
	display: inline-block;
	padding: .7em 2.4em;
	border-radius: 10px;
	font-weight: 700;
	color: #fff;
	background: var(--pink);
	transition: opacity .2s;
}
.experience p.more a:hover, .experience p.more a:focus-visible {
	opacity: .8;
}
/* ---------- news ---------- */
.news {
	padding: 3.6em 0 4em;
	text-align: center;
}

.news ul {
	width: min(880px, 94%);
	margin: 2.5em auto 0;
	text-align: left;
}
.news li {
	border-bottom: 1px solid #bbb;
}
.news li a {
	display: flex;
	align-items: center;
	padding: 1.8em 0;
	
	transition: opacity .2s;
}
.news li a:hover, .news li a:focus-visible {
 opacity: .7;
}
.news time {
	margin-right: .5em;
}
.news li small {
	background:var(--orange);
	flex-shrink: 0;
	min-width: 68px;
	margin-right: 2.3em;
	padding: .25em .5em;
	border-radius: 4px;
 font-size: .75rem;
	line-height: 1.4em;
	text-align: center;
	color:#FFF;
}
.news li small.ico-shop{
	background:var(--pink);
}
.news li small.ico-event{
	background:var(--yellow)}
.news li span {
	line-height: 1.8em;
}
.news > p {
	width: min(880px, 94%);
	margin: 2.6em auto 0;
	text-align: right;
}
.news > p a{
	color:var(--pink);
}
.news > p a::after {
	content: ">";
	margin-left: .6em;
}
.news > p a:hover, .news > p a:focus-visible {
 text-decoration: underline;
}
/* ---------- access ---------- */
.access-wrapper{
	
	background: #fffbea;
}
.access {
  width: min(1200px, 94%);
  margin: 0 auto;
  padding: 4.7em 0 4.8em;
}
.access h2 {
  text-align: center;
}
.access-box {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 30px;
  align-items: center;
  padding: 24px;
  border-radius: 20px;
  background: #fff;
}
.access iframe {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  border: 0;
  border-radius: 12px;
}
.access dl {
  display: grid;
  grid-template-columns: auto 1fr;
  line-height: 1.7em;
  text-align: left;
}
.access dt,
.access dd {
  padding: 1.5em 0;
  border-top: 2px solid #e5e0d8;
}
.access dt:first-of-type,
.access dd:first-of-type {
  border-top: 0;
}
.access dt {
  padding-right: 1.6em;
  font-weight: 700;
  letter-spacing: .05em;
  color: var(--pink);
}
.access dt,
.access dd {
  font-size: 1.125rem;
}
.access strong {
  display: block;
  margin-top: .15em;
  font-size: 2rem;
  line-height: 1.3em;
  letter-spacing: .05em;
  color: var(--pink);
}
.access strong::after {
  content: "";
  display: inline-block;
  width: .9em;
  height: .8em;
  margin-left: .35em;
  vertical-align: .35em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 32' fill='none' stroke='%23ef73c4' stroke-width='4.5' stroke-linecap='round'%3E%3Cpath d='M5 12 20 4M7 24l22 4'/%3E%3C/svg%3E") no-repeat center / contain;
}
.access b {
  margin: 0 .1em;
  font-size: 1.4em;
}
/* ---------- footer ---------- */
footer {
  padding: 3em 1em 2em;
  text-align: center;
  background: #f4cfdd;
}
footer img {
  display: block;
  height: auto;
  margin: 0 auto;
}
footer .logo {
  width: 220px;
  margin: 0 auto;
}
footer img {
  width: 190px;
  margin-top: .9em;
}
footer p {
  margin-top: 1.7em;
  font-size: .813rem;
  font-weight: 700;
  color: #888;
}
/* ---------- pc ---------- */
@media (min-width: 768px) {
	.sp{
		display:none}
.store > p {
	margin-top: 1em;
	font-size: 1.3rem;
	line-height: 1.8em;
	letter-spacing: .1em;
}
p {
	font-size:1.125rem;
}
/*閉じタグ */
}
/* ---------- sp ---------- */
@media (max-width: 767px) {
	.pc{
		display:none}

 header{
		padding: 3vw 3vw 12vw}
 header a {
 width:50vw;
}
#page-up{
	width:12%;
right:2%}
h2 {
	font-size:6.8vw}
h2 small {
	font-size: 11vw;
}
p{
	font-size:3.6vw}
.kv h1 {
	width: 60%;
}
.kv picture {
	padding: 0;
}
.kv p {
	flex-direction: column;
	gap: 1em;
	margin:0;
	padding: 2em .8em;
	font-size: 6vw;
	line-height: 1.9em;
}

.kv p img {
	width: 50%;
}
.shops {
	padding: 2em 0;
}
.shops ul {
	animation-duration: 25s;
}
.shops li {
	margin-right: 1.2em;
}
.shops img {
	height:22vw;
}
/**/
.event-area{
	padding: 2em 1.4em}
/**/
.about {
	display: block;
	padding: 3em 0 40vw;
	background-size: 75% auto;
	background-position:center bottom;
}
.about h2 {
	margin: 0 1.2em;

}

.about > img {
	position: static;
	display: block;
	width: 90%;
	height: auto;
	margin: 1.2em 0 0 auto;
	border-radius: 30px 0 0 30px;
}
.about article {
	position: relative;
	width: auto;
	margin: -1.2em 1.2em 0;
	padding: 2.4em 1.4em 2em;
	border-radius: 30px;
	background-position: right 1em top .5em;
	background-size: 22vw auto;
}
.about h3 {
	font-size: 6.2vw;
}

.about p br{
	display:none}
/**/

.store::before {
	top: -16vw;
	width: 64vw;
}
.store .catch {
	margin-top: -11vw;
	font-size: 5.6vw;
}

.store > img {
	width: 30%;
	margin: 2em 0 0;
}
.store article,  .store article:nth-of-type(even) {
	grid-template-columns: 1fr;
	grid-template-areas:"name"
      "tag"
      "photo"
      "desc"
      "more"
      "sub";
	margin-top: 1.5em;
	padding-top: 2.4em;
	padding-bottom: 2.4em;
}
.store > img + article {
	margin-top: 2.4em;
}
.store article h3 {
	font-size: 5.6vw;
}
.store article li {
	font-size: 3.2vw;
}
.store article p {
	font-size:4vw;
	margin-bottom: 1.2em;
	letter-spacing:normal;
}
.store article img {
	border-radius: 20px;
}
.store article img:first-of-type {
	margin-bottom: 1em;
}
.store article img:last-of-type {
	width: 76%;
	margin: 0 0 0 auto
}
/**/
.hopping {
	padding: 3em 1.4em;
	background-position:-60% center;
}
.hopping > * {
	width:92%}
.hopping h2 {
	font-size: 5.6vw;
}
.hopping p {
	margin: 0;
}

/**/
.experience {
	padding: 3.5em 0 3em;
}

.experience > p {
	padding: 0 1.2em;
	font-size: 3.3vw;
}
.experience ul {
	grid-template-columns: 1fr;
	gap: 1.5em;
	margin-top: 2em;
}
.experience li {
	border-radius: 28px;
}
.experience li small {
	font-size: 3vw;
}
.experience li h3 {
	font-size: 4.2vw;
}
.experience li p {
	font-size: 3.4vw;
}
.experience li a {
	min-height: 44px;
	font-size: 3.4vw;
}
/**/
.news {
	padding: 3em 0;
}

.news ul {
	margin-top: 1.8em;
}
.news li a {
	flex-wrap: wrap;
	padding: 1.2em .5em;
	font-size: 3.6vw;
}
.news time {
	font-size: 3.4vw;
}
.news li small {
	min-width: 18vw;
	margin-right: 0;
	font-size: 2.8vw;
}
.news li span {
	flex-basis: 100%;
	margin-top: .6em;
	font-size: 3.6vw;
	line-height: 1.6em;
}
.news > p {
	margin-top: 1.8em;
	font-size: 3.4vw;
}
/**/
  .access {
    padding: 3em 0;
  }
  .access-box {
    grid-template-columns: 1fr;
    row-gap: 1.2em;
    padding: 4vw;
    border-radius: 4vw;
  }

  .access iframe {
    aspect-ratio: 4 / 3;
  }
  .access dl {
    font-size: 3.4vw;
  }
  .access dt,
  .access dd {
    padding: 1.2em 0;
  }
  .access dt {
    padding-right: 1em;
  }
  .access dt,
  .access dd {
    font-size: 3.6vw;
  }
  .access strong {
    font-size: 6.4vw;
  }
/**/
  footer {
    padding: 2.5em 1em 1.5em;
  }
  footer .logo {
    width: 46%;
  }
  footer img {
    width: 50%;
  }
  footer p {
    margin-top: 1.4em;
    font-size: 2.8vw;
    line-height: 1.6em;
  }
		}
.iPad .event-area{
	width:90%;
	margin:auto}
	.iPad .about h3{
		font-size:1.75rem}
.iPad .about article{
	background-size:100px auto;
	width:72%}	
		.iPad .about article p br{
			display:none}
			
			.iPad .hopping p br.sp{
				display:inherit}
				
				.iPad .access iframe{
aspect-ratio:12 / 9;
				}
				
				.iPad .store article{
					column-gap:30px;
				}
				.iPad .store article h3{
					font-size:1.75rem}