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

header { display: flex; align-items: center; line-height: 0; border-bottom: 0!important;}
header .logo { flex: 1;}
header .logo img { height: 45px;}
header .title {display: flex; width: 40%; align-items: center; height: 30px; margin: 0px;padding:0}
header .user {}
header .user img { width: 30px; height: 30px; margin-left: 10px;}
header .search { display: flex; align-items: center; width: 120px; height: 32px; box-sizing: border-box; padding: 0 10px; border: solid 1px #ebebeb; border-radius: 32px; background: #f1f1f1;}
header .search span { display: inline-block; min-width: 15px; height: 15px; margin-right: 6px; background: url(../images/serach.png) no-repeat; background-size: 100% 100%;}
header .search input { width: 100%; border: 0; background: none;}

.down {  position: fixed; right: 0; top: 50%; transform: translateY(-50%); color: #fff; text-align: center; z-index: 11;}
.down a { display: inline-block;}
.down img { width: 50px; height: auto; vertical-align: middle;}
.down span { display: block; padding: 7px; border-radius: 4px; background: #ec0000;}

.banner { text-align: center;}
.banner img { width: 96%; border-radius:10px; margin:5px auto;}

.notice { display: flex; align-items: center; padding: 0px 10px 10px 10px;}
.notice-l { padding-right: 10px;}
.notice-l img { width: 18px; height: auto;}
.notice-r { line-height: 1.1; flex: 1;}

.nav { padding: 15px 0; box-sizing: border-box; text-align: center; font-size: 15px;}
.nav ul { display: flex; justify-content: space-around;}
.nav ul li {}
.nav ul li img { width: 50px; height: 50px; margin-bottom: 5px;}
#nav[data-fixed="fixed"]{ width: 100%; max-width: 500px; position: fixed; top:0; margin: 0 auto; z-index: 10; box-shadow: 0 5px 10px rgba(0,0,0,.05); background: #fff;}

.zhibo{height:190px;}
@media screen and (max-width:650px) {
.zhibo{height:175px;}
}
@media screen and (max-width:500px) {
.zhibo{height:150px;}
}
@media screen and (max-width:450px) {
.zhibo{height:145px;}
}
@media screen and (max-width:400px) {
.zhibo{height:135px;}
}
@media screen and (max-width:350px) {
.zhibo{height:130px;}
}

.foot-nav-blank { height: 1rem;}
.foot-nav { position: fixed; left: 0; right: 0; bottom: 0; height: 1rem; text-align: center; color: #fff; background: #2583c5;}
.foot-nav ul { display: flex;}
.foot-nav ul li { flex: 1; width: 20%; padding-top: 0.1rem;}
.foot-nav ul li:nth-child(even) { background: #3692d2;}
.foot-nav ul li img { width: 0.46rem; border-radius: 0.06rem 0.06rem 0 0;}
.foot-nav ul li p {}

.fgLine{ border-bottom: 1px solid #ddd ;position: relative; height: 20px; text-align: center; margin-bottom:20px;}
.fgLine span{ position: absolute; top: 4px; border-radius: 50%; background: #fff; display:block; width: 30px; height: 30px; line-height: 30px; border: 1px dashed #ddd; color: #999; left: 50%; margin-left: -13px;}

.pic-wrap .wrap {
    /* 标准属性 */
    column-count: 2;
    column-gap: 0;
    margin: 0 auto;
    padding: 5px;
    box-sizing: border-box;
    break-inside: avoid;

    /* WebKit 前缀属性 */
    -webkit-column-count: 2;
    -webkit-column-gap: 0;
    -webkit-column-break-inside: avoid;

    /* Mozilla 前缀属性 */
    -moz-column-count: 2;
    -moz-column-gap: 0;
    -moz-column-break-inside: avoid;
}

.pic-wrap .wrap .box {
    /* 标准属性 */
    break-inside: avoid;
    padding: 5px;

    /* WebKit 前缀属性 */
    -webkit-column-break-inside: avoid;

    /* Mozilla 前缀属性 */
    -moz-column-break-inside: avoid;
}

.pic-wrap .wrap .box .info {
    /* 标准属性 */
    break-inside: avoid;
    border-radius: 0 0 5px 5px;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, .1);
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    min-height: 100px;

    /* WebKit 前缀属性 */
    -webkit-column-break-inside: avoid;

    /* Mozilla 前缀属性 */
    -moz-column-break-inside: avoid;
}

.pic-wrap .wrap .box img {
    width: 100%;
    /* 标准属性 */
    break-inside: avoid;

    /* WebKit 前缀属性 */
    -webkit-column-break-inside: avoid;

    /* Mozilla 前缀属性 */
    -moz-column-break-inside: avoid;
}

.pic-wrap .wrap .box span { display: block; padding: 10px 0;}
.loading{ text-align:center; padding:10px;}
.refresh-element {background-color:gainsboro;}
@media screen and (min-width:450px) {
    .pic-wrap .wrap {
        /* 标准属性 */
        column-count: 2;

        /* WebKit 前缀属性 */
        -webkit-column-count: 2;

        /* Mozilla 前缀属性 */
        -moz-column-count: 2;
    }
}