.container {
    width: 1200px;
    margin: 0 auto
}

ul, li {
    list-style: none;
    border: none;
}

a {
    text-decoration: none;
}

p, h1, h2, h3, h4, h5, h6, ul, li, img, form {
    margin: 0;
    padding: 0;
}

div {
    marign: 0;
    padding: 0
}

.clear {
    clear: both;
}

<
/
p >
< p > .vision_title {
    width: 100%;
    margin: 0 auto;
}

.vision_title h2 {
    font-size: 36px;
    color: #474548;
    text-align: center;
    border: 0px solid #fff;
    padding: 100px 0 60px;

}

.vision_title h2 span.vision_title_c {
    color: #f0383c;;
}

.vision_title h3 {
    font-size: 18px;
    margin-top: -45px;
    text-align: center;
    color: #5e5e5e;
    font-weight: normal;
    border: 0px solid #fff;
    padding-bottom: 20px;
}

.shizhan
{
    background: #ecf6ff;
}
#vision_why_main {
    padding-bottom: 100px;
    margin: 0 auto;
}

#vision_why_main ul li {
    width: 32%;
    float: left;
    width: 200px;
    height: 320px;
    border: 1px solid #95aee6;
    border-radius: 10px;
    text-align: center;
    margin-left:40px;
}

#vision_why_main ul li:nth-of-type(1) {
    margin-left: 0;
}
#vision_why_main ul li .p1{
    margin: 20px  0 10px 0;
    font-size: 28px;
    color: #333;
    font-weight: 700;
}
#vision_why_main ul li i{
    width: 30px;
    height: 4px;
    background: #ffaf00;
    text-align: center;
    margin: 0 auto;
    display: block;
}
#vision_why_main ul li .p2{
    margin-top: 20px;
    font-size: 16px;
    color: #999;
}
#vision_why_main ul li img {
    margin: 40px auto 0 auto;
    display: block;
}

.vision_why_area {
    width: 100%;
    background-image: -moz-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    background-image: -webkit-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    background-image: -ms-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    box-shadow: 0px 8px 16px 0px rgba(255, 106, 110, 0.38);
    padding: 5px 0 20px;
}

.vision_why_area h4 {
    font-size: 28px;
    color: #fff;
    text-align: center;
    margin-bottom: 20px
}

.vision_why_area p {
    font-size: 20px;
    color: #fff;
    text-align: center;
    margin-top: -10px;
}

<
/
p >
< p > .vision_learn_pack {
    width: 100%;
    display: none;
}

.vision_learn_pack h5 {
    width: 220px;
    height: 60px;
    line-height: 60px;
    background-color: #f538a6;
    font-size: 24px;
    color: #fff;
    font-weight: normal;
    margin-bottom: 20px;
    text-align: center;
}

.vision_learn_pack ul {
    margin-top: 10px;
}

.vision_learn_pack ul li {
    width: 24%;
    float: left;
    margin: 0 0 15px 1%;
}

.vision_learn_pack ul li:nth-child(1){
    margin-left: 0;
}

.vision_learn_pack ul li img {
    display: block;
    width: 100%;
}

.vision_learn_pack ul li h4 {
    width: 100%;
    background-image: -moz-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    background-image: -webkit-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    background-image: -ms-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    box-shadow: 0px 8px 16px 0px rgba(255, 106, 110, 0.38);
    height: 52px;
    line-height: 52px;
    font-size: 24px;
    text-align: center;
    color: #fff;
    font-weight: normal;
}

<
/
p >
< p > #vision_suit_main {
    width: 100%;
    margin: 0 auto;
}

#vision_suit_main ul li {
    width: 32%;
    float: left;
    margin-left: 2%;
    background-color: #fff;
    box-shadow: 0 0 20px #dbdbdb;
    border-radius: 10px;
}

#vision_suit_main ul li:nth-of-type(1) {
    margin-left: 0;
}

#vision_suit_main ul li img {
    width: 28%;
    float: left;
    margin: 20px 3% 0 1%;
}

.vision_suit_text {
    float: left;
    width: 68%;
    margin-left: 60px;
    margin-bottom: 20px;
}

.vision_suit_text h4 {
    font-size: 30px;
    color: #3c3c3c;
    padding-top: 20px;
}

.vision_suit_text span {
    display: block;
    width: 65px;
    height: 3px;
    background-color: #f0383c;
    margin: 18px 0;
}

.vision_suit_text p {
    font-size: 16px;
    line-height: 28px;
    color: #434343;
    padding: 0 10px 0 0;
}

 .yhnew_href {
    width: 300px;
    height: 60px;
}

.yhnew_href a {
    display: block;
    width: 30%;
    height: 60px;
    font-size: 20px;
    display: block;
    background-color: #f0383c;
    color: #fff;
    border-radius: 50px;
    margin: 30px auto 0;
    text-align: center;
    line-height: 60px;
}

<
/
p >
< p > #vision_jobs_main {
    width: 100%;
    margin: 0 auto;
}

#vision_jobs_main ul li {
    float: left;
    width: 23.5%;
    margin-left: 2%;
}

#vision_jobs_main ul li:nth-of-type(1) {
    margin-left: 0;
}

#vision_jobs_main ul li img {
    display: block;
    width: 100%;
    transition: 0.6s;
}

.vision_jobs_pic {
    overflow: hidden;
}

