﻿#main .successUl li {
	float: left;
	width: 367px;
	height: 340px;
	padding: 0 0 35px 35px;
}
#main .successUl li a {
	border: 1px solid #EDEDED;
	background-color: #fff;
	display: block;
	padding: 21px;
	width: 325px;
	height: 298px;
	position: relative;
	cursor: pointer;
}
#main .successUl li a:hover {
	border: 1px solid #70A8D6;
}
#main .successUl li .photo {
	background-color: #F0F1F2;
	border-radius: 3px;
	margin-bottom: 12px;
	padding: 14px;
}
#main .successUl li .photo img {
	width: 100%;
}

#main .successUl li h3 {
	color: #3e3e3e;
	font-size: 20px;
	font-weight: normal;
}
#main .successUl li .more {
	position: absolute;
	right: 7px;
	bottom: 30px;
}
	@media all and (min-width: 961px) and (max-width: 1178px) {
		#main .successUl li {
			padding: 0 0 14px 14px;
			width: 299px;
			height: 278px; 
		}
		#main .successUl li a {
			width: 279px;
			height: 256px;
			padding: 10px;
		}
		
		#main .successUl li .more {
			bottom: 10px;
		}
		}
	
	@media all and (min-width: 0) and (max-width: 960px) {
		#main .successUl {
			margin: 0;
			overflow: hidden;
			width: auto;
		}
		#main .successUl li {
			height: auto;
			padding: 2%;
			width: 46%;
		}
		#main .successUl li a {
			width: auto;
			background: none;
			padding: 3%;
			height: auto;
			box-shadow: 1px 1px 2px #eee, -1px -1px 2px #eee;
		}
		#main .successUl li .photo {
			padding: 5%;
		}
		#main .successUl li .photo img {
			width: 100%;
		}
		#main .successUl li h3 {
			font-size: 15px;
		}
		#main .successUl li .more {
			position: static;
		}
		#main .successUl li .more img {
			width: 65px;
			float: right;
		}
		#main .successUl li .more a img {
			width: 100%;
		}
	}