@charset "utf-8";
/* banner-背景 */
#yxgk-banner{ position:absolute; left:0; right:0; top:0; z-index:-1; background: url(2021ysx_ysgk_banner.jpg) no-repeat center top; height:719px; }
#hsbg1{ position:absolute; left:0; right:0; top: 910px; z-index:-1; background: url(2021ysx_ysgk_hsbg1.png) no-repeat center top; height:738px;  }
#hsbg2{ position:absolute; left:0; right:0; bottom:-200px; z-index:-1; background: url(2021ysx_ysgk_hsbg2.png) no-repeat center top; height:597px;  }
#hsbg3{ position:absolute; left:0; right:0; bottom:0; z-index:-1; background: url(2021ysx_ysgk_hsbg3.png) no-repeat center top; height:496px; }
.footer{ margin-top:0; }
/* 主要标题 */
#ysgk .ysgk-tit{ text-align:center; }
/* 盒子布局 */
#ysgk .ysgk-01{ position:relative; }
#ysgk .ysgk-02{ position:relative; }
/* 永顺概况栏目 */
#ysgk .div-ceng{ height:440px; }
#ysgk .ysgk{ width:1500px; padding-top:80px; margin: 0 auto; background: url(2021ysx_ysgk_bsbg.png) no-repeat center top;  }
/* 永顺概况栏目-摘要 */
#ysgk .ysgk .headline{ margin-top:45px; }
#ysgk .ysgk .headline p{ text-indent:2em; line-height:49px; font-size:24px; color:#4a4a4a; letter-spacing:5px; text-align:justify; }
#ysgk .ysgk .headline a{ color:#006eab; }
/* 永顺概况栏目-第二摘要 */
#ysgk .ysgk .headline2 {  }
/* 永顺概况栏目-栏目矩阵 */
#ysgk .ysgk .column-list{ margin-top:150px; margin-bottom:80px; }
#ysgk .ysgk .column-list ul{ margin: 0 -28px; overflow:hidden; }
#ysgk .ysgk .column-list li{ width:20%; float:left; }
#ysgk .ysgk .column-list .border{ margin: 0 28px; padding:5px; background:#006eab; }
#ysgk .ysgk .column-list .border:hover{ background:#e27f1f; }
#ysgk .ysgk .column-list li.on .border{ background:#e27f1f; }
#ysgk .ysgk .column-list li a{ display:block; height:142px; text-align:center; border:1px solid #fff; }
#ysgk .ysgk .column-list li a i{ display:block; width:100%; height:95px; line-height:95px; }
#ysgk .ysgk .column-list li a:hover img{ -webkit-transform: scale( 1.05,1.05); -moz-transform: scale(1.05,1.05); -ms-transform: scale(1.05,1.05); transform: scale(1.05,1.05); transition: .3s transform;  }
#ysgk .ysgk .column-list li a h4{ color:#ffffff; font-size:28px; }
#ysgk .lsmr{ margin-top:160px; }
#ysgk .lsmr img{ max-width:100%; }
/* 乡镇概况栏目 */
#ysgk .xzgk{ margin-top:160px; overflow:hidden; padding-bottom:226px; }
#ysgk .xzgk .xzgk-list{ margin-top:50px; }
#ysgk .xzgk .xzgk-list ul{ margin: 0 -37.5px; overflow:hidden; }
#ysgk .xzgk .xzgk-list li{ float:left; width:20%; }
#ysgk .xzgk .xzgk-list li{ -webkit-transition: all 0.3s ease-out; transition: all .3s ease-out; }
#ysgk .xzgk .xzgk-list li a{ display:block; margin: 0 37.5px 50px; font-size:24px; color:#777777;  background: url(2021ysx_ysgk_listbg1.png) no-repeat center; background-size:cover; height:60px; line-height:60px; text-align:center;  }
#ysgk .xzgk .xzgk-list li a:hover{ background: url(2021ysx_ysgk_listbg2.png) no-repeat center; color:#fff;  }

/* 过渡 */
img { -webkit-transition: all 0.3s ease-out; transition: all .3s ease-out;  }
/* 响应移动端 */
@media only screen and (max-width: 1500px) {
    #ysgk .ysgk{ width: 100%; }
}
@media only screen and (max-width: 1024px) {
    .main{  width: 100%; }
    #ysgk .ysgk-02{ padding: 0 10px;box-sizing: border-box; }
    #yxgk-banner{ background: url(2021ysx_ysgk_banner.jpg) no-repeat center top;  }
    #ysgk .div-ceng{ height:0; }
    /* 主要标题 */
    #ysgk .ysgk-tit img{ max-width:100%; }
    /* 永顺概况栏目 */
    #ysgk .ysgk{ padding: 30px 10px 0; box-sizing:border-box; background:rgba(255, 255, 255, 0.7); }
    /* 永顺概况栏目-摘要 */
    #ysgk .ysgk .headline{ margin-top:20px; }
    #ysgk .ysgk .headline p{line-height: 30px; font-size:18px; letter-spacing:2px; }
    /* 永顺概况栏目-栏目矩阵 */
    #ysgk .ysgk .column-list{ margin-top:30px; margin-bottom:10px; }
    #ysgk .ysgk .column-list ul{ margin: 0 -10px; }
    #ysgk .ysgk .column-list li{ width: 50%; margin-bottom:20px; }
    #ysgk .ysgk .column-list .border{ margin: 0 10px; }
    #ysgk .ysgk .column-list li a h4{ font-size:18px; margin-top:8px; }
    /* 永顺概况栏目-历史名人 */
    #ysgk .lsmr{ margin-top:30px; }
    /* 乡镇概况栏目 */
    #ysgk .xzgk{ margin-top:30px; overflow:hidden; padding-bottom:140px; }
    #ysgk .xzgk .xzgk-list{ margin-top:50px; }
    #ysgk .xzgk .xzgk-list ul{ margin: 0 5px; overflow:hidden; }
    #ysgk .xzgk .xzgk-list li{ width:33.33%; }
    #ysgk .xzgk .xzgk-list li a{ margin: 0 5px 10px; font-size:18px; background-size:cover; }
    #ysgk .xzgk .xzgk-list li a:hover{ background: url(2021ysx_ysgk_listbg2.png) no-repeat center; color:#fff;  }
}

@media only screen and (max-width: 414px) {
    #ysgk .xzgk .xzgk-list li a{ height:39px; line-height:39px; }
}
@media only screen and (max-width: 375px) {
    #ysgk .xzgk .xzgk-list li a{ height:35px; line-height:35px;}
}
@media only screen and (max-width: 320px) {
    #ysgk .xzgk{ padding-bottom:80px; }
    #ysgk .xzgk .xzgk-list li a{ height:29px; line-height:29px; font-size:14px; }
}