* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: "Microsoft Yahei";
    background-color: #fff;
    width: 100%;
}

pre {
    white-space: pre-wrap;
    word-break: break-all;
}

.page-nav-bar2 {
    position: inherit;
}

.title {
    font-style: normal;
}

li {
    list-style: none;
}

.currentPlay {
    display: block;
}

.currentIdx {
    border: #2948ff 2px solid;
}

.current {
    background: #ffffff;
    color: #4f67fa;
}

.currentIndex {
    color: #3158fd !important;
}

.dot-nav {
    height: 154px;
    border: 1px #2948ff dashed;
    position: fixed;
    z-index: 100;
    top: 50%;
    right: 175px;
    margin-top: -79px;
}

.w {
    width: 1000px;
    margin: 0 auto;
}

@media screen and (max-height: 650px) {
    .main .p1 .computer {
        /* top: 28% !important; */
    }
}

@media screen and (max-width: 1200px) {
    .main .p4 .pre {
        left: 4% !important;
    }
    .main .p4 .next {
        right: 4% !important;
    }
    .swiper-container {
        zoom: 0.85;
    }
    /* .main .p4 .pre {
    left: 10% !important;
  }
  .main .p4 .next {
    right: 10% !important;
  } */
    .main .p1 {
        background: url("/Customer/img/p1_bg.jpg") no-repeat top center;
        width: 100%;
        background-size: 100% 100%;
        height: 480px;
        margin: auto;
        top: 61px;
        z-index: 0;
    }
    .main .p1 .computer {
        height: 289px;
        width: 506px;
        background: url('/Customer/img/Macbook.png') no-repeat center;
        background-size: cover;
        position: absolute;
        top: 27%;
        left: 39%;
    }
    .main .p1 .computer .videobox {
        position: absolute;
        top: calc(-9% + 45px) !important;
        left: 12%;
        width: 74%;
        margin: 0;
        height: 0;
        padding-bottom: 46%;
    }
    .main .p1 .left {
        left: 10% !important;
    }
    .p1 .w {
        width: 80%;
        margin: 0 auto;
    }
    .p1 .tcplayer {
        top: -15%;
    }
    .main .p4 .title {
        padding-top: 2% !important;
    }
    .page-nav-bar2 {
        top: -3.3%;
    }
    .main .p3 .buttonList {
        margin-bottom: 0 !important;
    }
    .main .p4 .tabs {
        padding-top: 0 !important;
    }
    .main .p4 .city {
        margin: 2% auto 3%;
    }  
    .main .p4 .city {
        padding-left: 2.2%;
        text-align: center;
        overflow: hidden;
        width: 100%;
        margin: 2% auto 3%;
        cursor: pointer;
    }
}

@media screen and (min-width: 1200px) and (max-width: 1440px) {
    .main .p4 .pre {
        left: 6% !important;
    }
    .main .p4 .next {
        right: 6% !important;
    }
    /*.main .p1 {
        width: 100%;
        height: 360px;
        background: url("/Customer/img/about_banner.jpg") no-repeat top center;
        background-size: 100% 100%;
        margin: auto;
        top: 59px;
        z-index: 0;
    }*/
    .main .p1 .computer {
        height: 362px;
        width: 633px;
        background: url('/Customer/img/Macbook.png') no-repeat center;
        background-size: cover;
        position: absolute;
        top: 27%;
        left: 39%;
    }
    .main .p1 .computer .videobox {
        position: absolute;
        top: calc(-9% + 54px) !important;
        left: 12%;
        width: 74%;
        margin: 0;
        height: 0;
        padding-bottom: 46%;
    }
    .main .p1 .left {
        left: 15% !important;
    }
    .p1 .tcplayer {
        top: -15%;
    }
    /*.main .p4 .title {
        padding-top: 2% !important;
    }*/
    .page-nav-bar2 {
        top: -3.3%;
    }
    .main .p3 .buttonList {
        margin-bottom: 0 !important;
    }
    .main .p4 .tabs {
        width: 100%;
        padding-top: 0 !important;
    }
    .main .p4 .city {
        /*padding-left: 5%;*/
        overflow: hidden;
        width: 82%;
        margin: 2% auto 3%;
        cursor: pointer;
    }
    .dot-nav {
        /* height: 154px;
    border: 1px #2948ff dashed;
    position: fixed;
    z-index: 100;
    top: 50%; */
        right: 27px !important;
        /* margin-top: -79px; */
    }
}

