酷狗官网

最新推荐文章于 2021-03-10 07:13:38 发布

「已注销」

最新推荐文章于 2021-03-10 07:13:38 发布

阅读量1.8k

点赞数 2

分类专栏： html+css 文章标签： html

本文链接：https://blog.csdn.net/RanAzhe/article/details/67689542

版权

html+css 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>

<head>
  <meta charset="UTF-8">
  <title>酷狗音乐</title>
</head>
<link rel="stylesheet" type="text/css" href="CSS/reset.css" />
<link rel="stylesheet" type="text/css" href="CSS/kugou.css" />
<!--1.href.src.url的提示，需要安装什么插件？？？？-->
<!--2.怎样才能看出来link标签起作用了即添加成功了？-->
<body>
  <div class="mainPage">
    <!--header部分开始-->
    <div class="header">
      <h1 class="logo"><a  href="http://www.kugou.com/"></a></h1>
      <div class="search_wrapper top_search">
        <div class="search_input">
          <input type="text">
          <div class="searh_btn">
            <i class="search_icon"></i>
          </div>
        </div>
      </div>
      <div class="topNav fr">
        <ul>
          <li><a target="_blank" href="http://www.kugou.com/shop/help/serviceCenter">客服中心</a></li>
          <li><a target="_blank" href="http://www.kugou.com/job/hr/html/index.html">招贤纳士</a></li>
          <li><a target="_blank" href="http://vip.kugou.com/">会员中心 </a></li>
        </ul>
        <div class="login_area">
          <div  class="clearfix">
            <a class="login_btn" >登录</a>
            <a class="regin_btn" >注册</a></div>

        </div>
      </div>
    </div>
    <!--nav部分开始-->
    <div class="nav">
      <div class="navMin">
        <ul class="menuBox">
          <li><a style="background-color:#0c8ed9;">首页</a></li>
          <li><a>榜单</a></li>
          <li><a>下载客户端</a></li>
          <li class="b">
            <a class="more">更多</a>
            <ul class="b" style="z-index: 999;">
              <li><a>电台</a></li>
              <li><a>MV</a></li>
              <li><a>歌单</a></li>
              <li><a>歌手</a></li>
            </ul>
          </li>
        </ul>
        <div class="subNav">
          <a class="subNav-Btn1" href="#">音乐直播</a>
          <a class="subNav-Btn2" href="#">酷狗LIVE</a>
          <a class="subNav-Btn3" href="#">音乐人</a>
          <a class="subNav-Btn4" href="#">游戏</a>
          <a class="subNav-Btn5" href="#">商城</a>
        </div>
      </div>
    </div>
    <!--banner部分开始-->
    <div class="banner" style="width:1349px;">  <!--为什么style="width:1349px;这样写可以而在CSS中设宽度为1349px就不行？？？？-->
      <div class="bannerMin" style="width:1349px;"></div>
      <a class="prev-icon"></a>
      <a class="next-icon"></a>
      <div class="PagesMin">
        <div>
          <a></a>
          <a></a>
          <a></a>
          <a></a>
          <a style="background-position: 0 -37px;"></a>
          <a></a>
        </div>
      </div>
    </div>

    <!--style="width:1349px;为浏览器的宽度，-->
    <!--nav2部分开始-->
    <div class="banner-cover"></div>
    <div class="nav2">
      <ul class="nav2-box">
        <li class="nav2-btn1"><a href="#">下载PC版</a></li>
        <li class="nav2-btn2"><a href="#">下载Iphone版</a></li>
        <li class="nav2-btn3"><a class="noborder" href="#">下载Android版</a></li>
      </ul>
    </div>
    <!--mainMin部分开始-->
    <div class="main">
      <div class="mainMin clearfix">
        <div class="mainLeft">
          <!--精选歌单-->
          <!--itemTitle部分-->
          <div class="itemTitle clearfix">
            <h3><b>精选</b>歌单</h3>
            <a class="more">更多</a>
          </div>
          <!--productMin部分-->
          <div class="productMin clearfix">
            <div class="productBig productLeft">
              <p class="topTxt">
                <span class="topTxt-icon"></span>
                <span class="num">2279.2万</span>
              </p>
              <img src="img/product-img1.jpg" />
              <div class="cover">
                <div class="playBtn"></div>
              </div>
              <div class="bottomTxt">
                <p>回忆是种揪心的痛</p>
                <p>WITHOUTME</p>
              </div>
            </div>
            <div class="productMid productLeft">
              <p class="topTxt">
                <span class="topTxt-icon"></span>
                <span class="num">2279.2万</span>
              </p>
              <img src="img/product-img2.jpg" />
              <div class="cover">
                <div class="playBtn"></div>
              </div>
              <div class="bottomTxt">
                <p>一定听过的经典网络红歌</p>
                <p>精灵龙</p>
              </div>
            </div>
            <div class="productMid productLeft">
              <p class="topTxt">
                <span class="topTxt-icon"></span>
                <span class="num">2279.2万</span>
              </p>
              <img src="img/product-img3.jpg" />
              <div class="cover">
                <div class="playBtn"></div>
              </div>
              <div class="bottomTxt">
                <p>一人一首古风曲</p>
                <p>蝶舞清风</p>
              </div>
            </div>
            <div class="productMid productLeft">
              <p class="topTxt">
                <span class="topTxt-icon"></span>
                <span class="num">2279.2万</span>
              </p>
              <img src="img/product-img4.jpg" />
              <div class="cover">
                <div class="playBtn"></div>
              </div>
              <div class="bottomTxt">
                <p>《超强音浪》合辑</p>
                <p>蒽蒽</p>
              </div>
            </div>
            <div class="productMid productLeft">
              <p class="topTxt">
                <span class="topTxt-icon"></span>
                <span class="num">2279.2万</span>
              </p>
              <img src="img/product-img5.jpg" />
              <div class="cover">
                <div class="playBtn"></div>
              </div>
              <div class="bottomTxt">
                <p>谱写一个人的单恋曲</p>
                <p>鱼哭了</p>
              </div>
            </div>
          </div>
        </div>
        <div class="mainRight clearfix">
          <div class="itemTitle">
            <h3><b>热门</b>榜单</h3>
            <a class="more">更多</a>
          </div>
          <ul class="mainRightMin clearfix">
            <li class="mainRightList">
              <div class="pic"><img style="width:98px; height:98px;" src="img/mainRight-pic1.jpg" /></div>
              <div class="cover">
                <div class="playBtn"></div>
              </div>
              <div class="mainRight-content">
                <dl style="display:inline-block">
                  <dt>酷音乐流行风向标</dt>
                  <dd>1 . 郁可唯 - 思</dd>
                  <dd>2 . 香香 - 就算没有</dd>
                </dl>
              </div>
            </li>
            <li class="mainRightList">
              <div class="pic"><img style="width:98px; height:98px;" src="img/mainRight-pic2.jpg" /></div>
              <div class="cover">
                <div class="playBtn"></div>
              </div>
              <div class="mainRight-content">
                <dl style="display:inline-block">
                  <dt>酷音乐流行风向标</dt>
                  <dd>1 . 郁可唯 - 思</dd>
                  <dd>2 . 香香 - 就算没有</dd>
                </dl>
              </div>
            </li>
            <li class="mainRightList">
              <div class="pic"><img style="width:98px; height:98px;" src="img/mainRight-pic3.jpg" /></div>
              <div class="cover">
                <div class="playBtn"></div>
              </div>
              <div class="mainRight-content">
                <dl style="display:inline-block">
                  <dt>酷音乐流行风向标</dt>
                  <dd>1 . 郁可唯 - 思</dd>
                  <dd>2 . 香香 - 就算没有</dd>
                </dl>
              </div>
            </li>
          </ul>
        </div>
      </div>
    </div>
    <!--main2部分开始-->
    <div class="main2" ">
	<div class="main2Min "><img style="height:80px; width:1000px " src="img/main2-pic.jpg "/></div>
