@charset "UTF-8";

body {
	min-width: 0;
	font-family: 'Noto Sans JP', sans-serif;
	color: #000;
	line-height: 1.6;
	-webkit-text-size-adjust: 100%;
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: normal;
}
.contents {
}
.contents-header {
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
.contents-header-inner {
	position: relative;
	width: 100%;
	min-height: 525px;
	margin: 0 auto;
	text-align: center;	
}
.contents-header-inner > img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}
.header-img {
	position: absolute;
	width: 100%;
	height: 100%;
	bottom: 0;
	left: 0;
}
.header-img .anime {
	position: absolute;
	display: inline-block;
}
.header-img .pumpkin1 {
	top: 26%;
	left: 25px;
	width: 37%;
	animation: swing 1s ease-in-out infinite alternate;
}
.header-img .pumpkin2 {
	top: 22%;
	left: 36%;
	width: 12%;
	animation: swing 1s ease-in-out infinite alternate;
	animation-duration: 1.3s;
}

@keyframes swing {
  0% {
  	transform:translate(-3px, -10px);
  }
  100% {
  	transform:translate(0px, 0px);
  }
}
@keyframes horizontal {
    0% { transform:translateX( -5px); }
  100% { transform:translateX(  0px); }
}
@keyframes vertical {
    0% { transform:translateY(-10px); }
  100% { transform:translateY(  0px); }
}

