* {
    margin: 0;
    padding: 0;
    outline: 0;
    list-style: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    text-decoration: none;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    -webkit-appearance: none;
    -webkit-touch-callout: none;
    -webkit-overflow-scrolling: touch;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    font-size: 0;
    font-family: Helvetica
}

body, html {
    background-color: #fff;
    height: 100%
}

html {
    font-size: 62.5%
}

body {
    position: relative;
    overflow-x: hidden
}

.animation {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000px;
    -ms-perspective: 1000px;
    perspective: 1000px
}

.container {
    position: relative;
    width: 100%;
    height: auto
}

.loading-layer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99;
    background: #000 url(/static/site/img/loading_bg.jpg) repeat-y left top;
    -webkit-background-size: 100% auto;
    background-size: 100% auto
}

.loading-layer > .wrapper {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
    background: url(/static/site/img/WechatIMG228.png) no-repeat center top;
    -webkit-background-size: 80px 80px;
    background-size: 80px 80px;
    padding-top: 104px;
    width: 240px;
    height: 116px
}

.loading-layer > .wrapper > .progress-bar {
    position: relative;
    border: 1px solid rgba(203, 150, 14, .4);
    border-radius: 4px;
    width: 100%;
    height: 8px
}

.loading-layer > .wrapper > .progress-bar > span {
    position: absolute;
    left: 0;
    top: 0;
    background-color: #cb960e;
    border-radius: 4px;
    display: block;
    height: 100%;
    width: 0
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@-o-keyframes fadeIn {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    -o-animation-name: fadeIn;
    animation-name: fadeIn
}

@-webkit-keyframes fadeInRightBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(80px, 0, 0);
        transform: translate3d(80px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@-o-keyframes fadeInRightBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(80px, 0, 0);
        transform: translate3d(80px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInRightBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(80px, 0, 0);
        transform: translate3d(80px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

.fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    -o-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig
}

@-webkit-keyframes fadeInUpBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 80px, 0);
        transform: translate3d(0, 80px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@-o-keyframes fadeInUpBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 80px, 0);
        transform: translate3d(0, 80px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInUpBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 80px, 0);
        transform: translate3d(0, 80px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

.fadeInUpBig {
    -webkit-animation-name: fadeInUpBig;
    -o-animation-name: fadeInUpBig;
    animation-name: fadeInUpBig
}

.animated {
    -webkit-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -o-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-animation-timing-function: ease-out
}

.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.animated.delay-1s {
    -webkit-animation-delay: 1s;
    -o-animation-delay: 1s;
    animation-delay: 1s
}

.animated.delay-2s {
    -webkit-animation-delay: 2s;
    -o-animation-delay: 2s;
    animation-delay: 2s
}

.animated.delay-3s {
    -webkit-animation-delay: 3s;
    -o-animation-delay: 3s;
    animation-delay: 3s
}

.animated.delay-4s {
    -webkit-animation-delay: 4s;
    -o-animation-delay: 4s;
    animation-delay: 4s
}

.animated.delay-5s {
    -webkit-animation-delay: 5s;
    -o-animation-delay: 5s;
    animation-delay: 5s
}

.animated.fast {
    -webkit-animation-duration: .8s;
    -o-animation-duration: .8s;
    animation-duration: .8s
}

.animated.faster {
    -webkit-animation-duration: .5s;
    -o-animation-duration: .5s;
    animation-duration: .5s
}

.animated.slow {
    -webkit-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s
}

.animated.slower {
    -webkit-animation-duration: 3s;
    -o-animation-duration: 3s;
    animation-duration: 3s
}

@media (prefers-reduced-motion) {
    .animated {
        -webkit-animation: unset !important;
        -o-animation: unset !important;
        animation: unset !important;
        -webkit-transition: none !important;
        -o-transition: none !important;
        transition: none !important
    }
}

.header {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 2;
    background: #ebe7dc;
    padding: 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    height: 104px
}

.header > .item {
    display: block;
    height: 100%
}

.header > .item.logo {
    width: 50%;
    text-align: left;
    display: flex;
    align-items: center;
    -webkit-background-size: auto 100%;
    background-size: auto 100%
}

.header > .item.title {
    position: relative;
    padding-left: 12px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    line-height: 56px;
    text-align: left;
    color: #fff;
    font-size: 2rem;
    font-weight: 600;
    letter-spacing: .01rem
}

.header > .item.title > span {
    position: absolute;
    top: -1.2rem;
    left: 84px;
    color: #eaeaea;
    font-size: 1.6rem;
    font-weight: 300
}

.header > .item.title > span.ios {
    top: -1.4rem;
    left: 92px
}

.header > .item.title.cn {
    font-size: 2.8rem;
    letter-spacing: 2px
}

.header > .item.title.cn > span {
    top: -24px;
    left: 64px
}

.header > .item.title.cn > span.ios {
    left: 64px
}

.header > .item.navi {
    width: 56px;
    text-align: right
}

.header > .item.navi > .drop-trigger {
    position: relative;
    margin-top: 6px;
    background-color: #ebe7dc;
    display: inline-block;
    width: 40px;
    height: 43px
}

.header > .item.navi > .drop-trigger > i {
    position: absolute;
    left: 8px;
    top: 20px;
    background-color: #bc955a;
    border-radius: 2px;
    display: inline-block;
    width: 24px;
    height: 3px
}

.header > .item.navi > .drop-trigger > i::after, .header > .item.navi > .drop-trigger > i::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    background-color: #bc955a;
    border-radius: 2px;
    display: inline-block;
    height: 3px
}

.header > .item.navi > .drop-trigger > i::before {
    top: -7px
}

.header > .item.navi > .drop-trigger > i::after {
    top: 7px
}

.header > .item.navi > .drop-trigger.active {
    /*background-color: #fff*/
}

.header > .item.navi > .drop-trigger.active > i {
    background-color: #333
}

.header > .item.navi > .drop-trigger.active > i::after, .header > .item.navi > .drop-trigger.active > i::before {
    background-color: #333
}

.header > .drop-layer {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 103px;
    background-color: #ebe7dc;
    padding: 0 32px 32px 32px
}

.header > .drop-layer > .item {
    border-bottom: 1px solid #49474a;
    padding: 0 16px;
    display: block;
    height: 56px;
    line-height: 56px;
    text-align: left;
    font-size: 2rem;
    color: #49474a
}

.block-welcome {
    position: relative;
    background: #760300 url(/static/site/img/cover_bg.jpg) repeat center 104px;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    /*height: 100%*/
}

.block-welcome > .wrapper {
    position: absolute;
    left: 32px;
    right: 32px;
    top: 60%;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
    background-color: rgba(0, 0, 0, .2);
    height: 144px
}

.block-welcome > .wrapper > .box {
    position: absolute;
    top: 32px;
    right: 16px;
    bottom: 32px;
    left: 16px;
    overflow: hidden
}

.block-welcome > .wrapper > .box > .item {
    position: absolute;
    left: -3000px;
    top: 0;
    width: 100%;
    height: 100%;
    line-height: 40px;
    text-align: center;
    font-size: 2.4rem;
    font-weight: 500;
    color: #fff
}

.block-welcome > .wrapper > .box > .item > span {
    position: absolute;
    top: 28px;
    left: 112px;
    color: #eaeaea;
    font-size: 1.6rem;
    font-weight: 300
}

.block-welcome > .wrapper > .box > .item > span.ios {
    top: 32px;
    left: 114px
}

.block-welcome > .wrapper > .box > .item.single-line {
    line-height: 80px
}

.block-welcome > .wrapper > .box > .item:first-child {
    left: 0
}

.block-welcome > .wrapper > .box > .item.cn {
    letter-spacing: 2px
}

.block-welcome > .wrapper > .box > .item.cn > span {
    top: 22px;
    left: 144px
}

.block-welcome > .wrapper > .box > .item.cn > span.ios {
    top: 22px;
    left: 144px
}

.main-title {
    opacity: 0;
    /*background: url(../img/lotus_line.png) no-repeat center bottom;*/
    -webkit-background-size: auto 28px;
    background-size: auto 28px;
    padding: 24px 0 24px 0;
    display: block;
    height: 96px;
    line-height: 69px;
    text-align: center
}

.main-title2 {
    opacity: 0;
    background: url(/static/site/img/Dividing.png) no-repeat center bottom;
    -webkit-background-size: auto 28px;
    background-size: auto 28px;
    padding: 24px 0 24px 0;
    display: block;
    height: 96px;
    line-height: 40px;
    text-align: center;
}

.main-title3 {
    opacity: 0;
    background: url(/static/site/img/Dividing_white.png) no-repeat center bottom;
    -webkit-background-size: auto 28px;
    background-size: auto 28px;
    padding: 24px 0 24px 0;
    display: block;
    height: 96px;
    line-height: 40px;
    text-align: center;
}

.main-title > label, .main-title > span {
    font-size: 2.8rem;
    font-weight: 500
}

.main-title > label {
    color: #333
}

.main-title > span {
    margin-left: 8px;
    color: #cb9a31
}

.block-introduction {
    padding: 0 16px;
    background: #fff;
    height: auto
}

.block-introduction > .intro-txt {
    opacity: 0;
    margin-top: 16px;
    line-height: 28px;
    text-align: left;
    font-size: 1.8rem;
    font-weight: 400;
    color: #666;
    word-wrap: break-word
}

.block-introduction > .intro-brief {
    opacity: 0;
    margin-top: 20px;
    /* border: 1px solid #e4e4e4; */
    /* background: url(../img/intro_002.jpg) no-repeat right bottom; */
    /* -webkit-background-size: 92% auto; */
    /* background-size: 92% auto; */
    /* padding: 40px 8px; */
    height: auto;
}

.block-introduction > .intro-brief > .txt-row {
    position: relative;
    padding-left: 20px;
    height: auto;
    min-height: 20px;
    line-height: 20px;
    text-align: left;
    font-size: 2rem;
    font-weight: 400;
    color: #333;
    word-wrap: break-word
}

.block-introduction > .intro-brief > .txt-row::before {
    content: '';
    position: absolute;
    left: 0;
    top: 5px;
    border-radius: 50%;
    background-color: #b9913a;
    display: block;
    width: 10px;
    height: 10px
}

.block-introduction > .intro-brief > .txt-row + .txt-row {
    margin-top: 40px
}

.block-advantages {
    background: #ebe7dc;
    height: auto
}

.block-advantages > .intro-detail {
    background-color: #ebe7dc;
    padding: 24px 16px;
    height: auto
}

.block-advantages > .intro-detail > .item {
    opacity: 0;
    position: relative;
    padding-left: 64px
}

.block-advantages > .intro-detail > .item > .icon {
    position: absolute;
    left: 0;
    top: 4px;
    border-radius: 5px;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    display: block;
    width: 48px;
    height: 48px
}

.block-advantages > .intro-detail > .item > .icon.icon-1 {
    background-image: url(/static/site/img/icon_adv_01.jpg)
}

.block-advantages > .intro-detail > .item > .icon.icon-2 {
    background-image: url(/static/site/img/icon_adv_02.jpg)
}

.block-advantages > .intro-detail > .item > .icon.icon-3 {
    background-image: url(/static/site/img/icon_adv_03.jpg)
}

.block-advantages > .intro-detail > .item > .icon.icon-4 {
    background-image: url(/static/site/img/icon_adv_04.jpg)
}

.block-advantages > .intro-detail > .item > .icon.icon-5 {
    background-image: url(/static/site/img/icon_adv_05.jpg)
}

.block-advantages > .intro-detail > .item > .icon.icon-6 {
    background-image: url(/static/site/img/icon_adv_06.jpg)
}

.block-advantages > .intro-detail > .item > .main {
    line-height: 24px;
    text-align: left;
    font-size: 2rem;
    font-weight: 500;
    color: #444
}

.block-advantages > .intro-detail > .item > .mark {
    line-height: 24px;
    text-align: left;
    font-size: 1.6rem;
    font-weight: 400;
    color: #9a9a9a;
    word-wrap: break-word
}

.block-advantages > .intro-detail > .item + .item {
    margin-top: 16px
}

.block-advantages > .intro-video {
    opacity: 0;
    background-color: #fff;
    height: auto
}

.block-advantages > .intro-video > .title {
    height: 80px;
    line-height: 80px;
    text-align: center;
    font-size: 2.4rem;
    font-weight: 500;
    color: #666
}

.block-advantages > .intro-video > .video-box {
    padding: 0 4px;
    height: auto
}

.block-advantages > .intro-video > .video-box > video {
    width: 100%;
    height: auto;
    -o-object-fit: fill;
    object-fit: fill
}

.block-series {
    padding: 0 4px;
    background: #fff;
    height: auto
}

.block-series > .item {
    opacity: 0;
    margin-top: 16px;
    height: auto
}

.block-series > .item > .txt-row {
    position: relative;
    z-index: 2;
    height: 57px;
    text-align: center;
    line-height: 57px
}

.block-series > .item > .txt-row::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 28px;
    z-index: -1;
    display: block;
    border-top: 1px solid #cc9b34;
    height: 0
}

.block-series > .item > .txt-row.no-line::before {
    display: none
}

.block-series > .item > .txt-row > .txt {
    background-color: #fff;
    padding: 0 8px;
    font-size: 2rem;
    font-weight: 400;
    color: #333
}

.block-series > .item > .img-row {
    height: auto
}

.block-series > .item > .img-row > img {
    width: 100%;
    height: auto
}

.block-series > .item > .img-row > img + img {
    margin-top: 16px
}

.block-temple > .wrapper {
    opacity: 0;
    margin-top: 16px;
    padding-bottom: 4px;
    padding: 0 10px;
    /* background-color: #8c7d56; */
    height: auto;
    /*opacity: 0;*/
    /*margin-top: 16px;*/
    /*padding-bottom: 4px;*/
    /*background-color: #8c7d56;*/
    /*height: auto*/
}

.block-temple > .wrapper > .img-box {
    width: 100%;
    height: auto
}

.block-temple > .wrapper > .img-box > .item {
    width: 100%;
    display: none
}

.block-temple > .wrapper > .img-box > .item > img {
    width: 100%;
    height: auto
}

.block-temple > .wrapper > .img-box > .item:first-child {
    display: block
}

.block-temple > .wrapper > .img-box > .point-box {
    height: 16px;
    line-height: 16px;
    text-align: center
}

.block-temple > .wrapper > .img-box > .point-box > i {
    margin-top: 7px;
    background-color: rgba(255, 255, 255, .2);
    border-radius: 50%;
    display: inline-block;
    width: 6px;
    height: 6px
}

.block-temple > .wrapper > .img-box > .point-box > i.active {
    background-color: #fff
}

.block-temple > .wrapper > .img-box > .point-box > i + i {
    margin-left: 8px
}

.block-temple > .wrapper > .swiper-box {
    position: relative;
    overflow: hidden
}

.block-temple > .wrapper > .swiper-box > .item {
    position: absolute;
    left: 0;
    top: 0
}

.block-temple > .wrapper > .swiper-box > .point-box {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0
}

.block-system {
    background: #fff
}

.block-system > .intro-txt {
    opacity: 0;
    padding: 0 16px
}

.block-system > .intro-txt > .main {
    margin-top: 8px;
    height: 48px;
    line-height: 48px;
    text-align: center;
    font-size: 2rem;
    color: #333
}

.block-system > .intro-txt > .mark {
    line-height: 28px;
    text-align: left;
    font-size: 1.8rem;
    color: #999;
    word-wrap: break-word
}

.block-system > .intro-img {
    /*background: url(../img/com_bg.jpg) no-repeat center center;*/
    -webkit-background-size: 35% auto;
    background-size: 35% auto;
    padding-top: 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: auto
}

.block-system > .intro-img > .item {
    opacity: 0;
    -webkit-box-flex: 50%;
    -webkit-flex: 50%;
    -ms-flex: 50%;
    flex: 50%;
    padding: 0 8px 32px 8px;
    text-align: center
}

.block-system > .intro-img > .item > .img-box {
    border-radius: 50%;
    height: auto
}

.block-system > .intro-img > .item > .img-box > img {
    border-radius: 50%;
    width: 100%;
    height: auto
}

.block-system > .intro-img > .item > .txt-row {
    height: 32px;
    line-height: 32px;
    text-align: center;
    font-size: 1.8rem;
    color: #987a34
}

.block-system > .intro-control {
    /*background: #2a2a2a;*/
    /*padding: 8px 16px 32px 16px*/
}

.block-system > .intro-control > .ctrl-title {
    /*opacity: 0;*/
    /*position: relative;*/
    /*z-index: 2;*/
    /*height: 57px;*/
    /*text-align: center;*/
    /*line-height: 57px*/
}

.block-system > .intro-control > .ctrl-title::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 28px;
    z-index: -1;
    display: block;
    /*border-top: 1px solid #cc9b32;*/
    height: 0
}