</div>
<!--main3部分开始-->
<div class="main3 ">
	<div class="main3Min ">
    	<div class="main3-left ">
        	<div class="itemTitle main3Bottom clearfix ">
                <h3><b>新歌</b>首发</h3>
                <div class="itemTitle-menu ">
                  <span class="menuItem " style="color:#009af3;">华语</span>
                  <span class="menuItem ">欧美</span>
                  <span class="menuItem ">韩国</span>
                  <span class="menuItem ">日本</span>
                </div>

                <bottom class="playAll ">
                  <span class="icon-play "></span>
                  <em>全部播放</em>
                </bottom>
                <div class="clear "></div>
             </div>
             <ul>
             	<li>
                	<a class="main3-left-l ">徐良 - 简单的温热【不一样的美男子2插曲】</a>
                  <span class="icon-play "></span>
                  <span class="icon-download "></span>
                  <span class="icon-share " style="display:none "></span>
                  <a class="main3-left-R " style="margin-right:10px; ">03:52</a>
              </li>
              <li>
                	<a class="main3-left-l ">金志文 - 迷途之光</a>
                  <span class="icon-play "></span>
                  <span class="icon-download "></span>
                  <span class="icon-share "></span>
                  <a class="main3-left-R " style="margin-right:10px; ">04:54</a>
              </li>
              <li>
                  <a class="main3-left-l ">许嵩、洛天依 - 深夜书店</a>
                  <span class="icon-play "></span>
                  <span class="icon-download "></span>
                  <span class="icon-share " style="display:none "></span>
                  <a class="main3-left-R " style="margin-right:10px; ">03:24</a>
              </li>
              <li>
                  <a class="main3-left-l ">张信哲 - 好好爱个女孩</a>
                  <span class="icon-play "></span>
                  <span class="icon-download "></span>
                  <span class="icon-share " style="display:none "></span>
                  <a class="main3-left-R " style="margin-right:10px; ">02:58</a>
              </li>
              <li>
                  <a class="main3-left-l ">张碧晨 - 红玫瑰</a>
                  <span class="icon-play "></span>
                  <span class="icon-download "></span>
                  <span class="icon-share "></span>
                  <a class="main3-left-R " style="margin-right:10px; ">04:34</a>
              </li>
              <li>
                  <a class="main3-left-l ">许佳慧 - 从未开口的秘密</a>
                  <span class="icon-play "></span>
                  <span class="icon-download "></span>
                  <span class="icon-share "></span>
                  <a class="main3-left-R " style="margin-right:10px; ">03:49</a>
              </li>
              <li>
                  <a class="main3-left-l ">陈晓 - 悲前喜剧【云巅之上插曲】</a>
                  <span class="icon-play "></span>
                  <span class="icon-download "></span>
                  <span class="icon-share "></span>
                  <a class="main3-left-R " style="margin-right:10px; ">05:13</a>
              </li>
              <li>
                  <a class="main3-left-l ">刘珂矣 - 墨痕</a>
                  <span class="icon-play "></span>
                  <span class="icon-download "></span>
                  <span class="icon-share "></span>
                  <a class="main3-left-R " style="margin-right:10px; ">02:39</a>
              </li>
           </ul>
           <div class="pages">
                        <a class="prev"></a>
                        <div class="page"><span class="fastPage">1</span>/<span class="lastPage">3</span></div>
                        <a class="next next2"></a><!--注意这里css样式的用法.......................................-->
           </div>

        </div>
        <div class="main3-right clearfix ">
        	<div class="itemTitle clearfix ">
                <h3><b>推荐</b></span></h3>
                <a class="more ">更多</a>
                <div class="clear "></div>
             </div>
             <div class="main3-rightMin ">
             	  <a class="box1 ">
                  <img style="width:320px; height:175px; " src="img/main3Right-pic1.jpg "/>
                  <div class="Cover">
                      <div class="playBtn"></div>
                  </div>
                  <div class="bottomTxt">
                      <p class="bottomTxt1">音浪(影视版)</p>
                      <p class="bottomTxt2">黄立行</p>
                  </div>
                </a>
                <a class="box2 ">
                  <img style="width:154px; height:125px; " src="img/main3Right-pic2.jpg "/>
                  <div class="Cover">
                      <div class="playBtn"></div>
                  </div>
                  <div class="bottomTxt">
                      <p class="bottomTxt1">我管你(真我版)</p>
                      <p class="bottomTxt2">华晨宇</p>
                  </div>
                </a>
                <a class="box2 " style="margin-right:0;">
                  <img style="width:154px; height:125px; " src="img/main3Right-pic3.jpg "/>
                  <div class="Cover">
                      <div class="playBtn"></div>
                  </div>
                  <div class="bottomTxt">
                      <p class="bottomTxt1">C3PO</p>
                      <p class="bottomTxt2">李克勤</p>
                  </div>
                </a>
             </div>
        </div>
        <div class="clear "></div>
    </div>