.mv {
	position: relative;
	background: url(../../img/bg_main_mv.png) no-repeat 0 0;
	background-size: cover;
}
.mv::before {
	content: '';
  position: absolute;
  display: block;
	/*
  background-image: -webkit-radial-gradient(at left top, #E8580A 0%, rgba(255,255,255, 0) 70%, rgba(255,255,255, 0) 100%);
  background-image: radial-gradient(at left top, #E8580A 0%, rgba(255,255,255, 0) 70%, rgba(255,255,255, 0) 100%);
	*/
  width: 525px;
  height: 525px;
  line-height: 100%;
}
.mv-inner {
	/*
	background: url(../../img/bg_main.png),
	-moz-linear-gradient(left, rgba(126,25,80,1) 0%, rgba(98,9,98,1) 100%);
	background: url(../../img/bg_main.png),
		-webkit-linear-gradient(left, rgba(126,25,80,1) 0%, rgba(98,9,98,1) 100%);
	background: url(../../img/bg_main.png),
		linear-gradient(to right, rgba(126,25,80,1) 0%, rgba(98,9,98,1) 100%);
	*/
	background-image: url(../../img/bg_main.png);
	background-position: top left;
	background-repeat: repeat-x;
	position: relative;
	width: 100%;
	min-height: 525px;
	text-align: center;
	overflow: hidden;
}
.mv-inner::before, .mv-inner::after {
	content: '';
  position: absolute;
  top: 0;
  width: 400px;
  height: 100%;
}
.mv-inner::before {
	left: 0;
  background-image: url(../../img/main_left.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.mv-inner::after {
	right: 0;
  background-image: url(../../img/main_right.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
	width: 415px;
	top: 4px;
}
.mv-inner .anime-wrap {
  position: absolute;
  top: 0;
  width: 400px;
  height: 100%;
}
.mv-inner .anime-wrap > img {
	position: absolute;
}
.mv-inner .anime-wrap .kumo1 {
	top: 48%;
	left: 20px;
	animation: horizontal 1s ease-in-out infinite alternate;
}
.mv-inner .anime-wrap .kumo2 {
	top: 7%;
	left: 200px;
	animation: horizontal 1s ease-in-out infinite alternate;
	animation-duration: 1.3s;
}
.mv-inner .anime-wrap .obake1 {
	bottom: 26%;
	left: 120px;
	animation: swing 1s ease-in-out infinite alternate;
}
.mv-inner .anime-wrap .obake2 {
	bottom: 18%;
	left: 220px;
	animation: swing 1s ease-in-out infinite alternate;
	animation-duration: 1.3s;
}
.mv-inner .anime-wrap .obake3 {
	bottom: 32%;
	left: 200px;
	animation: swing 1s ease-in-out infinite alternate;
	animation-duration: 2s;
}
.mv-ttl {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 45%;
	/* max-width: 490px; */
	max-width: 493px;
	height: auto;
	margin: 0 auto;
	transform: translate(-50%, -50%);
	-moz-animation: slideupIn 0.8s 0.2s ease-in;
	-webkit-animation: slideupIn 0.8s 0.2s ease-in;
	animation: slideupIn 0.8s 0.2s ease-in;
}
.mv-ttl::before {
	content: '';
	display: inline-block;
	position: absolute;
	left: 42.0%;
	/* top: 52.5%; */
	top: 70.5%;
	width: 5%;
	height: 0;
	padding-top: 11%;
	border-radius: 50% 50% 50% 50% / 25% 25% 75% 75% ;
	background: #231815;
	transform-origin: 50% 20%;
	-moz-animation: anime_o 4s ease-in infinite alternate;
	-webkit-animation: anime_o 4s ease-in infinite alternate;
	animation: anime_o 4s ease-in infinite alternate;
}
@keyframes anime_o {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(0.3);
        border-radius: 50% 50% 50% 50% / 50% 50% 50% 50%;
    }
}
@keyframes slideupIn {
    0% {
        transform: translate(-50%, 50%);
        opacity: 0;
    }
    100% {
        transform: translate(-50%, -50%);
        opacity: 1;
    }
}
@media screen and (max-width: 768px){
	.mv {
		position: relative;
		background: transparent;
	}
	.mv-inner {
		min-height: auto;
	}
	.mv::before,
	.mv-inner::before, .mv-inner::after {
		display: none;
	}
	.mv-ttl {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 90%;
		max-width: 100%;
	}
	.mv-inner .anime-wrap {
		width: 100%;
	}
	.mv-inner .anime-wrap .kumo1 {
		top: -1%;
		left: 28%;
		width: 12%;
	}
	.mv-inner .anime-wrap .kumo2 {
		top: 14%;
		left: 2%;
		width: 16%;
	}
	.mv-inner .anime-wrap .obake1 {
		bottom: 15%;
		left: 10%;
		width: 13%;
	}
	.mv-inner .anime-wrap .obake2 {
		bottom: 7%;
		left: 38%;
		width: 10%;
	}
	.mv-inner .anime-wrap .obake3 {
		bottom: 10%;
		left: 26%;
		width: 10%;
	}	
}

.header-nav {
	position: absolute;
	display: flex;
	justify-content: space-between;
	bottom: 30px;
	right: 0;
	max-width: 580px;
}
.header-nav > li {
	width: 33%;
}

@media screen and (max-width: 768px){
	.contents {
		background-size: 20px;
	}
	.contents-header {
		background-image: none;
		background-color: #000;
	}
	.contents-header-inner {
		max-width: 100%;
		min-height: 460px;
	}
	.header-img {
		width: 100%;
		height: auto;
		bottom: 15%;
		padding: 0 10%;
		text-align: left;
	}
	.header-nav {
		width: 94%;
		margin: 0;
		bottom: 3%;
		right: auto;
		left: 50%;
		transform: translateX(-50%);
	}
}

.contents-wrap {
	width: 100%;
}
.article_area {
	position: relative;
	/*background: #E5A83F;*/
  background: url("../../img/bg_event_sweets.png") center bottom repeat-x;
	background-size: cover;
	padding-bottom: 2vw;
}
.fadein {
	opacity : 0.1;
	transform : translate(0, 50px);
	transition : all 1s;
}
.fadein.scrollin {
	opacity : 1;
	transform : translate(0, 0);
}
.contents_box {
	padding: 0 20px 20px;
}
.contents_box h2 {
	max-width: 100%;
	text-align: center;
	margin: 0 auto 50px;
}
.contents_box > section,
.contents_box > ul {
	max-width: 1000px;
	margin: 0 auto;
}
@media screen and (max-width: 768px) {
	.article_area {
		background: url("../../img/bg_event_sweets_sp.png") center bottom no-repeat;
		background-size: cover;
		padding-bottom: 18vw;
	}	
	.contents_box {
		padding-bottom: 50px;
	}
}

/* ナビゲーション */
.bg-violet {
	position: relative;
	z-index: 0;
  background: url("../../img/bg_event.png") center bottom repeat-x;
	background-size: cover;
	/*background: -moz-linear-gradient(top, rgba(98,9,98,1) 0%, rgba(98,9,98,1) 75%, rgba(255,255,255,0) 100%);
	background: -webkit-linear-gradient(top, rgba(98,9,98,1) 0%,rgba(98,9,98,1) 75%,rgba(255,255,255,0) 100%);
	background: linear-gradient(to bottom, rgba(98,9,98,1) 0%,rgba(98,9,98,1) 75%,rgba(255,255,255,0) 100%);*/
	margin-top: -50px;/*20241003修正*/
}

/*.bg-violet::after{
  content: "";
  position: absolute;
  background: url("../../img/bg_main_t.png") center bottom repeat-x;
  background-size: contain;
  height: 56px;
  width: 100%;
  bottom: -40px;
	left: 0;
}
.bg-violet::after {
  content: '';
  display: block;
  width: 90%;
  max-width: 1000px;
  height: 2px;
  margin: 0 auto;
  background: #fff;
}*/

#nav {
	/* position: absolute; */
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	/* padding: 20px 20px 10px; */
	padding: 20px 20px 30px;
	text-align: center;
	/*background: -moz-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 100%);*/
	background: #000;
	z-index: 999;
}

/* #nav::after{
  content: "";
  position: absolute;
  background: url("../../img/bg_nav.png") center bottom repeat-x;
  background-size: contain;
  height: 58px;
  width: 100%;
  bottom: -40px;
	left: 0;
}
@media screen and (max-width: 768px) {
	#nav::after {
		height: 42px;
		bottom: -20px;
	}
} */

#nav.spikes::after {
	content: '';
	position: absolute;
	right: 0;
	left: -0%;
	top: 100%;
	z-index: 10;
	display: block;
	height: 60px;
	background-size: 60px 100%;
	background-image: linear-gradient(144deg, #000 24%, transparent 25%), linear-gradient(216deg, #000 24%, transparent 25%);
	background-position: 0 0;
}
@media screen and (max-width: 768px) {
	#nav.spikes::after {
		content: '';
		position: absolute;
		right: 0;
		left: -0%;
		top: 99%;
		z-index: 10;
		display: block;
		height: 45px;
		background-size: 40px 100%;
		background-image: linear-gradient(142deg, #000 25%, transparent 25%), linear-gradient(218deg, #000 24%, transparent 25%);
		background-position: 0 0;
}
}

#nav.fixed {
	position: fixed;
	top: 80px;
	transition: all .5s;
}
#nav.fixed.remove {
	opacity: 0;
	visibility: hidden;
}
#nav ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: 1000px;
	margin: 0 auto;
	z-index: 10;
	position: relative;
}
#nav ul > li {
	width: 32%;
}
#nav ul > li .btn {
	padding: 0;
}
.btn {
	display: inline-block;
	width: 100%;
	padding: 10px 15px;
	border: 1px solid #fff;
	background: #222222;
  cursor: pointer;
	transition: all .3s ease;
}
@media screen and (min-width: 767px) {
  .btn:hover{
  	background: #620962;
  	opacity: 1;
  }
}
@media screen and (max-width: 768px) {
	.bg-violet {
		background: url("../../img/bg_event_sp.png") center bottom no-repeat;
		background-size: cover;
	}	
  #nav.fixed {
    top: 55px;
    margin-bottom: 0;
    /* padding: 25px 0 0; */
		padding: 25px 0 5px;/*20241003*/
  }
}

