/* CSS Document */

@font-face {

  font-family: "gangp";

  src: url("../fonts/H_CECB__.woff2") format("woff2"),

       url("../fonts/H_CECB__.woff") format("woff"),

       url("../fonts/H_CECB__.ttf") format("truetype"),

       url("../fonts/H_CECB__.eot") format("embedded-opentype"),

       url("../fonts/H_CECB__.svg") format("svg");

  font-weight: normal;

  font-style: normal;

}



@font-face {

  font-family: "Lato";

  src: url("../fonts/Lato-Regular.woff2") format("woff2"),

       url("../fonts/Lato-Regular.woff") format("woff"),

       url("../fonts/Lato-Regular.ttf") format("truetype"),

       url("../fonts/Lato-Regular.eot") format("embedded-opentype"),

       url("../fonts/Lato-Regular.svg") format("svg");

  font-weight: normal;

  font-style: normal;

}

@font-face {

  font-family: "RobotoCondensed";

  src: url("../fonts/RobotoCondensed.woff2") format("woff2"),

       url("../fonts/RobotoCondensed.woff") format("woff"),

       url("../fonts/RobotoCondensed.ttf") format("truetype"),

       url("../fonts/RobotoCondensed.eot") format("embedded-opentype"),

       url("../fonts/RobotoCondensed.svg") format("svg");

  font-weight: normal;

  font-style: normal;

}

@font-face {

  font-family: "Poppi";

  src: url("../fonts/Poppins-Regular.woff2") format("woff2"),

       url("../fonts/Poppins-Regular.woff") format("woff"),

       url("../fonts/Poppins-Regular.ttf") format("truetype"),

       url("../fonts/Poppins-Regular.eot") format("embedded-opentype"),

       url("../fonts/Poppins-Regular.svg") format("svg");

  font-weight: normal;

  font-style: normal;

}



* {

	padding: 0;

	margin: 0;

}

html{overflow: -moz-scrollbars-none;}

html::-webkit-scrollbar{

	width: 0px;

	background: none;

}

/*html,body{

	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;}*/

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-family: "Poppi",Arial;

}

p{transition: all 0.5s ease;

	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

	font-family: "Poppi";}

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;

	font-family: "Poppi";

}

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;

	image-rendering: -moz-crisp-edges; /* Firefox */

    image-rendering: -o-crisp-edges; /* Opera */

    image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */

    image-rendering: crisp-edges;

	-ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */

}

i, span{

	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.3s ease;

	-webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

	-o-transition: all 0.3s ease;

	

	border:none;

	-webkit-tap-highlight-color: rgba(0,0,0,0);

	-webkit-tap-highlight-color:transparent;

	outline:none；

}

/*nav*/

.xynav{
	/*background-color: transparent;*/
	border: none;
	/*padding: 20px 0px 0px;*/
	padding:35px 0px 15px;
}



.navbar-brand{
	display: block;
	/*width:180px;*/
	width: 210px;
	height: 70px;
}

.xynav .navbar-nav>li{padding: 0 20px;}

.xynav .navbar-nav>li>a {

    /*color: #fff;*/
    color: #40a8eb;

	font-family: "Poppi";

	text-transform: uppercase;

	font-size: 15px;

	font-weight: 100;

}

.xynav .navbar-nav>li>a::after{

	content: '';

	display: block;

	/*margin-top: 30px;*/
	margin-top: 10px;

	transition: all 0.5s ease;

	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

	text-align: center;

	font-size: 0px;

	width:0%;

	height: 2px;

	background-color: #40a8eb;

}

.xynav .navbar-nav>li>a:hover::after{

	width:100%;

}

.xynav .navbar-nav>li>a.active{color: #40a8eb; font-weight: 600;}

.xynav .navbar-nav>li>a.active::after{

	content: '';

	display: block;

	/*margin-top: 30px;*/
	margin-top: 10px;

	transition: all 0.5s ease;

	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

	text-align: center;

	font-size: 0px;

	width:100%;

	height: 2px;

	background-color: #40a8eb;

}



#bs-example-navbar-collapse-1 ul li a:hover {

    color: #40a8eb;

}



/*.xynavScroll{
	background-color: rgba(0,0,0,0.8);
	background-color: rgba(104,118,138,0.95);
	background-color: #333;
	background-color: #eee;
	box-shadow: 0 3px 8px 0 #fff;
	padding: 2px 0px;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}*/

