* {
padding: 0;
margin: 0;
}
body,
html {
margin: 0;
padding: 0;
min-width: 1500px;
height: 100vh;
min-height: 900px;
}
@font-face {
font-family: 'DOUYU';
src: url('../fonts/DOUYUFONT-2.OTF');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Source Han Sans SC';
src: url('../fonts/SOURCEHANSANSSC-LIGHT-2.OTF');
font-weight: normal;
font-style: normal;
}
.detailDiv {
width: 45%;
max-width: 836px;
max-height: 569px;
height: 60%;
background-image: url(../images/floorbg.png);
background-size: 100% 100%;
font-family: "Source Han Sans SC";
color: #2895FF;
padding: 30px;
box-sizing: border-box;
position: absolute;
right: 10px;
top: 5%;
z-index: 11;
}
.detailDiv>div {
width: 100%;
height: 100%;
}
.detailDiv .top {
height: 48px;
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.detailDiv .right {
font-size: 16px;
display: flex;
flex-direction: column;
}
.detailDiv .right>span {
white-space: nowrap;
}
.detailDiv .el-tabs {
margin-top: 15px;
}
.detailDiv .el-tabs__item {
font-size: 1.5rem;
color: #2895FF;
padding: 0 5px;
height: 43px;
margin-right: 30px;
}
.detailDiv .el-tabs__item.is-active {
font-weight: bold;
color: #2895FF;
border-bottom: 5px solid #2895FF;
}
.detailDiv .el-tabs__nav-wrap::after {
background-color: rgb(40 149 255 / 30%);
}
.detailDiv .el-tabs__active-bar {
display: none;
}
.moxing {
font-weight: 600;
position: absolute;
bottom: 27%;
width: 750px;
left: 16%;
display: flex;
flex-direction: column;
align-items: center;
font-family: Source Han Sans SC;
z-index: 10;
}
.moxing img {
width: 100%;
}
.moxing .imgDiv {
position: relative;
width: 100%;
}
.zxfw {
font-weight: bold;
font-size: 26px;
color: #F4F4F4;
width: 45%;
max-width: 836px;
position: absolute;
top: 65%;
right: 0;
box-sizing: border-box;
}
.zxfw .buttonList {
display: flex;
flex-wrap: wrap;
width: 100%;
}
.zxfw .button {
width: 223px;
height: 89px;
background-image: url(../images/button-zxfw.png);
background-size: 100% 100%;
text-align: center;
padding-top: 23px;
box-sizing: border-box;
letter-spacing: 3px;
margin-bottom: 15px;
margin-right: 20px;
cursor: pointer;
}
.ysqgk {
width: 100%;
background-color: #fff;
height: 100%;
}
.floorTabs {
position: absolute;
left: 120px;
top: 60px;
display: flex;
flex-direction: column;
z-index: 11;
}
.floorTabs .list {
width: 163px;
height: 50px;
line-height: 50px;
text-align: center;
background: #286EBC;
margin-bottom: 20px;
font-size: 20px;
color: #FFFFFF;
cursor: pointer;
}
.floorTabs .active {
background: #CD9D64;
}
.sxqd {
height: calc(100% - 32px);
padding-left: 25px;
display: flex;
flex-direction: column;
}
.sxqd ul {
padding-top: 0;
margin-top: 0;
}
.sxqd li {
cursor: pointer;
margin-top: 10px;
}
.sxqd li span {
line-height: 30px;
border-bottom: 1px solid #2895FF;
padding-bottom: 5px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
display: block;
font-size: 18px;
}
.bottomBtn {
display: flex;
position: absolute;
left: 120px;
bottom: 50px;
}
.bottomBtn .btn {
width: 145px;
height: 51px;
line-height: 50px;
background: #7DB0EE;
font-weight: bold;
font-size: 18px;
color: #F4F4F4;
text-align: center;
cursor: pointer;
}
.bottomBtn .active {
background: #0D74F2;
}
.el-tabs {
height: calc(100% - 42px);
}
.el-tabs__content {
height: calc(100% - 58px);
}
.el-tabs__content>div {
height: 95%;
}