</div>
<!--main4部分开始-->
<div class="main4 ">
	<div class="main4Min "><img style="height:80px; width:1000px " src="img/main4-pic.jpg "/></div>
</div>
<!--main5部分开始-->
<div class="main5 ">
	<div class="main5Min clearfix">
    	<div class="main5-left ">
        	<div class="itemTitle clearfix ">
                <h3><b>热门</b>电台</h3>
                <a class="more ">更多</a>
             </div>
             <ul class="clearfix">
              <li>
                  <a>
                      <div class="radioLogo">
                          <img width="100" height="100"  src="img/radio_1.jpg ">
                      </div>
                      <div class="Cover">
                          <div class="playBtn"></div>
                      </div>
                      <div class="radioItem">KTV必点曲</div>
                  </a>
              </li>
              <li>
                  <a>
                      <div class="radioLogo">
                          <img width="100" height="100"  src="img/radio_2.jpg ">
                      </div>
                      <div class="Cover">
                          <div class="playBtn"></div>
                      </div>
                      <div class="radioItem">中文DJ</div>
                  </a>
              </li>
              <li>
                  <a>
                      <div class="radioLogo">
                          <img width="100" height="100"  src="img/radio_3.jpg ">
                      </div>
                      <div class="Cover">
                          <div class="playBtn"></div>
                      </div>
                      <div class="radioItem">酷狗热歌</div>
                  </a>
              </li>
              <li>
                  <a>
                      <div class="radioLogo">
                          <img width="100" height="100"  src="img/radio_4.jpg ">
                      </div>
                      <div class="Cover">
                          <div class="playBtn"></div>
                      </div>
                      <div class="radioItem">网络红歌</div>
                  </a>
              </li>
              <li>
                  <a>
                      <div class="radioLogo">
                          <img width="100" height="100"  src="img/radio_5.jpg ">
                      </div>
                      <div class="Cover">
                          <div class="playBtn"></div>
                      </div>
                      <div class="radioItem">经典</div>
                  </a>
              </li>
              <li>
                  <a>
                      <div class="radioLogo">
                          <img width="100" height="100"  src="img/radio_6.jpg ">
                      </div>
                      <div class="Cover">
                          <div class="playBtn"></div>
                      </div>
                      <div class="radioItem">老情歌</div>
                  </a>
              </li>
              <li>
                  <a>
                      <div class="radioLogo">
                          <img width="100" height="100"  src="img/radio_7.jpg ">
                      </div>
                      <div class="Cover">
                          <div class="playBtn"></div>
                      </div>
                      <div class="radioItem">新歌</div>
                  </a>
              </li>
              <li>
                  <a>
                      <div class="radioLogo">
                          <img width="100" height="100"  src="img/radio_8.jpg ">
                      </div>
                      <div class="Cover">
                          <div class="playBtn"></div>
                      </div>
                      <div class="radioItem">动漫</div>
                  </a>
              </li>
              <li>
                  <a>
                      <div class="radioLogo">
                          <img width="100" height="100"  src="img/radio_9.jpg ">
                      </div>
                      <div class="Cover">
                          <div class="playBtn"></div>
                      </div>
                      <div class="radioItem">轻音乐</div>
                  </a>
              </li>
              <li>
                  <a>
                      <div class="radioLogo">
                          <img width="100" height="100"  src="img/radio_10.jpg ">
                      </div>
                      <div class="Cover">
                          <div class="playBtn"></div>
                      </div>
                      <div class="radioItem">最爱成名曲</div>
                  </a>
              </li>
          </ul>
        </div>
        <div class="main5-right ">
        	<div class="itemTitle clearfix ">
                <h3><b>热门</b>歌手</h3>
                <div class="tabT" id="tabMenu">
                  <span class="active" style="color:#009af3;">华语</span>
                  <span data="1">欧美</span>
                  <span data="2">日韩</span>
                  <span style="margin-right:0;">
                    <a class="more">更多</a>
                  </span>
                 </div>

          </div>
          <div class="itemContent">
                        <div>
                            <ul class="firstUl clearFix" >
                                <li class="item">
                                    <ul class="chinaSinger secondUl clearFix" >
                                        <li class="clearfix">
                                          <div class="cpt cptMid">
                                              <a>
                                                  <img class="singerImg" src="img/main5Right-pic1.jpg" >
                                                  <div class="Cover">
                                                  </div>
                                                  <p class="cptBg"></p>
                                                  <div class="cptB">
                                                      <p class="songListSinger">薛之谦</p>
                                                  </div>
                                              </a>
                                          </div>


                                          <div class="cpt cptMid">

                                              <a>
                                                  <img class="singerImg" src="img/main5Right-pic2.jpg" >
                                                  <div class="Cover">
                                                  </div>
                                                  <p class="cptBg"></p>
                                                  <div class="cptB">
                                                      <p class="songListSinger">庄心妍</p>
                                                  </div>
                                              </a>
                                          </div>


                                           <div class="cpt cptSmall">

                                              <a>
                                                  <img class="singerImg"  src="img/main5Right-pic3.jpg" >
                                                  <div class="Cover">
                                                  </div>
                                                  <p class="cptBg"></p>
                                                  <div class="cptB">
                                                      <p class="songListSinger">周杰伦</p>
                                                  </div>
                                              </a>
                                          </div>


                                           <div class="cpt cptSmall">

                                              <a>
                                                  <img class="singerImg"  src="img/main5Right-pic4.jpg" >
                                                  <div class="Cover"></div>
                                                  <p class="cptBg"></p>
                                                  <div class="cptB">
                                                      <p class="songListSinger">冷漠</p>
                                                  </div>
                                              </a>
                                          </div>


                                           <div class="cpt cptSmall">

                                              <a>
                                                  <img class="singerImg"  src="img/main5Right-pic5.jpg" >
                                                  <div class="Cover">
                                                  </div>
                                                  <p class="cptBg"></p>
                                                  <div class="cptB">
                                                      <p class="songListSinger">陈奕迅</p>
                                                  </div>
                                              </a>
                                          </div>


                              </li>
                          </ul>
                          <div class="tab">
                              <a ></a>
                              <a class="date2"></a>
                              <a ></a>
                          </div>
                      </li>
                  </ul>
              </div>
          </div>
        </div>
    </div>
