@font-face {
    font-family: 'icomoon';
    src:    url('icomoon.1ca4cec9.eot?59zgg7');
    src:    url('icomoon.1ca4cec9.eot?59zgg7#iefix') format('embedded-opentype'),
        url('icomoon.6b8bcbf5.ttf?59zgg7') format('truetype'),
        url('icomoon.9f9cefce.woff?59zgg7') format('woff'),
        url('icomoon.e8525941.svg?59zgg7#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="tf-icon-"], [class*=" tf-icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.tf-icon-android_b:before {
    content: "\e97e";
}
.tf-icon-phone .path1:before {
    content: "\e906";
    color: rgb(79, 93, 115);
}
.tf-icon-phone .path2:before {
    content: "\e907";
    margin-left: -0.5419921875em;
    color: rgb(255, 255, 255);
}
.tf-icon-phone .path3:before {
    content: "\e908";
    margin-left: -0.5419921875em;
    color: rgb(255, 255, 255);
}
.tf-icon-phone .path4:before {
    content: "\e909";
    margin-left: -0.5419921875em;
    color: rgb(224, 224, 208);
}
.tf-icon-android:before {
    content: "\e90a";
}
.tf-icon-apple:before {
    content: "\e90b";
}
.tf-icon-screen .path1:before {
    content: "\e900";
    color: rgb(187, 184, 174);
}
.tf-icon-screen .path2:before {
    content: "\e901";
    margin-left: -0.9755859375em;
    color: rgb(255, 255, 255);
}
.tf-icon-screen .path3:before {
    content: "\e902";
    margin-left: -0.9755859375em;
    color: rgb(79, 93, 116);
}
.tf-icon-screen .path4:before {
    content: "\e903";
    margin-left: -0.9755859375em;
    color: rgb(255, 255, 255);
}
.tf-icon-cross:before {
    content: "\e904";
}


@charset "UTF-8";
/* http://css-tricks.com/poll-results-how-do-you-order-your-css-properties/ */
* {
    margin: 0;
    padding: 0;
    border: 0;
    -webkit-user-select: text;
}

[micro-template], [micro-template-child] > *, [ntes-template], [ntes-template-child] > * {
    display: none !important;
}

a, img {
    -webkit-touch-callout: none; /*禁用长按弹出系统菜单*/
}

*, :after, :before {
    box-sizing: border-box;
    -webkit-box-sizing: border-box; /*高宽不算padding,margin*/
    -webkit-text-size-adjust: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body, html {
    height: 100%; /*高度必须为100%*/
    width: 100%;
    overflow: hidden;
    font-family: "Helvetica Neue", "Verdana", "Arial", "Hiragino Sans GB", "WenQuanYi Micro Hei", "Heiti SC", STHeiti, "Microsoft Yahei", SimSun, sans-serif;
    font-size: 0.4rem;
    font-weight: normal;
    max-width:750px;
    margin:0 auto;
}

section, p, div {
    max-height: 24999.975rem;
}

textarea, input[type="password"], input[type="text"] {
    resize: none; /*禁用可缩放*/
    outline: none; /*禁用发光效果*/
    -webkit-appearance: none; /*禁用增加外观效果*/
    white-space: pre-wrap;
    word-wrap: break-word;
    background: #fff;
    overflow: scroll;
}

audio {
    width: 0;
    height: 0;
    padding: 0;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
}

body {
    /*width: 18.75rem;*/
    margin: 0 auto;
    visibility: hidden;
}

body.ready {
    visibility: visible !important;
}

.portrait {
    width: 100%;
    position: relative;
    overflow: hidden;
/*    max-width:24rem;*/
    margin:0 auto;
}

.ellipsis {
    text-overflow: ellipsis;
    display: block;
    white-space: nowrap;
    overflow: hidden;
}

a {
    text-decoration: none;
}

.fix-break-word, p {
    background-image: url('about:blank');
    display: block !important;
    background-color: transparent;
    word-break: break-all;
}

.dis-sel-text, .dis-sel-text * {
    -webkit-user-select: none;
}

.flexbox {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Chrome */
    display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.cf:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.cf {
    *zoom: 1;
}

/*view*/
.view {
    /*display: none;*/
    width: 100%;
}

.view-home {
    display: block;
}

.portrait, .view {
    height: 100%;
}

.cross-btn, .tips-layer {
    display: none;
}

.cross-btn.on, .tips-layer.on {
    display: block;
    position: fixed;
    top: 1.5rem;
    right: 0.5rem;
    z-index: 10;
    width: 2rem;
    height: 2rem;
    padding-top: 0.5rem;
    text-align: center;
}

.tips-layer.on {
    top: 0.25rem;
    right: 2.5rem;
    width: auto;
    height: auto;
    padding-top: 0rem;
}

.jijia .view-jijia, .abstract .view-abstract, .aboutus .view-aboutus, .gupiao123 .view-gupiao123 {
/*    display: block;*/
    /*-webkit-transform: translateX(-100%) translateZ(0);*/
    /*transform: translateX(-100%) translateZ(0);*/
    -webkit-transform: translate3d(-100%, 0rem, 0rem);
    transform: translate3d(-100%, 0rem, 0rem);
    opacity: 1;
}

.ready .view-jijia, .ready .view-abstract, .ready .view-aboutus, .ready .view-gupiao123 {
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
}

.view-jijia, .view-aboutus, .view-abstract, .view-gupiao123 {
    position: absolute;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    top: 0;
    left: 100%;
    z-index: 2;
    -webkit-transform: translate3d(0rem, 0rem, 0rem);
    transform: translate3d(0rem, 0rem, 0rem);
    right: auto;
    background-color: #aaa;
    opacity: 1;
}

/*hexagon*/
#hexagon a {
    visibility: visible;
    -webkit-transform: scale(0);
    transform: scale(0);
}

.hexagon {

    position: relative;
    width: 7.5rem;
    height: 4.33025rem;
    background-color: #64C7CC;
    margin: 2.165rem 0;
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg);
    opacity: .3;
}

/*.swiper-slide-active #hexagon a, .swiper-slide-in #hexagon a{*/
/*visibility: visible;*/
/*}*/

.hexagon:before,
.hexagon:after {
    content: "";
    position: absolute;
    width: 0;
    border-left: 3.75rem solid transparent;
    border-right: 3.75rem solid transparent;
}

.hexagon:before {
    bottom: 100%;
    border-bottom: 2.165rem solid #64C7CC;
}

.hexagon:after {
    top: 100%;
    width: 0;
    border-top: 2.165rem solid #64C7CC;
}

.view-home .triangle {
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 3.75rem 2.165rem 3.75rem;
    border-color: transparent transparent #666 transparent;
    position: absolute;
    z-index: 2;
    opacity: 0.2;
}
.view-home #hexagon a:active .triangle{
    opacity: .4 !important;
    border-bottom-color: #0f2ea7;
}
.view-home #hexagon a:nth-of-type(2):active .triangle{
    opacity: .35 !important;
}
.view-home #hexagon a:nth-of-type(3):active .triangle{
    opacity: .8 !important;
}
.view-home #hexagon a:nth-of-type(4):active .triangle{
    opacity: .3 !important;
}

