/*公用样式*/
.fl {
    float: left;
}

.fr {
    float: right;
}

img {
    -webkit-user-drag: none;
}

/*wrapper*/
.wrapper {
    width: 100%;
}

/* .wrapper a {
    display: block;
    width: 100%;
    height: 100%;
} */

/*nav*/
nav {
    width: 1203px;
    height: 70px;
    /*position: absolute;*/
    /*left: 50%;*/
    /*top: 0;*/
    /*margin-left: -601.5px;*/
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

nav .logo {
    width: 325px;
    height: 69px;
    /*margin-top: 18px;*/
    background: url("../img/logo.png") no-repeat;
    background-size: 100% 100%;
}

nav .nav-bar {
    width: 649px;
    height: 17px;
    display: flex;
}

nav .nav-bar li {
    color: #000;
    font-size: 16px;
    margin-right: 20px;
}

nav .nav-bar li:last-child {
    margin-right: 0;
}

nav .nav-bar li a {
    display: block;
    width: 100%;
    height: 100%;
    color: #000;
}

nav .nav-bar li a:after {
    display: block;
    content: '';
    width: 0;
    height: 2px;
    background: #3e71cc;
    transition: width .5s;
}

nav .nav-bar li a:hover:after {
    width: 100%;
}

/*banner*/
/*.banner {*/
/*    width: 100%;*/
/*    !*height: 828px;*!*/
/*}*/

/*.banner img {*/
/*    width: 100%;*/
/*}*/
.banner{
    width:100%;
    height:640px;
    position:relative;
}
#banner{
    width:100%;
    height:640px;
}
#banner .swiper-wrapper{
    width:100%;
    height:640px;
}
#banner .swiper-slide{
    width:100%;
    height:640px;
    overflow:hidden;
    position:relative;
}
#banner .swiper-slide img{
    top:0;
    left:50%;
    margin-left:-960px;
    width:1920px;
    height:640px;
    display:block;
    position:absolute;
}
.banner .pagination {
    width:100%;
    bottom:22px;
    z-index:20;
    text-align:center;
    position:absolute;
}
.banner .swiper-pagination-switch {
    margin:0 5px;
    width:24px;
    height:6px;
    cursor:pointer;
    display:inline-block;
    background:#787878;
    background:rgba(255,255,255,0.4);
    border-radius:3px;
}
.banner .swiper-active-switch {
    background:#ffffff;
}
/*p1*/
.p1 {
    /*width: 1203px;*/
    width: 1000px;
    padding: 94px 0 24px;
    margin: 0 auto;
}

.p1-title {
    width: 465px;
    height: 36px;
    background: url("../img/p1-title.png") no-repeat;
    background-size: 100% 100%;
    margin: 0 auto;
}

.p1-content {
    width: 100%;
    height: 360px;
    position: relative;
    margin-top: 38px;
}

.p1-logo {
    width: 360px;
    height: 360px;
    background: url("../img/p1-logo.jpg") no-repeat;
    background-size: 100% 100%;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -180px;
}

.p1-1, .p1-2, .p1-3, .p1-4, .p1-5 {
    position: absolute;
}

.p1-1 {
    width: 263px;
    height: 31px;
    background: url("../img/p1-1.png") no-repeat;
    background-size: 100% 100%;
    top: 58px;
    left: 90px;
}

.p1-2 {
    width: 211px;
    height: 24px;
    background: url("../img/p1-2.png") no-repeat;
    background-size: 100% 100%;
    top: 179px;
    left: 235px;
}

.p1-3 {
    width: 205px;
    height: 24px;
    background: url("../img/p1-3.png") no-repeat;
    background-size: 100% 100%;
    bottom: 105px;
    right: 285px;
}

.p1-4 {
    width: 269px;
    height: 32px;
    background: url("../img/p1-4.png") no-repeat;
    background-size: 100% 100%;
    right: 25px;
    top: 123px;
}

.p1-5 {
    width: 211px;
    height: 25px;
    background: url("../img/p1-5.png") no-repeat;
    background-size: 100% 100%;
    top: 35px;
    right: 220px;
}

/*p2*/
.p2 {
    width: 1200px;
    margin: 0 auto;
}

.p2-content {
    width: 1200px;
    height: 390px;
    background: url("../img/p2-content.png") no-repeat;
    background-size: 100% 100%;
    margin: 0 auto;
}

.p2-btn {
    width: 300px;
    height: 45px;
    background: url("../img/p2-btn.png") no-repeat;
    background-size: 100% 100%;
    margin: 42px auto 0;
    cursor: pointer;
    transition: all .5s;
}

.p2-btn:hover {
    transform: translateY(-3px);
    box-shadow: 5px 5px 10px #999;
}

