<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <meta name="keywords" content="研学基地,1+X研学,研学实训室,研学培训,研学课程开发,研学指导师,研学职业技能">
    <meta name="baidu-site-verification" content="code-0HHa23DyLZ"/>
    <!--<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"/>-->
    <title>亲子猫</title>
    <link rel="icon" type="image/x-icon" href="/img/favicon.ico">
    <link href="/css/base.css" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" href="/css/swiper-bundle.css">
    <link rel="stylesheet" href="/css/font.css">
    <style type="text/css"> 
        * {
            box-sizing: border-box;
        }
        html,
        body {
            min-width: 1280px;
        }
        .video1 {
            object-fit: cover;
            display: block;
            border-radius: 30px;
            border: 8px solid rgba(125, 240, 234, 0.5);
        }
        .video2{
            margin-left: 45px;
            width: 638px; 
            height: 366px; 
            overflow: hidden;
            border: 8px solid rgba(125, 240, 234, 0.5);
            border-radius: 30px;
        }
        .video2>video{
            object-fit: cover;
            display: block;
            width: 140%;
            margin-left: -23%;
            margin-top: -100px;
        }

        .logo {
            display: flex;
            flex-direction: row;
            align-items: center;
        }
        .header-box>div{
            width: 100%;
            background: rgba(0, 47, 73, 0.34);
            border-bottom: none;
        }
        .special>div{
            background-color:#fff !important; 
            border-bottom:1px solid #E4EAE9 !important;
        }
        .nav {
            /* min-width: 1280px; */
            width: 1200px;
            position: relative;
            margin: auto;
            font-size: 16px;
            height: 66px;
            line-height: 66px;
            color: white;
            /* width: 100%; */
            /* padding-left: 6.9vw;
            padding-right: 6.9vw; */
            box-sizing: border-box;
        }

        .nav .on {
            color: #00DAD0;
            font-weight: bold;
        }

        .nav > ul {
            font-size: 0;
            width: 587px;
            display: flex;
            justify-content: space-around;
            /* margin-right: 136px; */
        }

        .nav > ul > li {
            font-size: 16px;
            display: inline-block;
            vertical-align: top;
            text-align: center;
            white-space: nowrap;
        }
        
        .nav > ul > li:last-child {
            margin-right: 0 !important;
        }

        .header-box .nav > ul > li:hover > a {
            color: #00DAD0 !important;
            font-weight: 600;
        }
        .special .nav > ul > li:hover > a {
            color: #12AA9C !important;
            font-weight: 600;
        }

        .medium-btn {
            background-color: #DEEEEB;
            border: 1px solid rgba(0, 47, 73, 0.34);
            color: #12AA9C;
            /* padding: 6px 32px; */
            width: 120px;
            height: 42px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            border-radius: 6px;
            font-weight: 500;
            cursor: pointer;
        }

        .medium-btn a {
            background-color: #DEEEEB;
            color: #12AA9C;
            font-weight: 600;
            font-size: 16px;
        }

        .small-btn {
            background-color: white; /* Green */
            /* border: 1px solid rgba(0, 47, 73, 0.34); */
            color: #12AA9C;
            padding: 6px 10px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 14px;
            border-radius: 6px;
            font-weight: 600;
            border: 1px solid #12AA9C;
            background-color: transparent;
            box-sizing: border-box;
        }

        .small-btn a {
            color: #12AA9C;
        }

        .small-btn.active {
            background-color: #12AA9C;
            border: none;
        }

        .small-btn.active a {
            color: white !important;
            /*background-color: #12AA9C;*/
        }

        .swiper-pagination-customs {
            width: 40px;
            height: 3px;
            background: rgba(255, 255, 255, 0.35);
            border-radius: 3px;
            display: inline-block;
            margin: 0 5px;
            outline: 0;
        }

        .swiper-pagination-customs.swiper-pagination-customs-active {
            background-color: white;
        }

        .item-box .item {
            width: 400px;
            height: 232px;
            background-color: #F5FBFA;
            border-bottom: 1px solid #E9F1F1;
            border-right: 1px solid #E9F1F1;
            box-sizing: border-box;
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: stretch;
            padding-top: 36px;
        }

        .item-content {
            background-color: #F5FBFA;
        }

        .item-box {
            width: 1200px;
            margin: 0 auto;
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
        }

        .item-box .item:nth-of-type(3n) {
            border-right: none;
        }

        .item .title {
            font-size: 22px;
            color: #1C2927;
            font-weight: 600;
        }

        .item-box .item:nth-of-type(4),
        .item-box .item:nth-of-type(5),
        .item-box .item:nth-of-type(6) {
            border-bottom: none;
        }

        .bg {
            /* background-image: url("http://file.yanxuex.com/yanxue/new/home/img/bg_banner.jpg"); */
            background-image: url("/img/bg_bannerNew.png");
            padding-top: 66px;
            background-size: 100% 100%;
            background-repeat: no-repeat;
            position: absolute;
            width: 100%;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center
        }

        .news-box {
            width: 1200px;
            margin: auto;
            padding-top: 86px;
        }

        .news-box .title {
            color: #1C2927;
            font-weight: 600;
            text-align: center;
            height: 56px;
            line-height: 56px;
            font-size: 40px;
            padding-bottom: 48px;
        }

        .news-tab ul {
            display: flex;
            flex-direction: row;
            justify-content: center;
            border-bottom: 1px solid #E4EAE9;
        }

        .news-tab ul > li {
            width: 300px;
            height: 70px;
            line-height: 70px;
            color: #1C2927;
            font-size: 24px;
            text-align: center;
            box-sizing: border-box;
            font-weight: 600;
            cursor: pointer;
        }

        .news-tab ul .active {
            background-color: #E6F6F4;
            border-radius: 8px 8px 0px 0px;
            color: #12AA9C;
        }

        .news-tab-box img {
            width: 792px;
            height: 446px;
            background: #D8D8D8;
            border-radius: 16px;
            object-fit: cover;
        }

        .news-item {
            border-radius: 8px;
            position: relative;
            background: linear-gradient(90deg, #EDF3F3 0%, rgba(247, 250, 250, 0) 100%);
        }

        .news-item.active {
            background: #F5FBFA url("/img/bg_event.png") no-repeat center center/100%;
        }

        .news-item.active:before {
            content: "";
            width: 0;
            height: 0;
            position: absolute;
            left: -10px;
            top: calc(50% - 5px);
            border-top: solid 10px transparent;
            border-right: solid 10px #dcf4f1;
            border-bottom: solid 10px transparent;
        }

        .news-list {
            height: 446px;
            width: 384px;
            overflow-y: auto;
            box-sizing: border-box;
            padding-left: 10px;
        }

        .news-list .mask {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 48px;
            width: 100%;
            background: linear-gradient(360deg, #FFFFFF 0%, rgba(255, 255, 255, 0.92) 17%, rgba(255, 255, 255, 0) 100%);
        }

        .news-list::-webkit-scrollbar {
            width: 10px;
            background-color: #fff;
        }

        .news-list:hover ::-webkit-scrollbar-track-piece {
            /*鼠标移动上去再显示滚动条*/
            background-color: #fff;
            /* 滚动条的背景颜色 */
            border-radius: 6px;
            /* 滚动条的圆角宽度 */
        }

        .news-list:hover::-webkit-scrollbar-thumb:hover {
            background-color: #c0cecc;
        }

        .news-list:hover::-webkit-scrollbar-thumb:vertical {
            background-color: #c0cedc;
            border-radius: 6px;
            outline: 2px solid #fff;
            outline-offset: -2px;
            border: 2px solid #fff;
        }

        .news-list .news-item:not(:first-child) {
            margin-top: 12px;
        }

        .news-item-box {
            padding: 16px 24px;
            box-sizing: border-box;
            border-radius: 8px;
            /*background: linear-gradient(90deg, #DCF4F1 0%, rgba(220, 244, 241, 0) 100%);*/
        }

        .news-title {
            font-size: 16px;
            line-height: 22px;
            max-height: 44px;
            font-weight: 400;
            word-break: break-all;
            text-overflow: ellipsis;
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        .news-title.active {
            font-weight: 600;
        }

        .news-info {
            color: #666666;
            font-size: 14px;
            font-weight: 400;
            line-height: 20px;
            max-height: 40px;
            margin-top: 6px;
            word-break: break-all;
            text-overflow: ellipsis;
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        .news-date {
            margin-top: 10px;
            display: flex;
            flex-direction: row;
            align-items: center;
        }

        .news-date span {
            font-size: 12px;
            font-weight: 400;
            color: #8D9796;
        }

        .more {
            font-size: 18px;
            height: 32px;
            line-height: 32px;
            color: #12AA9C;
            display: inline-block;
            box-sizing: border-box;
            font-weight: 500;
            text-align: left;
        }

        /* .more.hover {
            border-bottom: 1px solid #12AA9C;
        } */

        .more a {
            color: #12AA9C;
            font-weight: 500;
        }
        .more .rightHover{
            width: 18px;
            margin-top: 7px;
            margin-left: 5px;
            display: inline-block;
            vertical-align: top;
        }
        .icon-date {
            background: transparent url("/img/icon_date.png") no-repeat center center/100%;
            display: inline-block;
            vertical-align: middle;
            width: 18px;
            height: 18px;
            margin: 0 4px;
        }

        .case-content {
            width: 100%;
            /*min-width: 1200px;*/
            background: #F5FBFA url("/img/bg_case.png") no-repeat center top/100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding-top: 86px;
            box-sizing: border-box;
        }

        .case-title {
            height: 56px;
            font-size: 40px;
            font-weight: 600;
            color: #1C2927;
            line-height: 56px;
        }

        .case-logo-list-box {
            display: flex;
            flex-direction: row;
            justify-content: space-around;
            margin-top: 48px;
        }

        .case-logo-list-box img {
            width: 180px;
            height: 78px;
        }

        .case-logo-list-box img:not(:first-child) {
            margin-left: 24px;
        }

        .expert-content {
            width: 100%;
            height: 1216px;
            padding-top: 86px;
            box-sizing: border-box;
        }

        .expert-title {
            height: 56px;
            font-size: 40px;
            font-weight: 600;
            color: #1C2927;
            line-height: 56px;
        }

        .expert-list {
            /* padding: 0 120px;*/
            box-sizing: border-box;
            display: flex; /*弹性盒子*/
            justify-content: space-between; /*两端对齐，子元素之间有间隙*/
            flex-flow: row wrap; /*子元素溢出父容器时换行*/
        }

        .expert-list:after {
            content: "";
            width: 282px;
        }


        .expert-item {
            width: 282px;
            height: 420px;
            background-color: white;
            margin: 40px 0;
            display: flex;
            flex-direction: column;
            cursor: pointer;
        }

        .expert-info div:nth-child(1) {
            font-size: 24px;
            font-weight: 600;
            height: 34px;
            line-height: 34px;
            color: #1C2927;
            margin-top: 20px;
        }

        .expert-info div:nth-child(2) {
            font-size: 14px;
            font-weight: 400;
            line-height: 20px;
            color: #595E5E;
            margin-top: 12px;
            width: 224px;
            text-align: center;
        }

        .expert-info div:nth-child(3) {
            margin-top: 4px;
            font-size: 14px;
            font-weight: 400;
            line-height: 20px;
            color: #595E5E;
            text-align: center;
        }

        .expert-info div:nth-child(4) {
            margin-top: 4px;
            font-size: 14px;
            font-weight: 400;
            line-height: 20px;
            color: #595E5E;
            text-align: center;
        }

        .expert-info {
            background-color: white;
            padding: 0 24px 20px;
            border-radius: 0 0 8px 8px;
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 282px;
            height: 149px;
        }

        .expert-info.active {
            background: #12AA9C;
        }

        .expert-info.active div {
            color: white !important;
        }

        .expert-box {
            width: 1200px;
            display: flex;
            flex-direction: column;
            align-items: center;
            margin: auto;
        }

        .case-swiper {
            width: 100%;
            height: 338px;
            margin-top: 48px;
            padding: 20px 0;
        }

        .swiper-button-prev:after {
            display: none;
        }

        .swiper-button-next:after {
            display: none;
        }

        .swiper-button-prev {
            width: 48px;
            height: 48px;
            background: url('/img/icon_arrow_left_default.png');
        }

        .swiper-button-next {
            width: 48px;
            height: 48px;
            background: url('/img/icon_arrow_right_default.png');
        }

        /*自定义样式*/
        .case-swiper .swiper-button-prev {
            left: 50px;
        }

        .case-swiper .swiper-button-next {
            right: 50px;
        }


        .header-swiper {
            width: 100%;
            height: 100%;

        }

        .case-swiper .swiper-slide {
            background: #FFFFFF;
            box-shadow: 0 10px 20px 0 rgba(226, 233, 233, 0.62);
            border-radius: 8px;
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            transition: all 0.3s ease;
        }

        .mask-left {
            position: absolute;
            top: 20px;
            left: 0;
            bottom: 20px;
            width: calc(25% - 18px);
            z-index: 5;
            background: linear-gradient(270deg, rgba(247, 250, 250, 0) 0%, #F7FAFA 100%);
        }

        .mask-right {
            position: absolute;
            top: 20px;
            right: 0;
            bottom: 20px;
            width: calc(25% - 18px);
            z-index: 5;
            background: linear-gradient(90deg, rgba(247, 250, 250, 0) 0%, #F7FAFA 100%);
        }

        .case-item {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100%;
            box-sizing: border-box;
        }

        .case-swiper .swiper-slide:hover {
            -ms-transform: translateY(-18px);
            -webkit-transform: translateY(-18px);
            -moz-transform: translateY(-18px);
            -o-transform: translateY(-18px);
            transform: translateY(-18px);
            z-index: 20;
            position: relative;
            left: 0;
        }

        .carousel_chart{
            position:relative;
            width: 100%;
            padding-top: 42.92%;
            overflow: hidden;
        }

        .content-center{
            margin-top: -40px;
        }
        .content-center>div:first-child{
            font-size: 40px;
            width: 510px;
            color: white;
            text-shadow: 0px 2px 4px rgba(27, 124, 115, 0.78)
        }
        .content-center>div:last-child{
            margin-top: 80px
        }
        .content-centerTime{
            margin-top:12px;
            font-size: 24px;
            width: 456px;
            color: white;
            text-shadow: 0px 2px 4px rgba(27, 124, 115, 0.78)
        }
        .ry-swiper {
            width: 100%;
            height: 100%;
            padding: 0 60px;
        }

        .ry-box {
            width: 1200px;
            height: 22vw;
            min-height: 264px;
            background-color: white;
            box-shadow: 0px 10px 20px 0px rgba(124, 158, 155, 0.44);
            border-radius: 16px;
        }

        .ry-item-box {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            width: 100%;
            border-right: 1px solid #E4E4E4;
        }

        .ry-info {
            margin-top: 14px;
            font-size: 14px;
            font-weight: 400;
            color: #595E5E;
            line-height: 20px;
            text-align: center
        }

        .ry-mask-left {
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            width: 60px;
            z-index: 5;
            background-color: white;
            border-bottom-left-radius: 16px;
            border-top-left-radius: 16px;
        }

        .ry-mask-right {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            width: 61px;
            z-index: 5;
            background-color: white;
            border-bottom-right-radius: 16px;
            border-top-right-radius: 16px;
        }

        .nav a {
            color: white;
        }

        .news-tab-item {
            flex-direction: row;
            width: 1200px;
            box-sizing: border-box;
            margin-top: 24px;
            display: none;
        }

        .news-tab-item.selected {
            display: flex;
        }

        .nav_menu {
            background-color: white;
            text-align: center;
            width: 136px;
            box-shadow: 0px 4px 20px 0px rgba(32, 40, 52, 0.12);
            border-bottom-right-radius: 8px;
            border-bottom-left-radius: 8px;
            padding-bottom: 36px;
            padding-top: 11px;
        }

        .nav_menu > li {
            height: 44px;
        }

        .nav_menu > li > a {
            line-height: 22px;
            height: 22px;
            font-weight: 400;
            font-size: 16px;
            color: #1C2927;
            display: inline-block;
            vertical-align: middle;
        }

        .nav_menu > li:hover > a {
            color: #12AA9C;
        }

        .header .header-box {
            position: fixed;
            left: 0;
            top: 0;
            right: 0;
            z-index: 10;
        }

        .icon-menu1 {
            background: transparent url("/img/icon_menu1.png") center/100% no-repeat;
            width: 20px;
            height: 20px;
            vertical-align: middle;
            display: inline-block;
            margin-right: 6px;

        }

        .icon-menu2 {
            background: transparent url("/img/icon_society.png") center/100% no-repeat;
            width: 30px;
            height: 30px;
            vertical-align: middle;
            display: inline-block;
            margin-right: 6px;

        }

        .icon-menu3 {
            background: transparent url("/img/icon_career.png") center/100% no-repeat;
            width: 30px;
            height: 30px;
            vertical-align: middle;
            display: inline-block;
            margin-right: 6px;

        }
        .icon-menu2+span,
        .icon-menu3+span,
        .icon-menu4+span
        {
            line-height: 30px !important;
            height: 30px !important
        }
        .icon-menu4 {
            background: transparent url("/img/icon_course.png") center/100% no-repeat;
            width: 30px;
            height: 30px;
            vertical-align: middle;
            display: inline-block;
            margin-right: 6px;

        }

        .nav_menu_full {
            position: fixed;
            left: 0;
            right: 0;
            top: 66px;
            display: flex;
            flex-direction: column;
            align-items: center;
            background-color: white;
            z-index: 99;
            box-shadow: 0px 10px 20px 0px rgba(70, 109, 106, 0.07);
            padding-bottom: 13px;
        }

        .nav_menu_full ul {
            display: flex;
            flex-flow: row wrap;

        }

        .nav_menu_full ul li {
            width: 200px;
            height: 34px;
            line-height: 20px;
            padding-left: 40px;
            font-size: 14px;
            text-align: left;
        }
        .nav_menu_full ul li:hover>a{
            color: #12AA9C !important;
        }

        .nav_menu_full ul li a {
            height: 34px;
            line-height: 20px;
            font-size: 14px;
            color: #1C2927 !important;
            display: inline-block;
        }

        .nav_menu_full ul li a:hover {
            font-weight: 500;
            color: #12AA9C;
            cursor: pointer;
        }

        .nav_menu_full_item {
            width: 1200px;
            padding-top: 26px;
            padding-bottom: 14px;
            background: #FFFFFF;

        }

        .nav_menu_full .nav_menu_full_item:not(:first-of-type) {
            border-top: 1px solid #E4EAE9;
        }

        .nav_menu_full_item > div {
            width: 200px;
            flex: none;
        }

        .nav_menu_full_item > div > span {
            font-size: 18px;
            font-weight: 500;
            color: #1C2927;
            line-height: 25px;
        }


        .menu_default {
            display: none;
        }
        .menu_default2{
            cursor: pointer;
            position: absolute;
            border-radius: 4px; 
            top:66px;
            transform: translateX(-30%);
        }
        .menu_default3{
            position: absolute;
            top:66px;
            border-radius: 4px; 
            left:calc(50% - 68px)
        }
        /* .nav_menu_full .nav_menu_full_item:hover > div {
            background: transparent url("/img/icon_arrow.png") 130px 12px/18px 10px no-repeat;
        } */

        /* .nav_menu_full .nav_menu_full_item:nth-of-type(3):hover > div {
            background: transparent url("/img/icon_arrow.png") 168px 12px/18px 10px no-repeat;
        } */

        .nav_menu_full .nav_menu_full_item:hover > div > span {
            color: #12AA9C;
        }

        .imgText {
            margin-top: 6px;
        }
        .cross button{
            width: 95px;
            height: 36px;
            background: #12AA9C;
            color: #fff;
            font-size: 16px;
            border: none;
            border-radius: 6px;
            float: right;
            margin-top: 15px;
            /* display: none; */
        }
        .cross>div{
            cursor: pointer;
            display: none;
            max-width: 250px;
            /* width: 150px; */
        }
        .cross div>span{
            display: inline-block;
            vertical-align: top;
            height: 66px;
        }
        .cross div>span div{
            height: 20px;
            line-height: 20px;
        }
        .cross div>span:last-child{
            padding-top: 13px;
            margin-left: 5px;
        }
        .cross div>span>img{
            display: inline-block;
            margin-top: 14px;
            width: 34px;
        }
        .cross a{
            color: #fff;
        }
        .hoverList{
            position: relative;
        }
        .hoverList ul{
            position: absolute;
            background-color: #fff;
            padding:43px 36px 36px;
            box-shadow: 0px 4px 20px 0px rgba(32, 40, 52, 0.12);
            border-radius: 4px;
            text-align: left;
            transform: translateX(-50%);
            margin-left: 50%;
            display: none;
        }
        /* .hoverList:hover ul{
            display: block;
        } */
        .hoverList ul li{
            height: 22px;
            line-height: 22px;
            font-size: 16px;
            color: #1C2927;
        }
        .hoverList ul li:hover{
            cursor: pointer;
            color: #12AA9C;
        }
        .hoverList ul li+li{
            margin-top: 16px;
        }
        .rightHover{
            width: 10px;
        }
        .rightHover2{
            width: 10px;
            display: none;
        }
        .item:hover .rightHover2{
            display: inline-block;
        }
        .item:hover .rightHover{
            display: none;
        }
        .line{
            width: 0;
            height: 2px;
            display: inline-block;
            vertical-align: top;
            background-color: #12AA9C;
            border-radius: 1px;
            transition-property:width;
            transition-duration:0.61s;
            transition-timing-function:linear;
        }
        .more:hover .line{
            width: 130px;
            height: 2px;
            background-color: #12AA9C;
        }
        .more:hover .line2{
            width: 166px;
            height: 2px;
            background-color: #12AA9C;
        }
        .quotationMarks{
            position: relative;
            width: 80%;
            font-size: 14px;
            font-weight: 400;
            color: #595E5E; 
            height: 132px;
            line-height: 21px;
            padding-top:38px;
            margin-top: 36px;
        }
        .quotationMarks>span{
            display: inline-block;
            vertical-align: top;
            position: absolute;
            z-index: 3;
        }
        /* 引号部分 */
        .quotationMarksLeft{
            width: 60px;
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
        }
        .quotationMarksRight{
            width: 60px;
            right: 0;
            bottom: 0;
            position: absolute;
        }
        /* .indicator{
            width: 100%;
            height: 86px;
            margin: auto;
            padding: 0 50px;
            bottom: 0;
            position: absolute;
            top: 0;
            z-index: 10000;
        }
        .indicator div{
            display: inline-block;
            vertical-align: top;
        }
        .indicator img{
            height: 86px;
        } */
        .bannerLeft{
            position: absolute;
            width: 40px;
            height: 86px;
            top: 0;
            bottom: 0;
            left: 50px;
            margin: auto;
            z-index: 10;
            opacity: 0;
            transition-property:opacity;
			transition-duration:0.3s;
			transition-timing-function:linear;
            font-size: 0;
        }
        .bannerLeft>img,
        .bannerRight>img
        {
            width: 100%;
            cursor: pointer;
        }
        .bannerRight{
            position: absolute;
            z-index: 10;
            height: 86px;
            width: 40px;
            top: 0;
            bottom: 0;
            margin: auto;
            right: 50px;
            opacity: 0;
            transition-property:opacity;
			transition-duration:0.3s;
			transition-timing-function:linear;
            font-size: 0;
        }
        .header-swiper:hover .bannerLeft{
            opacity: 1;
            transition-property:opacity;
			transition-duration:0.3s;
			transition-timing-function:linear;
        }
        .header-swiper:hover .bannerRight{
            opacity: 1;
            transition-property:opacity;
			transition-duration:0.3s;
			transition-timing-function:linear;
        }
        .backToTop{
            width: 50px;
            position: fixed;
            bottom: 31px;
            right: 30px;
            z-index: 10;
            display: none;
        }
        .backToTop>div:first-child{
            font-size: 0;
            width: 50px;
            height: 152px;
            background: #FFFFFF;
            box-shadow: 0px 5px 20px 0px rgba(44, 43, 41, 0.08);
            border-radius: 25px;
        }
        .backToTop>div:first-child>img{
            width: 50px;
            cursor: pointer;
        }
        .backToTop>div:nth-child(2){
            width: 50px;
            height: 50px;
            border-radius: 50%;
            margin-top: 32px;
            box-shadow: 0px 5px 20px 0px rgba(44, 43, 41, 0.08);
            cursor: pointer;
        }
        .backToTop>div:nth-child(2) a>img{
            width: 50px;
        }
        .backToTopLine{
            width: 26px;
            height: 1px;
            background-color: #E4E4E4;
            margin: auto;
            left: 0;
            right: 0;
        }
        /* 电话号悬停样式 */
        .phoneHover{
            width: 148px;
            height: 124px;
            border-radius: 8px;
            padding: 14px 18px;
            position: absolute;
            right: 66px;
            background-color: #fff;
            box-shadow: 0px 5px 20px 0px rgba(44, 43, 41, 0.08);
            top: 14px;
            display: none;
        }
        .phoneHover>div:first-child{
            font-size: 14px;
        }
        .phoneHover>ul{
            margin-top: 10px;
        }
        .phoneHover>ul li{
            font-size: 14px;
            color: #595E5E;
            line-height: 22px;
        }
        .phoneHover>ul li:hover{
            color: #12AA9C;
        }
        /* 微信悬停样式 */
        .WeChatHover,
        .customerService{
            width: 148px;
            height: 152px;
            border-radius: 8px;
            text-align: center;
            position: absolute;
            right: 66px;
            background-color: #fff;
            box-shadow: 0px 5px 20px 0px rgba(44, 43, 41, 0.08);
            top: 0;
            display: none;
        }
        .WeChatHover>div:first-child,
        .customerService>div:first-child
        {
            font-size: 0;
        }
        .WeChatHover>div>img,
        .customerService>div>img
        {
            width: 98px;
            margin: 14px 0 6px;
        }
        .milepost>li{
            color: #fff;
            position: absolute;
        }
        .milepost>li>div:first-child{
            line-height: 30px;
            font-size: 25px;
            font-family:'Mosk';
            margin-bottom: 4px;
            padding-left: 15px;
        }
        .milepost>li>div:last-child{
            font-size: 14px;
            line-height: 20px;
            font-family:'Mosk Medium 50';
            padding: 4px 8px;
            background: linear-gradient(270deg, rgba(0, 166, 158, 0) 0%, #00A69E 27%, #00A69E 78%, rgba(0, 166, 158, 0) 100%);
            opacity: 0.89;
        }
        
        .milepost>li:first-child{
            left:6.1%;
            bottom: 13.44%;
            width: 173px;
        }
        .milepost>li:nth-child(2){
            left:17.08%;
            bottom: 23.51%;
            width: 173px;
        }
        .milepost>li:nth-child(3){
            left:33.26%;
            bottom: 19.85%;
            width: 173px;
        }
        .milepost>li:nth-child(4){
            left:44.17%;
            bottom: 7.6%;
            width: 173px;
        }
        .milepost>li:nth-child(5){
            left:56.94%;
            bottom: 28.18%;
            width: 173px;
        }
        .milepost>li:nth-child(6){
            left:70.49%;
            bottom: 12.44%;
            width: 173px;
        }
        .milepost>li:nth-child(7){
            left:84.86%;
            bottom: 27.17%;
            width: 173px;
        }




        /* .nav_menu_full .nav_menu_full_item:hover > div {
            background: transparent url("/img/icon_arrow.png") 130px 12px/18px 10px no-repeat;
        } */
        .gifAnimator{
            width: 0;
            overflow: hidden;
            height: 10px;
            display: inline-block;
            vertical-align: top;
            margin:10px 0 0 24px;
        }
        .gifAnimator>img{
            width: 18px;
            height: 10px;
            display: inline-block;
            vertical-align: top;
        }
        .nav_menu_full .nav_menu_full_item:hover .gifAnimator{
            width: 18px;
            transition-property:all;
			/* 指定过渡时长 */
			transition-duration:0.3s;
			transition-timing-function:linear;
        }
        .hoverImg:hover>img{
            display: inline-block !important;
        }
        .hoverImg{
            position: relative;
        }
        .hoverImg>img{
            width: 16px;
            position:absolute;
            bottom: 3px;
            margin-left: 2px;
            display:none;
        }
        .software{
            position: absolute;
            left: 130px;
            top: 0px;
            background-color: #fff;
            height: 100px;
            line-height: 40px;
            padding: 10px 20px;
            border-radius: 8px;
            display: none;
            box-shadow: 0px 5px 20px 0px rgba(44, 43, 41, 0.08);
        }
        .software li{
            height: 40px;
        }
        .software li:hover a{
            color: #12AA9C !important;
        }
        .software li a{
            color:#1C2927 !important;
            font-size:14px;
        }
        .examinationSoftware:hover .software{
            display: block;
        }
        .examinationSoftware{
            position:relative;
        }
        .examinationSoftware>a{
            position:relative;
        }
        .examinationSoftware:hover>a>img{
            display: inline-block;
        }

        .headerButton{
            display: flex;
            position: absolute;
            right: 0;
        }
        .shopping{
            width: 57px;
            margin-right: 2px;
            font-size: 0;
            cursor: pointer;
        }
        .shopping img{
            /* height: 24px; */
            height: 46px;
            margin-top: 8px;
        }
        .shopping>a>span{
            font-size: 16px;
            /* margin-top: 2px; */
            color: #fff;
            line-height: 66px;
            display: inline-block;
            vertical-align: top;
            margin-left: 4px;
        }
        .content-between{
            justify-content: left;
        }
        /* .container{
            width: 1200px !important;
            margin: auto;
        } */
        /* 暂时的 */
        .temporary{
            position: relative;
        }
        .temporary>img{
            width:100%
        }
        .temporaryImg{
            position: absolute;
            width: 100%;
            height: 100%;
            left: 0;
            top: 0;
            color: #FFFFFF;
            font-size: 24px;
            text-shadow: 0px 2px 4px rgba(20,42,37,0.29);
            text-align: center;
        }
        .temporaryImg>img{
            width: 42px;
            height: 38px;
        }
        .temporaryImg>span{
            display: inline-block;
            vertical-align: top;
            line-height: 33px;
            margin:5px 8px;
        }
        .aboutUs{
            position: relative
        }
        .lookMore{
            margin-top: 80px;
        }
        .bannerVideo{
            margin-left: 100px;
        }
        .pager{
            position: absolute;
            left: 0;
            right: 0;
            top:0;
            bottom: 0;
            text-align: center;
        }
        .pager>div{
            position: unset;
            width: 1210px;
            margin-top: 400px;
        }
        .item_list{
            margin-left: 16px
        }
        .item_list>p{
            font-size: 14px;
            color: #595E5E;
            font-weight: 400;
            line-height: 20px;
            margin-top: 18px;
            width: 240px;
        }
        .item_list>div:last-child{
            margin-top: 40px;
        }
        .new_text{
            position: relative;
            margin-left: 14px;
        }
        .more_inquiries{
            width: 100%;
            text-align: center;
            margin: 50px 0;
        }
        .case-item_list{
            display: flex;
            width: 80%;
        }
        .case-item_list>img{
            object-fit: cover;
        }
        .case-item_list>div{
            margin-left: 12px
        }
        .case-item_list>div>div:first-child{
            height: 33px; 
            font-size: 24px;
            font-weight: 600; 
            color: #1C2927; 
            line-height: 33px;
        }
        .case-item_list>div>div:last-child{
            margin-top: 6px;
            height: 21px; 
            font-size: 14px;
            font-weight: 400; 
            color: #8D9796; 
            line-height: 21px;
        }
        .more_cases{
            width: 100%;
            text-align: center;
            margin: 50px 0;
        }
    </style>
</head>

<body>

<div class="header" id="tab1">
    <div class="header-box">
        <div class="container">
            <nav class="nav flex-row content-between">
                <div class="logo">
                    <img width="291" src="/img/logo_yxm_white.png"/>
                </div>
                <ul class="flex-row">
                    <li>
                        <a target="_self" href="/index.html">首页</a>
                    </li>
                    <li>
                        <a>1+X</a>
                        <ul class="menu_default nav_menu menu_default2">
                            <li>
                                <a href="../1+x/project.html">EEPM简介</a>
                            </li>
                            <li>
                                <a href="../1+x/training.html">师资培训</a>
                            </li>
                            <li>
                                <a class="hoverImg" target="_blank" href="http://mock.yanxuex.com/login">
                                    题库练习
                                    <img src="../1+x/img/icon.png" alt="">
                                </a>
                            </li>
                            <li>
                                <a href="../1+x/extbook.html">教材教辅</a>
                            </li>
                            <li>
                                <a href="../1+x/certificate.html">证书查询</a>
                                <!-- <a href="http://cert.yanxuex.com/cert">证书查询</a> -->
                            </li>
                            <li class="examinationSoftware">
                                <a href="http://yanxuex.oss-cn-beijing.aliyuncs.com/app/1%2BX_EEPM_EXAM1.0.2.exe" class="hoverImg" >
                                    考试软件
                                    <img src="../1+x/img/download.png" alt="">
                                    <ul class="software">
                                        <li>
                                            <a href="http://file.yanxuex.com/app/1%2BXEEPM1.0.0.zip">下载学生考试软件</a>
                                        </li>
                                        <li>
                                            <a class="" href="http://yanxuex.oss-cn-beijing.aliyuncs.com/app/1%2BX_EEPM_EXAM1.0.2.exe">
                                                下载师资考试软件
                                            </a>
                                        </li>
                                    </ul>
                                </a>
                            </li>
                            <li>
                                <a href="../1+x/question.html">常见问题</a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="javascript:void(0);">产品与服务</a>
                        <div class="menu_default">
                            <div class="nav_menu_full">
                                <div class="nav_menu_full_item flex-row">
                                    <div class="flex-row">
                                        <i class="icon-menu3"></i>
                                        <span >专业服务</span>
                                        <div class="gifAnimator">
                                            <img src="/img/icon_arrow.png" alt="">
                                        </div>
                                    </div>
                                    <ul class="flex-row">
                                        <li><a target="_self" href="/train/index.html">产业学院</a></li>
                                        <li><a target="_self" href="/train/index.html">实训装备</a></li>
                                        <li><a target="_self" href="/train/eepm.html">精品课程</a></li>
                                        <li><a target="_self" href="/train/index.html">教材开发</a></li>
                                        <li><a target="_self" href="/train/index.html">人培方案</a></li>
                                        <li><a target="_self" href="/train/index.html">订单培养</a></li>
                                        <li><a target="_self" href="/train/index.html">专业共建</a></li>
                                        <li><a target="_self" href="/train/index.html">职业介绍</a></li>
                                        <li><a target="_self" href="/train/index.html">师资派遣</a></li>
                                        <li><a target="_self" href="/train/index.html">产业资源</a></li>
                                        <li><a target="_self" href="/train/index.html">技能大赛</a></li>
                                        <li><a target="_self" href="/train/index.html">SAAS系统</a></li>
                                        <li><a target="_self" href="/train/index.html">课题研究</a></li>
                                        <li><a target="_self" href="/train/index.html">质量评价</a></li>
                                    </ul>
                                </div>
                                <div class="nav_menu_full_item flex-row">
                                    <div class="flex-row">
                                        <i class="icon-menu2"></i>
                                        <span>社会服务</span>
                                        <div class="gifAnimator">
                                            <img src="/img/icon_arrow.png" alt="">
                                        </div>
                                    </div>
                                    <ul class="flex-row">
                                        <li><a target="_self" href="/train/index.html">基地认证</a></li>
                                        <li><a target="_self" href="/train/index.html">实践就业</a></li>
                                        <li><a target="_self" href="/train/index.html">考评员认证</a></li>
                                        <li><a target="_self" href="/train/index.html">师资培训</a></li>
                                        <li><a target="_self" href="/train/index.html">行业论坛</a></li>
                                        <li><a target="_self" href="/train/index.html">研学BOX</a></li>
                                        <li><a target="_self" href="/train/index.html">基地研学</a></li>
                                        <li><a target="_self" href="/train/index.html">科学研学</a></li>
                                        <li><a target="_self" href="/train/index.html">课程开发</a></li>
                                        <li><a target="_self" href="/train/index.html">基地运营</a></li>
                                    </ul>
                                </div>
                                <div class="nav_menu_full_item flex-row">
                                    <div class="flex-row">
                                        <i class="icon-menu4"></i>
                                        <span>研学猫云课堂</span>
                                        <div class="gifAnimator">
                                            <img src="/img/icon_arrow.png" alt="">
                                        </div>
                                    </div>
                                    <ul class="flex-row">
                                        <li><a target="_blank" href="http://appsPubrIt59825.h5.xiaoeknow.com">在线培训</a></li>
                                        <li><a target="_blank"
                                            href="http://appspubrit59825.h5.xiaoeknow.com/p/decorate/more/eyJpZCI6IjkyNjIxNzgiLCJjaGFubmVsX2lkIjoiIn0">在线论坛</a>
                                        </li>
                                        <li><a target="_blank"
                                            href="http://appsPubrIt59825.h5.xiaoeknow.com/v1/usercenter/super_vip/index/s_5e4aae9aee25c_E4eLJRgl?type=15&is_experience_card=0">在线会员</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="hoverList">
                        <a target="_self" href="/channel_cooperation.html">渠道合作</a>
                        <ul>
                            <li>城市合伙人</li>
                            <li>研学EEPM实践就业机构</li>
                        </ul>
                    </li>
                    <li class="hoverList">
                        <a target="_self" href="/research/index.html">学术研究</a>
                        <ul>
                            <li>高校毕业生就业协会文化旅游专业委员会</li>
                            <li>北京新时代教育科技研究院</li>
                            <li>研学标准协同创新中心</li>
                            <li>元宇宙研学实践中心</li>
                        </ul>
                    </li>
                    <li>
                        <!-- <a href="http://cert.yanxuex.com/cert" target="_blank">证书查询</a> -->
                        <a href="../1+x/certificate.html">证书查询</a>
                    </li>
                    <li class="aboutUs">
                        <a target="_self" href="/about.html">关于我们</a>
                        <ul class="menu_default nav_menu menu_default3">
                            <li data-url="/about.html#profile"><!--<i class="icon-menu1"></i>--><a
                                    href="javascript:void(0)">公司简介</a></li>
                            <li data-url="/about.html#expert"><!--<i class="icon-menu1"></i>--><a
                                    href="javascript:void(0)">专家团队</a></li>
                            <li data-url="/about.html#history"><!--<i class="icon-menu1"></i>--><a
                                    href="javascript:void(0)">发展历程</a></li>
                            <li data-url="/about.html#report"><a
                                    href="javascript:void(0)">权威报道</a></li>
                            <li data-url="/about.html#qualification"><!--<i class="icon-menu1"></i>--><a
                                    href="javascript:void(0)">荣誉资质</a>
                            </li>
                            <li data-url="/about.html#join_us"><!--<i class="icon-menu1"></i>--><a
                                    href="javascript:void(0)">加入我们</a></li>
                            <li data-url="/about.html#contact_us"><!--<i class="icon-menu1"></i>--><a  href="javascript:void(0)">联系我们</a>
                            </li>
                            <li data-url="/news/index.html"><a href="/news/index.html">新闻资讯</a></li>
                            <!-- <li data-url="/news/index.html"><a href="http://oldx1.yanxuex.com/yx/news">新闻资讯</a></li> -->
                            <li data-url="/case/index.html"><a href="javascript:void(0);">合作案例</a></li>
                        </ul>
                    </li>
                </ul>
                <div class="headerButton">
                    <div class="shopping">
                        <a href="./shopping.html">
                            <img src="/img/shop/icon_shop1.png" alt="">
                        </a>
                    </div>
                    <div class="cross">
                        <button>
                            <a href="http://cert.yanxuex.com/" target="_blank">登录/注册</a>
                        </button>
                        <div onclick="jumpPage()">
                            <span>
                                <img src="/img/userImg.png" alt="">
                            </span>
                            <span>
                                <div>欢迎您！</div>
                                <div class="userPhone">
                                    <a href="http://cert.yanxuex.com/profile/training"></a>
                                </div>
                            </span>
                        </div>
                    </div> 
                </div>
            </nav>
        </div>
        
    </div>
</div>
<div class="content">
    <div class="header-swiper swiper">
        <div class="swiper-wrapper">
            <div class="swiper-slide">
                <div class="carousel_chart">
                    <div class="bg">
                        <div class="flex-row">
                            <div class="flex-col content-center">
                                <div>
                                    <!-- 第3期1+X研学EEPM证书(高级)师资培训班报名倒计时 -->
                                    第6期1+X研学EEPM证书(高级)师资培训——新疆站
                                </div>
                                <div class="content-centerTime">
                                    <!-- 职业技能等级证书(高级)师资培训班 -->
                                    报名倒计时
                                </div>
                                <div class="lookMore">
                                    <button class="medium-btn"><a href="http://gaosao.cn/1+x/training.html" target="_blank">查看更多</a></button>
                                </div>
                            </div>
                            <div class="bannerVideo">
                                <video width="638px" height="366px" class="video1" loop autoplay preload="auto"
                                       muted="muted"
                                       src="http://file.yanxuex.com/yanxue/new/home/img/video/1.1.3.mp4"></video>
                            </div>
                        </div>
                    </div>
                </div>
            </div> 
            <div  class="swiper-slide temporary">
                <img src="/img/temporary/banner.jpg" alt="">
                <!-- <div class="temporaryImg">
                    <span>论坛开始倒计时 </span><img id="temporaryImg" src="/img/temporary/img_last14.png" alt=""><span> 天</span>
                </div> -->
            </div>
            <div class="swiper-slide">
                <div class="carousel_chart">
                    <div class="bg">
                        <div class="flex-row">
                            <div class="flex-col content-center">
                                <div>
                                    第八届新时代研学旅行论坛<br>暨首届新时代研学基地营地大会
                                </div>
                                <div>
                                    <button class="medium-btn"><a href="http://appspubrit59825.h5.xiaoeknow.com/v1/goods/goods_detail/p_641ddbc4e4b0f2aa7dd1e3e2?type=3" target="_blank">查看回放</a></button>
                                </div>
                            </div>
                            <div class="video2">
                                <video loop autoplay preload="auto"
                                muted="muted"
                                src="/img/temporary/banner.mp4"></video>
                            </div>
                        </div>
                    </div>
                </div>
            </div> 
        </div>
        <!-- 如果需要分页器 -->
        <div class="flex-row content-items-center pager">
            <div class="swiper-pagination flex-row">
            </div>
        </div>
        <!-- 如果需要导航按钮 -->
        <!-- <div class="bannerLeft"></div>
        <div class="bannerRight"></div> -->
        <!-- 左右指示器 -->
        <!-- <div class="indicator"> -->
        <div class="bannerLeft">
            <img src="/img/bannerLeft.png" alt="">
        </div>
        <div class="bannerRight">
            <img src="/img/bannerRight.png" alt="">
        </div>
        <!-- </div> -->
    </div>
    <div class="item-content">
        <div class="item-box">
            <div class="item">
                <div>
                    <img width="60" height="60" src="/img/icon6.png">
                </div>
                <div class="item_list">
                    <div class="title">职业技能培训</div>
                    <p>
                        1+X研学EEPM师资/考评员 <br>
                        研学旅行/工业文化/劳动教育
                    </p>
                    <div>
                        <button class="small-btn">
                            <a target="_self" href="/train/index.html">查看更多 
                                <span>
                                    <img class="rightHover" src="/img/rightHover.png" alt="">
                                    <img  class="rightHover2" src="/img/rightHover2.png" alt="">
                                </span>
                            </a>
                        </button>
                    </div>
                </div>
            </div>
            <div class="item">
                <div>
                    <img width="60" height="60" src="/img/icon1.png">
                </div>
                <div class="item_list">
                    <div class="title">课程与教育装备开发</div>
                    <p>
                        教育装备、研学BOX <br>
                        课程包、课程咨询项目
                    </p>
                    <div>
                        <button class="small-btn"><a target="_self" href="/train/index.html">查看更多 <span>
                            <img class="rightHover" src="/img/rightHover.png" alt="">
                            <img  class="rightHover2" src="/img/rightHover2.png" alt="">
                        </span></a>
                        </button>
                    </div>
                </div>
            </div>
            <div class="item">
                <div>
                    <img width="60" height="60" src="/img/icon2.png">
                </div>
                <div class="item_list">
                    <div class="title">标准认证服务</div>
                    <p>
                        工业文化研学实践教育基地 <br>
                        中小学生航空研学实践教育基地营地
                    </p>
                    <div>
                        <button class="small-btn"><a target="_self" href="/train/index.html">查看更多 <span>
                            <img class="rightHover" src="/img/rightHover.png" alt="">
                            <img  class="rightHover2" src="/img/rightHover2.png" alt="">
                        </span></a>
                        </button>
                    </div>
                </div>
            </div>
            <div class="item">
                <div>
                    <img width="60" height="60" src="/img/icon3.png">
                </div>
                <div class="item_list">
                    <div class="title">科学实践活动承接</div>
                    <p>
                        北汽新能源工业文化研学实践教育基地 <br>
                        沙漠、熊猫、西藏等自然、科学系列
                    </p>
                    <div>
                        <button class="small-btn"><a target="_self" href="/train/index.html">查看更多 <span>
                            <img class="rightHover" src="/img/rightHover.png" alt="">
                            <img  class="rightHover2" src="/img/rightHover2.png" alt="">
                        </span></a>
                        </button>
                    </div>
                </div>
            </div>
            <div class="item">
                <div>
                    <img width="60" height="60" src="/img/icon4.png">
                </div>
                <div class="item_list">
                    <div class="title">基地营地运营</div>
                    <p>
                        顶层规划、师资培养 <br>
                        课程、运营体系建立
                    </p>
                    <div>
                        <button class="small-btn"><a target="_self" href="/train/index.html">查看更多 <span>
                            <img class="rightHover" src="/img/rightHover.png" alt="">
                            <img  class="rightHover2" src="/img/rightHover2.png" alt="">
                        </span></a>
                        </button>
                    </div>
                </div>
            </div>
            <div class="item">
                <div>
                    <img width="60" height="60" src="/img/icon5.png">
                </div>
                <div class="item_list">
                    <div class="title">数字化SaaS平台建设</div>
                    <p >
                        考试系统、教学系统 <br>
                        基地营地、大数据分析平台
                    </p>
                    <div>
                        <button class="small-btn"><a target="_self" href="/train/index.html">查看更多 <span>
                            <img class="rightHover" src="/img/rightHover.png" alt="">
                            <img  class="rightHover2" src="/img/rightHover2.png" alt="">
                        </span></a>
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="news-content">
        <div class="news-box">
            <div class="title">新闻资讯</div>
            <div class="news-tab">
                <ul>
                    <li data-tab-id="#news1" class="active">政策要闻</li>
                    <li data-tab-id="#news2">行业洞察</li>
                    <li data-tab-id="#news3">公司动态</li>
                </ul>
                <div class="news-tab-box">
                    <div id="news1" class="news-tab-item selected">
                        <div>
                            <img src="/img/img_event.png" alt="">
                        </div>
                        <div class="new_text">
                            <div class="news-list">
                            </div>
                        </div>
                    </div>
                    <div id="news2" class="news-tab-item ">
                        <div>
                            <img src="/img/img_event.png" alt="">
                        </div>
                        <div class="new_text">
                            <div class="news-list">
                            </div>
                        </div>
                    </div>
                    <div id="news3" class="news-tab-item">
                        <div>
                            <img src="/img/img_event.png" alt="">
                        </div>
                        <div class="new_text">
                            <div class="news-list">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="more_inquiries">
                <span class="more">
                    <!-- <a target="_blank" href="http://oldx1.yanxuex.com/yx/news">查看更多资讯 -->
                    <a target="_blank" href="/news/index.html">查看更多资讯
                        <span>
                            <img class="rightHover" src="/img/rightHover3.png" alt="">
                        </span>
                    </a>
                    <br><span class="line"></span>
                </span>
            </div>
        </div>
    </div>
    <div class="case-content">
        <div class="case-title">合作案例</div>
        <div class="case-swiper swiper">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <div class="case-item">
                        <div class="case-item_list">
                            <img src="/img/logo_bq.png" width="106px" height="60px"/>
                            <div>
                                <div>
                                    北京汽车新能源股份公司
                                </div>
                                <div>
                                    首家汽车主题工业文化研学实践教育基地
                                </div>
                            </div>
                        </div>
                        <div class="quotationMarks" >
                            <img src="/img/icon_left.png" alt="" class="quotationMarksLeft">
                            <span>
                                借助工信部工业文化发展中心挂牌，全国首家汽车主题工业文化研学实践教育基地将工业文化研学实践教育作为企业第三产业发展提供创新驱动力。
                            </span>
                            <img src="/img/icon_right.png" alt="" class="quotationMarksRight">
                        </div>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="case-item">
                        <div class="case-item_list">
                            <img src="/img/logo_qnzz.png" width="106px" height="60px"/>
                            <div>
                                <div>
                                    北京青年政治学院
                                </div>
                                <div>
                                    落户第一家亲子猫研学旅行学院
                                </div>
                            </div>
                        </div>
                        <div class="quotationMarks" >
                            <img src="/img/icon_left.png" alt="" class="quotationMarksLeft">
                            <span>
                                促进学校在人才培养、师资培训、标准研发、实习就业、技能竞赛、境外研学研究等方面的发展。
                            </span>
                            <img src="/img/icon_right.png" alt="" class="quotationMarksRight">
                        </div>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="case-item">
                        <div class="case-item_list">
                            <img src="/img/log_pygc.png" width="106px" height="60px"/>
                            <div>
                                <div >
                                    平遥古城
                                </div>
                                <div>
                                    首批全国中小学生研学实践教育基地
                                </div>
                            </div>
                        </div>
                        <div class="quotationMarks" >
                            <img src="/img/icon_left.png" alt="" class="quotationMarksLeft">
                            <span>
                                促进学校在人才培养、师资培训、标准研发、实习就业、技能竞赛、境外研学研究等方面的发展。
                            </span>
                            <img src="/img/icon_right.png" alt="" class="quotationMarksRight">
                        </div>
                    </div>
                </div>
            </div>
            <div class="swiper-button-next"></div>
            <div class="swiper-button-prev"></div>
            <div class="mask-left"></div>
            <div class="mask-right"></div>
        </div>
        <div class="case-logo-list-box">
            <img src="/img/logo_aopa@2x.png" alt="">
            <img src="/img/logo_tc@2x.png" alt="">
            <img src="/img/logo_bsl@2x.png" alt="">
            <img src="/img/logo_xc@2x.png" alt="">
            <img src="/img/logo_eshttc@2x.png" alt="">
            <img src="/img/logo_icdc@2x.png" alt="">
        </div>
        <div class="more_cases">
            <span class="more">
                查看更多合作案例
                <span>
                    <img class="rightHover" src="/img/rightHover3.png" alt="">
                </span>
                <br><span class="line line2"></span>
            </span>
        </div>
    </div>
    <div class="expert-content">
        <div class="expert-box">
            <div class="expert-title">专家团队</div>
            <div class="expert-list">
                <div class="expert-item">
                    <img width="282px" alt="" src="/img/img_gmy2.png"/>
                    <div class="expert-info">
                        <div>顾明远</div>
                        <div>国家教育咨询委员会委员</div>
                        <div>北京师范大学资深教授</div>
                        <div>中国教育学会名誉会长</div>
                    </div>
                </div>
                <div class="expert-item">
                    <img width="282px" height="282px" alt="" src="/img/img_gcj2.png"/>
                    <div class="expert-info">
                        <div>郭传杰</div>
                        <div>国家教育咨询委员会委员</div>
                        <div>中国科学院党组原副书记</div>
                    </div>
                </div>
                <div class="expert-item">
                    <img width="282px" height="282px" alt="" src="/img/img_cgj2.png"/>
                    <div class="expert-info">
                        <div>陈光巨</div>
                        <div>中国高等教育学会教师教育分会</div>
                        <div>副会长</div>
                    </div>
                </div>
                <div class="expert-item">
                    <img width="282px" height="282px" alt="" src="/img/img_sx2.png"/>
                    <div class="expert-info">
                        <div>孙星</div>
                        <!-- <div style="text-align: center;width: 224px;">工业和信息化部工业文化发展中心副主任</div> -->
                        <div>工业和信息化部工业文化发展中心副主任</div>
                    </div>
                </div>
                <div class="expert-item">
                    <img width="282px" height="271px" alt="" src="/img/img_zzq3.png"/>
                    <div class="expert-info">
                        <div>赵志群</div>
                        <div>北京师范大学教育学部教授</div>
                        <!-- <div>中国职业技术教育学会教学工作委员会副主任</div> -->
                        <div>国家职业教育指导咨询委员会委员</div>
                    </div>
                </div>
                <div class="expert-item">
                    <img width="282px" height="271px" alt="" src="/img/img_lxj.png"/>
                    <div class="expert-info">
                        <div>厉新建</div>
                        <div>北京第二外国语学院首都文化和旅游发展研究院执行院长</div>
                        <!-- <div>文旅部“十四五”规划专家委员会委员</div> -->
                        <div>文旅部“十四五”规划专家委员会委员</div>
                    </div>
                </div>
                <div class="expert-item">
                    <img width="282px" height="271px" alt="" src="/img/img_wbd3.png"/>
                    <div class="expert-info">
                        <div>魏巴德</div>
                        <div>北京新时代教育科技研究院执行院长</div>
                        <div>全国旅游职业教育教学指导委员会委员</div>
                    </div>
                </div>
                <!-- <div class="expert-item">
                    <img width="282px" height="271px" alt="" src="/img/img_dq2.png"/>
                    <div class="expert-info">
                        <div>邓青</div>
                        <div>高校毕业生就业协会文化旅游专业委员会秘书长</div>
                        <div>中国旅游协会研学旅行分会秘书长</div>
                        <div>1+X研学EEPM标准起草人</div>
                    </div>
                </div> -->
                <!-- <div class="expert-item">
                    <img width="282px" height="271px" alt="" src="/img/img_ljn2.png"/>
                    <div class="expert-info">
                        <div>李京宁</div>
                        <div>工信部工业文化发展中心工业文化研学实践教育基地评估标准（试行）起草人</div>
                    </div>
                </div> -->
                
            </div>
            <!--<div class="" style="width: 100%;text-align: center;"><span class="more">查看更多专家>></span>
            </div>-->
        </div>
    </div>
    <div class="" style="width: 100%;position: relative;display: flex;flex-direction: column;">
        <img width="100%" src="/img/bg_ry.png" alt="">
        <img width="100%" src="/img/bg_landmark.png">
        <div style="position: absolute;left: 0;bottom: 0;top:0;right: 0;display: flex;flex-direction: column;align-items: center">
            <div style="width: 100%;padding-top: 5.97%;"></div>
            <div style="font-size: 40px; font-weight: 600; color: #1C2927; line-height: 56px;">荣誉资质</div>
            <div style="width: 100%;padding-top: 3.33%;"></div>
            <div class="ry-box">
                <div class="swiper ry-swiper">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide flex-col content-items-center">
                            <div class="ry-item-box">
                                <img width="230px" src="/img/img_honor1.png" alt="">
                                <div class="ry-info">
                                    高新技术企业证书
                                </div>
                            </div>
                        </div>
                        <div class="swiper-slide flex-col content-items-center">
                            <div class="ry-item-box">
                                <img width="230px" src="/img/img_honor2.png" alt="">
                                <div class="ry-info">
                                    中关村高新技术企业证书
                                </div>
                            </div>
                        </div>
                        <div class="swiper-slide flex-col content-items-center">
                            <div class="ry-item-box">
                                <img width="230px" src="/img/img_honor3.png" alt="">
                                <div class="ry-info">
                                    公益捐赠证书
                                </div>
                            </div>
                        </div>
                        <div class="imgText swiper-slide flex-col content-items-center">
                            <div class="ry-item-box">
                                <img width="230px" src="/img/img_honor4.png" alt="">
                                <div class="ry-info">
                                    中小学生航空科技教育无人机<br>研学实践课程研发机构
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- <div class="swiper-button-next"></div> -->
                    <!-- <div class="swiper-button-prev"></div> -->
                    <div class="ry-mask-left"></div>
                    <div class="ry-mask-right"></div>
                </div>
            </div>
            <div style="height: 56px; font-size: 40px; font-weight: 500; color: #FFFFFF; line-height: 56px;position: absolute;margin: 0 auto;bottom: 42%;">
                里程碑事件
            </div>
            <ul class="milepost">
                <li>
                    <!-- <div style="color: #FFFFFF;position: absolute;bottom: 22%;left: 10.9%">
                        <div style="font-size: 25px;font-family:'Mosk Medium 500';line-height: 30px;height: 30px;">2015/09</div>
                        <div style="width: 126px;margin-top: 4px;font-size: 14px;font-weight: 400;line-height: 20px;height: 20px;">
                            获北师大百万天使轮投资
                        </div>
                    </div> -->
                    <div>2015/09</div>
                    <div>获北师大百万天使轮投资</div>
                </li>
                <li>
                    <!-- <div style="color: #FFFFFF;position: absolute;bottom: 28%;left: 20.83%">
                        <div style="font-size: 25px;font-family: Arial,serif;line-height: 30px;height: 30px;">2016/05</div>
                        <div style="width: 126px;margin-top: 4px;font-size: 14px;font-weight: 400;line-height: 20px;height: 20px;">
                            发起独家运营首家沙漠研学营地
                        </div>
                    </div> -->
                    <div >2016/05</div>
                    <div>
                        发起独家运营首家沙漠研学营地
                    </div>
                </li>
                <li>
                    <!-- <div style="color: #FFFFFF;position: absolute;bottom: 9.88%;left: 40.83%">
                        <div style="font-size: 25px;font-family: Arial,serif;line-height: 30px;height: 30px;">2017/03</div>
                        <div style="width:154px;margin-top: 4px;font-size: 14px;font-weight: 400;line-height: 20px;height: 20px;">
                            //发起承办亚沙赛亲子团
                            主办首期全国研学旅行指导培训班（现更名为研学EEPM企业师资培训班）
                        </div>
                    </div> -->
                    <div>2017/03</div>
                    <div>
                        主办首期全国研学旅行指导培训班（现更名为研学EEPM企业师资培训班）
                    </div>
                </li>
                <li>
                    <!-- <div style="color: #FFFFFF;position: absolute;bottom: 30%;left: 50.21%">
                        <div style="font-size: 25px;font-family: Arial,serif;line-height: 30px;height: 30px;">2017/08</div>
                        <div style="width: 160px;margin-top: 4px;font-size: 14px;font-weight: 400;line-height: 20px;">
                            在北师大英东学术会堂召开首届新时代研学旅行论坛（原中国首届研学旅行公益论坛）
                        </div>
                    </div> -->
                    <div>2017/08</div>
                    <div>
                        在北师大英东学术会堂召开首届新时代研学旅行论坛（原中国首届研学旅行公益论坛）
                    </div>
                </li>
                <li>
                    <!-- <div style="color: #FFFFFF;position: absolute;bottom: 11%;left: 64.79%">
                        <div style="font-size: 25px;font-family: Arial,serif;line-height: 30px;height: 30px;">2020/01</div>
                        <div style="width: 126px;margin-top: 4px;font-size: 14px;font-weight: 400;line-height: 20px;height: 20px;">
                            被教育部确认为1+X研学旅行培训评价组织，并起草研学旅行行业标准
                        </div>
                    </div> -->
                    <div>2020/01</div>
                    <div>
                        被教育部确认为1+X研学旅行培训评价组织，并起草研学旅行行业标准
                    </div>
                </li>
                <li>
                    <!-- <div style="color: #FFFFFF;position: absolute;bottom: 38%;left: 75.97%">
                        <div style="font-size: 25px;font-family: Arial,serif;line-height: 30px;height: 30px;">2021/04</div>
                        <div style="width: 126px;margin-top: 4px;font-size: 14px;font-weight: 400;line-height: 20px;height: 20px;">
                            工信部工业文化发展中心联合亲子猫等启动工业文化研学实践教育基地评估
                        </div>
                    </div> -->
                    <div>2021/04</div>
                    <div>
                        工信部工业文化发展中心联合亲子猫等启动工业文化研学实践教育基地评估
                    </div>
                </li>
                <li>
                    <!-- <div style="color: #FFFFFF;position: absolute;bottom: 24%;left: 89.17%">
                        <div style="font-size: 25px;font-family: Arial,serif;line-height: 30px;height: 30px;">2021/12</div>
                        <div style="width: 126px;margin-top: 4px;font-size: 14px;font-weight: 400;line-height: 20px;height: 20px;">
                            亲子猫董事长魏新德（魏巴德）成为全国旅游职业教育教学指导委员会委员
                        </div>
                    </div> -->
                    <div>2021/12</div>
                    <div>
                        亲子猫董事长魏新德（魏巴德）成为全国旅游职业教育教学指导委员会委员
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <div class="backToTop">
        <div>
            <img data-id="phone" src="/img/home/phone.png" alt="">
            <div  class="backToTopLine"></div>
            <img data-id="customer" src="/img/home/customer.png" alt="">
            <div class="backToTopLine"></div>
            <img data-id="WeChat" src="/img/home/WeChat.png" alt="">
        </div>
        <div onmouseover="changeImg(1)" onmouseout="changeImg(2)">
            <a name="tab1" onclick="jump()"><img src="/img/top.png" alt=""></a>
        </div>
        <div class="phoneHover">
            <div>全国统一咨询热线</div>
            <ul>
                <li>17090880515</li>
                <li>18513127528</li>
            </ul>
        </div>
        <div class="customerService">
            <div>
                <img src="/img/img_code2.png" alt="">
            </div>
            <div>
                亲子猫客服企微号
            </div>
        </div>
        <div class="WeChatHover">
            <div>
                <img src="/img/WeChatHover.png" alt="">
            </div>
            <div>
                研学X微信公众号
            </div>
        </div>
    </div>
</div>

<div id="footer"></div>
</div>

<!--<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>-->
<script src="/js/jquery.js"></script>
<script src="/js/swiper-bundle.js"></script>
<script src="/js/news.js"></script>

<script>
    // var timer;
    
    // function aaa(){
    //     var element = $('.small-btn')
    //     timer = setInterval(() => {
    //         if (jQuery(element).css('border') == '3px dashed rgb(128, 128, 128)' || jQuery(element).css('border-color') =='rgb(128, 128, 128)') {
    //             jQuery(element).css('border','3px dashed rgb(0, 0, 0)')
    //             console.log(111)
    //         } else {
    //             console.log(222)
    //             jQuery(element).css('border','3px dashed rgb(128, 128, 128)')
    //         }
    //     }, 1000);
    // }
    // function bbb(){
    //     setTimeout(function(){
    //         clearInterval(timer)
    //     },10000)
    // }
    // this.aaa()
    // this.bbb()
    
    (function(){
        $('.temporaryImg').css('margin-top',(($(window).width()*212)/1440)+'px') 
        console.log((($(window).width()*212)/1440)+'px')
        var time = new Date() 
        var day = time.getDate()
        console.log(day)
        if(24-day>0){
            var number = 24-day
        }
        else{
            var number = '00'
        }
        $('#temporaryImg').attr('src','/img/temporary/img_last'+number+'.png')
    })()
    function jump(){
        // window.scrollTo(0,0)
        document.getElementById('tab1').scrollIntoView({behavior: "smooth", block: "end", inline: "nearest"});
    }
    function jumpPage(){
        window.open('http://cert.yanxuex.com/profile/training');
    }
    function changeImg(data){
        if(data == 1){
            $('.backToTop>div:nth-child(2)>a>img').attr('src','/img/top2.png')
        }
        else if(data == 2){
            $('.backToTop>div:nth-child(2)>a>img').attr('src','/img/top.png')
        }
    };
    $('.backToTop>div>img').on('mouseover',function(){
        if($(this).attr('data-id') == 'phone'){
            $(this).attr('src','/img/home/phone2.png')
            $('.phoneHover').css('display','block')
        }
        else if($(this).attr('data-id') == 'customer'){
            $(this).attr('src','/img/home/customer2.png')
            $('.customerService').css('display','block')
        }
        else if($(this).attr('data-id') == 'WeChat'){
            $(this).attr('src','/img/home/WeChat2.png')
            $('.WeChatHover').css('display','block')
        }
    })
    $('.backToTop>div>img').on('mouseout',function(){
        if($(this).attr('data-id') == 'phone'){
            $(this).attr('src','/img/home/phone.png')
            $('.phoneHover').css('display','none')
        }
        else if($(this).attr('data-id') == 'customer'){
            $(this).attr('src','/img/home/customer.png')
            $('.customerService').css('display','none')
        }
        else if($(this).attr('data-id') == 'WeChat'){
            $(this).attr('src','/img/home/WeChat.png')
            $('.WeChatHover').css('display','none')
        }
    })
    getInfo().done((res) => {
        console.log('查看内容',res);
        if(res.data.isLogin){
            $('.cross>button').css('display','none');
            $('.cross>div').css('display','block');
            $('.userPhone>a').html(res.data.username);
        }
        else
        {
            $('.cross>button').css('display','block');
            $('.cross>div').css('display','none');
        }
    })
    .fail(err => {
        console.log(err);
    })
    .always(() => {
    })
	function openUrl(url) {
		window.open(url);

	}

	function getNews() {
		return $.ajax(
			{
				url: "/api/XOrg/AssociationIndex/getNews",
				type: "get",
				data: {
					type: 1,
					isTop5: false,
					pageSize: 10,
					page: 1
				},
				dataType: "json",
			});
	}

    function cross(){
        window.open('http://cert.yanxuex.com/profile/training')
    };

	function getInfo() {
		return $.ajax({
            url: "http://cert.yanxuex.com/prod-api/qzm/newYxm/guser/infoExt",
            type: "get",
            dataType: "json",
            xhrFields: {
                withCredentials: true
            }
        });
	}

	function generateHtml(list) {
		let rst = "";
		list.forEach(function (item, index) {
			let {id, title, url, content, data, img} = item;
			let active = "";
			if (index === 0) {
				active = "active"
			}
			let oth = ""
			if (url) {
				oth = `data-img="${img}" style='cursor: pointer' onclick='openUrl("${url}");'`;

			}

			let temp = `<div class="news-item ${active}" ${oth} >
		<div class="news-item-box" >
			<div class="news-title ${active}">${title}</div>
			<div class="news-info">${content}</div>
			<div class="news-date">
				<i class="icon-date"></i><span>${data}</span>
			</div>
		</div>
	</div>`;
			rst = rst + temp;
		})
		rst = rst + `<div class="mask"></div>`

		return rst;

	}

	let rst = generateHtml(news_itemlist_1);
	$("#news1 .news-list").html(rst);

	rst = generateHtml(news_itemlist_2);
	$("#news2 .news-list").html(rst);

	/*rst = generateHtml(news_itemlist_3);
	$("#news3 .news-list").html(rst);*/

	$(function () {
		/*getInfo().done((response) => {
			console.log(response);
		}).fail(err => {
			console.log(err);
		}).always(() => {
		})*/


		getNews().done((response) => {
			console.log(response);
			let dataList = []
			if (response.list) {
				response.list.forEach(function (item) {
					let newsUrl = "http://oldx1.yanxuex.com/yx/news/1/" + item.id;
					let newItem = {
						"id": item.id,
						"title": item.title,
						"data": item.pulishTime,
						"content": item.contentText,
						"url": newsUrl,
						img: "/img/img_event3.png"
					}

					dataList.push(newItem)
				})
				rst = generateHtml(dataList);
				$("#news3 .news-list").html(rst);

			}
		}).fail(err => {
			console.log(err)
			rst = generateHtml(news_itemlist_3);
			$("#news3 .news-list").html(rst);
			//console.log(1)
		}).always(() => {
			$(".news-item").hover(function () {//鼠标悬停在上面实现什么效果
				$(".news-item").removeClass("active");
				$(".news-title").removeClass("active");
				$(".news-info").hide();
				$(this).addClass("active");
				$(this).find(".news-title").addClass("active");
				$(this).find(".news-info").show();
				let img = $(this).data("img");
				if (img) {
					$(".news-tab-item.selected img").attr('src', img);
				}
			}, function () {//鼠标离开实现什么功能
			});
		})


		var mySwiper = new Swiper('.header-swiper', {
			direction: 'horizontal', // 垂直切换选项
			loop: true, // 循环模式选项
			speed: 6000,
			autoplay: true,
            // 如果需要前进后退按钮
            navigation: {
                nextEl: '.bannerRight',
                prevEl: '.bannerLeft',
            },
            // 如果需要分页器
			pagination: {
				el: '.swiper-pagination',
				type: 'custom',
				autoplayDisableOnInteraction: false,
				renderCustom: function (swiper, current, total) {
					var paginationHtml = " ";
					for (var i = 0; i < total; i++) {
						// 判断是不是激活焦点，是的话添加active类，不是就只添加基本样式类
						if (i === (current - 1)) {
							paginationHtml += '<span class="swiper-pagination-customs swiper-pagination-customs-active"></span>';
						} else {
							paginationHtml += '<span class="swiper-pagination-customs"></span>';
						}
					}
					return paginationHtml;
				},
			}

		})

		var case_swiper = new Swiper('.case-swiper', {
			speed: 2000,
			direction: 'horizontal', // 垂直切换选项
			centeredSlides: true,
			autoplay: false,
			slidesPerView: 2,
			loop: true,
			spaceBetween: 36,
			navigation: {
				nextEl: ".swiper-button-next",
				prevEl: ".swiper-button-prev"
			}
		});

		var ry_swiper = new Swiper('.ry-swiper', {
			speed: 2000,
			direction: 'horizontal', // 垂直切换选项
			autoplay: false,
			slidesPerView: 4,
			loop: true,
			navigation: {
				nextEl: ".swiper-button-next",
				prevEl: ".swiper-button-prev"
			}
		});
		$(".item-box .item").hover(function () {//鼠标悬停在上面实现什么效果

			$(this).css("background", '#F5FBFA url("/img/bg_service_hover.png") no-repeat center center/100%');
			$(this).find(".title").css("color", "#12AA9C")
			$(this).find(".small-btn").addClass("active");
		}, function () {//鼠标离开实现什么功能
			$(this).css("background", '#F5FBFA');
			$(this).find(".title").css("color", "inherit")
			$(this).find(".small-btn").removeClass("active");
		});

		$(".more").hover(function () {//鼠标悬停在上面实现什么效果
			$(this).addClass("hover");

		}, function () {//鼠标离开实现什么功能
			$(this).removeClass("hover");
		});

		$(".expert-item").hover(function () {//鼠标悬停在上面实现什么效果
			$(this).find(".expert-info").addClass("active");

		}, function () {//鼠标离开实现什么功能
			$(this).find(".expert-info").removeClass("active");
		});

		$(".news-item").hover(function () {//鼠标悬停在上面实现什么效果

			$(".news-item").removeClass("active");
			$(".news-title").removeClass("active");
			$(".news-info").hide();

			$(this).addClass("active");
			$(this).find(".news-title").addClass("active");
			$(this).find(".news-info").show();

			let img = $(this).data("img");
			if (img) {
				$(".news-tab-item.selected img").attr('src', img);
			}
		}, function () {//鼠标离开实现什么功能
		});

		$(".news-tab ul li").click(function () {
			$(this).addClass("active").siblings().removeClass("active");

			let tabId = $(this).data("tabId");
			$(tabId).addClass("selected").siblings().removeClass("selected");

			$(".news-item").removeClass("active");
			$(".news-title").removeClass("active");
			$(".news-info").hide();
			let item = $(".news-tab-box .selected .news-item:first-child");
			item.addClass("active");
			item.find(".news-title").addClass("active");
			item.find(".news-info").show();
			let img = $(item).data("img");
			if (img) {
				$(".news-tab-item.selected img").attr('src', img);
			}
		})

		$("#footer").load("/footer.html");

		//$(".nav_menu").hide();
		$(".nav > ul > li").hover(function () {
			$(this).find(".menu_default").show();
		}, function () {
			$(this).find(".menu_default").hide();
		})

		$(".nav_menu > li").click(function () {
			let url = $(this).data("url")
			if (url) {
				location.href = url;
				//location.reload();
			}
		})
        window.onscroll = function(){
            if($(document).scrollTop()>$('.header-swiper').height()){
                $(".header-box").addClass('special')
                $('.nav .logo>img').attr('src','/img/logo2.png')
                // $('.header-box>div').css({'background-color':'#fff','border-bottom':'1px solid #E4EAE9'})
                $('.nav>ul>li>a').css('color','#1C2927')
                $('.userPhone>a').css('color','#1C2927')
                $('.cross>div>span>div').css('color','#1C2927')
                // $('.nav>ul .cross a').css('color','#1C2927')
                $('.nav>ul .cross div').css('color','#1C2927')
                $('.shopping>a>img').attr('src','/img/shop/icon_shop.png')
                $('.backToTop').css('display','block')
            }
            else
            {
                $(".header-box").removeClass('special')
                $('.nav .logo>img').attr('src','/img/logo_yxm_white.png')
                // $('.header-box>div').css({'background-color':'rgba(0, 47, 73, 0.34)','border-bottom':'none'})
                $('.nav>ul>li>a').css('color','#fff')
                $('.nav>ul .cross a').css('color','#fff')
                $('.nav>ul .cross div').css('color','#fff')
                $('.userPhone>a').css('color','#fff')
                $('.cross>div>span>div').css('color','#fff')
                $('.shopping>a>img').attr('src','/img/shop/icon_shop1.png')
                $('.backToTop').css('display','none')
            }
        }
	});

</script>

</body>

</html>
