#page-body { padding: 0px; position: relative; /*overflow-x: hidden;*/  }
body { overflow-x: hidden; background-image: url(../images/web_app_body_bg.png); background-repeat: repeat; }
.no-bottom-margin { margin-bottom: 0px !important; }
.float { width: 48%; float: left; }
.container-title { padding-bottom: 15px; font-family: "Lato", sans-serif; font-size: 13px; font-weight: 900; }
.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }
.left-text { text-align: left; }
.center-text { text-align: center; }
.right-text { text-align: right; }
.in-container { margin-right: 0px !important; margin-left: 0px !important; }
.content { /*border-radius: 10px;*/ display: block; position: relative; z-index: 999; background-image: none; clear: both; float: left; width: 100%; margin: 0px; padding: 0px; background-color: #FFF; }
.clear { clear: both; }
.xxx{ clear: both; float: left; width: 100%; margin: 0px; padding: 0px; display: block; }

.close-left-sidebar 1{ display: none; }
.close-right-sidebar 1{ display: none; }


.left-controls { padding-top: 10px; padding-left: 10px; float: left; padding-bottom: 8px; }
.right-controls { padding-top: 10px; padding-right: 10px; float: right; padding-bottom: 8px; }

.open-left-sidebar{ background-image: url(../images/menu.png); display: block; margin: 0px; padding: 0px; height: 40px; width: 45px; }
.open-left-sidebar:hover{ background-image: url(../images/menu.png); display: block; margin: 0px; padding: 0px; }
.open-right-sidebar{ background-image: url(../images/settings.png); display: block; margin: 0px; padding: 0px; height: 40px; width: 45px; }
.open-right-sidebar:hover{ background-image: url(../images/settings.png); display: block; margin: 0px; padding: 0px; }

.close-left-sidebar{ background-image: url(../images/close.png); display: block; margin: 0px; padding: 0px; height: 40px; width: 45px; }
.close-left-sidebar:hover{ background-image: url(../images/close_on.png); display: block; margin: 0px; padding: 0px; }
.close-right-sidebar{ background-image: url(../images/close.png); display: block; margin: 0px; padding: 0px; height: 40px; width: 45px; }
.close-right-sidebar:hover{ background-image: url(../images/close_on.png); display: block; margin: 0px; padding: 0px; }


.slider { margin-top: 20px; margin-bottom: 20px; }
.slider-heading p { color: rgb(119, 119, 119) !important; padding-top: 5px; padding-bottom: 20px; text-shadow: 0px 1px 0px #FFFFFF; }
.container { margin-right: 20px; margin-bottom: 20px; margin-left: 20px; display: block; }
.sidebar-hide-scroll-left { width: 240px;position: absolute;}
.sidebar-left { padding: 0px; left: 0px; top: 0px; width: 240px; bottom: 0px; overflow: hidden;  position: absolute; z-index: 2000; background-image: url("../../images/bg/sidebar.png"); height:100%;}
.sidebar-hide-scroll-right { width: 240px;position: absolute;}
.sidebar-right { top: 0px; width: 240px; right: 0px; bottom: 0px; overflow: hidden; margin-right: 0px; position: absolute; z-index: 99; height:100%}
.responsive-image { display: block; max-width: 100%;  }
#homeimage_box a{ display: block; width: 100%;}

/*手機頁面上方*/
.tootls_nav{ background-image: url(../images/tootls_nav.jpg); background-repeat: repeat-x; background-position: left top; float: left; width: 100%; clear: both; margin: 0px; padding: 0px; }
.replace-2x{zoom:1;}
.replace-1x{zoom:1;}

/*手機右側選單*/
.function_title{ background-image: url(../images/menu_title_right_bg.jpg); background-repeat: repeat-y; background-position: left top; color: #FFF; padding-left: 12px; font-size: 13px; padding-top: 10px; margin: 0px; padding-right: 0px; padding-bottom: 5px; }
.f_search{ border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #2c4000; }
.f_language{ border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #2c4000; border-top-width: 1px; border-top-style: solid; border-top-color: #CCC;}
.f_worldwide{ border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #2c4000; border-top-width: 1px; border-top-style: solid; border-top-color: #CCC;}
.shadow{ border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #282828; border-top-width: 1px; border-top-style: solid; border-top-color: #CCC; }

#topicon_page{ display: none; }
.sub_search_box{display: none;}
#home_search_page{display: none;}
@media only screen and (min-width: 1280px){
	#topicon_page{ display: block; clear: both; float: left; width: 100%; }
	.sub_search_box{display: block;}
	#home_search_page{display: block;}
	#page-body{ width: 1240px; margin-right: auto; margin-left: auto; }
	.sidebar-left { display:block!important; padding: 0px; width: 240px; overflow: visible; z-index: 99; background-image: url("../../images/bg/sidebar.png"); position: absolute; }
	.content { /*border-radius: 10px;*/ display: block; position: relative; z-index: 999; clear: both; float: left; width: 1000px; margin-left: 240px; background-color: #FFF; }
	.left-controls { display: none; }
	.right-controls{ display: none; }
	#homeimage_box img{ clear: both; float: left; display: block; width: 100%; }
	#home_content_box{ position: relative; clear: both; width: 995px; display: block; margin: 0px; float: left; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 5px; }
	.home_row_box{ width: 995px; margin: 0px; float: left; clear: both; position: relative; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 5px; }
	.home_productpic_page{ float: left; padding-bottom: 10px; padding-top: 10px; clear: both; padding-right: 0px; padding-left: 0px; width: 1000px; margin: 0px; }
	
}
@media only screen and (min-width: 980px) and (max-width: 1279px) {
#home_content_box{ width: 995px; padding-left: 5px; margin-right: auto; margin-left: auto;  float: none; }
.home_row_box{ width: 995px;padding-left: 5px; margin-right: auto; margin-left: auto;float: none;}
#home_left_box{ width: 660px; display: block; float: left; margin-right: 10px; margin-left: 10px; }
#home_right_box{ width: 300px; display: block; float: right; padding-right: 10px; }
#sub_content_box{ width: 1000px;margin-right: auto; margin-left: auto;float: none; }
#sub_right_box{ width: 96%;margin-right: auto; margin-left: auto;float: none;  }
#subimage_box img{ line-height: normal; height: auto; width: 100%; }	
#homeimage_box img{ clear: both; float: left; display: block; width: 100%; }
.home_productpic_page{width: 100%; }
}
/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */

@media only screen and (min-width: 768px) and (max-width: 979px) {
#homeimage_box img{ clear: both; float: left; display: block; width: 100%; }
#topicon_page{ display: none; }
.sub_search_box{display: none;}
#home_search_page{display: none;}

#home_content_box{ width: 768px; }
#home_row_page, #home_content_page{ width: 768px; margin-right: auto; margin-left: auto; }
.home_row_box{ width: 768px;  }
#home_left_box{ width: 468px; }
#home_right_box{ width: 250px;  }

.home_productpic_page{width: 768px; }
.home_productpic_box{ width: 110px; display: block; float: left; padding-right: 8px; padding-left: 10px; }
.home_productpic_box figure img{ width: 100px;height: 100px;}

#home_banner_page{width: 768px; margin: 0px; padding: 0px;}
#home_banner_box{width: 748px;}
#home_banner_box .home_banner1{ float: left; width: 240px; }
#home_banner_box .home_banner2{ float: left; width: 240px; }
#home_banner_box .home_banner3{ float: left; width: 240px; }
#home_banner_box figure img{ width: 230px; }

#footer .footer_box{width: 768px;}
.footer_nav_box{width: 768px; }
#address {width: 768px;}

#sub_content_box{ width: 100%; clear: both; }

.news_list_box li.list_title a{  width: 480px;}

#products_page_box .sub_productpic_box{ padding-right: 5%; padding-bottom: 10px; display: block; width: 45%; position: relative; height: 280px; }

#sub_one_box{ width: 90%; display: block; float: left; margin: 0px; padding-right: 5%; padding-left: 5%; padding-top: 1px; clear: both; }
.product_style2{ width: 45%;}

/*詢價表格*/
.inquiry_list_box .width_photo{ width: 180px; float: left;}
.inquiry_list_box .width_txt{ width: 350px; float: left;}
.inquiry_list_box .width_button{ width: 122px; float: left;}
.inquiry_list_box .width_product_title{ width: 200px; float: left; }
.inquiry_list_box .width_sel{ width: 230px; float: left; }

.grid_12{ width: 760px; display:block; float:left; margin:0 10px }
#sub_right_box{ width: 90%; padding-right: 5%; padding-left: 5%; }
.homeimage{ display: none; }
}

/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */

@media only screen and (min-width: 480px) and (max-width: 767px) {
#homeimage_box img{ clear: both; float: left; display: block; width: 100%; }
#topicon_page{ display: none; }
.sub_search_box{display: none;}
#home_search_page{display: none;}


.company_box .logopic { margin: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; }
.company_box .logopic img{ height: 50px; margin: 0px; padding: 0px; }
.company_box h2 { line-height: 2.4em; margin: 0px; padding: 0px; }

#home_content_box{ width: 480px; }
#home_row_page, #home_content_page{ width: 480px; margin-right: auto; margin-left: auto; }
.home_row_box{ width: 480px;  }
#home_left_box{ width: 460px;  }
#home_right_box{ width: 460px; margin-left: 10px;  }

.home_productpic_page{width: 480px; }
.home_productpic_box{ width: 140px; height: 220px;display: block;float: left; }
.home_productpic_box figure img{ width: 120px;height: 120px;}

#home_banner_page{ width: 480px; margin: 0px; padding: 0px; }
#home_banner_box{width: 480px;}
#home_banner_box .home_banner1{ float: left;  }
#home_banner_box .home_banner2{ float: left; }
#home_banner_box .home_banner3{ float: left;  }
#home_banner_box figure img{  }

#footer .footer_box{width: 480px;}
.footer_nav_box{width: 480px; }
#address {width: 480px;}
.grid_3{ display: none; }

#sub_content_box{ width: 100%; clear: both; }
.product_style2,.product_style1{ width: 100%;}


/*最新消息內頁*/
.news_list_box li.list_title{  background-position: 0px 11px; }
.news_list_box li.list_title a{ padding-right: 10px; padding-left: 15px; clear: both; float: left; width: 90%; }
.news_list_box li .list_date{ clear: both; float: left; display: block; width: 90%; text-align: left; padding-left: 15px; }


#products_page_box .sub_productpic_box{ padding-right: 5%; padding-bottom: 10px; display: block; width: 45%; position: relative; height: 280px; }
#products_page_box .sub_productpic_box figure { margin:0px; padding: 0px; display: block; clear: both; width: 140px; float: left; }
#products_page_box .sub_productpic_box figure a{ padding: 0px; text-align: center; vertical-align: middle; display: block; margin: 0%; }
#products_page_box .sub_productpic_box figure a img{ padding: 3px; margin: 0px; display: block; border: 1px solid #CCC; background-color: #FFF; height: 120px; width: 120px; }

#sub_one_box{ width: 90%; display: block; float: left; margin: 0px; padding-right: 5%; padding-left: 5ex; padding-top: 1px; clear: both; }

.form_box .form_tr .label_box{ float:left; font-size:13px; width:100%; display: block; text-align: left; padding-top: 5px; padding-right: 5px; }

.form_member_login .form_tr .label_box{ float:left; font-size:13px; width:100%; display: block; }
.form_member_login .form_tr .label_box .label_th{ font-size: 15px; color: #333; margin-bottom: 5px; display: block; }
.form_member_login .form_tr .label_box .vcode{ font-size: 15px; margin-bottom: 5px; display: block; }
.form_member_login .form_tr .input_box .input_200{ width:450px; color:#666; font-size:13px; margin-right:8px; border: 1px solid #CCC; padding: 3px; clear: both; } 
.form_member_login .form_tr .img_box{ float: left; display: block; padding-top: 5px; padding-right: 0px; padding-bottom: 5px; padding-left: 0px; }
.form_member_login .form_tr .check_box{ float: left; display: block; padding-top: 5px; padding-right: 0px; padding-bottom: 5px; padding-left: 0px; clear: both; }

/*詢價表格*/
.inquiry_list_box .list_title{ display: none; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; }
.inquiry_list_box .width_photo{ width: 200px;}
.inquiry_list_box .width_txt{ width: 200px; }
.inquiry_list_box .width_button{ width: 100%;  }

.grid_12{ width: 480px; display:block; float:left; margin:0 10px }

.product_detail_box .product_pic_L img { max-width: 300px; max-height: 300px; _width: 300px; _height: 300px;}
* html .product_detail_box .product_pic_L img { width: expression (this.width > 300px && this.width > this.height ? 300px : auto);height: expression (this.height > 300px && this.height > this.width ? 300px : auto);}

.product_detail_box .product_photo_s_box .product_pic_S{  float: left; width: 106px; text-align: left; }
.product_detail_box .product_photo_s_box .product_pic_S img{ background-color: #cfd7e2; padding: 5px; height: 80px; width: 80px; }
.product_detail_box .product_photo_s_box .product_pic_S img:hover{ background-color: #bcc4d0;  }
#sub_right_box{ width: 90%; padding-right: 5%; padding-left: 5%; }
.homeimage{ display: none; }

}

/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */

@media only screen and (max-width: 480px) {
.columns-2{ clear: both; }
#homeimage_box img{ clear: both; float: left; display: block; width: 100%; }
#topicon_page{ display: none; }
.sub_search_box{display: none;}
#home_search_page{display: none;}

.company_box .logopic { margin: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; }
.company_box .logopic img{ height: 40px; margin: 0px; padding: 0px; }
.company_box h2 { line-height: 2em; margin: 0px; padding: 0px; }
					
#home_content_box{ width: 320px; }
#home_row_page, #home_content_page{ width: 320px; margin-right: auto; margin-left: auto; }
.home_row_box{ width: 320px; clear: both; float: left; }
#home_left_box{ width: 300px; clear: both; float: left;margin-right: 10px; margin-left: 10px; }
#home_right_box{ width: 300px; clear: both; float: left;margin-right: 10px; margin-left: 10px; }

.home_news_one_box .meta_box{ display: block; float: left; width: 13%; }
.home_news_one_box .meta{ font-size: 11px; width: 38px; background-color: #333; color: #FFF; text-align: center; }
.home_news_one_box .day{ font-size: 13px; line-height: 1.68em; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #FFF; }

.home_productpic_page{width: 320px; }
.home_productpic_box{ width: 140px; height: 220px; display: block;float: left;}
.home_productpic_box figure img{ width: 120px;height: 120px;}

#home_banner_page{width: 320px; margin: 0px; padding: 0px;}
#home_banner_box{width: 320px;}
#home_banner_box .home_banner1{ float: left; clear: both; }
#home_banner_box .home_banner2{ float: left; clear: both; }
#home_banner_box .home_banner3{ float: left; clear: both; }
#home_banner_box figure img{ float: left; }

#footer .footer_box{width: 320px;}
.footer_nav_box{width: 320px; }
#address {width: 320px;}
.grid_3{ display: none; }

#sub_content_box{ width: 100%; clear: both; }
.grid_6{ width: 320px; display:block; float:left; margin:0 10px }

/*最新消息內頁*/
#news_page_box .category{ padding-bottom: 0px; padding-left: 0px; }
.news_list_box{ display: block; margin-top: 0px; }
.news_list_box li.list_title{  background-position: 0px 11px; }
.news_list_box li.list_title a{ padding-right: 10px; padding-left: 15px; clear: both; float: left; width: 90%; }
.news_list_box li .list_date{ clear: both; float: left; display: block; width: 90%; text-align: left; padding-left: 15px; }


#products_page_box .sub_productpic_box{ padding-right: 5%; padding-bottom: 10px; display: block; width: 95%; position: relative;}
.product_style2,.product_style1{ width: 100%;}

#sub_one_box{ width: 90%; display: block; float: left; margin: 0px; padding-right: 5%; padding-left: 5%; padding-top: 1px; clear: both; }


.form_box .form_tr .label_box{ float:left; font-size:13px; width:100%; display: block; text-align: left; padding-top: 5px; padding-right: 5px; }
.form_member_login .form_tr .label_box .label_th{ font-size: 15px; color: #333; margin-bottom: 5px; display: block; }
.form_member_login .form_tr .label_box .vcode{ font-size: 15px; margin-bottom: 5px; display: block; }
.form_box .form_tr .input_box .input_200{ width:260px; color:#666; font-size:13px; margin-right:8px; border: 1px solid #CCC; padding: 3px; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; } 
.form_box .form_tr .input_box .input_180{ width:200px; color:#666; font-size:13px; margin-right:8px; border: 1px solid #CCC; padding: 3px; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; } 
.form_box .form_tr .input_box .input_vcode{ width:150px; color:#666; font-size:13px; margin-right:8px; border: 1px solid #CCC; padding: 3px; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; } 
.form_box .form_tr .input_box .textarea1 { width:260px; margin-right:10px; color:#666; height:80px }
.form_box .form_tr .img_box{ float: left; display: block; padding-left: 0px; padding-top: 8px; } 


.form_member_login .form_tr .label_box{ float:left; font-size:13px; width:100%; display: block; }
.form_member_login .form_tr .input_box .input_200{ width:280px; color:#666; font-size:13px; margin-right:8px; border: 1px solid #CCC; padding: 3px; clear: both; } 
.form_member_login .form_tr .img_box{ float: left; display: block; padding-top: 5px; padding-right: 0px; padding-bottom: 5px; padding-left: 0px; }
.form_member_login .form_tr .check_box{ float: left; display: block; padding-top: 5px; padding-right: 0px; padding-bottom: 5px; padding-left: 0px; }

/*詢價表格*/
.inquiry_list_box .list_title{ display: none; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; }
.inquiry_list_box .width_photo{ width: 100%;}
.inquiry_list_box .width_txt{ width: 100%; }
.inquiry_list_box .width_button{ width: 100%;  }

.grid_12{ width: 320px; display:block; float:left; margin:0 10px }
.product_detail_box .photo_group_box{ width: 320px; }
.product_detail_box .product_pic_L{ width: 300px;  }
.product_detail_box .product_pic_L img { max-width: 300px; max-height: 300px; _width: 300px; _height: 300px;}
* html .product_detail_box .product_pic_L img { width: expression (this.width > 300px && this.width > this.height ? 300px : auto);height: expression (this.height > 300px && this.height > this.width ? 300px : auto);}

.product_detail_box .product_photo_s_box .product_pic_S{  float: left; width: 106px; text-align: left; }
.product_detail_box .product_photo_s_box .product_pic_S img{ background-color: #cfd7e2; padding: 5px; height: 80px; width: 80px; }
.product_detail_box .product_photo_s_box .product_pic_S img:hover{ background-color: #bcc4d0;  }
#sub_right_box{ width: 90%; padding-right: 5%; padding-left: 5%; }
.homeimage{ display: none; }
}
/*遮罩 By Steven*/
.content_mask{display:none; position:fixed; width:100%; height:100%; z-index:500; overflow: hidden;}

/*鎖定IE畫面時使用*/
.ie_lockscreen{
    -ms-touch-action: none ;
}