/*******************产品图***********************/

.note{
	padding-top:7.5px;
	height: 32.5px;
	background-color: #106640;
}

.broadcast{
	margin-left: 18.7%;
	width: 500px;
	padding-left: 40px;
	height: 25px;
	line-height: 25px;
	color: #000000;
	background: rgba(255,255,255,0.8) url(../img/note.png) no-repeat 10px center / 18px 15px;
	border-radius: 15px;
	font-size: 12px !important;
}

@media screen and (max-width:768px) {
	.top {
		display: none !important;
	}
	
	.fbtn {
		/*display: none !important;*/
		opacity: 0;
		top: 0;
		position: absolute;
		cursor: pointer;
		width: 10%;
		height: 100%;
		z-index: 300;
	}
	.gl a:hover .lg {
		display: inline;
	}
	.fbtn:hover {
		opacity: .5
	}
	.fbtn.left {
		left: 0;
	}
	.fbtn.left .swiper-button-prev {
		position: absolute;
		top: 50%;
		left: 50px;
		width: 60px;
		height: 100px;
		margin-left: -30px;
		margin-top: -50px;
		background: url(../img/轮播左键.png) no-repeat center;
	}
	.fbtn.right {
		right: 0;
	}
	.fbtn.right .swiper-button-next {
		position: absolute;
		top: 50%;
		right: 50px;
		width: 60px;
		height: 100px;
		margin-left: -30px;
		margin-top: -50px;
		background: url(../img/轮播右键.png) no-repeat center;
	}
	.nav {
		position: absolute;
		bottom: 25px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		list-style-type: none;
		z-index: 10
	}
	.nav_slide {
		position: relative;
		display: inline-block;
		width: 25px;
		border-radius: 20px;
		height: 3px;
		background: #ddd;
		/*background:rgba(128,128,128,.2);*/
		margin-left: 10px;
		cursor: pointer
	}
	.nav_slide:before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 0;
		height: 4px;
		background: 0 0;
		-webkit-transition: all .5s ease-in-out;
		-moz-transition: all .5s ease-in-out;
		transition: all .5s ease-in-out
	}
	.nav_slide.active:before {
		width: 100%
	}
	.nav_slide:after {
		content: '';
		position: absolute;
		left: 0;
		top: -4px;
		width: 100%;
		height: 20px
	}
	.nav_slide:first-child {
		margin-left: 0
	}
	.nav_slide .slide_btn {
		width: 100%;
		height: 3px;
		background-color: transparent
	}
	.nav_slide.active .slide_btn {
		background: #ddd;
	}
	.nav_slide.autoplay .slide_btn {
		background: #ee8b20;
		-webkit-animation: scaleX 5s linear;
		-webkit-animation-fill-mode: forwards;
		transform-origin: 0;
		-moz-animation: scaleX 5s linear;
		-moz-animation-fill-mode: forwards;
		transform-origin: 0
	}
	@-webkit-keyframes scaleX {
		0% {
			-webkit-transform: scaleX(0)
		}
		100% {
			-webkit-transform: scaleX(1)
		}
	}
	@-moz-keyframes scaleX {
		0% {
			-moz-transform: scaleX(0)
		}
		100% {
			-moz-transform: scaleX(1)
		}
	}
	#head_hot_good_content {
		/*height: 176px !important;*/
		height: 200px;
	}
	#hhgc_ul {
		height: auto !important;
		width: 100% !important;
		position: relative;
		display: flex !important;
	}
	#hhgc_ul li {
		width: 100%;
		margin-top: 3px;
		-webkit-box-flex: 1;
		background: #F5F5F5;
		text-align: center;
		margin-right: 2px;
		cursor: pointer;
		position: relative;
	}
	#hhgc_ul li a {
		position: relative;
	}
	#hhgc_ul li a img {
		width: 100%;
		height: 100%;

		margin: auto;
		display: block;
	}
}