.landscape {
    display: none;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .9);
    text-align: center;
    color: #fff;
    font-size: 1rem;
}

@media all and (orientation: landscape) {
    .mobile .portrait {
        display: none;
    }

    .mobile .landscape {
        display: -webkit-box !important; /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box !important; /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox !important; /* TWEENER - IE 10 */
        display: -webkit-flex !important; /* NEW - Chrome */
        display: flex !important; /* NEW, Spec - Opera 12.1, Firefox 20+ */

        -webkit-box-pack: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        align-items: center;
        -webkit-justify-content: center;
        justify-content: center;
    }
}

/*view-home*/
.view-home {
    background-color: #444;
}

/*first screen load optimize*/
.view-home .swiper-slide:nth-of-type(2), .view-jijia, .view-abstract, .view-gupiao123, .view-aboutus {
/*    display: none;*/
}

.ready .view-home .swiper-slide:nth-of-type(2), .ready .view-jijia, .ready .view-abstract, .ready .view-gupiao123, .ready .view-aboutus {
/*    display: block;*/
}

/*.view-home transition*/
.view-home .swiper-slide-active .home_trans,
.view-home .swiper-slide:nth-child(2) footer{
    opacity: 0;
    -webkit-transform: translate3d(0rem, 0.75rem, 0rem);
    transform: translate3d(0rem, 0.75rem, 0rem);
}
.view-home .swiper-slide-active .home_trans.go,
.view-home .swiper-slide:nth-child(2) .go{
  -webkit-transition: all .6s ease-in-out;
  transition: all .6s ease-in-out;
  opacity: 1;
  -webkit-transform: translate3d(0rem, 0rem, 0rem);
  transform: translate3d(0rem, 0rem, 0rem);
}

.view-home .swiper-slide:nth-of-type(1) .slogan {
    -webkit-transition-delay: .2s;
    transition-delay: .2s;
}

.view-home .swiper-slide:nth-of-type(1) .sub-slogan {
    -webkit-transition-delay: .4s;
    transition-delay: .4s;
}

.view-home .swiper-slide:nth-of-type(1) footer {
    -webkit-transition-delay: .6s;
    transition-delay: .6s;
}

.view-home .swiper-slide:nth-of-type(2) header {
    -webkit-transition: all .6s .5s ease-in-out;
    transition: all .6s .5s ease-in-out;
    opacity: 0;
}

.view-home .swiper-slide:nth-of-type(2).swiper-slide-in header {
    opacity: 1;
}

/*
.view-home .swiper-slide:nth-of-type(1).swiper-slide-active .logo,
.view-home .swiper-slide:nth-of-type(1).swiper-slide-active .slogan,
.view-home .swiper-slide:nth-of-type(1).swiper-slide-active .sub-slogan,
.view-home .swiper-slide:nth-of-type(1).swiper-slide-active footer,
.view-home .swiper-slide:nth-of-type(2).swiper-slide-active footer {
    opacity: 1;
    -webkit-transform: translate3d(0rem, 0rem, 0rem);
    transform: translate3d(0rem, 0rem, 0rem);
}
*/

.view-home .logo, .view-home .slogan, .view-home .sub-slogan, .view-home footer {
    margin: 1rem auto 0;
    text-align: center;
}

.view-home .logo {
    margin-top: 0rem;
}

.view-home .slogan {
    margin-top: 0.9rem;
}

.view-home .sub-slogan {
    margin-top: 0.45rem;
}

.view-home .swiper-wrapper {
    width: 100%;
  height:200%;
}

.view-home .swiper-slide {
    width: 100%;
    height: 50%;
    position: relative;

}

.view-home .swiper-slide:nth-of-type(1) {
    padding-top: 4rem;
    /*background: url(../image/bg_home_s.jpg) no-repeat 50% 0rem;*/
    /*background: #043570 url(../image/bg_home_s.jpg) no-repeat 50% -3.125rem;*/
    /*background-size: cover;*/
}

.view-home .sub-slogan h2 {
    font-size: 0.85rem;
    font-weight: normal;
}

.view-home footer {
    position: absolute;
    bottom: 1rem;
    width: 100%;
}

.view-home footer {
    font-size: 0.6rem;
    color: #fff;
}

.view-home footer .btn-contain {
    width: 2.5rem;
    height: 2rem;
    padding: 0.5rem;
    margin: 1rem auto 0;
}

.view-home footer .slide-btn {
    display: block;

}



