@charset "utf-8";
/*banner*/
.banner {
    width: 100%;
    position: relative;
    overflow: hidden;
}
.slick-dotted.slick-slider {
    margin-bottom: 0;
}
.banner .slick-slide {
    width: 100%;
}
.banner .slick-dots {
    width: 100%;
    margin: 0 auto;
    bottom: 40px;
    left: 0;
    right: 0;
    text-align: right;
    box-sizing: border-box;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.banner .slick-dots li{
    margin: 0 10px;
}
.banner .slick-dots li,
.banner .slick-dots li.slick-active,
.banner .slick-dots li.slick-active button {
    width: 30px;
    height: 30px;
}
.banner .slick-dots li button:before {
    width: 30px;
    height: 30px;
    border-radius: 0;    
    content: '';
    opacity: 0.5;
    background: url(../img/dotIcon.png) no-repeat center;
}
.banner .slick-dots li.slick-active button:before {
    width: 30px;
    height: 30px;
    opacity: 1;
}
.banner .news_images {
    width: 100%;
}
.banner .news_images a {
    display: block;
}
.news_images img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* img */
.img{
    position: relative;
}
.img img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    transition: all .3s;
}
/* tit */
.lmTit{
    display: flex;
    position: relative;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
}
.lmTit h2{
    font-size: 32px;
    color: #222222;
    font-weight: bold;
    line-height: 40px;
    padding: 0 15px 0 50px;
    position: relative;
}
.lmTit h2 span::before{
    display: block;
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 100%;
    background: #086ba3;
    position: absolute;
    top: 50%;
    left: 100%;
    transform: translateY(-50%);
}
.lmTit h2::before{
    display: block;
    content: "";
    width: 40px;
    height: 1px;
    border-radius: 100%;
    background: #086ba3;
    position: absolute;
    top: 50%;
    left: 100%;
    transform: translateY(-50%);
}
.lmTit a{
    display: block;
    font-size: 15px;
    line-height: 30px;
    color: #086ba3;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.lmTit a:hover{
    color: #ffcd04;
}
.p50{
    padding: 50px 0;
}
/* indexCon3 */
.indexCon3{
    background: url(../img/bg3.png);
}
.indexCon3 .lmTit{
    justify-content: center;
}
.indexCon3 .lmTit h2{
    background: url(../img/titIcon5.png) no-repeat left 12px center;
}
.indexCon3 .lmTit h2 span::after{
    display: block;
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 100%;
    background: #086ba3;
    position: absolute;
    top: 50%;
    right: 100%;
    transform: translateY(-50%);
}
.indexCon3 .lmTit h2::after{
    display: block;
    content: "";
    width: 40px;
    height: 1px;
    border-radius: 100%;
    background: #086ba3;
    position: absolute;
    top: 50%;
    right: 100%;
    transform: translateY(-50%);
}
.indexCon3 ul li{
    padding: 0 15px;
    box-sizing: border-box;
}
.indexCon3 ul li a{
    display: block;
    width: 100%;
    height: auto;
}
.indexCon3 ul li .img{
    width: 100%;
    padding: 70% 0 0;
    overflow: hidden;
}
.indexCon3 ul li .con{
    text-align: center;
    font-size: 18px;
    line-height: 30px;
    color: #333333;
    margin-top: 15px;
    padding: 0 20px;
    box-sizing: border-box;
}
.indexCon3 ul a:hover img{
    transform: scale(1.2);
}
.indexCon3 ul a:hover .con{
    color: #086ba3;
    font-weight: bold;
}
.indexCon3 .slick-prev, .indexCon3 .slick-next{
    width: 40px;
    height: 40px;
    top: 112px;
}
.indexCon3 .slick-prev{
    left: -40px;
    background: url(../img/arrowPrev.png) no-repeat center;
}
.indexCon3 .slick-next{
    right: -40px;
    background: url(../img/arrowNext.png) no-repeat center;
}
.indexCon2{
    background: url(../img/bg2.png) no-repeat bottom center;
}
.kyxm,.kycg{
    width: 48.5%;
}
.kyxm .lmTit h2{
    background: url(../img/titIcon3.png) no-repeat left center;
}
.kycg .lmTit h2{
    background: url(../img/titIcon4.png) no-repeat left center;
}
.kyxm li.noImg a{
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 55px;
    color: #333333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-bottom: 1px solid #c4c4c4;
    padding-left: 12px;
    box-sizing: border-box;
    position: relative;
}
.kyxm li.noImg a::before{
    display: block;
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 100%;
    background: #033e65;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.kyxm li.noImg a span.fr{
    font-size: 16px;
    color: #086ba3;
    margin-left: 10px;
    font-weight: normal;
}
.kyxm li.noImg a:hover{
    font-weight: bold;
    color: #086ba3;
    text-indent: 10px;
}
.kyxm li.firstImg a{
    display: flex;
    margin-bottom: 10px;
    justify-content: space-between;
    align-items: center;
}
.kyxm li.firstImg .img{
    width: 310px;
    padding: 179px 0 0;
    border: 1px solid #ededed;
    box-sizing: border-box;
    overflow: hidden;
}
.kyxm li.firstImg a:hover img{
    transform: scale(1.2);
}
.kyxm li.firstImg .con{
    width: calc(100% - 310px);
    padding-left: 25px;
    box-sizing: border-box;
}
.kyxm li.firstImg .con span{
    display: block;
}
.kyxm li.firstImg .con span:nth-of-type(1){
    font-size: 18px;
    line-height: 30px;
    color: #333333;
    max-height: 60px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.kyxm li.firstImg .con span:nth-of-type(2){
    font-size: 16px;
    line-height: 28px;
    color: #666666;
    max-height: 56px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin: 10px 0;
}
.kyxm li.firstImg .con span:nth-of-type(3){
    font-size: 16px;
    line-height: 32px;
    color: #086ba3;
    background: url(../img/jt.png) no-repeat right center;
}
.kyxm li.firstImg a:hover span:nth-of-type(1){
    color: #086ba3;
    font-weight: bold;
}
.kyxm li.firstImg a:hover span:nth-of-type(2){
    color: #333333;
}
.kycg li a{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #c4c4c4;
    padding: 20px 0;
}
.kycg li:first-of-type a{
    padding-top: 0;
} 
.kycg li .img{
    width: 175px;
    padding: 102px 0 0;
    border: 1px solid #ededed;
    box-sizing: border-box;
    overflow: hidden;
}
.kycg li  a:hover img{
    transform: scale(1.2);
}
.kycg li .con{
    width: calc(100% - 175px);
    padding-left: 20px;
    box-sizing: border-box;
}
.kycg li .con span{
    display: block;
}
.kycg li  .con span:nth-of-type(1){
    font-size: 18px;
    line-height: 30px;
    color: #333333;
    max-height: 60px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin-bottom: 10px;
}
.kycg li .con span:nth-of-type(2){
    font-size: 16px;
    line-height: 32px;
    color: #086ba3;
    background: url(../img/jt.png) no-repeat right center;
}
.kycg li  a:hover span:nth-of-type(1){
    color: #086ba3;
    font-weight: bold;
}
.imgLink a,.imgLink img{
    display: block;
    width: 100%;
    height: auto;
}
.indexCon1{
    background: url(../img/bg1.png) no-repeat left top;
}
.new{
    width: 65.5%;
}
.newBanner{
    width: 62%;
    position: relative;
}
.newBanner a,.newBanner a img{
    display: block;
    width: 100%;
    height: 412px;
    overflow: hidden;
    object-fit: cover;
    transition: all .3s;
    position: relative;
}
.newBanner a:hover img{
    transform: scale(1.2);
}
.newBanner a .tit{
    width: 100%;
    font-size: 18px;
    line-height: 56px;
    color: #ffffff;
    text-align: center;
    padding: 0 10px;
    background: rgba(8,107,163,0.8);
    box-sizing: border-box;
    position: absolute;
    left: 0;
    bottom: 0;
}
.newBanner .time{
    width: 68px;
    height: auto;
    position: absolute;
    left: 25px;
    top: 25px;
    background: #f1f3fb;
    font-size: 32px;
    font-weight: bold;
    color: #086ba3;
    line-height: 46px;
    text-align: center;
}
.newBanner .time span{
    display: block;
    font-weight: normal;
    font-size: 14px;
    line-height: 24px;
    color: #ffffff;
    background: #086ba3;
}
.newBanner .slick-prev, .newBanner .slick-next{
    width: 46px;
    height: 46px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 99;
}
.newBanner .slick-prev{
    left: 0;
    background: rgba(8,107,163,0.3) url(../img/arrowPrev2.png) no-repeat center;
}
.newBanner .slick-next{
    right: 0;
    background: rgba(8,107,163,0.3) url(../img/arrowNext2.png) no-repeat center;
}
.newBanner .slick-prev:hover{
    background: rgba(8,107,163,1) url(../img/arrowPrev2.png) no-repeat center;
}
.newBanner .slick-next:hover{
    background: rgba(8,107,163,1) url(../img/arrowNext2.png) no-repeat center;
}
.newList{
    width: 38%;
    padding-left: 25px;
    box-sizing: border-box;
}
.newList li{
    padding: 24px 0;
    border-bottom: 1px solid rgba(3,62,101,0.1);
}
.newList li:first-of-type{
    padding-top: 0;
}
.newList a{
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 30px;
    height: 60px;
    color: #333333;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-align: justify;
}
.newList a span{
    font-size: 16px;
    color: #086ba3;
    float: right;
    margin-left: 10px;
    font-weight: normal;
}
.newList a:hover{
    font-weight: bold;
    color: #086ba3;
}
.notice{
    width: 31.5%;
}
.notice li a{
    display: flex;
    width: 100%;
    height: auto;
    padding: 10px 0;
    align-items: center;
    justify-content: space-between;
}
.notice li a span{
    display: block;
}
.notice li a .time {
    padding: 0 14px 0 0;
    width: 106px;
    box-sizing: border-box;
}
.notice li a .time span{
    width: 92px;
    color: #086ba3;
    text-align: center;
}
.notice li a .time span:nth-of-type(1){
    font-size: 28px;
    font-weight: bold;
    height: 61px;
    line-height: 80px;
    background: url(../img/timeIcon1.png) no-repeat center;
}
.notice li a .time span:nth-of-type(2){
    font-size: 14px;
    line-height: 20px;
    border: 1px solid #086ba3;
    border-radius: 10px;
}
.notice li a .con{
    width: calc(100% - 120px);
}
.notice li a .con span:nth-of-type(1){
    font-size: 18px;
    line-height: 28px;
    color: #333333;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    height: 56px;
}
.notice li a .con span.icon{
    display: block;
    width: 100%;
    height: 10px;
    background: url(../img/jt.png) no-repeat right center;
}
.notice li{
    position: relative;
    z-index: 1;
}
.notice li::before{
    display: block;
    content: "";
    width: 0;
    height: 100%;
    background: #086ba3;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
}
.notice li:hover{
    padding: 0 14px;
    box-sizing: border-box;
}
.notice li:hover::before{
    width: 100%;
}
.notice li a:hover  span{
    color: #ffffff;
}
.notice li a:hover .time span:nth-of-type(1){
    background: url(../img/timeIcon2.png) no-repeat center;
}
.notice li a:hover .time span:nth-of-type(2){
    border: 1px solid #ffffff;
}
.notice li a:hover .con span:nth-of-type(1){
    color: #ffffff;
    font-weight: bold;
}
.notice li a:hover .con span:nth-of-type(2){
    background: url(../img/jt2.png) no-repeat right center;
}
.new .lmTit h2{
    background: url(../img/titIcon1.png) no-repeat left center;
}
.notice .lmTit h2{
    background: url(../img/titIcon2.png) no-repeat left center;
}
.new,.notice,.imgLink,.kycg,.kyxm,.indexCon3{
    visibility: visible;
    opacity: 0;
}
.new.animation{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .5s 1 normal backwards running fadeInLeft;
}
.notice.animation{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .5s 1 normal backwards running fadeInRight;
}
.imgLink.animation{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .5s 1 normal backwards running fadeInUp;
}
.kycg.animation{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .5s 1 normal backwards running fadeInRight;
}
.kyxm.animation{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .5s 1 normal backwards running fadeInLeft;
}
.indexCon3.animation{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .5s 1 normal backwards running fadeInUp;
}

/* banner1：在任何定宽容器里都能“满屏铺开”，且视觉居中 */
.banner1 { width: 100%; margin: 0; overflow: hidden; }
.banner1 img { display: block; width: 100%; height: auto; }
/* 想固定视觉高度可加：
.banner1 { height: 420px; }
.banner1 img { height: 100%; object-fit: cover; object-position: center; }
*/

/* 让 header 全宽铺满（若你本来就全宽，可删掉 margin 这两行） */
.site-header{
  position: relative;
  height: 420px;               /* 可改：32vw; min-height:360px; max-height:520px */
  overflow: hidden;
  width: 100vw;

}

/* banner1 背景层 */
.site-header .banner1{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;           /* 不变形铺满 */
  display: block;
  z-index: 0;
}

/* 可选：加一层暗角，提升对比度（在 banner 上、在导航下） */
.site-header::after{
  content: none !important;
  background: none !important;
}


/* 前景层：导航/logo */
.site-header .nav-bar{
  position: relative;
  z-index: 2;                  /* 关键：确保盖在 banner1 之上 */
  display: grid;
  grid-template-columns: 1fr auto 1fr;  /* 左右平分，中间自适应 */
  align-items: center;
  gap: 24px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 12px 24px;
  background: transparent;     /* 防止背景色挡住图片 */
}

.site-header .brand img{
  height: clamp(56px, 7vw, 88px);
  width: auto;
  display: block;
}

.site-header .nav{
  display: flex;
  gap: 24px;
  align-items: center;
  min-width: 0;
}
.site-header .nav.left{  justify-content: flex-end; }
.site-header .nav.right{ justify-content: flex-start; }

.site-header .nav a{
  color: #fff;                 /* 白字叠图 */
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
  font-size: 18px;
  line-height: 1;
  padding: 10px 4px;
  white-space: nowrap;
}

/* 宽屏防挤压（按实际文字长度调） */
@media (min-width: 1024px){
  .site-header .nav.left,
  .site-header .nav.right{ min-width: 360px; }
}

/* 移动端布局 */
@media (max-width: 900px){
  .site-header{ height: 56vw; min-height: 320px; }
  .site-header .nav-bar{
    grid-template-columns: auto;
    row-gap: 12px;
  }
  .site-header .brand{ justify-self: center; }
  .site-header .nav.left,
  .site-header .nav.right{ justify-content: center; gap: 16px; }
}

/* 1) 取消 header 的固定/吸顶效果，保证随页面滚动 */
header, .header, .site-header{
  position: relative !important;
  top: auto; left: auto; right: auto;
}

/* 2) 若不需要‘破版’铺满，恢复普通宽度（避免一些主题误判导致看起来像固定） */
.site-header{
  position: relative;
  width: 100%;     /* ← 改这里，避免 100vw + 负 margin 写法 */
  margin: 0;
  height: 420px;   /* 或 32vw; min-height:360px; max-height:520px */
  overflow: hidden;
}


/* 3) 保持 banner1 覆盖 header 背景，但本身不要 fixed/sticky */
.site-header .banner1{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

/* 4) 仅让导航吸顶（可选），不影响 banner 随页面滚动 */
.site-header .nav-bar{
  position: sticky; top: 0; z-index: 3;
  /* background: rgba(0,0,0,.08);   轻微底色，避免贴图重绘闪白 */
  background: transparent;   /* 或完全去掉 background */
  /* 不需要吸顶就把 position/background 这两行去掉 */
}

header, .header, .site-header{ position: relative; top:auto; }
.site-header .banner1{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
}


/* 让下拉可以溢出 header，不被裁剪 */
.site-header{
  overflow: visible !important;
}

/* 顶部导航盖在背景与内容之上 */
.site-header .nav-bar{
  position: relative;
  z-index: 100; /* 提高层级，避免被 ::after 或其他层遮住 */
  background: transparent;
}

/* 关键：li 成为下拉菜单的定位参照 */
.site-header .nav li{
  position: relative;
}

/* 下拉菜单的基础样式（ol 作为浮层） */
.site-header .nav li > ol{
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 12rem;
  display: none;               /* 默认隐藏 */
  padding: 8px 0;
  border-radius: 8px;
  /* 深色半透明，叠在大图上更清晰；如果你想白底，见下方注释 */
  background: rgba(0,0,0,.75);
  box-shadow: 0 10px 24px rgba(0,0,0,.22);
  z-index: 1000;               /* 浮在所有背景层之上 */
  white-space: nowrap;
}

.site-header .nav li:hover > ol{
  display: block;
}

.site-header .nav li > ol > li > a{
  display: block;
  padding: 10px 16px;
  color: #fff;
}

.site-header .nav li > ol > li > a:hover{
  background: rgba(255,255,255,.12);
}

/* 如果你更喜欢白底下拉，把上面的背景/文字改成： */
/*
.site-header .nav li > ol{ background:#fff; }
.site-header .nav li > ol > li > a{ color:#333; }
.site-header .nav li > ol > li > a:hover{ background: rgba(0,0,0,.06); }
*/