@media screen and (min-width: 768px) and (max-width:1024px) {
	
	.fbtn {
		/*display: none !important;*/
		opacity: 0;
		top: 0;
		position: absolute;
		cursor: pointer;
		width: 10%;
		height: 100%;
		z-index: 300;
	}
	.gl a:hover .lg {
		display: inline;
	}
	.fbtn:hover {
		opacity: .5
	}
	.fbtn.left {
		left: 0;
	}
	.fbtn.left .swiper-button-prev {
		position: absolute;
		top: 50%;
		left: 50px;
		width: 60px;
		height: 100px;
		margin-left: -30px;
		margin-top: -50px;
		background: url(../img/轮播左键.png) no-repeat center;
	}
	.fbtn.right {
		right: 0;
	}
	.fbtn.right .swiper-button-next {
		position: absolute;
		top: 50%;
		right: 50px;
		width: 60px;
		height: 100px;
		margin-left: -30px;
		margin-top: -50px;
		background: url(../img/轮播右键.png) no-repeat center;
	}
	.nav {
		position: absolute;
		bottom: 25px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		list-style-type: none;
		z-index: 10
	}
	.nav_slide {
		position: relative;
		display: inline-block;
		width: 50px;
		border-radius: 20px;
		height: 3px;
		background: #ddd;
		/*background:rgba(128,128,128,.2);*/
		margin-left: 10px;
		cursor: pointer
	}
	.nav_slide:before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 0;
		height: 4px;
		background: 0 0;
		-webkit-transition: all .5s ease-in-out;
		-moz-transition: all .5s ease-in-out;
		transition: all .5s ease-in-out
	}
	.nav_slide.active:before {
		width: 100%
	}
	.nav_slide:after {
		content: '';
		position: absolute;
		left: 0;
		top: -4px;
		width: 100%;
		height: 20px
	}
	.nav_slide:first-child {
		margin-left: 0
	}
	.nav_slide .slide_btn {
		width: 100%;
		height: 3px;
		background-color: transparent
	}
	.nav_slide.active .slide_btn {
		background: #ddd;
	}
	.nav_slide.autoplay .slide_btn {
		background: #ee8b20;
		-webkit-animation: scaleX 5s linear;
		-webkit-animation-fill-mode: forwards;
		transform-origin: 0;
		-moz-animation: scaleX 5s linear;
		-moz-animation-fill-mode: forwards;
		transform-origin: 0
	}
	@-webkit-keyframes scaleX {
		0% {
			-webkit-transform: scaleX(0)
		}
		100% {
			-webkit-transform: scaleX(1)
		}
	}
	@-moz-keyframes scaleX {
		0% {
			-moz-transform: scaleX(0)
		}
		100% {
			-moz-transform: scaleX(1)
		}
	}
	#head_hot_good_content {
		height: 180px !important;
	}
	#hhgc_ul {
		position: absolute;
		height: 180px !important;
		display: flex !important;
	}
	#hhgc_ul li {
		margin-top: 3px;
		-webkit-box-flex: 1;
		/*width: 24% !important;*/
		/*height: 242px;*/
		height:180px !important;
		/*padding-top: 12px;*/
		/*float: left !important;*/
		/*box-sizing: border-box;*/
		background: #F5F5F5;
		text-align: center;
		margin-right: 2px;
		/*border-top: 1px solid #FF6700 !important;*/
		/*border: 1px solid #dddddd;*/
		cursor: pointer;
		position: relative;
	}
	#hhgc_ul li a {
		position: relative;
	}
	#hhgc_ul li a img {
		width: 100%;
		height: 100%;
		;
		margin: auto;
		display: block;
	}
}



