body,html{
    width: 100%;
    height: 100%;
    background: #fff;
}
.nowrap{
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.inner{
    width: 1200px;
    margin: 0 auto;
}
.page-of-index form{
    height: 100%;
}
.index-bg{
    width: 100%;
    height: 100%;
    background: url(../public/static/images/index/new/index-bg.jpg) no-repeat;
	background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items:center;
}
/* banner */

.banner-container{
    display: flex;
    justify-content: space-between;
    align-items:center;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    height: calc(100% - 84px);
}
.banner-container .welcome-blue-map{
    font-size: 64px;
    color: #fff;
    /* height: calc(100% - 497px); */
}
.banner-container .welcome-blue-map h2{
    font-size: 64px;
    margin-bottom: 40px;
}
.banner-container .welcome-blue-map h2 span{
    font-weight: bold;
    display: inline-block;
}
.banner-container .welcome-blue-map a{
    font-size: 22px;
    color: #fff;
    padding: 22px 66px;
    background: #ef4136;
}
/* banner-研究/记录列表 */
.banner-container .report-list{
    /* height: calc(100% - 104px); */
}
.banner-container .report-list a{
    padding: 28px 16px 21px 22px;
    background: #fff;
    color: #5d5f77;
    margin-bottom: 18px;
    display: block;
	height: 131px;
}
.banner-container .report-list a:last-of-type{
    margin-bottom: -18px;
}
.banner-container .report-list a .report-cover{
    width: 118px;
    height: 118px;
    position: relative;
}
.banner-container .report-list a img{
    max-width: 118px;
    max-height: 118px;
    position: absolute;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%); /* IE 9 */
    -webkit-transform: translate(-50%, -50%); /* Safari and Chrome */
    -o-transform: translate(-50%, -50%); /* Opera */
    -moz-transform: translate(-50%, -50%); /* Firefox */
    top: 50%;
    left: 50%;
}
.banner-container .report-list a .report-content{
    width: 330px;
    margin-left: 24px;
}
.banner-container .report-list a .report-content h3{
    font-size: 20px;
    font-weight: bold;
    line-height: 32px;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
	text-overflow: initial;
	white-space: initial;
	height: 96px;
}
.banner-container .report-list a .report-content p{
    font-size: 14px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    line-height: 30px;
}
.banner-container .report-list a .report-content span{
    font-style: italic;
    text-align: right;
    display: block;
    margin-top: 15px;
    color: #0a5794;
    cursor: pointer;
}
.banner-container .report-list a:hover{
    background: #ef4136;
    color: #fff;
}
.banner-container .report-list a:hover span{
    color: #fff;
}

/* 蔚蓝地图数据库 */
.blue-map-container{
    position: relative;
}
.blue-map-container ul{
    margin: 59px 0 51px;
}
.blue-map-container ul li{
    float: left;
    width: calc(50% - 40px);
    display: flex;
    align-items: center;
    padding: 52px 0;
    color: #fff;
}
.blue-map-container ul li a{
    display: block;
    width: 100%;
}
.blue-map-container ul li h2{
    font-size: 28px;
    line-height: 48px;
}
.blue-map-container ul li p{
    font-size: 18px;
    line-height: 38px;
}
.blue-map-container ul li:nth-child(odd){
    padding-left: 40px;
    text-align: left;
}
.blue-map-container ul li:nth-child(even){
    padding-right: 40px;
    text-align: right;
}
.blue-map-container ul li:nth-child(3) p{
    font-size: 17px;
    letter-spacing: 0.5px;
}
.blue-map-container .bg-gray{
    background: #edf0f9;
}
.blue-map-container ul .bg-gray h2,.blue-map-container ul .bg-gray p{
    color: #011932;
}
.blue-map-container .bg-blue{
    background: #011932;
}
.blue-map-container ul .bg-blue h2,.blue-map-container ul .bg-blue p{
    color: #fff;
}

.blue-map-container li:hover{
    background: #ef4136;
}
.blue-map-container li:hover h2,.blue-map-container li:hover p{
    color: #fff;
}

