@import "style.css";
        body {
            background-color: #f2f9fe;
        }
        
        @media (min-width: 600px) {
            .EventListBox {
                display: block;
                position: relative;
                width: 100%;
                height: auto;
            }
            .EventListType {
                display: block;
                float: left;
                width: 400px;
            }
            .EventListType ul {
                margin: 0;
                padding: 0;
                display: block;
                width: 340px;
                background-color: #FFF;
                list-style: none;
                padding-bottom: 80px;
            }
            .EventListType li {
                display: block;
                margin: 0;
                padding: 0;
                width: 280px;
                margin-left: 30px;
                padding-top: 20px;
                padding-bottom: 20px;
                border-bottom: 1px solid #DDD;
                font-size: 18px;

            }
            .EventListType li p {
                margin: 0;
                padding: 0;
                width: 310px;
                margin-left: -30px;
                /* border: 1px solid #bbb; */
                border-left: 5px solid #FFF;
                line-height: 24px;
                text-indent: 0;                
            }
            .EventListType li p.now {
                border-left: 5px solid #F9BD00;
                font-weight: bold;
            }
            .EventListType li p.now a{
                
                font-weight: bold;
            }
            .EventListType li a {
                display: block;
                margin-left: 25px;
                color: #333;
                font-size: 18px;
            }
            .EventListRight {
                float: right;
                width: 730px;
            }
            .Show {
                display: block!important;
            }
            .EventListRight ul {
                list-style: none;
                margin: 0;
                padding: 0;
                display: none;
                width: 100%;
                margin-bottom: 50px;
            }
            .EventListRight li {
                list-style: none;
                margin: 0;
                padding: 0;
                display: block;
                width: 100%;
                min-height: 100px;
                border-bottom: 1px solid #ddd;
                margin-bottom: 20px;
            }
            .EventListRight li a {
                color: #333;
            }
            .EventListRight li p {
                margin: 0;
                padding: 0;
                display: block;
                width: 100%;
                line-height: 42px;
                font-size: 24px;
                font-weight: bold;
                color: #333;
            }
            .EventListRight li span {
                margin: 0;
                padding: 0;
                display: block;
                width: 100%;
                height: 40px;
                font-size: 16px;
                color: #999;
            }
        }
        /* 手机端 */
        
        @media (max-width: 600px) {
            .EventListBox {
                display: block;
                position: relative;
                width: 100%;
                height: auto;
            }
            .EventListType {
                display: none;
            }
            .EventListType ul {
                margin: 0;
                padding: 0;
                display: block;
                width: 340px;
                background-color: #FFF;
                list-style: none;
                padding-bottom: 80px;
            }
            .EventListType li {
                display: block;
                margin: 0;
                padding: 0;
                width: 280px;
                height: 75px;
                margin-left: 30px;
                padding-top: 20px;
                border-bottom: 1px solid #DDD;
                font-size: 18px;
            }
            .EventListType li p {
                display: block;
                width: 270px;
                margin-left: -30px;
                height: 40px;
                /* border: 1px solid #bbb; */
                border-left: 5px solid #FFF;
                line-height: 40px;
            }
            .EventListType li p.now {
                border-left: 5px solid #F9BD00;
            }
            .EventListType li a {
                margin-left: 30px;
                color: #333;
                font-size: 18px;
            }
            .EventListRight {
                margin-top: 30px;
                width: 100%;
            }
            .Show {
                display: block!important;
            }
            .EventListRight ul {
                list-style: none;
                margin: 0;
                padding: 0;
                display: none;
                width: 100%;
                margin-bottom: 50px;
            }
            .EventListRight li {
                list-style: none;
                margin: 0;
                padding: 0;
                display: block;
                width: 100%;
                min-height: 100px;
                border-bottom: 1px solid #ddd;
                margin-bottom: 20px;
            }
            .EventListRight li a {
                color: #333;
            }
            .EventListRight li p {
                margin: 0;
                padding: 0;
                display: block;
                width: 100%;
                line-height: 32px;
                font-size: 24px;
                font-weight: bold;
                margin-bottom: 10px;
                color: #333;
            }
            .EventListRight li span {
                margin: 0;
                padding: 0;
                display: block;
                width: 100%;
                height: 40px;
                font-size: 16px;
                color: #999;
            }
        }