@charset "utf-8";
*{
  font-family:"微软雅黑"
}

.wrap{
  background: url("../../images/2024/szqh2024/wrap_bg.png") 50% top no-repeat;
}
.inner, .content, .links, .copyright {
  position: relative;
  width: 1200px;
  margin-left: auto;
  margin-right: auto;
}
.header,.content,.footer{
  margin:0 auto;
  position:relative
}
.header{
  width: 1200px;
  height: 670px;
  padding-top: 108px;
}
.banner{
  width: 895px;
  height: 194px;
  margin: 0 auto;
  background: url("../../images/2024/szqh2024/banner.png") center center no-repeat;

}
.site-logo{
  width:1200px;
  margin:0 auto;
}


.header div.site-logo a{
  position: absolute;
  left: 0;
  top: 20px;
  width: 400px;
  height: 65px;
  background: url(https://wjw.hubei.gov.cn/material/images/dsjy/yt_logo.png) 0 50% no-repeat;
  background-size: 75%;
}
@media (max-width: 1200px){
  .site-logo{
    width:100%
  }
  .header div.site-logo a{
    position: absolute;
    left: 10px;
    top: 20px;
    width: 40%;
    height: 70px;
    background: url(https://wjw.hubei.gov.cn//material/images/dsjy/yt_logo.png) 0 50% no-repeat;
  }
}
@media (max-width: 768px){
  .header div.site-logo a{
    background-size: 100%;
  }
}


.row{
  margin-left:-15px;
  margin-right:-15px
}
.content{
  width:1200px
}
.grid{
  position:relative
}
.panel-more{
  display:none
}



.p1{
  margin-top: 30px;
}
.focus,
.focus .pic {
  position: relative;
  width: 585px;
  height: 365px;
}

.focus .pic>div {
  position: relative;
  overflow: hidden;
  width: 100%;
  border-radius:5px
}


.focus .pic a,.focus .pic img,.focus .pic div {
  width: 100%;
  height: 100%;
  display:block
}

.focus .pic span {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: block;
  height: 56px;
  line-height: 56px;
  font-size: 18px;
  padding-left: 15px;
  padding-right: 55px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background-color: rgb(99,0,1,0.7) ;
  color: #fff;
}

.focus .focus-prev,
.focus .focus-next ,.videos .focus-prev, .videos .focus-next{
  position: absolute;
  top: 50%;
  z-index: 3;
  display: block;
  width: 60px;
  height: 60px;
  margin-top: -30px;
  line-height: 60px;
  text-align: center;
  font-size: 28px;
  cursor: pointer;
  background-color: rgba(0, 0, 0, .5);
  background-size: 24px auto;
  color: #fff;
  opacity: 0;
  transition: all .3s;
}



.focus .focus-prev .iconfont,
.focus .focus-next .iconfont ,.videos .focus-prev .iconfont,
.videos .focus-next .iconfont{
  font-size: 28px;
  font-weight: normal;
}

.focus .focus-prev,.videos .focus-prev{
  transform: translate(-50px, 0);
  left: 0;
  background-image: none;
}

.focus .focus-next,.videos .focus-next {
  transform: translate(50px, 0);
  right: 0;
  background-image: none;
}

.focus:hover .focus-prev,
.focus:hover .focus-next ,.videos:hover .focus-prev,
.videos:hover .focus-next{
  opacity: 1;
  transform: translate(0, 0);
}

.focus .navi {
  position: absolute;
  bottom: 18px;
  left: auto;
  right: 0;
  z-index: 9;
  width: auto;
  margin-bottom: 4px\9;
  padding: 0 10px;
  text-align: right;
}
.focus .navi li {
  float: left;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin: 0 2px;
  font: 0/0 lx;
  color: #transform;
  background:#fff;
  transition: all .3s;
}

.focus .navi li.on {
  background-color: #fff6c6;
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 2px;
}

.focus .swiper-pagination-bullet {
  border: 1px solid #fff;
  background: none;
  opacity: 1;
}

.focus .swiper-pagination-bullet-active {
  background-color: #fff;
}

.p1 .list-t li:before{
  background-color: #b92626;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  top: 50%;
  margin-top: -3.5px;
  left: 12px;
}
.news .list-t li{
  background: linear-gradient(90deg,#fff,transparent);
  padding-left: 33px;
  margin-bottom: 12px;
  border-radius: 4px;
}
.news .list-t li:last-child{
  margin-bottom: 0;
}
.news .list-t li a{
  font-size: 18px;
  line-height: 63px;
  width: 80%;
}
.news .list-t li span{
  font-size: 18px;
  line-height: 63px;
}

.p2{
  margin-top: 65px;
}
.p3{
  margin-top: 45px;
}
.p2 h3,.p3 h3{
  margin-bottom: 40px;
}
h3 a{
  display: block;
  width: 50%;
  height: 100%;
  margin: 0 auto;
}

.p2 h3{
  background: url("../../images/2024/szqh2024/p2_h3.png") center center no-repeat;
  width: 100%;
  height: 76px;
}
.p3 h3{
  background: url("../../images/2024/szqh2024/p3_h3.png") center center no-repeat;
  width: 100%;
  height: 76px;
}

.p2 .col-md-6>div{
  background: url("../../images/2024/szqh2024/p2_bg.png") center center no-repeat;
  background-size: 100% 100%;
  margin-bottom: 24px;
  height: 200px;
}
.p2 .top p{
  font-size: 18px;
  line-height: 27px;
  color: #333333;
  font-weight: bold;
}
.p2 .top{
  padding: 18px 50px 18px 120px;
  position: relative;

}
.p2 .top span {
  width: 70px;
  height: 70px;
  display: block;
  position: absolute;
  font-size: 14px;
  line-height: 25px;
  background-color: #e50512;
  color: #ffffff;
  left: 25px;
  top: -6px;
  text-align: center;
  border-radius: 4px 0 0 0;
}
.p2 .top b{
  display: block;
  font-size: 24px;
  height: 45px;
  line-height: 45px;
  width: 70px;
  background: url("../../images/2024/szqh2024/date.png");
  text-align: center;
  border-radius: 4px 0 0 0;
}
.p2 .top:before{
  content: '';
  position: absolute;
  background: url("../../images/2024/szqh2024/top_before.png") center center no-repeat;
  width: 6px;
  height: 6px;
  left: 95px;
  top: -6px;
}
.p2 .line{
  width: calc(100% - 80px);
  height: 1px;
  position: absolute;
  background-color: #f2e1cd;
  left: 40px;
}
.p2 .down span{
  display: block;
  font-size: 16px;
  line-height: 30px;
  padding: 24px 30px;
  text-indent: 2em;
}
.p2 .down span a{
  color: #e50512;
}

.p2 .list-t a,.p3 .list-t a{
  display: block;
  width: 80%;
  font-size: 18px;
  line-height: 56px;
  color: #333333;
  position: relative;
  padding-left: 20px;
}
.p2 .list-t a:hover,.p3 .list-t a:hover{
  color: #048;
}
.p2 .list-t span,.p3 .list-t span{
  font-size: 16px;
  line-height: 56px;
  right: 15px;
}
.list-t li:before{
  display: none;
}
.list-t li:before{
  content: '';
  position: absolute;
  background: url("../../images/2024/szqh2024/li_before.png") center center no-repeat;
  width: 10px;
  height: 13px;
  display: block;
  left: 15px;
  top: 21px;
}

.list-t li:hover:before{
  background-color: transparent;
}
.p1 .list-t li:hover:before{
  background-color: #b92626;
}
.swiper-slide img{
  width: 100%;
  height: 100%;
}
.videos, .videos .pic{
  height: 210px;
}
.p3 .swiper-slide img{
  background-color: #a9b6b7;
}
.p3 .swiper-slide{
  position: relative;
}
.p3 .swiper-slide i{
  background: url("../../images/2024/szqh2024/bf.png") center center no-repeat;
  width: 36px;
  height: 36px;
  position: absolute;
  left: 50%;
  margin-left: -18px;
  top: 50%;
  margin-top: -18px;
}
.p3 .swiper-slide .hs{
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgb(0,0,0,.3);
  left: 0;
  top: 0;
}




.footer {
  padding: 20px;
}

.links {
  padding: 0 20px;
}

.copyright {
  line-height: 22px;
  font-size: 14px;
}

.handle {
  margin-bottom: 10px;
}

/* 底部 */

.footer {
  border-top: 2px solid #37e;
  padding: 20px 0;
  background-color: #eee;
}

.links>ul>li {
  position: relative;
  margin-bottom: 20px;
  line-height: 40px;
  font-size: 16px;
  text-align: center;
}

.links>ul>li>a {
  display: block;
  margin: 0 -5px;
  padding: 0 20px;
  background: #fff url(/material/images/links_arr.png) 96% 50% no-repeat;
}

.links li ul {
  display: none\9;
  z-index: -1;
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 40px;
  max-height: 200px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid #ddd;
  background-color: #fff;
  opacity: 0;
  transform: translate(0, 3px);
  transition: opacity, transform .3s;
}

.links li:hover ul {
  display: block\9;
  z-index: 9;
  opacity: 1;
  transform: translate(0, 0);
}

.links li li {
  border-top: 1px solid #ddd;
  line-height: 39px;
  text-align: center;
  transition: all .3s;
}

.links li li:hover {
  background-color: #f8f8f8;
}

.links li li a {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  word-break: keep-all;
  text-overflow: ellipsis;
  font-size: 14px;
}
.p3 .videos{
  margin-bottom: 24px;
}
.p3{
  margin-bottom: 66px;
}
.copyright {
  line-height: 32px;
}

.copyright p a,
.copyright p span {
  margin: 0 10px;
}

.gov {
  position: absolute;
  top: 50%;
  left: 0;
  width: 80px;
  height: 80px;
  margin-top: -40px;
}

.jc {
  position: absolute;
  top: 50%;
  right: 0;
  width: 110px;
  height: 55px;
  margin-top: -22px;
}
@media (max-width: 1200px){
  .content,.header,.footer,.links,.copyright{
    width: 100%;
  }
  .content{
    padding: 0 20px;
  }
  .focus, .focus .pic{
    width: 100%;
  }
  .focus .pic span{
    width: 100%;
  }
  .banner{
    width: 74%;
    height: 180px;
    background-size: 100% 100%;
  }
  .p2 .col-md-6>div{
    height: auto;
  }

}

@media (max-width: 992px) {
  .wrap{
    background-size: auto 30%;
  }
  .banner {
    width: 60%;
    height: 140px;
  }
  .header{
    height: 508px;
    padding-top: 95px;
  }


  .focus, .focus .pic{
    height: 620px;
  }
  .news{
    margin-top: 31px;
    background: none;
  }
  .news .list-t li a{
    width: 90%;
  }
  .p2 .list-t li a,.p3 .list-t li a{
    width: 85%;
  }
  .p2,.p3{
    margin-top: 31px;
  }
  .p2 .left{
    margin-bottom: 50px;
  }
  .p2 .right{
    margin-bottom: 31px;
  }
}
@media (max-width: 768px) {

  .wrap{
    background-size: auto 25%;
  }
  .banner{
    width: 70%;
    height: 110px;
  }
  .header{
    height: 430px;
  }

  .news .list-t li span{
    display: none;
  }
  .p2 .list-t span, .p3 .list-t span{
    display: none;
  }
  .news .list-t li a{
    width: 100%;
  }
  .p2 .list-t li a,.p3 .list-t li a{
    width: 100%;
  }
  .copyright p span {
    display: block;
  }

  .footer .gov,
  .footer .jc {
    position: relative;
    display: inline-block;
    top: 0;
    margin-top: 20px;
    vertical-align: middle;
  }
  .focus, .focus .pic{
    height: 460px;
  }

}
@media (max-width: 480px) {
  .wrap {
    background-size: auto 23%;
  }
  .header{
    height: 342px;
    padding-top: 83px;
  }
  .focus, .focus .pic{
    height: 265px;
  }
  .news .list-t li a{
    line-height: 40px;
  }
  .p2 .list-t li a,.p3 .list-t li a{
    line-height: 40px;
  }
  .list-t li:before{
    top: 15px;
  }
  .banner {
    width: 80%;
    height: 80px;
  }
  .news{
    margin-bottom: 19px;
  }
  .p2 h3,.p3 h3{
    background-size: 240%;
  }
  .p2 h3, .p3 h3{
    margin-bottom: 30px;
  }
  .p2 .left{
    margin-bottom: 30px;
  }
  .p2 .right{
    margin-bottom: 19px;
  }
  .p2 .top{
    padding: 18px 30px;
  }
  .p2 .top span{
    display: none;

  }
  .p2 .top:before{
    display: none;
  }
  .p3 .videos{
    margin-bottom: 19px;
  }
  .p3{
    margin-bottom: 39px;
  }
  .header div.site-logo a{
    width: 50%;
    top: 2px;

  }


}