#vision_jobs_main ul li h4 {
    width: 100%;
    height: 52px;
    line-height: 52px;
    background-image: -moz-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    background-image: -webkit-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    background-image: -ms-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    box-shadow: 0px 8px 16px 0px rgba(255, 106, 110, 0.38);
    font-size: 24px;
    color: #fff;
    text-align: center;
    font-weight: normal;
}

.vision_jobs_pic img:hover {
    transform: scale(1.1);
}

<
/
p >
< p > #vision_course_exp {
    width: 100%;
}

.vision_content {
    width: 100%;
    margin: 0 0 20px;
}

.vision_content_left {
    width: 46%;
    float: left;
}

.vision_content_left img {
    display: block;
    float: left;
}

.vision_content_left img:nth-of-type(2) {
    width: 50%;
}

.vision_content_left img:nth-of-type(3) {
    width: 50%;
}

.vision_content_right {
    width: 54%;
    height: 501px;
    float: left;
    background-color: #3e4efb;
    padding: 20px;
}

.vision_content_right h4 {
    font-size: 28px;
    color: #fff;
}

.vision_content_right h3 {
    font-size: 24px;
    padding: 0;
    color: #fff;
    border: 0px solid #fff;
}

.vision_content_right p {
    font-size: 16px;
    line-height: 36px;
    color: #fff;
}

<
/
p >
< p > #vision_teacher_main {
    width: 100%;
    margin: 0 auto;
}

#vision_teacher_main ul li {
    width: 23.5%;
    float: left;
    margin-left: 2%;
}

#vision_teacher_main ul li:nth-of-type(1) {
    margin-left: 0;
}

#vision_teacher_main ul li img {
    display: block;
    width: 100%;
}

.vision_teacher_area {
    width: 100%;
    height: 250px;
    background-color: #fff;
    text-align: center;
    box-shadow: 0 0 20px #dbdbdb;
}

.vision_teacher_area h4 {
    font-size: 24px;
    color: #2c2c2c;
    padding: 10px 0 6px;
}

.vision_teacher_area h5 {
    font-size: 18px;
    color: #626262;
    font-weight: normal;
}

.vision_teacher_area span {
    display: block;
    width: 40px;
    height: 3px;
    background-color: #f0383c;
    margin: 12px auto 0;
}

.vision_teacher_area p {
    font-size: 16px;
    color: #878787;
    line-height: 32px;
    padding: 5px 10px;
}

 #vision_works_exp {
    width: 100%;
    margin: 0 auto;
    display: block;
}

#vision_works_pc {
    width: 100%;
}

#vision_works_yd {
    width: 100%;
    display: none;
}

#vision_works_pc h4 {
    width: 170px;
    height: 56px;
    font-size: 20px;
    color: #fff;
    line-height: 56px;
    text-align: center;
    background-color: #f72da2;
}

.vision_works_area {
    width: 100%;
    height: 700px;
    margin: 0 auto;
    position: relative;
    display: block;
}

.vision_works_area ul li {
    position: absolute;
}

.vision_works_area ul li img {
    width: 100%;
    display: block;
}

.vision_works_area ul li.vision_works_m1 {
    width: 39%;
    top: 0;
    left: 0;
}

.vision_works_area ul li.vision_works_m2 {
    width: 29%;
    top: 0;
    left: 40.2%;
}

.vision_works_area ul li.vision_works_m3 {
    width: 29.8%;
    top: 0;
    left: 70.2%;
}

.vision_works_area ul li.vision_works_m4 {
    width: 29.2%;
    top: 35%;
    left: 0;
}

.vision_works_area ul li.vision_works_m5 {
    width: 38.5%;
    top: 35%;
    left: 30.7%;
}

.vision_works_area ul li.vision_works_m6 {
    width: 22.5%;
    top: 66%;
    left: 30.7%;
}

.vision_works_area ul li.vision_works_m7 {
    width: 22.5%;
    top: 66%;
    left: 54.1%;
}

.vision_works_area ul li.vision_works_m8 {
    width: 22.5%;
    top: 66%;
    left: 77.5%;
}

<
/
p >
< p > #chjy_project_main {
    width: 100%;
    margin: 0 auto 50px;
    padding: 0 0 60px;
}

#chjy_project_main ul li {
    width: 32%;
    height: 520px;
    float: left;
    margin-left: 2%;
    text-align: center;
    position: relative;
    overflow: hidden;
    margin-bottom:30px;
}

#chjy_project_main ul li:nth-of-type(1) {
    margin-left: 0;
}
#chjy_project_main ul li:nth-of-type(4) {
    margin-left: 0;
}

#chjy_project_main ul li img {
    display: block;
    width: 100%;
}

#chjy_project_main ul li h4 {
    width: 100%;
    height: 65px;
    background: rgba(15, 18, 55, 0.7);
    line-height: 65px;
    font-size: 30px;
    color: #fff;
    position: absolute;
    bottom: 32px;
}

.chjy_project_mask {
    width: 100%;
    height: 100%;
    background: rgba(15, 18, 55, 0.7);
    position: absolute;
    top: 0;
    display: none;
}

.chjy_project_mask h5 {
    font-size: 38px;
    color: #f4e500;
    margin-top: 200px;
}

.chjy_project_mask span {
    display: block;
    width: 100px;
    height: 2px;
    background-color: #fff;
    margin: 40px auto;
}

