@charset "UTF-8";
/* CSS Document */

* {
    margin: 0;
    padding: 0;
    font-family: Helvetica Neue, Helvetica, PingFang SC, Tahoma, Arial, sans-serif;
}

*:focus {outline: none;}

html {
    position: relative;
    -webkit-text-size-adjust: none;
}

body {
    font-size: 12px;
    background: #f8f8f8;
}

img {
    border: 0 none;
    max-width: 100%;
}

ul, li {
    display: block;
    list-style: none;
}

a {
    text-decoration: none;
    cursor: pointer;
}

textarea {resize: none;}

.clearfix:after {
    content: "";
    height: 0;
    line-height: 0;
    display: block;
    visibility: hidden;
    clear: both;
}

.clearfix {zoom: 1;}

.clearbox {clear: both; font-size: 0; line-height: 0;}

.boxsizing {
    box-sizing: border-box;
}

.padtop {padding-top: 50px;}

.cominTitle {width: auto; height: 44px; padding: 0 20px; position: relative;}
.cominTitle:after {content: ''; display: block; width: 100%; height: 1px; background: #ddd; font-size: 0; line-height: 0; position: absolute; left: 0; bottom: 0;}
.cominTitle .name {width: auto; height: 44px; line-height: 44px; font-size: 14px; font-weight: bold; color: #333; position: relative; z-index: 2;}
.cominTitle .name span {display: inline-block; position: relative;}
.cominTitle .name span:after {content: ''; display: block; width: 100%; height: 3px; background: #31b4e8; position: absolute; left: 0; bottom: 0;}
.cominTitle .more {width: auto; height: 20px; position: absolute; right: 20px; top: 50%; margin-top: -10px; z-index: 3;}
.cominTitle .more a {display: block; width: auto; height: 20px; line-height: 20px; font-size: 12px; color: #999; position: relative; padding-right: 20px;}
.cominTitle .more a:after {content: ''; display: block; width: 14px; height: 14px; position: absolute; right: 0; top: 50%; margin-top: -7px; font-size: 0; line-height: 0;
    background: url("../images/comore.png") no-repeat;
    background-image: -webkit-image-set(url("../images/comore.png") 1x, url("../images/comore@2x.png") 2x);
}


.pages {width: auto; height: auto; text-align: center; font-size: 0; padding: 30px 0;}
.pages .box {display: inline-block; overflow: hidden;}
.pages .box a,
.pages .box b {display: block; width: auto; height: 28px; min-width: 28px; float: left; padding: 0 5px; box-sizing: border-box; text-align: center; line-height: 28px; background: #F4F4F5; border-radius: 3px; margin: 0 5px; font-size: 13px; font-weight: bold; color: #606266; position: relative;}
.pages .box b {background: #31b4e8; color: #fff;}
.pages .box a.prev:after,
.pages .box a.next:after {content: ''; display: block; width: 5px; height: 10px; position: absolute; left: 50%; margin-left: -2.5px; top: 50%; margin-top: -5px;
    background-repeat: no-repeat;
    background-position-y: 0;
    background-image: url("../images/pages.png");
    background-image: -webkit-image-set(url("../images/pages.png") 1x, url("../images/pages@2x.png") 2x);
}
.pages .box a.prev:after {background-position-x: 0;}
.pages .box a.next:after {background-position-x: -5px;}

.flotNavs {width: 16px; height: auto; filter:alpha(opacity=90);opacity: 0.9; overflow: hidden; position: fixed; left: 0; top: 50px; bottom: 0; z-index: 9999; transition: all .2s;}
.flotNavs .toggle {width: 16px; height: 80px; background: red; position: absolute; right: 0; top: 70px;}
.flotNavs .toggle a {display: block; width: 16px; height: 80px;
    background: url("../images/navtoggle.png") no-repeat left #3569cc;
    background-image: -webkit-image-set(url("../images/navtoggle.png") 1x, url("../images/navtoggle@2x.png") 2x);
}
.flotNavs .main {width: 200px; height: 100%; background: #fff; overflow: auto; box-shadow: 0 0 10px rgba(0, 0, 0, .1); position: absolute; right: 16px; top: 0;}
.flotNavs .main .group {width: auto; height: auto; padding: 0 20px;}
.flotNavs .main .group .name {width: auto; height: auto; font-size: 15px; line-height: 20px; font-weight: bold; color: #333333;}
.flotNavs .main .group .name a {color: #333333; position: relative; padding-left: 25px;}
.flotNavs .main .group .name a i {display: block; width: 20px; height: 20px; line-height: 20px; position: absolute; left: 0; top: 50%; margin-top: -10px;}
.flotNavs .main .group .name a i.ico1 {background-position-x: 0;}
.flotNavs .main .group .name a i.ico2 {background-position-x: -20px;}
.flotNavs .main .group .name a i.ico3 {background-position-x: -40px;}
.flotNavs .main .group .name a i.ico4 {background-position-x: -60px;}
.flotNavs .main .group .name a i.ico5 {background-position-x: -80px;}
.flotNavs .main .group .name a i.ico6 {background-position-x: -100px;}

.flotNavs .main .group .list {width: auto; height: auto; padding-top: 10px; font-size: 13px; color: #666666; line-height: 30px; padding-left: 25px; padding-bottom: 20px;}
.flotNavs .main .group .list a {color: #666;}
.flotNavs .main .group .list a:hover {color: #31b4e8;}
.flotNavs .main .group:first-child .name {padding-top: 20px;}

.flotNavs.show {width: 216px;}
.flotNavs.show .toggle a {
    background: url("../images/navtoggle.png") no-repeat right #3569cc;
    background-image: -webkit-image-set(url("../images/navtoggle.png") 1x, url("../images/navtoggle@2x.png") 2x);
}