﻿/*
**photoswipe
* http://photoswipe.com/
*
*/
/* pswp = photoswipe */
.pswp {
	/* create separate layer, to avoid paint on window.onscroll in webkit/blink */
	-webkit-backface-visibility: hidden;
	display: none;
	height: 100%;
	left: 0;
	outline: none;
	overflow: hidden;
	position: absolute;
	-webkit-text-size-adjust: 100%;
	top: 0;
	-ms-touch-action: none;
	touch-action: none;
	width: 100%;
	z-index: 1500;
}

.pswp * {
	box-sizing: border-box;
}

.pswp img {
	max-width: none;
}

/* style is added when JS option showHideOpacity is set to true */
.pswp--animate_opacity {
	/* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */
	opacity: 0.001;
	/* for open/close transition */
	-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
	transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
	will-change: opacity;
}

.pswp--open {
	display: block;
}

.pswp--zoom-allowed .pswp__img {
	/* autoprefixer: off */
	cursor: -webkit-zoom-in;
	cursor: -moz-zoom-in;
	cursor: zoom-in;
}

.pswp--zoomed-in .pswp__img {
	/* autoprefixer: off */
	cursor: -webkit-grab;
	cursor: -moz-grab;
	cursor: grab;
}

.pswp--dragging .pswp__img {
	/* autoprefixer: off */
	cursor: -webkit-grabbing;
	cursor: -moz-grabbing;
	cursor: grabbing;
}

/*
	Background is added as a separate element.
	As animating opacity is much faster than animating rgba() background-color.
*/
.pswp__bg {
	-webkit-backface-visibility: hidden;
	background: #000;
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	width: 100%;
	will-change: opacity;
}

.pswp__scroll-wrap {
	height: 100%;
	left: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	width: 100%;
}

.pswp__container,
.pswp__zoom-wrap {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	-ms-touch-action: none;
	touch-action: none;
}

/* Prevent selection and tap highlights */
.pswp__container,
.pswp__img {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.pswp__zoom-wrap {
	position: absolute;
	-webkit-transform-origin: left top;
	-ms-transform-origin: left top;
	transform-origin: left top;
	/* for open/close transition */
	-webkit-transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
	transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
	transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
	transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1), -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
	width: 100%;
}

.pswp__bg {
	/* for open/close transition */
	-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
	transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
	will-change: opacity;
}

.pswp--animated-in .pswp__bg,
.pswp--animated-in .pswp__zoom-wrap {
	-webkit-transition: none;
	transition: none;
}

.pswp__container,
.pswp__zoom-wrap {
	-webkit-backface-visibility: hidden;
}

.pswp__item {
	bottom: 0;
	left: 0;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
}

.pswp__img {
	height: auto;
	left: 0;
	position: absolute;
	top: 0;
	width: auto;
}

/*
	stretched thumbnail or div placeholder element (see below)
	style is added to avoid flickering in webkit/blink when layers overlap
*/
.pswp__img--placeholder {
	-webkit-backface-visibility: hidden;
}

/*
	div element that matches size of large image
	large image loads on top of it
*/
.pswp__img--placeholder--blank {
	background: #222;
}

.pswp--ie .pswp__img {
	height: auto !important;
	left: 0;
	top: 0;
	width: 100% !important;
}

/*
	Error message appears when image is not loaded
	(JS option errorMsg controls markup)
*/
.pswp__error-msg {
	color: #ccc;
	font-size: 14px;
	left: 0;
	line-height: 16px;
	margin-top: -8px;
	position: absolute;
	text-align: center;
	top: 50%;
	width: 100%;
}

.pswp__error-msg a {
	color: #ccc;
	text-decoration: underline;
}

/*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */
/*

	Contents:

	1. Buttons
	2. Share modal and links
	3. Index indicator ("1 of X" counter)
	4. Caption
	5. Loading indicator
	6. Additional styles (root element, top bar, idle state, hidden state, etc.)

*/
/*
	
	1. Buttons

 */
/* <button> css reset */
.pswp__button {
	-webkit-appearance: none;
	background: none;
	border: 0;
	box-shadow: none;
	cursor: pointer;
	display: block;
	float: right;
	height: 44px;
	margin: 0;
	opacity: 0.75;
	overflow: visible;
	padding: 0;
	position: relative;
	-webkit-transition: opacity 0.2s;
	transition: opacity 0.2s;
	width: 44px;
}

