/* product */
#product { padding: 40px 0; }
#product h2.titleBox { margin: 30px 0px; text-align: center; font-size: 4vw; color: #617472; }
#product h2.titleBox font { position: relative; display: inline-block; }
#product h2.titleBox font:after { position: absolute; width: 30%; height: 20px; display: block; background: #ebff79; z-index: -1; content: ""; right: 0; bottom: 30px; }
#product .pro-list { overflow: hidden; }
#product .pro-list >div { float: left; width: 20%; }
#product #otherP >div { width: 25%; }
#product .pro-list >div .bgBox { position: relative; margin: 10px; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; }
#product .pro-list >div .bgBox:hover { background-position: 50% -80px; box-shadow: 0 0 10px #676767; -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -ms-filter: grayscale(0); -o-filter: grayscale(0); filter: grayscale(0); filter: none; }
#product .pro-list >div .bgBox a.link { position: absolute; width: 100%; height: 100%; display: block; z-index: 2; }
#product .pro-list >div .bgBox .info { position: absolute; overflow: hidden; padding: 10px 20px; width: calc(100% - 40px); background: #fff; bottom: -90px; left: 0; }
#product .pro-list >div .bgBox:hover .info { bottom: 0; }
#product .pro-list >div .bgBox .info h3 { height: 34px; font-size: 20px; -webkit-line-clamp: 1; }
#product .pro-list >div .bgBox .info .price { width: calc(100% - 50px); min-height: 30px; display: inline-block; vertical-align: bottom; }
#product .pro-list >div .bgBox .info .price span { font-size: 18px; }
#product .pro-list >div .bgBox .info .price span.old { margin-right: 15px; font-size: 14px; text-decoration-line: line-through; color: #888; }
#product .pro-list >div .bgBox .info .goTxt { width: 38px; display: inline-block; font-size: 12px; }
#product p.more { text-align: center; }

/* products-detail */
#products-detail { text-align: center; }
#products-detail >div { width: 30%; display: inline-block; }
#products-detail .sub-pro-img { margin-right: 8%; }
#products-detail .sub-pro-img .imgList >div a.photo img { width: 100%; }
#products-detail .sub-pro-img .imgList >div a.photo img:first-child { display: none; }
#products-detail .productInfo p { margin: 5px 0; font-size: 16px; }
#products-detail .productInfo p.cat a { color: #706e6e; }
#products-detail .productInfo h2 { font-size: 30px; }
#products-detail .productInfo p label , #products-detail .orderstyleSet label { display: inline-block; color: #888; vertical-align: middle; }
#products-detail .productInfo p b { display: inline-block; vertical-align: middle; }
#products-detail .productInfo .price p.old b { text-decoration: line-through; }
#products-detail .productInfo .price p.offer b { font-size: 20px; color: #c81616; }
#products-detail .orderstyleSet a { display: inline-block; background: #5f5f5f; color: #fff; width: 21px; text-align: center; height: 21px; border-radius: 50%; line-height: 18px; font-size: 20px; vertical-align: middle; }
#products-detail .orderstyleSet a.limit { background: #b0b0b0; }
#products-detail .orderstyleSet input { font-size: 15px; width: 40px; text-align: center; background: none; margin: 0 5px; display: inline-block; vertical-align: middle; }
#products-detail .btns { overflow: hidden; margin-top: 30px; padding-top: 25px; border-top: 2px #000 solid; }
#products-detail .btns a { float: left; margin: 10px 0; padding: 15px 0; width: calc((100% - 10px) / 2); background: #fff; box-shadow: 1px 1px 3px #b8b8b8; text-align: center; color: #000; }
#products-detail .btns a.addcar { margin-right: 10px; background: #fd828b; font-size: 16px; color: #fff; }

/* productTabs */
#productTabs ul.tabs { margin: 110px 0 20px; border-bottom: 1px #ccc solid; text-align: center; }
#productTabs ul.tabs li { display: inline-block; }
#productTabs ul.tabs li a { padding: 10px 30px; background: rgba(0, 0, 0, .2); box-shadow: -1px -1px 3px #d5d5d5; display: block; font-size: 18px; color: #000; }
#productTabs ul.tabs li:hover a , #productTabs ul li.active a { background: rgba(26, 25, 25, .8); color: #fff; }

@media screen and (max-width: 1280px) {
	#product .pro-list >div { width: 25%; }
	 #product .pro-list >div .bgBox { box-shadow: 0 0 10px #b1b1b1; -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -ms-filter: grayscale(0); -o-filter: grayscale(0); filter: grayscale(0); filter: none; }
	#product .pro-list >div .bgBox .info { bottom: 0; }
	#products-detail >div { width: calc(46% - 10px); }
	#products-detail .sub-pro-img { margin-right: 4%; }
}
@media screen and (max-width: 980px) {
	#product .pro-list >div { width: calc(100% / 3); }
	#product #otherP >div { width: 50%; }
}
@media screen and (max-width: 640px) {
	#product .pro-list >div , #product #otherP >div { width: 50%; }
	#products-detail >div { width: 100%; }
	#products-detail .sub-pro-img { margin-bottom: 30px; margin-right: 0; }
	#products-detail .sub-pro-img .imgList >div a.photo img { width: auto; }
}
@media screen and (max-width: 480px) {
	#product .pro-list >div , #product #otherP >div { margin: 10px auto; float: none; width: 80%; }
	#productTabs ul li a { padding: 10px 20px; }
}