.view-home .swiper-slide:nth-of-type(2) .contain {
    height: 100%;
    overflow: hidden;
    /*background: url(../image/bg_home_2.jpg) no-repeat 50% 0%;*/
}

.view-home .swiper-slide:nth-child(2) header {
    padding-top: 1.375rem;
    padding-left: 1.625rem;
}

.view-home .swiper-slide:nth-child(2) .info {
    float: left;
    margin-top: 0.125rem;
    line-height: 1.4;
}

.view-home .swiper-slide:nth-child(2) .bg-layer {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: url("hexbg_home.7dc9a708.png") no-repeat 67% -2.125rem;
    opacity: 0;
    -webkit-transition: all .5s 0s ease-in-out;
    transition: all .5s 0s ease-in-out;
}

.view-home .swiper-slide:nth-child(2).swiper-slide-active .bg-layer {
    opacity: .35;
}

.view-home .swiper-slide:nth-child(2) .logo {
    float: left;
    margin-top: 0rem;
    margin-right: 0.5rem;
}

.view-home .swiper-slide:nth-child(2) .title {
    font-size: 0.85rem;
    color: #1B8FBF
}

.view-home .swiper-slide:nth-child(2) .slogan {
    margin-top: 0;
    text-align: left;
    font-weight: normal;
    font-size: 0.6rem;
}

.view-home .swiper-slide:nth-child(2) main {
    margin-left: 0.125rem;
}

.view-home .swiper-slide:nth-child(2) footer {
    bottom: 1.25rem;
}