.pswp__button:focus,
.pswp__button:hover {
	opacity: 1;
}

.pswp__button:active {
	opacity: 0.9;
	outline: none;
}

.pswp__button::-moz-focus-inner {
	border: 0;
	padding: 0;
}

/* pswp__ui--over-close class it added when mouse is over element that should close gallery */
.pswp__ui--over-close .pswp__button--close {
	opacity: 1;
}

.pswp__button,
.pswp__button--arrow--left:before,
.pswp__button--arrow--right:before {
	background: url(../images/default-skin.png) 0 0 no-repeat;
	background-size: 264px 88px;
	height: 44px;
	width: 44px;
}

@media (-webkit-min-device-pixel-ratio: 1.1), (-webkit-min-device-pixel-ratio: 1.09375), (min-resolution: 105dpi), (min-resolution: 1.1dppx) {
	/* Serve SVG sprite if browser supports SVG and resolution is more than 105dpi */
	.pswp--svg .pswp__button,
	.pswp--svg .pswp__button--arrow--left:before,
	.pswp--svg .pswp__button--arrow--right:before {
		background-image: url(../img/photoswipe/default-skin.svg);
	}

	.pswp--svg .pswp__button--arrow--left,
	.pswp--svg .pswp__button--arrow--right {
		background: none;
	}
}

.pswp__button--close {
	background-position: 0 -44px;
}

.pswp__button--share {
	background-position: -44px -44px;
}

.pswp__button--fs {
	display: none;
}

.pswp--supports-fs .pswp__button--fs {
	display: block;
}

.pswp--fs .pswp__button--fs {
	background-position: -44px 0;
}

.pswp__button--zoom {
	background-position: -88px 0;
	display: none;
}

.pswp--zoom-allowed .pswp__button--zoom {
	display: block;
}

.pswp--zoomed-in .pswp__button--zoom {
	background-position: -132px 0;
}

/* no arrows on touch screens */
.pswp--touch .pswp__button--arrow--left,
.pswp--touch .pswp__button--arrow--right {
	visibility: hidden;
}

/*
	Arrow buttons hit area
	(icon is added to :before pseudo-element)
*/
.pswp__button--arrow--left,
.pswp__button--arrow--right {
	background: none;
	height: 100px;
	margin-top: -50px;
	position: absolute;
	top: 50%;
	width: 70px;
}

.pswp__button--arrow--left {
	left: 0;
}

.pswp__button--arrow--right {
	right: 0;
}

.pswp__button--arrow--left:before,
.pswp__button--arrow--right:before {
	background-color: rgba(0, 0, 0, 0.3);
	content: "";
	height: 30px;
	position: absolute;
	top: 35px;
	width: 32px;
}

.pswp__button--arrow--left:before {
	background-position: -138px -44px;
	left: 6px;
}

.pswp__button--arrow--right:before {
	background-position: -94px -44px;
	right: 6px;
}

/*

	2. Share modal/popup and links

 */
