@charset "utf-8";

/* CSS Document */



@font-face {

	font-family: "RobotoCondensed";

	src: url("../font/RobotoCondensed.woff2") format("woff2"),  url("../font/RobotoCondensed.woff") format("woff"),  url("../font/RobotoCondensed.ttf") format("truetype"),  url("../font/RobotoCondensed.eot") format("embedded-opentype"),  url("../font/RobotoCondensed.svg") format("svg");

	font-weight: normal;

	font-style: normal;

}

* {

	padding: 0;

	margin: 0;

}

html, body {

	color: #434343;

	font-family: Arial, sans-serif, FontAwesome, 'Glyphicons Halflings' !important;

	font-weight: normal;

	font-style: normal;

	-webkit-font-smoothing: antialiased;

	-moz-osx-font-smoothing: grayscale;

	background-color: #ffffff;

	width: 100%;

	-webkit-text-size-adjust: 100%;

	font-size: 62.5%;

	background-color: #fff;

}

body { padding-right: 0px !important;}

*.modal-open {	overflow-y: scroll; padding-right: 0 !important;}

div {

	font-weight: normal;

	font-style: normal;

	transition: all 0.5s ease;

	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

	font-size: 1.2rem;

}

h1, h2, h3, h4, h5, h6 {

	font-weight: normal;

	transition: all 0.5s ease;

	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

}

table {

	border-collapse: collapse;

	border-spacing: 0

}

img {

	border: none;

	display: block;

	transition: all 0.5s ease;

	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

}

i{

	transition: all 0.5s ease;

	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

}

a, input {

	outline: none;

}

a {

	text-decoration: none;

	transition: all 0.5s ease;

	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

	

	border:none;

	-webkit-tap-highlight-color: rgba(0,0,0,0);

	-webkit-tap-highlight-color:transparent;

	outline:none；

}

a:hover {

	color: #cd0200;

	text-decoration: none;

}

a:visited, a:focus{outline: none;}

ul, li {

	list-style: none;

}

.clear {

	clear: both;

	font-size: 0;

}

.bold {

	font-weight: bold;

}

.fl {

	float: left;

}

.fr {

	float: right;

}

.headtop {

	width: 100%;

	height: 54px;

	background-color: #333333;

	color: #fff;

	line-height: 54px;

	overflow: hidden;

}

.leftinfo {

	float: left;

}

.leftinfo span {

	color:#fff;

	padding-right: 35px;

}

.leftinfo span i {

	font-size: 1.8rem;

	padding-right: 10px;

	color: #48c7ec;

}