.view-jijia .inner, .view-abstract .inner, .view-aboutus .inner, .view-gupiao123 .inner {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

/*view-jijia*/
.view-jijia .inner > .contain, .view-abstract .inner > .contain, .view-aboutus .inner > .contain, .view-gupiao123 .inner > .contain {
    position: relative;
    overflow: hidden;
}

.view-jijia .inner > .contain {
    padding-bottom: 2rem;
    background: #e2f3e2 url(jijiabg.a3bae86f.jpg) no-repeat 50% 0;
    background-size: contain;
}

.view-jijia section.top {
    padding-top: 2.7rem;
}

.view-jijia section.top .logo {
  margin: 0 auto 0.5rem;
  width: 3.05rem;
  height: 3.05rem;
  border-radius: 24px;
  background-color: #26876d;
  font-size: 2.2rem;
}
.view-jijia section.top .logo svg{
  margin: 0.425rem;
  fill: #fff;
}
.svg-jijiaicon_home{
  width:1rem;
}
.view-jijia .download-area > .contain {
    -webkit-box-pack: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}

.view-jijia  .download-area > .contain > .l-col > *, .view-jijia .download-area > .contain > .r-col > * {
    display: block;
}
.view-jijia  .download-area > .contain > .l-col > span{
    margin-top: 0.2rem;
    margin-left: 0.125rem;
    font-size: 0.4rem;
    color: #808080;
}
.view-jijia .download-area > .contain > .r-col{
    margin-left: 0.5rem;
}
.view-jijia .download-area > .contain > .r-col > a{
    width: 6.35rem;
    line-height: 1.55rem;
    text-align: center;
    border-radius: 0.775rem;
    font-size: 0.5rem;
    color: #FFFFFF;
    background-color: #3f80d9;
    margin-top: 0.5rem;
}
.view-jijia .download-area > .contain > .r-col > a:active{
    background-color: #666666;
}

.view-jijia .download-area>.contain>.ll-col{
  margin-right: 0.5rem;
  height: 3.75rem;
  margin-bottom: 0.75rem;
  font-size: 2.75rem;
  background-color: #407b6c;
  color: #fff;
}
.view-jijia .download-area>.contain>.ll-col .svg-jijia-bot-logo{
  margin:0.5rem;
}
.view-jijia .download-area > .contain > .r-col > a:nth-child(1){
    background-color:#2a965e;
}
.view-jijia .download-area > .contain > .r-col > a:nth-child(1):active{
    background-color:#335e3d;
}

.view-jijia .introduction, .view-jijia .product h3.sub-title {
    color: #3e3a39;
}

.view-jijia .product {
    display: block;
    position: relative;
    z-index: 1;
    height: 18.25rem;
    overflow: hidden;

}


.view-jijia .product-1 {
    margin-top: 1.65rem;
    height: 18rem;
}
.view-jijia .product-5 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.view-jijia .product-2 .product-icon, .view-jijia .product-4 .product-icon {
    float: right;
}

.view-jijia .product .product-info {
    position: absolute;
    left: 3.75rem;
    height: 5.45rem;
}

.view-jijia .product-1 .product-info {
    top: 9rem;
}
.view-jijia .product-2 .product-info {
    top: 6.25rem;
}

.view-jijia .product-3 .product-info {
    top: 5.5rem;
}

.view-jijia .product-4 .product-info {
    top: 7rem;
}

.view-jijia .product-5 .product-info {
    top: 5.5rem;
}

.view-jijia .product-1 .product-info, .view-jijia .product-3 .product-info, .view-jijia .product-5 .product-info {
    right: 3.75rem;
    left: auto;
}

.view-jijia .product-1 .product-info {
    right: 3.25rem;
}

.view-jijia .product h2, .view-jijia .product h3 {
    font-weight: normal;
}

.view-jijia .product h2 {
    display: inline-block;
    padding-bottom: 0.2rem;
    margin-bottom: 0.2rem;
    border-bottom: 0.05rem solid #1b6a37;
    font-size: 0.95rem;
    color: #1ea039;
}

.view-jijia .product h3 {
    font-size: 0.7rem;
    color: #666;
}

.view-jijia .product .intro {
    padding: 0.625rem 0 0 0.875rem;
    width: 8.25rem;
    line-height: 1.3;
}
.view-jijia .product-5 .intro {
    padding: 0.75rem 0 0 0.5rem;
}

.view-jijia .product-1 .intro {
    width: 7.5rem;
}

.view-jijia .product-2 .intro-contain, .view-jijia .product-4 .intro-contain {
    /*-webkit-transform:rotateY(180deg);*/
    /*transform:rotateY(180deg);*/
    /*transform background-image will cause flicker when scrolling .view-jijia layer*/
}

.view-jijia .product-2 .intro, .view-jijia .product-4 .intro {
    /*-webkit-transform:rotateY(180deg);*/
    /*transform:rotateY(180deg);*/
    float: right;
    padding: 1.125rem 0.375rem 0;
    text-align: right;
}

.view-jijia .product-3 .intro {
    padding: 0.875rem 0 0 0.5rem;
}

.view-jijia .line, .view-abstract .line, .view-gupiao123 .line {
    display: block;
    width: 200%;
    height: 0rem;
    position: absolute;
    top: 28.25rem;
    z-index: 0;
    font-size: 0;
    border: 0rem solid #3AB971;
    border-bottom-width: 1px;
}

.view-jijia .line:nth-of-type(4n+1), .view-jijia .line:nth-of-type(4n) {
    -webkit-transform: rotate(-41deg);
    transform: rotate(-41deg);
}

.view-jijia .line:nth-of-type(4n+2), .view-jijia .line:nth-of-type(4n+3) {
    -webkit-transform: rotate(41deg);
    transform: rotate(41deg);
}

.view-jijia .line:nth-of-type(4n+1), .view-jijia .line:nth-of-type(4n+2) {
    -webkit-transform-origin: 0rem 0rem;
    transform-origin: 0rem 0rem;
}

.view-jijia .line:nth-of-type(4n), .view-jijia .line:nth-of-type(4n+3) {
    -webkit-transform-origin: 100% 0rem;
    transform-origin: 100% 0rem;
    right: 0;
}

.view-jijia .line:nth-of-type(1) {
    width: 30%;
    top:30.25rem;
    -webkit-transform: rotate(-43deg);
    transform: rotate(-43deg);
}

.view-jijia .line:nth-of-type(2) {
    top: 35rem;
    width: 32%;
}

.view-jijia .line:nth-of-type(3) {
    top: 51.25rem;
    width: 68%;
}

.view-jijia .line:nth-of-type(4) {
    top: 53.5rem;
    width: 25%;
}

.view-jijia .line:nth-of-type(5) {
    top: 69.5rem;
    width: 73%;
}

.view-jijia .line:nth-of-type(6) {
    top: 72.75rem;
    width: 30%;
}

.view-jijia .line:nth-of-type(7) {
    top: 89.25rem;
    width: 70%;
}
.view-jijia .line:nth-of-type(8) {
    top: 91.25rem;
    width: 20%;
}
.view-jijia .line:nth-of-type(9) {
    top: 107.75rem;
    width: 75%;
}

/*.view-jijia .download:nth-of-type(2){*/
/*margin-top: -1.5rem;*/
/*}*/

/*view abstract*/
.view-abstract {
    background-color: #E3E5E5;
}

.view-abstract .contain {
    /*position: relative;/!*fix transform line exceed container*!/*/
    padding-bottom: 2.5rem;
    background: url(abstractbg_s.5df5b361.jpg) no-repeat 50% 0;
    background-size: contain;
}

.view-abstract .contain > section {
    position: relative;
    z-index: 1;
}

.view-abstract section.top {
    padding-top: 2.75rem;
}

.view-abstract section.top .logo {
    margin: 0 auto;
}

.view-abstract section.top .introduction-pic {
    margin: 0 auto;
}

.view-jijia .introduction, .view-abstract .introduction {
    margin-bottom: 0.8rem;
    font-size: 1rem;
    font-weight: normal;
    text-align: center;
    color: #555;
}
.view-jijia .introduction{
    color:#3e3a39;
}

.view-abstract .introduction {
    margin-bottom: 4.5rem;
    font-size: 0.65rem;
}

.view-abstract .btn a {
    display: block;
    width: 6.15rem;
    height: 1.5rem;
    margin: 0 auto;
    line-height: 1.5rem;
    color: #eee;
    border-radius: 0.125rem;
    font-size: 0.8rem;
    text-align: center;
    text-decoration: none;
    -webkit-box-shadow: 0.075rem 0.15rem 0.125rem #bbb;
    box-shadow: 0.075rem 0.15rem 0.125rem #bbb;
}

.view-abstract .contain .top .btn {
    margin-top: 2rem;
}

.view-abstract .contain .btn {
    margin-top: 0.75rem;
}

.view-abstract .btn a {
    width: 7.5rem;
    height: 1.4rem;
    line-height: 1.4rem;
    background-color: #fff;
    border: 0.05rem solid #319ACF;
    color: #319ACF;
    font-size: 0.65rem;
}
.view-abstract .btn a:active{
    background-color: #bde4ef;
    color: #4591c2;
    border-color: #4591c2;
}

.view-abstract .product {
    height: auto;
    margin: 3rem auto 0;
}

.view-abstract .product:nth-of-type(even) {
    text-align: right;
}

.view-abstract section.product .product-icon {
    margin-top: 3.25rem;
}

.view-abstract section.product:nth-of-type(3) .product-icon {
    float: right;
    margin-right: 1.25rem;
}

.view-abstract section.product:nth-of-type(4) .product-icon {
    margin: 3.25rem auto;
}

.view-abstract .product-info {
    width: auto;
    background-color: #E3E5E5;
}

.view-abstract section.product:nth-of-type(even) .product-info {
    display: inline-block;
    margin-right: 1.5rem;
    padding-right: 0.5rem;
}

/*.view-abstract section.product:nth-of-type(3){*/
/*background-image: url(../image/abstract_s2.png);*/
/*background-position: 90% 100%;*/
/*}*/

.view-abstract section.product:nth-of-type(4) {
    text-align: left;
}

.view-abstract section.product:nth-of-type(3) .product-info {
    margin-left: 2.5rem;
    padding-left: 0.5rem;
}

.view-abstract section.product:nth-of-type(4) .product-info {
    margin-left: 6.25rem;
    padding-left: 0.75rem;
    margin-right: 0;
    padding-right: 0;

}

.view-abstract .product h3 {
    font-weight: normal;
}

.view-abstract .product .index, .view-abstract .product .title {
    color: #319ACF;
}

.view-abstract .product .index {
    display: inline-block;
    font-size: 0.85rem;
    line-height: 1.25rem;
}

.view-abstract .product .title {
    margin-bottom: 0.35rem;
    font-size: 0.65rem;
}

.view-abstract .product .sub-title {
    font-size: 0.55rem;
    line-height: 1.3;
}

.view .product .index > span:nth-of-type(2) {
    display: block;
    width: 0.4rem;
    height: 0.1rem;
    margin-left: 0.25rem;
    margin-bottom: 0.1rem;
}

.view-abstract .product .index > span:nth-of-type(2) {
    background-color: #319ACF;
}

.view-abstract .line {
    top: 20.5rem;
    border-color: #BCBCBC;
    -webkit-transform: rotate(35deg);
    transform: rotate(35deg);
}

.view-abstract .line:nth-child(odd) {
    -webkit-transform-origin: 0rem 0rem;
    transform-origin: 0rem 0rem;
    -webkit-transform: rotate(38deg);
    transform: rotate(38deg);
}

.view-abstract .line:nth-child(even) {
    -webkit-transform-origin: 100% 0rem;
    transform-origin: 100% 0rem;
    -webkit-transform: rotate(-38deg);
    transform: rotate(-38deg);
    right: 0;
}

.view-abstract .line:nth-child(2) {
    top: 37rem;
}

.view-abstract .line:nth-child(3) {
    top: 55rem;
}

.view-abstract .line:nth-child(4) {
    top: 73.75rem;
}

.view-abstract .line:nth-child(5) {
    top: 91.25rem;
}

.view-abstract .line:nth-child(6) {
    top: 19rem;
    right: auto;
    left: 0;
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-transform: rotate(-38deg);
    transform: rotate(-38deg);
    width: 30%;
}

/*view-aboutus*/
.view-aboutus {
    background-color: #36679a;
    font-size: 0.65rem;
    color: #461E06;
}

.view-aboutus .contain {
    background: #36679a url(bg_aboutus_1.da1a8432.jpg) no-repeat 50% 0%;
    background-size: cover;
    padding: 3rem 2.5rem 11.5rem;
    position: relative;
}

.view-aboutus .info .title {
    margin: 0 auto;
    text-align: center;
}

.view-aboutus .info p {
    margin: 0.75rem 0;
    line-height: 2.2;
    text-align: justify;
}

.view-aboutus .member {
    margin-left: -0.25rem;
}

.view-aboutus section.contact {
    position: absolute;
    z-index: 2;
    width: 13.5rem;
    left: 2.75rem;
    bottom: 6rem;
    padding-top: 0.75rem;
    border: 0rem solid #461E06;
    border-top-width: 0.025rem;
}

.view-aboutus section.contact li {
    list-style: none;
    text-align: center;
    line-height: 1.25rem;
    font-size: 0.6rem;
}

.view-aboutus section.contact li a {
    color: #461E06;
}

.view-aboutus section.contact li:nth-of-type(1) a {
    color: #094783
}

.view-aboutus section.contact li:nth-of-type(1) .val, .view-aboutus section.contact li:nth-of-type(2) .val {
    font-style: italic;
}

.view-aboutus .btlogo-contain {
    position: absolute;
    bottom: 0rem;
    left: 0;
    z-index: 2;
    width: 100%;
}

.view-aboutus .btlogo-contain .icon-btlogo {
    margin: 0 auto;
}

.view-aboutus .triangle {
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    border-style: solid;
    border-width: 8.25rem 8.25rem 0 0;
    border-color: rgba(104, 5, 74, .1) transparent transparent transparent;
}

.view-aboutus .triangle:nth-of-type(2) {
    left: auto;
    right: 0;
    border-width: 0 8.25rem 8.25rem 0;
    border-color: transparent rgba(76, 2, 53, .1) transparent transparent;
}

.view-aboutus .triangle:nth-of-type(3) {
    right: 0;
    left: auto;
    top: auto;
    bottom: 0;
    border-width: 0 0 9.75rem 9.75rem;
    border-color: transparent transparent rgba(48, 54, 116, .3) transparent;
}

.view-aboutus .triangle:nth-of-type(4) {
    top: auto;
    bottom: 0;
    border-width: 9.75rem 0 0 9.75rem;
    border-color: transparent transparent transparent rgba(41, 67, 135, .2);
}

.cross-btn .cross {
    font-size: 0.95rem;
}

.jijia .cross-btn .cross {
    color: #26876D;
}

.aboutus .cross-btn .cross, .abstract .cross-btn .cross {
    color: #ffffff;;
}

.gupiao123 .cross-btn .cross {
    color: #37428A
}

/*.view-gupiao123*/
.view-gupiao123 .contain {
    position: relative;
    background: #fff url(gupiao123.a0f5756a.jpg) no-repeat 50% 0;
    background-size: contain;
}

.view-gupiao123 section {
    overflow: hidden;
}

.view-gupiao123 section.top {
    height: 31.55rem;
    margin-bottom: 0.625rem;
}

.view-gupiao123 section:nth-of-type(2) {
    height: 26.15rem;
}

.view-gupiao123 section:nth-of-type(3) {
    height: 24.775rem;
}

.view-gupiao123 section:nth-of-type(4) {
    height: 26rem;
    margin-bottom: -0.625rem;
}

.view-gupiao123 section:nth-of-type(5) {
    height: 26.525rem;
}

.view-gupiao123 section:nth-of-type(6) {
    height: 20.675rem;
}

.view-gupiao123 .top .title {
    margin-top: 1rem;
    margin-left: 1.375rem;
}

.view-gupiao123 .top h1, .view-gupiao123 .top h2 {
    font-weight: normal;
    color: #EfEfEf;

}

.view-gupiao123 .top h1 span {
    display: block;
    width: 0.75rem;
    height: 0.1rem;
    margin-top: -0.75rem;
    margin-bottom: 0.25rem;
    background-color: #efefef;
}

.view-gupiao123 .top h2 span {
    display: block;
}

.view-gupiao123 .top .logo {
    float: right;
    margin-right: 2rem;
}

.view-gupiao123 .top .banner {
    margin-top: 4.5rem;
    margin-left: 0.5rem;
}

.view-gupiao123 .download {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    text-align: center;

}

.view-gupiao123 .download .item {
    display: inline-block;
    width: 7.25rem;
    margin: 0 0.625rem 1rem;
}

.view-gupiao123 .download .item a {
    display: block;
    height: 2.35rem;
    line-height: 2.35rem;
    background-color: #5757A3;
    border-radius: 0.125rem;
    -webkit-box-shadow: 0rem 0.1rem 0.1rem #bbb;
    box-shadow: 0rem 0.1rem 0.1rem #bbb;
    color: #ffffff;
    text-align: left;
    font-size: 0.6rem;
}

.view-gupiao123 .download .item a .ico {
    font-size: 1rem;
    vertical-align: middle;
    margin-left: 1rem;
    margin-right: 0.5rem;
}

.view-gupiao123 .download .item:nth-child(4) .ico, .view-gupiao123 .download .item:nth-child(8) .ico {
    margin-right: 1rem;
}

.view-gupiao123 .download .item:nth-child(2) a {
    background-color: #7757A0;
}

.view-gupiao123 .download .item:nth-child(3) a {
    background-color: #77C4D3;
}

.view-gupiao123 .download .item:nth-child(4) a {
    background-color: #169DEF;
}

.view-gupiao123 .download .item a:active{
    background-color: #43477e;
}
.view-gupiao123 .download .item:nth-child(2) a:active {
    background-color: #5e4680;
}

.view-gupiao123 .download .item:nth-child(3) a:active {
    background-color: #66a2a5;
}

.view-gupiao123 .download .item:nth-child(4) a:active {
    background-color: #3781ae;
}

.view-gupiao123 .product {
    text-align: center;
}

.view-gupiao123 .product .index {
    display: inline-block;
    font-size: 1rem;
    line-height: 1.5em;
}

.view-gupiao123 .product .index > span:nth-of-type(2) {
    width: 0.5rem;
    margin-left: 0.3rem;
    background-color: #424096;
}

.view-gupiao123 .product-info {
    display: inline-block;
    padding: 0 1rem 1rem;
    background-color: #ffffff;
    color: #424096;
}

.view-gupiao123 .product-info .txt {
    font-size: 0.75rem;
}

.view-gupiao123 .product .sub-title {
    margin-top: 0.25rem;
    color: #000;
    font-size: 0.7rem;
    font-weight: normal;
}

.view-gupiao123 .product .product-icon {
    margin: 2rem auto 3rem;
}

.view-gupiao123 .product:nth-of-type(2) .product-icon, .view-gupiao123 .product:nth-of-type(5) .product-icon {
    position: relative;
    background-color: #ffffff;
}

.view-gupiao123 .product:nth-of-type(2) .product-icon {
    position: relative;
}

.view-gupiao123 .product:nth-of-type(2) .product-icon .info {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
}

.view-gupiao123 .product:nth-of-type(2) .product-icon span {
    display: block;
    font-size: 0.8rem;
    color: #ffffff;
}

.view-gupiao123 .product:nth-of-type(2) .product-icon span:last-child {
    font-size: 1.5rem;
    line-height: 1.5;
}

.view-gupiao123 .product:nth-of-type(5) .product-icon {
    margin-top: 0rem;
}

.view-gupiao123 .contain > section {
    position: relative;
    z-index: 1;
}

.view-gupiao123 .line {
    top: 11.25rem;
    border-color: #424096;
}

.view-gupiao123 .line:nth-child(odd) {
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: rotate(-35deg);
    transform: rotate(-35deg);
    right: 0;
    left: auto;
}

.view-gupiao123 .line:nth-child(even) {
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: rotate(35deg);
    transform: rotate(35deg);
}

.view-gupiao123 .line:nth-child(2) {
    top: 30rem;
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
}

.view-gupiao123 .line:nth-child(3) {
    top: 44rem;
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg);
}