.chjy_project_mask p {
    font-size: 24px;
    color: #fff;
    line-height: 46px;
}

#chjy_project_main ul li:hover h4 {
    display: none;
}

#chjy_project_main ul li:hover .chjy_project_mask {
    display: block;
}

<
/
p >
< p > #chjy_aid_main {
    width: 100%;
    margin: 0 auto;
}

#chjy_aid_main ul li {
    width: 32%;
    float: left;
    margin: 0 0 30px 2%;
}

#chjy_aid_main ul li:nth-of-type(3n+1) {
    margin-left: 0;
}

#chjy_aid_main ul li img {
    display: block;
    width: 100%;
}

.chjy_aid_area {
    width: 100%;
    text-align: center;
    box-shadow: 3px 10px 20px #f2f2f2;
}

.chjy_aid_area h4 {
    font-size: 24px;
    color: #353535;
    padding-top: 10px;
}

.chjy_aid_area p {
    font-size: 16px;
    color: #707070;
    padding: 0 0 10px;
}

 #chjy_circle_yd {
    width: 100%;
}

.chjy_circle_box {
    width: 100%;
    padding-bottom: 30px;
}

.chjy_circle_box h4 {
    font-size: 1.4rem;
    color: #2b2b2b;
    margin: 0.5rem 0 1rem 0.5rem;
}

.chjy_circle_box ol {
    margin-top: 0;
}

.chjy_circle_box ol li {
    width: 32%;
    float: left;
    margin-left: 2%;
}

.chjy_circle_box ol li:nth-of-type(1) {
    margin-left: 0;
}

<
/
p >
< p > #vision_choice_main {
    width: 100%;
    margin: 0 auto;
    padding-bottom: 30px;
}

#vision_choice_main ul li {
    width: 30%;
    height: 140px;
    float: left;
    margin: 0 0 30px 5%;
    text-align: center;
    padding: 25px 40px;
    background-image: -moz-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    background-image: -webkit-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    background-image: -ms-linear-gradient(-230deg, rgb(240, 56, 60) 19%, rgb(254, 172, 120) 100%);
    box-shadow: 0px 8px 16px 0px rgba(255, 106, 110, 0.38);
}

#vision_choice_main ul li:nth-of-type(3n+1) {
    margin-left: 0;
}

#vision_choice_main ul li h4 {
    font-size: 28px;
    font-weight: 700;
    color: #fff;
}

#vision_choice_main ul li span {
    display: block;
    width: 40px;
    height: 2px;
    background-color: #fff;
    margin: 15px auto;
}

#vision_choice_main ul li p {
    font-size: 16px;
    line-height: 32px;
    color: #f1f1f1;
}

 #chjy_class_main {
    width: 100%;
    margin: 0 auto;
}

#chjy_class_main ul li {
    width: 32%;
    float: left;
    background-color: #3069d7;
    border-radius: 16px;
    padding: 16px;
    margin: 0 0 30px 2%;
}

#chjy_class_main ul li:nth-of-type(3n+1) {
    margin-left: 0;
}

#chjy_class_main ul li img {
    display: block;
    border-radius: 10px;
}

#chjy_class_main ul li h4 {
    font-size: 20px;
    color: #fff;
    text-align: center;
    font-weight: normal;
    padding: 20px 0 0;
}

.chjy_class_box {
    width: 100%;
    position: relative;
}

.chjy_class_mask {
    position: absolute;
    left: 10px;
    bottom: 0;
}

.chjy_class_mask img {
    width: 20%;
}

<
/
p >
< p > #vision_honor {
    width: 100%;
}

#vision_honor_main {
    width: 100%;
    margin: 0 auto;
}

#vision_honor_left {
    width: 100%;
    float: left;
}

#vision_honor_left video {
    width: 100%;
    height: auto;
    display: block;
    background-color: #2a2a2a;
}

#vision_honor_left h4 {
    width: 100%;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 20px;
    color: #484848;
}

<
/
p >
< p > #vision_honor_right {
    width: 100%;
    float: left;
}

#vision_honor_right ul li {
    width: 23.5%;
    float: left;
    margin: 0 0 0 2%;
}

#vision_honor_right ul li:nth-of-type(1) {
    margin-left: 0;
}

#vision_honor_right ul li img {
    display: block;
}

#vision_honor_right ul li h4 {
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    color: #484848;
    text-align: center;
    font-weight: normal;
}

<
/
p >
< p > #chjy_place {
    width: 100%;
}

#chjy_place ul li {
    float: left;
    margin-left: 0.55%;
    margin-bottom: 0.55%;
}

#chjy_place ul li img {
    width: 100%;
    display: block;
}

#chjy_place ul li:nth-of-type(5n+1) {
    margin-left: 0;
}

#chjy_place ul li.chsj_space_w1 {
    width: 24.25%;
}

#chjy_place ul li.chsj_space_w2 {
    width: 16.2%;
}

<
/
p >