.block-system > .intro-control > .ctrl-title > .txt {
    background-color: #2a2a2a;
    padding: 0 8px;
    font-size: 2rem;
    font-weight: 400;
    color: #fff
}

.block-system > .intro-control > .ctrl-view {
    /*background: #2a2a2a url(../img/ctrl_bg.jpg) no-repeat center top;*/
    /*-webkit-background-size: 94% auto;*/
    /*background-size: 94% auto;*/
    /*margin-top: 12px;*/
    /*display: -webkit-box;*/
    /*display: -webkit-flex;*/
    /*display: -ms-flexbox;*/
    /*display: flex;*/
    /*-webkit-box-orient: horizontal;*/
    /*-webkit-box-direction: normal;*/
    /*-webkit-flex-direction: row;*/
    /*-ms-flex-direction: row;*/
    /*flex-direction: row;*/
    /*-webkit-flex-wrap: wrap;*/
    /*-ms-flex-wrap: wrap;*/
    /*flex-wrap: wrap;*/
    /*height: auto*/
}

.block-system > .intro-control > .ctrl-view > .item {
    opacity: 0;
    -webkit-box-flex: 50%;
    -webkit-flex: 50%;
    -ms-flex: 50%;
    flex: 50%;
    padding: 0 8px 24px 8px;
    text-align: center
}

