/* banner */ 

.h2-slider{

  width: 100%;

  position: relative;

}

.h2-slider svg {

  position: absolute;

  left: 0;

  bottom: -5px;

  z-index: 2;

  height:150px;

  width: 100%;

}

.banner-content{

  width: 100%;

}

/* 背景漂浮 */

.dot {

  position: absolute;

  opacity: 0.5;

  background: #1e96db;

  border-radius: 50%;

}

.dot-one {

  height: 20px;

  width: 20px;

  left: 10%;

  top: 50%;

  animation: slider_popin_effect 10s linear infinite;

}

.dot-two {

  height: 40px;

  width: 40px;

  left: 13%;

  top: 50%;

  animation: slider_popin_effect 11s linear infinite;

}

.dot-three {

  height: 80px;

  width: 80px;

  right: 15%;

  top: 20%;

  animation: slider_popin_effect 20s linear infinite;

}

.dot-four {

  height: 20px;

  width: 20px;

  left: 50%;

  top: 30%;

  animation: slider_popin_effect 7s linear infinite;

}

.layui-shu{ text-align:right;}
@keyframes slider_popin_effect {

  0% {

      transform: scale(1);

  }

  50% {

      transform: scale(3);

  }

  100% {

      transform: scale(1);

  }

}

/* banner搜索tab */

.banner-search{

  background-image: url(../images/banner-bg.jpg);

  background-size: cover;

}

.banner-search .layui-tab-title{

  background-color: rgba(0, 0, 0, 0.7);

  color: #fff;

  border: none;

  height: 60px;

}

.banner-search li{

  line-height: 60px;

}

.banner-search .layui-this{

  background-color: #222;

  color: #fff;

}

.banner-search .layui-this:after{

  border-width: 0;

}

.banner-search .layui-tab-content{

  background-color: rgba(0, 0, 0, 0.5);

}

.center-box{

  display: flex;

  align-items: center;

  height: 230px;

}

.search-box{

  position: relative;

  width: 80%;

  margin: 0 auto;

  margin-top: -30px;

}

.search-select{

  position: absolute;

  top: 0;

  left: 0;

  height: 60px;

  border: none;

  width: 150px;

  padding-left: 50px;

}

.search-box-input{

  height: 60px;

  padding-left: 200px;

  border: none;

}

.btn-search{

  position: absolute;

  top: 0;

  right: 0;

  background-color: #ed9f16;

  color: #fff;

  width: 130px;

  height: 60px;

  border-top-left-radius: 0;

  border-bottom-left-radius: 0;

  font-size: 24px;

}

/* banner图标 */

.banner-icon-wrap{

  margin-top: 30px;

}
.banner-icon-wrap1{

 display:none;
  margin-top: 30px;

}

.banner-icon-link{

  display: block;

  text-align: center;

  color: #fff;

  text-transform: uppercase;

  letter-spacing: 0.05em;

  position: relative;

  overflow: hidden;

  padding-top: 20px;

  padding-bottom: 20px;

  border-radius: 3px;

  transition: color 0.25s;

}

.banner-icon{

  display: block;

  font-size: 30px;

  padding-bottom: 10px;

}
.banner-icon1{

  display: block;

  font-size: 30px;

  padding-bottom: 10px;

}



.banner-icon-link::before, .banner-icon-link::after {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  border: 1px solid transparent;

  width: 0;

  height: 0;

}

.banner-icon-link:hover::before, .banner-icon-link:hover::after {

  width: calc(100% - 2px);

  height: calc(100% - 2px);

}

.banner-icon-link:hover::before {

  border-top-color: #fff;

  border-right-color: #fff;

  transition: width 0.25s ease-out, height 0.25s ease-out 0.25s;

}

.banner-icon-link:hover::after {

  border-bottom-color: #fff;

  border-left-color: #fff;

  transition: height 0.25s ease-out, width 0.25s ease-out 0.25s;

}

.banner-icon-link:hover{

  color: #fff;

}





/* 新闻 */

.news-wrap{

  padding-top: 20px;

  padding-bottom: 20px;

}

.news-main .layui-this{

   font-size: 20px;

   font-weight: bold;

}

.black-title{

  position: relative;

  font-size: 24px;

  font-weight: bold;

  padding-bottom: 10px;

}

.news-more{

  position: absolute;

  top: 0px;

  right: 0;

  font-size: 14px;

  font-weight: normal;

  color: #999;

}

.news-item{

  line-height: 40px;

  border-bottom: 1px #bebebe dashed;

}