@media only screen and (min-width: 768px) and (max-width: 1024px) {
</p >
< p > .vision_title {
    width: 100%;
}

    .vision_title h2 {
        font-size: 2.8rem;
        padding: 1.0rem 0 1.4rem;
    }

    .vision_title h3 {
        font-size: 1.6rem;
        margin-top: -1.0rem;
        padding-bottom: 1.4rem;
    }

</p >
  < p > #vision_why_main {
      width: 100%;
  }

    #vision_why_main ul li {
        width: 32%;
        margin-left: 2%;
    }

    #vision_why_main ul li:nth-of-type(1) {
        margin-left: 0;
    }

    .vision_why_area {
        padding: 1rem 0 1rem;
    }

    .vision_why_area h4 {
        font-size: 1.4rem;
    }

    .vision_why_area p {
        font-size: 1.2rem;
        margin-top: -0.5rem;
    }

</p >
  < p > .vision_learn_pack {
      width: 100%;
  }

    .vision_learn_pack h5 {
        width: 30%;
        height: 4rem;
        line-height: 4rem;
        font-size: 1.6rem;
        margin-bottom: 1rem;
    }

    .vision_learn_pack ul {
        margin-top: 1rem;
    }

    .vision_learn_pack ul li {
        width: 32%;
        margin: 0 0 1rem 2%;
    }

    .vision_learn_pack ul li h4 {
        width: 100%;
        height: 3.6rem;
        line-height: 3.6rem;
        font-size: 1.4rem;
    }

</p >
  < p > #vision_suit_main {
      width: 100%;
  }

    #vision_suit_main ul li {
        width: 32%;
        margin-left: 2%;
    }

    #vision_suit_main ul li img {
        width: 60%;
        margin: 0 0 0 20%;
        float: none;
    }

    .vision_suit_text {
        width: 100%;
        float: none;
    }

    .vision_suit_text h4 {
        font-size: 1.8rem;
        padding-top: 0.8rem;
        text-align: center;
    }

    .vision_suit_text span {
        margin: 0.8rem auto 0;
    }

    .vision_suit_text p {
        font-size: 1.2rem;
        line-height: 1.8rem;
        padding: 0 1rem 1rem;
        text-align: center;
    }

</p >
  < p > .yhnew_href {
      width: 100%;
      height: 3.6rem;
      margin: 0 auto;
  }

    .yhnew_href a {
        width: 50%;
        height: 3.6rem;
        line-height: 3.6rem;
        font-size: 1.4rem;
        margin: 1.5rem auto 2rem;
    }

</p >
  < p > #vision_jobs_main {
      width: 100%;
  }

    #vision_jobs_main ul li {
        width: 49%;
        margin: 0 0 1rem 2%;
    }

    #vision_jobs_main ul li:nth-of-type(2n+1) {
        margin-left: 0;
    }

    #vision_jobs_main ul li h4 {
        height: 4rem;
        line-height: 4rem;
        font-size: 1.6rem;
    }

</p >
  < p > #vision_course_exp {
      width: 100%;
  }

    .vision_content {
        width: 100%;
        margin: 0;
    }

    .vision_content_left {
        width: 100%;
        float: none;
    }

    .vision_content_left img {
        width: 100%;
        display: block;
    }

    .vision_content_left img:nth-of-type(1) {
        margin-bottom: 0;
    }

    .vision_content_left img:nth-of-type(2), .vision_content_left img:nth-of-type(3) {
        display: none;
    }

    .vision_content_right {
        float: none;
        height: auto;
        width: 100%;
        padding: 2%;
        margin-bottom: 1rem;
    }

    .vision_content_right h4 {
        font-size: 2.0rem;
    }

    .vision_content_right h3 {
        font-size: 1.8rem;
        padding: 0 0 0.5rem;
    }

    .vision_content_right p {
        font-size: 1.4rem;
        line-height: 2.2rem;
    }

</p >
  < p > #vision_teacher_main {
      width: 100%;
  }

    #vision_teacher_main ul li {
        width: 49%;
        margin: 0 0 1rem 2%;
    }

    #vision_teacher_main ul li:nth-of-type(2n+1) {
        margin-left: 0;
    }

    .vision_teacher_area {
        height: 21rem;
    }

    .vision_teacher_area h4 {
        font-size: 1.8rem;
        padding: 1rem 0 0;
    }

    .vision_teacher_area h5 {
        font-size: 1.6rem;
    }

    .vision_teacher_area span {
        margin: 0 auto;
    }

    .vision_teacher_area p {
        font-size: 1.4rem;
        line-height: 2.4rem;
        padding: 0 1rem 1rem;
    }

</p >
  < p > #vision_works_exp {
      width: 100%;
      margin: 0 auto;
      display: block;
  }

    #vision_works_pc {
        width: 100%;
        display: none;
    }

    #vision_works_yd {
        width: 100%;
        display: block;
    }

    #vision_works_yd h4 {
        width: 10rem;
        height: 4rem;
        font-size: 1.4rem;
        color: #fff;
        line-height: 4rem;
        text-align: center;
        background-color: #f72da2;
    }

    .vision_works_box {
        width: 100%;
        margin: 0 auto 1rem;
    }

    .vision_works_box ul li {
        float: left;
        width: 49%;
        height: 10rem;
        overflow: hidden;
        margin-left: 2%;
    }

    .vision_works_box ul li:nth-of-type(2n+1) {
        margin-left: 0;
    }

    .vision_works_box ul li img {
        width: 100%;
    }

