@charset "utf-8";
@import url("reset.css");
@import url("loading.css");
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> Main <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

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-x:hidden; }
body, td, th { font-size:12px; font:14px/18px 'Rosarivo', '微軟正黑體', sans-serif; }
.iframe_ch { display:none }
.middle{ vertical-align:middle; }
.hideme{ /*opacity:0;*/ }
.width100{ width:100%; }
.img_block{ display:block; }
.button1{ color:#fff; background:#4ba72b; font-size:14px; padding:7px 25px; letter-spacing:1px; cursor:hand; cursor:pointer; }
.button1:hover{ background:#41753e; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }
.button2{ color:#fff; background:#7f7f7c; font-size:14px; padding:7px 25px; letter-spacing:1px; cursor:hand; cursor:pointer; }
.button2:hover{ background:#999; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }
.margin_top{ padding-top:180px !important; }
.pager{ width:100%; margin:50px auto; text-align:center; }
.radius{-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}

/*提示文字內容*/
#tip_box { position: fixed; line-height:22px; background-image:url(../../images/action_bg.png); color: #FFF; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:5px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin-left:10px; }
/*提示圖片處理*/
.tip { cursor:pointer; cursor:hand }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Common <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.common_title{ font-size:24px; text-align:center; color:#282828; letter-spacing:1px; margin:50px 0; }
.common_title .btitle{border-bottom:1px solid #7D7C77;}
.common_title .stitle{ display:inline-block; margin:20px 0; font-size:14px; color:#BABABA; }

.editor{ min-height:300px; line-height:25px; letter-spacing:1px; font-size:15px; }
.editor_title{ width:100%; overflow:hidden; padding:15px 0; margin:0 0 30px 0; line-height:25px; font-size:20px; color:#5e8f01; font-weight:bold; }
.editor_date{ padding:10px; background:#edece1; font-size:15px; }

/*PageLoad*/
#wrapper { position:relative; opacity:0; overflow:hidden; background:url(../../images/bg.jpg) repeat; -webkit-transition: opacity 0.5s ease-in; -moz-transition: opacity 0.5s ease-in; -o-transition: opacity 0.5s ease-in; -ms-transition: opacity 0.5s ease-in; transition: opacity 0.5s ease-in; }
#wrapper.load { opacity:1; }

.overlay { position:absolute; display:none; width:100%; height:100%; z-index:99; top:0; left:0; background-color: rgba(0, 0, 0, 0.5); transition: 0.5s; }

.sitemap{ margin:10px; color:#a39467; font-size:15px; letter-spacing:1px; }

#menu { position:fixed; width:100%; background:url(../../images/bg.jpg) repeat; z-index:9; border-bottom:1px solid #dcdcdc; }
#menu .menu_wrapper { position:relative; max-width:1200px; height:150px; margin:0 auto 10px auto; border-left:1px solid #dcdcdc; animation: 1s ease-out 0s 1 dropHeader; }
#menu .menu_wrapper .logo { position:absolute; top:20px; left:20px; }
#menu .menu_wrapper ul { position:absolute; top:20px; left:25%; list-style:none; margin:0; padding:0; writing-mode: tb-rl; }

#menu .menu_wrapper ul .line{ border-right:1px solid #dcdcdc; width:1px; animation: 1s ease-out 0s 1 transiTop100;}

#menu .menu_wrapper ul li { width:85px; font-size:16px; font-weight:bold; letter-spacing:5px; color:#5f5f5d; padding:0 10px 0 0; cursor:pointer; cursor:hand; }
#menu .menu_wrapper ul li span { font-size:12px; color:#BCAF8C; }
#menu .menu_wrapper ul li:hover{ color:#000; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s;}

#hideMenu{ position:absolute; top:0; right:0; width:250px; overflow:hidden; display:none; z-index:99; overflow-y:auto;}
#hideMenu .bTitle{width:100%; padding:20px 0; height:125px; text-align:center; font-size:30px; background:url(../../images/bg.jpg) repeat; color:#FFF; letter-spacing:5px; cursor:pointer; border-bottom:1px solid #EBEBEB; }
#hideMenu ul{ list-style:none; margin:0; padding:0; }
#hideMenu ul li{ display:inline-block; width:100%; background:#fff; border-bottom:1px solid #EBEBEB; color:#000; font-weight:bold; padding:15px 0 15px 10px; font-size:16px; letter-spacing:1px; border-bottom:2px solid #FFF; cursor:hand; cursor:pointer; }
#hideMenu ul li:hover{ background:#F5F5F3; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }
#hideMenu ul li span{  font-size:12px; color:#BCAF8C; }

#hideMenu ul div a::before { content: "» ";}
#hideMenu ul div{ font-size:16px; padding-left:20px; font-weight:normal; letter-spacing:1px; margin:20px 0;}
#hideMenu ul div a{ text-decoration:none; color:#000;}
#hideMenu ul div a:hover{ color:#255e01;}

.cart_icon{ position:absolute;right: 90px;top: 50px; }
.logout_icon{ position:absolute;right: 90px;top: 110px; color:#333; }

#index_about , #index_knows ,#contact_info {  animation: 1s ease-out 0s 1 transiLeft100; }
#index_product , #index_kitchen , #knows_area .knows_area_left {  animation: 1s ease-out 0s 1 transiRight100; }
#index_contact .square { animation: 1s ease-out 0s 1 transiTop10; }

.slogan_text{     writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl;
    letter-spacing:2px; font:12px/18px 'Rosarivo', '標楷體', sans-serif;  font-size:36px; line-height:40px; color:#494949; }
.slogan_text span{font-size:12px;background:#edece1;padding: 10px 5px;font-weight: bolder;}
.slogan_text2{     writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl;
     letter-spacing:2px; font:12px/18px 'Rosarivo', '標楷體', sans-serif;  font-size:23px; line-height:30px; height:105px; color:#494949; letter-spacing:3px; }
.slogan_text2 span{font-size:12px;background:#edece1;padding: 10px 5px;font-weight: bolder;}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Index <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#index_news{ max-width:1150px; margin:10px 0; overflow:hidden; border-bottom:1px solid #dcdcdc; }
#index_news .index_news_left{ float:left; width:20%; }
#index_news .index_news_right{ float:left; width:80%; }
#index_news .news_cleft{ float:left; width:10%; }
#index_news .news_cright{ float:left; width:90%; max-width:830px; color:#4f4f4f; letter-spacing:1px; }
#index_news .news_cright span{ font-size:18px; padding-right:5%; }
#index_news .news_cright div{ width:100%; border-top:1px solid #dcdcdc; font-size:15px; padding:8px 0; }
#index_news .news_cright div a{ color:#4f4f4f; text-decoration:none; }
#index_news .news_cright div a:hover{ color:#4ba72b; }
.news_more{ max-width:1150px; width:100%; margin:30px 0; text-align:right; }

#index_about{ position:relative; max-width:1200px; overflow:hidden; }
#index_about .index_about_left{ float:left; width:52%; height:500px; margin:100px 0 0 0; background:url(../../images/about_bg.png) no-repeat center; }
#index_about .index_about_right{ float:left; max-width:350px; width:48%; font-size:15px; margin:100px 0 0 0; letter-spacing:1px; color:#4f4f4f; line-height:30px; }
#index_about .index_about_right img{ margin:0 5px 30px 5px; }
#index_about .slogan{ background:url(../../images/about_line.png) top center no-repeat; padding:90px 0 0 0; position:absolute; top:0; right:0; }
.about_more{ margin:50px 0 0 0; }

#index_product{ position:relative; max-width:1200px; overflow:hidden; }
#index_product .index_product_left{ float:right; max-width:350px; width:48%; font-size:15px; margin:100px 0 0 0; letter-spacing:1px; color:#4f4f4f; line-height:30px; }
#index_product .index_product_left img{ margin:0 5px 30px 5px; }
#index_product .index_product_right{ float:right; min-width:600px; width:52%; height:500px; margin:100px 0 0 0; background:url(../../images/product_bg.png) no-repeat right; }
#index_product .slogan{ background:url(../../images/about_line.png) top center no-repeat; padding:90px 0 0 0; position:absolute; top:0; left:0;  }
.product_more{ margin:50px 0 0 0; }

#index_kitchen{ max-width:1200px; width:100%; overflow:hidden; }
#index_kitchen .index_kitchen_left{ float:left; max-width:615px; width:51%; }
#index_kitchen .index_kitchen_right{ float:left; max-width:585px; width:49%; }
#index_kitchen .index_kitchen_right .kitchen_img{ position:relative; }
.kitchen_mask{ opacity: 0; position:absolute; width:100%; height:100%; top:0; left:0; background-color: rgba(0,0,0, 0.7); color:#FFF;  display:flex; align-items:center; }
.kitchen_img:hover .kitchen_mask{ opacity: 1; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; cursor:pointer; cursor:hand; }
.kitchen_mask_border{border:1px solid #FFF; width:96%; height:92%; margin:0 auto; display:flex; align-items:center; justify-content: center; font-size:25px; letter-spacing:5px;}

#index_knows{ position:relative; max-width:1200px; overflow:hidden; }
#index_knows .index_knows_left{ float:left; width:52%; height:500px; margin:100px 0 0 0; background:url(../../images/knows_bg.png) no-repeat left; }
#index_knows .index_knows_right{ float:left; max-width:350px; width:48%; font-size:15px; margin:100px 0 0 0; letter-spacing:1px; color:#4f4f4f; line-height:30px; }
#index_knows .index_knows_right img{ margin:0 5px 30px 5px; }
#index_knows .slogan{ background:url(../../images/about_line.png) top center no-repeat; padding:90px 0 0 0; position:absolute; top:0; right:0;  }
.knows_more{ margin:50px 0 0 0; }

#index_contact{ width:100%; height:790px; display:flex; align-items:center; background:url(../../images/contact_bg.jpg) no-repeat; background-position:center; }
#index_contact .square{background-color: rgba(0,0,0, 0.3);  margin:0 auto; max-width:500px; width:95%; overflow:hidden; color:#fff; text-align:center; }
#index_contact .bTtitle{ font-size:30px; line-height:50px; letter-spacing:5px; margin:20px 60px 10px 60px; text-align:center; }
#index_contact .bTtitle span{ color:#cfcfcf; letter-spacing:3px; font-size:13px;}
#index_contact p{ line-height:30px; letter-spacing:3px; /*text-shadow:1px 2px #333;*/ font-size:15px; margin:20px 60px 10px 60px; }
.contact_more{ margin:30px 0; }

#footer{ width:100%; padding:30px 0 30px 10px; overflow:hidden; background:#FEED80;}
#footer .footer_wrapper{ position:relative; max-width:1200px; overflow:hidden; margin:0 auto; }
#footer .foot_left{ float:left; padding:0 50px 0 0; }
#footer .foot_center{ overflow:hidden; float:left; }
#footer .foot_title{color:#224013;font-size:24px;letter-spacing:1px;margin: 10px 0 10px 0;}
#footer .foot_contact{ width:100%; overflow:hidden; font-size:13px; letter-spacing:1px; color:#224013; line-height:25px; }
#footer .foot_contact_left{ float:left; margin:0 20px 0 0; }
#footer .foot_contact_right{ float:left; }
#footer .fb_icon{ width:30px;border-right:1px solid #224013; padding:0 10px 0 0; }
#footer .copyright{ padding:0 0 0 10px; letter-spacing:1px;color:#224013; }
#footer .copyright a{ color:#224013; text-decoration:underline; }
#footer .foot_right{ float:left; }
#footer ul { width:100%; list-style:none;margin:0;padding:0;margin-left: 120px;}
#footer ul li{float:left; width:40px; height:140px;background:#5B981F;color:#FFF;letter-spacing:3px;font-size:15px;border:1px solid #338308;margin: 0 5px;writing-mode: tb-rl;box-sizing:border-box;padding:5px 3px 0 0;cursor:hand;cursor:pointer;}
#footer ul li span{ font-size:12px; color:#57CC1B; }
#footer ul li:hover{ background:#4BA72B; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }

#footer .gotop{ position:fixed; bottom:15%; right:5%; z-index:1; }


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> About <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#about_surround{ width:100%; overflow:hidden; margin:30px 0 0 0; background:url(../../images/about_bg.jpg) no-repeat; background-position:center; }
#about_surround .surround_wrap{ position:relative; max-width:1200px; min-height:600px; overflow:hidden; width:100%; margin:0 auto; }
#about_surround .slogan{background:url(../../images/about_line2.png) top center no-repeat; padding:90px 0 0 0; position:absolute; top:0; left:0; }
#about_surround .surround_area{ width:100%; overflow:hidden; padding:100px 0 0 170px; box-sizing:border-box; }
#about_surround .surround_square{ float:left; max-width:270px; width:100%; overflow:hidden; color:#FFF; font-size:15px; letter-spacing:1px; line-height:30px; margin:0 20px; } 
#about_surround .surround_square img{ display:block; margin:0 auto 10px auto; }

#about_certifi{ position:relative; max-width:1200px; overflow:hidden; }
#about_certifi .certifi_left{ float:left; width:50%; margin:100px 0 0 10px; }
#about_certifi .certifi_right{ float:left; max-width:350px; width:48%; font-size:15px; margin:100px 0 0 50px; letter-spacing:1px; color:#4f4f4f; line-height:30px; }
#about_certifi .slogan{ background:url(../../images/about_line.png) top center no-repeat; padding:90px 0 0 0; position:absolute; top:0; right:0; }

.slick-pre{position:absolute;top: 38%;left: 10px;display:block;z-index:9999;}
.slick-next{position:absolute;top: 38%;right: 10px;display:block;z-index:9999;}

#about_media{ width:100%; overflow:hidden; margin:30px 0 0 0; padding:30px 0; background:url(../../images/media_bg.png) no-repeat bottom; /*background-size:auto 100%;*/ }
#about_media .media_wrap{ position:relative; max-width:1200px; width:100%; overflow:hidden; margin:0 auto; }
#about_media .about_media_left{ float:right; max-width:400px; width:48%; box-sizing:border-box; padding:0 20px; font-size:15px; margin:100px 0 0 0; letter-spacing:1px; color:#4f4f4f; line-height:30px; }
#about_media .about_media_left img{ margin:0 5px 30px 5px; }
#about_media .about_media_right{ float:right; width:52%; margin:100px 0 0 0; }
#about_media .slogan{ background:url(../../images/about_line.png) top center no-repeat; padding:90px 0 0 0; position:absolute; top:0; left:0;  }


@media screen and (max-width : 1200px) {
	#about_surround .surround_area{ width:85%; padding:5% 0 0 100px; }
	#about_surround .surround_square{ max-width:none;  display:flex; align-items:center; }
	#about_surround .surround_square img{ float:left; padding-right:20px; }
}

@media screen and (max-width : 1024px) {
	#about_surround{ background-size:auto 100%; }
	#about_surround .slogan ,#about_certifi .slogan , #about_media .slogan { position:inherit; float:left;}
	#about_surround .surround_area{ padding:5% 0 0 30px; }	
	
	#about_certifi .certifi_left{ width:45%; }
	#about_certifi .certifi_right{ width:30%; }
	
	#about_media .about_media_left{ float:right; width:40%; }
	#about_media .about_media_right{ width:45%; }	
	
}

@media screen and (max-width : 720px) {
	#about_surround .surround_square{ display:inherit;}
	#about_surround .surround_square img{ float:none; }
	
	#about_certifi .certifi_left{ width:75%; }
	#about_certifi .certifi_right{ width:95%; max-width:none; margin:20px 0 0 10px; }	
	
	#about_media .about_media_left{ width:95%; max-width:none; margin:20px 0 0 10px; }	
	#about_media .about_media_right{ width:75%; float:left; padding-left:10px; }	

}

@media screen and (max-width : 480px) {
	#about_surround .slogan , #about_certifi .slogan , #about_media .slogan{ width:100%; background:none; padding:0; }
	#about_certifi .certifi_left , #about_media .about_media_right{ width:100%;  margin:5px 0 0 0; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Contact <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#contact_info{ position:relative; max-width:1200px; overflow:hidden; }
#contact_info .contact_info_left{ float:left; width:52%; height:500px; margin:100px 0 0 0; background:url(../../images/contact_bg.png) no-repeat top center; }
#contact_info .contact_info_right{ float:left; max-width:400px; width:48%; font-size:15px; margin:100px 0 0 15px; letter-spacing:1px; color:#4f4f4f; line-height:30px; }
#contact_info .slogan{ background:url(../../images/about_line.png) top center no-repeat; padding:90px 0 0 0; position:absolute; top:0; right:0; }
.contact_info_btitle{ width:100%; border-bottom:1px solid #6d6b64; }
.contact_info_area{ width:100%; overflow:hidden; line-height:25px; padding:5px 0; border-bottom:1px dashed #a7a7a4; }
.contact_info_title{ float:left; width:30%; }
.contact_info_content{ float:left; width:70%; }

.contact{width:90%; overflow:hidden; margin:20px auto; line-height:40px; color:#2D2D2D; font-size:15px; letter-spacing:1px;}
.contact .item{color:#333; font-size:18px;  font-weight:bold; border-bottom:1px solid #DEDEDE;}
.contact .title{display:inline-block; padding:20px 0; font-size:40px; font-weight:bold;}
.contact .editor{padding:20px 0; letter-spacing:1px; line-height:30px; font-size:14px;}
.contact .form{float:right; width:100%; box-sizing: border-box; padding:2%; border:1px solid #C6C6C6; background:#FFF; }
.contact .form_left{float:left; width:50%; color:#8B8B8B; letter-spacing:1px;}
.contact .form_right{float:left; width:50%; color:#8B8B8B;}
.contact .select{width:90%; height:30px; border:1px solid #D8D4D5; color:#A9AAAE; font-size:15px; letter-spacing:2px; outline:0;}
.contact .input{border:0; border-bottom:1px solid #D8D4D5; width:90%; height:40px; font-size:15px; letter-spacing:2px; outline:0;}
.contact .textarea{ width:90%; margin-top:10px; height:250px; border:0; border-top:1px solid #D8D4D5; font-size:15px; border-bottom:1px solid #D8D4D5; padding:5px; outline:0;}


@media screen and (max-width : 1024px) {
	#contact_info .slogan { position:inherit; float:left;}
	
	#contact_info .contact_info_left{ width:45%; margin:0 20px; }
	#contact_info .contact_info_right{ width:30%; margin:0 20px; }	
	
}

@media screen and (max-width: 900px) {
	.contact span{display:inline-block; width:auto;}
	.contact .notify{ float:none; width:100%; padding:20px 0; }	
	.contact .form{ width:100%; }	
}

@media screen and (max-width: 750px) {
	.contact .form_left{float:none; width:100%;}
	.contact .form_right{ width:100%;}
	
	#contact_info .contact_info_left{ width:70%; }
	#contact_info .contact_info_right{ width:90%; max-width:none; }		
}

@media screen and (max-width : 480px) {
	 #contact_info .slogan{ width:100%; background:none; padding:0; }
	 #contact_info .contact_info_left{ width:90%; }
	 #contact_info .about_media_right{ width:100%;  margin:5px 0 0 0; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Knowledge <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#knows_area{ width:100%; overflow:hidden; margin:30px auto; }
#knows_area .knows_area_left{ float:left; max-width:220px; width:20%;}
#knows_area .knows_btitle{ font-size:24px; line-height:30px; color:#4f4f4f; letter-spacing:1px; font-family:"標楷體"; }
#knows_area .knows_line{ width:100%; height:3px; border-top:1px solid #4f4f4f; border-bottom:1px solid #4f4f4f; margin:0 0 10px 0; }
#knows_area ul{ list-style:none; margin:0; padding:0; }
#knows_area ul li{ color:#4f4f4f; padding:10px 0; font-size:16px; letter-spacing:1px; cursor:hand; cursor:pointer; }
#knows_area ul .on{ color:#4f4f4f; padding:10px 0; font-size:16px; letter-spacing:1px; background:#e9e9e9; }
#knows_area ul li:hover{ background:#e9e9e9;}
#knows_area ul li:before{ content:"。"; font-size:30px; color:#837f70; font-weight:bold; vertical-align:middle;}
#knows_area .knows_area_right{ position:relative; float:left; width:80%; min-height:300px; box-sizing:border-box; padding:0 10% 0 30px;}
#knows_area .slogan{ background:url(../../images/about_line.png) top center no-repeat; padding:90px 0 0 0; position:absolute; top:0; right:0;  }

#knows_area .knows_square{ float:left; width:30%; background:#e9e9e9; margin:0 0 20px 3%;}
#knows_area .knows_square .img_div{ position:relative; width:95%; margin:5px auto; display:block; -webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px; border:1px solid #CCC; cursor:hand; cursor:pointer; }
#knows_area .knows_square .img_div img{ display:block; -webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px; }
#knows_area .knows_square .img_div:hover .knows_mask{ opacity: 1; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }
#knows_area .knows_mask{ opacity: 0; position:absolute; width:100%; height:100%; top:0; left:0; background-color: rgba(0,0,0, 0.7); color:#FFF; font-size:16px; margin:0 auto; display:flex; align-items:center; justify-content: center;  -webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px; }
#knows_area .knows_title{ padding:10px 20px;  }
#knows_area .knows_title a{ color:#4f4f4f; font-size:16px; letter-spacing:1px; line-height:25px; text-decoration:none; }
#knows_area .knows_title a:hover{ text-decoration:underline; }
#knows_area .knows_content{ color:#878686; padding:0 20px 5px 20px; font-size:14px; letter-spacing:1px; line-height:22px; border-bottom:1px solid #cecece; }
#knows_area .knows_button{ width:100%; height:60px; line-height:60px; text-align:right; overflow:hidden; margin:0 -10px; }

@media screen and (max-width : 1024px) {
	#knows_area .knows_area_left{ display:none; }
	#knows_area .knows_area_right{ width:100%; padding:0 10px; }	
	#knows_area .knows_square{ margin:0 1.5% 20px 1.5%;}
	#knows_area .slogan{ display:none; }
}

@media screen and (max-width : 720px) {	
	#knows_area .knows_square{ width:45%; margin:0 2% 20px 2%; }
}

@media screen and (max-width : 480px) {
	#knows_area .knows_square{ width:95%; margin:0 2% 20px 2%; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> News <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.member_form_bg3{ width:150px; background:#F5F4F0; font-size:16px; padding:15px 10px; color:#6B6954; border-top:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; border-right:1px solid #CCCCCC;}
.member_form_bg4{ background:#F5F4F0; font-size:16px; padding:15px 10px; color:#6B6954; border-top:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC;}
.member_form_bg5{  border-bottom:1px solid #CCCCCC; border-right:1px solid #CCCCCC; padding-top:5px; padding-bottom:5px; font-size:15px; letter-spacing:1px;}
.member_form_bg6{  border-bottom:1px solid #CCCCCC; padding:5px 10px; font-size:15px; letter-spacing:1px;}
.member_form_bg6 a{ color:#494949; text-decoration:none;}
.member_form_bg6 a:hover{ color:#A39467; }

@media screen and (max-width : 720px) {
	.member_form_bg3{ width:100px;}
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Product List <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#knows_area .product_square{ float:left; width:30%; background:#e9e9e9; margin:0 0 20px 3%;}
#knows_area .product_square .img_div{ position:relative; width:95%; margin:5px auto; display:block; -webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px; border:1px solid #CCC; }
#knows_area .product_square .img_div img{ display:block; -webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px; }
#knows_area .product_square .img_div:hover .product_mask , #knows_area .product_square .img_div:hover .product_mask_btn{ opacity: 1; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }
#knows_area .product_mask{ opacity: 0; position:absolute; width:100%; height:100%; top:0; left:0; background-color: rgba(255,255,255, 0.5); color:#FFF; font-size:16px; margin:0 auto; display:flex; align-items:center; justify-content: center; cursor:hand; cursor:pointer; -webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px; }
#knows_area .product_mask_btn{ opacity: 0; position:absolute; width:100%; height:30%; letter-spacing:1px; bottom:0; left:0; background-color: rgba(0,0,0, 0.5); color:#FFF; font-size:16px; margin:0 auto; display:flex; align-items:center; 
-webkit-border-bottom-right-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-bottomleft: 8px;
border-bottom-right-radius: 8px;
border-bottom-left-radius: 8px; }
#knows_area .product_mask_btn table td{ cursor:hand; cursor:pointer; }

#knows_area .product_title{ padding:10px 20px;  }
#knows_area .product_title a{ color:#4f4f4f; font-size:16px; letter-spacing:1px; line-height:25px; text-decoration:none; }
#knows_area .product_title a:hover{ text-decoration:underline; }
#knows_area .product_button{ color:#c91c1c; font-size:15px; width:100%; height:60px; line-height:60px; text-align:right; overflow:hidden; margin:0 -10px; }
#knows_area .product_button span{ font-size:20px; }

@media screen and (max-width : 1024px) {
	#knows_area .knows_area_left{ display:none; }
	#knows_area .knows_area_right{ width:98%; padding:0 10px; }	
	#knows_area .product_square{ margin:0 1.5% 20px 1.5%;}
	#knows_area .slogan{ display:none; }
	#knows_area .product_mask_btn{ /*opacity:1;*/ }			
}

@media screen and (max-width : 720px) {	
	#knows_area .product_square{ width:45%; margin:0 2% 20px 2%; }	
}

@media screen and (max-width : 480px) {
	#knows_area .product_square{ width:95%; margin:0 2% 20px 2%; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Product Detail <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#contact_info .product_title1{ font-size:24px; letter-spacing:1px; margin:10px 0 50px 0; }
#contact_info .product_title2{ padding:0 0 30px 0; }
#contact_info .product_price{ width:100%; overflow:hidden; text-align:right; margin:50px 0 0 0; padding:10px 0; border-bottom:1px dotted #aaaaa8;}
#contact_info .product_price span{ font-weight:bold; font-size:20px; color:#c91c1c; }
#contact_info .product_button{ width:100%; overflow:hidden; text-align:right; margin:10px 0 0 0; }
#contact_info .product_button span{ border:1px solid #a7a596; background:#6d6b64; color:#fff; padding:4px 10px; cursor:hand; cursor:pointer; }
#contact_info .product_button span:hover{ background:#999; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }
#contact_info .product_input{ border:1px solid #a7a596; width:100px; height:28px; text-align:center; font-size:18px; color:#6d6b64; }
.product_info{ width:100%; overflow:hidden; margin:50px 0; }
.product_info_left{ float:left; width:45%;}
.product_info_right{ float:left; width:45%;}
.product_content{ box-sizing:border-box; width:90%; padding:10px; }


@media screen and (max-width : 1024px) {
	#contact_info .product_title1{ margin:10px 0 20px 0; }	
	#contact_info .product_title2{ padding:0 0 10px 0; }
	#contact_info .product_price{ margin:20px 0 0 0; }	
}

@media screen and (max-width : 720px) {
	.product_info_left{ width:90%; float:left; }
	.product_info_right{ width:90%; }	
}



/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Login <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


.login_area{ width:100%; overflow:hidden; margin:0 0 30px 0; }
.login_area_left{ float:left; width:50%; }
.login_area_right{ float:left; width:50%; text-align:center; }
.login_frame{ box-sizing:border-box; border:1px solid #EAE9E4; background:#FFF; width:100%; max-width:550px; margin:0 auto; }
.login_frame_title{ width:100%; background:#41763E; color:#fff; font-size:16px; letter-spacing:1px; padding:8px 10px; box-sizing: border-box; }
.login_frame_content{ box-sizing: border-box; background:#FFF; }
.login_frame_content table td{ border-bottom:1px solid #f5f4f0; padding: 15px 0 15px 20px; font-size:14px; }
.login_frame_content table td input[type="text"]{ border:1px solid #e9e8e8; width:80%; height:25px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; padding:5px 10px; font-size:14px; font:14px/18px 'Rosarivo', '微軟正黑體', sans-serif; color:#646464; }
.login_frame_content table td input[type="password"]{ border:1px solid #e9e8e8; width:80%; height:25px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; padding:5px 10px; font-size:14px; font:14px/18px 'Rosarivo', '微軟正黑體', sans-serif; color:#646464; }
.login_frame_content table td textarea{ border:1px solid #e9e8e8; width:80%; height:125px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; padding:5px 10px; }

.login_title{ color:#333333; font-size:14px; padding-left:20px; width:70px; }
.login_title_en{ width:100px; color:#9e9e9e; font-size:14px; padding-left:20px; width:80px; }
.login_area_right img{ width:100%; max-width:364px; }


@media screen and (max-width: 1023px) {

	.login_area_left{ float:none; margin:0 auto; width:80%; }	
	.login_area_right{ margin-top:30px;  width:100%; margin:30px 0; }	
	.login_area_right img{ display:block; text-align:center; margin:0 auto; padding-bottom:20px; }

}

@media screen and (max-width: 768px) {
	
	.login_area_left{ width:95%; }	
	.login_title_en{ display:none; }
	.login_frame_content table td{ padding: 15px 0 15px 5px; }

}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Member <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.login_frame_content{ box-sizing: border-box; }

.login_frame_content table td{ border-bottom:1px solid #f5f4f0; padding: 15px 0 15px 20px; font-size:14px; }

.login_frame_content table td input[type="text"]{ border:1px solid #e9e8e8; width:80%; height:25px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; padding:5px 10px; font-size:14px; font:14px/18px 'Rosarivo', '微軟正黑體', sans-serif; color:#646464; }

.login_frame_content table td input[type="password"]{ border:1px solid #e9e8e8; width:80%; height:25px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; padding:5px 10px; font-size:14px; font:14px/18px 'Rosarivo', '微軟正黑體', sans-serif; color:#646464; }

.login_frame_content table td textarea{ border:1px solid #e9e8e8; width:80%; height:125px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; padding:5px 10px; }

.login_frame_content table td select{ border:1px solid #e9e8e8; width:25%; height:35px; color:#6b6b6b; font-size:15px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; padding:5px 10px;font-size:14px; font:14px/18px 'Rosarivo', '微軟正黑體', sans-serif; color:#646464; }


.register_title{ width:20%; max-width:250px; text-align:right; color:#333333; font-size:14px; padding-left:20px; }

.login_frame_content table td select{ border:1px solid #e9e8e8; width:25%; height:35px; color:#6b6b6b; font-size:15px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; padding:5px 10px;font-size:14px; font:14px/18px 'Rosarivo', '微軟正黑體', sans-serif; color:#646464; }

#login_frame_content_none table td{ border-bottom:0px #ffffff; padding: 0px 0 0px 0px; }


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Cart <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.cart_step_area_m{ display:none; color:#888787; font-size:16px; letter-spacing:1px; text-align:center; margin:0 0 50px 0;}
.cart_step_area{ text-align:center; margin:0 0 50px 0;}
.cart_step{ display:inline-block; width:32px; height:32px; line-height:32px; text-align:center; color:#FFF; font-size:15px; background:#4BA72B; -webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px;}

#product_table{ border-top: 3px solid #4BA72B; }

#product_table th{ border-bottom: 1px solid #4BA72B; text-align:center; text-shadow:1px 1px #EBEBEB; color:#4BA72B; font-size:16px; font-weight:bold; letter-spacing:1px; padding:10px 0; }
#product_table td{ text-align:center; padding:10px 0; color:#505050; letter-spacing:1px; font-size:15px; border-bottom:1px solid #fff; }
#product_table td img{ margin:0 10px 0 0;}
#product_table input[type=text]{ width:113px; height:30px; border:2px solid #4BA72B; text-align:center; font-size:18px; }

.product_fee_area{ width:100%; overflow:hidden; background:#E2F6DC; color:#505050; font-size:15px; letter-spacing:1px; padding:20px 30px; border:1px solid #4BA72B; box-sizing:border-box; }
.product_fee_area_left{ float:left; width:40%; text-align:left; line-height:25px; }
.product_fee_area_right{ float:left; width:60%; text-align:right; line-height:30px; }
.cart_number{ font-size:18px; color:#ff345a; font-weight:bold; }
.cart_price{  color:#FF345A; font-size:20px; font-weight:bold; }
.cart_tips{ display:inline-block; padding:3px 7px; background:#09a2e9; color:#fff; }

.cart_title{ display:inline-block; color:#09a2e9; text-shadow:1px 1px #EBEBEB; font-size:24px; letter-spacing:1px; font-weight:bold; margin:100px 0 20px 0; }
.cart_stitle{ font-size:16px; color:#585858; margin-left:40px; letter-spacing:1px; text-shadow:1px 1px #EBEBEB; }
.cart_fullby_title{ display:inline-block; color:#585858; background:#f3f3f3; padding:5px 8px; margin:0px 0 0 0; letter-spacing:1px;}
.cart_fullby_price1{ font-size:16px; color:#ff345a; letter-spacing:1px; font-family:"微軟正黑體"; height:20px; line-height:20px; }
.cart_fullby_price1:before { content:url(../../images/cart_add1.png); vertical-align:middle; padding-right:5px; }
.cart_fullby_price2{ font-size:16px; color:#ABABAB; letter-spacing:1px; font-family:"微軟正黑體"; height:20px; line-height:20px; }
.cart_fullby_price2:before { content:url(../../images/cart_add2.png); vertical-align:middle; padding-right:5px; }
.cart_fullby_title2{ color:#585858; font-size:14px; letter-spacing:1px; margin:10px 0; line-height:25px; padding-right:10px; text-align:left;}
.cart_fullby_title4{ color:#ababab; font-size:16px; letter-spacing:1px; padding-left:10px;}
.cart_select1{ box-sizing:border-box; margin:0 0 10px 0; padding:10px; }
.cart_select2{ box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); background:#FFF; border:1px solid #EBEBEB; box-sizing:border-box; padding:10px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; margin:0 0 10px 0; }
.cart_fullby_bg1{ color:#09a2e9; font-size:16px; letter-spacing:1px; padding-left:10px; }
.cart_fullby_bg2{ background:#ff345a; padding-left:10px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; color:#fff; font-size:16px; letter-spacing:1px; }
.cart_coupon{ width:100%; overflow:hidden; background:#f5fdff; border:1px solid #bbbbbb; box-sizing:border-box; }
.cart_coupon_title{ color:#585858; letter-spacing:1px; margin:10px 0; font-size:14px;}
.cart_coupon_title a{ color:#09a2e9;}
.cart_coupon_title2{ color:#585858; letter-spacing:1px; font-size:14px; padding:6px 0; line-height:22px; }
.cart_coupon_price{ color:#FF345A; font-weight:bold;}
.cart_coupon_date{ color:#989898; }
.cart_coupon input[type=text]{ border:1px solid #CCC; width:150px; height:24px; padding:0 5px;}
.cart_coupon_discount{ background:#b5eaf7; color:#585858; text-align:right; font-size:16px; letter-spacing:1px; padding:10px; }
.cart_coupon_discount span{ font-weight:bold; color:#ff345a; font-size:20px;}
.cart_coupon_btn{ padding:20px 0; text-align:right; }
#cart_receiver_table{ width:100%; font-size:13px; letter-spacing:1px; background:#CCC; }
#cart_receiver_table td{ padding:2px; line-height:23px; }
#cart_receiver_table p { margin:20px 0; line-height:25px;}
#member_info_2{ display:inline-block; overflow:hidden; background:#EBEBEB; margin:5px; padding:8px; line-height:22px; letter-spacing:1px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; }
.tips_info{ display:inline-block; overflow:hidden; background:#EBEBEB; margin:5px; padding:8px; line-height:22px; letter-spacing:1px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; }

.cart_pay_option{ /*float:left;*/ }

/*收件者資料*/
.shopping_input_checkout1 { line-height:22px; height:22px; border:1px solid #D6D3D3; width:90%; max-width:300px; padding-left:10px; padding-right:10px; letter-spacing:1px; ; color:#000000; font-size:12px; }
.shopping_input_checkout2 { line-height:22px; height:22px; border:1px solid #D6D3D3; width:90%; max-width:150px; padding-left:10px; padding-right:10px; letter-spacing:1px; ; color:#000000; font-size:12px; }
.shopping_input_checkout3 { line-height:22px; height:22px; border:1px solid #D6D3D3; width:90%; max-width:80px; padding-left:10px; padding-right:10px; letter-spacing:1px; ; color:#000000; font-size:12px; }
.shopping_input_checkout4 { line-height:22px; height:50px; border:1px solid #D6D3D3; width:90%; max-width:500px; margin-top:5px; margin-bottom:5px; padding-left:10px; padding-right:10px; letter-spacing:1px; ; color:#000000; font-size:12px; }
.member_inputbox_150 { width:150px; border:1px solid #D6D3D3; height:25px; line-height:25px; padding-left:5px; color:#666; font-size:12px; }
.shopping_txt15 { padding-left:10px; }
.shopping_txt16 { padding-left:10px; }
.shopping_txt17 { padding-left:10px; }
.member_select_type2 { border:1px solid #D6D3D3; height:27px; line-height:27px; padding:1px; margin-top:7px; font-size:12px; }
.member_inputbox { width:300px; border:1px solid #D6D3D3; height:25px; line-height:25px; padding-left:5px; color:#666; font-size:12px; }
.member_inputbox_150 { width:150px; border:1px solid #D6D3D3; height:25px; line-height:25px; padding-left:5px; color:#666; font-size:12px; }
.member_inputbox_50 { width:50px; border:0px solid #D6D3D3; height:27px; line-height:27px; padding-left:5px; color:#666; font-size:12px; background-color:transparent }
.member_inputbox_40 { width:50px; border:1px solid #D6D3D3; height:20px; text-align:center; line-height:20px; padding-left:5px; color:#666; font-size:12px; background-color:transparent }
.member_form_select { border:1px solid #D6D3D3; height:27px; line-height:27px; padding:1px; margin-top:7px; font-size:12px; }
.member_form_min { width:50px; border:0px solid #D6D3D3; height:27px; line-height:27px; padding-left:5px; color:#666; font-size:12px; background-color:transparent }
.fancybox_login_form_select { line-height:25px; height:25px; padding:3px; border:1px solid #D6D3D3; letter-spacing:1px; font-size:13px; margin-left:0px; }
.order_checkout_title{ letter-spacing:1px; font-size:13px; line-height:30px;}

.slider input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(2); /* IE */
  -moz-transform: scale(2); /* FF */
  -webkit-transform: scale(2); /* Safari and Chrome */
  -o-transform: scale(2); /* Opera */
  padding: 10px;
  color:#FF345A;
}
 

.slider_border{ border-top:1px solid #c4c4c4;}
.slick-pre{ position:absolute; top:50%; left:0px; display:block; z-index:8; }
.slick-next{ position:absolute; top:50%; right:0px; display:block; z-index:8; }

/*運費*/
.fee_area{width:100%; background:#EBEBEB; font-size:14px; letter-spacing:1px; padding:10px; box-sizing:border-box; line-height:22px;}
.total_area{ width:100%; background:#C0B494; border-top:1px solid #bbbbbb; font-size:18px; color:#ffffff; padding:30px 0; letter-spacing:1px; line-height:22px; text-align:center; }


@media screen and (max-width: 768px) {

	.cart_title{ margin:50px 0 20px 0;}
	.cart_step_area_m{ display:block; margin:0 0 20px 0; }
	.cart_step_area{ display:none; }	
	.cart_none{ display:none;}
	
	#product_table td{ font-size:13px; }
	#product_table select{ width:53px; }
	
	.product_fee_area_left{ float:none; text-align:center; width:100%; font-size:13px; }
	.product_fee_area_right{ float:none; text-align:left; text-align:center; width:100%; font-size:13px; }
	
	.cart_pay_option{ float:none; }		
	
}

@media screen and (max-width: 600px) {
	.cartype_left{ float:none; width:100%; text-align:center; }
}

@media screen and (max-width: 480px) {
	
	.cart_select2{ box-shadow:none; border:0; }	
	.cart_receive_none{ display:none;}
	
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Common RWD <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

@media screen and (max-width : 1200px) {
	#footer ul{ margin-left:10px; }
}

@media screen and (max-width : 1024px) {

	#index_news .index_news_left{ display:none; }
	#index_news .index_news_right{ width:100%; }
	#index_news .news_cleft{ width:10%; }
	#index_news .news_cright{ width:90%; max-width:none; }
	
	.slogan_text{ font-size:23px; line-height:30px; letter-spacing:3px; }
	
	#index_about .slogan , #index_product .slogan , #index_knows .slogan { position:inherit; float:left;}
	
	#index_about .index_about_left , #index_knows .index_knows_left{ display:none; }
	#index_product .index_product_right{ display:none; }
		
	#index_about .index_about_right , #index_product .index_product_left , #index_knows .index_knows_right{ float:left; width:75%; max-width:none; padding:0 0 0 20px; }
	
	#footer .foot_right{ display:none; }	
	
}
@media screen and (max-width : 720px) {
	
	#index_news .news_cright span{ display:block; margin:0 0 10px 0; } 
	#index_news .news_cleft{ width:15%; }
	#index_news .news_cright{ width:85%; }	
	.kitchen_mask{ opacity:1;}
	.none720{ display:none; }		
	
}
@media screen and (max-width : 480px) {
	
	#index_news .news_cleft{ float:none; }
	#index_news .news_cright{ width:98%; margin:0 1%; }
	#index_news .news_cleft{ width:100%; }	
	
	#index_about .slogan , #index_product .slogan , #index_knows .slogan{ width:100%; background:none; padding:20px 0 0 0; }	
	
	#index_about .index_about_right , #index_product .index_product_left , #index_knows .index_knows_right{ margin:20px 0 0 0; width:90%; }
	.about_more , .product_more , .knows_more{ margin:10px 0 20px 0;}
	
	.slogan_text{ writing-mode:horizontal-tb; -webkit-writing-mode: inherit; }	
	.slogan_text span{ display:block; width:100%; text-align:center; }	
	.slogan_text2{ writing-mode:horizontal-tb; -webkit-writing-mode: inherit; }	
	.slogan_text2 span{ display:block; width:100%; text-align:center; }
	
	#index_kitchen .index_kitchen_left{ float:none; width:100%; max-width:none; }
	#index_kitchen .index_kitchen_right{ width:100%; }	
	
	#index_about .index_about_right img{ margin:0;}
	
	.none480{ display:none; }
		
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Mobile Menu <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.mobile_menu { z-index:9; display: none; width: 80px;text-align: center;height: auto;position: relative;cursor:hand;cursor:pointer;position: absolute;right: 10px;top: 50px;}
.bar1, .bar2, .bar3 { display: block; height: 5px; width: 45px; background: #2b2b2b; margin: 10px auto; }
.mobile_con { width: auto; margin: 0 auto;  -webkit-transition: all .7s ease;
 -moz-transition: all .7s ease;
 -ms-transition: all .7s ease;
 -o-transition: all .7s ease;
 transition: all .7s ease;
}
.middle { margin: 0 auto; }
.bar1, .bar2, .bar3 {  -webkit-transition: all .7s ease;
 -moz-transition: all .7s ease;
 -ms-transition: all .7s ease;
 -o-transition: all .7s ease;
 transition: all .7s ease;
}
.mobile_con .top { -webkit-transform: translateY(15px) rotateZ(45deg); -moz-transform: translateY(15px) rotateZ(45deg); -ms-transform: translateY(15px) rotateZ(45deg); -o-transform: translateY(15px) rotateZ(45deg); transform: translateY(15px) rotateZ(45deg); }
.mobile_con .bottom { -webkit-transform: translateY(-15px) rotateZ(-45deg); -moz-transform: translateY(-15px) rotateZ(-45deg); -ms-transform: translateY(-15px) rotateZ(-45deg); -o-transform: translateY(-15px) rotateZ(-45deg); transform: translateY(-15px) rotateZ(-45deg); }
.mobile_con .middle { width: 0; }


@media screen and (max-width : 1024px) {
	.mobile_menu {display: inline-block; }
	
	#menu .menu_wrapper{ margin:0; }
	#menu .menu_wrapper ul{ display:none; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Bxslider <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

ul.bxslider { margin:0; padding:0; }
#home_banner { 
  margin-top:160px;
  display: inline-block; width: 100%; /*max-height: 750px;*/
  overflow: hidden; position: relative; }
#home_banner li { width: 100%; background-repeat: no-repeat; background-size: cover; background-position: center;   /*height: 1000px;*/
	-webkit-transition:transform .5s ease;
 -moz-transition:transform .5s ease;
 -o-transition:transform .5s ease;
 -ms-transition:transform .5s ease;
 transition:transform .5s ease;
}
#home_banner img { display: block; }
#home_banner .bxslider { opacity: 0; }
#home_banner .bx-wrapper .bx-pager.bx-default-pager a:hover, #home_banner .bx-wrapper .bx-pager.bx-default-pager a.active { background: white; border:2px solid transparent; }
#home_banner .bx-wrapper .bx-pager.bx-default-pager a { background-color: transparent; border:2px solid white; width: 12px; height: 12px; margin: 0 8px; border-radius: 50%;  -webkit-transition: all .5s ease;
 -moz-transition: all .5s ease;
 -o-transition: all .5s ease;
 -ms-transition: all .5s ease;
 transition: all .5s ease;
}
#home_banner .bx-wrapper .bx-pager { bottom: 32px; opacity: 0; }
#home_banner .word { font-size: 15px; position: absolute; margin-left: -187px; margin-top: -116px; left: 50%; top: 50%; color: #673D3A; letter-spacing: 25px; opacity: 0.2; }
#home_banner .word b { font-weight: bold; }
#home_banner .down { position: absolute; right: 30px; bottom: 32px; width: 34px; height: 28px; z-index: 99; cursor: pointer; opacity: 0; }
#home_banner .down img { display: block; }

#container{ max-width:1200px; margin:0 auto 0 auto; }

@media screen and (max-width : 1024px) {
 #home_banner .bx-wrapper .bx-pager.bx-default-pager a {
 width: 15px;
 height: 15px;
}
#home_banner .down {
 display: none;
}
 #home_banner, #home_banner li {
	/*max-height: 575px;*/
	/*height: 575px;*/ 
	 margin-top: 75px;
}
}
 @media screen and (max-width : 720px) {
 #home_banner, #home_banner li {
 max-height: 380px;
 height: 380px;
}
 #home_banner img {
 display: none;
}
 #home_banner .word {
 margin-left: -133px;
 margin-top: -60px;
}
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Affect <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

* { /*-webkit-transition: all 0.5s;*/ }

@keyframes dropHeader {  0% {
 transform: translateY(10%);
}
 100% {
 transform: translateY(0);
}
}

@keyframes transiTop100 {
  0% {
    transform: translateY(100%);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes transiTop10 {
  0% {
    transform: translateY(-10%);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes transiLeft100 {
  0% {
    transform: translateX(5%);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes transiRight100 {
  0% {
    transform: translateX(-5%);
  }
  100% {
    transform: translateX(0);
  }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Loadaction <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.Loadaction_Box { position: fixed; left: 0px; top:0px; background-image:url(../../images/action_bg.png); z-index:100000000 }
.Loadaction { position:fixed;  padding-top:5px; width: 220px; height: 45px; left: 42%; top: 42%; background-image:url(../../images/action_bg.png); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; }
.Actionupload_Text { font-size:13px; color:#FFFFFF; height:20px; }

@media screen and (max-width : 1024px) {
	.Loadaction{ left:38%;}
}
@media screen and (max-width : 720px) {
	.Loadaction{ left:33%;}
}
@media screen and (max-width : 600px) {
	.Loadaction{ left:30%;}
}
@media screen and (max-width : 480px) {
	.Loadaction{ left:26%;}
}
@media screen and (max-width : 300px) {
	.Loadaction{ left:20%;}
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> pagelink <<<--------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.cssa { font-family:Verdana; letter-spacing:1px; font-size:12px; padding-right:10px; padding-left:10px }
.cssb { font-family:Verdana; letter-spacing:1px; font-size:12px; padding-right:5px; padding-left:5px }
.cssc { padding-bottom:3px; letter-spacing:1px; font-size:12px; padding-left:10px; padding-right:10px; height:40px }
.cssd { font-family:Verdana; font-size:12px; letter-spacing:2px; height:10px; border:1px solid #FFFFFF }
a.pagelink_no:link { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; }
a.pagelink_no:visited { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_no:active { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_no:hover { color: #003399; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:link { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; }
a.pagelink:visited { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:active { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:hover { color: #333333; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_ch:link { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:visited { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:active { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:hover { color: #cc3300; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
