charset "utf-8";
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,body>header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font-size:100%;font:inherit;padding:0;border:0;margin:0;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}article,aside,details,figcaption,figure,footer,body>header,hgroup,menu,nav,section{display:block}.clear{clear:both}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}.screen-reader-text{clip:rect(1px, 1px, 1px, 1px);position:absolute !important}

html {
	font-size: 18px;
	line-height:1.5em;
} 
body{
	text-decoration: none;
	margin:0;
	width:100%;
	/* font-family: 'Helvetica Neue',Helvetica,Arial,STHeitiTC-light,STHeiti,'Microsoft JhengHei',微軟正黑體,'Inter',sans-serif; */
	font-family: 'Microsoft JhengHei',微軟正黑體,'Inter', sans-serif;
	color:#666;
	font-weight:400;
	line-height:1.5em;
}
h1,h2,h3,h4,h5,h6{
	line-height:1.25em;
	font-weight: bold;
}
h1{ font-size:2rem; font-family: 'Noto Sans HK', sans-serif; font-weight: 500 !important;}
h2{ font-size:1.6rem; margin-bottom:20px; font-family: 'Noto Sans HK', sans-serif; font-weight: 500 !important; }
h3{ font-size:1.2rem; margin-bottom:20px; font-family: 'Noto Sans HK', sans-serif; font-weight: 500 !important; }
a{
	transition: all.3s linear;
}
a,a:hover,a:visited,a:active{
	color:inherit;	
	text-decoration: none;
}
.section a,.section a:hover,.section a:visited,.section a:active{
	color:#6C5A92 !important;
}
body>header,footer{
	position: relative;
	width: 100%;
	clear:both;
	display: block;
}
.section .section-wrapper{
	padding-top: 60px;
	padding-bottom: 60px;
	line-height: 1.5em;
}
.section img{
	max-width:100%;
	height:auto;
}
.section-wrapper p{
	text-align: justify;
}
body>body>header {
    margin-bottom: 5px;
    position: absolute;
    background: rgba(255,255,255,.8);
    z-index: 100;
}
body>header .section-wrapper{
	position: relative;
}
body>header .cart-btn{
	position: relative;
}
body>header .cart-btn:before{
    background-image: url(../img/cart.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    content:"";
    width:30px;
    height:30px;
    display: inline-block;
    margin-bottom: -8px;
    margin-right: 5px;
}
body>header .cart-btn .body>header-cart-count{
	position: absolute;
	top:-5px;
	right:-5px;
}
.top-menu .section-wrapper{
	padding-top:0;
	padding-bottom:0;
}
.section-wrapper{
	width:1200px;
	padding-left:15px;
	padding-right:15px;
	margin:auto;
	position: relative;
}
.width12{
	width:1200px;
	padding-left:15px;
	padding-right:15px;
	margin:auto;
	position: relative;
}
.width8{
	width:800px;
	padding-left:15px;
	padding-right:15px;
	margin:auto;
	position: relative;
}
.pc-body>header-items div[class^="menu-top"]{
    position: relative;
    font-size: 1.2rem;
    color:#666666;
    display: flex;
    width: 100%;
    justify-content: flex-end;
    align-items: center;
}
.pc-body>header-items div[class^="menu-top"]>ul{
	display: flex;
	flex-direction: row;
	margin-bottom:0;
	padding-left:0;
}
.address,.phone,.whatsapp,.fax,.email,.web,.facebook,.wechat{
	padding-left:30px;
	position: relative;
	margin-top:15px;
}
.address:before{ font-family: "Font Awesome 5 Free"; content:"\f3c5"; font-weight: 900; position: absolute; left:0; font-size: 1.24em;}
.phone:before{ font-family: "Font Awesome 5 Free"; content:"\f095"; font-weight: 900;  position: absolute; left:0; font-size: 1.24em;}
.whatsapp:before{ font-family: "Font Awesome 5 Brands"; content:"\f232";  position: absolute; left:0; font-size: 1.24em;}
.wechat:before{ font-family: "Font Awesome 5 Brands"; content:"\f1d7";  position: absolute; left:0; font-size: 1.24em;}
.facebook:before{ font-family: "Font Awesome 5 Brands"; content:"\f09a";  position: absolute; left:0; font-size: 1.24em;}
.fax:before{ font-family: "Font Awesome 5 Free"; content:"\f1ac"; font-weight: 900; position: absolute; left:0; font-size: 1.24em;}
.email:before{ font-family: "Font Awesome 5 Free"; content:"\f0e0";  position: absolute; left:0; font-size: 1.24em;}
.web:before{ font-family: "Font Awesome 5 Free"; content:"\f015"; font-weight: 900; position: absolute; left:0; font-size: 1.24em;}

.time:before{ font-family: "Font Awesome 5 Free"; content:"\f017"; font-weight: 900;   position: absolute; left:0; font-size: 1.24em;}
.ig:before{ font-family: "Font Awesome 5 Brands"; content:"\f16d";   position: absolute; left:0; max-width:  font-size: 1.24em;}
.wc:before{ font-family: "Font Awesome 5 Brands"; content:"\f1d7";   position: absolute; left:0; font-size: 1.24em;}
.fb:before{ font-family: "Font Awesome 5 Brands"; content:"\f09a";   position: absolute; left:0; font-size: 1.24em;}
.tk:before{ font-family: "Font Awesome 5 Brands"; content:"\e07b";   position: absolute; left:0; font-size: 1.24em;}
.tw:before{ font-family: "Font Awesome 5 Brands"; content:"\f099";   position: absolute; left:0; font-size: 1.24em;}
.yt:before{ font-family: "Font Awesome 5 Brands"; content:"\f167";   position: absolute; left:0; font-size: 1.24em;}
.social-icon a{
	display: inline-block;
	margin-right:10px;
	width:40px;
	height:40px;
	border:1px solid rgb(102,102,102);
	background:rgb(102,102,102);
	border-radius: 50px;
	transition: all .3s linear;
}
.social-icon a:hover{
	background:rgb(184,28,37);
	border:1px solid rgb(184,28,37);
	color:#fff;
}
.social-icon a:before{
	display: block;
	position: relative;
	left:unset;
	top:unset;
	font-size:20px;
	line-height: 40px;
	text-align: center;
	transition: all .3s linear;
	color:#fff !important;
}
.social-icon a:hover:before{
	color:#fff !important;
}
.small-wrapper{
	max-width:830px;
	width:100%;
	margin:auto;
	padding-left:15px;
	padding-right:15px;
}
h1.section-title,.product-cat-title{
	margin:auto;
	margin-bottom:30px;
	position: relative;
	font-weight: 900;
}
.product-cat-title{	
	color:#5D5646;
}
.right-box h1{
	font-size:3.2em;
	line-height:1.25em;
	margin-bottom:20px;
	position: relative;
	font-weight: 400;
	color:#4464AE;
}
.title-desc{
	font-size:1.2em;
	font-weight: 600;
	color:#666;	
	display: inline-block;
	margin-bottom:20px;
	line-height:1.5em;
}
html[lang="en-US"] .title-desc{
	font-weight: 400;
}
.thumbnail-list-style .title-desc,.icon-list-style .title-desc{
	margin-bottom:0;
}
div[class^="menu-footer"] ul{
	display: flex;
	flex-direction: row;
	margin-bottom:0;
	padding-left:0;
}
div[class^="menu-footer"] ul li:first-child a{
	padding-left:0;
}
div[class^="menu-footer"] ul a{
	padding-left:20px;
	padding-right:20px;

}
div[class^="menu-footer"] ul li:last-child a{
	padding-right:0;
}
.wpcf7-form-control{
	border:1px solid #ddd;
	border-radius:5px !important;
	margin-bottom:20px;
	max-width:100%;
	padding:5px 15px;
}
textarea.wpcf7-form-control{
	width: 100%;
	height:150px;
}
.wpcf7-submit{
	background-color:#6C5A92;
	border-color:#6C5A92;
	color:#fff !important;
	font-size: 1em;
	font-weight: bold;
	clear: both;
	padding: 5px 50px;
	border-radius: 5px !important;
	transition: all .3s ease-in-out;
}
.wpcf7-submit:hover{
	background-color:#77D20B;
	border-color:#77D20B;
}
.alignright{ display: block !important; text-align: right !important; }
.alignleft{ display: block !important; text-align: left !important; }
.aligncenter{ display: block !important; text-align: center !important; }
.half-style{
	position: relative;
}
.half-style .row>div{
	position: relative;
}
.half-style-img{
	width:50vw;
	height:auto;
	position: absolute;
	right:0;
	top:-60px;
	bottom:-60px;
	margin:auto;
	background-size: cover;
	background-position: center center;
}
.half-style-content{
	padding:60px;
}
.half-title{
	color:#6C5A92;
	margin-bottom:30px;
}
.section-title{
	color:#6C5A92;
	margin:auto;
	text-align: center;
	margin-bottom:30px;
}
.bg-lightgrey{
	background:#F6F6F6;
}
/* css custom frame ended */
body>header .logo,body>header .logo img{
	height:80px;
	width:auto;
}
body>header{
	background:rgba(255,255,255,.8);
	padding-top:15px;
	padding-bottom:15px;
	position: absolute;
	top:0;
	left:0;
	right:0;
	margin: auto;
	z-index: 1;
}
.admin-bar>header{
	top:32px;
}
body>header .section-wrapper{
	position: relative;
}
body>header nav {
	position: absolute;
	right:90px;
	top:0;
	bottom:0;

}
body>header .top-right-menu{
	display: inline-block;
	position: absolute;
	top: 25px;
	right: 0;
}
body>header nav div{
	height: 100%;
	display: inline-block;
}
body>header nav ul{
	display: flex;
	margin:0;
	height: 100%;
	padding:0;
	align-items: center;
}
body>header nav ul li{
	margin:0;
	padding-left:25px;
	padding-right:25px;
	position: relative;
}
body>header nav ul li a,body>header nav ul li a:visited{
	font-size:1.12rem;
	font-weight: bold;
	color:#333;
	transition: all .3s ease-in-out;
}
body>header nav ul li a:hover,body>header nav ul li a:active,body>header nav ul li a:focus{
	color:#6C5A92;
}
body>header nav ul li.current-menu-item a,body>header nav ul li:hover a,body>header nav ul li:active a,body>header nav ul li:focus a,body>header nav ul li.current-product_cat-ancestor a,body>header nav ul li.current-post-ancestor a,body>header nav ul li.current-menu-parent a,body>header nav ul li.current-post-parent a{
	color:#6C5A92;
}
body>header nav ul li:after{
	position: absolute;
	left:10px;
	right:10px;
	bottom: -39px;
	content:"";
	height:0px;
	width:auto;
	background:#6C5A92;
	display: block;
	margin: auto;
	transition: all .3s ease-in-out;
}
body>header nav ul li.current-menu-item:after,body>header nav ul li:hover:after,body>header nav ul li:active:after,body>header nav ul li:focus:after,body>header nav ul li.current-product_cat-ancestor:after,body>header nav ul li.current-post-ancestor:after,body>header nav ul li.current-menu-parent:after,body>header nav ul li.current-post-parent:after{
	height:5px;
}
.green-menu{
	background:#6C5A92;
	color:#fff;
	position: absolute;
	top:110px;
	left:0;
	right:0;
	padding-top:10px;
	padding-bottom:10px;
	z-index: 1;
}
.admin-bar .green-menu{
	top:calc(110px + 32px);
}
.green-menu ul{
	display:flex;
	margin:0;
	padding:0;
	justify-content: center;
	align-items: center;
}
.green-menu li{
	padding-left:25px;
	padding-right:25px;
	position: relative;
}
.green-menu li:after{
	content:"";
	height: 100%;
	width:0px;
	border-left:1px solid rgba(255,255,255,.3);
	position: absolute;
	right:0;
}
.green-menu li:last-child:after{
	display: none;
}
.index-banner{
	width:100%;
	height:700px;
	background-position: center center;
	background-size: cover;
}
.index-banner .section-wrapper{
	position: relative;
	height: 100%;
}
.index-banner .section-wrapper .banner-desc-box{
	background:rgba(0,0,0,.52);	
	width:50%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: absolute;
	top:155px;
	bottom:0;
	left:0;
	z-index: 0;
	color:#fff;
	padding:60px;
	box-sizing: border-box;
	text-shadow: 1px 2px 3px rgba(0,0,0,.35);
}
.index-banner .section-wrapper .banner-desc-box h2{
	font-weight: 100 !important;
}
.bg-greengrey{
	background:#E9EFFF;
}
.section .section-wrapper{
	line-height: 2rem;
}
.index-about-box h3{
	font-size:1rem;
	color:#6C5A92;
	font-weight: bold;
	margin-bottom: 10px;
}
.index-about-desc{

}
.index-about-img{
	box-shadow: 0 6px 11px rgba(0,0,0,.15);
	margin-bottom:20px;
	margin-top:60px;
}
.index-about-img img{
	margin-top:-60px;
}
.live-time{
	color:#6C5A92;
	margin-top:0px;
	margin-bottom:.5rem;
	font-weight: bold;
}
.bg-leaf{
	position: relative;
	overflow: hidden;
	min-height: 520px;
	background-image:url('../img/leaf-top.png'); 
	background-size:100% auto;
	background-position: top center;
	background-repeat: no-repeat;
}
.bg-leaf:before{
	position: absolute;
	bottom:-30px;
	left:-30px;
	content:"";
	z-index: -1;
	width:158px;
	height: 268px;
	background-image:url('../img/leaf3.png'); 
	display: block;
	background-size:cover;
}
.bg-leaf:after{
	position: absolute;
	bottom:-30px;
	right:-60px;
	content:"";
	z-index: -1;
	width:341px;
	height: 218px;
	background-image:url('../img/leaf6.png'); 
	display: block;
	background-size:cover;
}
.product-list .product-img-box,.article-list .article-img-box{
	background-position: center center;
	background-size: cover;
	border:1px solid #eee;
}
.product-list h3.product-name{
	margin-top:10px;
	margin-bottom:0px;
	font-size:1rem;
	line-height: 1.25em;
}
.product-list .product-price{
}
.product-image{
	width:100%;
	margin:auto;
	max-width:580px;
}
.product-image img{
	width:100%;
	height: auto;
	max-width: 580px;
}
.footer-bottom{
	position: relative;
	padding:10px 0;
}
.footer-bottom nav{
	display: inline-block;	
	color:#ccc;
}
.footer-bottom nav ul{
	display:flex;
	flex-direction: row;
	padding-left:0;
	margin-bottom:0;
}
.footer-qr img{
	width:186px;
	height: auto;
}
.footer-top .section-wrapper{
	padding-top:40px;
	padding-bottom:40px;
}
div[class^="menu-footer"] ul a{
	padding-right:40px;
	padding-left:0px;
}
.copyright{
	color:#ccc;
	float:right;
	right:0;
	top:0px;
}
.footer-content-box{
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
.footer-content-box>div:first-child{
	margin-right: 40px;
	margin-left:40px;
}
.footer-about-us{
	max-width: 360px;	
	position: relative;
}
.footer-about-us:after{
	width:1px;
	height:100%;
	content:"";
	background:rgba(255,255,255,.35);
	position: absolute;
	right:-40px;
	top:0;
	bottom:0;
	margin:auto;
}
.footer-about-us img{
	display: block;
	height:80px;
	width:auto;
}
.footer-other-info{
	display: flex;
	flex-direction: row;
}
.footer-other-info>div{
	margin-left:40px;
	margin-right:40px;
}
.footer-contact-info{
	font-size: 1rem;
}
.mobile-whatsapp{
	display: none;
}
footer{ color:#CCCCCC; font-size:.833rem; }
.footer-top{ background:#272727; }
.footer-bottom{ background:#000000; }
.footer-bottom nav li{
	position:relative;
}

.footer-bottom nav li:after{
	background:#666;
	width:1px;
	height:auto;
	position: absolute;
	right:20px;
	content:"";
	top:5px;
	bottom:5px;
}
.footer-bottom nav li:last-child:after{
	display: none;
}
.whatsapp-btn{
	position: fixed;
	right:30px;
	bottom:30px;
	z-index: 1;
	cursor: pointer;
	transition: all .15s ease-in-out;
	width:60px;
	height:60px;
	background:#6C5A92;
	text-align: center;
	line-height:58px;
	font-size:30px;
	color:#fff !important;
	border-radius: 50px;
}
.whatsapp-btn:hover{
	bottom:28px;
	background:#C3CDE8;
	color:#fff;
}
.page-top-margin{
	margin-top:157px;
}
.green-menu li a{
	color:#fff;
	transition: all .3s ease-in-out;
}
.green-menu li.current-menu-item a{
	color:#C3CDE8;
}
.green-menu li:hover a{
	color:#C3CDE8;
}
footer .footer-bottom .section-wrapper{
	padding:0;
}
footer .footer-top a{
	color:#6C5A92 !important;
}
footer .footer-bottom a{
	color:#ccc !important;
}
footer  a:hover,footer  a:active,footer  a:focus{
	color:#AD87FF !important;
}
.product-content-wrapper{
	position: relative;
}
.product-content-wrapper:before{
	position: absolute;
	width:100vw;
	background-image:url("../img/product-section-bg.jpg");
	background-size: 100% auto;
	margin: auto;
	height: 700px;
	content:"";
	top:350px;
	background-repeat: no-repeat;
}
.woocommerce div.product p.price, .woocommerce div.product span.price {
    color: inherit;
    font-size: 1em;
}
.article-list .article-name{
	line-height: 1.25rem;
	font-size:1.33rem;
	color:#6C5A92;
	margin-top:20px;
}
.article-list .article-desc{
	line-height: 1.5rem;
}
.article-list .article-desc p{
	margin-bottom:.5rem;
}
.article-list a{
	color:#6C5A92;
	font-weight: bold;
}
.article-list .live-time{
	margin-bottom: .5rem;
}
.article-banner,.page-banner{
	width:100%;
	height:300px;
	background-position: center center;
	background-size: cover;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
}
.article-banner h1,.page-banner h1{
	color:#fff;
	text-shadow: 0 6px 11px rgba(0,0,0,.15);
	z-index: 1;
}
.article-banner:before,.page-banner:before{
	position: absolute;
	z-index: 0;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	display: block;
	content:"";
	background:rgba(0,0,0,.5);

}
.contact-page .contact-method{
	text-align: center;
	margin-bottom:60px;
}
.contact-page .phone,.contact-page .whatsapp,.contact-page .facebook,.contact-page .wechat{	
	display: table;
	margin: auto;
	margin-bottom:10px;
}
.contact-method-box{
	padding:60px 0px;
	width:100%;
	box-shadow: 0 3px 6px rgba(0,0,0,.15);
	font-size:1.15rem;
	font-weight: 700;
}
.contact-page h3{
	color:#6C5A92;
	font-size:1rem;
	font-weight: 400;
}
.contact-page a{
	text-decoration: underline !important;
	color:inherit;
}
/* woocommerce customize css*/
.woocommerce-loop-product__title{
	font-size:1rem;
	margin-top:10px;
	text-align: center;
	margin-bottom: 30px;
}
.woocommerce .woocommerce-breadcrumb {
    margin-bottom:10px;
}
.woocommerce .col-1, .woocommerce .col-2,.u-columns .col-1,.u-columns .col-2{ max-width:none; }
.woocommerce form .form-row label, .woocommerce-page form .form-row label {
    display: block;
    width: 100%;
}
.woocommerce-input-wrapper {
    width: 100%;
}
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea {
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    outline: 0;
    line-height: 1.25em;
    padding: 10px 15px;
    border: 1px solid #ccc;
}
.account-mobile-menu {
    display: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation,.woocommerce-account .woocommerce-MyAccount-content{
    float: unset;
    width: 100%;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul a{
	padding: 5px 25px !important;
    display: inline-block;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-direction: row;
    justify-content: center;
    border-bottom: 1px solid #ddd;
    margin-bottom: 30px;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li {
	border: 1px solid #ddd;
	border-bottom: 0;
	border-right: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child{
	border-right: 1px solid #ddd;
}
.u-columns.woocommerce-Addresses >div{
	padding:15px;
	border:1px solid #eee;
}
.xoo-wsc-basket{
	display: none !important;
	visibility: hidden;
}
.xoo-wsc-ft-buttons-cont a.xoo-wsc-ft-btn{
	border-radius: 5px;
}
/* woocommerce customize css ended */
.header-cart-count {
    font-size: 0.75rem;
    background: #6C5A92;
    color: #fff;
    font-weight: 500;
    top: -9px;
    left: 47px;
    position: absolute;
    padding: 0px 3px;
    border: 1px solid #6C5A92;
    border-radius: 8px;
    line-height: 1.05em;
    height: 1.3em;
}
.top-right-menu li {
    border-left: 1px solid #aaa;
    cursor: pointer;
    padding-left: 30px;
}
.details-section h3.product-name{
	font-size:2.33rem;
	color:#6C5A92;
}
.details-section .quantity:before{
	content:"數量 : ";
}
.single_add_to_cart_button{
	margin-top:10px !important;
	background:#6C5A92 !important;
	margin-bottom:20px !important;
}
p.price{
	color:#333;
	font-weight: bold;
}
.woocommerce .single_add_to_cart_button.button.alt {
	background:#6C5A92 !important;
	color:white  !Important ;
}
.purple-bg,.purple-bg h1{
	background:#96A5CD;
	color:#fff;
}
.purple-bg a,.purple-bg a:active,.purple-bg a:visited,.purple-bg a:hover{
	color:#fff!important;

}
.service-name{
	margin-top:5px;	
	text-align: center;
}
.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt{
	background-color: #a46497;
    color: #fff !important;
    -webkit-font-smoothing: antialiased;
}