@charset "utf-8";
 /* chrome and safari */ 
@media screen and ( -webkit-min-device-pixel-ratio:0) {  
}

/* =========================================================
******************橫式 css*****************************
============================================================ */

@media only screen and (orientation : landscape) {
XXX.fullPic{ 
	width:400px;
	margin:0 auto;
}
.search input{ 
	width:350px;
}
.btnItem a{ 
	overflow:hidden;
	XXXwidth:120px !important;
	width:32.5% !important; /*3等份*/
}
br.landscape{ 
	display:none;
}
.freeGift label{ 
	width:100%;
}
.btnItem a.both{ 
	margin-right:0.75%;
	width:48% !important;  /*2等份*/
}
.couponTitle,
.orderTitle{ 
	width:auto !important;
}
}

/* =========================================================
******************左側開合選單 css*****************************
============================================================ */
html, body {
	height: 100%;
}

.menuArea{
	width:296px;
	overflow:auto;
	position:fixed;  /*修正會員選單bug*/
	left:-296px;
	top:0;
	z-index:2;
}

.menuArea ul,
.menuArea ul li{ 
	margin:0;
	padding:0;
	list-style:none;
}
.menuArea a.menuName{ 
	font-size:19px;
	line-height:22px;
	color:#FFF;
	text-decoration:none;
	background:#69b52e url(images/menu-x.png) 240px 8px no-repeat;
	border-bottom: none !important;
	margin:0;
	padding:0.75em 20px 0.75em 0;
	width:260px;
	display:block;
	text-align:center;
}
.menuArea a{ 
	font-size:16px;
	line-height:22px;
	color:#FFF;
	text-decoration:none;
	display:inline-block;
	border-bottom:solid 2px #000;
	margin:0;
	padding:13px 30px 13px 0;
	XXXwhite-space:nowrap; /* 不折行 */
	XXXtext-overflow:ellipsis;  /* 字尾會斷乾淨,字不會被削到,超出的就省略 */
	XXXoverflow:hidden;  /* 限寬超過遮蔽 */
	background:url(images/menu-down.png) 250px 15px no-repeat;
}
.menuArea a.link {
    background-image: none;
    /*background: url(images/eye.png) 250px 15px no-repeat;*/
}
.menuArea a.now{ 
	background:url(images/menu-up.png) 250px 15px no-repeat;
}
.menuArea .menu1 a{ 
	background-color:#1d1d1d;
	padding-left:15px;
	width:235px;
}
.menuArea .menu2 a{ 
	background-color:#444243;
	XXXpadding-left:30px;
	width:235px;
}
.menuArea .menu3 a{ 
	background-color:#6e6e6e;
	padding-left:30px;
	width:220px;
}
.menuArea .menu4 a{ 
	background-color:#e5e3e4;
	background-image:none;
	color:#333;
	padding-left:45px;
	width:205px;
}

.menuArea .menu2,
.menuArea .menu3,
.menuArea .menu4{
	display:none;
}

/************** 會員選單 start ***************/
.menuArea.memberNav{
	left:auto;
	right:-296px;
}
.menuArea.memberNav .menu1 > li{
	background-color:#1d1d1d;
	background-image:url(images/mIcon.png);
	background-repeat:no-repeat;
}
.menuArea.memberNav .menu1 > li.m_login{ background-position:10px 0;}
.menuArea.memberNav .menu1 > li.m_join{ background-position:10px -48px;}
.menuArea.memberNav .menu1 > li.m_center{ background-position:10px -96px;}
.menuArea.memberNav .menu1 > li.m_service{ background-position:10px -144px;}
.menuArea.memberNav .menu1 > li.m_forget{ background-position:10px -192px;}
.menuArea.memberNav .menu1 > li.m_resend{ background-position:10px -240px;}
.menuArea.memberNav .menu1 > li.m_contact{ background-position:10px -288px;}
.menuArea.memberNav .menu1 > li.m_visitor{ background-position:10px -336px;}
.menuArea.memberNav .menu1 > li > a{
	background-color:transparent;
	padding-left:45px;
	width:205px;
}
/************** 會員選單 end ***************/

