@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;600;800;900&family=Poppins:wght@400;600;700;800&display=swap');

html.disableScroll{
	overflow:hidden;
}

body{
	--color:#132d3c;
	--color1:#fdf5e5;
	--color2:#edc25a;
	--color3:#9a3032;
	--color4:#025a91;
	--ff:Poppins, 'Noto Sans TC', Tahoma, 微軟正黑體, sans-serif;
	--fs:clamp(12px, 1.05vw, 20px);
	--fw:600;
}

.mainContainer{
	max-width:1920px;
	overflow:hidden;
}

.midBlock,
.themeMain{
	display:none;
}

.themeEventContainer{
	font-family: var(--ff);
	font-size:var(--fs);
	font-weight:var(--fw);
	color:var(--color);
	background:var(--color4);
}

/************************************** 其它共用 start ***************************************************/
.cs::-webkit-scrollbar{
	width:8px;
}
.cs.h::-webkit-scrollbar{
	height:8px;
}
.cs::-webkit-scrollbar-thumb{
	border:2px solid transparent;
	border-radius:10px;
	background-color:var(--color4);
	background-clip: content-box;
}
.cs::-webkit-scrollbar-thumb:hover{
	background-color: var(--color);
}

.bg1,
.bg2{
	background-repeat: repeat-x;
	background-position: left top;
	background-size: 4.5%;
}
.bg1{ background-image: linear-gradient(to right, var(--color4) 0%, var(--color4) 50%, #03548b 50%, #03548b 100%);}
.bg2{ background-image: linear-gradient(to right, var(--color3) 0%, var(--color3) 50%, #8b2c30 50%, #8b2c30 100%);}

.themeEventContainer a:hover{
	color:currentColor;
}

/******************* sectionTitle start **********************/
.sectionTitle{
	width:20%;
	aspect-ratio:4.16;
}
.sectionTitle h3{
	font-size: 0;
	height:100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.web .sectionTitle h3{ background-image: url(../images/sectionTitleWeb.svg);}
.store .sectionTitle h3{ background-image: url(../images/sectionTitleStore.svg);}
/******************* sectionTitle end **********************/

/******************* floor start **********************/
.floor{
	background: currentColor url(../images/floorLight.svg) repeat-x center/auto 33.33%;
	aspect-ratio:63.3333;
}
/******************* floor end **********************/

/***************** obj start ************************/
.obj{
	position: absolute;
	left:0;
	top:0;
}
.obj.hang{
	animation:hang 1.5s ease-in-out alternate infinite both;
}
.obj.shake{
	animation:shake 1s ease-in-out alternate infinite both;
}
@keyframes hang{
	from{
		transform: rotate(2deg);
	}
	to{
		transform: rotate(-2deg);
	}
}
@keyframes shake{
	from{
		transform: rotate(-5deg);
	}
	to{
		transform: rotate(5deg);
	}
}
/***************** obj end ************************/

/***************** 汽球 start ************************/
.baloon.hang{
	animation:none;
}
.baloon:before{
	content:"";
	display: block;
	aspect-ratio:0.6995;
	background-image:url(../images/obj_baloon.svg);
	transform-origin: center bottom;
}
.baloon.hang:before{
	animation:hang 1s ease-in-out alternate infinite both;
}
/***************** 汽球 end ************************/

/***************** 數字閃光 start ************************/
.flash{
	animation:0.8s ease-in infinite alternate;
}
.flash.f1{
	animation-name:flash1;
}
.flash.f2{
	animation-name:flash2;
}
.flash.delay1{ animation-delay:0s;}
.flash.delay2{ animation-delay:0.6s;}
.flash.delay3{ animation-delay:1.2s;}
.flash.delay4{ animation-delay:1.8s;}
@keyframes flash1{
	to{
		color:#FFF;
		text-shadow:0 0 0.5em rgba(255, 255, 255, 0.8);
	}
}
@keyframes flash2{
	to{
		color:#f48578;
		text-shadow:0 0 0.5em rgba(255, 255, 255, 0.8);
	}
}
/***************** 數字閃光 end ************************/

/***************** 聚光燈 start ************************/
.spotlight{
	width:4.5%;
	aspect-ratio:3.33;
	background: currentColor;
}
.spotlight.top{	top:0;}
.spotlight.btm{	top:auto; bottom:0;}

.spotlight:before{
	position: absolute;
	left:50%;
	translate:-50% 0;
	content:"";
	display: block;
	background-repeat: no-repeat;
	background-position-x: center;
	background-size: 100%;
	animation:spotlight 1s ease-out alternate infinite;
}
@keyframes spotlight{
	from{
		opacity: 0.5;
	}
}
.spotlight.top:before{
	top:100%;
	background-position-y: top;
}
.spotlight.btm:before{
	bottom:100%;
	background-position-y: bottom;
}
.spotlight.sl1:before{
	width:900%;
	aspect-ratio:2.4285;
	background-image: url(../images/spotlight1.svg);
}
.spotlight.sl1.btm:before{
	scale:1 -1;
}
.spotlight.sl2:before{
	width:1100%;
	aspect-ratio:1.2424;
	background-image: url(../images/spotlight2.svg);
}
/***************** 聚光燈 end ************************/
/************************************** 其它共用 end ***************************************************/

/************************************* 舞台布幕 start ************************************************/
.stage{
	position:fixed;
	left:0;
	top:90px;
	width:100%;
	z-index:1;
	pointer-events: none;
	overflow: hidden;
}

/***************** 側幕 start ************************/
.stage .side{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
.stage .side:before,
.stage .side:after{
	position:absolute;
	top:0;
	width:15%;
	height:100%;
	content: "";
	display: block;
	background: url(../images/stageSide.png) no-repeat left top/100% 100%;
	transition: translate 1s;
}
.stage .side:before{
	left:0;
}
.stage .side:after{
	right:0;
	scale:-1 1;
}
.stage .side:before,
.stage.in.sideOut .side:before{
	translate:-100%;
}
.stage .side:after,
.stage.in.sideOut .side:after{
	translate:100%;
}
.stage.in .side:before,
.stage.in .side:after{
	translate:none;
}
/***************** 側幕 end ************************/

/***************** 數字 start ************************/
.stage .num{
	--side-space:4%;
	position: absolute;
	top:0;
	margin-top:6%;
	width:5.5%;
	aspect-ratio:0.75;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	transition: all 0.5s;
	opacity: 0;
	scale:0;
}
.stage .n1{	background-image: url(../images/stage1.svg);}
.stage .n2{	background-image: url(../images/stage2.svg);}
.stage .n3{	background-image: url(../images/stage3.svg);}
.stage .n4{	background-image: url(../images/stage4.svg);}
.stage .n5{	background-image: url(../images/stage5.svg);}
.stage .n1,
.stage .n3,
.stage .n5{
	right:0;
	margin-right:var(--side-space);
}
.stage .n2,
.stage .n4{
	left:0;
	margin-left:var(--side-space);
}
.stage.s1 .n1,
.stage.s2 .n2,
.stage.s3 .n3,
.stage.s4 .n4,
.stage.s5 .n5{
	opacity:1;
	scale:1;
}
/***************** 數字 end ************************/

/***************** 天幕 start ************************/
.stage .top{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	aspect-ratio:25;
	transition: all 1s;
	translate:0 -100%;
}
.stage.in .top{
	translate:none;
	filter:drop-shadow(0 0.2em 0.1em rgba(0, 0, 0, 0.1));
}

.stage .top:before,
.stage .top:after{
	position: absolute;
	content:"";
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-repeat: repeat-x;
	background-position: left top;
	background-size: contain;
}
.stage .top:before{
	display: block;
	background-image:url(../images/stageTop1.svg);
}
.stage .top:after{
	display: none;
	background-image:url(../images/stageTop2.svg);
}
.stage.in._store .top:before{
	display: none;
}
.stage.in._store .top:after{
	display: block;
}
/***************** 天幕 end ************************/

/********************* 紙片 start *************************/
.paperWrapper{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
.paperWrapper div{
	position: absolute;
	width:1em;
}
.paperWrapper div:before{
	content:"";
	display: block;
	aspect-ratio:1;
	background-image: url(../images/paper.svg);
	background-repeat: no-repeat;
	background-position-y: center;
	background-size: 600%;
	animation-iteration-count:infinite;
}
.paperWrapper div.o1:before{ background-position-x: 0%; animation-name:rotate1; animation-duration: 6s;}
.paperWrapper div.o2:before{ background-position-x: 20%; animation-name:rotate2; animation-duration: 4s;}
.paperWrapper div.o3:before{ background-position-x: 40%; animation-name:rotate1; animation-duration: 5s;}
.paperWrapper div.o4:before{ background-position-x: 60%; animation-name:rotate2; animation-duration: 3s;}
.paperWrapper div.o5:before{ background-position-x: 80%; animation-name:rotate1; animation-duration: 2s;}
.paperWrapper div.o6:before{ background-position-x: 100%; animation-name:rotate2; animation-duration: 1s;}
@keyframes rotate1{
	to{
		transform: rotate(-360deg);
	}
}
@keyframes rotate2{
	to{
		transform: rotate(360deg);
	}
}
/********************* 紙片 end *************************/
/************************************* 舞台布幕 end ************************************************/

/************************************** header start ***************************************************/
.themeEventContainer header{
	position:fixed;
	right:0;
	top:90px;
	width:100%;
	color:var(--color4);
	z-index:2;
}

.themeEventContainer header nav,
.themeEventContainer header ._burgerBtn{
	position:absolute;
	right:0;
	top:0;
}

/********************** nav start *************************/
.themeEventContainer header nav{
	display:flex;
	flex-direction:column;
	align-items: center;
	text-align: center;
	background:rgba(255, 255, 255, 0.9);
	width:0;
	height:100vh;
	font-size:1.05em;
	overflow:hidden;
	transition:all 0.2s;
}

.themeEventContainer header nav > ul{
	margin-top:5em;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.themeEventContainer header nav > ul li{
	border-bottom: 1px solid;
	width:4.2em;
}
.themeEventContainer header nav > ul li+li{
	margin-top:1em;
}
.themeEventContainer header nav a:hover,
.themeEventContainer header nav li.active,
.themeEventContainer header nav li.active a{
	color:var(--color3);
}
.themeEventContainer header nav a{
	display: block;
	font-weight:500;
	padding:0.5em 0;
	line-height:1em;
	color:currentColor;
	transition:all 0.2s;
}
.themeEventContainer header nav > ul li:nth-child(1) a{
	font-size:1.2em;
}
.themeEventContainer header nav a:hover,
.themeEventContainer header nav li.active a{
	font-weight:900;
}

.themeEventContainer header nav .sns{
	margin-top:3em;
}
.themeEventContainer header nav .sns ul{
	display:flex;
}
.themeEventContainer header nav .sns ul li{
	cursor:pointer;
	width:2em;
	transition:transform 0.2s;
}
.themeEventContainer header nav .sns ul li+li{
	margin-left:0.25em;
}
.themeEventContainer header nav .sns ul li:hover{
	transform:scale(1.2);
}
.themeEventContainer header nav .sns ul li:before{
	content:"";
	display:block;
	padding-top:100%;
	background:url(../images/sns.svg) no-repeat;
	background-size:300%;
	background-position-y:top;
}
.themeEventContainer header nav .sns ul li:nth-child(1):before{ background-position-x:left;}
.themeEventContainer header nav .sns ul li:nth-child(2):before{ background-position-x:center;}
.themeEventContainer header nav .sns ul li:nth-child(3):before{ background-position-x:right;}
.themeEventContainer header nav .sns ul li span{
	display:none;
}
/********************** nav end *************************/

/********************** _burgerBtn start *************************/
.themeEventContainer header ._burgerBtn{
	margin:0.8em 0.8em 0 0;
	width:1.8em;
}
.themeEventContainer header ._burgerBtn span,
.themeEventContainer header ._burgerBtn span:before,
.themeEventContainer header ._burgerBtn span:after{
	position:absolute;
	display:block;
	right:0;
	width:100%;
	height:0.15em;
	min-height:2px;
	border-radius:0.25em;
	background:#FFF;
}
.themeEventContainer header ._burgerBtn span:before,
.themeEventContainer header ._burgerBtn span:after{
	content:"";
	top:50%;
	transition:transform 0.2s;
}
.themeEventContainer header ._burgerBtn span{
	top:0;
	margin-top:27.77%;
	z-index:0;
}
.themeEventContainer header ._burgerBtn span:before{ transform:translateY(-350%);}
.themeEventContainer header ._burgerBtn span:after{ transform:translateY(250%);}
.themeEventContainer header ._burgerBtn:after{
	position:absolute;
	right:0;
	top:0;
	content:"";
	display:block;
	width:100%;
	padding-top:65%;
	opacity:0;
	z-index:2;
}
/********************** _burgerBtn end *************************/
/************************************** header end ***************************************************/

.sectionContainer{
	position: relative;
	z-index: 0;
}

/****************************************** home start ************************************************/
.home{
	position: relative;
}

.home .CT{
	position: relative;
	aspect-ratio:2.375;
	background: url(../images/homeBg.svg) no-repeat center/cover;
	animation:homeSky 2s ease-in alternate infinite;
	overflow: hidden;
}
@keyframes homeSky{
	to{
		background-color:rgba(255, 255, 255, 0.25);
	}
}

.home .CT h2{
	position: absolute;
	left:0;
	top:0;
	margin: 6.5% 0 0 22%;
	width: 32%;
	aspect-ratio: 1;
	font-size: 0;
	background: url(../images/homeTitle.svg) no-repeat center top/100%;
}

.home .CT:after{
	position: absolute;
	content:"";
	display: block;
	left:0;
	bottom:0;
	width:31.26%;
	aspect-ratio:2.56;
	background: url(../images/homeObj.svg) no-repeat center/100%;
}

/********************* scrollHint start *************************/
.scrollHint{
	position:absolute;
	left:50%;
	bottom:0;
	width:5%;
	aspect-ratio:1;
	transform:translateX(-50%);
	cursor:pointer;
	filter:drop-shadow(0 0 0.25em rgba(0, 0, 0, 0.25));
}
.scrollHint span{
	position:relative;
	display:block;
	width:100%;
	height:100%;
	animation:scrollHint 0.5s ease-in infinite alternate;
}
@keyframes scrollHint{
	to{
		transform:translateY(10px);
	}
}
.scrollHint span:before,
.scrollHint span:after{
	position:absolute;
	bottom:40%;
	content:"";
	display:block;
	width:50%;
	height:2px;
	background:#FFF;
}
.scrollHint span:before{
	right:50%;
	transform-origin:right bottom;
	transform:rotate(42deg);
}
.scrollHint span:after{
	left:50%;
	transform-origin:left bottom;
	transform:rotate(-42deg);
}
/********************* scrollHint end *************************/
/****************************************** home end ************************************************/

/****************************************** web start ************************************************/
.web .CT{
	position: relative;
}

/******************* sectionTitle start **********************/
.web .sectionTitle{
	position: absolute;
	left:50%;
	top:0;
	margin-top:5%;
	translate:-50% 0;
	z-index: 1;
}
/******************* sectionTitle end **********************/

/******************* 區塊標 start **********************/
._CT hgroup{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	padding:0.55em 0.75em 0.45em;
	font-size: 1.8em;
	white-space: nowrap;
	background: var(--color1);
	border-radius:0.3em;
}
._CT hgroup h4{
	font-size: 1em;
	font-weight: 900;
	line-height: 1em;
	color:var(--color3);
	margin:0 0.3em;
}
._CT hgroup:before,
._CT hgroup:after{
	content:"";
	display: block;
	width:0.25em;
	aspect-ratio:1;
	border-radius:50%;
	background: var(--color4);
}
/******************* 區塊標 end **********************/

/***************** ruleBlock start ************************/
.ruleBlock{
	font-size: 0.9em;
}
.ruleBlock button{
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--color1);
	background:none;
	border:0.15em solid;
	border-radius:2em;
	cursor:pointer;
	font-size: inherit;
	font-family: inherit;
	font-weight: 400;
	line-height: 1em;
	padding:0.5em 1em 0.4em;
	transition: all 0.2s;
}
.ruleBlock button:hover{
	border-color:var(--color3);
	background:var(--color3);
}
/***************** ruleBlock end ************************/

/******************* discount start **********************/
.discount{
	position: relative;
	padding:12% 0 10%;
}

.discount ._CT{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	width:57.89%;
	margin:0 auto;
	z-index: 1;
}

/****** 區塊標 start ******/
.discount ._CT hgroup h4{
	color:var(--color4);
}
.discount ._CT hgroup:before,
.discount ._CT hgroup:after{
	background: #cdbb93;
}
/****** 區塊標 start ******/

.discount ul{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width:100%;
	margin-top:4%;
}
.discount li{
	width:48%;
	border-radius:1em;
	padding:0.25em;
}
.discount li:nth-child(1){
	color:var(--color1);
	background: var(--color3);
}
.discount li:nth-child(2){
	color:var(--color3);
	background: var(--color1);
}
.discount .inner{
	border:0.1em solid;
	border-radius:0.9em;
	padding:0.5em 1em 1.5em;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.discount .inner h5{
	font-size: 2em;
	width:100%;
	height:3.5em;
	padding-bottom: 0.4em;
	display: flex;
	justify-content: center;
	align-items: center;
	background-repeat: repeat-x;
	background-position: left bottom;
	background-size: 5% 0.08em;
}
.discount li:nth-child(1) .inner h5{ background-image: linear-gradient(to right, var(--color1) 0%, var(--color1) 60%, transparent 60%, transparent 100%);}
.discount li:nth-child(2) .inner h5{ background-image: linear-gradient(to right, var(--color3) 0%, var(--color3) 60%, transparent 60%, transparent 100%);}
.discount .detail{
	margin-top:0.5em;
	height:9em;
	font-weight: normal;
	display: flex;
	align-items: center;
}
.discount .detail p{
	margin:0;
}
.discount .detail p em{
	font-style: normal;
	font-weight: 600;
}
.discount li:nth-child(1) .detail p em{	color:var(--color2);}
.discount li:nth-child(2) .detail p em{	color:#cb4a3e;}
.discount .detail p strong{
	font-size: 2.2em;
}
.discount .inner > i{
	margin-top:0.5em;
	font-size: 1.05em;
	font-style: normal;
	border-radius:2em;
	padding:0.6em 0.8em 0.5em;
	line-height: 1em;
}
.discount li:nth-child(1) .inner > i{
	color:var(--color3);
	background:var(--color1);
}
.discount li:nth-child(2) .inner > i{
	color:var(--color1);
	background:var(--color3);
}

.discount .ruleBlock{
	align-self: flex-end;
	margin-top:1em;
}

/******** obj start *********/
.discount .obj{
	z-index: 0;
}
.discount .o1{
	left:50%;
	translate:-50% 0;
}
.discount .o2{
	left:0;
	margin-left:32.5%;
}
.discount .o3{
	left:auto;
	right:0;
	margin-right:32.5%;
}
/******** obj end *********/
/******************* discount end **********************/

/******************* brand start **********************/
.brand ._CT{
	position: relative;
}

/****** 區塊標 start ******/
.brand ._CT hgroup{
	position: absolute;
	left:0;
	top:0;
}
.brand ._CT > hgroup{
	margin:3% 0 0 21.05%;
	z-index: 1;
}
.brand ._CT > hgroup:before,
.brand ._CT > hgroup:after{
	background: #cdbb93;
}
/****** 區塊標 end ******/

.brand .ctWrapper > p{
	font-size: 1.5em;
	font-weight: 600;
	color:var(--color1);
	margin:0;
}

/****** all start ******/
.all{
	position: relative;
	padding:8% 0 2%;
}

.all .ctWrapper{
	margin:0 auto;
	width:57.89%;
}

.all ul{
	display: flex;
	flex-wrap: wrap;
}
.all li{
	width:23.33%;
	margin:2.08% 0 0 2.22%;
}
.all li:nth-child(4n+1){
	margin-left:0;
}

.all a{
	position: relative;
	display: block;
}
.all a > em{
	position: absolute;
	right:0;
	top:0;
	font-size:0.7em;
	font-style: normal;
	font-weight: 800;
	width:30%;
	aspect-ratio:1;
	line-height: 1.6em;
	border:0.15em solid var(--color1);
	border-radius: 50%;
	margin:3.57% 3.57% 0 0;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	color:var(--color3);
	background: var(--color2);
	z-index: 1;
}
.all a > em i{
	font-style: normal;
	font-size: 2em;
}
.all a .img{
	position: relative;
	border-radius:0.6em;
	overflow: hidden;
	background: var(--color1);
	transition: all 0.5s;
	z-index: 0;
}
.all a:hover .img{
	transform:scale(1.05);
	filter:drop-shadow(0 0 0.5em rgba(0, 0, 0, 0.5));
}
.all a img{
	display: block;
	width:100%;
	transition: filter 0.5s;
}
.all a:hover img{
	filter:contrast(120%);
}
.all a .img em{
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio:4;
}

/*** logo start ***/
.logo{
	font-size: 0;
	display: block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.logo.artek{ width:39%; aspect-ratio:3.27;background-image: url(../images/logo_artek.svg);}
.logo.vitra{ width:35%; aspect-ratio:3; background-image: url(../images/logo_vitra.svg);}
.logo.magis{ width:36%; aspect-ratio:4.23; background-image: url(../images/logo_magis.svg);}
.logo.moooi{ width:45%; aspect-ratio:5.25; background-image: url(../images/logo_moooi.svg);}
.logo.finn{ width:40%; aspect-ratio:2.91; background-image: url(../images/logo_finn.svg);}
.logo.maruni{ width:36%; aspect-ratio:5.14; background-image: url(../images/logo_maruni.svg);}
.logo.anglepoise{ width:62%; aspect-ratio:11; background-image: url(../images/logo_anglepoise.svg);}
.logo.e15{ width:20%; aspect-ratio:1.11; background-image: url(../images/logo_e15.svg);}
.logo.string{ width:40%; aspect-ratio:3.125; background-image: url(../images/logo_string.png);}
.logo.gj{ width:45%; aspect-ratio:1.95; background-image: url(../images/logo_gj.svg);}
/*** logo end ***/

/*** obj start ***/
.all .obj{
	left:auto;
	top:auto;
	right:0;
	bottom:0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.all .o1{
	margin:0 20% 1% 0;
	width:16.84%;
	aspect-ratio:1.2121;
	background-image:url(../images/obj_dog.svg);
	transform-origin: 90% bottom;
}
.all .o2{
	margin-right:2%;
	width:17.89%;
}
/*** obj end ***/
/****** all end ******/

/****** week start ******/
.week .ctWrapper{
	position: relative;
	padding:2% 0 4%;
}

.week .ctWrapper > p{
	width:57.89%;
	margin:0 auto;
	text-align: right;
}

.week .ctWrapper > ul{
	position: relative;
	margin-top:4%;
	z-index: 1;
}

.week .group{
	--side-space:21%;
	--narrow:3.94%;
	--wide:21%;
	position: relative;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	padding-top:3.5%;
	padding-bottom:6%;
	aspect-ratio:2.4757;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.week .group+.group{
	margin-top:2%;
}
.week .g1,
.week .g2{
	flex-direction: row-reverse;
}
.week .g1,
.week .g3{
	margin-right:var(--side-space);
	background-image: url(../images/weekGroupL.svg);
}
.week .g1{
	padding-left:28%;
	padding-right:12%;
}
.week .g2{
	margin-left:var(--side-space);
	padding-left:var(--narrow);
	padding-right:var(--wide);
	background-image: url(../images/weekGroupR.svg);
}
.week .g3{
	padding-left:var(--wide);
	padding-right:var(--narrow);
}

.week hgroup{
	--side-space:5%;
	translate:0 -50%;
	z-index: 1;
}
.week .g1 hgroup,
.week .g3 hgroup{
	left:auto;
	right:0;
	margin-right: var(--side-space);
}
.week .g2 hgroup{
	margin-left: var(--side-space);
}

.week time{
	--side-space:22%;
	--narrow:2em;
	--wide:3em;
	position: absolute;
	bottom:100%;
	line-height: 1em;
	color:var(--color2);
	font-weight: 600;
	background: var(--color3);
	padding-top:0.5em;
	padding-bottom:0.3em;
	border-radius:0.5em;
	border-bottom-left-radius:0;
	border-bottom-right-radius:0;
}
.week .g1 time,
.week .g3 time{
	right:0;
	margin-right: var(--side-space);
	padding-left:var(--narrow);
	padding-right:var(--wide);
}
.week .g2 time{
	left:0;
	margin-left: var(--side-space);
	padding-left:var(--wide);
	padding-right:var(--narrow);
}

.week .group p{
	writing-mode: vertical-lr;
	text-orientation:upright;
	font-size:2.2em;
	font-weight: 800;
	line-height: 1em;
}
.week .group p strong{
	font-size:1.6em;
	color:var(--color4);
}
.week .group p strong em{
	font-size:1.6em;
	font-style: normal;
	margin: -0.2em 0 -0.3em;
}

.week .g1 .slick{
	width:80%;
	margin-bottom: 0;
}
.week .g2 .slick,
.week .g3 .slick{
	width:86.29%;
}
.week .slick a{
	display: block;
	margin:0 3.69%;
	border-radius:0.5em;
	overflow: hidden;
}
.week .slick img{
	display: block;
	width:100%;
	transition: filter 0.5s;
}
.week .slick a:hover img{
	filter:contrast(120%);
}
.week .slick a em{
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio:4;
	font-style: normal;
	font-weight:600;
	background: var(--color1);
	transition: all 0.2s;
}
.week .slick a:hover em{
	color:var(--color1);
	background: var(--color4);
}

.week .slick ._slickPN{
	--size:1.8em;
	position: absolute;
	top:50%;
	translate:0 -50%;
	width:var(--size);
	aspect-ratio:1;
	cursor:pointer;
}
.week .slick ._slickPN.prev{
	right:100%;
	margin-right:calc(var(--size) / 5);
	scale:-1 1;
}
.week .slick ._slickPN.next{
	left:100%;
	margin-left:calc(var(--size) / 5);
}
.week .slick ._slickPN span{
	display: block;
	overflow:hidden;
	text-indent:100%;
	white-space: nowrap;
	line-height: 0;
	border:calc(var(--size) / 2) solid transparent;
	border-right:none;
	border-left-color:var(--color4);
	animation: arrowHint 0.5s ease-in alternate infinite;
}
@keyframes arrowHint{
	to{
		translate:20% 0;
		border-left-color:var(--color);
	}
}

/**** obj start ****/
.week .obj{
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.week .obj.stringLight{
	width:26.66%;
	aspect-ratio:4.7428;
	background-image: url(../images/obj_stringLight.svg);
}
.week .g1 .o1{
	width:20%;
	aspect-ratio:0.8413;
	margin:5% 0 0 8%;
	background-image: url(../images/obj_aroma.svg);
}
.week .g1 .o2{
	margin:32% 0 0 100%;
}
.week .g2 .o1{
	left:auto;
	right:100%;
	margin-top:18.5%;
	scale:-1 1;
}
.week .g2 .o2{
	left:auto;
	right:0;
	width:18%;
	aspect-ratio:0.5798;
	margin:-9% 5% 0 0;
	transform-origin: 30% top;
	background-image: url(../images/obj_monkey.svg);
}
.week .g3 .o1{
	width:15%;
	aspect-ratio:1;
	margin:15% 0 0 10%;
	background-image: url(../images/obj_clock.svg);
	animation:clock 30s linear infinite;
}
@keyframes clock{
	to{
		rotate:-360deg;
	}
}
.week .ctWrapper > .o1{
	left:auto;
	top:auto;
	right:0;
	bottom:0;
	width:30%;
	aspect-ratio:1;
	margin:0 -4% 10% 0;
	transform-origin: center top;
	background-image: url(../images/obj_light.svg);
	z-index: 0;
}
/**** obj end ****/
/****** week end ******/
/******************* brand end **********************/

/******************* gift start **********************/
.gift{
	position: relative;
}

.gift ._CT{
	position: relative;
	width:57.89%;
	margin:0 auto;
	padding:4% 0 2%;
}

.gift ._CT hgroup{
	position: absolute;
	left:50%;
	top:0;
	translate:-50% -70%;
	background:currentColor;
}
.gift ._CT hgroup h4{
	color:var(--color2);
}
.gift ._CT hgroup:before,
.gift ._CT hgroup:after{
	background:var(--color1);
}

.gift ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}
.gift li{
	--side-space:8.33%;
	width:44.16%;
	border-radius:1em;
	padding:0.25em;
	background: var(--color1);
}
.gift li:nth-child(n+3){
	margin-top:3.33%;
}
.gift li:nth-child(2){
	margin-right:var(--side-space);
}
.gift li:nth-child(3){
	margin-left:var(--side-space);
}

.gift .inner{
	position: relative;
	border:0.1em solid #cb4a3e;
	border-radius:0.9em;
	padding:0.8em 1em 1.5em;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/****** img start ******/
.gift .img{
	position: relative;
	width:75.55%;
}
.gift .img:before{
	position: absolute;
	content:"";
	display: block;
	left:50%;
	top:50%;
	translate:-50% -50%;
	width:65%;
	aspect-ratio:1;
	background: #FFF;
	border-radius:50%;
	z-index: 0;
}
.gift .img img{
	position: relative;
	display: block;
	width:100%;
	z-index: 1;
}
/****** img end ******/

/****** txt start ******/
.gift .txt{
	margin-top:0.5em;
	height:6.2em;
}
.gift .txt em{
	color:var(--color3);
	font-style: normal;
	font-weight: 600;
}
.gift .txt em strong{
	font-size: 2.18em;
}
.gift .txt em.name{
	font-size: 1.38em;
	font-weight: bold;
	line-height: 1em;
}
.gift .txt em.name i{
	font-size: 0.5em;
	font-style: normal;
	color:var(--color);
}
.gift .txt em.name i.br{
	display: block;
	text-align: right;
}
/****** txt end ******/

.gift .inner > i{
	color:var(--color1);
	background: var(--color3);
	line-height: 1em;
	margin-top:1em;
	padding:0.4em 0.8em 0.3em;
	border-radius:2em;
	font-style: normal;
}

.gift .inner > em{
	position: absolute;
	left:0;
	top:0;
	width:20%;
	aspect-ratio:1;
	margin:40% 0 0 1em;
	color:var(--color3);
	background:var(--color2);
	border-radius:50%;
	font-weight: 800;
	font-size: 1.25em;
	font-style: normal;
	line-height: 1em;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1;
}

/****** ps start ******/
.gift ._CT > p{
	margin:2em 0 0;
	display: flex;
	justify-content:space-between;
	align-items: center;
	color:var(--color1);
	font-size: 0.9em;
	font-weight: 400;
}
.gift ._CT > p span{
	margin: 0 1.5em;
}
.gift ._CT > p:before,
.gift ._CT > p:after{
	content:"";
	display: block;
	flex-grow:1;
	height:1px;
	background: currentColor;
}
/****** ps end ******/

/****** obj start ******/
.gift .o1{
	top:auto;
	bottom:0;
	margin-left: 6.84%;
	width:8%;
	aspect-ratio:1;
	background: url(../images/obj_bird.svg) no-repeat center/100%;
}
/****** obj end ******/
/******************* gift end **********************/

/******************* join start **********************/
.join{
	position: relative;
}

.join ._CT{
	position: relative;
	width:56%;
	margin:0 auto;
	padding:3.5% 0 2%;
	display: flex;
	flex-direction: column;
	align-items: center;
	z-index: 1;
}

.join ul{
	width:100%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-top:10%;
}
.join ul li{
	width:48%;
}
.join ul li:has(a:hover){
	position: relative;
	z-index: 1;
}
.join ul li a{
	display: block;
	animation:float 2s ease-in-out alternate infinite both;
}
.join ul li:nth-child(1) a{	rotate:-5deg;}
.join ul li:nth-child(2) a{	rotate:2.5deg; animation-delay:1.5s}
@keyframes float{
	from{
		translate:0 10%;
	}
	to{
		translate:0 -10%;
	}
}
.join .ticket{
	position: relative;
	aspect-ratio:2.1791;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	transition: all 0.2s;
}
.join ul li:nth-child(1) .ticket{ background-image: url(../images/joinTicket1.svg);}
.join ul li:nth-child(2) .ticket{ background-image: url(../images/joinTicket2.svg);}
.join ul li a:hover .ticket{
	scale:1.05;
	filter:drop-shadow(0 0 0.5em rgba(255, 255, 255, 0.8));
}
.join .ticket em{
	display: none;
}
.join .ticket span{
	position: absolute;
	left:0;
	top:0;
	margin:28% 0 0 23%;
	color:#f8d27d;
	font-size: 2em;
	font-weight: 600;
	line-height: 1em;
}
.join .ticket span strong{
	font-size: 2em;
	font-weight: 900;
}

.join .ruleBlock{
	align-self: flex-start;
	margin-top:10%;
}

/****** obj start ******/
.join .top{
	width:30%;
}
.join .top:before{
	content:"";
	display: block;
	aspect-ratio:2.4779;
	background: url(../images/joinTop.svg) no-repeat center/100%;
}
.join .o2{
	left:auto;
	right:0;
}
.join .o2:before{
	scale:-1 1;
}
.join .ball{
	top:auto;
	bottom:0;
	width:2.31%;
	aspect-ratio:1;
	background: var(--color3);
	border-radius:50%;
	animation:ball 0.6s ease-out alternate infinite both;
}
@keyframes ball{
	to{
		translate:0 -200%;
	}
}
.join .o3{
	margin: 0 0 10% 8.42%;
}
.join .o4,
.join .o7{
	top:auto;
	bottom:0;
}
.join .o4{
	width:4.5%;
	aspect-ratio:0.3801;
	margin-left:8.1%;
	background: url(../images/obj_penguin.svg) no-repeat center/100%;
}
.join .o5{
	left:50%;
	translate:-50% 0;
}
.join .o6{
	left:auto;
	right:0;
	margin-right:17%;
	animation-delay:0.2s;
}
.join .o7{
	left:auto;
	right:0;
	width:13%;
	aspect-ratio:0.9172;
	margin-right:4%;
	background: url(../images/obj_elephant.svg) no-repeat center/100%;
}
/****** obj end ******/
/******************* join end **********************/

/***************** overlay start ************************/
.overlay.carnival {
	background: rgba(255, 255, 255, 0.95);
}

.overlay.carnival .overlayCT {
	color:var(--color);
	font-size:var(--fs);
	font-family: var(--ff);
	font-weight:var(--fw);
	max-width: 1000px;
	height: auto;
	border:0.2em solid;
	border-radius:1em;
	padding:2.5em;
	background:var(--color1);
}
.overlay.carnival .overlayCT .detail{
	font-size:0.9em;
}
.overlay.carnival .overlayCT p{
	margin:0;
}
.overlay.carnival .overlayCT *+p{
	margin-top:1.5em;
}
.overlay.carnival .overlayCT p strong{
	color:var(--color3);
}
.overlay.carnival .overlayCT ol{
	list-style: decimal;
	padding-left:1.2em;
}

.overlay.carnival .closeBtn {
	--translate:-50%;
	right:1em;
	top:1em;
	bottom: auto;
	width: 1.5em;
	height: auto;
	aspect-ratio:1;
	transition: transform 0.2s;
}
.overlay.carnival .closeBtn:hover{
	transform:rotate(-90deg);
}
.overlay.carnival .closeBtn:before,
.overlay.carnival .closeBtn:after {
	right:auto;
	left:50%;
	top: 50%;
	width:100%;
	height:0.15em;
	background: currentColor;
	transform: none;
	translate:var(--translate) var(--translate);
}
.overlay.carnival .closeBtn:before{
	rotate:-45deg;
}
.overlay.carnival .closeBtn:after {
	rotate:45deg;
}
/***************** overlay end ************************/
/****************************************** web end ************************************************/

/****************************************** store start ************************************************/
.store{
	position: relative;
}

.store .CT{
	position: relative;
	padding:4% 0 15%;
	display: flex;
	flex-direction: column;
	align-items: center;
	z-index: 1;
}

.store .CT > .ctWrapper{
	--bg:#f4e4cb;
	position: relative;
	width:57.89%;
	margin-top:4%;
}

/****** tab start ******/
.tab{
	position: relative;
	display:flex;
	background: var(--bg);
	border-radius:1.2em;
	border-bottom-left-radius:0;
	border-bottom-right-radius:0;
	overflow: hidden;
	z-index: 1;
}

.tab li{
	width:50%;
	padding:1.5em 0 0.8em;
	line-height: 1em;
	text-align: center;
	cursor:pointer;
	transition: all 0.2s;
}
.tab li strong{
	font-size: 1.6em;
}
.tab li:hover,
.tab li.active{
	color:var(--color1);
	background: var(--color);
}
/****** tab end ******/

/****** tabCTWrapper start ******/
.tabCTWrapper{
	position: relative;
	padding:4.16% 10% 5%;
	background: var(--bg);
	border-top:0.2em solid;
	border-bottom:1em solid;
	z-index: 1;
}

.tabCTWrapper .tabCT{
	display:none;
}
.tabCTWrapper .tabCT.active{
	display:block;
}

/** hgroup start **/
.tabCT hgroup{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

.tabCT .period em{
	font-style: normal;
	font-size: 1.85em;
	font-weight: 600;
	line-height: 1em;
}
.tabCT .period em i{
	font-style: normal;
	font-size: 0.5em;
}
.tabCT .period h4{
	font-size: 3em;
	font-weight: 900;
	color:var(--color3);
	line-height: 1em;
	margin-top:0.2em;
}

.tabCT hgroup a{
	display: flex;
	align-items: center;
	font-size: 1.5em;
	font-weight: 600;
	background: #d0be9a;
	line-height: 1em;
	border:0.15em solid #FFF;
	border-radius:2em;
	padding:0.3em 0.8em 0.2em;
	transition: all 0.2s;
}
.tabCT hgroup a:hover{
	color:var(--color1);
	background: var(--color3);
}
.tabCT hgroup a:after{
	content:"";
	display: block;
	border:0.35em solid transparent;
	border-right:none;
	border-left-color:currentColor;
	margin-left:0.4em;
}
/** hgroup end **/

/** tab1 start **/
.tabCT:nth-child(1) > ul{
	margin-top:5%;
}

.tabCT:nth-child(1) > ul > li{
	display: flex;
	flex-direction: column;
	align-items: center;
}
.tabCT:nth-child(1) > ul > li+li{
	margin-top:6%;
}

/* 小標 start */
.tabCT:nth-child(1) > ul > li h5{
	font-size: 1.8em;
	line-height: 1em;
}
.tabCT:nth-child(1) > ul > li h5 em{
	display: inline-block;
	font-size: 3em;
	font-weight: 600;
	color:#d0bd9b;
	margin-right:0.1em;
	translate:0 10%;
}
.tabCT:nth-child(1) > ul > li h5 strong,
.tabCT:nth-child(1) > ul > li h5 i{
	color:#cb4a3e;
}
.tabCT:nth-child(1) > ul > li h5 strong{
	font-size: 2em;
	font-weight: 900;
}
.tabCT:nth-child(1) > ul > li h5 i{
	font-style: normal;
}
/* 小標 end */

.tabCT:nth-child(1) .ctWrapper{
	width:100%;
	background: #FFF;
	border-radius:1em;
	margin-top:1.5em;
	padding:2em 3.5em;
	text-align: center;
	font-size: 1.2em;
}

.tabCT:nth-child(1) .ctWrapper ul{
	display:grid;
	gap:0.2em 1em;
	color:#000;
	text-align: left;
}

.tabCT:nth-child(1) > ul > li:nth-child(1) .ctWrapper ul{
	grid:repeat(4, 1fr)/auto-flow 1fr 1fr;
}
.tabCT:nth-child(1) > ul > li:nth-child(2) .ctWrapper ul{
	grid:repeat(7, 1fr)/auto-flow 1fr 1fr;
}
.tabCT:nth-child(1) .ctWrapper li{
	display: flex;
	align-items: center;
}
.tabCT:nth-child(1) .ctWrapper li:before{
	content:"";
	display: block;
	width:0.25em;
	aspect-ratio:1;
	background: currentColor;
	border-radius:50%;
	margin-right:0.5em;
}
.tabCT:nth-child(1) .ctWrapper li:last-child:before{
	display: none;
}

.tabCT:nth-child(1) > ul > li:nth-child(n+3) .ctWrapper br{
	display: none;
}
.tabCT:nth-child(1) > ul > li:nth-child(n+3) .ctWrapper em{
	color:var(--color3);
	font-style:normal;
}
.tabCT:nth-child(1) > ul > li:nth-child(n+3) .ctWrapper em strong{
	font-size:2.2em;
}
/** tab1 end **/

/** tab2 start **/
.tabCT:nth-child(2) ul{
	margin-top:5%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}

.tabCT:nth-child(2) ul li{
	width:48%;
}
.tabCT:nth-child(2) ul li:nth-child(n+3){
	margin-top:5%;
}

.tabCT:nth-child(2) ul li a{
	display: block;
	border-radius:1em;
	overflow: hidden;
}

.tabCT:nth-child(2) .img{
	overflow: hidden;
}
.tabCT:nth-child(2) .img img{
	display: block;
	width:100%;
	transition: all 0.5s;
}
.tabCT:nth-child(2) a:hover img{
	scale:1.05;
	filter:contrast(120%);
}

.tabCT:nth-child(2) .txt{
	height:4.5em;
	background: #FFF;
	padding:0.8em;
	text-align: right;
	transition: all 0.2s;
}
.tabCT:nth-child(2) a:hover .txt{
	color:#FFF;
	background: var(--color4);
}
.tabCT:nth-child(2) .txt i{
	font-style: normal;
	font-size: 0.7em;
}
.tabCT:nth-child(2) .txt i.br{
	display: block;
}
/** tab2 end **/

/** ctaBlock start **/
.ctaBlock{
	margin-top:5%;
}

.ctaBlock ol{
	list-style: decimal;
	padding-left:1.5em;
}

.tel{
	color:currentColor;
	display: inline-flex;
	align-items: center;
	transform: translateY(0.2em);
}
.tel:before{
	content:"";
	display: block;
	width:1.3em;
	aspect-ratio:1;
	background: url(../images/tel.svg) no-repeat center/100%;
	margin-right:0.2em;
}
.tel:hover{
	text-decoration: underline;
}
/** ctaBlock end **/
/****** tabCTWrapper end ******/

/****** obj start ******/
.store .ctWrapper .baloon{
	--side-space:6.36%;
	top:auto;
	bottom:100%;
	width:13.36%;
}
.store .ctWrapper .o1{ margin-left:var(--side-space);}
.store .ctWrapper .o2{ margin-right:var(--side-space); left:auto; right:0; scale:-1 1;}
.store .ctWrapper .o2:before{ animation-delay:0.5s;}

.store .spotlight{
	--side-space:16.31%;
}
.store .railing{
	--side-space:0;
	width:44%;
	aspect-ratio:7.6181;
	top:auto;
	bottom:0;
	background: url(../images/obj_railing.svg) no-repeat center bottom/100%;
}
.store > .o1{ margin-left:var(--side-space);}
.store > .o2{ margin-right:var(--side-space); left:auto; right:0;}
.store > .o3{ margin-left:var(--side-space);}
.store > .o4{ margin-right:var(--side-space); left:auto; right:0; scale:-1 1;}
/****** obj end ******/
/****************************************** store end ************************************************/


@media screen and (min-width:1025px){
	
	/************************************** header start ***************************************************/
	/********************** nav start *************************/
	.themeEventContainer header:hover nav{
		width:12.35em;
	}
	/********************** nav end *************************/
	/********************** _burgerBtn start *************************/
	.themeEventContainer header:hover ._burgerBtn{
		opacity:0;
	}
	/********************** _burgerBtn end *************************/
	/************************************** header end ***************************************************/
	
}


@media screen and (max-width:1024px){
	
	/************************************** header start ***************************************************/	
	/********************** nav start *************************/
	.themeEventContainer header.open nav{
		width:12em;
		height:calc(100vh - 47px);
	}
	/********************** nav end *************************/
	
	/********************** _burgerBtn start *************************/
	.themeEventContainer header ._burgerBtn{
		width:1.45em;
		height:1.45em;
		cursor:pointer;
	}
	.themeEventContainer header ._burgerBtn span,
	.themeEventContainer header ._burgerBtn span:before,
	.themeEventContainer header ._burgerBtn span:after{
		height:2px;
	}
	.themeEventContainer header.open ._burgerBtn span{
		background:none;
	}
	.themeEventContainer header ._burgerBtn span:before{ transform:translateY(-300%);}
	.themeEventContainer header ._burgerBtn span:after{ transform:translateY(200%);}
	.themeEventContainer header.open ._burgerBtn span:before,
	.themeEventContainer header.open ._burgerBtn span:after{
		background:currentColor;
	}
	.themeEventContainer header.open ._burgerBtn span:before{
		transform:translateY(-50%) rotate(-45deg);
	}
	.themeEventContainer header.open ._burgerBtn span:after{
		transform:translateY(-50%) rotate(45deg);
	}
	/********************** _burgerBtn end *************************/
	/************************************** header end ***************************************************/
	
}


@media screen and (max-width:1023px){
	
	body{
		--fs:clamp(10px, 3.6vw, 16px);
	}
	
	/************************************** 其它共用 start ***************************************************/
	/******************* sectionTitle start **********************/
	.sectionTitle{
		width:45%;
	}
	/******************* sectionTitle end **********************/

	/******************* floor start **********************/
	.floor{
		aspect-ratio:30;
	}
	/******************* floor end **********************/
	
	/***************** 聚光燈 start ************************/
	.spotlight{
		width:10%;
	}
	/***************** 聚光燈 end ************************/
	/************************************** 其它共用 end ***************************************************/
	
	/************************************* 舞台布幕 start ************************************************/
	/***************** 側幕 start ************************/
	.stage .side{
		display: none;
	}
	/***************** 側幕 end ************************/

	/***************** 數字 start ************************/
	.stage .num{
		margin-top:12%;
		width:8%;
	}
	/***************** 數字 end ************************/

	/***************** 天幕 start ************************/
	.stage .top{
		aspect-ratio:10;
	}
	
	.stage .top:before,
	.stage .top:after{
		background-position-x: 7.6%;
	}
	/***************** 天幕 end ************************/
	/************************************* 舞台布幕 end ************************************************/
	
	/************************************** header start ***************************************************/	
	.themeEventContainer header{
		top:47px;
	}
	/************************************** header end ***************************************************/
	
	/****************************************** home start ************************************************/
	.home .CT{
		aspect-ratio:0.62;
		background-position-x: 20%;
	}

	.home .CT h2{
		margin:40% 0 0 10%;
		width:80%;
		aspect-ratio:0.77;
	}

	.home .CT:after{
		width:90%;
	}

	/********************* scrollHint start *************************/
	.scrollHint{
		width:15%;
		margin-bottom: 5%;
	}
	/********************* scrollHint end *************************/
	/****************************************** home end ************************************************/
	
	/****************************************** web start ************************************************/
	/******************* sectionTitle start **********************/
	.web .sectionTitle{
		margin-top:15%;
	}
	/******************* sectionTitle end **********************/
	
	/******************* 區塊標 start **********************/
	._CT hgroup{
		font-size: 1.4em;
	}
	/******************* 區塊標 end **********************/

	/******************* discount start **********************/
	.discount{
		padding:30% 0 15%;
	}

	.discount ._CT{
		width:85%;
	}

	.discount ul{
		display: block;
		margin-top:5%;
	}
	.discount li{
		width:auto;
	}
	.discount li+li{
		margin-top:5%;
	}
	.discount .inner{
		padding-top:0.75em;
	}
	.discount .inner h5{
		height:auto;
	}
	.discount .detail{
		margin-top:1em;
		height:auto;
	}

	/******** obj start *********/
	.discount .o2{
		left:50%;
		translate:-50% 0;
		margin-left:0;
	}
	.discount .o3{
		display: none;
	}
	/******** obj end *********/
	/******************* discount end **********************/
	
	/******************* brand start **********************/
	/****** 區塊標 start ******/
	.brand ._CT > hgroup{
		margin:5% 0 0 5%;
	}
	/****** 區塊標 end ******/

	.brand .ctWrapper > p{
		font-size: 1.1em;
	}

	/****** all start ******/
	.all{
		padding:20% 0 25%;
	}

	.all .ctWrapper{
		width:90%;
	}

	.all ul{
		justify-content: space-between;
	}
	.all li{
		width:48%;
		margin:5% 0 0 0;
	}
	/****** all end ******/

	/****** week start ******/
	.week .ctWrapper{
		padding:5% 0 10%;
	}

	.week .ctWrapper > p{
		width:90%;
	}

	.week .ctWrapper > ul{
		margin-top:10%;
	}

	.week .group{
		--side-space:5%;
		background:var(--color2);
		border-radius:1em;
		aspect-ratio:auto;
		display: block;
	}
	.week .group+.group{
		margin-top:12%;
	}
	.week .g1,
	.week .g2,
	.week .g3{
		padding:5% 5% 8%;
	}
	.week .g1,
	.week .g3{
		border-top-left-radius:0;
		border-bottom-left-radius:0;
	}
	.week .g2{
		border-top-right-radius:0;
		border-bottom-right-radius:0;
	}

	.week hgroup{
		--side-space:3.5%;
	}
	
	.week time{
		--side-space:12em;
		font-size: 0.9em;
		padding-top:0.35em;
		padding-bottom:0.2em;
	}

	.week .group p{
		writing-mode:revert;
		text-orientation:revert;
		font-size:1.5em;
	}

	.week .g1 .slick,
	.week .g2 .slick,
	.week .g3 .slick{
		width:auto;
	}

	.week .slick a em{
		font-size: 0.8em;
	}
	
	.week .slick ._slickPN{
		--size:1.2em;
	}

	/**** obj start ****/
	.week .obj.stringLight,
	.week .ctWrapper > .o1{
		display: none;
	}
	.week .g1 .o1{
		width:15%;
		max-width:60px;
		margin:6% 0 0 67%;
	}
	.week .g2 .o2{
		width: 22%;
		max-width: 100px;
		margin: -14% 2% 0 0;
	}
	.week .g3 .o1{
		width:15%;
		max-width:60px;
		margin:7.5% 0 0 67%;
	}
	/**** obj end ****/
	/****** week end ******/
	/******************* brand end **********************/
	
	/******************* gift start **********************/
	.gift ._CT{
		width:85%;
		padding:10% 0 15%;
	}

	.gift ul{
		display: block;
	}
	.gift li{
		--side-space:0%;
		width:auto;
	}
	.gift li+li,
	.gift li:nth-child(n+3){
		margin-top:5%;
	}

	/****** ps start ******/
	.gift ._CT > p{
		display: block;
	}
	.gift ._CT > p span{
		margin: 0;
	}
	.gift ._CT > p:before,
	.gift ._CT > p:after{
		display: none;
	}
	/****** ps end ******/

	/****** obj start ******/
	.gift .o1{
		margin-left: 2%;
		width:12%;
	}
	/****** obj end ******/
	/******************* gift end **********************/
	
	/******************* join start **********************/
	.join ._CT{
		width:85%;
		padding:8% 0 18%;
	}

	.join ul{
		display: block;
		width:85%;
		margin:15% auto 0;
	}
	.join ul li{
		width:auto;
	}
	.join ul li+li{
		margin-top:10%;
	}
	
	.join .ticket span{
		font-size: 5.5vw;
	}
	
	.join .ruleBlock{
		margin-top:8%;
	}

	/****** obj start ******/
	.join .o6{
		margin-right:25%;
	}
	.join .o7{
		width:20%;
		margin-right:4%;
	}
	/****** obj end ******/
	/******************* join end **********************/
	
	/***************** overlay start ************************/
	.overlay.carnival .overlayCT {
		width:90%;
		padding:2.5em 2em;
	}
	.overlay.carnival .closeBtn {
		width: 1.5em;
		right: 0.8em;
		top:0.8em;
	}
	/***************** overlay end ************************/
	/****************************************** web end ************************************************/
	
	/****************************************** store start ************************************************/
	.store .CT{
		padding:10% 0 20%;
	}

	.store .CT > .ctWrapper{
		width:90%;
		margin-top:8%;
	}

	/****** tab start ******/
	.tab{
		--bdr-r:0;
		font-size:0.9em;
		display:block;
		background: transparent;
		border-radius:var(--bdr-r);
		border-bottom-left-radius:var(--bdr-r);
		border-bottom-right-radius:var(--bdr-r);
	}

	.tab li{
		width:auto;
		border-radius:1em;
		background:var(--bg);
	}
	.tab li+li{
		margin-top:0.5em;
	}
	/****** tab end ******/

	/****** tabCTWrapper start ******/
	.tabCTWrapper{
		border-radius:1em;
		overflow: hidden;
		margin-top:1em;
		padding:6% 5%;
	}

	/** hgroup start **/
	.tabCT hgroup{
		font-size: 0.6em;
	}
	/** hgroup end **/

	/** tab1 start **/
	.tabCT:nth-child(1) > ul{
		margin-top:10%;
		font-size: 0.9em;
	}

	.tabCT:nth-child(1) > ul > li+li{
		margin-top:10%;
	}

	.tabCT:nth-child(1) .ctWrapper{
		padding:2em;
	}

	.tabCT:nth-child(1) .ctWrapper ul{
		display:block;
	}

	.tabCT:nth-child(1) .ctWrapper li+li{
		margin-top:0.5em;
	}

	.tabCT:nth-child(1) > ul > li:nth-child(n+3) .ctWrapper br{
		display: block;
	}
	/** tab1 end **/

	/** tab2 start **/
	.tabCT:nth-child(2) ul{
		margin:8% auto 0;
		width:90%;
		display: block;
	}
	
	.tabCT:nth-child(2) ul li{
		width:auto;
	}
	.tabCT:nth-child(2) ul li+li,
	.tabCT:nth-child(2) ul li:nth-child(n+3){
		margin-top:5%;
	}
	/** tab2 end **/

	/** ctaBlock start **/
	.ctaBlock{
		font-size: 0.9em;
	}
	/** ctaBlock end **/
	/****** tabCTWrapper end ******/

	/****** obj start ******/
	.store .ctWrapper .baloon{
		--side-space:5%;
		width:15%;
	}
	/****** obj end ******/
	/****************************************** store end ************************************************/

}
