a:hover {
    text-decoration: none
}

li {
    list-style: none;
    display   : inline-block;
}

/*
@font-face {
    font-family: PingFangSC-Medium;
    src: url('/static/font/PingFang_Medium.otf');
}

@font-face {
    font-family: PingFangSC-Regular;
    src: url('/static/font/PingFang_Regular.otf');
}

@font-face {
    font-family: PingFangSC-Semibold;
    src: url('/static/font/PingFang-SC-Semibold.otf');
}


@font-face {
    font-family: PingFangSC-Light;
    src: url('/static/font/PingFang_Light.ttf');
}
*/


#root {
    font-family: AppSans, Avenir, Arial, PingFang SC, Microsoft YaHei, SimSun, sans-serif;
    color      : #333;
    /*font-size: 14px;*/
}

.content-body {
    margin        : 0 auto;
    margin-top    : 100px;
    /*padding-left: 18.4%;
    padding-right : 18.4%;*/
    width         : 1200px;
}

.logo {
    /*text-align: center;*/
    margin-top: 5px;
}

.logo img {
    height: 36px;
    width : 120px;
}

.navi-body {
    width : 1200px;
    margin: 0 auto;
}

.navi {
    height     : 70px;
    line-height: 70px;
}

.info5-title h1 {
    text-align: center;
    padding   : 145px 0 100px 0;
}

.info5-line {
    padding-top: 140px;
}

.block-100px {
    line-height: 100px;
    height     : 100px;
}

.links-body {
    text-align: right;
}

.links-area {
    margin-bottom: -8px;
}

.navi-link {
    /*margin-right: 40px;*/
    height     : 65px;
    width      : 13%;
    text-align : center;
    overflow   : hidden;
    padding-top: 5px;
}

.navi-link a {
    font-size: 14px;
    color    : #333;
}

[about-links] {
    z-index: 1003;
}

.about-links {
    position: absolute;
    z-index : 1002;
    top     : 65px;

    background: #fff;
    text-align: center;

    display: none;

    right: 12px;
    width: 100px;
}

.about-link {
    height     : 40px;
    line-height: 40px;
    margin     : 15px 0;
}

.about-link:hover {
    color      : #4FB1E2;
    font-weight: 600;
}

.about-link {
    display: block;
}

[solution-links] {
    z-index: 1003;
}

.solution-links {
    position: absolute;
    z-index : 1002;
    top     : 65px;

    background: #fff;
    text-align: center;

    display: none;

    right: 300px;
    width: 200px;
}

.solution-link {
    height     : 40px;
    line-height: 40px;
    margin     : 15px 0;
}

.solution-link:hover {
    color      : #4FB1E2;
    font-weight: 600;
}

.solution-link {
    display: block;
}

.hover-link {
    position  : absolute;
    width     : 500px;
    height    : 280px;
    padding   : 20px 0;
    background: #fff;
    top       : 66px;
    left      : 207px;
    /*border  : 1px solid red;*/
    z-index   : 1003;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 3px 7px 0px rgba(214, 220, 215, 0.35);
    display   : none;
}
.hover-link-item {
    width       : 120px;
    height      : 104px;
    text-align  : center;
    float       : left;
    padding     : 15px 0;
    margin-bottom: 15px;
    border-right: 1px solid #D6D7DC;
}

.hover-link-item:hover .hover-link-item-name {
    color      : #4FB1E2;
    font-weight: 600;
}

.hover-link-item:last-child {
    border-right: 0px solid #D6D7DC;
}

.hover-link-item img {
    width  : 40px;
    height : 32px;
    display: block;
    margin : 0 auto;
}

.hover-link-item-name {
    height     : 50px;
    color      : #333;
    line-height: 130%;
    padding-top: 20px;
}



.navi-link-active {
    /*border-bottom: 4px solid #4FB1E2;*/
}

.navi-link-active>a {
    color         : #2299e6;
    padding-bottom: 12px;
    border-bottom : 4px solid #2299e6;
}

.lang {
    line-height: 25px;
    margin-top : 26px;
}