/* =========================================================
******************內建 css*****************************
============================================================ */
body, form {
	color: #5c5c5c;
	font-size: 15px;
	line-height: 22px;
	margin: 0;
	padding: 0;
}
body,p,.ct{ 
	color:#5c5c5c;
	font-size:15px;
	line-height:22px;
	font-family:Arial,"微軟正黑體";
	XXXtext-decoration:line-through; /*文字刪除中線*/
	-webkit-text-size-adjust: none; /* 以 webkit 為核心的瀏覽器會自動調整一些文字大小(例如文字無法設太小或 span 會把文字變大) */  
}
p strong{ 
	color: #000;
}
img{ 
	border:none;
}
hr{ 
	margin:0;
	border:0; 
	height:6px; 
	background-color:#dfdfdf;
	color:#dfdfdf;
}
h1{ 
	font-size:18px;
	padding:0.5em;
	padding-left:45px;
	margin:0;
	margin-top:0.35em;
}
h1 strong.price{ 
	color:#69b52e;
	font-size:20px;
	XXXfont-family:Arial;
}
h1.products{ 
	font-size:21px;
	line-height:1.25em;
	color:#FFF;
	padding:0.75em;
	padding-left:20px;
	margin:0;
	background-color:#003e2c;
	border-bottom:solid 8px #c2db75;
}
h1.sp{ 
	font-size:15px;
	line-height:1em;
	font-weight:normal;
	color:#FFF;
	text-align:center;
	padding:0.75em 0;
	margin:0;
	background-color:#065b49;
}
h1.normal{ 
	padding-left:10px;
	background-color:#c2db75;
}
h1.normal2{ 
	padding-left:10px;
	background-color:#c0c0c0;
	color:#333;
}
h1.normal2 a{ 
	margin-left:15px;
	background-color:#c2db75;
	text-decoration:none;
	font-size:14px;
	padding:5px 10px;
	color:#333;
}
h1.normal3{ 
	padding-left:10px;
}
h1.everyday{ 
	background:#c2db75 url(images/icon-everyday.png) 10px 6px no-repeat;
	background-color:#de5689;
	color:#FFF;
}
h1.event{ 
	background:#c2db75 url(images/icon-event.png) 10px 5px no-repeat;
	background-color:#c2db75;
}
h2{ 
	font-size:23px;
	line-height:28px;
	margin:15px 0;
	XXXfont-size:large;
	XXXcolor:#69b52e;
}
h2.sub{ /*加入會員的條約頁*/
	font-size:19px;
	padding:3px 10px 3px 0;
	color:#060;
	XXXbackground-color:#c2db75;
}
h3{ 
	font-size:17px;
	margin:0;
	color:#F60;
}
h3.ask{ 
	font-size:15px;
	margin:0;
	color:#F00;
}
h3.answer{ 
	font-size:15px;
	margin:0;
	color:#1074c0;
}
h3.productsName{ 
	XXXfont-size:17px;
	font-size:16px;
	line-height:20px;
	color:#5c5c5c;
	margin:1px 0 2px;
	font-weight:normal;
}
h4{  /*商品規格內標題有用到*/
	font-size:14.5px;
	line-height:18px;
	margin:10px 0;
	color:#000;
}
h5{ 
	font-size:14px;
	line-height:17px;
	margin:0;
}
h5 del{ 
	font-weight:normal;
}
h5 .price{ 
	font-size:20px;
	color:#ef0085;
}
h5 .bonus{ 
	color:#69b52e;
	font-size:20px;
}
h5 .date{ 
	font-size:14px;
	letter-spacing:-1px;
	color:#0086ca;
	font-weight:normal;
}
h6{ 
	font-size:12px;
	line-height:15px;
	margin:10px 0;
	color:#000;
}
h6.orangeFont{ 
	margin:5px 0;
}
ol,ul{ 
	margin-bottom:2em;
}
ol li,ul li{ 
	margin:3px 0;	
}
ul.list{ 
	margin-bottom:15px;
}
ul.list li{ 
	white-space:nowrap; /* 不折行 */
	text-overflow:ellipsis;  /* 字尾會斷乾淨,字不會被削到,超出的就省略 */
	overflow:hidden;
	margin-left:-20px;
	padding-left:20px;
	background:#FFF url(images/icon-round.jpg) 0 0 no-repeat;
}
.inputstyle,.inputstyle1,.inputstyle2{ 
	border: none;
	font-size:15px;
	line-height:16px;
	color:#333;
	font-family:Arial,"微軟正黑體";
	padding:6px;
	border:#808080 solid 1px;
}
.inputstyle{ 
	width:160px;
}
.inputstyle1{ 
	width:87px;
}
.inputstyle2{ 
	width:255px;
}
a.linkred{ 
	color:#F00;
}