/*p3*/
.p3 {
    width: 1050px;
    padding: 67px 0 64px;
    margin: 0 auto;
}

.p3-title {
    width: 342px;
    height: 80px;
    background: url("../img/p3-title.png") no-repeat;
    background-size: 100% 100%;
    margin: 0 auto 33px;
}

.p3-content {
    width: 100%;
}

.p3-content:after {
    display: block;
    content: '';
    clear: both;
}

.p3-contents {
    background: url("../img/p3-contents.png") no-repeat;
    background-size: 1050px 474px;
}

.p3-1, .p3-2, .p3-3, .p3-4, .p3-5, .p3-6 {
    width: 330px;
    height: 217px;
    margin: 0 30px 60px 0;
    position: relative;
    overflow: hidden;
}

.p3-3, .p3-6 {
    margin-right: 0;
}

.p3-4, .p3-5, .p3-6 {
    margin-bottom: 0;
}

.p3-1 {
    background-position: -10px -10px;
}

.p3-2 {
    background-position: -360px -10px;
}

.p3-3 {
    background-position: -10px -247px;
}

.p3-4 {
    background-position: -710px -10px;
}

.p3-5 {
    background-position: -360px -247px;
}

.p3-6 {
    background-position: -710px -247px;
}

.p3-mask {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .7);
    position: absolute;
    top: 160px;
    left: 0;
    padding: 10px 49px 69px;
    text-align: center;
    transition: top .3s;
}

.p3-mask h2 {
    font-size: 26px;
    margin-bottom: 25px;
}

.p3-mask p {
    font-size: 16px;
}

.p3-contents:hover .p3-mask {
    top: 0;
}

.p3-btn {
    width: 300px;
    height: 45px;
    background: url("../img/p3-btn.png") no-repeat;
    background-size: 100% 100%;
    margin: 49px auto 34px;
    cursor: pointer;
    transition: all .5s;
}

.p3-btn:hover {
    transform: translateY(-3px);
    box-shadow: 5px 5px 10px #999;
}

/*banner1*/
.banner1 {
    width: 100%;
    height: 300px;
    background: url("../img/banner1.jpg") no-repeat center;
}

.form-box {
    width: 1203px;
    height: 100%;
    margin: 0 auto;
    position: relative;
}

.form {
    width: 326px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
}

.form input {
    width: 326px;
    height: 49px;
    border-radius: 10px;
    padding: 0 28px;
    font-size: 18px;
}

.form input.mName {
    margin-top: 71px;
}

.form input.mPhone {
    margin: 16px 0;
}

.form button {
    width: 326px;
    height: 49px;
    background: url("../img/form-btn.png") no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
}

/*banner2*/
.banner2 {
    width: 100%;
    height: 300px;
    background: url("../img/banner2.jpg") no-repeat center;
}
.form input.fName {
    margin-top: 71px;
}

.form input.fPhone {
    margin: 16px 0;
}

/*p4*/
.p4 {
    /*width: 1280px;*/
    width: 1000px;
    margin: 88px auto 82px;
}

.p4-title {
    width: 531px;
    height: 106px;
    background: url("../img/p4-title.png") no-repeat;
    background-size: 100% 100%;
    margin: 0 auto 33px;
}

.p4-contents {
    width: 100%;
    text-align: center;
}

.p4-contents p {
    font-size: 30px;
    color: #2655a9;
}

.content-box {
    margin: 0 auto 24px;
}

.content-box:after {
    display: block;
    content: '';
    clear: both;
}

.content-box li {
    /*width: 213px;*/
    /*height: 230px;*/
    width: 163px;
    height: 176px;
    transition: all .3s;
    cursor: pointer;
}

/*p4-1*/
.p4-content-1 {
    width: 978px;
    margin: 0 auto 34px;
}

.p4-content-1 p {
    margin-bottom: 26px;
}

.p4-1-1 {
    background: url("../img/p4-1-1.png") no-repeat;
    background-size: 100% 100%;
}

.p4-1-2 {
    background: url("../img/p4-1-2.png") no-repeat;
    background-size: 100% 100%;
}

.p4-1-3 {
    background: url("../img/p4-1-3.png") no-repeat;
    background-size: 100% 100%;
}

.p4-1-4 {
    background: url("../img/p4-1-4.png") no-repeat;
    background-size: 100% 100%;
}

.p4-1-5 {
    background: url("../img/p4-1-5.png") no-repeat;
    background-size: 100% 100%;
}

.p4-1-6 {
    background: url("../img/p4-1-6.png") no-repeat;
    background-size: 100% 100%;
}

