﻿.silde-box{ position: fixed; top:0; left:0; width: 100%; height:100%; z-index:999; background: rgba(0, 14, 20, 0.95); color: #fafafa;}
.view-box{ width: 100%; height:100%; position: relative;}
.swiper-slide { text-align: center; font-size: 14px; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; position: relative;}

.swiper-slide > img{ max-height: 100%; max-width: 100%; width: auto; height:auto;}

.slide-operation{ position: fixed; top:0; left:0; width: 100%; height:56px; background: rgba(0,0,0,.5); z-index:10; color: #fafafa;}
.slide-fraction{ width: 168px; height:28px; padding:14px; font-size: 14px; color: #fafafa; line-height:28px; text-align: center;}
.slide-operation-item{ padding:10px;}
.slide-operation-item > a,.slide-operation-item{ color: #fafafa;}
.slide-operation-item > a{ display: block; float: left; width: 36px; height:36px; text-align: center; line-height:36px; font-size: 20px; cursor: pointer; border-radius: 2px; margin-left:10px; transition: all 200ms;}
.slide-operation-item > a:hover{ background: #0587f4;}

.slide-item-info{ position: absolute; left:0; bottom: -96px; right:0; padding:24px 10%; color: #fafafa; z-index:10; background: rgba(0, 0, 0,.3); height:60px; transition: all 200ms; overflow: hidden; opacity:0; text-align: left;}
.swiper-slide-active > .slide-item-info{ bottom: 0; opacity:1; transition-delay: 300ms;}
.slide-item-info.open-info{ height:auto;}
.slide-item-title{ white-space: nowrap; line-height:28px; font-size: 16px; overflow: hidden; -ms-text-overflow: ellipsis; text-overflow: ellipsis; padding-bottom:10px;}
.slide-item-summary{ font-size: 12px; color: #888; line-height:22px; height:22px; overflow: hidden; -ms-text-overflow: ellipsis; text-overflow: ellipsis; transition: all 200ms;}

.slide-item-info:hover{ height:auto;}
.slide-item-info:hover .slide-item-summary{ height:auto; overflow: visible; word-break: break-all;}