.view-gupiao123 .line:nth-child(4) {
    top: 57.5rem;
    -webkit-transform: rotate(25deg);
    transform: rotate(25deg);
}

.view-gupiao123 .line:nth-child(5) {
    top: 78.75rem;
    -webkit-transform: rotate(-32deg);
    transform: rotate(-32deg);
}

.view-gupiao123 .line:nth-child(6) {
    top: 95rem;
    -webkit-transform: rotate(25deg);
    transform: rotate(25deg);
}

.view-gupiao123 .line:nth-child(7) {
    top: 108.5rem;
    -webkit-transform: rotate(-32deg);
    transform: rotate(-32deg);
}

.view-gupiao123 .line:nth-child(8) {
    top: 132.5rem;
    -webkit-transform: rotate(25deg);
    transform: rotate(25deg);
}

/*animation & transition*/
@-webkit-keyframes bounceUpDown {
    0%, 20%, 40% {
        -webkit-transform: translate(0rem, 0rem);
        transform: translate(0rem, 0rem);
    }
    10%, 30% {
        -webkit-transform: translate(0rem, -0.25rem);
        transform: translate(0rem, -0.25rem);
    }
}

@keyframes bounceUpDown {
    0%, 20%, 40% {
        -webkit-transform: translate(0rem, 0rem);
        transform: translate(0rem, 0rem);
    }
    10%, 30% {
        -webkit-transform: translate(0rem, -0.25rem);
        transform: translate(0rem, -0.25rem);
    }
}

