You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

253 lines
3.7 KiB

.wrap {
width: 100%;
height: auto;
position: relative;
background: url(../img/areaBgm.png) no-repeat;
background-size: 100% 100%;
overflow: hidden;
}
.box_cont {
display: flex;
margin-top: .14rem;
margin-left: .1rem;
height: 88%;
overflow: hidden;
}
/*地区*/
.leftList {
/*flex: 1;*/
height: 96%;
/*overflow-y: auto;*/
}
.leftList ul{
height: 100%;
overflow-y: auto;
}
::-webkit-scrollbar {
/*隐藏滚轮*/
display: none;
}
.leftList li {
width: .8rem;
height: .32rem;
display: flex;
justify-content: center;
align-items: center;
background: #fff;
border-radius: .05rem;
margin-bottom: .12rem;
}
.leftList li span {
display: block;
box-sizing: border-box;
color: #333;
font-size: .14rem;
line-height: .32rem;
text-align: center;
}
.leftList li span.name {
text-align: center;
}
.leftList li span.num {
display: none;
}
.leftList li.active {
background: #F09C22;
}
.leftList li.active span {
color: #FFFFFF;
}
.leftList li.select{
background: #F09C22;
}
.leftList li.select span {
color: #FFFFFF !important;
}
/*博物馆图片*/
.rightCont {
/*flex: 2;*/
margin-left: 0.15rem;
margin-top: .05rem;
position: relative;
height: 96%;
}
.rightCont .title {
font-size: .12rem;
color: #fff;
/*position: fixed;*/
z-index: 999;
padding-bottom: .1rem;
}
.rightCont .title img {
width: .14rem;
height: .14rem;
margin-right: .05rem;
}
.imgList{
height: 80%;
overflow-y: auto;
}
.museumImg {
display: flex;
flex-wrap: wrap;
margin-left: .1rem;
margin-right: .24rem;
margin-top: .12rem;
display: none;
}
.museumImg li {
/*width: 50%;*/
height: auto;
width: 1.04rem;
}
.museumImg li:nth-child(2n){
margin-left: .28rem;
}
.museumImg div.item {
width: 1.04rem;
/*height: .42rem;*/
position: relative;
border-radius: .05rem;
}
.museumImg li .contImg {
width: 1.04rem;
height: .42rem;
}
.museumImg p.contImg img {
width: 100%;
height: 100%;
}
.museumImg p.icon {
width: .24rem;
height: .24rem;
position: absolute;
right: 0;
top: 0;
font-size: 0;
transform: translate(50%,-50%);
display: none;
}
.museumImg p.icon img {
width: 100%;
height: 100%;
}
.museumImg p.name{
color: #fff;
font-size: .13rem;
width: 1.04rem;
text-align: center;
margin-top: .08rem;
margin-bottom:.18rem ;
}
.museumImg li.active div.item{
background: #F09C22;
}
.museumImg li.active p.icon{
display: block;
}
/*选中名称*/
.chooseList {
height: 16%;
margin-top: .15rem;
width: 100%;
/*overflow: hidden;*/
}
.chooseList p{
font-size: .12rem;
color: #fff;
display: flex;
align-items: center;
}
.chooseList p img{
width: .13rem;
height: .13rem;
}
.chooseName {
width: 2.7rem;
display: flex;
margin-top: .12rem;
overflow-x: auto;
}
.chooseName li{
width: .75rem;
height: .3rem;
border: 1px solid #F09C22;
border-radius: .05rem;
display: flex;
justify-content: center;
align-items: center;
margin-right: .04rem;
}
.chooseName li span.text{
width: .42rem;
overflow: auto;
white-space: nowrap;
font-size: .14rem;
margin-left: .07rem;
color: #fff;
box-sizing: border-box;
}
span.closeIcon img{
width: .14rem;
height: .14rem;
margin-left: .06rem;
padding-right: .02rem;
}
/*底部按钮*/
.deepBtn {
/*height: 12%;*/
position: fixed;
left: 50%;
bottom: .16rem;
transform: translateX(-50%);
display: flex;
width: 2.91rem;
height: .46rem;
background: #3B7BFF;
justify-content: center;
border-radius: .04rem;
line-height: .46rem;
text-align: center;
color: #fff;
font-size: .18rem;
}
/*弹出框*/
.tips{
width: 1.5rem;
height: .5rem;
border-radius: .1rem;
line-height: .5rem;
background: rgba(0,0,0,0.7);
text-align: center;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
font-size: .18rem;
color: #fff;
display: none;
}