@media screen and (min-width: 1440px) and (max-width: 1980px) {
    .main .p4 .pre {
        top: 48% !important;
        left: 10% !important;
    }
    .main .p4 .next {
        top: 48% !important;
        right: 10% !important;
    }
    /*.main .p1 {
        background: url("/Customer/img/about_banner.jpg") no-repeat top center;
        background-size: 100% 100%;
        height: 360px;
        width: 100%;
        margin: auto;
        top: 82px;
        z-index: 0;
    }*/
    .p1 .left {
        left: 20% !important;
    }
    .main .p1 .computer {
        height: 453px;
        width: 792px;
        background: url('/Customer/img/Macbook.png') no-repeat center;
        background-size: cover;
        position: absolute;
        top: 27%;
        left: 39%;
    }
    .main .p1 .computer .videobox {
        position: absolute;
        top: calc(-9% + 67px) !important;
        left: 12%;
        width: 74%;
        margin: 0;
        height: 0;
        padding-bottom: 46%;
    }  
    /*.main .p4 .title {
        padding-top: 2% !important;
    }*/
    .main .p4 .city {
        overflow: hidden;
        width: 58%;
        margin: 2% auto 3%;
        cursor: pointer;
    }
    .dot-nav {
        right: 27px !important;        
    }
    .main .p3 .btn .pre-page {
        margin-right: 0 !important;
    }
    .main .p3 .btn .next-page {
        margin-left: 0 !important;
    }
}

.main .p1 .title {
    color: #ffffff;
    font-size: 38px;
    font-weight: bold;
    background: url("/Customer/img/p1_title_bg.png") no-repeat;
    /*width: 1920px;*/
    height: 64px;
    position: relative;
}

.main .p1 .title p {
    position: absolute;
    top: 10px;
}

.main .p1 .line {
    width: 76px;
    height: 3px;
    background: #ffffff;
    position: absolute;
    left: 0;
}

.main .p1 .content {
    width: 345px;
    font-size: 16px;
    color: #ffffff;
    margin-top: 30px;
    letter-spacing: 2px;
    line-height: 25px;
}

.main .p1 .computer .videobox {
    position: relative;
    top: calc(-9% + 45px);
    left: 12%;
    width: 76%;
    margin: 0;
    height: 0;
    padding-bottom: 46%;
    overflow: hidden;
}

.main .p1 #player-container-id {
    /* float: left; */
    margin-left: 387px;
    margin-top: 154px;
}

.main .p1 .arr {
    overflow: hidden;
    text-align: center;
    animation: twinkling 1s infinite ease-in-out;
    margin: 0 auto;
    position: absolute;
    bottom: 10%;
}

@keyframes twinkling {
    /*透明度由0到1*/
    0% {
        opacity: 0;
        /*透明度为0*/
    }
    100% {
        opacity: 1;
        /*透明度为1*/
    }
}
.main .p1>img{
    width: 100%;
    height: auto;
    /*background: url("/Customer/img/about_banner.jpg") no-repeat top center;
    background-size: 100% 100%;*/
    /*margin: auto;*/
    top: 59px;
    z-index: 0;
}
.main .p2 {
    padding-top: 60px;
}


/*.main .p2::before{
    content: "";
    display: block;
    padding-top: 50%;
}*/

.main .p2 .title {
    text-align: right;
    padding-top: 20px;
    font-size: 32px;
    font-weight: bold;
    height: 64px;
    position: relative;
}

.p2 .title .icon {
    position: absolute;
    top: 0;
    right: 0;
}

