﻿html, body { width: 100%; min-width: 1220px; height: 100%; }

/*首先设置宽度*/
.ellipsis-1 { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ellipsis-2 { display: -webkit-box; overflow: hidden; white-space: normal !important; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.hide-box { display: none; }
.clearfloat:after { height: 0; display: block; visibility: hidden; clear: both; content: ''; }
.clearfloat { zoom: 1; }
.banner-box { width: 100%; min-width: 1220px; height: 500px; position: relative; background: #fff url(../images/banner.jpg) top center no-repeat; -moz-background-size: cover; background-size: cover; }
.banner { width: 1220px; height: 500px; margin: 0 auto; padding-top: 103px; }

/*banner文字信息*/
.banner h1 { font-size: 58px; font-weight: 700; line-height: 81px; letter-spacing: 6px; color: #fff; }
.banner p { margin-top: 10px; font-size: 20px; line-height: 28px; letter-spacing: 0; color: #fff; }
.banner ul { margin-top: 29px; display: block; }
.banner ul li { margin-right: 10px; padding: 8px; display: inline-block; font-size: 16px; letter-spacing: 0; color: #fff; border: 1px solid #c0d7ff; background: rgba(137, 179, 251, .50); }
.banner span { margin-top: 35px; display: block; font-size: 14px; line-height: 20px; letter-spacing: 0; color: #abc9ff; }

/*form*/
.banner-form { height: 50px; margin-top: 5px; }
.basic-form-group { width: 300px; height: 50px; margin-right: 15px; display: inline-block; }
.basic-text-default { color: #666 !important; border: 1px solid #e8e8e8 !important; background: #fff; }
.basic-input .form-control { height: 50px; padding: 15px 15px; position: absolute; font-size: 16px; line-height: 20px; letter-spacing: 0; color: #666; }
.basic-input .input-notice { height: 20px; position: absolute; top: -20px; left: 15px; font-size: 14px; text-indent: 0; color: #a8a8a8; }
.basic-input .input-tab { position: absolute; z-index: 4; top: 15px; right: 8px; font-size: 16px; }

/*button*/
.banner-form-btn { width: 258px; font-size: 18px; line-height: 24px; letter-spacing: 0; color: #fff; border: 1px solid #fff; float: right; margin-right: 324px; }
.banner-form-btn button { width: 100%; height: 100%; border: 0; background: #2a71eb !important; }

/*error*/
.banner-form-error { margin-top: -2px; position: relative; }
.banner-form-error font { width: 315px; position: absolute; display: inline-block; display: none; font-size: 12px; text-align: left; letter-spacing: 0; color: #fff; }
.nameerror { left: 0; }
.phoneerror { left: 320px; }

/*项目评测*/
.reviews-box { width: 1220px; margin: 0 auto; margin-top: 30px; }
.reviews-box h4, .process-box h4 { font-size: 26px; text-align: center; color: #2c61c0; }
.reviews-nav { min-width: 1220px; margin-top: 30px; text-align: center; }
.reviews-nav li { margin-right: 30px;	/*margin-bottom: 14px;*/ padding-bottom: 6px; display: inline-block; font-size: 16px; line-height: 22px; cursor: pointer; color: #323232; }
.reviews-nav li:hover { color: #2c61c0; }
.reviews-nav li.active { color: #2c61c0; border-bottom: 2px solid #6393e8; }
.reviews-content { width: 1220px; margin-top: 14px; display: none; text-align: left; }
.reviews-content.active { display: block; }
.reviews-content li { width: 208px; margin-right: 30px; margin-bottom: 30px; display: inline-block; }
.reviews-content .img-box { width: 100%; height: 140px; position: relative; background-size: 100% 100%; -moz-background-size: 100% 100%;  }
.reviews-content .img-box img { width: 102px; height: 102px; margin-left: -51px; position: absolute; z-index: 10; top: 12px; left: 50%; display: none; }
.reviews-content .img-box p { width: 100%; height: 22px; margin: 0; padding-left: 4px; position: absolute; z-index: 20; bottom: 0; left: 0; font-size: 12px; line-height: 22px; opacity: .6; color: #fff; background: #000; }
.reviews-content .img-box p font { font-family: ArialMT; }
.reviews-content .title-box { width: 100%; margin-top: 11px; font-size: 15px; line-height: 20px; color: #333; }

/*测评流程*/
.process-box { width: 1220px; margin: 0 auto; }
.process-box h4 { line-height: 37px; }
.process-content { width: 100%; margin-top: 30px; }
.process-content li { width: 14.28%; display: block; float: left; }
.process-content li div { width: 110px; height: 110px; margin: 0 auto; position: relative; }
.process-content li.odd div { cursor: pointer; border: 2px solid #90b3ff; background: #e3ecff; }
.process-content li.even p { color: #fff; }
.process-content .iconfont { width: 50px; height: 50px; margin-top: -25px; margin-left: -25px; position: absolute; top: 50%; left: 50%; font-size: 50px; line-height: 50px; color: #90b3ff; }
.process-content .f48 { width: 48px; height: 48px; margin-top: -24px; margin-left: -24px; font-size: 48px; line-height: 48px; }
.process-content .f46 { width: 46px; height: 46px; margin-top: -23px; margin-left: -23px; font-size: 46px; line-height: 46px; }
.process-content .f45 { width: 45px; height: 45px; margin-top: -22px; margin-left: -22px; font-size: 45px; line-height: 45px; }
.process-content li p { margin-top: 20px; font-size: 16px; line-height: 22px; cursor: pointer; text-align: center; color: #323232; }

/*提示框*/
.tips { width: 214px; height: 62px; margin-left: -107px; position: absolute; top: 294px; left: 50%; text-align: center; }
.tips p { width: 100%; height: 100%; font-size: 18px; line-height: 62px; text-align: center; letter-spacing: 0; color: #323232; border: 1px solid rgba(0, 0, 0, .10); -moz-border-radius: 4px; border-radius: 4px; background: #fff; -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .30); -moz-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .30); box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .30); }
.animated { -webkit-animation-duration: .4s; -moz-animation-duration: .4s; animation-duration: .4s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; }
@-webkit-keyframes bounceInUp {
	from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(.215, .610, .355, 1.000); animation-timing-function: cubic-bezier(.215, .610, .355, 1.000); }
	from { -webkit-transform: translate3d(0, 350px, 0); transform: translate3d(0, 350px, 0); opacity: 0; }
	60% { -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); opacity: 1; }
	75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); }
	90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); }
	to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
@-moz-keyframes bounceInUp {
	from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(.215, .610, .355, 1.000); -moz-animation-timing-function: cubic-bezier(.215, .610, .355, 1.000); animation-timing-function: cubic-bezier(.215, .610, .355, 1.000); }
	from { -webkit-transform: translate3d(0, 350px, 0); -moz-transform: translate3d(0, 350px, 0); transform: translate3d(0, 350px, 0); opacity: 0; }
	60% { -webkit-transform: translate3d(0, -20px, 0); -moz-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); opacity: 1; }
	75% { -webkit-transform: translate3d(0, 10px, 0); -moz-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); }
	90% { -webkit-transform: translate3d(0, -5px, 0); -moz-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); }
	to { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
@keyframes bounceInUp {
	from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(.215, .610, .355, 1.000); -moz-animation-timing-function: cubic-bezier(.215, .610, .355, 1.000); animation-timing-function: cubic-bezier(.215, .610, .355, 1.000); }
	from { -webkit-transform: translate3d(0, 350px, 0); -moz-transform: translate3d(0, 350px, 0); transform: translate3d(0, 350px, 0); opacity: 0; }
	60% { -webkit-transform: translate3d(0, -20px, 0); -moz-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); opacity: 1; }
	75% { -webkit-transform: translate3d(0, 10px, 0); -moz-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); }
	90% { -webkit-transform: translate3d(0, -5px, 0); -moz-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); }
	to { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.bounceInUp { -webkit-animation-name: bounceInUp; -moz-animation-name: bounceInUp; animation-name: bounceInUp; }


.short-footer {
    margin: 30px auto 50px auto;
}

.no-focus-nav .basic-text-default {
    border:none!important;
}