/*p4-2*/
.p4-content-2 {
    width: 489px;
    margin: 0 auto 34px;
}

.p4-content-2 p {
    margin-bottom: 20px;
}

.p4-2-1 {
    background: url("../img/p4-2-1.png") no-repeat;
    background-size: 100% 100%;
}

.p4-2-2 {
    background: url("../img/p4-2-2.png") no-repeat;
    background-size: 100% 100%;
}

.p4-2-3 {
    background: url("../img/p4-2-3.png") no-repeat;
    background-size: 100% 100%;
}

/*p4-3*/
.p4-content-3 {
    width: 652px;
    margin: 0 auto 34px;
}

.p4-content-3 p {
    margin-bottom: 20px;
}

.p4-3-1 {
    background: url("../img/p4-3-1.png") no-repeat;
    background-size: 100% 100%;
}

.p4-3-2 {
    background: url("../img/p4-3-2.png") no-repeat;
    background-size: 100% 100%;
}

.p4-3-3 {
    background: url("../img/p4-3-3.png") no-repeat;
    background-size: 100% 100%;
}

.p4-3-4 {
    background: url("../img/p4-3-4.png") no-repeat;
    background-size: 100% 100%;
}

/*p4-4*/
.p4-content-4 {
    width: 815px;
    margin: 0 auto 34px;
}

.p4-content-4 p {
    margin-bottom: 20px;
}

.p4-4-1 {
    background: url("../img/p4-4-1.png") no-repeat;
    background-size: 100% 100%;
}

.p4-4-2 {
    background: url("../img/p4-4-2.png") no-repeat;
    background-size: 100% 100%;
}

.p4-4-3 {
    background: url("../img/p4-4-3.png") no-repeat;
    background-size: 100% 100%;
}

.p4-4-4 {
    background: url("../img/p4-4-4.png") no-repeat;
    background-size: 100% 100%;
}

.p4-4-5 {
    background: url("../img/p4-4-5.png") no-repeat;
    background-size: 100% 100%;
}

.p4-btn1 {
    width: 147px;
    height: 35px;
    background: url("../img/p4-btn1.png") no-repeat;
    background-size: 100% 100%;
    margin: 0 auto;
    cursor: pointer;
    transition: all .3s;
}

.p4-btn1:hover {
    transform: translateY(-2px);
    box-shadow: 5px 5px 10px #999;
}

/*课程li hover*/
.content-box li:hover {
    transform: scale(1.1);
}

/*p4-btn*/
.p4-btn {
    width: 300px;
    height: 45px;
    background: url("../img/p4-btn.png") no-repeat;
    background-size: 100% 100%;
    margin: 49px auto 64px;
    cursor: pointer;
    transition: all .5s;
}

.p4-btn:hover {
    transform: translateY(-3px);
    box-shadow: 5px 5px 10px #999;
}

/*p5*/
.p5 {
    /*width: 1230px;*/
    width: 1000px;
    margin: 86px auto 72px;
    position: relative;
}

.p5-title {
    width: 628px;
    height: 169px;
    background: url("../img/p5-title.png") no-repeat;
    background-size: 100% 100%;
    margin: 0 auto 35px;
}

.p5-contents {
    /*width: 1220px;*/
    width: 1000px;
    height: 350px;
    overflow: hidden;
    margin: 0 auto;
    position: relative;
}
/*轮播*/
.swiper-slide > div {
    /*width: 450px;*/
    /*height: 262px;*/
    width: 400px;
    height: 233px;
    margin: 44px 0;
    position: relative;
}
.swiper-slide > div img{
    display: block;
    width: 100%;
    height: auto;
}
.swiper-slide >div .p5-mask{
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0,0,0,.6);
    text-align: center;
    padding: 45px 60px 0;
}
.swiper-slide >div .p5-mask h3{
    font-size: 30px;
    font-weight: normal;
    margin-bottom: 10px;
}
.swiper-slide >div .p5-mask p{
    font-size: 16px;
}
.swiper-slide.swiper-slide-active > div {
    transform: scale(1.2);
    position: relative;
    z-index: 10;
    box-shadow: 5px 5px 20px rgba(0,0,0,.6);
}
.swiper-slide.swiper-slide-active > div img{
    width: 100%;
}
.swiper-slide.swiper-slide-active > div .p5-mask{
    display: block;
}
/*导航点*/
.pagination{
    text-align: center;
}
.pagination span{
    margin-right: 21px;
}
.pagination span:last-child{
    margin-right: 0;
}
/*轮播前后箭头*/
.p5-arrow-prev,.p5-arrow-next{
    width: 40px;
    height: 81px;
    background: url("../img/p5-arrow.png") no-repeat;
    background-size: 100% 100%;
    position: absolute;
    cursor: pointer;
}
.p5-arrow-prev{
    top: 50%;
    left: -50px;
}
.p5-arrow-next{
    transform: rotate(180deg);
    top: 50%;
    right: -50px;
}
/*p5-btn*/
.p5-btn {
    width: 300px;
    height: 45px;
    background: url("../img/p5-btn.png") no-repeat;
    background-size: 100% 100%;
    margin: 49px auto 64px;
    cursor: pointer;
    transition: all .5s;
}
.p5-btn:hover {
    transform: translateY(-3px);
    box-shadow: 5px 5px 10px #999;
}

