@charset "utf-8";

/* banner */
.banner{ position:relative;height:560px;width:100%;overflow:hidden}
.banner-slider{ position:absolute;width:1920px!important;margin-left:-960px;left:50%;height:560px}
		.banner-viewport a{ display:block; width:100%; height:560px; overflow:hidden;}
		.banner-control-nav{ position:absolute; right:0; bottom:18px; left:0; padding:0; margin:0;list-style:none; text-align:center;}
			.banner-control-nav li{ display:inline-block; margin:0 6px; vertical-align:middle;}
				.banner-control-nav li a{ display:block; width:8px; height:8px; overflow:hidden; border:1px solid #e63946; -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%; text-indent:999px;}
				.banner-control-nav li a.banner-active{ width:15px; height:15px; background-color:#e63946;}
.search{ padding:42px 0; border-bottom:1px solid #8E8E8E;}
	.search-title{ height:33px; line-height:33px; overflow:hidden; font-size:15px; color:#8B8A8A;}
		.search-title span{ margin-right:15px; color:#3A3939;}
		.search-title a{ margin-right:13px; color:#8B8A8A;}
	/*start from 表单 */	
.offer{ width:290px; height:428px; overflow:hidden; background-color:rgba(0,0,0,.2);}
		.offer-title{ height:83px; overflow:hidden; padding-top:14px; color:#fff; text-align:center; background:url(../images/bg_offer_title.png) no-repeat center bottom;}
			.offer-title h3{ margin:0 0 9px; font-size:31px;}
			.offer-title p{ margin:0; font-size:20px;}
		.form{ padding:19px 46px;}
			.form-group{ position:relative; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; margin-bottom:16px;}
				.form-control{ display:block; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; width:100%; height:31px; line-height:15px; padding:7px 8px; border:1px solid #A8A8A8; outline:0; font-size:15px; background-color:#fff;}
				.form-control::-moz-placeholder{ color:#bbb;}
				.form-control::-webkit-input-placeholder{ color:#bbb;}
				.form-control:-ms-input-placeholder{ color:#bbb;}
				label.form-control{ position:relative; color:#bbb; cursor:pointer;}
				label.form-control:before{ position:absolute; top:50%; right:6px; width:9px; height:9px; margin-top:-5px; border:1px solid #ddd; content:'';}
				.form-radio .active{ color:#E63946;}
				.form-radio .active:before{ background-color:#E63C49;}
				.form-group ins{ position:absolute; top:1px; right:1px; bottom:1px; display:block; line-height:30px; padding-right:8px; font-size:16px; color:#E63946; text-decoration:none; background-color:#fff;}
				.form-group .btn{ display:block; width:100%; padding:0; border:0; color:#fff; background-color:#E63C49;}
				.form-group .btn-code{ height:31px; font-size:15px;}
				.form-group .btn-submit{ height:46px; font-size:23px; font-weight:bold;}
				/*end from 表单 */	
/* hardcover */
.hardcover-slider{ width:852px;}
	.hardcover-slider .pic{ display:block; width:645px; height:464px;overflow:hidden;}
		.hardcover-slider .pic a{ display:block;}
			.hardcover-slider .pic img{ display:block; width:100%; height:464px;}
	.hardcover-slider ul{position:relative; width:207px;}
		.hardcover-slider li{ height:116px; line-height:116px; overflow:hidden; font-size:18px; color:#fff; text-align:center; cursor:pointer; -webkit-transition:all .2s; -moz-transition:all .2s; -ms-transition:all .2s; -o-transition:all .2s; transition:all .2s;background-repeat:no-repeat;background-position:13px center;}
		.hardcover-slider li.h0{ background-color:#4E4E4E;}
		.hardcover-slider li.h1{ background-color:#484848;}
		.hardcover-slider li.h2{ background-color:#464646;}
		.hardcover-slider li.h3{ background-color:#3D3D3D;}
		.hardcover-slider li.active{ padding-left:39px; margin-left:-39px; font-weight:bold; background-image:url(../images/icon_hardcover.png);background-color:#E63C49;}

/* site */
.site{ background-color:#2B2C30;}
	.site .tab-btn a{ color:#fff;}

/* info */
.info{ height:572px; overflow:hidden; padding:40px 0 0; background-color:#F5F5F5;}
	.info .container{ padding:74px 0 0; background:url(../images/bg_index01.png) no-repeat right top;}
		.info .pic{ position:relative; width:430px; height:286px; overflow:hidden; margin:70px 104px 0 0;}
		.info .pic:after{ position:absolute; top:0; right:0; bottom:0; left:0; background:url(../images/bg_index01_pic.png) no-repeat; content:'';}
			.info .pic img{ display:block; width:100%;}
			.info .pic:hover img{ -webkit-animation:bounce .6s; -o-animation:bounce .6s; animation:bounce .6s;}
		.info h3{ margin:0; font-size:42px; font-weight:normal; color:#E63946;}
		.info h4{ line-height:22px; margin:0; font-size:13px; font-weight:normal; color:#767676;}
		.info h5{ margin:24px 0 10px; font-size:35px; color:#333232;}
		.info h6{ margin:0; font-size:20px; color:#767676;}
			.info h6 span{ color:#F49D37;}
		.info ul{ padding:0; margin:34px 0 0; list-style:none;}
			.info li{ float:left; width:160px; font-size:14px; color:#767575; text-align:center;}
				.info li p{ width:95px; height:95px; line-height:95px; overflow:hidden; margin:0 auto 13px; border-width:1px; border-style:solid; -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%; font-size:25px; background-color:#F5F5F5;}
				.info li:hover p{ -webkit-animation:flip 1s; -o-animation:flip 1s; animation:flip 1s;}
				.info li.green p{ border-color:#06A77D; color:#06A77D;}
				.info li.coffee p{ border-color:#BE7C4D; color:#BE7C4D;}
				.info li.blue p{ border-color:#4DAAA8; color:#1C5253;}

.advantage{ position:relative; height:700px; background:url(../images/bg_index02.jpg) no-repeat center top;}
	.advantage .pic{ position:absolute; bottom:-194px; left:50%; margin-left:-315px; -webkit-animation:movePic 3s infinite; -o-animation:movePic 3s infinite; animation:movePic 3s infinite;}
	.advantage li{ position:absolute; -webkit-transition:all .4s ease; -moz-transition:all .4s ease; -ms-transition:all .4s ease; -o-transition:all .4s ease; transition:all .4s ease;}
	.advantage li.a0,.advantage li.a1,.advantage li.a2{ top:219px; right:50%; margin-right:-68px;}
	.advantage li.a3,.advantage li.a4,.advantage li.a5{ top:219px; left:50%; margin-left:-70px;}
	.advantage li.a0{ color:#28AFB0;}
	.advantage .active li.a0{ top:81px; margin-right:244px; color:#28AFB0;}
	.advantage li.a1{ color:#849324;}
	.advantage .active li.a1{ top:219px; right:50%; margin-right:382px; color:#849324;}
	.advantage li.a2{ color:#F05D5E;}
	.advantage .active li.a2{ top:357px; right:50%; margin-right:244px; color:#F05D5E;}
	.advantage li.a3{ color:#FC2F00;}
	.advantage .active li.a3{ top:81px; left:50%; margin-left:242px; color:#FC2F00;}
	.advantage li.a4{ color:#A8C686;}
	.advantage .active li.a4{ top:219px; left:50%; margin-left:380px; color:#A8C686;}
	.advantage li.a5{ color:#4F6D7A;}
	.advantage .active li.a5{ top:357px; left:50%; margin-left:242px; color:#4F6D7A;}
		.advantage li p{ width:78px; height:93px; line-height:24px; overflow:hidden; padding:45px 30px 0; margin:0; font-size:16px; text-align:center; background-color:rgba(0,0,0,.3);}
		.advantage li.a0:hover p,.advantage li.a1:hover p,.advantage li.a2:hover p{ -webkit-animation:flipInY .6s; -o-animation:flipInY .6s; animation:flipInY .6s;}
		.advantage li.a3:hover p,.advantage li.a4:hover p,.advantage li.a5:hover p{ -webkit-animation:zoomIn .6s; -o-animation:zoomIn .6s; animation:zoomIn .6s;}
	.advantage .btn{ position:absolute; display:block; top:348px; left:50%; width:90px; height:32px; line-height:32px; overflow:hidden; margin-left:-49px; border:1px solid #fff; -webkit-border-radius:16px; -moz-border-radius:16px; border-radius:16px; background:url(../images/icon_advantage.png) no-repeat 100%;}
	.advantage .btn:hover{ -webkit-animation:moveBg .4s forwards; -o-animation:moveBg .4s forwards; animation:moveBg .4s forwards;}
@-webkit-keyframes movePic{
	0%{-webkit-transform:translateY(0);}
	50%{-webkit-transform:translateY(10px);}
	100%{-webkit-transform:translateY(0);}
}
@-o-keyframes movePic{
	0%{-o-transform:translateY(0);}
	50%{-o-transform:translateY(10px);}
	100%{-o-transform:translateY(0);}
}
@-moz-keyframes movePic{
	0%{-moz-transform:translateY(0);}
	100%{-moz-transform:translateY(10px);}
	50%{-moz-transform:translateY(0);}
}
@keyframes movePic{
	0%{transform:translateY(0);}
	50%{transform:translateY(10px);}
	100%{transform:translateY(0);}
}
@-webkit-keyframes moveBg{
	0%{background-position-x:100%;}
	100%{background-position-x:0%; background-color:#fff;}
}
@-o-keyframes moveBg{
	0%{background-position-x:100%;}
	100%{background-position-x:0%; background-color:#fff;}
}
@-moz-keyframes moveBg{
	0%{background-position-x:100%;}
	100%{background-position-x:0%; background-color:#fff;}
}
@keyframes moveBg{
	0%{background-position-x:100%;}
	100%{background-position-x:0%; background-color:#fff;}
}

/* team */
.team{ padding-top:143px;}
	.team-slider{ position:relative; padding:0 110px;}
		.team-slider .slides li{ padding-top:114px;}
			.team-slider .slides li .desc{ padding:0 176px 36px; border:4px solid #E63C49; text-align:center;}
				.team-slider .slides li .desc .pic{ display:block; width:225px; height:225px; margin:-118px auto 0; -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%;}
				.team-slider .slides li .desc h3{ margin:30px 0 8px; font-size:26px; font-weight:normal;}
				.team-slider .slides li .desc h4{ margin:0 0 30px; font-size:15px; font-weight:normal;}
				.team-slider .slides li .desc p{ line-height:32px; margin:0; font-size:14px; color:#656565;}
		.team-direction-nav{ padding:0; margin:0;list-style:none;}
			.team-direction-nav a{ position:absolute; top:50%; display:block; width:48px; height:48px; line-height:48px; overflow:hidden; margin-top:24px; -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%; font-size:34px; font-weight:bold; font-family:simsun; color:#fff; text-align:center; text-decoration:none; background-color:#EBEBEB;}
			.team-direction-nav a.team-prev{ left:0;}
			.team-direction-nav a.team-next{ right:0;}

/* progress */
.progress{ background:url(../images/bg_progress.jpg) repeat center top;}
	.progress-list li{ float:left; width:25%; text-align:center;}
		.progress-list li .pic{ position:relative; display:block; width:145px; margin:0 auto;}
		.progress-list li .pic:after{ position:absolute; top:0; right:0; bottom:0; left:0; background:url(../images/bg_progress_pic.png) no-repeat; content:'';}
		.progress-list li.p0 .pic:after{ -webkit-animation:rollP0 2s linear infinite; -o-animation:rollP0 2s linear infinite; animation:rollP0 2s linear infinite;}
		.progress-list li.p1 .pic:after{ -webkit-animation:rollP1 2s linear infinite; -o-animation:rollP1 2s linear infinite; animation:rollP1 2s linear infinite;}
		.progress-list li.p2 .pic:after{ -webkit-animation:rollP2 2s linear infinite; -o-animation:rollP2 2s linear infinite; animation:rollP2 2s linear infinite;}
		.progress-list li.p3 .pic:after{ -webkit-animation:rollP3 2s linear infinite; -o-animation:rollP3 2s linear infinite; animation:rollP3 2s linear infinite;}
			.progress-list li .pic img{ display:block; width:100%;}
		.progress-list li h3{ margin:30px 0 15px;font-size:18px; font-weight:normal; color:#555556;}
		.progress-list li p{ margin:0;}
	.progress footer{ margin-top:75px; text-align:center;}
		.progress footer h3{ width:115px; height:25px; line-height:25px; overflow:hidden; margin:0 auto 33px; font-size:16px; font-weight:normal; color:#fff; background-color:#787878;}
		.progress footer a{ font-size:33px; color:#292A2E; letter-spacing:1px;}
		.progress footer a:hover{ color:#E63946; text-decoration:none;}
@-webkit-keyframes rollP0{
	0%{-webkit-transform:rotate(0deg);}
	100%{-webkit-transform:rotate(360deg);}
}
@-o-keyframes rollP0{
	0%{-o-transform:rotate(0deg);}
	100%{-o-transform:rotate(360deg);}
}
@-moz-keyframes rollP0{
	0%{-moz-transform:rotate(0deg);}
	100%{-moz-transform:rotate(360deg);}
}
@keyframes rollP0{
	0%{transform:rotate(0deg);}
	100%{transform:rotate(360deg);}
}
@-webkit-keyframes rollP1{
	0%{-webkit-transform:rotate(270deg);}
	100%{-webkit-transform:rotate(630deg);}
}
@-o-keyframes rollP1{
	0%{-o-transform:rotate(270deg);}
	100%{-o-transform:rotate(630deg);}
}
@-moz-keyframes rollP1{
	0%{-moz-transform:rotate(270deg);}
	100%{-moz-transform:rotate(630deg);}
}
@keyframes rollP1{
	0%{transform:rotate(270deg);}
	100%{transform:rotate(630deg);}
}
@-webkit-keyframes rollP2{
	0%{-webkit-transform:rotate(180deg);}
	100%{-webkit-transform:rotate(540deg);}
}
@-o-keyframes rollP2{
	0%{-o-transform:rotate(180deg);}
	100%{-o-transform:rotate(540deg);}
}
@-moz-keyframes rollP2{
	0%{-moz-transform:rotate(180deg);}
	100%{-moz-transform:rotate(540deg);}
}
@keyframes rollP2{
	0%{transform:rotate(180deg);}
	100%{transform:rotate(540deg);}
}
@-webkit-keyframes rollP3{
	0%{-webkit-transform:rotate(90deg);}
	100%{-webkit-transform:rotate(450deg);}
}
@-o-keyframes rollP3{
	0%{-o-transform:rotate(90deg);}
	100%{-o-transform:rotate(450deg);}
}
@-moz-keyframes rollP3{
	0%{-moz-transform:rotate(90deg);}
	100%{-moz-transform:rotate(450deg);}
}
@keyframes rollP3{
	0%{transform:rotate(90deg);}
	100%{transform:rotate(450deg);}
}

/* about */
.about{ padding-top:113px; background:url(../images/bg_about.jpg) no-repeat center top;}
	.about .container{ overflow:hidden;}
		.about ul{ margin:0 -104px 203px 0;}
			.about li{ position:relative; float:left; width:219px; margin-right:104px;}
			.about li:after{ position:absolute; top:0; right:0; bottom:0; left:0; background:url(../images/bg_about_li.png) no-repeat; content:'';}
				.about li img{ display:block; width:100%;}
		.about .pic{ width:597px; height:385px; overflow:hidden;}
			.about .pic img{ display:block; width:100%; -webkit-transition:all .4s; -moz-transition:all .4s; -ms-transition:all .4s; -o-transition:all .4s; transition:all .4s; -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1);}
			.about .pic:hover img{ -webkit-transform:scale(1.4); -moz-transform:scale(1.4); -ms-transform:scale(1.4); -o-transform:scale(1.4); transform:scale(1.4);}
		.about .desc{ height:344px; overflow:hidden; padding:41px 52px 0; background-color:#ECECEC;}
			.about .desc h3{ margin:0; font-size:28px; font-weight:normal;}
			.about .desc h4{ margin:19px 0 40px; font-size:13px; font-weight:normal;}
			.about .desc p{ line-height:24px; margin:0; font-size:14px; text-indent:2em;}
			.about .desc .btn{ display:block; width:90px; height:32px; overflow:hidden; margin-top:28px; -webkit-border-radius:32px; -moz-border-radius:32px; border-radius:32px; background:url(../images/icon_advantage.png) no-repeat 100% #E63C49;}
			.about .desc .btn:hover{ -webkit-animation:moveBg .4s forwards; -o-animation:moveBg .4s forwards; animation:moveBg .4s forwards;}

/* mark */
.mark-list ul{ margin-right:-16px;}
	.mark-list li{ float:left; width:285px; margin:0 16px 16px 0; text-align:center;}
		.mark-list li a{ display:block; -webkit-transition:all .2s; -moz-transition:all .2s; -ms-transition:all .2s; -o-transition:all .2s; transition:all .2s;}
		.mark-list li a:hover{ color:#E63C49; text-decoration:none;}
			.mark-list li .pic{ overflow:hidden;}
				.mark-list li .pic img{ display:block; width:100%; height:220px; -webkit-transition:all .4s; -moz-transition:all .4s; -ms-transition:all .4s; -o-transition:all .4s; transition:all .4s; -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1);}
				.mark-list li a:hover .pic img{ -webkit-transform:scale(1.4); -moz-transform:scale(1.4); -ms-transform:scale(1.4); -o-transform:scale(1.4); transform:scale(1.4);}
			.mark-list li h3{ height:40px; line-height:40px; overflow:hidden; margin:20px 0 0; font-size:16px; font-weight:normal;}
			.mark-list li time{ display:block; font-size:15px;}