body {
  background: #f5f6f8;
}

.hero-banner {
  background-image:
          linear-gradient(180deg, rgba(8, 33, 65, .26), rgba(8, 33, 65, .12) 38%, rgba(8, 33, 65, 0) 100%),
          url("../assets/imglistbg.jpg");
}

.leftList .second-list {
  display: block;
  background: #fff;
}

.leftList > li > .second-list,
.leftList > li > ul,
.leftList > li > ol,
.leftList .second-list li > ul,
.leftList .second-list li > ol {
  background: #fff;
}

.leftList > li:not(.active):not(.current):not(.on):not(:hover) > .second-list,
.leftList > li:not(.active):not(.current):not(.on):not(:hover) > ul,
.leftList > li:not(.active):not(.current):not(.on):not(:hover) > ol {
  display: none;
}

.leftList > li:hover > .second-list,
.leftList > li:hover > ul,
.leftList > li:hover > ol,
.leftList > li.has-current > .second-list,
.leftList > li.has-current > ul,
.leftList > li.has-current > ol {
  display: block;
}

.leftList .second-list li > ul,
.leftList .second-list li > ol,
.leftList > li > ul li > ul,
.leftList > li > ul li > ol,
.leftList > li > ol li > ul,
.leftList > li > ol li > ol {
  display: none;
}

.leftList .second-list li:hover > ul,
.leftList .second-list li:hover > ol,
.leftList .second-list li.active > ul,
.leftList .second-list li.active > ol,
.leftList .second-list li.current > ul,
.leftList .second-list li.current > ol,
.leftList .second-list li.on > ul,
.leftList .second-list li.on > ol,
.leftList > li > ul li:hover > ul,
.leftList > li > ul li:hover > ol,
.leftList > li > ol li:hover > ul,
.leftList > li > ol li:hover > ol {
  display: block;
}

.leftList .second-list li.active a,
.leftList .second-list li.current a,
.leftList .second-list li.on a,
.leftList .second-list li:hover a {
  background: #eef2f7;
  color: #1d5ca9;
}

.leftList .second-list li > ul li a,
.leftList .second-list li > ol li a,
.leftList > li > ul li > ul li a,
.leftList > li > ul li > ol li a,
.leftList > li > ol li > ul li a,
.leftList > li > ol li > ol li a {
  padding-left: 42px;
  min-height: 46px;
  line-height: 46px;
  font-size: 18px;
}

.location {
  margin-bottom: 20px;
}

.imglist-title {
  margin-bottom: 30px;
  border-bottom: 1px solid #e5e8ed;
  color: #333;
  font-size: 25px;
  line-height: 75px;
  font-weight: 700;
}

.imglist-shell > ul,
.imglist-shell > div > ul,
.imglist-shell > table > tbody > tr > td > ul,
.imglist-shell ul.clearfix {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 38px 46px;
}

.imglist-shell li {
  min-width: 0;
  float: none !important;
  width: auto !important;
}

.imglist-shell li,
.imglist-shell li * {
  box-sizing: border-box;
}

.imglist-shell li > a,
.imglist-shell li > div,
.imglist-shell li > dl {
  display: block;
  color: #2f3640;
}

.imglist-shell li > a {
  display: flex;
  flex-direction: column;
}

.imglist-shell .photo-frame {
  position: relative;
  display: block;
  overflow: hidden;
  background: #edf1f5;
}

.imglist-shell .photo-frame::before {
  content: "";
  display: block;
  padding-top: 112%;
}

.imglist-shell .photo-frame img {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: none;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translate(-50%, -50%);
}

.imglist-shell li > a > img,
.imglist-shell li > div > img,
.imglist-shell li > dl > img {
  display: block;
  width: 100%;
  height: 272px;
  object-fit: cover;
  object-position: center center;
  background: #edf1f5;
}