.swiper-container {
    background: #043570 url(bg_home_s.0da6f33e.jpg) no-repeat 50% -3.5rem;
    background-size: cover;
}

.swiper-container .swiper-slide-active .slide-btn {
    -webkit-animation: bounceUpDown 1.8s 0s both ease-in-out infinite;
    animation: bounceUpDown 1.8s 0s both ease-in-out infinite;
}

@-webkit-keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.3);
    }
    50% {
        opacity: 1;
        -webkit-transform: scale(1.05);
    }
    70% {
        -webkit-transform: scale(0.9);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
    }
}

/*add from swiper.css*/
.swiper-container-android .swiper-slide, .swiper-wrapper {
    -webkit-transform: translate3d(0rem, 0, 0);
    transform: translate3d(0rem, 0, 0);
}

/*end add from swiper.css*/
.swiper-slide-active #hexagon a {
    -webkit-animation: bounceIn .8s 0s both ease-in-out;
    animation: bounceIn .8s 0s both ease-in-out;
}

.swiper-slide-active #hexagon a:nth-child(2) {
    -webkit-animation-delay: .2s;
}

.swiper-slide-active #hexagon a:nth-child(3) {
    -webkit-animation-delay: .4s;
}

.swiper-slide-active #hexagon a:nth-child(4) {
    -webkit-animation-delay: .6s;
}