.main .p2 .title span {
    background-image: -webkit-linear-gradient(bottom, #396afc, #2948ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 38px;
    z-index: 1;
    position: relative;
}

.main .p2 .title .cul {
    background-image: -webkit-linear-gradient(bottom, #4e5972, #3f4c6b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 38px;
}

.main .p2 .content {
    overflow: hidden;
    margin-top: -15px;
    margin-bottom: 90px;
}

.main .p2 .content .con-left {
    width: 30%;
    position: absolute;
}

.main .p2 .content .con-right {
    width: 70%;
    float: right;
    padding-top: 24px;
}

.main .p2 .content img {
    float: left;
}

.main .p2 .content .txt {
    float: left;
    font-size: 16px;
    color: #3f4157;
    width: 556px;
    margin-top: 45px;
    margin-left: 30px;
    line-height: 25px;
    letter-spacing: 1px;
    padding-right: 20px;
    white-space: pre-wrap;
    word-break: break-all;
    text-align: center;
}

.main .p2 .piece {
    overflow: hidden;
    padding-left: 30px;
}

.main .p2 .piece .data {
    float: left;
    width: 175px;
}

.main .p2 .piece .data .num {
    font-size: 46px;
    color: #4c4c4c;
    /*background-image: -webkit-linear-gradient(bottom, #396afc, #2948ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;*/
    position: relative;
    font-weight: bold;
    line-height: 46px;
    letter-spacing: normal;
    display:inline-block;
    width: 175px;
}

.main .p2 .piece .data .num span {
    position: absolute;
    top: 5px;
    font-size: 18px;
    /*background-image: -webkit-linear-gradient(bottom, #4e5972, #3f4c6b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;*/
    margin-top: -10px;
}

.main .p2 .piece .data .bot {
    font-size: 16px;
    color: #3f4157;
    /*margin-left: 10px;*/
    /* text-align: center; */
}

.main .p2 .context {
    margin: 0 auto 40px;
    width: 1120px;
    margin-top: 2%;
    font-size: 16px;
    color: #727272;
    line-height: 25px;
    letter-spacing: 2px;
    word-wrap: break-word;
    white-space: pre-wrap;
}

.main .p3 {
    background: url("/Customer/img/p3_bg.jpg") no-repeat top center;
    background-size: cover;
    height: auto;
    width: 100%;
    overflow: hidden;
    padding-top: 2%;
    position: relative;
}

.main .p3 .btn {
    /* width: 1560px; */
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
}

.main .p3 .btn .pre-page {
    float: left;
    width: 22px;
    height: 29px;
    /*background: url("/Customer/img/p3_left_click.png") no-repeat; */
    cursor: pointer;
    margin-top: 157px;
    padding-right: 20px;
    /*margin-right: 20px; */
}

.main .p3 .btn .next-page {
    float: left;
    width: 22px;
    height: 29px;
    background: url("/Customer/img/p3_right_click.png") no-repeat;
    animation: twinkling 1s infinite ease-in-out;
    margin-left: 20px;
    margin-top: 157px;
    cursor: pointer;
}

.main .p3 .title {
    background: url("/Customer/img/p3_title_bg.png") no-repeat center;
    height: 64px;
    color: #ffffff;
    font-weight: bold;
    font-size: 38px;
    text-align: center;
    padding-top: 5%;
}

.main .p3 .buttonList {
    overflow: hidden;
    padding-left: 125px;
    margin-top: 5%;
    margin-bottom: 5%;
    color: #ffffff;
}

.main .p3 .buttonList .btn {
    cursor: pointer;
    width: 200px;
    height: 39px;
    font-size: 22px;
    border: 1px #ffffff solid;
    line-height: 39px;
    text-align: center;
    border-radius: 20px;
    float: left;
}

.main .p3 .axis {
    transition: all 0.4s;
    width: 2478px;
    /* width:100%; */
    height: 450px;
    margin: 0 auto;
    /* padding-left: 50px; */
    overflow: hidden;
}

.main .p3 .axis .content {
    float: left;
    position: relative;
    height: 160px;
    width: 329px;
    font-size: 14px;
    /* width: 14%; */
}

.main .p3 .axis .content .year {
    font-size: 26px;
    color: #ffffff;
    margin: 10px 0;
}

.main .p3 .axis .content ul {
    position: absolute;
    bottom: 0;
}

.main .p3 .axis .content li {
    width: 200px;
    line-height: 24px;
    text-align: bottom;
}

.main .p3 .axis .content li p {
    color: #ffffff;
}

.main .p3 .axis .content li p span {
    float: left;
    margin-top: 10px;
    margin-right: 5px;
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 20px;
    background: #ffffff;
    top: 10px;
    left: -10px;
}

.main .p3 .axis .bar {
    clear: both;
    position: relative;
    height: 28px;
}

.main .p3 .axis .bar .dot {
    margin-left: -137px;
    height: 28px;
    clear: both;
}

.main .p3 .axis .bar .dot div {
    float: left;
    margin-left: 137px;
    position: relative;
}

.main .p3 .axis .bar .dot div p {
    position: absolute;
    top: 0px;
    color: #ffffff;
    font-size: 26px;
    width: 90px;
}

.main .p4 {
    width: 100%;
    /*background: url("/Customer/img/p4_bg.jpg") no-repeat top center;
    background-size: cover;*/
    padding-top: 40px;
}

.main .p4 .pre {
    background: url("/Customer/img/p4_left.png") no-repeat;
    width: 22px;
    height: 29px;
    cursor: pointer;
    display: inline-block;
}

.main .p4 .next {
    background: url("/Customer/img/p4_right.png") no-repeat;
    height: 29px;
    width: 22px;
    margin-left: 106px;
    cursor: pointer;
    display: inline-block;
}

    .main .p4 .title {    
        color: #343434;
        width: 198px;
        height: 32px;
        line-height: 32px;
        font-size: 32px;
        font-weight: 100;
        text-align: left;
        padding-top: 0;
        padding-left: 20px;
        border-left: 5px solid #3866ff;
        margin-left: 0;
        margin-bottom: 40px;
    }
.develop-section {
    width: 100%;
    background-color: #fbfbfb;
}
.wenda {
    width: 1120px;
    margin: 0 auto;
    padding-top: .5rem;
}

    .wenda .wenda-title {
        width: 198px;
        height: 32px;
        line-height: 32px;
        font-size: 32px;
        font-weight: 100;
        text-align: left;
        color: #343434;
        padding-left: 20px;
        border-left: 5px solid #3866ff;
        margin-bottom: 40px;
        margin-left: 0;
    }

    .wenda #questions .UI-bubble {
        display: inline-block;
        width: 8px;
        height: .16rem;
        overflow: hidden;
        background: url("/Customer/image/shenben/p6-arrow1.png") 0px 0px no-repeat;
        background-size: 100% 100%;
    }

    .wenda #questions .UI-ask {
        display: inline-block;
        width: .08rem;
        height: .16rem;
        overflow: hidden;
        background: url("/Customer/image/shenben/p6-arrow2.png") 0px 0px no-repeat;
        background-size: 100% 100%;
    }


    /* questions */

    .wenda #questions {
        width: 1120px;
        margin: 50px auto 0;
        padding-bottom: 60px;
        /*padding-top: 14px;*/
    }

        .wenda #questions li h5 .UI-ask,
        #questions li h5 .UI-bubble {
            position: absolute;
            right: .2rem;
            top: .09rem;
        }

        .wenda #questions li {
            padding: .18rem 0 .1rem .34rem;
            vertical-align: bottom;
            margin-bottom: .1rem;
            box-shadow: 0 0 .06rem rgba(93, 77, 194, 0.1);
            width: 100%;
            background: #fff;
            box-sizing: border-box;
        }

            .wenda #questions li h5 {
                position: relative;
                color: #6c6c6c;
                font-size: .22rem;
                cursor: pointer;
                margin: 0;
                /*line-height: 40px;*/
                height: .28rem;
                overflow: hidden;
                /*padding: 0 0 0 40px;*/
                font-weight: normal;
                text-align: left;
            }
            #questions h5 span {
                font-size: .2rem;
                color: #6e8fff;
                position:relative;
                margin-left: 20px;
            }
            #questions h5 span::before {
                content: '';
                width: 5px;
                height: 5px;
                border-radius: 50%;
                background: #6c6c6c;
                position:absolute;
                left:-10px;
                top: 50%;
                transform: translateY(-50%);
            }
                /*.wenda #questions li h5:hover {
                    color: #5d65f6;
                }*/

            .wenda #questions li .foldContent {
                padding: .1rem .5rem .1rem 0;
                /*border-top: 1px dashed #e2e2e2;*/
                line-height: .24rem;
                color: #727272;
                display: none;
                font-size: .16rem;
                line-height: .24rem;
                text-align: left;
            }
            #questions .foldContent p span {
                position:relative;
                padding-left: 12px;
                line-height: 22px;
            }
            #questions .foldContent p span::before {
                content:'';
                width: 4px;
                height: 4px;
                border-radius: 50%;
                background: #3b67fd;
                position:absolute;
                left: 0;
                top:50%;
                transform: translateY(-50%);
            }

