.body {
            background: #f8f8f8;
        }

        p, span, h2, strong, li {
            user-select: none;
        }

        .header-bg {
            background-image: url("/static/images/second_level/com-dh-bg.jpg");
            display: block;
            background-repeat: no-repeat;
            padding-bottom: 30%;
            width: 100%;
            background-position: center center;
            background-size: cover;
        }

        .content {
            width: 80%;
            margin: auto;
            margin-top: 4%;
            margin-bottom: 4%;

        }

        .content-dh {
            margin-top: 4%;
            margin-bottom: 4%;
            font-size: 2.5rem;
            font-weight: 600;
            text-align: center;
            color: #333333;
        }

        .content-text {
            text-indent: 2rem;
            width: 100%;
            margin: auto;
        }

        .call_map {
            height: 384px;
            width: 60%;
            float: left;
        }

        .call_text {
            width: 40%;
            padding-left: 4%;
            float: left;
        }

        .call_text li {
            margin-top: 1rem;
        }

        .call_text li {
            margin-right: .5rem;
        }

        .qy-content {
            width: 100%;
            margin: auto;
            border-radius: 19px;
            background-color: #f6f6f6;
            margin-bottom: 20px;
            font-size: 0.9rem;
        }

        .qy-content h2 {
            font-weight: 600;
            font-size: 1.5rem;
        }

        .qy-tittle, .qy-text {
            margin-left: 3%;
            margin-right: 3%;
        }

        .qy-tittle {
            padding-top: 2%;
            padding-bottom: 2%;
        }

        .qy-text ul {
            padding-bottom: 2%;
            margin: 0;
        }

        .com-img {
            background-image: url(/static/images/com/1.jpg);
            display: block;
            background-repeat: no-repeat;
            padding-bottom: 30%;
            width: 100%;
            background-position: center center;
            background-size: cover;

        }

        #about .content-text {
            width: 100%;
            font-size: 1rem;
            border-radius: 19px;
            background-color: #f6f6f6;

        }

        #about p {
            padding: 10px;

        }

        .skillpower ul {
            width: 100%;
            margin: auto;
        }

        .skillpower li {
            float: left;
            width: 23%;
            margin-right: 1%;
            margin-left: 1%;
            height: 100%;
            border-radius: 19px;
            background-color: #f6f6f6;
        }

        .skillpower-list1 {
            width: 50%;
            padding-bottom: 75%;
            margin: auto;
            background-position: center center;
            background-size: contain;
            background-repeat: no-repeat;
            background-image: url("/static/images/logo/com_info/1.png");
        }

        .skillpower-list2 {
            width: 50%;
            padding-bottom: 75%;
            margin: auto;
            background-position: center center;
            background-size: contain;
            background-repeat: no-repeat;
            background-image: url("/static/images/logo/com_info/2.png");
        }

        .skillpower-list3 {
            width: 50%;
            padding-bottom: 75%;
            margin: auto;
            background-position: center center;
            background-size: contain;
            background-repeat: no-repeat;
            background-image: url("/static/images/logo/com_info/3.png");
        }

        .skillpower-list4 {
            width: 50%;
            padding-bottom: 75%;
            margin: auto;
            background-position: center center;
            background-size: contain;
            background-repeat: no-repeat;
            background-image: url("/static/images/logo/com_info/4.png");
        }

        .skill-text {
            width: 80%;
            margin: auto;
            text-align: center;
            padding-bottom: 5%;
        }

        .skill-text span {
            font-size: 1.5rem;
            margin-bottom: 1rem;
            user-select: none;
        }

        .skill-text p {
            font-size: 0.5rem;
            margin-top: 0.5rem;
            user-select: none;
        }

        .soft-img {
            float: left;
            width: 100%;
        }

        .soft-hover-left,.soft-hover-right {
            width: 10.5%;
            margin-left: 1%;
            margin-right: 1%;
            float: left;
            display: block;
        }

        #pic {
            position: absolute;
            z-index: 10;
            display: none;
        }

        #pic1 {
            width: 400px;
            border-radius: 5px;
            -webkit-box-shadow: 5px 5px 5px 5px hsla(0, 0%, 5%, 1.00);
            box-shadow: 5px 5px 5px 0px hsla(0, 0%, 5%, 0.3);
        }
        .cert-header{
            margin-top: 20px;
            margin-bottom: 30px;
            text-align: center;
            font-size: 1.5rem;
        }