/*p6*/
.p6{
    width: 1000px;
    margin: 0 auto;
}
.p6-title{
    width: 650px;
    height: 88px;
    background: url("../img/p6-title.png") no-repeat;
    background-size: 100% 100%;
    margin: 0 auto 39px;
}
.p6-contents{
    width: 910px;
    margin: 0 auto;
}
.p6-contents:after{
    display: block;
    content: '';
    clear: both;
}
.p6-content{
    background: url("../img/p6-content.png") no-repeat;
    background-size: 660px 660px;
}
.p6-contents>div{
    width: 200px;
    height: 200px;
    margin: 0 27px 27px 0;
    transition: all .3s;
}
.p6-4,.p6-8{
    margin-right: 0;
}
.p6-5,.p6-6,.p6-7,.p6-8{
    margin-bottom: 0;
}
.p6-1{
    background-position: -10px -10px;
}
.p6-2{
    background-position: -230px -10px;
}
.p6-3{
    background-position: -10px -230px;
}
.p6-4{
    background-position: -230px -230px;
}
.p6-5{
    background-position: -450px -10px;
}
.p6-6{
    background-position: -450px -230px;
}
.p6-7{
    background-position: -20px -450px;
}
.p6-8{
    background-position: -230px -450px;
}
.p6-contents>div:hover{
    border: 5px solid #3e71cc;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px #999;
}
/*p6-btn*/
.p6-btn {
    width: 300px;
    height: 45px;
    background: url("../img/p6-btn.png") no-repeat;
    background-size: 100% 100%;
    margin: 49px auto 64px;
    cursor: pointer;
    transition: all .5s;
}
.p6-btn:hover {
    transform: translateY(-3px);
    box-shadow: 5px 5px 10px #999;
}

/*p7*/
.p7{
    width: 1000px;
    margin: 0 auto 50px;
}
.p7-title{
    width: 477px;
    height: 36px;
    background: url("../img/p7-title.png") no-repeat;
    background-size: 100% 100%;
    margin: 0 auto 49px;
}
.p7-contents{
    width: 970px;
    margin: 0 auto;
}
.p7-contents:after{
    display: block;
    content: '';
    clear: both;
}
.p7-content{
    background: url("../img/p7-content.png") no-repeat;
    background-size: 750px 540px;
}
.p7-contents>div{
    width: 230px;
    height: 156px;
    margin: 0 12px 12px 0;
    cursor: pointer;
}
.p7-4,.p7-8{
    margin-right: 0;
}
.p7-5,.p7-6,.p7-7,.p7-8{
    margin-bottom: 0;
}
.p7-1{
    background-position: -510px -10px;
}
.p7-2{
    background-position: -510px -186px;
}
.p7-3{
    background-position: -10px -374px;
}
.p7-4{
    background-position: -260px -374px;
}
.p7-5{
    background-position: -10px -10px;
}
.p7-6{
    background-position: -260px -10px;
}
.p7-7{
    background-position: -10px -192px;
}
.p7-8{
    background-position: -260px -192px;
}

/*footer*/
footer {
    width: 100%;
    height: 80px;
    background: #191919;
    margin-bottom: 70px;
}

footer p {
    color: #fff;
    line-height: 80px;
    font-size: 16px;
    text-align: center;
}

footer p span {
    color: #3e71cc;
    margin-left: 20px;
}

/*底部固定表单*/
.bottom-form{
    width: 100%;
    height: 70px;
    position: fixed;
    bottom: 0;
    left: 0;
    background: #222;
    z-index: 99;
}
.bottom-form .form-box{
    width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: left;
    align-items: center
}
.form-box p{
    font-size: 18px;
    margin-right: 20px;
}
.form-box span{
    font-size: 18px;
    color: #ffc000;
}
.form-box input.bottomName,.form-box input.bottomPhone{
    width: 200px;
    height: 40px;
    border-radius: 5px;
    padding: 0 10px;
    margin-right: 20px;
}
.form-box .bottomSubmit{
    width: 150px;
    height: 40px;
    background: url("../img/submit.png") no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
}