</div>
<!--main6部分开始-->
<div class="main6 "">
      <div class="main6Min"><img style="height:80px; width:1000px" src="img/main6-pic.jpg" /></div>
    </div>
    <!--main7部分开始-->
    <div class="main7">
      <div class="main7Min clearfix">
        <div class="itemTitle clearfix">
          <h3><b>合作</b>伙伴</h3>
        </div>
        <div class="main7-picMin">
          <a class="main7-pic1"></a>
          <a class="main7-pic2"></a>
          <a class="main7-pic3"></a>
          <a class="main7-pic4"></a>
          <a class="main7-pic5"></a>
          <a class="main7-pic6"></a>
          <a class="main7-pic7"></a>
          <a class="main7-pic8"></a>
          <a class="main7-pic9"></a>
          <a class="main7-pic10"></a>
          <a class="main7-pic11"></a>
          <a class="main7-pic12"></a>
          <a class="main7-pic13"></a>
          <a class="main7-pic14"></a>
          <a class="main7-pic15"></a>
          <a class="main7-pic16"></a>
          <a class="main7-pic17"></a>
          <a class="main7-pic18"></a>
          <a class="main7-pic19"></a>
          <a class="main7-pic20"></a>
          <a class="main7-pic21"></a>
        </div>
      </div>
    </div>
    <!--main8部分开始-->
    <div class="main8">
      <div class="main8Min">
        <div class="itemTitle clearfix">
          <h3><b>友情</b>链接</h3>
          <a class="more">更多</a>
        </div>
        <div>
          <a class="main8Txt">爱美网</a>
          <a class="main8Txt">央视网综艺频道</a>
          <a class="main8Txt">华数唱片</a>
          <a class="main8Txt">汽车论坛</a>
          <a class="main8Txt">IT之家</a>
          <a class="main8Txt">iPhone游戏</a>
          <a class="main8Txt">旅游攻略</a>
          <a class="main8Txt">悦声无限</a>
          <a class="main8Txt">华为商城</a>
          <a class="main8Txt">365音乐网</a>
          <a class="main8Txt">软件下载</a>
          <a class="main8Txt">漫漫看漫画</a>
          <a class="main8Txt">手机游戏</a>
        </div>
      </div>
    </div>
    <!--footer部分开始-->
    <div class="footer">
      <div class="footerTxt">
        <a>关于酷狗</a>
        <a>广告服务</a>
        <a>版权指引</a>
        <a>隐私政策</a>
        <a>用户服务协议</a>
        <a>推广合作</a>
        <a>酷狗音乐人</a>
        <a>酷狗音乐推</a>
        <a>招聘信息</a>
        <a>客服中心</a>
        <a class="noborder">用户体验提升计划</a>
      </div>
      <div class="footerMin">
        <p>我们致力于推动网络正版音乐发展，相关版权合作请联系copyrights@kugou.com</p>
        <p>信息网络传播视听节目许可证 1910564 增值电信业务经营许可证粤B2-20060339    粤ICP备09017694号-2<a><span class="footerIcon">    </span></a></p>
        <p>广播电视节目制作经营许可证（粤）字第01270号    营业性演出许可证穗天演440106026</p>
        <p>穗公网监备案证第44010650010167    互联网药品信息服务资格证编号（粤）-非经营性-2012-0018</p>
        <p>Copyright  &copy;  2004-2017 KuGou-Inc.All Rights Reserved<a><span class="footerIcon2">    </span></a></p>

      </div>
    </div>
</body>

</html>

@charset "UTF-8";
.header, .search_wrapper {
  height: 78px;
  position: relative;
}
a {
  text-decoration: none;
}

/* header部分公用css样式 */

.header {
  width: 1000px;
  margin: 0 auto;
}
.logo, .topNav {
  position: absolute;
}
.clearfix:after {
	content:'';/**给复合的盒子加一个空内容，将复合的盒子撑起来。**/
	display:block;
	clear:both;
}
/* header部分css样式 */

.logo {
  display: inline-block;
  height: 37px;
  width: 153px;
  background: url(../img/logo.png) no-repeat left top;
  margin-top: 20px;
}
.logo a {
  display: block;
}

/* search部分css样式 */

.search_wrapper {
  width: 300px;
  height: 36px;
  margin-left: 193px;
  padding-top: 20px;
  z-index: 9999;
}
.search_input {
  position: relative;
  width: 298px;
  height: 34px;
  border: 1px solid #ccc;
  line-height: 34px;
}
.search_input input {
  position: absolute;
  left: 0;
  top: 0;
  width: 249px;
  height: 24px;
  line-height: 24px;
  border: none;
  margin-left: 14px;
  padding: 5px 0;
  color: #666;
}
.search_input .searh_btn {
  position: absolute;
  right: 0;
  top: 0;
  width: 34px;
  height: 34px;
  margin: 0;
  border: none;
  padding: 0;
  background: 0 0;
  outline: none;
  cursor: pointer;
}
.search_input .searh_btn i {
  display: block;
  margin: 9px 0 0 9px;
  width: 16px;
  height: 16px;
  background-position: -40px -56px;
  cursor: pointer;
}
.search_icon {
  background: url(../img/search.png) no-repeat;
}
.search_input .searh_btn i:hover {
  background-position: -40px -86px;
}

/* topNav部分css样式 */

.topNav {
  top: 30px;
  right: 0;
  width: 402px;
}
.topNav ul {
  float: left;
  width: 250px;
  border-right: 1px solid #e6e6e6;
  padding-right: 11px;
  text-align: right;
}
.topNav li {
  float: left;
  padding: 0 15px;
}
.topNav li a {
  font-size: 12px;
  text-decoration: none;
  color: #777;
}
.topNav li a:hover{
  color: #009af3;
}
.topNav .login_area {
  position: relative;
  float: left;
  width: 110px;
  margin-top: -5px;
  margin-left: 30px;
}
.topNav .regin_btn, .topNav .login_btn {
  float: left;
  display: block;
  width: 48px;
  height: 28px;
  line-height: 28px;
  border-radius: 2px;
  text-align: center;
  cursor: pointer;
  text-decoration: none;
}
.topNav .login_btn {
  border: 1px solid #169af3;
  color: #fff;
  background-color: #169af3;
  margin-right: 5px;
}
.topNav .login_btn:hover{
  color: #fff;
  border: 1px solid #158fe1;
  background-color: #158fe1;
}
.topNav .regin_btn {
  border: 1px solid #999;
  color: #666;
}
.topNav .regin_btn:hover {
  border: 1px solid #169af3;
  color: #169af3;
}
/* nav部分css样式 */