.news-item:last-child{

  border: none;

}

.news-title{

  white-space: nowrap;

  text-overflow: ellipsis;

  overflow: hidden;

  padding-right: 15px;

}

.news-time{

  color: #999;

  text-align: right;

  white-space: nowrap;

}

.news-event{

  width: 100%;

  height: 370px;

}

.news-event img{

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.link-p{

  margin-top: 8px;

  white-space: nowrap;

  text-overflow: ellipsis;

  overflow: hidden;

}

.news-link-p{

  margin-top: 0;

  line-height: 40px;  
  text-align: center;

}







/* 标题 */

.section-title{

  font-size: 30px;

}

.main-box{

  padding-top: 50px;

  padding-bottom: 50px;

}



/* 数字资源 */

.resource-item{

  padding: 20px;

  box-shadow: 0px 2px 4px -2px rgba(0, 0, 0, 0.1);

  position: relative;

  overflow: hidden;

  margin-bottom: 10px;

}

.resource-item1{

  background-color: #edf7f9;

}

.resource-item2{

  background-color: #fff5f0;

}

.resource-item3{

  background-color: #e9f2fe;

}

.resource-item4{

  background-color: #f2f5f9;

}

.resource-type{

  font-size: 24px;

  line-height: 40px;

}

.resource-icon{

  position: absolute;

  right: -30px;

  top: -30px;

  font-size: 100px;

}



.resource-text{

  padding-right: 10px;

  white-space: nowrap;
  font-size:16px;

}

.resource-text:hover{

  color: #45b2f5;

}



/* 读者服务 */

.service-item{

  background-color: #fff;

}

.service-title{

  line-height: 60px;

  padding-left: 20px;

  font-size: 18px;

  color: #fff;

}

.service-content{

  padding: 10px 20px 20px 20px;
  height: 75px;
  overflow: hidden;
  line-height: 3;

}



/* 文化推广 */

.silide-nav{

  position: relative;

}

.slide-nav-btn{

  position: absolute;

  top: -30px;

  padding: 6px;

  border-radius: 50%;

  background-color: #45b2f5;

  color: #fff;

}

.slide-nav-left{

  left: 0;

}

.slide-nav-right{

  right: 0;

}

.slide-box{

  width: 100%;

  margin: 0 auto;

  overflow: hidden;

}

.slide-list{

  width: 2850px;

  height: 212px;

  overflow: hidden;

  margin: 0 auto;

}

.slide-item{

  display: inline-block;

  vertical-align: middle;

  margin-right: 20px;

  width: 285px;

  overflow: hidden;

}

.slide-img{

  height: 170px;

}

.slide-img img{

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.slide-text{

  display: block;

  line-height: 40px;

  text-align: center;

  border-bottom: 2px solid #45b2f5;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

}

.layui-carousel>[carousel-item]{

  background: none;

}

.culture-carousel-item .carousel-img{

  height: 200px;

}

#culture .layui-carousel-ind, .news .layui-carousel-ind{

  top: -60px;

}

#culture .layui-carousel-ind, .news .layui-carousel-ind, .news2 .layui-carousel-ind

{

  top: -60px;

}



/* 图书馆指南 */

.help-wrap{

  text-align: center;

}

.help-wrap  .layui-row{

  height: 130px;

}

.help-item{

  display: block;

  background-color: #fff;

  color: #45b2f5;

  /* margin: 10px; */

  line-height: 30px;

  padding-top: 30px;

  padding-bottom: 10px;

  border-radius: 4px;

  transition: .3s;

  height: 116px;

  box-sizing: border-box;

}

.help-item:hover{

  color: #45b2f5;

  transform: translateY(-4px);

}

.help-icon{

  height: 40px;

  font-size: 30px;

  transition: .3s;

}

.help-item:hover .help-icon{

  font-size: 36px;

}

/* 友情链接 */

.friend-link-main{

    text-align: left;

    margin-top: 50px;

}



a.friend-link-item{


    display: inline-block;

    color: #fff;

    padding-left: 20px;

}

a.friend-link-item{

  color: #fff;



}



a.friend-link-item:hover{

    color:#ff0000;

}

/* 悬浮导航 */

.float-nav{

  display: none;

  position: fixed;

  right: 1%;

  top: 50%;

  transform: translateY(-50%);

  z-index: 100;

}

.float-nav-item{

  width: 60px;

  height: 60px;

  text-align: center;

  border-radius: 50%;

  background-color: #45b2f5;

  color: #fff;

  margin-bottom: 30px;

  box-shadow: 0 0 6px #fff;

}

.float-nav-item:hover{

  background-color: #d61820;

}

.float-nav-item .layui-icon{

  display: block;

  font-size: 26px;


}

.ziyuanjianjie{

  height: 20px;

  overflow: hidden;

}

/* 超小屏幕-手机xs */

@media screen and (max-width: 768px){

  .banner-icon-link{

    color: #45b2f5;

  }
.banner-icon-wrap{
display:none;
  margin-top: 30px;

}
.banner-icon-wrap1{

 display:block;
  margin-top: 30px;

}
  .banner-icon-link:hover{

    color: #1a73e8;

  }

  .black-title{

    text-align: left;

  }

  .black-title::before {

    content: "";

    position: absolute;

    left: 0;

    bottom: 0;

    height: 2px;

    width: 56px;

    background-color: #45b2f5;

  }

  .xs-new-pic{

    padding-bottom: 30px;

  }

  .news-event{

    height: 200px;

  }

  .service-item{

    background-color: #45b2f5;

    color: #fff;

  }

  .service-item a{

    color: #fff;

  }

  .service-item a:hover{

    color: #93D1FF;

  }

  .service-item2{

    background-image: linear-gradient( to right, #36b1db, #42dadf);

  }

  .service-item3{

    background-image: linear-gradient( to right, #2889d6, #36b1db);

  }

  .service-item4{

    background-image: linear-gradient( to right, #47c0d1, #48c0d1);

  }

  .news-item{

    line-height: 50px;

    border-bottom: none;

  }

  .news-item:first-child{

    margin-top: 20px;

  }

  .news-title::before{

    /*content:url(xxk_list_tb.png);*/

    font-family: layui-icon;

    padding: 3px;

    font-size: 25px;

    font-weight: bold;

    vertical-align: middle;

    margin-right: 4px;

  }

  .resource-type{

    font-size: 16px;

    font-weight: bold;

  }

  .resource-type::before{

    content:url(phone_szzy.png);

    font-family: layui-icon;

    color: #45b2f5;

    padding-right: 10px;

    font-weight: normal;

    font-size: 30px;

    vertical-align: top;

  }

  .resource-content{

    padding-left: 40px;

  }

  .ziyuanjianjie{

    height: 19px;

    overflow: hidden;

  }

  .main-box{

    padding-top: 15px;

    padding-bottom: 15px;

  }

  .pdt-50{

    padding-top: 20px;

  }

  a.friend-link-item{

    color: #222;

  }
.layui-shu{ text-align:right; display:none;}
}



/* 小屏幕-平板以上sm */

@media screen and (min-width: 768px){

  .h2-slider{

    display: flex;

    align-items: center;

    /* height: calc(100vh - 100px); */

    height: 560px;

  }

  .h2-slider::before {

    content: '';

    position: absolute;

    left: 0;

    top: 0;

    height: 100%;

    width: 100%;

    background:url(tsg.jpg) no-repeat bottom left #45b2f5;

    opacity: 1;

  }  

  .banner-content{

    position: absolute;

    top: 10px;

    z-index: 3;

  }

  .news-main{

    padding-right: 30px;

  }

  .section-title{

    text-align: center;

    height: 66px;

  }

  .section-title::before {

    content: "";

    position: absolute;

    left: calc(50% - 56px);

    bottom: 0;

    height: 2px;

    width: 116px;

    background-color: #45b2f5;

  }

  .section-title::after {

    content:url(col_bg.png);

    position: absolute;

    color: #45b2f5;

    background-color: transparent;

    bottom: -4px;

    left: calc(50% - 13px);

    font-family: layui-icon;

    font-weight: normal;

  }

  .service-wrap{

    background-color: #eef7fc;

  }

  .service-wrap .layui-col-xs6{

    padding: 15px;

  }

  .service-item1 .service-title{

    background-color: #488cd3;
	background:url(jb.jpg) no-repeat;

  }

  .service-item2 .service-title{

    background-color: #48c0d1;
	background:url(jb.jpg) no-repeat;

  }

  .service-item3 .service-title{

    background-color: #48d26f;
	background:url(jb.jpg) no-repeat;

  }

  .service-item4 .service-title{

    background-color: #48d2bd;
	background:url(jb.jpg) no-repeat;

  }

  .help-wrap{

    background-color: #45b2f5;

    color: #fff;

  }

}









