﻿/* 新鲜事 */
#swiper .swiper-pagination-bullet{background:#fff; opacity:1; width:9px; height:9px;}
#swiper .swiper-container-horizontal > .swiper-pagination-bullets,#swiper .swiper-pagination-custom,#swiper .swiper-pagination-fraction{padding-right: 10px;text-align: right}
#swiper .swiper-container-horizontal > .swiper-pagination-bullets{bottom:22px; padding:0 30px;}
#swiper .swiper-pagination-bullet-active{background-color: #f5a623}
#swiper .swiper-container{width: 100%; height: 278px;margin-bottom: 20px;border-radius: 10px; box-shadow: 0 5px 10px 0 rgba(0,0,0,.06);  transition: all 0.5s;  -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s;}
#swiper .swiper-slide{height: 278px; display: -webkit-box;display: -webkit-flex;display: flex;-webkit-box-align: center;-webkit-align-items: center;align-items: center;-webkit-box-pack: center;-webkit-justify-content: center;justify-content: center;font-size: 18px;text-align: center;background: #fff;border-radius: 10px; overflow: hidden;}
#swiper .swiper-img { display: block; max-width:calc(100% - 374px); max-height: 278px; flex: 1; }
#swiper .swiper-img img { display: block; max-width:100%; max-height: 278px; margin-left: auto; margin-right: auto; }
#swiper .swiper-desc {display: block; width:374px; height: 100%;  background: #4C458A; font-size: 30px; padding: 40px; color: white; text-align: left;}
#swiper .swiper-container:hover{ box-shadow: 0 5px 10px 0 rgba(0,0,0,.1);}