</p >
  < p > #chjy_project {
      padding-bottom: 2rem;
  }

    #chjy_project_main {
        width: 100%;
    }

    #chjy_project_main ul li {
        width: 30%;
        height: auto;
        margin-left: 2.5%;
    }

    #chjy_project_main ul li:nth-of-type(1) {
        margin-left: 2.5%;
    }

    #chjy_project_main ul li h4 {
        height: 3rem;
        line-height: 3rem;
        font-size: 1.2rem;
        bottom: -0.3rem;
    }

    .chjy_project_mask {
        height: 17.3rem;
    }

    .chjy_project_mask h5 {
        font-size: 1.2rem;
        margin-top: 2.5rem;
    }

    .chjy_project_mask span {
        width: 2rem;
        height: 0.1rem;
        margin: 1.5rem auto;
    }

    .chjy_project_mask p {
        font-size: 1.0rem;
        line-height: 1.4rem;
    }

</p >
  < p > #chjy_aid {
      padding-bottom: 2rem;
  }

    #chjy_aid_main {
        width: 100%;
    }

    #chjy_aid_main ul li {
        width: 49%;
        margin: 0 0 1.0rem 2%;
    }

    #chjy_aid_main ul li:nth-of-type(3n+1) {
        margin-left: 2%;
    }

    #chjy_aid_main ul li:nth-of-type(2n+1) {
        margin-left: 0;
    }

    .chjy_aid_area {
        width: 100%;
    }

    .chjy_aid_area h4 {
        font-size: 1.6rem;
        padding-top: 1rem;
    }

    .chjy_aid_area p {
        font-size: 1.2rem;
        padding: 0 0 0.5rem;
    }

</p >
  < p > #chjy_circle_yd {
      width: 100%;
  }

    .chjy_circle_box {
        width: 100%;
        padding-bottom: 2rem;
    }

    .chjy_circle_box h4 {
        font-size: 1.8rem;
        margin: 0.5rem 0 1rem 0.5rem;
    }

    .chjy_circle_box ol {
        margin-top: 2rem;
    }

    .chjy_circle_box ol li {
        width: 47%;
        margin-left: 2%;
    }

    .chjy_circle_box ol li:nth-of-type(1) {
        display: none;
    }

</p >
  < p > #vision_choice_main {
      padding-bottom: 1rem;
  }

    #vision_choice_main ul li {
        width: 49%;
        height: 9rem;
        margin: 0 0 1rem 2%;
        padding: 1.8rem 1% 2rem;
    }

    #vision_choice_main ul li:nth-of-type(3n+1) {
        margin-left: 2%;
    }

    #vision_choice_main ul li:nth-of-type(2n+1) {
        margin-left: 0;
    }

    #vision_choice_main ul li h4 {
        font-size: 1.6rem;
    }

    #vision_choice_main ul li span {
        margin: -1rem auto 0;
    }

    #vision_choice_main ul li p {
        font-size: 1.2rem;
        line-height: 2.2rem;
        padding: 0 1rem;
    }

</p >
  < p > #chjy_class {
      padding-bottom: 1rem;
  }

    #chjy_class_main {
        width: 100%;
    }

    #chjy_class_main ul li {
        width: 49%;
        padding: 1rem;
        margin: 0 0 1rem 2%;
    }

    #chjy_class_main ul li:nth-of-type(3n+1) {
        margin-left: 2%;
    }

    #chjy_class_main ul li:nth-of-type(2n+1) {
        margin-left: 0;
    }

    .chjy_class_box > img {
        width: 98%;
    }

    #chjy_class_main ul li h4 {
        font-size: 1.4rem;
        padding: 1rem 0 0;
    }

    .chjy_class_mask {
        position: absolute;
        left: 0.8rem;
        bottom: -0.8rem;
    }

    .chjy_class_mask img {
        width: 28%;
    }

</p >
  < p > #vision_honor_main {
      width: 100%;
      margin: 0 auto;
  }

    #vision_honor_left {
        width: 100%;
    }

    #vision_honor_left video {
        width: 100%;
    }

    #vision_honor_left h4 {
        width: 100%;
        height: 4rem;
        line-height: 4rem;
        font-size: 1.6rem;
    }

</p >
  < p > #vision_honor_right {
      width: 100%;
  }

    #vision_honor_right ul li {
        width: 49%;
        float: left;
        margin: 0 0 0 2%;
    }

    #vision_honor_right ul li:nth-of-type(2n+1) {
        margin-left: 0;
    }

    #vision_honor_right ul li h4 {
        width: 100%;
        height: 3rem;
        line-height: 3rem;
        font-size: 1.2rem;
    }

</p >
  < p > #chjy_place {
      width: 100%;
  }

    #chjy_place ul li {
        width: 47%;
        margin-left: 2%;
        margin-bottom: 1rem;
    }

    #chjy_place ul li:nth-of-type(5n+1) {
        margin-left: 2%;
    }

    #chjy_place ul li.chsj_space_w1 {
        width: 47%;
    }

    #chjy_place ul li.chsj_space_w2 {
        display: none
    }

</p >
  < p >
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
</p >
< p > .vision_title {
    width: 100%;
}

    .vision_title h2 {
        font-size: 1.4rem;
        padding: 0.2rem 0 0.8rem
    }

    .vision_title h3 {
        font-size: 1.0rem;
        margin-top: -1.0rem;
        padding-bottom: 0.8rem;
    }

