@charset "utf-8";
@import url("reset.css");
@import url("loading.css");

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> Common <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

*{ box-sizing: border-box; letter-spacing: 1px;}
html { height:100% }
body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; -webkit-text-size-adjust:none; font-size:12px; overflow-y:scroll; overflow-x:hidden; }
body, td, th,select,input {font-size:12px;font-family: /*Arial,*/ "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif;color:#333333;}

/*簡易設定*/
.iframe_ch { display:none }
.middle { vertical-align:middle; }
.center { text-align:center; }
.w100{ width:100%; }
.web-bg{width:100%;overflow:hidden;/* background:url(../../images/bg.png) repeat; *//*background-size:cover;*/}
.web-bg-c{background: #E3DEDA;}

/*修正Safari*/
input, select, textarea { -ms-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box; -webkit-box-sizing:content-box; }
input[type='text'],input[type='password'],input[type='button'],input[type='submit'],textarea,select { -webkit-appearance: none; }
select{ background:#ffffff;s }

/*分頁*/
.pager{ width:100%; overflow:hidden; margin:50px auto 50px auto; text-align:center; }

/*麵包屑*/
#sitemap{width:100%;box-sizing: border-box;padding: 25px 0 0px 0;}
#sitemap .wrap{width:100%;max-width:1400px;padding: 0 10px 15px 10px;margin: 0 auto;line-height:20px;box-sizing: border-box;font-size:14px;letter-spacing:1px;color: #906928;text-align:right;/* border-bottom: 1px solid #906928; */}
#sitemap .wrap a{color: #906928;text-decoration:none;}
#sitemap .wrap i{color: #906928;}

.gotop{ position:fixed; bottom:100px; right:20px; z-index:99; width:70px; }

/*Hamburger*/
#nav-icon1,#nav-icon2,#nav-icon3,#nav-icon4{display:none;position:absolute;left: 20px;top: 5px;}

/*全營幕遮罩*/ 
.bg-overlay{display:block;position:fixed;left:0;top:0;background:rgba(0,0,0,0.7);opacity:0;visibility:hidden;width:100%;height:100%;z-index:2;-webkit-transition:.4s;-o-transition:.4s;transition:.4s}
.bg-overlay.visible{opacity:1;visibility:visible} 

/*表格*/
#css_table {display:table;width:100%;}
.css_tr {display: table-row;}
.css_td {display: table-cell;text-align:left;vertical-align: top;padding: 15px 5px;box-sizing:border-box;letter-spacing:1px;font-size: 15px;color: #906928;}

/*編輯器內文*/
.editor{font-size: 16px;padding: 15px 0px 20px 0px;clear:both;letter-spacing:1px;line-height:30px;color: #424242;}
.editor a{ color:#bc8e8e; text-decoration:underline; }

.hidden {
  display: none !important;
}

.invisible {
  visibility: hidden !important;
}

/*網頁標題*/
.page-title{text-align: left;letter-spacing: 5px;color: #906928;/* font-weight: bold; */font-size: 26px;line-height:30px;padding: 50px 20px 30px 20px;font-family: Arial, "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif;}
.page-title span{display:block;font-size:22px;letter-spacing: 4px;font-weight: normal;color: #d2bb8b; !important;padding: 10px 0 0px 0;margin-top: 9px;/* font-family: 'Libre Baskerville', serif; */}
.page-title:after {
  content: "";
  display: block;
  width: 50px;
  height: 5px;
  background-color: #d2bb8b;
  margin: 8px 0 0 0;
}
.page-subtitle{text-align:center;letter-spacing: 2px;color: #906928;border-bottom: 1px solid #d2bb8b;font-size: 24px;line-height: 25px;padding: 0 0 20px 0;margin: 0px 0px 30px 0px;font-family: Arial, "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif;}
.page-subtitle span{display:block;font-size: 26px;letter-spacing:2px;color: #B38C90; !important;padding: 10px 0 0px 0;margin-bottom:10px;font-family: 'Libre Baskerville', serif;}

/*左右欄的頁面*/
.container{position:relative;max-width: 1400px;min-height:500px;margin: 0px auto 0 auto;padding: 0 0 20px 0;}
.container .layout-left{width: 20%; float:left;box-sizing: border-box;padding: 0 10px;}
.container .layout-right{width: 80%;float:left;box-sizing: border-box;padding: 0 10px;}
.container .layout-full{width: 100%;float:left;box-sizing: border-box;padding: 0 10px;}
.container .layout-full .frames{max-width: 1400px;margin: 0 auto 40px auto;background:#ffffff;box-shadow: 1px 1px 8px #ecdcbc;padding: 50px 5vw;}

/*網站內頁標題區塊*/
.website-header{ position: relative;}
.website-header.norabbit::after {
  display: none;
}
.website-header::after {
  content: "";
  position: absolute;
  right: 50px;
  bottom: 0;
  width: 102px; /* Adjust the width as needed */
  height: 144px; /* Adjust the height as needed */
  background: url(../../images/inner-rabbit.png) no-repeat;
  background-size: contain;
}

.website-header ul {
  list-style: none;
  padding: 20px 0;
  margin: 0px 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.website-header ul li {
  padding: 0px 30px;
  position: relative;
}

.website-header ul li a {
  display: inline-block;
  text-decoration: none;
  font-size: 18px;
  color: #b38b59;
  padding: 0px 0 9px 0;
  transition: color 0.3s ease;
  position: relative;
}

.website-header ul li a:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background: #eab539;
  transition: width 0.3s ease;
}

.website-header ul li:before {
  content: '';
  position: absolute;
  top: 38%;
  right: 0;
  width: 1px;
  height: 20px;
  background: #eab539;
  transform: translateY(-50%);
}

.website-header ul li:last-child:before {
  display: none;
}

.website-header ul li a.on:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: #eab539;
  transition: width 0.3s ease;
}

.website-header ul li a:hover:after {
  width: 100%;
}

/* RWD 支援 */
@media screen and (max-width: 1000px) {
  #sitemap{ margin-top: 100px;}
  .website-header ul { display: none;}
}
@media (max-width: 768px) {
  .page-title{font-size: 20px;padding: 20px 20px 20px 20px;}
  .page-title span{ font-size: 20px;}
  .website-header .page-title {
      font-size: 20px;
  }

  .website-header ul li a {
      font-size: 14px;
  }
}

/*左邊選單1*/
.left-menu{ width:100%; max-width:180px; overflow:hidden; }
.left-menu a{display:block;color:#252525;font-size:14px;letter-spacing:1px;text-decoration:none;padding:10px;margin:0 0 20px 0;box-sizing:border-box;}
.left-menu a:hover{color:#736357;}
.left-menu a.on{background: #906928;color:#ffffff;}

/*底部選單*/
.bottom-menu{ width:100%; overflow:hidden; display:none; margin-top:30px; }
.bottom-menu a{ display:block; color:#000000; background:#ffffff; border:1px solid #ebebeb; text-align:center; font-size:16px; letter-spacing:1px; text-decoration:none; padding:10px; margin:0 0 10px 0; box-sizing:border-box; }
.bottom-menu a:active{color:#ffffff; background:#000000;}
.bottom-menu a.on{ /*background:#000000; color:#ffffff;*/ }

/*左邊選單2*/
.left-menu2{ width:100%; max-width:180px; margin-top:50px; overflow:hidden; }
.left-menu2 a{display:block;color: #736357;font-size:14px;line-height:20px;border: 1px solid #736357;letter-spacing:1px;text-decoration:none;padding:10px;margin:0 0 20px 0;box-sizing:border-box;}
.left-menu2 a:hover{background:#736357;color:#ffffff;
transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-webkit-transition: all 1s ease;
-o-transition: all 1s ease;
}
.left-menu2 a.on{ background:#8e5a5a; color:#ffffff; }


/*內頁Banner*/
#banner_box{width:100%;overflow:hidden;margin-top: 0px;}
#banner{ position:relative; width:100%; height:1000px; overflow:hidden;background-size: cover;
transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-webkit-transition: all 1s ease;
-o-transition: all 1s ease;
}
#banner.banner_load {
	transform: scale(1.1);
	
} 

/*商品數量選擇器*/
.btn-cart{width:100%;overflow:hidden;/* max-width:135px; *//* margin:45px 0 20px 0; */}
.btn-cart span{border: 1px solid #906928;background: #906928;color: #ffffff;font-weight:bold;padding: 5px 12px;cursor:hand;cursor:pointer;border-radius: 50px;}
.btn-cart .jq_increase{padding: 5px 9px;}
.btn-cart span:hover{ background:#ed931f; border: 1px solid #ed931f; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }
.btn-cart input{border: 1px solid #906928;outline:0;width: 80px;height: 33px;text-align:center;font-size: 16px;color: #333333;background: #ffffff;-webkit-border-radius: 0px;-moz-border-radius: 0px;border-radius: 0px;}

/*網站按鈕*/
.btn1{display:inline-block;color:#FFFFFF;border-radius: 20px;font-size:16px;width:auto;padding: 10px 20px;margin:5px 0;border:0;letter-spacing:2px;cursor:hand;cursor:pointer;background: #d25236;outline:0;text-decoration:none;}
.btn1.on{background:#d25236;}
.btn1:hover{ background:#ce4426; -webkit-transition: all .4s ease;
 -moz-transition: all .4s ease;
 -o-transition: all .4s ease;
 transition: all .4s ease;
 -ms-transition: all .4s ease
}


.webbtn1{display:inline-block;color: #ffffff!important;font-size:15px !important;width: 145px;padding: 5px 0px 5px 0;margin: 5px 0;line-height: 30px;text-decoration:none;letter-spacing:2px;text-align: center;border-radius: 30px;border: 1px solid #d25236;background: #d25236;cursor:hand;cursor:pointer;}
.webbtn1 img{ vertical-align:-20%;}
.webbtn1:hover{
 background: #d44323;
 color:#ffffff !important;
 border: 1px solid #d44323;
 -webkit-transition: all .4s ease;
 -moz-transition: all .4s ease;
 -o-transition: all .4s ease;
 transition: all .4s ease;
 -ms-transition: all .4s ease;
 }
.webbtn1:hover img{ filter: brightness(0) invert(1); }
.webbtn1.on{ background:#bc8e8e; color:#ffffff !important; border: 1px solid #bc8e8e; }

.webbtn2 {
  display: inline-block;
  color: #ffffff !important;
  font-size: 15px !important;
  width: 145px;
  padding: 5px 0px 5px 0;
  margin: 5px 0;
  line-height: 30px;
  text-decoration: none;
  letter-spacing: 2px;
  text-align: center;
  border-radius: 30px;
  border: 1px solid #989898;
  background: #989898;
  cursor: hand;
  cursor: pointer;
}
.webbtn2 img {
  vertical-align: -20%;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
.webbtn2:hover {
  background: #7a7a7a;
  color: #ffffff !important;
  border: 1px solid #7a7a7a;
  -webkit-transition: all .4s ease;
  -moz-transition: all .4s ease;
  -o-transition: all .4s ease;
  transition: all .4s ease;
  -ms-transition: all .4s ease;
}
 -moz-transition: all .4s ease;
 -o-transition: all .4s ease;
 transition: all .4s ease;
 -ms-transition: all .4s ease}

.webbtn2:hover img{filter: brightness(0) invert(1);}

.webbtn3{display:inline-block;color: #ffffff!important;background: #d25236;font-size:15px !important;/* width: 145px; */padding: 7px 20px;margin: 5px 0;/* line-height: 4px; */text-decoration:none;letter-spacing:2px;border: 1px solid #bc8e8e;cursor:hand;cursor:pointer;-webkit-border-radius:0px;-moz-border-radius: 0px;border-radius: 30px;}

.btn-1{display: inline-block; background: #499AA2; color:#ffffff; font-size:14px;width:auto;padding: 15px 50px;text-decoration:none;letter-spacing:2px;cursor:pointer;border: 1px solid #499AA2;}
.btn-1:hover{ background:#499AA2; color:#ffffff; transition: all 0.3s ease; }


@media screen and (max-width:1000px) {
  #banner_box{margin-top: 100px;}
}
@media screen and (max-width:768px) {
	.noneM{ display:none; }
	#banner{height: 500px;}
}
@media screen and (max-width:480px) {
	.noneS{ display:none; }	
	.bottom-menu{ display:block; }
	
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> Layout <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#wrapper{position:relative;width:100%;transition: margin-left .5s;background: #f4e8d1;}
#wrapper .container{width:100%;max-width:1400px;margin: 0px auto;overflow:hidden;}
#wrapper .fix-top{ margin-top:140px;}
#header{/* position:fixed; */left:0;top:0;z-index:2;width:100%;background: #906928;/* background:url(../../images/header-bg.png) repeat-x; */}
#header .wrap{position:relative;/* max-width:1400px; */height: 100px;/* overflow: hidden; */margin:0 auto;display: flex;align-items:center;justify-content: center;}
#header .wrap .logo-b{/* position:fixed; */top: 15px;/*box-shadow:2px 2px 8px rgba(15%,15%,40%,0.1);*/}
#header .wrap .logo-s{/* position:absolute; */top: 20px;left: 0;right: 0;margin-left: auto;margin-right: auto;height:60px;display:none;}

#header ul{/* position:absolute; */left: 230px;top: 48px;list-style:none;text-align:center;margin: 30px 0 0px 0;}
#header ul li{position: relative;float:left;padding: 10px 10px 35px 10px;margin: 0px 25px 0 25px;font-size:16px;color: #e8dcd0;letter-spacing: 3px;border-top:1px solid transparent;border-bottom:1px solid transparent;cursor:hand;cursor:pointer;}
#header ul li .line{position:absolute;bottom: 20px;left:0;width:100%;border-bottom:1px solid transparent;}
#header ul li span{display:block;color: #D2CCBF;font-size:12px;letter-spacing:1px;line-height:30px;height: 30px;}

#header ul li:hover{ color:#e8aa19; /*border-top:1px solid #D2CCBF;*/
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
transition: all .4s ease;
-ms-transition: all .4s ease
}
#header ul li:hover .line{ /*border-bottom:1px solid #D2CCBF;*/
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
transition: all .4s ease;
-ms-transition: all .4s ease
}

#header ul li .img{opacity:0;position:absolute;bottom: 25px;left:0;right: 0;margin-left: auto;margin-right: auto;}
#header ul li:hover .img{ opacity:1; bottom: 10px;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
transition: all .4s ease;
-ms-transition: all .4s ease }

#header nav{position: fixed;max-width: 1200px;width: 100%;text-align: right;right: 20px;top: 2px;z-index: 999;left: 50%;transform: translateX(-50%);/* background: #906928; *//* text-shadow: 1px 1px 1px #000000; */}
#header nav div{display: inline-block;position:relative;font-size:15px;color: #2c2928;letter-spacing:2px;background: rgba(144, 105, 40, 0.8);padding: 3px 10px;border-radius: 30px;}
#header nav div img{vertical-align:-40%;padding:0 3px;filter: brightness(0) invert(1);}

.pdt-search-area{width:100%;text-align: right;padding: 25px 8% 0 0;}
.pdt-search{display: inline-block;position:relative;font-size:15px;color: #2c2928;letter-spacing:2px;background: #f4f0de;padding: 3px 10px;/* border-radius: 30px; */}
.pdt-search img{vertical-align:-40%;padding:0 3px;filter: brightness(0) invert(1);}
.pdt-search input[type='text']{background: #f4f0de;border:0;width:130px;font-size: 15px;padding: 5px 5px 5px 10px;box-sizing:border-box;letter-spacing:1px;outline:0;transition: all .4s ease;}
.pdt-search input[type='text']::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  font-family: /*Arial,*/ "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif;
  color: #906928;
  opacity: 0.8; /* Firefox */
}
.pdt-search input[type='text']:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #906928;
}
.pdt-search input[type='text']::-ms-input-placeholder { /* Microsoft Edge */
  color:#906928;
}

.pdt-search input[type='text']:focus{ width:150px;}
.pdt-search input[type='image'],#header nav i{position:absolute;top: 5px;left: -10px;outline:0;color: #B38C90;font-size: 18px;cursor:pointer;}
.pdt-search i{ color: #906928; cursor: pointer;}


#header nav .linker{font-size:14px;/* border-left: 1px solid #807D76; *//* border-right:1px solid #efded9; */padding: 0 0 0 8px;margin:0 8px;color: #ffffff;}
#header nav .linker a{color: #ffffff;text-decoration:none;}
#header nav .linker a:hover{ text-decoration:underline; }

#header nav span.form_search_m{display: none;/* position:absolute; */right: 13px;top: 35px;font-size: 18px;}
#header nav span.form_search_m i{color: #ffffff;}

/*search-bar*/
#search-bar{position:relative;width:100%;height: 100px;background:#ffffff;position:fixed;top:-180px;z-index:999999999;}
#search-bar .close-btn{ position:absolute; top:10px; right:10px; }
#search-bar .search-btn{position:absolute;right: 3%;top: -20px;font-size: 31px;color: #906928;cursor:pointer;}
#search-bar input[type='text']{border:0;border-bottom:1px solid #CCC;width: 85%;letter-spacing:1px;outline:0;margin: 55px 2% 2px 2%;padding-right:50px;padding-bottom: 5px;box-sizing:border-box;font-size: 20px;}


/*商品選單*/
#header .menu-product{opacity:0;position:absolute;top: 182px;/* max-width: 1400px; */width: 100%;height:0;overflow:hidden;margin: 0 auto;background: #e8aa19;margin-top: -82px;z-index: 4 !important;box-shadow:2px 2px 8px rgba(15%,15%,40%,0.2);-webkit-transition: all .4s ease;-moz-transition: all .4s ease;-o-transition: all .4s ease;transition: all .4s ease;-ms-transition: all .4s ease;}
#header .menu-product .wrap{flex-wrap:wrap;padding: 0 100px 0px 100px;}
#header .menu-product .line{width:100%;clear: both;border-bottom: 1px solid #B38C90;}
#header .menu-product.shows{ opacity:1; height: auto; max-height:540px; }
#header .menu-product a{display:block;text-align: center;margin: 25px 0 25px 0;letter-spacing: 5px;float:left;/* width: 25%; */font-size:15px;color: #906618;text-decoration:none;}
#header .menu-product a:after{color: #f5c23d;content: "|";margin: 0 3vw;}
#header .menu-product a:last-child::after{ content: "";}
#header .menu-product a:hover{ color:#ffffff; }
#header .menu-product a:hover::before{ color:#ffffff; }
/*
#header .menu-product.shows{ opacity:1; height: auto; max-height:540px; }
#header .menu-product .items{ float:left; width:22%; margin:50px 1.5%; cursor:hand; cursor:pointer; }
#header .menu-product .items img{ display:block; }
#header .menu-product .contents{ font-size:24px; letter-spacing:5px; }
#header .menu-product .contents span{ display:block; font-size:14px; letter-spacing:2px; padding:10px 0 50px 0; }
#header .menu-product .items .title{font-size:14px;color: #906618;letter-spacing:3px;text-align:center;padding:8px 0;}
#header .menu-product .items .title-en{font-size: 14px;color: #A38E80;letter-spacing:2px;text-align:center;padding: 10px 0 5px 0;}
*/

/*其它選單*/
#header .menu-news{opacity:0;position:absolute;top: 182px;/* max-width: 1400px; */width: 100%;height:0; box-sizing:border-box;overflow:hidden;margin: 0 auto;background: #e8aa19 !important;margin-top: -82px;z-index: 3 !important;box-shadow:2px 2px 8px rgba(15%,15%,40%,0.2);-webkit-transition: all .4s ease;-moz-transition: all .4s ease;-o-transition: all .4s ease;transition: all .4s ease;-ms-transition: all .4s ease;}
#header .menu-news .wrap{ flex-wrap:wrap;padding: 0 100px 0px 100px;}
#header .menu-news .line{width:100%;clear: both;border-bottom: 1px solid #B38C90;}
#header .menu-news.shows{ opacity:1; height: auto; max-height:540px; }
#header .menu-news a{display:block;text-align: center;margin: 25px 0 25px 0;letter-spacing: 5px;float:left;/* width: 25%; */font-size:15px;color: #906618;text-decoration:none;}
#header .menu-news a:after{color: #f5c23d;content: "|";margin: 0 3vw;}
#header .menu-news a:last-child::after{ content: "";}
#header .menu-news a:hover{ color:#ffffff; }
#header .menu-news a:hover::before{ color:#ffffff; }

/*頁尾*/
#footer{width:100%;/*background:url(../../images/footer-logo.jpg) center center no-repeat;*/background-color: #906928;}
#footer .wrap{width:100%;max-width:1400px;overflow:hidden;/* min-height:200px; */margin:0 auto;padding: 50px 20px 0px 20px;text-align:right;box-sizing:border-box;}
#footer .wrap .logo-area{ text-align: center; }
#footer .wrap .webnav {margin: 0px 0 0px 10px;}
#footer .wrap .webnav a{display:inline-block;color: #e8d0ab;font-size:14px;line-height:20px;letter-spacing:1px;text-decoration:none;}
#cart{border-left: 1px solid #ffffff;padding: 0 5px 0 5px;color: #ffffff;}

#footer .wrap .webnav a:not(:first-child){ margin-left:20px; }
#footer .wrap .webnav a:hover{ text-decoration:none; }
#footer .wrap .copyright{color: #e8d0ab;letter-spacing:1px;line-height:20px;margin-bottom: 15px;}
#footer .wrap .copyright:not(:first-child){ margin-left:20px; }
#footer .wrap .copyright a{color: #e8d0ab;text-decoration:underline;}

@media screen and (max-width:1400px) {
	#header ul{top: 55px;}
	#header ul li{margin: 10px 20px 0 20px;padding: 0 4px 30px 4px;}
}
@media screen and (min-width:1001px) {
	#header nav span.form_search_m{ display:none; }
}
@media screen and (max-width:1000px) {
	#wrapper .fix-top{ margin-top:100px;}
	#header{position: fixed;background-position-y:-50px;height:100px;/* background: #906928; */box-shadow:2px 2px 8px rgba(15%,15%,40%,0.1);}
	#header ul{ display:none; }
	#nav-icon1,#nav-icon2,#nav-icon3,#nav-icon4{ display:block; }
	#header .wrap .logo-b{ display:none; }
	#header .wrap .logo-s{ display:block; }	
  #header nav{top: auto;z-index: auto;}
	#header nav span{ border-left:0; }
	#header nav span.form_search{ display:none; }
	.left-menu, .left-menu2{ display:none; }
	.container .layout-right{ width:100%; }
	#footer{ background-position:center 20px;}
	#footer .wrap{/* padding-top:200px; */text-align:center;}
		
	.none-s{display:none;}	

}
@media screen and (max-width:480px) {
	#footer .wrap .webnav a{ display:block; margin-left:0 !important; padding:10px 0; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 首頁 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/*最新消息*/
#index-news{ width:100%; overflow:hidden; background: #f4e8d1; }
#index-news .wrap{ max-width: 1400px; margin: 0 auto; }
#index-news .items{float:left;width:31%;margin:1%;padding:15px;box-sizing:border-box;border:1px solid #e6e5e5;text-align:center;background: #4C3434;box-shadow: 1px 1px 5px #EBEBEB;}
#index-news .items > .date{color: #B38C90;font-size: 14px;letter-spacing: 1px;padding: 15px 0;}
#index-news .items > .title{color: #ffffff;font-size:16px;letter-spacing: 1px;line-height: 22px;}
#index-news .items > a{display: inline-block;text-decoration:none;margin: 20px 0 5px 0;background: #2E2E2E;font-size: 13px;color: #B38C90;letter-spacing:3px;text-align:center;padding: 10px 15px;transition: all 0.5s ease;}
#index-news .items > a:hover{ background:#1C1C1C; }

  /* index-news 限定樣式，避免與其他區塊衝突 */
  #index-news .news-list {
    display: flex;
    flex-wrap: wrap;
    /* align-items: center; */
    background-color: #F5E9D7;
    padding: 20px 20px 100px 20px;
}

/* 左側圖片 */
#index-news .news-list .news-image {
    flex: 1;
    min-width: 300px;
}

#index-news .news-list .news-image img {
    width: 100%;
    height: auto;
    display: block;
    /* border-radius: 8px; */
}

/* 右側內容區 */
#index-news .news-list .news-content {
    flex: 1.5;
    padding: 0px 5vw;
    min-width: 300px;
}

#index-news .news-list .news-date {
    background: #d65339;
    color: white;
    padding: 8px 15px;
    /* border-radius: 5px; */
    font-size: 15px;
    letter-spacing: 1px;
    display: inline-block;
}

#index-news .news-list .news-title {
    font-size: 22px;
    /* font-weight: bold; */
    color: #906928;
    border-bottom: 1px solid #906928;
    padding: 0 0 20px 0;
    margin: 40px 0 20px 0;
}

#index-news .news-list .news-title a{
  font-size: 22px;
  color: #906928;
  text-decoration: none;
}

#index-news .news-list .news-text {
    font-size: 16px;
    line-height: 30px;
    color: #424242;
    margin-bottom: 50px;
}

/* 按鈕區 */
#index-news .news-list .news-buttons {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

#index-news .news-list .news-buttons a {
    text-decoration: none;
    color: #a89d93;
    font-size: 16px;
    padding: 10px 15px;
    /* border: 1px solid #333; */
    border-radius: 5px;
    transition: all 0.3s;
}

#index-news .news-list .news-buttons a:hover {
    background: #a89d93;
    color: white;
}

/* RWD：小螢幕時調整排版 */
@media (max-width: 768px) {
    #index-news .news-list {
        display: block;
        /* flex-direction: column; */
        /* text-align: center; */
    }
    #index-news .news-list .news-content {
      padding: 0px 0;
  }    
    #index-news .news-list .news-buttons {
        justify-content: center;
        gap: 20px;
    }
}


        /* 品牌故事區塊 */
        #index-about {
          width: 100%;
          background: url(../../images/about-bg.jpg) bottom center no-repeat;
          background-attachment: fixed;
          background-size: cover;
          overflow: hidden;
          display: flex;
          align-items: center;
          justify-content: center;
          padding: 50px 20px;
          /* box-sizing: border-box; */
      }

      #index-about .page-title{ padding-top: 0; }

      #index-about .background {
          position: relative;
          width: 100%;
          max-width: 1200px;
          display: flex;
          /* align-items: center; */
          justify-content: space-between;
      }


      /* 右側文字區塊（垂直排列） */
      #index-about .declare {
          flex: 2;
          /* display: flex; */
          /* flex-direction: column; */
          /* align-items: center; */
          /* writing-mode: tb; */
          max-width: 850px;
          font-size: 16px;
          color: #906929;
          letter-spacing: 1px;
          line-height: 28px;
          padding: 100px 0px 30px 10vw;
      }

      #index-about .declare p {
          margin: 0px 30px 10px 30px;
          line-height: clamp(28px, 6vw, 35px);
          font-size: clamp(14px, 4vw, 24px);
          /* writing-mode: vertical-rl; */
          text-orientation: mixed;
      }

      #index-about .declare p.title{
    font-size: clamp(16px, 5vw, 36px);
    margin: 0px 30px 30px 30px;
}

      /* RWD 響應式設計：小螢幕時改為上下排列 */
      @media (max-width: 768px) {
          #index-about .background {
              /* flex-direction: column; */
              /* align-items: center; */
          }
		  
		  #index-about .background{display:block;}
          #index-about .page-title {
              writing-mode: initial;
              text-orientation: initial;
              /* text-align: center; */
              margin-bottom: 20px;
              padding: 0 0 20px 0;
          }

          #index-about .declare {
              align-items: flex-start;
              writing-mode:rl;
              padding: 0;
          }
		  #index-about .declare p.title{
    margin: 0 0px 30px 0px;
}
          #index-about .declare p {
              writing-mode: horizontal-tb;
              text-orientation: initial;
              text-align: left;
              margin: 0 0 0 0;
              line-height: 1.5;
          }
      }

/*特色*/
#index-feature{ width:100%; overflow:hidden; padding-bottom:40px ; }
#index-feature img{ max-width: 100%; }
#index-feature .slogan1 {
  color: #92692b;
  text-align: center;
  margin: 60px 0 20px 0;
  font-size: clamp(16px, 5vw, 26px);
  text-transform: uppercase;
  letter-spacing: 5px;
}
#index-feature .slogan2 {
  color: #92692b;
  text-align: center;
  margin: 0px 0 40px 0;
  font-size: clamp(16px, 5vw, 24px);
  text-transform: uppercase;
  letter-spacing: 2px;
}
#index-feature .items {
  float: left;
  width: 31%;
  margin: 50px 1%;
  text-align: center;
}
#index-feature .items img {
  display: block;
}
#index-feature .contents {
  font-size: clamp(16px, 5vw, 30px);
  letter-spacing: 5px;
  color: #745421;
}
#index-feature .contents span {
  display: block;
  font-size: 14px;
  letter-spacing: 2px;
  padding: 10px 0 50px 0;
}
#index-feature .items .title {
  display: inline-block;
  margin: 30px 0 5px 0;
  font-size: 20px;
  color: #745421;
  letter-spacing: 3px;
  text-align: center;
  padding: 12px 18px;
}

