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

/* Loading背景画面設定　*/
#splash {
/*fixedで全面に固定*/
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 999;
  background-color:#e2c3d6;
  text-align:center;
  color:#fff;
}


/* Loading画像中央配置　*/
#splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定　*/
#splash_logo img {
  width:350px;
}

/* fadeUpをするアイコンの動き */
.fadeUp{
animation-name: fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/* 汎用ヘッダー */

.p-head {
	width:100%;
	max-width:720px;
	margin:0 auto 60px;
	position:relative;
	z-index:1;
}

.p-secret-link {
	display:block;
	position:absolute;
	z-index:10;
	width:20%;
	aspect-ratio: 16 / 9 ;
	top:0;
	left:40%;
}

/* 開催日 */

.p-day {
	width:100%;
	max-width:1200px;
	margin:0 auto;
}

/* はじめに */

.p-about-text {
	background-color:#fff;
	box-sizing:border-box;
	width:100%;
	max-width:960px;
	padding:32px;
	border-radius:20px;
	color:#222222;
	margin:0 auto;
}


.p-about-text p {
	font-size:1.8rem;
	line-height:2;
}


@media screen and (min-width:961px) { /*PC*/
	.p-about-text p {
		text-align:center;
	}
}
@media screen and (max-width:960px) { /*MB*/
	.p-about-text p {
		text-align:left;
	}
}


/* リンク */

ul.p-link {
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	gap:40px;
}

ul.p-link li a {
	transition:all 0.3s;
	display:block;
	margin-bottom:8px;
}

ul.p-link li a:hover {
opacity: 0.6;;
}

ul.p-link li p {
	font-size:1.8rem;
	font-weight:700;
	color:#fff;
	margin-bottom:4px;
}
ul.p-link li span {
	font-size:1.4rem;
	font-weight:400;
	color:#fff;
}

/* 汎用 */

h3.p-h3a {
	background-color:#000;
	color:#fff;
	display:inline;
	font-weight:700;
	font-size:2rem;
	box-sizing:border-box;
	padding:4px 16px 8px;
}

h3.p-h3b {
	background-color:#fff;
	color:#4e082c;
	display:inline;
	font-weight:700;
	font-size:2rem;
	box-sizing:border-box;
	padding:4px 16px 8px;
}

.p-text {
	width:100%;
	max-width:960px;
	margin:0 auto;
	text-align:left;
}

.p-text p {
	font-size:2rem;
	line-height:1.6;
}

.p-text p strong {
	font-weight:700;
	background: linear-gradient(transparent 60%, yellow 30%);
}

.p-text p strong span {
	font-weight:700;
}

.p-text p strong.cl01 {
	background: linear-gradient(transparent 60%, #a1def7 30%);
}

.p-text2 {
	width:100%;
	max-width:960px;
	margin:0 auto;
	text-align:left;
}

.p-text2 p {
	font-size:2rem;
	line-height:1.6;
	color:#fff;
}

.p-text2 p strong {
	font-weight:700;
	background: linear-gradient(transparent 60%, #c01c51 30%);
}

.p-text2 p strong span {
	font-weight:700;
}

.p-attention {
	width:100%;
	max-width:960px;
	margin:0 auto;
	border:1px solid #333333;
	box-sizing:border-box;
	padding:16px;
	border-radius:15px;
	text-align:left;
}

.p-attention p {
	font-size:1.5rem;
	line-height:1.6;
	color:#666666;
}

.p-attention2 {
	width:100%;
	max-width:960px;
	margin:0 auto;
	border:1px solid #ffffff;
	box-sizing:border-box;
	padding:16px;
	border-radius:15px;
	text-align:left;
}

.p-attention2 p {
	font-size:1.5rem;
	line-height:1.6;
	color:#ffffff;
}

/* メニュー */

.p-menu-wrap {
	width:100%;
	position:relative;
	display:flex;
	justify-content: center;
	gap:48px;
	flex-wrap:wrap;
}

.p-menu-box {
	width:100%;
	max-width:480px;
	position:relative;
	display:flex;
	flex-direction:column;
}

.p-menu-img {
	width:100%;
	box-sizing:border-box;
	border-radius:10%;
	border:1px solid #000;
	overflow:hidden;
	margin-bottom:16px;
}

.p-menu-title {
	font-size:1.8rem;
	text-align:left;
	margin-bottom:16px;
	display:flex;
	align-items:center;
	justify-content: flex-start;
	flex-wrap:wrap;
}

.p-menu-title span {
	font-size:70%;
	color:#fff;
	box-sizing:border-box;
	padding:4px 12px;
	margin-right:4px;
	font-weight:700;
	border-radius:5px;
	line-height:1.5;
}

.p-menu-title p {
	font-weight:700;
	line-height:1.5;
}

.p-cat01 {background-color:#64b4d4;}
.p-cat02 {background-color:#eb668f;}
.p-cat03 {background-color:#eac86b;}


.p-menu-price {
	font-size:1.5rem;
	text-align:left;
	margin-bottom:16px;
}

.p-menu-price p {
	font-weight:700;
	font-size:1.7rem;
}

.p-menu-price p span {
	font-size:80%;
	margin-left:4px;
}

.p-menu-text {
	text-align:left;
	line-height:1.6;
	margin-bottom:16px;
}

.p-menu-text p {
	text-align:left;
	line-height:1.6;
	font-size:1.5rem;
}

.p-menu-material {
	background-color:#eeeeee;
	box-sizing:boder-box;
	padding:12px;
	line-height:1.6;
	border-radius:10px;
	text-align:left;
	margin-top:auto;
}

/* ノベルティ */

.p-coaster-wrap {
	width:100%;
	max-width:1596px;
	margin:0 auto;
}

.p-coaster-wrap ul {
	display:flex;
	flex-wrap:wrap;
	gap:24px;
	justify-content: center;
	width:100%;
	position:relative;
}

.p-coaster-wrap ul li {
	width:calc(50% - 12px);
	max-width:300px;
	border-radius:5%;
	overflow:hidden;
	box-shadow:0 0 15px rgba(0,0,0,0.5);
	position:relative;
}

.p-coaster-wrap ul li.s3 {
	overflow:visible!important;
}

.p-coaster-wrap ul li.s3 a {
	display:block;
	width:138.8%;
	aspect-ratio:1 / 1;
	position:absolute;
	left:-19.4%;
	top:0;
	right:0;
	bottom:0;
	margin:auto;
	background: url("../img/novelty/coaster07b.avif") center center no-repeat;
	background-size:contain;
}

.p-lunchmat-wrap {
	width:100%;
	max-width:1596px;
	margin:0 auto;
}

.p-lunchmat-wrap ul {
	display:flex;
	flex-wrap:wrap;
	gap:24px;
	justify-content: center;
	width:100%;
	position:relative;
}

.p-lunchmat-wrap ul li {
	width:100%;
	max-width:640px;
	border-radius:2%;
	overflow:hidden;
	box-shadow:0 0 15px rgba(0,0,0,0.5);
}

/* グッズ販売 */


.p-goods-wrap {
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	gap:48px;
}

.p-goods-box {
	position:relative;
	box-sizing:border-box;
	display:flex;
	flex-direction:column;
	text-align:left;
	gap:8px;
	width:100%;
	max-width:480px;
}

.p-goods-img {
	box-sizing:border-box;
	border-radius:5%;
	border:1px solid #000;
	overflow:hidden;
	background-color:#000;
}

.p-goods-title {
	font-size:1.8rem;
	text-align:left;
	display:flex;
	align-items:center;
	justify-content: flex-start;
	flex-wrap:wrap;
}


.p-goods-title p {
	font-weight:700;
	line-height:1.5;
	color:#4e082c;
}

.p-goods-price {
	font-size:1.5rem;
	text-align:left;
	margin-bottom:6px;
}

.p-goods-price p {
	font-weight:700;
	font-size:1.7rem;
}

.p-goods-price p span {
	font-size:80%;
	margin-left:4px;
}

.p-goods-text {
	background-color:#eeeeee;
	box-sizing:boder-box;
	padding:4px 12px;
	line-height:1.6;
	border-radius:10px;
	text-align:left;
	margin-top:auto;
}

.p-goods-text p {
	text-align:left;
	line-height:1.6;
	font-size:1.4rem;
}

/* 受注販売 */

.p-order-wrap {
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	gap:40px 32px;
}

.p-order-box {
	position:relative;
	box-sizing:border-box;
	display:flex;
	flex-direction:column;
	text-align:left;
	gap:8px;
}

.p-order-f6>.p-order-box {
	width:calc(50% - 20px);
	max-width:360px;
}

.p-order-img {
	box-sizing:border-box;
	border-radius:3%;
	border:1px solid #000;
	overflow:hidden;
	background-color:#000;
	margin-bottom:8px;
}

.p-order-f6>.p-order-img {
	aspect-ratio:1 / 1;
}

.p-order-img a {
	position:relative;
	display:block;
	transition:all 0.3s;
}

.p-order-img a:hover {
	opacity:0.6;
}

.p-order-img a:after {
	content: "";
	display:block;
	background: url("../img/order/zoom_icon.avif") center center no-repeat;
	width:50px;
	height:50px;
	border-radius:25px;
	overflow:hidden;
	background-size:cover;
	position:absolute;
	right:10px;
	bottom:10px;
	z-index:10;
}

.p-order-category {
	display:flex;
	gap:8px;
	flex-wrap:wrap;
}

.p-order-category p {
	border-radius:4px;
	font-size:1.5rem;
	font-weight:700;
	box-sizing:border-box;
	padding:6px 16px;
	display:flex;
	align-items:center;
}

.or1 {background:#fff; color:#ff0066; border:1px solid #ff0066;}
.or2 {background:#fff; color:#18b4f3; border:1px solid #18b4f3;}
.or3 {background:#fff; color:#ffa235; border:1px solid #ffa235;}

.orA {background:#f5d170; color:#fff;}
.orB {background:#68bbdd; color:#fff;}
.orC {background:#bb1b40; color:#fff;}
.orD {background:#eb668f; color:#fff;}
.orZ {background:#ff0066; color:#fff;}

.p-order-title {
	font-size:1.8rem;
	text-align:left;
	display:flex;
	align-items:center;
	justify-content: flex-start;
	flex-wrap:wrap;
}

.p-order-title p {
	font-weight:700;
}

.p-order-outline dl {
	width:100%;
	max-width:960px;
	margin:0 auto 5px;
	display:flex;
	justify-content: flex-start;
}

.p-order-outline dl dt {
	color:#323232;
	text-align:center;
	display:flex;
	justify-content: center;
	align-items:center;
	font-size:1.6rem;
	
	line-height:1.7;
	padding:8px;
	background-color:#d6d6d6;
	border:1px solid #eeeeee;
}

.p-order-outline dl dt p {
	font-weight:700;
}

.p-order-outline dl dd {
	color:#323232;
	text-align:left;
	display:flex;
	justify-content: flex-start;
	align-items:center;
	font-size:1.7rem;
	
	line-height:1.7;
	padding:8px 12px;
	background-color:#ffffff;
	
	border-top:1px solid #eeeeee;
	border-right:1px solid #eeeeee;
	border-bottom:1px solid #eeeeee;
}

.p-order-outline dl dd p {
	font-weight:700;
}

.p-order-outline dl dd p span {
	font-size:80%;
	font-weight:400;
}

@media screen and (min-width:961px) { /*PC*/
	.p-order-outline dl {
	}
	.p-order-outline dl dt {
		width:15%;
	}
	.p-order-outline dl dd {
		width:85%;
	}
}
@media screen and (max-width:960px) { /*MB*/
	.p-order-outline dl {
		flex-wrap:wrap;
	}
	.p-order-outline dl dt {
		width:100%;
	}
	.p-order-outline dl dd {
		width:100%;
	}
}

.p-shoplink a {
	display:flex;
	align-items:center;
	justify-content: center;
	color:#fff;
	background-color:#ff0066;
	font-weight:700;
	font-size:2.5rem;
	width:100%;
	max-width:400px;
	height:80px;
	border-radius:40px;
	margin:0 auto;
}

.p-shoplink a span {
	height:40px;
	width:40px;
	position:absolute;
	right:20px;
	top:20px;
	background: url("../img/link_arrow.avif") center center no-repeat;
	background-size:cover;
	display:block;
	transition:all 0.3s;
}

.p-shoplink a:hover {
	text-decoration:none;
	opacity:0.6;
}

/* 開催概要 */

.p-map {
	width:100%;
	max-width:960px;
	margin:0 auto 24px;
	background-color:#000;
	position:relative;
	border-radius:20px;
	overflow:hidden;
}

.p-map iframe {
	width:100%;
	aspect-ratio:16 / 6;
}

.p-info-block dl {
	width:100%;
	max-width:960px;
	margin:0 auto 5px;
	display:flex;
	justify-content: flex-start;
}

.p-info-block dl dt {
	color:#fff;
	text-align:center;
	display:flex;
	justify-content: center;
	align-items:center;
	font-size:1.6rem;
	width:15%;
	line-height:1.5;
	padding:8px;
	background-color:#5b5151;
}

.p-info-block dl dd {
	color:#5b5151;
	text-align:left;
	display:flex;
	justify-content: flex-start;
	align-items:center;
	font-size:1.6rem;
	line-height:1.5;
	padding:8px 12px;
	background-color:#ffeaf1;
	width:85%;
}

@media screen and (min-width:961px) { /*PC*/
	.p-info-block dl {
	}
	.p-info-block dl dt {
		width:15%;
	}
	.p-info-block dl dd {
		width:85%;
	}
}
@media screen and (max-width:960px) { /*MB*/
	.p-info-block dl {
		flex-wrap:wrap;
	}
	.p-info-block dl dt {
		width:100%;
	}
	.p-info-block dl dd {
		width:100%;
	}
}


/* 注意書き */

.p-text-attention {
	width:100%;
	max-width:960px;
	margin:0 auto;
	font-size: 1.6rem;
	line-height: 1.65;
	color:#222222;
	text-align: left;
}

.p-text-attention p strong {
	font-weight:700;
	color:#837127;
}

/* フッター */

.p-foot-logo {
	width:100%;
	max-width:480px;
	margin:0 auto 32px;
}

.p-foot-link {
	display:flex;
	justify-content: center;
	gap:12px;
	margin:0 auto 32px;
	flex-wrap:wrap;
}

.p-foot-link a {
	width:300px;
	position:relative;
}

.p-copyright {
	color:#fff;
	font-size:1.6rem;
	margin:0 auto 24px;
}
