@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@600;800&family=Cinzel:wght@500;600&display=swap');


html.disableScroll{
	overflow:hidden;
}

body{
	--theme-color1:#b52316;
	--theme-color2:#784812;
	--theme-color3:#cc9454;
	--theme-color4:#ff897d;
	--theme-color5:#f7f1df;
	--highlight-color:var(--theme-color1);
	--color:var(--theme-color2);
}

.mainContainer{
	max-width:1920px;
	overflow:hidden;
}

.midBlock,
.themeMain{
	display:none;
}

.themeEventContainer{
	font-family: Cinzel, 'Noto Serif TC', serif;
	font-weight:800;
	font-size:clamp(8px, 1.26vw, 24px);
	color:var(--color);
	background: url(../images/bg.gif) repeat center top/7.89%;
}

/************************************** 其它共用 start ***************************************************/
.themeEventContainer a:hover{
	color:currentColor;
}

.CTWrapper{
	position: relative;
	width:100%;
}

.CTWrapper .CT{
	margin:0 auto;
	width: 63.15%;
}

/***************** sectionTitle start ************************/
.sectionTitle{
	position: relative;
	width:22.1%;
	aspect-ratio:4.66;
	margin:0 auto;
}
.sectionTitle strong{
	display: block;
	height:100%;
	font-size: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.sectionTitle .obj{
	margin:-2.14% 0 0 97.14%;
}
/***************** sectionTitle end ************************/

/***************** obj start ************************/
.obj{
	position: absolute;
	left:0;
	top:0;
	pointer-events: none;
}

.obj:before{
	content:"";
	display: block;
	height:100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}

.starW1,
.starP1{width:1em; aspect-ratio:1;}
.starW1:before{background-image: url(../images/starW1.svg);}
.starP1:before{background-image: url(../images/starP1.svg);}
.starW2,
.starP2{width:1.41em; aspect-ratio:1;}
.starW2:before{background-image: url(../images/starW2.svg);}
.starP2:before{background-image: url(../images/starP2.svg);}
.starW3,
.starP3{width:1.41em; aspect-ratio:0.7727;}
.starW3:before{background-image: url(../images/starW3.svg);}
.starP3:before{background-image: url(../images/starP3.svg);}
.starW4,
.starP4{width:2.66em; aspect-ratio:1;}
.starW4:before{background-image: url(../images/starW4.svg);}
.starP4:before{background-image: url(../images/starP4.svg);}

.ball{aspect-ratio:1;}
.ball1:before{background-image: url(../images/ball1.svg);}
.ball2:before{background-image: url(../images/ball2.svg);}
.ball3:before{background-image: url(../images/ball3.svg);}
.ball4:before{background-image: url(../images/ball4.png);}

.clock{aspect-ratio:1;}
.clock:before{background-image: url(../images/obj_clock.png);}

.glass{aspect-ratio:0.63;}
.glass:before{background-image: url(../images/obj_glass.png);}

.panton{aspect-ratio:0.67;}
.panton:before{background-image: url(../images/obj_panton.png);}

.curveChair{aspect-ratio:0.7;}
.curveChair1:before{background-image: url(../images/obj_curveChair1.png);}
.curveChair2:before{background-image: url(../images/obj_curveChair2.png);}

.bear1{aspect-ratio:1.05;}
.bear1:before{background-image: url(../images/obj_bear1.png);}
.bear2{aspect-ratio:1.47;}
.bear2:before{background-image: url(../images/obj_bear2.png);}

.puppy1{aspect-ratio:0.904;}
.puppy1:before{background-image: url(../images/obj_puppy1.png);}
.puppy2{aspect-ratio:0.69;}
.puppy2:before{background-image: url(../images/obj_puppy2.png);}

.rabbit{aspect-ratio:0.57;}
.rabbit:before{background-image: url(../images/obj_rabbit.png);}

.scale:before{	animation:scale ease-in alternate infinite;}
.scale1:before{	animation-duration: 0.5s;}
.scale2:before{	animation-duration: 0.85s;}
.scale3:before{	animation-duration: 1.1s;}
@keyframes scale{
	from{
		scale:0.25;
		opacity: 0;
	}
}

.rotate:before{ animation-timing-function:linear; animation-iteration-count: infinite;}
.rotate1:before{ animation-name:rotate1; animation-duration: 5s;}
.rotate2:before{ animation-name:rotate2; animation-duration: 10s;}
@keyframes rotate1{
	to{
		rotate:-360deg;
	}
}
@keyframes rotate2{
	to{
		rotate:360deg;
	}
}

.float:before{ animation-timing-function:ease-in-out; animation-direction: alternate; animation-iteration-count: infinite; }
.float1:before{ animation-name:float1; animation-duration: 0.8s;}
.float2:before{ animation-name:float2; animation-duration: 1s;}
.float3:before{ animation-name:float3; animation-duration: 1.2s;}
@keyframes float1{
	from{
		translate:0 -1%;
	}
	to{
		translate:0 1%;
	}
}
@keyframes float2{
	from{
		translate:0 -2%;
	}
	to{
		translate:0 2%;
	}
}
@keyframes float3{
	from{
		translate:0 -3%;
	}
	to{
		translate:0 3%;
	}
}

.shake:before{ animation-timing-function:ease-in-out; animation-direction: alternate; animation-iteration-count: infinite;}
.shake1:before{ animation-name:shake1; animation-duration: 0.5s;}
.shake2:before{ animation-name:shake2; animation-duration: 0.85s;}
@keyframes shake1{
	from{
		rotate:-2.5deg;
	}
	to{
		rotate:2.5deg;
	}
}
@keyframes shake2{
	from{
		rotate:-5deg;
	}
	to{
		rotate:5deg;
	}
}

.hang:before{ animation-timing-function:ease-in-out; animation-direction: alternate; animation-iteration-count: infinite;}
.hang1:before{ animation-name:hang1; animation-duration: 1s;}
.hang2:before{ animation-name:hang2; animation-duration: 1.25s;}
@keyframes hang1{
	from{
		rotate:-0.8deg;
	}
	to{
		rotate:0.8deg;
	}
}
@keyframes hang2{
	from{
		rotate:-1.2deg;
	}
	to{
		rotate:1.2deg;
	}
}
/***************** obj 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:var(--theme-color4);
		text-shadow:0 0 0.5em rgba(255, 255, 255, 0.8);
	}
}
/***************** 數字閃光 end ************************/

/*************** overlay btn start ***************/
button.overlayBtn{
	color:var(--theme-color5);
	border:none;
	border-radius:2em;
	line-height: 1em;
	padding:0.72em 1.4em 0.52em;
	font-family: inherit;
	font-size: 0.8em;
	cursor:pointer;
	transition: background 0.2s;
}
/*************** overlay btn end ***************/

/***************** overlay start ************************/
.overlay.theme {
	font-size: 1.2em;
	font-family: 'Noto Serif TC', serif;
	background: rgba(255, 240, 220, 0.9);
}

.overlay.theme .overlayCT {
	height: auto;
	max-width:950px;
	max-height: none;
	color:var(--theme-color5);
	background: var(--theme-color3);
	border-radius: 2em;
	padding: 2em 5em 2em 3em;
	font-weight:600;
}

.overlay.theme .closeBtn {
	right: 1.5em;
	top:1.5em;
	bottom: auto;
	width: 38px;
	height: 38px;
	transition: transform 0.2s;
}
.overlay.theme .closeBtn:hover {
	transform:rotate(-90deg);
}
.overlay.theme .closeBtn:before,
.overlay.theme .closeBtn:after {
	top: 19px;
	width: 42px;
	height:2px;
	background: var(--theme-color1);
}
/***************** overlay end ************************/
/************************************** 其它共用 end ***************************************************/

/************************************** header start ***************************************************/
.themeEventContainer header{
	position:fixed;
	right:0;
	top:90px;
	color:currentColor;
	z-index:1;
}

.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, 240, 220, 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{
	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(--highlight-color);
}
.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:3px;
	border-radius:0.25em;
	background:currentColor;
}
.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 ************************************************/
.kvBlock{
	position: relative;
	aspect-ratio:2.375;
}

/******************* 主標 start ********************/
.kvBlock hgroup{
	position: absolute;
	left:0;
	top:0;
	width:32.1%;
	aspect-ratio:1.64;
	margin:3.15% 0 0 4.94%;
	font-size: 0;
	z-index: 1;
}

