﻿﻿@charset "utf-8";

/* 各种图标CDN */
@import url("https://cdn.bootcss.com/MaterialDesign-Webfont/2.4.85/css/materialdesignicons.min.css");
@import url("https://cdn.bootcss.com/simple-line-icons/2.4.1/css/simple-line-icons.min.css");


/* reset css */

/*html * { outline: 0; -webkit-text-size-adjust: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-font-smoothing: antialiased; }*/

/*body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset,
legend,
input,
button,
textarea,
p,
th,
td { margin: 0; padding: 0; }*/

/*fieldset,
img { border: 0; }*/

address,
cite,
dfn,
em,
var { font-style: normal; }

ol,
ul { list-style: none; }

/*table { border-collapse: collapse; border-spacing: 0; font-size: 14px; }*/

/*caption,
th { text-align: left; font-weight: normal; }*/





/* 通用功能 */

/*.vm,
input,*/
/*label { vertical-align: middle; }*/

/*.tc { text-align: center; }*/

/*.fl { float: left; _display: inline; }

.fr { float: right; _display: inline; }*/

/*.h > li { float: left; }*/

.clearfix:after,
.nav:after,
.content:after,
.grid:after,
.h:after,
.jr-row:after,
.jr-grids:after { content: '\20'; display: block; height: 0; clear: both; }

.clearfix,
.nav,
.content,
.grid,
.row,
.h { *zoom: 1; }

.clear { clear: both; height: 0; font: 0/0 Arial; visibility: hidden; }

.mb10 { margin-bottom: 10px; }

.mr10 { margin-right: 10px; }

.mb20 { margin-bottom: 20px; }

.mr20 { margin-right: 20px; }

.mb30 { margin-bottom: 30px; }

.mr30 { margin-right: 30px; }

.mb40 { margin-bottom: 40px; }

.mr40 { margin-right: 40px; }

.p10 { padding: 10px; }

.p15 { padding: 15px; }

.p20 { padding: 20px; }

.p25 { padding: 25px; }

.p30 { padding: 30px; }

.hide { display: none; }

.nt { text-align: left; letter-spacing: -3em; overflow: hidden; }

    .nt:first-letter { margin-left: -20em; }

.et { overflow: hidden; white-space: nowrap; word-break: keep-all; text-overflow: ellipsis; }




/* 字体字号 */

/*body,
button,
input,
select,
textarea { font-family: -apple*/ -system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, SimHei, sans-serif; font-size: 16px; line-height: 1.5em; color: #333;
}


/* 链接 */