/* =========================================================
******************首頁KV*****************************
============================================================ */
.mainKVContainer{
	position:relative;
	width:530px;
}
.mainKVContainer.swiper-container{
	margin:5px auto;
}
@media only screen and (orientation : portrait) {
	.mainKVContainer{
		width:97%;
	}
}
.mainKV a{
	display:block;
	overflow:hidden; /*變圓角邊的遮罩*/
	-webkit-border-radius:10px; /* 圓角*/
	-moz-border-radius: 10px; /* 圓角 */
	border-radius:10px; /*變圓角邊的遮罩*/
}
.mainKV img{
	width:100%;
	display:block;
}


/* =========================================================
******************各區域 css*****************************
============================================================ */
.header{ 
	background-color:#69b52e;
	overflow:hidden;
	padding-right:5px;
    height: 48px;
}
.header img{ 
	height:48px;
}
.container{ 
	padding:0.75em 1.5em 0;
}
.container1{ 
	padding:0.75em 1.25em;
}
.container2{ 
	padding:0.75em;
	position:relative;  /*對應客服問答btn*/
}

.footerLink{ 
	text-align:center;
	background-color:#dfdfdf;
	padding:0.75em 0;
}
.footerLink p{ 
	margin:0;
}
.footerLink a{ 
	color:#333;
	font-size:small;
	text-decoration:none;
}
.footer{ 
	text-align:center;
	padding:1.5em 0 1em;
}
.footer p{ 
	margin:10px 0;
	font-size:small;
}
.footer a{ 
	color:#666;
	font-size:small;
	text-decoration:none;
}
.footer img{ 
	width:101px;
	margin:0 0px;
}
.top{ 
	position:fixed;
	z-index:99;
	bottom:0;
	right:0;
	display:none;
}
.top img{ 
	width:40px;
}
.search{ 
	background-color:#fff;
	border:solid 0.5em #dfdfdf;
	padding:0;
	margin:0.5em;
	overflow:hidden;
}
.search img{ 
	width:40px;
}
.searchBorder{ 
	border:solid 1px #ccc;
	overflow:hidden;
    height: 40px;
}
.search input{ 
	border: none;
	font-size:17px;
	line-height:18px;
	letter-spacing:1px;
	color:#333;
	font-family:Arial,"微軟正黑體";
	padding:10px 0 0 13px;
	width:215px;
}
select{ 
	border: solid 1px #999;
	font-size:14px;
	line-height:17px;
	color:#333;
	font-family:Arial,"微軟正黑體";
	padding:1px 0 3px 5px;
	XXXwidth:215px;
}
.freeGift label{ 
	XXXXmargin-bottom:0.25em;
	display:inline-block;
	white-space:nowrap; /* 不折行 */
	text-overflow:ellipsis;  /* 字尾會斷乾淨,字不會被削到,超出的就省略 */
	overflow:hidden;  /* 限寬超過遮蔽 */
	width:250px;
}
td.freeGift{ 
	font-size:13.5px;
}
td.freeGift strong{ 
	font-size:14px;
	color:#065b49;
	font-weight:bold;
}


/*跑馬燈*/
.marquee{ 
	background-color:#3a3a3a;
	color:#fff;
	font-size:16px;
	white-space:nowrap; /* 不折行 */
	overflow:hidden;  /* 限寬超過遮蔽 */
	XXXXtext-overflow:ellipsis;  /* 字尾會斷乾淨,字不會被削到,超出的就省略 */
}
.marquee span.title{ 
	background-color:#69b52e;
	display:inline-block;
	padding:8px 10px;
	margin-right:12px;
}
.marquee a{ 
	text-decoration:none;
	color:#fff;
}
marquee {
	display: inline-block;
	vertical-align: middle;
}

