

.flex { display: flex; justify-content: space-between; }
.m800 { width: 800px; margin-bottom: 90px; }
.m350 { width: 350px; }

.main { display: none;}


.h2 { height: 25px; margin: 48px 0 14px; background: url(/e_images/index/2022/educationServices/educationServices-title.png) no-repeat center; }


.topSearch { display: flex; justify-content: space-between; width: 760px; height: 40px; margin: 0 auto; border: 1px solid #004eb3; }
.topSearch input { width: 100%; border: 0; padding: 0 10px; }
.topSearch .iconfont { margin: 6px 6px 0 0; font-size: 22px; color: #004eb3; }
/* .topSearch .btn { width: 38px; height: 38px; background: #004eb3 url(/e_images/index/2022/educationServices/searchBtn.png) no-repeat center; } */


.hotServices { margin: 58px 0 20px; background-color: #f6f6f6; }
.hotServices-wrap { display: flex; justify-content: space-between; height: 138px; }
.hotServices-title { width: 84px; height: 110px; margin-top: 14px; text-align: center; line-height: 110px; background-color: #004eb3; color: #fff; }
.hotServices .carousel-wrap { position: relative; width: 1160px; }
.hotServices .carousel { overflow: hidden; width: 846px; height: 100%; margin: 0 auto; }
.hotServices .carousel a { display: flex; flex-direction: column; justify-content: center; width: 90px; height: 100%; text-align: center; }
.hotServices .carousel .text { margin-top: 10px; font-size: 14px; color: #999; }
.swiper-button-next,
.swiper-button-prev { transform: scale(.7); color: #333 !important; }
.swiper-button-next { right: 50px !important;  }
.swiper-button-prev { left: 50px !important; }

.programa { margin-top: 45px; }
.programa-title { position: relative; display: flex; justify-content: space-between; align-items: flex-end; padding-left: 36px; padding-bottom: 10px; border-bottom: 1px solid #d5d5d5; font-size: 22px; }

.programa-title::before { content: ''; position: absolute; top: 2px; left: 14px; width: 8px; height: 22px; background-color: #004eb3; }
/* 右侧箭头 */
.programa-title-more { padding-left: 24px; padding-right: 14px; margin-bottom: -6px; font-size: 16px; color: #666; }
.programa-title-more img { margin-right: 6px; vertical-align: middle; }
.programa-wrap { display: flex; justify-content: space-between; margin-top: 24px; }
/* .programa-wrap */
.programa-wrap img { margin-bottom: 10px; }
.programa-wrap-title { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 130px;  }
.programa-list { display: flex; flex-wrap: wrap; align-content: space-evenly; width: 670px; height: 116px; padding: 0 45px; background-color: #f6f6f6; }
.programa-list-item { margin-right: 22PX; color: #555; }


.tools { margin-top: 45px; }
.tools-title { position: relative; display: flex; justify-content: space-between; align-items: flex-end; padding-left: 36px; padding-bottom: 10px; border-bottom: 1px solid #d5d5d5; font-size: 22px; }
.tools-title::before { content: ''; position: absolute; top: 2px; left: 14px; width: 8px; height: 22px; background-color: #004eb3; }
.tools-list { display: flex; flex-wrap: wrap; justify-content: space-between; }
.tools-list-item { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 164px; height: 116px; margin-top: 24px; font-size: 14px; }
.tools-list-item:nth-child(1) { background-color: #d8f4fc; }
.tools-list-item:nth-child(2) { background-color: #dee7fd; }
.tools-list-item:nth-child(3) { background-color: #fff9e6; }
.tools-list-item:nth-child(4) { background-color: #ffefef; }
.tools-list-item:nth-child(5) { background-color: #f2f2f2; }
.tools-list-item:nth-child(6) { background-color: #eef8f0; }
.tools-list-item span { margin-top: 10px; }

.ad { display: block; width: 350px; height: 180px; margin: 24px 0 36px; }


.areaServices-title { position: relative; display: flex; justify-content: space-between; align-items: flex-end; padding-left: 36px; padding-bottom: 10px; border-bottom: 1px solid #d5d5d5; font-size: 22px; }
.areaServices-title::before { content: ''; position: absolute; top: 2px; left: 14px; width: 8px; height: 22px; background-color: #004eb3; }
.areaServices table { margin-top: 24px; border: 1px solid #dee7fd; }
.areaServices table a { display: block; height: 42px; text-align: center; line-height: 42px; font-size: 14px; }
.areaServices td:not(:last-child) { border-right: 1px solid #dee7fd;  }
.areaServices tr:not(:last-child) td { border-bottom: 1px solid #dee7fd; }
.areaServices tr:nth-child(2n) { background-color: #f6f6f6 }





.eol-service-pc {
    display: none;
}
.eol-service-m {
    display: block;
}

.border_top {
    border-top: 10px solid #ededed;
}

.m_service_column-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 80px;
    height: 80px;
    border-radius: 6px;
    font-size: 14px;
    background-color: #f9f9f9;
    margin: 0 19px 10px;

    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.m_service_column-title.on {
    -moz-box-shadow: 4px 4px 10px 1px #999;
    -ms-box-shadow: 4px 4px 10px 1px #999;
    -webkit-box-shadow: 4px 4px 10px 1px #999;
    box-shadow: 4px 4px 10px 1px #999;
}

.m_service_column-title.on img {
    -webkit-transform: translateY(-4px) scale(1.1);
    transform: translateY(-4px) scale(1.1);
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}

.m_service_column-title img {
    width: 20px;
    margin-bottom: 10px;

    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    filter: grayscale(100%);
}

.service_column:nth-child(2n-1) {
    border-right: none;
}
.service_column {
    width: 100%;
    height: auto;
    padding: 20px;
    /* margin: 10px 0; */
    background-color: #f9f9f9;
    /* border-radius: 6px; */
}
.service_column:not(:last-child) { padding-top: 20px;}
.service_column:first-child { padding-top: 20px; border-top-left-radius: 6px; border-top-right-radius: 6px; }
.service_column:last-child { border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; }

.service_column-title {
    padding-left: 10px;
    line-height: 1;
    border-left: 4px solid #004eb3;
    font-size: 16px;
    margin-bottom: 20px;
    color: #004eb3;
}
.service_column-text {
    margin-left: 10px;
    font-size: 14px;
    color: #8e8e8e;
}

.service_column-text:not(:last-child) {
    margin-bottom: 10px;
}
.service_column-wrap { display: flex; flex-wrap: wrap; }
/*  */
.m_service_tools {
    padding: 10px 0 20px;
}
.m_service_tools-title {
    padding-left: 10px;
    line-height: 1;
    border-left: 4px solid #004eb3;
    font-size: 16px;
    color: #004eb3;
}

.m_service_tools-tab {
    display: flex;
    justify-content: space-evenly;
    border-bottom: 1px solid #ededed;
    font-size: 16px;
    color: #343434;
}

.m_service_tools-tab_btn {
    padding-bottom: 10px;
}
.m_service_tools-tab_btn.on {
    border-bottom: 2px solid #004eb3;
}

.service_tools-text {
    width: 25%;
    transition: all 0.3s;
    margin-top: 30px;
    margin-bottom: 0;
    text-align: center;
    font-size: 16px;
}

/*  */
.service_board {
    padding: 0 10px;
    /* max-width: 1583px; */
    margin: 20px auto;
}



.eol-m_wrapper {
    padding-left: 20px;
    padding-right: 20px;
}

.m-main .flex {
    display: flex;
    flex-wrap: wrap;
} 

.service_board img {
    width: 100%;
    border-radius: 6px;
}

@media (min-width: 769px) {
    .main { display: block;}
    .m-main {display: none;}
}
.mhotServices-wrap { padding: 30px 10px 0; margin-bottom: 20px; }
.mhotServices-title { display: inline-block; padding: 4px 20px; border-radius: 4px; background-color: #004eb3; color: #fff; }
.mhotServices-content { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); margin-top: 10px; background-color: #f9f9f9; color: #ccc; }
.mhotServices-content::before { content: ''; position: absolute; bottom: -16px; width: 100%; height: 4px; background-color: #999; }
.mhotServices-item a { display: flex; flex-direction: column; align-items: center; padding: 20px 0; }
.mhotServices-item img { width: 90px; margin-bottom: 10px; }

.m_service_column-title_text {  padding: 0 6px; text-align: center; }