/*.main .p4 .title p {
    font-weight: bold;
    line-height: 46px;
}*/



.main .p4 .tabs {
    width: 100%;
    margin: 0 auto;
    padding-top: 15px;
    padding-bottom: 5px;
    position: relative;
}

.main .p4 .tabs .city {
    width: 1108px;
    margin: 0 auto;
    margin-bottom: 30px;
}

.main .p4 .tabs .city::after {
    content: ' ';
    clear: both;
    display: block;
}

.main .p4 .city p {
    color: #3c3e53;
    letter-spacing: 2px;
    font-size: 18px;
    float: left;
    line-height: 36px;
}

.main .p4 .city span {
    color: #c3c3c5;
    margin: 0 15px;
    font-size: 12px;
}

.main .p4 .tabs p.active {
    color: blue;
}

.main .p4 .tabs span.active {
    color: #c3c3c5 !important;
}

.main .p4 .swiper-container {
    overflow: hidden;
    height: 306px;
    border-top: 0;
    width: 1082px;
    margin-top: 85px;
    margin: 0 auto;
}

.main .p4 iframe img {
    height: 333px;
}

.main .p4 .swiper-slide {
    height: 333px;
    width: 1078px;
    background: url("/Customer/img/school_bg.png") no-repeat;
    color: #fff;
    opacity: 1;
    float: left;
}