/*產品列表css*/
.productsList{ 
	padding:0.5em;
	border-bottom:solid 3px #dfdfdf;
	XXXborder-bottom:solid 6px #dfdfdf;
	overflow:hidden;
	XXXclear:both;
}
.productsPic{ 
	width:135px;
	height:135px;
	margin-right:0.5em;
	float:left;
}
.productsPic img{ 
	width:100%;
}
.productsPics{ 
	width:100px;
	height:100px;
	margin-right:0.5em;
	float:left;
}
.productsPics img{ 
	width:100%;
}
.productsList a{ 
	text-decoration:none;
	color:#333;
}
.productsList .sale{ 
	padding-top:8px;
}
.productsList .sale img{ 
	width:55px;
}
.productsList .buy{ 
	padding:1px 0;
}
.productsList .buy img{ 
	width:95px;
}
.productsArea{ 
	XXXbackground-color:#6FF;
	min-height:100px;
}
.productsAreas{ 
	XXXbackground-color:#6FF;
	min-height:48px;
}
.productsAreas .sale{ 
	padding:8px 0;
}
.fullPic img{ 
	width:100%;
}
.fullHeightPic img {
    width: 100%;
    display:flex;
    float:left;
}
.iconArea{ 
	xxxpadding:0 0 0.5em 0.5em;
	padding-left:0.5em;
}
.iconArea img{ 
	margin-left:5px;
	margin-bottom:0.4em;
}

/*購物清單產品列表css*/
.cartList{ 
	padding:0.5em;
	XXXborder-bottom:solid 3px #dfdfdf;
	overflow:hidden;
	XXXclear:both;
}
.cartListPic img{ 
	width:100%;
}
.cartListPic img.del{ 
	margin:3px 0 6px;
}
.cartListPic{ 
	width:100px;
	height:100px;
	margin-right:0.5em;
	float:left;
}
.cartList a{ 
	text-decoration:none;
	color:#333;
}
.cartGift,.cartGift1{ 
	color:#F00;
	padding:2px;
	overflow:hidden;
	white-space:nowrap; /* 不折行 */
	text-overflow:ellipsis;  /* 字尾會斷乾淨,字不會被削到,超出的就省略 */
}
.cartGift{ 
	border-top:solid 2px #e0e0e0;
	background:url(images/icon-freeGift1.png) 8px 2px no-repeat;
}
.cartGift1{ 
	border-top:solid 2px #fff;
	background:#e0e0e0 url(images/icon-freeGift1.png) 8px 2px no-repeat;

}
.cartGift strong,.cartGift1 strong{ 
	padding-left:27px;
	color:#060;
}

table.cart td{ 
	font-size:13px;
	line-height:19px;
	letter-spacing:-0.75px;
}

.cart tr{
    height:28px;
}

/*活動館item*/
.eventArea{ 
	margin:0 auto;
	padding:1em 0;
	width:95%;
	overflow:hidden;
	XXXbackground-color:#0CC;
}
ul.eventbtn{ 
	padding:0;
	margin:0;
}
ul.eventbtn li{ 
	margin:0.35em 1.5%;
	text-align:center;
	list-style:none;
	float:left;
	width:47%;
}
ul.eventbtn li a{ 
	text-decoration:none;
	color:#FFF;
	white-space:nowrap; /* 不折行 */
	text-overflow:ellipsis;  /* 字尾會斷乾淨,字不會被削到,超出的就省略 */
	overflow:hidden;
	background-color:#69b52e;
	display:block;
	padding:7px 2px;
	border-radius: 5px;  /* 圓角*/
	-webkit-border-radius: 5px;  /* 圓角*/
	-moz-border-radius: 5px;  /* 圓角 */
}
ul.eventbtn li.color a{ 
	background-color:#c2db75;
	color:#333;
}

/*3kv 輪播區*/
.kv3Area{ 
	background-color:#c2db75;
	padding:10px 0;
	margin-bottom:0.5em;
	overflow:hidden;
}
.kv3{ 
	background-color:#FFF;
	width:226px;
	padding:5px 8px 6px;
	overflow:hidden;
	position:relative;
}
.kv3 ul{
	position:relative;
	overflow:hidden;
	list-style:none;
	margin:0;
	padding:0;
}
.kv3 ul li{ 
	width:70px;
	margin:0 8px 0 0;
	padding:0;
	float:left;
}
.kv3 ul li a{ 
	text-decoration:none;
	color:#5c5c5c;
}
.kv3 ul li img{ 
	width:100%;
	display:block;
	border:none;
}
.kv3 ul li span{ 
	font-size:10px;
	-webkit-text-size-adjust: none; /* 以 webkit 為核心的瀏覽器會自動調整一些文字大小*/ 
	line-height:14px;
	margin:5px 0;
	display:block;
}
.kv3 ul li span.price{ 
	font-size:17px;
	color:#ef0085;
	font-weight:bold;
}