.lang div {
    float       : left;
    margin-right: 15px;
    height      : 25px;
    color       : #333;
}

.lang-zh {
    width     : 36px;
    text-align: center;
}

.lang-en {
    width     : 36px;
    text-align: center;
}

.lang-active {
    background   : #2299e6;
    border-radius: 13px;
    color        : #fff !important;
}


.swiper-container {
    width        : 100%;
    /* max-height: 800px; */
    max-height   : calc(100vh);
}

.swiper-slide {
    position: relative;
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity          : 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform        : translate3d(0, -100%, 0)
    }

    100% {
        opacity          : 1;
        -webkit-transform: none;
        transform        : none
    }
}

@keyframes fadeInDown {
    0% {
        opacity          : 0;
        -webkit-transform: translate3d(0, -100%, 0);
        -ms-transform    : translate3d(0, -100%, 0);
        transform        : translate3d(0, -100%, 0)
    }

    100% {
        opacity          : 1;
        -webkit-transform: none;
        -ms-transform    : none;
        transform        : none
    }
}

.banner-text-1 {
    position         : absolute;
    top              : 32px;
    left             : 18.75%;
    -webkit-animation: fadeInDown 0.5s 1;
    animation        : fadeInDown 0.5s 1;
}

.banner-text-1 div {
    font-size    : 3.6vw;
    color        : #fff;
    background   : rgba(79, 177, 226, 1);
    opacity      : 0.9;
    margin-bottom: 10px;
    text-align   : left;
    padding      : 5px;
}

.banner-text-1 div:first-child {
    letter-spacing: 5px;
}

.banner-text-1 div:last-child {
    width: 95%;
}

.banner-text-1-project div:first-child {
    /*width: 73%;*/
    text-align: center;
    display   : inline-block;
}

.banner-text-1-project div:last-child {
    width     : 100%;
    font-size : 3.2vw;
    background: transparent;
    padding   : 0;
    /*display : inline-block;*/
}

.banner-text-1-project {
    left: 16%;
}

.banner-text-1-project-text {
    background: red;
    display   : inline-block;
    padding   : 5px;
    background: rgba(79, 177, 226, 1);
}

.banner-text-area {
    position: absolute;
    right   : 22%;
    padding : 1.1vw;
    z-index : 999;
}

.banner-text-area-v {
    width: 36vw;
}

.banner-text-area-last-child {
    /*background: #b8b6b61f;*/
}



.banner-text-bg {
    position  : absolute;
    top       : 0;
    right     : 6%;
    width     : 31%;
    background: #4FB1E2;
    height    : 100%;
    opacity   : 0.8;
}

.banner-text-bg-1 {}

.banner-text-area1 {
    top        : 33%;
    font-weight: 500;
    color      : #fff;
    width      : 55vw;
    text-align : center;
}

.banner-text-bg-2 {
    width: 40%;
    left : 0;
}

.banner-text-area-2 {
    left  : 14%;
    height: 66%;
}

.text-pad-bg {
    position  : absolute;
    top       : 0;
    left      : 0;
    background: #e5dede;
    opacity   : 0.3;
    z-index   : -9;
    width     : 16%;
    height    : 100%;
}

.banner-text-2 {
    font-size  : 3.5vw;
    font-weight: 600;
}

.banner-text-3 {
    font-size    : 1vw;
    font-weight  : 400;
    margin-top   : 1vw;
    margin-bottom: 1vw;
    line-height  : 2vw;
}

.banner2-text-2 {
    color: #fff;
}

.banner2-text-3 {
    font-size: 3vw;
}

.banner2-text-4 {}

.banner-img {
    width        : 100%;
    /* max-height: 800px; */
    max-height   : calc(100vh);
}

.banner1-name {
    font-size : 18px;
    color     : #fff;
    text-align: center;
}

.banner1-num {
    text-align: center;
    font-size : 3vw;
}


.banner-text-area-project {
    border-width: 0;
    background  : #4FB1E2;
    top         : auto;
    right       : 15%;
    bottom      : 12%;
    height      : auto;
}

