/* CSS Document */

@import url("ico.css");
::selection { background: #ffdf02; color: #000; }
::-moz-selection {
    background: #ffdf02;
    color: white;
}
body { font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; font-size: 16px; line-height: 1.3; color: #555; background: #f9f9f9; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-font-feature-settings: "liga", "kern"; }
a { color: #333; transition: color .2s cubic-bezier(.4, 0, .2, 1); }
a:hover, a:focus { color: #000; text-decoration: none; }
ul, ol, ul li, .ol li { padding-left: 0; margin-bottom: 0; list-style: none; }
input { outline: none; box-shadow: none; }
button:focus, .btn:focus, input:focus, .form-control:focus { outline: none; box-shadow: none; }
.avatar { display: block; }
.avatar img { width: 100%; height: 100%; border-radius: 50%; }
.btn { transition: 0.3s cubic-bezier(.4, 0, .2, 1); }
.btn-zhua { color: #000; background-color: #ffdf02; }
.btn-zhua:hover { color: #ffdf02; background-color: #000; }
.btn-red { color: #000; background-color: #fe8aa2; }
.btn-red:hover { background-color: #fbaabb; }
.btn-black { color: #ffdf02; background-color: #000; }
.btn-black:hover { color: #000; background-color: #ffdf02; }
.dropdown-menu { border: 0; }
.tips { font-size: 12px; color: #999; padding: .5em 0; }
.tips.error { color: #a94442; }
.table > tbody > tr:last-child > th, .table > tbody > tr:last-child > td { border-bottom: 1px solid #ddd; }
.table > thead > tr > th, .table > tbody > tr > td { vertical-align: middle; }
.table > thead > tr > th .sort { margin-left: 5px; font-size: 14px; color: #ccc; cursor: pointer; }
.table > thead > tr > th .sort.active { color: #ffdf02; }
.table > thead > tr > th .sort:hover { color: #000; }
header { padding: 10px 0; text-align: center; background: #fff; border-bottom: #eee 1px dotted; }
header i:before { vertical-align: -4px; }
header .logo { float: left; }
header .logo a { display: block; height: 30px; width: 87px; background-position: left center; background-repeat: no-repeat; background-size: auto 100%; background-image: url(../img/logo@2x.png); }
header .search { display: block; clear: both; width: 80%; padding-top: 10px; }
header .search .btn { line-height: 28px; border: 0; }
header .search .btn .caret { margin-left: .5em; }
header .search .btn.submit i { font-size: 18px; }
header .search .form-control { height: 40px; border: 0; background: #F5F5F5; }
header .user { line-height: 30px; float: right; text-align: right; }
header .user li { display: inline-block; margin-left: 5px; }
header .user .avatar { width: 30px; height: 30px; }
header .user .upload { font-weight: bold; border-radius: 18px; padding: 4px 6px; }
header .user .upload i { font-size: 16px; }
header .user .upload span { margin-left: .5em; display: none; }
header .user em { margin: auto .5em; color: #ccc; }
.navbar-main { min-height: inherit; padding: 0; margin-bottom: 0; border-radius: 0; border: none; text-align: center; background: #fff; }
.navbar-main .navbar-toggle { float: right; margin-top: -50px; padding: 10px; border: 0; }
.navbar-main .navbar-toggle .icon-bar { height: 4px; background-color: #333; }
.subnav { text-align: center; }
.subnav a { display: inline-block; padding: 10px 30px; margin: 20px auto; border-radius: 5px; }
.subnav a.active { background-color: #333; color: #ffdf02; }
.topbanner img { width: 100%; }
footer { padding: 30px 0; background: #222; color: #999; font-size: 13px; }
footer a { color: #999; }
footer a:hover, footer a:focus { color: #ffdf02; }
footer .slogan span { background: #ffdf02; color: #000; margin-bottom: 20px; }
.go_top { position: fixed; bottom: 5px; right: 5px; width: 40px; z-index: 999; }
.go_top a { display: block; width: 40px; height: 40px; margin-bottom: 3px; background-color: #333; color: #fff; text-align: center; border-radius: 3px; text-decoration: none; }
.go_top a:last-child { margin-bottom: 0; }
.go_top a:hover { background-color: #ffdf02; }
.go_top a i { display: block; line-height: 40px; font-size: 26px; }
.go_top a i:before { vertical-align: baseline; }
.go_top a.wx { background: rgba(110,185,109,1.00); display: none; }
.go_top a.qq { background: rgba(116,193,216,1.00); display: none; }
.go_top .gt_qr_pop { display: none; position: absolute; right: 50px; top: -120px; width: 240px; box-shadow: 0px 1px 4px rgba(0,0,0,.1); background: #fff; border-radius: 3px; }
.go_top .gt_qr_pop .gt_qr_t { margin: 0; font-size: 14px; padding: 8px 0; color: #000; background-color: #ffdf02; text-align: center; border-radius: 3px; }
.go_top .gt_qr_pop .gt_qr_img { position: relative; padding: 10px; }
.go_top .gt_qr_pop .gt_qr_img img { width: 220px; height: 220px; }
.go_top .gt_qr_pop.dn { display: block; }
/*列表*/
.item-list li { position: relative; transition: all .2s linear; }
.item-list li img { width: 100%; border-radius: 10px; transition: 0.3s cubic-bezier(.4, 0, .2, 1); }
.item-list > li:hover { box-shadow: 0 15px 30px rgba(0,0,0,0.1); transform: translate3d(0, -2px, 0); }
.item-list li:hover img { opacity: .8; }
.item-list li .item-name { padding: 0 .5em; line-height: 3em; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.item-list li .item-info { padding: 0 .5em; margin-bottom: 2em; font-size: 13px; color: #999; }
.item-list li .item-info i { margin-right: .3em; }
.item-list li .item-info .user { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.item-list li .item-info .user i { color: #8BB78A; }
.item-list li .item-info .comm { text-align: right; }
.item-list li .item-info .comm span { margin-left: 1em; }
.item-list li .item-info .comm span i { color: #ccc; }
.item-list li .edit { position: absolute; display: none; top: 0; left: 0; right: 0; text-align: center; transition: 0.3s cubic-bezier(.4, 0, .2, 1); }
.item-list li .edit a { display: inline-block; margin: 0 .2em; font-size: 12px; padding: 5px; background: rgba(255, 223, 2, 0.8); }
.item-list li .edit a:hover { color: #ffdf02; background-color: #000; }
.item-list li .edit a i { display: block; }
.item-list li:hover .edit { display: block; }
/*页码*/
.pages { text-align: center; margin: 40px 0; }
.pages a, .pages span { display: inline-block; width: 40px; height: 40px; line-height: 40px; margin: 0 3px; background: #eee; text-align: center; border-radius: 3px; transition: .2s cubic-bezier(.4, 0, .2, 1); }
.pages a:hover, .pages a.active { color: #000; background-color: #ffdf02; }
.pages i { vertical-align: -2px; }

@media (min-width: 375px) {
    header .user .upload span { display: inline; }
    header .user .upload { padding: 6px 12px; }
}

@media (max-width: 767px) {
    .navbar-main .navbar-nav > li.active a { font-weight: bold; color: #000; background: #ffdf02; }
    .item-list { margin-right: -5px; margin-left: -5px; }
    .item-list li { padding-left: 5px; padding-right: 5px; margin-bottom: 15px }
    .pages a, .pages span { display: none; }
    .pages a:first-child, .pages a:last-child { display: inline-block; }
    .subnav a { padding: 10px; margin: 10px auto; }
    .item-list li .edit { position: relative; display: block; }
}

@media (min-width: 768px) {
    header .search { width: 100%; }
    .navbar-main { padding-top: 30px; }
    .navbar-main .navbar-collapse { padding: 0; }
    .navbar-main .navbar-nav { float: none; }
    .navbar-main .navbar-nav > li { float: none; display: inline-block; width: 11.9%; }
    .navbar-main .navbar-nav > li:before { display: inline-block; content: ""; width: 45px; height: 45px; background-repeat: no-repeat; background-size: 100% 100%; background-position: center top; transition: 0.3s cubic-bezier(.4, 0, .2, 1); }
    .navbar-main .navbar-nav > li.nav-item1:before { background-image: url(../img/nav-1.svg); }
    .navbar-main .navbar-nav > li.nav-item2:before { background-image: url(../img/nav-2.svg); }
    .navbar-main .navbar-nav > li.nav-item3:before { background-image: url(../img/nav-3.svg); }
    .navbar-main .navbar-nav > li.nav-item4:before { background-image: url(../img/nav-4.svg); }
    .navbar-main .navbar-nav > li.nav-item5:before { background-image: url(../img/nav-5.svg); }
    .navbar-main .navbar-nav > li.nav-item6:before { background-image: url(../img/nav-6.svg); }
    .navbar-main .navbar-nav > li.nav-item7:before { background-image: url(../img/nav-7.svg); }
    .navbar-main .navbar-nav > li.nav-item8:before { background-image: url(../img/nav-8.svg); }
    .navbar-main .navbar-nav > li.active:before { transform: scale(1.2); }
    .navbar-main .navbar-nav > li:hover:before { transform: scale(1.2); }
    .navbar-main .navbar-nav > li > a { margin-top: -50px; padding: 55px 0 14px; color: #000; border-bottom: #fff 4px solid; }
    .navbar-main .navbar-nav > li > a:hover { background-color: transparent; border-bottom-color: #ffdf02; }
    .navbar-main .navbar-nav > li.active a { font-weight: bold; border-bottom-color: #ffdf02; }
    .navbar-main .navbar-nav > li > a:focus { background-color: transparent; }
    .go_top { bottom: 50px; }
    .go_top a.wx, .go_top a.qq { display: block; }
    .item-list { margin-bottom: -23px; }
    .item-list li { margin-bottom: 23px; }
    .item-list li img { border-radius: 15px; }
}

@media (min-width: 880px) {
    header .logo a { height: 50px; width: 145px; }
    header .search { display: inline-block; width: 35%; padding-top: 5px; }
    header .user { line-height: 50px; }
    header .user li { margin-left: 20px; }
    header .user .avatar { width: 50px; height: 50px; }
    .go_top { bottom: 120px; }
}