@charset "utf-8";

/* CSS Document */

.section.banner {
    width: 100%;
    height: 499px;
    background: url("../images/core-banner.png") no-repeat center;
    position: relative;
}

.section.banner .bg {
    width: 100%;
    height: 62px;
    background: url("../images/opacity.png");
    position: absolute;
    bottom: 0;
    left: 0
}

.core-function {
    position: relative;
}

.core-function .hd {
    width: 1024px;
    height: 62px;
    line-height: 62px;
    font-size: 18px;
    color: #fff;
    text-align: center;
    position: absolute;
    top: -62px;
    left: 50%;
    margin-left: -512px;
}

.core-function .hd li {
    float: left;
    width: 50%;
}

.tab-bar {
    width: 1024px;
}

.core-function .hd li.on {
    background: url("../images/opacity.png");
    color: #a1d424;
}


/*功能总览 tab*/

.class-warp {
    width: 100%;
    padding-top: 55px;
}

.class-inner {
    width: 1024px;
    margin: 0 auto;
}

.class-title {
    width: 100%;
    text-align: center;
}

.class-title h2 {
    font-size: 32px;
    color: #333;
}

.class-title h3 {
    font-size: 26px;
    color: #333;
    font-weight: normal;
    line-height: 40px;
    margin-top: 20px;
}

.title-bottom-border {
    font-size: 14px;
    color: #fff;
    line-height: 22px;
}

.store-operate {
    height: 555px;
    margin-bottom: 30px;
    overflow: hidden;
    position: relative;
}

.store-operate .btn-show {
    width: 100px;
    height: 40px;
    font-size: 14px;
    line-height: 40px;
    text-align: center;
    border: 1px solid #eee;
    position: absolute;
    left: 50%;
    bottom: 0px;
    margin-left: -51px;
    padding-top: 0;
    cursor: pointer;
}

.store-operate .item {
    width: 253px;
    height: 160px;
    padding-top: 66px;
    margin-right: 128px;
    margin-top: 36px;
    float: left;
    text-align: center;
    position: relative;
}

.list .item:before {
    content: '';
    display: block;
    width: 60px;
    height: 60px;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -30px;
}

.store-operate .item01:before {
    background: url("../images/icon.png") no-repeat 0 0;
}

.store-operate .item02:before {
    background: url("../images/icon.png") no-repeat -60px 0;
}

.store-operate .item03:before {
    background: url("../images/icon.png") no-repeat -120px 0;
}

.store-operate .item04:before {
    background: url("../images/icon.png") no-repeat -180px 0;
}

.store-operate .item05:before {
    background: url("../images/icon.png") no-repeat -240px 0;
}

.store-operate .item06:before {
    background: url("../images/icon.png") no-repeat -300px 0;
}

.store-operate .item07:before {
    background: url("../images/icon.png") no-repeat -360px 0;
}

.store-operate .item08:before {
    background: url("../images/icon.png") no-repeat -420px 0;
}

.store-operate .item09:before {
    background: url("../images/icon.png") no-repeat 0 -60px;
}

.store-operate .item10:before {
    background: url("../images/icon.png") no-repeat -60px -60px;
}

.store-operate .item h4 {
    font-size: 22px;
    line-height: 40px;
    font-weight: normal;
    margin-bottom: 14px;
}

.store-operate .item p {
    font-size: 14px;
    color: #666;
    line-height: 22px;
}

.class-warp.person {
    width: 100%;
    height: 303px;
    background: url("../images/person-bg.jpg") no-repeat center;
    color: #fff;
}

.class-warp.person h2 {
    color: #fff;
}

.person-operate {
    margin-top: 76px;
}

.person-operate .item {
    width: 144px;
    padding: 53px 30px 0;
    height: 60px;
    border-right: 1px dashed #fff;
    position: relative;
    float: left;
    text-align: center;
    font-size: 13px;
    line-height: 22px;
}

.person-operate .item01:before {
    top: -25px;
    background: url("../images/icon.png") no-repeat -120px -60px;
}

.person-operate .item02:before {
    top: -25px;
    background: url("../images/icon.png") no-repeat -180px -60px;
}

.person-operate .item03:before {
    top: -25px;
    background: url("../images/icon.png") no-repeat -240px -60px;
}

.person-operate .item04:before {
    top: -25px;
    background: url("../images/icon.png") no-repeat -300px -60px;
}

