xz-rkz/xz_screen/css/style.css
dong_bo0602 5d413b7e6c all
2022-07-13 12:22:13 +08:00

88 lines
6.5 KiB
CSS

#app{position:absolute;top:0;bottom:0;left:0;right:0}
@font-face {
font-family: zhangti;
src: url("../font/HIMALAYA.TTF");
font-weight:bold;
}
[v-cloak]{display: none}
.background{position:absolute;top:0;left:0;bottom:0;right:0;width:100%;height:100%;z-index:-1}
.mid-text{width:7rem;height:2rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.go-inside{position:absolute;bottom:0;left:50%;transform:translate(-50%,0);width:2.75rem;height:1.4rem;display:block}
.go-inside img{width:100%;height:100%}
.top{padding:.32rem;overflow:hidden;font-size:0;height:80%}
.top-left{width:5.16rem;height:100%;background:url(../images/main-left.png) no-repeat center;background-size:100% 100%;font-size:0;float:left;padding-bottom:.15rem;box-sizing:border-box}
.left-text{padding:.45rem .3rem 0;text-align:center}
.left-text h3{font-size: .4rem;color:#fcd201;margin-bottom: .3rem}
.img-title{width:100%;height:1.2rem;margin-bottom:.25rem}
.venue-intro-text div, .left-text p, .intro-main div{color:#fcd201 !important;font-size:.2rem !important;line-height:.45rem !important;}
.venue-intro-text img{width: 100%;height: 4rem}
.temperature{font-size:.7rem;color:#fff;margin-bottom:.2rem}
.time{text-align:center;color:#fff;font-size:.3rem;height:.65rem;line-height:.65rem;background:url(../images/time-bg.png) no-repeat center;background-size:100% 100%}
.date{font-size:.2rem;color:#fff;text-align:center;margin-top:.2rem}
.top-right{width:13.2rem;float:right;height:100%;background:url(../images/main-bg.png) no-repeat center;background-size:100% 100%;padding:.5rem .55rem 0;box-sizing:border-box}
.main-title{text-align:center}
.main-title p{color:#fcd71e;font-size:.4rem;}
.main-title span{color:#fcd71e;font-size:.4rem;padding:0 .35rem;position:relative}
.main-title span:before{content:'';display:block;width:.2rem;height:100%;background:url(../images/title-l.png) no-repeat left center;background-size:100% 100%;position:absolute;top:0;left:0}
.main-title span:after{content:'';display:block;width:.2rem;height:100%;background:url(../images/title-r.png) no-repeat left center;background-size:100% 100%;position:absolute;top:0;right:0}
.main-img{margin-top:.2rem}
.main-img ul{overflow:hidden}
.main-img ul li{float:left;width:3.66rem;height:2rem;margin-right:.55rem}
.main-img ul li:nth-child(3n){margin-right:0}
.main-img ul li img{width:100%;height:100%}
.main-text{font-size:.2rem;color:#fff;line-height:.4rem;height:3rem;overflow-y:auto;margin-top:.1rem}
.page{text-align:right;font-size:0;margin-top:.5rem}
.page a{display:inline-block;width:1.28rem;height:.64rem;font-size:.2rem;color:#fff;background:url(../images/page-bg.png) no-repeat center;background-size:100% 100%;text-align:center;line-height:.64rem;margin-right:.2rem}
.bottom{position:absolute;bottom:0;left:0;right:0;font-size:0;z-index:100}
.bottom ul{display: flex;}
.bottom ul li{height:1.4rem;flex: 1;font-size:0;background:url(../images/select.png) no-repeat center;background-size:100% 100%}
.bottom ul li.active{background:url(../images/select-on.png) no-repeat center;background-size:100% 100%}
.bottom ul li a{display:block;font-size:.36rem;color:#ffd400;line-height:.62rem;text-align:center;opacity:.6}
.bottom ul li.active a{opacity:1}
.org-text-box{margin-bottom:.3rem}
.org-text-box:after{content: '';display: block;clear: both}
.org-text-box h3{font-size:.24rem;font-weight:400;color:#ffd400;padding-left:.15rem;border-left:5px solid #ffd400;margin-bottom:.2rem}
.org-text,.personnel-text{font-size:.2rem;color:#fff;line-height:.3rem}
.org-info{font-size:0;margin-bottom:.2rem}
.personnel-text{height:100%;margin-top:.3rem;overflow-y:auto}
.contact,.reward{height:100%;overflow:hidden}
.reward ul{overflow:hidden}
.reward ul li{width:33.333%;float:left;padding:0 .2rem 0 .3rem;background:url(../images/reward-icon.png) no-repeat left center;background-size:.2rem .2rem;font-size:.2rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;line-height:.6rem}
.contact-left{float:left;width:3.9rem}
.contact-title{font-size:.2rem;color:#fff;font-weight:400;padding-left:.25rem;background:url(../images/contact-icon.png) no-repeat left center;background-size:.17rem .17rem;margin-bottom:.24rem}
.contact-left p{font-size:.2rem;color:#fff;padding-left:.25rem;margin-bottom:.4rem}
.contact-right{float:right;width:7.85rem;height:4.6rem;overflow: hidden}
.qr-code{width: 32%;margin-right: 2%;float: left}
.qr-code:last-child{margin-right: 0}
.qr-code img{width: 100%;}
.qr-code p{font-size: .18rem;text-align: center;color: #fff;margin-top: .1rem}
.main{height:70%;overflow-y: auto;margin-top: .2rem}
.venue-main{height: 78%;overflow-y: auto;margin-top: .2rem;position: relative}
.venue-main:after{content: '';display: block;clear: both}
.floor-btn{width: 3%;float: left;text-align: center;position: fixed;}
.floor-btn ul li{font-size: .24rem;line-height: .5rem;color: #fff;cursor: pointer}
.floor-btn ul li.active{color: #FCD71E}
.floor-img{width: 94%;height:100%;float: right}
.intro-main{overflow-y: auto;margin-top: .2rem}
.intro-main p{font-size: .2rem;color: #fff}
.leader-intro{font-size: .2rem;color: #fff;width: 9.5rem;float: right}
.leader-avatar{width: 2rem;height: 2.5rem;float: left;}
.p-text{font-family:'zhangti'}
.detail{position: fixed;top: 0;left: 0;bottom: 0;right: 0;background: rgba(0,0,0,0.6);z-index: 10000}
.detail-container{width: 80%;height: 90%;position: absolute;top: 50%;left: 50%;background: #fff;transform: translate(-50%, -50%);overflow-y: scroll;font-size: .28rem;padding: .2rem;box-sizing: border-box}
.img-list{overflow: hidden;}
.img-list li{width: 32%;margin-right: 2%;margin-bottom: .1rem;height: 4.5rem;float: left;overflow: hidden;}
.img-list li:nth-child(3n){margin-right: 0}
.img-list li p{width: 100%;height: 100%}
.img-list li table{table-layout: fixed;width: 100%}
.img-list li td{position: relative;height: 4.5rem;width: 100%;}
.img-list li img{position: absolute;left: 50%;top: 0;height: 4.5rem;transform: translate(-50%, 0)}
.big-img{position: fixed;top: 0;bottom: 0;left: 0;right: 0;background: rgba(0,0,0,0.6);z-index: 100000}
/*.big-img img{width: 90%;height: 90%;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%)}*/
.big-img table{position: absolute;top:50%;left:50%;transform: translate(-50%,-50%)}
.big-img td{font-size: .18rem;color: #fff;text-align: center}
.iframe-container{z-index: 100000;position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,0.6);padding: .8rem .5rem;}
.iframe{width: 100%;height: 100%;}
.iframe-container img{position: absolute;top: .2rem;right: .2rem;width: .4rem;height: .4rem;cursor: pointer}
.iframe-box{background: #fff;width: 100%;height: 100%;}