/*swiper*/
.swiper-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.transition-normal {
    -webkit-transition: -webkit-transform .6s ease;
    transition: transform .6s ease;
}

/*.view-home svg style*/
#hexagon .link {
    font-size: 3.15rem;
}

#hexagon .link:nth-of-type(2) {
    font-size: 1.35rem;
}

#hexagon .link:nth-of-type(4) {
    font-size: 2.4rem;
}

.view-home .link > .svg {
    position: absolute;
    top: 3.2rem;
    left: 2.5rem;
}

.view-home .link > .svg-jijiaicon_home {

}

.view-home .link > .svg-abstracticon_home {
    top: 4.2rem;
    left: 1.2rem;
}

.view-home .link > .svg-gupiaoicon_home {
   
}

.view-home .link > .svg-abouticon_home {
    top: 4rem;
    left: 1.5rem;
}

/*
Icon classes can be used entirely standalone. They are named after their original file names.

```html
<!-- `display: block` sprite -->
<div class="icon-home"></div>

<!-- `display: inline-block` sprite -->
<img class="icon-home" />
```
*/
.icon-arrow {
  background-image: url(s0.8d2af2bf.png);
  background-position: -3.75rem -3.825rem;
  background-size:10.28rem 6.35rem;
  width: 1.25rem;
  height: 0.65rem;
}
.icon-logo_home {
  background-image: url(s0.8d2af2bf.png);
  background-size:10.28rem 6.35rem;
  background-position: -6.875rem 0rem;
  width: 3.375rem;
  height: 3.375rem;
}
.icon-logo_home2 {
  background-image: url(s0.8d2af2bf.png);
  background-size:10.28rem 6.35rem;
  background-position: 0rem -4.65rem;
  width: 1.7rem;
  height: 1.7rem;
}
.icon-slogan_home {
  background-image: url(s0.8d2af2bf.png);
  background-size:10.28rem 6.35rem;
  background-position: 0rem 0rem;
  width: 6.825rem;
  height: 3.775rem;
}
.icon-tuofengkejitext {
  background-image: url(s0.8d2af2bf.png);
  background-size:10.28rem 6.35rem;
  background-position: 0rem -3.825rem;
  width: 3.7rem;
  height: 0.775rem;
}

/*
Icon classes can be used entirely standalone. They are named after their original file names.

```html
<!-- `display: block` sprite -->
<div class="icon-home"></div>

<!-- `display: inline-block` sprite -->
<img class="icon-home" />
```
*/
.icon-jijia_intro_1 {
  background-image: url(s1.56c2b1fe.png);
  background-size:43.55rem 33.05rem;
  background-position: 0rem 0rem;
  width: 10.85rem;
  height: 17.125rem;
}
.icon-jijia_intro_2 {
  background-image: url(s1.56c2b1fe.png);
  background-size:43.55rem 33.05rem;
  background-position: -10.9rem 0rem;
  width: 10.85rem;
  height: 17.125rem;
}
.icon-jijia_intro_3 {
  background-image: url(s1.56c2b1fe.png);
  background-size:43.55rem 33.05rem;
  background-position: -21.8rem 0rem;
  width: 10.85rem;
  height: 17.125rem;
}
.icon-jijia_intro_4 {
  background-image: url(s1.56c2b1fe.png);
  background-size:43.55rem 33.05rem;
  background-position: -32.7rem 0rem;
  width: 10.85rem;
  height: 17.125rem;
}
.icon-jijia_intro_5 {
  background-image: url(s1.56c2b1fe.png);
  background-size:43.55rem 33.05rem;
  background-position: 0rem -17.175rem;
  width: 9.35rem;
  height: 15.875rem;
}
.icon-jijialogo {
  background-image: url(s1.56c2b1fe.png);
  background-size:43.55rem 33.05rem;
  background-position: -19.2rem -17.175rem;
  width: 3.05rem;
  height: 3.025rem;
}
.icon-popo {
  background-image: url(s1.56c2b1fe.png);
  background-size:43.55rem 33.05rem;
  background-position: -9.4rem -17.175rem;
  width: 4.85rem;
  height: 5.45rem;
}
.icon-popo_reverse {
  background-image: url(s1.56c2b1fe.png);
  background-size:43.55rem 33.05rem;
  background-position: -14.3rem -17.175rem;
  width: 4.85rem;
  height: 5.45rem;
}

