@charset "utf-8";
/* CSS Document */

 body, ul, li, h1, h2, h3, h4, h5, h6,p, form, dl, dt, dd ,a{ margin:0px; padding:0px; font-size:12px; font-weight: normal; color:#666; text-decoration:none; }
ul { list-style: none; }
li {float: left;}
img { border-style: none; }
*{ margin:0;}
body { background:url(../images/mainbg.gif) repeat;width: 100%;height: 100%}

.main_bo { width:1024px; margin:0 auto; clear:both;}

.mian_copyright { text-align:center; margin-top:10px; padding-top:10px;margin-bottom:20px}

.mw { width:100%; margin:0 auto;}

.mw_fl { width:610px; height:250px; float:right; /**margin:80px 440px 80px 0px;**/ margin: 80px 33%;}
.trj_box{width: 80%;height: auto;clear: both;margin: 0 auto;}

.title_box{	width: 100%;margin-top: 5px;line-height: 40px;font-size: 16px;font-weight: 700;text-align: center;}
.content p{	font-size: 14px;color: #333;line-height: 30px;text-indent: 24px}


/* focus */
#focus{width:610px;height:250px;margin:0 auto;}
#focus div{position:absolute;width:610px;height:250px;overflow:hidden;}
#focus img{width:610px;height:250px;}
#focus #focus_img{display:none;}

@media only screen and (max-width: 992px){
	.main_window { width:100%; height:180px; background:url(../images/bgpic02.jpg) no-repeat top center;}
	.mw_fl { width:300px; height:150px; float:right; margin:30px 40px 0 0px; }
	#focus{width:300px;height:150px;margin:0 auto;}
    #focus div{position:absolute;width:300px;height:150px;overflow:hidden;}
    #focus img{width:300px;height:150px;}
    #focus #focus_img{display:none;}
    .trj_box{width: 90%;height: auto;clear: both;margin: 0 auto;}
    .Company_title{	background: url(../images/Company_title.png) no-repeat center;width: 80%;height: 44px;margin: 30px auto;background-size: 80% 80%;}

    .dg-container{
		width: 100%;
		height: 220px;
		position: relative;
		top: 20px;
	}
	.dg-wrapper{
		width: 280px;
		height: 180px;
		margin: 0 auto;
		position: relative;
		-webkit-transform-style: preserve-3d;
		-moz-transform-style: preserve-3d;
		-o-transform-style: preserve-3d;
		-ms-transform-style: preserve-3d;
		transform-style: preserve-3d;
		perspective: 70px;
	}
	.dg-wrapper a{
		width: 280px;
		height: 180px;
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		box-shadow: 0px 10px 20px rgba(0,0,0,0.3);
	}
	.dg-wrapper a.dg-transition{
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
	}
	.dg-wrapper a img{
		display: block;
		width: 280px;
		height: 180px;
	}
	.main_bo { width:100%; margin:0 auto; clear:both;}
	.main_line { width:100%; float:left; height:3px; background:url(../images/mian_line.gif) no-repeat center; margin-bottom:10px;background-size: 80% 80%;}
	.foot{
		margin-left:auto; margin-right:auto;display:block; width:100%;
	}
	.footer{
		float:left; width:100%; line-height:40px;
	}
	.footer a{display: block}
}

@media screen and (min-width: 1200px){	
	.Company_title{	background: url(../images/Company_title.png) no-repeat center;width: 30%;height: 44px;margin: 30px auto;background-size: 80% 100%;}
	.main_line { width:1024px; float:left; height:3px; background:url(../images/mian_line.gif) no-repeat center;margin-bottom:10px;}
	.foot{margin-left:auto; margin-right:auto;display: flex;  flex-direction: column;  justify-content: center;width:580px; line-height:25px;}
	.footer{float:left;}

	.dg-container{
		width: 100%;
		height: 450px;
		position: relative;
		top: 65px;
	}
	.dg-wrapper{
		width: 600px;
		height: 316px;
		margin: 0 auto;
		position: relative;
		-webkit-transform-style: preserve-3d;
		-moz-transform-style: preserve-3d;
		-o-transform-style: preserve-3d;
		-ms-transform-style: preserve-3d;
		transform-style: preserve-3d;
		-webkit-perspective: 1000px;
		-moz-perspective: 1000px;
		-o-perspective: 1000px;
		-ms-perspective: 1000px;
		perspective: 1000px;
	}
	.dg-wrapper a{
		width: 600px;
		height: 316px;
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		box-shadow: 0px 10px 20px rgba(0,0,0,0.3);
	}
	.dg-wrapper a.dg-transition{
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
	}
	.dg-wrapper a img{
		display: block;
		width: 600px;
		height: 316px;
	}	
}