/* イベント */
#event {
	text-align: center;
	padding: 0 20px 70px;
}
#event h2 {
	position: relative;
	display: inline-block;
	margin: 215px auto 25px;
	width: 482px;
}
#event h2::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: -35px;
	right: -15px;
	width: 35px;
	height: 40px;
	background: url(../../img/ttl_event_illust.png) 0 0 no-repeat;
	background-size: contain;
	animation: swing 1s ease-in-out infinite alternate;
}
#event .event-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: 1000px;
	margin: 0 auto;
}
#event .event-item {
	width: 49%;
	margin-bottom: 30px;
}
#event .event-item.full {
  width: 100%;
  max-width: 100%;
}
#event .event-item-head {
	position: relative;
	font-size: 3.8rem;
	font-weight: bold;
	color: #EA590A;
	text-align: left;
	line-height: 1.2em;
}
#event .event-item-head .date {
	margin-top: 0.5em;
	font-size: 1.5rem;
	text-align: left;
	color: #000;
	line-height: 1.4em;
}
#event .event-item-head .date > span {
	font-size: 1.5em;
}
#event .event-item-content {
  padding-top: 1em;
}
#event .event-item-content p {
	padding-top: 0.5em;
	text-align: left;
	border-top: 1px solid #000;
}

@media screen and (max-width: 1000px){ 
  #event .event-item-head {
    font-size: 2.6rem;
  }
}
@media screen and (max-width: 768px){	
  #event {
		padding-bottom: 60px;
	}
  #event .event-wrap {
    justify-content: center;
  }
  #event h2 {
    margin-bottom: 30px;
		margin-top: 180px;
  }
  #event h2::before {
		top: -10px;
		right: 0;
		width: 15%;
		height: 0;
		padding-top: 20%;
	}
  #event .event-item {
		width: 100%;
	}
  #event .event-item-head {
		font-size: 2.2rem;
	}
}

