﻿@media (min-width: 1200px) {

#foucsBox { margin: 0 auto; padding: 0; width: 370px; height: 260px; overflow: hidden; zoom: 1; position: relative; }
    #foucsBox .imgCon { width: 370px; height: 260px; margin: 0; padding: 0; position: relative; list-style: none; }
    #foucsBox .imgCon li { float: left; width: 370px; height: 260px; }
    #foucsBox .imgCon li img { border: 0; }
    #foucsBox .imgCon li .imgTitle { width: 370px; position: absolute; bottom: 18px; text-align: center; z-index: 2; }
    #foucsBox .imgCon li .imgTitle a { color: #fff; display: block; text-decoration: none; font-family: "Microsoft Yahei","宋体"; font-weight: normal; font-size: 15px; zoom: 1;}
    #foucsBox .showPage { width: 370px; height: 56px; position: absolute; bottom: 0; background: #000; opacity: 0.7; filter: alpha(opacity=60); z-index: 1;}
    #foucsBox .foucs { width: 370px; height: 22px; position: absolute; bottom: 3px; text-align: center; z-index: 3; }
    #foucsBox .foucs span { display: inline-block; width: 7px; height: 7px; margin: 0 5px; line-height: 0; font-size: 0; cursor: pointer; overflow: hidden; }
     /*#foucsBox .foucs span.f { background: url(bg.png) -170px -90px no-repeat; }*/     
            
    #foucsBox .btnHover { width: 146px; background: #408ED6; overflow: hidden; }
    #foucsBox .btnHover img { display: inline; }
}
@media (min-width: 768px) and (max-width:1200px){
    #foucsBox { margin: 0 auto; padding: 0; width: 100%; height: 260px; overflow: hidden; zoom: 1; position: relative; }
    #foucsBox .imgCon { width: 100%; height: 260px; margin: 0; padding: 0; position: relative; list-style: none; }
    #foucsBox .imgCon li { float: left; height: 260px; }
    #foucsBox .imgCon li img { border: 0; width: 100%}
    #foucsBox .imgCon li .imgTitle { position: absolute; bottom: 18px; text-align: center; z-index: 2; }
    #foucsBox .imgCon li .imgTitle a { color: #fff; display: block; text-decoration: none; font-family: "Microsoft Yahei","宋体"; font-weight: normal; font-size: 15px; zoom: 1;}
    #foucsBox .showPage { width: 100%; height: 56px; position: absolute; bottom: 0; background: #000; opacity: 0.7; filter: alpha(opacity=60); z-index: 1;}
    #foucsBox .foucs { width: 100%; height: 22px; position: absolute; bottom: 3px; text-align: center; z-index: 3; }
    #foucsBox .foucs span { display: inline-block; width: 7px; height: 7px; margin: 0 5px; line-height: 0; font-size: 0; cursor: pointer; overflow: hidden; }
    /*#foucsBox .foucs span.f { background: url(bg.png) -170px -90px no-repeat; }*/

    #foucsBox .btnHover { width: 146px; background: #408ED6; overflow: hidden; }
    #foucsBox .btnHover img { display: inline; }
}

@media (max-width: 767px) {
    #foucsBox { margin: 0 auto; padding: 0; width: 100%; height: 260px; overflow: hidden; zoom: 1; position: relative; }
    #foucsBox .imgCon { width: 100%; height: 260px; margin: 0; padding: 0; position: relative; list-style: none; }
    #foucsBox .imgCon li { float: left; height: 260px; }
    #foucsBox .imgCon li img { border: 0; width: 100%}
    #foucsBox .imgCon li .imgTitle { position: absolute; bottom: 18px; text-align: center; z-index: 2; }
    #foucsBox .imgCon li .imgTitle a { color: #fff; display: block; text-decoration: none; font-family: "Microsoft Yahei","宋体"; font-weight: normal; font-size: 15px; zoom: 1;}
    #foucsBox .showPage { width: 100%; height: 56px; position: absolute; bottom: 0; background: #000; opacity: 0.7; filter: alpha(opacity=60); z-index: 1;}
    #foucsBox .foucs { width: 100%; height: 22px; position: absolute; bottom: 3px; text-align: center; z-index: 3; }
    #foucsBox .foucs span { display: inline-block; width: 7px; height: 7px; margin: 0 5px; line-height: 0; font-size: 0; cursor: pointer; overflow: hidden; }
     /*#foucsBox .foucs span.f { background: url(bg.png) -170px -90px no-repeat; }*/     
            
    #foucsBox .btnHover { width: 146px; background: #408ED6; overflow: hidden; }
    #foucsBox .btnHover img { display: inline; }
}
