body{ margin:0; padding:0; font-size:16px; font-family:"Microsoft YaHei",Arial,Helvetica,sans-serif,"微软雅黑"; overflow-x:hidden;  background-color:#FFF;}
div,ul,li,p,form,h1,h2,h3,h4,h5,h6,dt,dd,dl{padding:0;margin:0; font-family:"Microsoft YaHei",Arial,Helvetica,sans-serif,"微软雅黑";}
a{ text-decoration:none; color:#000;text-align: center}
img{ border:none; vertical-align: middle}
ul,li{ list-style:none;}
i,em{ font-style:normal;}
*{padding:0;margin:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.fl{float: left}
.fr{float:right}
.cen{
    text-align: center;
}
table{border-collapse:collapse;}
.wrap{ width:100%; height:auto;}

.viewport { max-width:1000px; margin:auto; overflow:hidden;}
@media only screen and (max-width:300px) {
    body { font-size:8.33333px!important}
    .viewport {	max-width:300px}
}
@media only screen and (max-width:310px) and (min-width:300px) {
    body { font-size:8.33333px!important}
    .viewport { max-width:300px}
}
@media only screen and (max-width:320px) and (min-width:310px) {
    body { font-size:8.88889px!important}
    .viewport { max-width:320px}
}
@media only screen and (max-width:360px) and (min-width:320px) {
    body { font-size:9px!important}
    .viewport {max-width:360px}
}
@media only screen and (max-width:360px) and (min-width:350px) {
    body { font-size:10px!important}
    .viewport { max-width:360px}
}
@media only screen and (max-width:480px) and (min-width:360px) {
    body { font-size:10px!important}
    .viewport { max-width:480px}
}
@media only screen and (max-width:480px) and (min-width:470px) {
    body { font-size:11px!important}
    .viewport { max-width:480px}
}
@media only screen and (max-width:599px) and (min-width:480px) {
    body { font-size:12px!important}
    .viewport { max-width:560px}
}
@media only screen and (max-width:799px) and (min-width:600px) {
    body { font-size:12px!important}
    .viewport { max-width:570px}
}
@media only screen and (max-width:999px) and (min-width:800px) {
    body { font-size:13px}
    .viewport { max-width:640px}
}
@media only screen and (max-width:1200px) and (min-width:1000px) {
    body { font-size:14px!important}
    .viewport {	max-width:640px}
}
/*header*/
header{
    margin: 15px 0;
}
header .logo{
    width: 1180px;
    margin: 0 auto;
    min-width: 1100px;
}
header img{
    width: 20%;
}
header ul{
    font-size: 20px;
    margin-top:13px ;
    margin-left: 5%;
}
header li{
    float: left;
}
header li a{
    padding: 10px 20px;
}
header li a:hover{
    background-color:#0099e5 ;
    color: #fff;
}
header>div::after{
    content:"" ;
    display:block;
    clear: both;
    height:0;
    overflow: hidden;
}
.carousel{
    position: relative;
    margin-bottom: 30px;
}
.banner .swiper-container img{
    width: 100%;
    margin-top: 10px;
}
.banner .swiper-button-next{
    background-image: url("../images/right.png")!important;
    right: 30px!important;
}
/*.swiper-button-next,.swiper-button-prev{*/
    /*width: 50px!important;*/
    /*height: 70px!important;*/
    /*background-size: 54px 88px!important;*/
/*}*/
.banner .swiper-button-prev{
    background-image: url("../images/left.png")!important;
    left: 30px!important;
}
.banner .swiper-pagination-bullet-active{
    background: #fff!important;
}
.banner .swiper-pagination-bullet{
    width: 15px!important;
    height: 15px!important;
    border-radius: 15px!important;
}
section .adv{
    width: 1180px;
    margin: 0 auto;
    /*min-width: 1100px;*/
}
section .tit h1{
    font-size: 40px;
    color: #0099e5;
    padding-top: 10px;
}
section .adv .tit img{
    width: 40%;
}
section .adv .ourAdv p:nth-child(2){
    font-size: 20px;
    margin-bottom: 15px;
}
section .adv .ourAdv p:nth-child(3){
    width: 60%;
    font-size: 14px;
    margin: 0 auto;
}
section .adv .ourAdv{
    /*border: 1px solid red;*/
    margin-bottom: 20px;
}
section .sec{
    padding-left: 10%;
}
.mr{
    margin-right: 5%;
}
.ml1{
    margin-left: 2%;
}
section .adv .sec::after{
    content:"" ;
    display:block;
    clear: both;
    height:0;
    overflow: hidden;
}
section .bg{
    background-color: #fafafa;
}
section .course{
    width: 1180px;
    margin: 0 auto;
}
section .con{
    width: 20%;
}
section .con .img{
    width: 100px;
    height: 100px;
    border-radius: 50px;
    background-color: #0099e5;
    margin:  0 auto;
}
section .con img{
    width: 50%;
    margin-top: 25%;
}
section .con .txt{
    margin: 15px 0;
}
.mr1{
    margin-right: 6%;
}
section .firstClass,section .secondClass{
    margin-top: 20px;
}
section .secondClass{
    margin-bottom: 20px;
}
section .firstClass::after,section .secondClass::after{
    content:"" ;
    display:block;
    clear: both;
    height:0;
    overflow: hidden;
}
section .audition{
    width:1180px;
    margin: 0 auto;
    position:relative;
    overflow:hidden;
}
section .audition .videoCon{
    width: 23%;
    border: 1px solid #e4ecf3;
    /*border: 1px solid red;*/
    border-radius: 4px;
}
section .audition .videoClass{
    margin: 15px 0;
}
section .audition .videoCon img{
    width: 100%;
    border-top-left-radius:4px ;
    border-top-right-radius:4px ;

}
section .audition .videoCon p:nth-child(2){
     font-size: 20px;
     margin: 10px 0;
 }
section .audition .videoCon p:nth-child(3){
    font-size: 14px;
    margin-bottom: 10px;
    color: #818a92;
}
.videoClass .swiper-container img{
    width: 100%;
    margin-top: 10px;
}
.videoClassMobile{
    display: none;
}
.studentClassMobile{
    display: none;
}
section .teacher{
    width:1180px;
    margin: 0 auto;
}
section .teacher .teacherCon{
    width: 23%;
    border: 1px solid #e4ecf3;
    /*border: 1px solid red;*/
    border-radius: 4px;
    margin-bottom: 20px;
}
.mr2{
    margin-right: 2.61%;
}
.mr5{
    margin-right: 2.61%;
}
section .teacher .teacherCon img{
    width: 100%;
    border-top-left-radius:4px ;
    border-top-right-radius:4px ;
}
section .teacher .teacherClass{
    margin: 15px 0;
}
section .teacher .teacherCon p:nth-child(2){
    font-size: 20px;
    margin: 10px 0;
}
section .teacher .teacherCon p:nth-child(3){
    font-size: 14px;
    margin-bottom: 10px;
    color: #818a92;
    /*height: 150px;*/
}
section .teacherClass::after{
    content:"" ;
    display:block;
    clear: both;
    height:0;
    overflow: hidden;
}
section .students{
    width: 1180px;
    margin: 0 auto;
    position:relative;
    overflow:hidden;
}
section .studentClass .studentCon img{
    border-radius:50% ;
    width: 60px;
    height: 60px;
    margin-top: 123px;
    margin-left: -10%;
}
section .studentClass .studentCon .txtBg{
    width: 200px;
    height: 183px;
    padding: 20px 5px 0;
    background: url("../images/border.png") no-repeat;
}
section .studentClass .studentCon .stuName{
    font-size: 20px;
    margin: 10px 0;
}
section .stu{
    position: relative;
    margin-bottom: 20px;
}
.leftStudent,.rightStudent{
    position: absolute;
    top: 160px;
    z-index: 20;
    cursor: pointer;
}
.leftStudent{
    left: 5%;
}
.rightStudent{
    right: 5%;
}
section .students .studentClass{
    position:relative;
    width:600%;
    right:0;
}
section .students .studentClass>div{
    float:left;
    width:19.667%;
    margin-left: 0.3%;
}

.mr4{
    margin-right: 6%;
}
.ml2{
    margin-left: 3%;
}
section .studentClass::after{
    content:"" ;
    display:block;
    clear: both;
    height:0;
    overflow: hidden;
}
section .about .aboutUs .txt,section .about .aboutUs .txtMobile{
    width: 80%;
    margin: 0 auto;
}
section .about .aboutUs .txt p,section .about .aboutUs .txtMobile p{
    line-height: 30px;
    margin-top: 20px;
    text-indent: 2em;
}
section .about .aboutUs .txtMobile{
    display: none;
}
section .touch{
    margin-bottom: 30px;
}
section .touch>div{
    margin-left: 7%;
    margin-top: -170px;
    /*color: #fff;*/
    line-height: 40px;
}
section .touch>div{
    width: 55%;
}
section .touch>div img{
    width: 5%;
}
section .touch>img{
    width: 30%;
    margin-left: 10%;
    margin-top: 30px;
}
section .touch .code{
    width: 30%;
}
section .touch p{
    line-height: 40px;
}
section .touch span{
    padding-right: 10px;
}
section .touch::after{
    content:"" ;
    display:block;
    clear: both;
    height:0;
    overflow: hidden;
}
footer{
    background-color: #295373;

}
footer p{
    padding: 10px 0;
}
footer a{
    color: #fff;
}
/*固定*/
#con{
    width: 90%;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 100;
}
#con .fixed>div{
    width: 33%;
    float: left;
}
.fixed{
    height: 60px;
    background-color: rgb(47,117,187);
}
.fixed .webFix{
    color: #fff;
    font-size: 20px;
    line-height: 60px;
    margin-right: 10px;
    cursor: pointer;
}
.fixed img{
    width: 30px;
    float: left;
    margin-left: 33%;
    margin-top: 17px;
    margin-right: 20px;
}
.fixed a span{
    float: left;
}
.fixed p span{
    float: left;
}
.br{
    border-right: 2px solid white;
}
#con{
    display: none;
}
#con .fixed ul{
    display:none;
    width: 15%;
    left: 3%;
    position: absolute;
    border: 2px solid #f5f5f5;
    background-color: #fff;
    z-index: 20;
}
#con .fixed ul a{
    color: #333;
    line-height: 60px;
    font-size: 20px;
}
#con .divider{
    height: 2px;
    margin: 9px 15px;
    background-color: #e5e5e5;
}
/*中间弹窗*/
div#popup1 {
    color: #0099e5;
}
.yl_xzc {
    display: none;
    font-size: 1.2em;
    position: fixed;
    top: 48px;
    left: 50%;
    z-index: 99999;
    -webkit-box-shadow: 0px 0px 20px #000;
    -moz-box-shadow: 0px 0px 20px #000;
    box-shadow: 0px 0px 20px #000;
    height: auto;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    background: #fff;
    width: 480px;
    margin-left: -229px;
}
img.btn_close {
    position: absolute;
    right: 10px;
    top: 10px;
    margin: 0;
    float: right;
}
.xtc_nwd {
    width: 100%;
    padding-left: 40px;
    height: 45px;
    line-height: 45px;
    background: #0099e5;
    color: #fff;
    font-size: 14px;
}
#quickdiv2 {
    position: static;
    z-index: 1;
    background: #fff;
    width: 100%;
    height: auto;
}
div#tab_tc_ {
    display: block;
    width: 100%;
    text-align: center;
    float: left;
    line-height: 30px;
    height: 42px;
    margin: 0px;
    cursor: pointer;
    font-size: 18px;
    position: relative;

}
.tab_tc_ ul {
    height: 42px;
}
.tab_tc_ li {
    width: 396px;
    float: left;
    line-height: 30px;
    height: 42px;
    margin: 0px;
    cursor: pointer;
    font-size: 18px;
    position: relative;
    margin: 0 34px;
    margin-left:60px;
}
.nav_ys1, .nav_ys2 {
//background: url(zximages/tu_t1.jpg) no-repeat 0 35px;
    color: #0099e5;
}
.nor_tc {
    color: #a1aab2;
// background: url(zximages/tu_t0.jpg) no-repeat 0 35px;
}
#tab_tc_1 i {
    display: block;
    position: absolute;
    top: 7px;
    left: 65px;
    width: 10px;
    height: 16px;
    background:url(../images/tu_s0.jpg) no-repeat;
}
#tab_tc_1.nav_ys1 i {
    display: block;
    position: absolute;
    top: 7px;
    left: 65px;
    width: 10px;
    height: 16px;
    background: url(../images/tu_s12.jpg) no-repeat;
}
/*#tab_tc_2.nav_ys2 i {*/
    /*display: block;*/
    /*position: absolute;*/
    /*top: 7px;*/
    /*left: 25px;*/
    /*width: 15px;*/
    /*height: 16px;*/
    /*background: url(images/tu.jpg) no-repeat;*/