.leftinfo a{color:#fff;}

.rightinfo {

	float: right;

}

.rightinfo a {

	padding-left: 24px;

	color: #fff;

}

.rightinfo a i {

	font-size: 1.6rem;

}

/*menu start*/

.headdown {

	padding: 0;

	margin: 0;

	height: 100px;

	background-color: #fff; /*box-shadow: 0px 3px 4px rgba(0, 0, 0,0.1);*/

	position: relative;

	z-index: 3

}

.headdown nav {

	display: inline-block;

	padding: 27px 0px;

	wdith: 100%;

	box-sizing: border-box;

	margin: 0 auto;

	position: relative;

}

.header-logo {

	margin-left: 0px;

	margin-right: 45px;

	position: relative;

	z-index: 3;

}

.header-logo a {

	display: block;

}

.nav-right {

	margin-right: 0px;

	position: absolute;

	top: 40px;

	right: 0px;

}

.nav-right a {

	padding: 10px 20px;

	font-size: 1.6rem;

}

.nav-right a:hover {

	color: #f60;

}

.user{right:40px; top: 42px;}

.user a i{ font-size: 1.8rem!important;}

.headdown nav ul, .headdown nav ul li, .headdown nav ul li a {

	margin: 0;

	padding: 0;

	border: 0;

	list-style: none;

	line-height: 1;

	display: block;

	position: relative;

	-webkit-box-sizing: border-box;

	-moz-box-sizing: border-box;

	box-sizing: border-box;

}

.headdown nav > ul:after {

	content: ".";

	display: block;

	clear: both;

	visibility: hidden;

	line-height: 0;

	height: 0;

}

.headdown nav > ul > li {

	float: left;

}

.headdown nav > ul > li > a {

	padding: 16px 20px;

	font-family: 'RobotoCondensed', Arial;

	font-size: 1.4rem;

/*	font-weight: bold;*/

	text-decoration: none;

	text-transform: uppercase;

	color: #141414;

	-webkit-transition: color .2s ease;

	-moz-transition: color .2s ease;

	-ms-transition: color .2s ease;

	-o-transition: color .2s ease;

	transition: color .2s ease;

}

.headdown nav > ul > li:hover > a, .headdown nav > ul > li.active > a {

	color: #ff6600;

}

.headdown nav > ul > li.has-sub > a::after {

	position: absolute;

	top: 19px;

	right: 9px;

	width: 6px;

	height: 6px;

	border-bottom: 2px solid #333;

	border-right: 2px solid #333;

	content: "";

	-webkit-transform: rotate(45deg);

	-moz-transform: rotate(45deg);

	-ms-transform: rotate(45deg);

	-o-transform: rotate(45deg);

	transform: rotate(45deg);

	-webkit-transition: border-color 0.2s ease;

	-moz-transition: border-color 0.2s ease;

	-ms-transition: border-color 0.2s ease;

	-o-transition: border-color 0.2s ease;

	transition: border-color 0.2s ease;

}

.headdown nav > ul > li.has-sub:hover > a::after {

	border-color: #ff6600;

}

.headdown nav ul ul {

	position: absolute;

	left: -9999px;

	box-shadow: 0px 0px 5px rgba(0,0,0,0.25);

}

.headdown nav li:hover > ul {

	left: auto;

}

.headdown nav ul ul ul {

	margin-left: 100%;

	top: 0;

	background-color: #fff;

}

.headdown nav ul ul li {

	height: 0;

	-webkit-transition: height .2s ease;

	-moz-transition: height .2s ease;

	-ms-transition: height .2s ease;

	-o-transition: height .2s ease;

	transition: height .2s ease;

}

.headdown nav ul li:hover > ul > li {

	height: 33px;

}

.headdown nav ul ul li > a::before {

	content: '';

	display: block;

	position: absolute;

	left: 0;

	bottom: 0;

	width: 100%;

	height: 1px;

	background-color: #cecece;

	font-size: 0;

}

.headdown nav ul ul li:last-child > a::before {

	height: 0;

}

.headdown nav ul ul li a {

	padding: 10px 20px;

	width: 350px;

	font-size: 13px;

	background: #f9f9f9;

	text-decoration: none;

	color: #141414;

	-webkit-transition: color .2s ease;

	-moz-transition: color .2s ease;

	-ms-transition: color .2s ease;

	-o-transition: color .2s ease;

	transition: color .2s ease;

}

.headdown nav ul ul li:hover > a, .headdown nav ul ul li a:hover {

	color: #ff6600;

}

.headdown nav ul ul li.has-sub > a::after {

	position: absolute;

	top: 13px;

	right: 10px;

	width: 4px;

	height: 4px;

	border-bottom: 1px solid #434343;

	border-right: 1px solid #434343;

	content: "";

	-webkit-transform: rotate(-45deg);

	-moz-transform: rotate(-45deg);

	-ms-transform: rotate(-45deg);

	-o-transform: rotate(-45deg);

	transform: rotate(-45deg);

	-webkit-transition: border-color 0.2s ease;

	-moz-transition: border-color 0.2s ease;

	-ms-transition: border-color 0.2s ease;

	-o-transition: border-color 0.2s ease;

	transition: border-color 0.2s ease;

}

.headdown nav ul ul li.has-sub:hover > a::after {

	border-color: #009ae1;

}

.headdown nav ul ul ul li {

	height: 0;

	-webkit-transition: height .2s ease;

	-moz-transition: height .2s ease;

	-ms-transition: height .2s ease;

	-o-transition: height .2s ease;

	transition: height .2s ease;

}

.headdown nav ul > li > ul > li:hover ul > li {

	height: 46px;

}

.headdown nav ul ul ul li > a::before {

	content: '';

	display: block;

	position: absolute;

	left: 0;

	bottom: 0;

	width: 100%;

	height: 1px;

	background-color: #cecece;

	font-size: 0;

}

.headdown nav ul ul ul li:last-child > a::before {

	height: 0;

}

.headdown nav ul ul ul li a {

	width: 290px;

	background: #f1f1f1;

	background: #ffffff;

}

a.meanmenu-reveal {

	display: none;

}

.mean-container .mean-bar {

	width: 100%;

	position: relative;

	background: #fff;

	padding: 10px 0;

	min-height: 42px;

	z-index: 999999; /*border-bottom: 1px solid #ccc;*/

}

.mean-container a.meanmenu-reveal {

	width: 28px;

	height: 22px;

	padding: 18px 13px 11px 13px;

	position: absolute;

	top: 0;

	right: 0;

	cursor: pointer;

	color: #222;

	text-decoration: none;

	font-size: 16px;

	text-indent: -9999em;

	line-height: 22px;

	font-size: 1px;

	display: block;

	font-family: Arial, Helvetica, sans-serif;

	font-weight: 700;

}

.mean-container a.meanmenu-reveal span {

	display: block;

	background: #222;

	height: 4px;

	margin-top: 4px;

}

.mean-container .mean-nav {

	float: left;

	width: 100%;

	background: #0c1923;

	margin-top: 44px;

}

.mean-container .mean-nav ul {

	padding: 0;

	margin: 0;

	width: 100%;

	list-style-type: none;

}

.mean-container .mean-nav ul li {

	position: relative;

	float: left;

	width: 100%;

}

.mean-container .mean-nav ul li a {

	display: block;

	float: left;

	width: 90%;

	padding: 1em 5%;

	margin: 0;

	text-align: left;

	color: #fff;

	border-top: 1px solid #383838;

	border-top: 1px solid rgba(255,255,255,0.5);

	text-decoration: none;

	text-transform: uppercase;

}

.mean-container .mean-nav ul li li a {

	width: 80%;

	padding: 1em 10%;

	border-top: 1px solid #f1f1f1;

	border-top: 1px solid rgba(255,255,255,0.25);

	opacity: 0.75;

	filter: alpha(opacity=75);

	text-shadow: none !important;

	visibility: visible;

}

.mean-container .mean-nav ul li.mean-last a {

	border-bottom: none;

	margin-bottom: 0;

}

.mean-container .mean-nav ul li li li a {

	width: 70%;

	padding: 1em 15%;

}

.mean-container .mean-nav ul li li li li a {

	width: 60%;

	padding: 1em 20%;

}

.mean-container .mean-nav ul li li li li li a {

	width: 50%;

	padding: 1em 25%;

}

.mean-container .mean-nav ul li a:hover {

	background: #252525;

	background: rgba(255,255,255,0.1);

}

.mean-container .mean-nav ul li a.mean-expand {

	margin-top: 1px;

	width: 26px;

	height: 32px;

	padding: 4px 12px !important;

	line-height: 32px;

	text-align: center;

	position: absolute;

	right: 0;

	top: 0;

	z-index: 2;

	font-weight: 700;

	background: rgba(255,255,255,0.1);

	border: none !important;

	border-left: 1px solid rgba(255,255,255,0.4) !important;

	border-bottom: 1px solid rgba(255,255,255,0.2) !important;

	font-family: Arial;

}

.mean-container .mean-nav ul li a.mean-expand:hover {

	background: rgba(0,0,0,0.9);

}

.mean-container .mean-push {

	float: left;

	width: 100%;

	padding: 0;

	margin: 0;

	clear: both;

}

.mean-nav .wrapper {

	width: 100%;

	padding: 0;

	margin: 0;

}

.mean-container .mean-bar, .mean-container .mean-bar * {

	-webkit-box-sizing: content-box;

	-moz-box-sizing: content-box;

	box-sizing: content-box;

}

.mean-container .mean-bar::after {

	content: '';

	display: block;

	clear: both;

}

.mean-remove {

	display: none !important;

}

.headdown nav form {

	height: 50px;

	width: 280px;

	padding: 5px;

	border-radius: 4px;

	margin: 0;

	left: auto;

	right: 0;

	border-color: #48c7ec;

	top: 67px;

}

.headdown nav form input {

	font-family: 'Raleway', sans-serif;

	font-weight: normal;

	width: 100%;

	height: 100%;

	background: transparent;

	color: #9e9e9e;

	border: 1px solid #f7f7f7;

	padding: 0 47px 0 10px;

	font-size: 15px;

}

.headdown nav form button {

	display: block;

	width: 40px;

	line-height: 40px;

	text-align: center;

	position: absolute;

	top: 5px;

	right: 5px;

	color: #48c7ec;

	border: none;

	outline: none;

	box-shadow: none;

	padding: 0;

	background: transparent;

}

/*menu end*/





/*banner start*/

.bx-wrapper {

	position: relative;

	margin: 0 auto 0px;

	padding: 0;

	border:1px solid #ccc;

 *zoom: 1;

}

.flash .bx-wrapper{border:none;}

.bx-wrapper img {

	max-width: 100%;

	display: block;

}

.bx-wrapper .bx-viewport {

	-webkit-transform: translatez(0);

	-moz-transform: translatez(0);

	-ms-transform: translatez(0);

	-o-transform: translatez(0);

	transform: translatez(0);

}

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {

	position: absolute;

	bottom: 0px;

	width: 100%;

}

.bx-wrapper .bx-loading {

	min-height: 50px;

	background: url(../images/bx_loader.gif) center center no-repeat #fff;

	height: 100%;

	width: 100%;

	position: absolute;

	top: 0;

	left: 0;

	z-index: 2000;

}

.bx-wrapper .bx-pager {

	text-align: center;

	font-size: .85em;

	font-family: Arial;

	font-weight: bold;

	color: #666;

	padding-top: 20px;

}

.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item {

	display: inline-block;

 *zoom: 1;

 *display: inline;

}

.bx-wrapper .bx-pager.bx-default-pager a {

	/*background: #303c4b;*/

	border: 1px solid #fff;

	text-indent: -9999px;

	display: block;

	width: 14px;

	height: 14px;

	margin: 0 2px;

	outline: 0;

	-moz-border-radius: 10px;

	-webkit-border-radius: 10px;

	border-radius: 10px;

}

.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {

	background: #fff;

	border: 1px solid #fff;

}

.bx-wrapper .bx-prev {

	left: 10px;

	background: url(../images/controls.png) no-repeat 0 -32px;

}

.bx-wrapper .bx-next {

	right: 10px;

	background: url(../images/controls.png) no-repeat -43px -32px;

}

.bx-wrapper .bx-prev:hover {

	background-position: 0 0;

}

.bx-wrapper .bx-next:hover {

	background-position: -43px 0;

}

.bx-wrapper .bx-controls-direction a {

	position: absolute;

	top: 50%;

	margin-top: -16px;

	outline: 0;

	width: 32px;

	height: 32px;

	text-indent: -9999px;

	z-index: 999;

}

.bx-wrapper .bx-controls-direction a.disabled {

	display: none;

}

.bx-wrapper .bx-controls-auto {

	text-align: center;

}

.bx-wrapper .bx-controls-auto .bx-start {

	display: block;

	text-indent: -9999px;

	width: 10px;

	height: 11px;

	outline: 0;

	background: url(../images/controls.png) -86px -11px no-repeat;

	margin: 0 3px;

}

.bx-wrapper .bx-controls-auto .bx-start:hover, .bx-wrapper .bx-controls-auto .bx-start.active {

	background-position: -86px 0;

}

.bx-wrapper .bx-controls-auto .bx-stop {

	display: block;

	text-indent: -9999px;

	width: 9px;

	height: 11px;

	outline: 0;

	background: url(../images/controls.png) -86px -44px no-repeat;

	margin: 0 3px;

}

.bx-wrapper .bx-controls-auto .bx-stop:hover, .bx-wrapper .bx-controls-auto .bx-stop.active {

	background-position: -86px -33px;

}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {

	text-align: left;

	width: 80%;

}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {

	right: 0;

	width: 35px;

}

.bx-wrapper .bx-caption {

	position: absolute;

	bottom: 0;

	left: 0;

	background: #666\9;

	background: rgba(80, 80, 80, 0.75);

	width: 100%;

}

.bx-wrapper .bx-caption span {

	color: #fff;

	font-family: Arial;

	display: block;

	font-size: .85em;

	padding: 10px;

}

/*banner end*/





/*index product list*/

.hottitle {

	width: 100%;

}

.hottitle h3 {

	font-size: 3.4rem;

	text-transform: uppercase;

	color: #000;

	padding-bottom: 10px;

	border-bottom: 1px solid #ccc;

	line-height: 3.4rem;

	position: relative;

}

.hottitle h3 span {

	display: inline-block;

	position: absolute;

	top: 4px;

	left: 300px;

}

.hottitle h3 span a {

	display: inline-block;

	width: 92px;

	height: 32px;

	color: #fff;

	background-color: #bc1920;

	text-align: center;

	font-size: 16px;

	border-radius: 6px;

	vertical-align: top;

	line-height: 32px;

}

.hottitle h3 span a:hover {

	background-color: #222222;

	color: #f1f1f1;

}

.hotproducts {

	width: 100%;

	background-color: #fff;

	padding: 80px 0px 30px;

}

.prolist {

	position: relative;

	padding: 30px;

	margin-bottom: 30px;

	background-color: transparent;

	box-sizing: border-box;

}

.prolistwrap {

	max-width: 292px;

	margin: 0 auto; /*background-color: red;*/

}

.prolistpic {

	position: relative;

	width: 100%;

	height: 0;

	padding-top: 127.56%;

	font-size: 0;

	background-color: #fff;

	overflow: hidden;

}

.prolistpic img {

	position: absolute;

	left: 0;

	top: 0;

	right: 0;

	bottom: 0;

	max-width: 100%;

	max-height: 100%;

	margin: auto;

}

/*.prolistpic:hover img{transform: scale(1.15);}*/

.prolisttxt {

	margin-top: 10px;

	height: 63px;

	overflow: hidden;

}

.prolistname {

	text-align: center;

}

.prolistname p {

	text-align: center;

	line-height: 18px;

	max-height: 36px;

	overflow: hidden;

	margin-bottom: 5px;

	font-size: 13px;

	text-transform:lowercase;

	color: #777777;

	text-overflow: ellipsis;

	display: -webkit-box;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;

}

.prolistname a {

	text-align: center;

	font-size: 13px;

	font-weight: bold;

	color: #000000;

}

.prolist:hover {

	box-shadow: 0px 0px 15px rgba(0,0,0,0.45);

	background-color: #fff;

}

.prolist:hover .prolistname a {

	color: #f60;

}

/*index product list*/





/*why*/

.why {

	width: 100%;

	padding: 50px 0px 90px;

	background-color: #f8f8f8;

}

.whytitle {

	width: 100%;

	margin-bottom: 22px;

}

.whytitle h3 {

	font-size: 3.4rem;

	text-transform: uppercase;

	color: #000;

	text-align: center;

	line-height: 3.4rem;

}

.whytitle h3::after {

	content: '';

	display: block;

	width: 50px;

	height: 3px;

	background-color: #bc1920;

	margin: 0 auto;

	margin-top: 9px;

}

.captionbox {

	margin: 0 auto;

	text-align: center;

}

.captionbox a {

	text-align: center;

	margin: 0 auto;

	display: block;

	padding: 20px 0;

	text-transform: uppercase;

	border: 1px solid transparent;

	box-sizing: border-box;

	text-decoration: underline;

}

.captionbox a img {

	margin: 0 auto;

	max-width: 100%;

}

.captionbox a span {

	text-align: center;

	line-height: 21px;

	height: 42px;

	overflow: hidden;

	margin-top: 25px;

	margin-bottom: 5px;

	font-size: 13px;

	font-weight: bold;

	color: #0c85b6;

	text-overflow: ellipsis;

	display: -webkit-box;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;

	text-decoration: underline;

}

.captionbox a:hover {

	background-color: #fff;

	box-shadow: 0px 0px 15px rgba(0,0,0,0.45);

	border-radius: 12px;

	border: 1px solid #f60;

}

.captionbox a:hover span {

	color: #f60;

	text-transform: capitalize;

	text-decoration: underline;

}

/*why*/



/*iabout*/

.indexabout {

	width: 100%;

	height: 630px;

}

.indexabout::after {

	content: '';

	display: block;

	clear: both;

}

.indexabout_l {

	width: 50%;

	float: left;

	height: 100%;

}

.iabout_l_content {

	width: 100%;

	height: 100%;

	background: url(../images/aboutpic-1.jpg) top right no-repeat #0c85b6;

	background-size: auto 100%;

}

.indexabout_r {

	width: 50%;

	float: left;

	height: 100%;

}

.iabout_r_content {

	width: 100%;

	height: 100%;

	box-sizing: border-box;

	background: url(../images/aboutpic-2.jpg) top right no-repeat #0c85b6;

	background-size: auto 100%;

	padding: 70px;

}

.iabout_r_wrap {

	width: 510px;

}

.iabout_r_wrap h4 {

	font-size: 30px;

	font-weight: bold;

	color: #fff;

	text-transform: uppercase;

	margin-bottom: 20px;

}

.iabout_r_wrap p {

	color: #fff;

	line-height: 1.8;

	font-size: 14px;

}

.iaboutbtn {

	display: block;

	width: 172px;

	height: 42px;

	background-color: #fff;

	font-size: 16px;

	color: #333;

	text-align: center;

	margin-top: 65px;

	line-height: 42px;

}

.iaboutbtn:hover {

	background-color: #f60;

	color: #fff;

}

/*iabout*/



/*inews*/

.indexnews {

	width: 100%;

	padding: 50px 0 70px;

	background-color: #fff;

}

.inewstitle {

	width: 100%;

	margin-bottom: 50px;

}

.inewstitle h3 {

	font-size: 3.4rem;

	text-transform: uppercase;

	color: #000;

	text-align: center;

	line-height: 3.4rem;

	background: url(../images/dot.jpg) left center repeat-x;

}

.inewstitle h3::before {

	content: 'S.W.N. DISPLAY';

	display: block;

	font-size: 18px;

	color: #777;

	text-align: center;

	position: relative;

	z-index: 2;

	margin-bottom: -10px;

}

.inewstitle h3 span {

	background-color: #fff;

	padding-left: 20px;

	padding-right: 20px;

	padding-top: 20px;

}

.inewswrap {

	max-width: 435px;

	margin: 0 auto;

}

.inewspic {

	position: relative;

	width: 100%;

	height: 0;

	padding-top: 56%;

	font-size: 0;

	background-color: #fff;

	overflow: hidden;

}

.inewspic img {

	position: absolute;

	left: 0;

	top: 0;

	right: 0;

	bottom: 0;

	max-width: 100%;

	max-height: 100%;

	margin: auto;

}

.inewspic img:hover {

	transform: scale(1.14);

	-ms-transform: scale(1.14);

	-moz-transform: scale(1.14);

	-webkit-transform: scale(1.14);

	-o-transform: scale(1.14);

}

.inewstext {

}

.inewstext a {

	text-align: left;

	line-height: 21px;

	height: 42px;

	overflow: hidden;

	margin-top: 10px;

	margin-bottom: 5px;

	font-size: 14px;

	font-weight: bold;

	color: #000;

	text-overflow: ellipsis;

	display: -webkit-box;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;

}

.inewstext a:hover {

	color: #f60;

}

.inewstext p {

	text-align: left;

	line-height: 21px;

	height: 42px;

	overflow: hidden;

	margin-top: 10px;

	margin-bottom: 5px;

	font-size: 13px;

	color: #666666;

	text-overflow: ellipsis;

	display: -webkit-box;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;

}

/*inews*/



/*footer*/

.footer {

}

.footerinfo {

	width: 100%;

	padding: 30px 0;

	background-color: #4f5051;

}

.footerinfo h3 {

	font-family: 'RobotoCondensed', Arial;

	color: #f1f1f1;

	text-transform: uppercase;

	font-size: 2.0rem;

	margin-bottom: 30px;

}

.footerinfo h3::after {

	content: '';

	display: block;

	width: 30px;

	height: 3px;

	background-color: #0c85b6;

	margin: 15px 0;

}

.footerinfo ul li {

	border-bottom: 1px solid #5d5e5f;

	line-height: 35px;

}

.footerinfo ul li:last-child {

	border-bottom: none;

}

.footerinfo ul li a {

	font-family: 'RobotoCondensed', Arial;

	color: #f1f1f1;

	font-size: 1.3rem;

	line-height: 1.4;

}

.footerinfo ul li a:hover {

	color: #f60;

}

.footerinfo a{ color:#f1f1f1; }

.footerinfo p {

	font-family: 'RobotoCondensed', Arial;

	color: #f1f1f1;

	font-size: 1.45rem;

	margin-bottom: 20px;

	line-height: 1.4;

}

.footercopyright {

	width: 100%;

	padding: 30px 0;

	background-color: #1b1b1b;

}

.footercopyright p {

	text-align: center;

	font-size: 13px;

	color: #9fa0a0;

}

.footercopyright a {

	font-size: 13px;

	color: #9fa0a0;

}



/*leftside*/

.leftsidelayer{background-color: #fff; /*box-shadow: 3px 2px 4px rgba(0, 0, 0,0.2);*/}

.fixedtotop{ position: fixed; top:110px;}

.left_nav{ clear: both; padding-top:5px;}

.title_h2{float: left;font-size: 18px;color: #5E5E5E;margin: 0px;}

.title_span{float: left; padding-top:4px;text-indent:4px;font-size: 12px;color: rgb(125, 125, 125);}

.left_h2{background:url(../images/title_line.jpg) left bottom no-repeat;  display: block; margin-top: 25px; padding: 0px 0px 10px 0px;font-size: 18px;color: #5E5E5E;text-transform:uppercase; }

.left_h2_a{text-transform:none;}

.left_nav_ul{list-style:none; padding:0px; margin:10px 0px 0px 0px; padding-bottom: 10px;}

.left_nav_ul > li{position:relative; border-bottom: 1px solid #f2f2f2; background: url(../images/left_li.gif) 6px 15px no-repeat;padding:8px 20px 8px 18px; }

.left_nav_ul > li > a{text-decoration:none; color:#5e5e5e; font-size: 12px; font-weight: bold;}

.left_nav_ul > li > a:hover,.left_nav_ul li a.left_active{color:#ff6600;}

/*sub class*/

ul.left_snav_ul{list-style:none;padding:0px;display: none; padding-top: 8px;}

ul.left_snav_ul > li{ margin:0px;padding:5px 15px 5px 10px; background: url(../images/left_sli.gif) 0px 13px no-repeat;}

ul.left_snav_ul > li > a{border:0;color:#969494;padding: 5px 0px 5px 0px; font-size: 12px; font-weight: bold;}

ul.left_snav_ul > li > a:hover{ text-decoration: none;color:#ff6600;}



.index_contact{margin:10px 0px 15px 0px;background:url(../images/title_line.jpg) left 25px no-repeat;}

.index_contact p{clear: both;color:#7F7F80; padding-bottom: 5px; font-size: 12px;}

.index_contact a{color:#7f7f80;}

.ctdiv{padding-top: 30px;}

.ctdiv dl dt{width:64px; text-align: left; line-height: 1.8;}

.ctdiv dl dd{margin-left: 68px; color: #7F7F80; line-height: 1.8;}

.ctdiv dl dd a{color: #7F7F80;}

.page_bg{height: 230px; margin-top: 0px;}

.positiondiv{width: 100%; height: 50px; background-color: #f5f5f5; line-height: 50px;}

.positiondiv span{font-size: 13px; color:#222222;}

.positiondiv a{font-size: 13px; text-decoration: none; padding: 0px 20px; color: #0c85b6;}

.positiondiv a:hover{color:#f60;}

.list_box{clear: both; padding:5px 0px 0px 0px;}

.path_title{border: 1px solid #f2f2f2;padding: 8px 19px;overflow: hidden;}



/*right*/

.contents{clear: both; padding:4px 20px 20px 20px; line-height:28px; color:#898989; overflow: auto;}

.contents h1, .contents h2, .contents h3, .contents h4, .contents h5, .contents h6{text-transform: capitalize; color:#000000;}

.contents img{max-width: 100%;}

.contents_title{ margin: 0px; padding: 10px 0px; text-align: center; color: #000; font-size:22px; font-weight:bold; line-height: 34px;}



/*page style*/

.page{clear:both; margin:20px 0px 0px 0px; text-align: center;}

.page a {display: inline-block; font-family: Arial; font-size: 13px; border: #dbdbdb 1px solid; padding:4px 9px; margin: 2px; margin-bottom: 5px; color: #31363c; text-decoration: none}

.page a:hover,.page a:focus{font-family: Arial;font-size: 13px;border: #000 1px solid; padding:4px 9px;color: #fff; background-color: #31363c;}

.page .current, .page .thisclass, .page .pageinfo, .page span{font-family: Arial;border: #000 1px solid; font-size: 13px; padding:5px 9px; color: #fff;margin: 2px;  background-color: #31363c}



/*why us*/

.whylist{ margin: 0 auto; text-align: center;}

.whylist a {

	text-align: center;

	margin: 0 auto;

	display: block;

	padding: 20px 0;

	text-transform: uppercase;

	border: 1px solid transparent;

	box-sizing: border-box;

	text-decoration: underline;

}

.whylist a img{margin: 0 auto;	max-width: 100%;}

.whylist a span{

	text-align: center;

	line-height: 21px;

	height: 42px;

	overflow: hidden;

	margin-top: 25px;

	margin-bottom: 5px;

	font-size: 13px;

	font-weight: bold;

	color: #0c85b6;

	text-overflow: ellipsis;

	display: -webkit-box;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;

	text-decoration: underline;

}

.whylist a:hover {

	background-color: #fff;

	box-shadow: 0px 0px 15px rgba(0,0,0,0.45);

	border-radius: 12px;

	border: 1px solid #f60;

}

.whylist a:hover span {

	color: #f60;

	text-transform: capitalize;

	text-decoration: underline;

}



.alert-info{font-size: 13px;}

.tbgcolor thead tr{ background-color: #0c85b6;}

.tbgcolor thead tr th{color:#fff;}

.listContact{margin: 30px 0;}

.listContact li{font-size: 1.4rem; border-bottom:1px solid #dfdfdf; color:#000000; line-height: 2.4;}

.listContact li span{color:#ccc; display: inline-block; width:90px; background-color: #555; padding-left: 10px; margin-right: 8px;}

.listContact li a{color:#000000;}



.list_news {

    clear: both;

    list-style: none;

    margin: 0px;

    padding: 0px 0px 20px 0px;

}

.list_news li {

    color: #898989;

    background: url(../images/li.png) no-repeat left 14px;

    line-height: 22px;

    padding: 8px 0px;

    padding-left: 13px;

    border-bottom: 1px dashed #e3e2e2;

}

.list_news li a { color: #222222;}

.news_time { float: right; padding: 2px 12px; background-color: #ccc; color:#fff;}

.point {

    clear: both;

    margin: 20px 0px 40px 0px;

    border: 1px solid #d6d6d6;

    padding-bottom: 60px;

    line-height: 22px;

}

.point span.to_prev {

    text-align: center;

    padding-top: 10px;

}

.point span.to_next {

    text-align: center;

    padding-top: 10px;

}

.point span.to_next a {

    color: #0c85b6;

    font-weight: bold;

}

p.subtitle {

    font-size: 12px;

    color: #777;

    text-align: center;

    margin-bottom: 35px;

    margin-top: -20px;

    padding-bottom: 20px;

}

p.subtitle span{padding-left: 15px; padding-right: 15px;}







.mapdiv {

    width: 100%;

    margin-top: 25px;

}

.mapdiv img {

    max-width: 100%;

}

.xxpic img{max-width:100%;}



/*product detail*/

.procon{padding: 0 15px;}

#pic-page {text-align: center; margin-top:10px;}

#pic-page a {margin: 0 2px;}

#pic-page a img {width:40px;padding: 2px;border: solid #ccc 1px; margin-bottom:5px; display: inline-block;}

#pic-page a:hover img,#pic-page a.active img {border: solid #5280DD 1px;}

.showpic_box,.proinfo_box{margin: 30px 0px 20px 0px;}

.product_h1{ margin:0px; line-height:24px; font-size:28px; font-weight: bold; color: #222222; padding-top: 30px; padding-bottom:10px;border-bottom: 1px dotted #cccccc;}

.product_info{list-style:none; padding:0px; margin-top:10px;}

.product_info li{ line-height:24px; padding-bottom:12px;}

.product_info p, .product_info div{font-size: 14px; color:#898989;}

.product_info div{border-bottom: 1px dotted #ccc;}

.product_info div strong{padding-right: 15px;}

.product_con{ clear: both; border-top: 1px dotted #ccc; margin:10px 0px 20px 0px;padding:20px 0px 0px 20px; line-height:26px; color:#898989;overflow: auto;}



.product_con h1{color: #004A87; font-weight: bold;}

.product_con h2{color: #004A87; font-weight: bold;}

.product_con h3{color: #004A87; font-weight: bold;}

.product_con h4{color: #004A87; font-weight: bold;}

.product_con h5{color: #004A87; font-weight: bold;}

.product_con p{font-size: 12px; color:#898989;}

.product_con div{color:#898989; font-size: 12px;}

.product_con span{color:#898989;}

.product_con img{display: block; margin: 10px; max-width: 100%;}





.related_h1{padding: 30px 0px 12px 0px; color: #303c4b; margin:0px; display: block;  font-weight:300; font-size:24px; border-bottom:5px solid #f4f5f6;}



.download_btn{text-align: right; margin: 10px 10px 20px 0px;}

.page-btn{background-color: #004B87; border: none;}

.page-btn:hover,.page-btn:focus{background-color:#da251d; }

.grey-btn{border: none; background-color: #E8E8E8;}

.grey-btn:hover,.grey-btn:focus{background-color: #ccc;}

.related_news{ padding-top: 0px; clear: both;}

.callmespan{padding:10px 15px; color:#fff; background-color: #f60; font-size: 15px; border-radius: 4px;}

.a2a_default_style{display: inline-block;}



/*why us*/

.whyinfolist{ position: relative; padding: 0; margin: 0 auto; transition: all 0.3s ease; background-color: transparent; overflow: hidden;}

.whyinfolistwrap{ max-width: 456px; padding: 20px; margin: 16px; background-color: #f5f5f5; border-radius: 10px; border: 1px solid transparent;}

.whyinfolistwrap:hover{box-shadow: 0px 0px 15px rgba(0,0,0,0.45); background-color: #fff; border: 1px solid #f60;}

.whyinfolistpic{ position: relative; width: 100%; height: 0; padding-top: 75%; font-size: 0; background-color: #f5f5f5; overflow: hidden;}

.whyinfolistpic img{position: absolute; left: 0; top:0; right: 0; bottom:0; max-width:100%; max-height:100%; margin: auto;}

.whyinfolistpic:hover img{transform: rotate(-1.5deg) scale(1.32);}

.whyinfolisttxt{margin-top: 10px;}

.whyinfolistname{ line-height: 21px; height: 42px; overflow: hidden; margin-bottom: 5px; font-size: 14px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}





@media (min-width:320px) and (max-width:568px)

{

	.nav-right {margin-right: 15px!important;}

}



@media screen and (max-width:767px) {

h6 {

	font-size: 12px!important;

	font-weight: bold;

}

h5 {

	font-size: 12px!important;

	font-weight: bold;

}

h4 {

	font-size: 13px!important;

	font-weight: bold;

}

h3 {

	font-size: 14px!important;

	font-weight: bold;

}

h2 {

	font-size: 15px!important;

	font-weight: bold;

}

h1 {

	font-size: 16px!important;

	font-weight: bold;

}

p {

	font-size: 12px!important;

	color: #999999;

}

span {

	font-size: 12px!important;

}

.leftinfo span {

	padding-right: 15px;

}

/*menu*/

.header-logo {

	position: absolute;

	top: 6px;

	left: 0;

	margin-left: 15px;

	margin-top: 10px;

}

.header-logo img {

	width: 182px;

}

.nav-right {

	margin-right: 30px;

	position: absolute;

	top: 22px;

	right: 20px;

}

.headdown {

	display: none;

}

.nav-right a {

	padding: 6px 20px;

}

.user{right: 58px; top: 24px;}

.headdown {

	padding: 0;

	margin: 0;

	height: 64px;

	position: fixed !important;

	display: none;

}

.mean-bar nav form {

	height: 52px;

	width: 250px;

	padding: 5px;

	border-radius: 4px;

	margin: 0;

	left: auto;

	right: 0;

	border-color: #48c7ec;

	top: 42px;

	right: -37px;

	box-sizing: border-box!important;

	-webkit-box-sizing: border-box!important;

	-moz-box-sizing: border-box!important;

}

.mean-bar nav form input {

	font-family: 'Raleway', sans-serif;

	font-weight: normal;

	width: 100%;

	height: 100%;

	background: transparent;

	color: #9e9e9e;

	border: 1px solid #f7f7f7;

	padding: 0 47px 0 10px;

	font-size: 15px;

	box-sizing: border-box!important;

	-webkit-box-sizing: border-box!important;

	-moz-box-sizing: border-box!important;

}

.mean-bar nav form button {

	display: block;

	width: 40px;

	line-height: 40px;

	text-align: center;

	position: absolute;

	top: 5px;

	right: 5px;

	color: #48c7ec;

	border: none;

	outline: none;

	box-shadow: none;

	padding: 0;

	background: transparent;

}

.hottitle h3 span {

	left: 200px;

	top: 9px;

}

.hottitle h3 span a {

	display: inline-block;

	width: 92px;

	height: 28px;

	color: #fff;

	background-color: #bc1920;

	text-align: center;

	font-size: 12px;

	border-radius: 6px;

	vertical-align: top;

	line-height: 29px;

}

.hotproducts {

	padding: 10px 0px 10px;

}

.prolist {

	padding: 20px;

	margin-bottom: 10px;

}

.prolistname p {

	text-transform: capitalize;

}

.why {

	padding: 10px 0px 10px;

}

.captionbox a {

	padding: 10px 0;

}

.captionbox a img {

	margin: 0 auto;

	max-width: 75%;

}

.captionbox a span {

	line-height: 16px;

	height: 32px;

	margin-top: 10px;

	margin-bottom: 5px;

	text-transform: lowercase;

}

.indexabout {

	width: 100%;

	height: 470px;

}

.indexabout_l {

	width: 100%;

	height: 235px;

}

.iabout_l_content {

	width: 100%;

	height: 100%;

	background: url(../images/aboutpic-1.jpg) top right no-repeat #0c85b6;

	background-size: cover;

}

.indexabout_r {

	width: 100%;

	height: 398px;

}

.iabout_r_content {

	background: #0c85b6;

	background-size: auto 100%;

	padding: 15px;

}

.iabout_r_wrap {

	width: 100%!important;

}

.iaboutbtn {

	width: 142px;

	font-size: 12px;

	margin-top: 24px!important;

}

	

.page_bg {

    height: 60px;

    margin-top: 0px;

    background-size: cover!important;

}



.positiondiv {

    width: 100%;

    padding: 10px 0;

    height: auto;

    background-color: #f5f5f5;

    line-height: 1.46;

}

.positiondiv a {

    font-size: 12px;

    text-decoration: none;

    padding: 0px 4px;

    color: #0c85b6;

}



.showpic_box, .proinfo_box {

    margin: 20px 0px;

    padding-left: 0;

    padding-right: 0;

}

	

.news_time {

    float: none;

    padding: 0px 12px;

    background-color: #ccc;

    color: #fff;

    margin-left: 15px;

}



.contents {

    clear: both;

    padding: 4px 0px 20px;

    line-height: 1.48;

    color: #898989;

    overflow: auto;

}

	

.contents_title {

    margin: 0px;

    padding: 10px 0px;

    text-align: left;

    color: #000;

    font-weight: bold;

    line-height: 1.4;

}

	

p.subtitle {

    color: #777;

    text-align: left;

    margin-bottom: 15px;

    margin-top: -10px;

    padding-bottom: 0px;

	line-height: 1.2;

}

p.subtitle span {

    padding-left: 0px;

    padding-right: 15px;

}

	

.footercopyright {

	width: 100%;

	padding: 30px 0 60px;

	background-color: #1b1b1b;

}

	

}



@media screen and (min-width:768px) and (max-width:1023px) {

.headdown nav {

	width: 100%!important;

	padding: 20px 0px;

}

.headdown nav > ul > li > a {

	padding: 9px 20px;

	font-size: 1.4rem;

}

.headdown nav > ul > li.has-sub > a::after {

	position: absolute;

	top: 12px;

}

.nav-right {

	margin-right: 30px;

	position: absolute;

	top: 57px;

	right: 0px;

}

.nav-right a {

	padding: 6px 20px;

}

.user {		right: 40px!important;}

.iabout_r_wrap {

	width: 100%!important;

	box-sizing: border-box;

}

.iabout_r_content {

	background: #0c85b6;

	background-image: none;

	padding: 25px;

}

.iabout_r_wrap h4 {

	font-size: 25px;

}

}



@media screen and (max-width:1024px) {

.header-logo {

	margin-right: 25px!important;

}

/*.headdown nav ul{width:900px;}*/

}



@media screen and (min-width:1024px) and (max-width:1365px) {

.header-logo {

	margin-top: 15px;

}

.header-logo {

	margin-right: 20px;

	margin-top: 0px;

}

.headdown nav > ul > li > a {

	padding: 16px 12px;

	font-size: 1.3rem;

}

.headdown nav > ul > li.has-sub > a::after {

	position: absolute;

	top: 19px;

	right: 0px;

	z-index: 2;

}

.iabout_r_wrap {

	width: 100%!important;

}

.iabout_r_content {

	background: #0c85b6;

	background-image: none;

	padding: 42px;

}

}



@media screen and (max-width:1366px) {

.indexabout {

	width: 100%;

	height: 448px;

}

.iabout_r_wrap {

	width: 474px;

}

.iabout_r_wrap p {

	color: #fff;

	line-height: 1.42;

	font-size: 13px;

}

.iaboutbtn {

	margin-top: 35px;

}

}



@media screen and (min-width:1366px) and (max-width:1920px) {

.layout-5-1 {

	position: relative;

	min-height: 1px;

	padding-left: 15px;

	padding-right: 15px;

	float: left;

	width: 20%;

}

}



@media screen and (min-width:1920px) {

.container {

	width: 1310px;

}

.rightinfo a {

	padding-left: 30px;

}

.header-logo {

	margin-left: 0px;

	margin-right: 80px;

}

.headdown nav > ul > li > a {

	padding: 16px 23px;

}

.prolistwrap {

	max-width: 327px;

	margin: 0 auto;

}

}