
/* ======================================
	Media Queries
====================================================================================================================================== */


@media screen and (min-width: 641px) and (max-width: 992px) {
	
	

}

@media only screen and (max-width: 1100px) {
	
	/* ==13. 商品介紹======================================= */
	.img-zoom-result {
		width:350px;
		height:350px;
	}
	
}

@media only screen and (max-width: 1024px) {
	
	/* ==09. 輪播banner設定======================================= */
	.page-heading{ width:180px; height:78px; margin-left:-75px; }
	.page-heading .title{ line-height:105px; font-size:20px; }
	

	/* ==11. 首頁======================================= */
	.idx-knowledge-area{ min-height:450px; }
	.idx-knowledge-area:before{ width:480px; height:400px; }
	.idx-knowledge-list{ bottom:-50px; padding-right:320px; }
	.idx-knowledge-more{ bottom:-20px; right:90px; }
	
}

@media only screen and (max-width: 992px) {
	
	.container{ width:92%; }

	
	/* ==03. 分頁設定 page======================================= */
	.page{ margin-bottom:60px; }
	
	/* ==06. 頁首header設定======================================= */
	.header-top-left{ width:calc( 100% - 65px ); margin-right:0; }
	.header-top-center{ display:none; }
	.header-top-right{ width:45px; margin-left:20px; }
	.search-box.desktop{ display:none; }
	.menu-trigger{ display:block; }
	
	.header-bottom{ display:none; }

	
	
	/* ==07. 小螢幕時選單設定======================================= */
	.menu-toggle-content{ display:none; }
	.menu-toggle-content.opened{ display:block; }

	
	
	/* ==08. 頁尾footer設定======================================= */
	.footer-top-flex{ margin:30px 0 20px 0; }
	.footer-top-left , .footer-top-center , .footer-top-right{ width:100%; margin-right:0; margin-left:0; }
	.footer-top-left , .footer-top-center{ margin-bottom:20px; }
	.footer-info-list{ max-width:400px; margin-left:auto; margin-right:auto; }
	.social-list{ text-align:center; }
	.web-designer{ position:relative; top:auto; right:auto; margin-top:5px; }


	/* ==09. 輪播banner設定======================================= */
	.page-heading{ display:none; }
	
	
	/* ==10. 全頁面共同設定======================================= */
	.breadcrumbs{ text-align:center; margin:10px 0; }
	
	.category-area{ display:none; }
	
	.category-heading{ margin-top:30px; }
	
	.pageback-line{ margin-bottom:60px; }
	
	
	
	/* ==11. 首頁======================================= */
	.idx-knowledge-area{ min-height:400px; }
	.idx-knowledge-area:before{ width:360px; height:300px; }
	.idx-knowledge-list{ bottom:-80px; padding-right:300px; }
	
	.idx-news-name{ font-size:18px; }
	
	
	
	/* =13. 商品介紹=======================================*/
	.product-cols-gp{ margin:30px 0; }
	.product-left-side{ display:none; }
	.product-right-side{ width:100%; padding-top:0; }

	.product-cate-heading .title{ font-size:22px; }
	
	.pro-view-heading .title{ font-size:20px; }
	
	
	.img-zoom-lens , .img-zoom-result { display:none; }
	.img-zoom-container a:hover{ cursor:zoom-in; }
	

	
	/* =14. 專業知識=======================================*/
	.view-heading .title{ font-size:18px; }

	
}




