/*公共*/
.product_title {
    background: url("../images/prodbg.png") center center no-repeat;
    background-size: 100% 100%;
    height: 430px;
}


[name="product620"] {
    height: 620px;
    display: inline-block;
    width: 100%;
}

.product_log {
    width: 100px;
    height: 100px;
    margin-bottom: 30px;
    display: inline-block;
}

.product_log_content {
    text-align: center;
    display: inline-block;
    height: auto;
}

.product_content {
    margin: 0 auto;
    display: inline-block;
    height: 100%;
    width: 100%;
}

/*疫情同小区*/
#yqtxq {
    background: url("../images/shape.png") no-repeat;
}

#yqlogo {
    width: 27%;
    margin-top: 205px;
}

.product_content span {
    color: #4A4A4A;
    font-size: 24px;
    line-height: 30px;
    display: block;
}

#yqcontent {
    float: right;
}

/*每日一报*/
#mryb {
    background: rgba(246, 249, 253, 1);
}

#mrlogo {
    width: 27%;
    margin-top: 188px;
    float: right;
}

#mrybcontent {
    float: left;
}

/*统一邮件*/
#tylogo {
    width: 27%;
    margin-top: 245px;
    float: left;
}

#tycontent {
    float: right;
    width: 70%;
}

/*通讯录*/
#txl {
    background: rgba(246, 249, 253, 1);
}

#txlogo {
    width: 27%;
    margin-top: 245px;
    float: right;
}

#txlcontent {
    margin-top: 50px;
    float: left;
    width: 70%;
}

/*北教*/
#bjelogo {
    width: 27% !important;
    margin-top: 222px;
    float: left;
}

#bjecontent {
    float: right;
}

/*国网*/
#gw {
    background: rgba(246, 249, 253, 1);
}

#gwcontent {
    margin-top: 50px;
    float: left;
    width: 70%;
}

#gwlogo {
    width: 27%;
    margin-top: 240px;
    float: right;
}

/*other*/
[name="other_product"] {
    background: url("../images/decoicon.png") no-repeat;
    display: inline-block;
    width: 819px;
    padding-left: 35px;
    font-size: 18px;
    margin-bottom: 29px;
    height: 30px;
}

#content_content {
    background: url("../images/shape2.png") no-repeat;
}

#content {
    padding-top: 55px;
    background: url("../images/shape1.png") 100% -18% no-repeat;
}


@media (min-width: 1200px) {

    @keyframes bounceInLeft {
        0% {
            transform: translate3d(-3000px, 0, 0);
        }
        60% {
            transform: translate3d(25px, 0, 0);
        }
        75% {
            transform: translate3d(-10px, 0, 0);
        }
        90% {
            transform: translate3d(5px, 0, 0);
        }
        100% {
            transform: none;
        }
    }
    @keyframes bounceInRight {
        0% {
            transform: translate3d(3000px, 0, 0);
        }
        60% {
            transform: translate3d(-25px, 0, 0);
        }
        75% {
            transform: translate3d(10px, 0, 0);
        }
        90% {
            transform: translate3d(-5px, 0, 0);
        }
        100% {
            transform: none;
        }
    }

    @-webkit-keyframes bounceInLeft {
        0% {
            transform: translate3d(-3000px, 0, 0);
        }
        60% {
            transform: translate3d(25px, 0, 0);
        }
        75% {
            transform: translate3d(-10px, 0, 0);
        }
        90% {
            transform: translate3d(5px, 0, 0);
        }
        100% {
            transform: none;
        }
    }
    @-webkit-keyframes bounceInRight {
        0% {
            transform: translate3d(3000px, 0, 0);
        }
        60% {
            transform: translate3d(-25px, 0, 0);
        }
        75% {
            transform: translate3d(10px, 0, 0);
        }
        90% {
            transform: translate3d(-5px, 0, 0);
        }
        100% {
            transform: none;
        }
    }

    #yqtxq, #tyyj, #bje {
        animation: bounceInRight 1s;
        animation-fill-mode: forwards
    }

    #mryb, #txl, #gw {
        animation: bounceInLeft 1s;
        animation-fill-mode: forwards
    }
}

