*{ margin: 0; padding: 0; } @media (max-width: 1280px){ html{ font-size: 10px !important; } } @media(max-width:1366px){ html{ font-size: 13px !important; } } @media(min-width:1920px){ html{ font-size: 20px !important; } } body{ background: url("../../images/bj.png"); background-size:100% 100%; background-position: center center; /* -webkit-background-size: cover; */ background-attachment: fixed; /* overflow: hidden; */ } /*a,p,h1,h2,h3,h4,h5,h6,body,span,label,div{padding:0;margin:0;font-family:'瀵邦喛钂嬮梿鍛寸拨';} div{font-family:'瀵邦喛钂嬮梿鍛寸拨';} ul{padding:0;margin:0;} a{text-decoration:none !important;}*/ @font-face{ font-family: yjsz; src:url('../fonts/yjsz.ttf'); /* url('../fonts/yjsz.eot'); *//* IE9+,可以是具体的实际链接 */ } .fl{ float: left; } .fr{ float: right; } /*头部*/ #header{ width: 100%; height: 8.08rem; position: relative; /*border-bottom: 1px solid #00fbfe;*/ background: url("../../images/head_bg.png") no-repeat center center; background-size: 100%; box-shadow: 0 0 1.92rem #037581; /* min-width: 1366px; */ } #header .header{ width: 30.77rem; height: 8.08rem; /*background: red;*/ margin: 0 auto; text-align: center; line-height: 6.15rem; font-size: 1.85rem; } #header .header h1{ color: #ffffff; text-shadow: 0 0 1.93rem #00d8ff; font-size: 15.33rem; font-family:"Adobe 楷体 Std R"; } /*#data_content { width: 100%; height: calc(100% - 105px); padding-top: 20px; background: red; }*/ .data_content{ width: calc(100% - 3.08rem); /* height: 48.46rem; */ /*padding-top: 30px;*/ /* background: red;*/ /* margin-top: 2rem; */ margin-left: 1.15rem; /* min-width: 1366px; */ /*margin-bottom: 40px;*/ } #data_content .data_info{ width: calc(100% - 3.08rem); height: 6.46rem; /*background: red;*/ margin-left: 1.54rem; margin-bottom: 1.31rem; margin-top: 0.54rem; /* min-width: 1366px; */ } #data_content .data_info .conuts{ font-family: 'yjsz'; font-size: 3.08rem; } #data_content .data_info .info_1{ width: 40%; height: 6.46rem; /*background: green;*/ } #data_content .data_info .info_1 .text_1{ width: calc(100% - 1.92rem); height: 6.46rem; margin-top: -1rem; background-color: #0c1629; } #data_content .data_info .info_1 .text_1 div{ width: 33.3%; position: relative; } #data_content .data_info .info_1 .text_1 img{ position: absolute; top: 2.22rem; left: 1.15rem; } #data_content .data_info .info_1 .text_1 .count{ margin-left: 5rem; margin-top: 1.77rem; width: 100%; } #data_content .data_info .info_1 .text_1 .count p:nth-child(1){ color: #ffffff; } #data_content .data_info .info_1 .text_1 .count p:last-child{ color: #00fbfe; text-shadow: 0 0 1.92rem #00fbfe; font-size: 2.15rem; font-weight: bolder; } #data_content .data_info .info_2{ width: 31%; height: 6.46rem; /*background: purple;*/ } #data_content .data_info .info_2 .text_2{ width: calc(100% - 1.92rem); height: 6.46rem; background-color: #0c1629; margin-top: -1rem; } #data_content .data_info .info_2 .text_2 div{ width: 50%; position: relative; } #data_content .data_info .info_2 .text_2 img{ position: absolute; top: 2.22rem; left: 1.15rem; } #data_content .data_info .info_2 .text_2 .count{ margin-left: 5rem; margin-top: 1.77rem; } #data_content .data_info .info_2 .text_2 .count p:nth-child(1){ color: #ffffff; } #data_content .data_info .info_2 .text_2 .count p:last-child{ color: #00fbfe; text-shadow: 0 0 1.92rem #00fbfe; font-size: 2.15rem; font-weight: bolder; } #data_content .data_info .info_3{ width: 29%; height: 6.46rem; } #data_content .data_info .info_3 .text_2{ width: 100%; height: 6.46rem; background-color: #0c1629; margin-top: -1rem; } #data_content .data_info .info_3 .text_2 div{ width: 50%; position: relative; } #data_content .data_info .info_3 .text_2 img{ position: absolute; top: 2.22rem; left: 1.15rem; } #data_content .data_info .info_3 .text_2 .count{ margin-left: 5rem; margin-top: 1.77rem; } #data_content .data_info .info_3 .text_2 .count p:nth-child(1){ color: #ffffff; } #data_content .data_info .info_3 .text_2 .count p:last-child{ color: #00fbfe; text-shadow: 0 0 1.92rem #00fbfe; font-size: 2.15rem; font-weight: bolder; } /*左边*/ .data_content .data_left{ width: 24%; height: 100%; /*background: green;*/ } .data_content .data_left .left_top{ width: 100% ; height: 21rem; /*background: green;*/ } /*四个角的*/ .public:before, .public:after{ position:absolute; width: 1.54rem; height: 1.54rem; content: ""; border-top: 0.15rem solid #02a6b5; top: 0;} .public:before,.boxfoot:before{border-left: 0.15rem solid #02a6b5;left: 0;} .public:after,.boxfoot:after{border-right: 0.15rem solid #02a6b5; right: 0;} .boxfoot{ position:absolute; bottom: 0; width: 100%; left: 0;} .boxfoot:before, .boxfoot:after{ position:absolute; width: 1.54rem; height: 1.54rem; content: "";border-bottom: 0.15rem solid #02a6b5; bottom: 0;} /*四个角的*/ /*左边第一部分*/ .data_content .data_left .left_top .info{ width: 100%; height: 65%; /* background: rgba(1,33,44,0.3); */ border: 1px solid #20558b ; position: relative; margin-bottom: 2.69rem; /*box-shadow: -10px 0px 15px #034c6a inset, !*左边阴影*! 0px -10px 15px #034c6a inset, !*上边阴影*! 10px 0px 15px #034c6a inset, !*右边阴影*! 0px 10px 15px #034c6a inset;*/ } .min-title{ width: 15.38rem; height: 3.08rem; background: #0c1629; /*margin: 0 auto;*/ top: -1.54rem; position: absolute; left: 50%; border-radius: 1.54rem; text-align: center; margin-left: -6.92rem; } .min-title span{ display: inline-block; line-height: 3.08rem; color: white; } /*左边第二部分*/ .data_content .data_left .left_top .top_bottom{ width: 100%; height: 15.08rem; border: 1px solid #20558b ; position: relative; margin-bottom: 2.69rem; } /*中间*/ .data_content .data_c{ width: 52%; height: 100%; /* padding:0 20px;*/ } .data_content .data_c .data_c_1{ width: calc(100% - 3.85rem); height: 28.46rem; /*background: red;*/ /*border: 1px solid #20558b ;*/ position: relative; margin-bottom: 2.69rem; margin-left: 1.92rem; } .data_content .data_c .data_c_1 .dzimg{ width: 61.54rem; height: 100%; margin: 0 auto; position: relative; background: url("../../images/page1_3.jpg") no-repeat center; background-size: cover; } .data_content .data_c .data_c_1 .dzimg img{ top: 25%; left: 3.85rem; width: 38.46rem; height: 46.15rem; position: absolute; transition: transform 1s ease 1s; transform-style: preserve-3d; transform: rotateY(0deg) translateZ(240px); } .data_content .data_c .data_c_2{ width: calc(100% - 3.85rem); height: calc(28% - 10.77rem); border: 1px solid #20558b ; position: relative; margin-left: 1.92rem; } /*右边*/ .data_content .data_right{ width: 24%; height: 100%; } .data_content .data_right .right_top{ width: 100%; height: calc(60% - 1.54rem); /*background: green;*/ } .data_content .data_right .right_top .right_info{ width: 100%; height: 14.23rem; border: 1px solid #20558b; position: relative; margin-bottom: 2.69rem; } .wenzi{ margin-top: 2.31rem; } .gun{ /* width: 100%;*/ /*margin: 20px;*/ } .gun span{ display: block; float: left; height: 1.54rem; width: 33%; /*background: red;*/ /*margin: 15px 10px 10px 10px;*/ /*padding: 20px;*/ text-align: center; font-size: 1.08rem; font-weight: 600; color: #61d2f7; text-align: center; margin-bottom: 0.77rem; } #FontScroll{ width: 100%; height: 13.08rem; overflow: hidden; /*float: left;*/ margin-top: 0.77rem; /*margin: 0 5%;*/ /*margin-left: 50px;*/ /*background: gold;*/ } #FontScroll ul li{ height: 2.92rem; width: 100%; color: #ffffff; text-align: center; line-height: 2.92rem; border-bottom: 1px dashed #404040; /*width:33.3%;*/ overflow: hidden; /*background: red; margin: 0 2%;*/ } #FontScroll ul li:nth-child(1){ /*background-color: #072951;*/ box-shadow: -10px 0px 15px #034c6a inset, /*左边阴影*/ 10px 0px 15px #034c6a inset; } #FontScroll ul li:hover{ box-shadow: -10px 0px 15px #034c6a inset, /*左边阴影*/ 10px 0px 15px #034c6a inset; cursor: pointer; } .fontInner span{ display:inline-block; /*float: left;*/ /*height: 20px;*/ width:31%; /*background: red;*/ } .data_content .data_right .right_top .right_content{ width: 100%; height: 14.23rem; border: 1px solid #20558b; position: relative; margin-bottom: 2.69rem; } .data_content .data_right .right_top .right_bottom{ width: 100%; height: calc(50% - 1.54rem); border: 1px solid #20558b; position: relative; margin-bottom: 1.54rem; } .content{ width: 38.46rem; height: 38.46rem; margin: 0 auto; } .content img{ margin-top: 38.46rem; } .content-bottom{ height: 100px; float: left; width: calc(100% - 2.85rem); margin-left:1.15rem ; margin-top: -20px; } .bottom-title{ width: 15.38rem; height: 3.08rem; background: #0c1629; color: #fff; line-height: 3.08rem; /*margin: 0 auto;*/ border-radius: 1.54rem; text-align: center; margin: 0 auto; margin-top: -1.2rem; } .runHistory-container{ height: 112px; position: relative; border: 1px solid #20558b; } .header_icon{ width: 3.08rem; height: 3.08rem; } #alarmCount{ color: rgb(178, 30, 30) !important; } /* .center-image{ width: 20rem; height: 40rem; margin:0 auto; } */