@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&family=Noto+Sans+TC:wght@400;500;600;700&display=swap');


html.disableScroll{
	overflow:hidden;
}

body{
	--color:#5e5e5e;
	--color1:#f6f29b;
	--color2:#ee8989;
	--color3:#5cbeb5;
	--color4:#30998c;
}

.mainContainer{
	max-width:1920px;
	overflow:hidden;
}

.midBlock,
.themeMain{
	display:none;
}

.themeEventContainer{
	font-family: Roboto, 'Noto Sans TC', sans-serif, 微軟正黑體;
	font-weight:500;
	font-size:clamp(10px, 1.05vw, 20px);
	color:var(--color);
	background: var(--color3);
}

/************************************** 其它共用 start ***************************************************/
.themeEventContainer a:hover{
	color:currentColor;
}

/***************** obj start ************************/
.obj{
	position: absolute;
	left:0;
	top:0;
}

.flower:before{
	content:"";
	display: block;
	aspect-ratio:1.21;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	background-repeat:no-repeat;
	background-position: center;
	background-size: 100%;
	background-image: url(../images/flower.svg);
}
.rotateL:before{
	animation-name:rotateL;
	animation-duration: 20s;
}
.rotateR:before{
	animation-name:rotateR;
	animation-duration: 10s;
}
@keyframes rotateL{
	to{
		transform: rotate(-360deg);
	}
}
@keyframes rotateR{
	to{
		transform: rotate(360deg);
	}
}
/***************** obj end ************************/