@media screen and (min-width:1025px) and (max-width:1280px) {

	.fbtn {
		/*display: none !important;*/
		opacity: 0;
		top: 0;
		position: absolute;
		cursor: pointer;
		width: 10%;
		height: 100%;
		z-index: 300;
	}
	.gl a:hover .lg {
		display: inline;
	}
	.fbtn:hover {
		opacity: .5
	}
	.fbtn.left {
		left: 0;
	}
	.fbtn.left .swiper-button-prev {
		position: absolute;
		top: 50%;
		left: 50px;
		width: 60px;
		height: 100px;
		margin-left: -30px;
		margin-top: -50px;
		background: url(../img/轮播左键.png) no-repeat center;
	}
	.fbtn.right {
		right: 0;
	}
	.fbtn.right .swiper-button-next {
		position: absolute;
		top: 50%;
		right: 50px;
		width: 60px;
		height: 100px;
		margin-left: -30px;
		margin-top: -50px;
		background: url(../img/轮播右键.png) no-repeat center;
	}
	.nav {
		position: absolute;
		bottom: 25px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		list-style-type: none;
		z-index: 10
	}
	.nav_slide {
		position: relative;
		display: inline-block;
		width: 50px;
		border-radius: 20px;
		height: 3px;
		background: #ddd;
		/*background:rgba(128,128,128,.2);*/
		margin-left: 10px;
		cursor: pointer
	}
	.nav_slide:before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 0;
		height: 4px;
		background: 0 0;
		-webkit-transition: all .5s ease-in-out;
		-moz-transition: all .5s ease-in-out;
		transition: all .5s ease-in-out
	}
	.nav_slide.active:before {
		width: 100%
	}
	.nav_slide:after {
		content: '';
		position: absolute;
		left: 0;
		top: -4px;
		width: 100%;
		height: 20px
	}
	.nav_slide:first-child {
		margin-left: 0
	}
	.nav_slide .slide_btn {
		width: 100%;
		height: 3px;
		background-color: transparent
	}
	.nav_slide.active .slide_btn {
		background: #ddd;
	}
	.nav_slide.autoplay .slide_btn {
		background: #ee8b20;
		-webkit-animation: scaleX 5s linear;
		-webkit-animation-fill-mode: forwards;
		transform-origin: 0;
		-moz-animation: scaleX 5s linear;
		-moz-animation-fill-mode: forwards;
		transform-origin: 0
	}
	@-webkit-keyframes scaleX {
		0% {
			-webkit-transform: scaleX(0)
		}
		100% {
			-webkit-transform: scaleX(1)
		}
	}
	@-moz-keyframes scaleX {
		0% {
			-moz-transform: scaleX(0)
		}
		100% {
			-moz-transform: scaleX(1)
		}
	}
	#head_hot_good_content {
		height:180px !important;
	}
	#hhgc_ul {
		position: absolute;
		height: 180px !important;
		display: flex !important;
	}
	#hhgc_ul li {
		margin-top: 3px;
		-webkit-box-flex: 1;
		/*width: 24% !important;*/
		/*height: 242px;*/
		height:180px !important;
		/*padding-top: 12px;*/
		/*float: left !important;*/
		/*box-sizing: border-box;*/
		background: #F5F5F5;
		text-align: center;
		margin-right: 2px;
		/*border-top: 1px solid #FF6700 !important;*/
		/*border: 1px solid #dddddd;*/
		cursor: pointer;
		position: relative;
	}
	#hhgc_ul li a {
		position: relative;
	}
	#hhgc_ul li a img {
		width: 100%;
		height: 100%;
		;
		margin: auto;
		display: block;
	}
}

