@charset "utf-8";
#header .menu ul li.i4 a span{background: rgba(26,85,242,0.8); }

#banner{height: 500px;overflow: hidden;}
#banner .banner .con{padding-top: 11%;}



#main{	overflow: hidden; position: relative; z-index: 1; background: url(../img/icon-01.png) no-repeat right 3% top 60px; padding-bottom: 60px;}
#main .title{text-align: left; margin-top: .5rem;}
#main .title h1{font-size: 30px; color: #000; padding-right: 100px; font-family: Times, times new roman, georgia, Cambria; text-transform: uppercase; margin-bottom: 10px;}
#main .title h2{font-size: 22px; color: #000; font-weight: normal;}
#main .box{ overflow: hidden; padding: .5rem 16px .3rem;}
#main .box .pic{float: right;}
#main .box .pic img{width: 620px; height: 360px;}
#main .box .con{}
#main .box .con p{ margin-bottom: 15px; font-size: 18px; line-height: 1.5em;}
#main .box .more{color: #fff; width: 120px; height: 32px; line-height: 32px; text-align: center; display: block;background: linear-gradient(to right, rgba(133,146,251,0.8) 0 , rgba(86,176,252,0.8)); }

#main .list{  padding: 0; width: 368px; float: left; margin: 16px;display: block;}
#main .list .pic{ box-shadow: 0 0 6px rgba(0,0,0,0.15);}
#main .list .pic img{width: 100%; display: block;}
#main .list .con{ height: 150px; padding: 15px 5px;text-align: left;}
#main .list .con h3{ margin-bottom: 10px; font-size: 14px;}
#main .list .con div{ margin-bottom: 15px; padding: 0 10px; font-size: 14px; color: #666; line-height: 1.5em;}
#main .list .more{color: #2698f8;}
#main .list .more:hover{color: #000BFF;}

@media screen and (max-width: 768px) {
	
	#header .menu ul li.nav4 a span{background:none; }
	

	
	#main{	overflow: hidden; position: relative; z-index: 1; background:none; padding: 20px;}
	#main .title{text-align: left; margin-top: 1rem;}
	#main .title h1{font-size: 22px; color: #000; padding-right: 0px; font-family: Times, times new roman, georgia, Cambria; text-transform: uppercase; margin-bottom: 10px;}
	#main .title h2{font-size: 16px; color: #000; font-weight: normal;}
	#main .box{ overflow: hidden; padding: .65rem 0;}
	#main .box .pic{float: none;}
	#main .box .pic img{width: 100%; height: auto;}
	#main .box .con{width: 100%; float:none;}
	#main .box .con p{ margin-bottom: 15px; line-height: 1.5em;}
	#main .box .more{color: #fff; width: 120px; height: 32px; line-height: 32px; text-align: center; display: block;background: linear-gradient(to right, rgba(133,146,251,0.8) 0 , rgba(86,176,252,0.8)); }
	
	#main .list{ overflow: hidden; padding: 30px 0; border-bottom: 1px solid #eee; display: block;}
	#main .list .pic{float: none; }
	#main .list .pic img{width: 100%; }
	#main .list .con{width: 100%; float:none;}
	#main .list .con h3{ margin-bottom: 10px; font-weight: normal; font-size: 22px;}
	#main .list .con p{ margin-bottom: 15px; line-height: 1.5em;}
	#main .list .more{color: #2698f8;}
	#main .list .more:hover{color: #000BFF;}	
	
}