/*
Icon classes can be used entirely standalone. They are named after their original file names.

```html
<!-- `display: block` sprite -->
<div class="icon-home"></div>

<!-- `display: inline-block` sprite -->
<img class="icon-home" />
```
*/
.icon-aboutuslogo {
  background-image: url(s2.1b6af5bd.png);
  background-size:46.1rem 29.65rem;
  background-position: -39.45rem -8.45rem;
  width: 4.825rem;
  height: 2.65rem;
}
.icon-abstract_s0 {
  background-image: url(s2.1b6af5bd.png);
  background-size:46.1rem 29.65rem;
  background-position: 0rem 0rem;
  width: 16.475rem;
  height: 14.45rem;
}
.icon-abstract_s1 {
  background-image: url(s2.1b6af5bd.png);
  background-size:46.1rem 29.65rem;
  background-position: 0rem -14.5rem;
  width: 14.425rem;
  height: 15.15rem;
}
.icon-abstract_s2 {
  background-image: url(s2.1b6af5bd.png);
  background-size:46.1rem 29.65rem;
  background-position: -16.525rem -13.675rem;
  width: 11.05rem;
  height: 14.65rem;
}
.icon-abstract_s3 {
  background-image: url(s2.1b6af5bd.png);
  background-size:46.1rem 29.65rem;
  background-position: -16.525rem 0rem;
  width: 14.975rem;
  height: 13.625rem;
}
.icon-abstractlogo {
  background-image: url(s2.1b6af5bd.png);
  background-size:46.1rem 29.65rem;
  background-position: -31.55rem -8.45rem;
  width: 7.85rem;
  height: 2.725rem;
}
.icon-btlogo {
  background-image: url(s2.1b6af5bd.png);
  background-size:46.1rem 29.65rem;
  background-position: -31.55rem -11.225rem;
  width: 2.175rem;
  height: 3.825rem;
}
.icon-member {
  background-image: url(s2.1b6af5bd.png);
  background-size:46.1rem 29.65rem;
  background-position: -31.55rem 0rem;
  width: 14.55rem;
  height: 8.4rem;
}

/*
Icon classes can be used entirely standalone. They are named after their original file names.

```html
<!-- `display: block` sprite -->
<div class="icon-home"></div>

<!-- `display: inline-block` sprite -->
<img class="icon-home" />
```
*/
.icon-gupiao_intro1 {
  background-image: url(s3.f0ddc2db.png);
  background-size:48.35rem 43.775rem;
  background-position: -34.05rem 0rem;
  width: 14.3rem;
  height: 14.925rem;
}
.icon-gupiao_intro2 {
  background-image: url(s3.f0ddc2db.png);
  background-size:48.35rem 43.775rem;
  background-position: -14.8rem -17.275rem;
  width: 14.7rem;
  height: 13.55rem;
}
.icon-gupiao_intro3 {
  background-image: url(s3.f0ddc2db.png);
  background-size:48.35rem 43.775rem;
  background-position: 0rem -17.275rem;
  width: 14.75rem;
  height: 14.75rem;
}
.icon-gupiao_intro4 {
  background-image: url(s3.f0ddc2db.png);
  background-size:48.35rem 43.775rem;
  background-position: 0rem 0rem;
  width: 16.35rem;
  height: 17.225rem;
}
.icon-gupiao_intro5 {
  background-image: url(s3.f0ddc2db.png);
  background-size:48.35rem 43.775rem;
  background-position: 0rem -32.075rem;
  width: 16.625rem;
  height: 11.7rem;
}
.icon-gupiao_title {
  background-image: url(s3.f0ddc2db.png);
  background-size:48.35rem 43.775rem;
  background-position: -34.05rem -18.325rem;
  width: 7.025rem;
  height: 2.725rem;
}
.icon-gupiao_topbg {
  background-image: url(s3.f0ddc2db.png);
  background-size:48.35rem 43.775rem;
  background-position: -16.4rem 0rem;
  width: 17.6rem;
  height: 14.3rem;
}
.icon-gupiaologo {
  background-image: url(s3.f0ddc2db.png);
  background-size:48.35rem 43.775rem;
  background-position: -44.425rem -14.975rem;
  width: 3.05rem;
  height: 3.05rem;
}
.icon-tips_wechat {
  background-image: url(s3.f0ddc2db.png);
  background-size:48.35rem 43.775rem;
  background-position: -34.05rem -14.975rem;
  width: 10.325rem;
  height: 3.3rem;
}

.svg {
	display: inline-block;
	width: 1em;
	height: 1em;
	fill: currentColor;
}

/* =======================================================================================
Example showing how to change the color/size of the icons:
.svg-name {
	font-size: 0.8rem; // works because "width" & "height" were set using em units
	color: red; // works for single-colored icons, because "fill" was set to "currentColor"
}
======================================================================================== */
.fill-color1 {
	fill: #000;
}
.fill-color2 {
	fill: #407b6c;
}
.fill-color3 {
	fill: #438b3b;
}
.fill-color4 {
	fill: #e66918;
}
.fill-color5 {
	fill: #3f9bcf;
}
.fill-color6 {
	fill: #e83828;
}
.fill-color7 {
	fill: #f5ae33;
}
.fill-color8 {
	fill: #fff;
}


.svg-jijiaicon_home {
	width: 0.9921875em;
}

.svg-abouticon_home {
	width: 2.10546875em;
}

.svg-abstracticon_home {
	width: 4.5185546875em;
}

.svg-gupiaoicon_home {
	width: 1.0341796875em;
}