@charset "gb2312";
*{margin: 0;padding: 0;box-sizing: border-box;outline: none;-webkit-tap-highlight-color: transparent;}
em,i{font-style:normal;}
table{border-collapse: collapse;border-spacing: 0;}
input,img,select{vertical-align: middle;} 
button {border: none; cursor: pointer;}
img{border: none;display: block;}
li {list-style: none;}
input,textarea{-webkit-appearance: none; /* 清楚ios移动端输入框自带阴影*/}
body{font-family:"微软雅黑",'helvetica neue',tahoma,'hiragino sans gb',stheiti,'wenquanyi micro hei',\5FAE\8F6F\96C5\9ED1,\5B8B\4F53,sans-serif;position: relative;margin: 0 auto;}

html, body{position: relative;height: 100%;font-size: .28rem;overflow: hidden;}
.load{width: 100%;height: 100%;position: absolute;left: 0;top: 0;bottom: 0;right: 0;z-index: 1000;overflow: hidden;background: #f5f5f5;}
.load img{position: absolute;left: 50%;margin-left: -15%;margin-top: -50px;top: 45%;width: 30%;height: auto;}

.connect,.footer,.top,.author,.swiper-button-next,.swiper-button-prev,.small_pic,.coverImg,.logo_r{display: none;}
.wrap{width: 100%;height: 100%;overflow: hidden;position: relative;background: #333;}
.logo{position: absolute;top: 1.7rem;}
.logo img{width: 2.5rem;margin-left: .2rem;margin-top: .2rem;}
.periods{position: absolute;left: 2.5rem;top: .4rem;color: #fff;}
.pics{width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
.swiper-container{width: 100%;height: 100%;margin-left: auto;margin-right: auto;}
.swiper-slide{text-align: center;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;}
.swiper-slide img{display: block;width: 100%;height: auto;margin: -.5rem auto 0;object-fit:contain;}

.text{position: absolute;bottom: 0;width: 100%;font-size: .28rem;box-sizing:border-box;padding:2% 4% 2%;text-align:justify;color: #fff;background-color:rgba(0,0,0,0.7);overflow: hidden;z-index: 500;}
.pic_title{font-size: .34rem;font-weight:300;margin:0;word-wrap:break-word;text-align:left;float: left;width: 6rem;margin-top:.2rem;}
.pic_index{font-size: .26rem;color:#a5a5a5;float: right;}
.pic_index span{font-size:.52rem;letter-spacing:-0.08rem;color:#bb2c34;}
.words{font-size:.30rem;line-height:.5rem;height: 2rem;overflow: auto;width: 100%;margin-top: .2rem;word-break:break-all;color:#999;border-top: 1px dotted #999;padding-top:.2rem;}

.big_title{display: none;}
.text_top{overflow: hidden;margin-bottom: .2rem;}
.logo_l p{color: #fff;margin-left: .3rem;margin-top: .1rem;}

.music{background: url(http://bazhuawangluo.oss-cn-hangzhou.aliyuncs.com/com/octo_h5/music.png);width: .5rem;height: .5rem;position: absolute;right: .2rem;top: .2rem;background-size: 100% 100%;z-index: 500;}
.music.on{-webkit-animation: rotating 1.2s linear infinite;animation: rotating 1.2s linear infinite;}

.theme{background: url(../images/theme.png);position: absolute;width: 6.5rem;height: 1.58rem;background-size: 100% 100%;left: 0;top: .0rem;display:none;}

.author_tell{position: absolute;width: 100%;height: 100%;left: 0;top: 0;background: #fff;z-index: 999;padding-top: 36%;}
.author_tell p{font-size: .3rem;line-height: .75rem;margin-left: .5rem;text-indent: 2em;width: 6.5rem;}

@keyframes rotating {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes rotating {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}