.nav {
  height: 55px;
  background: #2c323b;
}
.navMin {
  width: 1000px;
  height: 55px;
  margin: 0 auto;
  background: #2c323b;
}
.menuBox {
  display: inline-block;
  width: 520px;
  height: 55px;
  margin: 0 76px 0 0;
  background: #2c323b;
  font-size: 0;
}
.menuBox li {
  background: #2c323b;
  display: inline-block;
  position: relative;
}
.menuBox .more {
  background:url(../img/arrowMored.png) no-repeat 88px 27px;
}
.menuBox li a {
  text-decoration: none;
  cursor: pointer;
  font-size: 16px;
  line-height: 55px;
  display: block;
  padding: 0 40px;
  color: #fff;
}
.nav .b:hover .more{
    color: #fff;
    background-color: #0c8ed9;
    background: url(../img/arrowMoreu2.png) no-repeat 88px 27px;
}
.menuBox li:hover {
  background: #0c8ed9;
}

.menuBox li ul {
  display: none;
  position: absolute;
}
.menuBox li ul li {
  width: 100%;
  height: 40px;
}
.menuBox li ul li a {
  cursor: pointer;
  text-decoration: none;
  background: #252b34;
  font-size: 16px;
  white-space: nowrap;
  line-height: 40px;
}
.menuBox li ul li a:hover {
  background: #2c323b;
}
.menuBox li:hover ul {
  display: block;
}

/* 设置subNav样式 */

.subNav {
  display: inline-block;
  font-size: 0;
  width: 400px;
}
.subNav a {
  display: inline-block;
  line-height: 15px;
  font-size: 13px;
  text-decoration: none;
  padding: 0 0px 0px 40px;
  color: #fff;
}
.subNav a:hover{
  color: #14a9ff;
}
.subNav-Btn1 {
  background: url(../img/sprite.png) no-repeat 20px -122px;
}
.subNav-Btn1:hover {
  background-position: 20px -104px;
}
.subNav-Btn2 {
  background: url(../img/sprite.png) no-repeat 20px -158px;
}
.subNav-Btn2:hover {
  background-position: 20px -140px;
}
.subNav-Btn3 {
  background: url(../img/sprite.png) no-repeat 20px -193px;
}
.subNav-Btn3:hover {
  background-position: 20px -175px;
}
.subNav-Btn4 {
  background: url(../img/sprite.png) no-repeat 20px -230px;
}
.subNav-Btn4:hover {
  background-position: 20px -212px;
}
.subNav-Btn5 {
  background: url(../img/sprite.png) no-repeat 20px -284px;
}
.subNav-Btn5:hover {
  background-position: 20px -248px;
}
/* 设置subNav样式 */
.banner{
  position: relative;
  width:1439px;
  height: 445px;
}
.bannerMin {
  background: url(../img/banner.jpg) center;
  height: 445px;
  width:1439px;
  margin: 0 auto;
}
.banner:hover a{
  display: block;
}
.prev-icon{
  display:none;
    position: absolute;
    top: 37%;
    left:0;
    width: 60px;
    height: 120px;
    background-image: url(../img/sprite.png);
    background-position: 0 -755px;
}
.prev-icon:hover{
    background-position: 0 -880px;
}
.next-icon{
  display:none;
    position: absolute;
    right:0;
    top: 37%;
    width: 60px;
    height: 120px;
    background-image: url(../img/sprite.png);
    background-position: 0 -1130px;
}
.next-icon:hover{
    background-position: 0 -1005px;
}
.PagesMin {
    position: absolute;
    bottom: 80px;
    width: 100%;
    text-align: center;
}
.PagesMin div {
   width: 160px;
   margin: 0 auto;
}
.PagesMin a {
    float: left;
    margin: 0 7px;
    display: inline-block;
    width: 12px;
    height: 10px;
    font-size: 0;
    background: url(../img/sprite.png);
    background-position: 0 -22px;
}
/* 设置nav2样式 */
.banner-cover {
  background: rgba(0,0,0,.5);
  height: 64px;
  width:100%;
  position: absolute;
  top:513px;
  left: 0;
}
.nav2 {
  height: 64px;
  width:100%;
  position: absolute;
  top:513px;
}
.nav2-box {
  margin: 0 auto;
  width: 698px;
  line-height: 64px;
  height: 64px;
}
.nav2 li {
  display: inline-block;
  line-height: 25px;
}
.nav2 a {
  text-decoration: none;
  display: inline-block;
  line-height: 16px;
  font-size: 16px;
  color: #fff;
  padding: 0 40px 0 100px;
  border-right: 1px solid #ccc;
}
.nav2 .noborder {
  border-right: 0;
}
.nav2 .nav2-btn1 {
  background: url(../img/nav-btn1.png) no-repeat 40px;
}
.nav2 .nav2-btn2 {
  background: url(../img/nav-btn2.png) no-repeat 40px;
}
.nav2 .nav2-btn3 {
  background: url(../img/nav-btn3.png) no-repeat 40px;
}

/* 设置mainMin样式 */

.mainMin {
  width: 1000px;
  margin: 0 auto;
  margin-top: 40px;
}

/* 设置itemTitle样式 */

.itemTitle {
  height: 30px;
  padding-bottom: 30px;
}
.itemTitle h3 {
  width: 120px;
  height: 30px;
  margin-right: 25px;
  color: #555;
  font-size: 25px;
  float: left;
}
.itemTitle h3 b {
  font-weight: 400;
  color: #009af3;
}
.itemTitle .more {
  margin-top: 7px;
  color: #999;
}

/* 设置mainLeft样式 */

.mainLeft {
  width: 660px;
  height: 390px;
  float: left;
}
.productMin {
  width: 668px;
  height: 330px;
}
.productLeft {
  float: left;
}

/* 设置topTxt样式 */