.banner-text-2-project {
    font-size: 2.5vw;
}

.banner-text-3-project {
    color: #fff;
}

.btn-use-project {
    border     : 0 solid #fff;
    background : #fff;
    color      : #5BB5E2;
    font-weight: 600;
    margin-top : 2%;
}

.ai-list {
    margin-top: 3vw;
}

.ai-item {
    margin-bottom: 2vw;
}

.ai-img {
    float: left;
    width: 2.2vw;
}

.ai-text {
    float       : left;
    color       : #fff;
    font-size   : 0.9vw;
    height      : 2.2vw;
    line-height : 2.2vw;
    padding-left: 1vw;
    width       : 10vw;
}

.ai-area {
    position: absolute;
    /*border: 1px solid #fff;*/
    width   : 50%;
    height  : 100%;
    top     : 0;
    right   : 0;
    z-index : 1999;
}

.ai-icon {
    position: relative;
    width   : 18%;
}

.ai-icon-img {
    width   : 3vw;
    height  : 3vw;
    z-index : 999;
    position: relative;

    background-size  : 100% 100% !important;
    background-repeat: no-repeat !important;
}

.ai-icon-text {
    color        : #fff;
    background   : #90979C;
    text-align   : center;
    position     : absolute;
    top          : 5px;
    left         : 1vw;
    width        : 6vw;
    font-size    : 0.8vw;
    padding-left : 1.4vw;
    z-index      : 0;
    border-radius: 5px;
}

.ai-icon-img-con {
    position: relative;
}

.ai-flash {
    width : 1.5vw;
    height: 1.5vw;

    position: absolute;
    top     : 25%;
    left    : 25%;

    border-radius: 50%;
    animation    : aiFlash 1.5s infinite;
    box-shadow   : 0px 0px 1px #009FD9;
}

@keyframes aiFlash {
    10% {
        transform: scale(1);
    }

    100% {
        transform: scale(3);
    }
}

.ai-1 {
    top : 10%;
    left: 34%;
}

.flash-1 {
    box-shadow: 0px 0px 1px #009FD9;
}

.ai-2 {
    top : 27%;
    left: 16%;
}

.flash-2 {
    box-shadow: 0px 0px 1px #009FD9;
}

.ai-3 {
    top : 19%;
    left: 36%;
}

.flash-3 {
    box-shadow: 0px 0px 2px #E3C120;
}

.ai-4 {
    top : 29%;
    left: 24%;
}

.flash-4 {
    box-shadow: 0px 0px 1px #0DCC7E;
}

.ai-5 {
    top : 19%;
    left: 47%;
}

.flash-5 {
    box-shadow: 0px 0px 1px #009FD9;
}

.ai-6 {
    top : 26%;
    left: 10%;
}

.flash-6 {
    box-shadow: 0px 0px 2px #89AFFF;
}

.ai-7 {
    top : 24%;
    left: 38%;
}

.flash-7 {
    box-shadow: 0px 0px 1px #009FD9;
}

.footer {
    height: 350px;
}

.footer-link>.row {
    width : 1200px;
    margin: 0 auto;
}

.footer-link {
    height     : 310px;
    background : #252525;
    padding    : 0 0%;
    padding-top: 50px;

    border-top: 1px solid #2299e6;
}

.footer-links {
    margin-top: 30px;
}

.footer-link-item-title {
    font-size  : 16px;
    color      : #2299e6;
    font-weight: bold;
}

.footer-links a {
    color: #fff;
}

.footer-links a:hover {
    color: #2299e6;
}

.footer-links a>div {
    margin-bottom: 5px;
}

.footer-info {
    height     : 100px;
    background : #000;
    color      : #fff;
    text-align : center;
    line-height: 150%;
    padding-top: 20px;
}

.btn-use {
    border-color: #000;
}

.btn-use:hover {
    color     : #fff;
    background: #2299e6;
}

.tip-bar {
    float     : left;
    width     : 6px;
    height    : 44px;
    background: rgba(15, 205, 249, 1);
}