a { color: #252525; text-decoration: none; }

    a:hover { color: #048; text-decoration: none; }

    a:active { outline: none; }


/* 颜色 */

.text-white { color: #fff !important; }

.text-gray { color: #bbb !important; }

.text-red { color: #f41c20 !important; }

.text-orange { color: #f39c12 !important; }

.text-yellow { color: #f1c40f !important; }

.text-green { color: #36d2a5 !important; }

.text-cyan { color: #4eccdb !important; }

.text-blue { color: #1b80d2 !important; }

.text-purple { color: #9b59b6 !important; }

.text-pink { color: #ff8aab !important; }

.md-gray { background-color: #f5f5f5; color: #797979; }

.md-red { background-color: #f41c20; }

.md-orange { background-color: #f39c12; }

.md-yellow { background-color: #f1c40f; }

.md-green { background-color: #36d2a5; }

.md-cyan { background-color: #4eccdb; }

.md-blue { background-color: #1b80d2; }

.md-purple { background-color: #9b59b6; }

.md-pink { background-color: #ff8aab; }

.md-lightblue { background-color: #e9f3fd; }

.md-deepblue { background-color: #147; }

.gd-gray { background: #ece9e6; background: -webkit-linear-gradient(60deg, #ece9e6, #f8f8f8); background: linear-gradient(60deg, #ece9e6, #f8f8f8); }

.gd-red { background: #ee0979; background: -webkit-linear-gradient(60deg, #ee0979, #ff6a00); background: linear-gradient(60deg, #ee0979, #ff6a00); }

.gd-orange { background: #ff5858; background: -webkit-linear-gradient(60deg, #ff5858, #fcab2a); background: linear-gradient(60deg, #ff5858, #fcab2a); }

.gd-yellow { background: #ffcf83; background: -webkit-linear-gradient(60deg, #eaa02a, #ffcf83); background: linear-gradient(60deg, #eaa02a, #ffcf83); }

.gd-green { background: #96deda; background: -webkit-linear-gradient(60deg, #50c9c3, #96deda); background: linear-gradient(60deg, #50c9c3, #96deda); }

.gd-cyan { background: #36d1dc; background: -webkit-linear-gradient(60deg, #5b86e5, #36d1dc); background: linear-gradient(60deg, #5b86e5, #36d1dc); }

.gd-blue { background: #00c6fb; background: -webkit-linear-gradient(60deg, #005bea, #00c6fb); background: linear-gradient(60deg, #005bea, #00c6fb); }

.gd-purple { background: #834d9b; background: -webkit-linear-gradient(60deg, #834d9b, #d04ed6); background: linear-gradient(60deg, #834d9b, #d04ed6); }

.gd-pink { background: #ff8aab; background: -webkit-linear-gradient(60deg, #fa647e, #ff8aab); background: linear-gradient(60deg, #fa647e, #ff8aab); }

.gd-lightblue { background: #b2fefa; background: -webkit-linear-gradient(60deg, #0ed2f7, #b2fefa); background: linear-gradient(60deg, #0ed2f7, #b2fefa); }

.gd-deepblue { background: #4b6cb7; background: -webkit-linear-gradient(60deg, #182848, #4b6cb7); background: linear-gradient(60deg, #182848, #4b6cb7); }

    .md-red,
    .md-red > a,
    .md-orange,
    .md-orange > a,
    .md-yellow,
    .md-yellow > a,
    .md-green,
    .md-green > a,
    .md-cyan,
    .md-cyan > a,
    .md-blue,
    .md-blue > a,
    .md-purple,
    .md-purple > a,
    .md-pink,
    .md-pink > a,
    .md-lightblue,
    .md-lightblue > a,
    .md-deepblue,
    .md-deepblue > a,
    .gd-red,
    .gd-red > a,
    .gd-orange,
    .gd-orange > a,
    .gd-yellow,
    .gd-yellow > a,
    .gd-green,
    .gd-green > a,
    .gd-cyan,
    .gd-cyan > a,
    .gd-blue,
    .gd-blue > a,
    .gd-purple,
    .gd-purple > a,
    .gd-pink,
    .gd-pink > a,
    .gd-lightblue,
    .gd-lightblue > a,
    .gd-deepblue,
    .gd-deepblue > a { color: #fff !important; }



/* 返回顶部 */

.backtop { position: fixed; bottom: 60px; right: 30px; display: block; width: 56px; height: 56px; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABt0lEQVRYR+2W/U0CQRTEZzrQCsQKpAOxA6xArQCpAK1AOxBKsAKxAzsQO4AKxsxllxzn3tcS5Q+5hJBc9u387u28t4848MMD62MvAEkzAEMAdyTXOR+TDSDpBcBtEP0AcJUDkQVQEl8AWAIwTBZEb4CyOMkiA5L8nwXRCyAlHs89F6IzQJP4PhCdALqI50K0AvQRz4FoBJB0D+AJwCIarmutd/VEG4CbzIjkc1fh8roA4Y8Yk1yl9mg9ghzhPjFHgGMGKOmyzTQk3yvuPgFwUYn7qnN60/4GUAeA7VGFGeChJsY343W8liW5fKugMdRlOTVAebMBgBs3HgDbuiVZrJE0AvAG4DVcv2UOZ2UC4LG03kDO8E4GQ5DfL3dMWBLwcOHgnSfAego6TQ0fkjwTrEka1MAFAMkfZg/ZmWQBpDZMCbYAOKuz/wEAIGVa3xGbP8lATcVsikuqUt/R5Y0m7OsBT8wViFXsGb8BMCTpkmysggiUBQDgPNX1JH0CcEdsLcNcADcqi7hJzStptah/0zjANJVhHYAFPOPP6/q6pDEAt9izCoBN5Ti7u3jCRDSInTFlxuN1/A1pl0UHHCBA+AAAAABJRU5ErkJggg=="); background-color: #f18d00; background-position: center; background-repeat: no-repeat; border-radius: 2px; box-shadow: 0 15px 35px rgba(0, 0, 0, .2); z-index: 9; }





/* webkit滚动条 */

::-webkit-scrollbar { width: 6px; height: 6px; }

::-webkit-scrollbar-thumb { background-color: #bbb; }

    ::-webkit-scrollbar-thumb:hover { background-color: #aaa; }

::-webkit-scrollbar-track-piece { background-color: #ddd; }





/* 标题 */

.t1 { position: relative; overflow: hidden; height: 40px; line-height: 40px; margin: 0 0 10px; }

    .t1 .more { position: absolute; top: 0; right: 0; display: inline-block; padding: 0 0 0 20px; background-color: #fff; color: #aaa; }

    .t1 b { position: relative; display: inline-block; height: 40px; padding: 0 25px; line-height: 40px; font-size: 18px; /*background-color: #f2f2f2;
    border-radius: 100px;*/ }

        .t1 b:before,
        .t1 b:after { content: ''; position: absolute; top: 50%; width: 2000px; height: 0; border-bottom: 1px solid #ddd; }

        .t1 b:before { right: 100%; margin-right: 20px; }

        .t1 b:after { left: 100%; margin-left: 20px; }

.t2 { position: relative; border: 1px solid #ddd; padding: 0 14px; line-height: 48px; background: #f8f8f8; color: #048; zoom: 1; }

    .t2:before { content: ''; position: absolute; top: -1px; left: -1px; bottom: -1px; width: 6px; background-color: #048; }

    .t2 b { display: inline-block; padding: 0 10px; font-size: 16px; }

.t3 { position: relative; border-bottom: 1px dotted #ddd; padding: 12px 15px; line-height: 16px; }

    .t3 b { display: inline-block; border-left: 8px solid #a3bde2; margin-left: -15px; padding: 0 0 0 10px; color: #048; }

.t4 { margin: 0 10px; padding: 5px; line-height: 20px; font-size: 15px; color: #048; }


/* 在哪 */

.where { /*height: 40px;*/ padding: 0 10px; line-height: 40px; background-color: #fff; border-radius: 3px; }

    .where i { margin: 0 10px; color: #ccc; font-size: 16px; vertical-align: middle; }


    .where .back { display: inline-block; padding: 0 10px; color: #797979; }

    .where a,
    .where span { margin: 0 10px; }

        .where a.home { margin: 0; }


/* tab */

.jr-tab { height: 40px; border-bottom: 1px solid #a3bde2; }

    .jr-tab li { float: left; margin-left: 4px; }

        .jr-tab li a { display: inline-block; margin-bottom: -1px; padding: 0 20px 1px; line-height: 38px; border: 1px solid #a3bde2; -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; transition: all .2s; }

            .jr-tab li a:hover { background-color: #f0f6fc; color: #1b80d2; }

        .jr-tab li.current a,
        .jr-tab li.on a,
        .jr-tab li.current a:hover,
        .jr-tab li.on a:hover { border-color: #1b80d2; background-color: #1b80d2; color: #fff; }


.jr-tab2 { height: 50px; border-bottom: 1px solid #ddd; }

    .jr-tab2 li { float: left; }

        .jr-tab2 li a { position: relative; display: block; padding: 0 38px; line-height: 50px; font-size: 15px; text-align: center; color: #797979; -webkit-transition: color 0.3s; transition: color 0.3s; }

        .jr-tab2 li.current a,
        .jr-tab2 li.on a { color: #1b80d2; font-weight: bold; }

        .jr-tab2 li + li a::after { content: ''; position: absolute; top: 18px; bottom: 18px; left: 0; width: 1px; background-color: #ddd; }

        .jr-tab2 li a::before { content: ''; position: absolute; bottom: -1px; left: 15%; width: 70%; height: 4px; background: #3c8ce7; -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); -webkit-transition: -webkit-transform 0.1s; transition: transform 0.1s; }

        .jr-tab2 li.current a::before,
        .jr-tab2 li.on a::before { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; }

    .jr-tab2 i { float: left; display: block; width: 24px; height: 24px; margin: 13px 6px 13px 0; line-height: 24px; text-align: center; font-size: 24px; vertical-align: middle; color: #ccc; }

    .jr-tab .current i,
    .jr-tab .on i,
    .jr-tab2 .current i,
    .jr-tab2 .on i { color: inherit; }


/* jr栅格、间隔20、基于浮动、宽度定义、暂不兼容移动端 */

.jr-grid { padding: 20px; }

.jr-row { margin-left: -10px; margin-right: -10px; }

.jr-col { float: left; box-sizing: border-box; padding-left: 10px; padding-right: 10px; }

.w80 { width: 80%; }

.w70 { width: 70%; }

.w60 { width: 60%; }

.w50 { width: 50%; }

.w40 { width: 40%; }

.w30 { width: 30%; }

.w20 { width: 20%; }

.w75 { width: 75%; }

.w25 { width: 25%; }

.w66 { width: 66.67%; }

.w33 { width: 33.33%; }

.w16 { width: 16.66%; }


/*  各种列表 */

.list li { position: relative; line-height: 1.5; }

    .list li > a { display: block; overflow: hidden; text-overflow: ellipsis; }

[class*="list-"] .pic,
.pic-text .pic { display: block; position: relative; overflow: hidden; }

    [class*="list-"] .pic img,
    .pic-text .pic img { display: block; width: 100%; min-height: 100%; transition: all 0.3s; }

    [class*="list-"] .pic:hover img,
    .pic-text .pic:hover img { transform: scale(1.05); }


/* 文字列表基础 */

.list-t li { position: relative; padding-left: 20px; line-height: 40px; font-size: 16px; }

    .list-t li:before { content: ""; position: absolute; top: 50%; left: 0; width: 4px; height: 4px; margin-top: -2px; background-color: #ddd; border-radius: 100px; }

    .list-t li:hover:before { background-color: #1b80d2; }

    .list-t li a { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

    .list-t li .date { position: absolute; top: 0; right: 0; color: #bbb; }

        .list-t li .date + a { width: 70%; }

@media (max-width: 480px) {

    .list-t li a.w60,
    .list-t li a.w70,
    .list-t li a.w80,
    .list-t li .date + a { width: 100%; }

    .list-t li .date { display: none; }
}


/* 图片列表基础样式 */

.list-p li a { display: block; margin: 10px; }

.list-p li h4 { margin: 10px 0; line-height: 24px; overflow: hidden; white-space: nowrap; word-break: keep-all; text-overflow: ellipsis; }

.list-p li p { line-height: 22px; color: #797979; }


/* 链接列表基础样式 */

.list-a li a { display: block; text-align: center; transition: all .3s; }

.list-a li i { display: inline-block; width: 40px; height: 40px; line-height: 40px; text-align: center; font-size: 24px; vertical-align: middle; transition: all .3s; }


/* 标题加简介列表基础样式 */

.list-b li { position: relative; padding: 15px; line-height: 24px; }

    .list-b li > a { display: block; }

        .list-b li > a:after { content: "\20"; display: block; height: 0; clear: both; }

    .list-b li h4 { position: relative; overflow: hidden; max-height: 48px; line-height: 24px; font-weight: bold; font-size: 16px; margin-bottom: 10px; }

        .list-b li h4 i { margin-right: 10px; font-size: 14px; color: #ccc; }

    .list-b li p { line-height: 24px; color: #797979; word-break: break-all; }

    .list-b li .pic { float: left; width: 120px; height: 90px; margin-right: 20px; }

@media (max-width: 480px) {
    .list-b li h4 { font-size: 14px; }

    .list-b li .pic { width: 72px; height: 48px; }

        .list-b li .pic img { width: 72px; }
}


/* 常规列表分享 */

.list li .share { position: absolute; top: 50%; right: 20px; height: 50px; margin-top: -25px; line-height: 50px; }

    .list li .share .share-box { position: absolute; top: 8px; right: 38px; z-index: 999; box-sizing: content-box; width: 70px; padding: 5px !important; opacity: 0; transition: opacity 0.35s; }

    .list li .share:hover .share-box { opacity: 1; }

    .list li .share .share-box a { float: left; display: block; width: 24px; height: 24px; margin: 0 5px !important; padding: 0 !important; vertical-align: middle; transform: scale(0.8); transition: transform 0.35s; }

    .list li .share:hover .share-box a { transform: scale(1); }

    .list li .share i { display: inline-block; width: 24px; height: 24px; margin: 13px; line-height: 24px; text-align: center; font-size: 18px; background-color: #ccc; color: #fff; border-radius: 3px; }

    .list li .share:hover i { background-color: #1b80d2; }

.list .bdshare_popup_box { margin-left: -200px; }

@media (max-width: 992px) {
    .list li .share { top: auto; right: 5px; bottom: 5px; }
}

@media (max-width: 480px) {
    .list li .share { position: relative; top: 0; right: 0; bottom: 0; margin: 0 0 -15px -15px; }

    .list li .share-box { left: 38px; right: auto; }
}


/* 列表hover样式 */

.hover-style1 li { position: relative; overflow: hidden; }

    .hover-style1 li:after { content: ''; position: absolute; top: 0; left: 0; width: 0%; height: 100%; background: #f0f3f8; z-index: 0; transition: all 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275); }

    .hover-style1 li:hover:after { width: 100%; }

    .hover-style1 li h4,
    .hover-style1 li p,
    .hover-style1 li strong,
    .hover-style1 li a,
    .hover-style1 li span { position: relative; z-index: 1; }

.hover-style2 { position: relative; overflow: hidden; padding-bottom: 20px; }

    .hover-style2 li { position: relative; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; margin-top: -1px; }

        .hover-style2 li:hover { z-index: 1; background: #fff; box-shadow: 0 0 20px rgba(0, 0, 0, .15); }





/* 分页 */

.pages { font: 0/0 microsoft yahei; padding: 20px 0; text-align: center; }

    .pages a,
    .pages span { display: inline-block; line-height: 18px; margin: 0 2px 10px 2px; padding: 10px 15px; font-size: 14px; vertical-align: middle; background-color: #f5f5f5; border-radius: 2px; }

        .pages a:hover { position: relative; background-color: #a3bde2; color: #fff; }

    .pages .current { background-color: rgb(45,102,165); color: #fff; position: relative; }

    .pages .disabled { color: #ccc; cursor: not-allowed; }

    .pages select { border: 1px #d2d2d2 solid; padding: 4px; }


/* 侧栏 */

.side-menu h2 { position: relative; height: 80px; line-height: 80px; font-size: 24px; margin: -20px -20px 20px; padding: 0 20px; }

.side-menu ul { margin: 0 -20px; }

.side-menu li a { position: relative; display: block; line-height: 60px; text-align: center; font-size: 20px; }

    .side-menu li a:hover { background-color: #f1f1f1; /*background-image: linear-gradient(to right, #eee, rgba(0, 0, 0, 0));*/ }

    .side-menu li a:before { content: ''; display: block; position: absolute; top: 0; bottom: 0; left: 0; width: 4px; background-color: #2d8fff; transform: scale(1, 0); transition: all .3s; }

    .side-menu li a:hover:before { transform: scale(1, 1); }

/*  正文 */

.article { padding: 30px 0; word-break: break-all; }

    .article h2 { padding: 15px 0; line-height: 1.5; font-size: 24px; text-align: center; color: #333; }

    .article .option { box-sizing: border-box; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; margin: 20px 0; padding: 20px; line-height: 30px; color: #ccc; transition: padding .3s; }

        .article .option h4 { display: none; }

    .article .info { color: #ccc; }

        .article .info > span { color: #027; }

        .article .info i { margin: 0 10px 0 0; font-size: 16px; color: #ccc; vertical-align: -1px; }

    .article .option.fixed { position: fixed; top: 0; left: 0; z-index: 9; width: 100%; border-top: none; margin: 0; padding: 20px 10px; background-color: #fff; box-shadow: 0 10px 20px rgba(0, 0, 0, .1); }

        .article .option.fixed h4 { display: block; position: absolute; top: 50%; left: 20%; right: 20%; width: 60%; height: 30px; margin-top: -15px; line-height: 30px; text-align: center; font-size: 18px; font-weight: bold; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

        .article .option.fixed .info { display: none; }

        .article .option.fixed .jfontsize { float: none; padding: 0; }

.jfontsize { float: right; height: 32px; margin: -1px 0; padding: 0 20px; }

    .jfontsize a { float: left; box-sizing: content-box; display: block; width: 24px; height: 24px; border: 1px solid #ddd; margin: 0 4px; padding: 3px; background-color: #fff; -webkit-border-radius: 3px; border-radius: 3px; }

        .jfontsize a i { display: block; width: 24px; height: 24px; line-height: 24px; background-image: url(../../images/infopublic_new_images/jfont.png); background-repeat: no-repeat; }

#jfontsize-p2 i { background-position: 0 0; }

#jfontsize-m2 i { background-position: -24px 0; }

#jfontsize-d2 i { background-position: -48px 0; }

a#jfontsize-p2:hover i { background-position: 0 -24px; }

a#jfontsize-m2:hover i { background-position: -24px -24px; }

a#jfontsize-d2:hover i { background-position: -48px -24px; }

.article .option .share { float: right; margin: -7px 0; }

    .article .option .share a + a { margin-left: 10px; }

.article .option .bds_tsina { background: url(../../images/infopublic_new_images/wb.png) center no-repeat !important; background-size: 32px auto !important; }

.article .option .bds_weixin { background: url(../../images/infopublic_new_images/wx.png) center no-repeat !important; background-size: 32px auto !important; }

.bdshare_popup_box { margin-left: -200px; }

.article-box { padding: 30px 60px; line-height: 2; text-align: justify; color: #333; font-size: 16px; }

    .article-box p { margin: 1em 0; }

        .article-box p img { display: block; max-width: 80%; margin: 0 auto; }

.article .jr-btn { min-width: 180px; }

.article .files { padding: 15px; }

    .article .files li { border-bottom: 1px dotted #ddd; padding: 8px; line-height: 24px; font-size: 16px; }

@media (max-width: 768px) {
    .article h2 { margin: 0 10px; }

    .article .jfontsize,
    .article .option h4 { display: none; }

    .article .option { padding: 20px 10px; }

        .article .option.fixed { padding: 10px 5px; }

            .article .option.fixed .share,
            .article .option.fixed .jfontsize { display: block; }

            .article .option.fixed .info,
            .article .option.fixed h4 { display: none; }

    .article .jfontsize { float: none; padding: 0; }

    .article-box { padding: 15px; }
}

@media (max-width: 480px) {
    .article .share { display: none; }

    .article .option .info span { display: block; }
}

@media (max-width: 480px) {
    .article h2 { margin: 0 10px; }
    .article .option .info span { display: block; }
    .article .share,
    .article .jfontsize,
    .article .option h4 { display: none; }

    .article .option { padding: 20px 10px; }

        .article .option.fixed { padding: 10px 5px; }

            .article .option.fixed .share,
            .article .option.fixed .jfontsize { display: block; }

            .article .option.fixed .info,
            .article .option.fixed h4 { display: none; }

    .article .jfontsize { float: none; padding: 0; }

    .article-box { padding: 15px; }
}

/* 组图 */

.photos { width: 90%; max-width: 800px; margin: 40px auto; font-size: 14px; }

    .photos p { margin: 0; }

    .photos .pic { position: relative; overflow: hidden; height: 500px; border: 1px solid #ddd; padding: 34px; text-align: center; background-color: #fff; border-radius: 5px 5px 0 0; }

        .photos .pic img { min-width: 200px; max-width: 100%; max-height: 500px; margin: 0 auto; background: url(../../images/infopublic_new_images/loading.gif) center no-repeat; background-size: 24px; }

        .photos .pic li { position: relative; height: 500px; }

            .photos .pic li a { position: relative; overflow: hidden; display: inline-block; min-width: 200px; line-height: 0; font-size: 0; top: 50%; transform: translate(0, -50%); transition: all .3s; }

            .photos .pic li span { display: inline-block; position: absolute; bottom: 0; left: 0; right: 0; padding: 15px; line-height: 20px; font-size: 16px; background: #333; background: linear-gradient(to top, rgba(0, 0, 0, .5) 50%, rgba(0, 0, 0, 0) 100%); color: #fff; opacity: 0; transform: translate(0, 90px); transition: all .3s; }

            .photos .pic li:hover span { opacity: 1; transform: translate(0, 0); }

    .photos .handle { position: absolute; bottom: -1px; left: 50%; width: 80px; height: 24px; margin-left: -40px; line-height: 24px; background-color: #fff; background-color: rgba(255, 255, 255, .5); border: 1px solid #ddd; border-radius: 3px 3px 0 0; }

.play-state { display: inline-block; width: 16px; height: 16px; margin: 4px; line-height: 16px; text-align: center; background: url("data:image/svg+xml,%3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3Cstyle/%3E%3C/defs%3E%3Cpath fill='%2300a0e9' d='M238.933 170.667h204.8v682.666h-204.8zm341.334 0h204.8v682.666h-204.8z'/%3E%3C/svg%3E") center no-repeat; vertical-align: middle; cursor: pointer; }

.pauseState { background: url("data:image/svg+xml,%3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%2306b' d='M388.876 833.1l438.132-352.593-438.133-344.248z'/%3E%3C/svg%3E") center no-repeat; }

.page-state { display: inline-block; width: 4em; text-align: center; vertical-align: middle; }

.pic-prev,
.pic-next { position: absolute; top: 50%; display: block; width: 50px; height: 50px; margin-top: -25px; line-height: 50px; text-align: center; font-size: 24px; cursor: pointer; background-color: rgba(0, 0, 0, .5); color: #fff; opacity: 0; transition: all .3s; }

.pic-prev { transform: translate(-50px, 0); left: 10px; }

.pic-next { transform: translate(50px, 0); right: 10px; }

.photos .pic:hover .pic-prev,
.photos .pic:hover .pic-next { opacity: 1; transform: translate(0, 0); color: #fff; }

.pic-prev:hover,
.pic-next:hover { background-color: #00a0e9; }

.photos .preview { position: relative; border: 1px solid #ddd; margin-top: -1px; padding: 0 4px; height: 100px; background-color: #fff; border-radius: 0 0 5px 5px; }

    .photos .preview li { float: left; width: 20%; font-size: 14px; }

        .photos .preview li a { position: relative; overflow: hidden; display: block; height: 80px; margin: 10px 5px; line-height: 20px; background-color: #f1f1f1; transition: all .3s; }

        .photos .preview li.on a { background-color: #00a0e9; color: #fff; }

        .photos .preview li img { display: block; margin: 0 auto; width: 100%; min-height: 80px; opacity: .5; transform: scale(1); transition: all .3s; }

        .photos .preview li a:hover img,
        .photos .preview li.on img { transform: scale(1.05); opacity: 1; }

        .photos .preview li a span { display: block; max-height: 60px; margin: 10px; overflow: hidden; }

.preview-prev,
.preview-next { position: absolute; top: 50%; width: 24px; height: 24px; line-height: 24px; margin-top: -12px; text-align: center; font-size: 18px; background-color: #06b; color: #fff; box-shadow: 0 5px 10px rgba(0, 0, 0, .15); opacity: 0; transform: scale(0.8, 0.8); transition: all .3s; }

.prevStop,
.nextStop { background-color: #aaa !important; cursor: not-allowed; }

.preview:hover .preview-prev,
.preview:hover .preview-next { transform: scale(1, 1); opacity: 1; color: #fff; }

.preview-prev { left: -12px; }

.preview-next { right: -12px; }

@media (max-width: 768px) {
    .photos { width: auto; margin: 20px 0; }

        .photos .pic { padding: 14px; }

        .photos .preview { display: none; }
}


/* 空页面 */

.blank h2 { padding: 0.2em 10%; font: bold 120px/2em inherit; background-color: #1b80d2; color: #fff; text-shadow: 0 15px 30px rgba(0, 0, 0, .15); }

.blank h3 { padding: 30px 10%; font: bold 24px/2em inherit; }

.blank p { padding: 0 10%; font: normal 16px/2em inherit; }


/* 提示 */

.note { border: 1px solid #a3bde2; padding: 19px; line-height: 2em; background-color: #f0f6fc; color: #048; }

    .note p strong { color: #f80; }


/* bootstrap grid */

.no-gutters { margin-right: 0; margin-left: 0; }

    .no-gutters > .col,
    .no-gutters > [class*="col-"] { padding-right: 0; padding-left: 0; }


/* 屏幕响应 */

@media (max-width: 992px) {
}


/* 移动端更多 开始 */
.panel-more { margin: 10px 0; padding: 0 !important; background: none; }

    .panel-more:before { display: none !important; }

    .panel-more a { position: relative; display: block; line-height: 40px; font-size: 16px; text-align: center; border: .5px solid #e9e9e9; background-color: #fff; color: #666; border-radius: 4px; }

        .panel-more a::before, .panel-more a::after { position: absolute; top: 0; content: '\2022'; font-weight: normal; font-size: 12px; color: #ddd; text-shadow: 8px 0 #ddd, -8px 0 #ddd; pointer-events: none; }

        .panel-more a::before { left: 30%; }

        .panel-more a::after { right: 30%; }

@media (max-width: 1024px) {
    .panel-more a { display: inline-block; width: 96%; }
}
