@charset "utf-8";
::-webkit-scrollbar{ width: 6px; height: 1px;}
::-webkit-scrollbar-thumb { border-radius: 3px; background: #232323;}
::-webkit-scrollbar-track { border-radius: 3px; background: #fff;}

.header{ position: relative; width: 100%; padding: 26px 60px; background: url('../img/cloud.png') #a80505; z-index: 9;}
.header .head{ display: flex; height: 100%; flex-flow: row nowrap; justify-content: space-between; align-items: center;}
.header .head .logo a{ display: block; height: 78px;}
.header .head .logo a img{ display: block; width: auto; height: 100%; }
.header .head .mobile-btn{ display: none;}
.nav-list{ }
.nav-list li{ position: relative; float: left; font-size: 18px; line-height: 1.5;}
.nav-list li>a{ display: block; padding: .5em .75em; border-radius: 4px 4px 0 0; color: #fff; }
.nav-list li:hover>a{ background: #f3bd00;}
.nav-list li dl{ position: absolute; top: 2.5em; width: 100%; padding: 10px; border-radius: 0 0 4px 4px; font-size: 18px; background: #fff; display: none;}
.nav-list li dl dd{ background: #fff;}
.nav-list li dl dd a{ display: block; padding: .35em 0; font-size: 16px; color: #a80505; line-height: 1.5; text-align: center; }
.nav-list li:hover dl{ display: block;}

.slider-box{ position: relative; background: #eee;}

.slider{ position: relative; font-size: 0;}
.slider .items i{ display: block; width: 100vw; height: 47vw;}

.slider .slick-arrow{ position: absolute; bottom: 66px; width: 42px; height: 33px; z-index: 1; cursor: pointer;}
.slider .slick-prev{ left: 60px; background: url('../img/left-s.png') center center no-repeat #5f5f5f;}
.slider .slick-next{ left: 110px; background: url('../img/right-s.png') center center no-repeat #e71813;}

.slider .slick-dots{ position: absolute; bottom: 50px; left: 50%; padding: 10px; margin-left: -42px; border-radius: 30px; font-size: 0; text-align: center; background: rgba(37, 37, 37, .32);}
.slider .slick-dots li{ display: inline-block; width: 11px; height: 11px; margin: 0 5px; border-radius: 50%; text-indent: 9999px; background: #fff;}
.slider .slick-dots li.slick-active{ background: #a80505;}

.video-box{ position: absolute; right: 60px; bottom: 60px; width: 310px;}
.video-box .title{ display: flex; justify-content: space-between; padding: 20px 0;}
.video-box .title span{ position: relative; padding-left: .5em; font-size: 24px; color: #000;}
.video-box .title span:before{ content: ''; position: absolute; top: 0; bottom: 0; left: 0; display: block; width: 5px; height: 11px; margin: auto; background: #990707;}
.video-box .title a{ height: 28px; padding: 0 .75em; line-height: 28px; border-radius: 4px; font-size: 14px; color: #fff; background: #d20d0c;}
.video-box .content a{ display: block; width: 100%; height: 210px; border: 5px solid #fff; border-radius: 10px; }
.video-box .content a img{ display: block; width: 100%; height: 100%;}

.line{ width: 100%; height: 18px; background: url('../img/cloud.png') #f79b0e;}

.wrapper{ width: 100%; height: auto; padding-top: 95px; background: #fcf9f2;}
.wrapper:after{ content: ''; display: block; clear: both;}

.column{ width: 100%; max-width: 1440px; margin: auto; overflow: hidden;}

.about-box{ width: 100%; overflow: hidden;}

.about{ float: left; width: 39%; height: 660px; border-radius: 10px; overflow: hidden; background:url('../img/cloud.png') #b20000;}
.about .thumb{ width: 100%; height: 335px; background: #fff;}
.about .info{ position: relative; padding: 40px 35px 60px;}
.about .info .title{ position: relative; padding: 10px 0;}
.about .info .title em{ padding-right: .5em; font-size: 20px; color: #fff;}
.about .info .title span{ font-size: 24px; font-weight: bold; color: #ffef87;}
.about .info .title i{ position: absolute; right: 0; width: 50%; text-align: right; font-size: 24px; text-transform: uppercase; color: #cc1e1d; background: url('../img/about-more.png') 0 center no-repeat;}
.about .info .content{ display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; word-break: break-word; overflow: hidden; font-size: 14px; line-height: 30px; color: #fff; text-indent: 2em;}
.about .more{ position: absolute; right: 35px; bottom: 0; width: 83px; height: 30px; border: 1px solid #fff; border-radius: 2px; text-align: center; font-size: 14px; line-height: 28px; color: #fff; cursor: pointer;}


.notify{ float: right; width: 59%; height: 335px; padding: 0 44px; margin-bottom: 30px; border: 1px solid #e8e8e8; border-radius: 10px; overflow: hidden; background: url('../img/notify-bg.png');}
.notify .title{ position: relative; line-height: 40px;}
.notify .title span{ display: block; font-size: 24px; font-weight: bold; color: #333;}
.notify .title a{ position: absolute; top: 0; right: 0; width: 7em; margin: auto; text-align: right; font-size: 14px; color: #b60d0c; background:url('../img/notify-more.png') 0 center no-repeat;}
.notify .time{ padding-top: 30px; padding-bottom: 20px; padding-left: 70px; border-bottom: 1px dotted #c8c8c8; background: url('../img/time-ico.png') 0 35px no-repeat;}
.notify .time .content{ display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-word; overflow: hidden; padding-top: 10px; font-size: 14px; line-height: 30px; color: #333;}

.notify .notice{ padding-top: 30px; padding-bottom: 20px; padding-left: 70px; background: url('../img/notice-ico.png') 0 35px no-repeat;}
.notify .notice .content{ padding-top: 10px; font-size: 14px; line-height: 30px; color: #333;}

.notice-list{ display: flex; flex-flow: row nowrap; justify-content: space-between;}
.notice-list li{  width: 46%;}
.notice-list li a{ display: block; overflow: hidden;}
.notice-list li a span{ float: left; font-size: 14px; line-height: 30px; color: #111;}
.notice-list li a span:before{ content: ''; display: inline-block; width: 5px; height: 5px; margin-right: .5em; vertical-align: middle; background: #bfbfbf;}
.notice-list li a i{ float: right; font-size: 14px; line-height: 30px; color: #999;}


.scroll{ float: right; width: 59%; height: 295px; border: 1px solid #e8e8e8; border-radius: 10px; overflow: hidden; background: #fff;}
.scroll .content{ height: 100%; padding-top: 45px;}
.scroll-list{ position: relative; padding: 0 8%;}
.scroll-list .slick-arrow{ position: absolute; top: 0; width: 8%; height: 100%; cursor: pointer;}
.scroll-list .slick-prev{ left: 0; background: url('../img/left.png') center center no-repeat;}
.scroll-list .slick-next{ right: 0; background: url('../img/right.png') center center no-repeat;}
.scroll-list li{}
.scroll-list li a{ display: block;}
.scroll-list li a .thumb{ height: 150px; text-align: center;}
.scroll-list li a .thumb img{ display: inline-block; height: 150px;}
.scroll-list li a .info{ text-align: center;}
.scroll-list li a .info .cn{ font-size: 18px; line-height: 1.5; color: #333;}
.scroll-list li a .info .en{ font-size: 12px; line-height: 1.5; color: #c2c2c2; text-transform: uppercase;}


.news-box{ width: 100%; padding: 40px 0;}
.news-box .title{ position: relative; padding-bottom: 30px; overflow: hidden;}
.news-box .title span{ float: left; font-size: 24px; font-weight: bold; color: #a80505;}
.news-box .title span:before{ content: '◆ '; color: #000; font-size: 20px;}
.news-box .title .more{ position: absolute; top: 0; right: 0; bottom: 0; height: 30px; padding: 0 1em; margin: auto; font-size: 14px; line-height: 30px; border-radius: 2px; color: #fff; background: #d20d0c;}
.news-box .content{ overflow: hidden;}

.news-list{ overflow: hidden;}
.news-list dd{ float: left; width: 49%; margin-top: 30px;}
.news-list dd:last-child{ float: right;}
.news-list dd a{ display: block;}
.news-list dd a .box{ position: relative; padding: 29px 39px; border: 1px solid #e8e8e8; border-radius: 10px; background: #fff;}
.news-list dd a .box .caption{ position: relative; padding-bottom: 9px; font-size: 18px; line-height: 35px; border-bottom: 1px dotted #bfbfbf; color: #000; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.news-list dd a .box .caption:before{ content: '◆'; position: absolute; left: -1em; color: #cbcbcb;}
.news-list dd a .box .desc{ display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-word; overflow: hidden; margin: 10px 0; font-size: 14px; line-height: 30px; color: #666;}
.news-list dd a .box .more{ display: block; width: 68px; border-radius: 2px; font-size: 14px; line-height: 30px; text-align: center; color: #fff; background: #d20d0c;}
.news-list dd a .box .time{ position: absolute; right: 40px; bottom: 30px; padding-left: 40px; font-weight: bold; color: #c3c3c3; background:url('../img/time.png') left bottom no-repeat;}
.news-list dd a .box .time .yy{ font-size: 16px; line-height: 1;}
.news-list dd a .box .time .md{ font-size: 32px; line-height: 1;}

.news-list dt a{ display: block; overflow: hidden;}
.news-list dt a .thumb{ float: left; width: 49%; height: 280px; border-radius: 10px; overflow: hidden; background: #000;}
.news-list dt a .info{ float: right; width: 49%; position: relative; padding: 10px 40px;}
.news-list dt a .info .caption{ position: relative; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; overflow: hidden; margin-top: 10px; font-size: 24px; line-height: 35px; color: #000;}
.news-list dt a .info .caption:before{ content: '◆'; position: absolute; left: -1em; color: #d20d0c;}
.news-list dt a .info .desc{ display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-word; overflow: hidden; margin: 30px 0; font-size: 14px; line-height: 30px; color: #666;}
.news-list dt a .info .more{ display: block; width: 68px; border-radius: 2px; font-size: 14px; line-height: 30px; text-align: center; color: #fff; background: #d20d0c;}
.news-list dt a .info .time{ position: absolute; right: 40px; bottom: 0; padding-left: 40px; font-weight: bold; color: #c3c3c3; background:url('../img/time.png') left bottom no-repeat;}
.news-list dt a .info .time .yy{ font-size: 16px; line-height: 1;}
.news-list dt a .info .time .md{ font-size: 32px; line-height: 1;}

.show-box{ float: left; width: 49%; height: 278px; border-radius: 10px; background: #fff; overflow: hidden;}
.show-box .title{ float: left; width: 55px; padding:60px 10px; height: 100%; font-size: 24px; line-height: 1.15; text-align: center; color: #fff; background:url('../img/show-title.png') no-repeat;}
.show-box .content{ width: 100%; height: 100%;}
.show-list{ position: relative; width: 100%; height: 100%; font-size: 0;}
.show-list .slick-dots{ position: absolute; right: 0; bottom: 0; width: 100%; padding: 20px 0; font-size: 0; text-align: center; cursor: pointer;}
.show-list .slick-dots li{ display: inline-block; width: 10px; height: 10px; margin: 0 2px; border-radius: 50%; text-indent: 9999px; background: #fff;}
.show-list .slick-dots li.slick-active{ background: #f38900;}
.show-list li,
.show-list li a{ display: block; width: 100%; height: 278px;}


.service-box{ float: right; width: 49%; height: 278px; border-radius: 10px; background: #fff; overflow: hidden;}
.service-box .title{ float: left; width: 55px; padding:60px 10px; height: 100%; font-size: 24px; line-height: 1.15; text-align: center; color: #fff; background:url('../img/service-title.png') no-repeat;}
.service-box .content{ height: 100%; padding: 0 25px; overflow: hidden;}

.service-list{ position: relative; height: 100%; overflow: hidden;}
.service-list:after{ content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 33.33333%; margin: auto; border-top: 1px dotted #ababab; border-bottom: 1px dotted #ababab; z-index: 0;}
.service-list li{ position: relative; float: left; width: 33.33333%; height: 33.33333%; z-index: 1;}
.service-list li a{ display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; width: 100%; height: 100%;}
.service-list li a i,.service-list li a span{}
.service-list li a span{ padding-left: 1em; font-size: 18px; color: #333;}


.picture-box{ position: relative; width: 100%; margin-top: 180px; background: url('../img/picture-bg.png') center top;}
.picture-box .title{ position: absolute; top: -113px; width: 100%;}
.picture-box .title a{ display: block; width: 436px; height: 225px; margin: auto; background: url('../img/picture-title.png') center center no-repeat;}
.picture-box .content{ padding: 130px 0 130px;}

.name-list{ width: 100%; max-width: 1440px; margin: auto; margin-bottom: 30px; overflow: hidden;}
.name-list li{ float: left; width: 6.66666%; padding: .5em; font-size: 16px;}
.name-list li a{ display: block; width: 100%; height: 40px; border-radius: 4px; line-height: 40px; text-align: center; color: #fff; background: #b60d0c; overflow: hidden;}

.picture-list{ position: relative; width: 100%; max-width: 1510px; margin: auto; font-size: 0;}
.picture-list li{ padding: 0 8%;} 
.picture-list li a{ display: block; border-radius: 10px; background: #d20d0c; overflow: hidden;}
.picture-list li a .thumb{ width: 100%; height: 265px; background: #fff;}
.picture-list li a .info{ padding: 20px;}
.picture-list li a .info .caption{}
.picture-list li a .info .caption span{ font-size: 20px; color: #fff;}
.picture-list li a .info .caption em{ padding-left: 0.5em; font-size: 16px; color: #840100;}
.picture-list li a .info .desc{ display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-word; overflow: hidden; padding-top: 5px; font-size: 14px; line-height: 24px; color: #f6ba79;}
.picture-list li a .info .desc span{ padding-left: 0.5em; color: #840100;}

.picture-list .slick-dots{ position: absolute; right: 0; bottom: -72px; width: 100%; font-size: 0; text-align: center;}
.picture-list .slick-dots li{ display: inline-block; width: 14px; height: 14px; padding: 0; margin: 0 4px; border-radius: 50%; text-indent: 9999px; background: #fff;}
.picture-list .slick-dots li.slick-active{ background: #f38900;}

.link-box{ width: 100%; padding: 50px 0;}
.link-box .title{ position: relative; padding-bottom: 30px; overflow: hidden;}
.link-box .title span{ float: left; font-size: 24px; font-weight: bold; color: #a80505;}
.link-box .title span:before{ content: '◆ '; color: #000; font-size: 20px;}

.link-list{ font-size: 0;}
.link-list li{ text-align: center;}
.link-list li a{ display: inline-block; margin: auto;}
.link-list li a img{ display: block; width: 110px; height: 45px; background: #000;}

.footer{ position: relative; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; padding: 30px 60px; background: #363636;}
.footer:before{ content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 33.33333%; height: 33.33333%; margin: auto; border-left: 1px solid #484848; border-right: 1px solid #484848; z-index: 0;}
.footer:after{ content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../img/cloud.png'); opacity: 0.15; z-index: 0;}

.footer .items{ position: relative; font-size: 14px; line-height: 30px; color: #fff; z-index: 1; }
.footer .items i{ color: #898989;}
.footer .items img{ height: 57px;}
.footer .items a.login-btn{ display: inline-block; padding-left: 1.5em; margin-left: 1em; background: url('../img/a.png') left center no-repeat; color: #fff;}

.piao{ position: fixed; top: 14vw; left: 50px; width: 182px; height: 169px; z-index: 9;}
.piao b{ position: absolute; top: 0; left: 0; display: block; width: 34px; height: 30px; background: url('../img/close.png') no-repeat; z-index: 8;}
.piao a{ display: block; width: 100%; height: 100%;}

.sjj_nav{ display: none;}



/* sub */
.banner{ position: relative; width: 100%; height: 535px; background: #f8f8f8;}
.banner .caption{ position: absolute; top: 0; left: 0; right: 0; display: flex; flex-flow: column nowrap; justify-content: center; width: 100%; max-width: 1440px; height: 100%; margin: auto; z-index: 1;}
.banner .caption .cn{ font-size: 36px; line-height: 1.5; font-weight: bold; color: #fff;}
.banner .caption .en{ font-size: 24px; line-height: 1.25; text-transform: uppercase; color: #fff;}
.banner .caption .ico{ position: relative; font-size: 24px; line-height: 1; margin-top: 1em; color: #fff;}
.banner .caption .ico:after{ content: ''; position: absolute; top: 0; bottom: 0; left: .75em; display: block; width: 160px; height: 1px; margin: auto; background: #fff;}

.banner .img{ position: relative; z-index: 0;}

.container{ position: relative; width: 100%; padding-bottom: 20px; background: #fcf9f2;}
.container:before{ content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 260px; background: url("../img/cloud.png") #ffa32b; z-index: 0;}

.location{ position: relative; width: 100%; max-width: 1440px; padding: 40px 0; margin: auto; font-size: 0; z-index: 1; background:url("../img/location.png") left center no-repeat; }
.location strong,
.location a,
.location span{ font-size: 14px; color: #b00605; line-height: 1; }
.location strong,
.location a{ color: #fff}
.location a:after{ content: '>'; padding: 0 .5em;}
.location a:last-child:after{ display: none;}
.location strong{ padding-left: 20px;}

.wrap{ position: relative; width: 100%; max-width: 1440px; padding: 50px 100px; margin: auto; border-radius: 10px; background: #fff; z-index: 1;}
.wrap .sort{ display: flex; flex-flow: row nowrap; justify-content: space-around;}
.wrap .sort a{ font-size: 24px; line-height: 2.5; color: #232323;}
.wrap .sort a:hover{ color: #ae0505}
.wrap .sort a.on{ border-bottom: 2px solid #ae0505; color: #ae0505;}

.channel-page{ padding-top: 50px;}
.channel-page .channel-thumb{ width: 100%; height: 19vw; margin-bottom: 50px; border-radius: 10px; overflow: hidden;}
.channel-page .channel-text{ font-size: 18px; line-height: 2.25;}
.channel-page .channel-text img{ max-width: 100%;}

.list-page{ padding-top: 50px;}

.list-album{}
.list-album li{ padding-bottom: 50px;}
.list-album li a{ display: flex; flex-flow: row nowrap; justify-content: space-between;}
.list-album li a .thumb{ width: 48%; height: 350px; border-radius: 10px; overflow: hidden;}
.list-album li a .info{ display: flex; flex-flow: column nowrap; justify-content: space-between; align-items: start; width: 48%; padding: 20px 0;}
.list-album li a .info .caption{ font-size: 24px; line-height: 1.5; color: #000; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.list-album li a .info .caption:before{ content: '◆ '; color: #cb0000;}
.list-album li a .info .desc{ font-size: 14px; line-height: 32px; color: #000; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; word-break: break-word; overflow: hidden; }
.list-album li a .info .more{ padding: 0 1.25em; border-radius: 4px; font-size: 14px; line-height: 2.5; color: #fff; background: #cb0000;}

.list-honer{ display: flex; flex-flow: row wrap;}
.list-honer li{ width: 50%; padding: 0 5% 50px;}
.list-honer li a{ display: block;}
.list-honer li a .thumb{ width: 100%; height: 345px;}
.list-honer li a .info{ padding-top: 30px;}
.list-honer li a .info .caption{ font-size: 18px; line-height: 1.5; text-align: center; color: #333; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}

.list-people{ display: flex; flex-flow: row wrap;}
.list-people li{ width: 33.33333%; padding: 0 5% 50px;} 
.list-people li a{ display: block; border-radius: 10px; background: #d20d0c; overflow: hidden;}
.list-people li a .thumb{ width: 100%; height: 265px; background: #fff;}
.list-people li a .info{ padding: 20px;}
.list-people li a .info .caption span{ font-size: 20px; color: #fff;}
.list-people li a .info .caption em{ padding-left: 0.5em; font-size: 16px; color: #840100;}
.list-people li a .info .desc{ display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-word; overflow: hidden; padding-top: 5px; font-size: 14px; line-height: 24px; color: #f6ba79;}
.list-people li a .info .desc span{ padding-left: 0.5em; color: #840100;}

.list-user{ display: flex; flex-flow: row wrap; justify-content: space-between; padding-bottom: 50px;}
.list-user dd{ width: 45%; }
.list-user dd .caption{ padding: 2em 0 1.5em; font-size: 30px; line-height: 1.5;}
.list-user dd .caption:before{ content:'★'; color: #b00605;}
.list-user dt{ width: 100%; }
.list-user dt .caption{ padding: 2em 0 1.5em; font-size: 30px; line-height: 1.5;}
.list-user dt .caption:before{ content:'★'; color: #b00605;}
.list-user dt a.other{ display: block;}
.list-user dt a.other img{ display: block; margin: auto;}

.list-user-fixed{ width: 100%; overflow: hidden;}
.list-user-fixed li{ float: left; width: 18%; margin: 1%; }
.list-user-fixed li a{ display: block; width: 100%; height: 50px; font-size: 18px; line-height: 50px; text-align: center; color: #fff; border-radius: 4px; background: #9b584f;}
.list-user-fixed li.big{ width: 38%;}

.list-user-fixed.six li{ width: 14.66667%;}

.list-user-auto{ width: 100%; overflow: hidden;}
.list-user-auto li{ float: left; min-width: 7.5%; margin: 0.41667%; }
.list-user-auto li a{ display: block; height: 50px; padding: 0 1.25em; font-size: 18px; line-height: 50px; text-align: center; color: #fff; border-radius: 4px; background: #9b584f;}

.list-news{ padding-bottom: 50px;}
.list-news li{ border-bottom: 1px dotted #dedede;}
.list-news li a{ display: flex; flex-flow: row nowrap; justify-content: space-between; padding: 50px 30px;}
.list-news li a .info{ width: 70%;}
.list-news li a .info .caption{ position: relative; padding-left: 1em; font-size: 18px; line-height: 1.5; color: #232323; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.list-news li a .info .caption:before{ content: ''; position: absolute; top: 0; bottom: 0; left: 0; display: block; width: 8px; height: 8px; margin: auto; border-radius: 50%; background: #b21219; vertical-align: middle; }
.list-news li a .info .desc{ padding-top: 1em; font-size: 14px; line-height: 24px; color: #232323; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; word-break: break-word; overflow: hidden; }
.list-news li a .date{ display: flex; flex-flow: column nowrap; justify-content: center; font-weight: bold; color: #c3c3c3;}
.list-news li a .date .yy{ font-size: 17px; line-height: 1;}
.list-news li a .date .md{ font-size: 34px; line-height: 1; background: url("../img/time.png") no-repeat; padding-left: 1.25em; margin-left: -1.25em;}

.pagination{ width: 100%; text-align: center; font-size: 0;}
.pagination a{ display: inline-block; padding: 0 1em; margin: 0 2px; font-size: 18px; line-height: 2.5; color: #fff; background: #404040;}
.pagination a.on{ background: #cb0000;}
.pagination a.dis{background: #ccc;}


.article-page{}
.article-title{ padding: 15px 0; border-bottom: 1px dotted #D2D2D2; font-size: 0; text-align: center; line-height: 45px;}
.article-title span{ font-size: 30px; color: #333; vertical-align: middle;}
.article-title i{ font-size: 18px; color: #999; vertical-align: middle;}
.article-state{ padding: 20px; font-size: 0; text-align: center;}
.article-state i,
.article-state span{ font-size: 14px; line-height: 1.5;}
.article-state i{ padding-left: 1em; color: #9b9b9b;}
.article-state span{ padding-right: 1em; color: #333;}

.article-thumb{ margin: 30px 0 50px;}
.article-thumb img{ display: block; margin: auto; border-radius: 10px; max-width: 100%;}

.article-content{ font-size: 14px; line-height: 30px; color: #333;}
.article-content img{ max-width: 100%;}

.article-related{ display: flex; flex-flow: row nowrap; justify-content: space-around; padding-top: 50px;}
.article-related a{ min-width: 30%; padding: .75em 1.5em; border: 2px solid #bfbfbf; border-radius: 4px; font-size: 14px; line-height: 1.5; color: #333;}
.article-related a:hover{ color: #fff; border-color: #cb0000; background: #cb0000;}


.column-box{ display: flex; flex-flow: row nowrap; width: 100%; max-width: 1440px; padding: 50px 100px; margin: auto; border-radius: 10px; background: #fff; z-index: 1;}
.column-left{ display: flex; flex-flow: column nowrap; width: 24%;}
.column-left a{ position: relative; display: flex; flex-flow: row nowrap; align-items: center; padding: 15px 0}
.column-left a:before,
.column-left a:after{ content: ''; position: absolute; left: 27px; width: 1px; height: 14px; background: #bfbfbf; }
.column-left a:before{ top: -1px;}
.column-left a:after{ bottom: -1px;}
.column-left a i{ display: flex; justify-content: center; align-items: center; width: 54px; height: 54px; border-radius: 50%; background: #f1f1f1;}
.column-left a span{ padding-left: 0.5em; font-size: 18px; line-height: 1.75; color: #333;}
.column-left a:hover i{ background: #cb0000;}

.column-main{ width: 76%;}
.column-main .title{ position: relative; padding: 15px 0; overflow: hidden;}
.column-main .title span{ float: left; padding-left: 15px; font-size: 18px; line-height: 1.75; color: #cb0000;}
.column-main .title span:before{ content: ''; position: absolute; top: 0; left: 0; bottom: 0; display: block; width: 5px; height: 16px; margin: auto; background: #cb0000; vertical-align: middle;}

.column-main .page{ overflow: hidden;}
.column-main .page .content{ font-size: 18px; line-height: 40px; color: #232323}

.list-form{ display: flex; flex-flow: column nowrap; width: 100%;}
.list-form dd{ display: flex; flex-flow: row nowrap; padding: 15px 0;}
.list-form dd label{ width: 15%; font-size: 18px; line-height: 40px; text-align: right; color: #010101;}
.list-form dd label i{ color: #ca3333;}
.list-form dd input,
.list-form dd select{ width: 60%; padding: 0 .5em; border: 1px solid #a0a0a0; border-radius: 4px; font-size: 18px; line-height: 1.5; }
.list-form dd textarea{ width: 60%; padding: .5em; border: 1px solid #a0a0a0; border-radius: 4px; font-size: 18px; line-height: 1.5; background: #fff; resize: none;}
.list-form dt{ display: flex; flex-flow: row nowrap; padding: 15px 0 15px 15%;}
.list-form dt input{ font-size: 18px; line-height: 40px; padding: 0 2em; border-radius: 4px; background: #ffba00; color: #fff; border: none; cursor: pointer;}
.list-form dt input[type=button]{ background: #ca3333; margin-right: 2em;}

#map{ width: 100%; height: 420px; margin: 20px 0; border-radius: 10px; overflow: hidden; background: #f8f8f8;}

.quick-list{ position: relative; width: 100%; max-width: 1440px; padding: 50px; margin: auto; font-size: 0;}
.quick-list .items a{ display: flex; flex-flow: row nowrap; justify-content: center; align-items: center;}
.quick-list .items a span{ padding-left: 1em; font-size: 18px; line-height: 1.5; color: #333;}
.quick-list .items a i{ display: flex; justify-content: center; align-items: center; height: 27px;}
.quick-list .items a i img{ display: block; max-height: 27px;}

.quick-list .slick-arrow{ position: absolute; top: 0; bottom: 0; width: 50px; height: 100%; margin: auto; cursor: pointer;}
.quick-list .slick-prev{ left: 0; background:url("../img/left.png") center center no-repeat; background-size: 30%}
.quick-list .slick-next{ right: 0; background:url("../img/right.png") center center no-repeat; background-size: 30%}

/* interactive */
.interactive{ display: flex; justify-content: center; align-items: center;  width: 100vw; min-height: 100vh; background: url("../img/interactive-bg.jpg") center center no-repeat; background-size: cover;}
.interactive-box{ border: 1px solid #bfbfbf; border-radius: 10px; background: #fff; overflow: hidden;}
.interactive-box .title{ padding: .25em 0; text-align: center; font-size: 20px; color: #333; line-height: 1.5; background: #f3f3f3;}
.interactive-box .content{ padding: 29px;}
.interactive-list{ display: flex; flex-flow: column nowrap;}
.interactive-list dd{ padding: 8px 0;}
.interactive-list dd label{ position: relative; display: flex; flex-flow: row nowrap; border: 1px solid #eee; overflow: hidden;}
.interactive-list dd label span{ float: left; padding-left: 1em; font-size: 16px; line-height: 2.5;}
.interactive-list dd label input{ border: none; background: none; font-size: 16px; line-height: 2.5;}
.interactive-list dd label img{ position: absolute; top: 0; right: 0; width: 85px; height: 100%; border-left: 1px solid #eee; }
.interactive-list dd input[type="button"]{ width: 100%; border: none; font-size: 16px; line-height: 2.5; color: #fff; background: #ae0505;}
.interactive-list dt{ padding-top: 8px; font-size: 16px; text-align: center; color: #333;}
.interactive-list dt a{ color: #ae0505}

.member{ display: flex; justify-content: center; align-items: center;  width: 100vw; min-height: 100vh; background: url("../img/interactive-bg.jpg") center center no-repeat; background-size: cover;}
.member-box{ width: 100%; max-width: 780px; border: 1px solid #bfbfbf; border-radius: 10px; background: #fff; overflow: hidden;}
.member-box .title{ display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; padding: 10px 20px; font-size: 20px; line-height: 1.5; background: #f3f3f3;}
.member-box .title span{ font-size: 20px; color: #333; }
.member-box .title a{ font-size: 14px; line-height: 1; color: #333;}
.member-box .sort{ padding: 29px; padding-bottom: 0; background: #ae0505; overflow: hidden;}
.member-box .sort a{ float: left; padding: 0 2em; margin-right: 1px; font-size: 16px; line-height: 2.5; color: #333; background: #d0d0d0;}
.member-box .sort a.on{ background: #fff;}
.member-box .sort a.other{ float: right; margin: 0; color: #fff; background: #ffba00;}
.member-box .content{ padding: 30px; }

.member-list{ display: flex; flex-flow: column nowrap; width: 60%; margin: auto;}
.member-list dd{ padding: 8px 0;}
.member-list dd label{ position: relative; display: flex; flex-flow: row nowrap; border: 1px solid #eee; overflow: hidden;}
.member-list dd label span{ float: left; padding-left: 1em; font-size: 16px; line-height: 2.5;}
.member-list dd label input{ border: none; background: none; font-size: 16px; line-height: 2.5;}
.member-list dd label img{ position: absolute; top: 0; right: 0; width: 85px; height: 100%; border-left: 1px solid #eee; }
.member-list dd input[type="button"]{ width: 100%; border: none; font-size: 16px; line-height: 2.5; color: #fff; background: #ae0505;}
.member-list dt{ padding-top: 8px; font-size: 14px; text-align: center; color: #333;}
.member-list dt a{ color: #ae0505}

.manage-list{ width: 100%;}
.manage-list li{ display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: stretch; width: 100%; padding: 30px 0; border-bottom: 1px dotted #747474;}
.manage-list li .info{ display: flex; flex-flow: row wrap; width: 60%;}
.manage-list li .info span{ width: 50%; font-size: 16px; line-height: 1.5; padding: .5em 0;}
.manage-list li .info span i{ color: #666}
.manage-list li .info span b{ color: #000}
.manage-list li .manage{ display: flex; flex-flow: column nowrap; justify-content: space-between;}
.manage-list li .manage a{ padding: 0 2em; font-size: 16px; line-height: 2.25; color: #fff; background: #ae0505;}
.manage-list li .manage a.del{ background: #d0d0d0;}

.build-list{ width: 100%;}
.build-list .thumb{ width: 150px; height: auto; margin: auto;}
.build-list .thumb i{ display: block; width: 100%; height: 150px; background: url("../img/thumb-bg.png") center bottom no-repeat #f7f7f7;}
.build-list .thumb input{ width: 100%; margin-top: 20px; border: none; font-size: 16px; line-height: 2.25; color: #333; background: #f7f7f7;}
.build-list .info{ display: flex; flex-flow: row wrap; justify-content: space-around; width: 100%; padding-top: 20px;}
.build-list .info label{ width: 46%; margin: 10px 0; position: relative; display: flex; flex-flow: row nowrap; border: 1px solid #eee; overflow: hidden;}
.build-list .info label span{ float: left; padding-left: 1em; font-size: 16px; line-height: 2.5;}
.build-list .info label select,
.build-list .info label input{ width: 70%; border: none; background: none; font-size: 16px; line-height: 2.5;}
.build-list .info input[type="button"]{ width: 30%; margin-top: 20px; border: none; font-size: 16px; line-height: 2.5; color: #fff; background: #ae0505;}

@media screen and (max-width: 1720px) {
  .nav-list li{ font-size: 16px;}
  .nav-list li dl,
  .nav-list li dl dd a{ font-size: 16px;}
}
@media screen and (max-width: 1600px) {
  .header .head .logo a{ height: 58px;}
  .nav-list li{ font-size: 14px;}
  .nav-list li dl,
  .nav-list li dl dd a{ font-size: 14px;}
}
@media screen and (max-width: 1440px) {
  .header{ padding: 26px 0;}
  .name-list li{ font-size: 14px;}
}
@media screen and (max-width: 1240px) {
  ::-webkit-scrollbar{ display: none;}
  body{ padding-top: 14vw;}
  .header{ position: fixed; top: 0; right: 0; padding: 2vw;}
  .header .head .logo a{ height: 10vw;}
  .header .head .mobile-btn{ display: block;}
  
  .mobile-btn{position: relative;width: 24px;height: 20px;right: 0;cursor: pointer;}
  .mobile-btn span{position: absolute;width: 100%;height: 2px;background: #fff;transition: .3s;}
  .mobile-btn span:nth-child(1){top:0;right: 0;}
  .mobile-btn span:nth-child(2){left: 0;top:50%;margin-top: -1px;}
  .mobile-btn span:nth-child(3){bottom:0;left: 0;}

  .header.act .mobile-btn span{background: #fff}
  .header.act .mobile-btn span:nth-child(1){top:50%;width: 100%;margin-top: -1px;transform: rotate(-45deg)}
  .header.act .mobile-btn span:nth-child(2){opacity: 0}
  .header.act .mobile-btn span:nth-child(3){bottom:50%;width: 100%;margin-top: -1px;transform: rotate(45deg)}

  .sjj_nav{position: fixed;top:0;left: 0;width: 100%;height: 100%;z-index: 8;background: #a80505;padding:80px 4vw 60px;box-sizing: border-box;overflow: hidden;display: none;}
  .sjj_nav .sjj_nav-box{height: 100%;overflow-y: auto}
  .sjj_nav ul li i{position:absolute;top:5px;right:0px;border-left:1px #d20d0c solid;height:30px;padding:0px 7px 0 7px;}
  .sjj_nav ul li i svg{transform:rotate(-90deg);transition:all ease 0.35s}
  .sjj_nav ul li .sjj_nav_i_se svg{transform:rotate(0deg)}
  .sjj_nav ul li{border-top:1px #d20d0c dotted;margin-left:20px;position:relative;line-height:40px;font-size:14px}
  .sjj_nav ul li ul{display:none;}
  .sjj_nav ul li a{color:#fff;width:80%}
  .sjj_nav ul li ul li a{color:#fff;display:block;text-align:left;}
  .sjj_nav ul li i svg{width:20px;height:20px;fill:#fff;}
  .sjj_nav ul li ul li>ul{margin-left:10px}

  .slider .items i{ height: 60vw;}
  .slider .slick-dots{ bottom: 4vw; padding: 4px; margin-left: -31px;}
  .slider .slick-dots li{ width: 8px; height: 8px;}

  .header .head .nav,
  .video-box,
  .piao{ display: none;}

  .wrapper{ padding: 4vw 0;}
  .column{ padding: 0 4vw;}

  .about,
  .notify,
  .scroll{ float: none; width: 100%; height: auto; margin-bottom: 4vw;}

  .about .thumb{ height: 50vw}
  .about .info{ padding: 6vw; padding-bottom: 18vw;}
  .about .info .title{ padding: 0;}
  .about .info .title em{ font-size: 14px;}
  .about .info .title span{ font-size: 18px;}
  .about .info .title i{ width: 60%; font-size: 18px;}
  .about .info .content{ padding-top: 10px; line-height: 1.75;}
  .about .more{ bottom: 6vw;}

  .notify{ padding: 4vw;}
  .notify .time{ padding: 0; padding-bottom: 6vw; background: none;}
  .notify .title span{ font-size: 18px;}
  .notify .time .content{ padding: 0; -webkit-line-clamp: 5; line-height: 1.75;}

  .notify .notice{ padding: 0; padding-top: 4vw; background: none}
  .notify .notice .content{ padding: 0;}
  .notice-list{ flex-flow: column wrap;}
  .notice-list li{float: none; width: 100%;}

  .scroll .content{ padding: 8vw 0;}

  .news-box{ padding: 4vw 0; margin-bottom: 4vw;}
  .news-box .title{ padding: 0; margin-bottom: 4vw;}
  .news-box .title span{ font-size: 18px;}

  .news-list dt a .thumb{ width: 100%; height: 40vw;}
  .news-list dt a .info{ width: 100%; padding: 0;}
  .news-list dt a .info .caption{ font-size: 16px; line-height: 1.75;}
  .news-list dt a .info .desc{ margin: 2vw 0 6vw;}
  .news-list dt a .info .time{ right: 0;}

  .news-list dd{ width: 100%; margin-top: 4vw;}
  .news-list dd a .box{ padding: 4vw 6vw;}
  .news-list dd a .box .caption{ font-size: 16px;}
  .news-list dd a .box .desc{ margin-bottom: 6vw;}
  .news-list dd a .box .time{ right: 6vw; bottom: 4vw;}

  .show-box{ width: 100%; height: auto; margin-bottom: 4vw;}
  .show-box .title{ float: none; width: 100%; height: auto; padding: 0; font-size: 18px; line-height: 2; background: #d20d0c;}
  .show-list li, .show-list li a{ height: 50vw;}

  .service-box{ width: 100%; height: auto; margin-top: 4vw;}
  .service-box .title{ float: none; width: 100%; height: auto; padding: 0; font-size: 18px; line-height: 2; background: #d20d0c;}
  .service-box .content{ padding: 0; height: auto;}
  .service-list{ height: auto;}
  .service-list:after{ height: 20vw;}
  .service-list li{ height: 20vw;}
  .service-list li a span{ font-size: 12px;}
  
  .picture-box{ margin-top: 120px;}
  .picture-box .title a{ width: 100%; background-size: 80% auto;}
  .picture-box .content{ padding: 100px 0 130px;}
  
  .name-list li{ width: 25%;}

  .link-box{ padding: 4vw 0;}
  .link-box .title{ padding-bottom: 4vw;}
  .link-box .title span{ font-size: 18px;}

  .footer{ flex-flow: column nowrap; padding: 6vw; align-items: start;}
  .footer:before{ display: none;}

  /* sub */
  .banner{ height: 50vw;}
  .banner .caption{ text-align: center;}
  .banner .caption .cn{ font-size: 24px;}
  .banner .caption .en{ font-size: 16px;}
  .banner .caption .ico{ display: none;}

  .location{ padding: 4vw}

  .wrap{ padding: 4vw;}

  .wrap .sort{ flex-flow: row wrap;}
  .wrap .sort a{ font-size: 14px;}

  .channel-page{ padding-top: 4vw;}
  .channel-page .channel-thumb{ height: 40vw; margin-bottom: 4vw;}
  .channel-page .channel-text{ font-size: 16px; line-height: 1.75;}

  .list-album li{ padding-bottom: 4vw;}
  .list-album li a{ flex-flow: column nowrap;}
  .list-album li a .thumb{ width: 100%; height: 40vw;}
  .list-album li a .info{ width: 100%; padding: 4vw 0;}
  .list-album li a .info .caption{ font-size: 18px;}
  .list-album li a .info .desc{ margin: 2vw 0; font-size: 14px; line-height: 1.75; -webkit-line-clamp: 3}

  .list-honer li{ width: 100%; padding: 4vw 0;}
  .list-honer li a .thumb{ height: 50vw;}
  .list-honer li a .info{ padding-top: 2vw;}
  .list-honer li a .info .caption{ font-size: 16px;}

  .list-people li{ width: 100%; padding: 4vw 0;}

  .list-user{ padding-bottom: 4vw;}
  .list-user dd{ width: 100%;}
  .list-user dd .caption,
  .list-user dt .caption{ font-size: 18px; font-weight: bold;}
  .list-user-fixed li a{ height: 40px; font-size: 14px; line-height: 40px;}
  .list-user-auto li{ margin: 1.3%;}
  .list-user-auto li a{ height: 40px; font-size: 14px; line-height: 40px;}

  .list-news li a{ padding: 4vw 0;}
  .list-news li a .info{ width: 100%;}
  .list-news li a .info .caption{ font-size: 16px;}
  .list-news li a .info .desc{ padding-top: 2vw; -webkit-line-clamp: 3}
  .list-news li a .date{ display: none;}
  
  .pagination a:first-child,
  .pagination a:last-child{ display: none;}

  .article-title{ padding: 4vw 0; line-height: 30px}
  .article-title span{ font-size: 20px;}
  .article-title i{ font-size: 14px;}

  .article-state{ padding: 2vw 0;}
  .article-state i,
  .article-state span{ font-size: 12px;}

  .quick-list{ padding: 4vw 10vw;}
  .quick-list .items a span{ font-size: 13px;}
  .quick-list .slick-arrow{ width: 10vw;}

  .column-box{ padding: 4vw}
  .column-left{ display: none;}
  .column-main{ width: 100%;}

  .list-form dd label{ width: 30%; font-size: 14px; }
  .list-form dd input, .list-form dd select{ width: 70%; font-size: 14px;}
  .list-form dd textarea{ width: 70%; font-size: 14px;}

  #map{ height: 60vw;}

  .column-main .page .content{ font-size: 16px; line-height: 1.75;}

  .member-box .sort{ padding: 2vw;}
  .member-box .sort a{ font-size: 14px; padding: 0 .5em;}
  .member-box .content{ padding: 4vw;}
  .member-list{ width: 100%;}
  .manage-list li{ flex-flow: column wrap;}
  .manage-list li .info{ width: 100%; flex-flow: column wrap;}
  .manage-list li .info span{ width: 100%;}
  .manage-list li .manage a{ margin: 2vw 0; text-align: center;}
  .build-list .info label{ width: 100%;}
  .build-list .info label select, .build-list .info label input{ width: 65%;}
  .build-list .info input[type="button"]{ width: 100%;}
}