.pos-center{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%); /* IE 9 */
    -webkit-transform: translate(-50%, -50%); /* Safari and Chrome */
    -o-transform: translate(-50%, -50%); /* Opera */
    -moz-transform: translate(-50%, -50%); /* Firefox */
    border-radius: 50%;
}
.data-base-shadow{
    width: 470px;
    height: 470px;
    background: rgba(255,255,255, .3);
    border: 1px dashed #b2c6f6;
}
.data-base-shadow .big-circle{
    width: 392px;
    height: 392px;
    background: #fff;
}
.data-base-shadow .small-circle{
    width: 294px;
    height: 294px;
    background: #fff;
    box-shadow: 0 0 30px 10px #f5fcff;
}
.data-base-shadow .three-border{
    width: 470px;
    height: 470px;
}
.data-base-shadow .three-border strong{
    width: 100%;
    height: 1px;
    border-radius: 0;
    border-top: 1px dashed rgba(178,198,246, .5);
}
.data-base-shadow .three-border strong:nth-child(2){
    transform:rotate(60deg);
    -ms-transform: rotate(60deg); /* IE 9 */
    -webkit-transform: rotate(60deg); /* Safari and Chrome */
    -o-transform: rotate(60deg); /* Opera */
    -moz-transform: rotate(60deg); /* Firefox */
    position: absolute;
    left: 0;
    top: 233px;
}
.data-base-shadow .three-border strong:nth-child(3){
    transform:rotate(-60deg);
    -ms-transform: rotate(-60deg); /* IE 9 */
    -webkit-transform: rotate(-60deg); /* Safari and Chrome */
    -o-transform: rotate(-60deg); /* Opera */
    -moz-transform: rotate(-60deg); /* Firefox */
    position: absolute;
    left: 0;
    top: 233px;
}
/* icon */
.data-base-shadow .icon-container{
    width: 392px;
    height: 392px;
}
.data-base-shadow .icon-container a{
    width: 115px;
    height: 115px;
    position: absolute;
}
.data-base-shadow .icon-container a:nth-child(1){
     background: url(../public/static/images/index/new/icon-index-xxgk.png);
     top: -26px;
     left: 44px;
 }
.data-base-shadow .icon-container a:nth-child(2){
    background: url(../public/static/images/index/new/icon-index-gyl.png);
    top: -26px;
    right: 44px;
}
.data-base-shadow .icon-container a:nth-child(3){
    background: url(../public/static/images/index/new/icon-index-lsjy.png);
    top: 50%;
    right: -55px;
    margin-top: -55px;
}
.data-base-shadow .icon-container a:nth-child(4){
    background: url(../public/static/images/index/new/icon-index-gzcy.png);
    bottom: -40px;
    right: 40px;
}
.data-base-shadow .icon-container a:nth-child(5){
    background: url(../public/static/images/index/new/icon-index-t.png);
    bottom: -40px;
    left: 40px;
}
.data-base-shadow .icon-container a:nth-child(6){
    background: url(../public/static/images/index/new/icon-index-hjzl.png);
    top: 50%;
    left: -55px;
    margin-top: -55px;
}
.data-base-shadow .data-base-content{
    box-shadow: none;
    background: none;
    color: #313131;
    display: flex;
    align-items: center;
}
.data-base-shadow .data-base-content .data-base-center{
    text-align: center;
    width: 100%;
}
.data-base-shadow .data-base-content h2{
    font-size: 28px;
}
.data-base-shadow .data-base-content h2 span{
    font-weight: bold;
    display: inline-block;
}
.data-base-shadow .data-base-content p{
    font-size: 17px;
    line-height: 40px;
}

/* 数据应用 */
.data-app{
    width: 100%;
    padding: 110px 0 80px;
    background: #011932;
    text-align: center;
}
.data-app h2{
    font-size: 40px;
    color: #fff;
    font-weight: bold;
}
.data-app .title{
    font-size: 26px;
    color: #fff;
    margin-top: 34px;
    margin-bottom: 86px;
}
.data-app .app-list a,.data-app .map-data a{
    width: 588px;
    background: #fff;
    display: flex;
    align-items: center;
    text-align: left;
    margin-bottom: 22px;
}
.data-app .app-list a:last-of-type{
    margin-bottom: 0;
}
.data-app .app-list a img{
    width: 140px;
    height: 160px;
    margin-right: 34px;
}
.data-app .app-list a h3,.data-app .map-data a h3{
    font-size: 28px;
    color: #011932;
    line-height: 28px;
}
.data-app .app-list a p,.data-app .map-data a p{
    color: #676f79;
    margin-top: 20px;
}
.data-app .app-list a:nth-child(1):hover{
    background: #437ede;
}
.data-app .app-list a:nth-child(2):hover{
    background: #ffb55c;
}
.data-app .app-list a:nth-child(3):hover{
    background: #437ede;
}
.data-app .app-list a:hover h3,.data-app .app-list a:hover p,
.data-app .map-data a:hover h3, .data-app .map-data a:hover p{
    color: #fff;
}

.data-app .map-data{
    position: relative;
}
.data-app .map-data .video-url{
    width: 590px;
    height: 342px;
    margin-bottom: 22px;
    display: block;
    object-fit: fill;
}
.data-app .map-data img{
    width: 140px;
    height: 160px;
    margin-right: 34px;
}
.data-app .map-data a{
    height: 160px;
    width: 590px;
    margin-bottom: 0;
}
.data-app .map-data a:hover{
    background: #03b675;
}
.layout{
    max-width: 1200px;
}
.data-app .map-data .more-video{
    width: 25px;
    height: 52px;
    background: #437EDE;
    border-radius: 0 8px 8px 0;
    position: absolute;
    right: -25px;
    top: 0;
    font-size: 14px;
    line-height: 16px;
    font-weight: 500;
    color: #E0F1EB;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.data-app .map-data .more-video .icon-arrow-btm{
    display: block;
    width: 10px;
    height: 11px;
    background: url(/public/static/images/index/new/icon-arrow-btm.png) no-repeat;
    margin-top: 2px;
    background-size: 100%;
}
.data-app .map-data .more-video:hover{
    background: #437EDE;
}