@charset "utf-8";
@import"font-awesome.min.css";

body { background: #fff; width:100%; height:100%; margin:0; padding:0; font-family:"微軟正黑體";  font-size: 14px; line-height:1.6em;}
html { width:100%; height:100%;}

.warpper { background: #ffffff;  padding:0px;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}/* End hide from IE-mac */
a { text-decoration:none;transition: all 0.3s ease 0s;}
img { border:0; vertical-align:middle;max-width: 100%;}
input { vertical-align:middle;}
.slicknav_menu {display:none;}
input.select-box { border:1px #CBCBCB solid; padding:5px 3%; width:20px; height:20px; text-align:center; margin-bottom:5px; }


/*** padding and border no width ****/
*{
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
}



/***** 表單預設文字顏色設定 *****/
/* 通用 */
::-webkit-input-placeholder { color:#bdbdbd; font-family:"微軟正黑體";  font-size: 14px;}
::-moz-placeholder { color:#bdbdbd; font-family:"微軟正黑體";  font-size: 14px;} /* firefox 19+ */
:-ms-input-placeholder { color:#bdbdbd; font-family:"微軟正黑體";  font-size: 14px; } /* ie */
input:-moz-placeholder { color:#bdbdbd; font-family:"微軟正黑體";  font-size: 14px; }

/* webkit专用 */
#field2::-webkit-input-placeholder {color:#bdbdbd; font-family:"微軟正黑體";  font-size: 14px; }
#field3::-webkit-input-placeholder { color:#bdbdbd; font-family:"微軟正黑體";  font-size: 14px;background:lightgreen; text-transform:uppercase; }
#field4::-webkit-input-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3px;color:#bdbdbd; font-family:"微軟正黑體";  font-size: 14px;}

/* mozilla专用 */
#field2::-moz-placeholder { color:#bdbdbd; font-family:"微軟正黑體";  font-size: 14px;}
#field3::-moz-placeholder { color:#bdbdbd; font-family:"微軟正黑體";  font-size: 14px; background:lightgreen; text-transform:uppercase; }
#field4::-moz-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3px; color:#bdbdbd; font-family:"微軟正黑體";  font-size: 14px;}




/*** 手機選單、選單 色塊-變色  ***/
.b-color, .slicknav_menu {background: url( ../images/menu-main_bg.png) top center; } /** 選單顏色 ***/
.slicknav_icon-bar { background-color: #FFF;} /** 手機選單ICON按鈕色 ***/
.slicknav_btn { } /** 手機選單ICON按鈕底色 ***/

.b-color>li:hover, .b-color>li>ul>li>a:hover, .slicknav_nav .slicknav_row:hover, .slicknav_nav a:hover {} /** 選單滑入顏色 ***/
.slicknav_nav>li { } 
.border-color { border-left:7px #A0A0A0 solid;} /** 標題顏色 ***/

/** 浮動icon **/
.float{position: fixed;width: 42px; right: 10px;bottom:15%;z-index: 1000;}
.float ul{list-style: none;padding: 0;margin: 0;display: block;}
.float ul li{padding:0;margin:10px 0;width: 100%;}
.float ul li a{display: block;position: relative;width: 42px;color: #ffffff;}
.float ul li a:hover{}
.float ul li .float-icon{ background: #603906;border: 1px #ffffff solid;box-shadow: 0 0 0 1px #603906; border-radius: 50px;display: block;width: 42px; height: 42px;position: relative;z-index: 1;}
.float ul li:nth-child(1) .float-icon{ background: #00b900;box-shadow: 0 0 0 1px #00b900; }
.float ul li:nth-child(2) .float-icon{ background: #007fff;box-shadow: 0 0 0 1px #007fff; }
.float ul li:nth-child(3) .float-icon{ background: #dc3545;box-shadow: 0 0 0 1px #dc3545; }
.float ul li .float-icon img{width: 100%;}
.float ul li:hover .float-icon{background: #5e4b0a;box-shadow: 0 0 0 1px #5e4b0a;}
.float ul li a .badge{position:absolute; right:-5px; top:-5px; display:block; padding:1px; background:#333333; width:24px; height:24px; line-height:22px; font-weight:normal; font-size:12px; border-radius:20px;z-index: 1;text-align: center;}

@media screen and (max-width:640px){
	.float{position: fixed;width: 36px; }
	.float ul li .float-icon{width: 36px; height: 36px;}
}

header { background:rgba(255,255,255,.9);position: fixed;width: 100%;z-index: 99;}
.head-main { max-width:1200px; margin:0 auto; height:40px;padding:0; position:relative; }
.head-tool {position: absolute;top:7px; right:7px;}
.head-tool li {float: left; list-style:none; padding:0px; margin:0;}
.head-tool li a {margin:0; padding:0 2px; display:block; color:#3e3e27; font-size:14px;}
.head-tool li a:hover { }
.fa-home{font-size:26px;padding:0 5px;color: #43432b;transition: all 0.3s ease 0s;}
.fa-shopping-basket{ font-size:19px;padding:3px 5px;color: #43432b;transition: all 0.3s ease 0s;}
.fa-home:hover{color: #43432b;transform:scale(1.06);transition: all 0.3s ease 0s;}
.fa-shopping-basket:hover{color: #43432b;transform:scale(1.06);transition: all 0.3s ease 0s;}

.head-main .logo {position:relative; width:142px; height:auto;padding: 0;margin: 0 auto;z-index: 99;}
.head-main .logo a {}
.head-main .logo img { width:100%; height:auto;}
.home { display: block; position:absolute; top:-35px; right:0px; width:25px; height:auto;}
.home_w { display:none;}



.banner-main {position: relative; }
.banner { background: #ffffff; position: relative; }
.banner img { vertical-align:middle; width:100%; height:auto;}
.banner-bottom{ position: absolute; bottom: 0 ;left: 0;}
.banner-bottom img{ width: 100%;}
h3.login-title { margin:0 0 10px 0; font-family:"Times New Roman"; font-size:24px; line-height:30px; color:#9B9B9B;}
.login-tool { }
.icon-tool { width:40px; height:auto; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
@media screen and (max-width:1000px){
	.banner-main {padding: 86px 0 0 0;}
}
@media screen and (max-width:640px){
	.banner-main {padding: 47.59px 0 0 0;}
}

/** 搜尋欄位 **/
	.m-search-main{display:none;}
@media screen and (max-width:640px){
	.m-search-main{display: block;z-index: 100;position:fixed;top:13px;right:60px;}
	.m-search-icon{width: 22px;}
	.m-search-icon img{width: 100%;}
	.m-search-content{display:none; background:rgba(255,255,255,.6);padding:5px;position:fixed;top:48px;right:0px;z-index: 1;width: 100%;}
	.m-search-content form{width: 100%;display: flex;justify-content: flex-end;}
	.form-main{display: flex;border: 1px #351f02 solid;width: 100%;}
	.m-search-form{font-size: 15px; color: #666666;margin:0;flex: 1;width: 100%;border-radius: 0;}
	.m-search-form input{border: 0;font-size: 15px; color: #666666;padding: 5px 15px 5px 15px;margin: 0;height: 36px; background:#ffffff;font-family:"Microsoft JhengHei";width: 100%;border-radius: 0;}
	.m-search-button{width: 36px;height: 36px;font-size: 15px; color: #666666;margin:0;border-radius: 0;}
	.m-search-button input{width: 36px;height: 36px;border: 0;background:#351f02 url(../images/search-icon.png)no-repeat center center;background-size: 22px; padding: 5px;transition: all 0.3s ease 0s;border-radius: 0;}
	.m-search-button-hover:hover{background:#7e4c00 url(../images/search-icon.png)no-repeat center center;background-size: 22px;transition: all 0.3s ease 0s;}
}

/** 關於我們 **/
.about-information{display: flex;line-height: 1.8em;}
.about-title{color: #7e4c00; font-size: 18px; font-weight: bold; margin: 0;text-align:right;flex: 1;position: relative;padding: 0 20px 0 0;}
.about-title:after{content: ""; display: block; width:6px ;height:6px ;border:3px #ff9900 solid;border-radius: 20px;background: #fff;position: absolute; top: 6px;right:-3px;z-index: 3;}
.about-content{color: #333; font-size: 15px; margin: 0;flex:5;position: relative;padding:20px 0 20px 15px;}
.about-content:before{content: ""; display: block;background: #7e4c00; width:2px; height: 100%;position: absolute;top:6px;left:-4px;z-index: 2; }
.about-content02{color: #333; font-size: 15px; margin: 0;flex:5;position: relative;padding:20px 0 20px 15px;display: flex;}
.about-content02:before{content: ""; display: block;background: #7e4c00; width:2px; height: 100%;position: absolute;top:6px;left:-4px;z-index: 2; }
.about_font001{color: #cd0505;}
.about-content:first-letter,.about-content-main:first-letter{ font-size:24px;font-weight: bold;}
.about-content02 .about-content-main{flex: 1;}
.about-content02 .about-images{max-width: 290px;}

.about-information-main{color: #333; font-size: 15px;margin:50px 0 20px 0;line-height: 1.8em;}
.about-title-main{background: #fe8900;color: #fff; font-size: 16px;text-align: center;font-weight: bold;padding: 5px 15px;border-radius: 5px;display: table;margin: 0 auto;}
.about-information-main ul{ list-style: none;padding: 0;margin:20px 0 0 0;display: flex;flex-wrap: wrap;}
.about-information-main ul li{width: calc(25% - 40px); margin:20px;text-align: center;}
.about-information-main ul li img{width: 100%; border-radius: 50%;}

@media screen and (max-width:1000px){
	.about-content02{display: block;}
.about-content02 .about-images{display: none;}
}
@media screen and (max-width:750px){
.about-information-main ul li{width: calc(50% - 40px); }
}
@media screen and (max-width:640px){
.about-information{display:block;}
	.about-title{text-align: left;}
	.about-title:after{content: "";position: absolute; top: 6px;right:0;}
	.about-content{ margin:0;padding:5px 0 20px 0;}
	.about-content:before{content: ""; display: block;background: #7e4c00; width:100%; height:2px;position:inherit;top:inherit;left:inherit;margin: 0 0 5px 0;}
	.about-content02{ margin:0;padding:5px 0 20px 0;}
	.about-content02:before{content: ""; display: block;background: #7e4c00; width:100%; height:2px;position:inherit;top:inherit;left:inherit;margin: 0 0 5px 0;}
	.about-information-main ul li{width: calc(50% - 20px);margin: 10px; }
}

/***** 訂單列表  *****/

.order-search { padding-left:30px;}
.order-list { padding:15px 10px;} 
.order-list td { text-align:center; font-size:12px; line-height:1.5em; padding:5px 10px; border-bottom:1px #CCC dotted; border-right:1px #CCC dotted;}
.order-list img.pro-photo { width:90px; height:90px; padding:10px; border:1px #CCC solid;}
.order-list .order-list-th { font-size:15px; color:#FFF; text-align:center; line-height:25px; padding:0 10px}
.order-list .order-list-td { font-size:15px; color: #333; text-align:center; padding:0 10px;}
.order-list .order-list-td.order_query a { background-color:#a70002; color:#fff; padding:3px 10px; line-height:1.5em; }
.order-list .order-list-td.order_query a:hover { background-color:#c72729; }
.order-list .numb { font-size:15px; color: #788BAC; text-align:left;}
.order-list .numb a {color: #788BAC;}
.order-list .count { font-size:15px; color: #900;}
.order-list .count-portal { padding:10px 0; border-bottom:1px #CCC dotted; margin-bottom:20px;}
                     .count-price { font-size:24px; font-family:Verdana; color: #900; font-weight:bold;}
.order-list .portal { display:block; width:200px; font-size:15px; color:#900; float:right; text-align:right;}
.order-list .freight { display:block; font-size:15px; color:#900; padding-bottom:10px;}
.oproject { display:none; color:#900;}

.shopping-list-more{ text-align:center; padding:10px 0 0 0;}
ul.order-list { list-style:none; margin:0 ; padding:0;}
ul.order-list li { border-bottom:1px #CCC dotted; padding:15px 0; }
ul.order-list li:nth-child(odd){ background: #F5F5F5;}
ul.order-list li.th { background:#301b00; color: #fff; padding:5px; border:0;}
.th .order-list-img, .th .order-list-name, .th .order-list-price, .th .order-list-quantity, .th .order-list-subtotal, .th .order-list-del { padding-top:5PX; }

.order-list-img { float:left; width:10%; display:table-cell; font-size:15px; vertical-align:middle; text-align:center;}
.order-list-img02 { float:left; width:10%; display:table-cell; font-size:15px;  padding-top:5px; vertical-align:middle; text-align:center;}
  .sorder-list-img img { width:90px; height:auto; padding:5%; border:1px #CCC solid; margin:5%; text-align:center;}


.order-list-del a { color:#fff; padding:3px 10px; line-height:1.5em; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
background: rgb(248,80,50); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(248,80,50,1) 0%, rgba(241,111,92,1) 50%, rgba(246,41,12,1) 51%, rgba(240,47,23,1) 71%, rgba(231,56,39,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(248,80,50,1)), color-stop(50%,rgba(241,111,92,1)), color-stop(51%,rgba(246,41,12,1)), color-stop(71%,rgba(240,47,23,1)), color-stop(100%,rgba(231,56,39,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=0 ); /* IE6-9 */
}

.order-list-del a:hover { 
background: rgb(255,48,25); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,48,25,1) 0%, rgba(207,4,4,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,48,25,1)), color-stop(100%,rgba(207,4,4,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 ); /* IE6-9 */
}


.order-ditaile-info { padding:0 0 0 40px; font-size:15px; color: #333; line-height:1.5em; }
.jump-window-box  { max-width:600px; margin:0 auto; padding:25px 10px;}

/*** 會員登入  ***/
.member-login-box { max-width:600px; margin:0 auto; padding:25px 10px; }


/*****  購物車  *****/
.cart-body {max-width: 1200px; margin:0 auto;padding: 25px 10px;}
.shopping-car { padding:15px 10px;} 
th.shopping-car-th { background: #69C; font-size:15px; color:#FFF; text-align:center; line-height:25px;  border-right:1px #fff dotted;} 
.shopping-car td { text-align:center; font-size:12px; line-height:1.5em; padding:5px 10px; border-bottom:1px #CCC dotted; border-right:1px #CCC dotted;}
.shopping-car img.pro-photo { width:90px; height:90px; margin-right:10px; }
.shopping-car .pro-name { font-size:15px; color: #333; text-align:left; }
.shopping-car .price { font-size:15px; color:#333;}
@media screen and (max-width:640px){
	.shopping-car .price { text-align:right;}
}
.shopping-car .numb { font-size:15px; color:#66f;}
@media screen and (max-width:640px){
	.shopping-car .numb { display:inline-block; float:left; width:calc(50% - 51px); }
}
.shopping-car .count { font-size:15px; color: #900;}
@media screen and (max-width:640px){
	.shopping-car .count { font-weight:bold; font-size:20px; text-align:right; color:#a70002; float:right; width:auto;}
}
.shopping-car .count-portal { padding:10px 0; margin-bottom:20px;}
              .count-price { font-size:24px; font-family:Verdana; color: #900; font-weight:bold;}
.shopping-car .portal { display:block; font-size:15px; color:#900; float:right; text-align:right;}
.shopping-car .freight { display:block; font-size:15px; color:#900; padding-bottom:10px;}



ul.shopping-car-list { display:table; width:100%; list-style:none; margin:0; padding:0;}
ul.shopping-car-list li { display:flex; flex-wrap:wrap; -webkit-align-items:center; align-items:center; /*垂直置中*/ -webkit-justify-content:center; justify-content:center; /*水平置中*/  border-bottom:1px dotted #ccc; padding:10px 5px; }
@media screen and (max-width:640px){
	ul.shopping-car-list li { display:block; flex-wrap:nowrap; -webkit-align-items:center; align-items:center; /*垂直置中*/ -webkit-justify-content:left; justify-content:left; /*水平置中*/  border-bottom:1px dotted #ccc; padding:15px 0; }

}
ul.shopping-car-list li.th { background:#301b00; color: #fff;  min-height:0px; padding:5px; border:0; }
.th .shop-car-info, .th .shop-car-name, .th .shop-car-price, .th .shop-car-quantity, .th .shop-car-subtotal, .th .shop-car-del { padding:5px 10px; }

.shop-car-info { display:table-cell; font-size:15px; vertical-align:middle; text-align:left;}
.shop-car-info a.pro-photo { width:70px; height:50px; float:left; margin-right:10px; background-size:cover; background-repeat:no-repeat; background-position:center; }
.shop-car-info .description{ font-weight:bold; font-size:15px; line-height:20px; margin-left:70px; word-wrap: break-word; color:#000;}
.shop-car-info .description .spec { font-weight:normal; font-size:13px; line-height:18px; color:#666; }
.shop-car-price { display:table-cell; height:100%; font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-quantity { display:table-cell; height:100%;  font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-subtotal{ display:table-cell; height:100%;  font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-del { display:table-cell; height:100%;  font-size:15px; vertical-align:middle; text-align:center;}
@media screen and (max-width:640px){
	.shop-car-del { float:left; width:auto; padding:5px 0;}
}
.shop-car-del a { background:#945400; color:#fff; padding:3px 10px; line-height:1.5em; }
.shop-car-del a:hover { background:#f64646; /* Old browsers */}

.shopping-car .oproject { font-size:15px; color:#000; display:none; font-weight:bold; }
.shopping-car .original-price { display:block; font-size:12px; text-decoration:line-through; }


.checkout-box { padding:10px; margin:20px 10px 20px 0;}
.checkout-box h3 { background: #cca932; border-left:5px #7e6c2d solid; font-size:15px; color:#fff; line-height:40px; margin: 0 0 5px 0; padding-left:20px; font-weight:500;}
.check-box { padding:5px; font-size:15px; color:#000;}
.check-box a { color:#000;}
.check-box a:hover { color:#960; } 

.checkout-cart-summary{margin:20px 10px; padding:10px;}
.checkout-cart-summary>div{margin-bottom:10px;display: flex;align-items: center;}
.checkout-cart-summary>div.total{margin-top:10px; padding-top:10px; border-top:1px solid #ccc; font-weight:bold;}
.checkout-cart-summary>div.total .toc{font-family:Verdana; font-weight:bold; color:#900; font-size:large;}
.checkout-cart-summary>div.cart-coupon{color:#e96161;}
.pull-left{float:inherit;min-width: 60px;text-align: left;}
.pull-right{float:inherit;flex: 1;text-align: right;}
.appointment { max-width:600px; margin:0 auto;}
.appointment-title { text-align:center;}

.checkout-cart-summary02{margin:20px 10px; padding:10px;}
.checkout-cart-summary02>div{margin-bottom:10px;}
.checkout-cart-summary02>div.total{margin-top:10px; padding-top:10px; border-top:1px solid #ccc; font-weight:bold;}
.checkout-cart-summary02>div.total .toc{font-family:Verdana; font-weight:bold; color:#900; font-size:large;}
.checkout-cart-summary02>div.cart-coupon{color:#e96161;}

/*****  產品專區  *****/
.search {display: flex; }
.search h3 {width:35%; background: #351f02; background: linear-gradient(135deg, transparent 20px, #351f02 0);font-size:26px; color:#ffffff; font-weight:normal; margin:0; padding:7px 8px;text-shadow:#351f02 0px 2px, #351f02 2px 0px, #351f02 -2px 0px, #351f02 0px -2px, #351f02 -1.4px -1.4px, #351f02 1.4px 1.4px, #351f02 1.4px -1.4px, #351f02 -1.4px 1.4px;position: relative; }
.search .s-title-en {position: absolute;bottom:5px; right: 5px; display:block;font-size:2.15vw;font-weight:normal;font-family: arial;
background-color: #100900;-webkit-background-clip: text;-moz-background-clip: text;background-clip: text;color:#563407;text-shadow:#351f02 0px 1px 1px;letter-spacing: 2px;}

.search-input {flex: auto; border: 1px #603906 solid;display: flex; border-radius:0 5px 5px 0;height: 36px;}
.search .s-input {flex: 1; background: #eeeeee;  border-radius: 5px 0 0 5px;font-size:15px; color: #333; padding:0; border:0; margin:0; height: 34px;}
.search .s-input .input{background: #fff; border: none;color: #333; font-size: 14px; font-family: "微軟正黑體"; width: 100%;height: 34px; border-radius: 5px 0 0 5px;padding: 5px 10px;line-height: 34px;}
.search .s-button {width: 47px;height: 34px; font-size:21px; color: #fff;text-align: center; line-height: 30px;  }
.search .s-button a{display: block;width: 47px;height: 34px; background: #603906;color: #fff; }
.search .s-button a:hover{display: block;width: 47px;height: 34px; color: #fff;background: #8c5103; }




.pro-store-info { font-size:15px; color:#333; padding:10px ; border-bottom:1px #b6afa6 dashed; margin-bottom:10px;}
.pro-search-info { font-size:18px; color:#64691F; line-height:1.5em; border-bottom:1px #CCC dotted; margin:10px; text-align:center; padding:10px;}

/*****  首頁產品  *****/
.pro-list {max-width: 1200px; margin:0 auto;padding:0;}
.pro-list ul {  margin:0 auto ; padding:0; list-style:none;}
.pro-list ul li {width:25%;padding:10px; text-align:center; float:left;}

.pro-list ul li:hover { background:rgba(208,181,145,.2);}
.pro-list ul li h4 {background: rgba(35,29,0,.8); font-size:16px; color:#ffffff;font-weight:normal; padding:8px 5px; margin:0; width: 100%; display: block;position: absolute; bottom:0; left: 0; }

.pro-list ul li .pro-price { color:#613700; font-size:15px;flex: 1; text-align:right;padding:4px 8px;text-decoration:line-through; }
.pro-list ul li .pro-discount { color:#bc0b0b; font-size:18px;flex: 1; text-align:right;padding:4px 8px; }

.pro-photo { background:#fff; width:100%; position: relative;}
.pro-photo a { display: flex; height: 100%; vertical-align: middle; text-align:center;align-items: center;justify-content: center;overflow: hidden;transition: all 0.3s ease 0s;}
.pro-photo img.index-pro-img { width: auto; height: auto; flex-shrink:0;transition: all 0.3s ease 0s;}
.pro-photo img:hover{transform:scale(1.1);}

@media screen and (max-width:790px){
.pro-list ul li .pro-price {font-size:14px;padding:2px 8px; }
.pro-list ul li .pro-discount {font-size:16px;padding:2px 8px; }
}

.pro-detaile { padding:10px; }
h3.pro-detaile-title {font-size:20px; color:#82571f;margin: 0 0 15px 0;padding: 0;}
.pro-detaile-box { display: flex;margin: 10px 0;}
.pro-detaile-box>div {  -webkit-flex: 1;  flex: 1;}
.pro-detaile-photo-box { width: 50%;}
.pro-detaile-spe-box { width: 50%; position: relative; padding-bottom: 140px;}

.pro-detaile .pro-photo-box {background:#fff; width:100%; margin:0 0 15px 0; padding:0 20px 0 0;}
.pro-detaile .pro-photo-box img { width:100%; height:auto;}

.pro-specification {  font-size:15px; color:#333; position:relative; margin-bottom:10px;line-height: 1.5;}
.pro-specification p { }
.pro-content { padding:0px 0; font-size:15px; color:#333; clear:both;line-height: 1.5;} 
.pro-content p.spec { margin:0; padding:0; font-size:12px; line-height: 1.5; color:#333;}

.pro-list-date { background: url(../images/time.png) left center no-repeat; font-size:12px; color: #968c69; padding-left: 20px;}

h3.pro-introduce { font-size:20px; color:#333;background: #ebd8be; border-bottom: 1px #917d62 solid;border-top: 1px #917d62 solid; margin:10px 0; padding:8px 10px;}
.pro-qr-code {}
.pro-qr-code img { width:100px; height:auto;}
.cart-info { position: absolute; width: 100%; bottom:15px; }
.price-discount{display: flex;justify-content: flex-end;}
.cart-info .price {flex:1; font-size:15px; color:#613700;  vertical-align:middle;padding:4px 8px;text-align:right;text-decoration:line-through;}
.cart-info .discount { color:#bc0b0b; font-size:18px;flex: 1; text-align:right;padding:4px 8px; }
.cart-info .member-price { color:#456d00; font-size:18px;flex: 1; text-align:right;padding:4px 8px; }
@media screen and (max-width:1035px){
	.pro-detaile-spe-box { padding-bottom: 170px;}
	.price-discount{display: flex;flex-wrap: wrap;}
	.cart-info .price {width:auto;flex: initial;}
	.cart-info .discount {width:auto;flex: initial;}
.cart-info .member-price {width:auto;flex: initial;}
}
 .check-out { text-align:center;  vertical-align:middle; display:block;}
 .check-out a {display:block; vertical-align:middle;  font-size:13px; min-width:130px; color:#333; padding:5px 10px; margin:10px 0; text-shadow:-1px -1px 0 #fff;-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #FFF; border:1px #D4D4D4 solid;}	
 			  
 .check-out a:hover { background: #D4D4D4;  text-shadow:-1px -1px 0 #A2A2A2; color:#333;}
 .check-out a img { vertical-align:middle; margin-right:10px;}
.cart-btn { background:#dbd1af; padding:5px 0; text-align:center; margin-top:15px; }

.fb-btn { background:#4267b2; padding:5px 0; text-align:center; margin-top:15px; color: white;}
.warning-btn { background:#b24242; padding:5px 0; text-align:center; margin-top:15px; color: white;}

.add-to-cart {display: flex;justify-content: flex-end;}
.add-to-cart a.cart { width:100%;}
.c-car{width:100%;}

a.c-cart {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e5c16b+0,826520+100 */
background: #e5c16b; /* Old browsers */
background: -moz-linear-gradient(top, #e5c16b 0%, #826520 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #e5c16b 0%,#826520 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #e5c16b 0%,#826520 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5c16b', endColorstr='#826520',GradientType=0 ); /* IE6-9 */ padding:8px 8px; color:#fff; font-size:16px; display:block; width:100%; text-align: center;border-radius: 5px;}
a.c-cart img { padding-right:0px; vertical-align:middle;}
a.c-cart:hover { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#826520+0,e5c16b+100 */
background: #826520; /* Old browsers */
background: -moz-linear-gradient(top, #826520 0%, #e5c16b 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #826520 0%,#e5c16b 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #826520 0%,#e5c16b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#826520', endColorstr='#e5c16b',GradientType=0 ); /* IE6-9 */}
.c-car .fa-shopping-basket{color: #fff;font-size: 18px; border-right: 1px #795e1f solid; box-shadow: 1px 0 0 0 #b99b54;padding: 0 10px 0 0;margin: 0 10px 0 0;}

.size { margin:5px 0; padding:7px 0; border-bottom:1px #DFDFDF solid;  border-top:1px #DFDFDF solid; }
.size ul { list-style:none; margin:0 auto; padding:0;}
.size ul li { background:#AAAAAA; font-size:12px; color:#ffffff;  margin:0 2px; float:left; cursor:pointer; width:25px; line-height:25px; text-align:center;}
.size ul li:hover { background:#000;}
.size ul li.active { background:#000; }
.size ul li.none { background:#E7E7E7; }
.size ul li.title { background: none; font-size:15px; color:#575757; width:auto; }

/**** 產明細圖片特效樣式 ****/
.slider-wrap								{ width: 100%;}	
.stripViewer .panelContainer		        { width: 400% !important;}	
.stripViewer .panelContainer  .panel ul		{ text-align: left; margin: 0 15px 0 30px; width: 100%}
.stripViewer								{ position: relative; overflow: hidden; width:100%; height: auto; }
.stripViewer .panelContainer				{ position: relative; left: 0; top: 0; width:400%; }
.stripViewer .panelContainer .wrapper       { width:100%; display: flex; height: 400px; vertical-align: middle; text-align:center;align-items: center;justify-content: center;}
.stripViewer .panelContainer img            { width: auto; height: auto; max-width:100%; max-height:100%;}
.stripViewer .panelContainer .panel			{ float: left; position: relative;}
.stripNavL, .stripNavR, .stripNav			{ display: none; width:100%; }
.slider-wrap a                              { height:auto;}
.nav-thumb 									{ margin-right: 0; }
#movers-row									{ margin:5px 0 0 0; width:101%; }
#movers-row div								{ width: 25%; float: left; padding-right:1%; }
#movers-row div a.cross-link 				{ float: right; display: flex; width: 100%; height:97.53px; vertical-align: middle; text-align:center;align-items: center;justify-content: center; border: 1px #f1ede8 solid;}
#movers-row div a.cross-link img			{ width: auto; height: auto; max-width:100%; max-height:100%;}
.photo-meta-data							{ background: url(/html/ezcatfiles/myweb62/img/img/60175/transpBlack.png); padding: 10px; height: 30px; 
											  margin-top: -50px; position: relative; z-index: 9999; color: white; }
.photo-meta-data span 						{ font-size: 13px; }
.cross-link									{ display: block; margin-top: 0px; position: relative; padding-top: 0px;}
.active-thumb 								{ background: transparent url(/html/ezcatfiles/myweb62/img/img/60175/icon-uparrowsmallwhite.png) top center no-repeat; }
.panel { width:25%;} /**四張圖 乘 四分之一 **/



/*****  聯絡我們  *****/
.contact-body { padding:0 10px;}
.contact-note { padding:10px 0; font-size:13px; color:#F00;margin:0 0 10px 0;}
.contact-left { }
.contact-left img { width:100%; height:auto; margin-top:0px; }

.contact-map{color: #82571f; font-size:18px; font-weight: bold; margin: 10px 0 5px 0;position: relative;height: 0;overflow: hidden;padding: 0;padding-bottom: 103.6%;display: block;}
.contact-map iframe { position: absolute;height: 100%;width: 100%;left: 0; top: 0;}


.contact-information{display: flex;margin: 5px 0;}
.contact-title{background: #82571f;border-radius: 5px; text-align: center; width:90px;min-width: 90px; color: #fff;padding: 5px;}
.contact-contect{flex: auto;padding: 5px 10px;}


.btn-send { font-size:13px;} 
a.btn-send { background:#3f3000; padding:3px 25px; text-align:center; font-size:13px; color:#fff; width:100px; margin:5px;}
a.btn-send:hover { background: #645010;}
a.btn-reset { background:#3f3000;  padding: 3px 25px; text-align:center; font-size:13px; color:#fff; width:100px; margin:5px;}
a.btn-reset:hover { background:#645010;}


a.btn-send-over { background: #725a0d; padding: 3px 25px; text-align:center; font-size:13px; color:#fff; width:100px; margin:5px; }
a.btn-send-over:hover { background: #84702d;}

a.btn-member { background:#3f3000; padding:3px 25px; text-align:center; font-size:13px; color:#fff; width:100px; margin:5px;}
a.btn-member:hover { background: #645010;}
a.btn-password { padding: 3px 25px 3px 0; text-align:left; font-size:13px; color:#3f3000; width:100px; margin:5px 20px 5px 5px;text-decoration: underline;}
a.btn-password:hover {text-decoration: underline;}
a.btn-member-join { background: #725a0d; padding: 3px 25px; text-align:center; font-size:13px; color:#fff; width:100px; margin:5px; }
a.btn-member-join:hover { background: #84702d;}


/*****  FAQ  *****/
.faq {padding: 10px;}
.faq ul { margin:0; padding:0 5px; list-style:none;}
.faq ul li { border-bottom:1px #fff solid; }
.faq ul li .qa_title { font-weight:bold; }
.faq ul li .qa_title a {  color:#5e4508; font-size:15px; display:block; padding:10px 10px 10px 35px;background: url(../images/faq-q.png)no-repeat 5px 12px;background-size:20px; border-bottom: 1px #928669 dashed;}
.faq ul li .qa_title a:hover { transform:translateX(10px);}
.faq ul li .qa_content { background:#f6ebc4 url(../images/faq-a.png)no-repeat 5px 12px;background-size: 22px;  border-top:1px #CCC dotted; padding:10px 10px 10px 35px; font-size:15px; color:#333;border-bottom: 1px #b7a66b solid;}
.faq ul li .qa_content a{color:#e76d00;}
.faq ul li .qa_content a:hover{text-decoration: underline;}
.opacl { font-size:12px; padding:10px 0; }
.opacl a { background:#6c5f08; color:#fff; padding: 7px 15px; margin:0 5px; -webkit-border-radius: 5px 0px 0 0px; -moz-border-radius: 5px 0px 0 0px; border-radius: 5px 0px 5px 0px;}
.opacl a:hover { background:#584e0c;}
a.close_qa { font-size:12px;} 
#qaContent{}
.accordionPart{}




/*****  最新消息  *****/
.news{}
.news ul { list-style: none; color:#333; padding:0px; margin:20px 0 10px 0; }
.news ul li { padding:4px 0; font-size:15px; }
.news ul li a { color:#333; display:block; padding:5px 0;overflow : hidden;
  text-overflow : ellipsis;
  white-space : nowrap;}
.news ul li a:hover {transform:translateX(10px);background: #f4f0eb;}
.news ul li .news-title{float: left; width: calc(100% - 150px);margin: 0 26px 0 0;}
.news ul li .date{float:right; width: 124px; text-align: center;border-radius: 5px; color: #fff;font-size: 15px;padding:5px 8px;letter-spacing: 1px;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d7a50c+0,b18410+100 */
background: #d7a50c; /* Old browsers */
background: -moz-linear-gradient(-45deg, #d7a50c 0%, #b18410 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, #d7a50c 0%,#b18410 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, #d7a50c 0%,#b18410 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d7a50c', endColorstr='#b18410',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
.time{float: right;border-radius: 0 0 100px 100px;margin: -10px 0 0 0; color: #fff;font-size: 15px;padding:3px 15px 4px 15px;letter-spacing: 1px;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d7a50c+0,b18410+100 */
background: #d7a50c; /* Old browsers */
background: -moz-linear-gradient(-45deg, #d7a50c 0%, #b18410 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, #d7a50c 0%,#b18410 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, #d7a50c 0%,#b18410 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d7a50c', endColorstr='#b18410',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}

/*****  內頁架構  *****/
.content-body {max-width: 1200px; margin:0 auto; padding: 25px 10px;}
.page-title {clear: both;font-size:22px; color:#351f02; padding:8px 15px;margin:10px 0 10px 0; border-bottom:1px #351f02 solid; border-top:1px #351f02 solid;font-weight: bold;box-shadow:0 6px 0 0 #dacebf;background: #f8f4ee;line-height: 1.2em;}
.page-main { padding:10px; font-size: 15px; color:#333; }

.left-menu-title { background:#8c8c8c; text-align:center; font-size:18px; color: #fff; padding:5px 0 10px 0;  
                   -webkit-border-radius:0 0 5px 0px; -moz-border-radius:0 0 5px 0px; border-radius:0 0 5px 0px;}
.in-left-menu {margin:15px 10px 25px 10px;   }
.in-left-menu>ul { margin:0; padding:1px 0 0px 0; list-style:none;text-align: center; }
.in-left-menu>ul>li  {display: inline-block;  font-size:15px; color:#351f02; padding:0; margin:4px 2px;}
.in-left-menu>ul>li>a { display: block; border:1px #351f02 solid ; color:#351f02;padding: 3px 10px;min-width: 100px; border-radius:30px;}
.in-left-menu>ul>li>a:hover {background: #351f02;border: 1px #351f02 solid;color: #fff;}
.in-left-menu>ul>li>.current{ background: #351f02; border: 1px #351f02 solid;color: #fff;}
.in-left-menu>ul>li>.current:after{content: "";display: block;width: 0;height: 0;border-style: solid;border-width: 8px 10px 0 10px;border-color: #351f02 transparent transparent transparent;margin:4px auto -12px auto;}



.in-left-menu>ul>li ul { margin:5px 0 0 40px; padding:0; list-style: square;} 
.in-left-menu>ul>li ul li { border-top:1px #CCC dotted; padding:5px;}
.in-left-menu>ul>li ul li:hover { background: #E8E8E6;} 
.in-left-menu>ul>li ul li a { font-size:13px; color:#666; display:block;}
.in-left-menu>ul>li ul li a:hover { color: #71743D;  }

.m_classLink{display:none;}

.font_001{color: #82571f; font-size: 18px; font-weight: bold; margin: 10px 0 5px 0;}

/*****  內頁BANNER  *****/
.inside-banner {background: url(../images/banner_bg.jpg) no-repeat center center; background-size:cover; padding:170px 0 50px 0;}
.inside-banner-shadow { background: url(../images/menu-shadow.png)no-repeat top center; display: block; width: 100%; height: 20px;margin: 0 auto;}
.inside-banner .banner-title { max-width:420px; font-size:30px; color:#fcedda; margin:0 auto; padding:0 10px;text-align: center;text-shadow: 1px 1px 10px rgba(32,18,0,.8);letter-spacing: 2px;  }
.inside-banner .banner-title-en{ text-transform: uppercase;font-size:50px; color:#ffffff;padding: 10px 0 0 0;font-family: arial;}
.inside-banner .banner-title-en:after{content: ""; display: block; background: rgba(32,18,0,.8); width: 100%; height:30px; margin:-4px 0 -6px 0;}


/*****  首頁產品  *****/
.index-pro-main { background: url(../images/i-pro_bg.jpg)no-repeat center center fixed; background-size: cover;padding:55px 10px;}
.index-pro {background:rgba(255,255,255,.76);max-width: 1200px; margin:0 auto;padding:30px 8px 0 8px;}
.index-pro h3 {background:rgba(255,255,255,.9); position: relative; color: #7f5c2e; font-size: 26px;font-weight: normal;border-bottom: 1px #7f5c2e solid;border-top: 1px #7f5c2e solid;padding:9px 10px 9px 10px; margin:0 0 10px 0;box-shadow: 0 6px 0 0 #d0b591;}
.index-pro .index-pro-title-en {position: absolute;bottom:5px; right: 5px; display:block;font-size:2.15vw;font-weight:normal;font-family: arial;
background-color: #a58f71;-webkit-background-clip: text;-moz-background-clip: text;background-clip: text;color:#d0b591;text-shadow:#a58f71 0px 1px 1px;letter-spacing: 2px;}
.index-pro ul {  margin:35px auto ; padding:0; list-style:none;}
.index-pro ul li {width:25%;padding:10px; text-align:center; float:left;}

.index-pro ul li:hover { background:rgba(208,181,145,.2);}
.index-pro ul li h4 {background: rgba(35,29,0,.8); font-size:16px; color:#ffffff;font-weight:normal; padding:8px 5px; margin:0; width: 100%; display: block;position: absolute; bottom:0; left: 0; }

.index-pro ul li .index-pro-price { color:#613700; font-size:15px;flex: 1; text-align:right;padding:4px 8px;text-decoration:line-through; }
.index-pro ul li .index-pro-discount { color:#bc0b0b; font-size:18px;flex: 1; text-align:right;padding:4px 8px; }
.car-main{ display:block;margin: 8px 0 0 0;}
.car{width:100%;margin: 5px 0 0 0;}

a.cart {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e5c16b+0,826520+100 */
background: #e5c16b; /* Old browsers */
background: -moz-linear-gradient(top, #e5c16b 0%, #826520 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #e5c16b 0%,#826520 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #e5c16b 0%,#826520 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5c16b', endColorstr='#826520',GradientType=0 ); /* IE6-9 */
padding:8px 8px; color:#fff; font-size:16px; display:block; width:100%; text-align: center;border-radius: 5px;}

a.no-cart {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e5c16b+0,826520+100 */
background: #e91e1e; /* Old browsers */
background: -moz-linear-gradient(top, #e91e1e 0%, #e91e1e 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #e91e1e 0%,#e91e1e 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #e91e1e 0%,#e91e1e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e91e1e', endColorstr='#e91e1e',GradientType=0 ); /* IE6-9 */
padding:8px 8px; color:#fff; font-size:16px; display:block; width:100%; text-align: center;border-radius: 5px;}



a.cart img { padding-right:0px; vertical-align:middle;}

a.cart:hover { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#826520+0,e5c16b+100 */
background: #826520; /* Old browsers */
background: -moz-linear-gradient(top, #826520 0%, #e5c16b 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #826520 0%,#e5c16b 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #826520 0%,#e5c16b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#826520', endColorstr='#e5c16b',GradientType=0 ); /* IE6-9 */}

a.no-cart:hover { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#826520+0,e5c16b+100 */
background: #e91e1e; /* Old browsers */
background: -moz-linear-gradient(top, #e91e1e 0%, #e91e1e 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #e91e1e 0%,#e91e1e 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #e91e1e 0%,#e91e1e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e91e1e', endColorstr='#e91e1e',GradientType=0 ); /* IE6-9 */}

.car .fa-shopping-basket{color: #fff;font-size: 18px; border-right: 1px #795e1f solid; box-shadow: 1px 0 0 0 #b99b54;padding: 0 10px 0 0;margin: 0 10px 0 0;}

.pro-more{ text-align: center; color: #fff; font-size: 12px;display: block; width: 448px;height: 34px; margin:14px auto 0 auto;}
.pro-more a{display: block; background: url(../images/more002_bg.png) no-repeat center bottom;color: #fff; background-size:100%;height: 34px;padding: 10px 5px;}
.pro-more a:hover{display: block; background: url(../images/more001_bg.png) no-repeat center bottom;background-size:100%;height: 34px;}

a.check { background:#ffffff; padding:5px 8px; color:#cecece; font-size:15px; display:block; border:1px #bbbbbb solid;  width:49%; margin-left:1%; float:left;}
a.check img { padding-right:0px; vertical-align:middle;}
a.check:hover { background: #ffffff; color:#5C0001;}

.index-more { max-width:1200px;  margin:50px auto 0 auto; position:relative; }
.index-more a { background:url(../images/index-more-pro.png) #2a2a2a bottom no-repeat; color:#ffffff; width:132px; padding: 10px 0 20px 0; display:block; margin:0 auto; text-align:center; }

@media screen and (max-width:790px){
.index-pro ul li .index-pro-price {font-size:14px;padding: 2px 8px;}
.index-pro ul li .index-pro-discount {font-size:16px;padding: 2px 8px;}
}
/*****  首頁連結  *****/
.index-link {  margin:0 auto;}
.index-link h3 { color:#333; font-size:36px; font-weight:normal; text-align:center; line-height:0.8em; letter-spacing:2px;}
.index-link h3 .red { color:#333333; font-size:24px; letter-spacing:0px;}
.index-link h3 .brwon { color:#999999; font-size:24px; padding-left:15px; letter-spacing:0px;}

.index-link-top { height:75px;}

.index-link ul { background:#e1e1e1; margin:0; padding:0; list-style:none;}
.index-link ul li { float:left; width:25%; margin:0; padding:0; border:1px  #fff dotted;}
.index-link ul li img { width:100%; height:auto; border:0; margin:0; padding:0;}


/*****  首頁 搜尋 最新消息模組  *****/
.index-news { width:100%; position:relative;}
.index-news:after{content: "";display: block; width: 100%;height: 18px; background: url(../images/news-shadow.png) no-repeat bottom center;background-size: 100%;}
.index-search-news {max-width: 1200px; margin:0 auto; padding:5px 0 20px 0;}

.index-search { }
.index-search h3 {background: #351f02; background: linear-gradient(135deg, transparent 20px, #351f02 0);font-size:26px; color:#ffffff; font-weight:normal; margin:10px 0 15px 0; padding:10px 8px;text-shadow:#351f02 0px 2px, #351f02 2px 0px, #351f02 -2px 0px, #351f02 0px -2px, #351f02 -1.4px -1.4px, #351f02 1.4px 1.4px, #351f02 1.4px -1.4px, #351f02 -1.4px 1.4px;position: relative; }
.index-search .search-title-en {position: absolute;bottom:5px; right: 5px; display:block;font-size:2.15vw;font-weight:normal;font-family: arial;
background-color: #100900;-webkit-background-clip: text;-moz-background-clip: text;background-clip: text;color:#563407;text-shadow:#351f02 0px 1px 1px;letter-spacing: 2px;}

.index-search-input {border: 1px #603906 solid;display: flex; border-radius: 5px;height: 36px;}
.index-search .search-input {flex: 1; background: #eeeeee;  border-radius: 5px 0 0 5px;font-size:15px; color: #333; padding:0; border:0; margin:0; height: 34px;}
.index-search .search-input .input{background: #fff; border: none;color: #333; font-size: 14px; font-family: "微軟正黑體"; width: 100%;height: 34px; border-radius: 5px 0 0 5px;padding: 5px 10px;line-height: 34px;}
.index-search .search-button {width: 47px;height: 34px; font-size:21px; color: #fff;text-align: center; line-height: 30px;  }
.index-search .search-button a{display: block;width: 47px;height: 34px; background: #603906;color: #fff; }
.index-search .search-button a:hover{display: block;width: 47px;height: 34px; color: #fff;background: #8c5103; }
.i-ad{margin: 15px 0;}
.i-ad img{ width: 100%; border-radius: 5px;}

.i-news { padding:0 0 0 20px;}

.i-news h3 {background:rgba(255,255,255,.9);position: relative; color: #351f02; font-size: 26px;font-weight: normal;border-bottom: 1px #351f02 solid;border-top: 1px #351f02 solid;padding:9px 10px 9px 10px; margin: 10px 0;box-shadow: 0 6px 0 0 #dfdad5;}
.i-news .i-news-title-en {position: absolute;bottom:5px; right: 5px; display:block;font-size:2.15vw;font-weight:normal;font-family: arial;
background-color: #bdbab8;-webkit-background-clip: text;-moz-background-clip: text;background-clip: text;color:#dfdad5;text-shadow:#bdbab8 0px 1px 1px;letter-spacing: 2px;}

.i-news ul { list-style: none; color:#333; padding:0px; margin:20px 0 10px 0; }
.i-news ul li { padding:4px 0; font-size:15px; }
.i-news ul li a { color:#333; display:block; padding:5px 0;overflow : hidden;
  text-overflow : ellipsis;
  white-space : nowrap;}
.i-news ul li a:hover {transform:translateX(10px);background: #f4f0eb;}
.i-news ul li .i-news-title{float: left; width: calc(100% - 150px);margin: 0 26px 0 0;}
.i-news ul li .i-date{float:right; width: 124px; text-align: center;border-radius: 5px; color: #fff;font-size: 15px;padding:5px 8px;letter-spacing: 1px;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d7a50c+0,b18410+100 */
background: #d7a50c; /* Old browsers */
background: -moz-linear-gradient(-45deg, #d7a50c 0%, #b18410 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, #d7a50c 0%,#b18410 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, #d7a50c 0%,#b18410 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d7a50c', endColorstr='#b18410',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
.fa-angle-double-right{color: #9b8132;font-size: 18px;padding: 0 8px 0 8px;}

.news-more{ text-align: center; color: #fff; font-size: 12px;display: block; width: 448px;height: 34px; margin:14px auto 0 auto;}
.news-more a{display: block; background: url(../images/more001_bg.png) no-repeat center bottom;color: #fff; background-size: 100%;height: 34px;padding: 10px 5px;}
.news-more a:hover{display: block; background: url(../images/more002_bg.png) no-repeat center bottom;background-size: 100%;height: 34px;}


/***  會員登入  ***/
h3.login-title { margin:10px 0 10px 0; font-family:"Times New Roman"; font-size:30px; line-height:30px; color:#9B9B9B;}
.login-tool {}
.icon-tool { width:40px; height:auto; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.member-signup { font-size:14px; color:#828282; line-height:20px; padding:5px 0; text-align:center;}
.calender { width:30px; height:auto;}


/***  版面欄位  ***/
.main { padding-top:0px;}
.col-100 {float:left; width:100%;}
.col-010 { width:9%; margin-right:1%; float:left;}
.col-015 { width:14%; margin-right:1%; float:left;}
.col-020 { width:19%; margin-right:1%; float:left;}
.col-025 { width:24%; margin-right:1%; float:left;}
.col-030 { width:29%; margin-right:1%; float:left;}
.col-035 { width:34%; margin-right:1%; float:left;}
.col-040 { width:39%; margin-right:1%; float:left;}
.col-045 { width:44%; margin-right:1%; float:left;}
.col-050 { width:49%; margin-right:1%; float:left;}
.col-055 { width:54%; margin-right:1%; float:left;}
.col-060 { width:59%; margin-right:1%; float:left;}
.col-065 { width:64%; margin-right:1%; float:left;}
.col-070 { width:69%; margin-right:1%; float:left;}
.col-075 { width:74%; margin-right:1%; float:left;}
.col-080 { width:79%; margin-right:1%; float:left;}
.col-085 { width:84%; margin-right:1%; float:left;}

.cor-010 { width:10%; float:left;}
.cor-015 { width:15%; float:left;}
.cor-020 { width:20%; float:left;}
.cor-025 { width:25%; float:left;}
.cor-030 { width:30%; float:left;}
.cor-035 { width:35%; float:left;}
.cor-040 { width:40%; float:left;}
.cor-045 { width:45%; float:left;}
.cor-050 { width:50%; float:left;}
.cor-055 { width:55%; float:left;}
.cor-060 { width:60%; float:left;}
.cor-065 { width:65%; float:left;}
.cor-070 { width:70%; float:left;}
.cor-075 { width:75%; float:left;}



/***  選單與下拉  ***/
.menu-shadow{display: block; background: url(../images/menu-shadow.png) no-repeat top center; height: 14px; width: 100%;margin: 0 0 -100px 0;}

nav {}
 .menu {background: url(../images/menu_bg.png) no-repeat center center; list-style:none; position:relative;max-width: 1200px;  margin: 0 auto;padding: 0;}
 .menu>li { color:#fff;float: left;width:15.13%; font-size:16px; text-align:center; position:relative;  line-height:16px; border-right:1px #3a2e05 solid; cursor:pointer;box-shadow: 1px 0 0 0 #846b16;}
 .menu>li .menu-en{font-size: 12px; color: #e9d3a0;}
 .menu>li:nth-child(3){margin: 0 4.6% 0 0;box-shadow:inherit; border-right:0px #3a2e05 solid;}
 .menu>li:nth-child(4){margin: 0 0 0 4.6%;}
 .menu>li:nth-child(6){box-shadow:inherit; border-right:0px #3a2e05 solid;}
 .menu>li>a { color:#fff; display:block;padding:8px 0 5px 0;}  
 .menu>li>a:hover {transform:scale(1.06);}

 .menu>li.sub>ul.sub-menu { background:rgba(0,0,0,0.5); display: none; position:static; z-index:999; margin:0; padding:0; -webkit-border-radius:  0 0 5px 5px; -moz-border-radius:  0 0 5px 5px;border-radius: 0 0 5px 5px; overflow:hidden;}
 .menu>li.sub:hover ul.sub-menu { position:absolute; display: block; width:100%; left:0; top:47px;
 }
 .menu>li.sub>ul.sub-menu>li { display:block; border-top:1px #fff dotted; }
 .menu>li.sub>ul.sub-menu:hover li { display:block;}
 .menu>li.sub>ul.sub-menu>li>a { display:block; color:#fff;}
 .menu>li.sub>ul.sub-menu>li>a:hover { background: #000000;}
 
 
 /* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fade-in {
  opacity:0;  /* make things invisible upon start */
  -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:0.3s;
  -moz-animation-duration:0.3s;
  animation-duration:0.3s;
}
@media screen and (max-width:900px){
 .menu>li {width:14%; }
 .menu>li:nth-child(3){margin: 0 8% 0 0;}
 .menu>li:nth-child(4){margin: 0 0 0 8%;}
}


/*** 訂位填寫  ***/
.show-date { background:#14A1F0; padding:5px 10px; font-size:14px; color:#fff; line-height:25px; margin-bottom:5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
.show-date a { color:#D0FF00; text-decoration:none;}
.show-date a:hover { color:#F0FF9B;}
.kyein-be-member { background: #FF1115; padding:5px 10px; font-size:14px; color: #FFDADA; line-height:25px; margin-bottom:5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}


/*** 訂位區塊  ***/
.info-box { font-size:14px; color: #686868; line-height:20px; padding-bottom:10px; margin-bottom:10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
h4.info-title { background: #FFEDED; font-size:17px; line-height:30px; color: #AD3A3C; padding: 0 0 0 10px; margin:5px 0px 10px 0px;  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-weight:normal;}
.info-content { padding:0 0 10px 20px;}
.info-content ul { list-style:square; margin:0 0 0 0px; padding:0 0 0 20px;}
.info-content ul li { border-bottom:1px #BFBFBF dotted; margin-bottom:10px; color: #A41C1F;}
.info-content ul li p { font-size:12px; color:#767676; margin:0 0 10px 0; padding:0;}
h5.info-set-opint { color:#69B7FF; font-size:15px; line-height:25px; border-bottom:1px #D9D9D9 solid; margin:0 0 10px 0;}

/***  step  ***/
.steps { text-align:center; padding:25px 0; }
.steps .step { display:inline-block; width:240px; max-width:33%; text-align:center; margin:0 -2px;}
.steps .step span { display:block; font-weight:bold;  }
.steps .step span.badge { position:relative; height:30px; line-height:30px; text-align:center; }
.steps .step span.badge .text { position:absolute; left:calc(50% - 15px); font-size:18px; font-family:Arial; color:#fff; background-color:#c4bdb3; display:inline-block; width:30px; height:30px; line-height:30px; border-radius:50%; z-index:1; }
.steps .step.active span.badge .text { color:#fff; background-color:#211300;}
.steps .step span.badge:before { content:""; position:absolute; background-color:#c4bdb3; width:100%; height:2px; top:50%; left:0; margin-top:-1px; z-index:0; }
.steps .step:first-child .badge::before {width:50%; left:50%;}
.steps .step:last-child .badge::before {width:50%; right:50%;}



/***  歷史訂單  ***/
.table-border { background: #DBDBDB; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-bottom:10px;}
.table-border th {  font-size:14px; color:#fff; padding:3px 5px;}
.table-border td { font-size:14px; color: #515151; padding:3px 5px; text-align:center; }

.table-border tr:first-child { background:#FF6700; font:12px; padding:3px 5px; -webkit-border-radius:5px 5px 0 0; -moz-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;}
.table-border tr:last-child { background:#FFF; font:12px; padding:3px 5px; -webkit-border-radius:0 0px 5px 5px; -moz-border-radius:0 0px 5px 5px; border-radius:0 0px 5px 5px;}
.table-border tr:nth-child(2n){ background:#FFF; }
.table-border tr:nth-child(2n+3){ background:#FFFBF0; }

/***  表單欄位  ***/
.form-box { padding:15px 10px;}
.form-box input, .form-box img { vertical-align:middle;}
.form-style01 { font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; padding:5px 0 10px 0; line-height:20px; width:100%;}

.opinion { margin-bottom:15px;position: relative; }
.opinion-left01 {position: absolute; top:-10px;left: 1em;  background:#fff;padding:0 2px; font-size:13px; font-family:"微軟正黑體"; color:#6b4d25; line-height:1.6em;}
				  
.opinion-right01 { float:left; width:7.5%; padding:0px 2%; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:20px; border-left:0;}
				

.input-main-style02-active { background:#eeeeee; float:left; width:70%; border: 0; margin:0; padding:5px 3%; font-size:14px; color:#C10003; line-height:20px;}
.input-main-style03 {border: 1px solid #6b4d25;border-radius: 5px;background: #fff; width:100%; margin:0; padding:.51em 1em; font-size:15px; font-family:"微軟正黑體"; color:#333; line-height:1.6em;}
.input-main-style04 {  background:#eeeeee;flex: auto; border: 0; margin:0; padding:.33em 1em; font-size:15px; font-family:"微軟正黑體"; color:#4E4E4E;line-height: 1.6em;min-height:calc(2.5em + .3333px);}
.input-main-select {border: 1px solid #6b4d25;border-radius: 5px;background: #fff; width:100%; margin:0 0 15px 0; padding:.143em; font-size:15px; color:#333; line-height:1.6em;}
.input-main-select select {border:none;border-radius: 5px;background: #fff;width:49%;margin: 0; padding:.6em ; color:#333; line-height:1.6em;font-family:"微軟正黑體";}

.select-style { background: #8a6e0c; font-size:15px; color:#ffffff; line-height:20px; padding:5px 10px; border: 0; }

.order-numb { color:#FF0004;}

/***  輸入欄位  ***/
.input-style02{border: 1px solid #6b4d25;border-radius: 5px;background: #fff; width:100%; margin:0; padding:.51em 1em; font-size:15px; font-family:"微軟正黑體"; color:#333; line-height:1.6em;}
input { }

.input-botton01 { padding:5px 3%; line-height:18px; font-size:13px; font-family:"微軟正黑體"; color:#4E4E4E; width:100px; margin:0 auto; text-align:center; 
                  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-bottom:5px; text-shadow: 1px 0px #fff; font-weight:800;}

.select-style01 {border:1px #CBCBCB solid; padding:5px 3%; width:99%; line-height:20px; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; margin:0;
                 -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
                 -moz-box-shadow:0px 0px 5px #E9E9E9 inset;              /* For Firefox3.6+ */
	             -webkit-box-shadow:0px 0px 5px #E9E9E9 inset;           /* For Chrome5+, Safari5+ */
	             box-shadow:0px 0px 5px #E9E9E9 inset;                   /* For Latest Opera */}

.input-main-style01[type="text"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: -webkit-calc(2.5em + 2px);
  height: calc(2.5em + 2px);
  margin: 0 0 .5em;
  padding: 1em;
  border: 1px solid #cccccc;
  border-radius: 5px;
  background: #fff;
  resize: none;
  outline: none;font-size:15px;color: #333;font-family:"微軟正黑體";line-height: 1.6em;
}
.input-main-style01[type="text"][required]:focus {
  border-color: #6b4d25;
}
.input-main-style01[type="text"][required]:focus + label[placeholder]:before {
  color: #6b4d25;
}
.input-main-style01[type="text"][required]:focus + label[placeholder]:before,
.input-main-style01[type="text"][required]:valid + label[placeholder]:before {
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transform: translate(0, -1.5em) scale(0.9, 0.9);
  -ms-transform: translate(0, -1.5em) scale(0.9, 0.9);
  transform: translate(0, -1.5em) scale(0.9, 0.9);
}
.input-main-style01[type="text"][required]:invalid + label[placeholder][alt]:before {
  content: attr(alt);
}
.input-main-style01[type="text"][required] + label[placeholder] {
  display: block;
  pointer-events: none;
  line-height: 1.6em;
  margin-top: -webkit-calc(-2.5em - 2px);
  margin-top: calc(-2.5em - 2px);
  margin-bottom: -webkit-calc((2.5em - 1em) + 2px);
  margin-bottom: calc((2.5em - 1em) + 2px);
}
.input-main-style01[type="text"][required] + label[placeholder]:before {
  content: attr(placeholder);
  display: inline-block;
  margin: 0 -webkit-calc(1em + 2px);
  margin: 0 calc(1em + 2px);
  padding: 0 2px;
  color: #999;
  white-space: nowrap;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff));
  background-image: -webkit-linear-gradient(top, #ffffff, #ffffff);
  background-image: linear-gradient(to bottom, #ffffff, #ffffff);
  -webkit-background-size: 100% 5px;
  background-size: 100% 5px;
  background-repeat: no-repeat;
  background-position: center;
}
.password{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: -webkit-calc(2.5em + 2px);
  height: calc(2.5em + 2px);
  margin: 0 0 .5em;
  padding: 1em;
  border: 1px solid #cccccc;
  border-radius: 5px;
  background: #fff;
  resize: none;
  outline: none;font-size:15px;color: #333;font-family:"微軟正黑體";line-height: 1.6em;
}
.password[required]:focus {
  border-color: #6b4d25;
}
.password[required]:focus + label[placeholder]:before {
  color: #6b4d25;
}
.password[required]:focus + label[placeholder]:before,
.password[required]:valid + label[placeholder]:before {
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transform: translate(0, -1.5em) scale(0.9, 0.9);
  -ms-transform: translate(0, -1.5em) scale(0.9, 0.9);
  transform: translate(0, -1.5em) scale(0.9, 0.9);
}
.password[required]:invalid + label[placeholder][alt]:before {
  content: attr(alt);
}
.password[required] + label[placeholder] {
  display: block;
  pointer-events: none;
  line-height: 1.6em;
  margin-top: -webkit-calc(-2.5em - 2px);
  margin-top: calc(-2.5em - 2px);
  margin-bottom: -webkit-calc((2.5em - 1em) + 2px);
  margin-bottom: calc((2.5em - 1em) + 2px);
}
.password[required] + label[placeholder]:before {
  content: attr(placeholder);
  display: inline-block;
  margin: 0 -webkit-calc(1em + 2px);
  margin: 0 calc(1em + 2px);
  padding: 0 2px;
  color: #999;
  white-space: nowrap;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff));
  background-image: -webkit-linear-gradient(top, #ffffff, #ffffff);
  background-image: linear-gradient(to bottom, #ffffff, #ffffff);
  -webkit-background-size: 100% 5px;
  background-size: 100% 5px;
  background-repeat: no-repeat;
  background-position: center;
}






.input-style01[type="text"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: -webkit-calc(12em + 2px);
  height: calc(12em + 2px);
  margin: 0 0 .5em;
  padding: 1em;
  border: 1px solid #cccccc;
  border-radius: 5px;
  background: #fff;
  resize: none;
  outline: none;font-size:15px;color: #333;font-family:"微軟正黑體";line-height: 1.6em;
}
.input-style01[type="text"][required]:focus {
  border-color: #6b4d25;
}
.input-style01[type="text"][required]:focus + label[placeholder]:before {
  color: #6b4d25;
}
.input-style01[type="text"][required]:focus + label[placeholder]:before,
.input-style01[type="text"][required]:valid + label[placeholder]:before {
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transform: translate(0, -1.5em) scale(0.9, 0.9);
  -ms-transform: translate(0, -1.5em) scale(0.9, 0.9);
  transform: translate(0, -1.5em) scale(0.9, 0.9);
}
.input-style01[type="text"][required]:invalid + label[placeholder][alt]:before {
  content: attr(alt);
}
.input-style01[type="text"][required] + label[placeholder] {
  display: block;
  pointer-events: none;
  line-height: 1.6em;
  margin-top: -webkit-calc(-13.1em - 2px);
  margin-top: calc(-13.1em - 2px);
  margin-bottom: -webkit-calc((13.1em - 1em) + 2px);
  margin-bottom: calc((13.1em - 1em) + 2px);
}
.input-style01[type="text"][required] + label[placeholder]:before {
  content: attr(placeholder);
  display: inline-block;
  margin: 0 -webkit-calc(1em + 2px);
  margin: 0 calc(1em + 2px);
  padding: 0 2px;
  color: #999;
  white-space: nowrap;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff));
  background-image: -webkit-linear-gradient(top, #ffffff, #ffffff);
  background-image: linear-gradient(to bottom, #ffffff, #ffffff);
  -webkit-background-size: 100% 5px;
  background-size: 100% 5px;
  background-repeat: no-repeat;
  background-position: center;
}



.input-main-style02[type="text"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: -webkit-calc(2.5em + 2px);
  height: calc(2.5em + 2px);
  margin: 0 0 .5em;
  padding: 1em;
  border: 1px solid #cccccc;
  border-radius: 5px;
  background: #fff;
  resize: none;
  outline: none;font-size:15px;color: #333;font-family:"微軟正黑體";line-height: 1.6em;
}
.input-main-style02[type="text"][required]:focus {
  border-color: #6b4d25;
}
.input-main-style02[type="text"][required]:focus + label[placeholder]:before {
  color: #6b4d25;
}
.input-main-style02[type="text"][required]:focus + label[placeholder]:before,
.input-main-style02[type="text"][required]:valid + label[placeholder]:before {
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transform: translate(0, -1.5em) scale(0.9, 0.9);
  -ms-transform: translate(0, -1.5em) scale(0.9, 0.9);
  transform: translate(0, -1.5em) scale(0.9, 0.9);
}
.input-main-style02[type="text"][required]:invalid + label[placeholder][alt]:before {
  content: attr(alt);
}
.input-main-style02[type="text"][required] + label[placeholder] {
  display: block;
  pointer-events: none;
  line-height: 1.6em;
  margin-top: -webkit-calc(-2.5em - 2px);
  margin-top: calc(-2.5em - 2px);
  margin-bottom: -webkit-calc((2.5em - 1em) + 2px);
  margin-bottom: calc((2.5em - 1em) + 2px);position: relative;
}
.input-main-style02[type="text"][required] + label[placeholder]:before {
  content: attr(placeholder);
  display: inline-block;
  margin: 0 -webkit-calc(1em + 2px);
  margin: 0 calc(1em + 2px);
  padding: 0 2px;
  color: #999;
  white-space: nowrap;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff));
  background-image: -webkit-linear-gradient(top, #ffffff, #ffffff);
  background-image: linear-gradient(to bottom, #ffffff, #ffffff);
  -webkit-background-size: 100% 5px;
  background-size: 100% 5px;
  background-repeat: no-repeat;
  background-position: center;
}
.code { width:100px;height: auto;position: absolute; top: 0; right: 0;margin:-5px 5px 0px 5px; vertical-align:middle;}



.input-main-style04 {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: -webkit-calc(2em + 2px);
  height: calc(2em + 2px);
  margin: 0 0 .6em;
  padding: .7em 1em 1.8em 1em;
  border: 1px solid #cccccc;
  border-radius: 5px;
  background: #fff;
  resize: none;
  outline: none;font-size:15px;color: #333;font-family:"微軟正黑體";line-height: 1.6em;
}
.input-main-style04:focus {
  border-color: #6b4d25;
}
.input-main-style04:focus + label[placeholder]:before {
  color: #6b4d25;
}
.input-main-style04:focus + label[placeholder]:before,
.input-main-style04:valid + label[placeholder]:before {
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transform: translate(0, -1.5em) scale(0.9, 0.9);
  -ms-transform: translate(0, -1.5em) scale(0.9, 0.9);
  transform: translate(0, -1.5em) scale(0.9, 0.9);
}
.input-main-style04:invalid + label[placeholder][alt]:before {
  content: attr(alt);
}
.input-main-style04 + label[placeholder] {
  display: block;
  pointer-events: none;
  line-height: 1.6em;
  margin-top: -webkit-calc(-4.1em - 2px);
  margin-top: calc(-4.1em - 2px);
  margin-bottom: -webkit-calc((4.1em - 1em) + 2px);
  margin-bottom: calc((4.1em - 1em) + 2px);
}
.input-main-style04 + label[placeholder]:before {
  content: attr(placeholder);
  display: inline-block;
  margin: 0 -webkit-calc(1em + 2px);
  margin: 0 calc(1em + 2px);
  padding: 0 2px;
  color: #999;
  white-space: nowrap;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff));
  background-image: -webkit-linear-gradient(top, #ffffff, #ffffff);
  background-image: linear-gradient(to bottom, #ffffff, #ffffff);
  -webkit-background-size: 100% 5px;
  background-size: 100% 5px;
  background-repeat: no-repeat;
  background-position: center;
}

.input-main-style05 {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;min-height: 20px;
  margin:0;
  padding:2px 10px;
  border: 1px solid #cccccc;
  border-radius: 5px;
  background: #fff;
  resize: none;
  outline: none;font-size:15px;color: #333;font-family:"微軟正黑體";line-height: 1.6em;
}



/* 頁次 */	
.page{background: #dbd1af; font-size:13px; color:#3f3000; text-align: center; clear:both; margin:20px 0;padding:4px 5px; line-height: 1.6em; }
  .page a {color:#3f3000; padding:10px 0px 5px 0px; }
  .page a:hover {  color: #645010;}
  .page br { display:none;}
.fa-chevron-circle-left{ font-size: 20px;padding:5px 0px 5px 0px; }
.fa-chevron-circle-right{font-size: 20px;padding:5px 0px 5px 0px; }
.fa-reply-all{font-size:16px;padding:5px 0px 5px 0px; }

/******  底部資訊  ******/
.bottom-info-main { max-width:1200px; margin:0 auto;background: url(../images/footer-line.png) no-repeat center bottom; background-size: 100%;padding:0 0 10px 0;}
.bottom-info-main ul { list-style:none; margin:0; padding:0; text-align: center; }
.bottom-info-main ul li {display: inline-block; text-align: center;font-size: 14px;}
.bottom-info-main ul li a { color:#f8ec9a;padding: 0 10px;}
.bottom-info-main ul li a:hover { color:#fff7c2;}

footer {background: url(../images/footer-main_bg.png) center center;border-top: 1px #fff solid; box-shadow: 0 -1px 0 0 #543d1e;}
footer .footer{max-width: 1200px; margin: 0 auto; background: url(../images/footer_bg.png) no-repeat center center;background-size:cover;padding:6px 0;position: relative;}
footer .footer:before {background: url(../images/footer-shadow.png)no-repeat center top; content: "";display: block;width: 100%; height: 15px;margin: -6px 0 0 0;}
footer .footer .information{font-size: 14px;color: #fff;text-align: center;padding: 10px 0 0 0;}
footer .footer .information span{}
footer .footer .information br{display: none;}
footer .footer .copyright{font-size: 12px;color: #fff;text-align: center;}
footer .wd{font-size: 12px; color: #8a7449;position: absolute; bottom:6px;right:10px;}
footer .wd a{font-size: 12px; color: #8a7449;}
footer .wd a:hover{color: #b9a57f;}

a.first-buy  { background: #e75353; padding: 15px; font-size: 18px; color: #ffffff; display:block; text-align: center;}
a.first-buy:hover {  background: #c42d2d; }


/* 購買數量增減模組 */
.cart-info .quantity {display: flex; font-size:15px; color: #333;  vertical-align:middle;padding:10px 0; line-height:30px;}
.cart-info .quantity select { line-height:25px;}
.quantity-title{background: #351f02; width:100px;color: #fff; text-align: center;}
.qtyInputBox{flex: auto; vertical-align:middle; height:30px;}
.qtyInputBox .input-group-btn, .qtyInputBox input{display:table-cell; position:relative; float:left; top:0; }
.qtyInputBox button{display:block; width:30px; height:30px; margin:0; padding:0; vertical-align:middle; border:1px solid #351f02;}
.qtyInputBox button i{display:block; width:100%; height:100%; margin:0; padding:0; line-height:30px; background-color:#fff;}
.qtyInputBox button i:hover{background-color:#eee;}
.qtyInputBox input{margin-bottom:0; width:calc(100% - 60px); height:30px; line-height:30px; border:0; border-top:1px solid #351f02; border-bottom:1px solid #351f02; vertical-align:middle; padding:0 5px; text-align:center; }
.qtyInputBox button:focus, input:focus{outline:0;}

/* 購物車狀況模組 */
#sidr-left{font:15px/1.8em Arial, "Microsoft JhengHei"; display:none; position:absolute; position:fixed; top:0; height:100%; z-index:999999; width:260px; overflow-x:none; overflow-y:auto; font-family:"lucida grande",tahoma,verdana,arial,sans-serif; font-size:15px;color:#fff; -webkit-box-shadow:inset 0 -3px 30px 0 #000; -moz-box-shadow:inset 0 -3px 30px 0 #000; box-shadow:inset 0 -3px 30px 0 #000;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#53340b+0,190f00+100 */
background: #53340b; /* Old browsers */
background: -moz-linear-gradient(-45deg, #53340b 0%, #190f00 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, #53340b 0%,#190f00 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, #53340b 0%,#190f00 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#53340b', endColorstr='#190f00',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
#sidr-left *{font-family: "微軟正黑體"; color:#fff;}
#sidr-left .cart-header{padding:20px;}
#sidr-left .cart-header .fa{font:20px FontAwesome;}

#sidr-left .ng-hide{padding:15px; text-align: center;}
#sidr-left .cart-items{padding:15px;}
#sidr-left .cart-item{margin:5px 0;border-bottom: 1px #928068 dashed;padding:5px 0;}
#sidr-left .cart-item .product-link img{margin-right:10px;width:60px;height:43px;float:left;}
#sidr-left .cart-item .cart-item-content{float:left; width:120px;}
#sidr-left .cart-item .cart-item-content .title{ font-size: 14px; color: #fff;line-height: 1.6em;}
#sidr-left .cart-item .cart-item-content .ng-scope{font-size: 13px; color: #fff;line-height: 1.4em;}
#sidr-left .cart-item .cart-item-content .price-details{font-size: 13px; color: #fff;line-height: 1.4em;}

#sidr-left .cart-item a.remove{color:#ffd1d1; float:right;}
#sidr-left .cart-item a.remove:hover{color:#ff6060;}
#sidr-left .cart-chkt-btn{ width:100%; display:block; padding:15px;}
#sidr-left .cart-chkt-btn button{width:100%; font-size:14px; line-height:1.4em; padding:6px 12px; border:1px solid #928068; text-align: center; background-color:#6f542f; border-radius:4px; }
#sidr-left .cart-chkt-btn button:hover{background-color:#211300;}

.modal-backdrop{position:fixed; top:0; right:0; bottom:0; left:0;}