html,body{height:100%; padding:0; margin:0}
|
|
.flexNone{flex:none;}
|
|
.container{width:calc(100% - 60px); height:calc(100% - 60px); background:radial-gradient(#072840,#03101E); padding:30px; overflow: hidden;}
|
.header{height: 7.87vh; position: relative; margin-bottom: 15px; display: flex;}
|
.header:before{content: ' '; background-image: url(../../img/publicity/head_left_fgx.png); background-repeat: no-repeat; background-size: 100% 100%; background-position: center; position: absolute; bottom: 0; left: 0; width: 50%; height: 1.95vh;}
|
.header:after{content: ' '; background-image: url(../../img/publicity/head_right_fgx.png); background-repeat: no-repeat; background-size: 100% 100%; background-position: center; position: absolute; bottom: 0; right: 0; width: 50%; height: 1.95vh;}
|
|
.header .header_left{background-image: url(../../img/publicity/head_left_bg.png); background-position: top right; background-size: 100% 100%; background-repeat: no-repeat; height: 5.38vh; align-items: center; padding-bottom: .5vh; flex: 1; overflow: hidden; display:flex; align-items:center;}
|
.header .header_left .logo_text{color: #00f3f0; font-size: 2.5vh; letter-spacing: 2px; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 30px;}
|
|
.header .header_center{color: #72e0f5; font-size: 4vh;font-weight: 600; text-align: center; line-height: 1; letter-spacing: 4px; padding-top: 8px;flex: 1;overflow: hidden;}
|
|
.header .header_right{background-image: url(../../img/publicity/head_right_bg.png); background-position: top left; background-size: 100% 100%; background-repeat: no-repeat; height: 5.38vh; align-items: center; padding-bottom: .5vh; flex: 1;
|
overflow: hidden;display: flex;}
|
.header .header_right .datetime{color: #00f3f0;font-size: 2.5vh; letter-spacing: 2px; text-align: right; line-height: 1; padding-left:2vw;}
|
.header .header_right .switch_fullscreen{height: 3.71vh; width: 3.71vh; margin-left: 16px; background: #ffffff2b; justify-content: center; line-height: 3.71vh; font-size: 2.5vh; color: #72e0f5; cursor: pointer; display:flex; align-items:center;}
|
.header .header_right .switch_fullscreen .anticon{display: inline-block; color: inherit; font-style: normal; line-height: 0; text-align: center; text-transform: none; vertical-align: -.125em; text-rendering: optimizeLegibility;
|
-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
|
|
|
.firstRow{margin-bottom: 2.97vh; display:flex;}
|
.firstRow .map{height:100%; flex:1;height:35.13vh;margin: 0 1.67vw; border:1px solid #7CD5FF; position:relative}
|
/*轮播*/
|
.lunbo{overflow:hidden; width:30vw; height:35.13vh;}
|
.lunbo .swiper-wrapper{align-items: center;height:35.13vh;}
|
|
.lunbo .swiper-wrapper .swiper-slide{ background: 0 0; padding: 0; box-sizing: border-box; text-align: center;}
|
/*.lunbo .swiper-wrapper .swiper-slide img{width:100%;height:35.13vh;}*/
|
|
|
|
.lunbo .swiper-pagination-bullets{bottom: 50px;}
|
.lunbo .swiper-pagination-bullet{position: relative; margin: 0 5px; width: 24px; height: 4px; border-radius: 100px; opacity: 1; background: 0 0;}
|
.lunbo .swiper-pagination-bullet:before{content: ''; display: inline-block; position: absolute; width: 24px!important; height: 4px; opacity: 1; left: 0; border-radius: 100px; background: #dfe1f1; vertical-align: middle; transition: opacity .8s,background-color .8s;}
|
.lunbo .swiper-pagination-bullet-active{opacity: 1;}
|
.lunbo .swiper-pagination-bullet-active:before{width: 24px!important; opacity: 1; border-radius: 100px; transform: scale(1.2); background: #fa6f66;}
|
|
.firstRow .rowCenter{height:35.13vh; flex:1.22; display: flex; flex-direction: column;}
|
.firstRow .rowCenter .tj1{position: relative; padding: 0 27px; margin-bottom: 1.13vh; display: flex;}
|
/*.firstRow .rowCenter .tj1:before{content: ' '; background-image: url(../../img/publicity/tj1_top_left.png); background-position: center; background-repeat: no-repeat; position: absolute; height: 21px; width: 21px; top: 0; bottom: 0; margin: auto; left: 0;}*/
|
/*.firstRow .rowCenter .tj1:after{content: ' '; background-image: url(../../img/publicity/tj1_top_right.png); background-position: center; background-repeat: no-repeat; position: absolute; height: 21px; width: 21px; top: 0; bottom: 0; margin: auto; right: 0;}*/
|
|
.firstRow .rowCenter .tj1 .tj1_card{background:url(../../img/publicity/tj1_bg.png); background-size: 100% 100%; background-repeat: no-repeat; background-origin: padding-box; border-width: 10px; border-style: solid; -o-border-image: url(1排中上-4.ee30b40….png) 10 stretch; border-image: url(../../img/publicity/tj1_border.png) 10 stretch; justify-content: center; flex:1;}
|
.firstRow .rowCenter .tj1 .tj1_card .tj1_card_title{color: #04cfcd; font-size: 2.1vh; line-height: 1.3; text-align: center; margin-bottom: 1.3vh;}
|
.firstRow .rowCenter .tj1 .tj1_card .tj1_card_value{color: #00deff; font-size: 3.7vh; line-height: 1; text-align: center; font-weight: 700;}
|
.firstRow .rowCenter .tj1 .tj1_card_center{margin: 0 22px; position: relative;}
|
|
.firstRow .rowCenter .tj2{flex: 2.45;position: relative;}
|
.firstRow .rowCenter .tj2 .tj2_bg{position: absolute; top: 0; bottom: 0; right: 0; left: 0; margin: auto; background-image: url(../../img/publicity/tj1_bg.png); background-size: 100% 100%; background-repeat: no-repeat; background-origin: padding-box; border-width: 50px 150px; border-style: solid; -o-border-image: url(1排中下.d0cf86c….png) 50 150 stretch; border-image: url(../../img/publicity/tj2_bg.png) 50 150 stretch;}
|
.firstRow .rowCenter .tj2 .tj2_content{position: absolute; top: 0; bottom: 0; right: 0; left: 0; margin: auto; z-index: 1; padding: 1.6vw 2.32vh;}
|
.firstRow .rowCenter .tj2 .tj2_content .row{display: flex;padding-bottom: .8vw; border-bottom: 1px solid rgba(3,94,119,.4); flex: 1; overflow: hidden;}
|
.firstRow .rowCenter .tj2 .tj2_content .row2{padding-top: .8vw; border-top: 1px solid rgba(3,94,119,.4); display: flex; flex: 1; overflow: hidden;}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item{display: flex; flex-direction: column; justify-content: center; width:25vw}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_title{color: #04cfcd; font-size: 1.7vh; line-height: 1.5; margin-bottom: 1.3vh; overflow: hidden;}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap{font-size: 36px; line-height: 36px;}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap .tj2_item__icon{background-repeat: no-repeat; background-position: center; background-size: contain; width: 3.71vh; height: 3.71vh; float: left;}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap .tj2_item__icon.zdfx{background-image:url(../../img/publicity/zdfx.png)}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap .tj2_item__icon.jdfx{background-image:url(../../img/publicity/jdfx.png)}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap .tj2_item__icon.ybfx{background-image:url(../../img/publicity/ybfx.png)}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap .tj2_item__icon.dfx{background-image:url(../../img/publicity/dfx.png)}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap .tj2_item__icon.zdyh{background-image:url(../../img/publicity/zdyh.png)}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap .tj2_item__icon.ybyh{background-image:url(../../img/publicity/ybyh.png)}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap .tj2_item__icon.wzgyh{background-image:url(../../img/publicity/wzgyh.png)}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap .tj2_item__icon.yhzgl{background-image:url(../../img/publicity/yhzgl.png)}
|
.firstRow .rowCenter .tj2 .tj2_content .tj2_item .tj2_item_value_wrap .tj2_item__value{color: #00deff;font-size: 3.1vh;line-height: 3.71vh; margin-left: 10px; float: left; position: relative; top: -2px; font-weight: 600;}
|
|
|
.firstRow .rowRight{height:35.13vh;flex:1; }
|
.firstRow .rowRight .gs_card{height:calc(100% - 1.86vh - 20px); background-image: url(../../img/publicity/tj1_bg.png); background-size: 100% 100%; background-repeat: no-repeat; background-origin: padding-box; border-width: 10px; border-style: solid; -o-border-image: url(../../img/publicity/rowRight_border.png) 10 stretch; border-image: url(../../img/publicity/rowRight_border.png) 10 stretch; padding:.93vh; display:flex; overflow:hidden}
|
.firstRow .rowRight .gs_card .swiper_left{flex:1; border-right:1px solid rgba(3,94,119,.4);padding-right:.93vh}
|
.firstRow .rowRight .gs_card .swiper_right{flex:1; border-left:1px solid rgba(3,94,119,.4);padding-left:.93vh}
|
.firstRow .rowRight .gs_card .two_title{background-image: url(../../img/publicity/second_title_pre.png); background-repeat: no-repeat; background-position: left center; background-size: contain; padding-left: 1.67vw; height: 2.46vh; line-height: 1; font-size: 2.46vh; color: #04cfcd; margin-bottom: 1.3vh;}
|
|
|
.gongshi{overflow:hidden; width:200px;}
|
.gongshi .swiper-wrapper{align-items: center;height:30vh}
|
|
.gongshi .swiper-wrapper .swiper-slide{ background: 0 0; padding: 0; box-sizing: border-box; text-align: center;}
|
.gongshi .swiper-wrapper .swiper-slide h3{font-weight: normal; margin-top: 25px; font-size: 18px; color: #252b3a; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
|
.gongshi .swiper-wrapper .swiper-slide p{margin-top: 10px; font-size: 14px; color: #a0a2a8; text-align: center; line-height: 22px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
|
|
.gongshi .swiper-pagination-bullets{bottom: 50px;}
|
.gongshi .swiper-pagination-bullet{position: relative; margin: 0 5px; width: 24px; height: 4px; border-radius: 100px; opacity: 1; background: 0 0;}
|
.gongshi .swiper-pagination-bullet:before{content: ''; display: inline-block; position: absolute; width: 24px!important; height: 4px; opacity: 1; left: 0; border-radius: 100px; background: #dfe1f1; vertical-align: middle; transition: opacity .8s,background-color .8s;}
|
.gongshi .swiper-pagination-bullet-active{opacity: 1;}
|
.gongshi .swiper-pagination-bullet-active:before{width: 24px!important; opacity: 1; border-radius: 100px; transform: scale(1.2); background: #fa6f66;}
|
.inner-content{color:#00deff; text-align:left; line-height:4vh; padding:1vh}
|
.inner-content span{ color:#c7fffe}
|
|
|
|
.endRow{width:100%; display:flex;}
|
.endRow .two_title{background-image: url(../../img/publicity/second_title_pre.png); background-repeat: no-repeat; background-position: left center; background-size: contain; padding-left: 1.67vw; height: 2.46vh; line-height: 1; font-size: 2.46vh; color: #04cfcd; margin-bottom: 1.3vh;}
|
.endRow .endRow_left{flex:1; margin-right:1.25vw;display: flex; flex-direction: column; height:45vh;width:50%}
|
.endRow .endRow_right{flex:1; display: flex; flex-direction: column;width:50%}
|
.endRow .chart_card{height: calc(100% - 40px); background-image: url(../../img/publicity/tj1_bg.png); background-size: 100% 100%; background-repeat: no-repeat; background-origin: padding-box; border-width: 20px; border-style: solid; -o-border-image: url(../../img/publicity/count_border_bg.png) 20 stretch; border-image: url(../../img/publicity/count_border_bg.png) 20 stretch; flex:1;overflow: hidden;}
|