.new-list{position:relative; padding-bottom:25px;margin-bottom: 20px;overflow: hidden;background-color: #fff;border-radius: 8px;box-shadow: 0 5px 10px 0 rgba(0,0,0,.06);height:345px;}
.new-list__img{ position: relative; border-radius:8px 8px 0 0; -webkit-border-radius:8px 8px 0 0; -moz-border-radius:8px 8px 0 0; -ms-border-radius:8px 8px 0 0; -o-border-radius:8px 8px 0 0; background-color: #5f56ac; }
.new-list__img a{display: block; position: relative; width: 100%; height: 100%;}
.new-list__img a:after{content: "";display:block;padding-top: 60%;}
.new-list__img img, 
.new-list__img yz-img{
   border-radius:8px 8px 0 0; -webkit-border-radius:8px 8px 0 0; -moz-border-radius:8px 8px 0 0; -ms-border-radius:8px 8px 0 0; -o-border-radius:8px 8px 0 0;
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   margin: auto;
   width: 100%;
   height: 100%;
   max-height: 100%;
   max-width: 100%;
   vertical-align: middle;
}
.new-list__title{box-sizing: border-box;width: 100%;padding: 12px 30px 12px;font-size: 15px;font-weight: bold; height: 4em;overflow: hidden;}
.new-list__content{display: block;display: -webkit-box;height: 3.0em;max-height: 3.0em;padding: 0 30px;overflow: hidden;font-size: 14px;line-height: 1.5;color: #9b9b9b;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical}
.new-list__footer{display: -webkit-box;display: -webkit-flex;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;justify-content: space-between;padding: 12px 30px 0}
.new-list__footer div{font-size: 12px;font-weight: 700;color: #000}
.new-list__footer span{font-size: 10px;color: #999}
/*  广告 */
.adv{position: relative;width: 100%;height: auto;background-color: #5f56ac;}
.adv span{position: absolute;bottom: 0;left: 0;padding: 0 10px;font-size: 10px;color: #fff; background:#ccc;}
.adv video{width:100%; height:100%; display: block; object-fit:fill;}
/* 科技早知道、知识 */
.technology-list{padding: 0 20px 0;background-color: #fff;border-radius: 8px;box-shadow: 0 5px 10px 0 rgba(0,0,0,.06); transition: all 0.5s;  -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s;}
.technology-list:hover{ box-shadow: 0 5px 10px 0 rgba(0,0,0,.1); -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0);}
.technology-list__img{position: relative; z-index:2; display: inline-block;float:left;width: 150px;height: 103px;margin-right: 20px;background-color: #5f56ac; border-radius: 4px;overflow: hidden;}
.technology-list__img img,
.technology-list__img yz-img{width: 100%;height: 103px; border-radius: 4px;overflow: hidden;}
.technology-list__item{padding: 20px 10px;overflow: hidden;border-bottom: 1px solid #eaeffa}
.technology-list__item:hover h4>a{color:#4c458a; padding-left: 5px;}
.technology-list__item:last-child{border-bottom: none}
.technology-list__content{position:relative; z-index:1;}
.technology-list__content h4{margin: 0;font-size: 18px;font-weight: 700;line-height: 25px;color: #4a4a4a}
.technology-list__content p{margin-top:5px;font-size: 14px;color: #7c7c7c; text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;display: -webkit-box; overflow: hidden;}
.technology-list__content .technology-list__time{margin-top:5px}
.technology-list__time span{margin-right: 20px;font-size: 12px;color: #7c7c7c}
.technology-list__footer{display: -webkit-box;display: -webkit-flex;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;justify-content: space-between; margin-top: 15px;}
.technology-list__footer span{line-height: 22px; height: 22px;}
.technology-list__footer div:nth-of-type(2) span{margin-left: 20px;font-size: 10px;color: #7c7c7c;text-align: right}
.technology-list__more{font-size: 16px;font-weight: 700;line-height: 62px;color: #4a4a4a;text-align: center}

.knowledge .technology-list{padding: 0;background: 0 0;border-radius: 0;box-shadow: none}
.knowledge .technology-list__img{position:relative; z-index: 2; width: 336px;max-width: 100%;height: 140px;background-color: #5f56ac;border-radius: 4px}
.knowledge .technology-list__img img, .knowledge .technology-list__img yz-img{max-width: 100%;height: 140px; border-radius: 4px;overflow: hidden;}
.knowledge .technology-list__item{position: relative; z-index: 1; padding: 20px;margin-bottom: 20px;background: #fff;border-bottom: none;border-radius: 8px;box-shadow: 0 5px 10px 0 rgba(0,0,0,.06); transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s;}
.knowledge .technology-list__content p{color: #4a4a4a}
.knowledge .technology-list__item:hover{ box-shadow: 0 5px 10px 0 rgba(0,0,0,.1)}

/* 视频 */
.video__list .row{margin-right: -15px;margin-left: -15px}
.video__list .col-md-3{padding: 0 6px}
.video__list-item{padding-bottom: 20px}
.video__list-img{position: relative; width:100%; height: 130px; background:repeat-y; background-position: center top; background-size: cover; display: block;background-color: #926ab1;border-radius: 4px;}
.video__list-img img, .video__list-img yz-img{display: block;width:100%; height: 130px;overflow: hidden;background-color: #926ab1;border-radius: 4px}
.video__list-img div{position: absolute;right: 5px;bottom: 5px;padding: 3px 6px;font-size: 12px;line-height: 1;color: #fff;background: rgba(0,0,0,.5);border-radius: 4px}
/* .video__list-img video{width:100%; height:100%; display: block; object-fit:fill;} */
.video__list-user{position: relative;z-index: 2;padding: 0 10px 0 50px;/* margin-top: -6px; */font-size: 12px;color: #4a4a4a;height: 26px;}
.video__list-user a{display: inline-block;width: 32px;height: 32px;margin-right: 6px;vertical-align: middle;background-color: #fff;border: 2px solid #fff;border-radius: 50%;position: absolute;top: -15px;left: 10px; overflow: hidden;background-color: #5F56AC;}
.video__list-user img, .video__list-user yz-img{width:100%; height:100%; display: block;}
.video__list-user p{margin:5px 0 0;}
.video__list-user i{display: inline-block;width: 16px;height: 16px;vertical-align: middle;background: url(../image/icon_v.png) no-repeat;background-size: 100%;margin-left: 5px;}
.video__list-title{display: block;display: -webkit-box;height: 20px;margin-top: 4px;margin-bottom: 4px;overflow: hidden;font-size: 14px;font-weight: 700;line-height: 20px;text-overflow: ellipsis;-webkit-line-clamp: 1;-webkit-box-orient: vertical}
.video__list-number{font-size: 12px;line-height: 18px;color: #666}

/* 活动 */
.active__list-item{display: block; position: relative;height: 180px;margin-bottom: 30px;overflow: hidden;background-color: #5f56ac;border-radius: 8px; box-shadow: 0 5px 10px 0 rgba(0,0,0,.06); transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s; background-repeat: no-repeat; background-size: cover;}
.active__list-item img, .active__list-item yz-img{display: block;width: 100%;height: 180px}
.active__list-item > div{position: absolute;top: 0;right: 0;bottom: 0;left: 0;box-sizing: border-box;padding: 30px}
.active__list-item h3{margin: 0;margin-bottom: 28px;font-size: 20px;line-height: 28px;color: #fff}
.active__list-item p{font-size: 14px;line-height: 1.2;color: #fff}
.active__list-item:hover{ box-shadow: 0 5px 10px 0 rgba(0,0,0,.1); -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0);}

/* 笔记  */
.grid{margin: 0 -5px}
.grid:after{display: block;clear: both;content: ''}
.grid-item{float: left;padding: 0 5px;margin-bottom: 20px; width: 25%;}
.grid-item > div{width: 100%;min-height: 120px;overflow: hidden;border-radius: 8px;box-shadow: 0 5px 10px 0 rgba(0,0,0,.06); background: white;transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s;}
.grid-item-inner{padding-bottom: 15px}
.grid-item__img{display: block; position: relative;}
.grid-item__img img, .grid-item__img yz-img{display: block;width: 100%;height: 200px;background-color: #5f56ac}
.grid-item__title{display: block;display: -webkit-box;height: 44px;height: NaNem;margin: 10px 15px;overflow: hidden;font-size: 14px;line-height: 22px;color: #000;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical}
.grid-item__content{display: -webkit-box;display: -webkit-flex;display: flex;-webkit-box-align: center;-webkit-align-items: center;align-items: center;-webkit-box-pack: justify;-webkit-justify-content: space-between;justify-content: space-between;padding: 0 15px}
.grid-item__user{font-size: 12px;color: #4a4a4a}
.grid-item__user img, .grid-item__user yz-img{display: inline-block;width: 30px;height: 30px;margin-right: 5px;overflow: hidden;background-color: #d8d8d8;border-radius: 50%}
.grid-item__number{font-size: 12px;color: #9b9b9b}
.grid-item__number img, .grid-item__number yz-img{margin-right: 5px}
.grid-item > div:hover{box-shadow: 0 5px 10px 0 rgba(0,0,0,.1); -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0);}

ul.inline-share {
   display: flex;
   height: 22px;
   line-height: 22px;
   margin: 0;
   align-items: center;
}

ul.inline-share li {
   flex: 1;
   align-items: center;
   justify-content: center;
}

ul.inline-share li a {
   width: 22px;
   height: 22px;
   display: block;
   border: 1px solid #7c7c7c;
   padding: 3px;
   text-align: center;
   color: #333;
   margin-left: 10px;
   border-radius: 100%;
   -webkit-border-radius: 100%;
   -moz-border-radius: 100%;
   -ms-border-radius: 100%;
   -o-border-radius: 100%;
   cursor: pointer;
}

ul.inline-share li a:hover {
   color: #000;
   border-color: #000;
}

ul.inline-share li a i {
   font-size: 13px;
   position: relative;
   top: -4px;
   color: #75798e;
}

ul.inline-share li a:hover i {
   color: #000;
}

@media (max-width:768px){
   .aside{display: none}
   .content{width: auto;padding: 0 15px}

   #swiper .swiper-img { max-width:100%; flex: 1; }
   #swiper .swiper-desc {display: none}
   
   .new-list__img{display: block;width: 100%;height: 100px;}
   .new-list__title{width: auto;padding: 12px 15px 12px}
   .new-list__content{padding: 0 15px}
   .new-list__footer{padding: 12px 15px 0}
   .technology-list{padding: 0}
   .technology-list__img{display: block;float: none;width: 100%;height: 103px;margin-right: 0;}
   .technology-list__img img, .technology-list__img yz-img{width:100%;border-radius: 4px;overflow: hidden;}
   .technology-list__item{padding: 15px}
   .technology-list__content h4{margin: 0;font-size: 16px;line-height: 36px}
   .technology-list__footer{display: block}
   .technology-list__footer div:nth-of-type(2){margin-top: 10px}
   .technology-list__footer div:nth-of-type(2) span{margin-right: 20px;margin-left: 0;font-size: 10px;color: #7c7c7c;text-align: left}
   .technology-list__more{font-size: 16px;line-height: 46px}
   
   .knowledge .technology-list__img{width: 100%;height:140px; background-color:#5f56ac}
   .knowledge .technology-list__item{padding: 15px}

   .video__list .row{margin-right: -15px;margin-left: -15px}
   .video__list .col-md-3{padding: 0 15px}
   .video__list-item{padding-bottom: 20px}
   .video__list-img{position: relative}
   .video__list-img img, .video__list-img yz-img{display: block;height: 126px;overflow: hidden;background-color: #5f56ac;border-radius: 4px}
   .video__list-img div{position: absolute;right: 5px;bottom: 5px;padding: 3px 6px;font-size: 12px;line-height: 1;color: #fff;background: rgba(0,0,0,.5);border-radius: 4px}
   .video__list-user{position: relative;z-index: 2;padding: 0 10px 0 50px;/* margin-top: -6px; */font-size: 12px;color: #4a4a4a;height: 26px;}
   .video__list-user a{display: inline-block;width: 32px;height: 32px;margin-right: 6px;vertical-align: middle;background-color: #fff;border: 2px solid #fff;border-radius: 50%;position: absolute;top: -15px;left: 10px;}
   .video__list-user img, .video__list-user yz-img{width:100%; height:100%; display: block;}
   .video__list-user p{margin:5px 0 0;}
   .video__list-user i{display: inline-block;width: 16px;height: 16px;vertical-align: middle;background: url(../image/icon_v.png) no-repeat;background-size: 100%;margin-left: 5px;}
   .video__list-title{display: block;display: -webkit-box;height: 20px;margin-top: 4px;margin-bottom: 4px;overflow: hidden;font-size: 14px;font-weight: 700;line-height: 20px;text-overflow: ellipsis;-webkit-line-clamp: 1;-webkit-box-orient: vertical}
   .video__list-number{font-size: 12px;line-height: 18px;color: #666}
   .active__list .col-md-6:last-of-type .active__list-item{margin-bottom: 0}
   .active__list-item{display: block; position: relative;height: 180px;margin-bottom: 20px;overflow: hidden;border-radius: 8px; }
   .active__list-item img, .active__list-item yz-img{display: block;width: 100%;height: 180px}
   .active__list-item > div{position: absolute;top: 0;right: 0;bottom: 0;left: 0;box-sizing: border-box;padding: 30px}
   .active__list-item h3{margin: 0;margin-bottom: 28px;font-size: 20px;line-height: 28px;color: #fff}
   .active__list-item p{font-size: 14px;line-height: 1.2;color: #fff}

   .grid-item{width: 50%;}
   .grid-item__content{display: inherit;}
   .grid-item__content .grid-item__user{display: block;}
   .grid-item__content .grid-item__number{display: block;text-align: right;}
}