.block-system > .intro-control > .ctrl-view > .item > .img-box {
    margin: 0 auto;
    border-radius: 10px;
    width: 88%;
    height: auto
}

.block-system > .intro-control > .ctrl-view > .item > .img-box > img {
    border-radius: 10px;
    width: 100%;
    height: auto
}

.block-system > .intro-control > .ctrl-view > .item > .txt-row {
    height: 32px;
    line-height: 32px;
    text-align: center;
    font-size: 1.8rem;
    color: #8c7d54;
    letter-spacing: 1px
}

.block-system > .intro-control > .manage-title {
    opacity: 0;
    position: relative;
    z-index: 2;
    height: 41px;
    text-align: center;
    line-height: 41px
}

.block-system > .intro-control > .manage-title::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 20px;
    z-index: -1;
    display: block;
    border-top: 1px solid #8c7d56;
    height: 0
}

.block-system > .intro-control > .manage-title > .txt {
    background-color: #2a2a2a;
    padding: 0 8px;
    font-size: 2rem;
    font-weight: 400;
    color: #fff
}

.block-system > .intro-control > .manage-text {
    opacity: 0;
    line-height: 28px;
    text-align: left;
    font-size: 1.8rem;
    color: #756d48
}

.block-system > .intro-control > .share-apps {
    opacity: 0;
    /*margin-top: 16px;*/
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: auto
}

