.container{
    width: 100%;
    font-family: "微软雅黑";
}

/* -----------------decision------------------------ */
.decision{
    width: 100%;
    overflow: hidden;
}

.decision-title{
    width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
    margin-top: 60px;
    margin-bottom: 30px;
}
.decision-title h4 {
    font-size: 36px;
    color: #2b2b2b;
}
.decision-title p {
    font-size: 16px;
    color: #666666;
    margin-top: 16px;
    line-height: 24px;
}

.decision-matter{
    width: 1200px;
    margin: 0 auto;
    overflow: hidden;
}

.decision-matter ul li{
    float: left;
    width: 48%;
    height: 316px;
    background-color: #f9f9f9;
    text-align: center;
}
.decision-matter ul li:nth-child(2){
    margin-left: 4%;
}

.decision-matter ul li img{
    margin-top: 70px;
    transition: all 1s ease;
}
.decision-matter ul li img:hover{
    transform: scale(1.1);
}
.decision-matter ul li h4{
    font-size: 24px;
    color: #999999;
    margin-top: 20px;
}
.decision-matter ul li h4:hover{
    color: #1c82fe;
}
.decision-matter ul li h3{
    margin-top: 20px;
}
.decision-alink{
    font-size: 16px;
    color: #999999;
}
.decision-alink:hover{
    font-size: 16px;
    color: #1c82fe;
}
.decision-matter ul li i{
    display: inline-block;
    width: 1px;
    height: 16px;
    background-color: #999999;
    margin: 0 14px;
    vertical-align: middle;
}

/* -------------------------apply------------------------ */
.apply{
    width: 100%;
    overflow: hidden;
}

.apply-title{
    width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
    margin-top: 60px;
    margin-bottom: 30px;
}
.apply-title h4 {
    font-size: 36px;
    color: #2b2b2b;
}
.apply-title p {
    font-size: 16px;
    color: #666666;
    margin-top: 16px;
    line-height: 24px;
}

.apply-matter{
    width: 100%;
    overflow: hidden;
}
.apply-matter ul li{
    float: left;
    width: 25%;
    height: 500px;
    overflow: hidden;
    position: relative;
}
.apply-bg{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 1s ease;
}
.apply-matter ul li:hover .apply-bg{
    transform: scale(1.1);
}

.apply-shade{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    
    z-index: 9;
    text-align: center;
}
.apply-shade img{
    margin-top: 200px;
    transition: all 1s ease;
}

.apply-shade h2{
    width: 16px;
    height: 1px;
    margin: 0 auto;
    margin-top: 20px;
    background-color: #fff;
}
.apply-shade h4{
    font-size: 24px;
    color: #ffffff;
    margin-top: 20px;
}
.apply-shade p{
    font-size: 14px;
    color: #fff;
    width: 80%;
    margin-left: 10%;
    margin-top: 12px;
    line-height: 24px;
}
.apply-shade h5{
    width: 120px;
    height: 40px;
    border: 1px solid #fff;
    color: #fff;
    font-size: 14px;
    line-height: 40px;
    text-align: center;
    margin: 0 auto;
    margin-top: 36px;
}
.apply-shade h5:hover{
    background-color: #063681;
}

.apply-words{
    opacity: 0;
    transition: all 1.5s ease-in-out;
}
.apply-matter ul li:hover .apply-shade{
    background-color: rgba(0, 52, 129, .6);
}
.apply-matter ul li:hover .apply-words{
    opacity: 1;
}
.apply-matter ul li:hover .apply-words-box{
   animation: 1s applyDh ease-in-out both;
}
@keyframes applyDh{
    0%{
        transform: translateY(0);
    }
    100%{
        transform: translateY(-100px);
    }
}

/* --------------------------manage------------------------- */
.manage{
    width: 100%;
    overflow: hidden;
    padding-bottom: 90px;
}

.manage-title{
    width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
    margin-top: 60px;
    margin-bottom: 30px;
}
.manage-title h4 {
    font-size: 36px;
    color: #2b2b2b;
}
.manage-title p {
    font-size: 16px;
    color: #666666;
    margin-top: 16px;
    line-height: 24px;
}

.manage-matter{
    width: 1200px;
    margin: 0 auto;
}
.manage-matter>ul{
    margin-left: -1%;
}
.manage-matter>ul>li{
    width: 24%;
    height: 320px;
    float: left;
    -moz-box-shadow: 0 4px 10px 8px #fbfbfb;
    -webkit-box-shadow: 0 4px 10px 8px #fbfbfb;
    box-shadow: 0 4px 10px 8px #fbfbfb;
    margin-left: 1%;
    margin-top: 1%;
    overflow: hidden;
    position: relative;
}

.manage-pic{
    width: 100%;
    text-align: center;
}
.manage-pic-bg{
    width: 111px;
    height: 128px;
    margin-top: 60px;
}
.manage-pic h4{
    font-size: 20px;
    color: #404040;
    margin-top: 20px;
    margin-bottom: 12px;
}