@media screen and (max-width: 768px) {
  #index-feature .items {
    width: 46%;
    margin: 20px 2%;
  }
}

@media screen and (max-width: 480px) {
  #index-feature .items {
    width: 94%;
    margin: 20px 3%;
  }
}


/*商品介紹*/
#index-pdt{background: url(../../images/product-bg.png) top right no-repeat;padding: 0 0 100px 0;}
#index-pdt .wrap{max-width: 1400px;margin: 0 auto;}

#index-pdt .flex-container {
  max-width: 1265px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap; /* 支援 RWD，自動換行 */
  justify-content: space-between; /* 兩欄之間的間距 */
  gap: 5vw; /* 欄位間距 */
  padding: 0 30px;
}

#index-pdt .flex-container .left{
  /* flex: 1; */
  box-sizing: border-box;
  display: flex;
  align-items:center;
  /* justify-content: center; */
}
#index-pdt .flex-container .right {
  position: relative;
  flex: 1;
  box-sizing: border-box;
  display: flex;
  align-items:center;
  /* justify-content: center; */
  color: #906928;
  font-size: 24px;
  line-height: 30px;
  margin: 60px 0 30px 0;
}

#index-pdt .flex-container .right img{position:absolute;right: 40px;top: -5px;}

@media screen and (max-width: 1000px) {
  #index-pdt .flex-container .right img{ display: none;}
}

