caimei365-www/src/main/resources/static/css/single-page/topic.css

@charset "utf-8";
li{list-style:none}
/**
 * PC端
 */
@media screen and (min-width:768px){
    .pageTop{width:1184px;margin:0 auto;background:#FFF}
    .pageTop img{width:100%;height:auto}
    .pageTop p{padding:16px;color:#93979F;font-size:16px;line-height:26px}

    .pageFloor .title{height:24px;line-height:24px;padding-left:10px;border-left:4px solid #E15616;margin:32px 0 16px 0;font-size:24px;color:#4A4F58;font-weight:bold;text-align:left;position: relative;}
    .pageFloor .title .more {float:right;color:#627386;font-size:18px;font-weight:normal;}
    .pageFloor .title .more:hover{color:#E15616}
    .pageFloor .title .talk_link{display: block;width: 120px;height: 40px;border-radius: 2px;border: 1px solid #E15616;background-color: #ffe6dc;line-height: 40px;text-align: center;font-size: 14px;color: #E15616;position: absolute;right: 0;top: -16px;}
    .pageFloor .content{width:1202px;}
    .pageFloor .content li{float:left;width:284px;height:334px;margin:0 16px 16px 0;background:#FFF}
    .pageFloor .content li img{display:block;width:284px;height:284px}
    .pageFloor .content li span{display:block;height:50px;line-height:50px;padding:0 10px;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#93979F;font-size:16px}
    .pageFloor .content li:hover{box-shadow:0 2px 6px #dedede;transition:all 0.5s;-webkit-transition:all 0.5s}
    .pageFloor .content li:hover span{color:#E15616}

    .contactBox{width:100%;background:#FFF;margin-bottom:-29px;padding-bottom:15px}
    .contactBox .tit{position:relative;width:1184px;margin:0 auto;height:80px}
    .contactBox .tit:before{content:'';position:absolute;left:0;top:39px;width:100%;border-top:1px solid #FFE6DC}
    .contactBox .tit span{width:188px;height:80px;line-height:80px;background:#FFF;position:absolute;top:0;left:50%;margin-left:-94px;font-weight:bold;font-size:28px;color:#2D3036;text-align:center}
    .contactBox .cont{width:1184px;margin:0 auto;text-align:center;line-height:48px}
    .contactBox .cont span{display:inline-block;padding-left:84px;height:96px;text-align:left;font-size:24px;color:#2D3036;position:relative}
    .contactBox .cont .call{margin-right:160px}
    .contactBox .cont span:before{width:70px;height:70px;position:absolute;left:0;top:10px}
    .contactBox .cont .call:before{background-position:-82px -370px}
    .contactBox .cont .phone:before{background-position:0 -370px}
    .section_page_more{
        width: 100%;
        height: 32px;
        margin-top: 16px;
        margin-bottom: 30px;
    }
    .section_page_more .more{
        width: 98px;
        height: 32px;
        line-height: 32px;
        font-size: 14px;
        margin:  0 auto;
        border-radius: 2px;
        border: 1px solid #cccccc;
        color: #909090;
        text-align: left;
        transition: all 0.2s;
        cursor: pointer;
        padding-left: 15px;
        box-sizing: border-box;
        position: relative;
        display: block;
    }
    .section_page_more .more .icon:before{
        background-position: -93px 7px;
        width: 20px;
        height: 32px;
        right: 0;
        position: absolute;
    }
    .section_page_more .more:hover{
        color: #E15616;
        border-color: #E15616;
    }
    .section_page_more .more:hover .icon:before{
        background-position: -153px 7px;
    }
}

/**
* 移动端
*/
@media screen and (max-width:768px){
    .pageTop{width:100%;background:#FFF}
    .pageTop img{display:block;width:93.4vw;height:auto;margin:0 auto;}
    .pageTop p{width:93.4vw;margin:0 auto;padding:4vw 0 1vw 0;color:#4a4f58;font-size:3vw;line-height:5.8vw;text-align:justify;}

    .pageFloor{width:100%;overflow:hidden;margin:0 auto;}
    .pageFloor .title{height:10vw;line-height:10vw;font-size:3.7vw;color:#4A4F58;font-weight:bold;text-align: left;}
    .pageFloor .content{width:100vw;margin-left: 3.2vw}
    .pageFloor .content li{float:left;width:45.4vw;height:55.2vw;margin:0 2.6vw 2.6vw 0;background:#FFF}
    .pageFloor .content li img{display:block;width:45.4vw;height:45.4vw}
    .pageFloor .content li span{display:block;height:9.8vw;line-height:9.8vw;padding:0 1vw;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#4a4f58;font-size:3.4vw;text-align: center}

    .contactBox{width:100%;background:#FFF;margin: 0 auto 2.6vw;}
    .contactBox .tit{position:relative;width:100%;margin:0 auto;height:11.8vw}
    .contactBox .tit:before{content:'';position:absolute;left:0;top:5.9vw;width:100%;border-top:1px solid #FFE6DC}
    .contactBox .tit span{width:27.6vw;height:11.8vw;line-height:11.8vw;background:#FFF;position:absolute;top:0;left:50%;margin-left:-13.8vw;font-weight:bold;font-size:3.7vw;color:#2D3036;text-align:center}
    .contactBox .cont{width:100%;margin:0 auto;text-align:center}
    .contactBox .cont span{display:inline-block;width:100%;height:14vw;line-height:7vw;font-size:3.1vw;color:#2D3036;position:relative;text-align:left;padding-left:40vw;box-sizing:border-box;margin-bottom:2.6vw}
    .contactBox .cont span:before{width:9.4vw;height:9.4vw;position:absolute;left:28vw;top:2vw}
    .contactBox .cont .call:before{background-position:-61vw -17vw}
    .contactBox .cont .phone:before{background-position:-73vw -17vw}
    .pageFloor .title span{padding-left: 3.2vw}
    .pageFloor .talk_link{position: fixed;bottom: 0;display: block;background: #e15616;width: 100%;color: #fff;height: 11.8vw;line-height: 11.8vw;text-align: center;z-index: 1;}
    .pageFloor .title .more{float: right;margin-right: 3.2vw;color: #999999;font-weight: normal;}
    .section_page_more .more{
        width: 20vw;
        height: 6.4vw;
        margin: 5vw auto;
        border: .27vw solid #cccccc;
        color: #909090;
        font-size: 3vw;
        line-height: 6.4vw;
        border-radius: .54vw;
        position: relative;
        text-indent: 2vw;
        display: block;
    }
    .section_page_more .more .icon:before {
        background-position: -51.5vw 0px;
        width:5.4vw;
        height: 6.7vw;
        right: 0;
        position: absolute;
    }

}