html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, hr {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block
}
html {
	height: 100%
}
body {
	height: 100%;
	line-height: 1
}
ol, ul {
	list-style: none
}
blockquote, q {
	quotes: none
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none
}
table {
	border-collapse: collapse;
	border-spacing: 0
}
:focus {
	outline: none;
	border: none;
}
#wrap {
	background: #fff;
	position: relative;
	width: 950px;
	height: auto;
	margin: 0 auto;
	overflow: hidden
}
#back-font {
	display: none;
	width: 100%;
	height: auto
}
#vision {
	height: 749px;
	width: 950px;
	overflow: hidden;
	position: relative;
	background-image: url(../images/index_01.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#peo {
	background: url(../images/peo.png) no-repeat center;
	position: absolute;
	width: 566px;
	height: 702px;
	left: 424px;
	top: 48px;
	opacity: 0;
}
#tit {
	background: url(../images/tit.png) no-repeat center;
	position: absolute;
	width: 404px;
	height: 153px;
	left: 85px;
	top: 140px;
	opacity: 0;
}
#txt {
	position: absolute;
	width: 360px;
	height: 205px;
	left: 107px;
	top: 300px;
	opacity: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url(../images/cf.png);
}
#pro {
	background: url(../images/pro.png) no-repeat center;
	position: absolute;
	width: 166px;
	height: 331px;
	right: 247px;
	top: 381px;
	opacity: 0;
	z-index: 1;
}
.wrap_img {
	width: 950px;
}
#family_mov{
	position: absolute;
	width: 356px;
	height: 201px;
	left: 2px;
	top: 2px;
}
#element1 {
	background-image: url(../images/element1.png);
	height: 115px;
	width: 115px;
	position: absolute;
	left: 116px;
	top: 578px;
	opacity: 0;
	z-index: 1;
}
#element2 {
	background-image: url(../images/element2.png);
	height: 115px;
	width: 115px;
	position: absolute;
	left: 345px;
	top: 578px;
	opacity: 0;
	z-index: 1;
}
#section2 {
	height: 1257px;
	width: 950px;
	position: relative;
	background-image: url(../images/index_02.jpg);
}
#f1 {
	display: block;
	position: absolute;
	width: 111px;
	height: 111px;
	left: 176px;
	top: 290px;
	background-image: url(../images/fo1.png);
	background-repeat: no-repeat;
	background-position: center;
}

.more {
	background-image: url(../images/more.png);
	height: 43px;
	width: 301px;
	cursor: pointer;
	position: absolute;
	left: 332px;
	top: 719px;
}

.tip1 {
	background-image: url(../images/tip1.png);
	height: 116px;
	width: 116px;
	position: absolute;
	cursor: pointer;
	left: 425px;
	top: 48px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.tip1:hover {
	background-image: url(../images/tip1_on.png);
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;

}
.tip2 {
	background-image: url(../images/tip2.png);
	height: 116px;
	width: 116px;
	position: absolute;
	cursor: pointer;
	left: 686px;
	top: 160px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.tip2:hover {
	background-image: url(../images/tip2_on.png);
		-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;

}
.tip3 {
	background-image: url(../images/tip3.png);
	height: 116px;
	width: 116px;
	position: absolute;
	cursor: pointer;
	left: 775px;
	top: 413px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.tip3:hover {
	background-image: url(../images/tip3_on.png);
		-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;

}
.tip4 {
	background-image: url(../images/tip4.png);
	height: 116px;
	width: 116px;
	position: absolute;
	cursor: pointer;
	left: 685px;
	top: 659px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.tip4:hover {
	background-image: url(../images/tip4_on.png);
		-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;

}
.tip5 {
	background-image: url(../images/tip5.png);
	height: 116px;
	width: 116px;
	position: absolute;
	cursor: pointer;
	left: 154px;
	top: 659px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.tip5:hover {
	background-image: url(../images/tip5_on.png);
		-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.tip6 {
	background-image: url(../images/tip6.png);
	height: 116px;
	width: 116px;
	position: absolute;
	cursor: pointer;
	left: 65px;
	top: 413px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.tip6:hover {
	background-image: url(../images/tip6_on.png);
		-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.tip7 {
	background-image: url(../images/tip7.png);
	height: 116px;
	width: 116px;
	position: absolute;
	cursor: pointer;
	left: 154px;
	top: 159px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.tip7:hover {
	background-image: url(../images/tip7_on.png);
		-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
#section3 {
	height: 557px;
	width: 950px;
	position: relative;
	background-image: url(../images/index_03.jpg);
}
.blogger1 {
	background-image: url(../images/blogger1.png);
	height: 320px;
	width: 260px;
	position: absolute;
	left: 75px;
	top: 211px;
	overflow: hidden;
	cursor: pointer;
}
.blogger2 {
	background-image: url(../images/blogger2.png);
	height: 320px;
	width: 260px;
	position: absolute;
	left: 345px;
	top: 211px;
	overflow: hidden;
	cursor: pointer;
}
.blogger3 {
	background-image: url(../images/blogger3.png);
	height: 320px;
	width: 260px;
	position: absolute;
	left: 616px;
	top: 211px;
	overflow: hidden;
	cursor: pointer;
}
.blogger1_btn {
	height: 303px;
	width: 260px;
	overflow: hidden;
	position: absolute;
}
.blogger1_on {
	position: absolute;
	top: 62px;
	left: 0px;
}
.blogger2_btn {
	height: 303px;
	width: 260px;
	overflow: hidden;
	position: absolute;
}
.blogger2_on {
	position: absolute;
	top: 62px;
	left: 0px;
}
.blogger3_btn {
	height: 303px;
	width: 260px;
	overflow: hidden;
	position: absolute;
}
.blogger3_on {
	position: absolute;
	top: 62px;
	left: 0px;
}
#section4 {
	width: 950px;
	position: relative;
	background-image: url(../images/index_04.jpg);
	height: 409px;
}
#section5 {
	width: 950px;
	position: relative;
}