.kvBlock hgroup :is(h2, em, p){
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
.kvBlock hgroup :is(h2, em, p):before{
	content:"";
	display: block;
	height:inherit;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.kvBlock hgroup h2{font-size: inherit;}
.kvBlock hgroup h2:before{background-image: url(../images/kvT1.svg);}
.kvBlock hgroup em:before{background-image: url(../images/kvT2.svg);}
.kvBlock hgroup p:before{background-image: url(../images/kvT3.svg);}
@keyframes kvT{
	from{
		translate:-0.8% 0;
	}
	to{
		translate:0.8% 0;
	}
}

.kvBlock hgroup .obj{
	width:5.57%;
	margin:17.37% 0 0 68.19%;
}
/******************* 主標 end ********************/

/******************* scene start ********************/
.kvBlock .scene{
	position: relative;
	height:100%;
	background: url(../images/homeBg.jpg) no-repeat center/cover;
	z-index: 0;
}

.kvBlock .scene .o1{width:2.84%;margin: 24.5% 0 0 16.9%;}
.kvBlock .scene .o2{margin: 11.2% 0 0 47.5%;}
.kvBlock .scene .o3{margin: 6.8% 0 0 72.5%;}
.kvBlock .scene .o4{width:4.21%;margin: 9.8% 0 0 75.2%;}
.kvBlock .scene .o5{margin: 20% 0 0 92%;}
.kvBlock .scene .o6{width:8.94%;margin: 4.2% 0 0 83.5%;}
.kvBlock .scene .o7{width:7.89%;margin: 25.5% 0 0 6%;}
.kvBlock .scene .o8{width:22.63%;margin: 15.2% 0 0 18%;}
.kvBlock .scene .o9{width:13.68%;margin: 6% 0 0 38.2%;}
.kvBlock .scene .o10{width:10.1%;margin: 12% 0 0 67.3%;}
.kvBlock .scene .o11{width:25.26%;aspect-ratio:1.14;margin: 13% 0 0 46.5%;}
.kvBlock .scene .o11:before{background-image: url(../images/obj_cake1.png);}
.kvBlock .scene .o12{width:14.63%;aspect-ratio:0.77;margin: 22% 0 0 41.2%;}
.kvBlock .scene .o12:before{background-image: url(../images/obj_chair1.png);}
.kvBlock .scene .o13{width:11.26%;margin: 30.2% 0 0 66.8%;}
.kvBlock .scene .o14{width:16.31%;aspect-ratio:0.81;margin: 14.6% 0 0 74.2%;}
.kvBlock .scene .o14:before{background-image: url(../images/obj_monkey1.png);}
.kvBlock .scene .o15{width:13.26%;aspect-ratio:1.43;margin: 28.6% 0 0 88.3%;}
.kvBlock .scene .o15:before{background-image: url(../images/obj_elephant1.png);}
.kvBlock .scene .o16{width:18.21%;aspect-ratio:0.93;margin: -5.8% 0 0 50%;}
.kvBlock .scene .o16:before{background-image: url(../images/obj_light1.png); transform-origin: center top;}
/******************* scene end ********************/

/******************* about start ********************/
.home .txt{
	position: relative;
	padding-top:16.84%;
	display: flex;
	flex-direction: column;
	align-items: center;
	background: url(../images/aboutBgBtm.png) repeat-x center bottom/7.89%,
				url(../images/aboutBgTop.jpg) no-repeat center top/100%;
}

.home .txt p{
	margin:0;
	line-height: 2em;
	text-align: center;
}

.home .txt .o1{margin: 38.5% 0 0 12.5%;}
.home .txt .o2{margin: 27.5% 0 0 64%;}
.home .txt .o3{margin: 25% 0 0 65.5%;}
.home .txt .o4{margin: 46% 0 0 83%;}
.home .txt .o5{width:2.16em;margin: 43% 0 0 85%;}
.home .txt .o6{width:27.26%;aspect-ratio:1.12;margin: 15.5% 0 0 8.5%;}
.home .txt .o6:before{background: url(../images/obj_cream1.png) no-repeat center/100%;}
.home .txt .o7{width:22.63%;aspect-ratio:0.93;margin: 15.5% 0 0 68.5%;}
.home .txt .o7:before{background: url(../images/obj_cream2.png) no-repeat center/100%;}
.home .txt .o8{width:11.36%;aspect-ratio:0.62;margin: 6% 0 0 60.8%;}
.home .txt .o8:before{background: url(../images/obj_light2.png) no-repeat center/100%;transform-origin: center top;}

.home .txt strong{
	display: block;
	width:100%;
	margin-top:8.5%;
	background: url(../images/aboutBtmCurve.png) no-repeat center bottom/100%;
}
.home .txt strong span{
	position: relative;
	font-size: 0;
	display: block;
	width:72.31%;
	aspect-ratio:4.04;
	margin-left:14.63%;
	background: url(../images/aboutBtmCurveT.svg) no-repeat center/100%;
}
.home .txt strong span:before{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	content:"";
	display: block;
	background: url(../images/aboutBtmCurveT_light.svg) no-repeat center/100%;
}
/******************* about end ********************/
/****************************************** home end ************************************************/

/****************************************** web start ************************************************/
.web{
	padding-top:6.73%;
	background: url(../images/webBgTop.jpg) repeat-x center top/7.89%
}

/******************* sectionTitle start **********************/
.web .sectionTitle strong{
	background-image: url(../images/sectionTitleWeb.svg);
}
/******************* sectionTitle end **********************/

/******************* 數字標題 start **********************/
.web h4{
	font-size: 1.95em;
	font-weight: 800;
	line-height: 1em;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	gap:0.35em;
}
.web h4 strong{
	font-size: 3.4em;
	font-weight: 500;
	font-style: italic;
	line-height: 1em;
	color:var(--theme-color1);
}
.web h4 span{
	position: relative;
	top:-0.55em;
}
/******************* 數字標題 end **********************/

/******************* 日期標題 start **********************/
.web h5.date{
	color:var(--theme-color5);
	background: var(--theme-color1);
	padding:0.4em 0.7em 0.2em 0.8em;
	font-size: 1.5em;
	font-weight: normal;
	line-height: 1em;
	border-radius:1.5em;
	border-bottom-right-radius:0;
}
.web h5.date i{
	font-size: 0.6em;
	font-style: normal;
}
/******************* 日期標題 end **********************/

/******************* discount start **********************/
.web .discount{
	position: relative;
	margin-top:3.57%;
	padding-bottom: 10.52%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/********** 數字標題 start ***********/
.web .discount h4{
	position: absolute;
	left:0;
	top:0;
	margin:-3.5% 0 0 21.05%;
	z-index: 1;
}
.web .discount h4 em{
	position: absolute;
	left:0;
	top:0;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	width: 5.95em;
	aspect-ratio: 6;
	margin: 3.25em 0 0 1.65em;
	background: url(../images/date1.svg) no-repeat center/100%;
}
/********** 數字標題 end **********/

.web .discount .CT{
	display: flex;
	flex-direction: column;
	align-items: center;
}

/********** 內容 start **********/
.web .discount .info{
	width:53.33%;
	margin-top: 3.5%;
}

.web .discount li{
	position: relative;
	border-radius:1em;
	padding:2.5em 1em 2em;
	background: linear-gradient(to bottom, rgba(247, 241, 223, 1), rgba(247, 241, 223, 0));
}
.web .discount li:nth-child(1){
	left:34.37%;
}

.web .discount li hgroup{
	position: absolute;
	left:0;
	top:0;
	display: flex;
	align-items: center;
	gap:1em;
	margin:-1.4em 0 0 -1.2em;
}
.web .discount li hgroup em{
	font-style: normal;
	font-size: 1.6em;
	color:#5e97c9;
}

.web .discount .info li p{
	text-align: center;
	line-height: 2em;
	margin:0;
}
.web .discount .info li p span{
	color:var(--theme-color1);
}
.web .discount .info li p span strong{
	font-size: 2em;
	font-weight: 600;
}
/********** 內容 end **********/

/********* example start *********/
.web .discount .example{
	position: relative;
	margin-top:-1em;
}

/***** btn start *****/
.web .discount .example button.overlayBtn{
	background: var(--theme-color3);
}
.web .discount .example button.overlayBtn:hover{
	background: var(--theme-color2);
}
/***** btn end *****/

.web .discount .example .txt{
	display:none;
}

.overlay.example p{
	margin:0;
	line-height: 1.8em;
}
.overlay.example p+p{
	margin-top:1.5em;
}
.overlay.example p strong{
	font-size:1.1em;
	font-weight:800;
	color:var(--theme-color1);
}
/********* example end *********/

.discount .o1{margin:-14.63% 0 0 27.57%;}
.discount .o2{margin:-12.73% 0 0 29.05%;}
.discount .o3{margin:13.89% 0 0 87.73%;}
.discount .o4{width:12.63%;margin:-4.21% 0 0 18.42%;}
.discount .o5{width:2.63%;margin:22.21% 0 0 65.47%;}
.discount .o6{width:5.15%;margin:0% 0 0 75.78%;}
.discount .o7{width:8.1%;margin:26.31% 0 0 11.94%;}
.discount .o8{width:20.42%;aspect-ratio:0.97;margin:16.31% 0 0 18.21%;}
.discount .o8:before{background-image: url(../images/obj_monkey2.png);}
.discount .o9{width:31.05%;aspect-ratio:3.93;margin:29.57% 0 0 62.63%;}
.discount .o9:before{background-image: url(../images/obj_pad.png);}
.discount .o10{width:24.31%;margin:11.36% 0 0 64.52%;}
/******************* discount end **********************/

/******************* brand start **********************/
.web .brand .info{
	color:var(--theme-color5);
}

/********** 漸層標 start ***********/
.web .brand .info hgroup{
	position: relative;
	width:43.15%;
	margin:0 auto;
	font-size: 1.45em;
	line-height: 1em;
	height:2.17em;
	padding-top:0.2em;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	background: linear-gradient(to right, rgba(181, 35, 22, 0), rgba(181, 35, 22, 1), rgba(181, 35, 22, 0));
}
.web .brand .info hgroup strong{
	font-size: 1.8em;
	color:#ffd08f;
	margin:0 0.1em;
}
/********** 漸層標 end ***********/

.web .brand .CTWrapper{
	margin-top:3.68%;
}
.web .brand .CT{
	position: relative;
	z-index: 1;
}

/********** 情境圖 start ***********/
.web .brand .img{
	position: relative;
	border-radius:0.8em;
	border-bottom-right-radius:0;
	overflow: hidden;
}
.web .brand .img img{
	width:100%;
	display: block;
	transition: scale 0.5s;
}
.web .brand a:hover .img img{
	scale:1.05;
}
.web .brand .img:after{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	content:"";
	display: block;
	box-shadow: inset 0 0 0.5em 0.25em rgba(0, 0, 0, 0.2);
}
/********** 情境圖 end ***********/

/*************** i1 start ***************/
.web .brand .i1{
	margin-top:1%;
}

.web .brand .i1 .CTWrapper{
	padding-bottom:8.42%;
	background: url(../images/webBrandBg1.png) no-repeat center top/100%;
}

.web .brand .i1 ul{
	width:89.16%;
	margin:0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}
.web .brand .i1 li{
	width:21.49%;
}
.web .brand .i1 li:nth-child(n+5){
	margin-top:12.14%;
}
.web .brand .i1 li:last-child{
	margin-left:4.67%;
	margin-right:auto;
}

.web .brand .i1 a{
	position: relative;
	display: block;
}

/********** 情境圖 start ***********/
.web .brand .i1 .img{
	box-shadow:0.33em -0.33em 0 0 var(--theme-color5);
}
/********** 情境圖 end ***********/

.web .brand .i1 .logo{
	position: absolute;
	left:0;
	top:100%;
	margin-top:6.52%;
}

/********** 折扣 start ***********/
.web .brand .i1 a em{
	position: absolute;
	right:0;
	bottom:0;
	width:38.26%;
	aspect-ratio:1;
	display: flex;
	justify-content: center;
	align-items: center;
	font-style: normal;
	line-height: 1em;
	border-radius:50%;
	border-bottom-right-radius:0;
	background: var(--theme-color1);
	margin:0 -0.33em -2em 0;
	padding:0.65em 0 0 0.2em;
}
.web .brand .i1 a em.special{
	background: var(--theme-color3);
	line-height: 1.2em;
	padding:0.45em 0 0 0.1em;
}
.web .brand .i1 a em i{
	color:#f7bfb2;
	font-size: 2em;
	font-style: normal;
}
/********** 折扣 end ***********/

.web .brand .i1 .o1{margin: -11% 0 0 16%;}
.web .brand .i1 .o2{margin: -8% 0 0 17%;}
.web .brand .i1 .o3{margin: 8% 0 0 81%;}
.web .brand .i1 .o4{margin: 6% 0 0 83%;}
.web .brand .i1 .o5{margin: 39% 0 0 13%;}
.web .brand .i1 .o6{margin: 45% 0 0 83%;}
.web .brand .i1 .o7{margin: 54% 0 0 84%;}
.web .brand .i1 .o8{margin: -6% 0 0 72%;width: 13.15%;}
.web .brand .i1 .o9{margin: 41% 0 0 15%;width: 13.15%;}
.web .brand .i1 .o10{margin: 61% 0 0 77%;width: 2.63%;}
.web .brand .i1 .o11{margin: 64% 0 0 80%;width: 5.15%;}
.web .brand .i1 .o12{margin-top:47.73%;width:48.73%;aspect-ratio:1.65;left:auto;right:0;}
.web .brand .i1 .o12:before{background-image: url(../images/obj_group.png);}
.web .brand .i1 .o13{margin:-5.52% 0 0 19%;width:5.26%;aspect-ratio:0.94;z-index: 2;}
.web .brand .i1 .o13:before{background-image: url(../images/obj_bird.png);}
/*************** i1 end ***************/

/*************** i2 start ***************/
.web .brand .i2{
	margin-top:5.26%;
}

.web .brand .i2 hgroup h5{
	position: absolute;
	left:0;
	top:0;
	font-size: 1.05em;
	margin:-0.8em 0 0 -4em;
}

.web .brand .i2 .CTWrapper{
	padding-bottom:15.26%;
	background: url(../images/webBrandBg2.png) no-repeat center bottom/100%;
}

.web .brand .i2 ul{
	width:92.5%;
	margin:0 auto;
}

.web .brand .i2 li{
	padding:0 0.66em;
}

/******* slick start *********/
.web .brand .i2 ._slickPN{
	--size:2.5em;
	position: absolute;
	top:37%;
	translate:0 -50%;
	width:var(--size);
	aspect-ratio:1;
	cursor:pointer;
}
.web .brand .i2 ._slickPN.prev{
	right:100%;
	margin-right:calc(var(--size) / 5);
	scale:-1 1;
}
.web .brand .i2 ._slickPN.next{
	left:100%;
	margin-left:calc(var(--size) / 5);
}
.web .brand .i2 ._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(--theme-color1);
	animation: arrowHint 0.5s ease-in alternate infinite;
}
@keyframes arrowHint{
	to{
		translate:20% 0;
	}
}
/******* slick end *********/

.web .brand .i2 a{
	display: block;
}

.web .brand .i2 .txt{
	margin-top:5%;
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio:3.075;
}

.web .brand .i2 .o1{margin: 27% 0 0 69%;}
.web .brand .i2 .o2{margin: 20.5% 0 0 88%;}
.web .brand .i2 .o3{margin: -6% 0 0 72%;width: 13.15%;}
.web .brand .i2 .o4{margin: 19% 0 0 73%;width:15.57%;aspect-ratio:0.77;}
.web .brand .i2 .o4:before{background-image: url(../images/obj_chair2.png);}
.web .brand .i2 .o5{margin: -4% 0 0 19.75%;width:4.84%;aspect-ratio:0.82;z-index: 2;}
.web .brand .i2 .o5:before{background-image: url(../images/obj_hat.png);}
/*************** i2 end ***************/

/******** logo start ********/
.web .brand .logo{
	font-size: 0;
	display: block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.web .brand .artek{width: 47.23%;aspect-ratio:3.27;background-image: url(../images/logo_artek.svg);}
.web .brand .vitra{width: 41.38%;aspect-ratio:3;background-image: url(../images/logo_vitra.svg);}
.web .brand .maruni{width: 49.76%;aspect-ratio:5.14;background-image: url(../images/logo_maruni.svg);}
.web .brand .magis{width: 49.53%;aspect-ratio:4.23;background-image: url(../images/logo_magis.svg);}
.web .brand .e15{ width:25.76%; aspect-ratio:1.11; background-image: url(../images/logo_e15.svg);}
.web .brand .anglepoise{width: 62.76%;aspect-ratio:5.25;background-image: url(../images/logo_anglepoise.svg);}
.web .brand .form{width: 55.38%;aspect-ratio:4.33;background-image: url(../images/logo_form.svg);}
.web .brand .moooi{ width:50.76%; aspect-ratio:5.25; background-image: url(../images/logo_moooi.svg);}
.web .brand .tecta{width: 47.76%;aspect-ratio:4.3;background-image: url(../images/logo_tecta.svg);}
.web .brand .maruni60{width: 22.76%;aspect-ratio:1.06;background-image: url(../images/logo_maruni60.svg);}
.web .brand .vdm{width: 29.53%;aspect-ratio:1.41;background-image: url(../images/logo_vdm.svg);}
.web .brand .moln{width: 46.76%;aspect-ratio:4.19;background-image: url(../images/logo_moln.svg);}
.web .brand .string{ width:45%; aspect-ratio:3.1; background-image: url(../images/logo_string.svg);}
.web .brand .gj{width: 42.76%;aspect-ratio:1.93;background-image: url(../images/logo_gj.svg);}
.web .brand .aroma{width: 65%;aspect-ratio:4.88;background-image: url(../images/logo_aroma.svg);}
.web .brand .rosendahl{width: 81%;aspect-ratio:10.125;background-image: url(../images/logo_rosendahl.svg);}
.web .brand .holmegaard{width: 44%;aspect-ratio:1.58;background-image: url(../images/logo_holmegaard.svg);}
.web .brand .kay{width: 45%;aspect-ratio:1.84;background-image: url(../images/logo_kay.svg);}
.web .brand .lyngby{width: 35%;aspect-ratio:1.2;background-image: url(../images/logo_lyngby.svg);}
.web .brand .kahler{width: 50%;aspect-ratio:2.21;background-image: url(../images/logo_kahler.svg);}
.web .brand .bjorn{width: 50%;aspect-ratio:1.79;background-image: url(../images/logo_bjorn.svg);}
.web .brand .ajc{width: 75%;aspect-ratio:3.75;background-image: url(../images/logo_ajc.svg);}
/******** logo end ********/
/******************* brand end **********************/

/******************* gift start **********************/
.web .gift{
	padding-bottom:9%;
	background: url(../images/webGiftBgTop.jpg) repeat-x center top/7.89%;
}

.web .gift .CTWrapper{
	margin-top:4.63%;
}

.web .gift .info{
	width:90%;
	margin:0 auto;
}

.web .gift li{
	position: relative;
	width:59.25%;
	border-radius:1em;
	padding:3em 1em;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	background: linear-gradient(to bottom, rgba(247, 241, 223, 1), rgba(247, 241, 223, 0));
}
.web .gift li+li{
	margin-top:5.55%;
}
.web .gift li:nth-child(1){
	margin-left:37.77%;
}
.web .gift li:nth-child(3){
	width:44.44%;
	margin-left:31.48%;
}

.web .gift li .txt{
	position: relative;
}

.web .gift li p{
	line-height: 2em;
	margin:0;
}
.web .gift li p span{
	color:var(--theme-color1);
}
.web .gift li p span strong{
	font-size: 2em;
	font-weight: 600;
}
.web .gift li p span.name{
	font-family: 'Noto Serif TC';
	font-size: 1.2em;
}

.web .gift li p i{
	font-size: 0.8em;
	font-style: normal;
}

/********* 已贈畢 start **********/
.web .gift li .txt > i{
	position: absolute;
	left:0;
	bottom:100%;
	display: block;
	padding:0.25em 0.8em 0.15em;
	color:var(--theme-color5);
	background: var(--theme-color1);
	border-radius:2em;
	border-bottom-right-radius:0;
	font-style: normal;
}
/********* 已贈畢 end **********/

/********* 限量 start **********/
.web .gift li em{
	position: absolute;
	right:0;
	top:0;
	display: block;
	font-style: normal;
	padding:0.5em 1.2em;
	margin:-1.2em -1.2em 0 0;
	color:var(--theme-color5);
	background: var(--theme-color1);
	border-radius:1.5em;
	border-bottom-left-radius:0;
}
.web .gift li:nth-child(2) em{
	border-radius:1.5em;
	border-bottom-right-radius:0;
}
/********* 限量 end **********/

/********* img start **********/
.web .gift li .img{
	position: absolute;
	left:0;
	top:0;
	width:16.66em;
	aspect-ratio:1.18;
	display: flex;
	align-items: flex-end;
}
.web .gift li:nth-child(1) .img{margin:-11.56% 0 0 -58.43%;}
.web .gift li:nth-child(2) .img{margin:-15.93% 0 0 106.25%;}
.web .gift li:nth-child(3) .img{margin:-5% 0 0 -63.54%;}

.web .gift li .img:before{
	content:"";
	display: block;
	width:100%;
	aspect-ratio:3.93;
	background: url(../images/obj_pad.png) no-repeat center/100%;
	scale:-1 1;
}
.web .gift li:nth-child(2) .img:before{
	scale:none;
}

.web .gift li .img img{
	position: absolute;
	left:50%;
	top:0;
	width:60%;
	translate:-50% 0;
	display: block;
}

.web .gift li:nth-child(1) .img .o1{margin: 31% 0 0 3%;}
.web .gift li:nth-child(1) .img .o2{margin: 6% 0 0 30%;}
.web .gift li:nth-child(2) .img .o1{margin: 46% 0 0 14%;}
.web .gift li:nth-child(2) .img .o2{margin: 14% 0 0 78%;}
.web .gift li:nth-child(3) .img .o1{margin: 33% 0 0 0%;}
.web .gift li:nth-child(3) .img .o2{margin: -6% 0 0 59%;}
/********* img end **********/

.web .gift .CTWrapper > .o1{width:11.57%; margin:-16.2% 0 0 18.42%;}
.web .gift .CTWrapper > .o2{width:13.68%;aspect-ratio:0.72;margin: 14.2% 0 0 73.42%;}
.web .gift .CTWrapper > .o2:before{background-image: url(../images/obj_monkey3.png);}
.web .gift .CTWrapper > .o3{width:8.1%;margin: 32.73% 0 0 14%;}

/********* 提醒 start **********/
.web .gift .remind{
	position: absolute;
	left:0;
	top:0;
	width:21.05%;
	aspect-ratio:1.42;
	margin:40.8% 0 0 65.89%;
	display: flex;
	align-items: flex-end;
}
.web .gift .remind:before{
	content:"";
	display: block;
	width:100%;
	aspect-ratio:3.93;
	background: url(../images/obj_pad.png) no-repeat center/100%;
}

.web .gift .remind p{
	position: absolute;
	left:0;
	bottom:100%;
	margin:0 0 0 5.5%;
	font-size: 0.66em;
	line-height: 1.6em;
	color:var(--theme-color1);
	text-align: center;
	white-space: nowrap;
	padding:0.25em 2.5em 2em;
}
.web .gift .remind p:before,
.web .gift .remind p:after{
	position: absolute;
	top:0;
	content:"";
	display: block;
	width:0.1em;
	height:100%;
	background: currentColor;
	transform-origin: center top;
}
.web .gift .remind p:before{
	left:0;
	rotate:-30deg;
}
.web .gift .remind p:after{
	right:0;
	rotate:30deg;
}
.web .gift .remind .obj{
	margin-left:20%;
	width:56.5%;
}
/********* 提醒 end **********/
/******************* gift end **********************/

/******************* member start **********************/
.web .member{
	display: flex;
	flex-direction: column;
	align-items: center;
	aspect-ratio:1.91;
	background: url(../images/webMemberBg.png) no-repeat center/cover;
}

.web .member .CTWrapper{
	flex-grow:1;
}

.web .member .CT{
	position: relative;
	height:100%;
	z-index: 1;
}

.web .member .info{
	position: relative;
	height:inherit;
}

.web .member .info li{
	position: absolute;
	left:0;
	top:0;
	width:46.66%;
	aspect-ratio:2.7874;
}
.web .member .info li:nth-child(1){margin: 4% 0 0 8%;}
.web .member .info li:nth-child(2){margin: 18% 0 0 47%;}
.web .member .info li:hover{
	z-index: 1;
}
.web .member a{
	display: block;
	height:100%;
	transition: transform 0.5s;
}
.web .member li:nth-child(1) a{	color:var(--theme-color3);}
.web .member li:nth-child(2) a{	color:var(--theme-color1);}
.web .member .info li:hover a{
	transform: scale(1.05);
}
.web .member .ticket{
	position: relative;
	height:inherit;
	padding-top:7%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.web .member .info li:nth-child(1) .ticket{
	padding-left:30%;
	transform: rotate(-5deg);
	background-image: url(../images/webMemberTicket1.png);
	animation:ticketFloat 3s ease-in-out alternate infinite, ticketFlash 0.5s ease-in alternate infinite;
}
.web .member .info li:nth-child(2) .ticket{
	padding-left:34%;
	transform: rotate(4deg);
	background-image: url(../images/webMemberTicket2.png);
	animation:ticketFloat2 4s ease-in-out alternate infinite, ticketFlash 0.5s ease-in 0.33s alternate infinite;
}
@keyframes ticketFloat{
	to{
		transform: translateY(-20%) rotate(5deg);
	}
}
@keyframes ticketFloat2{
	to{
		transform: translateY(-20%) rotate(-3deg);
	}
}
@keyframes ticketFlash{
	to{
		filter:drop-shadow(0 0 1em #FFF);
	}
}
.web .member .ticket em{
	display: none;
}
.web .member .ticket span{
	display: block;
	font-size: 1.8em;
	letter-spacing: -0.04em;
}
.web .member .ticket span strong{
	display: inline-block;
	transform: translateY(0.05em);
	font-size: 2em;
	font-weight:600;
}

.web .member .ticket:after{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	content:"";
	display: block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.web .member .info li:nth-child(1) .ticket:after{background-image: url(../images/webMemberTicketT1.svg);}
.web .member .info li:nth-child(2) .ticket:after{background-image: url(../images/webMemberTicketT2.svg);}

/********* attBlock start *********/
.web .member .attBlock{
	position: absolute;
	left:0;
	top:0;
	margin:27% 0 0 31%;
}

/***** btn start *****/
.web .member .attBlock button.overlayBtn{
	background: var(--theme-color4);
}
.web .member .attBlock button.overlayBtn:hover{
	background: var(--theme-color1);
}
/***** btn end *****/

.web .member .attBlock .txt{
	display:none;
}

.overlay.attRule ol{
	list-style: decimal;
	padding-left:1.2em;
}
.overlay.attRule li+li{
	margin-top:0.8em;
}
/********* attBlock end *********/

.web .member .o1{margin: 0% 0 0 17%;}
.web .member .o2{margin: 2% 0 0 19%;}
.web .member .o3{margin: 24% 0 0 40%;}
.web .member .o4{margin: 3% 0 0 64%;}
.web .member .o5{margin: 5% 0 0 60%;}
.web .member .o6{margin: 23% 0 0 60%;}
.web .member .o7{width:8.42%;margin: 6% 0 0 73%;}
.web .member .o8,
.web .member .o9{width:15.36%;aspect-ratio:0.5034;margin-top: 11%;}
.web .member .o8{margin-left: 17.9%;}
.web .member .o9{margin-left: 66%;}
.web .member .o8:before,
.web .member .o9:before{background-image: url(../images/obj_light3.png);transform-origin: center top;}
.web .member .o10{width:14.94%;aspect-ratio:1.46;margin: 22% 0 0 41%;}
.web .member .o10:before{background-image: url(../images/obj_elephant2.png);}
/******************* member end **********************/
/****************************************** web end ************************************************/

/****************************************** store start ************************************************/
.store{
	background: url(../images/storeBgTop.png) repeat-x center top/7.89%,
				url(../images/storeBg.gif) repeat center top/7.89%;
}

/******************* sectionTitle start **********************/
.store .sectionTitle strong{
	background-image: url(../images/sectionTitleStore.svg);
}
/******************* sectionTitle end **********************/

/******************* tab start **********************/
.store .tab{
	width:56.84%;
	margin:3.15% auto 0;
	display: flex;
	justify-content: space-between;
}
.store .tab li{
	width:48.51%;
	border-radius:1.5em;
	border-bottom-right-radius:0;
	color:var(--theme-color5);
	background: var(--theme-color4);
	cursor:pointer;
	text-align: center;
	font-size: 1.16em;
	line-height: 1em;
	padding:0.7em 0 0.55em;
	transition: background 0.2s;
}
.store .tab li:hover,
.store .tab li.active{
	background: var(--theme-color1);
}
/******************* tab end **********************/

.store .tabCTWrapper{
	margin-top:2.1%;
}

.store .tabCT{
	display:none;
}
.store .tabCT.active{
	display:block;
}

.store .tabCT{
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100%;
}
.store .tabCT:nth-child(1){
	padding-bottom: 24.21%;
	background-image: url(../images/storeBgBtm1.png);
}
.store .tabCT:nth-child(2){
	padding-bottom: 18.94%;
	background-image: url(../images/storeBgBtm2.png);
}

.store .CT{
	position:relative;
	z-index:1;
}

.store .info{
	margin:0 5%;
}

.store .obj.btm{
	top:auto;
	bottom:0;
	z-index:2;
}

/******************* 主標題區 start **********************/
.store .title{
	display: flex;
	align-items: center;
	white-space: nowrap;
	font-family: 'Noto Serif TC';
}

.store .title h4{
	font-size: 1.29em;
	display: flex;
	align-items: flex-start;
}
.store .title h4 em{
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	width: 8.45em;
	aspect-ratio: 5.24;
	background: url(../images/date2.svg) no-repeat center/100%;
	margin:0.25em 0 0 0.5em;
}

.store .title > a{
	border-radius:1.5em;
	border-bottom-left-radius:0;
	color:var(--theme-color5);
	background: var(--theme-color2);
	cursor:pointer;
	text-align: center;
	font-size: 0.83em;
	line-height: 1em;
	padding:0.6em 1.5em 0.55em;
	transition: background 0.2s;
	margin-left:0.8em;
}
.store .title > a:hover{
	background: var(--theme-color1);
}

.store .title > span{
	font-size: 0.74em;
	margin-left:0.5em;
}
/******************* 主標題區 end **********************/

.store .tabCT ul{
	margin-top:2.77%;
}

/****************** 情境圖 start ********************/
.store .img{
	position: relative;
	border-radius:0.8em;
	border-bottom-right-radius:0;
	overflow: hidden;
}
.store .img img{
	width:100%;
	display: block;
	transition: scale 0.5s;
}
.store a:hover .img img{
	scale:1.05;
}
.store .img:after{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	content:"";
	display: block;
	box-shadow: inset 0 0 0.5em 0.25em rgba(0, 0, 0, 0.2);
}
/****************** 情境圖 end ********************/

/******************* tel start **********************/
.store a.tel{
	display: inline-flex;
	align-items: center;
}
.store a.tel:before{
	content:"";
	display: block;
	width:1em;
	aspect-ratio:1;
	background: url(../images/tel.svg) no-repeat center/100%;
}
.store a.tel:hover{
	color:inherit;
	text-decoration: underline;
}
/******************* tel end **********************/

/******************* tabCT1 start **********************/
.store .tabCT:nth-child(1) .info{
	position: relative;
}

/********* 情境圖 start **********/
.store .tabCT:nth-child(1) .imgWrapper{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	z-index:1;
}
.store .tabCT:nth-child(1) .img{
	position: absolute;
	left:0;
	top:0;
	box-shadow:0.33em -0.33em 0 0 var(--theme-color5);
	width:21.29%;
}
.store .tabCT:nth-child(1) .img:nth-child(1){margin:3.5% 0 0 84%;}
.store .tabCT:nth-child(1) .img:nth-child(2){margin:50% 0 0 67%;}
/********* 情境圖 end **********/

.store .tabCT:nth-child(1) .info > ul > li{
	position: relative;
	width:88.88%;
	border-radius:1em;
	padding:1.5em 2.08em 2.5em 5em;
	background: linear-gradient(to bottom, rgba(247, 241, 223, 1), rgba(247, 241, 223, 0));
}
.store .tabCT:nth-child(1) .info > ul > li:nth-child(even){
	margin-left:11.57%;
}

/********* 左上數字標 start **********/
.store .tabCT:nth-child(1) .info > ul > li:before{
	position: absolute;
	left:0;
	top:0;
	display: block;
	margin:-4.4% 0 0 3%;
	font-size: 5em;
	font-weight: 500;
	font-style: italic;
	line-height: 1em;
	color:var(--theme-color1);
}
.store .tabCT:nth-child(1) .info > ul > li:nth-child(1):before{content:"1";}
.store .tabCT:nth-child(1) .info > ul > li:nth-child(2):before{content:"2";}
.store .tabCT:nth-child(1) .info > ul > li:nth-child(3):before{content:"3";}
.store .tabCT:nth-child(1) .info > ul > li:nth-child(4):before{content:"4";}
/********* 左上數字標 end **********/

/********* 內標題 start **********/
.store .tabCT:nth-child(1) li h5 {
	font-size: 1em;
}
.store .tabCT:nth-child(1) li:nth-child(1) h5,
.store .tabCT:nth-child(1) li:nth-child(2) h5{
	margin-top:-0.5em;
}
.store .tabCT:nth-child(1) li h5 span{
	font-size: 1.29em;
	font-family: 'Noto Serif TC';
}
.store .tabCT:nth-child(1) li h5 span strong{
	font-size: 1.6em;
	font-family: Cinzel;
	font-weight: 600;
	color:var(--theme-color1);
}
.store .tabCT:nth-child(1) li h5 i{
	font-style: normal;
	color:var(--theme-color4);
}
/********* 內標題 end **********/

.store .tabCT:nth-child(1) li ul,
.store .tabCT:nth-child(1) li p,
.store .tabCT:nth-child(1) .ps{
	font-family: 'Noto Serif TC';
}
.store .tabCT:nth-child(1) li ul,
.store .tabCT:nth-child(1) li p{
	font-size: 0.95em;
	margin:0.5em 0 0;
}

/********* 品牌們 start **********/
.store .tabCT:nth-child(1) li ul{
	display: flex;
	flex-wrap: wrap;
}
.store .tabCT:nth-child(1) li ul li{
	margin-bottom: 0.3em;
}
.store .tabCT:nth-child(1) li ul li:not(:last-child):after{
	content:"／";
}
/********* 品牌們 end **********/

/********* 說明文 start **********/
.store .tabCT:nth-child(1) li p{
	line-height: 2em;
}
.store .tabCT:nth-child(1) li p br{
	display: none;
}
.store .tabCT:nth-child(1) li p em,
.store .tabCT:nth-child(1) li p span{
	color:var(--theme-color1);
}
.store .tabCT:nth-child(1) li p em{
	font-style: normal;
}
.store .tabCT:nth-child(1) li p span{
	font-family: Cinzel;
}
.store .tabCT:nth-child(1) li p span strong{
	font-size: 1.5em;
}
/********* 說明文 end **********/

/********* 注意事項 start **********/
.store .tabCT:nth-child(1) li .ps{
	font-size:0.7em;
	margin-top:2em;
}
.store .tabCT:nth-child(1) li .ps ol{
	padding-left:1.2em;
	list-style: decimal;
}
/********* 注意事項 end **********/

.store .tabCT:nth-child(1) .o1{margin: 19% 0 0 19%;}
.store .tabCT:nth-child(1) .o2{margin: 21% 0 0 15%;}
.store .tabCT:nth-child(1) .o3{margin: 53% 0 0 4%;}
.store .tabCT:nth-child(1) .o4{margin: 7% 0 0 84%;}
.store .tabCT:nth-child(1) .o5{margin: 35% 0 0 81%;}
.store .tabCT:nth-child(1) .o6{margin: 54% 0 0 84%;}
.store .tabCT:nth-child(1) .o7{margin: 57% 0 0 81%;}
.store .tabCT:nth-child(1) .o8{width:5.15%;margin: 30% 0 0 19%;}
.store .tabCT:nth-child(1) .o9{width:10.52%;margin: 38% 0 0 73%;}
.store .tabCT:nth-child(1) .o10{width:12.21%;margin: 0 0 17% 2%;}
.store .tabCT:nth-child(1) .o11{width:13.89%;margin: 0 0 20% 15%;}
.store .tabCT:nth-child(1) .o12{width:10.84%;margin: 0 0 15% 70.5%;}
.store .tabCT:nth-child(1) .o13{width:18.52%;margin: 0 0 14% 82.5%;}
.store .tabCT:nth-child(1) .o14{width:14.94%;aspect-ratio:1.86;margin: 0 0 5.5% 18.5%;}
.store .tabCT:nth-child(1) .o14:before{background-image: url(../images/obj_hb.svg);}
.store .tabCT:nth-child(1) .o15{width:29.89%;aspect-ratio: 1.3087;margin-left: 35.05%;}
.store .tabCT:nth-child(1) .o15:before{background-image: url(../images/obj_cake2.png);}
.store .tabCT:nth-child(1) .o16{width:10%;aspect-ratio:3.65;margin: 0 0 6% 67%;}
.store .tabCT:nth-child(1) .o16:before{background-image: url(../images/obj_home.svg);}
.store .tabCT:nth-child(1) .o17{width: 10.52%;margin: 0 0 -7% 77%;}
/******************* tabCT1 end **********************/

/******************* tabCT2 start **********************/
.store .tabCT:nth-child(2) ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}

.store .tabCT:nth-child(2) li{
	width:31.29%;
}
.store .tabCT:nth-child(2) li:nth-child(n+4){
	margin-top:4.62%;
}
.store .tabCT:nth-child(2) li:last-child{
	margin-left:3.05%;
	margin-right:auto;
}

.store .tabCT:nth-child(2) li a{
	display: block;
}
.store .tabCT:nth-child(2) li a .txt{
	margin-top:0.85em;
	color:var(--theme-color3);
	border-left:0.25em solid;
	padding-left:0.6em;
	font-family: 'Noto Serif TC';
}
.store .tabCT:nth-child(2) li a .txt *{
	display: block;
}
.store .tabCT:nth-child(2) li a .txt em{
	font-size: 0.85em;
	font-style: normal;
	line-height: 1em;
}
.store .tabCT:nth-child(2) li a .txt strong{
	font-weight: 800;
	margin-top:0.2em;
	line-height: 1.25em;
	color:var(--theme-color2);
}

.store .tabCT:nth-child(2) .o1{margin: 23% 0 0 12%;}
.store .tabCT:nth-child(2) .o2{margin: 26% 0 0 14%;}
.store .tabCT:nth-child(2) .o3{margin: 48% 0 0 5%;}
.store .tabCT:nth-child(2) .o4{margin: 7% 0 0 82%;}
.store .tabCT:nth-child(2) .o5{margin: 49% 0 0 85%;}
.store .tabCT:nth-child(2) .o6{margin: 51% 0 0 83%;}
.store .tabCT:nth-child(2) .o7{width:5.15%;margin: 51% 0 0 19%;}
.store .tabCT:nth-child(2) .o8{width:10.52%;margin: 23% 0 0 73%;}
.store .tabCT:nth-child(2) .o9{width:12.21%;margin: 0 0 29% 3%;}
.store .tabCT:nth-child(2) .o10{width:13.89%;margin: 0 0 7% 10%;}
.store .tabCT:nth-child(2) .o11{width:26.63%;aspect-ratio: 1.1447;margin: 0 0 18% 63%;}
.store .tabCT:nth-child(2) .o11:before{background-image: url(../images/obj_cake3.png);}
.store .tabCT:nth-child(2) .o12{width:18.52%;margin: 0 0 5.5% 86%;}
.store .tabCT:nth-child(2) .o13{width: 10.52%;margin: 0 0 -4% 73%;}
.store .tabCT:nth-child(2) .o14{width:40.42%;aspect-ratio: 9.8461;margin: 0 0 9% 29%;}
.store .tabCT:nth-child(2) .o14:before{background-image: url(../images/obj_hbh.svg);}
/******************* tabCT2 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 nav{
		font-size:0.95em;
	}
	.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){
	
	.themeEventContainer{
		font-size:clamp(10px, 4.21vw, 24px);
		background-size: 20%;
	}
	
	/************************************** 其它共用 start ***************************************************/
	.CTWrapper .CT{
		width: 90%;
	}
	
	/***************** sectionTitle start ************************/
	.sectionTitle{
		width:60%;
	}
	/***************** sectionTitle end ************************/
	
	/***************** overlay start ************************/
	.overlay.theme {
		font-size: 1em;
	}
	.overlay.theme .overlayCT {
		padding: 3em 1em;
	}

	.overlay.theme .closeBtn {
		right: 1em;
		top:1em;
		width: 20px;
		height: 20px;
	}
	.overlay.theme .closeBtn:before,
	.overlay.theme .closeBtn:after {
		top: 10px;
		width: 22px;
	}
	/***************** overlay end ************************/
	/************************************** 其它共用 end ***************************************************/
	
	/************************************** header start ***************************************************/	
	/********************** nav start *************************/
	.themeEventContainer header{
		top:47px;
	}
	/********************** nav end *************************/
	/************************************** header end ***************************************************/
	
	/****************************************** home start ************************************************/
	.kvBlock{
		aspect-ratio:0.62;
	}

	/******************* 主標 start ********************/
	.kvBlock hgroup{
		width: 85%;
		margin: 7.5% 0 0 7.5%;
	}
	
	.kvBlock hgroup h2,
	.kvBlock hgroup em{
		margin-left:10%;
	}
	
	.kvBlock hgroup .obj{
		margin:8% 0 0 54%;
	}
	/******************* 主標 end ********************/

	/******************* scene start ********************/
	.kvBlock .scene{
		background-position: 80%;
	}

	.kvBlock .scene .o1,
	.kvBlock .scene .o7,
	.kvBlock .scene .o8,
	.kvBlock .scene .o14,
	.kvBlock .scene .o15,
	.kvBlock .scene .o16{display: none;}
	.kvBlock .scene .o2{margin: 7% 0 0 78%;}
	.kvBlock .scene .o3{margin: 44% 0 0 88%;}
	.kvBlock .scene .o4{width: 15%;margin: 17% 0 0 80%;}
	.kvBlock .scene .o5{margin: 63% 0 0 27%;}
	.kvBlock .scene .o6{width: 17%;margin: 3% 0 0 6%;}
	.kvBlock .scene .o9{width: 30%;margin: 60% 0 0 3%;}
	.kvBlock .scene .o10{width: 29%;margin: 57% 0 0 67%;}
	.kvBlock .scene .o11{width: 73%;margin: 74% 0 0 14%;}
	.kvBlock .scene .o12{width: 39%;margin: 105% 0 0 5%;}
	.kvBlock .scene .o13{width: 36%;margin: 118% 0 0 58%;}
	/******************* scene end ********************/
	
	/******************* about start ********************/
	.home .txt{
		padding-top:20%;
		background-size: 12%, 300%;
		background-position: center bottom, 80% top;
	}

	.home .txt p{
		font-size: 0.8em;
	}

	.home .txt .o1{margin: 1% 0 0 12%;}
	.home .txt .o2{margin: 14% 0 0 26%;}
	.home .txt .o3{margin: 7% 0 0 58%;}
	.home .txt .o4{margin: 90% 0 0 89%;}
	.home .txt .o5{width: 2em;margin: 74% 0 0 74%;}
	.home .txt .o6{width: 35%;margin: 6% 0 0 -12%;}
	.home .txt .o7{width: 29%;margin: 25% 0 0 83%;}
	.home .txt .o8{width: 19%;margin: -9% 0 0 64%;}

	.home .txt strong{
		margin-top:10%;
		background-size: 115%;
	}
	.home .txt strong span{
		width: 87%;
		margin-left: 7%;
	}
	/******************* about end ********************/
	/****************************************** home end ************************************************/
	
	/****************************************** web start ************************************************/
	.web{
		padding-top:10%;
		background-size: 20%
	}

	/******************* 數字標題 start **********************/
	.web h4{
		font-size: 1.6em;
	}
	/******************* 數字標題 end **********************/

	/******************* 日期標題 start **********************/
	.web h5.date{
		font-size: 1.1em;
	}
	/******************* 日期標題 end **********************/

	/******************* discount start **********************/
	.web .discount{
		margin-top:5%;
		padding-bottom: 32%;
	}

	/********** 數字標題 start ***********/
	.web .discount h4{
		position: static;
		margin:0;
	}
	/********** 數字標題 end **********/

	/********** 內容 start **********/
	.web .discount .info{
		width:100%;
		margin-top: 20%;
	}

	.web .discount li{
		padding-left:0.5em;
		padding-right:0.5em;
	}
	.web .discount li:nth-child(1){
		left:auto;
	}
	
	.web .discount li hgroup{
		margin:-1em 0 0 -0.5em;
	}
	.web .discount li hgroup em{
		font-size: 1.2em;
	}
	
	.web .discount li p{
		font-size: 0.95em;
	}
	/********** 內容 end **********/

	.discount .o1{margin: -57% 0 0 4%;}
	.discount .o2{margin: -55% 0 0 10%;}
	.discount .o3{margin: -15% 0 0 87%;}
	.discount .o4{width: 28%;margin: -25% 0 0 17%;}
	.discount .o5{width: 8%;margin: -1% 0 0 6%;}
	.discount .o6{width: 15%;margin: 11% 0 0 86%;}
	.discount .o7{width: 14%;margin: 88% 0 0 2%;}
	.discount .o8{width: 28%;margin: 95% 0 0 10%;}
	.discount .o9{width: 46%;margin: 117% 0 0 57%;}
	.discount .o10{width: 40%;margin: 88% 0 0 65%;}
	/******************* discount end **********************/
	
	/******************* brand start **********************/
	/********** 漸層標 start ***********/
	.web .brand .info hgroup{
		width:95%;
		font-size: 1.05em;
	}
	/********** 漸層標 end ***********/

	.web .brand .CTWrapper{
		margin-top:10%;
	}

	/*************** i1 start ***************/
	.web .brand .i1 .CTWrapper{
		padding-bottom:25%;
	}

	.web .brand .i1 ul{
		width:95%;
	}
	.web .brand .i1 li{
		width:45%;
	}
	.web .brand .i1 li:nth-child(n+3),
	.web .brand .i1 li:nth-child(n+5){
		margin-top:20%;
	}
	.web .brand .i1 li:last-child{
		margin-left:0;
		margin-right:0;
	}
	
	/********** 折扣 start ***********/
	.web .brand .i1 a em.special{
		padding:0.3em 0.15em 0 0.25em;
	}
	/********** 折扣 end ***********/

	.web .brand .i1 .o1{margin: -29% 0 0 6%;}
	.web .brand .i1 .o2{margin: -42% 0 0 13%;}
	.web .brand .i1 .o3{margin: -42% 0 0 64%;}
	.web .brand .i1 .o4{margin: -35% 0 0 84%;}
	.web .brand .i1 .o5{margin: 100% 0 0 -2%;}
	.web .brand .i1 .o6{margin: 380% 0 0 31%;}
	.web .brand .i1 .o7{margin: 388% 0 0 81%;}
	.web .brand .i1 .o8{margin: -13% 0 0 80%;width: 27%;}
	.web .brand .i1 .o9{margin: 197% 0 0 -3%;width: 34%;}
	.web .brand .i1 .o10,
	.web .brand .i1 .o11,
	.web .brand .i1 .o12{display: none;}
	.web .brand .i1 .o13{margin: -12.5% 0 0 2%;width: 12%;}
	/*************** i1 end ***************/

	/*************** i2 start ***************/
	.web .brand .i2 hgroup h5{
		margin:-1.7em 0 0 0;
	}

	.web .brand .i2 .CTWrapper{
		padding-bottom:30%;
		background-size: 200%;
	}

	.web .brand .i2 ul{
		width:95%;
	}

	/******* slick start *********/
	.web .brand .i2 ._slickPN{
		--size:1.8em;
		top:40%;
	}
	/******* slick end *********/

	.web .brand .i2 .o1{margin: 65% 0 0 26%;}
	.web .brand .i2 .o2{margin: 61% 0 0 43%;}
	.web .brand .i2 .o3{margin: -14% 0 0 79%;width: 29%;}
	.web .brand .i2 .o4{margin: 59% 0 0 74%;width: 28%;}
	.web .brand .i2 .o5{margin: -10% 0 0 4%;width: 11%;}
	/*************** i2 end ***************/
	/******************* brand end **********************/
	
	/******************* gift start **********************/
	.web .gift{
		padding-bottom:5%;
		background-size: 20%;
	}

	.web .gift .CTWrapper{
		margin-top:10%;
	}

	.web .gift .info{
		width:auto;
	}

	.web .gift li{
		width:auto;
		padding:2.6em 1em;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
	}
	.web .gift li+li{
		margin-top:0;
	}
	.web .gift li:nth-child(1){
		margin-left:0;
	}
	.web .gift li:nth-child(3){
		width:auto;
		margin-left:0;
	}

	.web .gift li .txt{
		width:100%;
	}
	
	.web .gift li p{
		text-align: center;
	}
	.web .gift li p span.name{
		font-size: 1em;
	}

	/********* 限量 start **********/
	.web .gift li em{
		margin-right:-1em;
		font-size: 0.8em;
	}
	.web .gift li:nth-child(2) em{
		border-radius:1.5em;
		border-bottom-left-radius:0;
	}
	/********* 限量 end **********/

	/********* img start **********/
	.web .gift li .img{
		position: relative;
		width:90%;
	}
	.web .gift li:nth-child(1) .img,
	.web .gift li:nth-child(2) .img,
	.web .gift li:nth-child(3) .img{margin:0.5em 0 0;}
	/********* img end **********/

	.web .gift .CTWrapper > .o1{width: 20%;margin: -42% 0 0 1%;}
	.web .gift .CTWrapper > .o2{width: 31%;margin: 168% 0 0 72%;}
	.web .gift .CTWrapper > .o3{width: 18%;margin: 290% 0 0 3%;}

	/********* 提醒 start **********/
	.web .gift .remind{
		position: relative;
		width: 60%;
		margin: 15% auto 0;
	}
	
	.web .gift .remind p{
		font-size: 0.8em;
		margin-left: 0;
	}
	/********* 提醒 end **********/
	/******************* gift end **********************/
	
	/******************* member start **********************/
	.web .member{
		aspect-ratio:0.55;
	}

	.web .member .info li{
		width:85%;
	}
	.web .member .info li:nth-child(1){margin: 14% 0 0 2%;}
	.web .member .info li:nth-child(2){margin: 48% 0 0 13%;}
	
	.web .member .ticket{
		padding-top:7.5%;
	}
	.web .member .info li:nth-child(1) .ticket{
		padding-left:30%;
	}
	.web .member .info li:nth-child(2) .ticket{
		padding-left:34%;
	}
	.web .member .ticket span{
		font-size: 1.4em;
	}

	/********* attBlock start *********/
	.web .member .attBlock{
		margin: 85% 0 0 36%;
	}
	/********* attBlock end *********/

	.web .member .o1{margin: -10% 0 0 8%;}
	.web .member .o2{margin: -2% 0 0 19%;}
	.web .member .o3{margin: 71% 0 0 7%;}
	.web .member .o4{margin: 15% 0 0 88%;}
	.web .member .o5{margin: 74% 0 0 18%;}
	.web .member .o6{margin: 87% 0 0 76%;}
	.web .member .o7{width: 24%;margin: 26% 0 0 78%;}
	.web .member .o8,
	.web .member .o9{display: none;}
	.web .member .o10{width: 43%;margin: 90% 0 0 29%;}
	/******************* member end **********************/
	/****************************************** web end ************************************************/
	
	/****************************************** store start ************************************************/
	.store{
		background-size: 20%;
		margin-top:-20%;
	}

	/******************* tab start **********************/
	.store .tab{
		width:90%;
		margin-top:10%;
		display: block;
	}
	.store .tab li{
		width:auto;
		font-size: 1em;
	}
	.store .tab li+li{
		margin-top:0.5em;
	}
	/******************* tab end **********************/

	.store .tabCTWrapper{
		margin-top:10%;
	}

	.store .tabCT{
		background-size: 150%;
	}
	.store .tabCT:nth-child(1){
		padding-bottom: 55%;
	}
	.store .tabCT:nth-child(2){
		padding-bottom: 80%;
	}

	.store .info{
		margin:0;
	}

	/******************* 主標題區 start **********************/
	.store .title{
		flex-wrap: wrap;
	}
	
	.store .title h4{
		font-size: 1.05em;
	}

	.store .title > span{
		width:100%;
		font-size: 0.75em;
		white-space: normal;
		margin:0.5em 0 0;
	}
	/******************* 主標題區 end **********************/

	.store .tabCT ul{
		margin-top:10%;
	}

	/******************* tabCT1 start **********************/
	/********* 情境圖 start **********/
	.store .tabCT:nth-child(1) .imgWrapper{
		position: static;
		width:auto;
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		margin-top:8%;
	}
	.store .tabCT:nth-child(1) .img{
		position: relative;
		width:47%;
	}
	.store .tabCT:nth-child(1) .img:nth-child(1),
	.store .tabCT:nth-child(1) .img:nth-child(2){margin:0;}
	/********* 情境圖 end **********/

	.store .tabCT:nth-child(1) .info > ul{
		margin-top:10%;
	}
	.store .tabCT:nth-child(1) .info > ul > li{
		width:auto;
		padding:1.5em 1.8em 2.5em;
	}
	.store .tabCT:nth-child(1) .info > ul > li:nth-child(even){
		margin-left:0;
	}

	/********* 左上數字標 start **********/
	.store .tabCT:nth-child(1) .info > ul > li:before{
		margin-top:-10%;
		font-size: 4em;
	}
	/********* 左上數字標 end **********/

	/********* 內標題 start **********/
	.store .tabCT:nth-child(1) li h5 i{
		display: block;
		margin-left:-0.5em;
	}
	/********* 內標題 end **********/
	
	/********* 說明文 start **********/
	.store .tabCT:nth-child(1) li p br{
		display: block;
	}
	/********* 說明文 end **********/

	/********* 注意事項 start **********/
	.store .tabCT:nth-child(1) li .ps{
		margin-top:1em;
	}
	/********* 注意事項 end **********/

	.store .tabCT:nth-child(1) .o1{margin: -6% 0 0 5%;}
	.store .tabCT:nth-child(1) .o2{margin: -9% 0 0 88%;}
	.store .tabCT:nth-child(1) .o3{margin: 61% 0 0 37%;}
	.store .tabCT:nth-child(1) .o4{margin: 122% 0 0 81%;}
	.store .tabCT:nth-child(1) .o5{margin: 197% 0 0 25%;}
	.store .tabCT:nth-child(1) .o6{margin: 242% 0 0 50%;}
	.store .tabCT:nth-child(1) .o7{margin: 338% 0 0 83%;}
	.store .tabCT:nth-child(1) .o8{width: 16%;margin: 197% 0 0 -4%;}
	.store .tabCT:nth-child(1) .o9{width: 28%;margin: 236% 0 0 81%;}
	.store .tabCT:nth-child(1) .o10,
	.store .tabCT:nth-child(1) .o13,
	.store .tabCT:nth-child(1) .o17{display: none;}
	.store .tabCT:nth-child(1) .o11{width: 27%;margin: 0 0 22% 1%;}
	.store .tabCT:nth-child(1) .o12{width: 26%;margin: 0 0 17% 71%;}
	.store .tabCT:nth-child(1) .o14{width: 28%;margin: 0 0 43% 26%;}
	.store .tabCT:nth-child(1) .o15{width:50%;margin-left: 25%;}
	.store .tabCT:nth-child(1) .o16{width: 18%;margin: 0 0 42% 56%;}
	/******************* tabCT1 end **********************/

	/******************* tabCT2 start **********************/
	.store .tabCT:nth-child(2) li{
		width:47%;
	}
	.store .tabCT:nth-child(2) li:nth-child(n+3),
	.store .tabCT:nth-child(2) li:nth-child(n+4){
		margin-top:8%;
	}
	.store .tabCT:nth-child(2) li:last-child{
		margin-left:0;
		margin-right:0;
	}

	.store .tabCT:nth-child(2) li a .txt{
		font-size: 0.9em;
		height:3.5em;
	}

	.store .tabCT:nth-child(2) .o1{margin: -6% 0 0 5%;}
	.store .tabCT:nth-child(2) .o2{margin: 297% 0 0 64%;width: 1.5em;}
	.store .tabCT:nth-child(2) .o3{margin: 87% 0 0 38%;}
	.store .tabCT:nth-child(2) .o4{margin: -2% 0 0 89%;}
	.store .tabCT:nth-child(2) .o5{margin: 152% 0 0 93%;}
	.store .tabCT:nth-child(2) .o6{margin: 217% 0 0 40%;}
	.store .tabCT:nth-child(2) .o7{width: 14%;margin: 156% 0 0 -2%;}
	.store .tabCT:nth-child(2) .o8{width: 27%;margin: 218% 0 0 81%;}
	.store .tabCT:nth-child(2) .o9{width: 25%;margin: 0 0 38% 0%;}
	.store .tabCT:nth-child(2) .o10{display: none;}
	.store .tabCT:nth-child(2) .o11{width: 60%;margin: 0 0 19% 20%;}
	.store .tabCT:nth-child(2) .o12{width: 32%;margin: 0 0 4% 74%;}
	.store .tabCT:nth-child(2) .o13{width: 21%;margin: 0 0 31% 76%;}
	.store .tabCT:nth-child(2) .o14{width: 62%;margin: 0 0 8% 6%;}
	/******************* tabCT2 end **********************/
	/****************************************** store end ************************************************/

}