/*}*/
#tab_tc_2 i {
    display: block;
    position: absolute;
    top: 7px;
    left: 25px;
    width: 15px;
    height: 16px;
    background: url(../images/tu_s0.jpg) no-repeat;
}


.tc_net {
    clear: both;
    width: 100%;
    padding-top: 20px;
}
.ctt_tc_net {
    height: auto;
    clear: both;
    border-top: 0;
    text-align: left;
}
.dis_tc_net {
    display: block;
    line-height: 30px;
    width: 100%;
    height: auto;
}
.yl_tcxqhnr {
    width: 100%;
    height: auto;
}
.yl_tcxqhnr em, .yl_tcxqhnr b, .yl_tcxqhnr i {
    font-style: normal;
    font-weight: normal;
}
.yl_tcxqhnr ul li {
    height: 40px;
    line-height: 40px;
    font-size: 20px;
    margin: 20px 0;
}
.yl_tcxqhnr .tc_txt{
    font-size: 12px;
    height: 20px;
    margin-left: 30%;
}
.yl_tcxqhnr ul li span:first-child{
    margin-left:18px;
}
.yl_tcxqhnr ul li span {
    display: block;
    float: left;
    margin-left: 20px;
}


.yl_tcxqhnr ul li span i {
    font-size: 20px;
    color: #0099e5;
    display: block;
    float: left;
    padding-top: 5px;
    margin-right: 5px;
}
input.tc_tel {
    border: 1px #dedede solid;
    border-radius: 5px;
    height: 40px;
    line-height: 30px;
    padding-left: 5px;
    width: 290px;
    background: url(../images/tu_ss1.jpg) 270px 9px no-repeat;
    font-size: 16px;
    color: #555;
    font-family: Microsoft Yahei;
}
input.tc_pass {
    border: 1px #dedede solid;
    border-radius: 5px;
    height: 40px;
    line-height: 30px;
    padding-left: 5px;
    width: 290px;
    background: url(../images/tu_ss2.jpg) 270px 12px no-repeat;
    font-size: 16px;
    color: #333;
    font-family: Microsoft Yahei;
    margin-left:-3px;
}
.yl_tcxqhnr ul li.tc_tslidl {

}
.tc_tslidl dl {
    width: 330px;
    font-size: 12px;
    clear: both;
    padding-left: 140px;
}
.tc_tslidl dl b.tc_state {
    background: #ffaa00;
    color: #fff;
}
.tc_tslidl dl b {
    float: left;
    width: 90px;
    height: 14px;
    line-height: 14px;
    text-align: center;
    background: #d6d6d6;
    margin-left: 1px;
    color: #999;
    margin-top: 10px;
}
.yl_tcxqhnr ul li.tc_tsli {
    height: 90px;
    text-align: center;
    color: #6a6a6a;
}
.tc_xieyi a {
    text-decoration: none;
    color: #0099e5;
}
/*登陆免费切换*/
.tc_tsli input[type="button"], .tc_tsli2 input[type="button"] {
    padding: 10px 60px;
    font-size: 18px;
    color: #fff;
    background: #0099e5;
    border-radius: 5px;
    font-family: Microsoft Yahei;
    margin-top: 15px;
    cursor: pointer;
    border: 0;
}
.yl_tcxqhnr ul li.tc_tsli2 {
    height: 95px;
    text-align: center;
}
.tc_denglu {
    color: #6a6a6a;
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    text-align: left;
    padding-left: 50px;
    margin-bottom: 20px;
    clear: both;
}
.tc_tsli2 b {
    margin-left: 210px;
}
.tc_tsli2 b a {
    text-decoration: none;
    color: #0099e5;
    font-size: 14px;
}
.undis_tc_net {
    display: none;
    line-height: 30px;
    width: 100%;
    height: auto;
}
/*免费ok框*/
#successdiv2 {
    background: #fff;
    width: 100%;
    height: auto;
    position: static;
    z-index: 1;
}
.yl_tcxok dl {
    width: 104px;
    height: 104px;
    margin: 0 auto;
    margin-top: 50px;
}
.yl_tcxok span {
    width: 300px;
    display: block;
    font-size: 25px;
    text-align: center;
    margin: 0 auto;
    margin-top: 20px;
    height: 37px;
    clear: both;
}
.yl_xtcanx {
    width: 474px;
    margin: 50px 0;
    height: 50px;
    padding-left: 16px;
}
.yl_xtcanx a.yl_tc_xan1 {
    display: block;
    float: left;
    border-radius: 5px;
    color: #fff;
    font-size: 18px;
    padding: 10px 20px;
    background: #0099e5;
    text-decoration: none;
    margin-left: 50px;
}
.yl_xtcanx a.yl_tc_xan2 {
    display: block;
    float: left;
    border-radius: 5px;
    color: #fff;
    font-size: 18px;
    padding: 10px 20px;
    background: #0099e5;
    text-decoration: none;
    margin-left: 50px;
}
/*平板竖屏*/
@media only screen and (max-width:1024px) and (min-width:768px) and (orientation : landscape){
    header ul{
        margin-top:10px ;
        margin-left: 1%;
    }
    header li a{
        padding: 10px;
    }
    header .logo{
        width: 90%;
    }
    .banner .dots{bottom:20px}
    section .adv{
        width: 90%;
    }
    .mr{
        margin-right: 5%;
    }
    section .sec{
        padding-left: 0%;
    }
    section .audition{
        width:80%;
        margin: 0 auto;
        position:relative;
        overflow:hidden;
    }
    section .audition .videoCon{
        width: 23%;
        border: 1px solid #e4ecf3;
        /*border: 1px solid red;*/
        border-radius: 4px;
    }
    .mr2{
        margin-right: 2.61%;
    }
    section .audition .videoCon p:nth-child(2){
        font-size: 16px;
    }
    .leftVideo{
        left: 3%;
    }
    .rightVideo{
        right: 3%;
    }
    section .tit img{
        width: 50%;
    }
    .videoClassMobile{
        display: none;
    }
    .studentClassMobile{
        display: none;
    }
    section .teacher{
        width:90%;
    }
    section .teacher .teacherCon{
        width: 45%;
        margin-bottom: 20px;
    }
    section .teacher .teacherCon:nth-child(1),
    section .teacher .teacherCon:nth-child(3){
        margin-right: 10%;
    }
    .mr2{
        margin-right: 2.667%;
    }
    .mr5{
        margin-right: 0;
    }
    /*section .teacher .teacherCon p:nth-child(3){*/
        /*height: 110px;*/
    /*}*/
    section .students{
        width: 90%;
        margin: 0 auto;
        position:relative;
        overflow:hidden;
    }
    section .studentClass .studentCon img{
        border-radius:50% ;
        width: 60px;
        height: 60px;
        margin-top: 123px;
        margin-left: -10%;
    }
    section .studentClass .studentCon .txtBg{
        width: 200px;
        height: 183px;
        padding: 20px 5px 0;
        background: url("../images/border.png") no-repeat;
    }
    section .studentClass .studentCon .stuName{
        font-size: 20px;
        margin: 10px 0;
    }
    section .stu{
        position: relative;
        margin-bottom: 20px;
    }
    .leftStudent,.rightStudent{
        position: absolute;
        top: 160px;
        z-index: 20;
        cursor: pointer;
    }
    .leftStudent{
        left: 5%;
    }
    .rightStudent{
        right: 5%;
    }
    section .students .studentClass{
        position:relative;
        width:600%;
        right:0;
    }
    section .students .studentClass>div{
        float:left;
        width:19.667%;
    }

    .mr4{
        margin-right: 1%;
    }

    footer{
        margin-bottom: 60px;
    }
    #con{
        display: block;
    }
    /*中间弹窗*/
    .yl_xzc {
        width: 50%;
        margin-left: -25%;
    }
    .tab_tc_ li {
        width: 68%;
        margin: 0 20%;
    }

    #tab_tc_1.nav_ys1 i {
        left: 40px;
    }

    .yl_tcxqhnr .tc_txt{
        margin-left: 30%;
    }
    .yl_tcxqhnr ul li span:first-child{
        margin-left:60px;
    }
    .yl_tcxqhnr ul li span {
        margin-left: 10px;
    }
    input.tc_tel {
        width: 270px;
        background: url(../images/tu_ss1.jpg) 245px 9px no-repeat;
    }
    input.tc_pass {
        width: 290px;
        background: url(../images/tu_ss2.jpg) 265px 12px no-repeat;
    }
    .tc_tslidl dl b.tc_state {
        background: #ffaa00;
        color: #fff;
    }
    .yl_tcxqhnr ul li.tc_tsli {
        height: 90px;
        text-align: center;
        color: #6a6a6a;
    }
    /*免费ok框*/
    .yl_xtcanx a.yl_tc_xan1 {
        margin-left: 16%;
    }
}
/*平板横屏*/
@media only screen and (max-width:1024px) and (min-width:768px) and (orientation : portrait){
    /*header*/
    header .logo{
        width: 90%;
        min-width: 700px;
    }
    header img{
        margin-left: 44%;
    }
    header ul{
        margin-top:8px ;
        margin-left: 3%;
    }
    header li a{
        padding: 10px;
    }
    .banner .dots{bottom:20px}
    .banner .arrow{
        width: 5%;
    }
    section .adv{
        width: 100%;
    }
    section .tit img{
        width: 50%;
    }
    section .sec{
        padding-left: 0%;
    }
    .mr{
        margin-right: 0.6%;
    }
    .leftVideo{
        left: 2%;
    }
    .rightVideo{
        right: 2%;
    }
    .videoClassMobile{
        display: none;
    }
    .studentClassMobile{
        display: none;
    }
    section .teacher{
        width:90%;
    }
    section .teacher .teacherCon{
        width: 45%;
        margin-bottom: 20px;
    }
    section .teacher .teacherCon:nth-child(1),
    section .teacher .teacherCon:nth-child(3){
        margin-right: 10%;
    }
    .mr2{
        margin-right: 2.667%;
    }
    .mr5{
        margin-right: 0%;
    }
    /*section .teacher .teacherCon p:nth-child(3){*/
        /*height: 110px;*/
    /*}*/
    .studentClass{
        display: none;
    }
    .studentClassMobile{
        display: block;
        margin: 15px 0;
    }
    section .students{
        width: 90%;
        margin: 0 auto;
    }
    section .studentClassMobile .studentMobileCon{
        width: 45%;
    }
    section .studentClassMobile .studentMobileCon img{
        border-radius:50% ;
        width: 60px;
        height: 60px;
        margin-top: 103px;
        margin-left: 0%;
    }
    section .studentClassMobile .studentMobileCon .txtBg{
        width: 68%;
        height: 153px;
        padding: 20px 0;
        background: url("../images/border.png") no-repeat;
        /*background-size:70% 70% ;*/
    }
    section .studentClassMobile .studentMobileCon .stuName{
        font-size: 20px;
        margin: 10px 0;
        text-align: left;
        margin-left: 30%;
    }
    section .stu{
        position: relative;
        margin-bottom: 20px;
    }
    .leftStudent,.rightStudent{
        position: absolute;
        top: 120px;
        z-index: 20;
        width: 10%;
        cursor: pointer;
    }
    .leftStudent{
        left: 1%;
    }
    .rightStudent{
        right: 1%;
    }
    section .students .studentClassMobile{
        position:relative;
        width:600%;
        right:0;
    }
    section .students .studentClassMobile>div{
        float:left;
        width:19.667%;
    }
    .ml{
        margin-left: 6%;
    }
    .mr4{
        margin-right: -6%;
    }
    section .studentClassMobile::after{
        content:"" ;
        display:block;
        clear: both;
        height:0;
        overflow: hidden;
    }
    section .about .aboutUs .txt div{
        line-height: 20px;
    }
    section .touch{
        margin-bottom: 30px;
    }
    section .touch>div{
        margin-left: 40%;
        margin-top: -140px;
        line-height: 20px;
    }
    section .touch p{
        line-height: 20px;
    }
    .fixed img{
        margin-left: 22%;
    }
    footer{
        margin-bottom: 60px;
    }
    #con{
        display: block;
    }
    /*中间弹窗*/
    .yl_xzc {
        width: 50%;
        margin-left: -25%;
    }
    .tab_tc_ ul {
        height: 42px;
    }
    .tab_tc_ li {
        width: 68%;
        margin: 0 20%;
    }

    #tab_tc_1.nav_ys1 i {
        left: 0;
    }
    .yl_tcxqhnr .tc_txt{
        margin-left: 20%;
    }
    .yl_tcxqhnr ul li span:first-child{
        margin-left:40px;
    }
    .yl_tcxqhnr ul li span {
        margin-left: 10px;
    }
    input.tc_tel {
        width: 200px;
        background: url(../images/tu_ss1.jpg) 175px 9px no-repeat;
    }
    input.tc_pass {
        width: 220px;
        background: url(../images/tu_ss2.jpg) 195px 12px no-repeat;
    }
    /*免费ok框*/
    .yl_xtcanx a.yl_tc_xan1 {
        margin-left: 1%;
    }
}
/*手机*/
@media only screen and (max-width:767px) and (min-width:320px) {
    /*header*/
    .dy{
        display: none;
    }
    header .logo{
        width: 100%;
        margin: 10px 0;
        min-width: 300px;
    }
    header img{
        width: 25%;
        margin-left: 35%;
    }
    header ul{
        font-size: 12px;
        margin-top:10px ;
        margin-left: 0;
    }
    header li a{
        padding: 3px;
    }
    .banner .dots{bottom:5px}
    .banner .arrow{
        width: 5%;
    }
    section .adv{
        width: 100%;
    }

    section .tit h1{
        font-size: 20px;
    }
    section .tit img{
        width: 50%;
    }
    section .adv .ourAdv{
        width: 45%;
    }
    .ml1{
        margin-left: 3%;
    }
    section .adv .ourAdv img{
        width: 40%;
    }
    section .adv .ourAdv p:nth-child(2){
        font-size: 14px;
    }
    section .adv .ourAdv p:nth-child(3){
        font-size: 12px;
    }
    section .sec{
        padding-left: 5%;
    }
    .mr{
        margin-right: 3%;
    }
    section .course{
        width: 90%;
        margin: 0 auto;
    }
    section .con{
        width: 20%;
    }
    section .con .img{
        width: 50px;
        height: 50px;
        border-radius: 25px;
        background-color: #0099e5;
        margin:  0 auto;
    }
    section .con img{
        width: 50%;
        margin-top: 25%;
    }
    section .con .txt{
        margin: 15px 0;
    }
    .mr1{
        margin-right: 6%;
    }
    section .firstClass,section .secondClass{
        margin-top: 20px;
    }
    section .secondClass{
        margin-bottom: 20px;
    }
    .videoClass{
        display: none;
    }
    section .audition .videoMobileCon{
        width: 47%;
        border: 1px solid #e4ecf3;
        /*border: 1px solid red;*/
        border-radius: 4px;
    }
    .mr3{
        margin-right: 6%;
    }
    .videoClassMobile{
        display: block;
        margin: 15px 0;
    }
    section .audition .videoMobileCon img{
        width: 100%;
        border-top-left-radius:4px ;
        border-top-right-radius:4px ;

    }
    section .audition .videoMobileCon p:nth-child(2){
        font-size: 12px;
        margin: 10px 0;
    }
    section .audition .videoMobileCon p:nth-child(3){
        font-size: 12px;
        margin-bottom: 10px;
        color: #818a92;
    }
    section .audition .videoClassMobile{
        position:relative;
        width:600%;
        right:0;
    }
    section .audition .videoClassMobile>div{
        float:left;
        width:16.667%;
    }
    .leftVideo,.rightVideo{
        width: 10%;
        top: 100px;
    }
    .leftVideo{
        left: 1%;
    }
    .rightVideo{
        right: 1%;
    }
    section .teacher{
        width:90%;
    }
    section .teacher .teacherCon p:nth-child(2){
        font-size: 16px;
    }
    section .teacher .teacherCon{
        width: 45%;
        margin-bottom: 20px;
    }
    section .teacher .teacherCon:nth-child(1),
    section .teacher .teacherCon:nth-child(3){
        margin-right: 10%;
    }
    .mr2{
        margin-right: 0;
    }
    .mr5{
        margin-right: 0;
    }
    .studentClass{
        display: none;
    }
    .studentClassMobile{
        display: block;
        margin: 15px 0;
    }
    section .students{
        width: 90%;
        margin: 0 auto;
        position:relative;
        overflow:hidden;

    }
    section .studentClassMobile .studentMobileCon{
        width: 45%;
    }
    section .studentClassMobile .studentMobileCon img{
        border-radius:50% ;
        width: 50px;
        height: 50px;
        margin-top: 113px;
        margin-left: 0%;
    }
    section .studentClassMobile .studentMobileCon .txtBg{
        width: 80%;
        height: 153px;
        padding: 20px 0;
        background: url("../images/border.png") no-repeat;
        /*background-size:70% 70% ;*/
    }
    section .studentClassMobile .studentMobileCon .stuName{
        font-size: 20px;
        margin: 10px 0;
    }
    section .stu{
        position: relative;
        margin-bottom: 20px;
    }
    .leftStudent,.rightStudent{
        position: absolute;
        top: 120px;
        z-index: 20;
        width: 10%;
        cursor: pointer;
    }
    .leftStudent{
        left: 1%;
    }
    .rightStudent{
        right: 1%;
    }
    section .students .studentClassMobile{
        position:relative;
        width:600%;
        right:0;
    }
    section .students .studentClassMobile>div{
        float:left;
        width:19.667%;
    }

    .mr4{
        margin-right: 0;
    }
    section .studentClassMobile::after{
        content:"" ;
        display:block;
        clear: both;
        height:0;
        overflow: hidden;
    }
    section .about .aboutUs .txt p,section .about .aboutUs .txtMobile p{
        line-height: 20px;
    }
    section .about .aboutUs .txt{
        /* display: none; */
    }
    section .about .aboutUs .txtMobile{
        display: block;
    }
    section .touch{
        margin-bottom: 30px;
    }
    section .touch>div{
        margin-left: 40%;
        margin-top: -70px;
        /*color: #fff;*/
        line-height: 20px;
    }
    section .touch>div p{
        width: 100%;
    }
    section .touch>div img{
        width: 5%;
    }
    section .touch>img{
        width: 30%;
        margin-left: 5%;
        margin-top: 30px;
    }
    section .touch p{
        line-height: 20px;
    }
    section .touch span{
        padding-right: 10px;
    }
    footer p{
        width: 80%;
        padding: 10px 0;
        margin: 0 auto;
    }
    footer{
        margin-bottom: 60px;
    }
    #con{
        width: 100%;
        display: block;
    }
    #con .fixed>div{
        width: 32%;
    }
    .fixed .webFix{
        font-size: 12px;
    }
    .fixed img{
        width: 20px;
        margin-left: 15%;
        margin-top: 20px;
        margin-right: 7px;
    }
    #con .fixed ul{
        display: none;
        width: 27%;
        left: 3%;
        position: absolute;
        bottom: 60px;
        border: 2px solid #f5f5f5;
        background-color: #fff;
        z-index: 20;
    }
    #con .fixed ul a{
        color: #333;
    }
    #con .divider{
        height: 2px;
        margin: -6px 7px;
        background-color: #e5e5e5;
    }
    /*中间弹窗*/
    .yl_xzc {
        width: 90%;
        margin-left: -45%;
    }
    .tab_tc_ li {
        width: 70%;
        margin: 0 20%;
        /*margin-left:60px;*/
    }
    #tab_tc_1.nav_ys1 i {
        left: -15px;
    }
    .yl_tcxqhnr .tc_txt{
        margin-left: 20%;
    }
    .yl_tcxqhnr ul li span:first-child{
        margin-left:15px;
    }
    .yl_tcxqhnr ul li span {
        margin-left: 10px;
    }
    input.tc_tel {
        width: 200px;
        background: url(../images/tu_ss1.jpg) 175px 9px no-repeat;
    }
    input.tc_pass {
        width: 220px;
        background: url(../images/tu_ss2.jpg) 195px 12px no-repeat;
    }
    /*免费ok框*/
    .yl_xtcanx a.yl_tc_xan1 {
        margin-left: 0;
    }
    .yl_xtcanx a.yl_tc_xan2 {
        margin-left: 2%;
    }
}