@media (max-width: 768px) {
  #index-pdt .page-title{ padding: 0 0 0 0;}
  #index-pdt .flex-container .left,
  #index-pdt .flex-container .right {
    font-size: 20px;
    flex: 1 1 100%; /* 小螢幕時每欄占 100% */
    margin-top: 0;
  }
}

/*owl*/
#index-pdt .owl-left{cursor:hand;cursor:pointer;display:flex;align-items:center;justify-content: center;width: 5%;float:left;}
#index-pdt .owl-center{width: 90%;float:left;padding: 0 1vw;}
#index-pdt .owl-right{cursor:hand;cursor:pointer;display:flex;align-items:center;justify-content: center;width: 5%;text-align: right;float:left;}
#index-pdt .contain{ text-align:center; font-size:22px; }
#index-pdt .contain a{display: inline-block;padding: 8px 20px 8px 20px;min-width: 215px;font-size: 20px;letter-spacing: 1px;color: #faf5ed;background: #906928;text-decoration:none;margin-top: -50%;}
#index-pdt .contain a:hover{ text-decoration:none; }
#index-pdt .contain a span{display: block;font-size: 16px;padding: 5px;color: #c4b196;}
#index-pdt .item{margin: 0 auto;padding: 10px 0vw;width: 95%;height: 350px;overflow:hidden;display:flex;align-items:center;justify-content: center;/* border-right: 1px solid #ebebeb; *//* border-left: 1px solid #ebebeb; *//*background:#ffffff;*/}
#index-pdt .item img{width: 100%;/* height: 90%; */cursor:pointer;}