</p >
  < p > #vision_why_main {
      width: 100%;
  }

    #vision_why_main ul li {
        width: 90%;
        float: none;
        margin: 0 0 0.6rem 5%;
    }

    #vision_why_main ul li:nth-of-type(1) {
        margin-left: 5%;
    }

    .vision_why_area {
        padding: 0.8rem 0 1.2rem;
    }

    .vision_why_area h4 {
        font-size: 1.2rem;
    }

    .vision_why_area p {
        font-size: 1.0rem;
        margin-top: -0.8rem;
    }

</p >
  < p > .vision_learn_pack {
      width: 100%;
  }

    .vision_learn_pack h5 {
        width: 50%;
        height: 2.8rem;
        line-height: 2.8rem;
        font-size: 1.2rem;
        margin-bottom: 0.8rem;
    }

    .vision_learn_pack ul {
        margin-top: 1rem;
    }

    .vision_learn_pack ul li {
        width: 49%;
        float: left;
        margin: 0 0 1rem 2%;
    }

    .vision_learn_pack ul li:nth-of-type(3n+1) {
        margin-left: 2%;
    }

    .vision_learn_pack ul li:nth-of-type(2n+1) {
        margin-left: 0;
    }

    .vision_learn_pack ul li h4 {
        width: 100%;
        height: 2.6rem;
        line-height: 2.6rem;
        font-size: 1.0rem;
    }

</p >
  < p > #vision_suit_main {
      width: 100%;
  }

    #vision_suit_main ul li {
        width: 100%;
        margin: 0 0 1rem 0;
    }

    #vision_suit_main ul li img {
        width: 30%;
        margin: 0;
        float: left;
        padding-right: 4%;
        padding-top: 0.8rem;
    }

    .vision_suit_text {
        width: 66%;
        float: left;
    }

    .vision_suit_text h4 {
        font-size: 1.2rem;
        padding-top: 0.5rem;
    }

    .vision_suit_text span {
        margin: -0.3rem 0 0.2rem;
    }

    .vision_suit_text p {
        font-size: 0.9rem;
        line-height: 1.4rem;
        padding: 0;
    }

</p >
  < p > .yhnew_href {
      width: 100%;
      height: 2.2rem;
      margin: 0 auto;
  }

    .yhnew_href a {
        width: 70%;
        height: 2.2rem;
        line-height: 2.2rem;
        font-size: 1.2rem;
        margin: 0.5rem auto 1rem;
    }

</p >
  < p > #vision_jobs_main {
      width: 100%;
  }

    #vision_jobs_main ul li {
        width: 49%;
        margin: 0 0 0.6rem 2%;
    }

    #vision_jobs_main ul li:nth-of-type(2n+1) {
        margin-left: 0;
    }

    #vision_jobs_main ul li h4 {
        height: 2rem;
        line-height: 2rem;
        font-size: 1.0rem;
    }

</p >
  < p > #vision_course_exp {
      width: 100%;
  }

    .vision_content {
        width: 100%;
        margin: 0;
        display: block;
    }

    .vision_content_left {
        width: 100%;
        float: none;
    }

    .vision_content_left img {
        width: 100%;
        display: block;
    }

    .vision_content_left img:nth-of-type(1) {
        margin-bottom: 0;
    }

    .vision_content_left img:nth-of-type(2), .vision_content_left img:nth-of-type(3) {
        display: none;
    }

    .vision_content_right {
        float: none;
        height: auto;
        width: 100%;
        padding: 2%;
        margin-bottom: 0.5rem;
    }

    .vision_content_right h4 {
        font-size: 1.3rem;
        padding-top: 0.3rem;
    }

    .vision_content_right h3 {
        font-size: 1.1rem;
        padding: -0.2rem 0 0.2rem;
    }

    .vision_content_right p {
        font-size: 0.9rem;
        line-height: 1.6rem;
    }

</p >
  < p > #vision_teacher_main {
      width: 100%;
  }

    #vision_teacher_main ul li {
        width: 100%;
        margin: 0 0 0.8rem 0;
    }

    #vision_teacher_main ul li:nth-of-type(1) {
        margin-left: 0;
    }

    .vision_teacher_area {
        height: auto;
    }

    .vision_teacher_area h4 {
        font-size: 1.4rem;
        padding: 0.6rem 0 0;
    }

    .vision_teacher_area h5 {
        font-size: 1.2rem;
    }

    .vision_teacher_area span {
        margin: 0 auto;
    }

    .vision_teacher_area p {
        font-size: 1.0rem;
        line-height: 1.6rem;
        padding: 0 0.5rem 0.5rem;
    }

</p >
  < p > #vision_works_exp {
      width: 100%;
      margin: 0 auto;
      display: block;
  }

    #vision_works_pc {
        width: 100%;
        display: none;
    }

    #vision_works_yd {
        width: 100%;
        display: block;
    }

    #vision_works_yd h4 {
        width: 8rem;
        height: 2.8rem;
        font-size: 1.2rem;
        color: #fff;
        line-height: 2.8rem;
        text-align: center;
        background-color: #f72da2;
    }

    .vision_works_box {
        width: 100%;
        margin: 0 auto 0.5rem;
    }

    .vision_works_box ul li {
        float: left;
        width: 100%;
        auto;
        overflow: hidden;
    }

    .vision_works_box ul li img {
        width: 100%;
    }