/***************** flash start ************************/
.flash{
	animation:flash 1s ease-in alternate infinite;
}
@keyframes flash{
	to{
		color:#ffabab;
		filter:drop-shadow(0 0 0.2em #FFF);
	}
}
.flash.delay1{ animation-delay:0.33s;}
.flash.delay2{ animation-delay:0.66s;}
.flash.delay3{ animation-delay:1s;}
/***************** flash end ************************/

/*************** sectionTitle start **********************/
.sectionTitle{
	position: relative;
	font-size:4.2em;
	font-weight: normal;
	line-height: 1em;
	color:#FFF;
	text-align: center;
}

.sectionTitle strong{
	font-weight: normal;
	letter-spacing: 0.1em;
	text-shadow: 0.07em 0.07em 0 var(--color4);
}
.sectionTitle strong span{
	display: inline-block;
}
.sectionTitle strong span:nth-child(even){
	transform: translateY(0.18em);
}
.sectionTitle em{
	display: block;
	font-style: normal;
	font-size: 0.7em;
	font-weight: 700;
	margin-top:0.2em;
}
.sectionTitle em span{
	font-size: 0.5em;
	display: inline-block;
	transform: scaleX(0.85);
}

.sectionTitle .o1,
.sectionTitle .o3{
	width:0.4em;
}
.sectionTitle .o1{margin: 19% 0 0 -26%;}
.sectionTitle .o2{
	width:0.575em;
	margin: 27% 0 0 105%;
}
.sectionTitle .o3{margin: 16% 0 0 125%;}
/*************** sectionTitle end **********************/

/***************** overlay start ************************/
.overlay.midSummer {
	font-size: 1.1em;
	font-family: Roboto, 'Noto Sans TC', sans-serif, 微軟正黑體;
	background: rgba(195, 215, 213, 0.9);
}

.overlay.midSummer .overlayCT {
	height: auto;
	max-width:1020px;
	max-height: none;
	color:#FFF;
	border:2px solid;
	border-radius: 2em;
	border-top-left-radius: 0;
	padding: 3em;
	background: url(../images/bgNoise2.jpg);
	box-shadow: 0 0.4em 0 0 var(--color1);
}

.overlay.midSummer .overlayCT h6{
	position: absolute;
	left:-2px;
	bottom:100%;
	font-size:1.1em;
	font-weight: normal;
	color:var(--color1);
	padding:1em 1em 0;
	line-height: 1em;
	border:2px solid #FFF;
	border-bottom:none;
	border-radius: 1em;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	background: url(../images/bgNoise2.jpg);
}

.overlay.midSummer .overlayCT ol{
	list-style: decimal;
	padding-left:1.2em;
}
.overlay.midSummer .overlayCT li+li{
	margin-top:0.5em;
}

.overlay.midSummer .closeBtn {
	right: 1.5em;
	top:1.5em;
	bottom: auto;
	width: 2em;
	aspect-ratio:1;
	transition: transform 0.2s;
}
.overlay.midSummer .closeBtn:hover {
	transform:rotate(-90deg);
}
.overlay.midSummer .closeBtn:before,
.overlay.midSummer .closeBtn:after {
	top: 50%;
	width: 110%;
	height:2px;
	background: var(--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(195, 215, 213, 0.9);
	width:0;
	height:100vh;
	font-size:1.05em;
	overflow:hidden;
	transition:all 0.2s;
}

.themeEventContainer header nav > ul{
	margin-top:5em;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.themeEventContainer header nav > ul li{
	border-bottom: 1px solid;
	width:4.2em;
}
.themeEventContainer header nav > ul li+li{
	margin-top:1em;
}

.themeEventContainer header nav a{
	display: block;
	padding:0.5em 0;
	line-height:1em;
	color:var(--color);
	transition:all 0.2s;
}
.themeEventContainer header nav > ul li:nth-child(1) a{
	font-size:1.35em;
}

.themeEventContainer header nav a:hover,
.themeEventContainer header nav li.active,
.themeEventContainer header nav li.active a{
	color:var(--color2);
	font-weight:600;
}


.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:#FFF;
}
.themeEventContainer header ._burgerBtn span:before,
.themeEventContainer header ._burgerBtn span:after{
	content:"";
	top:50%;
	transition:transform 0.2s;
}
.themeEventContainer header ._burgerBtn span{
	top:0;
	margin-top:27.77%;
	z-index:0;
}
.themeEventContainer header ._burgerBtn span:before{ transform:translateY(-350%);}
.themeEventContainer header ._burgerBtn span:after{ transform:translateY(250%);}
.themeEventContainer header ._burgerBtn:after{
	position:absolute;
	right:0;
	top:0;
	content:"";
	display:block;
	width:100%;
	padding-top:65%;
	opacity:0;
	z-index:2;
}
/********************** _burgerBtn end *************************/
/************************************** header end ***************************************************/

.sectionContainer{
	position: relative;
	z-index: 0;
}

/****************************************** home start ************************************************/
.home{
	overflow: hidden;
}

.home .CT{
	position: relative;
	display: flex;
	flex-wrap: wrap;
	margin-top:-7.5%;
}

/******************** 標題 start *********************/
.home hgroup{
	position: absolute;
	left:0;
	top:0;
	width:35%;
	aspect-ratio:3.12;
	margin:8.5% 0 0 5.73%;
	z-index: 2;
}
.home hgroup h2{
	position: absolute;
	left:0;
	bottom:0;
	width:33.25%;
	aspect-ratio:2.39;
	font-size:0;
	background:url(../images/homeTitleTag.svg) no-repeat center/100%;
	z-index: 1;
}
.home hgroup h3{
	position: relative;
	height:100%;
	font-size: 1em;
}
.home hgroup h3 span,
.home hgroup h3 span:before,
.home hgroup h3 span:after{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	display: block;
}
.home hgroup h3 span{
	text-indent: 100%;
	overflow: hidden;
}
.home hgroup h3 span:before,
.home hgroup h3 span:after{
	content:"";
	background-repeat: no-repeat;
	background-size: 100%;
}
.home hgroup h3 span:after{
	background-position-y: bottom;
	animation:homeTitle 1s ease-in alternate infinite;
}
@keyframes homeTitle{
	to{
		filter:drop-shadow(0 0 0.25em rgba(255, 255, 255, 1));
	}
}
.home hgroup h3 span:nth-child(1):before,
.home hgroup h3 span:nth-child(1):after{ background-image: url(../images/homeTitle1.svg);}
.home hgroup h3 span:nth-child(2):before,
.home hgroup h3 span:nth-child(2):after{ background-image: url(../images/homeTitle2.svg);}
.home hgroup h3 span:nth-child(3):before,
.home hgroup h3 span:nth-child(3):after{ background-image: url(../images/homeTitle3.svg);}
.home hgroup h3 span:nth-child(1):after{ animation-delay:0s;}
.home hgroup h3 span:nth-child(2):after{ animation-delay:0.5s;}
.home hgroup h3 span:nth-child(3):after{ animation-delay:1s;}
/******************** 標題 end *********************/

/******************** KV start *********************/
.home ul{
	position: relative;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100.1%;
}

.home .L{
	width:55.89%;
	aspect-ratio:0.9398;
	background-image: url(../images/homeBgL.jpg);
	z-index: 1;
}
.home .L:before,
.home .L:after{
	position: absolute;
	left:0;
	top:0;
	content:"";
	display: block;
	pointer-events: none;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	z-index: 0;
}
.home .L:before{
	width:4.33%;
	aspect-ratio:1.64;
	margin:44.63% 0 0 39.17%;
	background-image: url(../images/cloud.svg);
	animation:homeCloud 3s ease-in-out alternate infinite;
}
@keyframes homeCloud{
	to{
		transform: translateX(75%);
	}
}
.home .L:after{
	width:15.63%;
	aspect-ratio:2.12;
	margin:58% 0 0 87.09%;
	background-image: url(../images/flowerRing.svg);
}

.home .R{
	width:44.11%;
	aspect-ratio:0.7415;
	background-image: url(../images/homeBgR.jpg);
}

.home li{
	font-size: 0.9em;
	z-index: 1;
}

.home li .img{
	height: 100%;
	cursor: pointer;
	animation:homeLiHint 1s ease-in alternate infinite both;
}
@keyframes homeLiHint{
	to{
		transform: scale(1.1);
		filter:drop-shadow(0 0 0.5em var(--color1));
	}
}
@keyframes homeLiHint2{
	to{
		filter:drop-shadow(0 0 0.5em var(--color1));
	}
}
.home li .img:hover,
.home li.active .img{
	animation:none;
	transform: scale(1.1);
	filter:drop-shadow(0 0 0.5em var(--color1));
}
.home li .img:before{
	content:"";
	display: block;
	height:100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}

.home li a{
	--bdr-radius:0.35em;
	position: absolute;
	white-space: nowrap;
	line-height: 1em;
	transform: scale(0);
	transition: all 0.2s;
}
.home li.ctaL a{ transform-origin: right center;}
.home li.ctaR a{ transform-origin: left center;}
.home li.active a{
	transform: none;
}
.home li.active a:hover{
	filter:drop-shadow(0 0 0.5em var(--color1));
}
.home li a em{
	position: relative;
	display: block;
	color:var(--color4);
	background: #FFF;
	border:1px solid;
	border-radius:var(--bdr-radius);
	font-style: normal;
	padding:0.35em 0.45em 0.25em;
	z-index: 1;
}
.home li a span{
	position: absolute;
	top:100%;
	margin-top:-0.2em;
	display: flex;
	align-items: center;
	color:#FFF;
	background: var(--color4);
	border-radius:var(--bdr-radius);
	padding:0.45em 0.45em 0.35em;
}

.home li.ctaL a span{ right:0; margin-right:-1.2em;}
.home li.ctaR a span{ left:0; margin-left:-1.2em;}
.home li a span:after{
	content:"";
	display: block;
	border:0.3em solid transparent;
	border-right:none;
	border-left-color:currentColor;
	border-left-width:0.4em;
	margin-left:0.25em;
}

.home .light1{ width:14.31%; aspect-ratio:0.77; margin:40.01% 0 0 10.16%;}
.home .light1 .img{animation-delay: 0s;}
.home .light1 .img:before{ background-image: url(../images/homeLight1.svg);}
.home .light1 a{ left:100%;	top:40%;}
.home .sofa1{ width:13.37%; aspect-ratio:1.04; margin:45.85% 0 0 52.07%;}
.home .sofa1 .img{animation-delay: 0.33s;}
.home .sofa1 .img:before{ background-image: url(../images/homeSofa1.svg);}
.home .sofa1 a{ right:125%;	top:30%;}
.home .whale{width:14.87%;aspect-ratio:2.92;margin: 45% 0 0 71%;}
.home .whale .img{animation-delay: 0.45s;}
.home .whale .img:before{ background-image: url(../images/homeWhale.svg); animation:homeWhale 2s ease-in-out alternate infinite;}
@keyframes homeWhale{
	to{
		transform: translateY(-20%);
	}
}
.home .whale a{ left:0%; top:-120%;}
.home .sofa2{width:40.48%;aspect-ratio:3.07;margin: 73% 0 0 50%;}
.home .sofa2 .img{animation-delay: 0.55s;}
.home .sofa2 .img:before{ background-image: url(../images/homeSofa2.svg);}
.home .sofa2 a{right: 65%;top: -14%;}
.home .monkey{width:15.44%;aspect-ratio:0.65;margin: 54% 0 0 71%;}
.home .monkey .img{animation-name:homeLiHint2;}
.home .monkey .img:before{ background-image: url(../images/homeMonkey.svg); animation:homeMonkey 1.2s ease-in-out alternate infinite; transform-origin:20% top;}
@keyframes homeMonkey{
	from{
		transform: rotate(-2deg);
	}
	to{
		transform: rotate(2deg);
	}
}
.home .monkey a{ right:115%; top:40%;}
.home .light2{width:5.08%;aspect-ratio:0.675;margin: 81% 0 0 29%;}
.home .light2 .img{animation-delay: 0.95s;}
.home .light2 .img:before{ background-image: url(../images/homeLight2.svg);}
.home .light2 a{right:-100%;top: -90%;}
.home .light3{width:17.89%;aspect-ratio:0.36;margin: 4% 0 0 3%;}
.home .light3 .img{animation-name:homeLiHint2;}
.home .light3 .img:before{ background-image: url(../images/homeLight3.svg); animation:homeLight3 1s ease-in-out alternate infinite; transform-origin:center top;}
@keyframes homeLight3{
	from{
		transform: rotate(-1deg);
	}
	to{
		transform: rotate(1deg);
	}
}
.home .light3 a{ left:100%; top:60%;}
.home .elephant{width:18.61%;aspect-ratio:1.85;margin: 55% 0 0 8%;}
.home .elephant .img{animation-delay: 1.26s;}
.home .elephant .img:before{ background-image: url(../images/homeElephant.svg);}
.home .elephant a{left: 70%;top: -70%;}
.home .chair{width:17.18%;aspect-ratio: 0.81;margin: 86% 0 0 17%;}
.home .chair .img{animation-delay: 1.58s;}
.home .chair .img:before{ background-image: url(../images/homeChair.svg);}
.home .chair a{left: 0%;top: -30%;}
.home .light4{width:31.02%;aspect-ratio:2.82;margin: 90% 0 0 69%;}
.home .light4 .img{animation-delay: 1.87s;}
.home .light4 .img:before{ background-image: url(../images/homeLight4.svg);}
.home .light4 a{right: 90%;top: -85%;}
/******************** KV end *********************/

/******************** 前言 start *********************/
.home p{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	margin:50% 0 0;
	color:#FFF;
	line-height: 2em;
	letter-spacing: 0.1em;
	text-align: center;
	z-index: 3;
}
/******************** 前言 end *********************/

/******************** btm start *********************/
.home .btm{
	position: relative;
	width:100%;
	aspect-ratio:3.37;
	background: linear-gradient(to top, var(--color1), rgba(246, 242, 155, 0));
	overflow:hidden;
}
.home .btm:before,
.home .btm:after{
	position: absolute;
	left:50%;
	top:0;
	transform:translateX(-50%);
	content:"";
	display: block;
}
.home .btm:before{
	width:182.1%;
	aspect-ratio:1;
	border-radius:50%;
	background: var(--color3);
	margin-top:14.63%;
}
.home .btm:after{
	width:198.94%;
	aspect-ratio:3.63;
	background:url(../images/homeBtm.svg) no-repeat center/100%;
	margin-top:6.63%;
	transform-origin: center 181.73%;
	animation:homeBtm 36s linear infinite;
}
@keyframes homeBtm{
	from{
		transform: translateX(-50%) rotate(31deg);
	}
	to{
		transform: translateX(-50%) rotate(-28.8deg);
	}
}
/******************** btm end *********************/
/****************************************** home end ************************************************/

/****************************************** web start ************************************************/
.web .CT{
	--bg:#c3d7d5;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.web .sectionTitle{
	margin-top:-7%;
}
.web .sectionTitle strong span:nth-child(even){
	color:var(--color1);
}

/****************** 區塊標題 start *********************/
.web h4{
	display: flex;
	align-items: flex-start;
	width:6em;
	font-size: 2.3em;
	font-weight: 400;
	color:var(--color1);
}
.web h4 strong{
	font-size: 2.2em;
	font-weight: inherit;
	transform: skew(-10deg);
}
.web h4 em{
	display: inline-block;
	font-style: normal;
	font-weight: 700;
	transform: translateY(1.05em);
	line-height: 1.2em;
	margin-left:0.3em;
}
.web h4 em span{
	display: inline-block;
	transform: translateX(-0.5em);
}
/****************** 區塊標題 end *********************/

/****************** discount start *********************/
.web .discount{
	position: relative;
	width:100%;
	padding-top:4.73%;
}

.web .discount ._CT{
	position: relative;
	width:63.15%;
	margin:0 auto;
	z-index: 1;
}

/********* 內容 start *********/
.web .discount ul{
	position: relative;
	font-size: 1.2em;
	border-radius:1.4em;
	margin-top:2.8em;
	padding:2em;
	background: url(../images/bgNoise1.jpg);
	box-shadow: 0 0.35em 0 0 var(--color1);
}
.web .discount ul:before{
	position: absolute;
	content:"";
	display: block;
	right:0;
	top:0;
	width:12.5%;
	aspect-ratio:1.25;
	margin:-7.55% 6.16% 0 0;
	background: url(../images/webDiscountObj3.svg) no-repeat center/100%;
}
.web .discount li{
	display: flex;
	align-items: flex-end;
}
.web .discount li+li{
	margin-top:1em;
	padding-top:0.8em;
	border-top:1px solid;
}
.web .discount li h5{
	font-size:inherit;
	font-weight:600;
	width:14.6em;
	color:var(--color2);
}
.web .discount li h5 em{
	font-size:2em;
	font-style: normal;
	display: inline-block;
	transform: skewX(-10deg);
}
.web .discount li p{
	margin:0 0 0 0.5em;
	transform: translateY(-0.1em);
}
.web .discount li p strong{
	color:var(--color2);
	font-size: 1.5em;
}
/********* 內容 end *********/

/********* example start *********/
.web .discount .example{
	display: flex;
	justify-content: flex-end;
	margin-top:1em;
}
.web .discount .example button{
	border:none;
	padding:0;
	color:#FFF;
	background: none;
	font-family: inherit;
	font-size: 1em;
	cursor:pointer;
	transition: color 0.2s;
}
.web .discount .example button:hover{
	color:var(--color1);
}
.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-weight:normal;
	color:var(--color1);
}
/********* example end *********/

/********* obj start *********/
.web .discount .obj{
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.web .discount .o1{
	width:28.42%;
	aspect-ratio:0.96;
	margin-top:-4.21%;
	background-image: url(../images/webDiscountObj1.svg);
}
.web .discount .o2{
	width:13.68%;
	aspect-ratio:1.02;
	margin-left:81.57%;
	background-image: url(../images/webDiscountObj2.svg);
}
.web .discount .o2:before{
	position: absolute;
	content: "";
	display: block;
	left:0;
	top:0;
	width:26.92%;
	aspect-ratio: 1.64;
	margin:42.3% 0 0 50%;
	background: url(../images/cloud.svg) no-repeat center/100%;
	animation:cloud 3s ease-in-out alternate infinite;
}
@keyframes cloud{
	to{
		transform: translateX(-75%);
	}
}
/********* obj end *********/
/****************** discount end *********************/

/****************** brand start *********************/
.web .brand{
	position: relative;
	width:100%;
	padding-top:4.73%;
}

.web .brand h4{
	margin-left:18.42%;
}

.web .brand ._CT .obj{
	z-index: 0;
}

.web .brand .ctWrapper{
	position: relative;
	width:63.15%;
	margin:0 auto;
	z-index: 1;
}

/********* all start *********/
.all{
	position: relative;
	margin-top:6%;
	padding-bottom: 14.73%;
	background: var(--bg) url(../images/webBrandAllObj1.svg) no-repeat center top/100%;
}

.all .ctWrapper{
	color:#FFF;
}

.all p{
	position: absolute;
	left:0;
	bottom:100%;
	margin:0;
	font-size: 1.75em;
	letter-spacing: 0.1em;
}

.all ul{
	display: flex;
	flex-wrap: wrap;
}
.all li{
	width:20%;
	margin:8.33% 0 0 5.33%;
}
.all li:nth-child(4n+1){
	margin-left:0;
}

.all a{
	position: relative;
	display: block;
}
.all a > em{
	position: absolute;
	right:0;
	top:0;
	font-size:0.9em;
	font-style: normal;
	width:39.58%;
	aspect-ratio:1;
	line-height: 1.6em;
	border-radius: 50%;
	margin:-9.16% -18.33% 0 0;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--color2);
}
.all li:nth-child(5) a > em,
.all li:nth-child(6) a > em,
.all li:nth-child(7) a > em,
.all li:nth-child(8) a > em{
	background: var(--color3);
}
.all a > em i{
	color:var(--color1);
	font-style: normal;
	font-size: 2em;
}
.all a .img{
	position: relative;
	border-radius:50% / 40%;
	overflow: hidden;
	box-shadow: 0.3em 0.3em 0 0 var(--color1);
	transition: all 0.5s;
	z-index: 1;
}
.all a:hover .img{
	transform:scale(1.05);
	filter:drop-shadow(0 0 0.35em #FFF);
}
.all a img{
	display: block;
	width:100%;
	transition: filter 0.5s;
}
.all a:hover img{
	filter:contrast(120%);
}
.all a .img em{
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio:3;
	background: #FFF;
}

/*** logo start ***/
.all .logo{
	font-size: 0;
	display: block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	margin-top:-5%;
}
.all .artek{ width:39%; aspect-ratio:3.27;background-image: url(../images/logo_artek.svg);}
.all .vitra{ width:35%; aspect-ratio:3; background-image: url(../images/logo_vitra.svg);}
.all .magis{ width:41%; aspect-ratio:4.23; background-image: url(../images/logo_magis.svg);}
.all .moooi{ width:50%; aspect-ratio:5.25; background-image: url(../images/logo_moooi.svg);}
.all .finn{ width:45%; aspect-ratio:2.91; background-image: url(../images/logo_finn.svg);}
.all .maruni{ width:40%; aspect-ratio:5.14; background-image: url(../images/logo_maruni.svg);}
.all .anglepoise{ width:60%; aspect-ratio:11; background-image: url(../images/logo_anglepoise.svg);}
.all .e15{ width:20%; aspect-ratio:1.11; background-image: url(../images/logo_e15.svg);}
.all .string{ width:45%; aspect-ratio:2.85; background-image: url(../images/logo_string.svg);}
.all .gj{ width:45%; aspect-ratio:1.95; background-image: url(../images/logo_gj.svg);}
/*** logo end ***/

/*** obj start ***/
.all .obj{
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.all .o1{
	left:auto;
	right:0;
	width:65.57%;
	aspect-ratio:5.66;
	margin-top:34.78%;
	background-image: url(../images/webBrandAllObj2.svg);
}
.all .o2{
	width:56.84%;
	aspect-ratio:3.1;
	margin-top:51.05%;
	background-image: url(../images/webBrandAllObj3.svg);
}
.all .o3{
	width:31.57%;
	aspect-ratio:1.07;
	margin:46% 0 0 63.57%;
	background-image: url(../images/webBrandAllObj4.svg);
}
/*** obj end ***/
/********* all end *********/

/********* week start *********/
.week{
	position: relative;
	padding-bottom: 7.89%;
	background: var(--bg);
}

.week p{
	font-size: 1.75em;
	letter-spacing: 0.1em;
}

.week .ctWrapper > ul{
	margin-top:10%;
}
.week .group{
	--bdr-width:0.2em;
	--mt:-1.5%;
	position: relative;
	border-left:var(--bdr-width) solid transparent;
	padding-left:2.3em;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.week .group:has(+.group){
	border-color:var(--color1);
	padding-bottom:8.33%;
}
.week .group:before{
	position: absolute;
	left:0;
	top:0;
	content:"";
	display: block;
	width:0.9em;
	aspect-ratio:1;
	border-radius:50%;
	margin-left:calc(var(--bdr-width) / -2);
	transform: translateX(-50%);
	background: var(--color1);
}

/*** 週標題 start ***/
.week hgroup{
	--color:var(--color3);
	margin-top:var(--mt);
	flex-shrink: 0;
}
.week .group:nth-child(2) hgroup{
	--color:var(--color2);
}

.week hgroup h5{
	--height:1.73em;
	position: relative;
	font-size: 1.5em;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1em;
	padding:0.1em 0.5em 0 0.1em;
	color:#FFF;
	background: var(--color);
	height:var(--height);
	display: flex;
	align-items: center;
}
.week hgroup h5:before{
	position: absolute;
	right:100%;
	top:0;
	content:"";
	display: block;
	height:100%;
	border:calc(var(--height) / 2) solid transparent;
	border-left:none;
	border-right-color:var(--color);
}

.week hgroup span{
	margin-top:1em;
	display: block;
	font-size: 1.2em;
}
.week hgroup span em{
	font-size: 1.5em;
	font-style: normal;
	font-weight: 700;
	display: inline-block;
	transform: scaleX(0.9);
}
.week hgroup span strong{
	color:var(--color);
	font-size: 1.98em;
	font-weight: 700;
	display: inline-block;
	transform: scaleX(0.9);
}
/*** 週標題 end ***/

/*** 週內容 start ***/
.week .group ul{
	position: relative;
	margin-top:var(--mt);
	width:77%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.week .group:nth-child(2) ul{
	justify-content: center;
}
.week .group ul:before{
	position: absolute;
	left:0;
	bottom:0;
	content:"";
	display: block;
	width:127.31%;
	aspect-ratio:6.79;
	margin:0 0 -3.38% -15.8%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.week .group:nth-child(odd) ul:before{ background-image: url(../images/webBrandWeekBtm1.png);}
.week .group:nth-child(even) ul:before{ background-image: url(../images/webBrandWeekBtm2.png);}

.week .group li{
	position: relative;
	width:27.31%;
}
.week .group:nth-child(2) li+li{
	margin-left:14.67%;
}

.week a{
	position: relative;
	display: block;
}
.week a img{
	display: block;
	width:100%;
	border:0.1em solid var(--color1);
	border-radius:0.8em;
	box-shadow:0.25em 0.25em 0 0 var(--color1);
	transition: all 0.5s;
}
.week a:hover img{
	transform:scale(1.05);
	filter:contrast(120%) drop-shadow(0 0 0.35em #FFF);
}

/* logo start */
.week a em{
	display: flex;
	align-items: center;
	aspect-ratio:3.45;
}
.week .logo{
	font-size: 0;
	display: block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.week .rosendahl{width: 50%;aspect-ratio:10.33;background-image: url(../images/logo_rosendahl.svg);}
.week .holmegaard{width: 23%;aspect-ratio:0.92;background-image: url(../images/logo_holmegaard.svg);}
.week .kahler{width: 32%;aspect-ratio:1.82;background-image: url(../images/logo_kahler.svg);}
.week .aroma{width: 40%;aspect-ratio:2.58;background-image: url(../images/logo_aroma.svg);}
.week .dr{width: 28%;aspect-ratio:1.08;background-image: url(../images/logo_dr.svg);}
.week .koyori{width: 40%;aspect-ratio:4.9;background-image: url(../images/logo_koyori.svg);}
.week .mater{width: 35%;aspect-ratio:3.3;background-image: url(../images/logo_mater.svg);}
.week .form{width: 50%;aspect-ratio:4.14;background-image: url(../images/logo_form.svg);}
/* logo end */

/* icon start */
.week a:before{
	position: absolute;
	content:"";
	display: block;
	right:0;
	bottom:0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	z-index: 1;
}
.week .group:nth-child(1) li:nth-child(1) a:before{width:27.27%;aspect-ratio:0.67;margin: 0 -9% 10% 0;background-image: url(../images/webBrandIcon1.svg);}
.week .group:nth-child(1) li:nth-child(2) a:before{width:15.7%;aspect-ratio:0.46;margin: 0 -8% 10% 0;background-image: url(../images/webBrandIcon2.svg);}
.week .group:nth-child(1) li:nth-child(3) a:before{width:33.05%;aspect-ratio:1.48;margin: 0 -17% 11% 0;background-image: url(../images/webBrandIcon3.svg);}
.week .group:nth-child(2) li:nth-child(1) a:before{width:14.87%;aspect-ratio:0.36;margin: 0 -21% 10% 0;background-image: url(../images/webBrandIcon4.svg);}
.week .group:nth-child(2) li:nth-child(2) a:before{width:22.31%;aspect-ratio:0.32;margin: 0 -26% 7% 0;background-image: url(../images/webBrandIcon5.svg);}
.week .group:nth-child(3) li:nth-child(1) a:before{width:37.19%;aspect-ratio:0.76;margin: 0 -17% 1% 0;background-image: url(../images/webBrandIcon6.svg);}
.week .group:nth-child(3) li:nth-child(2) a:before{width:23.14%;aspect-ratio:0.46;margin: 0 -18% 6% 0;background-image: url(../images/webBrandIcon7.svg);}
.week .group:nth-child(3) li:nth-child(3) a:before{width:39.66%;aspect-ratio:0.96;margin: 0 -22% 14% 0;background-image: url(../images/webBrandIcon8.svg);}
/* icon end */
/*** 週內容 end ***/

/*** obj start ***/
.week .obj{
	width:15.15%;
	aspect-ratio:1.27;
	margin-top:17.57%;
	background: url(../images/webBrandWeekObj1.svg) no-repeat center/100%;
}
/*** obj end ***/
/********* week end *********/

/********* obj start *********/
.web .brand > .o1{
	left:auto;
	right:0;
	width:51.57%;
	aspect-ratio:2.8;
	margin-top:-2%;
	background-image: url(../images/webBrandObj1.svg);
	pointer-events: none;
}
/********* obj end *********/
/****************** brand end *********************/

/****************** gift start *********************/
.web .gift{
	position: relative;
	width:100%;
	padding-top:6.73%;
	aspect-ratio:1.65;
	background: var(--bg) url(../images/webGiftBg.svg) no-repeat center top/100%;
}

.web .gift ._CT{
	position: relative;
	width:63.15%;
	margin:0 auto;
	z-index: 1;
}

/********* 贈品 start *********/
.web .gift ul{
	position: relative;
	margin-top:9.16%;
}

.web .gift li{
	position: absolute;
	left:0;
	top:0;
}
.web .gift li:nth-child(1){	width:33.16%; margin-left:29.33%;}
.web .gift li:nth-child(2){	width:30%; margin:27.5% 0 0 10.33%;}
.web .gift li:nth-child(3){	width:32.83%; margin:27.5% 0 0 62.16%;}

.web .gift .img{
	padding:3.5em 0 0 1.2em;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	color:#FFF;
}
.web .gift li:nth-child(1) .img{aspect-ratio:1.05;background-image: url(../images/webGift1.png);color:var(--color4);}
.web .gift li:nth-child(2) .img{aspect-ratio:0.9;background-image: url(../images/webGift2.png);}
.web .gift li:nth-child(3) .img{aspect-ratio:0.98;background-image: url(../images/webGift3.png);}

.web .gift .img span{
	position: relative;
	display: block;
	width:9em;
	text-align: center;
	letter-spacing: 0.15em;
}
.web .gift .img span em{
	font-style: normal;
	font-size: 2.2em;
	font-weight: 600;
	letter-spacing: normal;
	display: inline-block;
	margin-left:-0.1em;
	transform: scaleX(0.9) skew(-5deg);
}
.web .gift .img span i{
	position: absolute;
	left:0;
	bottom:100%;
	width:100%;
	font-style: normal;
	letter-spacing: normal;
	color:#C00;
}

.web .gift .txt{
	margin-top:0.6em;
	display: flex;
	justify-content: center;
	align-items: center;
	color:var(--color4);
	line-height: 1em;
	white-space: nowrap;
}
.web .gift .txt span{
	color:var(--color1);
	background:var(--color4);
	display: inline-flex;
	justify-content: center;
	align-items: center;
	font-size: 1.1em;
	width:1.45em;
	padding-top:0.1em;
	aspect-ratio:1;
	border-radius:50%;
	flex-shrink: 0;
}
.web .gift li:nth-child(1) .txt span,
.web .gift li:nth-child(3) .txt span{
	margin-left:1.6em;
}
.web .gift .txt em{
	font-style: normal;
	margin-left:0.25em;
	flex-shrink: 0;
}
/********* 贈品 end *********/

/********* obj start *********/
.web .gift .obj,
.web .gift .o2:before{
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.web .gift .o1{	width:17.47%; aspect-ratio:0.85; margin:-7.05% 0 0 36.1%; background-image: url(../images/webGiftObj1.svg);}
.web .gift .o2{ width:26.31%; aspect-ratio:0.89; margin:-6.73% 0 0 37.05%;}
.web .gift .o2:before{
	content:"";
	display: block;
	height:100%;
	background-image: url(../images/webGiftObj2.svg);
	transform-origin: center top;
	animation:webGiftLight 1s ease-in-out alternate infinite;
}
@keyframes webGiftLight{
	from{
		transform: rotate(-1deg);
	}
	to{
		transform: rotate(1deg);
	}
}
.web .gift .o3{	width:10%; aspect-ratio:1; margin:-0.73% 0 0 8.21%; background-image: url(../images/webGiftObj3.svg);}
.web .gift .o4{	width:14.47%; aspect-ratio:0.97; margin-top:35.68%; background-image: url(../images/webGiftObj4.png);}
.web .gift .o5{	width:19.15%; aspect-ratio:0.47; margin:12.1% 0 0 78.21%; background-image: url(../images/webGiftObj5.png);}
/********* obj end *********/
/****************** gift end *********************/

/****************** member start *********************/
.web .member{
	position: relative;
	width:100%;
	padding-top:4.73%;
	aspect-ratio:1.89;
	background: var(--bg) url(../images/webMemberBtm.svg) no-repeat center bottom/100%;
}

.web .member ._CT{
	position: relative;
	width:63.15%;
	margin:0 auto;
	z-index: 1;
}

.web .member ._CT h4{
	color:var(--color4);
}

/********* 內容 start *********/
.web .member ul{
	position: relative;
}

.web .member ul li{
	position: absolute;
	left:0;
	top:0;
	width:48.33%;
	aspect-ratio:2.52;
}
.web .member ul li:nth-child(1){ margin:13.08% 0 0 3.66%;}
.web .member ul li:nth-child(2){ margin:2.83% 0 0 49.5%;}
.web .member li:hover{
	z-index: 1;
}
.web .member a{
	display: block;
	height:100%;
	color:#FFF;
	transition: transform 0.5s;
}
.web .member li:hover a{
	transform: scale(1.05);
}
.web .member .ticket{
	height:inherit;
	padding:5% 0 0 18%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.web .member ul 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 ul 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: 4.2em;
	font-weight:700;
	letter-spacing: 0.05em;
	animation:ticketNumber 1s ease-in alternate infinite;
	transform: scaleX(0.7);
}
.web .member ul li:nth-child(2) .ticket span{
	animation-delay:0.33s;
}
@keyframes ticketNumber{
	to{
		color:var(--color1);
		filter:drop-shadow(0 0 0.1em var(--color1));
	}
}
.web .member .ticket span strong{
	display: inline-block;
	transform: translateY(0.05em);
	font-size: 1.6em;
}
/********* 內容 end *********/

/********* attBlock start *********/
.web .member .attBlock{
	position: absolute;
	right:0;
	top:0;
	margin-top:40.66%;
}
.web .member .attBlock button{
	border:none;
	padding:0;
	color:#FFF;
	background: none;
	font-family: inherit;
	font-size: 1em;
	cursor:pointer;
	transition: color 0.2s;
}
.web .member .attBlock button:hover{
	color:var(--color1);
}
.web .member .attBlock .txt{
	display:none;
}
/********* attBlock end *********/

/********* obj start *********/
.web .member .obj,
.web .member .o1:before{
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.web .member .o1{ width:38.73%; aspect-ratio:1; margin:4.2% 0 0 30.63%;}
.web .member .o1:before{
	content:"";
	display: block;
	height:100%;
	background-image: url(../images/webMemberObj1.svg);
	animation:webMemberBg 15s ease-in-out alternate infinite;
}
@keyframes webMemberBg{
	from{
		transform: rotate(30deg);
	}
	to{
		transform: rotate(-30deg);
	}
}
.web .member .o2{width:6.31%;aspect-ratio:0.34;margin: 13% 0 0 9.68%;background-image: url(../images/webMemberObj2.svg);}
.web .member .o3{width:4.63%;aspect-ratio:0.83;margin: 9% 0 0 80.21%;background-image: url(../images/webMemberObj3.svg);}
.web .member .o4{width:8.31%;aspect-ratio:1.49;margin: 35.21% 0 0 66.84%;background-image: url(../images/webMemberObj4.svg);}
/********* obj end *********/
/****************** member end *********************/
/****************************************** web end ************************************************/

/****************************************** store start ************************************************/
.store{
	position: relative;
	padding:6% 0;
	background: linear-gradient(to top, var(--color1), rgba(246, 242, 155, 0) 50%) no-repeat bottom;
}

.store .CT{
	position: relative;
	width:63.15%;
	margin:0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	z-index: 1;
}

.store .sectionTitle strong span:nth-child(odd){
	color:var(--color1);
}

/******************** 頁籤 start ***********************/
.store .tab{
	width:100%;
	display: flex;
	justify-content: space-between;
	margin-top:10%;
}
.store .tab li{
	width:49.16%;
	font-size: 1.5em;
	color:#FFF;
	border:0.08em solid;
	text-align: center;
	line-height: 1em;
	padding:0.8em 0 0.7em;
	cursor:pointer;
	transition: all 0.2s;
}
.store .tab li:hover,
.store .tab li.active{
	color:var(--color4);
	border-color:#FFF;
	background: #FFF;
}
/******************** 頁籤 end ***********************/

/******************** 內容 start ***********************/
.store .tabCTWrapper{
	width:100%;
	margin-top:5.83%;
}

.store .tabCT{
	display: none;
}
.store .tabCT.active{
	display: block;
}

/********* ctWrapper start ***********/
.store .ctWrapper{
	--color5:#ffc4c5;
	position: relative;
	padding:3em 2em;
	color:#FFF;
	background:var(--color4);
	border-radius:1.5em;
}

/**** 標題區 start ****/
.store hgroup{
	display:flex;
	justify-content: space-between;
	align-items: flex-start;
}

.store hgroup .period{
	font-size: 1.7em;
	letter-spacing: 0.05em;
}
.store hgroup .period em{
	font-style: normal;
	color:var(--color5);
}
.store hgroup .period em span{
	display: inline-block;
	font-size: 1.4em;
	transform-origin: left center;
	transform: scaleX(0.9);
}
.store hgroup .period em span i{
	font-style: normal;
	font-size: 0.5em;
	margin-left:0.25em;
}
.store hgroup .period h4{
	font-size: 1.35em;
	font-weight: 700;
	margin-top:0.1em;
}
.store hgroup .period p{
	font-size: 0.64em;
	font-weight: 400;
	line-height: 1.6em;
	margin:0.5em 0 0;
}

.store hgroup a{
	--height:1.57em;
	position: relative;
	font-size: 1.4em;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1em;
	white-space: nowrap;
	padding:0 0.1em 0 0.5em;
	color:#FFF;
	background: var(--color2);
	height:var(--height);
	display: flex;
	align-items: center;
	margin:2.75em 0.8em 0 0;
	transition: filter 0.2s;
}
.store hgroup a:hover{
	filter:drop-shadow(0 0 0.2em var(--color1));
}
.store hgroup a:before{
	position: absolute;
	left:100%;
	top:0;
	content:"";
	display: block;
	height:100%;
	border:calc(var(--height) / 2) solid transparent;
	border-right:none;
	border-left-color:var(--color2);
}
/**** 標題區 end ****/

/**** 內容區 1 start ****/
.store .tabCT:nth-child(1) .ctWrapper > ul{
	position: relative;
	margin-top:1em;
	aspect-ratio:1.33;
}

.store .tabCT:nth-child(1) .ctWrapper > ul > li{
	position: absolute;
	left:0;
	top:0;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1){ width:51.78%;}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2){ width:48.57%;margin:7% 0 0 51.07%;}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3){ width:46.25%;margin-top:44%;}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4){ width:52.14%;margin:49% 0 0 47.32%;}

/** 小標 start **/
.store .tabCT:nth-child(1) .ctWrapper > ul > li h5{
	font-size: 1.7em;
	font-weight: 500;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) h5,
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4) h5{
	color:var(--color5);
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2) h5,
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3) h5{
	color:#FFF;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) h5,
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3) h5{
	margin-left:-0.2em;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2) h5,
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4) h5{
	margin-left:0.8em;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li h5 em{
	font-size: 2.5em;
	font-style: normal;
	display: inline-block;
	transform: skewX(-10deg) scaleX(0.9);
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li h5 span{
	font-size: 1.3em;
	display: inline-block;
	transform: scaleX(0.9);
}
/** 小標 end **/

/** detail start **/
.store .tabCT:nth-child(1) .detail{
	font-size: 1.11em;
	padding:0.9em 0.8em;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100%;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) .detail,
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4) .detail{
	color:var(--color4);
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2) .detail,
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3) .detail{
	color:#FFF;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) .detail{aspect-ratio:1.57;background-image: url(../images/storeCTBg1.svg);}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2) .detail{aspect-ratio:1.55;background-image: url(../images/storeCTBg2.svg);padding-left:3em;}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3) .detail{aspect-ratio:3.04;background-image: url(../images/storeCTBg3.svg);}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4) .detail{aspect-ratio:3.43;background-image: url(../images/storeCTBg4.svg);padding-left:1.8em;}

.store .detail h6{
	font-size: 1em;
}
.store .detail ul + h6{
	margin-top:1em;
}

.store .detail ul{
	margin-top:0.9em;
	display: grid;
	gap:1em;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) .detail ul{
	grid:repeat(4, 1fr) / auto-flow 1fr 1fr;
	row-gap:0.7em;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) .detail ul:last-child{
	grid:1fr / auto-flow 1fr 1fr;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2) .detail ul{
	grid:repeat(6, 1fr) / auto-flow 1fr 1fr;
	row-gap:0.6em;
}
.store .detail ul li{
	display: flex;
	align-items: center;
	white-space: nowrap;
}
.store .detail ul li:before{
	content:"";
	display: block;
	width:0.35em;
	aspect-ratio:1;
	border-radius:50%;
	margin:0 0.4em 0 0.2em;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) li:before{ background: var(--color2);}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2) li:before{ background: var(--color4);}

.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4) .detail ol{
	list-style: decimal;
	padding-left:1em;
	margin-top:0.5em;
}
.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4) .detail ol li+li{
	margin-top:0.2em;
}

.store .detail p{
	line-height: 1.8em;
	margin:0;
}
.store .detail strong{
	font-size: 1.3em;
}
.store .detail i{
	font-size: 0.8em;
	font-style: normal;
}
/** detail end **/
/**** 內容區 1 end ****/

/**** 內容區 2 start ****/
.store .tabCT:nth-child(2) ul{
	margin-top:8%;
	padding-bottom:8%;
	display: flex;
	flex-wrap: wrap;
}

.store .tabCT:nth-child(2) li{
	width:20.53%;
	margin-left:6.25%;
}
.store .tabCT:nth-child(2) li:nth-child(1){
	margin-left:11.6%;
}
.store .tabCT:nth-child(2) li:nth-child(4){
	margin-left:0;
}
.store .tabCT:nth-child(2) li:nth-child(7){
	margin-left:35.71%;
}
.store .tabCT:nth-child(2) li:nth-child(n+4){
	margin-top:13.39%;
}

.store .tabCT:nth-child(2) li a{
	position: relative;
	display: block;
}
.store .tabCT:nth-child(2) li a:before{
	position: absolute;
	left:0;
	top:0;
	font-size:4.2em;
	font-weight: 500;
	margin-top:-0.6em;
	display: block;
	color:var(--color1);
	transform: skewX(-10deg) scaleX(0.9);
	z-index: 1;
}
.store .tabCT:nth-child(2) li:nth-child(1) a:before{ content:"1";}
.store .tabCT:nth-child(2) li:nth-child(2) a:before{ content:"2";}
.store .tabCT:nth-child(2) li:nth-child(3) a:before{ content:"3";}
.store .tabCT:nth-child(2) li:nth-child(4) a:before{ content:"4";}
.store .tabCT:nth-child(2) li:nth-child(5) a:before{ content:"5";}
.store .tabCT:nth-child(2) li:nth-child(6) a:before{ content:"6";}
.store .tabCT:nth-child(2) li:nth-child(7) a:before{ content:"7";}
.store .tabCT:nth-child(2) li:nth-child(8) a:before{ content:"8";}
.store .tabCT:nth-child(2) li img{
	display: block;
	width:100%;
	transition: all 0.5s;
}
.store .tabCT:nth-child(2) li a:hover img{
	transform: scale(1.05);
    filter: contrast(120%) drop-shadow(0 0 0.35em #FFF);
}
.store .tabCT:nth-child(2) li a .txt{
	position: absolute;
	left:0;
	top:100%;
	margin-top:0.8em;
	white-space: nowrap;
}
.store .tabCT:nth-child(2) li a .txt > *{
	display: block;
	font-weight:400;
}
.store .tabCT:nth-child(2) li a .txt strong{
	font-weight:inherit;
}
.store .tabCT:nth-child(2) li a .txt span{
	font-size: 0.95em;
	margin-left:-0.4em;
}

/** obj start **/
.store .tabCT:nth-child(2) .obj{
	top:auto;
	bottom:0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.store .tabCT:nth-child(2) .o1{width:20.66%;aspect-ratio:1.14;margin: 0 0 13% -3.5%;background-image: url(../images/storeObj7.svg);}
.store .tabCT:nth-child(2) .o2{width:28.16%;aspect-ratio:0.57;margin: 0 0 6% 89%;background-image: url(../images/storeObj8.svg);}
/** obj end **/
/**** 內容區 2 end ****/
/********* ctWrapper end ***********/

/********* ctaBlock start ***********/
.store .ctaBlock{
	margin-top:1.5em;
	color:var(--color4);
	line-height: 1.8em;
}
.store .tel{
	color:currentColor;
	display: inline-flex;
	align-items: center;
	transform: translateY(0.2em);
}
.store .tel:before{
	content:"";
	display: block;
	width:1.3em;
	aspect-ratio:1;
	background: url(../images/tel.svg) no-repeat center/100%;
	margin-right:0.2em;
}
.store .tel:hover{
	text-decoration: underline;
}
/********* ctaBlock end ***********/
/******************** 內容 end ***********************/

/******************** obj start ***********************/
.store > .obj{
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}
.store > .o1{width:11.78%;aspect-ratio:0.96;margin: -11% 0 0 39%;background-image: url(../images/storeObj1.svg);}
.store > .o2{width:15.57%;aspect-ratio:1.08;margin: -1% 0 0 8%;background-image: url(../images/storeObj2.svg);}
.store > .o3{width:22.42%;aspect-ratio:1.26;left:auto;right:0;margin-top: -4%;background-image: url(../images/storeObj3.svg);}
.store > .o4{width:48.42%;aspect-ratio:3;margin: 34% 0 0 -2.5%;background-image: url(../images/storeObj4.svg);}
.store > .o5{width:28.94%;aspect-ratio:2.11;margin: 57% 0 0 69.5%;background-image: url(../images/storeObj5.svg);}
.store > .o6{width:14.84%;aspect-ratio:1.11;margin-top: 69%;background-image: url(../images/storeObj6.svg);}
/******************** obj end ***********************/
/****************************************** store end ************************************************/


@media screen and (min-width:1025px){
	
	/************************************** header start ***************************************************/
	/********************** nav start *************************/
	.themeEventContainer header:hover nav{
		width:12.35em;
	}
	/********************** nav end *************************/
	/********************** _burgerBtn start *************************/
	.themeEventContainer header:hover ._burgerBtn{
		opacity:0;
	}
	/********************** _burgerBtn end *************************/
	/************************************** header end ***************************************************/
	
}


@media screen and (max-width:1024px){
	
	/************************************** header start ***************************************************/	
	/********************** nav start *************************/
	.themeEventContainer header 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(12px, 3.2vw, 16px);
	}
	
	/************************************** 其它共用 start ***************************************************/
	/*************** sectionTitle start **********************/
	.sectionTitle{
		font-size:2.6em;
	}
	/*************** 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;
		font-size: 1.2em;
	}
	/********************** nav end *************************/
	/************************************** header end ***************************************************/
	
	/****************************************** home start ************************************************/
	.home .CT{
		display: block;
		margin-top:0;
	}

	/******************** 標題 start *********************/
	.home hgroup{
		width:85%;
		margin:5% 0 0 7.5%;
	}
	/******************** 標題 end *********************/

	/******************** KV start *********************/
	.home .L,
	.home .R{
		width:auto;
	}
	
	.home .R{
		margin-top:-12%;
	}
	.home .R:before{
		position: absolute;
		content:"";
		display: block;
		left:0;
		top:0;
		margin-top:12%;
		width:100%;
		aspect-ratio:8;
		background: linear-gradient(to bottom, var(--color3), rgba(92, 190, 181, 0));
	}

	.home li{
		font-size: 2.8vw;
	}
	
	.home .light1 a{ left:130%;	top:-10%;}
	.home .whale a{ left:-110%; top:-190%;}
	.home .sofa2 a{top: -55%;}
	.home .monkey a{ right: 120%;top:25%;}
	.home .light2 a{right:-150%;top: -140%;}
	.home .elephant a{left: 100%;top: -90%;}
	.home .chair a{top: -50%;}
	.home .light4 a{right: 30%;top: -120%;}
	/******************** KV end *********************/

	/******************** 前言 start *********************/
	.home p{
		position: static;
		width:90%;
		margin:0 auto;
		letter-spacing: normal;
	}
	.home p br{
		display: none;
	}
	/******************** 前言 end *********************/

	/******************** btm start *********************/
	.home .btm{
		width:auto;
	}
	/******************** btm end *********************/
	/****************************************** home end ************************************************/
	
	/****************************************** web start ************************************************/
	/****************** 區塊標題 start *********************/
	.web h4{
		font-size: 1.6em;
	}
	/****************** 區塊標題 end *********************/

	/****************** discount start *********************/
	.web .discount{
		padding-top:5%;
	}

	.web .discount ._CT{
		width:90%;
	}

	/********* 內容 start *********/
	.web .discount ul{
		font-size: 1.08em;
		margin-top:2em;
		padding:1.5em 1em;
	}
	.web .discount ul:before{
		width:20%;
		margin-top:-12%;
	}
	.web .discount li{
		display: block;
	}
	.web .discount li h5{
		width:auto;
	}
	.web .discount li p{
		margin:0;
		transform: none;
	}
	/********* 內容 end *********/

	/********* obj start *********/
	.web .discount .o1{
		margin:-12% 0 0 -5%;
	}
	.web .discount .o2{
		width:15%;
		margin-left:80%;
	}
	/********* obj end *********/
	/****************** discount end *********************/

	/****************** brand start *********************/
	.web .brand{
		padding-top:5%;
	}

	.web .brand h4{
		margin-left:5%;
	}

	.web .brand .ctWrapper{
		width:90%;
	}

	/********* all start *********/
	.all{
		margin-top:12%;
		padding-bottom: 15%;
	}

	.all p{
		font-size: 1.2em;
		letter-spacing: normal;
	}

	.all ul{
		width:90%;
		margin:0 auto;
		justify-content: space-between;
	}
	.all li{
		width:45%;
		margin:15% 0 0 0;
	}

	.all a > em{
		font-size:0.8em;
	}
	.all li:nth-child(3) a > em,
	.all li:nth-child(4) a > em{
		background: var(--color3);
	}
	.all li:nth-child(5) a > em,
	.all li:nth-child(6) a > em{
		background: var(--color2);
	}

	/*** obj start ***/
	.all .obj{
		display: none;
	}
	/*** obj end ***/
	/********* all end *********/

	/********* week start *********/
	.week{
		padding-bottom: 15%;
	}

	.week p{
		font-size: 1.2em;
		letter-spacing: normal;
	}

	.week .group{
		--mt:-0.8em;
		font-size: 0.9em;
		padding-right:10%;
	}
	.week .group:has(+.group){
		padding-bottom:15%;
	}

	/*** 週內容 start ***/
	.week .group ul{
		width:50%;
		display: block;
	}
	.week .group ul:before{
		display: none;
	}

	.week .group li{
		width:auto;
	}
	.week .group li+li{
		margin-top:2%;
	}
	.week .group li:before{
		position: absolute;
		left:0;
		bottom:0;
		content:"";
		display: block;
		width:466.11%;
		aspect-ratio:6.79;
		margin:0 0 -11.57% -100%;
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100%;
	}
	.week .group:nth-child(odd) li:before{ background-image: url(../images/webBrandWeekBtm1.png);}
	.week .group:nth-child(even) li:before{ background-image: url(../images/webBrandWeekBtm2.png);}
	.week .group:nth-child(2) li+li{
		margin-left:0;
	}
	/*** 週內容 end ***/

	/*** obj start ***/
	.week .obj{
		display: none;
	}
	/*** obj end ***/
	/********* week end *********/

	/********* obj start *********/
	.web .brand > .o1{
		width:75%;
	}
	/********* obj end *********/
	/****************** brand end *********************/

	/****************** gift start *********************/
	.web .gift{
		padding-top:5%;
		aspect-ratio:auto;
		background-size: 180%;
	}

	.web .gift ._CT{
		width:90%;
	}

	/********* 贈品 start *********/
	.web .gift ul{
		width:80%;
		margin:10% auto 0 15%;
		font-size: 3.7vw;
	}

	.web .gift li{
		position: static;
	}
	.web .gift li:nth-child(1),
	.web .gift li:nth-child(2),
	.web .gift li:nth-child(3){
		width:auto;
		margin:0;
	}
	.web .gift li:nth-child(2),
	.web .gift li:nth-child(3){
		margin-top:8%;
	}
	.web .gift li:nth-child(2){
		width:92%;
	}
	/********* 贈品 end *********/

	/********* obj start *********/
	.web .gift .o1{width: 40%;margin: -15% 0 0 25%;}
	.web .gift .o2{width: 49%;margin: -14% 0 0 30%;}
	.web .gift .o3{width: 21%;margin: 3% 0 0 73%;}
	.web .gift .o4{width: 26%;margin: 232% 0 0 -13%;}
	.web .gift .o5{width: 35%;margin: 105% 0 0 75%;}
	/********* obj end *********/
	/****************** gift end *********************/

	/****************** member start *********************/
	.web .member{
		padding-top:10%;
		aspect-ratio:1;
	}

	.web .member ._CT{
		width:90%;
	}

	/********* 內容 start *********/
	.web .member ul{
		margin-top:10%;
	}

	.web .member ul li{
		width:80%;
	}
	.web .member ul li:nth-child(1){margin: 25% 0 0 -7%;}
	.web .member ul li:nth-child(2){margin: -2% 0 0 27%;}
	.web .member .ticket span{
		font-size: 10.5vw;
	}
	/********* 內容 end *********/

	/********* attBlock start *********/
	.web .member .attBlock{
		margin-top:60%;
	}
	/********* attBlock end *********/

	/********* obj start *********/
	.web .member .o1{ width:80%; margin:15% 0 0 10%;}
	.web .member .o2{width: 10%;margin: 47% 0 0 3%;}
	.web .member .o3{width: 8%;margin: 16% 0 0 70%;}
	.web .member .o4{width: 15%;margin: 77% 0 0 80%;}
	/********* obj end *********/
	/****************** member end *********************/
	/****************************************** web end ************************************************/
	
	/****************************************** store start ************************************************/
	.store{
		padding:10% 0;
	}

	.store .CT{
		width:90%;
	}

	/******************** 頁籤 start ***********************/
	.store .tab{
		font-size: 0.8em;
		display: block;
	}
	.store .tab li{
		width:auto;
	}
	.store .tab li+li{
		margin-top:0.5em;
	}
	/******************** 頁籤 end ***********************/

	/******************** 內容 start ***********************/
	.store .tabCTWrapper{
		margin-top:8%;
	}

	/********* ctWrapper start ***********/
	.store .ctWrapper{
		font-size: 0.72em;
	}

	/**** 標題區 start ****/
	.store hgroup .period p br{
		display: none;
	}
	/**** 標題區 end ****/

	/**** 內容區 1 start ****/
	.store .tabCT:nth-child(1) .ctWrapper > ul{
		aspect-ratio:auto;
	}

	.store .tabCT:nth-child(1) .ctWrapper > ul > li{
		position: static;
	}
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1),
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2),
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3),
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4){ width:auto;}
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2),
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3),
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4){ margin:5% 0 0;}

	/** 小標 start **/
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) h5,
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3) h5{
		color:var(--color5);
	}
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2) h5,
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4) h5{
		color:#FFF;
	}
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) h5,
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2) h5,
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3) h5,
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4) h5{
		margin-left:0;
	}
	/** 小標 end **/
	
	/** detail start **/
	.store .tabCT:nth-child(1) .detail{
		font-size: 1.45em;
	}
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) .detail,
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3) .detail{
		color:var(--color4);
		background: #FFF;
	}
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2) .detail,
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4) .detail{
		color:#FFF;
		background: var(--color2);
	}
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(1) .detail,
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(2) .detail,
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(3) .detail,
	.store .tabCT:nth-child(1) .ctWrapper > ul > li:nth-child(4) .detail{
		aspect-ratio:auto;
		background-image: none;
		padding:1em 1em 1.5em;
	}
	/** detail end **/
	/**** 內容區 1 end ****/

	/**** 內容區 2 start ****/
	.store .tabCT:nth-child(2) ul{
		margin-top:12%;
		padding-bottom:4%;
		justify-content: space-between;
	}

	.store .tabCT:nth-child(2) li{
		width:47%;
	}
	.store .tabCT:nth-child(2) li,
	.store .tabCT:nth-child(2) li:nth-child(1),
	.store .tabCT:nth-child(2) li:nth-child(4),
	.store .tabCT:nth-child(2) li:nth-child(7){
		margin-left:0;
	}
	.store .tabCT:nth-child(2) li:nth-child(n+3),
	.store .tabCT:nth-child(2) li:nth-child(n+4){
		margin-top:10%;
	}

	.store .tabCT:nth-child(2) li a .txt{
		position: static;
		font-size: 1.3em;
		white-space:normal;
	}

	/** obj start **/
	.store .tabCT:nth-child(2) .obj{
		display: none;
	}
	/** obj end **/
	/**** 內容區 2 end ****/
	/********* ctWrapper end ***********/

	/********* ctaBlock start ***********/
	.store .ctaBlock{
		margin-top:1em;
	}
	/********* ctaBlock end ***********/
	/******************** 內容 end ***********************/

	/******************** obj start ***********************/
	.store > .o1{width:15%;}
	.store > .o4,
	.store > .o5,
	.store > .o6{
		display: none;
	}
	/******************** obj end ***********************/
	/****************************************** store end ************************************************/

}