.pswp__counter,
.pswp__share-modal {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.pswp__share-modal {
	-webkit-backface-visibility: hidden;
	background: rgba(0, 0, 0, 0.5);
	display: block;
	height: 100%;
	left: 0;
	opacity: 0;
	padding: 10px;
	position: absolute;
	top: 0;
	-webkit-transition: opacity 0.25s ease-out;
	transition: opacity 0.25s ease-out;
	width: 100%;
	will-change: opacity;
	z-index: 1600;
}

.pswp__share-modal--hidden {
	display: none;
}

.pswp__share-tooltip {
	-webkit-backface-visibility: hidden;
	background: #fff;
	border-radius: 2px;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
	display: block;
	position: absolute;
	right: 44px;
	top: 56px;
	-ms-transform: translateY(6px);
	-webkit-transform: translateY(6px);
	transform: translateY(6px);
	-webkit-transition: -webkit-transform 0.25s;
	transition: -webkit-transform 0.25s;
	transition: transform 0.25s;
	transition: transform 0.25s, -webkit-transform 0.25s;
	width: auto;
	will-change: transform;
	z-index: 1620;
}

.pswp__share-tooltip a {
	color: #000;
	display: block;
	font-size: 14px;
	line-height: 18px;
	padding: 8px 12px;
	text-decoration: none;
}

.pswp__share-tooltip a:hover {
	color: #000;
	text-decoration: none;
}

.pswp__share-tooltip a:first-child {
	/* round corners on the first/last list item */
	border-radius: 2px 2px 0 0;
}

.pswp__share-tooltip a:last-child {
	border-radius: 0 0 2px 2px;
}

.pswp__share-modal--fade-in {
	opacity: 1;
}

.pswp__share-modal--fade-in .pswp__share-tooltip {
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
}

/* increase size of share links on touch devices */
.pswp--touch .pswp__share-tooltip a {
	padding: 16px 12px;
}

a.pswp__share--facebook:before {
	border: 6px solid rgba(0, 0, 0, 0);
	border-bottom-color: #fff;
	content: "";
	display: block;
	height: 0;
	-moz-pointer-events: none;
	pointer-events: none;
	-webkit-pointer-events: none;
	position: absolute;
	right: 15px;
	top: -12px;
	width: 0;
}

a.pswp__share--facebook:hover {
	background: #3e5c9a;
	color: #fff;
}

a.pswp__share--facebook:hover:before {
	border-bottom-color: #3e5c9a;
}

a.pswp__share--twitter:hover {
	background: #55acee;
	color: #fff;
}

a.pswp__share--pinterest:hover {
	background: #ccc;
	color: #ce272d;
}

a.pswp__share--download:hover {
	background: #ddd;
}

/*

	3. Index indicator ("1 of X" counter)

 */
.pswp__counter {
	color: #fff;
	font-size: 13px;
	height: 44px;
	left: 0;
	line-height: 44px;
	opacity: 0.75;
	padding: 0 10px;
	position: absolute;
	top: 0;
}

/*
	
	4. Caption

 */
.pswp__caption {
	bottom: 0;
	left: 0;
	min-height: 44px;
	position: absolute;
	width: 100%;
}

.pswp__caption small {
	color: #bbb;
	font-size: 11px;
}

.pswp__caption__center {
	color: #ccc;
	font-size: 13px;
	line-height: 20px;
	margin: 0 auto;
	max-width: 420px;
	padding: 10px;
	text-align: left;
}

.pswp__caption--empty {
	display: none;
}

/* Fake caption element, used to calculate height of next/prev image */
.pswp__caption--fake {
	visibility: hidden;
}

/*

	5. Loading indicator (preloader)

	You can play with it here - http://codepen.io/dimsemenov/pen/yyBWoR

 */
.pswp__preloader {
	direction: ltr;
	height: 44px;
	left: 50%;
	margin-left: -22px;
	opacity: 0;
	position: absolute;
	top: 0;
	-webkit-transition: opacity 0.25s ease-out;
	transition: opacity 0.25s ease-out;
	width: 44px;
	will-change: opacity;
}

.pswp__preloader__icn {
	height: 20px;
	margin: 12px;
	width: 20px;
}

.pswp__preloader--active {
	opacity: 1;
}

.pswp__preloader--active .pswp__preloader__icn {
	/* We use .gif in browsers that don't support CSS animation */
	background: url(../img/photoswipe/preloader.gif) 0 0 no-repeat;
}

.pswp--css_animation .pswp__preloader--active {
	opacity: 1;
}

.pswp--css_animation .pswp__preloader--active .pswp__preloader__icn {
	-webkit-animation: clockwise 500ms linear infinite;
	animation: clockwise 500ms linear infinite;
}

.pswp--css_animation .pswp__preloader--active .pswp__preloader__donut {
	-webkit-animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite;
	animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite;
}

.pswp--css_animation .pswp__preloader__icn {
	background: none;
	height: 14px;
	left: 15px;
	margin: 0;
	opacity: 0.75;
	position: absolute;
	top: 15px;
	width: 14px;
}

.pswp--css_animation .pswp__preloader__cut {
	height: 14px;
	overflow: hidden;
	/*
      The idea of animating inner circle is based on Polymer ("material") loading indicator
       by Keanu Lee https://blog.keanulee.com/2014/10/20/the-tale-of-three-spinners.html
    */
	position: relative;
	width: 7px;
}

.pswp--css_animation .pswp__preloader__donut {
	background: none;
	border: 2px solid #fff;
	border-bottom-color: transparent;
	border-left-color: transparent;
	border-radius: 50%;
	box-sizing: border-box;
	height: 14px;
	left: 0;
	margin: 0;
	position: absolute;
	top: 0;
	width: 14px;
}

@media screen and (max-width: 1024px) {
	.pswp__preloader {
		float: right;
		left: auto;
		margin: 0;
		position: relative;
		top: auto;
	}
}

@-webkit-keyframes clockwise {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes clockwise {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@-webkit-keyframes donut-rotate {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}

	50% {
		-webkit-transform: rotate(-140deg);
		transform: rotate(-140deg);
	}

	100% {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}
}

@keyframes donut-rotate {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}

	50% {
		-webkit-transform: rotate(-140deg);
		transform: rotate(-140deg);
	}

	100% {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}
}

/*
	
	6. Additional styles

 */
/* root element of UI */
.pswp__ui {
	-webkit-font-smoothing: auto;
	opacity: 1;
	visibility: visible;
	z-index: 1550;
}

/* top black bar with buttons and "1 of X" indicator */
.pswp__top-bar {
	height: 44px;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.pswp__caption,
.pswp__top-bar,
.pswp--has_mouse .pswp__button--arrow--left,
.pswp--has_mouse .pswp__button--arrow--right {
	-webkit-backface-visibility: hidden;
	-webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
	transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
	will-change: opacity;
}

/* pswp--has_mouse class is added only when two subsequent mousemove events occur */
.pswp--has_mouse .pswp__button--arrow--left,
.pswp--has_mouse .pswp__button--arrow--right {
	visibility: visible;
}

.pswp__top-bar,
.pswp__caption {
	background-color: rgba(0, 0, 0, 0.5);
}

/* pswp__ui--fit class is added when main image "fits" between top bar and bottom bar (caption) */
.pswp__ui--fit .pswp__top-bar,
.pswp__ui--fit .pswp__caption {
	background-color: rgba(0, 0, 0, 0.3);
}

/* pswp__ui--idle class is added when mouse isn't moving for several seconds (JS option timeToIdle) */
.pswp__ui--idle .pswp__top-bar {
	opacity: 0;
}

.pswp__ui--idle .pswp__button--arrow--left,
.pswp__ui--idle .pswp__button--arrow--right {
	opacity: 0;
}

/*
	pswp__ui--hidden class is added when controls are hidden
	e.g. when user taps to toggle visibility of controls
*/
.pswp__ui--hidden .pswp__top-bar,
.pswp__ui--hidden .pswp__caption,
.pswp__ui--hidden .pswp__button--arrow--left,
.pswp__ui--hidden .pswp__button--arrow--right {
	/* Force paint & create composition layer for controls. */
	opacity: 0.001;
}

/* pswp__ui--one-slide class is added when there is just one item in gallery */
.pswp__ui--one-slide .pswp__button--arrow--left,
.pswp__ui--one-slide .pswp__button--arrow--right,
.pswp__ui--one-slide .pswp__counter {
	display: none;
}

.pswp__element--disabled {
	display: none !important;
}

.pswp--minimal--dark .pswp__top-bar {
	background: none;
}

.pswp__zoom-wrap .embed-responsive {
	margin: auto;
	max-width: 100%;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

@media (min-width: 1200px) {
	.pswp__zoom-wrap .embed-responsive {
		max-width: 80%;
	}
}


/*product-detail*/
.prodetail-main{ width: 100%; background: #f8f8f8;}
.prodetail-content{ width: 100%; margin: 0 auto; border: 1px solid #e6e4e4; background: #fff;}
.prodetail-part1{ position: relative; overflow: hidden;}
.prodetail-big img{ display: block; width:700px;}
.prodetail-text{ position: absolute; right: 0px; background:rgba(0,0,0,0.33); padding-top: 68px; padding-bottom: 370px; top: 0px; width: 440px;}
.prodetail-text h1{color: #fff; font-size: 24px;text-align: center; line-height: 36px; margin-bottom: 35px;}
.prodetail-text h2{ color: #fff; font-size: 24px; line-height: 48px; text-align: center;}
.prodetail-text ul{ margin-top: 24px; margin-bottom: 30px; text-align:center; display:inline-block;list-style:none; width:100%;}
.prodetail-text ul li{  margin-right: 4px; width: 78px; cursor: pointer; display:inherit;}
.prodetail-text ul li img{ display: block; width: 100%;}
.prodetail-text a{ width: 207px; height: 45px; line-height: 45px; display: block; margin: 0 auto;font-size: 18px; text-align: center; color: #fff; background: #e60909; cursor: pointer;}
.prodetail-part2{ width: 1030px; margin: 0 auto;margin-top: 40px;margin-bottom: 90px;}
.prodetail-part2 img{ width: 100%;}
.prodetail-part3{ width: 1032px; margin: 0 auto;}
.prodetail-part3 h1{ font-size: 36px; color: #000;line-height: 36px; padding-bottom: 25px; border-bottom: 1px solid #e1e1e1; margin-bottom: 35px;}
.also-like-list{ width: 316px; margin-right: 18px; border: 8px solid #ececec; float: left; margin-bottom: 20px; transition: 0.5s;}
.also-like-list img{ width: 100%; display: block;}
.also-like-list1{ margin-right: 0;}
.also-like-list:hover{ border: 8px solid #e60909}
.firework-line{ overflow: hidden;}
.pageContde {color:#fff; margin-bottom:20px; margin-left:48px;
}

@charset "utf-8";
/* CSS Document */
@media screen and (max-width:1220px){
	
	.index-main2-nav1{ width: 100%;}
	.index-main2-nav1 img{display: none;}
	.index-main2-nav{ background: none;}
	.index-main2-nav ul{ width: 100%;}
	.index-main2-nav ul li.sport,.index-main2-nav ul li.play,.index-main2-nav ul li.park{ width: 33.333333333%;  border: none;background:none; padding: 0px;}
	.index-main2-nav ul li.play{ background: #03a9f5}
	.index-main2-nav ul li.sport{ background: #ff9801}
	.index-main2-nav ul li.park{ background: #01c853}
	.index-main3-content,.index-main4-content{ width: 94%;}
}
@media screen and (max-width:1200px){
    .prodetail-big img{ display: block; width:533px;}
	.header-main,.index-main2-content1,.footer-main,.copy-right-main{ width: 94%;}
	.main2-content-left{ width: 48%;}
	.main2-content-right{ width: 48%;}
	.foot1{ width: 15%; margin-bottom: 20px;}
	.foot2{ width: 25%; margin-bottom: 20px;}
	.foot3{ width: 34%; margin-right: 1%;}
	.foot4{ width: 25%;}
	.menu-top-main,.class-nav-main,.product-class-content{ width: 94%;}
	.menu-list11{ width: 92%; padding-right: 2%;}
	.menu-list .menu-list-left,.menu-list .menu-list-right,.menu-list1 .menu-list-left,.menu-list1 .menu-list-right{ width: 48%;}
	.class-nav-main ul li{ width: 14.2%; padding: 0}
	.other-road-main{ width: 94%; padding-left: 0px;}
	.product-class-list{ width: 29.3333%; margin-left: 2%; padding: 1%; padding-bottom: 20px; border: none;}
	.product-class-list:hover{ border: none;}
	.prodetail-content{ width: 100%;}
    .prodetail-text{ position: absolute; right: 0px; background:rgba(0,0,0,0.33); padding-top: 68px; padding-bottom: 370px; top: 0px; width: 380px;}
        .prodetail-text h1 {
 margin-bottom:15px;
        }
        .prodetail-text ul{ margin-top:14px; margin-bottom: 20px;}
	.prodetail-part2,.prodetail-part3{ width: 94%;}
	.also-like-list{width: 30.3333%; border:5px solid #ececec}
	.also-like-list:hover{ border:5px solid #e60909}
	.class-nav-main ul li a{ padding: 0}
	.contact-text{padding-left: 0}
	.contact-left{width: 100%; float: none;}
	.contact-right{width:100%; float: none;margin-top: 20px;}
	.menu-road{width: 94%;}
	.inner-zizhi{padding: 30px 2%}
	.inner-zizhi-right{width: 100%;}
}
@media screen and (max-width:1023px){
        .prodetail-big img{ display: block; width:100%;}
	.header{ display: none;}
	.mobile-header{ display: block;}
	.banner-btn{ bottom: 10px;}
	.index-main1-content,.newsletter-content,.news-title{ width: 94%;}
		.main2-content-left{ width: 94%; float: none; margin: 0 auto}
	.main2-content-right{ width: 80%; float: none; margin: 0 auto; margin-top: 20px;}
	.index-main2-content{ background-size: cover;}
	.main3-title{ width: 94%;}
	.why-list{ width: 46%; margin-bottom: 20px;}
	.index-main4,.index-main3{ padding: 30px 0px;}
	.newsletter-input input{ width: 95%; padding-left: 5%; float: none; margin-bottom: 20px;}
	.news-title div{ margin: 15px auto;}
	.news-title{ margin-bottom: 20px;}
	.newsletter{ background-size: cover;}
	.newsletter-input button{ margin-left: 0}
	.copy-right-main p{ width: 100%; margin-bottom: 15px; line-height: 25px;}
	.copy-right-main ul li{ line-height: 25px;}
	.copy-right-main ul{ width: 100%; margin-left: 0px;}
	.copy-right,.copy-right-main{ height: auto; padding: 10px 0px}
	.menu-list .menu-list-left, .menu-list .menu-list-right, .menu-list1 .menu-list-left, .menu-list1 .menu-list-right{ width: 94%; float: none; margin: 0 auto; margin-bottom: 15px;}
	.product-class-nav{ display: none;}
	.product-class-list{ width: 46%;}
	.product-class-text{ padding: 22px 2%;}
	.product-class-text a{ width: 90%;}
	.pro_left_right{ display: block;}
	.prodetail-text{ position: static; width: 100%; padding: 20px 2%; }
	.prodetail-text h1,.prodetail-text h2{ text-align: left;}
	.prodetail-text ul{ margin-left: 0px; float:left;}
        .prodetail-text ul li {
         float:left;}
    .pageContde {
     margin-left:0px;}
	.prodetail-text a{ margin-left: 0}
	.also-like-list{ width: 43%;}
	.foot4{ display: none;}
	.foot1{ width: 25%;}
	.foot3{ width: 50%; margin-right: 0}
	.gal_dbox{width: 24%;}
	.gal{padding: 0 2%; padding-top: 30px;}
	.inner-about img{float: none;margin-left: auto;margin-right: auto;width: 80%;}
}
@media screen and (max-width:900px){
	#banner{display: none}
	#banner2{display:block}
	.banner-btn{bottom: 15%;}
	.gal_t_3 div{width: 100%;display: block;text-align: center;padding: 10px 0;border-radius: 0; margin-bottom: 3px;}
}
@media screen and (max-width:700px){
	.about-nav li{display: block;width: 100%;padding: 10px 0;margin-bottom: 3px;}
	.about-nav li i{bottom: 0;z-index: -1}
	.about-nav li.company-profile,.about-nav li.company-certificate,.about-nav li.company-area{background: none;background-color: #ccc}
	.about-nav li.current555{
    background-color: #e60909;}
	.foot1,.foot2,.foot3,.foot4{width: 100%; float: none;}
	.foot4 p{ margin-bottom: 20px;}
	.foot1,.foot2{ display: none;}
	.foot11,.foot22{ display:block;}
	.foot11 h1,.foot22 h1{ cursor: pointer;}
}
@media screen and (max-width:500px){
	.gal_xiaobox{width: 96%;margin:0 auto;margin-top: 120px;}
	.gal_jiantour,.gal_jiantoul{width: 25px;height: 25px;}
	.gal_jiantour img,.gal_jiantoul img{width: 100%;}
	.index-main1{ padding:30px 0px;}
	.index-main2-nav ul li.sport,.index-main2-nav ul li.play,.index-main2-nav ul li.park{ width: 100%; float: none; }
	.index-main2-nav{ position: static; height: auto;}
	.index-main2-nav ul{ height: auto}
	.index-main2-content{ padding: 30px 0px;}
	.main2-content-right{ width: 94%;}
	.main2-content-left h1{ font-size: 24px; margin-bottom: 15px;}
	.index-project-list{ width: 94%; float: none; margin: 0px auto; margin-bottom: 15px;}
	.index-main4-content a{ margin-top: 20px;}
	.news-title h1{ font-size: 24px;}
	
	.menu-top-main h1{ font-size: 40px;}
	.menu-list h1,.menu-list1 h1{ font-size: 24px; margin-bottom: 15px;}
	.menu-list p,.menu-list1 p{ font-size: 18px; line-height: 25px; margin-bottom: 15px;}
	.product-class-list{ width: 98%; margin-left: auto; margin-right: auto; float: none;}
	.other-road{ line-height: 30px;}
	.also-like-list{ width: 95%; float: none; margin: 0 auto; margin-bottom: 20px;}
	.prodetail-part2{ margin-bottom: 40px;}
	.banner-btn a{ width: 145px; height: 32px; line-height: 32px; font-size: 16px;}
	.why-list{ width: 100%;}
	.gal_dbox{width: 96%;float: none;margin-left: auto;margin-right: auto;}
	.gal_dtxt{padding-top: 70px;display: none}
	.gal_dtxt_t{font-size: 20px; line-height: 24px;}
	.inner-about img{width: 100%;}
}