</p >
  < p > #vision_actual {
      padding-bottom: 1.4rem;
  }

    #vision_project {
        padding-bottom: 1.4rem;
    }

    #vision_project_main {
        width: 100%;
    }

    #vision_project_main ul li {
        width: 80%;
        height: auto;
        margin-left: 10%;
        font-size: 1.4rem;
        margin-bottom: 0.6rem;
    }

    #vision_project_main ul li:nth-of-type(1) {
        margin-left: 10%;
    }

    #vision_project_main ul li h4 {
        height: 2.6rem;
        line-height: 2.6rem;
        font-size: 1.4rem;
    }

    .vision_project_mask {
        height: 23rem;
    }

    .vision_project_mask h5 {
        font-size: 1.6rem;
        margin-top: 2.8rem;
    }

    .vision_project_mask span {
        width: 3rem;
        height: 0.2rem;
        margin: 2rem auto;
    }

    .vision_project_mask p {
        font-size: 1.2rem;
        line-height: 2.6rem;
    }

</p >
  < p > #chjy_project {
      padding-bottom: 1rem;
  }

    #chjy_project_main {
        width: 100%;
    }

    #chjy_project_main ul li {
        width: 80%;
        height: 18rem;
        margin-left: 10%;
        font-size: 1.1rem;
        margin-bottom: 0.6rem;
        overflow: hidden;
    }

    #chjy_project_main ul li:nth-of-type(1) {
        margin-left: 10%;
    }

    #chjy_project_main ul li h4 {
        height: 2.4rem;
        line-height: 2.4rem;
        font-size: 1.1rem;
    }

    .chjy_project_mask {
        width: 100%;
        height: 19rem;
        display: none;
    }

    .chjy_project_mask h5 {
        font-size: 1.1rem;
        margin-top: 2rem;
    }

    .chjy_project_mask span {
        width: 3rem;
        height: 0.2rem;
        margin: 1rem auto;
    }

    .chjy_project_mask p {
        font-size: 1.0rem;
        line-height: 1.6rem;
    }

</p >
  < p > #chjy_aid {
      padding-bottom: 1.4rem;
  }

    #chjy_aid_main {
        width: 100%;
    }

    #chjy_aid_main ul li {
        width: 90%;
        margin: 0 0 1rem 5%;
        float: none;
    }

    #chjy_aid_main ul li:nth-of-type(2n+1) {
        margin-left: 5%;
    }

    .chjy_aid_area {
        width: 100%;
    }

    .chjy_aid_area h4 {
        font-size: 1.1rem;
        padding-top: 1rem;
    }

    .chjy_aid_area p {
        font-size: 0.9rem;
        padding: 0 0 0.5rem 0;
        margin-top: -0.5rem;
    }

</p >
  < p > #chjy_path {
      width: 100%;
      padding-bottom: 0;
  }

    #chjy_path_main {
        width: 100%;
        background: none;
        padding-bottom: 0;
    }

    #chjy_path_main ul {
        width: 49%;
        margin: 0 auto;
        margin-left: 2%;
        margin-bottom: 1.2rem;
    }

    #chjy_path_main ul:nth-of-type(2n+1) {
        margin-left: 0;
    }

    #chjy_path_main ul li {
        width: 100%;
        height: 3.2rem;
        margin-bottom: 0.5rem;
        padding: 0.2rem 0;
    }

    #chjy_path_main ul li h4 {
        font-size: 1.0rem;
    }

    #chjy_path_main ul li p {
        font-size: 0.9rem;
        margin-top: -0.8rem;
    }

    #chjy_path_main ul li.chjy_path_style_02 h4 {
        font-size: 1.0rem;
        line-height: 2.8rem;
    }

</p >
  < p > #chjy_circle_yd {
      width: 100%;
  }

    .chjy_circle_box {
        width: 100%;
        padding-bottom: 1rem;
    }

    .chjy_circle_box h4 {
        font-size: 1.0rem;
        color: #2b2b2b;
        margin: 0.5rem 0 1rem 0.5rem;
    }

    .chjy_circle_box ol {
        margin-top: 2rem;
    }

    .chjy_circle_box ol li {
        width: 47%;
        margin-left: 2%;
    }

    .chjy_circle_box ol li:nth-of-type(1) {
        display: none;
    }

</p >
  < p > #vision_choice_main {
      width: 100%;
  }

    #vision_choice_main ul li {
        width: 49%;
        height: 7rem;
        margin: 0 0 0.8rem 2%;
        padding: 0.8rem 1%;
    }

    #vision_choice_main ul li:nth-of-type(3n+1) {
        margin-left: 2%;
    }

    #vision_choice_main ul li:nth-of-type(2n+1) {
        margin-left: 0;
    }

    #vision_choice_main ul li h4 {
        font-size: 1.1rem;
    }

    #vision_choice_main ul li span {
        margin: -0.5rem auto 0;
    }

    #vision_choice_main ul li p {
        font-size: 0.9rem;
        line-height: 1.2rem;
        padding: 0.5rem 0.4rem 0 0.4rem;
    }

