@charset "utf-8";
/* CSS Document */
html,body{width:100%;height:100%;font:12px;background:#fff; overflow-x:hidden;overflow-y:auto;font-family:"微软雅黑";}
*{margin:0;padding:0;}
img{border:0;}
ol,ul{list-style:none;}
a{text-decoration:none;outline:none;color:#555;}
.float_l{float:left;}
.float_r{float:right;}
.clearfix:after{clear:both;content: ".";display:block;height:0;visibility:hidden;}
.clearfix{*zoom:1;}
.clear{clear:both;}
.kuandu{width:1375px; margin:auto}
.kuandu_05{width:995px; margin:auto}

.dis_inB{display:inline-block;*display:inline;*zoom:1;vertical-align:top;letter-spacing:normal;}
/*top */
.top{ background:#fff;}
.nav{ margin-left:87px; background:#fff;}
.nav_con li {
  display: inline-block; }
.nav__item{ height:100px; line-height:100px;}
.nav_con.default {
    line-height: 35px;
    height: 35px; }
.nav_con.twiceBorder, .nav.underline, .nav.overline {
    line-height: 30px;
    height: 30px; }
.nav_con a {
    padding: 0 22px; }
.nav_con a:hover{ color:#252525;}
.nr_main{ background:#fff;}
.nr_main_01{ background:#fff; padding:20px 150px;}
.nr_main_02{background:#fff; padding:120px 0px;}
/*banner */
.focus{width:100%;position:relative;float:center}
.f426x240{width:100%;height:auto;overflow:hidden; }
.f426x240 img{width:100%;height:auto;}

.rslides{width:100%;position:relative;padding:0; z-index:0}

.rslides_nav{height:60px;width:40px;position:absolute;-webkit-tap-highlight-color:rgba(0,0,0,0);top:50%;left:0;text-indent:-9999px;overflow:hidden;text-decoration:none;background:url(/images/joynew/l.jpg) no-repeat;margin-top:-28px}
.rslides_nav:active{opacity:1.0}
.rslides_nav.next{left:auto;background:url(/images/joynew/r.jpg) no-repeat;right:0}
.rslides_tabs{margin:-93px auto;clear:both;text-align:center; z-index:2;  position:relative;}
.rslides_tabs li{display:inline;float:none;_float:left;*float:left;margin-right:5px}
.rslides_tabs a{text-indent:-9999px;overflow:hidden;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;background:rgba(0,0,0, .2);background:#DDD;display:inline-block;_display:block;*display:block;width:12px;height:12px}
.rslides_tabs .rslides_here a{background:rgba(0,0,0, .6);background:#129CD6}


.ls{ width:100%; height:369px; background:#139dd7; margin-top:170px;}

.news{ height:273px; background:#282b2d; position:relative;  margin-top:-369px;}





/* lanrenzhijia_01 */
.lanrenzhijia_01 ul{width:1250px;}
.lanrenzhijia_01 ul li{float:left;margin-right:6px;margin-bottom:10px;display:inline;width:400px;height:192px;overflow:hidden;position:relative;}
.lanrenzhijia_01 ul li .photo_01{width:400px;height:192px;overflow:hidden;}
.lanrenzhijia_01 .rsp_01{width:400px;height:192px;overflow:hidden;position: absolute;background:#139dd7;top:0px;left:0px;}
.lanrenzhijia_01 .text_01{position:absolute;width:400px;height:192px;bottom:-400px;overflow:hidden; margin:60px; }
.lanrenzhijia_01 .bggg{position:absolute;width:400px;height:192px;bottom:-400px;overflow:hidden; margin:60px; background:#0CF}

.lanrenzhijia_01 .text_01 a{text-decoration:none}
.lanrenzhijia_01 .text_01 div{text-align:center;color:#FFFFFF;font-size:18px; }


.xw{ width:345px; height:277px;}
.more{ text-align:right;}
.xwzt{ padding:0px 30px;}
.xwzt ul{ padding-top:12px;}
.tit_one{ font-size:19px; border-bottom:1px solid #696969; padding:10px;}
.tit_one a{color:#1985b4; }
.xwzt li{ line-height:28px;}
.xwzt li{ color:#868686;font-size:14px; }
.xwzt li a{ color:#c3c3c3;display: block;
  width: 172px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; font-size:14px;}
.xwzt li a:hover{color:#fff;}

.product{ margin-left:-21px;}
.rm_bg{ height:449px; background:#f1f1f1;}
.rm_tit{ padding:20px 0px;}

.rm_01{ width:400px;  height:319px; background:#fff; border-bottom:4px solid #e6e6e6 ; margin-left	:23px;}
.rm_t{ font-size:24px; color:#3B3B3B;  }
.rm_con{ padding:0px 20px;}
.rm_n{ font-size:14px; line-height:21px; width:350px; height:41px; overflow:hidden; color:#919191; padding-top:10px;}
.ent{ margin-left:249px;padding:5px 18px; font-size:12px;-webkit-border-radius: 60px;-moz-border-radius : 60px; border-radius: 60px; border:1px solid #CCC;}
.rm_con a:hover{ background:#139dd7; color:#fff;  border:1px solid #139dd7;}


.gscp{ height:354px; background:#fff;}
.gsc_con{ border-left:1px solid #e8e8e8;border-right:1px solid #e8e8e8; height:380px; }
.gs_tit{ background:#fafafa}
.gs_tit p{ font-size:18px; line-height:44px; padding:10px;}

.cp_con{ padding:40px 0px 20px 20px}
.dj_tit{ color:#139dd7;}
.dj { width:704px}
.cp_con ul{ margin-left:-10px;}
.cp_con ul li:fist-child{ padding-left:0px;}
.cp_con ul li{ padding:4px 10px ; font-size:14px; width:144px; border-right:1px solid #e8e8e8;}
.wy { width:496px;}

.bottom{ background:#1b1d1f; height:177px;}
.bottom  p{ color:#eaeaea;}
.ewm{ border-right:1px solid #565b5f; padding-right:42px;margin-left:100px;}
.bot_nr{ padding:25px 0px 0px 54px; }
.bot_wz{ width:885px; text-align:center; line-height:30px; font-size:12px; padding:10px;}




.grid {
	position: relative;
	margin: 0 auto;
	
	max-width: 1000px;
	list-style: none;
	text-align: center;
}

/* Common style */
.grid figure {
	position: relative;
	float: left;
	overflow: hidden;
	width: 273px;
	height: 273px;
	
	background: #3085a3;
	text-align: center;
	cursor: pointer; 
	 margin-left:5px;
}

.grid figure img {
	position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
	opacity: 0.8;
}

.grid figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure figcaption > a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.grid figure h2 {
	word-spacing: -0.15em;
	font-weight: 300;
}

.grid figure h2 span {
	font-weight: 800;
}

.grid figure h2,
.grid figure p {
	margin: 0;
}

.grid figure p {
	letter-spacing: 1px;
	font-size: 68.5%;
}

/* Individual effects */


/*---------------*/
/***** Ruby *****/
/*---------------*/

a:hover, a:focus {
	color: #528cb3;
}

section {
	padding: 1em;
	text-align: center;
}

.content {
	margin: 0 auto;
	max-width: 1000px;
	 width:560px;
	 
}

.content > h2 {
	clear: both;
	margin: 0;
	padding: 4em 1% 0;
	color: #484B54;
	font-weight: 800;
	font-size: 1.5em;
}
.effect-ruby a{ color:#fff;}

.content > h2:first-child {
	padding-top: 0em;
}

/* Header */
.codrops-header {
	margin: 0 auto;
	padding: 4em 1em;
	text-align: center;
}

.codrops-header h1 {
	margin: 0;
	font-weight: 800;
	font-size: 4em;
	line-height: 1.3;
}

.codrops-header h1 span {
	display: block;
	padding: 0 0 0.6em 0.1em;
	color: #74777b;
	font-weight: 300;
	font-size: 45%;
}

/* Demo links */
.codrops-demos {
	clear: both;
	padding: 1em 0 0;
	text-align: center;
}

.content + .codrops-demos {
	padding-top: 5em;
}

.codrops-demos a {
	display: inline-block;
	margin: 0 5px;
	padding: 1em 1.5em;
	text-transform: uppercase;
	font-weight: bold;
}

.codrops-demos a:hover,
.codrops-demos a:focus,
.codrops-demos a.current-demo {
	background: #3c414a;
	color: #fff;
}

/* To Navigation Style */
.codrops-top {
	width: 100%;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 0.69em;
	line-height: 2.2;
}

.codrops-top a {
	display: inline-block;
	padding: 1em 2em;
	text-decoration: none;
	letter-spacing: 1px;
}

.codrops-top span.right {
	float: right;
}

.codrops-top span.right a {
	display: block;
	float: left;
}

.codrops-icon:before {
	margin: 0 4px;
	text-transform: none;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	font-family: 'codropsicons';
	line-height: 1;
	speak: none;
	-webkit-font-smoothing: antialiased;
}

.codrops-icon-drop:before {
	content: "\e001";
}

.codrops-icon-prev:before {
	content: "\e004";
}

/* Related demos */
.related {
	clear: both;
	padding: 6em 1em;
	font-size: 120%;
}

.related > a {
	display: inline-block;
	margin: 20px 10px;
	padding: 25px;
	border: 1px solid #4f7f90;
	text-align: center;
}

.related a:hover {
	border-color: #39545e;
}

.related a img {
	max-width: 100%;
	opacity: 0.8;
}

.related a:hover img,
.related a:active img {
	opacity: 1;
}

.related a h3 {
	margin: 0;
	padding: 0.5em 0 0.3em;
	max-width: 300px;
	text-align: left;
}





figure.effect-ruby {
	background-color: #000;
}

figure.effect-ruby img {
	opacity: 1;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale(1.15);
	transform: scale(1);
}

figure.effect-ruby:hover img {
	opacity: 0.5;
	-webkit-transform: scale(1);
	transform: scale(1.15);
}

figure.effect-ruby h2 {
	margin-top: 20%;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
}

figure.effect-ruby p {
	margin: 39px 0 0;
	opacity: 0;
	line-height:25px;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(0,20px,0) scale(1.1);
	transform: translate3d(0,20px,0) scale(1.1);
	height:119px;
	 overflow:hidden;
} 

figure.effect-ruby:hover h2 {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect-ruby:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0) scale(1);
	transform: translate3d(0,0,0) scale(1);
}


@media screen and (max-width: 50em) {
	.content {
		padding: 0 10px;
		text-align: center;
	}
	.grid figure {
		display: inline-block;
		float: none;
		margin: 10px auto;
		width: 100%;
	}
}













.ny_banner{ width:100%;}
.ny_banner img{ width:100%;}
.about_tit{ background:url(/images/joynew/gy_05.jpg) center; height:184px; color:#fff; font-size:32px;}
.about_tit p{ padding:73px 0px 0px 10px; font-size:55px;}
.about_tit_01{ background:url(/images/joynew/pro_03.jpg) center no-repeat; height:135px; color:#fff; font-size:32px;}
.about_tit_01 p{ padding:42px 0px 0px 10px; font-size:55px;}
.about_tit_02{ background:url(/images/joynew/tl_03.jpg) center no-repeat; height:135px; color:#fff; line-height:20px; padding:42px 0px 0px 10px;}
.about_tit_02 p{ font-size:14px; border-left:3px solid #0CF; padding:0px 20px;}


.bbs{  margin-top:80px; }
.bbs_h li{ cursor:pointer;color:#fff; font-family:"微软雅黑";  color:#282828; }

.bbs_c{display:none; margin-top:20px;line-height:29px; font-size:14px; color:#666; min-height:724px;}
.bbs_h .vary{  color:#fff;  z-index:2;}

.hzz img,.hzz_01 img{ width:1100px;}
.hzz{  margin-bottom:56px; padding-bottom:20px; width:1100px;}
.hzz li,.hzz_01 li{ padding:2px 7px;}
.hzz_01{ padding-bottom:20px; width:960px;}

.ry{padding:10px; color:#000; background:url(/images/joynew/bbj_03.png) no-repeat;}
.ry_01{ width:509px; margin:20px 20px; border:1px dashed #d4ae75; padding:20px; height:200px; }

.tpp,.wh{ width:100%;}
.tpp img,.wh img{ width:100%;}
.yss{ background:#eee;  margin-top:15px;}

.zl{ font-size:29px; color:#363636; padding:30px 0px 25px 0px; font-weight:bolder;}

/* lanrenzhijia */
.lanrenzhijia{width:1250px;margin:10px auto 0 auto;overflow:hidden;}
.lanrenzhijia ul{width:1250px;}
.lanrenzhijia ul li{float:left;margin-right:10px;margin-bottom:10px;display:inline;width:406px;height:234px;overflow:hidden;position:relative;}
.lanrenzhijia ul li .photo{width:406px;height:234px;overflow:hidden;}
.lanrenzhijia .rsp{width:406px;height:234px;overflow:hidden;position: absolute;background:#000;top:0px;left:0px;}
.lanrenzhijia .text{position:absolute;width:406px;left:-410px;top:0px;overflow:hidden; padding:15px 20px; text-align:center;}
.lanrenzhijia .text h3{width:351px;line-height:21px; text-align:left;color:#fff;font-size:12px; padding-top:10px;max-height:70px; overflow:hidden;}
.lanrenzhijia .text a{text-decoration:none}
.lanrenzhijia .text p{text-align:right;color:#59daf1;font-size:12px; }
.lanrenzhijia .text p a{color:#59daf1;}

.nr_main_01 ul{ padding:20px 0px; min-height:500px;}
.nr_main_01 ul li{ border-bottom:1px solid #c9c9c9; padding:10px 0px}
.new_c{ width:850px; padding-left:37px;}
.new_c a{ color:#000;}
.new_c a:hover{ color:#538BC8;}
.new_c a:visited{ color:#538BC8;}

.new_n{ font-size:12px; color:#646464; padding:10px 0px; line-height:20px;}
.new_t{color:#646464;}
.ne_t{ padding:0px 15px; border-left:4px solid #09F; font-size:20px;}
.new_nav{ text-align:right; font-size:12px; border-bottom:1px solid #CCC; height:23px;} 
.new_cont{ padding:20px 0px; font-size:14px; color:#646464; line-height:30px; min-height:300px;}



.guobao{ background:#f7f7f7; width:100%}
.guobao img{ width:100%;} 

.kuandu_04{width:1200px; margin:auto}
.kuandu_04 img{ width:1200px}
.wenhua{ padding:0px 20px; border-left:1px solid #999; }
.bbs_h .vary_01{  color:#139dd7;  z-index:2;}

.nav_con ul{ width:780px;}



.pb{ background:#2aabfd; height:398px; width:263px; text-align:center; padding-top:50px; margin-left:10px; margin-top:20px;}
.pb p{ color:#fff; line-height:25px;}
.pb_t{ padding-top:53px; padding-bottom:10px; font-size:24px;}
.pb_c{font-size:15px;}

.ptp{ height:273px; width:273px}
.ptp img{ height:273px; width:273px}