#index-product{ width:100%; overflow:hidden; }
#index-product .slogan1 {
  color: #92692b;
  text-align: center;
  margin: 60px 0 20px 0;
  font-size: clamp(16px, 5vw, 40px);
  text-transform: uppercase;
  letter-spacing: 5px;
}
#index-product .slogan2 {
  color: #92692b;
  text-align: center;
  margin: 0px 0 40px 0;
  font-size: clamp(16px, 5vw, 30px);
  text-transform: uppercase;
  letter-spacing: 2px;
}
#index-product .items{float:left;width: 31%;margin: 50px 1%;text-align: center;}
#index-product .items img{ display:block; }
#index-product .contents{font-size: clamp(16px, 5vw, 30px);letter-spacing:5px;color: #745421;}
#index-product .contents span{ display:block; font-size:14px; letter-spacing:2px; padding:10px 0 50px 0; }
#index-product .items .title{display: inline-block;margin: 30px 0 5px 0;/* background: #4C3434; */font-size: 20px;color: #745421;letter-spacing:3px;text-align:center;padding: 12px 18px;}

/*服務評價*/
#index-evaluate{position:relative;width:100%;transition: all 0.5s ease;/* background: url(../../images/evaluate-bg.jpg) top center no-repeat fixed; */background-size:cover;background: #d65339;}
#index-evaluate .page-title{
    color: #f4e8d1;
}
#index-evaluate .page-title span{
    color: #f4e8d1;
}
#index-evaluate .mask{ position:absolute; bottom:0; left:0; }
#index-evaluate .wrap{width:100%;max-width:1200px;overflow:hidden;/*min-height:900px;*/margin:0 auto;padding: 0px 20px 100px 20px;box-sizing:border-box;}
#index-evaluate .wrap .items{width:100%;overflow:hidden;background:#ffffff;box-shadow: 1px 0px 1px #ebebeb;display: flex;}
#index-evaluate .wrap .items > .left{position: relative;float:left;width: 35%;background:url(../../images/evaluate-bird.jpg) no-repeat;background-position: center 70%;color: #B8ABA3;font-size:15px;min-height: 600px;padding: 20px 25px;box-sizing:border-box;flex: 1;}
#index-evaluate .wrap .items > .left .slogan{position:absolute;bottom: 0px;left: 0;width: 100%;padding: 0 20px;box-sizing: border-box;}
#index-evaluate .wrap .items > .left img{ padding-bottom:30px; }
#index-evaluate .wrap .items > .left p{line-height: 20px;letter-spacing:3px;font-weight:bold;}
#index-evaluate .wrap .items > .right{float:left;width: 63%;background:#816161;padding:20px 50px;box-sizing:border-box;}
#index-evaluate .wrap .items > .right .td-left{ width:100px; border-bottom:1px solid #f5f5f5; text-align:center; }
#index-evaluate .wrap .items > .right .td-right{ border-bottom:1px solid #f5f5f5; }
#index-evaluate .wrap .items > .right .td-right a{ color:#6ca6cb; text-decoration:none; }
#index-evaluate .wrap .items > .right .td-right div{ line-height:20px; font-weight:bold; letter-spacing:1px; }
#index-evaluate .wrap .items > .right .td-right .name{ font-size:14px; color:#375396; }
#index-evaluate .wrap .items > .right .td-right .content{ font-size:13px; color:#2a2a2c; }
#index-evaluate .wrap .items > .right .td-right .date{ color:#808487; }
#index-evaluate .css_td{ color: #ffffff; }

/*聯絡我們 - 移至服務評價區 220815 yinchen*/
#index-evaluate .container2{  }
#index-evaluate .container2 .wrap2{padding:0px 0 0 0;/* background:#ffffff; */}
#index-evaluate .goolgemap{ border:0; box-shadow:2px 2px 8px rgba(15%,15%,40%,0.1); }
#index-evaluate .td-left{width:50%;padding: 30px 20px;box-sizing:border-box;}
#index-evaluate .td-right{ width:50%; padding:30px 30px; box-sizing:border-box; vertical-align:bottom; }
#index-evaluate .td-right .solgan{padding:50px 0;font-size: 24px;color: #f7cb09;font-weight: bold;letter-spacing:5px;}
#index-evaluate .td-right #css_table{width:auto !important;}
#index-evaluate .td-right #css_table .css_td{display:table-cell;padding: 10px 3px;box-sizing:border-box;line-height:20px;}
#index-evaluate .contact-service{ width:100%; overflow:hidden; text-align:center; padding:30px 0; border-bottom:1px solid #b7b7b7; }
#index-evaluate .contact-service span{ display:inline-block; margin:20px 3%; line-height:30px; letter-spacing:3px; font-weight:bold; font-size:14px; cursor:hand; cursor:pointer; }

@media screen and (max-width:900px) {
	#index-evaluate .td-right{ vertical-align:top; }
	#index-evaluate .td-right .solgan{ padding:0 0 20px 0; }
	#index-evaluate #css_table .css_tr{display:inherit;width: 100%;}
	#index-evaluate #css_table .css_td{display:inherit;}
	#index-evaluate .td-left{ width:100%; }
	#index-evaluate .td-right{ width:100%; }

}
@media screen and (max-width:480px) {
	#index-evaluate #css_table .css_td{padding: 10px 0px;}		
}


/*聯絡我們*/
#index-contact .container2{  }
#index-contact .container2 .wrap2{ padding:0px 0 0 0; background:#ffffff; }
#index-contact .goolgemap{ border:0; box-shadow:2px 2px 8px rgba(15%,15%,40%,0.1); }
#index-contact .td-left{ width:50%; padding:30px 30px; box-sizing:border-box;}
#index-contact .td-right{ width:50%; padding:30px 30px; box-sizing:border-box; vertical-align:bottom; }
#index-contact .td-right .solgan{padding:50px 0;font-size:18px;color: #906928;font-weight: bold;letter-spacing:5px;}
#index-contact .td-right #css_table{ width:auto !important}
#index-contact .td-right #css_table .css_td{ display:table-cell; padding:15px 3px; box-sizing:border-box; line-height:20px; }
#index-contact .contact-service{ width:100%; overflow:hidden; text-align:center; padding:30px 0; border-bottom:1px solid #b7b7b7; }
#index-contact .contact-service span{ display:inline-block; margin:20px 3%; line-height:30px; letter-spacing:3px; font-weight:bold; font-size:14px; cursor:hand; cursor:pointer; }


/*聯絡我們表單*/
.contact_form{width:100%;max-width: 1200px;margin:10px auto;overflow:hidden;padding:0 20px;box-sizing:border-box;}
.contact_form .form_left{ float:left; width:50%; box-sizing:border-box; }
.contact_form .form_right{ float:right; width:50%; padding-left:20px; box-sizing:border-box; }
.contact_form input[type='text']{width:100%;border:0;padding:10px 8px 10px 100px;box-sizing:border-box;letter-spacing:1px;border: 1px solid #906928;color: #4C3434;font-size: 14px;margin:8px 0;outline:0;}
.contact_form select{width:100%;border:0;padding:10px 8px 10px 8px;box-sizing:border-box;letter-spacing:1px;border:1px solid #906928;color:#333333;font-size: 14px;margin:8px 0;outline:0;}
.contact_form textarea{ width:100%; border:0; height:200px; padding:40px 8px 10px 15px; box-sizing:border-box; letter-spacing:1px; border:1px solid #906928; color:#333333; font-size:16px; margin:8px 0; outline:0; }
.contact_form input[type='text']:hover ,.contact_form textarea:hover { border:1px solid #906928; transition: all 0.3s ease; }

.contact_form .frame{ position:relative; }
.contact_form .frame:hover span{ font-weight:bold; color:#984634; }
.contact_form .frame span{position:absolute;top: 20px;left: 10px;font-size: 14px;letter-spacing: 1px;color: #906928;}
.contact_form .frame .image{ display:inline-block; cursor:pointer; position:absolute;top: 17px;right: 15px; color:#817272; font-size:14px; text-decoration:none; letter-spacing:2px; }



@media screen and (max-width:1600px) {
	#index-about > .background{background-position: 100% 50%;}
}
@media screen and (max-width:1300px) {
	#index-about .declare{right:5%; left:inherit;}
}
@media screen and (max-width: 600px) {
	#index-about .declare{ right:0; left:0; margin-left:auto; margin-right:auto; }
}
@media screen and (max-width:900px) {
	#index-product .contents img{ display:none; }	
	#index-evaluate .wrap .items > .left{ width:40%;}	
	#index-evaluate .wrap .items > .right{ width:60%; padding:20px 20px; }
	#index-contact .td-right{ vertical-align:top; }
	#index-contact .td-right .solgan{ padding:0 0 20px 0; }
	#index-contact #css_table .css_tr{display:inherit;width: 100%;}
	#index-contact #css_table .css_td{display:inherit;}
	#index-contact .td-left{ width:100%; }
	#index-contact .td-right{ width:100%; }

}
@media screen and (max-width:800px) {
	#index-news .items{ width: 46%;margin: 20px 2%; }
	#index-product .items{ width: 46%;margin: 20px 2%; }
	#index-evaluate .wrap .items{ display:inherit; }		
	#index-evaluate .wrap .items > .left{position: relative;float:none;width: 100%;text-align: center;padding: 20px 15px;}	
	#index-evaluate .wrap .items > .right{width: 100%;}		
	.contact_form .verify{ width:100% !important; }
	
}
@media screen and (max-width:480px) {
	#index-news .items{ width: 94%;margin: 20px 3%; }	
	#index-product .items{ width: 94%;margin: 20px 3%; }
	#index-about .declare{padding: 0px 0px;}	
	#index-about .declare .about-pager{justify-content:center;}
	.contact_form .form_left{ float:none; width:100%; padding-right:0; }
	.contact_form .form_right{ float:none; width:100%; padding-left:0; }
	#index-contact #css_table .css_td{ padding:10px 25px; }		
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> 最新消息 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


  /* inner-news 限定樣式，避免與其他區塊衝突 */
  #inner-news .news-list {
    display: flex;
    flex-wrap: wrap;
    /* align-items: center; */
    padding: 25px 25px 25px 25px;
    margin: 0 0 40px 0;
    background: #ffffff;
    box-shadow: 1px 1px 8px #ecdcbc;
}

/* 左側圖片 */
#inner-news .news-list .news-image {
    flex: 1;
    min-width: 300px;
}

#inner-news .news-list .news-image img {
    width: 100%;
    height: auto;
    display: block;
    /* border-radius: 8px; */
}

/* 右側內容區 */
#inner-news .news-list .news-content {
    flex: 1.8;
    padding: 0px 20px 0 40px;
    min-width: 300px;
}

#inner-news .news-list .news-date {
    background: #d65339;
    color: white;
    padding: 8px 15px;
    /* border-radius: 5px; */
    font-size: 15px;
    letter-spacing: 1px;
    display: inline-block;
}

#inner-news .news-list .news-title {
    font-size: 22px;
    /* font-weight: bold; */
    color: #906928;
    border-bottom: 1px solid #906928;
    padding: 0 0 20px 0;
    margin: 40px 0 20px 0;
}

#inner-news .news-list .news-title a{
  font-size: 22px;
  color: #906928;
  text-decoration: none;
}

#inner-news .news-list .news-text {
    font-size: 16px;
    line-height: 30px;
    color: #424242;
    margin-bottom: 50px;
}