.imglist-shell li > a > div,
.imglist-shell li > div > div,
.imglist-shell li > dl > dt,
.imglist-shell li > a > strong,
.imglist-shell li > a > h3,
.imglist-shell li > a > h4,
.imglist-shell li > a > em {
  margin-top: 16px;
  color: #303640;
  font-size: 18px;
  line-height: 1.4;
  font-weight: 700;
  font-style: normal;
}

.imglist-shell li > a > span,
.imglist-shell li > div > span,
.imglist-shell li > dl > dd,
.imglist-shell li > a > p,
.imglist-shell li > a > i,
.imglist-shell li .job,
.imglist-shell li .post {
  display: block;
  margin-top: 6px;
  color: #8c94a0;
  font-size: 14px;
  line-height: 1.6;
  font-style: normal;
}

.imglist-shell li .more,
.imglist-shell li .detail,
.imglist-shell li .more-link {
  display: inline-block;
  margin-top: 8px;
  color: #2f5da4;
  font-size: 14px;
  line-height: 1.6;
}

.imglist-shell li > a:hover > div,
.imglist-shell li > a:hover > strong,
.imglist-shell li > a:hover > h3,
.imglist-shell li > a:hover > h4,
.imglist-shell li .more:hover,
.imglist-shell li .detail:hover,
.imglist-shell li .more-link:hover {
  color: #1d5ca9;
}

.imglist-shell .wp_paging,
.imglist-shell .pages,
.imglist-shell .paging {
  grid-column: 1 / -1;
  margin-top: 6px;
  padding-top: 12px;
  text-align: right;
}

@media (max-width: 1199px) {
  .imglist-title {
    font-size: 24px;
  }

  .imglist-shell > ul,
  .imglist-shell > div > ul,
  .imglist-shell > table > tbody > tr > td > ul,
  .imglist-shell ul.clearfix {
    gap: 30px 28px;
  }
}

@media (max-width: 991px) {
  .hero-banner {
    background-image:
            linear-gradient(180deg, rgba(8, 33, 65, .14), rgba(8, 33, 65, 0) 65%),
            url("../assets/imglistbgh5.jpg");
  }

  .right-col {
    width: 100%;
  }

  .imglist-title {
    margin-bottom: 22px;
    padding-bottom: 12px;
    font-size: 22px;
  }

  .imglist-shell > ul,
  .imglist-shell > div > ul,
  .imglist-shell > table > tbody > tr > td > ul,
  .imglist-shell ul.clearfix {
    grid-template-columns: repeat(3, minmax(150px, 210px));
    justify-content: center;
    gap: 24px 22px;
  }

  .imglist-shell li > a > img,
  .imglist-shell li > div > img,
  .imglist-shell li > dl > img {
    height: 246px;
  }
}

@media (max-width: 767px) {
  .imglist-title {
    font-size: 20px;
  }

  .imglist-shell > ul,
  .imglist-shell > div > ul,
  .imglist-shell > table > tbody > tr > td > ul,
  .imglist-shell ul.clearfix {
    grid-template-columns: repeat(2, minmax(138px, 200px));
    justify-content: center;
    gap: 18px 18px;
  }

  .imglist-shell li > a > img,
  .imglist-shell li > div > img,
  .imglist-shell li > dl > img {
    height: 230px;
  }

  .imglist-shell li > a > div,
  .imglist-shell li > div > div,
  .imglist-shell li > dl > dt,
  .imglist-shell li > a > strong,
  .imglist-shell li > a > h3,
  .imglist-shell li > a > h4,
  .imglist-shell li > a > em {
    margin-top: 14px;
    font-size: 17px;
  }

  .imglist-shell li > a > span,
  .imglist-shell li > div > span,
  .imglist-shell li > dl > dd,
  .imglist-shell li > a > p,
  .imglist-shell li > a > i,
  .imglist-shell li .job,
  .imglist-shell li .post {
    font-size: 13px;
  }
}