@media (max-width: 1150px) {
	#topContent, .nav, #banner2 {width:100%;}
	.nav {background-position: center top}
}
@media (max-width: 960px) {
	#slides {height:220px;}
	#middle,#demo {width:100%;}
	#middleContent {margin-left:0;}
	.about {
	    width: 32%;
	}
	.maintitle2, .maintitle1, .tabcon, .titlea, #photo-list, .titleb{
	    width: 100%;
	}
	.contact{
		width: 36%;
	    padding-left: 1.5%;
	}
	.baomiing{ width: 29%}
	.demo {
	    width: 60%;
	}
	.dashijies {width: 37%}	
	.titleb span {    background: #fff;}

	.middleSide {WIDTH: 26%;}
	.middleMain {WIDTH: 73%;}
	.box1 { WIDTH: 81%;}
	.l {margin-left: 10%;}

  .topic {width: 100%}

	#bottomContent {padding-left:0;}
}
@media (max-width: 768px) {
  #topContent{    background: none;}
  #topContent .tel {font-size: 20px}
  #topContent .tel span{font-size: 20px}
  .nav {
    width: 35px;
    border-top: none;
    height: auto;
    margin-top: 0;
    margin-bottom: 0;
    position: absolute;
    top: 53px;
    right: 10px;
    background: none;
  }
  .nav span {
    display: block;
    width:30px;
    height:30px;
    background: #000 url(menu.gif) center center no-repeat;
    -webkit-background-size: 30px 30px;
    -moz-background-size: 100px 100px;
    -o-background-size: 100px 100px;
    background-size: 100px 100px;
    float:right;
  }
  .nav UL {
    position: absolute;
    width: 200px;
    background: #0e5a8b;
    z-index: 999;
    display: none;
    right: 0;
    top: 30px;
  }
  .nav ul li {
    float:none;
    border: 0;
    width:200px;
  }
  .nav ul li a {
    color: #fff;
    padding: 0;
    display: block;
    line-height: 30px;
  }
  .nav ul li a:hover {color:#000; text-decoration: underline;}
  #slides {	height: 175px}
  .contact {  width: 33%;}
  .baomiing { width: 33%;}
  .titlea span {background: #F5F2F2}

  .box1, .middleSide p img,.cutepage,.return { WIDTH: 100%;}


  #bottomContent {width: 100%; text-align: center;}
}
@media (max-width: 640px) {
  #erweima {display: none;}
  #yuyue{bottom:0; z-index:10000000}
  #topContent .logo {padding:30px 0 0 15px;}
  #topContent .logo img {width:100%; max-width: 100%;}
  #topContent .tel {font-size: 18px}
  #topContent .tel span {font-size: 18px}
  .nav UL {top:26px;}
  #slides {	height: 150px}
  .about, .demo, .dashijies {
    width: 100%;
  }
  .contact {
    width: 46%;
  }
  .baomiing {
    width: 52%;
  }
  .demo {margin-bottom: 10px;}

  .content .textarea {width: 100%; margin-bottom: 7px;}
}
@media (max-width: 480px) {  
  #topContent .tel {display: none}
  .tel_phone { display: block; }
  #slides {	height: 110px}
  .contact {
    width: 100%;
  }
  .baomiing {
    width: 75%;
    margin-bottom: 10px;
  }
  .box1 {
  	WIDTH: 42%;
    float: left;
  }
  .middleSide {width:100%;}
  .middleSide p {
  	float: right;
    margin-top: 30px;
    width: 50%;
  }
  .middleSide p.qyimg {margin-top: 0}
  .middleMain {WIDTH: 100%;}
  .middleMainContent {padding-left:0;}
  .content img {width:100%; height:auto;}
  .content td img {width:auto;}
}
@media (max-width: 375px) {
  #topContent .logo {
    padding: 10px 0 0 0px;
  }
  #slides {height:85px;}
  .baomiing {
    width: 90%;
  }
  .content .text {width: 100%}
}
@media (max-width: 320px) {
  #topContent {height:110px;}
  #slides {height:75px;}
}