@charset "UTF-8";
html{
	scroll-behavior: smooth;
}
body{
	-webkit-font-smoothing: antialiased;
	color: #000;
	text-align: left;	
	background: #EAE6DB;
	font-family:"inter-variable", "source-han-sans-japanese", "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","user-Inter","YuGothic","メイリオ",Meiryo,sanserif; 	
    font-size: 16px;
	letter-spacing: 0.09em;
}
p {
    margin: 0;
}
a{
	color: #000;
	text-decoration: none;
}
li{
	list-style: none;
}
img{
	width: 100%;
}

li {
  list-style: none;
}

/* FADEIN */
.scroll_up {
  transition: 0.8s ease-in-out;
  transform: translateY(30px);
  opacity: 0;
}
.scroll_up.on {
  transform: translateY(0);
  opacity: 1.0;
}
.fadein {
	transition: 0s;
	opacity: 0;
}
.fadein.isshow {
	opacity: 1.0;
}
.head-cont {
	position: absolute;
	z-index: 2;
}
.kv-area, .background-cont {
	height: 100vh;
}
.background-cont {
	position: fixed;
}
.logo-fixed {
	position: fixed;
    width: 13%;
    bottom: 20px;
    left: 20px;
}
.statement-fixed {
	width: 80px;
    position: fixed;
    top: 20px;
    right: 20px;
}
.shop-link {
	position: fixed;
    bottom: 30px;
    right: 20px;
    text-decoration: none;
    background-color: #F4997D;
    color: #000;
    padding: 1em 2em;
    border-radius: 15px;
    font-weight: 600;
	transition: .3s;
	border: solid 1px #F4997D;
}
a.shop-link:hover {
	background-color: #000;
	color: #EAE6DB;
	border: #000 solid 1px;
}
.left-top {
	position: fixed;
    top: -25%;
    left: -15%;
    transform: rotate(-37deg);
    width: 70%;
}
.right-top {
	position: fixed;
    top: -20%;
    right: -20%;
    transform: rotate(34deg);
    width: 70%;
}
.left-bottom {
	position: fixed;
    bottom: -15%;
    left: -20%;
    transform: rotate(38deg);
    width: 70%;
}
.right-bottom {
	position: fixed;
    transform: rotate(-40deg);
    bottom: -20%;
    right: -28%;
    width: 70%;
}
.img-cont {
	width: 80%;
    height: 80vh;
    position: relative;
    margin: 7% auto;
}
.img-cont p {
	position: absolute;
	opacity: 0;
}
.img-01 {
	width: 37%;
    top: 20%;
    left: 10%;
  animation: fadeAnimation 6.5s infinite; 
}
.img-02 {
	width: 30%;
    right: 15%;
    top: 8%;
  animation: fadeAnimation 6.5s infinite; 
}
.img-03 {
	width: 55%;
    left: 25%;
    top: 32%;
  animation: fadeAnimation 6.5s infinite; 
}
.img-04 {
	width: 28%;
    right: 2%;
    bottom: -4;
  animation: fadeAnimation 6.5s infinite; 
}
.img-05 {
	left: 5%;
    width: 46%;
    bottom: 3%;
  animation: fadeAnimation 6.5s infinite; 
}
.img-06 {
	width: 35%;
    left: 30%;
    top: 30%;
  animation: fadeAnimation 6.5s infinite; 
}
.img-07 {
	width: 38%;
    top: 0;
    left: -7%;
  animation: fadeAnimation 6.5s infinite; 
}
.img-08 {
	width: 35%;
    right: 12%;
    bottom: 0;
  animation: fadeAnimation 6.5s infinite; 
}
.img-09 {
	width: 40%;
    left: 10%;
    bottom: -7%;
  animation: fadeAnimation 6.5s infinite; 
}
.img-10 {
	width: 70%;
    top: -8%;
    right: 0;
  animation: fadeAnimation 6.5s infinite; 
}
.img-11 {
	bottom: 15%;
    width: 30%;
    right: 30%;
  animation: fadeAnimation 6.5s infinite; 
}
.img-12 {
	width: 30%;
    top: 8%;
    right: 15%;
  animation: fadeAnimation 6.5s infinite; 
}
.img-02 {
	animation-delay: .5s;
}
.img-03 {
	animation-delay: .68s;
}
.img-04 {
	animation-delay: .78s;
}
.img-05 {
	animation-delay: .98s;
}
.img-06 {
	animation-delay: 1.2s;
}
.img-07 {
	animation-delay: 1.35s;
}
.img-08 {
	animation-delay: 1.45s;
}
.img-09 {
	animation-delay: 1.6s;
}
.img-10 {
	animation-delay: 1.75s;
}
.img-11 {
	animation-delay: 1.83s;
}
.img-12 {
	animation-delay: 1.96s;
}
@keyframes fadeAnimation {
  0% { opacity: 0; }
  1% { opacity: 1; } /* フェードイン */
  45% { opacity: 1; } /* 表示状態を保持 */
  50% { opacity: 0; } /* フェードアウト */
  100% { opacity: 0; } /* 次の表示まで透明 */
}
.main-area {
	position: relative;
	height: 95vh;
	font-weight: 600;
}
.event-info {
	width: calc(100% - 40px);
    margin: auto;
    font-size: 1.2em;
}
.info-ttl {
	margin-top: 1em;
}
.credit {
	width: calc(100% - 40px);
    margin: 4em auto;
    font-size: .85em;
    line-height: 1.8;
}
th {
	width: 4em;
}
.sp-only {
	display: none;
}
span.pc {
	display: inline-block;
}
@media screen and (max-width: 1024px) {

}
@media screen and (max-width: 820px) {
.logo-fixed {
    width: 180px;
}
.left-top {
	top: -10%;
}
.right-top {
    top: -13%;
}
.right-bottom {
    bottom: -8%;
}
.event-info {
    width: 80%;
    margin: 0 auto 0 20px;
    padding-top: 5em;
}
.img-cont {
    height: 90dvh;
}
.img-03 {
	width: 85%;
    left: 7.5%;
}
.img-04 {
    width: 33%;
    right: -50px;
    bottom: -20px;
}
.img-05 {
    left: -50px;
    width: 55%;
    bottom: -20px;
}
.img-06 {
    width: 60%;
    left: 30%;
}
.img-07 {
    left: -30px;
}
.img-08 {
    width: 40%;
    right: 18%;
    bottom: 3%;
}
.img-09 {
	width: 47%;
    bottom: 15%;
}
.img-11 {
    bottom: 17%;
    width: 46%;
    right: 0;
}
.img-12 {
    width: 45%;
    right: 5%;
}
.img-05 {
    left: 0;
    width: 55%;
    bottom: 0;
}
}
@media screen and (max-width: 768px) {
	span.pc {
		display: none;
	}
	.sp-only {
		display: block;
	}
	.shop-link {
    background-color: #F4997D;
    color: #000;
	transition: none;
	border: solid 1px #F4997D;
}
a.shop-link:hover {
    background-color: #F4997D;
    color: #000;
	border: solid 1px #F4997D;
}
}
/*iPhone14*/
@media screen and (max-width: 520px) {
	.left-top {
        top: -5%;
        transform: rotate(-30deg);
    }
    .right-top {
        top: -5%;
        transform: rotate(20deg);
    }
	.left-bottom {
		bottom: -2%;
		transform: rotate(30deg);
	}
	.right-bottom {
		bottom: -5%;
	}
.statement-fixed {
	width: 60px;
}
.logo-fixed {
	width: 120px;
}
.shop-link {
	font-size: .76em;
}
.img-01 {
	top: 18%;
    width: 65%;
    left: -20px;
}
.img-02 {
    width: 75%;
    right: 0;
    top: 0;
}
.img-03 {
	width: 100%;
	left: 0;
	top: 37%;
}
 .img-04 {
	 width: 40%;
	 right: -5%;
	 bottom: 5%;
}
.img-05 {
	left: -8%;
	width: 68%;
	bottom: 0;
}
.img-06 {
	width: 67%;
	left: -25px;
	top: 55%;
}
.img-07 {
    width: 42%;
    top: 0;
    left: 10px;
}
	.img-10 {
		top: 20%;
		right: auto;
		left: 0;
	}
	.img-09 {
		width: 70%;
	}
    .img-11 {
        width: 56%;
        right: -35px;
    }
	.img-12 {
		top: 25%;
        left: auto;
        right: 5%;
    }
	.event-info {
		padding-top: 3em;
		font-size: .8em;
	}
	.credit {
    font-size: .7em;
    line-height: 1.6;
}
}
@media screen and (max-width: 390px) {
	    .logo-fixed {
        width: 100px;
    }
	    .statement-fixed {
        width: 50px;
    }
	    .shop-link {
        font-size: .7em;
    }
	    .event-info {
        font-size: .75em;
    }
	    .credit {
        font-size: .6em;
	}
}