.topTxt {
  position: absolute;
  top: 0;
  right: 0;
  width: 152px;
  height: 30px;
  line-height: 30px;
  background: url(../img/topTxt-btn.png) no-repeat right center;
  color: #fff;
  text-align: right;
}
.productMin .topTxt-icon {
  margin-right: 10px;
  position: relative;
  top: 2px;
  background: url(../img/sprite.png) no-repeat;
  background-position: 0 -267px;
  display: inline-block;
  width: 14px;
  height: 14px;
}
.productMin .num {
  margin-right: 10px;
  font-size: 12px;
  color: #fff;
  display: inline-block;
  width: 55px;
  height: 17px;
}
.productBig {
  display: inline-block;
  width: 325px;
  height: 325px;
  margin: 0 5px 5px 0;
  position: relative;
}
.productBig img {
  width: 325px;
  height: 325px;
}
.productBig .cover {
  visibility: hidden;
  width: 325px;
  height: 325px;
  background: rgba(0, 0, 0, .3);
  position: absolute;
  top: 0;
  left: 0;
}
.productBig .playBtn {
  position: absolute;
  top: 300px;
  left: 300px;
  cursor: pointer;
  margin-left: -18px;
  margin-top: -18px;
  background-image: url(../img/sprite.png);
  background-position: 0 -401px;
  width: 36px;
  height: 36px;
}
.productBig:hover .cover {
  visibility: visible;
}

/* 设置bottomTxt样式 */

.productBig .bottomTxt {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 309px;
  padding: 6px 8px;
  background: rgba(0, 0, 0, .5);
  font-size: 14px;
  height: 38px;
}
.productBig .bottomTxt p {
  width: 295px;
  padding: 0px 8px 8px;
  color: #fff;
  font-size: 14px;
}

/* 设置productMid样式 */

.productMid {
  display: inline-block;
  width: 160px;
  height: 160px;
  margin: 0 5px 5px 0;
  position: relative;
}
.productMid img {
  width: 160px;
  height: 160px;
}
.productMid .cover {
  visibility: hidden;
  width: 160px;
  height: 160px;
  background: rgba(0, 0, 0, .3);
  position: absolute;
  top: 0;
  left: 0;
}
.productMid .playBtn {
  position: absolute;
  top: 134px;
  left: 134px;
  cursor: pointer;
  margin-left: -18px;
  margin-top: -18px;
  background-image: url(../img/sprite.png);
  background-position: 0 -401px;
  width: 36px;
  height: 36px;
}
.productMid:hover .cover {
  visibility: visible;
}

/* 设置bottomMid-Txt样式 */

.productMid .bottomTxt {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 142px;
  padding: 6px 8px;
  background: rgba(0, 0, 0, .5);
  font-size: 14px;
  height: 38px;
}
.productMid .bottomTxt p {
  width: 140px;
  padding: 0px 8px 8px 0;
  color: #fff;
  font-size: 14px;
}

/* 设置mainRight样式 */

.mainRight {
  width: 326px;
  height: 390px;
  float: right;
}
.mainRightMin {
  width: 326px;
  height: 325px;
}
.mainRightList {
  width: 326px;
  height: 98px;
  margin-bottom: 15px;
  background-color: #f6f6f6;
}
.mainRight .pic {
  width: 98px;
  height: 98px;
  float: left;
  position: relative;
}
.mainRight a {
  display: inline-block;
}
.mainRight .cover {
  display: none;
  width: 98px;
  height: 98px;
  background: rgba(0, 0, 0, .3);
  position: absolute;
}
.mainRight .playBtn {
  cursor: pointer;
  margin-left: 30px;
  margin-top: 32px;
  background-image: url(../img/sprite.png);
  background-position: 0 -401px;
  width: 36px;
  height: 36px;
}
.mainRight li:hover .cover {
  display: block;
}
.mainRight .mainRight-content {
  display: inline-block;
  width: 200px;
  height: 72px;
  padding: 13px 10px;
  float: left;
}
.mainRight dt {
  overflow: hidden;
  line-height: 24px;
  color: #333;
  font-weight: 700;
}
.mainRight dd {
  overflow: hidden;
  width: 180px;
  line-height: 24px;
  font-size: 14px;
  color: #555;
}
.clear {
  clear: both;
}

/* 设置main2样式 */

.main2Min {
  width: 1000px;
  height: 80px;
  margin: 40px auto;
}

/* 设置main3样式 */

.main3Min {
  width: 1000px;
  margin: 0 auto 0;
}

/* 设置main3-left样式 */

.main3-left {
  float: left;
  display: inline-block;
  width: 650px;
  height: 375px;
  margin-right: 20px;
}
.itemTitle-menu{
    line-height: 30px;
    float:left;
}
.itemTitle-menu .menuItem:hover{
    color: #009af3;
}
.itemTitle-menu .menuItem{
    margin-right: 20px;
    cursor: pointer;
    font-size: 14px;
}
.main3-left .playAll{
    float: right;
    border: 1px solid #dbdbdb;
    border-radius: 2px;
    padding: 10px 10px;
    color: #555;
}
.playAll:hover {
    color: #009af3;
    border: 1px solid #009af3;
}
.icon-play{
    display: inline-block;
    background: url(../img/icon_splice.png) no-repeat;
    background-position: 0px 0px;
    width: 12px;
    height: 14px;
    vertical-align: middle;
    margin: -4px 5px 0 0;
}
.playAll:hover .icon-play{
    background-position: 0 -30px;
}
.main3Bottom {
  border-bottom: 1px solid #f0f0f0;
}
.main3-left ul {
  width: 650px;
  height: 290px;
  margin-top: 10px;
}
.main3-left li {
  cursor: pointer;
  position: relative;
  overflow: hidden;
  padding: 0 10px;
  color: #333;
}
.main3-left a {
  font-size: 13px;
  line-height: 35px;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}
