@charset "utf-8";
body, h2, ul, h3 {
    padding: 0;
    margin: 0;
}

ul {
    list-style: none outside none;
}

/* 时间轴 */
@media only screen and (min-device-width: 800px) {
    .timeline {
        background: url("../images/about/line4.png") repeat-y 90px 0;
        position: relative;
        min-height: 100px;
        margin: 20px 10px;
        width: 720px;
        margin: 0px auto 0 40px;
    }

    .timeline-date {
        overflow: hidden;
        position: relative;
    }

    .timeline-date h2 {
        background: url("../images/about/icon9.png") no-repeat 10px 0;
        height: 87px;
        margin-bottom: 20px;
        margin-left: 55px;
    }

    .timeline-date h2 span {
        color: #7a7a7a;
        display: inline-block;
        font-size: 22px;
        margin: 10px 0px 0 80px;
        float: left;
    }

    .timeline-date ul li {
        background: url("../images/about/icon7.png") no-repeat 42px 5px;
        zoom: 1;
        height: 70px;
        margin-left: 42px;
    }

    .timeline-date ul li span {
        float: left;
        margin-top: 3px;
        display: block;
        margin-left: -50px;
        width: 100px;
        color: #878787;
        font-family: 'Microsoft YaHei', 微软雅黑, 'Microsoft JhengHei', 宋体;
        font-size: 14px;
    }

    .timeline-date ul li span.right {
        float: left;
        text-align: left;
        display: block;
        width: 600px;
        margin: 3px 0 5px 20px;
        color: #878787;
        font-family: 'Microsoft YaHei', 微软雅黑, 'Microsoft JhengHei', 宋体;
        font-size: 14px;
    }
}

@media only screen and (max-device-width: 800px) {
    .timeline {
        background: url("../images/about/line4.png") repeat-y 30% 0;
        position: relative;
        height: 100%;
        width: 100%;
        /*margin-top: 20px;*/
        width: 100%;

        top: 40px;
        z-index: -1;
    }

    .timeline-date { /*overflow: hidden;*/
        position: relative;
        width: 100%
    }

    .timeline-date ul {
        width: 100%;
    }

    .timeline-date h2 {
        background: url("../images/about/icon9.png") no-repeat 28.5% 0;
        height: 65px;
        line-height: 65px;
        background-size: 8%;
        margin-bottom: 10px;
        position: relative;

    }

    .timeline-date h2 span {
        color: #7a7a7a;
        color: #7a7a7a;
        display: inline-block;
        font-size: 100%;
        margin: 0 0px 4px 40%;
        float: left;
    }

    .timeline-date ul li {
        background: url(../images/about/icon7.png) no-repeat 29.5% 10%;
        zoom: 1;
        margin-top: 40px;
        position: relative;
        overflow: auto;
    }

    .timeline-date ul li:after {
        content: '.';
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }

    .timeline-date ul li span {
        color: #878787;
        font-family: 'Microsoft YaHei', 微软雅黑, 'Microsoft JhengHei', 宋体;
        font-size: 100%;
    }

    .about-left {
        margin-left: 10px;
    }

    .timeline-date ul li span.right {
        float: left;
        left: 40%;
        text-align: left;
        display: block;
        width: 60%;
        height: 100%;
        margin: 0 0 5px 0;
        color: #878787;
        font-family: 'Microsoft YaHei', 微软雅黑, 'Microsoft JhengHei', 宋体;
        font-size: 100%;
        min-height: 50px;
    }

    .about-right {
        float: right;
        width: 60%;
        text-align: justify;
    }

    .timeline-date {
        margin-bottom: 55px;
    }
}

@media only screen and (max-device-width: 600px) {
    .timeline-date h2 {
        background: url("../images/about/icon9.png") no-repeat 28.5% 0;
        height: 45px;
        line-height: 1.5;
        background-size: 8%;
        margin-bottom: 10px;
        position: relative;
    }

    .timeline-date {
        margin-bottom: 55px;
    }
}