/* RWD：小螢幕時調整排版 */
@media (max-width: 768px) {
    #inner-news .news-list {
        display: block;
        /* flex-direction: column; */
        /* text-align: center; */
    }
    #inner-news .news-list .news-content {
      padding: 0px 0;
  }    
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> 友好廠商 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#company{ width:100%; display:flex; flex-wrap:wrap; margin:40px 0; }
#company .items{width: 29%;display: flex;justify-content: center;margin: 30px 2%;/* cursor:pointer; *//* border: 1px solid #cccccc; *//* border-top: 10px solid #4f5e42; */}

#company .items:hover{ /*box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25); transition: all 0.5s ease;*/ }
#company .items > div{text-align: left;margin: 0px auto 0 auto;width: 100%;}
#company .items .img{/* max-width: 240px; *//* height:160px; */margin: 15px auto;display: flex;align-items:center;justify-content: center;}
#company .items img{display:block;/* padding-bottom:20px; */margin: 0 auto; /*width:100%;*/ }
#company .items .title{text-align:left;color: #000000;padding: 15px 15px 15px 15px;font-size: 16px;letter-spacing: 3px;font-family: 'Noto Sans TC', sans-serif;font-weight: bold;/* background: #d7d2c5; */}
#company .items .content{
    padding: 5px 15px 5px 15px;
    font-size: 14px;
    line-height: 23px;
    letter-spacing: 0px;
    min-height: 125px;
}
#company .items .community{
    padding: 5px 15px 10px 15px;
    letter-spacing: 1px;
    color: #a8a7a7;
}
#company .items a{
    font-size: 15px;
    color: #894246;
    font-weight: bold;
    text-decoration: none;
    margin: 0 0px 0 0px;
}
#company .items a:hover{ text-decoration:underline; }
#company .items .info{
    display: flex;
    padding: 5px 15px 5px 15px;
    font-size: 13px;
    letter-spacing: 1px;
}
#company .items .info .left{
    margin-top: 5px;
}
#company .items .info .left i{
    color: #b0868a;
    padding: 0 10px 0 0;
}
#company .items .info .right{
    line-height: 20px;
}

