anxiao_web/pages/index/css/mainCenter.css

252 lines
3.8 KiB
CSS
Raw Permalink Normal View History

2024-07-24 09:22:32 +08:00
.mainContentC{
float:left;
width:calc(100% - 944px);
margin:0 5px;
height:100%;
}
.mainContentC_t{
height:678px;
box-sizing: border-box;
border:1px solid #5397F0;
border-radius: 2px;
background:url("../image/center-bg.jpg") 0 0 no-repeat;
}
.mainContentC_b{
height:calc(100% - 683px);
box-sizing: border-box;
border:1px solid #5397F0;
border-radius: 2px;
margin-top:5px;
}
.mainContentC_b_t{
height:40px;
line-height:40px;
box-sizing: border-box;
border-bottom:1px solid #5397F0;
}
.mainContentC_b_b{
height:calc(100% - 40px);
overflow-y: auto;
}
.mainContentC_b_b>table{
width:100%;
height:100%;
}
.superli {
width:100%;
overflow: hidden;
}
.superli>ul{
display: flex;
justify-content: space-between;
height:100%;
}
.superli>ul>li{
width:171px;
height:171px;
text-align: center;
line-height:171px;
flex:1;
background:url("../image/circle1.png") no-repeat center !important;
background-size:cover;
font-size:24px;
position: relative;
}
.superli>ul>li:nth-child(1){
top:240px;
left:30px;
animation:xiaonei1 linear infinite 2s;
}
.superli>ul>li:nth-child(2){
top:120px;
left:15px;
animation:xiaonei2 linear infinite 2s;
}
.superli>ul>li:nth-child(3){
left:0px;
animation:xiaonei3 linear infinite 2s;
}
.superli>ul>li:nth-child(4){
left:15px;
animation:xiaonei3 linear infinite 2s;
}
.superli>ul>li:nth-child(5){
top:120px;
right:0px;
animation:xiaonei2 linear infinite 2s;
}
.superli>ul>li:nth-child(6){
top:240px;
right:30px;
animation:xiaonei1 linear infinite 2s;
}
@keyframes xiaonei1 {
0% {
top:230px;
}
50% {
top:240px;
}
100% {
top:230px;
}
}
@keyframes xiaonei2 {
0% {
top:110px;
}
50% {
top:120px;
}
100% {
top:110px;
}
}
@keyframes xiaonei3 {
0% {
top:10px;
}
50% {
top:20px;
}
100% {
top:10px;
}
}
.superli ul li:hover {
transform:scale(1.1);
transition:all 0.3s;
}
.superli ul li a {
display:block;
color:#fff;
}
.superli>div:first-child{
width:100%;
display: flex;
justify-content: space-around;
margin-top:10px;
}
.superli>div>div{
width:166px;
height:166px;
}
.superOut{
width:166px;
height:166px;
border:0px solid #fff;
border-radius:50%;
overflow:hidden;
position:relative;
background: url("../image/circle3.png") no-repeat center !important;;
}
.superin{
width:166px;
height:0;
line-height:166px;
text-align: center;
position:absolute;
bottom:0;
left:0;
}
.superin_num{
color:#fff;
font-size:20px;
line-height:1.5;
font-weight:bold;
position:absolute;
top:50%;
margin-top:-25px;
text-align:center;
width:100%;
}
.superin_num>span{
font-size:26px;
}
.superli>div:last-child{
width:263px;
height:271px;
line-height:300px;
text-align: center;
background: url("../image/center-logo.png") center center no-repeat;
margin:0 auto;
}
.superli>div:last-child>p{
width:100%;
float:left;
font-size:30px;
text-align: center;
line-height:40px;
}
.superli>div:last-child>p:first-child{
margin-top:95px;
}
.superli>div:last-child>p>span:first-child{
font-size:30px
}
.superli>div:last-child>p>span:last-child{
font-size:16px;
}
.indexMapBg{
width:100%;
height:314px;
background:url("../image/map.png") no-repeat center !important;
clear: both;
margin-top:-50px;
}
.centerBg{
background:url("../image/circle2.png") no-repeat center !important;
background-size:cover;
}
.mainContentC_b_t{
padding:0 10px;
}
.mainContentC_b_t>span:last-child{
float:right;
}