@media screen and (min-width: 1281px) {
	.slide_wrapper {
		position: relative;
		width: 100%;

		overflow: hidden;
		z-index: 1000;
	}
	
	.gallery_slide_wrapper {
		position: relative;
		width: 100%;
		/*height: 100%;*/
		transition: all .7s ease-in-out
	}
	
	.gallery_item {
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
		overflow: hidden;
		width: 100%;
		/*height: 100%;*/
		color: #333;
		will-change: transform;
		transition: all .7s ease-in-out;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0)
	}
	
	.gallery_item.zIndex {
		z-index: 0;
	}
	
	.gallery_item.zIndexTop {
		z-index: 3
	}
	
	.gallery_item .gallery_image {
		position: absolute;
		z-index: 1;
		width: 100%;
		/*height: 100%;*/
		background-repeat: no-repeat;
		background-size: contain;
		background-position: bottom center
	}
	
	.gallery_item_content {
		position: absolute;
		z-index: 1000;
		top: 0;
		width: 100%;
		text-align: center;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none
	}
	
	.gallery_item_lockup_wrapper {
		position: relative;
		top: 14%;
		width: 100%;
		text-align: center;
		z-index: 2
	}
	/*.gallery_item_lockup_wrapper img {
	width: 100% !important;
	height: 100% !important;
	
}*/
	
	.gallery_item_lockup_wrapper span {
		font-size: 30px;
		color: #000
	}
	
	.gallery_item[data-idx="0"] .gallery_item_lockup_wrapper span {
		color: #fff
	}
	
	.fbtn {
		/*display: none !important;*/
		opacity: 0;
		top: 0;
		position: absolute;
		cursor: pointer;
		width: 10%;
		height: 100%;
		z-index: 300;
	}
	
	.gl a:hover .lg {
		display: inline;
	}
	
	.fbtn:hover {
		opacity: .5
	}
	
	.fbtn.left {
		left: 0;
	}
	
	.fbtn.left .swiper-button-prev {
		position: absolute;
		top: 50%;
		left: 50px;
		width: 60px;
		height: 100px;
		margin-left: -30px;
		margin-top: -50px;
		background: url(../img/轮播左键.png) no-repeat center;
	}
	
	.fbtn.right {
		right: 0;
	}
	
	.fbtn.right .swiper-button-next {
		position: absolute;
		top: 50%;
		right: 50px;
		width: 60px;
		height: 100px;
		margin-left: -30px;
		margin-top: -50px;
		background: url(../img/轮播右键.png) no-repeat center;
	}
	
	.nav {
		position: absolute;
		bottom: 25px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		list-style-type: none;
		z-index: 10
	}
	
	.nav_slide {
		position: relative;
		display: inline-block;
		width: 50px;
		border-radius: 20px;
		height: 3px;
		background: #ddd;
		/*background:rgba(128,128,128,.2);*/
		margin-left: 10px;
		cursor: pointer
	}
	
	.nav_slide:before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 0;
		height: 4px;
		background: 0 0;
		-webkit-transition: all .5s ease-in-out;
		-moz-transition: all .5s ease-in-out;
		transition: all .5s ease-in-out
	}
	
	.nav_slide.active:before {
		width: 100%
	}
	
	.nav_slide:after {
		content: '';
		position: absolute;
		left: 0;
		top: -4px;
		width: 100%;
		height: 20px
	}
	
	.nav_slide:first-child {
		margin-left: 0
	}
	
	.nav_slide .slide_btn {
		width: 100%;
		height: 3px;
		background-color: transparent
	}
	
	.nav_slide.active .slide_btn {
		background: #ddd;
	}
	
	.nav_slide.autoplay .slide_btn {
		background: #ee8b20;
		-webkit-animation: scaleX 5s linear;
		-webkit-animation-fill-mode: forwards;
		transform-origin: 0;
		-moz-animation: scaleX 5s linear;
		-moz-animation-fill-mode: forwards;
		transform-origin: 0
	}
	
	@-webkit-keyframes scaleX {
		0% {
			-webkit-transform: scaleX(0)
		}
		100% {
			-webkit-transform: scaleX(1)
		}
	}
	
	@-moz-keyframes scaleX {
		0% {
			-moz-transform: scaleX(0)
		}
		100% {
			-moz-transform: scaleX(1)
		}
	}
	
	#head_hot_good_content {
		/*height: 176px !important;*/
		/*height: 254px !important;*/
		margin-bottom: 5px;
	}
	
	#hhgc_ul {
		position: absolute;
		/*height: 242px;*/
		display: flex !important;
	}
	
	#hhgc_ul li {
		margin-top: 3px;
		-webkit-box-flex: 1;
		/*width: 24% !important;*/
		/*height: 242px;*/

		/*padding-top: 12px;*/
		/*float: left !important;*/
		/*box-sizing: border-box;*/
		background: #F5F5F5;
		text-align: center;
		margin-right: 2px;
		/*border-top: 1px solid #FF6700 !important;*/
		/*border: 1px solid #dddddd;*/
		cursor: pointer;
		position: relative;
	}
	
	#hhgc_ul li a {
		position: relative;
	}
	
	#hhgc_ul li a img {
		width: 100%;
		height: 100%;
		
		margin: auto;
		display: block;
	}
}
@media screen and (min-width: 1366px){
	#head_hot_good_content {

		/*height: 220px !important;*/
		margin-bottom: 3px;
	}
	
	#hhgc_ul {
		position: absolute;
		/*height: 220px;*/
		display: flex !important;
	}
	
	#hhgc_ul li {
		margin-top: 3px;
		-webkit-box-flex: 1;

		/*height: 212px !important;*/

		background: #F5F5F5;
		text-align: center;
		margin-right: 2px;

		cursor: pointer;
		position: relative;
	}
	
	#hhgc_ul li a {
		position: relative;
	}
	
	#hhgc_ul li a img {
		width: 100%;
		height: 100%;
		
		margin: auto;
		display: block;
	}
}