.block-system > .intro-control > .share-apps > .item {
    width: 20%;
    height: auto
}

.block-system > .intro-control > .share-apps > .item > img {
    border-radius: 15px;
    width: 100%;
    height: auto
}

.block-system > .intro-control > .wx-screen {
    opacity: 0;
    /*margin-top: 20px;*/
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: auto
}

.block-system > .intro-control > .wx-screen > .item {
    border-radius: 15px;
    width: 48%;
    height: auto
}

.block-system > .intro-control > .wx-screen > .item > img {
    width: 100%;
    height: auto
}

.block-system > .intro-control > .pad-screen {
    opacity: 0;
    margin-top: 16px;
    border-radius: 15px;
    height: auto
}

.block-system > .intro-control > .pad-screen > img {
    width: 100%;
    height: auto
}

.block-software {
    background: #ebe7dc;
    padding: 0 16px 20px 16px;
}

.block-software > .intro-txt {
    opacity: 0;
    padding: 16px 0;
    line-height: 32px;
    text-align: left;
    font-size: 2rem;
    color: #999;
    word-wrap: break-word;
    letter-spacing: 1px
}

.block-software .arrow-network {
    opacity: 0;
    position: relative;
    background: url(/static/site/img/icon_arrow.jpg) no-repeat center center;
    -webkit-background-size: auto 24px;
    background-size: auto 24px;
    height: 48px
}