/* スイーツ */
#sweets {
	position: relative;
	text-align: center;
	padding-top: 147px;
	z-index: 1;
}
#sweets::before {
  content: '';
  position: absolute;
  top: 117px;
  left: 50%;
  display: block;
  width: 100%;
  max-width: 780px;
  height: 160px;
  background: url(../../img/spider.png) top right no-repeat;
  transform: translateX(-50%);
}
#sweets h2 {
	position: relative;
	display: inline-block;
	margin: -147px auto 50px;
	padding-top: 147px;
	width: 440px;
}
#sweets h2::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: 112px;
	right: -50px;
	width: 57px;
	height: 54px;
	background: url(../../img/ttl_sweets_illust.png) 0 0 no-repeat;
	background-size: contain;
	animation: swing 1s ease-in-out infinite alternate;
}
#kids {
	position: relative;
	text-align: center;
	padding-top: 147px;
	z-index: 1;
}
#kids::before {
  content: '';
  position: absolute;
  top: 117px;
  left: 50%;
  display: block;
  width: 100%;
  max-width: 780px;
  height: 160px;
  background: url(../../img/spider.png) top right no-repeat;
  transform: translateX(-50%);
}
#kids-area h2 {
	position: relative;
	display: inline-block;
	margin: -147px auto 50px;
	padding-top: 147px;
	width: 470px;
}
#kids ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#kids ul::after {
	content: '';
	display: inline-block;
	width: 30%;
}
#kids ul > li {
	width: 30%;
	margin-bottom: 90px;
}
#kids ul > li:nth-child(n+7) {
  display: none;
}
#kids .brand {
	margin-top: 14px;
	font-size: 2rem;
	font-weight: bold;
	text-align: left;
}
.item-spec {
	font-weight: bold;
	text-align: left;
}
.item-spec dt:not(:first-of-type) {
	margin-top: 1em;
}
.item-spec dd {
	font-size: 1.5rem;
	margin-top: 2px;
}
.item-spec .item,
.item-spec .price > span {
	font-size: 1.8rem;
	line-height: 1.4;
	margin-top: 7px;
}
.item-spec .item span{
	font-size: 1.5rem;
}
.item-spec .detail {
	font-weight: normal;
	margin-top: 7px;
}
.item-spec .period {
	display: inline-block;
	margin-top: 12px;
	padding: 0.2em 0.5em;
	font-weight: normal;
	border: 1px solid #000;
}

.btn_more {
  width: 80%;
  max-width: 410px;
  text-align: center;
  border: none;
}
.btn_more > .btn-txt {
  display: inline-block;
  width: 85px;
  height: 36px;
  vertical-align: middle;
  background: url(../../img/nav_more.png) 0 0 no-repeat;
  background-size: cover; 
}
.btn_more.close > .btn-txt {
  background: url(../../img/nav_close.png) 0 0 no-repeat;
  background-size: cover; 
}