.manage-shade{
    width: 100%;
    height: 100%;
    background-color: #1c82fe;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9;
    text-align: center;
    opacity: 0;
}
.manage-shade h4{
    font-size: 20px;
    color: #ffffff;
    margin-top: 60px;
}
.manage-shade img{
    margin-top: 10px;
}
.manage-shade ul{
    margin-left: 42%;
}
.manage-shade ul li{
    list-style: disc;
    font-size: 16px;
    color: #ffffff;
    margin-top: 10px;
    text-align: left;
}

.manage-matter>ul>li:hover .manage-shade{
    animation: .5s manageDh ease-in-out both;
}
@keyframes manageDh{
    0%{
        opacity: 0;
        height: 0;
    }
    100%{
        opacity: 1;
        height: 100%;
    }
}

/* -----------------------------advan------------------------ */

.advan{
    width: 100%;
    height: 596px;
   background-image: url('../images/ypt/advan_bg.jpg');
}

.advan-title{
    width: 100%;
    overflow: hidden;
    text-align: center;
    margin-bottom: 30px;
}
.advan-title h4 {
    font-size: 36px;
    color: #fff;
    margin-top: 60px;
}
.advan-title p {
    font-size: 16px;
    color: #fff;
    margin-top: 16px;
    line-height: 24px;
}

.advan-matter{
    width: 1200px;
    margin: 0 auto;
    overflow: hidden;
}
.advan-matter ul {
    margin-left: -1%;
    margin-top: 30px;
}
.advan-matter ul li{
    float: left;
    width: 19%;
    height: 340px;
    margin-left: 1%;
    overflow: hidden;
    position: relative;
}

.advan-img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 1s ease;
}
.advan-matter ul li:hover .advan-img{
   transform: scale(1.1);
}
.advan-matter ul li h4{
    width: 100%;
    position: absolute;
    top: 44%;
    left: 0;
    color: #ffffff;
    z-index: 9;
    font-size: 18px;
    text-align: center;

}

/* ------------------------------------------------------------ */


/* -------------------------PC端--------------------------- */

@media all and (max-width:1200px) {
    .decision-title {
        width: 90%;
        margin-left: 5%;
    }
    .decision-matter {
        width: 90%;
        margin-left: 5%;
    }
    .apply-title {
        width: 90%;
        margin-left: 5%;
    }
    .manage-title {
        width: 90%;
        margin-left: 5%;
    }
    .manage-matter {
        width: 90%;
        margin-left: 5%;
    }
    .manage-shade ul {
        margin-left: 38%;
    }
    .advan-matter {
        width: 90%;
        margin-left: 5%;
    }
}


/* ------------------------手机端-------------------------- */

@media all and (max-width:900px) {
    .decision-title h4 {
        font-size: 22px;
    }
    .decision-title {
        margin-top: 30px;
        margin-bottom: 20px;
    }
    .decision-title p {
        font-size: 14px;
        margin-top: 10px;
        line-height: 22px;
    }
    .decision-matter ul li {
        width: 100%;
        height: 280px;
        margin-top: 16px;
    }
    .decision-matter ul li:nth-child(2) {
        margin-left: 0%;
    }
    .decision-matter ul li h4 {
        font-size: 18px;
        margin-top: 16px;
    }
    .decision-alink {
        font-size: 12px;
    }
    .apply-title h4 {
        font-size: 22px;
    }  
    .apply-title {
        margin-top: 30px;
        margin-bottom: 20px;
    }
    .apply-title p {
        font-size: 14px;
        margin-top: 10px;
        line-height: 22px;
    }
    .apply-matter ul li {
        width: 50%;
        height: 280px;
    }
    .apply-shade img {
        margin-top: 20px;
    }
    .apply-shade h4 {
        font-size: 16px;
        margin-top: 10px;
    }
    .apply-words {
        opacity: 1;
    }
    .apply-shade p {
        display: none;
    }
    @keyframes applyDh{
        0%{
            transform: translateY(0);
        }
        100%{
            transform: translateY(-0);
        }
    }
    .manage-title h4 {
        font-size: 22px;
    }
    .manage-title {
        margin-top: 30px;
        margin-bottom: 20px;
    }
    .manage-title p {
        font-size: 14px;
        margin-top: 10px;
        line-height: 22px;
    }
    .manage-matter>ul>li {
        width: 49%;
        height: 280px;
    }
    .manage-pic-bg {
        margin-top: 34px;
    }
    .manage-pic h4 {
        font-size: 18px;
    }
    .manage-shade h4 {
        font-size: 16px;
    }
    .manage-shade ul li {
        font-size: 14px;
        margin-top: 8px;
    }
    .manage-shade ul {
        margin-left: 32%;
    }
    .manage {
        padding-bottom: 20px;
    }
    .advan-title h4 {
        font-size: 22px;
        margin-top: 20px;
    }
    .advan-title p {
        font-size: 14px;
        margin-top: 10px;
        line-height: 22px;
    }
    .advan-matter ul {
        margin-top: 0px;
    }
    .advan-matter ul li {
        width: 49%;
        height: 150px;
        margin-left: 1%;
        margin-top: 2%;
    }
    .advan-matter ul li h4 {
        top: 44%;
        z-index: 9;
        font-size: 14px;
    }   
    .advan-matter {
        width: 98%;
        margin-left: 1%;
    }
    .advan-title {
        margin-bottom: 10px;
    }
}




