#zh-cn{
    font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial",sans-serif;
    overflow:hidden;
}

#en,#de{
    font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
    overflow:hidden;
}

html, body {
    min-width: 1180px;
    color: #333;
}
a{
    text-decoration: none;
}
p{
    margin:0;
    padding:0;
    color: #666;
}
.text-center {
    text-align: center;
}

.p-font {
    font-size: 16px;
    line-height: 1.5;
    color: #686868;
}

.we-content-wrap {
    width: 60%;
    min-width: 1080px;
    margin: auto;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.we-content {
    width: 80%;
    margin: auto;
}

.pos_ab {
    position: absolute;
}

.pos-re {
    position: relative;
}

.dis_flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.flex_column{
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
}

.flex1 {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}

.flex2 {
    -webkit-box-flex: 2;
        -ms-flex: 2;
            flex: 2;
}
.flex4{
    -webkit-box-flex: 4;
        -ms-flex: 4;
            flex: 4;
}
.flex3{
    -webkit-box-flex: 3;
        -ms-flex: 3;
            flex: 3;
}

.flex5{
    -webkit-box-flex: 5;
        -ms-flex: 5;
            flex: 5;
}
.flex6{
    -webkit-box-flex: 6;
        -ms-flex: 6;
            flex: 6;
}
.flex7{
    -webkit-box-flex: 7;
        -ms-flex: 7;
            flex: 7;
}
.flex8{
    -webkit-box-flex: 8;
        -ms-flex: 8;
            flex: 8;
}
.flex9{
    -webkit-box-flex: 9;
        -ms-flex: 9;
            flex: 9;
}


.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.over_hid {
    overflow: hidden;
}

.float_l {
    float: left;
}

.float_r {
    float: right;
}

.arrow-next:before, .arrow-next:after, .arrow-prew:before, .arrow-prew:after {
    position: absolute;
    left: 50%;
    width: 2px;
    height: 70%;
    top: 50%;
    background: #ababab;
    content: '';
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.arrow-next:before {
    -webkit-transform: translateX(-50%) rotate(120deg);
    transform: translateX(-50%) rotate(120deg);
    margin-left: 1px;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
}

.arrow-next:after {
    -webkit-transform: translateX(-50%) rotate(-120deg);
    transform: translateX(-50%) rotate(-120deg);
    margin-left: -1px;
    margin-top: -1px;
    top: 50%;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
}

.arrow-prew:before {
    -webkit-transform: translateX(-50%) rotate(60deg);
    transform: translateX(-50%) rotate(60deg);
    margin-left: 1px;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
}

.arrow-prew:after {
    -webkit-transform: translateX(-50%) rotate(-60deg);
    transform: translateX(-50%) rotate(-60deg);
    margin-left: -1px;
    margin-top: -1px;
    top: 50%;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
}

.arrow-wrap {
    position: absolute;
    bottom: -5px;
    height: 50px;
    left: 0;
    width: 66px;
    right: 0;
    margin: auto;
    cursor: pointer;
}

.arrow-wrap2 {
    position: absolute;
    height: 50px;
    width: 66px;
    margin: auto;
    cursor: pointer;
    z-index: 5;
    left: 0;
    right: 0;
    top: -5px;
}

/*scrollbar*/


/*************** SCROLLBAR BASE CSS ***************/

.scroll-wrapper {
    overflow: hidden !important;
    padding: 0 !important;
    position: relative;
}

.scroll-wrapper>.scroll-content {
    border: none !important;
    box-sizing: content-box !important;
    height: auto;
    left: 0;
    margin: 0;
    max-height: none;
    max-width: none !important;
    overflow: scroll !important;
    padding: 0;
    position: relative !important;
    top: 0;
    width: auto !important;
}

.scroll-wrapper>.scroll-content::-webkit-scrollbar {
    height: 0;
    width: 0;
}

.scroll-element {
    display: none;
}

.scroll-element, .scroll-element div {
    box-sizing: content-box;
}

.scroll-element.scroll-x.scroll-scrollx_visible, .scroll-element.scroll-y.scroll-scrolly_visible {
    display: block;
}

.scroll-element .scroll-bar, .scroll-element .scroll-arrow {
    cursor: default;
}

.scroll-textarea {
    border: 1px solid #cccccc;
    border-top-color: #999999;
}

.scroll-textarea>.scroll-content {
    overflow: hidden !important;
}

.scroll-textarea>.scroll-content>textarea {
    border: none !important;
    box-sizing: border-box;
    height: 100% !important;
    margin: 0;
    max-height: none !important;
    max-width: none !important;
    overflow: scroll !important;
    outline: none;
    padding: 2px;
    position: relative !important;
    top: 0;
    width: 100% !important;
}

.scroll-textarea>.scroll-content>textarea::-webkit-scrollbar {
    height: 0;
    width: 0;
}


/*************** SIMPLE INNER SCROLLBAR ***************/

.scrollbar-inner>.scroll-element, .scrollbar-inner>.scroll-element div {
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10;
}

.scrollbar-inner>.scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}

.scrollbar-inner>.scroll-element.scroll-x {
    display: none !important;
}

.scrollbar-inner>.scroll-element.scroll-y {
    height: 100%;
    right: 2px;
    top: 0;
    width: 8px;
}

.scrollbar-inner>.scroll-element .scroll-element_outer {
    overflow: hidden;
}

.scrollbar-inner>.scroll-element .scroll-element_outer, .scrollbar-inner>.scroll-element .scroll-element_track, .scrollbar-inner>.scroll-element .scroll-bar {
    border-radius: 8px;
}

.scrollbar-inner>.scroll-element .scroll-element_track, .scrollbar-inner>.scroll-element .scroll-bar {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    filter: alpha(opacity=40);
    opacity: 0.4;
}

.scrollbar-inner>.scroll-element .scroll-element_track {
    background-color: #e0e0e0;
}

.scrollbar-inner>.scroll-element .scroll-bar {
    background-color: #c2c2c2;
}

.scrollbar-inner>.scroll-element:hover .scroll-bar {
    background-color: #919191;
}

.scrollbar-inner>.scroll-element.scroll-draggable .scroll-bar {
    background-color: #919191;
}


/* update scrollbar offset if both scrolls are visible */

.scrollbar-inner>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
    left: -12px;
}

.scrollbar-inner>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
    top: -12px;
}

.scrollbar-inner>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -12px;
}

.scrollbar-inner>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -12px;
}

.table-cell{
    display: table-cell;
    vertical-align: middle;
}