@media screen and (max-width: 768px){	
	.btn {
		padding: 10px;
	}
	.btn_more{
		width: 100%;
    }
	#kids {
		padding-top: 100px;
    	margin-top: -100px;
	}
	#kids .ttl-sub-content p.sp_bold {
		font-size: 12px;
		font-weight: bold;
		letter-spacing: -0.05em;
	}
    #kids::before {
    	display: none;
  	}
	#sweets {
		padding-top:0;
	}
	#sweets h2 {
    	margin: -60px auto 30px;
    	width: auto;
    	max-width: 89%;
	}
	#sweets h2::before {
    top: 120px;
    right: 2%;
    width: 16%;
		height: 0;
		padding-top: 20%; 
		display: none;
	}
	#kids ul > li {
		width: 100%;
		margin-bottom: 50px;
	}
	.item-spec dd {
		font-size: 1.5rem;
	}
	.item-spec .price {
		font-size: 1.5rem;
	}
	.item-spec .price > span {
		font-size: 1.8rem;
	}
}

.share-sns-column{
	background-color: #fff;
	padding-bottom: 60px;
}

@media print, screen and (min-width: 768px){
	.menu-column{
		margin-top: 0;
	}
}

/* スマホ用CSS -------------- */
@media screen and (max-width: 768px) {
	.contents-wrap {
		width: auto;
		margin: 0;
	}	
	.article_area {
		margin: 0;
	}
}
@media screen and (min-width: 768px){	
  .br-pc { display:block; }
  .br-sp { display:none; }
}
@media screen and (max-width: 768px){	
  .br-pc { display:none; }
  .br-sp { display:block; }
}
/* スマホ用CSS 閉 -------------- */


/* # sp
----------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 768px) {
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: " ";
}
.clearfix:after {
  clear: both;
}

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

/* 2022 ADD NEW */
i {
	font-style: normal;
}
#event .event-wrap .event-item-dtl {
	background: url(../../img/bg_event_content.png) no-repeat 0 0;
	background-size: 100% 100%;
	padding: 30px 70px 35px;
	margin: 0 0 38px;
	position: relative;
}
#event .event-wrap .event-item-dtl .koumori {
	position: absolute;
	right: 75px;
	top: 45%;
	transform: translateY(-50%) translateX(0);
	width: 115px;
}
#event .event-wrap .event-item-dtl .koumori img {
	animation: swing 1s ease-in-out infinite alternate;
}
#event .event-wrap .event-item-dtl .sub-ttl {
	font-size: 3.8rem;
	font-weight: 700;
	color: #EA590A;
	margin: 0 0 10px;
}
.ei-body .adj {
	margin-bottom: 1em;
	padding-left: 1em;
}
#event .event-wrap .event-item-dtl .ei-inner.fx {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 -3% -3%;
}
#event .event-wrap .event-item-dtl .ei-inner.pr {
	padding-right: 200px;
}
#event .event-wrap .event-item-dtl .ei-inner p {
	text-align: left;
	line-height: 1.5;
}
#event .event-wrap .event-item-dtl .ei-inner.pr p {
	line-height: 1.6;
}
#event .event-wrap .event-item-dtl .ei-inner .mm {
	font-size: 2.2rem;
	font-weight: 700;
	color: #010101;
	line-height: 1;
	margin-top: 10px;
	font-feature-settings: "palt";
}
#event .event-wrap .event-item-dtl .ei-inner .mm i {
	font-size: 1.5rem;
	font-weight: 700;
	color: #010101;
	margin-left: 4px;
}
#event .event-wrap .event-item-dtl .ei-inner .normal {
	font-size: 1.6rem;
	font-weight: 400;
	margin-top: 11px;
}
#event .event-wrap .event-item-dtl .ei-inner .min {
	font-size: 1.4rem;
	font-weight: 400;
	margin-top: 4px;
}
#event .event-wrap .event-item-dtl .ei-inner.fx .ei-body {
	width: 47%;
	margin: 0 0 3% 3%;
}
#event .event-wrap .event-item-dtl .ei-inner.fx .ei-body:last-child {
	width: 45%;
	padding-left: 3%;
	border-left: 1px dashed #707070;
}
.link-arc {
	padding-top: 150px;
	margin-top: -150px;
}
#food-link.link-arc,
#online-link.link-arc {
	padding-top: 50px;
	margin-top: -50px;
}
#nav-inner {
	display: block;
}

