@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400&family=Noto+Serif+TC:wght@500;600;700&family=EB+Garamond:wght@500&family=Poppins&display=swap');


html.disableScroll{
	overflow:hidden;
}

body{
	--color:#474032;
	--color1:#7daa83;
	--color2:#cba236;
	--color3:#FFF070;
	--color4:#a7b22f;
	--highlight-color:var(--color3);
}

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

.midBlock,
.themeMain{
	display:none;
}

.themeEventContainer{
	font-family: 'Noto Serif TC', serif;
	font-weight:600;
	font-size:clamp(10px, 1.05vw, 20px);
	color:var(--color);
}

/************************************** 其它共用 start ***************************************************/
.cs::-webkit-scrollbar{
	width:10px;
}
.cs.h::-webkit-scrollbar{
	height:10px;
}
.cs::-webkit-scrollbar-thumb{
	border:2px solid transparent;
	border-radius:10px;
	background-color:var(--color1);
	background-clip: content-box;
}
.cs::-webkit-scrollbar-thumb:hover{
	background-color: var(--color2);
}

.themeEventContainer a:hover{
	color:currentColor;
}

/***************** sectionTitle start ************************/
.sectionTitle{
	display: flex;
	flex-direction: column;
	align-items: center;
}
.sectionTitle strong{
	width:26.3%;
	aspect-ratio:4.62;
	font-size: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
/***************** sectionTitle end ************************/

/***************** obj start ************************/
.obj{
	position: absolute;
	left:0;
	top:0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	pointer-events: none;
}

.obj.flip{
	scale:-1 1;
}

.obj.flower.y{ aspect-ratio:1.14; background-image: url(../images/obj_flower1.svg);}
.obj.flower.r{ aspect-ratio:1; background-image: url(../images/obj_flower2.svg);}

.obj.man1{ aspect-ratio:0.74; background-image: url(../images/obj_man1.png);}
.obj.man2{ aspect-ratio:0.93; background-image: url(../images/obj_man2.png);}
.obj.man3{ aspect-ratio:2.79; background-image: url(../images/obj_man3.png);}
.obj.man4{ aspect-ratio:0.6; background-image: url(../images/obj_man4.png);}
.obj.man4:before{
	position: absolute;
	left:0;
	top:0;
	content: "";
	display: block;
	width:53.84%;
	aspect-ratio:0.92; 
	margin:-46.15% 0 0 -49.23%;
	background: url(../images/obj_man4Flower.png) no-repeat center/100%;
	animation:man4Flower 1.5s ease-in-out alternate infinite;
}
@keyframes man4Flower{
	to{
		translate:0 -10%;
	}
}
.obj.man5{ aspect-ratio:0.95; background-image: url(../images/obj_man5.png);}
.obj.man6{ aspect-ratio:0.54; background-image: url(../images/obj_man6.png);}
.obj.man7{ aspect-ratio:0.93; background-image: url(../images/obj_man7.png);}
.obj.man8{ aspect-ratio:0.9; background-image: url(../images/obj_man8.png);}

.obj.cat{ aspect-ratio:0.68; background-image: url(../images/obj_cat.png);}
.obj.doll{ aspect-ratio:0.66; background-image: url(../images/obj_doll.png);}
.obj.monkey{ aspect-ratio:1.19; background-image: url(../images/obj_monkey.png);}
.obj.desk{ aspect-ratio:0.86; background-image: url(../images/obj_desk.png);}
.obj.dog{ aspect-ratio:0.98; background-image: url(../images/obj_dog.png);}
.obj.chair{ aspect-ratio:1.26; background-image: url(../images/obj_chair.png);}
.obj.dash1{ aspect-ratio:0.18; background-image: url(../images/obj_dash1.svg);}
.obj.dash2{ aspect-ratio:0.16; background-image: url(../images/obj_dash2.svg);}
/***************** obj end ************************/

/***************** tail start ************************/
.tail{
	position: relative;
	display: block;
	white-space: nowrap;
}
.tail span{
	display: block;
	padding:0.4em 1em;
	line-height: 1em;
	border-radius:0.88em;
}

.tail.L span{
	border-top-right-radius:0;
	border-bottom-left-radius:0;
}
.tail.R span{
	border-top-left-radius:0;
	border-bottom-right-radius:0;
}

.tail.w span{ background: #fffada;}
.tail.y span{ background: var(--color3); color:var(--color);}
.tail.br span{ background: var(--color2); color:#FFF;}
.tail.gr span{ background: var(--color4); color:#FFF;}
.tail.gr2 span{ background: var(--color1); color:#FFF;}

a.tail.br:hover span{ background: var(--color1);}
/***************** tail end ************************/

/***************** overlay start ************************/
.overlay.midSummer {
	font-size: 1.2em;
	font-family: 'Noto Serif TC', serif;
	background: rgba(247, 241, 231, 0.9);
}
.overlay.midSummer .overlayCT {
	height: auto;
	max-width:1050px;
	max-height: none;
	color:#FFF;
	background: var(--color1);
	border-radius: 2em;
	border-top-left-radius: 0;
	border-bottom-right-radius: 0;
	padding: 2em 5em 2em 3em;
}

.overlay.midSummer .closeBtn {
	right: 1.5em;
	top:1.5em;
	bottom: auto;
	width: 38px;
	height: 38px;
	transition: transform 0.2s;
}
.overlay.midSummer .closeBtn:hover {
	transform:rotate(-90deg);
}
.overlay.midSummer .closeBtn:before,
.overlay.midSummer .closeBtn:after {
	top: 19px;
	width: 42px;
	height:2px;
	background: #FFF;
}
/***************** 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(236, 153, 136, 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:#FFF;
	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;
	background-color: #d0edf1;
	z-index: 1;
}

/******************* 主標 start ********************/
.kvBlock hgroup{
	position: absolute;
	left:0;
	top:0;
	width:28.1%;
	margin:8.63% 0 0 45.78%;
	display: flex;
	flex-direction: column;
	align-items: center;
	z-index: 1;
}
.kvBlock hgroup *{
	font-size: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.kvBlock h2{ width:100%; aspect-ratio:7.02;	background-image: url(../images/kvT1.svg); animation:kvT1 2s ease-in-out alternate infinite;}
@keyframes kvT1{
	from{
		translate:2.5% 0;
	}
	to{
		translate:-2.5% 0;
	}
}
.kvBlock em{ width:74.15%; aspect-ratio:5.82; background-image: url(../images/kvT2.svg); animation:kvT2 2s ease-in-out alternate infinite; margin-top:4.49%;}
@keyframes kvT2{
	from{
		translate:-2.5% 0;
	}
	to{
		translate:2.5% 0;
	}
}
.kvBlock span{ width:43.07%; aspect-ratio:7.18; background-image: url(../images/kvT3.svg); margin-top:6.36%;}
/******************* 主標 end ********************/

.kvBlock .cloud{
	animation:cloud 8s ease-in-out alternate infinite both;
}
@keyframes cloud{
	to{
		translate:-50% 0;
	}
}
.kvBlock .cloud.c1{ width:25.26%; aspect-ratio:1.45; margin:2.94% 0 0 -2.63%; background-image: url(../images/kvCloud1.svg); animation:none;}
.kvBlock .cloud.c2{ width:6%; aspect-ratio:3.8; margin:3.89% 0 0 43.15%; background-image: url(../images/kvCloud2.svg); animation-delay: 0s;}
.kvBlock .cloud.c3{ width:12.63%; aspect-ratio:4.44; margin:8.1% 0 0 81.78%; background-image: url(../images/kvCloud3.svg); animation-delay: 1.5s;}
.kvBlock .bird{
	animation:bird 1s ease-in-out alternate infinite both;
}
@keyframes bird{
	to{
		translate:0 -30%;
	}
}
.kvBlock .bird.b1{ width:0.84%; aspect-ratio:1.6; margin:3.89% 0 0 73.47%; background-image: url(../images/kvBird1.svg); animation-delay: 0s;}
.kvBlock .bird.b2{ width:1.36%; aspect-ratio:1.625; margin:4.94% 0 0 74.36%; background-image: url(../images/kvBird2.svg); animation-delay: 0.8s;}
.kvBlock .bird.b3{ width:0.94%; aspect-ratio:1.8; margin:4.84% 0 0 76.42%; background-image: url(../images/kvBird3.svg); animation-delay: 1.6s;}
.kvBlock .hill{	top:auto; bottom:-1px; width:100%; aspect-ratio:3.49; background-image: url(../images/kvHill.svg);}
.kvBlock .man1{	width:9.68%; margin:26.47% 0 0 11.36%;}
.kvBlock .man2{	width:6.1%; margin:18.63% 0 0 32.42%;}
.kvBlock .man3{	width:35.89%; margin:25.15% 0 0 38.21%;}
.kvBlock .man4{	width:6.84%; margin:18.63% 0 0 79.78%;}
.kvBlock .cat{ width:11.68%; margin:25.68% 0 0 90.1%;}
.kvBlock .tree{ width:26.63%; aspect-ratio:0.67; margin:1.47% 0 0 15.47%; background-image: url(../images/kvTree.png);}
.kvBlock .f1{width: 1.8%; margin: 20% 0 0 13%;}
.kvBlock .f2{width: 2%; margin: 33% 0 0 22%;}
.kvBlock .f3{width: 2.5%; margin: 36% 0 0 36%;}
.kvBlock .f4{width: 2%; margin: 26% 0 0 73%;}
.kvBlock .f5{width: 2.5%; margin: 34% 0 0 77%;}

.home .txt{
	position: relative;
	display: flex;
	justify-content: center;
	font-size: 1.3em;
	font-weight:700;
	padding:4.73% 1em 5.78%; 
	text-align: center;
	background: linear-gradient(to bottom, #e0e895, #cae4a7);
}
.home .txt p{
	line-height: 1.7em;
	margin:0;
}
.home .txt .f1{width: 3%; margin: 10% 0 0 21%;}
.home .txt .f2{width: 3%; margin: 17% 0 0 72%;}
.home .txt .f3{width: 3%; margin: 14% 0 0 75%;}
/****************************************** home end ************************************************/

/****************************************** web start ************************************************/
.web{
	position: relative;
	padding:3.68% 0 6%;
	background: url(../images/webBgTop.svg) no-repeat center top/100%, linear-gradient(to bottom, #dae89b, #cae4a7 35%, #a7c572 75%, #f8d0ac 100%);
}

.web .CT{
	width:68.42%;
	margin:0 auto;
}

/******************* sectionTitle start **********************/
.web .sectionTitle{
	position: relative;
	font-size:1em;
	line-height: 1em;
}

.web .sectionTitle strong{
	background-image: url(../images/webTitle.svg);
}

/********* 日期 start **********/
.web .sectionTitle span{
	font-size: 2.2em;
	line-height: 1em;
	width:32.3%;
	margin-top:1%;
	padding-top:0.5em;
	text-align: center;
	background: url(../images/webBrush1.svg) no-repeat center top/100%;
}
.web .sectionTitle span i{
	font-style: normal;
	font-size: 0.8em;
	translate:0 -13%;
	display: inline-block;
}
.web .sectionTitle span em{
	font-size:0.45em;
	font-style: normal;
	font-weight: bold;
	font-family: 'Noto Sans TC';
	color:var(--color);
	background: var(--color2);
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width:1.8em;
	aspect-ratio:1;
	line-height: 0;
	border-radius:50%;
	padding-bottom: 0.1em;
	transform: translateY(-15%);
}
/********* 日期 end **********/

/********* obj start **********/
.web .sectionTitle .o1{width: 16%;margin: -4% 0 0 14%;}
.web .sectionTitle .o2{width: 12%;margin: -5% 0 0 71%;}
.web .sectionTitle .o3{width: 3%;margin: 8% 0 0 26%;}
.web .sectionTitle .o4{width: 3.5%;margin: 15% 0 0 74%;}
/********* obj end **********/
/******************* sectionTitle end **********************/

/******************* 白底次標 start **********************/
.web h4.tail{
	position: relative;
	font-size: 1.8em;
	font-weight:700;
	letter-spacing: 0.05em;
	display:inline-block;
	margin-left:3.84%;
	z-index: 1;
}
.web h4.tail span{
	padding-left:3em;
	padding-bottom:0.5em;
}
.web h4.tail strong{
	position: absolute;
	left:0.3em;
	bottom:-0.1em;
	letter-spacing: -0.01em;
	font-weight: normal;
	font-size: 2.3em;
	color:var(--color4);
}
/******************* 白底次標 end **********************/

/******************* overlay 按鈕 start **********************/
.web button{
	color:#FFF;
	background: var(--color2);
	border:none;
	font-size: 1em;
	line-height: 1em;
	padding:0.35em 0.6em 0.4em;
	font-family: inherit;
	cursor:pointer;
	transition: background 0.2s;
}
.web button:hover{
	background: var(--color1);
}
/******************* overlay 按鈕 end **********************/

/******************* discount start **********************/
.web .discount{
	position: relative;
	margin-top:5%;
}

/********* example start *********/
.web .discount .example{
	display: inline-block;
	margin-left:1em;
}
.web .discount .example .txt{
	display:none;
}

.overlay.midSummer.example p{
	margin:0;
}
.overlay.midSummer.example p+p{
	margin-top:1.5em;
}
.overlay.midSummer.example p strong{
	font-size:1.1em;
	font-weight:normal;
	color:var(--color3);
}
/********* example end *********/

.web .discount .info{
	margin:2% auto 0;
	width:92.32%;
}

.web .discount ul{
	font-size:1.25em;
	color:#FFF;
	display: flex;
	justify-content: space-between;
}
.web .discount li{
	position: relative;
	padding:1.5em 1em;
	background: var(--color1);
	width:48.5%;
	border-radius:0 1em;
}

.web .discount li hgroup{
	display: flex;
	align-items: center;
}
.web .discount li h5{
	font-size:1.9em;
	font-weight: 600;
	line-height: 1em;
}
.web .discount li h5 i{
	font-style: normal;
	font-size: 0.8em;
	translate:0 -13%;
	display: inline-block;
}
.web .discount li h5 em{
	font-size:0.45em;
	font-style: normal;
	font-weight: bold;
	font-family: 'Noto Sans TC';
	color:var(--color);
	background: var(--color3);
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width:1.8em;
	aspect-ratio:1;
	line-height: 0;
	border-radius:50%;
	padding-bottom: 0.1em;
	transform: translateY(-15%);
}
.web .discount li hgroup > em{
	font-style: normal;
	margin-left:0.5em;
}

.web .discount li p{
	font-size:1.15em;
	margin:0.5em 0 0;
	padding-top:0.8em;
	line-height: 1.8em;
	background: url(../images/webBrush2.svg) no-repeat center top/100%;
}
.web .discount li p span{
	display: inline-block;
	color:var(--color3);
	animation:moneyFlash 2s ease-in infinite;
}
.web .discount li:nth-child(1) p span.m1{ animation-delay:0s;}
.web .discount li:nth-child(1) p span.m2{ animation-delay:1s;}
.web .discount li:nth-child(2) p span.m1{ animation-delay:1.5s;}
.web .discount li:nth-child(2) p span.m2{ animation-delay:2s;}
@keyframes moneyFlash{
	50%{
		filter:drop-shadow(0 0 0.25em #FFF);
		color:#FFF;
	}
	100%{
		filter:none;
		color:var(--color3);
	}
}
.web .discount li p span strong{
	font-family: 'EB Garamond';
	font-weight: 500;
	font-size:1.9em;
}

.web .discount li:nth-child(2):after{
	position: absolute;
	content: "";
	display: block;
	right:10%;
	top:0;
	width:15.6%;
	aspect-ratio:0.6;
	background: url(../images/obj_light.png) no-repeat center/100%;
}

/********* obj start **********/
.web .discount .o1{width: 19%;margin: 3% 0 0 101%;}
/********* obj end **********/
/******************* discount end **********************/

/******************* brand start **********************/
.web .brand{
	position: relative;
	margin-top:8%;
}

.web .brand > em{
	font-style: normal;
	font-size: 1.4em;
	font-weight: 700;
	display: inline-block;
	margin-left:1em;
}

.web .brand .info{
	position: relative;
	margin-top:6.15%;
	padding-top:3.07%;
}

.web .brand ul{
	background-repeat:no-repeat;
	background-position: left bottom;
	background-size:100%;
	aspect-ratio:3.25;
	padding-left:3.84%;
	display: flex;
	align-items: flex-start;
}
.web .brand ul:nth-child(odd){
	background-image:url(../images/webBrandBg1.svg);
}
.web .brand ul:nth-child(even){
	background-image:url(../images/webBrandBg2.svg);
}
.web .brand ul+ul{
	margin-top:4%;
}

.web .brand li{
	width:20.8%;
}
.web .brand li+li{
	margin-left:3.2%;
}

.web .brand a{
	position: relative;
	display: block;
	transition: filter 0.2s;
}
.web .brand a:hover{
	filter:drop-shadow(0 0 0.5em rgba(0, 0, 0, 0.5));
}

/******** tag start ********/
.web .brand a em{
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	right:0;
	top:0;
	width:46.15%;
	aspect-ratio:1;
	margin:-15.38% -15.38% 0 0;
	color:#FFF;
	background: #b7363c;
	border-radius:50%;
	font-style: normal;
	font-weight: normal;
	font-size: 1.5em;
	text-align: center;
	line-height: 1.6em;
}
.web .brand a em span{
	display: block;
}
.web .brand ul:last-child li:last-child a em span{
	color:var(--color3);
	line-height: 1.1em;
	translate:0 -7%;
}
.web .brand a em span i{
	font-style: normal;
	font-size: 2.4em;
	font-family: 'EB Garamond';
	color:var(--color3);
	display: inline-block;
	margin-left:0.25em;
}
/******** tag end ********/

/******** img start ********/
.web .brand a img{
	position: relative;
	width:100%;
	display: block;
	border-radius:50%;
	border-bottom-left-radius:0;
	transition: scale 0.5s;
}
.web .brand a:hover img{
	scale:1.05;
}
/******** img end ********/

/******** logo start ********/
.web .brand .logo{
	font-size: 0;
	margin-top:5.76%;
	display: block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.web .brand .artek{ width:39.23%; aspect-ratio:3.27; background-image: url(../images/logo_artek.svg);}
.web .brand .vitra{ width:35.38%; aspect-ratio:3; background-image: url(../images/logo_vitra.svg);}
.web .brand .maruni{ width:40.76%; aspect-ratio:5.14; background-image: url(../images/logo_maruni.svg);}
.web .brand .magis{ width:41.53%; aspect-ratio:4.23; background-image: url(../images/logo_magis.svg);}
.web .brand .anglepoise{ width:75.76%; aspect-ratio:5.25; background-image: url(../images/logo_anglepoise.svg);}
.web .brand .e15{ width:25.76%; aspect-ratio:1.11; background-image: url(../images/logo_e15.svg);}
.web .brand .string{ width:45%; aspect-ratio:3.1; background-image: url(../images/logo_string.svg);}
.web .brand .moooi{ width:50.76%; aspect-ratio:5.25; background-image: url(../images/logo_moooi.svg);}
.web .brand .bd{ width:28.23%; aspect-ratio:1.89; background-image: url(../images/logo_bd.svg);}
.web .brand .form{ width:62.38%; aspect-ratio:4.33; background-image: url(../images/logo_form.svg);}
.web .brand .maruni60{ width:28.76%; aspect-ratio:1.06; background-image: url(../images/logo_maruni60.svg);}
.web .brand .vdm{ width:35.53%; aspect-ratio:1.41; background-image: url(../images/logo_vdm.svg);}
.web .brand .moln{ width:50.76%; aspect-ratio:4.19; background-image: url(../images/logo_moln.svg);}
.web .brand .holme{ width:30.76%; aspect-ratio:0.92; background-image: url(../images/logo_holme.svg);}
.web .brand .rosendahl{ width:70%; aspect-ratio:10.125; background-image: url(../images/logo_rosendahl.svg);}
.web .brand .gj{ width:55.76%; aspect-ratio:1.93; background-image: url(../images/logo_gj.svg);}
/******** logo end ********/

/********* obj start **********/
.web .brand .o1{width: 25%;margin: -2% 0 0 -26%;}
.web .brand .o2{width: 13%;margin: -5% 0 0 100%;}
.web .brand .o3{width: 9%;margin: 25% 0 0 104%;}
.web .brand .o4{width: 9%;margin: 60% 0 0 89%;}
.web .brand .o5{width: 6%;margin: 53% 0 0 -15%;}
.web .brand .o6{width: 6%;margin: 61% 0 0 -11%;}
.web .brand .o7{width: 13%;margin: 98% 0 0 -11%;}
.web .brand .o8{width: 5.5%;margin: 109% 0 0 -12%;}
.web .brand .o9{width: 22%;margin: 141% 0 0 -18%;}
.web .brand .o10{width: 20%;margin: 92% 0 0 100%;}
.web .brand .o11{width: 5%;margin: 126% 0 0 109%;}
.web .brand .o12{width: 5%;margin: 131% 0 0 105%;}
/********* obj end **********/
/******************* brand end **********************/

/******************* gift start **********************/
.web .gift{
	position: relative;
	margin-top:5%;
}

.web .gift .info{
	position: relative;
	margin-top:-2.3%;
	aspect-ratio:2.05;
	background: #eef2e1;
	border-radius:0 3em;
}

.web .gift ul{
	position: absolute;
	left:0;
	top:0;
	margin-top:2%;
	width:100%;
	z-index: 1;
}

/********* txt start *********/
.web .gift .txt{
	display: flex;
	flex-direction: column;
	align-items: center;
	transition: transform 1s;
}
.web .gift li:not(.slick-center) .txt{
	transform:translateY(2.1em);
}

.web .gift .txt > em{
	position: relative;
	font-style: normal;
}
.web .gift .txt > em span{
	color:var(--color4);
	font-family:'EB Garamond';
}
.web .gift .txt > em span strong{
	font-weight:500;
	font-size: 2.2em;
}
.web .gift .txt > em i{
	position: absolute;
	left:0;
	top:0;
	margin-top:-0.25em;
	color:#FF0004;
	font-style: normal;
}

.web .gift .txt .tail{
	margin-top:0.5em;
}
.web .gift .txt .tail i{
	position: absolute;
	left:0;
	top:0;
	transform: translate(-50%, -50%);
	width:1.8em;
	line-height: 1em;
	aspect-ratio:1;
	border-radius:50%;
	color:#FFF;
	font-style: normal;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background: var(--color1);
}
.web .gift .txt .tail span{
	line-height: 1.2em;
}
.web .gift .txt .tail span em{
	color: var(--color);
	font-style: normal;
}
.web .gift .txt .tail span .model{
	position: absolute;
	left:50%;
	top:calc(100% + 0.6em);
	transform: translateX(-50%);
}
/********* txt end *********/

.web .gift .img{
	position: relative;
	margin-top:5em;
}

.web .gift .img:before,
.web .gift .img:after{
	position: absolute;
	left:0;
	top:0;
	content: "";
	display: block;
}

/********* bg start *********/
.web .gift .img:before{
	width:70%;
	aspect-ratio:4.08;
	margin:60% 0 0 15%;
	background: #cae4a7;
	transition: background 0.5s;
	border-radius:50%;
}
.web .gift .slick-center .img:before{
	background: #FFF;
}
/********* bg end *********/

/********* 圓標 start *********/
.web .gift .img em{
	position: absolute;
	width:23.25%;
	aspect-ratio:1;
	right:1.62%;
	top:0;
	transform: translateY(-50%);
	display: flex;
	justify-content: center;
	align-items: center;
	color:#FFF;
	background: var(--color1);
	font-size: 0.8em;
	font-style: normal;
	line-height: 1.2em;
	text-align: center;
	border-radius:50%;
	opacity: 0;
	transition: opacity 0.5s;
	z-index: 0;
}
.web .gift .slick-center .img em{
	opacity: 1;
}
.web .gift .img em i{
	font-size: 1.5em;
	font-style: normal;
	color:var(--color3);
}
/********* 圓標 end *********/

/********* 商品圖 start *********/
.web .gift img{
	position: relative;
	display: block;
	width:100%;
	z-index: 2;
}
.web .gift img.reveal{
	position: absolute;
	left:0;
	top:0;
	opacity:0;
	transition: opacity 0.5s;
	z-index: 3;
}
.web .gift .slick-center img{
	opacity:0;
}
.web .gift .slick-center img.reveal{
	opacity:1;
}
/********* 商品圖 end *********/

/********* deco start *********/
.web .gift .img:after{
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	z-index: 4;
}
.web .gift .g1 .img:after{
	margin: 64.81% 0 0 58.51%;
	width:36.04%;
	aspect-ratio:2.4;
	background-image: url(../images/obj_bird.png);
}
.web .gift .g2 .img:after{
	margin: 48.58% 0 0 74.09%;
	width: 15.09%;
	aspect-ratio:0.49;
	background-image: url(../images/obj_soldier.png);
}
.web .gift .g3 .img:after{
	margin: 52.86% 0 0 71.44%;
	width: 23.81%;
	aspect-ratio:0.97;
	background-image: url(../images/obj_dog.png);
}
.web .gift .g4 .img:after{
	margin: 36.86% 0 0 62.44%;
	width: 24.81%;
	aspect-ratio:0.59;
	background-image: url(../images/obj_cabinet.png);
}
/********* deco end *********/

/********* 箭頭 start *********/
.web .slick .PN{
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	cursor:pointer;
	text-indent: -9999px;
	overflow:hidden;
	width:3.87%;
	aspect-ratio:1;
	border-radius:50%;
	background: #FFF;
	z-index: 1;
	transition: all 0.2s;
}
.web .slick .prev{
	left:29.06%;
	transform: translateY(-50%) scaleX(-1);
}
.web .slick .next{
	right:29.06%;
}
.web .slick .PN:before{
	position: absolute;
	left:50%;
	top:50%;
	content:"";
	display:block;
	width:28%;
	aspect-ratio:1;
	color:currentColor;
	border:0.15em solid;
	border-top:none;
	border-left:none;
	transform: translate(-70%, -50%) rotate(-45deg);
	transition: transform 0.2s;
}
.web .slick .PN:hover{
	background:var(--color1);
}
.web .slick .PN:hover:before{
	color:#FFF;
	transform: translate(-45%, -50%) rotate(-45deg);
}
/********* 箭頭 end *********/

/********* obj start **********/
.web .gift .o1{width: 5%;margin: 19% 0 0 -14%;}
.web .gift .o2{width: 28%;margin: 15% 0 0 98%;}
.web .gift .obj{
	z-index: 1;
}
/********* obj end **********/
/******************* gift end **********************/

/******************* member start **********************/
.web .member{
	position: relative;
	margin-top:8%;
}

/********* attBlock start *********/
.web .member .attBlock{
	display: inline-block;
	margin-left:1em;
}
.web .member .attBlock .txt{
	display:none;
}

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

/********* 內容 start *********/
.web .member .info{
	width:92.3%;
	aspect-ratio:2.22;
	margin:2% auto 0;
	background: url(../images/memberBg.svg) no-repeat center/contain;
}

.web .member .info ul{
	position: relative;
	height:100%;
}

.web .member .info li{
	position: absolute;
	left:0;
	top:0;
	width:52%;
	aspect-ratio:2.713;
}
.web .member .info li:nth-child(1){margin: 21.08% 0 0 9.66%;}
.web .member .info li:nth-child(2){margin: 3.83% 0 0 39.5%;}
.web .member .info li:hover{
	z-index: 1;
}
.web .member a{
	display: block;
	height:100%;
	color:#f7f19b;
	transition: transform 0.5s;
}
.web .member .info li:hover a{
	transform: scale(1.05);
}
.web .member .ticket{
	height:inherit;
	padding:2.5% 0 0 30%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.web .member .info li:nth-child(1) .ticket{
	transform: rotate(-5deg);
	background-image: url(../images/webMemberTicket1.svg);
	animation:ticketFloat 3s ease-in-out alternate infinite, ticketFlash 0.5s ease-in alternate infinite;
}
.web .member .info li:nth-child(2) .ticket{
	transform: rotate(4deg);
	background-image: url(../images/webMemberTicket2.svg);
	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: 3.3em;
	letter-spacing: -0.04em;
	animation:ticketNumber 1s ease-in alternate infinite;
}
.web .member ul li:nth-child(2) .ticket span{
	animation-delay:0.33s;
}
@keyframes ticketNumber{
	to{
		color:#FFF;
		filter:drop-shadow(0 0 0.1em #FFF);
	}
}
.web .member .ticket span strong{
	display: inline-block;
	transform: translateY(0.05em);
	font-family: 'EB Garamond';
	font-size: 2em;
	font-weight:500;
}
/********* 內容 end *********/

/********* obj start **********/
.web .member .o1{width: 12%;margin: -4% 0 0 -14%;}
.web .member .o2{width: 20%;margin: 35% 0 0 -10%;}
.web .member .o3{width: 4%;margin: 50% 0 0 5%;}
.web .member .o4{width: 4%;margin: 47% 0 0 20%;}
.web .member .o5{width: 4%;margin: 50% 0 0 26%;}
.web .member .o6{width: 4%;margin: -1% 0 0 111%;}
.web .member .o7{width: 4%;margin: 5% 0 0 107%;}
.web .member .o8{width: 11.3%;margin: -13% 0 0 91%;}
.web .member .o9{width: 8%;margin: 24% 0 0 97%;}
.web .member .o10{width: 15%;margin: 38% 0 0 76%;}
.web .member .obj{
	z-index: 1;
}
/********* obj end **********/
/******************* member end **********************/
/****************************************** web end ************************************************/

/****************************************** store start ************************************************/
.store{
	position: relative;
	padding:3.68% 0 7.89%;
	background: linear-gradient(to bottom, #f8d0ac, #e6b3bb 100%);
}

/******************* sectionTitle start **********************/
.store .sectionTitle{
	position: relative;
	width:68.42%;
	margin:0 auto;
}
.store .sectionTitle strong{
	background-image: url(../images/storeTitle.svg);
}
.store .sectionTitle .o1{
	position: absolute;
	width: 4%;
	margin: 2% 0 0 29%;
}
/******************* sectionTitle end **********************/

.store .ctWrapper{
	margin-top:5.26%;
}

.store .tab,
.store .period,
.store .ctaBlock{
	width:63.15%;
	margin:0 auto;
}
.store .tab,
.store .ctaBlock{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

/******************* tab start **********************/
.store .tab li{
	width:50%;
	line-height: 1em;
	padding-bottom:0.8em;
	border-bottom:0.45em solid #FFF;
	text-align: center;
	transition: border-color 0.2s;
	cursor: pointer;
}
.store .tab li:hover{ border-color:#c9dacb;}
.store .tab li.active{	border-color:var(--color1);}
.store .tab li strong{
	font-size:1.4em;
}

.store .tab li strong.marker{
	position: relative;
	display: inline-block;
}
.store .tab li strong.marker:before{
	position: absolute;
	content:"";
	display: none;
	left:-3.1em;
	bottom:-0.2em;
	width:1.3em;
	aspect-ratio:0.83;
	background: url(../images/storeMarker.svg) no-repeat center/100%;
}
.store .tab li.active strong.marker:before{
	display: block;
}
/******************* tab end **********************/

/******************* tabCTWrapper start **********************/
.store .tabCTWrapper{
	margin-top:1.5%;
}

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

/********* period start ********/
.store .period{
	display: flex;
	align-items: center;
}

.store .period h5{
	font-size:2.375em;
	font-weight: 600;
	white-space: nowrap;
}
.store .period h5 i{
	font-size:0.5em;
	font-weight: normal;
	font-style: normal;
}
.store .period h5 em{
	font-size:0.4em;
	font-style: normal;
	font-weight: bold;
	font-family: sans-serif;
	color:var(--color);
	background: var(--color2);
	padding-bottom: 0.2em;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width:1.65em;
	aspect-ratio:1;
	border-radius:50%;
	transform: translateY(-20%);
}

.store .period .tail{
	font-size:1.5em;
	margin-left:0.8em;
}
/********* period end ********/

/********* eventBlock start ********/
.store .eventBlock{
	margin-top:2em;
}

.store .eventWrapper{
	position: relative;
	display: flex;
}

.store .tabCT:nth-child(1) .eventWrapper{
	/*width: 2185px*/
	width:115%;
	aspect-ratio:4.37;
}
.store .tabCT:nth-child(2) .eventWrapper{
	/*width: 1771px*/
	width:93.21%;
}
.store .eventWrapper:before,
.store .eventWrapper:after{
	content:"";
	display:block;
}
.store .eventWrapper:before{
	flex-shrink: 0;
}
.store .eventWrapper:after{
	position: absolute;
	left:0;
	top:0;
	translate:0 -7.4%;
	aspect-ratio:0.56;
	background:url(../images/storeWoman.png) no-repeat center/100%;
}
.store .tabCT:nth-child(1) .eventWrapper:before,
.store .tabCT:nth-child(1) .eventWrapper:after{
	width:16.01%;
}
.store .tabCT:nth-child(2) .eventWrapper:before,
.store .tabCT:nth-child(2) .eventWrapper:after{
	width:19.76%;
}

/**** event start ****/
.store .event{
	position: relative;
	aspect-ratio:0.78;
}
.store .event+.event{
	margin-left:0.68%;
}

.store .event:before{
	position: absolute;
	display: block;
	font-size: 4em;
	font-weight: 600;
	line-height: 1em;
	color:var(--color1);
	right:0.3em;
	top:-0.3em;
}
.store .e1:before{ content:"1";}
.store .e2:before{ content:"2";}
.store .e3:before{ content:"3";}
.store .e4:before{ content:"4";}

.store .rule{
	height:100%;
	border-radius:0 3em;
	border-bottom-left-radius:2em;
	overflow: hidden;
	background: #FFF;
	display:flex;
	flex-direction: column;
}

.store .detail{
	flex-grow:1;
	padding:1.8em 2em 0;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.store .detail em,
.store .detail strong{
	color:var(--color2);
}
.store .detail em{
	font-style: normal;
}
.store .detail strong{
	font-size: 2em;
	font-weight:500;
}
.store .detail h6{
	text-align: center;
	line-height: 1.8em;
	font-size: 1.2em;
}
.store .e1 .detail h6 strong,
.store .e2 .detail h6 strong,
.store .e3 .detail h6 ~ * strong,
.store .e4 .detail h6 ~ * strong{
	font-family:'EB Garamond';
}
.store .e3 .detail h6 strong,
.store .e4 .detail h6 strong{
	font-size: 1.2em;
	font-weight:700;
}

.store .e1 .detail ul,
.store .e2 .detail ul{
	font-family: Poppins;
	font-weight: normal;
	list-style: disc;
	margin-top:1.5em;
}
.store .e1 .detail li,
.store .e2 .detail li{
	margin-bottom:0.25em;
}

.store .detail p{
	font-weight:bold;
	line-height: 2em;
	margin:0;
}

.store .e2 .detail{
	background: url(../images/storeE2Btm.png) no-repeat right 40% bottom/60%;
}
.store .e2 .detail ul{
	display:flex;
	flex-wrap: wrap;
	width:85%;
}
.store .e2 .detail li{
	flex-shrink: 0;
}
.store .e2 .detail li:nth-child(odd){
	width:69%;
}

.store .e3{
	aspect-ratio:1.24;
}
.store .e3 .tail{
	margin-top:1.5em;
	align-self: flex-start;
}
.store .e3 .groupWrapper{
	margin-top:1em;
	width:100%;
	display: flex;
}
.store .e3 .groupWrapper p{
	margin:0;
	white-space: nowrap;
}
.store .e3 .groupWrapper p i{
	font-style: normal;
	font-size: 0.8em;
}
.store .e3 .groupWrapper ul{
	border-left:1px solid;
	margin-left:0.9em;
	padding-left:0.9em;
}
.store .e3 .groupWrapper li+li{
	margin-top:0.5em;
}
.store .e3 .groupWrapper li strong{
	line-height: 1em;
}
.store .e3 .groupWrapper li div{
	display: flex;
	align-items: flex-start;
	margin-top:0.25em;
}
.store .e3 .groupWrapper li div i{
	font-size: 0.85em;
	width:1.8em;
	aspect-ratio:1;
	flex-shrink: 0;
	border-radius:50%;
	color:#FFF;
	background: var(--color2);
	padding:0.35em 0 0;
	font-style: normal;
	text-align: center;
	line-height: 1em;
}
.store .e3 .groupWrapper li div span{
	font-style: normal;
	line-height: 1.4em;
	margin-left:0.5em;
}

.store .e4 .detail{
	background: url(../images/obj_man3.png) no-repeat center bottom/85%;
}
.store .e4 .tail{
	margin-top:1.5em;
}
.store .e4 .tail span{
	padding-left:2em;
	padding-right:2em;
}
.store .e4 p{
	margin-top:1.5em;
}

.store .note{
	text-align: center;
	font-size: 0.9em;
	line-height: 1.2em;
	padding:0.3em 0.5em 0.45em;
	color:#FFF;
	background: var(--color1);
	font-weight:500;
}
.store .note strong{
	font-family: 'EB Garamond', 'Noto Serif TC';
	font-size: 1.2em;
	font-weight:inherit;
}
.store .note em{
	font-style: normal;
	font-weight:inherit;
	color:var(--color3);
}
/**** event end ****/

/**** product start ****/
.store .product{
	flex-grow:1;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}

.store .product li{
	width:24.2%;
}
.store .product li:nth-child(n+5){
	margin-top:1.05%;
}
.store .product li a{
	display: block;
	color: #FFF;
	background: var(--color1);
	border-radius:0 2em;
	overflow: hidden;
}
.store .product li .img{
	overflow: hidden;
}
.store .product li img{
	display: block;
	width:100%;
	transition: scale 0.5s;
}
.store .product li a:hover img{
	scale:1.05;
}
.store .product li span{
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-size: 0.9em;
	font-weight: 500;
	line-height: 1em;
	padding: 0.8em 0.5em 0.9em;
}
/**** product end ****/
/********* eventBlock end ********/

/********* ctaBlock start ********/
.store .ctaBlock{
	margin-top:2em;
}

.store .ctaBlock .tail{
	font-size:1.2em;
	margin-left:1em;
	order:1;
}

.store .ctaBlock .ps .tel{
	font-weight: normal;
	transition: color 0.2s;
	display: inline-flex;
	align-items: center;
}
.store .ctaBlock .ps .tel:before{
	content:"";
	display: block;
	width:1.2em;
	aspect-ratio:1;
	background: url(../images/tel.svg) no-repeat center/100%;
}
.store .ctaBlock .ps .tel:hover{
	color:var(--color1);
	text-decoration: underline;
}

.store .ctaBlock .ps ol{
	list-style: decimal;
	margin-top:0.25em;
	padding-left:1.2em;
}
.store .ctaBlock .ps li+li{
	margin-top:0.25em;
}
/********* ctaBlock end ********/
/******************* tabCTWrapper 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);
	}
	
	/************************************** 其它共用 start ***************************************************/
	/***************** sectionTitle start ************************/
	.sectionTitle strong{
		width:50%;
	}
	/***************** sectionTitle end ************************/
	
	/***************** overlay start ************************/
	.overlay.midSummer {
		font-size: 1em;
	}
	.overlay.midSummer .overlayCT {
		padding: 3em 1em;
	}

	.overlay.midSummer .closeBtn {
		right: 1em;
		top:1em;
		width: 20px;
		height: 20px;
	}
	.overlay.midSummer .closeBtn:before,
	.overlay.midSummer .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: 80%;
		margin: 13% 0 0 10%;
	}
	/******************* 主標 end ********************/

	.kvBlock .cloud.c1{margin-top: 119.94%;}
	.kvBlock .cloud.c2{width: 16%;margin: 48% 0 0 15%;}
	.kvBlock .cloud.c3{width: 24%;margin: 20% 0 0 85%;}
	.kvBlock .bird.b1{width: 2.5%;margin: 54% 0 0 76%;}
	.kvBlock .bird.b2{width: 4%;margin: 57% 0 0 80%;}
	.kvBlock .bird.b3{width: 3%;margin: 56% 0 0 85%;}
	.kvBlock .man1{width: 19%;margin: 123% 0 0 1%;}
	.kvBlock .man2{width: 12%;margin: 131% 0 0 21%;}
	.kvBlock .man3{width: 82%;margin: 125% 0 0 53%;}
	.kvBlock .man4,
	.kvBlock .cat,
	.kvBlock .flower{display: none;}
	.kvBlock .tree{width: 68%;margin: 54% 0 0 9%;}

	.home .txt{
		font-size: 0.75em;
		padding:5% 1em 15%; 
	}
	.home .txt .f1{width: 8%;margin: 2% 0 0 3%;}
	.home .txt .f2{width: 7%;margin: 39% 0 0 78%;}
	.home .txt .f3{width: 7%;margin: 35% 0 0 88%;}
	/****************************************** home end ************************************************/
	
	/****************************************** web start ************************************************/
	.web{
		padding:10% 0 20%;
	}

	.web .CT{
		width:95%;
	}

	/******************* sectionTitle start **********************/
	/********* 日期 start **********/
	.web .sectionTitle span{
		font-size: 1.5em;
		width:60%;
		margin-top:3.5%;
		padding-top:3.5%;
	}
	/********* 日期 end **********/
	
	/********* obj start **********/
	.web .sectionTitle .o1{width: 20%;margin: -4% 0 0 0%;}
	.web .sectionTitle .o2{width: 19%;margin: -4% 0 0 83%;}
	.web .sectionTitle .o3{width: 6%;margin: 13% 0 0 12%;}
	.web .sectionTitle .o4{width: 7.5%;margin: 25% 0 0 84%;}
	/********* obj end **********/
	/******************* sectionTitle end **********************/

	/******************* 白底次標 start **********************/
	.web h4.tail{
		font-size: 1.1em;
	}
	/******************* 白底次標 end **********************/

	/******************* overlay 按鈕 start **********************/
	.web button{
		font-size: 0.8em;
		padding-top:0.5em;
	}
	/******************* overlay 按鈕 end **********************/

	/******************* discount start **********************/
	.web .discount{
		margin-top:10%;
	}

	/********* example start *********/
	.web .discount .example{
		margin-left:0.5em;
	}
	/********* example end *********/

	.web .discount .info{
		margin-top:5%;
	}

	.web .discount ul{
		font-size:0.86em;
		display: block;
	}
	.web .discount li{
		width:auto;
	}
	.web .discount li+li{
		margin-top:5%;
	}
	
	/********* obj start **********/
	.web .discount .obj{display: none;}
	/********* obj end **********/
	/******************* discount end **********************/

	/******************* brand start **********************/
	.web .brand{
		margin-top:15%;
	}
	
	.web .brand > em{
		font-size: 0.7em;
        margin-left: 0.5em;
	}

	.web .brand .info{
		margin-top:10%;
		padding-top:5%;
	}
	
	.web .brand ul{
		padding:0 8% 8%;
		flex-wrap:wrap;
		justify-content: space-between;
		aspect-ratio:auto;
	}
	.web .brand ul+ul{
		margin-top:0;
	}
	.web .brand ul:nth-child(odd){
		background:
			url(../images/webBrandBg1.svg) no-repeat left 35%/100%,
			url(../images/webBrandBg1.svg) no-repeat left 95%/100%
		;
	}
	.web .brand ul:nth-child(even){
		background:
			url(../images/webBrandBg2.svg) no-repeat left 35%/100%,
			url(../images/webBrandBg2.svg) no-repeat left 95%/100%
		;
	}

	.web .brand li{
		width:45%;
	}
	.web .brand li+li{
		margin-left:0;
	}
	.web .brand li:nth-child(n+3){
		margin-top:10%;
	}

	/******** tag start ********/
	.web .brand a em{
		font-size: 0.85em;
	}
	/******** tag end ********/

	/******** logo start ********/	
	.web .brand .artek{width: 40%;}
	.web .brand .vitra{width: 38%;}
	.web .brand .maruni{width: 42%;}
	.web .brand .magis{width: 40%;}
	.web .brand .anglepoise{ width:75.76%;}
	.web .brand .e15{width: 23%;}
	.web .brand .string{width: 50%;}
	.web .brand .moooi{width: 48%;}
	.web .brand .bd{width: 24%;}
	.web .brand .form{width: 60%;}
	.web .brand .maruni60{width: 25%;}
	.web .brand .vdm{width: 32%;}
	.web .brand .moln{width: 46%;}
	.web .brand .holme{width: 28%;}
	.web .brand .rosendahl{width: 68%;}
	.web .brand .gj{width: 55%;}
	/******** logo end ********/
	
	/********* obj start **********/
	.web .brand .obj{display: none;}
	/********* obj end **********/
	/******************* brand end **********************/

	/******************* gift start **********************/
	.web .gift{
		margin-top:15%;
	}

	.web .gift .info{
		font-size: 0.92em;
		padding:8% 5% 5%;
		aspect-ratio:auto;
		border-radius:0 1.5em;
	}
	
	.web .gift ul{
		position: relative;
		margin:0;
		width:auto;
	}

	/********* 箭頭 start *********/
	.web .slick .PN{
		width:10%;
	}
	.web .slick .prev{
		left:-4%;
	}
	.web .slick .next{
		right:-4%;
	}
	/********* 箭頭 end *********/
	
	/********* obj start **********/
	.web .gift .obj{display: none;}
	/********* obj end **********/
	/******************* gift end **********************/

	/******************* member start **********************/
	.web .member{
		margin-top:15%;
	}

	/********* 內容 start *********/
	.web .member .info{
		width:auto;
		aspect-ratio:1.5;
		margin-top:10%;
	}

	.web .member .info li{
		width:80%;
		font-size:clamp(10px, 4.21vw, 48px);
	}
	.web .member .info li:nth-child(1){margin: 7.08% 0 0 2.66%;}
	.web .member .info li:nth-child(2){margin: 33.83% 0 0 16.5%;}
	.web .member .ticket span{
		font-size: 1.8em;
	}
	/********* 內容 end *********/

	/********* obj start **********/
	.web .member .o1{display: none;}
	.web .member .o2{margin: 81% 0 0 1%;}
	.web .member .o3{width: 6%;margin: 98% 0 0 18%;}
	.web .member .o4{width: 6%;margin: 93% 0 0 26%;}
	.web .member .o5{width: 6%;margin: 95% 0 0 39%;}
	.web .member .o6,
	.web .member .o7,
	.web .member .o8{display: none;}
	.web .member .o9{width: 11%;margin: 9% 0 0 88%;}
	.web .member .o10{width: 21%;margin: 87% 0 0 78%;}
	/********* obj end **********/
	/******************* member end **********************/
	/****************************************** web end ************************************************/
	
	/****************************************** store start ************************************************/
	.store{
		padding:15% 0;
	}
	
	.store .CT{
		width:95%;
		margin:0 auto;
	}

	/******************* sectionTitle start **********************/
	.store .sectionTitle{
		width:auto;
	}
	.store .sectionTitle strong{
		width:50%;
	}
	.store .sectionTitle .o1{
		width: 6%;
		margin: 4% 0 0 12%;
	}
	/******************* sectionTitle end **********************/

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

	.store .tab,
	.store .period,
	.store .ctaBlock{
		width:auto;
	}

	/******************* tab start **********************/
	.store .tab li{
		font-size:0.65em;
	}
	.store .tab li:nth-child(1){ width:40%;}
	.store .tab li:nth-child(2){ flex-grow:1;}
	/******************* tab end **********************/

	/******************* tabCTWrapper start **********************/
	.store .tabCTWrapper{
		margin-top:5%;
	}

	/********* period start ********/
	.store .period h5{
		font-size:2em;
	}

	.store .period .tail{
		font-size:0.9em;
		margin-top:0.5em;
	}
	/********* period end ********/

	/********* eventBlock start ********/
	.store .eventBlock{
		overflow:auto;
		margin-top: 1em;
		padding:0.5em 0;
	}
	
	.store .eventWrapper:before,
	.store .eventWrapper:after{
		display:none;
	}
	.store .tabCT:nth-child(1) .eventWrapper{
		width:auto;
		aspect-ratio:3.66;
		height:360px;
	}
	.store .tabCT:nth-child(2) .eventWrapper{
		width:auto;
	}

	/**** event start ****/
	.store .event{
		font-size:0.9em;
	}
	
	.store .e1 .detail ul,
	.store .e2 .detail ul{
		font-size: 0.9em;
	}
	
	.store .e3 .groupWrapper{
		font-size: 0.9em;
	}
	/**** event end ****/
	
	/**** product start ****/
	.store .product{
		font-size:0.9em;
	}
	
	.store .product li{
		width:48%;
	}
	.store .product li:nth-child(n+3){
		margin-top:4%;
	}
	.store .product li a{
		border-radius:0 1.2em;
	}
	.store .product li span{
		font-size: 0.65em;
		line-height: 1.4em;
		padding: 0.5em;
		height:3.5em;
	}
	/**** product end ****/
	/********* eventBlock end ********/

	/********* ctaBlock start ********/
	.store .ctaBlock{
		display: block;
		margin-top:1.5em;
	}

	.store .ctaBlock .tail{
		font-size:1em;
		float:right;
		margin-left:1em;
	}
	
	.store .ctaBlock .ps{
		font-size: 0.7em;
	}
	/********* ctaBlock end ********/
	/******************* tabCTWrapper end **********************/
	/****************************************** store end ************************************************/

}