.person-operate .item05:before {
    top: -25px;
    background: url("../images/icon.png") no-repeat -360px -60px;
}

.inter-operate .inter {
    width: 202px;
    margin-right: 70px;
    margin-top: 40px;
    float: left;
    height: 170px;
    padding-top: 120px;
    position: relative;
    text-align: center;
}

.inter-operate .inter .icon {
    display: block;
    width: 90px;
    height: 90px;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -45px;
    background-color: #f1f1f5;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
}

.inter-operate .inter h4,
.wx-operate .item h4,
.person-inter .inter h4 {
    font-size: 22px;
    line-height: 42px;
    margin-bottom: 6px;
    font-weight: normal;
}

.inter-operate .inter p,
.wx-operate .item p,
.person-inter .inter p {
    font-size: 14px;
    color: #999;
    line-height: 22px;
}

.inter-operate .inter .icon:before {
    content: '';
    display: block;
    width: 60px;
    height: 60px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -30px;
    margin-left: -30px;
}

.inter-operate .item01 .icon:before {
    background: url("../images/icon.png") no-repeat 0 -180px;
}

.inter-operate .item02 .icon:before {
    background: url("../images/icon.png") no-repeat -60px -180px;
}

.inter-operate .item03 .icon:before {
    background: url("../images/icon.png") no-repeat -120px -180px;
}

.inter-operate .item04 .icon:before {
    background: url("../images/icon.png") no-repeat -180px -180px;
}

.inter-operate .item05 .icon:before {
    background: url("../images/icon.png") no-repeat -240px -180px;
}

.inter-operate .item06 .icon:before {
    background: url("../images/icon.png") no-repeat -300px -180px;
}

.inter-operate .item07 .icon:before {
    background: url("../images/icon.png") no-repeat -360px -180px;
}

.inter-operate .item08 .icon:before {
    background: url("../images/icon.png") no-repeat -420px -180px;
}

.wx {
    margin-top: 20px;
    height: 415px;
    background: url("../images/wx-bg.jpg") no-repeat center;
    color: #fff;
    text-align: center;
}

.wx .class-title h2,
.wx-operate .item p {
    color: #fff;
}

.wx-operate .item {
    width: 185px;
    margin-right: 90px;
    float: left;
    margin-top: 40px;
    padding-top: 70px;
    position: relative;
}

.wx-operate .item01:before {
    background: url("../images/icon.png") no-repeat 0 -120px;
}

.wx-operate .item02:before {
    background: url("../images/icon.png") no-repeat -60px -120px;
}

.wx-operate .item03:before {
    background: url("../images/icon.png") no-repeat -120px -120px;
}

.wx-operate .item04:before {
    background: url("../images/icon.png") no-repeat -180px -120px;
}

.person-inter {
    margin-top: 50px;
    margin-bottom: 20px
}

.person-inter .inter {
    width: 373px;
    padding-left: 97px;
    height: 94px;
    float: left;
    position: relative;
    margin-bottom: 34px;
    margin-right: 50px;
}

.person-inter .inter .icon {
    width: 80px;
    height: 80px;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    position: absolute;
    left: 0;
    top: 6px;
}

.person-inter .inter .icon:before {
    content: '';
    display: block;
    width: 60px;
    height: 60px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -30px;
    margin-left: -30px;
}

.person-inter .item01 .icon {
    background-color: #f1cd3f;
}

.person-inter .item01 .icon:before {
    background: url("../images/icon.png") no-repeat 0 -240px;
}

.person-inter .item02 .icon {
    background-color: #32d6d8;
}

.person-inter .item02 .icon:before {
    background: url("../images/icon.png") no-repeat -60px -240px;
}

.person-inter .item03 .icon {
    background-color: #59b0fb;
}

.person-inter .item03 .icon:before {
    background: url("../images/icon.png") no-repeat -120px -240px;
}

.person-inter .item04 .icon {
    background-color: #dc9cfd;
}

.person-inter .item04 .icon:before {
    background: url("../images/icon.png") no-repeat -180px -240px;
}

.person-inter .item05 .icon {
    background-color: #f67da5;
}

.person-inter .item05 .icon:before {
    background: url("../images/icon.png") no-repeat -240px -240px;
}

.person-inter .item06 .icon {
    background-color: #9eda35;
}