@media screen and (max-width: 768px){	
	#nav {
		/* padding: 0 0px 10px; */
		padding: 1px 0px 10px;
	}
	#nav ul {
		margin-bottom: -20px;
		max-width: 500px;
		margin: 20px 5% 0;
		display: grid;
		gap: 0 5px;
		grid-template-columns: repeat(3,1fr);
	}
	#nav ul > li {
    width: 100%;
		margin-bottom: 15px;
		height: 58px;
	}
	#nav ul > li .btn {
		display: block;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 12px 15px;
	}
	#nav ul > li .btn.pad_event {
		padding: 10px 12px;
	}
	#event h2 {
		max-width: 65%;
	}
	#event .event-wrap .event-item-dtl {
		padding: 30px 25px 45px;
    margin: 0 0 25px;
	}
	#event .event-wrap .event-item-dtl .sub-ttl {
		font-size: 2.2rem;
    text-align: left;
		line-height: 1.3;
	}
	#event .event-wrap .event-item-dtl .ei-inner.fx {
		display: block;
		margin: 0 auto;
	}
	#event .event-wrap .event-item-dtl .ei-body,
	#event .event-wrap .event-item-dtl .ei-body:last-child {
    width: 100%;
    margin: 0 0 0 0;
	}
	#event .event-wrap .event-item-dtl .ei-body:last-child {
    border-left: none;
		/*
		padding: 16px 0 0 0;
    border-top: 1px dashed #707070;
    margin-top: 18px;
		*/
	}
	#event .event-wrap .event-item-dtl .ei-inner .mm {
    font-size: 1.6rem;
	margin-bottom: 8px;
    line-height: 1.3;
	margin-top: 0;
	}
	#event .event-wrap .event-item-dtl .ei-inner .normal {
    font-size: 1.4rem;
		border-top: 1px solid #010101;
    padding-top: 8px;
	}
	#event .event-wrap .event-item-dtl .ei-inner .mm i.sp_large {
		font-size: 1.6rem;
	}
	#event .event-wrap .event-item-dtl .ei-inner.pr {
    padding-right: 0;
	}
	#event .event-wrap .event-item-dtl .sub-ttl.adj {
    margin-bottom: 8px;
	}
	#event .event-wrap .event-item-dtl .koumori {
    right: 5.5%;
    top: 115px;
    width: 88px;
	}
	#kids .brand {
    margin-top: 17px;
	}
	.item-spec .item,
	.item-spec .price > span {
		margin-top: 5px;
	}

	.link-arc {
		padding-top: 300px;
		margin-top: -300px;
	}
	#sweets-link.link-arc {
		padding-top: 210px;
    margin-top: -210px;
	}
	
	.menu-ttl {
		text-align: center;
		display: none !important;
		width: 158px;
    margin: 0 auto;
	}
	#nav.fixed .menu-ttl {
    display: block !important;
    width: 158px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
	}
	.menu-ttl span {
		display: inline-block;
	}
	.menu-ttl span::after {
		content: '';
		width: 11px;
		height: 11px;
		border: 0px;
		border-top: solid 2px #fff;
		border-right: solid 2px #fff;
		position: absolute;
		top: 35%;
		transform: translateY(-50%) translateX(0) rotate(135deg);
		right: -22px;
		transition: all .2s ease-in;
	}
	.menu-ttl.open span::after {
		top: 55%;
    transform: translateY(-50%) translateX(0) rotate(-45deg);
	}
	#nav.fixed #nav-inner {
		display: none;
		margin-bottom: 15px;
	}
}
/**/
.ttl-sub-content {
	text-align: center;
	margin: 20px 0 75px;
}
.ttl-sub-content p {
	font-size: 1.4rem !important;
	color: #000;
}
.ttl-sub-content .main {
	font-size: 2.2rem !important;
	color: #fff;
	font-weight: 700;
	line-height: 1;
}
.ttl-sub-content .main span {
	display: inline-block;
	background: url(../../img/bg_ttl.png) no-repeat 0 0;
	background-size: 100% 100%;
	padding: 10px 16px;
	margin: 0 0 10px;
}
.ttl_online_store {
	width: 666px;
	margin: 0 auto 25px;
}