.tip-title {
    float      : left;
    height     : 35px;
    font-size  : 36px;
    font-weight: 600;
    color      : rgba(51, 51, 51, 1);
    line-height: 39px;
    margin-left: 15px;
}

.line1 {
    width     : 53.17%;
    height    : 8px;
    background: rgba(79, 177, 226, 1);
}


.v-line {
    height      : 100%;
    border-left : 4px solid #D2DBE1;
    display     : inline-block;
    margin-left : 2px;
    padding-left: 2px;
}

.footer-qrcode-img {
    text-align: center;
}

.footer-qrcode-img img {
    margin: 0 auto;
}

.footer-qrcode-desc {
    text-align: center;
    font-size : 0.85vw;
    margin-top: 15px;
    color     : #fff;
}

.fm-txt {
    display: inline-block;
    padding: 30px 0;
}
.fm-sp {
    background: #F6F6F6;
}
.fm-img {
    margin-bottom: 50px;
}
.fm-ad {
    margin: 0 auto;
    margin-top: 50px;
    margin-bottom: 50px;
    width: 1200px;
}
.fm-ad .col-sm-3{
    height: 290px;
}
.fm-ad .icon-box{
    text-align: center;
}
.fm-ad .inner-box{
    margin: 30px 0;
}
.fm-ad .inner-box .text{
    padding: 0 30px;
    color: #727272;
}
.fm-ad h3{
    font-size: 20px;
    text-align: center;
    margin: 15px 0;
}

@media (min-width: 769px) {
    .swiper-pagination-bullet {
        width        : 70px;
        height       : 5px;
        border-radius: 5px;
    }

    .swiper-pagination-bullet-active {
        background: #fff;
    }
}


