@media all and (max-width: 768px){
	.wrap{
		width: 94%;
		min-width: 94%;
		padding: 0 3%;
	}
	#header,#content,#footer,#banner{
		min-width:100%;
	}
	.nav{
		position: absolute;
		top: 12px;
		width: 100%;
		left: 0;
	}
	.nav .nav-ul{
		position: absolute;
		top: 56px;
		left: 0;
		z-index: 9999;
		background: #0884AD;
		padding: 10px 0;
		display: none;
		margin-top: 0;
		opacity: .8;
	}
	.nav-ul > li {
	    width: 100%;
	}
	.nav-ul > li>a {
	    line-height: 40px;
	    color: #fff;
	    font-size: 1.6rem;
	    text-align: left;
	    padding: 0 20px;
	    height: 40px;
	}
	.nav-ul > li.on a, .nav-ul > li:hover a {
	    color: #fff;
	}
	#nav {
	    position: absolute;
	    width: 46px;
	    height: 46px;
	    text-align: center;
	    color: #fff;
	    background: #0884AD;
	    top: 0px;
	    right: 10px;
	}
	
	#header .logo img{
		width: 210px;
	}
	#header .logo {
	    padding: 12px 0 10px;
	}
	#nav span {
	    position: absolute;
	    left: calc((100% - 25px) / 2);
	    left: -webkit-calc((100% - 25px) / 2);
	    left: -moz-calc((100% - 25px) / 2);
	    left: -ms-calc((100% - 25px) / 2);
	    left: -o-calc((100% - 25px) / 2);
	    top: calc((100% - 1px) / 2);
	    top: -webkit-calc((100% - 1px) / 2);
	    top: -moz-calc((100% - 1px) / 2);
	    top: -ms-calc((100% - 1px) / 2);
	    top: -o-calc((100% - 1px) / 2);
	    width: 25px;
	    height: 1px;
	    background-color: rgba(255, 255, 255, 1);
	}
	#nav span:nth-child(2) {
	    transform: translateY(-4px) rotate(0deg);
	    -webkit-transform: translateY(-4px) rotate(0deg);
	    -moz-transform: translateY(-4px) rotate(0deg);
	    -ms-transform: translateY(-4px) rotate(0deg);
	    -o-transform: translateY(-4px) rotate(0deg);
	}
	.header-nav-out span:nth-child(1) {
	    animation-duration: 0.5s;
	    animation-fill-mode: both;
	    animation-name: outfirst;
	    -webkit-animation-duration: 0.5s;
	    -moz-animation-duration: 0.5s;
	    -ms-animation-duration: 0.5s;
	    -o-animation-duration: 0.5s;
	    -webkit-animation-fill-mode: both;
	    -moz-animation-fill-mode: both;
	    -ms-animation-fill-mode: both;
	    -o-animation-fill-mode: both;
	    -webkit-animation-name: outfirst;
	    -moz-animation-name: outfirst;
	    -ms-animation-name: outfirst;
	    -o-animation-name: outfirst;
	}
	.header-nav-out span:nth-child(2) {
	    animation-duration: 0.5s;
	    animation-fill-mode: both;
	    animation-name: outsecond;
	    -webkit-animation-duration: 0.5s;
	    -moz-animation-duration: 0.5s;
	    -ms-animation-duration: 0.5s;
	    -o-animation-duration: 0.5s;
	    -webkit-animation-fill-mode: both;
	    -moz-animation-fill-mode: both;
	    -ms-animation-fill-mode: both;
	    -o-animation-fill-mode: both;
	    -webkit-animation-name: outsecond;
	    -moz-animation-name: outsecond;
	    -ms-animation-name: outsecond;
	    -o-animation-name: outsecond;
	}
	.header-nav-click span:nth-child(1) {
	    animation-duration: 0.5s;
	    animation-fill-mode: both;
	    animation-name: clickfirst;
	    -webkit-animation-duration: 0.5s;
	    -moz-animation-duration: 0.5s;
	    -ms-animation-duration: 0.5s;
	    -o-animation-duration: 0.5s;
	    -webkit-animation-fill-mode: both;
	    -moz-animation-fill-mode: both;
	    -ms-animation-fill-mode: both;
	    -o-animation-fill-mode: both;
	    -webkit-animation-name: clickfirst;
	    -moz-animation-name: clickfirst;
	    -ms-animation-name: clickfirst;
	    -o-animation-name: clickfirst;
	}
	.header-nav-click span:nth-child(1) {
	    animation-duration: 0.5s;
	    animation-fill-mode: both;
	    animation-name: clickfirst;
	    -webkit-animation-duration: 0.5s;
	    -moz-animation-duration: 0.5s;
	    -ms-animation-duration: 0.5s;
	    -o-animation-duration: 0.5s;
	    -webkit-animation-fill-mode: both;
	    -moz-animation-fill-mode: both;
	    -ms-animation-fill-mode: both;
	    -o-animation-fill-mode: both;
	    -webkit-animation-name: clickfirst;
	    -moz-animation-name: clickfirst;
	    -ms-animation-name: clickfirst;
	    -o-animation-name: clickfirst;
	}
	.header-nav-click span:nth-child(2) {
	    animation-duration: 0.5s;
	    animation-fill-mode: both;
	    animation-name: clicksecond;
	    -webkit-animation-duration: 0.5s;
	    -moz-animation-duration: 0.5s;
	    -ms-animation-duration: 0.5s;
	    -o-animation-duration: 0.5s;
	    -webkit-animation-fill-mode: both;
	    -moz-animation-fill-mode: both;
	    -ms-animation-fill-mode: both;
	    -o-animation-fill-mode: both;
	    -webkit-animation-name: clicksecond;
	    -moz-animation-name: clicksecond;
	    -ms-animation-name: clicksecond;
	    -o-animation-name: clicksecond;
	}
	@keyframes clickfirst{
		0% {
		    transform: translateY(4px) rotate(0deg);
		    -webkit-transform: translateY(4px) rotate(0deg);
		    -moz-transform: translateY(4px) rotate(0deg);
		    -ms-transform: translateY(4px) rotate(0deg);
		    -o-transform: translateY(4px) rotate(0deg);
		}
		100% {
		    transform: translateY(0) rotate(45deg);
		    -webkit-transform: translateY(0) rotate(45deg);
		    -moz-transform: translateY(0) rotate(45deg);
		    -ms-transform: translateY(0) rotate(45deg);
		    -o-transform: translateY(0) rotate(45deg);
		}
	}
	@keyframes clicksecond{
		0% {
		    transform: translateY(-4px) rotate(0deg);
		    -webkit-transform: translateY(-4px) rotate(0deg);
		    -moz-transform: translateY(-4px) rotate(0deg);
		    -ms-transform: translateY(-4px) rotate(0deg);
		    -o-transform: translateY(-4px) rotate(0deg);
		}
		100% {
		    transform: translateY(0) rotate(-45deg);
		    -webkit-transform: translateY(0) rotate(-45deg);
		    -moz-transform: translateY(0) rotate(-45deg);
		    -ms-transform: translateY(0) rotate(-45deg);
		    -o-transform: translateY(0) rotate(-45deg);
		}
	}
	@keyframes outfirst{
		0% {
		    transform: translateY(0) rotate(-45deg);
		    -webkit-transform: translateY(0) rotate(-45deg);
		    -moz-transform: translateY(0) rotate(-45deg);
		    -ms-transform: translateY(0) rotate(-45deg);
		    -o-transform: translateY(0) rotate(-45deg);
		}
		100% {
		    transform: translateY(-4px) rotate(0deg);
		    -webkit-transform: translateY(-4px) rotate(0deg);
		    -moz-transform: translateY(-4px) rotate(0deg);
		    -ms-transform: translateY(-4px) rotate(0deg);
		    -o-transform: translateY(-4px) rotate(0deg);
		}
	}
	@keyframes outsecond{
		0% {
		    transform: translateY(0) rotate(45deg);
		    -webkit-transform: translateY(0) rotate(45deg);
		    -moz-transform: translateY(0) rotate(45deg);
		    -ms-transform: translateY(0) rotate(45deg);
		    -o-transform: translateY(0) rotate(45deg);
		}
		100% {
		    transform: translateY(4px) rotate(0deg);
		    -webkit-transform: translateY(4px) rotate(0deg);
		    -moz-transform: translateY(4px) rotate(0deg);
		    -ms-transform: translateY(4px) rotate(0deg);
		    -o-transform: translateY(4px) rotate(0deg);
		}
	}
	.index-wrap >div{
		width: 100%;
	}
	#banner,#banner li a{
		height: 180px;
	}
	.footer-top span{
		display: block;
		margin: 0;
	}
	#footer{
		text-align: left;
	}
	.footer-bottom{
		text-indent: 3%;
	}
	.header-top-info,.left .left_title{
		display: none;
	}
	.left {
	    width: 100%;
	}
	.subnav{
		overflow-x: auto;
		width: 100%;
		margin-bottom: 30px;
	}
	.left .subnav li{
		float: left;
		width: 130px;
		height: 30px;
		line-height: 30px;
	}
	.right{
		width: 100%;
	}
	.page{
		text-align: left;
	}
	.page a,.page span,.page b{
		margin-bottom: 10px;
	}
	.contactus-info {
	    margin: 28px  0;
	}
	.map iframe{
		margin-left: -158px;
	}
}