.block-software .arrow-network > .text {
    position: absolute;
    left: 54%;
    display: block;
    height: 100%;
    line-height: 48px;
    text-align: left;
    font-size: 1.4rem;
    color: #666
}

.block-software .flow-box {
    opacity: 0;
    /*border: 2px solid #b9913c;*/
    /*border-radius: 3px;*/
    /*padding: 0 8px 16px 8px*/
    background: #380001 url(/static/site/img/titlebg.png) repeat-y center;
    -webkit-background-size: 100% auto;
    background-size: 100% 100%;
    height: 4rem;
    width: 12rem;
    background-color: #fff;
}

.block-software .flow-box > .title {
    /*height: 56px;*/
    /*line-height: 56px;*/
    /*text-align: center;*/
    /*font-size: 2rem;*/
    /*color: #333*/
    text-align: center;
    font-size: 2rem;
    color: #fff;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.block-software .flow-box > .steps-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.block-software .flow-box > .steps-row > .item {
    border-radius: 3px;
    background-color: #b9913c;
    padding: 4px 2px;
    width: 30%;
    height: 36px;
    line-height: 14px;
    text-align: center;
    font-size: 1.2rem;
    font-weight: 300;
    color: #fff;
    overflow: hidden
}

.block-software .flow-box > .steps-row > .item.single-line {
    line-height: 28px
}