@media screen and (max-width : 1024px) {
	#company .items img{ width:90%; max-width:100%; }
}
@media screen and (max-width : 768px) {
	#company .items{width: 46%;}
}
@media screen and (max-width : 480px) {
	#company .items{ width:100%; }  
	#company .items .content{ min-height:inherit; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> 常見Q&A <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#news-list{ padding-top:0; }
.news-items{width:100%;overflow:hidden;margin: 0 0 15px 0;}
.news-items:not(:first-child){/* border-top: 1px dotted #adadad; */}
.news-items .news-title{display:flex;padding: 10px 10px;margin: 0 0 0 0;font-size: 16px;border-bottom: 1px solid #906928;cursor:pointer;}
.news-items .news-title.change{ border-bottom:0 !important; }
.news-items .news-title:hover{ background:#f4f4f4; }
.news-items .news-title .left{/*flex:1;*/color: #737373;font-size: 14px;}
.news-items .news-title .left span{color: #C9B27E;font-size:30px;font-weight:bold;/* padding-left:15px; */}
.news-items .news-title .right{position:relative;flex:4;color: #906928;padding: 0 80px 0 0px;font-size: 16px;line-height: 22px;display: flex;align-items:center;/* font-weight: bold; */}
.news-items .news-title .right span{position:absolute;top: 3px;width: 15px;height: 15px;font-size: 20px;right: 0px;color: #906928;padding: 0 1px 3px 3px;/* border: 1px solid #6b6b6b; */display: flex;align-items: center;justify-content: center;}
.news-items .news-title .right span:after{ content:"+"; }
.news-items .news-title .right span.change:after{ content:"-"; }

.news-items .news-title a{ color:#343434; text-decoration:none; }
.news-items .news-content{/* background:#f3f3f3; */font-size:15px;padding: 10px 0px;line-height:23px;/* border: 1px solid #b8afa7; */border-top: 0;}
.news-items .news-content .youtube{ width:100%; max-width:600px; overflow:hidden; margin:0 auto; }

@media screen and (max-width : 480px) {
	.news-items .news-title{/* display:block; */}
	.news-items .news-title .right{padding: 0px 80px 0px 20px;}	
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 品牌故事 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.story-area{text-align:center; display:inline-block; font-size:14px; font-weight:bold; line-height:50px; }
.sotry-width-fix{ padding-right:20% !important; }

@media screen and (max-width:1000px) {
	.sotry-width-fix{ padding-right:0% !important; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 最新消息 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#news-detail .share{ width:100%; text-align:right; padding:0 10px 15px 10px; box-sizing:border-box; }
#news-detail .date{display: inline-block;font-size:16px;color: #ffffff;padding: 5px 10px;background: #d65339;margin:10px 0;letter-spacing: 1px;text-align:center;float: right;}
#news-detail .title{ font-size:24px; color:#000000; margin:30px 0 50px 0; letter-spacing:2px; text-align:center; }


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 商品列表 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


/*最新消息*/
#product-list{ width:100%; overflow:hidden; }
#product-list .items{display: inline-block;vertical-align: top;width: 22%;margin:1%;box-sizing:border-box;text-align:center;/* background:#ffffff; */}
#product-list .items > .title{display:block;color: #906a29;font-size: 20px;letter-spacing: 1px;line-height: 22px;padding:20px 0;text-decoration:none;}
#product-list .contents{ display:block;font-size: 16px;letter-spacing: 3px;margin:40px 0; }
#product-list .contents2{position:absolute;top:0;right:0;padding: 7px 20px;font-size: 15px;color:#ffffff;background:#000;}
.product-detail-title{color: #906928;font-size:18px;border-bottom: 1px solid #906928;margin:30px 0;padding: 0 10px 10px 10px;}

/*客製化商品編輯器自訂*/
/*
.intro-area .caption span:before{content:url(../../images/line.jpg);position:absolute;top: -30%;left: 3vw;}
*/

/*其它商品推薦*/
.owl-carousel .item{text-align:center;}
.owl-carousel .item img{}
.owl-carousel .item .types{
    color: #323433;
    font-weight: bold;
    font-size: 20px;
    margin: 5px 0 0 0;
    line-height: 25px;
}
.owl-carousel .item .title{
    color: #8b8c87;
    font-size: 16px;
    text-decoration:underline;
    margin: 5px 0 15px 0;
    line-height: 22px;
}
.owl-carousel .item .price{
    color: #323433;
    font-weight: bold;
    font-size: 20px;
}
.owl-carousel .item .price span{font-size: 15px; padding-right:5px; }

/*owl*/
.owl-left{position:relative;cursor:hand;cursor:pointer;margin-top: 0%;display:flex;align-items:center;justify-content: center;width: 7%;float:left;}
.owl-center{width: 90%;float:left;}
.owl-right{position:relative;cursor:hand;cursor:pointer;margin-top: 0%;display:flex;align-items:center;justify-content: center;width: 5%;text-align: right;float:left;}

#owl-photography .item{margin: 0 5px;padding: 0px 0;/*height:140px;*//*overflow:hidden;*//* display:flex; *//* align-items:center; *//* justify-content: center; */width:98%;/* background:#ffffff; */border: 1px solid #d2bb8b;}
#owl-photography .item img{width:100%;/*margin:5px; box-shadow:2px 2px 8px rgba(15%,15%,40%,0.1);*/margin: 0 0px;display: block;}


@media screen and (max-width:1400px) {
	/*客製化商品編輯器自訂*/
	.product-content2 .lefter{flex:100% !important;}
	.product-content2 .righter{display:block !important;}
	.product-content3{ display:block !important; }
}
@media screen and (max-width:1000px) {
	.intro-area .caption span:before{ content:""; }
}
@media screen and (max-width:800px) {
	#product-list .items{width: 46%;margin: 20px 1.5%;}	
}
@media screen and (max-width:480px) {
	#product-list .items{ width: 94%;margin: 20px 3%; }	
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 商品詳細內頁 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#wrapper.product_detail_bg { 
  background-color: #f4e8d1; 
  background-image: url('../../images/inner-bg.png'); 
  background-position: top center; 
  background-repeat: no-repeat; 
  background-size: 100% auto;
}
#product_detail{width:100%;overflow:hidden;margin: 0px;padding: 25px 0 25px 0;background: #ffffff;display: flex;/* align-items:center; */box-shadow: 1px 1px 6px #cccccc;/* justify-content: center; */}
#product_detail .left{float:left;width:50%;text-align: center;color:#e1e1e1;letter-spacing:2px;}
#product-detail .left .editor{ padding-bottom:10px !important; }

/*owl*/
#product-detail .owl-left{cursor:hand;cursor:pointer;display:flex;align-items:center;justify-content: center;width: 10%;float:left;}
#product-detail .owl-center{width: 80.5%;float:left;}
#product-detail .owl-right{cursor:hand;cursor:pointer;display:flex;align-items:center;justify-content: center;width: 10%;text-align: right;float:left;}

#product_detail .right{float:left;width:50%;box-sizing:border-box;letter-spacing: 2px;padding: 30px 80px;}
#product_detail .right > .title{font-size: 30px;color: #906928;font-family: "Noto Serif HK", serif;font-optical-sizing: auto;font-weight: bold;font-style: normal;}
#product_detail .right .number{color: #906928;font-size: 18px;line-height: 32px;padding: 30px 0 30px 0;}
#product_detail .right .number span{ margin-left:5px; }
#product_detail .right .spec{color: #906928;font-size: 18px;line-height: 32px;padding: 30px 0 30px 0;}
#product_detail .right .spec span{
    display: inline-block;
    text-align: center;
    border: 1px solid #906928;
    padding: 0px 15px;
    min-width: 100px;
    cursor: pointer;
}
#product_detail .right .spec span:hover, #product_detail .right .spec span.active { 
  border: 1px solid #ed931f; 
  color: #ed931f; 
}
#product_detail .right .price{color: #906928;font-size:14px;padding: 30px 0 30px 0;}
#product_detail .right .price span{font-size: 36px;color: #906928;padding-right:10px;font-family: "Noto Serif HK", serif;font-optical-sizing: auto;font-weight: bold;font-style: normal;}
#product_detail .right #css_table .css_td{letter-spacing:1px;line-height: 26px;padding: 0 0 15px 0;}
#product_detail .right #css_table .title{ width:90px; vertical-align:top; }
#product_detail .right #css_table .title span{ display:inline-block; width:75px; border-right:1px solid #906928; text-align:justify; }

#product_detail .massOrder{display:inline-block;color: #ffffff!important;font-size:15px !important;width: 145px;padding: 5px 0px 5px 0;margin: 5px 0;line-height: 30px;text-decoration:none;letter-spacing:2px;border-radius: 30px;border: 1px solid #ed931f;background: #ed931f;cursor:hand;cursor:pointer;}
#product_detail .massOrder img{ vertical-align:-20%;}
#product_detail .massOrder:hover{
 background: #dd8514;
 color:#ffffff !important;
 border: 1px solid #dd8514;
 -webkit-transition: all .4s ease;
 -moz-transition: all .4s ease;
 -o-transition: all .4s ease;
 transition: all .4s ease;
 -ms-transition: all .4s ease;
 }
 #product_detail .massOrder:hover img{ filter: brightness(0) invert(1); }
 #product_detail .massOrder.on{ background:#dd8514; color:#ffffff !important; border: 1px solid #dd8514; }

@media screen and (max-width:1400px) {
	#product_detail .right{padding: 40px 20px 0 20px;}
}
@media screen and (max-width:1000px) {
	#product_detail{ display:inherit; }
	#product_detail .left{width: 70%;float:none;margin: 30px auto;}
	#product_detail .right{width: 70%;float:none;margin: 0 auto;}
}
@media screen and (max-width:650px) {
	#product_detail .left{width: 90%;}
	#product_detail .right{width: 90%; padding:40px 0px 0 0px; }
}

/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> 商品自由配 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.product_freedom{ padding:20px; box-sizing:border-box; line-height:25px; font-size:20px; color:#be9191; letter-spacing:1px; }
#freedom_title{ width:100%; padding:15px 20px; margin:20px 0; box-sizing:border-box; background:#faf6f5; }
#freedom_title span{ color:#974e4e; font-size:30px; }

#freedom_title #css_table .css_td{ color:#000000; font-size:18px; letter-spacing:2px;}
#freedom_title #css_table .css_td:not(:first-child){ text-align:right;}

.pFree-order{width:100%;overflow:hidden;padding:15px 10px;font-size:15px;letter-spacing:1px;box-sizing:border-box;background:#faf6f5;display: flex;align-items: center;justify-content: center;/}
#product_freedom .checkbox{zoom:150%; vertical-align:middle;}
#product_freedom .price{color: #754b4c;font-weight:bold;font-size:20px;}

@media screen and (max-width:650px) {
	#freedom_title #css_table .css_td{ display:block; }	
	#freedom_title #css_table .css_td:not(:first-child){text-align:left;padding: 20px 0px;}
	#freedom_title span{ font-size:20px; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 購物車 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#mySidenav .cart-container{padding: 0;box-sizing:border-box;}
#mySidenav .cart-container .caption-title{width: 90%;font-size: 16px;color: #906928;padding: 8px 0px 15px 0px;margin: 0 auto;letter-spacing:1px;line-height:20px;border-bottom: 1px solid #d2bb8b;}
#mySidenav .cart-container .caption-title-en{width:100%;font-size:14px;color: #8b8c87;padding: 8px 0 20px 20px;letter-spacing:1px;border-bottom: 1px solid #906928;}
#mySidenav .cart-container .title{width:100%;font-size: 16px;color: #906928;padding: 0px 0 8px 20px;letter-spacing:1px;line-height:20px;/* border-bottom: 1px solid #906928; */}
#mySidenav .cart-container .title_spec{width:100%;font-size: 15px;font-weight: bold;color: #906928;padding: 0px 0 40px 20px;letter-spacing:1px;line-height:20px;/* border-bottom: 1px solid #906928; */}

#mySidenav .cart-container .left{float:left;width: 35%;}
#mySidenav .cart-container .left .product-img{width: 97%;overflow:hidden;border:1px solid #cccccc;box-shadow: 1px 1px 5px #cccccc;margin-right: 3%;}
#mySidenav .cart-container .left .product-img img{ display:block; }
#mySidenav .cart-container .right{float:left;width: 65%;padding:0 8px;box-sizing:border-box;}
#mySidenav .cart-container .right i{color: #a68753;font-size: 18px;}

#mySidenav .cart-container .right .btn-cart{width:100%;overflow:hidden;max-width:135px;padding: 5px 0;margin:25px 0 20px 0}
#mySidenav .cart-container .right .btn-cart span{border: 1px solid #906928;background: #906928;color: #ffffff;font-weight:bold;padding: 4px 10px;cursor:hand;cursor:pointer;}
#mySidenav .cart-container .right .btn-cart .jq_increase{padding: 4px 8px;}
#mySidenav .cart-container .right .btn-cart span:hover{ background:#906928; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }
#mySidenav .cart-container .right input{border: 1px solid #dbdbdb;outline:0;width: 60px;height: 25px;text-align:center;font-size: 16px;color: #000000;background: #ffffff;-webkit-border-radius: 0px;-moz-border-radius: 0px;border-radius: 0px;}
#mySidenav .cart-container .right .subtotal {color: #906928;font-size:16px;letter-spacing:1px;}

#my-cart{width:100%;overflow:auto;padding-left: 10px;padding-right: 15px;box-sizing: border-box;}
.cart-item{width:100%;overflow:hidden;padding: 30px 0 30px 0;border-bottom: 1px solid #d2bb8b;}
.cart-btn{position:absoulte;bottom:0;right:0;background: #d25236;color: #ffffff;letter-spacing: 5px;font-size: 16px;width:100%;padding: 26px 0;text-align:center;cursor:hsnd;cursor:pointer;}
.cart-btn:hover{background: #b23c22;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
transition: all .4s ease;
-ms-transition: all .4s ease
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 會員修改資料 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.member-title{ color:#974e4e; font-size:24px; letter-spacing:3px; padding:30px 0; }

#member-info{width:100%;max-width:900px;padding: 30px 0 15px 0;margin: 0 auto;box-sizing:border-box;overflow:hidden;font-size: 16px;color: #906928;}
#member-info #css_table .css_td:first-child{ width:130px; }
#member-info #css_table .css_td{ vertical-align:top; padding:10px 0; }
#member-info #css_table .css_td p{ font-size:14px; color:#a85841; line-height:22px; }

#member-edit{max-width:900px;margin: 0 auto;}
#member-edit .frame{ position:relative; }
#member-edit .frame:hover span{ font-weight:bold; color:#bc8e8e; }
#member-edit .frame > span{position:absolute;top: 20px;left: 15px;font-size: 14px;letter-spacing: 3px;}
#member-edit .frame input[type='text'],#member-edit .frame input[type='password']{width:100%;border:0;padding:10px 8px 10px 100px;box-sizing:border-box;letter-spacing:1px;border: 1px solid #906928;color:#333333;font-size:16px;margin:8px 0;outline:0;}
#member-edit .frame input[type='text']:hover,#member-edit .frame input[type='password']:hover { border:1px solid #d25236; transition: all 0.3s ease; }
#member-edit .frame input[type='file']{width:100%;border:0;background:#ffffff;padding:10px 8px 10px 100px;box-sizing:border-box;letter-spacing:1px;border: 1px solid #906928;color:#333333;font-size:12px;margin:8px 0;outline:0;font-family:"微軟正黑體";}
#member-edit .frame input[type='file']:hover { border:1px solid #bc8e8e; transition: all 0.3s ease; }
#member-edit .frame .text{width:100%;border:0;padding: 18px 8px 15px 100px;box-sizing:border-box;letter-spacing:1px;/* border:1px solid #dbdbdb; */color: #906928;font-size:16px;margin: 8px 0;outline:0;word-break: break-all;}
#member-edit .frame .content{width:100%;border:0;padding:5px 8px 5px 0px;box-sizing:border-box;letter-spacing:1px;/* border:1px solid #dbdbdb; */color: #906928;font-size:16px;margin: 8px 0;outline:0;word-break: break-all;}
#member-edit .frame select{width: 95%;/* max-width:170px; */box-sizing: border-box;border: 1px solid #906928;color:#333333;font-size:14px;padding:10px 8px 10px 8px;outline:0;margin-right:5px;/* margin-bottom:10px; */}
#member-edit .frame .tips{color: #906928;font-size:12px;text-align:right;}

#member-edit > #css_table .css_td{padding: 0 0% 0 0;box-sizing:border-box;width: 100%;vertical-align: top;display: block;}
#member-edit > #css_table .three_col{width: 33.333% !important;}
#member-edit > #css_table .three_col input[type="text"]{ margin:0; padding-left:8px; }

#member-edit .total{ padding:20px 0; color:#121212; font-size:14px; letter-spacing:1px; text-align:right; }
#member-edit .total span{color: #906928;margin-right:15px;}

@media screen and (max-width:768px) {
	#member-info{ width:100%; }
	#member-edit > #css_table .css_td{ display:block; }
	#member-edit > #css_table .css_td{ width:100%; }
}
@media screen and (max-width:768px) {
	#member-info #css_table #css_table .css_td{ display:block; }
	#member-edit > #css_table .three_col{ width:100% !important; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 會員訂單 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.p-img-frame{display:inline-block;width:105px;/* border:1px solid #CCCCCC; *//* box-shadow: 1px 1px 5px #CCCCCC; */vertical-align:middle;margin:0 5px 0 0;}
.p-img-frame img{ width:100%; display:block; }
.calculate-item1{width:100%;/* background:#f6f0ee; */line-height:20px;padding: 10px 0px;margin: 0 0 0px 0;text-align:right;box-sizing:border-box;color: #906928;font-size: 16px;letter-spacing:2px;}
.calculate-item1.line{ border-bottom:1px solid #906928; }
.calculate-item1 #css_table .css_td{ line-height:25px; }
.calculate-item1 #css_table .css_td label{ padding:0 0 0 10px; }
.calculate-item1 #css_table .css_td .span{display:inline-block;padding:5px 15px;color:#ffffff;background: #4c3434;letter-spacing:1px;}
.calculate-item1 #css_table .td1{width:100px;}
.calculate-item1 #css_table .td2{width:300px; vertical-align:top; }
.calculate-item1 #css_table .td3{width: 270px;vertical-align:top;}
.calculate-item1 #css_table .td4{ text-align:right; }
.calculate-item1 #css_table u{ color: #CC0000; text-decoration:none;}
.calculate-item1 #css_table .frame{display:inline-block;background: #906928;color:#ffffff;padding: 0px 10px;font-size:12px;min-width: 55px;text-align: center;margin: 0 0 3px 0;}

.calculate-item1 > span{display:inline-block;width:120px;line-height: 25px;text-align:right;}
.calculate-item2{width:100%;/* background: #ada59f; */padding: 20px 0px;margin:0 0 5px 0;color: #906928;/* font-weight:bold; */text-align:right;box-sizing:border-box;font-size: 16px;letter-spacing:2px;}
.calculate-item2 span{display:inline-block;width:120px;text-align:right;color: #906928;font-weight:bold;}
.calculate-item2 i{ font-style:normal; }

@media screen and (max-width:1000px) {
	.calculate-item1 #css_table .css_td{ display:block; }
}
@media screen and (max-width:768px) {
	.calculate-item1 > span{ display:block; width:inherit; }
	.calculate-item1 #css_table .td1,
	.calculate-item1 #css_table .td2,
	.calculate-item1 #css_table .td3{ width:inherit; }
}




/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 會員購物車 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


.cart-table td i{color: #906928;font-size: 18px;}
.cart-table td h{display: inline-block;background: #B38C90;color: #ffffff;font-size: 12px;padding: 3px 5px;margin: 3px 0 3px 0;}
.cart-table #css_table{ width:inherit; }
.cart-table #css_table .css_td span{display:block;color:#974e4e;font-size:14px;line-height:23px;margin: 0px 0;}

.cart-buy-table{}
.cart-buy-table .require{ color:#c41919; padding:0 5px; }
.cart-buy-table #css_table{ width:100%; max-width:800px; }
.cart-buy-table #css_table .td1{ width:100px; }
.cart-buy-table #css_table .td2{ max-width:470px; }
.cart-buy-table input[type='text'], .cart-buy-table select{ width:100%; font-size:15px; background:#ffffff; border:1px solid #d7d7d7; padding:5px 10px; box-sizing:border-box; outline:0; }
.cart-buy-table textarea{ font-size:15px; width:100%; height:100px; background:#ffffff; border:1px solid #d7d7d7; padding:5px 10px; box-sizing:border-box; outline:0; }
.cart-buy-table input[type='text']:focus,.cart-buy-table select:focus, .cart-buy-table textarea:focus{ border:1px solid #c28a7e;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
transition: all .4s ease;
-ms-transition: all .4s ease
}

.cart-buy-table .sameOrder{width:100%;overflow:hidden;padding: 10px 18px;margin: 2px 0 15px 0;background: #f4e8d1;box-sizing:border-box;border-radius: 30px;}
.cart-buy-table i{font-size:20px;color: #906928;cursor:hand;cursor:pointer;padding:0 5px;}

#div_couponCodeCheck{color: #D12828;line-height: 30px;}
#div_couponCodeCheck span{border: 1px solid;padding: 3px 10px;margin: 0 10px 0 0;border-radius: 15px;background: #D12828;color: #ffffff;}
#div_couponCodeCheck span i{ padding:0 5px 0 0; }
#div_couponCodeCheck a{ color:#E40808; text-decoration:none;}
#div_couponCodeCheck a:hover{ text-decoration:underline;}
#div_couponCodeCheck span.success{color: #ffffff;background: #007bff;}
#div_couponCodeCheck span.error{color:#ffffff;}


@media screen and (max-width:768px) {
	.cart-buy-table #css_table .css_td{ display:block; }
	.cart-buy-table #css_table .css_td #css_table .css_td{padding: 5px 0;}
	.cart-buy-table #css_table .td1{ font-weight:bold; color:#974e4e; }

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


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 會員購買成功 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/*上方流程圖*/
.checkout-flow{position:relative;padding: 50px 0 0px 0;text-align:center;}
.checkout-flow .word{ position:relative; width:100%; height:100px; overflow:hidden; max-width:870px; margin:0 auto; }
.checkout-flow .word div{color: #906928;font-size:16px;letter-spacing:1px;padding:20px 0;}
.checkout-flow .word div span{/* background: #dc4427; */color: #dc4427;font-size: 18px;}
.checkout-flow .flow1{ position:absolute; left:0;  }
.checkout-flow .flow2{ position:absolute; left:0; right:0; margin-left:auto; margin-right:auto; }
.checkout-flow .flow3{ position:absolute; right:0; }
.checkout-flow .bg1{ width:100%; max-width:784px; margin:0 auto; background:url(../../images/cart-step1.png) no-repeat; height:57px; }
.checkout-flow .bg2{ width:100%; max-width:784px; margin:0 auto; background:url(../../images/cart-step2.png) no-repeat; height:57px; }
.checkout-flow .bg3{ width:100%; max-width:784px; margin:0 auto; background:url(../../images/cart-step3.png) no-repeat; height:57px; }
.checkout-title{color: #906928;border-bottom: 1px solid #d2bb8b;text-align: center;padding: 0 0 24px 0px;box-sizing: border-box;font-size:24px;}
.checkout-tips{color: #d55336;font-size: 15px;font-weight: bold;margin: 20px 0;text-align: center;}

/*購買成功*/
.success-table .css_td{ width:50%; }
.success-table .left{text-align:center;color: #906928;font-size:18px;text-align:center;letter-spacing:2px;}
.success-table .left span{ display:block; padding:20px 0; }
.success-table .left img{ margin-bottom:50px; }

.success-table .right{ vertical-align:top; }
.success-table .right div{ padding-left:10px !important; padding-right:10px !important; box-sizing:border-box; }
.success-table .right .title{
    color: #906928;
    font-size: 22px;
    padding: 20px 0;
    letter-spacing: 2px;
}
.success-table .right .title i{
    padding-right: 10px;
    font-size: 40px;
    vertical-align: middle;
}

.success-table .right .info{
    padding: 30px 0 40px 0;
    line-height: 30px;
    font-size: 16px;
    font-weight: bold;
}

.success-table .right .content{
    line-height: 30px;
}


@media screen and (max-width:1000px) {
	.checkout-flow{ padding:50px 0 20px 0; }
	.checkout-flow .none{ display:none; }
	.checkout-flow .show{ left:0; right:0; margin-left:auto; margin-right:auto; }	
	.checkout-flow .posi1{  max-width:56px; background-position:left; }
	.checkout-flow .posi2{  max-width:56px; background-position:50.5%; }	
	.checkout-flow .posi3{  max-width:56px; background-position:right; }
}
@media screen and (max-width:768px) {
	.success-table .css_td{ display:inherit; }
	.success-table .right div{ text-align:center; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 選單 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#ajax-sidenav div{position:relative;width: 100%;border-bottom: 1px solid #ebebeb;color:#181818;padding: 13px 20px;line-height:20px;box-sizing:border-box;cursor: pointer;cursor: hand;font-size: 14px;letter-spacing: 3px;}
#ajax-sidenav div:hover{ color:#736357;}
#ajax-sidenav div span{position:absolute;right:0;top: 0;display:block;padding: 15px 20px;border-left: 1px solid #ebebeb;/* border-right: 1px solid #ebebeb; */}

.submenu-nav { width: 100%; overflow:hidden; display:none; background-color: #FFFFFF; }
.submenu-nav div{padding: 13px 20px !important;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Swiper Slider <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


.swiper-container {
	/*margin-top:140px;*/
	width: 100%;
	height: 800px;
	margin-left: auto;
	margin-right: auto;
}
.swiper-slide {
	text-align: center;
	font-size: 18px;

	background: #fff;
	background-size:cover;
	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;

	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;

}
.swiper-mask{ position:absolute; left:0; bottom:-2px; z-index:2; }

@media screen and (max-width:1000px) {
	.swiper-container { margin-top:100px;  }	
}
@media screen and (max-width:600px) {
	.swiper-container {height:800px;}	
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 表格 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/*列表頁*/
.zebra td, 
.zebra th {
  padding: 20px;
  font-size: 14px;

  color: #121212;
  text-align: center;
  letter-spacing: 1px;
  /*border-bottom: 1px solid #f2f2f2;*/
}
.zebra a{ color:#a85841; text-decoration:none; }
.zebra a:hover{ text-decoration:underline; }
/*使用:nth-child(even)给表格的奇数行添加背景和阴影效果*/
.zebra .alternate,

.zebra tr:nth-child(odd) {
  background: #f5f5f5;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
}
.zebra tr:last-child td{border-bottom: 1px solid #906928;}
.zebra th {
  text-align: center;
  font-size: 14px;
  /* text-shadow: 0 1px 0 rgba(255,255,255,.5); */
  /*border-bottom: 1px solid #ccc;*/
  font-weight:normal;
  color: #906928;
  background:#f6f0ee;
  }
/*使用 :first-child设置表格表头第一个单元格左上角为圆角*/
.zebra th:first-child {
  border-radius: 6px 0 0 0;

}
/*使用 :last-child设置表格表头最后一个单元格右上角为圆角*/
.zebra th:last-child {
  border-radius: 0 6px 0 0;

}

/*詳細內頁*/
.zebra2 td, 
.zebra2 th {
  padding: 10px 10px;
  box-sizing:border-box;
  font-size: 16px;
  color: #906928;
  line-height: 20px;
  text-align: left;
  letter-spacing: 1px;
  /*border-bottom: 1px solid #f2f2f2;*/
}
.zebra2 a{color:#a85841;text-decoration:none;padding: 0px 0 10px 0;display: inline-block;}
.zebra2 a:hover{ text-decoration:underline; }
.zebra2 p{ font-weight:bold; color:#945b5b; }
/*使用:nth-child(even)给表格的奇数行添加背景和阴影效果*/
.zebra2 .alternate,
.zebra2 tr:not(:last-child) td{border-bottom: 1px solid #906928;}
.zebra2 tr:last-child td{border-bottom: 1px solid #906928;}
.zebra2 th {
  text-align: center;
  font-size: 14px;
  /* text-shadow: 0 1px 0 rgba(255,255,255,.5); */
  /*border-bottom: 1px solid #ccc;*/
  font-weight:normal;
  color: #ffffff;
  background: #906928;
  }
/*使用 :first-child设置表格表头第一个单元格左上角为圆角*/
.zebra2 th:first-child {
  border-radius: 0px 0 0 0;
}
/*使用 :last-child设置表格表头最后一个单元格右上角为圆角*/
.zebra2 th:last-child {
  /* border-radius: 0 6px 0 0; */
  font-weight: bold;
  letter-spacing: 3px;
  font-size: 16px;
}

/*收件資訊*/
.zebra3 td, 
.zebra3 th {
  padding: 20px;
  box-sizing:border-box;
  font-size: 14px;
  color: #121212;
  text-align: left;
  letter-spacing: 1px;
  /*border-bottom: 1px solid #f2f2f2;*/
}
.zebra3 td{ background:#f6f0ee; }
.zebra3 td:first-child{width:200px;border-right: 1px solid #bdbdbd;}
.zebra3 a{ color:#a85841; text-decoration:none; }
.zebra3 a:hover{ text-decoration:underline; }
.zebra3 p{font-weight:bold;color: #906928;line-height:28px;letter-spacing:1px;}
/*使用:nth-child(even)给表格的奇数行添加背景和阴影效果*/
.zebra3 .alternate,
.zebra3 tr:not(:last-child) td{ border-bottom:1px solid #bdbdbd; }
.zebra3 tr:last-child td{ /*border-bottom:1px solid #c69f9f;*/ }
.zebra3 th {
  text-align: left;
  font-size: 14px;
  /* text-shadow: 0 1px 0 rgba(255,255,255,.5); */
  /*border-bottom: 1px solid #ccc;*/
  font-weight:normal;
  color: #ffffff;

  background: #ada59f;
  }
/*使用 :first-child设置表格表头第一个单元格左上角为圆角*/
.zebra3 th:first-child {
  /*border-radius: 6px 0 0 0;*/
}
/*使用 :last-child设置表格表头最后一个单元格右上角为圆角*/
.zebra3 th:last-child {
  /* border-radius: 0 6px 0 0; */
  font-weight: bold;
  letter-spacing: 3px;
  font-size: 16px;
}

.rowBG tr:nth-child(odd) {
  background: #f5f5f5;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
}


@media screen and (max-width : 1024px) {
	.visible-no-b{ display:none; }	
}
@media screen and (max-width : 768px) {
	.visible-no-m{ display:none; }
	.zebra2 td:first-child{ width:100px }
	.zebra3 td{ padding:10px; }
	.zebra3 td:first-child{ width:130px; padding:10px; }
}
@media screen and (max-width : 480px) {
	.zebra2 td, .zebra2 th{ padding:20px 5px;}
	.visible-no-s{ display:none; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 動畫效果 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/*------Zoom--------*/

.scaleZoom {
	-webkit-animation: scaleZoom 2s ease both;
	animation: scaleZoom 2s ease both;
}
@-webkit-keyframes scaleZoom {
	from { opacity: 0; -webkit-transform: scale(1.2); }
}
@keyframes scaleZoom {
	from { opacity: 0; -webkit-transform: scale(1.2); transform: scale(1.2); }
}

/*------區塊跳動效果--------*/
.swiper-scroll{ z-index:999999; }
.swiper-scroll a.scrollDown{
	display:block;
	color:#000;
	text-align:center;
	position:absolute;
	left: 0; 
	right: 0; 

	margin-left: auto; 
	margin-right: auto; 
	margin-bottom:  3%;
	z-index:999;
	}

.swiper-scroll a.scrollDown i{
	display:inline-block;
	text-align:center;
	font-size:25px;
	color:#FFF;
	text-align:center;}

/*------css3動畫--------*/
@-webkit-keyframes upDown {
  0%     {bottom:20px; opacity:1;}
  50%   {bottom:28px; opacity:0.5;}
  100% {bottom:20px; opacity:1;}

}
@-moz-keyframes upDown {
  0%     {bottom:20px; opacity:1;}

  50%   {bottom:28px; opacity:0.5;}
  100% {bottom:20px; opacity:1;}
}
@keyframes upDown {
  from     {bottom:20px; opacity:1;}

  50%   {bottom:28px; opacity:0.5;}
  to {bottom:20px; opacity:1;}
}
.upDown{
	-webkit-animation: upDown ease-out 1s infinite;
	-moz-animation: upDown ease-out 1s infinite;


	-o-animation: upDown ease-out 1s infinite;
	animation: upDown ease-out 1s infinite;
}

/*------背景圖Zoom In--------*/
@keyframes animateBg{
    from { background-size: 130%; }
    to { background-size: 100%; }
}

/*------上至下效果--------*/
@keyframes dropHeader {
  from {

    transform: translateY(0%);
  }
  to {
    transform: translateY(-10%);
  }
}


/*------image zoom--------*/
.photo-zoom {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.photo-zoom img {
  max-width: 100%;
  -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  
}
.photo-zoom:hover img {

  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);

  transform: scale(1.1);
  
}

/*------image mask--------*/
.photo-mask{opacity:0;position:absolute;left:0;bottom:0;color:#ffffff;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.7);letter-spacing:3px;text-align:center;padding:15px; box-sizing:border-box; line-height:22px;-webkit-transition:.2s;-ms-transition:.2s;-moz-transition:.2s;}
.photo-mask-content{ width:100%; height:100%; display:flex; align-items:center; justify-content: center; }
.photo-mask .line{border:1px solid #FFFFFF;}
.gallery:hover .photo-mask{ opacity:1; }


/*------image mask2--------*/
.photo-mask2{opacity:1;position:absolute;left:0;bottom:0;color:#000000;width:100%;height:100%;background-color:rgba(255, 255, 255, 0.6);letter-spacing:3px;text-align:center; box-sizing:border-box; line-height:22px;-webkit-transition:.2s;-ms-transition:.2s;-moz-transition:.2s;}
.photo-mask-content2{ position:relative; width:100%; height:100%; }
.gallery:hover .photo-mask2{ opacity:1; }

/*------image mask3--------*/
.photo-mask3{opacity:0;position:absolute;left:0;bottom:0;color:#000000;width:100%;height:100%;letter-spacing:3px;text-align:center; box-sizing:border-box; line-height:22px;-webkit-transition:.2s;-ms-transition:.2s;-moz-transition:.2s;}
.photo-mask-content3{position:relative;width:100%;height:100%;display: flex;align-items:center;justify-content: center;}
.gallery:hover .photo-mask3{ opacity:1; }

/*------圖片filter--------*/
.img-gray { 
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    
    filter: grayscale(100%);
	
    filter: gray;
}

/*------Circle Rotate--------*/
.circle {
  display:block;
  width: 100px;
  height: 100px;
  margin-left: 13px;
  position: relative;
  text-align: center;
  margin: 0 auto;
}
.circle .border {
  /* content: ''; */
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: transparent;
  border-radius: 50%;
  border: 2px dashed #ffffff;
  -webkit-animation-name: Rotate;
  -webkit-animation-duration: 6s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: Rotate;
  -moz-animation-duration: 6s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: Rotate;
  -ms-animation-duration: 6s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
}
.play {
  display:flex;
  align-items:center;
  justify-content: center;
  /*padding: 25px 30px;*/
  padding-top: 30%;
  font-size: 17px;
  letter-spacing: 1px;
  line-height: 20px;
  /* font-weight: bold; */
  text-align:center;
  color: #906928;
}
.play i{ font-size:16px; color:#6a6a6a; }
.stop {
  font-size: 12px;
  padding: 30px;
  text-align: center;
}

.circle2 {
  width: 100px;
  height: 100px;
  margin: 30px auto;
  position: relative;
  cursor:hand;
  cursor:pointer;
}
.circle2 .border {
  /* content: ''; */
  position: absolute;
  top: 0px;
  bottom: 0;
  left: 0px;
  right: 0;
  background: transparent;
  border-radius: 50%;
  border: 2px dotted #A0A19A;
}

.circle2 .border:hover{
  -webkit-animation-name: Rotate;
  -webkit-animation-duration: 10s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: Rotate;
  -moz-animation-duration: 10s;
  -moz-animation-iteration-count: infinite;

  -moz-animation-timing-function: linear;
  -ms-animation-name: Rotate;
  -ms-animation-duration: 10s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;	
}


@-webkit-keyframes Rotate {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}
@-moz-keyframes Rotate {
  from {
    -moz-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
  }
}
@-ms-keyframes Rotate {
  from {
    -ms-transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
  }
}


@media screen and (max-width:1400px) {
	.circle{ display:none; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Radio/Checkbox <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/* Customize the label (the container) */
.container-form {
  display: inline-block;
  /* vertical-align: -28%; */
  position: relative;
  padding-left: 30px;
  margin-left: 10px;
  margin-bottom: 0px;
  cursor: pointer;
  font-size: 16px;
  line-height: 20px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.container-form input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0px;
  left: 0;
  height: 20px;
  width: 20px;

  background-color: #f9f9f9;
  border: 1px solid #b9b7b7;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container-form:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container-form input:checked ~ .checkmark {
  background-color: #F19B20;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container-form input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
/*
.container .checkmark:after {
  top: 6px;
  left: 6px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
}
*/
/* Style the checkmark/indicator */
.container-form .checkmark:after {
  left: 6px;
  top: 2px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  transform: rotate(45deg);
}


@media screen and (max-width : 768px) {
	.container-form { font-size:13px; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Placeholder <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  font-family: /*Arial,*/ "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif;
  color: #CCCCCC;
  opacity: 0.8; /* Firefox */
}


:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #CCCCCC;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color:#CCCCCC;
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Loadaction <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.Loadaction_Box { height: 100%; width: 0%; position: fixed; overflow:auto; top: 0; left: 0; overflow:auto; background-color:rgba(0, 0, 0, 0.5); z-index:100000000 }
.Loadaction {width: 220px;height: 60px;top: 42%; position: fixed; margin-left: auto;margin-right: auto;padding-top: 10px;left: 0;right: 0;background-color:rgba(0, 0, 0, 0.5);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.Actionupload_Text {font-size:13px;color:#FFFFFF;height: 25px;}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Pager <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
.pgis_num{color: #fff;font-family:'Vollkorn',Verdana;font-size:12px;letter-spacing:1px;text-align:center;line-height: 30px;height: 30px;width: 30px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;background-color: #9B9794;}
.pg_num{color: #fff;font-family:'Vollkorn',Verdana;font-size:12px;letter-spacing:1px;cursor:pointer;text-align:center;line-height: 30px;height: 30px;width: 30px;background-color:#bbb;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.pg_num:hover{background-color:#BC8E8E;transition:1s;}


.cssa { color:#555;font-family:'Vollkorn',Verdana; letter-spacing:1px; font-size:12px; padding-right:2px; padding-left:2px }

.cssb { font-family:'Vollkorn',Verdana; letter-spacing:1px; font-size:12px; padding-right:5px; padding-left:5px }
.cssc { letter-spacing:1px; font-size:15px;height:40px }
.cssd { font-family:'Vollkorn',Verdana; font-size:12px; letter-spacing:2px; height:10px; border:1px solid #FFFFFF }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Cookie <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/



.cookie-notice {

position: fixed;

max-width: 1100px;

font-size: 14px;

margin: 0 auto;

bottom: 30px;

left: 0;

right: 0;

background-color: #d65339;

color: #fff;

line-height: 22px;

padding: 15px 20px;

text-align: left;

display: none; /* 預設隱藏 */

border-radius: 10px;

z-index: 99;
}



div#cookieNotice {}



div#cookieNotice {}



.cookie-notice button {

  background-color: #fff;

  color: #333;

  border: none;

  padding: 5px 20px;

  margin-top: 10px;

  cursor: pointer;

  display: block;

}



