* { padding: 0; margin: 0; box-sizing: border-box } html::-webkit-scrollbar { display: none; } .wrap { height: 100vh; background-color: #E3EFFF; } .head { height: .875rem; background-color: #0170C1; display: flex; flex-direction: row; justify-content: space-between; padding: 0 .25rem; align-items: center } .head > .logo { padding-left: 1.5rem; background-image: url(../image/logo.png); background-repeat: no-repeat; background-position: left center; height: .75rem; line-height: .75rem; font-size: .375rem; font-weight: 700; color: #FFFFFF; } .main { height: 100%; display: flex; flex-direction: row; padding: .125rem; position: relative; } .sets { display: flex; flex-direction: row; justify-content: flex-end; align-items: center; } .sets > span { width: 1px; height: .25rem; background-color: #358CCD; } .side1 { height: 100%; } .site1 { padding: .125rem; width: 8.15rem; } .box1 { width: 100%; height: 100%; background-color: #ffffff; position: relative; overflow: hidden; } .img-lab { position: absolute; bottom: 0; right: 0; left: 0; height: .375rem; padding-left: .125rem; font-size: .175rem; line-height: .375rem; color: #ffffff; background-color: rgba(68, 68, 68, .9); z-index: 99999; } .swiper-slide { width: 100%; height: 100%; display:flex; justify-content:center; align-items:center; } .swiper-slide > img { width: auto; height: 100%; } .site1 > .box1 > .tit1 { width: 100%; height: .45rem; line-height: .45rem; padding: .25rem; color: #0270C1; font-size: .175rem; border-bottom: 1px solid #C0D7E8; display: block; display: flex; flex-direction: row; justify-content: space-between; align-items: center } .site1 > .box1 > .content1 { width: 100%; height: calc(100% - .45rem); padding: .125rem; overflow: hidden; } .site1 > .box1 > img { width: 100%; height: 100%; } .site1 > .box1 > .content1 > .news-li { width: 100%; display: flex; flex-direction: row; justify-content: space-between; align-items: center; font-size: .175rem; line-height: .35rem; } .site1 > .box1 > .content1 > .news-li > p { width: 80%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .site1 > .box1 > .content1 > .news-li > span { color: #999999; } .side-r { width: 30%; height: 100%; display: flex; flex-direction: column; } .site { padding: .125rem; } .box { width: 7.2rem; background-color: #ffffff; } .navs { height: .5rem; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; border-bottom: 1px solid #F0F0F0; } .navs > .nav { height: .5rem; padding: .125rem .25rem; position: relative; } .navs > .nav-active { color: #0270C1; } .navs > .nav-active::after { content: ''; display: inline-block; height: 1px; background-color: #0270C1; position: absolute; bottom: 0; left: 0; right: 0; } .nav-panel { height: calc(100% - .5rem); padding-top: .25rem; display: none; position: relative; } .panel-more { position: absolute; right: -0.125rem; bottom: .125rem; font-size: .175rem; color: #0270C1; } .box-main > .panel-active { display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; } .mod { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 33.33%; padding: .25rem 0; } .mod > .mod-icon { height: .5rem; width: .5rem; background-repeat: no-repeat; background-position: center; background-size: 100% 100%; } .mod > .mod-val { padding-top: .125rem; } .user-box { padding: 0 .5rem; width: 100%; height: 100%; display: flex; flex-direction: row; justify-content: space-between; align-items: center; color: #0270C1; font-size: .3rem; } .user-box > img { width: 1.25rem; height: 1.25rem; } .tit { font-size: .175rem; color: #0270C1; border-bottom: 1px solid #C0D7E8; line-height: .425rem; padding: 0 .25rem; } .content { height: calc(100% - .425rem); } .panel { height: 100%; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; overflow-x: scroll; } .panel::-webkit-scrollbar { height: 2px; } .mod1 { width: 1.4375rem; height: .925rem; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } .mod1-icon { width: .5rem; height: .5rem; background-position: center; background-repeat: no-repeat; background-size: 100% 100%; } .mod1-val { margin-top: .25rem; font-size: .175rem; color: #333333; } .box-main { height: calc(100% - .425rem); padding: 0 .25rem; } .dcdb { background-image: url(../image/01.png); } .fxyj { background-image: url(../image/02.png); } .sjkb { background-image: url(../image/03.png); } .bbzx { background-image: url(../image/04.png); } .snxd { background-image: url(../image/05.png); } .ry { background-image: url(../image/06.png); } .jy { background-image: url(../image/07.png); } .wd { background-image: url(../image/08.png); } .fx { background-image: url(../image/09.png); } .yh { background-image: url(../image/10.png); } .zy { background-image: url(../image/11.png); } .aq { background-image: url(../image/12.png); } .aqfy { background-image: url(../image/13.png); } .yj { background-image: url(../image/14.png); } .links { position: absolute; left: .25rem; right: 7.675rem; bottom: .25rem; height: .375rem; background-color: #ffffff; line-height: .375rem; padding: 0 .125rem; } .links > a { padding: 0 .125rem; text-decoration: none; color: #333333; font-size: .175rem; } .links > .link-act { color: #0270C1; } .swiper { height: 100%; width: 100%; }