.kv3Area .pageNavUL{ 
	display:none;
}

/* =========================================================
******************自建 css*****************************
============================================================ */
.fixed {
	position: fixed;
	top: 500px;
	right: 10px;
}
.left{ 
	float:left;
}
.right{ 
	float:right;
}
.clearLR{ 
	clear:both;
}
.bgcolor1{ 
	background-color:#e0e0e0;
}
.redFont{ 
	color:#F00;
}
.orangeFont{ 
	color:#ff3300;
}
.pinkFont{ 
	color: #ef0085 !important;
}
.blueFont{ 
	color: #2e87c9 !important;
}
.addTB{ 
	margin:0.5em 0;
}
.addBtm{ 
	margin-bottom:0.5em;
}
.tdHight{
		height:1.25em;
}
.result{ 
	background-color:#cfdf9b;
	padding:15px 30px;
}
.result1{ 
	background-color:#cfdf9b;
	padding:0px 30px;
	overflow:hidden;
}
.result p,.result1 p{ 
	color:#333;
}
.result1 p{ 
	margin:10px 0 !important;
	line-height:19px;
}
.borderTop{ 
	border-top:solid 10px #c2db75;
}
.btnItemArea{ 
	background-color:#4e4c4d;
	padding:9px 0px 9px 9px;
}
.btnItemArea1{ 
	background-color:#003e2c;
	padding:9px 0px 9px 9px;
	margin:0.5em 0;
}
.btnArea,.btnArea1{ 
	text-align:center;
}
.btnArea a.btn,.btnArea a.btnRed{ 
	display:inline-block;
	font-size:13px;
	xxxfont-weight:bold;
	color:#fff;
	background-color:#69b52e;
	text-align:center;
	padding:8px 0;
	margin:0.5em 0.5%;
	width:48%;
}
a.btnRed{ 
	background-color:#e83131 !important;
}
a.btnCart{ 
	 width:150px !important; 
	 padding:2px !important;
	 margin-left:10px !important;
}

.btnArea img{ 
	text-align:center;
	height:28px;
	margin:15px 3px 20px;
}

.btnArea input{ 
	text-align:center;
	height:28px;
	margin:15px 3px 20px;
}

.btnArea1 img{ 
	text-align:center;
	height:30px;
	margin:15px 3px 3px 3px;
}

.btnItem a,.btnItem a.both{ 
	display:inline-block;
	font-size:15px;
	color:#333;
	background-color:#FFF;
	text-align:center;
	text-decoration:none;
	padding:5px 0;
	margin-right:2px;
	width:32%;  /*3等份*/
}
.btnItem a.both{ 
	margin-right:0.75%;
	width:48.25%;  /*2等份*/
	font-size:17px;
	font-weight:bold;
	color: #F60;
}

.btnItem a.now{ 
	background-color:#c2db75;
}

.btnPwd{
    text-align:center;
}

.btnPwd a{
	display:inline-block;
	font-size:17px;
	font-weight:bold;
	text-decoration:none;
	color: #F60;
    width:200px;
    border:solid 6px #AbAbAb;
    padding:10px;
}

/*購物車*/
.btnCart a{ 
	display:inline-block;
	font-size:13px;
	letter-spacing:-1px;
	color:#333;
	background-color:#FFF;
	text-align:center;
	text-decoration:none;
	padding:5px 0;
	margin-right:2px;
	margin-top:1px;
	margin-bottom:1px;
	width:32%;
}

.btnCart a.now{ 
	background-color:#c2db75;
}



.btnTabArea{ 
	border-bottom:solid 6px #4b4b4b;
	padding-left:1em;
	margin-top:1em;
}
.btnTabArea a{ 
	display:inline-block;
	font-size:16px;
	xxxfont-weight:bold;
	color:#fff;
	background-color:#b4b4b4;
	text-align:center;
	text-decoration:none;
	padding:5px 20px;
	margin-right:2px;
}
.btnTabArea a.now{ 
	background-color:#72c432;
}

