body, form, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, figure, figcaption, fieldset, legend {
	margin: 0;
	padding: 0;
}
*,
*:before,
*:after {
	box-sizing: border-box;
}
body,
input,
button,
textarea {
	font-family: Tahoma, Arial, 微軟正黑體;
	font-size: 14px;
	color: #333;
}
body.disableScroll {
	overflow: hidden;
}
h2 {
	color: #000;
	font-size: 22px;
}
ul,
ol {
	list-style: none;
}
p:nth-child(1) {
	margin-top: 0;
	padding-top: 0;
}
a {
	color: currentColor;
	text-decoration: none;
}
a[href].tLink1 {
	color: #ffa500;/* text-decoration: underline; */
}
a[href].tLink2 {
	color: #fff;
	background: #999;
	border-radius: 3px;
	display: inline-block;
	padding: 0.1em 0.4em;
	margin: 0 0.4em;
}
.att {
	color: #b22222;
}
.status_instock {
}
.status_preorder {
	color: #b22222;
}
.status_transfer {
	color: #01543a;
}

/*********************************** 價格區間搜尋 start *****************************************/
.priceBlock {
	margin-top: 3%;
}
.priceBlock .method {
	display: flex;
	align-items: center;
}
.priceBlock .method > i {
	width: 14.42%;
	font-style: normal;
	font-size: 14px;
	color: #808080;
}
.priceBlock .method .ct {
	width: 70.19%;
}

/**************** 拖拉區 start ****************/
.priceBlock .useSlider .ct {
	display: flex;
	align-items: center;
}
.priceBlock .useSlider .ct button {
	position: relative;
	display: block;
	padding: 0;
	width: 26px;
	height: 26px;
	background: #ccc;
	border: none;
	outline: none;
	border-radius: 50%;
	cursor: pointer;
	z-index: 4;
}
.priceBlock .useSlider .ct button:hover {
	background: #999;
}
.priceBlock .useSlider .ct button span {
	position: relative;
	display: block;
	height: 100%;
	font-size: 0;
}
.priceBlock .useSlider .ct button span:before,
.priceBlock .useSlider .ct button span:after {
	position: absolute;
	left: 50%;
	top: 50%;
	content: "";
	display: block;
	width: 50%;
	height: 3px;
	background: #fff;
	transform: translate(-50%, -50%);
}
.priceBlock .useSlider .ct button.minus span:after {
	display: none;
}
.priceBlock .useSlider .ct button.plus span:after {
	transform: translate(-50%, -50%) rotate(-90deg);
}
.priceBlock .slider {
	flex: 1;
	border: none;
	border-radius: 0;
	height: 3px;
	color: #b9413a;
	background: #ccc;
	opacity: 0;
}
.priceBlock .slider.ui-slider {
	opacity: 1;
}
.priceBlock .slider:before {
	position: absolute;
	content: "";
	display: block;
	left: 0;
	top: 50%;
	width: 100%;
	height: 1000%;
	transform: translateY(-50%);
}
.priceBlock .slider .ui-widget-header {
	border-radius: 0;
	color: currentColor;
	background: currentColor;
}
.priceBlock .slider .ui-slider-handle {
	top: -5px;
	margin-left: 0;
	width: 13px;
	height: 13px;
	background: none;
	border: none;
	outline: none;
	color: currentColor;
	cursor: ew-resize;
	transform: translateX(-50%);
}
.priceBlock .slider .ui-slider-handle:hover {
	z-index: 3;
}
.priceBlock .slider .ui-slider-handle:before {
	content: "";
	display: block;
	height: 100%;
	border-radius: 50%;
	background: currentColor;
	transition: transform 0.2s;
}
.priceBlock .slider .ui-slider-handle:after {
	position: absolute;
	left: 50%;
	top: 50%;
	content: "";
	display: block;
	width: 500%;
	height: 500%;
	transform: translate(-50%, -50%);
}
.priceBlock .slider .ui-slider-handle:hover:before,
.priceBlock .slider .ui-slider-handle.ui-state-active:before {
	transform: scale(1.5);
}
.priceBlock .slider .ui-slider-handle span {
	position: absolute;
	white-space: nowrap;
	left: 50%;
	bottom: 170%;
	font-size: 14px;
	font-weight: bold;
	transform: translateX(-50%);
	opacity: 0;
	transition: opacity 0.2s;
}
.priceBlock .slider .ui-slider-handle:hover span,
.priceBlock .slider .ui-slider-handle.ui-state-active span {
	opacity: 1;
}
/**************** 拖拉區 end ****************/

/**************** 輸入區 start ****************/
.priceBlock .useInput {
	margin-top: 3%;
}
.priceBlock input[type="number"] {
	-moz-appearance: textfield;
}
.priceBlock input[type="number"]::-webkit-inner-spin-button,
.priceBlock input[type="number"]::-webkit-outer-spin-button {
 -webkit-appearance: none;
}
.priceBlock .useInput .ct {
	display: flex;
}
.priceBlock .useInput .ct .from,
.priceBlock .useInput .ct .to {
	border-radius: 4px;
	background: #fff;
	padding: 0.8em 1.2em;
	width: 38.35%;
	display: flex;
	align-items: center;
	color: #808080;
}
.priceBlock .useInput .ct .from:before,
.priceBlock .useInput .ct .to:before {
	content: "NT$";
	display: block;
	font-size: 1.3em;
	margin-top: 0.2em;
}
.priceBlock .useInput .ct .to {
	position: relative;
	margin-left: 7.94%;
}
.priceBlock .useInput .ct .to:after {
	position: absolute;
	content: "";
	display: block;
	right: 103.57%;
	top: 50%;
	width: 14%;
	border-top: 1px dotted;
}
.priceBlock .useInput .ct .input {
	border: none;
	outline: none;
	font-size: 1.8em;
	font-weight: bold;
	padding: 0;
	margin-left: 0.5em;
	color: #808080;
	min-width: 0;
	flex: 1;
}
.priceBlock .useInput .formBtn {
	padding: 0.9em 2em;
	font-size: 18px;
	border-radius: 5px;
	margin-left: 0.5em;
	flex: 1;
}
/**************** 輸入區 end ****************/
/*********************************** 價格區間搜尋 end *****************************************/

/*********************************** 自製 select start *****************************************/
.select {
	position: relative;
	display: inline-block;
	font-size: 13px;
	color: #333;
	white-space: nowrap;
}
.select.open {
	z-index: 1;
}
.select em {
	position: relative;
	display: block;
	font-style: normal;
	line-height: 1em;
	padding: 0.5em 3em 0.5em 0.8em;
	border-radius: 3px;
	background: #f4f4f4;
	cursor: pointer;
}
.select.open em {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
.select em:before,
.select em:after {
	position: absolute;
	content: "";
	right: 10px;
	top: 0.9em;
	width: 8px;
	height: 2px;
	border-radius: 3px;
	background: #999;
}
.select em:before {
	transform: translateX(-3px) rotate(45deg);
}
.select em:after {
	transform: translateX(2px) rotate(-45deg);
}
.select:not(.disabled) em:hover:before,
.select:not(.disabled) em:hover:after {
	background: #666;
}
.select ul {
	position: absolute;
	left: 0;
	top: 26px;
	width: 100%;
	max-height: 200px;
	overflow: auto;
	padding-bottom: 0.5em;
	color: #999;
	background: #f4f4f4;
	border-radius: 3px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-bottom: 1px solid #d2d2d2;
	z-index: 1;
	display: none;
}
.select.open ul {
	display: block;
}
.select ul li {
	cursor: pointer;
	padding: 0.5em 0.8em;
	margin-top: 1px;
}
.select ul li.disabled {
	cursor: default;
	opacity: 0.3;
}
.select ul li.selected,
.select ul li:not(.disabled):hover {
	color: #333;
	background: #d2d2d2;
}
.select.disabled {
	opacity: 0.3;
}
.select.disabled em {
	cursor: default;
}

.select .code{
	display:none;
}
/*********************************** 自製 select end *****************************************/

/*********************************** 表單按鈕 start *****************************************/
.formBtn {
	display: inline-block;
	background-color: #999;
	color: #fff;
	padding: 0.6em 1.2em;
	line-height: 1em;
	font-size: 14px;
	border: none;
	border-radius: 3px;
	cursor: pointer;
	-webkit-appearance: none;
}
.formBtn:not([disabled]):hover {
	background-color: #666;
}
.formBtn[disabled] {
	cursor: not-allowed;
	background-color: #ddd;
}
.formBtn.light {
	background-color: #f4f4f4;
	color: #666;
}
.formBtn.light:hover {
	background-color: #ddd;
}
/*********************************** 表單按鈕 end *****************************************/

/*********************************** slick start *****************************************/
.slick {
	margin: 0; /* 覆寫 slick-theme.css 的 .slick-slider 的 margin-bottom: 30px; */
}
.slickPN {
	position: absolute;
	top: 50%;
	width: 40px;
	height: 60px;
	transform: translateY(-50%);
	background: rgba(255, 255, 255, 0.95);
	border-radius: 4px 0 0 4px;
	cursor: pointer;
	font-size: 0;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
	z-index: 1;
	opacity: 0;
	transition: opacity 0.2s;
}
.slickPN.prev {
	left: 0;
	transform: translateY(-50%) scaleX(-1);
}
.slickPN.next {
	right: 0;
}
.slickPN:before,
.slickPN:after {
	position: absolute;
	content: "";
	left: 18px;
	width: 15px;
	height: 3px;
	background: #999;
	border-radius: 4px;
}
.slickPN:before {
	top: 19px;
	transform-origin: left top;
	transform: rotate(45deg);
}
.slickPN:after {
	top: 38px;
	transform-origin: left bottom;
	transform: rotate(-45deg);
}
.slick-dots {
	bottom: 5%;
}
.slick-dots li {
	width: 10px;
	height: 10px;
}
.slick-dots li button {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	border: none;
	background: #9a938b;
	box-shadow: 0 0 1px 1px rgba(255, 255, 255, 0.2);
}
.slick-dots li button:hover,
.slick-dots li button:focus {
	background: #000;
}
.slick-dots li.slick-active button {
	background: #000;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
	display: none;
}
.slick-dots li button:before {
	display: none;
}
.slick-dots li.slick-active button:before {
	display: none;
}

/***************** gallery 使用 start ******************/
.gallery .ct {
	background: #f4f4f4;
	padding: 3% 30px 4%;
}
.galleryList.slick .slickPN {
	width: 30px;
	height: 40px;
	background: none;
	border-radius: 0;
	opacity: 1;
}
.galleryList.slick .slickPN.prev {
	left: -30px;
}
.galleryList.slick .slickPN.next {
	right: -30px;
}
.galleryList.slick .slickPN:before,
.galleryList.slick .slickPN:after {
	left: 8px;
}
.galleryList.slick .slickPN:before {
	top: 10px;
}
.galleryList.slick .slickPN:after {
	top: 29px;
}
.galleryList.slick .slickPN:hover:before,
.galleryList.slick .slickPN:hover:after {
	background: #666;
}
.galleryList.slick li {
	float: left;
	padding: 5px;
}
.galleryList.slick li a {
	position: relative;
	display: block;
	padding-top: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

@media screen and (min-width: 767px) {
.galleryList.slick li a:after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.6);
	opacity: 0;
	transition: opacity 0.2s;
}
.galleryList.slick li a:hover:after {
	opacity: 1;
}
}
.galleryList.slick .slick-dots {
	bottom: -20px;
}
.galleryList.slick .slick-dots li {
	float: none;
	padding: 0;
}
/***************** gallery 使用 end ******************/
/*********************************** slick end *****************************************/