.person-inter .item06 .icon:before {
    background: url("../images/icon.png") no-repeat -300px -240px;
}

.person-inter .item07 .icon {
    background-color: #3edd8d;
}

.person-inter .item07 .icon:before {
    background: url("../images/icon.png") no-repeat -360px -240px;
}

.person-inter .item08 .icon {
    background-color: #8596fd;
}

.person-inter .item08 .icon:before {
    background: url("../images/icon.png") no-repeat -420px -240px;
}


/*功能介绍*/

.func-info-box {
    padding-top: 30px;
    margin-bottom: 50px;
}

.func-info-box h1 {
    font-size: 32px;
    line-height: 42px;
    text-align: center;
    font-weight: normal;
    margin-bottom: 22px;
}

.func-info-box {
    font-size: 14px;
    color: #666;
}

.func-info-box .introduce {
    line-height: 34px;
    width: 1024px;
    margin: 0 auto 5px;
}

.func-info-box .introduce span {
    position: relative;
    margin-right: 65px;
}

.table {
    box-shadow: 0px 2px 15px #eee;
    -webkit-box-shadow: 0px 2px 15px #eee;
    -moz-box-shadow: 0px 2px 15px #eee;
    -ms-box-shadow: 0px 2px 15px #eee;
}

.func-info-box .introduce .item1:before {
    content: '*';
    color: red;
    margin-right: 5px;
}

.func-info-box .introduce .item2:before {
    content: '';
    display: block;
    width: 15px;
    height: 15px;
    background: url("../images/yes.jpg") no-repeat center;
    position: absolute;
    left: -20px;
    top: 50%;
    margin-top: -7px;
}

.func-info-box .introduce .item3:before {
    content: '';
    display: block;
    width: 15px;
    height: 15px;
    background: url("../images/no.jpg") no-repeat center;
    position: absolute;
    left: -20px;
    top: 50%;
    margin-top: -7px;
}

.func-info-box .table {
    width: 1024px;
    margin: 0 auto;
}

.func-info-box .table-head {
    height: 85px;
    padding-left: 228px;
    background-color: #ebecec;
}

.func-info-box .table-head.on {
    position: fixed;
    top: 0;
    left: 50%;
    margin-left: -512px;
}

.func-info-box .table-head li {
    width: 199px;
    float: left;
    height: 85px;
    text-align: center;
}

.func-info-box .table-head h5 {
    font-size: 18px;
    font-weight: normal;
    color: #333;
    line-height: 34px;
    margin-top: 10px;
}

.func-info-box .class,
.func-info-box td .y-n-box {
    width: 174px;
    padding: 0 12px;
}

.func-info-box .class div {
    float: left;
    line-height: 34px;
}

.func-info-box .class .td1,
.func-info-box .y-n-box .span1 {
    width: 54px;
}

.func-info-box .class .td2,
.func-info-box .y-n-box .span2 {
    width: 66px;
}

.func-info-box .class .td3,
.func-info-box .y-n-box .span3 {
    width: 54px;
}

.func-info-box .y-n-box span {
    height: 42px;
    line-height: 42px;
    font-size: 14px;
    display: block;
    float: left;
}

.func-info-box .y-n-box span.no {
    background: url("../images/no.jpg") no-repeat center;
}

.func-info-box .y-n-box span.yes {
    background: url("../images/yes.jpg") no-repeat center;
}

.func-info-box table td {
    border-right: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
    height: 42px;
    text-align: center;
}

.func-info-box td .y-n-box {
    height: 42px;
}

.func-info-box td .y-y-y {
    background: url("../images/y-y-y.png") no-repeat center;
}

.func-info-box td .n-n-n {
    background: url("../images/n-n-n.png") no-repeat center;
}

.func-info-box td .y-n-y {
    background: url("../images/y-n-y.png") no-repeat center;
}

.func-info-box td .y-y-n {
    background: url("../images/y-y-n.png") no-repeat center;
}

.func-info-box td .n-y-y {
    background: url("../images/n-y-y.png") no-repeat center;
}

.func-info-box td .n-n-y {
    background: url("../images/n-n-y.png") no-repeat center;
}

.func-info-box td .y-n-n {
    background: url("../images/y-n-n.png") no-repeat center;
}

.func-info-box td .n-y-n {
    background: url("../images/n-y-n.png") no-repeat center;
}