.tabct > div{
	display:none;
}

.sns{
	XXXtext-align:right;
	margin-top:0.25em;
}
.tc{
	XXXfont-size: small;
	font-size: x-small;
	line-height:15px;
}

/*頁數css*/
.page{ 
	text-align:center;
	margin-top:1em;
	margin-bottom:1em;
}
.page p{ 
	color:#5c5c5c;
}
a.pagebtn{ 
	display:inline-block;
	font-size:14px;
	font-weight:bold;
	color:#5c5c5c;
	background-color:#FFF;
	border:solid 1px #999;
	text-align:center;
	text-decoration:none;
	padding:1.5px 6px;
	border-radius:3px; /*變圓角邊的遮罩*/
	-webkit-border-radius:3px; /* 圓角*/
	-moz-border-radius:3px; /* 圓角 */
}
.page a{ 
	margin:0 5px;
}
.page a.now{ 
	color:#55a617;
	border:solid 1px #69b52e;
}
.page a img{ 
	height:28px;
	vertical-align: middle;
}

/* =========================================================
******************新增會員 css*****************************
============================================================ */
a.btn-rule{ 
	width:160px;
	height:30px;
	XXwidth:218px;
	XXheight:40px;
	display: inline-block;
	text-indent: -9999999px;
	background:#FFF url(images/btn-rule.png) 0 0 no-repeat;
	margin-left:10px;
	vertical-align: bottom;
}
a.btn-rule.open{ 
	background-position:0 -30px;
}
a.btnUse{  /* 我要啓用 */
	display:inline-block;
	font-size:15px;
	xxxfont-weight:bold;
	color:#fff;
	background-color:#69b52e;
	text-align:center;
	padding:2px 15px;
	text-decoration:none;
}
a.btnUnused{  /* 尚末使用 */
	display:inline-block;
	font-size:15px;
	xxxfont-weight:bold;
	color:#fff;
	background-color:#00573d;
	text-align:center;
	padding:2px 15px;
	text-decoration:none;
}
a.btnCancel,a.btn2words{  /* 我要取消,訂單二字的btn */
	display:inline-block;
	font-size:13.5px;
	letter-spacing:-0.5px;
	color:#fff;
	background-color:#00573d;
	text-align:center;
	padding:1px 0;
	width:60px;
	text-decoration:none;
}
a.btnHistory{  /* 查詢歷史紀錄 */
	display:inline-block;
	font-size:17px;
	xxxfont-weight:bold;
	color:#00573d;
	background-color:#fff;
	text-align:center;
	padding-top:1px;
	xxmargin-bottom:2px;
	xxwidth:145px;
	width:125px;
	text-decoration:none;
}
.couponTitle,
.orderTitle{ 
	font-size:15px;
	color:#61ab27;
	white-space:nowrap; /* 不折行 */
	text-overflow:ellipsis;  /* 字尾會斷乾淨,字不會被削到,超出的就省略 */
	overflow:hidden;
	width:190px;
	xxxwidth:calc(100% - 80px); /* 計算公式不支援手機內建瀏覽器,支援chrome */
}
.orderTitle{ 
	color:#00573d;
}
.customerQA{ 
	position:absolute;
	xxxz-index:1px;
	bottom:17px;
	right:10px;
}
.customerQA img{ 
	width:125px;
	margin-bottom:5px;
}
.customerQA a.btnSpace{ 
	margin-right:5px;
}


.unitHeader1 {
	background-color: #2ed0fb;
	color:#FFF;
}
.unitHeader2 {
	background-color: #fc70c3;
	color:#FFF;
}
.unitHeader3 {
	background-color: #1174c0;
	color:#FFF;
}
.unitHeader4 {
	background-color: #bce34d;
	color:#FFF;
}
.unitHeader5 {
	background-color: #69b52e;
	color:#FFF;
}
.unitHeader6 {
	background-color: #fe9b52;
	color:#FFF;
}
.unitHeader7 {
	background-color: #b60081;
	color:#FFF;
}
.unitHeader8 {
	background-color: #c0c0c0;
	color:#FFF;
}
.unitHeader9 {
	background-color: #be8be3;
	color:#FFF;
}
.unitHeader10 {
	background-color: #7f4000;
	color:#FFF;
}