@charset "utf-8";
body{ background-color: #fafcfd; position: relative;}

.banner{ height: calc(100vw * 842 / 1920); background-repeat: no-repeat; background-position: center bottom; background-size: 100%; position: relative;}
.banner .pc,.banner .app{ width:100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-repeat: no-repeat; background-position: center bottom;}
.banner .pc{ background-image: url(../images/bg_banner.png); background-size: 100%;}
.banner .app{ background-image: url(../images/bg_banner_app.png); display: none; background-size: cover; display: none;}

.swiper-container { width: 100%; height: 100%; position: relative;}
.swiper-container .swiper-pagination { width: 100%;}

.big-lm{ width:3.26rem; height: 0.86rem; margin: 0.6rem auto;}

/****涪陵概况****/
.flgk{ margin-top: calc( -1 * (100vw * 160 / 1920)); padding-bottom: 0.6rem; background: url(../images/bg_zjfl_flgk.png) center bottom no-repeat; background-size: 100%; position: relative; z-index: 1;}
.flgk .wrap{ margin:0 0 0 -0.19rem;}
.flgk .wrap .card-item{ width: calc((100% - 8.75rem) / 4); height: 4.24rem; float: left; position: relative; z-index: 4; transition: all .5s cubic-bezier(.4,0,.2,1), z-index 0s .12s; overflow: hidden;}
.flgk .wrap .card-item .item-box{ height: 100%; margin-left: 0.19rem;}
.flgk .wrap .card-item .item-box .ico{ width:0.6rem; height: 0.6rem; margin: 0 auto; background-color: #3b7fd7; background-repeat: no-repeat; background-position: center; background-size: 100%; position: relative; z-index: 1;}
.flgk .wrap .card-item .item-box .ico.qqgk{ background-image: url(../images/bg_flgk_qqgk_ico.png);}
.flgk .wrap .card-item .item-box .ico.jzyg{ background-image: url(../images/bg_flgk_jzyg_ico.png);}
.flgk .wrap .card-item .item-box .ico.zrhj{ background-image: url(../images/bg_flgk_zrhj_ico.png)}
.flgk .wrap .card-item .item-box .ico.xzqh{ background-image: url(../images/bg_flgk_xzqh_ico.png);}
.flgk .wrap .card-item .item-box .ico.zhjj{ background-image: url(../images/bg_flgk_zhjjj_ico.png);}

.flgk .wrap .card-item .item-box .item{ height: calc(100% - 0.3rem); margin-top: -0.3rem; padding: 0.35rem; border: 1px solid #b9d2eb; background-color: #fff; position: relative;}
.flgk .wrap .card-item .item-box .item .lm{ width:0.57rem; position: absolute; top:0.47rem; left:0.33rem; right: auto; bottom: 0; background-repeat: no-repeat; background-position: top center; background-size: 100%; display: block;}
.flgk .wrap .card-item .item-box .item .lm.qqgk{ background-image: url(../images/bg_flgk_qqgk.png);}
.flgk .wrap .card-item .item-box .item .lm.jzyg{ background-image: url(../images/bg_flgk_jzyg.png);}
.flgk .wrap .card-item .item-box .item .lm.zrhj{ background-image: url(../images/bg_flgk_zrhj.png)}
.flgk .wrap .card-item .item-box .item .lm.xzqh{ background-image: url(../images/bg_flgk_xzqh.png);}
.flgk .wrap .card-item .item-box .item .lm.zhjj{ background-image: url(../images/bg_flgk_zhjjj.png);}

.flgk .wrap .card-item .item-box .item .box{ height: 100%; display: none;}
.flgk .wrap .card-item .item-box .item .box .sp{ width:3.94rem; height: 100%; float: left; position: relative; background-color: red;}
.flgk .wrap .card-item .item-box .item .box .sp .img{ width: 100%; height: 100%;}
.flgk .wrap .card-item .item-box .item .box .sp .btn{ width:0.5rem; height: 0.5rem; background: url(../images/img_zjfl_xcsp_button.png) no-repeat center center; background-size: contain; position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%); display: block; cursor: pointer;}
.flgk .wrap .card-item .item-box .item .box .sp .video_item { width: 100%; height: 100%; overflow: hidden; position: relative;}
.flgk .wrap .card-item .item-box .item .box .sp .video_item video { width: 100%; height: 100% !important; object-fit: fill;}
.flgk .wrap .card-item .item-box .item .box .js{ height: 100%; position: relative;}
.flgk .wrap .card-item .item-box .item .box .js.qqgk{ width: calc(100% - 3.94rem); padding-left: 0.15rem;}
.flgk .wrap .card-item .item-box .item .box .js .nr{ height: 2.8rem; font-size: 0.17rem; color: #666; line-height: 0.4rem; text-align: justify; white-space: normal; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 7;}
.flgk .wrap .card-item .item-box .item .box .js.qqgk .nr{ height: 2.4rem; -webkit-line-clamp: 6;}
.flgk .wrap .card-item .item-box .item .box .js .more{ font-size: 0.14rem; color: #f79d53; font-weight: bold; line-height: 0.15rem; display: block; position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 0);}
.flgk .wrap .card-item .item-box .item .box .js .more img{ width:0.15rem; height: 0.15rem; margin-left: 0.05rem;}

.flgk .wrap .card-item.active{ width: 8.75rem; z-index:6;}
.flgk .wrap .card-item.active .item-box .ico{ margin: 0 0 0 0.35rem;}
.flgk .wrap .card-item.active .item-box .item{ border: 1px solid #eaf1f6; background-color: rgba(234,241,246,.8);}
.flgk .wrap .card-item.active .item-box .item .box{ padding-left:0.9rem; display: block;}

.flgk .wrap .tab01-hd{ overflow: hidden; display: none;}
.flgk .wrap .tab01-hd ul{ margin-right: -0.25rem;}
.flgk .wrap .tab01-hd ul li{ width: calc(99.9999999% / 3); float: left;}
.flgk .wrap .tab01-hd ul li span{ height: 0.8rem; margin: 0.25rem  0.25rem 0 0; line-height: 0.8rem; border: 0.01rem solid #b9d2eb; background-color: #fff; display: block;}
.flgk .wrap .tab01-hd ul li span i{ font-weight: bold; text-align: center; display: block;}
.flgk .wrap .tab01-hd ul li.active span{ background-color: #3b7fd7;}
.flgk .wrap .tab01-hd ul li.active span i{ color: #fff;}

.bgPop{ width: 100%; height: 100%; position: fixed; z-index: 999; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.6); display: none;}
.bgPop .pop{ width:100%; height: 100%; position: relative;}
.bgPop .pop .pop-box { width: calc(100vw * (1680 - 80) / 1920); height: calc(100vw * (900 - 80) / 1920); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); margin: auto; z-index: 130; display: none;}
.bgPop .pop .pop-box .video_item { width: 100%; height: 100%; overflow: hidden; position: relative;}
.bgPop .pop .pop-box .video_item video { width: 100%; height: 100% !important; object-fit: fill;}
.bgPop .pop .pop-box .video_item video poster { width: 100%; height: 100% !important; object-fit: cover;}
.bgPop .pop .pop-box .video_item .pop-close { padding: 0.05rem 0.1rem; font-size: 0.14rem; color: #fff; border-radius: 0.02rem; position: absolute; top: 0; right: 0; background: rgba(0, 0, 0, 0.6); cursor: pointer;}

/****涪陵数据****/
.flsj{ padding-bottom: 0.6rem; background-color: #fff; overflow: hidden;}
.flsj .sj-L { width: calc(100% - 6.02rem);}
.flsj .sj-L .hd { padding-left: 0.2rem; position: relative;}
.flsj .sj-L .hd em{ width:0.05rem; height: 0.25rem; position: absolute; top: 0; left: 0; bottom: 0; background-color: #3b7fd7; display: block;}
.flsj .sj-L .hd ul li { margin-right: 0.6rem; float: left;}
.flsj .sj-L .hd ul li a { font-size: 0.22rem; color: #666; font-weight: bold; line-height: 0.25rem; display: block;}
.flsj .sj-L .hd ul li.active a { color: #3b7fd7;}
.flsj .sj-L .bd { margin-top: 0.09rem; overflow: hidden;}
.flsj .sj-L .bd .info ul li{ margin-top: 0.3rem; line-height: normal; overflow: hidden; position: relative;}
.flsj .sj-L .bd .info ul li .date{ padding: 0.08rem 0.1rem 0.08rem 0.1rem; text-align: center; background-color: #f5f5f5; transition: all .2s linear; -webkit-transition: all .2s linear; -moz-transition: all .2s linear; -o-transition: all .2s linear; -ms-transition: all .2s linear;}
.flsj .sj-L .bd .info ul li .date h1{ font-size: 0.26rem; color: #7d7d7d;}
.flsj .sj-L .bd .info ul li .date h6{ font-size: 0.16rem; color: #909090;}
.flsj .sj-L .bd .info ul li a{ width: calc(100% - 1rem); max-height: 0.69rem; line-height: 0.3rem; text-align: justify; white-space: normal; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; position: absolute; top: 50%; left: 1rem; transform: translate(0, -50%);}
.flsj .sj-L .bd .info ul li:nth-of-type(4){ display: none;}
.flsj .sj-L .bd .info ul li:hover{ cursor: pointer;}
.flsj .sj-L .bd .info ul li:hover .date{ background-color: #3b7fd7;}
.flsj .sj-L .bd .info ul li:hover .date h1,.flsj .sj-L .bd .info ul li:hover .date h6{ color: #fff;}

.flsj .sj-R{ width:6.02rem;}
.flsj .sj-R ul li{ width: calc(100% / 2); height: 3.44rem; float: left; transition: all .2s linear; -webkit-transition: all .2s linear; -moz-transition: all .2s linear; -o-transition: all .2s linear; -ms-transition: all .2s linear;}
.flsj .sj-R ul li .box{ height: 100%; margin-left: 0.3rem; background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; position: relative;}
.flsj .sj-R ul li .box.tjnj{ background-image: url(../images/bg_tjnj.png);}
.flsj .sj-R ul li .box.tjgb{ background-image: url(../images/bg_tjgb.png);}
.flsj .sj-R ul li .box a{ width:0.83rem; height: 2.29rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url(../images/bg_flsj_box.png) no-repeat center; background-size: 100%;}
.flsj .sj-R ul li .box a img{ width:0.83rem; height: 2.29rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.flsj .sj-R ul li .box a span{ font-size: 0.2rem; color: #fff; font-weight: bold; text-align: center; display: none;}
.flsj .sj-R ul li .box:hover{ background-size: 120% 120%;}
.flsj .sj-R ul li .box:hover a{ width:1.89rem; height: 2.74rem; border: 1px solid #fff; background: transparent;}

/****人文涪陵 + 畅游涪陵****/
.rw-cy{ padding-bottom: 0.6rem; background: url(../images/bg_zjfl_rwfl.png) no-repeat top center; background-size: 100% 100%; overflow: hidden;}
.rwfl{}
.rwfl .wrap{ overflow: hidden;}
.rwfl .wrap .hd{ margin-top: 0.4rem;}
.rwfl .wrap .hd ul{ margin-right: -0.3rem;}
.rwfl .wrap .hd ul li{ width: calc(100% / 5); float: left; text-align: center;}
.rwfl .wrap .hd ul li a{ height: 0.7rem; margin-right: 0.3rem; font-size: 0.22rem; color: #333; line-height: 0.7rem; background-image: url(../images/bg_rwfl_hd.png); background-repeat: no-repeat; background-position: center; background-size: 100% 100%; display: block;}
.rwfl .wrap .hd ul li:hover a, .rwfl .wrap .hd ul li.active a{ color: #fff; background-image: url(../images/bg_rwfl_hd_hover.png);}

.rwfl .wrap .bd{ position: relative; cursor: pointer;}
.rwfl .wrap .bd .box{ width:5.37rem; float: left; position: relative; z-index: 2;}
.rwfl .wrap .bd .box .title{ padding: 0.25rem 0 0.5rem; font-size: 0.26rem; text-align: center;}
.rwfl .wrap .bd .box .title span{ padding-bottom: 0.13rem; display: inline-block; position: relative;}
.rwfl .wrap .bd .box .title span i{ width:0.46rem; height: 0.03rem; background-color: #e70909; position: absolute; left:0; bottom: 0;}
.rwfl .wrap .bd .box .js{ height: 3.58rem; padding: 0.27rem; border-radius: 0.03rem; border-bottom-right-radius: 0; background-color: rgba(234,241,246,.96); position: relative;}
.rwfl .wrap .bd .box .js .nr{ max-height: 2.5rem; color: #666; line-height: 0.5rem; text-align: justify; white-space: normal; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5;}
.rwfl .wrap .bd .box .js .more{ position: absolute; left: 50%; bottom: 0.27rem; transform: translate(-50%, 0);}
.rwfl .wrap .bd .box .js .more a{ width:1.2rem; font-size: 0.14rem; color: #4f4b4c; line-height: 0.35rem; text-align: center; border: 1px solid #4f4b4c; display: block;}
.rwfl .wrap .bd:hover .box .js{ background-color: rgba(234,241,246,1);}

.rwfl .wrap .bd .pic{ width: calc(100% - 4rem); height: 4.71rem; position: absolute; right: 0; bottom: 0; z-index: -1;}
.rwfl .wrap .bd .pic img{ width:100%; height: 100%; border-radius: 0.03rem; border-bottom-left-radius: 0; object-fit: cover;}
.rwfl .wrap .bd .pic .swiper-container .swiper-wrapper .swiper-slide{ height: 100%;}
.rwfl .wrap .bd .pic .swiper-container .swiper-pagination .swiper-pagination-bullet { width: 0.18rem; height: 0.03rem; margin-left: 0.06rem; border-radius:0.2rem; background: #fff; opacity: 1;}
.rwfl .wrap .bd .pic .swiper-container .swiper-pagination .swiper-pagination-bullet-active { background: #d03b00;}

.cyfl{}
.cyfl .wrap ul{ margin-left: -0.55rem;}
.cyfl .wrap ul li{ width: calc(100% / 4); float: left;}
.cyfl .wrap ul li a{ height: 4.2rem; margin-left: 0.55rem; background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; position: relative; display: block; overflow: hidden; transition: all .5s linear; -webkit-transition: all .5s linear; -moz-transition: all .5s linear; -o-transition: all .5s linear; -ms-transition: all .5s linear;}
.cyfl .wrap ul li a.yzfl{ background-image: url(../images/bg_cyfl_pic01.png);}
.cyfl .wrap ul li a.zzfl{ background-image: url(../images/bg_cyfl_pic02.png);}
.cyfl .wrap ul li a.czfl{ background-image: url(../images/bg_cyfl_pic03.png);}
.cyfl .wrap ul li a.gzfl{ background-image: url(../images/bg_cyfl_pic04.png);}

.cyfl .wrap ul li a .box{ height: 100%; padding: 0.46rem; background-image: url(../images/bg_cyfl_box.png); background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; display: block; position: relative; transition: all .5s linear; -webkit-transition: all .5s linear; -moz-transition: all .5s linear; -o-transition: all .5s linear; -ms-transition: all .5s linear;}
.cyfl .wrap ul li a .box .title{ width:0.53rem; height: 1.61rem; background-image: url(../images/bg_cyfl_title.png); background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; display: block;}
.cyfl .wrap ul li a .box .title img{ width:100%; height: 100%;}
.cyfl .wrap ul li:hover a{ margin-top: -0.3rem; border-radius: 0.05rem; background-size: 110% 110%;}
.cyfl .wrap ul li:hover a .box{ padding: 0.35rem; background-image: none;}