</p >
  < p > #chjy_class {
      padding-bottom: 1.4rem;
  }

    #chjy_class_main {
        width: 100%;
    }

    #chjy_class_main ul li {
        width: 90%;
        padding: 0.3rem;
        margin: 0 0 1rem 5%;
    }

    #chjy_class_main ul li:nth-of-type(3n+1) {
        margin-left: 5%;
    }

    .chjy_class_box > img {
        width: 99%;
    }

    #chjy_class_main ul li h4 {
        font-size: 1.0rem;
        padding: 0.6rem 0 0rem;
    }

    .chjy_class_mask {
        position: absolute;
        left: 0.5rem;
        bottom: -0.8rem;
    }

</p >
  < p > #vision_honor_main {
      width: 100%;
      margin: 0 auto;
  }

    #vision_honor_left {
        width: 100%;
    }

    #vision_honor_left video {
        width: 100%;
    }

    #vision_honor_left h4 {
        width: 100%;
        height: 3rem;
        line-height: 3rem;
        font-size: 1.2rem;
    }

</p >
  < p > #vision_honor_right {
      width: 100%;
  }

    #vision_honor_right ul li {
        width: 100%;
        float: none;
        margin: 0;
    }

    #vision_honor_right ul li img {
        display: block;
    }

    #vision_honor_right ul li h4 {
        width: 100%;
        height: 2.8rem;
        line-height: 2.8rem;
        font-size: 1.0rem;
    }

</p >
  < p > #chjy_place {
      width: 100%;
  }

    #chjy_place ul li {
        float: none;
        margin-left: 0;
        margin-bottom: 1rem;
    }

    #chjy_place ul li img {
        width: 100%;
        display: block;
    }

    #chjy_place ul li:nth-of-type(5n+1) {
        margin-left: 0;
    }

    #chjy_place ul li.chsj_space_w1 {
        width: 100%;
    }

    #chjy_place ul li.chsj_space_w2 {
        display: none;
    }
}





.sec7{
    width:100%;
    position: relative;
}
.sec7 .img1{
    display: block;
    width:100%;
    height:837px;
}
.sec7 .dw{
    width:100%;
    margin-top:100px;
}
.sec7 .dw ul{
    width:1180px;
    margin: 48px auto 0 auto;
    overflow: hidden;
}
.sec7 .dw ul li{

width: 288px;
    margin-right: 9px;
    position: relative;
    border-radius: 7px;
    overflow: hidden;
    cursor: pointer;
    float: left;
}
.sec7 .dw ul li:nth-child(4){
    margin-right:0;
}
.sec7 .dw ul li:nth-child(3){

}
.sec7 .dw ul li img{
    display: block;
    width:100%;
}
.sec7 .dw ul li .dw1{
    width:100%;
    height:48px;
    position: absolute;
    bottom: 0;
    left:0;
    text-align: center;
    font-size: 18px;
    color: #fff;
    background-color:rgba(0,0,0,0.4);
    line-height:48px;
}
.sec7 .dw ul li .top{
    border-radius: 7px;
    overflow: hidden;
    position: relative;
}
.sec7 .dw .bin{
    display: block;
    width: 240px;
    height: 56px;
    border-radius: 7px;
    font-size: 18px;
    color: #fff;
    line-height: 56px;
    text-align: center;
    background:#317bf6;
    margin: 48px auto 0 auto;
    transition: all 0.3s;
}
.sec7 .dw .bin:hover {
    transform: scale(1.1);
}
figure.bianda{
    overflow: hidden;
}
figure.bianda img{
    -webkit-transition: all .1s;
    transition: all .8s;
}
figure.bianda:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);			/*设置图片变大的尺寸*/
    opacity: 0.8;
}

.sec_txt h1 {
    text-align: center;
    font-size: 40px;}

.sec_txt p {
    text-align: center;
    font-size: 18px;
    color: #999999;
    margin-top: 12px;
}

/*.sec7 .dw ul li:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0.8;
}*/

.sec7 .dw ul li img{
    transition: all .8s;
}



.sec8{
    width:100%;
    background: #f6f6f6;
    padding: 80px 0;
}
.sec8 .conter{
    width:1180px;
    margin: 48px auto 0 auto;
    height:304px;
    position: relative;
}
.sec8 .conter .img1{
    display: block;
    width:240px;
    position: absolute;
    top:0;
    left:0;
    z-index: 1;
    box-shadow: 2px 4px 16px 0 rgba(84, 65, 250, 0.4);
}
.sec8 .conter .dw{
    width:1080px;
    height:280px;
    position: absolute;
    bottom:0;
    right:0;
    box-shadow: 2px 4px 16px 0 rgba(153, 153, 153, 0.2);
    background: #fff;
    border-radius: 7px;
    z-index: 2;
}
.sec8 .conter .dw ul{
    width:1036px;
    margin: 24px;
    overflow: hidden;
}
.sec8 .conter .dw ul li{
    float: left;
    width:332px;
    margin-right: 20px;
    cursor: pointer;
}
.sec8 .bin{
    display: block;
    width: 240px;
    height: 56px;
    border-radius: 7px;
    font-size: 18px;
    color: #fff;
    line-height: 56px;
    text-align: center;
    background: linear-gradient(to right,#5744ff,#6551ff,#7560ff);
    margin: 48px auto 0 auto;
    box-shadow: 2px 4px 16px 0 rgba(117, 96, 255, 0.7);
    transition: all 0.3s;
}
.sec8 .bin:hover {
    transform: scale(1.1);
}

.sec8 .dw img{
    width: 100%;
    border-radius: 10px;
}