@media (max-width: 768px) {

    #root {
        background: #F1F1F1;
        overflow-y: hidden;
    }

    .m-header {
        padding-top   : 10px;
        padding-bottom: 10px;
        background    : #fff;
    }

    .m-logo img {
        max-width: 120px;
    }

    .navi-link {
        margin-right: 40px;
        height      : 60px;
        width       : 100%;
        text-align  : left;
        overflow    : hidden;
    }

    .navi-link-active>a {
        color         : #4FB1E2;
        padding-bottom: 0px;
        border-bottom : 0px solid #4FB1E2;
    }

    .m-navi-btn {
        text-align: right;
    }

    .m-navi-btn div {
        float    : left;
        font-size: 20px;
    }

    .m-navi-btn div:first-child {
        margin-left: 15px;
    }

    .m-navi-btn div:last-child {
        margin-top : 3px;
        margin-left: 10px;
    }

    .m-menu {
        margin-top: 15px;
        display   : none;
        background: #fff;
    }

    .m-menu a {
        color: #000;
    }

    .m-menu>div {
        padding: 0;
    }

    .navi-link {
        background   : #4FB1E2;
        color        : #fff;
        margin       : 0;
        border-bottom: 1px solid #fff;
        height       : 50px;
        padding-top  : 16px;
    }

    .navi-link a {
        color       : #fff;
        border-left : 3px solid #fff;
        margin-left : 20px;
        padding-left: 10px;
        font-size   : 16px;
        line-height : 16px;
    }

    .navi-link-type2 {
        margin-left  : 30px;
        margin-right : 30px;
        height       : 50px;
        line-height  : 50px;
        border-bottom: 1px solid #4FB1E2;
    }

    .navi-link-type2-last {
        border-bottom: 0px solid #4FB1E2;
    }

    .navi-link-type2 {
        color    : #000;
        font-size: 14px;
    }

    .m-banner-ai-text-area {
        width       : auto;
        right       : inherit;
        top         : 0;
        left        : 0;
        border      : 0;
        padding-left: 2vw;
    }

    .m-banner-ai-text-area-t1 {
        font-size: 9vw;
        color    : #fff;
    }

    .m-banner-ai-text-area-t2 {
        font-size    : 5vw;
        margin-bottom: 4vw;
    }

    .ai-text {
        font-size: 2vw;
    }

    .ai-img {
        float     : left;
        width     : 3.2vw;
        margin-top: -0.3vw;
    }

    .ai-item {
        margin-bottom: 3vw;
    }

    .ai-icon-text {
        top      : 2px;
        left     : 5vw;
        width    : 21vw;
        font-size: 2vw;
    }

    .ai-icon-img {
        width : 8vw;
        height: 8vw;
    }

    .m-footer {
        background: #213540;
        padding   : 5%;
    }

    .ai-flash {
        width : 4vw;
        height: 4vw;
    }

    .ai-1 {
        top : 9%;
        left: 42%;
    }

    .ai-2 {
        top : 27%;
        left: -11%;
    }

    .ai-3 {
        top : 3%;
        left: 42%;
    }

    .ai-4 {
        top : 23%;
        left: -10%;
    }

    .ai-5 {
        top : 3%;
        left: 46%;
    }

    .ai-6 {
        top : 12%;
        left: -9%;
    }

    .ai-7 {
        top : -5%;
        left: 45%;
    }

    .m-tel-div {
        width     : 100%;
        /*height  : 138px;*/
        border    : 3px solid rgba(255, 255, 255, 1);
        color     : #fff;
        padding   : 10px;
        margin-top: 20px;
        overflow  : auto;
    }

    .m-tel-number {
        font-size : 10vw;
        width     : 100%;
        float     : right;
        text-align: right;
    }

    .m-tel-number a {
        color: #fff;
    }

    .m-tel-number-desc {
        width     : 100%;
        float     : right;
        text-align: right;
    }

    .m-tel-number-button {
        width     : 100%;
        float     : right;
        text-align: right;
        margin-top: 15px;
        color     : #fff;
    }

    .m-tel-number-button a {
        color         : #fff;
        padding-bottom: 3px;
        border-bottom : 1px solid #028ED7;
    }

    .m-footer-menu {
        color     : #fff;
        margin-top: 50px;
        opacity   : 0.85;
    }

    .m-footer-menu a {
        color: #fff;
    }

    .m-footer-item {
        padding       : 0;
        padding-bottom: 10px;
        border-bottom : 1px solid #fff;
        margin-left   : 15px;
        margin-top    : 15px;
    }

    .m-footer-item-right {
        margin-left: 30px;
    }

    .m-register-info {
        margin-top    : 30px;
        color         : #fff;
        font-size     : 12px;
        text-align    : center;
        padding-bottom: 30px;
    }

    .m-banner-text-bg-1 {
        width : 45%;
        height: 100%;
    }

    .m-banner-text-area-1 {
        top       : 43%;
        width     : 440px;
        text-align: center;
    }

    .m-banner1-name {
        color      : #fff;
        text-align : center;
        font-size  : 26px;
        font-weight: bold;
    }

    .m-banner1-num {
        color      : #000;
        text-align : center;
        font-size  : 5vw;
        font-weight: bold;
    }

    .m-banner-text-bg-2 {
        right: 0;
        width: 70%;
    }

    .m-banner-text-area-2 {
        border    : 4px solid rgba(255, 255, 255, 1);
        width     : 75vw;
        height    : 85%;
        text-align: center;
        top       : 7%;
        padding   : 2%;
    }

    .m-banner2-text-2 {
        font-weight: bold;
        font-size  : 5.4vw;
    }

    .m-banner-text-3 {
        margin-top   : 5px;
        margin-bottom: 5px;
    }

    .m-banner-text-bg-3 {
        background: transparent;
    }

    .m-banner-text-area-3 {
        border: 0;
    }

    .content-body {
        width  : auto;
        padding: 0;
    }

    .tip-title {
        font-size  : 5vw;
        line-height: 5vw;
        margin-left: 0;
        font-weight: bold;
    }

    .tip-bar {
        height      : 5vw;
        width       : 3px;
        line-height : 5vw;
        margin-right: 1.5vw;
        margin-top  : -0.2vw;
    }

    .v-line {
        border-left-width: 2px;
    }
}