.main3-left-l {
  float: left;
}
.main3-left-R {
  float: right;
}
.main3-left li .icon-share {
  display: block;
    right: 55px;
    width: 21px;
    height: 15px;
    float: left;
    margin:12px 0 0 10px;
    background: url(../img/icon_splice.png) no-repeat;
    background-position: -120px -240px;
}
.main3-left li .icon-play {
  display: none;
  position: absolute;
  top:13px;
  right: 88px;
  width: 12px;
  height: 14px;
  background: url(../img/icon_splice.png) no-repeat;
  background-position: 0px 0px;
}
.main3-left li .icon-play:hover {
    background-position: 0 -30px;
}
.main3-left li .icon-download{
  display: none;
  position: absolute;
  top:10px;
  right: 63px;
  width: 15px;
  height: 15px;
  background:url(../img/icon_splice.png);
  background-position: -90px 0;
}
.main3-left li .icon-download:hover {
    background-position: -90px -30px;
}
.main3-left li:hover .icon-play,.main3-left li:hover .icon-download{
  display: block;
}
.main3-left li:hover .icon-share{
  display: none;
}
/* 设置main3-page样式 */
.main3 .pages {
    display: inline-block;
    _display: inline;
    height: 9px;
    padding-left: 290px;
    margin: 10px auto 0;
    font-size: 12px;
    color: #8d8d8d;
}
.main3 .prev {
    float: left;
    display: block;
    width: 6px;
    height: 9px;
    line-height: 9px;
    margin-top: 5px;
    text-indent: -999em;
    background:url(../img/pageChange.jpg) no-repeat 0 0;
    cursor: pointer;
    text-decoration: none;
}
.main3 .page {
    display: inline;
    float: left;
    margin: 3px 15px;
    font-size: 12px;
    color: #8d8d8d;
}
.main3 .next {
    float: left;
    display: block;
    width: 6px;
    height: 9px;
    line-height: 9px;
    margin-top: 5px;
    text-indent: -999em;
    background:url(../img/pageChange.jpg) no-repeat 0 0;
    cursor: pointer;
}
.main3 .next2{
    background-position: -13px 0;
    height: 9px;
}
/* 设置main3-right样式 */

.main3-right {
  float: right;
  display: inline-block;
  width: 320px;
  height: 400px;
}
.main3-rightMin {
  width: 320px;
  height: 360px;
}
.main3-rightMin .box1 {
  position: relative;
  display: inline-block;
  width: 320px;
  height: 175px;
}
.main3-rightMin .box1 .Cover {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
 background: rgba(0,0,0,.2);
}
.main3-rightMin .box1:hover .Cover {
  display: block;
}
.main3-rightMin .playBtn {
    display:none;
    position: absolute;
    top: 38%;
    left: 42%;
    text-indent: -999em;
    cursor: pointer;
    background-image: url(../img/sprite.png);
    background-position: 0 -542px;
    width: 48px;
    height: 48px;
}
.main3-rightMin .box1:hover .playBtn {
  display:block;
}
.main3-rightMin .playBtn:hover{
  background-position: 0 -489px;
}
.main3-rightMin .box1 .bottomTxt{
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 6px 8px;
    background: rgba(0,0,0,.5);
    font-size: 14px;
    color: #fff;
    height: 38px;
    width: 304px;
}
.bottomTxt1,.bottomTxt2{
  line-height: 19px;
  font-size:13px;
  font-weight: bold;
}
.main3-rightMin .box2 {
  position: relative;
  display: inline-block;
  margin: 8px 8px 0 0;
  width: 154px;
  height: 125px;
}
.main3-rightMin .box2 .Cover {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
 background: rgba(0,0,0,.2);
}
.main3-rightMin .box2:hover .Cover {
  display: block;
}
.main3-rightMin .box2 .playBtn {
    position: absolute;
    top: 38%;
    left: 42%;
    text-indent: -999em;
    cursor: pointer;
    background-image: url(../img/sprite.png);
    background-position: 0 -542px;
    width: 48px;
    height: 48px;
}
.main3-rightMin .box2:hover .playBtn {
  display:block;
}
.main3-rightMin .box2 .playBtn:hover{
  background-position: 0 -489px;
}
.main3-rightMin .box2 .bottomTxt{
    position: absolute;
    bottom:-51px;
    left: 0;
    padding: 6px 8px;
    background: #fff;
    color: #666;
    font-size: 14px;
    height: 38px;
    width: 144px;
}
.main3-rightMin .box2 .bottomTxt1,.bottomTxt2{
  line-height: 19px;
  font-size:13px;
}
/* 设置main4样式 */

.main4Min {
  width: 1000px;
  height: 80px;
  margin: 40px auto;
}

/* 设置main5样式 */

.main5Min {
  width: 1000px;
  margin: 40px auto 0;
}

/* 设置main5-left样式 */

.main5-left {
  display: inline-block;
  width: 650px;
  margin-right: 21px;
}
.main5-left ul {
    width: 685px;
}
.main5-left li {
  position: relative;
    position: relative;
  float: left;
  cursor: pointer;
    width: 100px;
    margin-right: 37px;
    margin-bottom: 25px;
}
.main5-left ul .main5-left li:nth-child(4),.main5-left ul .main5-left li:nth-child(8){
  margin-right:0;
}
.main5-left li a {
  text-decoration:none;/*text-decoration:none;加在别的地方没有效果  */
}
.main5-left li .Cover {
  display: none;
    position: absolute;
    top:0px;
    width: 100px;
    height: 100px;
    border-radius: 50px;
    background: rgba(0,0,0,.2);
    background-size: 100% 100%;
}
.main5-left li:hover .Cover {
  display: block;
}
.main5-left li .playBtn {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -21px;
    margin-left: -21px;
    background-image: url(../img/sprite.png);
    background-position: 0 -442px;
    width: 42px;
    height: 42px;
}
.main5-left li .radioLogo {
    width: 100px;
    height: 100px;
    margin-bottom: 10px;
    margin-right: 0;
}
.main5-left li .radioItem {
    width: 100px;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
}
/* 设置main5-right样式 */