/************************ 商品數量 & 僅顯示現貨 & 進階篩選 & 排序方式 start ***************************/
.filterBlock {
	position: relative;
	margin: 20px 10px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	z-index: 1;
}
.filterBlock.sticky {
	position: sticky;
	left: 0;
	background: #FFF;
	width: 100%;
	margin: 0;
	padding: 20px 10px;
	border-bottom: 1px solid #DDD;
}
.filterBlock p {
	margin: 0;
}
.filterBlock .operate {
	position: relative;
	display: flex;
	justify-content: flex-end;
	z-index: 1;
}

/***************** 自訂 Checkbox start ******************/
.filterBlock .cb{
	display: flex;
	align-items: flex-start;
	cursor: pointer;
}
.filterBlock .cb span {
	position: relative;
	border: 1px solid;
	background: #FFF;
	width: 15px;
	height: 15px;
	margin-right: 7px;
	top:0.15em;
	flex-shrink: 0;
}
.filterBlock .cb span:before {
	position: absolute;
	content: "";
	display: block;
	left: 3px;
	top: 3px;
	width: 7px;
	height: 7px;
	background: currentColor;
	transition: transform 0.2s;
	transform: scale(0);
}
.filterBlock .cb.active span:before {
	transform: none;
}

/******** 色塊 start *******/
.filterBlock .g_color .cb i{
	position: relative;
	width: 15px;
	height: 15px;
	margin-right: 10px;
	top:0.15em;
	flex-shrink: 0;
	box-shadow:0 0 1px 1px rgba(20, 20, 20, 0.2) inset;
}
.filterBlock .cBlack i{ background: #333;}
.filterBlock .cBlue i{ background: #6699CC;}
.filterBlock .cBrown i{ background: #a87345;}
.filterBlock .cGray i{ background: #9c9e9d;}
.filterBlock .cGreen i{ background: #86b871;}
.filterBlock .cNatural i{ background: #d1b39a;}
.filterBlock .cPink i{ background: #ff8c9f;}
.filterBlock .cRed i{ background: #f75c4d;}
.filterBlock .cWhite i{ background: #FCFCFC;}
.filterBlock .cYellow i{ background: #faf7a4;}
.filterBlock .cOther i{ background: url(../images/filterColorOther.jpg) no-repeat center/cover;}
/******** 色塊 end *******/
/***************** 自訂 Checkbox end ******************/

/***************** 自訂 下拉按鈕 start ******************/
.filterBlock .dropdown {
	position: relative;
	--bg-color:#f4f4f4;
}
.filterBlock .dropdown > label {
	cursor: pointer;
}
.filterBlock .dropdown > label:after {
	content: "";
	display: inline-block;
	margin: 0 10px;
	border: 1px solid;
	border-top: none;
	border-right: none;
	width: 10px;
	height: 10px;
	transform: translateY(-3px) rotate(-45deg);
}
.filterBlock .dropdown > label+* {
	position: absolute;
	top: 35px;
	background: var(--bg-color);
	border-radius: 3px;
	border-bottom: 1px solid #d2d2d2;
	visibility: hidden;
}
.filterBlock .dropdown > label+*:before {
	position: absolute;
	top: -10px;
	content: "";
	border: 10px solid transparent;
	border-top: none;
	border-bottom-color: var(--bg-color);
}
.filterBlock .dropdown.active > label+* {
	visibility: visible;
}
/***************** 自訂 下拉按鈕 end ******************/

/***************** 進階篩選 start ******************/
.filterBlock .cs::-webkit-scrollbar{
	width:10px;
}
.filterBlock .cs::-webkit-scrollbar-thumb{
	border:2px solid transparent;
	border-radius:10px;
	background-color: #DDD;
	background-clip: content-box;
}
.filterBlock .cs::-webkit-scrollbar-thumb:hover{
	background-color: #999;
}
.filterBlock .mCSB_inside > .mCSB_container{
	margin-right:8px;
}
.filterBlock .mCSB_scrollTools{
	width:8px;
}
.filterBlock .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.filterBlock .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.filterBlock .mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
	background: #DDD;
}
.filterBlock .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{
	background: none;
}

.filterBlock .advancedFilter {
	margin-left: 28px;
}
.filterBlock .advancedFilter .CT {
	right: -114px;
	padding: 26px 32px;
	display:flex;
	flex-direction: column;
}
.filterBlock .advancedFilter .CT:before {
	right: 119px;
}

.filterBlock .groupWrapper{
	display:flex;
}
.filterBlock .group+.group{
	margin-left: 2em;
}
.filterBlock .groupWrapper.less .group+.group{
	margin-left: 4em;
}
.filterBlock .groupWrapper h6{
	font-size: inherit;
	padding-bottom: 1.2em;
	border-bottom:1px solid #DDD;
}
.filterBlock .groupWrapper h6+*{
	margin-top:1.57em;
	max-height: 14.28em;
	padding-bottom: 0.5em;
	overflow: auto;
}
.filterBlock .groupWrapper li+li{
	margin-top:0.9em;
}

/**** 品牌 & 設計師 & 顏色 start ****/
.g_brand,
.g_designer{
	width:18.33vw;
	max-width: 15.71em;
}
.g_color{
	width:14vw;
	max-width: 12.85em;
}
.filterBlock .g_color li+li{
	margin-top: 0.75em;
}
.g_brand .cb span,
.g_designer .cb span,
.g_color .cb span{
	margin-right: 10px;
}
/**** 品牌 & 設計師 & 顏色 end ****/

/**** 價格 start ****/
.g_price{
	width:16.66vw;
	max-width: 14.28em;
}
.g_price .range{
	display: flex;
	align-items: center;
}
.g_price .range input[type="text"]{
	width:33%;
	border:none;
	padding:0.3em;
	margin:0 0.6em;
}
/**** 價格 end ****/

/**** 其他 start ****/
.g_other{
	width:7.5vw;
	max-width: 6.42em;
	display: none;
}
/**** 其他 end ****/

.filterBlock .CT button{
	align-self: flex-end;
	margin-top:1.57em;
}

/**** tag start ****/
.filterBlock .tag{
	display:flex;
	flex-wrap: wrap;
	align-items: flex-start;
	width:100%;
}
.filterBlock .tag:not(:empty){
	margin-top:0.4em;
}
.filterBlock .tag li{
	display:flex;
	flex-shrink: 0;
	align-items: center;
	white-space: nowrap;
	cursor: pointer;
	border:1px solid #DDD;
	line-height: 1em;
	height:2.5em;
	margin:0.8em 0.8em 0 0;
	padding: 0 1em;
}
.filterBlock .tag li:hover{
	border-color:#999;
}
.filterBlock .tag li i{
	width: 15px;
    height: 15px;
    margin-right: 10px;
    flex-shrink: 0;
    box-shadow: 0 0 1px 1px rgba(20, 20, 20, 0.2) inset;
}
.filterBlock .tag li span{
	position: relative;
	display:block;
	margin-left: 0.5em;
	width:1em;
	aspect-ratio:1;
}
.filterBlock .tag li span:before,
.filterBlock .tag li span:after{
	position: absolute;
	content:"";
	display:block;
	width:100%;
	height:1px;
	background: currentColor;
	left:50%;
	top:50%;
}
.filterBlock .tag li span:before{ transform: translate(-50%, -50%) rotate(-45deg);}
.filterBlock .tag li span:after{ transform: translate(-50%, -50%) rotate(45deg);}
/**** tag end ****/
/***************** 進階篩選 end ******************/

/***************** 排序方式 start ******************/
.filterBlock .sort {
	margin-left: 18px;
}
.filterBlock .sort ul {
	right: -10px;
	padding: 20px 22px;
}
.filterBlock .sort ul:before {
	right: 15px;
}
.filterBlock .sort li {
	position: relative;
	white-space: nowrap;
	color: #666;
	padding-right: 32px;
	cursor: pointer;
	transition: color 0.2s;
}
.filterBlock .sort li+li {
	margin-top: 12px;
}
.filterBlock .sort li:hover,
.filterBlock .sort li.active {
	font-weight: bold;
	color: #000;
}
.filterBlock .sort li.active:before {
	position: absolute;
	content: "";
	display: block;
	right: 0;
	top: 4px;
	border: 1px solid;
	border-top: none;
	border-right: none;
	width: 14px;
	height: 7px;
	transform: rotate(-45deg);
}
/***************** 排序方式 end ******************/

/**************** 單欄商品列表 loading 狀態 start ******************/
section.loading {
	position: relative;
}
section.loading:before {
	position: absolute;
	content: "";
	display: block;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.9);
	z-index: 2;
}
section.loading:after {
	position: absolute;
	content: "";
	display: block;
	left: 0;
	top: 0;
	width: 100%;
	height: 28px;
	margin: 20% auto 0;
	background: url(../images/loading.gif) center no-repeat;
	z-index: 2;
}
/**************** 單欄商品列表 loading 狀態 end ******************/
/*********************** 商品數量 & 僅顯示現貨 & 進階篩選 & 排序方式 end *****************************/
 
/*********************************** 商品列表 start *****************************************/
.productList {
	text-align: center;
}
.productList.slick {
	margin: 2.5% 0;
}
.productList:after {
	content: "";
	clear: both;
	display: block;
}
.productList > li {
	position: relative;
	float: left;
	padding: 0 5px;
	margin-top: 2.5%;
	width: 20%;
}
.withCategory .result .productList.inStock > li.show[data-in-stock="false"],
.productList.inStock > li[data-in-stock="false"],
.productList >li.filterHide{
	display: none;
}
.productList li a {
	display: block;
	outline: none;
}
.productList li .img {
	position: relative;
	width: 100%;
	padding-top: 100%;
	overflow: hidden;
}
.productList li .img img {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	transition: transform 0.5s;
}
.productList li .img em {
	position: absolute;
	left: 5px;
	top: 5px;
	display: block;
	font-size: 12px;
	font-style: normal;
	line-height: 1em;
	color: #fff;
	background: #b22222;
	padding: 0.5em 0.7em;
	border-radius: 4px 0;
}

/****** 顏色色塊 start *******/
.color{
	height: 24px;
}
.color ul {
	height: inherit;
	overflow: hidden;
}
.productList.withColor .color {
	margin-top: 10px;
}
.color.only1Color ul {
	display: none;
}

.color ul li {
	display: inline-block;
	border: 1px solid #fff;
	margin: 0 0.5px;
	padding: 1px;
}
.color ul li:not(.more):hover,
.color ul li.now {
	border-color: #999;
}
.productList.inStock .color ul li[data-in-stock="false"],
.color ul li.filterHide,
.color ul li.clampHide{
	display: none;
}
.color ul li a,
.color ul li span {
	position: relative;
	display: block;
	height: 20px;
}
.color ul li a,
.color ul li:not(.more) span {
	width: 20px;
}
.color ul li.more {
	overflow: hidden;
}
.color.hideMore ul li.more {
	display: none;
}
.color ul li.more span {
	font-size: 12px;
	line-height: 0;
	padding: 0.75em 0.8em 0;
	background: #f4f4f4;
}
.color ul li.more:hover span {
	color: #fff;
	background: #ccc;
}
.color ul li a:after,
.color ul li:not(.more) span:after {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	box-shadow: 0 0 1px 1px rgba(20, 20, 20, 0.2) inset;
}
/****** 顏色色塊 end *******/

.productList li .name {
	width: 80%;
	margin: 10px auto 0;
	font-size: 13px;
	line-height: 1.4em;
	height: 2.8em;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
}
.productList li .price {
	margin-top: 10px;
	font-size: 13px;
	color: #b22222;
	line-height: 1em;
	height: 3.46em;
}
.productList li .price em {
	font-style: normal;
	color: #0a72ce;
}
.productList li .price strong {
	font-size: 18px;
	font-weight: bold;
}
.productList li .price del {
	margin-top: 10px;
	display: block;
	color: #0a72ce;
	height: 1.5em;
}
.productList li .cta {
	margin-top: 10px;
	height: 30px;
}
.productList li .cta > a {
	display: inline-block;
}
.productList li .cta .select {
	width: 35%;
	text-align: left;
}
.productList li .cta .formBtn {
	width: 22%;
	height: 26px;
	margin-left: 5px;
	background-image: url(../images/cart.svg);
	background-position: center;
	background-repeat: no-repeat;
}
.productList li .cta .store {
	position: relative;
	display: inline-block;
	margin-left: 5px;
}
.productList li .cta .store:before {
	position: relative;
	top: 5px;
	content: "";
	display: block;
	width: 19px;
	height: 18px;
	background: url(../images/productDetailAside.svg) no-repeat;
	cursor: pointer;
	transition: background-position 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.productList li .cta .store .content{
	display: none;
}
.productList li .cta .store ul {
	position: absolute;
	right: -15px;
	top: 35px;
	padding: 10px;
	background: #f4f4f4;
	white-space: nowrap;
	font-size: 12px;
	text-align: left;
	border-radius: 3px;
	border-bottom: 1px solid #d2d2d2;
	z-index: 1;
	display: none;
}
.productList li .cta .store ul:before {
	position: absolute;
	content: "";
	right: 15px;
	top: -10px;
	border: 10px solid transparent;
	border-top: none;
	border-bottom-color: #f4f4f4;
}
.productList li .cta .store ul li + li {
	margin-top: 0.2em;
}
.productList li .cta .store.active ul {
	display: block;
}
.productList li .cta .store:hover:before,
.productList li .cta .store.active:before {
	background-position: 0 bottom;
}
/*********************************** 商品列表 end *****************************************/

/*********************************** 看更多 start *****************************************/
.loadMore{
	display: flex;
	justify-content: center;
	margin-top:2.5em;
}
.loadMore button{
	cursor: pointer;
	background: #FFF;
	padding: 0.6em 1.8em 0.6em 1.2em;
	line-height: 1em;
	border: 1px solid #CCC;
	border-radius: 3px;
	transition:background 0.2s;
}
.loadMore button[disabled]{
	padding-right:1.2em;
	opacity: 0.5;
	cursor: not-allowed;
}
.loadMore button:not([disabled]):hover{
	background: #EEE;
}
.loadMore button span{
	position: relative;
}
.loadMore button:not([disabled]) span:after{
	position: absolute;
	left:100%;
	top:-0.1em;
	margin-left:0.1em;
	content:"+";
}
/*********************************** 看更多 end *****************************************/

/**************************** 覆寫 mCustomScrollbar start ********************************/
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: rgba(200, 200, 200, 0.75);
}
.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: rgba(102, 102, 102, 0.75);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail {
	background-color: rgba(0, 0, 0, 0.05);
}
/**************************** 覆寫 mCustomScrollbar end ********************************/

/*********************************** 無滑動頁籤按鈕(居中) start *****************************************/
.tabBtnBlock {
}
.tabBtnBlock ul {
	text-align: center;
}
.tabBtnBlock ul li {
	display: inline-block;
	width: 15%;
}
.tabBtnBlock ul li:not(:last-child) {
	padding: 0 2px 5px 0;
}
.tabBtnBlock ul li a {
	display: block;
	border-radius: 3px;
	background: #fff;
	font-size: 13px;
	line-height: 1em;
	padding: 0.8em 0;
	color: #666;
	transition: background 0.2s;
}
.tabBtnBlock ul li a:hover,
.tabBtnBlock ul li.now a {
	background: #f4f4f4;
	color: #000;
}
/*********************************** 無滑動頁籤按鈕(居中) end *****************************************/

/******************************** 滑動頁籤按鈕 start *******************************************/
* + .tabBlock {
	margin-top: 5%;
}
.tabBlock .tabBtn {
	position: relative;
	font-size: 13px;
	line-height: 1em;
}
.tabBlock .tabBtn .bg {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	background: #f4f4f4;
	border-radius: 3px;
	z-index: 0;
}
.tabBlock .tabBtn ul {
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.tabBlock .tabBtn ul li {
	float: left;
	font-weight: bold;
	padding: 0.8em 0;
	cursor: pointer;
	text-align: center;
	line-height: 1.5;
}
.tabBlock .tabBtn ul li:hover,
.tabBlock .tabBtn ul li.now {
	color: #000;
}
.tabBlock .tabCT {
	margin-top: 6.25%;
	font-size: 13px;
	line-height: 1.8em;
	height: 250px;
	overflow: auto;
}
.tabBlock .tabCT section > h3 {
	display: none;
}
.info .tabBlock .tabCT section .ct b {
	color: #333;
}
/******************************** 滑動頁籤按鈕 end *******************************************/

/********************************** 滑動頁籤按鈕(居中, 內容為列表) start **********************************/
.tabBlock.forList {
}
.tabBlock.forList .tabBtn {
	position: relative;
	font-size: 18px;
	line-height: 1em;
	display: inline-block;
	text-align: center;
	left: 50%;
	transform: translateX(-50%);
}
.tabBlock.forList .tabBtn .bg {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	background: #f4f4f4;
	border-radius: 3px;
	z-index: 0;
}
.tabBlock.forList .tabBtn ul {
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.tabBlock.forList .tabBtn ul li {
	float: left;
	padding: 0.6em 0;
	cursor: pointer;
	width: 130px;
}
.tabBlock.forList .tabBtn ul li:hover,
.tabBlock.forList .tabBtn ul li.now {
	color: #000;
}
.tabBlock.forList .tabCT {
	margin-top: 2.5%;
	height: auto;
	overflow: visible;
}
/********************************** 滑動頁籤按鈕(居中, 內容為列表) end **********************************/

/********************************** 表格樣式 start **********************************************/
.table {
	width: 100%;
	border-collapse: collapse;
}
.table tr:not(:first-child) {
	border-bottom: 1px solid #f4f4f4;
}
.table th,
.table td {
	vertical-align: top;
}
.table th {
	color: #fff;
	background: #ccc;
	padding: 10px 20px;
	font-size: 12px;
	text-align: left;
}
.table th:first-child,
.table th:last-child {
	border-radius: 3px;
}
.table th:not(:only-child):first-child {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.table th:not(:only-child):last-child {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.table td {
	padding: 10px 20px;
}
.table td i {
	font-style: normal;
	display: none;
}
* + .table.orderData,
* + .table.orderList {
	margin-top: 3%;
}
.table.orderData th,
.table.orderList th {
	padding: 10px;
}
.table.orderData td,
.table.orderList td {
	padding: 10px;
}
.table.orderData td:first-child {
	min-width: 7em;
}
.table.orderData td.ps {
	line-height: 1.6em;
}
.table.orderList td.total {
	font-weight: bold;
	color: #000;
	text-align: right;
	padding-right: 10px;
}

.table.orderData td.invoice span:not(:last-child):after{
	content:"，";
}
/********************************** 表格樣式 end **********************************************/

/********************************** 會員制度說明 表格 start *********************************************/
/*************** card start *****************/
.cardTable .card{
	border-radius: 2.85% / 4.54%;
	overflow:hidden;
}
.cardTable .card:before{
	content:"";
	display:block;
	padding-top:63.42%;
	background:url(../images/clubCard.png) no-repeat;
	background-size:cover;
	background-position-x:center;
}
.cardTable .card.c1:before{ background-position-y:top;}
.cardTable .card.c2:before{ background-position-y:center;}
.cardTable .card.c3:before{ background-position-y:bottom;}
/*************** card end *****************/

.cardTable{
	width:100%;
	color:#333;
	border-collapse:collapse;
	box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.05);
}
.cardTable td{
	font-size:14px;
	padding:10px 5px;
	text-align:center;
	border-bottom:1px solid #EEE;
}
.cardTable td.long{
	text-align:left;
}
.cardTable td.side{
	border-right:1px solid #EEE;
	color:#000;
}
.cardTable td.c1{ background:linear-gradient(to bottom, #f7f5ec, #ebe6da);}
.cardTable td.c2{ background:linear-gradient(to bottom, #f4efe2, #e4ddcc);}
.cardTable td.c3{ background:linear-gradient(to bottom, #cccccc, #b8b8b8);}
.cardType td{
	border-bottom:2px solid #666;
	background:#DDD;
}
.cardType td+td{
	border-left:2px solid #FFF;
}
.cardType h5{
	color:#000;
	font-size:1em;
}
.cardPic .side ~ td{
	width:21%;
}
.cardPic .card{
	margin:0 auto;
	max-width:100px;
	box-shadow: none;
}
.cardTable td a{
	color:inherit;
	text-decoration:underline;
}
.cardTable td a[href]:hover{
	text-decoration:none;
}
/********************************** 會員制度說明 表格 end *********************************************/

/********************************** 說明區塊 start **********************************************/
.statement {
	border-radius: 3px;
	background: #f4f4f4;
	padding: 1.5em 3em;
	font-size: 12px;
	color: #666;
	margin-top: 2%;
	line-height: 1.8em;
}
.statement.brief {
	text-align: center;
}
.statement strong {
	color: #333;
}
.statement strong:not(:first-child) {
	margin-top: 1em;
	display: inline-block;
}
.statement ol,
.statement ul {
	padding-left: 20px;
}
.statement ol {
	list-style: decimal;
}
.statement ul {
	list-style: disc;
}
.statement li .ex {
	color: #aaa;
}
/********************************** 說明區塊 end **********************************************/

/********************************** 購物車 & 會員 表單區塊 start **********************************************/
fieldset {
	border: none;
}
*:not([type="hidden"]) + fieldset {
	margin-top: 3%;
}
fieldset legend {
	border-radius: 3px;
	color: #fff;
	background: #ccc;
	padding: 10px 20px;
	font-size: 12px;
	width: 100%;
}
fieldset legend span {
	color: #333;
}
fieldset legend span label {
	display: inline-block;
	margin-left: 1em;
	cursor: pointer;
}
fieldset legend span label input[type="checkbox"],
fieldset legend span label input[type="radio"]{
	position: relative;
	top: 2px;
}
fieldset .ct {
	margin-top: 3%;
	color: #333;
}
fieldset .ct .item {
}
fieldset .ct .item + .item {
	margin-top: 2%;
}
fieldset .ct .item > label {
	width: 100px;
	display: inline-block;
	padding-left: 20px;
	vertical-align: top;
}
.inputWrapper {
	position: relative;
}
fieldset .inputWrapper {
	display: inline-block;
}
fieldset .inputWrapper .input,
fieldset .inputWrapper textarea {
	color: #333;
	background: #f4f4f4;
	border: none;
	border-radius: 3px;
	padding: 4px 10px 5px;
	width: 100%;
	outline-width: 1px;
}
fieldset .inputWrapper .input.error,
fieldset .inputWrapper textarea.error {
	border: 1px solid #C33;
}
fieldset .inputWrapper.addressPre,
fieldset .inputWrapper.mobile,
fieldset .inputWrapper.tel,
fieldset .extT {
	vertical-align: top;
}
fieldset .extT {
	position: relative;
	top: 2px;
}
fieldset label i {
	font-style: normal;
}
fieldset .inputWrapper .select {
	width: 100%;
}
fieldset .hintTxt {
	color: #999;
	font-size: 12px;
	vertical-align: top;
	display: inline-block;
	margin:4px 0 0 0.5em;
}
fieldset .hintTxt2 {
	color: #ffa500;
}
fieldset .ct .verifyP img {
	vertical-align: top;
	width: 70px;
	height: 26px;
}
fieldset .ct .verifyP .reloadVerifyP {
	border: none;
	background: url(../images/reload.svg) no-repeat center;
	cursor: pointer;
	display: inline-block;
	vertical-align: top;
	width: 26px;
	height: 26px;
}

label.error {
	position: relative;
	padding-left:1.6em;
	display: inline-block;
	white-space: nowrap;
	color: #c33;
	font-size: 12px;
	font-weight: bold;
	margin-top: 0.5em;
}
.memberData label.error {
	display: none;
}
label.error:before {
	position: absolute;
	left:0;
	top:0;
	content: "!";
	display: inline-block;
	width: 1.4em;
	height: 1.4em;
	border-radius: 50%;
	padding: 0.1em 0;
	margin-right: 0.2em;
	text-align: center;
	background: #c33;
	color: #fff;
	font-weight: bold;
}
/********************************** 購物車 & 會員 表單區塊 end **********************************************/

/********************************* 左欄 nav 之兩欄頁面 start ****************************************/
section.withNav {
	overflow: hidden;
}

section.withNav .main {
	float: right;
	width: 64.16%;
	margin-right: 2.5%;
}
section.withNav .main > h2 {
	font-size: 20px;
	margin-top: 3.5%;
}
section.withNav .main > .ct {
	margin-top: 5%;
	line-height: 1.8em;
	font-size: 13px;
}
section.withNav .main > .ct > .item {
	display: none;
}
section.withNav .main > .ct > .item.active {
	display: block;
}
section.withNav .main > .ct h3 {
	margin-top: 5%;
	font-size: 16px;
	color: #333;
}
section.withNav .main > .ct h4 {
	margin-top: 5%;
	font-size: 14px;
	color: #333;
}
section.withNav .main > .ct img {
	max-width: 100%;
	border: none;
}

section.withNav nav {
	float: left;
	width: 28.33%;
	min-height: 400px;
	margin-right: 5%;
	padding: 1.66% 20px 5%;
	background: #f4f4f4;
}
section.withNav nav ul {
	list-style: none;
}
section.withNav nav ul li {
	line-height: 1.6em;
}
section.withNav nav ul li a {
	display: block;
}
section.withNav nav > ul > li + li,
section.withNav nav ul li ul li {
	margin-top: 1em;
}
section.withNav nav > ul > li > a {
	padding: 0.6em 0;
	border-bottom: 3px solid #fff;
}
section.withNav nav ul li ul {
	font-size: 12px;
	margin-left: 2.5em;
}
section.withNav nav ul li a[href]:hover,
section.withNav nav ul li.now > a {
	color: #000;
	font-weight: bold;
}
/********************************* 左欄 nav 之兩欄頁面 end ****************************************/

/**************************** 左欄 類別選單 之兩欄頁面 start **************************************/
.withCategory {
	display: flex;
}
.withCategory.hide {
	display: none;
}

/******************** 選單 start *********************/
.withCategory .category {
	width: 15.5%;
	border-right: 1px solid #ddd;
	margin: 0 2% 0 2.5%;
	font-size: 14px;
	color: #666;
}
.withCategory .category > ul.fixed {
	position: fixed;
}
.withCategory .category > ul > li + li {
	margin-top: 1.5em;
}
.withCategory .category > ul > li {
	position: relative;
}
.withCategory .category > ul > li:last-child {
	margin-bottom: 3em;
}
.withCategory .category > ul > li span {
	display: block;
	cursor: pointer;
}
.withCategory .category select {
	display: none;
}
.withCategory .subWrapper {
	position: absolute;
	left: 5.8em;
	top: -1.75em;
	white-space: nowrap;
	background: #f4f4f4;
	border-radius: 3px;
	padding: 2em;
	font-size: 13px;
	line-height: 1em;
	z-index: 1;
	display: none;
}
.withCategory .subWrapper:before {
	position: absolute;
	right: 100%;
	top: 2em;
	content: "";
	display: block;
	border: 8px solid transparent;
	border-left: none;
	border-right: 9px solid #f4f4f4;
}
.withCategory .subWrapper ul li {
	cursor: pointer;
}
.withCategory .subWrapper ul li + li {
	margin-top: 1.5em;
}
.withCategory .category > ul > li.active span,
.withCategory .subWrapper ul li.active {
	color: #000;
	font-weight: bold;
}
/******************** 選單 end *********************/

/****************** result start *******************/
.withCategory .result {
	width: 80%;
	min-height: 300px;
}
.withCategory .result h3 {
	color: #000;
	font-size: 22px;
	text-align: center;
}
.withCategory .result .productList > li {
	width: 25%;
	display: none;
}
.withCategory .result .productList > li.show {
	display: block;
}
.withCategory .result .productList > li.show.filterHide {
	display: none;
}
.withCategory .result.loading {
	position: relative;
}
.withCategory .result.loading:before {
	position: absolute;
	content: "";
	display: block;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.9);
	z-index: 2;
}
.withCategory .result.loading:after {
	position: absolute;
	content: "";
	display: block;
	left: 0;
	top: 0;
	width: 100%;
	height: 28px;
	margin: 20% auto 0;
	background: url(../images/loading.gif) center no-repeat;
	z-index: 2;
}
/****************** result end *******************/
/**************************** 左欄 類別選單 之兩欄頁面 end **************************************/

/********************************** 頁面兩側之前後按鈕 start *******************************************/
.sidePN {
	position: fixed;
	left: 0;
	top: 50%;
	width: 100%;
	transform: translateY(-50px);
	z-index: 1;
}
.sidePN li {
	position: absolute;
	transition: transform 0.2s;
}
.sidePN li.prev {
	left: 0;
	transform: translateX(-100%);
}
.sidePN li.next {
	right: 0;
	transform: translateX(100%);
}
.sidePN.show li.prev,
.sidePN.show li.next {
	transform: none;
}
.sidePN li a {
	position: relative;
	display: block;
	background: #f4f4f4;
	padding: 5px;
}
.sidePN li.prev a {
	border-radius: 0 4px 4px 0;
}
.sidePN li.next a {
	border-radius: 4px 0 0 4px;
}
.sidePN li a .ctContainer {
	position: relative;
	width: 0;
	height: 90px;
	overflow: hidden;
	transition: width 0.2s;
}
.sidePN li a:hover .ctContainer,
.sidePN li a .ctContainer .ct {
	width: 210px;
}
.sidePN li.prev a .ctContainer {
	margin-left: 40px;
}
.sidePN li.next a .ctContainer {
	margin-right: 40px;
}
.sidePN li a .ctContainer .ct {
	position: absolute;
	top: 0;
	height: 100%;
}
.sidePN li.prev a .ctContainer .ct {
	right: 0;
}
.sidePN li.next a .ctContainer .ct {
	left: 0;
}
.sidePN li a .ctContainer .ct .img {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding-top: 33.33%;
}
.sidePN li a .ctContainer .ct em {
	display: block;
	font-style: normal;
	font-size: 12px;
	overflow: hidden;
	white-space: nowrap;
	margin-top: 5px;
}
.sidePN a:before,
.sidePN a:after {
	position: absolute;
	content: "";
	width: 15px;
	height: 3px;
	background: #999;
	border-radius: 4px;
}
.sidePN li.prev a:before,
.sidePN li.prev a:after {
	left: 25px;
}
.sidePN li.next a:before,
.sidePN li.next a:after {
	right: 10px;
}
.sidePN a:before {
	top: 41px;
	transform-origin: left top;
}
.sidePN a:after {
	top: 60px;
	transform-origin: left bottom;
}
.sidePN li.prev a:before {
	transform: scaleX(-1) rotate(45deg);
}
.sidePN li.prev a:after {
	transform: scaleX(-1) rotate(-45deg);
}
.sidePN li.next a:before {
	transform: rotate(45deg);
}
.sidePN li.next a:after {
	transform: rotate(-45deg);
}
.sidePN a:hover:before,
.sidePN a:hover:after {
	background: #666;
}
.sidePN a:hover {
	color: currentColor;
}

/*************** 正方圖類型 start ********************/
.sidePN.square li a:hover .ctContainer,
.sidePN.square li a .ctContainer .ct {
	width: 200px;
}
.sidePN.square li a .ctContainer .ct .img {
	position: absolute;
	top: 0;
	background-color: #fff;
	background-size: contain;
	width: 90px;
	padding-top: 45%;
}
.sidePN.square li.prev a .ctContainer .ct .img {
	left: 0;
}
.sidePN.square li.next a .ctContainer .ct .img {
	right: 0;
}
.sidePN.square li a .ctContainer .ct em {
	position: absolute;
	top: 50%;
	overflow: visible;
	white-space: normal;
	line-height: 1.6em;
	margin-top: 0;
	transform: translateY(-50%);
}
.sidePN.square li.prev a .ctContainer .ct em {
	left: 100px;
}
.sidePN.square li.next a .ctContainer .ct em {
	right: 100px;
	text-align: right;
}
/*************** 正方圖類型 end ********************/
/********************************** 頁面兩側之前後按鈕 end *******************************************/

/********************************** overlay start **********************************************/
.overlay {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 2;
}
.overlay .overlayCT {
	position: relative;
	width: 95%;
	height: 85%;
}

.overlay .closeBtn {
	position: absolute;
	right: 0;
	bottom: calc(100% + 10px);
	width: 20px;
	height: 20px;
	cursor: pointer;
}
.overlay .closeBtn:before,
.overlay .closeBtn:after {
	position: absolute;
	content: "";
	right: 0;
	top: 10px;
	width: 22px;
	height: 2px;
	background: #999;
	border-radius: 1px;
}
.overlay .closeBtn:before {
	transform: rotate(-45deg);
}
.overlay .closeBtn:after {
	transform: rotate(-135deg);
}
.overlay .closeBtn:hover:before,
.overlay .closeBtn:hover:after {
	background: #666;
}

/***************** overlayCenter start **********************/
.overlayCenter .overlayCT {
	background: #fff;
	border-radius: 5px;
	padding: 30px;
}
.overlayCenter .overlayCT iframe {
	border: none;
	display: block;
	width: 100%;
	height: 100%;
}

.overlayCenter.img .overlayCT {
	width: auto;
	height: auto;
	border-radius: 0;
	padding: 0;
}
.overlayCenter.img .overlayCT img {
	display: block;
	max-width: 95vw;
	max-height: 85vh;
}

/********* 正方形內容 start ***********/
.overlayCenter.square .overlayCT {
	width: 90vh;
	height: auto;
	max-width: 1000px;
	max-height: 1000px;
	border-radius: 0;
	padding: 0;
}
.overlayCenter.square .overlayCT:before {
	content: "";
	display: block;
	padding-top: 100%;
}
.overlayCenter.square .overlayCT .slick {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.overlayCenter.square .overlayCT .slick .slick-list,
.overlayCenter.square .overlayCT .slick .slick-track {
	height: 100%;
}
.overlayCenter.square .overlayCT .slick li.slick-slide{
	background: url(../images/loading.gif) no-repeat center;
}
.overlayCenter.square .overlayCT .slick li > div {
	position: relative;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.overlayCenter.square .overlayCT .slick li > div iframe {
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.overlayCenter.square .overlayCT .txtBlock {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100vw;
	padding: 1em;
	text-align: center;
	background: rgba(244, 244, 244, 0.8);
	color: #000;
	line-height: 1.6em;
	transform: translateY(100%);
	transition: transform 0.5s;
}
.overlayCenter.square .overlayCT .txtBlock.show {
	transform: translateY(0%);
}
/********* 正方形內容 end ***********/

/********* 聯絡我們 start ***********/
.overlayCenter.form .overlayCT {
	max-width: 500px;
	transition: all 0.2s;
}
fieldset.contact .ct .item + .item {
	margin-top: 3%;
}
fieldset.contact .ct .inputWrapper {
	width: calc(100% - 120px);
}
fieldset.contact .ct .inputWrapper.qCT textarea {
	height: 50px;
	line-height: 1.6em;
}
fieldset.contact .ct .inputWrapper.companyTel {
 width: calc((100% - 120px) * 0.59);
}
fieldset.contact .ct .inputWrapper.companyTelExt {
 width: calc((100% - 120px) * 0.39 - 30px);
}
fieldset.contact .ct .inputWrapper.sendDate {
 width: calc((100% - 120px) * 0.33 - 20px);
}
fieldset.contact .ct .inputWrapper.piece,
fieldset.contact .ct .inputWrapper.budget {
 width: calc((100% - 120px) * 0.495);
}
fieldset.contact .ct .inputWrapper input[type="file"] {
	cursor: pointer;
}
fieldset.contact .ct .inputWrapper.verify {
	width: calc((100% - 120px) - 105px);
}
fieldset.contact .ct .item.use {
	overflow: hidden;
}
fieldset.contact .ct .item.use > label {
	float: left;
}
fieldset.contact .ct .item.use .itemCT {
	display: block;
	overflow: hidden;
}
fieldset.contact .ct .item.use .itemCT > span {
	display: inline-block;
	margin: 0 5px 5px 0;
}
fieldset.contact .ct .item.use .itemCT > span label {
	cursor: pointer;
}
fieldset.contact .ct .item.use .itemCT > span.inputWrapper {
	width: calc(100% - 73px);
}
fieldset.contact .ct .ps {
	margin: 3% 20px 0;
}
fieldset.contact .btmBtn {
	margin-top: 5%;
	text-align: center;
}

fieldset.contact.done .ct h3,
fieldset.contact.done .ct p{
	text-align: center;
}
fieldset.contact.done .ct p br{
	display: none;
}
fieldset.contact.done .ct.withAtt ol{
	list-style: decimal;
	padding-left:1.5em;
	line-height: 1.8em;
}
/********* 聯絡我們 end ***********/

/********* 一般內容 start ***********/
.overlayCenter.data .overlayCT {
	max-width: 960px;
}
/********* 一般內容 end ***********/

/********* QRcode start ***********/
.overlayCenter.QRcode .overlayCT {
	max-width: 730px;
}
/********* QRcode end ***********/

/********* 門市庫存查詢 start ***********/
.overlayCenter.store .overlayCT {
	max-width: 1050px;
	height: auto;
}
.overlayCenter.store .fieldsetWrapper{
	max-height: 100%;
	overflow: auto;
}
.overlayCenter.store ul{
	list-style: disc;
	padding-left:2em;
	line-height: 1.8em;
}
.overlayCenter.store .table{
	margin-top:3%;
}
.overlayCenter.store th{
	white-space: nowrap;
}
.overlayCenter.store .map{
	font-size:12px;
	color:#FFF;
	display:inline-block;
	line-height:1em;
	padding:2px 6px;
	background:#CCC;
	transition:background 0.2s;
}
.overlayCenter.store .map:hover{
	background:#666;
}
/********* 門市庫存查詢 end ***********/

/********* 快速檢視 start ***********/
.overlayCenter.quickView .overlayCT {
	max-width: 1100px;
	max-height: 550px;
}
/********* 快速檢視 end ***********/

#gMap {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
/***************** overlayCenter end **********************/

/***************** overlayFull start ***********************/
.overlayFull .overlayCT {
	width: 100%;
	height: 100%;
}
.overlayFull .overlayCT .slick li > div {
	position: relative;
	height: 100vh;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.overlayFull .overlayCT .slick li > div iframe {
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.overlayFull .overlayCT .txtBlock {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 1em;
	text-align: center;
	background: rgba(244, 244, 244, 0.8);
	color: #000;
	line-height: 1.6em;
	transform: translateY(100%);
	transition: transform 0.5s;
}
.overlayFull .overlayCT .txtBlock.show {
	transform: translateY(0%);
}
/***************** overlayFull end ***********************/

/****************** overlayModal start **********************/
.overlayModal .overlayCT {
	width: auto;
	height: auto;
	min-width: 400px;
	max-width:95%;
	background: #fff;
	border-radius: 5px;
	padding: 30px;
	text-align: center;
}
.overlayModal .overlayCT .modalTxt {
	line-height: 1.8em;
}
.overlayModal .overlayCT .formBtnGroup {
	margin-top: 2em;
}

/******** 重要訊息 bulletin start *********/
.bulletin:not(.overlayModal){
	display:none;
}
.bulletin .overlayCT{
	min-width: 0;
	padding: 0;
	text-align: left;
}
.bulletin .modalTxt{
	display: flex;
	align-items: flex-start;
	overflow: hidden;
	border-radius: inherit;
}
.bulletin .modalTxt > a{
	display: block;
	width:300px;
}
.bulletin .modalTxt > a img{
	display: block;
	width:100%;
}
.bulletin .txt{
	min-width:21em;
	max-width:33em;
	max-height: 250px;
	overflow: auto;
	padding: 2.57em;
	align-self: stretch;
}
.bulletin .txt *{
	margin:0;
}
.bulletin .txt *+p{
	margin-top:1.5em;
}
.bulletin .txt a{
	text-decoration: underline;
}
.bulletin .txt a:hover{
	text-decoration: none;
}
/******** 重要訊息 bulletin end *********/
/****************** overlayModal end ***********************/
/********************************** overlay end **********************************************/

/********************************** 左下訂閱電子報 start **********************************************/
.extraSubscribe {
	position: fixed;
	left: 0;
	bottom: 0;
	display: flex;
	flex-direction: row-reverse;
	z-index: 1;
	transition: transform 0.5s;
	transform: translateY(100%);
}
.extraSubscribe.show {
	transform: translateY(-18px);
}
.extraSubscribe .closeBtn {
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	background: rgba(150, 150, 150, 0.8);
	width: 2.14em;
}
.extraSubscribe .closeBtn span {
	position: relative;
	display: block;
	width: 1.3em;
	height: 1.3em;
	transition: transform 0.2s;
}
.extraSubscribe .closeBtn:hover span {
	transform: rotate(-90deg);
}
.extraSubscribe .closeBtn span:before,
.extraSubscribe .closeBtn span:after {
	position: absolute;
	left: 0;
	top: 50%;
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background: #fff;
}
.extraSubscribe .closeBtn span:before {
	transform: translateY(-50%) rotate(-45deg);
}
.extraSubscribe .closeBtn span:after {
	transform: translateY(-50%) rotate(45deg);
}
.extraSubscribe .main {
	display: flex;
	align-items: center;
	background: rgba(100, 100, 100, 0.8);
	border-radius: 0.85em;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	padding: 0 2.14em;
	height: 3.57em;
	color: #fff;
	transition: background 0.2s;
}
.extraSubscribe:not(.expand) .main {
	cursor: pointer;
}
.extraSubscribe:not(.expand) .main:hover {
	background: rgba(100, 100, 100, 0.9);
}
.extraSubscribe.expand .main strong,
.extraSubscribe .main .form {
	display: none;
}
.extraSubscribe.expand .main .form {
	display: block;
}
.extraSubscribe.expand .main .form input[type="email"] {
	border: none;
	border-bottom: 1px solid #aaa;
	background: transparent;
	padding: 0.1em;
	outline: none;
	color: #fff;
	width: 13em;
}
.extraSubscribe input[type="email"]::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #fff;
	opacity: 1; /* Firefox */
}
.extraSubscribe input[type="email"]::-ms-input-placeholder { /* Microsoft Edge */
	color: #fff;
}
.extraSubscribe input[type="email"]:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #fff;
}
.extraSubscribe.expand .main .form button {
	border: none;
	border-left: 1px solid #aaa;
	background: transparent;
	margin-left: 0.8em;
	padding: 0.1em 0 0.1em 1em;
	outline: none;
	color: #fff;
	cursor: pointer;
	font-weight: bold;
}
/********************************** 左下訂閱電子報 end **********************************************/

/*************************************** 處理中 start *********************************************/
.loadingWrapper {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.9);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	z-index: 2;
}
.loadingWrapper:before {
	content: "";
	display: block;
	width: 40px;
	height: 28px;
	background: url(../images/loading.gif) center no-repeat;
	margin-top: -10em;
}
.loadingWrapper span {
	display: block;
	margin-top: 1em;
}
/*************************************** 處理中 end *********************************************/

/*************************************** 分頁 start *********************************************/
.pagination {
	display: flex;
	margin-top: 2em;
	justify-content: center;
}
.pagination li {
	margin: 0 0.3em;
}
.pagination li.disabled {
	opacity: 0.25;
}
.pagination li:first-child,
.pagination li:last-child {
	width: 2em;
	height: 2em;
	flex-shrink: 0;
}
.pagination li:first-child {
	margin-right: 1em;
}
.pagination li:last-child {
	margin-left: 1em;
}
.pagination li > * {
	border-radius: 3px;
	padding: 0.5em;
	display: block;
	line-height: 1em;
	transition: all 0.2s;
}
.pagination li:first-child > *,
.pagination li:last-child > * {
	font-size: 0;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.pagination li:last-child > * {
	transform: scaleX(-1);
}
.pagination li:first-child > *:before,
.pagination li:last-child > *:before {
	content: "";
	display: block;
	width: 30%;
	height: 30%;
	border: 1px solid;
	border-right: none;
	border-bottom: none;
	transform: translateX(20%) rotate(-45deg);
}
.pagination a[href]:hover,
.pagination li.active > * {
	background: #ccc;
	color: #fff;
}
/*************************************** 分頁 end *********************************************/


@media screen and (min-width: 1025px) {
	
	a[href]:hover{
		color: #999;
	}
	a[href].tLink1:hover {
		text-decoration: none;
	}
	a[href].tLink2:hover {
		background: #666;
	}
	
	/*********************************** slick start *****************************************/
	.slick:hover .slickPN {
		opacity: 1;
	}
	.slickPN:hover {
		background: #ccc;
	}
	.slickPN:hover:before,
	.slickPN:hover:after {
		background: #fff;
	}
	/*********************************** slick end *****************************************/

	/*********************************** 商品列表 start *****************************************/
	.productList li[data-quick-view] .img,
	.productList li[data-quick-view] .name{
		cursor: pointer;
	}
	
	.productList li a:hover .img img,
	.productList li[data-quick-view]:hover .img img{
		transform: scale(1.05);
	}
	.productList li[data-quick-view]:hover .name{
		color:#999;
	}
	/*********************************** 商品列表 end *****************************************/
	
}


@media screen and (min-width: 1024px) {
	
	/**************************** 左欄 類別選單 之兩欄頁面 start **************************************/
	/******************** 選單 start *********************/
	.withCategory .category > ul.fixed {
		width: 10em;
		z-index: 1;
	}
	.withCategory .category > ul > li:hover .subWrapper {
		display: block;
	}
	.withCategory .category > ul > li:hover span,
	.withCategory .subWrapper ul li:hover {
		color: #000;
	}
	.withCategory .category > ul > li:hover span {
		font-weight: bold;
	}
	/******************** 選單 end *********************/
	/**************************** 左欄 類別選單 之兩欄頁面 end **************************************/
	
}


@media screen and (max-width: 1140px) {
	
	/********************************** overlay start **********************************************/
	/***************** overlayCenter start **********************/
	/********* 快速檢視 start ***********/
	.overlayCenter.quickView .overlayCT {
		max-height: none;
	}
	/********* 快速檢視 end ***********/
	/***************** overlayCenter end **********************/
	/********************************** overlay end **********************************************/
	
}


@media screen and (max-width: 1024px) {
	
	/*********************************** slick start *****************************************/
	.productList.slick .slickPN {
		opacity: 1;
	}
	/*********************************** slick end *****************************************/

}


@media screen and (max-width: 1023px) {
	
	/*********************************** 價格區間搜尋 start *****************************************/
	.priceBlock .method {
		display: block;
	}
	.priceBlock .method > i,
	.priceBlock .method .ct {
		width: auto;
	}
	.priceBlock .method .ct {
		margin-top: 6%;
	}
	
	/**************** 輸入區 start ****************/
	.priceBlock .useInput {
		margin-top: 6%;
	}
	.priceBlock .useInput .ct {
		flex-wrap: wrap;
	}
	.priceBlock .useInput .ct .from,
	.priceBlock .useInput .ct .to {
		width: 47%;
	}
	.priceBlock .useInput .ct .to {
		margin-left: 6%;
	}
	.priceBlock .useInput .ct .from:before,
	.priceBlock .useInput .ct .to:before {
		font-size: 1em;
	}
	.priceBlock .useInput .ct .to:after {
		width: 6%;
	}
	.priceBlock .useInput .ct .input {
		font-size: 1.4em;
		margin-left: 0.4em;
	}
	.priceBlock .useInput .formBtn {
		flex-basis: 100%;
		margin: 5% 0 0;
	}
	/**************** 輸入區 end ****************/
	/*********************************** 價格區間搜尋 end *****************************************/

	/********************************** 滑動頁籤按鈕 start ************************************/
	.tabBlock .tabBtn {
		display: none;
	}
	.tabBlock .tabCT {
		margin-top: 0;
		height: auto;
	}
	.tabBlock .tabCT section {
		display: block !important;
	}
	.tabBlock .tabCT section + section {
		margin-top: 5%;
	}
	.tabBlock .tabCT section > h3 {
		display: block;
		color: #000;
		font-size: 15px;
		padding: 0.4em 1em;
		background: #f4f4f4;
		border-radius: 3px;
		margin-bottom: 5%;
	}
	/********************************** 滑動頁籤按鈕 end ************************************/

	/********************************** 滑動頁籤按鈕(居中, 內容為列表) start **********************************/
	.tabBlock.forList .tabBtn {
		display: none;
	}
	.tabBlock.forList .tabCT {
		margin-top: 0;
	}
	.tabBlock.forList .tabCT section {
		margin-top: 5%;
	}
	.tabBlock.forList .tabCT section > h3 {
		margin-bottom: 2.5%;
	}
	/********************************** 滑動頁籤按鈕(居中, 內容為列表) end **********************************/

	/*********************************** slick start *****************************************/
	/***************** gallery 使用 start ******************/
	.gallery .ct {
		padding-top:5%;
		padding-bottom:30px;
	}
	.galleryList.slick li {
		padding: 1px;
	}
	/***************** gallery 使用 end ******************/
	/*********************************** slick end *****************************************/
	
	/************************ 商品數量 & 僅顯示現貨 & 進階篩選 & 排序方式 start ***************************/
	.filterBlock p {
		width:100%;
	}
	.filterBlock .operate {
		width:100%;
		margin-top:1em;
	}
	.filterBlock .operate:not(:has(>.cb)) {
		margin-top:-1.48em;
	}
	.filterBlock .operate>.cb{
		margin-right:auto;
	}

	/***************** 進階篩選 start ******************/
	.filterBlock .advancedFilter .CT {
		right:-105px;
		padding:1.5em;
	}
	
	.filterBlock .advancedFilter .CT:before{
		right:110px;
	}

	.filterBlock .groupWrapper{
		display:block;
		max-height: 50vh;
		overflow: auto;
	}
	.filterBlock .group{
		width:calc(100vw - 5em);
		max-width: none;
	}
	.filterBlock .group+.group,
	.filterBlock .groupWrapper.less .group+.group{
		margin: 2em 0 0;
	}
	.filterBlock .groupWrapper h6+*{
		max-height:none;
	}
	
	.filterBlock .CT button{
		align-self: stretch;
		margin-top:2em;
	}
	/***************** 進階篩選 end ******************/
	/*********************** 商品數量 & 僅顯示現貨 & 進階篩選 & 排序方式 end *****************************/

	/********************************* 左欄 nav 之兩欄頁面 start ****************************************/
	section.withNav .main {
		float: none;
		width: auto;
		margin: 0;
		padding: 0 10px;
	}
	section.withNav nav {
		float: none;
		width: auto;
		min-height: 0;
		margin: 5% 0 0;
		padding: 10px 10px 10%;
	}
	/********************************* 左欄 nav 之兩欄頁面 end ****************************************/

	/**************************** 左欄 類別選單 之兩欄頁面 start **************************************/
	.withCategory {
		display: block;
	}
	
	/******************** 選單 start *********************/
	.withCategory .category {
		position: relative;
		width: auto;
		border-right: none;
		margin: 0;
		z-index: 3;
	}
	.withCategory .category > ul {
		position: relative;
		border: 1px solid #ddd;
		border-left: none;
		border-right: none;
		margin: 0;
		padding: 0 0 1em 0.5em;
		background: #fff;
		width: 100%;
		height: 50px;
		display: flex;
		overflow: auto;
	}
	.withCategory .category > ul::-webkit-scrollbar {
		display: none;
	}
	.withCategory .category > ul > li,
	.withCategory .category > ul > li + li {
		margin-top: 1em;
	}
	.withCategory .category > ul > li {
		display: inline-block;
		white-space: nowrap;
		width: 6em;
		text-align: center;
		flex-shrink: 0;
	}
	.withCategory .category > ul > li:last-child {
		margin-bottom: 0;
	}
	.withCategory .category.showDragHint > ul:after {
		content: "";
		display: block;
		padding-left: 6em;
	}
	.withCategory .subWrapper {
		display: none;
	}
	.withCategory .category select {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		opacity: 0;
		display: block;
	}

	/******** 滑動提示 start ******/
	.dragHint {
		position: absolute;
		right: 0;
		top: 1px;
		width: 100%;
		height: calc(100% - 2px);
		pointer-events: none;
	}
	.category[style] .dragHint {
		position: fixed;
		right: 0;
		top: 47px;
		height: 49px;
	}
	.dragHint:before,
	.dragHint:after {
		position: absolute;
		content: "";
		display: block;
	}
	.dragHint:before {
		right: 0;
		top: 0;
		width: 8em;
		height: calc(100% - 1px);
		background: linear-gradient(to left, #FFF 20%, rgba(255, 255, 255, 0));
	}
	.dragHint:after {
		right: 1em;
		top: 1.1em;
		width: 1.4em;
		height: 1.4em;
		background: url(../images/icon_drag_hint.svg) no-repeat center/contain;
		animation: dragHint 2s ease-in-out 1s 3 backwards;
	}
	@keyframes dragHint {
		 0% {
			opacity:0;
		}
		 30% {
			opacity:1;
		}
		 100% {
			opacity:0;
			transform: translateX(-180%);
		}
	}
	/******** 滑動提示 end ******/
	/******************** 選單 end *********************/

	/****************** result start *******************/
	.withCategory .result {
		width: auto;
		margin-top: 10%;
	}
	.withCategory .result h3 {
		font-size: 18px;
	}
	.withCategory .result .productList > li {
		width: 33.33%;
	}
	/****************** result end *******************/
	/*********************************** 左欄 類別選單 之兩欄頁面 end *****************************************/

	/********************************** 頁面左右兩側之前後按鈕 start *******************************************/
	.sidePN {
		display: none;
	}
	/********************************** 頁面左右兩側之前後按鈕 end *******************************************/
	
	/********************************** overlay start **********************************************/
	/***************** overlayCenter start **********************/
	/********* 快速檢視 start ***********/
	.overlayCenter.quickView .overlayCT {
		padding:10px;
	}
	/********* 快速檢視 end ***********/
	/***************** overlayCenter end **********************/
	/********************************** overlay end **********************************************/
	
}


@media screen and (min-width: 1001px) and (max-width: 1200px) {
	
	/*********************************** 商品列表 start *****************************************/
	.productList > li {
		width: 25%;
	}
	/*********************************** 商品列表 end *****************************************/
	
}


@media screen and (min-width: 769px) and (max-width: 1000px) {
	
	/*********************************** 商品列表 start *****************************************/
	.productList > li {
		width: 33.33%;
	}
	/*********************************** 商品列表 end *****************************************/

	/*********************************** 左欄 類別選單 之兩欄頁面 start *****************************************/
	/****************** result start *******************/
	.withCategory .result .productList > li {
		width: 33.33%;
	}
	/****************** result end *******************/
	/*********************************** 左欄 類別選單 之兩欄頁面 end *****************************************/

}


@media screen and (max-width: 899px) {

	/*********************************** 表格樣式 start ************************************/
	.table.orderData td.invoice span{
		display:block;
	}
	.table.orderData td.invoice span:not(:last-child):after{
		display:none;
	}
	/*********************************** 表格樣式 end ************************************/
	
}


@media screen and (max-width: 800px) {
	
	/********************************** overlay start **********************************************/
	/****************** overlayModal start ***********************/
	/******** 重要訊息 bulletin start *********/
	.bulletin .overlayCT{
		max-width: 300px;
	}
	.bulletin .modalTxt{
		display: block;
		max-height:450px;
		overflow: auto;
	}
	.bulletin .modalTxt > a{
		width:auto;
	}
	.bulletin .txt{
		min-width:0;
		max-width:none;
		max-height:none;
		padding: 2em 1.5em;
	}
	/******** 重要訊息 bulletin end *********/
	/****************** overlayModal end ***********************/
	/********************************** overlay end **********************************************/
	
}


@media screen and (max-width: 768px) {
	
	/*********************************** 商品列表 start *****************************************/
	.productList > li {
		width: 50%;
		margin-top: 5%;
	}
	/*********************************** 商品列表 end *****************************************/
	
	/*********************************** 左欄 類別選單 之兩欄頁面 start *****************************************/
	/****************** result start *******************/
	.withCategory .result .productList > li {
		width: 50%;
	}
	/****************** result end *******************/
	/*********************************** 左欄 類別選單 之兩欄頁面 end *****************************************/

}


@media screen and (max-width: 767px) {

	/*********************************** 表格樣式 start ************************************/
	.table:not(.orderData),
	.table:not(.orderData) tbody,
	.table:not(.orderData) tr,
	.table:not(.orderData) th,
	.table:not(.orderData) td {
		display: block;
	}
	.table:not(.orderData) tr {
		padding: 10px 0;
	}
	.table:not(.orderData) tr:first-child {
		display: none;
	}
	.table:not(.orderData) tr:after {
		content: "";
		clear: both;
		display: block;
	}
	.table:not(.orderData) td {
		padding: 5px 0;
	}
	.table:not(.orderData):not(.cartList):not(.cartFav) td i {
		display: inline-block;
		padding: 0.2em 0.5em;
		margin-right: 5px;
		background: #ccc;
		color: #fff;
		border-radius: 3px;
		min-width: 5em;
		text-align: center;
	}
	.table.cartList td i,
	.table.cartFav td i {
		display: inline;
	}
	/*********************************** 表格樣式 end ************************************/
	
	/********************************** 會員制度說明 表格 start *********************************************/
	.cardTable td{
		font-size:12px;
	}
	/********************************** 會員制度說明 表格 end *********************************************/

	/********************************** 說明區塊 start **********************************************/
	.statement {
		padding-left: 10px;
		padding-right: 10px;
	}
	/********************************** 說明區塊 end **********************************************/

	/********************************** 購物車 & 會員 表單區塊 start **********************************************/
	fieldset:not(.contact) legend {
		padding: 10px;
	}
	fieldset:not(.contact) legend span label {
		margin-left: 0.5em;
	}
	fieldset:not(.contact) .ct .item > label {
		width: 100%;
		display: block;
		padding-left: 0;
	}
	fieldset:not(.contact) .ct .item + .item {
		margin-top: 4%;
	}
	fieldset:not(.contact) .ct .item .itemCT {
		width: 100%;
		display: block;
		margin-top: 5px;
	}
	fieldset .zoneCode{
		vertical-align: middle;
	}
	fieldset:not(.contact) .inputWrapper .input {
		padding-left: 5px;
		padding-right: 5px;
	}
	fieldset:not(.contact) .hintTxt {
		margin: 5px 0 0;
		width: 100%;
	}
	
	label.error {
		white-space:normal;
	}
	/********************************** 購物車 & 會員 表單區塊 end **********************************************/

	/********************************** overlay start **********************************************/
	/***************** overlayCenter start **********************/
	.overlayCenter.data .overlayCT {
		width: 100%;
		height: 100%;
		max-height: none;
		border-radius: 0;
		padding: 40px 10px 10px;
	}
	.overlayCenter.data .overlayCT .closeBtn{
		right:10px;
		top:10px;
		bottom:auto;
	}
	
	/********* 正方形內容 start ***********/
	.overlayCenter.square .overlayCT {
		width: 95vw;
	}
	/********* 正方形內容 end ***********/
	
	/********* 門市庫存查詢 start ***********/
	.overlayCenter.store td{
		display: flex !important;
		align-items: flex-start;
	}
	.overlayCenter.store .map{
		margin: 2px 0 0 5px;
	}
	/********* 門市庫存查詢 end ***********/
	/***************** overlayCenter end **********************/
	/********************************** overlay end **********************************************/
	
}


@media screen and (max-width: 500px) {
	
	/********************************** overlay start **********************************************/
	/***************** overlayCenter start **********************/
	/********* 聯絡我們 start ***********/
	.overlayCenter.form .overlayCT:not(.done) {
		width: 100%;
		height: 100% !important;
		max-height: none;
		border-radius: 0;
		padding: 40px 10px 10px;
	}
	.overlayCenter.form .overlayCT:not(.done) .closeBtn{
		right:10px;
		top:10px;
		bottom:auto;
	}
	/********* 聯絡我們 end ***********/
	/***************** overlayCenter end **********************/

	/****************** overlayModal start **********************/
	.overlayModal .overlayCT {
		width: 95%;
		min-width: 0;
	}
	/****************** overlayModal end ***********************/
	/********************************** overlay end **********************************************/
	
}


@media screen and (max-width: 400px) {
	
	/********************************** overlay start **********************************************/
	/***************** overlayCenter start **********************/
	/********* 聯絡我們 start ***********/
	fieldset.contact:not(.done) {
		padding-bottom: 5em;
	}
	fieldset.contact .ct .inputWrapper.qCT textarea {
		height: 100px;
	}
	fieldset.contact .ct .inputWrapper.sendDate {
		width: calc(100% - 140px);
	}
	fieldset.contact .ct .inputWrapper.sendDate.month,
	fieldset.contact .ct .inputWrapper.sendDate.date {
		margin: 10px 0 0 105px;
	}
	
	fieldset.contact.done .ct p br{
		display: block;
	}
	/********* 聯絡我們 end ***********/
	/***************** overlayCenter end **********************/
	/********************************** overlay end **********************************************/

	/********************************** 左下訂閱電子報 start **********************************************/
	.extraSubscribe {
		font-size: 0.85em;
	}
	.extraSubscribe .main {
		padding: 0 1.4em;
	}
	.extraSubscribe.expand .main .form input[type="email"] {
		font-size: 0.95em;
		width: 11.5em;
	}
	.extraSubscribe.expand .main .form button {
		font-size: 0.95em;
	}
	/********************************** 左下訂閱電子報 end **********************************************/
	
}