@media only screen and (max-width: 768px) {

	
	/* ==11. 首頁======================================= */
	.idx-knowledge-wrap{ margin-bottom:200px; }
	.idx-knowledge-area{ min-height:250px; }
	.idx-knowledge-area:before{ width:240px; height:200px; }
	.idx-knowledge-list{ bottom:-70px; padding-right:200px; }
	.idx-knowledge-more{ bottom:-130px; right:0; width:100%; text-align:center; }
	
	.idx-news-wrap{ padding-top:45px; padding-bottom:45px; }
	.idx-news-left{ width:100%; margin-bottom:30px; }
	.idx-news-right{ width:100%; padding-left:0px; }
	.idx-news-date{ font-size:12px;  }
	.idx-news-name{ 
		font-size:18px;
		
		overflow:visible
		text-overflow:visible;
		white-space:normal;
	}
	.idx-news-intro{ font-size:14px; height:40px; }
	
	
	/* ==13. 商品介紹======================================= */
	.product-view-gp{ margin-bottom:60px; }
	.product-view-gp-left{ width:100%; margin-right:0; }
	.product-view-gp-right{ width:100%; }
	.pro-view-photos{ max-width:450px; margin-left:auto; margin-right:auto; margin-bottom:60px; }
	
	
	/* ==16. 聯絡我們=======================================*/
	.contact-gp{ padding-left:0px; }
	.contact-gp-left{ width:100%; margin-bottom:15px; }
	.contact-gp-right{ width:100%; margin-left:0; }
	
	/*.contact-info-list li{ padding-left:57px; min-height:30px;  }
	.contact-info-list li .title{ width:55px; }
	.contact-info-list li , .contact-info-list li a { color:#333; font-size:16px; font-weight:500; }*/
	
	.map{ margin-top:15px; }
	
	.contact-form-area{ padding-left:0px; }
	.input-group { margin-bottom:10px; padding-right:0; }
	.input-group.half-width{ width:100%; } 
	.input-control { width:100%; margin-top:3px; }
	.form-bt-line{ text-align:center; padding-left:0px; }
	
	
	/* =15. 最新消息=======================================*/
	.post-name{ font-size:16px; }
	
	
	/* ==17. 商品搜尋======================================= */
	.search-list li{ width:32%; margin-right:2%; margin-bottom:30px; }
	.search-list li:nth-child(4n){ margin-right:2%; }
	.search-list li:nth-child(3n){ margin-right:0; }
}


@media only screen and (max-width: 640px) {
	
	
	/* ==10. 全頁面共同設定======================================= */
	.thumbnail-list.three-cols li{ width:47%;  }
	
	
	
	/* ==11. 首頁======================================= */
	.idx-about-wrap{ padding:0 15px; }
	.idx-about-area{ padding-top:60px; min-height:auto; padding-bottom:45px; }
	.idx-about-area:before{ display:none; }
	.idx-about-heading{ left:auto; right:0; width:150px; }
	
	.idx-pro-wrap{ padding:45px 5px 75px 5px; }
	.idx-pro-heading{ margin-bottom:45px; max-width:300px; }
	.idx-item-slider{ margin-bottom:30px; }

	.idx-knowledge-wrap{ padding:0; margin-top:0; margin-bottom:0; }
	.idx-knowledge-wrap:before{
		background:url(../images/web-22.png) no-repeat center left;
		background-size:cover;
	}
	.idx-knowledge-area{ min-height:auto; }
	.idx-knowledge-area:before{ top:-30px; right:5px; bottom:auto; width:120px; height:100px; }
	.idx-knowledge-list{ position:relative; top:auto; bottom:auto; margin-left:5%; width:90%; padding-top:40px; padding-right:0px; }
	.idx-knowledge-list li{ margin-left:0.5%; margin-right:0.5%; }
	.idx-knowledge-more{ position:relative; bottom:auto; background:#fff; margin-top:20px; padding:20px 0 20px 0; }
	
	.idx-news-wrap{ padding-left:15px; padding-right:15px; }
	
	.idx-contact-wrap{ padding-bottom:30px; }
	.idx-oontact-more{ text-align:center; margin-top:30px; } 
	.idx-oontact-more-btn{ max-width:200px; padding:10px 5px 9px 5px; font-size:16px; }
	
	
	/* ==13. 商品介紹=======================================*/
	.product-list li{ width:47.5%; margin-right:5%; margin-bottom:30px; }
	.product-list li:nth-child(3n){ margin-right:5%; }
	.product-list li:nth-child(2n){ margin-right:0; }
	
	
	/* ==12. 最新消息======================================= */
	.post-left{ width:100%; margin-right:0; margin-bottom:20px; }
	.post-right{ width:100%; }
	
	.post-heading{ padding-right:0; }
	.post-name{ overflow:visible; text-overflow:initial; white-space:normal; }
	.post-date{ position:relative; bottom:auto; right:auto; display:block; margin-bottom:5px; font-size:12px; color:#545454; }
	
}


@media only screen and (max-width: 480px) {
	
	/* ==05. 回頂端按紐=======================================*/
	.scrolltop{ bottom: 10px; }
	
	/* ==08. 頁尾footer設定=======================================*/
	.web-copyright{ padding-bottom:50px; }
	
	
	/* ==11. 首頁======================================= */
	.idx-item-slider .owl-item .item{ padding-left:15px; padding-right:15px; }
	
	
	/* ==17. 商品搜尋======================================= */
	.search-list li{ width:48%; margin-right:4%; margin-bottom:30px; }
	.search-list li:nth-child(3n){ margin-right:4%; }
	.search-list li:nth-child(2n){ margin-right:0; }
	
	
}


@media only screen and (max-width: 360px) {
}

