﻿@media screen and (max-width: 768px) {
    .container {
        width: 100%;
        overflow: hidden;
    }

    div.container .topImgs {
        height: 240px;
background: url(/hnzm/xhtml/./image/top_img_mobile.png) no-repeat;
    background-size: 100% 100%;
    }
div.content{height:unset;}
    div.content .main {
        min-width: unset !important;
        width: 96% !important;
    padding: 10px 0 30px;
    }
div.intro{margin-top: 10px;
    flex-direction: column;
    height: unset;}

    .content .tabs {
        width: 100% !important;
    }

    .infos>img {
        width: 100%;
    }

    .footer {
        width: 100%;
        overflow: hidden;
    }

    div.content .tabs p i:nth-child(1) {
        left: 14px;
        bottom: -8px;
    }

    div.content .tabs p i:nth-child(3) {
        right: 14px;
        top: -6px;
    }

    div.intro>div:first-child {
        width: 100%;
        padding: 10px;
    }

    div.intro>div:first-child>span {
        font-size: 14px;
    }

    div.intro>div:first-child>p:nth-child(2) {
        font-size: 12px;
        margin: 10px 0;
    }

    div.intro>div:first-child>p:nth-child(3) {
        font-size: 12px;
        line-height: 24px;
overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    }

    div.intro>div:nth-child(2) {
        width: 100%;
        padding: 8px;
    }

    div.intro>div:nth-child(2)>span {
        font-size: 14px;
    }

    div.intro>div:nth-child(2) ul li {
        font-size: 12px;
        display: flex;
    }

    div.intro>div:nth-child(2) ul li label {
        
    }
div.infos{padding: 10px;}
div.infos>.info{margin-top: 0;
    width: 100%;
    border: none;
    box-shadow: none;
    position: relative;}
div.info>img:nth-child(1){transform: scale(1);
    left: 0%;
    top: -50px;
    width: 100px;}
div.info>img:nth-child(2){    transform: scale(1);
    width: 100px;
    right: -25px;
    bottom: -60px;}
div.info .infoContent{padding: 30px 10px;}
div.info .infoContent .item{height: 345px;}
div.info .infoContent .item .ptitle{margin-top: 10px;}
div.info .infoContent .ptxt{text-indent:2em;}
div.topImgs .left{display:none;}
div.topImgs .right{display:none;}
div.topImgs .left.lmobile{width: 62%;display:unset !important;}
div.topImgs .left.lmobile img{    transform: scale(0.5);
    right: -70%;
    bottom: -25%;}
div.topImgs .right.rmobile{display:unset !important;}
div.topImgs .right.rmobile{right: -170%;
    top: -25%;
    transform: scale(0.5);}
div.info .infoContent .item{width:48%;height: 240px;}
div.info .infoContent .item div{height: 110px;}
div.infoContent .awards span{width:100%;font-size:14px;}
div.infoContent .title .txtps{right: -99px;transform: scale(0.8);}
img#coverImg{        width: 100%;
    height: 100%;}
div.swipertxt{width: 80%;
    height: 28%;
    overflow: auto;}
div.download p{    margin-top: 20px;margin-bottom:20px;}

            
            .final .ltcam,
            .final .rbcam {
                display: none;
            }

            .final .info .infoContent>div {
                box-sizing: border-box;
                /* padding: 40px 20px 20px; */
                display: block;
                white-space: nowrap;
                width: 320px;
                padding-left: 10px;
                padding-bottom: 0;
            }

            .final div.info .infoContent .top1 .item {
                width: 300px !important;
                opacity: 0;
            }

            .final div.info .infoContent .top2 .item {
                width: 145px !important;
                opacity: 0;
                margin-right: 5px;
            }

            .final div.info .infoContent .top3 .item {
                width: 145px !important;
                opacity: 0;
                margin-right: 5px;
            }

            .final div.info .infoContent .top100 .item {
                width: 145px !important;
                opacity: 0;
                margin-right: 5px;
            }

            .final div.info .infoContent .item.on {
                opacity: 1;
            }

            .final div.info .infoContent .item img {
                display: none;
            }

            .final div.info .infoContent .item.on img {
                display: unset;
            }

            .final div.info .infoContent>div>i {
                display: unset !important;
            }

            .final div.info .infoContent .top1>i,
            .final div.info .infoContent .top2>i,
            .final div.info .infoContent .top3>i,
            .final div.info .infoContent .top100>i {
                position: absolute;
                top: 48%;
                font-size: 30px;
                left: 6px;
                color: #0358c7;
                font-weight: bold;
                opacity: 0.5;
                z-index: 999;
            }

            .final div.info .infoContent .top1>i.on,
            .final div.info .infoContent .top2>i.on,
            .final div.info .infoContent .top3>i.on,
            .final div.info .infoContent .top100>i.on {
                opacity: 1;
            }

            .final div.info .infoContent .top1>i.righticon,
            .final div.info .infoContent .top2>i.righticon,
            .final div.info .infoContent .top3>i.righticon,
            .final div.info .infoContent .top100>i.righticon {
                left: unset;
                right: 6px;
            }

            .final .items {
                transition: all 1s;
                position: relative;
                left: 0;
                flex-wrap: nowrap !important;
            }

            .final .info .infoContent .top100 {
                height: 300px !important;
            }

            .final .info .infoContent .top100 .items {
                display: inline-block;
                width: 1495px;
                height: 100%;
            }

            .final .info .infoContent .top100 .item {
                position: absolute !important;
                height: 110px !important;
                left: unset;
                top: unset;
            }

            .info .infoContent .top100 .item p {
                display: none !important;
            }
div.covImg,p.imgNum{
    width: 80% !important;
}
.covImg i.icon-jiantou{
    left: -40px !important;
}
.covImg i.icon-jiantou-copy{
    right: -40px !important;
}
div.swipertxt p:nth-child(4){
font-size:12px !important;text-align:left;    padding: 10px 20px;
    margin: 20px auto;
}
}