@media screen and (max-width: 768px) {
	.ttl-sub-content {
    margin: 15px 0 45px;
	}
	.ttl-sub-content .main {
		font-size: 1.6rem !important;
	}	
	.ttl-sub-content .main span {
		padding: 11px;
	}
	.ttl_online_store {
    width: 100%;
    margin: 0 auto 20px;
	}

}


/*=======================================
	online
=======================================*/
#online .content {
	background: url(../../img/bg_event_content02.png) no-repeat 0 0;
	background-size: 80% 100%;
	background-position: center;
	padding: 30px 70px 35px;
	margin: 144px 0 38px;
	position: relative;
}
#online .content .online_outline {
	width: 510px;
	margin: 60px auto 37px;
	padding-top: 0;
}
#online .content .online_outline::before {
	display: none;
}
#online .content .clm {
	display: flex;
	gap: 0 40px;
	align-items: center;
	width:60%;
	margin:0 auto;
}
#online .content .clm .left {
	width: 350px;
}
#online .content .clm .right {
	/*width: calc(100% - 350px - 40px);*/
	text-align: left;
}
#online .content .clm .right p.wide {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 24px;
}
#online .content .clm .right p.st_opt {
	font-size: 14px;
	padding-left:1em;
	text-indent:-1em;
	margin-bottom: 40px;
}
#online .content .clm .right .btn {
	width: 300px;
	padding: 0;
	transition: all .3s ease;
}
#online .content .clm .right .btn a {
	display: block;
	width: 100%;
}
@media (hover: hover) {
	#online .content .clm .right .btn a:hover {
		opacity: 1;
	}
}
@media screen and (max-width: 768px) {
	#online .content {
		padding: 30px 25px 45px;
		background: url(../../img/bg_online_sp.png) no-repeat 0 0;
		background-size: 96% 100%;
		background-position: center;
		margin: 70px auto 38px;
	}
	#online .content .online_outline {
		margin: 30px auto 15px;
		width: 100%;
		max-width: 298px;
	}
	#online .content .clm {
		flex-direction: column;
		gap: 10px 0;
		margin-bottom: 0;
		width: 86%;
	}
	#online .content .clm .left,
	#online .content .clm .right {
		width: 100%;
	}
	#online .content .clm .right p.wide {
		line-height: 1.3333;
	}
	#online .content .clm .right .btn {
		width: 100%;
		max-width: 300px;
		margin-bottom: 0;
		background-color: #620962;
	}
}


/*=======================================
/* 2024 ADD NEW */
/*ナビ*/
#nav ul {
	/* display: flex;
	flex-wrap: wrap;
	justify-content: space-between; */
	max-width: 660px;
	gap: 10px;
	/* margin: 0 auto;
	z-index: 10;
	position: relative; */
}
#nav ul > li {
	width: 49%;
}
/*イベント&プレゼント*/
#event h2 {
	/* position: relative;
	display: inline-block; */
	margin: 245px auto 25px;
	width: 512px;
}
#event .event-wrap .event-item-dtl {
	/* background: url(../../img/bg_event_content.png) no-repeat 0 0;
	background-size: 100% 100%;
	padding: 30px 70px 35px;
	margin: 0 0 38px;
	position: relative; */
	flex-grow: 1;/*2024追加*/
}
#event .event-wrap .event-item-dtl .sub-ttl span {
	font-size: 1.8rem;
	display: block;
	line-height: 1.6;
}

/*アイテム共通*/
#kids .ttlbox{
	margin: -147px auto 50px;
	padding-top: 147px;
}
#kids .ttlbox .subttl{
	position: relative;
	font-size: 2.0rem;
	color: #620962;
	font-weight: bold;
}
#kids .ttlbox .subttl span{
	position: relative;
}
#sweets .ttlbox .subttl span::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: -50px;
	right: -50px;
	width: 57px;
	height: 54px;
	background: url(../../img/ttl_sweets_illust.png) 0 0 no-repeat;
	background-size: contain;
	animation: swing 1s ease-in-out infinite alternate;
}
/*スイーツ*/
#sweets h2 {
	position: relative;
	display: inline-block;
	margin: auto;
	padding-top: 0;
	width: 440px;
}
#sweets h2::before {
	display: none;
}