.main .p4 .content-slide {
    clear: both;
    height: 377px;
    float: left;
}

.main .p4 .content-slide .playList {
    height: 333px;
    float: left;
}

.main .p4 .content-slide .playList li.slider-item {
    width: 501px;
    height: 333px;
    padding-top: 22px;
}

.main .p4 .content-slide .playList li img {
    width: 501px;
    height: 333px;
}

.main .p4 .content-slide .campus {
    float: left;
    padding-top: 75px;
    padding-left: 56px;
    width: 577px;
    overflow: hidden;
}

.main .p4 .content-slide .campus .name {
    font-size: 26px;
    letter-spacing: 1px;
    color: #2c3135;
}

.main .p4 .content-slide .campus .tel {
    font-size: 16px;
    color: #2c3135;
    margin-top: 10px;
}

.main .p4 .content-slide .campus .address {
    font-size: 16px;
    color: #707070;
    margin-top: 40px;
}

.main .p4 .content-slide .campus .content {
    margin-top: 15px;
    overflow: hidden;
}

.main .p4 .content-slide .campus .content li {
    float: left;
    width: 114px;
    height: 74px;
    margin-right: 14px;
    border-radius: 5px;
    overflow: hidden;
}

.main .p4 .content-slide .campus .content li img {
    width: 100%;
    height: 100%;
}

.video-js .vjs-tech {
    position: inherit !important;
}