750 lines
26 KiB
CSS
750 lines
26 KiB
CSS
|
* {
|
|||
|
|
padding: 0;
|
|||
|
|
margin: 0;
|
|||
|
|
box-sizing: border-box
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
li, ol {
|
|||
|
|
list-style: none
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a {
|
|||
|
|
text-decoration: none
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
@font-face {
|
|||
|
|
font-family: "方正大黑_GBK";
|
|||
|
|
src: url("../font/方正大黑_GBK.eot?") format("eot");
|
|||
|
|
src: url("../font/方正大黑_GBK.woff") format("woff"),url("../font/方正大黑_GBK.ttf")
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
@font-face {
|
|||
|
|
font-family: "液晶数字";
|
|||
|
|
src: url("../font/液晶数字.eot?") format("eot");
|
|||
|
|
src: url("../font/液晶数字.woff") format("woff"),url("../font/液晶数字.ttf")
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar {
|
|||
|
|
width: 5px;
|
|||
|
|
height: 5px;
|
|||
|
|
background-color: transparent
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-track {
|
|||
|
|
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
|
|||
|
|
border-radius: 10px;
|
|||
|
|
background-color: #107f8b
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-thumb {
|
|||
|
|
border-radius: 10px;
|
|||
|
|
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
|
|||
|
|
background-color: #dfe4f1
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-thumb:hover {
|
|||
|
|
border-radius: 5px;
|
|||
|
|
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
|
|||
|
|
background: rgba(0,0,0,0.4)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
html {
|
|||
|
|
scrollbar-face-color: #dfe4f1;
|
|||
|
|
scrollbar-highlight-color: #107f8b;
|
|||
|
|
scrollbar-3dlight-color: #107f8b;
|
|||
|
|
scrollbar-darkshadow-color: #107f8b;
|
|||
|
|
scrollbar-shadow-color: #dfe4f1;
|
|||
|
|
scrollbar-arrow-color: rgba(16,127,139,0.4);
|
|||
|
|
scrollbar-track-color: #dfe4f1
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
html {
|
|||
|
|
font-size: 10vw;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
min-width: 1200px;
|
|||
|
|
min-height: 768px;
|
|||
|
|
font-family: Microsoft YaHei;
|
|||
|
|
line-height: 1
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
@media screen and (max-width: 1200px) {
|
|||
|
|
html {
|
|||
|
|
font-size: 120px
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.ellipsis {
|
|||
|
|
overflow: hidden;
|
|||
|
|
text-overflow: ellipsis;
|
|||
|
|
white-space: nowrap
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-index1-body {
|
|||
|
|
background: #0b5695;
|
|||
|
|
background-image: url("../image/index8/bg3.jpg");
|
|||
|
|
background-size: 10rem auto;
|
|||
|
|
background-repeat: no-repeat
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header {
|
|||
|
|
position: relative;
|
|||
|
|
width: 100%;
|
|||
|
|
height: .45833rem;
|
|||
|
|
padding: 0 .10417rem;
|
|||
|
|
background: url("../image/index8/header-bg.png") center center/100% 100% no-repeat
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-title {
|
|||
|
|
position: absolute;
|
|||
|
|
top: .07292rem;
|
|||
|
|
left: 50%;
|
|||
|
|
transform: translate(-50%);
|
|||
|
|
font-size: .19792rem;
|
|||
|
|
color: #2f97ec;
|
|||
|
|
white-space: nowrap
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-left {
|
|||
|
|
position: absolute;
|
|||
|
|
left: .10417rem;
|
|||
|
|
top: .03125rem;
|
|||
|
|
font-size: .0625rem;
|
|||
|
|
color: #2f97ec;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-left .sd-location-name {
|
|||
|
|
margin-right: .09375rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-left .sd-location-weather {
|
|||
|
|
margin-right: .08333rem;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-left .sd-location-weather img {
|
|||
|
|
margin-right: .04688rem;
|
|||
|
|
width: .09896rem;
|
|||
|
|
object-fit: contain
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-left .sd-location-weather span {
|
|||
|
|
margin-right: .05208rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-left .sd-location-time {
|
|||
|
|
display: inline-block
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-right {
|
|||
|
|
position: absolute;
|
|||
|
|
top: .03125rem;
|
|||
|
|
right: .10417rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-right ul {
|
|||
|
|
font-size: 0;
|
|||
|
|
white-space: nowrap
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-right ul li {
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: top;
|
|||
|
|
font-size: .0625rem;
|
|||
|
|
line-height: .08333rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-right ul li a {
|
|||
|
|
color: #2f97ec
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-right ul li:not(:last-child) {
|
|||
|
|
margin-right: .10417rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-right ul li span {
|
|||
|
|
position: relative;
|
|||
|
|
margin-right: .03646rem;
|
|||
|
|
vertical-align: middle
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-right ul li i {
|
|||
|
|
font-size: .07292rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-top .sd-header-top-right ul li .sd-message-dot::after {
|
|||
|
|
content: "";
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
width: .03125rem;
|
|||
|
|
height: .03125rem;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
background: #f39800
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-bottom {
|
|||
|
|
position: absolute;
|
|||
|
|
top: .40458rem;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-bottom ul {
|
|||
|
|
position: absolute;
|
|||
|
|
bottom: 0;
|
|||
|
|
font-size: 0
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-bottom ul li {
|
|||
|
|
display: inline-block;
|
|||
|
|
width: .84896rem;
|
|||
|
|
height: .17708rem;
|
|||
|
|
line-height: .17708rem;
|
|||
|
|
text-align: center
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-bottom ul li:not(:last-child) {
|
|||
|
|
margin-right: .03646rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-bottom ul li a {
|
|||
|
|
display: block;
|
|||
|
|
font-size: .08333rem;
|
|||
|
|
color: #fff
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-bottom ul.sd-header-bottom-menu:nth-child(1) {
|
|||
|
|
text-align: left;
|
|||
|
|
left: .10417rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-bottom ul.sd-header-bottom-menu:nth-child(1) li {
|
|||
|
|
background: url("../image/index8/header-left-menu-bg.png") center center/100% 100% no-repeat
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-bottom ul.sd-header-bottom-menu:nth-child(2) {
|
|||
|
|
text-align: right;
|
|||
|
|
right: .08333rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-header .sd-header-bottom ul.sd-header-bottom-menu:nth-child(2) li {
|
|||
|
|
background: url("../image/index8/header-right-menu-bg.png") center center/100% 100% no-repeat
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body {
|
|||
|
|
padding: 0 .10417rem;
|
|||
|
|
margin-top: .0625rem;
|
|||
|
|
display: flex
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-left {
|
|||
|
|
width: 2.36458rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-center {
|
|||
|
|
flex: 1;
|
|||
|
|
min-width: 0;
|
|||
|
|
padding: 0 .10417rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-center .sd-body-menus {
|
|||
|
|
font-size: 0;
|
|||
|
|
display: flex;
|
|||
|
|
padding-top: .15625rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-center .sd-body-menus .sd-body-menu {
|
|||
|
|
flex: 1;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
padding-bottom: .10417rem;
|
|||
|
|
height: .57292rem;
|
|||
|
|
background: url("../image/index8/center-menu-bg.png") center center/100% 100% no-repeat
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-center .sd-body-menus .sd-body-menu:not(:last-child) {
|
|||
|
|
margin-right: .08333rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-center .sd-body-menus .sd-body-menu .sd-body-menu-label {
|
|||
|
|
font-size: .07292rem;
|
|||
|
|
color: #666666;
|
|||
|
|
text-align: center
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-center .sd-body-menus .sd-body-menu .sd-body-menu-value {
|
|||
|
|
font-size: .1875rem;
|
|||
|
|
font-family: "液晶数字";
|
|||
|
|
margin-top: .0625rem;
|
|||
|
|
color: #4eafbb
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-center .sd-body-menus .sd-body-menu .sd-body-menu-value--yellow {
|
|||
|
|
color: #ffc277
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-center .sd-body-map {
|
|||
|
|
position: relative;
|
|||
|
|
margin-top: .20833rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-center .sd-body-map .sd-body-map-switch-btn {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
width: .84896rem;
|
|||
|
|
height: .23438rem;
|
|||
|
|
background: url("../image/index7/map-switch-btn-bg.png") center center/100% 100% no-repeat;
|
|||
|
|
font-size: .08333rem;
|
|||
|
|
color: #42aab6;
|
|||
|
|
cursor: pointer
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-center .sd-body-map .sd-body-map-switch-btn i {
|
|||
|
|
font-size: .08333rem;
|
|||
|
|
color: #42aab6;
|
|||
|
|
margin-left: .04167rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-body-right {
|
|||
|
|
width: 2.36458rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section {
|
|||
|
|
position: relative;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 1.59375rem;
|
|||
|
|
background-color: #f9fafc;
|
|||
|
|
border-radius: .08333rem;
|
|||
|
|
box-shadow: 0px 0px .15625rem .02604rem rgba(196,196,196,0.2)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section + .sd-section {
|
|||
|
|
margin-top: .11458rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-title {
|
|||
|
|
position: absolute;
|
|||
|
|
top: .07813rem;
|
|||
|
|
left: 50%;
|
|||
|
|
transform: translateX(-50%);
|
|||
|
|
width: 100%;
|
|||
|
|
height: .16667rem;
|
|||
|
|
padding-left: .09375rem;
|
|||
|
|
text-align: left;
|
|||
|
|
font-size: .09375rem;
|
|||
|
|
color: #097e8b
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-title-r {
|
|||
|
|
padding-right: .09375rem;
|
|||
|
|
text-align: right
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner {
|
|||
|
|
padding-top: .32813rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc {
|
|||
|
|
display: flex;
|
|||
|
|
overflow: hidden
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc .sd-user-calc-left {
|
|||
|
|
padding: 0 .15625rem;
|
|||
|
|
flex: 1;
|
|||
|
|
min-width: 0
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc .sd-user-calc-left .sd-user-calc-item {
|
|||
|
|
margin-top: .02604rem;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
text-align: center;
|
|||
|
|
position: relative;
|
|||
|
|
width: 1.09375rem;
|
|||
|
|
height: .35417rem;
|
|||
|
|
background: url("../image/index8/bk.png") center center/100% 100% no-repeat
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc .sd-user-calc-left .sd-user-calc-item + .sd-user-calc-item {
|
|||
|
|
margin-top: .33333rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc .sd-user-calc-left .sd-user-calc-item .sd-user-calc-label {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
position: absolute;
|
|||
|
|
left: 50%;
|
|||
|
|
transform: translateX(-50%);
|
|||
|
|
top: -.02604rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc .sd-user-calc-left .sd-user-calc-item .sd-user-calc-label span {
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: top;
|
|||
|
|
padding: 0 .07292rem;
|
|||
|
|
text-align: center;
|
|||
|
|
position: relative;
|
|||
|
|
font-size: .08333rem;
|
|||
|
|
color: #333
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc .sd-user-calc-left .sd-user-calc-item .sd-user-calc-value {
|
|||
|
|
margin-top: .14583rem;
|
|||
|
|
padding-right: .04167rem;
|
|||
|
|
text-align: right;
|
|||
|
|
font-size: .13542rem;
|
|||
|
|
color: #42aab6
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc .sd-user-calc-left .sd-user-calc-item .sd-user-calc-value span {
|
|||
|
|
font-size: .07292rem;
|
|||
|
|
margin-left: .02604rem;
|
|||
|
|
color: #666666
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc .sd-user-calc-right {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
padding-right: .17188rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc .sd-user-calc-right .sd-user-calc-circle-box {
|
|||
|
|
position: relative;
|
|||
|
|
width: .75rem;
|
|||
|
|
height: .75rem;
|
|||
|
|
background: url("../image/index8/s1-bg.png") center center/100% 100% no-repeat
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section1-inner .sd-user-calc .sd-user-calc-right .sd-user-calc-circle-box canvas {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 50%;
|
|||
|
|
left: 50%;
|
|||
|
|
width: .82292rem;
|
|||
|
|
height: .82292rem;
|
|||
|
|
transform: translate(-50%, -50%)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section2-inner {
|
|||
|
|
padding-top: .21875rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section2-inner .sd-output-box {
|
|||
|
|
width: 2.21354rem;
|
|||
|
|
height: 1.28125rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section3-inner {
|
|||
|
|
padding-top: .25rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section3-inner .sd-rate-list {
|
|||
|
|
padding: 0 .11458rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section3-inner .sd-rate-list .sd-rate-item {
|
|||
|
|
display: flex;
|
|||
|
|
font-size: .07292rem;
|
|||
|
|
align-items: center
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section3-inner .sd-rate-list .sd-rate-item + .sd-rate-item {
|
|||
|
|
margin-top: .0625rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section3-inner .sd-rate-list .sd-rate-item .sd-rate-status {
|
|||
|
|
margin-right: .02604rem;
|
|||
|
|
color: #12cda2
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section3-inner .sd-rate-list .sd-rate-item .sd-rate-name {
|
|||
|
|
color: #333333;
|
|||
|
|
margin-right: .10417rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section3-inner .sd-rate-list .sd-rate-item .sd-rate-bar {
|
|||
|
|
flex: 1;
|
|||
|
|
min-width: 0;
|
|||
|
|
height: .04167rem;
|
|||
|
|
border-radius: .10417rem;
|
|||
|
|
background: #dce2f1;
|
|||
|
|
overflow: hidden
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section3-inner .sd-rate-list .sd-rate-item .sd-rate-bar .sd-rate-bar-value {
|
|||
|
|
display: inline-block;
|
|||
|
|
vertical-align: top;
|
|||
|
|
height: 100%;
|
|||
|
|
transition: width 0.5s;
|
|||
|
|
width: 0;
|
|||
|
|
background: linear-gradient(to right, #14cda2, rgba(20,205,162,0.005))
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .el-scrollbar {
|
|||
|
|
overflow-x: hidden;
|
|||
|
|
overflow-y: scroll;
|
|||
|
|
position: relative;
|
|||
|
|
height: 100%;
|
|||
|
|
margin-right: -8px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section3-inner .el-scrollbar__wrap {
|
|||
|
|
position: relative
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .el-scrollbar__bar {
|
|||
|
|
position: absolute;
|
|||
|
|
right: 2px;
|
|||
|
|
bottom: 2px;
|
|||
|
|
z-index: 1;
|
|||
|
|
border-radius: 4px;
|
|||
|
|
opacity: 0;
|
|||
|
|
-webkit-transition: opactiy 0.12s ease-out;
|
|||
|
|
transition: opactiy 0.12s ease-out
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .el-scrollbar__bar.is-vertical {
|
|||
|
|
width: 6px;
|
|||
|
|
top: 2px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .el-scrollbar__bar.is-vertical > div {
|
|||
|
|
width: 100%
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .el-scrollbar__bar.is-horizontal {
|
|||
|
|
height: 6px;
|
|||
|
|
left: 2px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .el-scrollbar__bar.is-horizontal > div {
|
|||
|
|
height: 100%
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .el-scrollbar__thumb {
|
|||
|
|
position: relative;
|
|||
|
|
display: block;
|
|||
|
|
width: 0;
|
|||
|
|
height: 0;
|
|||
|
|
cursor: pointer;
|
|||
|
|
border-radius: inherit;
|
|||
|
|
background-color: rgba(144,147,153,0.3);
|
|||
|
|
-webkit-transition: background-color .3s;
|
|||
|
|
transition: background-color .3s
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner {
|
|||
|
|
padding: .26042rem .15625rem 0
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner .sd-security .sd-security-label {
|
|||
|
|
font-size: .08333rem;
|
|||
|
|
color: #333333
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner .sd-security .sd-security-value {
|
|||
|
|
width: 1.97917rem;
|
|||
|
|
height: .25521rem;
|
|||
|
|
margin: .09375rem auto 0;
|
|||
|
|
padding: 0 .02604rem;
|
|||
|
|
text-align: right;
|
|||
|
|
background: url("../image/index8/security-time-bg.png") center center/100% 100% no-repeat;
|
|||
|
|
font-size: .15625rem;
|
|||
|
|
color: #42aab6;
|
|||
|
|
font-family: "液晶数字";
|
|||
|
|
letter-spacing: .09896rem;
|
|||
|
|
padding-top: .06771rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner .sd-security-ratios {
|
|||
|
|
margin-top: .21875rem;
|
|||
|
|
text-align: center;
|
|||
|
|
font-size: 0
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner .sd-security-ratios .sd-security-ratio {
|
|||
|
|
display: inline-block;
|
|||
|
|
padding: .10417rem;
|
|||
|
|
width: .94792rem;
|
|||
|
|
height: .48958rem;
|
|||
|
|
text-align: center;
|
|||
|
|
background: url("../image/index8/security-time-box-bg.png") center center/100% 100%
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner .sd-security-ratios .sd-security-ratio:nth-child(1) {
|
|||
|
|
margin-right: .10417rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner .sd-security-ratios .sd-security-ratio .sd-security-ratio-value {
|
|||
|
|
font-size: .14583rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner .sd-security-ratios .sd-security-ratio .sd-security-ratio-value--blue {
|
|||
|
|
color: #42aab6
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner .sd-security-ratios .sd-security-ratio .sd-security-ratio-value--yellow {
|
|||
|
|
color: #ffb260
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner .sd-security-ratios .sd-security-ratio .sd-security-ratio-value span:nth-child(2) {
|
|||
|
|
font-size: .07292rem;
|
|||
|
|
color: #666666;
|
|||
|
|
margin-left: .01042rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section4-inner .sd-security-ratios .sd-security-ratio .sd-security-ratio-label {
|
|||
|
|
margin-top: .10417rem;
|
|||
|
|
font-size: .07292rem;
|
|||
|
|
color: #666666
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section5-inner {
|
|||
|
|
padding-top: .26042rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section5-inner .sd-quality {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
min-width: 1.20313rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section5-inner .sd-quality .sd-quality-num {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
position: relative;
|
|||
|
|
height: .40104rem;
|
|||
|
|
padding-right: .07813rem;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
background: url("../image/index8/quality-num-bg.png") center right/1.20313rem 100% no-repeat;
|
|||
|
|
font-size: .08333rem;
|
|||
|
|
color: #333333
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section5-inner .sd-quality .sd-quality-num span {
|
|||
|
|
display: inline-block;
|
|||
|
|
text-align: right;
|
|||
|
|
min-width: .75rem;
|
|||
|
|
margin-right: .02083rem;
|
|||
|
|
font-size: .14583rem;
|
|||
|
|
color: #42aab6
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section5-inner .sd-quality .sd-quality-num em {
|
|||
|
|
display: inline-block;
|
|||
|
|
margin-top: .04688rem;
|
|||
|
|
font-style: normal;
|
|||
|
|
font-size: .07292rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section5-inner .sd-quality-circles {
|
|||
|
|
display: flex;
|
|||
|
|
margin-top: .07292rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section5-inner .sd-quality-circles .sd-quality-circle {
|
|||
|
|
flex: 1;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-direction: column
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section5-inner .sd-quality-circles .sd-quality-circle .sd-quality-circle-name {
|
|||
|
|
margin-top: .03125rem;
|
|||
|
|
font-size: .07292rem;
|
|||
|
|
color: #fff;
|
|||
|
|
text-align: center
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section6-inner {
|
|||
|
|
padding-top: .23958rem;
|
|||
|
|
padding-left: .13021rem;
|
|||
|
|
display: flex
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section6-inner .sd-video-play {
|
|||
|
|
position: relative;
|
|||
|
|
width: 1.53125rem;
|
|||
|
|
height: 1.29167rem;
|
|||
|
|
margin-right: .10417rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section6-inner .sd-video-play .sd-video {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
background: #000;
|
|||
|
|
object-fit: fill
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section6-inner .sd-video-play .sd-video-desc {
|
|||
|
|
position: absolute;
|
|||
|
|
left: 0;
|
|||
|
|
bottom: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
height: .14063rem;
|
|||
|
|
padding: 0 .08854rem 0 .06771rem;
|
|||
|
|
font-size: .0625rem;
|
|||
|
|
color: #fff;
|
|||
|
|
background: rgba(14,32,67,0.6)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section6-inner .sd-video-items .sd-video-item {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
flex-direction: column;
|
|||
|
|
width: .57292rem;
|
|||
|
|
height: .56771rem;
|
|||
|
|
background: url("../image/index8/video-num-bg.png") center center/100% 100% no-repeat
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section6-inner .sd-video-items .sd-video-item + .sd-video-item {
|
|||
|
|
margin-top: .13021rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section6-inner .sd-video-items .sd-video-item .sd-video-item-num {
|
|||
|
|
font-size: .125rem
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section6-inner .sd-video-items .sd-video-item .sd-video-item-num--blue {
|
|||
|
|
color: #42aab6
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section6-inner .sd-video-items .sd-video-item .sd-video-item-num--green {
|
|||
|
|
color: #12cda2
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content .sd-section6-inner .sd-video-items .sd-video-item .sd-video-item-desc {
|
|||
|
|
margin-top: .04167rem;
|
|||
|
|
font-size: .07292rem;
|
|||
|
|
color: #333333
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content-scroll {
|
|||
|
|
height: 100%;
|
|||
|
|
padding-top: .25rem;
|
|||
|
|
padding-bottom: .04167rem;
|
|||
|
|
overflow: hidden
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.sd-body .sd-section .sd-section-content-scroll .sd-section3-inner {
|
|||
|
|
padding-top: 0;
|
|||
|
|
height: 100%;
|
|||
|
|
overflow: hidden
|
|||
|
|
}
|