@media (min-width: 769px) {
    .max_content {
        display: block;
    }

    .min_content {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .max_content {
        display: none !important;
    }

    .min_content {
        display: block;
        margin-bottom: -10px;
    }

    html {
        overflow-x: hidden;
    }

    .page_title {
        margin-top: 77px;
    }

    .product_title {
        background: url("../images/prosm.png") center center no-repeat !important;
    }

    .container {
        margin-top: 0px;
        margin-right: 5px;
        margin-left: 5px;
    }

    .product_title {
        height: 290px;
    }

    .page_title span:nth-child(1) {
        display: inline-block;
        margin-bottom: 12px;
        width: 70px;
        height: 2px;
        background: #fff;
        border-radius: 1px;
    }

    .page_title span:nth-child(3) {
        display: inline-block;
        margin-bottom: 12px;
        width: 70px;
        height: 2px;
        background: #fff;
        border-radius: 1px;
    }

    [name="product620"] {
        height: auto;
        display: inline-block;
        width: 100%;
    }

    .product_log {
        width: 50% !important;
        height: 50% !important;
        margin-bottom: 10px;
    }

    #bjelogo {
        width: 100px !important;
    }



    .product_content {
        height: 100%;
        width: 100%;
    }

    /*疫情同小区*/
    #yqtxq {
        background-size: 25%;
        background-position-y: -36px;
    }

    #yqlogo {
        width: 30%;
        margin-top: 50px;
    }

    .product_content span {
        color: #4A4A4A;
        font-size: 10px;
        line-height: 30px;
        display: block;
    }

    #yqcontent {
        float: right;
        display: inline-block;
        width: 70%;
    }

    #yqcontent > img {
        width: 100% !important;
        height: 100% !important;
    }

    /*每日一报*/
    #mrlogo {
        width: 30%;
        margin-top: 80px;
        float: right;
    }

    #mrybcontent {
        float: left;
        display: inline-block;
        width: 60%;
    }

    #mrybcontent > img {
        width: 100% !important;
        height: 100% !important;
    }

    /*统一邮件*/
    #tylogo {
        width: 30%;
        margin-top: 45px;
        float: left;
    }

    #tycontent {
        float: right;
        display: inline-block;
        width: 70%;
    }

    #tycontent > img {
        width: 100% !important;
        height: 100% !important;
    }

    /*通讯录*/
    #txlogo {
        width: 36%;
        margin-top: 45px;
        float: right;
    }

    #txlcontent {
        float: left;
        display: inline-block;
        width: 60%;
    }

    #txlcontent > img {
        width: 100% !important;
        height: 100% !important;
    }

    /*北教*/
    #bjelogo {
        width: 30%;
        margin-top: 70px;
        float: left;
    }

    #bjecontent {
        float: right;
        display: inline-block;
        width: 70%;
    }

    #bjecontent > img {
        width: 100% !important;
        height: 100% !important;
    }

    /*国网*/
    #gw {
        background: rgba(246, 249, 253, 1);
    }

    #gwcontent {
        margin-top: 25px;
        float: left;
        display: inline-block;
        width: 60%;
    }

    #gwcontent > img {
        width: 100% !important;
        height: 100% !important;
    }

    #content_content {
        height: 150px !important;
    }

    #gwlogo {
        width: 35%;
        margin-top: 40px;
        float: right;
    }

    #gwlogo > img {
        width: 80% !important;
        height: 80% !important;
    }

    /*other*/
    [name="other_product"] {
        background: url("../images/decoicon.png") no-repeat;
        background-size: 15px;
        display: inline-block;
        padding-left: 20px;
        font-size: 10px;
        white-space: normal;
        width: 90%;
        margin-bottom: 10px;
        line-height: 15px;
        height: auto;
    }

    #content {
        padding-top: 20px;
        background-size: 25%;
        background-position: 100% 565%;
    }
}