@charset "gb2312";
/*
copyright: 成都哺恩堂养老护理中心
author: 成都全时云信息技术有限公司
date: 2017-03
for: 失能照护、失智照护
*/
/* CSS Document */
/*
横幅
*/
#banner, #banner img {
	width: 100%;
}
#banner {
	font-size: 0;
	position: relative;
}
#banner div {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 1;
	margin: -37.5px 0 0 -320px;
	width: 640px;
	height: 75px;
	background: url(../images/bannerBg.png) no-repeat center center;
	text-align: center;
	font-size: 50px;
	color: #fff;
	line-height: 75px;
}

/*
主体
*/
#main {
	width: 100%;
	padding: 60px 0;
	display: table;
}
.header {
	display: table;
	height: 28px;
	overflow: hidden;
	line-height: 28px;
	padding: 0 79px;
	margin: 0 auto;
	background: url(../images/indexSec1Bg.gif) repeat-x 0 center;
}
.header div {
	font-size: 26px;
	color: #555;
	font-weight: bold;
	padding: 0 13px;
	background-color: #fff;
}
#main .main {
	width: 1248px;
	margin: 30px auto 0;
}
#main ul {
	width: 100%;
}
#main li {
	width: 312px;
	float: left;
}
#main li a {
	width: 292px;
	height: 495px;
	overflow: hidden;
	display: block;
	margin: 0 auto;
	position: relative;
}
#main li .bg, /*#main li figcaption,*/ #main li .brief {
	position: absolute;
}
#main li figcaption { display:none}


#main li .bg {
	width: 100%;
	height: 100%;
	filter: alpha(opacity=60);
	-webkit-opacity: .6;
	-moz-opacity: .6;
	-ms-opacity: .6;
	-o-opacity: .6;
	opacity: .6;
	z-index: 1;
	background-color: #e1b56e;
	bottom: -100%;	/*0*/
	-webkit-transition: bottom .3s;
	-moz-transition: bottom .3s;
	-ms-transition: bottom .3s;
	-o-transition: bottom .3s;
	transition: bottom .3s;
}
#main li.active .bg {
	bottom: 0;
}
#main li figcaption {
	bottom: 50%;
	left: 0;
	z-index: 2;
	width: 100%;
	font-size: 22px;
	color: #fff;
	text-align: center;
	line-height: 40px;
	margin-top: 20px;
	-webkit-transition: bottom,margin-top .3s;
	-moz-transition: bottom,margin-top .3s;
	-ms-transition: bottom,margin-top .3s;
	-o-transition: bottom,margin-top .3s;
	transition: bottom,margin-top .3s;
}
#main li.active a figcaption {
	bottom: 58%;
	padding-bottom: 14px;
	margin-top: 27px;
}
#main li a figcaption div {
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -24px;
	width: 48px;
	height: 2px;
	background-color: transparent;
}
#main li.active a figcaption div {
	background-color: #fff;
}
#main li .brief {
	bottom: 32%;
	left: 50%;
	z-index: 2;
	font-size: 14px;
	color: #fff;
	line-height: 20px;
	width: 182px;
	height: 60px;
	margin-left: -91px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	-webkit-transition: bottom .3s;
	-moz-transition: bottom .3s;
	-ms-transition: bottom .3s;
	-o-transition: bottom .3s;
	transition: bottom .3s;
	display: none;
}
#main .list li h2:after {
	content: "...";
}
#main li.active .brief {
	/*display: block;*/
	display: none;
	bottom: 42%;
}