/*.xynavScroll .navbar-nav{padding-top: 10px;}*/

.xynavScroll .navbar-nav>li>a {

    /*color: #fff;*/
    color: #40a8eb;

}



/*bannner*/

.bx-wrapper {

	position: relative;

	margin: 0 auto 0px;

	padding: 0;

	border:1px solid #ccc;

 *zoom: 1;

	z-index: 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;

}



.iabout{

	width:100%; padding: 100px 0;background-color: #fff;   border-top: 30px solid #f1f1f1;

}

.iablutleft{}

.iablutleft h3{color:#333; font-size: 28px; font-weight: 700;}

.iablutleft p{font-size: 13px; color:#333; margin-top: 35px; line-height: 21px;}

.iaboutau{text-align: center; margin-top: 50px;}

.iaboutau h4{font-size: 24px; color:#40a8eb;}

.iaboutau h4 sup{font-size: 14px;}

.iaboutau span{font-size: 14px; color:#666;}

.iaboutau h4 span{font-size: 24px; color:#40a8eb;}

.iaboutau .row div:first-child{

	padding-left: 0;

}

.iaboutbtn{margin-top: 50px;}

.iaboutbtn a{display: block; width:172px; height: 56px; background-color: #40a8eb; color:#fff; font-size:14px; text-align: center; border-radius: 4px; line-height: 54px;}

.iaboutbtn a:hover{background-color: rgba(0,0,0,0.7); color:#40a8eb;}



.manufacturing{width:100%; background-color: #f1f1f1; padding: 90px 0px 100px;}

.manufacturing h3{color:#333; font-size: 28px; font-weight: 700; text-align: center;}

.manufacturing p{color:#333; font-size: 14px; text-align: center; padding: 30px 0px 95px;}

.custom3568{width:35.68%;}

.custom6431{width:64.31%; margin-bottom: 40px;}

.mfpic{}

.mfpic img{max-width: 100%; filter: grayscale(1);}

.mfpic img:hover{filter: grayscale(0); transform: scale(1.02);}

.mfpicwrap{max-width: 500px; margin: 0 auto;}



.mfck0{position: relative; width: 100%; height: 0; padding-top: 70.72%; font-size: 0; overflow: hidden;}

.mfck0 img{position: absolute; left: 12px; top:0; right: 0; bottom:0; max-width:100%; max-height:100%; margin: auto; filter: grayscale(1);}

.mfck0 img:hover{filter: grayscale(0); transform: scale(1.02);}

.mfck{ position: relative; width: 100%; height: 0; padding-top: 37.24%; font-size: 0; overflow: hidden;}

.mfck img{position: absolute; left: 0; top:0; right: 0; bottom:0; max-width:100%; max-height:100%; margin: auto; filter: grayscale(1);}

.mfck img:hover{filter: grayscale(0); transform: scale(1.02);}

.mfck1{position: relative; width: 100%; height: 0; padding-top: 70.72%; font-size: 0; overflow: hidden;}

.mfck1 img{position: absolute; left: -12px; top:0; right: 12px; bottom:0; max-width:100%; max-height:100%; margin: auto; filter: grayscale(1);}

.mfck1 img:hover{filter: grayscale(0); transform: scale(1.02);}

@media (max-width:767px)

{

	.custom3568{width:100%;}

	.custom6431{width:100%; margin-bottom: 0px;}

	.manufacturing img{filter: grayscale(0) !important; left: 0px !important; width:100%; max-width: inherit; margin-bottom: 10px;}

	.heading_CoE9UX {

		font-size: 18px;

		text-align: center;

	}

	.productconh3 {

		padding-left: 30px;

		padding-right: 15px;

		font-size: 18px;

	}

	.cbsect_e9bf1681 { height: auto;}

}

.manufacturingbtn{ margin-top: 50px;}

.manufacturingbtn a{display: block; width:172px; height: 56px; background-color: #40a8eb; color:#fff; font-size:14px; text-align: center; border-radius: 4px; line-height: 54px; margin: 0 auto;}

.manufacturingbtn a:hover{background-color: rgba(0,0,0,0.7); color:#40a8eb;}



.pflow{width:100%; padding: 65px 0px 50px; background: url(../images/a/flowbg.jpg) center center no-repeat #333;}

.leftTitle{float: left; width:216px; height: 158px; background-color: rgba(227,73,73,0.86); text-align: center;}

.leftTitle h3{ position: relative; top:50%; transform: translateY(-50%); color:#ccc; font-size: 24px; font-weight: 700; text-align: center; margin-top: 0; margin-bottom: 0; line-height: 1.43856;}

.pflowright{width:100%; padding-left: 216px; display: block; box-sizing: border-box;}

.pflowList{width:158px; height: 158px; float: left; padding-left: 0px; padding-right: 0px; margin-left: 3px; background-color: rgba(0,0,0,0.80);}

.pflowWrap{max-width:160px; margin: 0 auto;}

.pflowWrap a{display: block; text-align: center; font-size: 16px; color:#fff; font-family: "Poppi";}

.pflowWrap a img{margin: auto; max-width: 100%; margin-top: 30px; margin-bottom: 6px;}

.leftTitle:hover{background-color: rgba(227,73,73,0.86);}

.leftTitle:hover h3{color:#fff;}

.pflowList:hover{background-color: rgba(227,73,73,0.86); transform: translateY(-10px);}

.pflow h5{font-size: 15px; color: #fff; text-align: center; margin-top: 30px; text-shadow: 0 0 5px rgba(0,0,0,0.9);}



.samplediv{width:100%; padding: 100px 0; background-color: #fff;}

.samplediv h3{color:#333; font-size: 28px; font-weight: 700; text-align: center;}

.samplediv p{color:#333; font-size: 14px; text-align: center; padding: 30px 0px 70px;}

.sampleTiotle{background: url(../images/a/pfirst.jpg) center center no-repeat; width:100%; position: relative; height: 0; padding-top: 100%;  overflow: hidden;}

.sampleTiotle h4{position: absolute; left: 0; top: 0; right: 0; bottom: 0; max-width: 100%; max-height: 100%; padding: 20% 10% 0%; margin: 0 auto; font-size: 16px; color:#fff;}

.samplelist{max-width:200px; margin: 0 auot; padding-left: 0; padding-right: 0; padding: 3px;}

.sawrap{position: relative; width: 100%; height: 0; padding-top: 100%; font-size: 0; background-color: #ccc; overflow: hidden;}

.salistpic{position: absolute; left: 0; top: 0; right: 0; bottom: 0; max-width: 100%; max-height: 100%; margin: auto; }

.salistpic img{max-width: 100%; margin: auto;}

.salistMask{position: absolute; width:100%; height: 100%; bottom:-100%; background-color: rgba(227,73,73,0.86); padding-top: 45%; text-align: center;}

.salistMask a{font-size: 14px; color:#fff; text-align: center; }



.sawrap:hover .salistMask{bottom:0;}

.sampleLink{background-color: #40a8eb;  width:100%; position: relative; height: 0; padding-top: 100%; text-align: center;  overflow: hidden;}

.sampleLink a{position: absolute; left: 0; top: 0; right: 0; bottom: 0; max-width: 100%; max-height: 100%; padding-top: 40%; margin: auto;color:#fff; font-size: 16px;}

.sampleLink a i{padding-left: 8px; font-size: 20px; vertical-align: middle; }

.sampleLink:hover{background-color: rgba(0,0,0,0.7);}

.sampleLink:hover a{color:#40a8eb;}



.marketDistribution{width:100%; padding: 75px 0 0px; background: url(../images/a/rangbg.jpg) center center no-repeat;}

.marketDistribution h3{color:#fff; font-size: 28px; font-weight: 700; text-align: center; border-bottom: 1px dotted rgba(255,255,255,0.3); margin-top: 0px;  padding-bottom: 20px;}

.marketList{ margin: 0 auto; text-align: center; background-color: transparent;}

.omap{ margin: 0 auto; padding-top: 30px;}

.omap img{ width:195px; height: 195px; margin: 0 auto;}

.omapTxt{margin-top: 35px; margin-bottom: 90px;}

.omapTxt h4{font-size: 20px; font-weight: 700; text-align: center; color:#ccc;}

.omapTxt::after{content: ''; display: block; width: 120px; height: 2px; background-color: #fff; margin: 0 auto; text-align: center;}

.marketList:hover{background-color: rgba(227,73,73,0.5);}



.ydFooter{width:100%; background-color: #858585;}

.ydFooterCon{padding: 30px 0; margin: 0 auto; }

.ydFooterCon p{font-size: 13px; color:#fff; text-align: center;}

.ydFooterCon p span{padding-left: 20px;}

.ydFooterCon a{color:#fff;}

.areamap{padding: 30px; background-color: #fff;}

.areamap img{max-width: 100%;}



#VideoCon {

    width: 100%;

    height: 607px;

    max-width: 810px;

    overflow: hidden;

    padding: 0;

    margin: 0 auto!important;

}



#VideoCon video {

    width: 100%;

    height: 100%;

}



@media (max-width:767px){

	.xynav {

		background-color: #333;

		border: none;

		padding: 0px 0px;

		position: static;

		margin-bottom: 0;

		border-bottom: 1px solid #0d0d0d;

	}

	.xynav .navbar-nav>li>a{padding-left: 35px;}

	.xynav .navbar-nav>li>a::after{margin-top: 4px;}

	.navbar-brand {

		display: block;

		width: 160px;

		height: 55px;

	}

	.iabout {

		padding: 10px 0;

	}

	.iablutleft h3 {

		font-size: 18px;

		padding-left: 10px;

		border-left: 3px solid #40a8eb;

	}

	.iablutright img{max-width: 100%;}

	.manufacturing {

		padding: 10px 0px 10px;

	}

	.manufacturing h3{font-size: 18px;}

	.manufacturing h3::after{content: ''; display: block; text-align: center; margin: 0 auto; margin-top: 10px; width:42px; height: 3px; background-color: #40a8eb;}

	.manufacturing p {

		text-align: left;

		padding: 20px 0px 20px;

	}

	.manufacturingbtn {

		margin-top: 0px;

		margin-bottom: 30px;

	}

	.pflow { padding: 30px 0px 30px; background-size:cover;}

	.leftTitle {

		float: left;

		width: 100%;

		height: 64px;

		margin-bottom: 10px;

		background-color: transparent;

	}

	.leftTitle h3 {

		font-size: 18px;

		line-height: 64px;

	}

	.pflowright { padding-left: 10px;}

	.pflowList {

		width: 46.8%;

		height: 158px;

		margin-left: 1%;

		margin-right: 1%;

		margin-bottom: 10px;

	}

	.samplediv {padding: 30px 0;}

	.samplediv h3 {	font-size: 18px;}

	.samplediv h3::after{content: ''; display: block; text-align: center; margin: 0 auto; margin-top: 10px; width:42px; height: 3px; background-color: #40a8eb;}

	.samplediv p {

		text-align: left;

		padding: 10px 0px 30px;

	}

	.samplelist {

		max-width:inherit;

	}

	.sampleTiotle { padding-top: 112px; background-size: cover;}

	.sampleTiotle h4 {padding: 6% 14% 0%;}

	.sampleLink{padding-top: 76px;}

	.sampleLink a{padding-top: 6%;}

	.marketDistribution {

		padding: 30px 0 0px;

		background-repeat: repeat;

	}

	.marketDistribution h3{font-size: 18px;}

	.marketDistribution h3::after{content: ''; display: block; text-align: center; margin: 0 auto; margin-top: 10px; width:42px; height: 3px; background-color: #40a8eb;}

}



@media (min-width: 768px) and (max-width:1024px)

{

	.xynav .navbar-nav>li{padding: 0 3px;}

	.iabout{padding: 30px 0;}

	.iablutright{padding-top: 45px;}

	.iablutright img{max-width: 100%;}

	.manufacturing { padding: 30px 0px 30px;}

	.manufacturing p { padding: 30px 0px 35px;}

	.manufacturingbtn {

		margin-top: 10px;

		margin-bottom: 30px;

	}

	.pflowList{margin-bottom: 8px;}

	.samplediv { padding: 30px 0;}

	.samplediv p { padding: 30px 0px 30px;}

	.sampleTiotle h4 {

		position: absolute;

		left: 0;

		top: 0;

		right: 0;

		bottom: 0;

		max-width: 100%;

		max-height: 100%;

		padding: 10% 10% 0%;

		margin: 0 auto;

		font-size: 12px;

		color: #fff;

	}

}

@media (min-width:1025px) and (max-width:1355px)

{

	.pflowList{margin-bottom: 8px;}

}



@media (min-width: 1366px) and (max-width:1920px)

{

	.iabout .container{width:1200px !important;}

	.manufacturing .container{width:1200px !important;}

	.pflow .container{width:1200px !important;}

	.samplediv .container{width:1200px !important;}

	.marketDistribution .container{width:1200px !important;}

	.ydFooter .container{width:1200px !important;}

}