.block-software .flow-box > .steps-row > .item.ios {
    line-height: 12px
}

.block-software .flow-box > .steps-row > .item.cn {
    font-size: 1.6rem;
    font-weight: 400
}

.block-software .flow-box > .steps-row > .item + .item {
    margin-left: 5%
}

.block-software .flow-box > .steps-row + .steps-row {
    margin-top: 16px
}

.block-software > .multi-flow-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: auto
}

.block-software > .multi-flow-row > .left-col > .flow-box > .title, .block-software > .multi-flow-row > .right-col > .flow-box > .title {
    font-size: 1.8rem
}

.block-software > .multi-flow-row > .left-col {
    width: 53%
}

.block-software > .multi-flow-row > .left-col > .arrow-network {
    background-position-x: 40%
}

.block-software > .multi-flow-row > .left-col > .arrow-network > .text {
    left: 48%
}

.block-software > .multi-flow-row > .left-col > .flow-box {
    padding-left: 4px;
    padding-right: 4px
}

.block-software > .multi-flow-row > .left-col > .flow-box > .steps-row > .item {
    width: 48%
}

.block-software > .multi-flow-row > .left-col > .flow-box > .steps-row > .item + .item {
    margin-left: 2%
}

.block-software > .multi-flow-row > .right-col {
    width: 43%
}

.block-software > .multi-flow-row > .right-col > .arrow-network {
    background-position-x: 37%
}

.block-software > .multi-flow-row > .right-col > .arrow-network > .text {
    left: 45%
}

.block-software > .multi-flow-row > .right-col > .flow-box > .steps-row > .item {
    width: 45%
}

.block-software > .multi-flow-row > .right-col > .flow-box > .steps-row > .item + .item {
    margin-left: 10%
}

.block-function > .flow-box {
    margin-top: 24px
}