#sweets ul > li:nth-child(n+7) {
	display: block;
}

/*フード*/
#foods::before {
  content: '';
  position: absolute;
  top: 117px;
  left: 50%;
  display: block;
  width: 100%;
  max-width: 780px;
  height: 160px;
  background: url(../../img/spider.png) top right no-repeat;
  transform: translateX(-50%);
}
#foods h2 {
	width: 348px;
}

#foods .ttlbox .subttl span::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: -50px;
	right: -50px;
	width: 57px;
	height: 54px;
	background: url(../../img/ttl_foods_illust.png) 0 0 no-repeat;
	background-size: contain;
	animation: swing 1s ease-in-out infinite alternate;
}
/*レストラン*/
#kids.contents_box {
	padding-bottom: 0px;
}
#kids-area h2 {
	width: 680px;
}
#kids-area .ttlbox .subttl span::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: -50px;
	right: -50px;
	width: 57px;
	height: 54px;
	background: url(../../img/ttl_restaurant_illust.png) 0 0 no-repeat;
	background-size: contain;
	animation: swing 1s ease-in-out infinite alternate;
}

@media screen and (max-width: 768px){	
	/* #nav {
		padding: 0 0px 10px;
	} */
	.link-arc {
		padding-top: 200px;/*300pxから変更*/
		margin-top: -200px;/*-300pxから変更*/
	}
	#online-link.link-arc {
		padding-top: 200px;
		margin-top: -200px;
	}
	#nav ul {
		/* margin-bottom: -20px;
		max-width: 500px; */
		margin: 20px 10% 0;
		display: grid;
		gap: 10px;
		grid-template-columns: repeat(2, 1fr);
	}
	#nav ul > li {
		margin-bottom: 0;
    width: 100%;
	}
	#nav ul > li .btn {
		/* display: block;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 12px 15px; */
	}
	#nav ul > li .btn.pad_sweets {
		padding: 1% 9%;
	}
	#nav ul > li .btn.pad_foods {
    padding: 1% 8%;
	}
	#nav ul > li .btn.pad_restaurant {
		padding: 1% 5%;
	}
	#nav ul > li .btn.pad_online {
    padding: 5% 14%;
	}

	/*イベント&プレゼント*/
	#event h2 {
		/* margin-bottom: 30px; */
		margin-top: 230px;
		max-width: 76%;
	}
	#event h2::before {
		top: -40px;
		/* right: 0;
		width: 15%;
		height: 0;
		padding-top: 20%; */
	}

	/*アイテム共通*/
	#kids .ttlbox{
		margin: -60px auto 30px;
		padding-top: 147px;
	}
	#kids .ttlbox .subttl{
		position: relative;
		font-size: 1.6rem;
		color: #620962;
		font-weight: bold;
	}
	#kids .ttlbox .subttl span{
		position: relative;
	}
	#sweets .ttlbox .subttl span::before {
		display: none;
	}
	/*スイーツ*/
	#sweets h2 {
		/* position: relative;
		display: inline-block;
		margin: -147px auto 50px;
		padding-top: 147px; */
		/* width: 290px; */
		width: auto;
		max-width: 80%;
	}
	#sweets ul > li:last-of-type{
		margin-bottom: 0;
	}
	#sweets ul > li:nth-child(n+7) {
		display: block;
	}

	/*フード*/
	#foods h2 {
		width: auto;
		max-width: 70%;
	}
	#foods .ttlbox .subttl span::before {
		display: none;
	}
	#kids-area h2 {
		width: auto;
		max-width: 100%;
	}
	#kids .ttlbox .subttl span::before {
		display: none;
	}
}
	/*デパちか*/
	.footbnr {
		display: block;
		text-align: center;
		margin: 6em auto 4em;
	}
@media screen and (max-width: 767px){
	.footbnr {
		width: 90%;
		margin: 4em auto 0;
	}
}
