.service{border-top: 2px #F4523B solid; padding-top: 30px;}

.nav{border-bottom: 2px #F2F2F2 solid;}
.nav a{display: block; float: left; padding: 10px 7px; font-size: 18px; line-height: 25px; color: #333333; position: relative;}
.nav span{float: left; display: block; color: #CCCCCC; padding: 10px 12px; line-height: 25px; font-size: 16px;}
.nav a span{padding: 0; line-height: normal;}
.nav a.cur span{padding: 0; line-height: normal; width: 100%; height: 2px; background: #F4523B; position: absolute; left: 0; bottom: -2px;}
.nav a:hover span{padding: 0; line-height: normal; width: 100%; height: 2px; background: #F4523B; position: absolute; left: 0; bottom: -2px;}

.bgf5{background: #F5F6FA;}

.chart{margin-top: 30px;}
.statement{padding: 20px 0px; color: #999999;}
.statement .icon{font-size: 12px; margin-right: 12px;}

.title{font-size: 24px; line-height: 33px; color: #333333; font-weight: bold;}
.title span{font-size: 20px; color: #666666; margin-left: 12px; font-weight: normal;}
.title b{font-size: 20px; margin-left: 12px;}

.overview{margin-bottom: 20px; background: #ffffff; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.3); border-radius: 8px; padding: 30px; height: 460px;}

.portion{margin-bottom: 20px; background: #ffffff; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.3); border-radius: 8px; padding: 30px;}
.portion .content{}
.portion .content .item{width: 380px; height: 400px; float: left;}

.scenery{margin-bottom: 20px; background: #ffffff; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.3); border-radius: 8px; padding: 30px;}
.scenery .content{height: 600px;}
.scenery .desc{padding-top: 8px; color: #999999; text-align: right;}

.level{margin-bottom: 20px; background: #ffffff; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.3); border-radius: 8px; padding: 30px;}
.level .content{padding: 0px 46px;}
.level .content .item{width: 372px; height: 400px; float: left; padding: 0px 76px;}

.cat{padding-top: 18px;}
.cat a{display: inline-block; width: 96px; height: 40px; line-height: 40px; text-align: center; background: #FFFFFF; border: 1px solid #DCDCDC; border-radius: 4px; font-size: 16px; color: #666666; margin-right: 20px;}
.cat a:hover{background: #F4523B; border: 1px solid #F4523B; color: #ffffff;}
.cat a.cur{background: #F4523B; border: 1px solid #F4523B; color: #ffffff;}

.form{padding-top: 30px; padding-bottom: 30px;}
.form .item{float: left; margin-right: 20px; position: relative;}
.form .item select{border:1px solid #DCDCDC; border-radius:4px; width: auto; height: 40px; line-height: 40px; padding: 0px 35px 0px 15px; appearance:none; -moz-appearance:none; -webkit-appearance:none; background: #ffffff url("../images/arrow.png") no-repeat right 15px center;}
.form .item input{width: 335px; height: 16px; line-height: 16px; padding: 12px 15px; border:1px solid #DCDCDC; border-radius:4px; background: #ffffff url("../images/arrow.png") no-repeat right 15px center; text-align: center;}
.form .item .icon{font-size: 12px; color: #3f3f3f; left: 15px; top: 14px; position: absolute;}
.form .item .btn{display: block; width: 115px; line-height: 40px; line-height: 40px; text-align: center; color: #ffffff; background: #F4523B; border: 1px solid #F4523B; border-radius: 4px; font-size: 18px;}

.result{background: #ffffff; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.3); border-radius: 8px; padding: 30px; height: 460px;}

.type{background: #ffffff; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.3); border-radius: 8px; padding: 30px; height: 390px; margin: 30px 0px;}
.type .content{height: 360px;}

.rank{padding-top: 20px; color: #333333;}
.rank .item{width: 50%; float: left;}
.rank .item .tit{font-size: 18px; font-weight: bold; padding-bottom: 20px;}
.rank .item .con{}
.rank .item table{margin: 0px auto;}
.rank .item table th{font-size: 16px; font-weight: normal; color: #666666; border-bottom: 1px #DCDCDC solid; padding-bottom: 10px;}
.rank .item table td{font-size: 14px; text-align: center; padding: 8px 0px;}
.rank .item table td .b1{color: #FF3030;}
.rank .item table td .b2{color: #FFA84B;}
.rank .item table td .b3{color: #0E9CFF;}
.rank .item table .ar{text-align: right;}
.rank .item table td .bar{display: inline-block; width: 168px; height: 5px; border-radius: 5px; background: #F1F3F6; position: relative; transition: all 1s; -moz-transition: all 1s; -webkit-transition: all 1s; -o-transition: all 1s;}
.rank .item table td .cur{display: inline-block; width: auto; height: 5px; border-radius: 5px; background: #0E9CFF; position: absolute; left: 0; -webkit-animation: animate-positive 1s; animation: animate-positive 1s;}
@-webkit-keyframes animate-positive{
    0%{ width: 0; }
}
@keyframes animate-positive {
    0%{ width: 0; }
}