﻿@charset "utf-8";
/*当页面小于992px的时执行下面的CSS*/
@media screen and (max-width: 992px){
	.news{ width:100%; height:auto; overflow:hidden; margin-top:0px}
	.news .left{width:100%; height:auto; }
	.news .right{ display:none}
	
	/*新闻*/
	.ul_news{ width:100%; height:auto; overflow:hidden; margin-top:30px; padding:15px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.ul_news li{width:100%; height:auto; margin-bottom:40px; overflow:hidden; box-shadow: 0 0 15px #ccc; position:relative; padding-bottom:15px}
	.ul_news li .l{width:100%; height:auto;}
	.ul_news li .l img{width:100%; height:auto}
	.ul_news li .r{width:100%; height:auto; padding:15px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.ul_news li h4{ font-size:0.2rem; line-height:0.3rem; font-weight:bold; height:auto; margin-top:10px}
	.ul_news li h4 a{ color:#333333}
	.ul_news li h4 a:hover{ color:#dc7f04}
	.ul_news li p{ font-size:0.16rem; color:#999999; margin-top:10px; height:auto; line-height:0.22rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2;/*显示几行*/-webkit-box-orient: vertical;}
	.ul_news li span{color: #a3afb7; font-size:0.14rem; display:inline-table; margin-top:10px}
	.ul_news li i{color: #a3afb7; font-size:0.14rem; display:inline-table; margin-top:10px; background:url(../images/click.png) no-repeat left center; padding-left:26px; margin-left:20px;}
	.ul_news li em{ position:absolute; bottom:0; right:0; width:55%; height:3px; background-color:#d4d4d4}
	.ul_news li:hover em{ background-color:#dc7f04}
	.ul_news li b{position:absolute; right:20px; bottom:20px; width:44px; height:44px; display:-ms-flexbox; display:flex; -ms-flex-pack:center; justify-content:center; -ms-flex-align:center; align-items:center; border-radius:50%; box-shadow:0 0 35px 0 rgba(215,215,215,.68) ;color:#dc7f04; transition:background .2s ease,color .2s ease; background:#fff url(../images/newsjt.jpg) no-repeat center}
	.ul_news li:hover b{background:#fff url(../images/newsjt2.jpg) no-repeat center}
	/*图片文字左右分开
	<dl class="dl">
		<a href="../p/?<%=rs_page("id")%>.html">
		<dt><img src="<%=rs_page("a_img")%>" /></dt>
		<dd>
			<p><%=rs_page("a_name")%></p>
			
		</dd>
		</a>
	</dl>
	*/
	.dl{ width:100%; height:auto; overflow:hidden}
	.dl dt{ float:left; width:35%; height:auto}
	.dl dt img{width:100%; height:auto}
	.dl dd{ float:right; width:62%; height:auto}
	.dl dd p{line-height:26px}
	.dl dd span{ display:block; margin-top:15px}
	.dl+dl{ margin-top:15px; border-top:1px solid #EAEAEA; padding-top:15px}
	/*左右分开end*/
	
	/*view*/
	.view_banner{width:100%; height:auto; background-color:#e1e9ed;  position:relative}
	.view_banner:before{content: ""; position:absolute; top:0; left:0; width:100%; height:30px; box-shadow:inset 0px 15px 10px -15px #c7cccf}
	
	.view_box{ width:95%; height:auto; margin:0 auto; overflow:hidden; padding:22px 0}
	.view_box .l{width:100%; height:auto}
	.view_box .l img{width:100%; height:auto}
	
	.view_box .r{width:100%; height:auto; margin-top:30px}
	.view_box .r em{ font-size:0.14rem; color:#dc7f04; background:url(../images/fenlei.png) no-repeat left center; padding-left:30px}
	.view_box .r em a{color:#dc7f04}
	.view_box .r h1{ font-size:0.2rem; font-weight:600; line-height:0.32rem; margin-top:20px}
	
	/* 动画*/
	.waves {
		position: relative;
		width: 100%;
		height: 150px;
		margin-bottom: -7px; /*Fix for safari gap*/
		min-height: 100px;
		max-height: 150px;
	}
	.parallax > use {animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;}
	.parallax > use:nth-child(1) {animation-delay: -2s; animation-duration: 7s;}
	.parallax > use:nth-child(2) {animation-delay: -3s; animation-duration: 10s;}
	.parallax > use:nth-child(3) {animation-delay: -4s; animation-duration: 13s;}
	.parallax > use:nth-child(4) {animation-delay: -5s; animation-duration: 20s;}
	@-webkit-keyframes move-forever{
		0%{-webkit-transform:translate3d(-90px,0,0);transform:translate3d(-90px,0,0)}
		100%{-webkit-transform:translate3d(85px,0,0);transform:translate3d(85px,0,0)}
	}
	@keyframes move-forever {
		0% {-webkit-transform:translate3d(-90px,0,0);transform: translate3d(-90px, 0, 0);}
		100% {-webkit-transform:translate3d(85px,0,0);transform: translate3d(85px, 0, 0);}
	}
	/* 动画end */
	
}

/*当页面大于992px时候*/
@media screen and (min-width:992px){
	.news{ width:100%; height:auto; overflow:hidden; margin-top:30px}
	.news .left{ float:left; width:72%; height:auto; }
	.news .right{ float:right; width:25%; height:auto; border:1px solid #EAEAEA; padding:20px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.news .right h6{ color:#000; font-size:18px; font-weight:bold; position:relative;}
	.news .right h6:before{content: ""; width:40px; height:3px; background-color:#dc7f04; position:absolute; left:0; top:40px}
	
	.news_right{ width:100%; height:auto; overflow:hidden; margin-top:40px}
	.news_right li{height:auto; font-size:16px; line-height:27px; padding-right:26px; position:relative}
	.news_right li:before{content: "〉"; width:20px; height:22px; line-height:22px; color:#CCC; text-align:right; position:absolute; right:-5px; top:51%}
	.news_right li:hover:before{ color:#F00}
	.news_right li a{ display:block}
	.news_right li+li{ border-top:1px solid #f3f3f3; margin-top:20px; padding-top:20px}
	
	/*新闻*/
	.ul_news{ width:100%; height:auto; overflow:hidden; margin-top:30px; padding:15px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.ul_news li{width:100%; height:auto; margin-bottom:40px; overflow:hidden; box-shadow: 0 0 15px #ccc; position:relative}
	.ul_news li .l{ float:left; width:35%; height:auto;}
	.ul_news li .l img{ max-width:100%; height:auto}
	.ul_news li .r{ float:right; width:62%; height:auto; padding:15px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.ul_news li h4{ font-size:24px; line-height:40px; font-weight:bold; height:auto; margin-top:20px}
	.ul_news li h4 a{ color:#333333}
	.ul_news li h4 a:hover{ color:#dc7f04!important}
	.ul_news li p{ font-size:16px; color:#999999; margin-top:10px; height:auto; line-height:27px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2;/*显示几行*/-webkit-box-orient: vertical;}
	.ul_news li span{color: #a3afb7; font-size: 16px; display:inline-table; margin-top:10px}
	.ul_news li i{color: #a3afb7; font-size: 16px; display:inline-table; margin-top:10px; background:url(../images/click.png) no-repeat left center; padding-left:26px; margin-left:20px;}
	.ul_news li em{ position:absolute; bottom:0; right:0; width:55%; height:3px; background-color:#d4d4d4}
	.ul_news li:hover em{ background-color:#dc7f04}
	.ul_news li b{position:absolute; right:20px; bottom:20px; width:44px; height:44px; display:-ms-flexbox; display:flex; -ms-flex-pack:center; justify-content:center; -ms-flex-align:center; align-items:center; border-radius:50%; box-shadow:0 0 35px 0 rgba(215,215,215,.68) ;color:#dc7f04; transition:background .2s ease,color .2s ease; background:#fff url(../images/newsjt.jpg) no-repeat center}
	.ul_news li:hover b{background:#fff url(../images/newsjt2.jpg) no-repeat center}
	
	/*图片文字左右分开
	<dl class="dl">
		<a href="../p/?<%=rs_page("id")%>.html">
		<dt><img src="<%=rs_page("a_img")%>" /></dt>
		<dd>
			<p><%=rs_page("a_name")%></p>
			
		</dd>
		</a>
	</dl>
	*/
	.dl{ width:100%; height:auto; overflow:hidden}
	.dl dt{ float:left; width:35%; height:auto; overflow:hidden;}
	.dl dt img{width:100%; height:auto; -moz-transition:all .8s ease 0s; -ms-transition:all .8s ease 0s; -o-transition:all .8s ease 0s; -webkit-transition:all .8s ease 0s; transition:all .8s ease 0s;}
	.dl dt:hover img{ -moz-transform:scale(1.1,1.1); -ms-transform:scale(1.1,1.1); -o-transform:scale(1.1,1.1); -webkit-transform:scale(1.1,1.1); transform:scale(1.1,1.1);}
	.dl dd{ float:right; width:62%; height:auto}
	.dl dd p{line-height:26px}
	.dl dd span{ display:block; margin-top:15px}
	.dl+dl{ margin-top:15px; border-top:1px solid #EAEAEA; padding-top:15px}
	/*左右分开end*/
	
	/*view*/
	.view_banner{width:100%; height:auto; background-color:#e1e9ed;  position:relative}
	.view_banner:before{content: ""; position:absolute; top:0; left:0; width:100%; height:30px; box-shadow:inset 0px 15px 10px -15px #c7cccf}
	
	.view_box{ width:100%; height:auto; overflow:hidden; padding:80px 0}
	.view_box .l{ float:left; width:45%; height:auto}
	.view_box .l img{width:100%; height:auto}
	.view_box .r{ float:right; width:50%; height:auto; padding-top:100px}
	.view_box .r em{ font-size:14px; color:#dc7f04; background:url(../images/fenlei.png) no-repeat left center; padding-left:30px}
	.view_box .r em a{color:#dc7f04}
	.view_box .r h1{ font-size:28px; font-weight:600; line-height:48px; margin-top:20px}
	
	
	/* 动画*/
	.waves {
		position: relative;
		width: 100%;
		height: 150px;
		margin-bottom: -7px; /*Fix for safari gap*/
		min-height: 100px;
		max-height: 150px;
	}
	.parallax > use {animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;}
	.parallax > use:nth-child(1) {animation-delay: -2s; animation-duration: 7s;}
	.parallax > use:nth-child(2) {animation-delay: -3s; animation-duration: 10s;}
	.parallax > use:nth-child(3) {animation-delay: -4s; animation-duration: 13s;}
	.parallax > use:nth-child(4) {animation-delay: -5s; animation-duration: 20s;}
	@-webkit-keyframes move-forever{
		0%{-webkit-transform:translate3d(-90px,0,0);transform:translate3d(-90px,0,0)}
		100%{-webkit-transform:translate3d(85px,0,0);transform:translate3d(85px,0,0)}
	}
	@keyframes move-forever {
		0% {-webkit-transform:translate3d(-90px,0,0);transform: translate3d(-90px, 0, 0);}
		100% {-webkit-transform:translate3d(85px,0,0);transform: translate3d(85px, 0, 0);}
	}
	/* 动画end */
}