.block-workmanship > .intro-box {
    /*background-color: #2a2a2a;*/
    /*padding: 16px 8px 32px 8px*/
}

.block-workmanship > .intro-box > .item {
    opacity: 0;
    position: relative;
    margin-top: 8px;
    padding-left: 128px;
    height: auto
}

.block-workmanship > .intro-box > .item > .icon {
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%;
    display: block;
    width: 112px;
    height: 112px
}

.block-workmanship > .intro-box > .item > .icon > img {
    border-radius: 50%;
    width: 100%;
    height: 100%
}

.block-workmanship > .intro-box > .item > .main {
    padding-top: 8px;
    line-height: 28px;
    text-align: left;
    font-size: 2.4rem;
    color: #fff;
    word-wrap: break-word
}

.block-workmanship > .intro-box > .item > .mark {
    margin-top: 8px;
    line-height: 28px;
    text-align: left;
    font-size: 2rem;
    color: #8e7b53;
    word-wrap: break-word;
    letter-spacing: 1px
}

.block-workmanship > .intro-box > .item + .item {
    margin-top: 24px
}

.block-modes > .main-title {
    opacity: 0;
    padding-left: 0;
    padding-right: 0
}

.block-modes > .img-box {
    opacity: 0;
    padding: 24px 16px 16px 16px
}

.block-modes > .img-box > img {
    width: 100%;
    height: auto
}

.block-facts > .intro-box {
    background: #380001 url(/static/site/img/data_bg.png) repeat-y center top;
    -webkit-background-size: 100% auto;
    background-size: 100% 100%;
    padding: 0 8px 34px 8px;
    height: auto
}

.block-facts > .intro-box > .tips {
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 1.4rem;
    color: #f7f7f7
}

.block-facts > .intro-box > .number-info {
    opacity: 0
}

.block-facts > .intro-box > .number-info > .main {
    height: 80px;
    line-height: 80px;
    text-align: center;
    font-size: 6.4rem;
    font-weight: 600;
    color: #fff
}

.block-facts > .intro-box > .number-info > .mark {
    padding: 40px 8px 0px 8px;
    line-height: 28px;
    text-align: center;
    font-size: 2.4rem;
    color: #bc955a;
    word-wrap: break-word;
    letter-spacing: 1px
}

.block-facts > .intro-box > .text-row {
    opacity: 0;
    position: relative;
    padding-left: 50px;
    padding-right: 8px;
    height: auto;
    line-height: 28px;
    text-align: left;
    font-size: 2.4rem;
    color: #bc955a;
    word-wrap: break-word
}

.block-facts > .intro-box > .text-row::before {
    content: '';
    position: absolute;
    left: 8px;
    top: -3px;
    /*background-color: #ffc639;*/
    background: url(/static/site/img/WechatIMG228.png) no-repeat center;
    background-size:100% 100%;
    display: block;
    width: 30px;
    height: 30px
}

.block-facts > .intro-box > .text-row + .text-row {
    margin-top: 32px
}
.block-about-us{
    background: url(/static/site/img/foot_bg.png) no-repeat center;
    background-size:100% 100%;
}

.block-about-us > .qr-img {
    opacity: 0;
    padding: 32px 0;
    line-height: 20px;
    font-size: 1.6rem;
    text-align: center;
    color: #bc955a

}

.block-about-us > .qr-img > img {
    width: 12%;
    height: auto;
    padding-bottom: 34px;
}

.block-about-us > .img-box {
    opacity: 0
}

.block-about-us > .img-box > img {
    width: 100%;
    height: auto
}

.block-about-us > .img-box.logo {
    padding-bottom: 16px
}

.block-about-us > .img-box.logo > img {
    width: 75%;
    height: auto
}

.block-about-us > .text-box {
    /*opacity: 0;*/
    /*background-color: #363636;*/
    padding: 32px 16px
}

.block-about-us > .text-box > .row {
    /*line-height: 32px;*/
    font-size: 2rem;
    text-align: center;
    color: #bc955a;
}

.block-about-us > .text-box > .row + .row {
    margin-top: 16px
}