.main5-right {
  display: inline-block;
  width: 325px;
  float: right;
}
.main5-right .itemContent{
    overflow: hidden;
    width: 325px;
}
.main5-right .itemTitle .tabT {
    width: 330px;
    line-height: 30px;
}
.itemTitle .tabT span {
    margin-right: 20px;
    cursor: pointer;
    font-size: 14px;
}
.tabT span:hover{
    color: #009af3;
}
.itemTitle .more {
    margin-top: 7px;
    color: #999;
    float:right;
}
.main5-right .itemTitle .more {
    margin-top: 0px;
    color: #999;
}
.main5-right .firstUl {
    width: 100%;
    position: relative;
    height: 320px;
}
.main5-right .firstUl li {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    width: 330px;
    height: 320px;
}
.main5-right .secondUl {
    position: relative;
    width: 330px;
    height: 270px;
}
.main5-right .secondUl li {
    position: absolute;
    top: 0;
    left: 0;
    height: 270px;
}
.secondUl li:nth-child(2+5){
  margin-right:0;
}
.main5-right .cptMid {
    width: 160px;
    height: 160px;
    padding: 0;
    margin: 0 5px 5px 0;
    position: relative;
}
.main5-right .cpt{
  float: left;
}
.main5-right .cptMid  img {
    width: 160px;
    height: 160px;
    position:relative;
    vertical-align: middle;
}
.main5-right .cptMid  .Cover {
  display: none;
    width: 160px;
    height: 160px;
    background: rgba(0,0,0,.3);
    position: absolute;
    top: 0;
    left: 0;
}
.main5-right .cptMid:hover  .Cover {
  display: block;
}
.main5-right .cptMid  .cptB {
    background: url(../img/album_cpt_bg.png) no-repeat left bottom;
    width: 144px;
    padding: 6px 8px;
    font-size: 14px;
    height: 38px;
    position: absolute;
    bottom: 0;
    left: 0;
}
.main5-right .cptMid .songListSinger {
    line-height: 50px;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.main5-right .cptSmall {
    width: 105px;
    height: 105px;
    padding: 0;
    margin: 0 5px 0 0;
    position: relative;
}
.main5-right .cptSmall  img {
    width: 105px;
    height: 105px;
    position:relative;
    vertical-align: middle;
}
.main5-right .cptSmall  .Cover {
  display:none;
    width: 105px;
    height: 105px;
    background: rgba(0,0,0,.3);
    position: absolute;
    top: 0;
    left: 0;
}
.main5-right .cptSmall:hover .Cover{
  display:block;
}
.main5-right .cptSmall  .cptB {
    background: url(../img/album_cpt_bg.png) no-repeat left bottom;
    width: 89px;
    padding: 6px 8px;
    font-size: 14px;
    height: 33px;
    position: absolute;
    bottom: 0;
    left: 0;
}
.main5-right .cptSmall .songListSinger {
    line-height: 40px;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.main5-right .tab {
    position: relative;
    padding-top: 17px;
    height: 6px;
    line-height: 6px;
    text-align: center;
}
.main5-right .tab a {
    display: inline-block;
    margin: 0 5px;
    vertical-align: middle;
    background-image: url(../img/sprite.png);
    background-position: 0 -11px;
    width: 6px;
    height: 6px;
    text-decoration: none;
}
.main5-right .tab .date2{
  background-position: 0 0px;
}

/* 设置main6样式 */

.main6Min {
  width: 1000px;
  height: 80px;
  margin: 40px auto;
}

/* 设置main7样式 */

.main7Min {
  width: 1000px;
  margin: 40px auto;
}
.main7-picMin a {
  display: inline-block;
  width: 130px;
  height: 58px;
  margin: 3px;
  border: 1px dashed #CCCCCC;
}
.main7-pic1 {
  background: url(../img/main7-pic1.jpg);
}
.main7-pic2 {
  background: url(../img/main7-pic2.jpg);
}
.main7-pic3 {
  background: url(../img/main7-pic3.jpg);
}
.main7-pic4 {
  background: url(../img/main7-pic4.jpg);
}
.main7-pic5 {
  background: url(../img/main7-pic5.jpg);
}
.main7-pic6 {
  background: url(../img/main7-pic6.jpg);
}
.main7-pic7 {
  background: url(../img/main7-pic7.jpg);
}
.main7-pic8 {
  background: url(../img/main7-pic8.jpg);
}
.main7-pic9 {
  background: url(../img/main7-pic9.jpg);
}
.main7-pic10 {
  background: url(../img/main7-pic10.jpg);
}
.main7-pic11 {
  background: url(../img/main7-pic11.jpg);
}
.main7-pic12 {
  background: url(../img/main7-pic12.jpg);
}
.main7-pic13 {
  background: url(../img/main7-pic13.jpg);
}
.main7-pic14 {
  background: url(../img/main7-pic14.jpg);
}
.main7-pic15 {
  background: url(../img/main7-pic15.jpg);
}
.main7-pic16 {
  background: url(../img/main7-pic16.jpg);
}
.main7-pic17 {
  background: url(../img/main7-pic17.jpg);
}
.main7-pic18 {
  background: url(../img/main7-pic18.jpg);
}
.main7-pic19 {
  background: url(../img/main7-pic19.jpg);
}
.main7-pic20 {
  background: url(../img/main7-pic20.jpg);
}
.main7-pic21 {
  background: url(../img/main7-pic21.jpg);
}

/* 设置main样式 */

.main8Min {
  width: 1000px;
  margin: 40px auto;
}
.main8Min a {
  overflow: hidden;
  display: inline-block;
  width: 121px;
  height: 24px;
  line-height: 24px;
  margin-bottom: 20px;
  text-decoration: none;
  color: #555;
  cursor: pointer;
}
.main8Min .more {
  width: 30px;
}

/* 设置footer样式 */

.footer {
  background: #2c323b;
  padding-bottom: 50px;
}
.footerTxt {
  text-align: center;
  margin: 0 auto;
  height: 46px;
  background: #2c323b;
  font-size: 0;
  line-height: 50px;
  border-bottom: 1px solid #3d424a;
}
.footerTxt a {
  display: inline-block;
  padding: 0 15px;
  border-right: 1px solid #b19676;
  font-size: 12px;
  line-height: 15px;
  text-decoration: none;
  color: #b1b3b9;
  cursor: pointer;
}
.main8Min a:hover, .footerTxt a:hover {
  color: #009af3;
}
.footer .noborder {
  border-right: 0;
}
.footer .footerMin {
  width: 1000px;
  margin: 40px auto 0;
}
.footer .footerMin p {
  position: relative;
  line-height: 30px;
  text-align: center;
  color: #b1b3b9;
}
.footer .footerIcon {
  width: 16px;
  height: 16px;
  position: absolute;
  margin-left: 5px;
  margin-top: 7px;
  background: url(../img/footer_icon.png) no-repeat 0 0;
}
.footer .footerIcon2 {
  width: 20px;
  height: 20px;
  position: absolute;
  margin-left: 10px;
  margin-top: 1px;
  background: url(../img/logo_down.png) no-repeat 0 0;
}