.login-wrap{
	width: 100%;
	height: 350px;
	background: url(../../img/loginBg.png);
	background-size: cover;
}
.login-wrap .center{
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
}
.login-box{
	width: 400px;
	/*width: 470px;*/
	/*height: 444px;*/
	padding: 0 33px;
	margin-right: 18px;
	background: rgba(255,255,255,0.8);
}
.login-box .title{
	line-height: 1;
	font-size: 20px;
	font-size: var(--titleSize);
	color: #333;
	padding: 30px 0 20px;
	text-align: center;
	letter-spacing: 1px;
}
.login-box .login-form{
	width: 100%;
	height: 40px;
	/*background-color: #fff;*/
	border-radius: 5px;
	margin-bottom: 20px;
}
.login-box .login-form .login-input{width: 100%;height: 100%;padding-left: 23px;font-size: 16px;font-size: var(--navSize);color: #333;}
.login-box button{
	width: 100%;
	height: 40px;
	background-color: #00a0e9;
	background-color: var(--theme);
	color: #fff;
	border-radius: 5px;
	font-size: 16px;
	font-size: var(--navSize);
	letter-spacing: 20px;
	cursor: pointer;
}
.login-box .login-bottom{
	margin-top: 15px;
	line-height: 1;
	font-size: 14px;
	font-size: var(--hrefSize);
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	padding-bottom: 20px;
}
.login-box .login-bottom span{line-height: 1;cursor: pointer;user-select: none;}

.right-cont .inContent{width: 100%;height: calc(100% - 86px);margin-top:11px;}


.indexCenter{
	flex-direction: column;width: 1200px;background: #fff;padding: 16px;box-sizing: border-box;
}
.first-wrap{
	width: 100%;
	height: auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.first-wrap .left-info{
	width: 515px;
	height: 350px;
	position: relative;
}
.first-wrap .left-info img{
	width: 100%;
	height: 100%;
}
.first-wrap .left-info .indexTitle{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 52px;
	background-color: rgba(255,255,255,0.8);
	text-align: center;
	line-height: 52px;
	color: #00a0e9;
	color: var(--theme);
	font-family: '微软雅黑';
	font-family: var(--fontFamily);
	letter-spacing: 2px;
	font-weight: bold;
	font-size: 16px;
	font-size: var(--navSize);
}

.first-wrap .right-info{
	flex: 1;
	width: calc(100% - 531px);
	margin-left: 16px;
}
.first-wrap .right-info .tabbar-list{
	width: 100%;
	height: 47px;
	background: #f4fcff;
	display: flex;
}
.first-wrap .right-info .tabbar-item{
	font-size: 18px;
	color: #808080;
	height: 47px;
	line-height: 47px;
	text-align: center;
	flex: 1;
	cursor: pointer;
	user-select: none;
	border-radius: 4px;
}
.first-wrap .right-info .tabbar-item.active{
	background: #00a0e9;
	color: #ffffff;
	border-radius: 4px;
}
.first-wrap .right-info .getMore{
	width: 100%;
	height: 40px;
	line-height: 40px;
	text-align: center;
	border-radius: 4px;
	background: #f4fcff;
	font-size: 16px;
	letter-spacing: 4px;
	color: #00a0e9;
	cursor: pointer;
	user-select: none;
}
.first-wrap .right-info .data-list{
	width: 100%;
	height: 303px;
	overflow: hidden;
	display: none;
}
.first-wrap .right-info .data-list.active{
	display: block;
}
.first-wrap .right-info .data-item{
	width: 100%;
	height: 52px;
	line-height: 52px;
	border-bottom: dashed 1px #e5e5e5;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	cursor: pointer;
}
.first-wrap .right-info .data-item div:hover{
	color: #00a0e9;
}
.first-wrap .right-info .data-item .data-label{
	font-size: 14px;
	letter-spacing: 1px;
	color: #333333;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	flex: 1;
}
.first-wrap .right-info .data-item .data-date{
	font-size: 14px;
	letter-spacing: 1px;
	color: #333333;
	margin-left: 12px;
}
.first-wrap .right-info .data-item:nth-child(5){border-bottom: 0}

.waterServer{
	width: 100%;
	height: auto;
	margin-top: 48px;
}
.waterServer .title{
	width: 100%;
	height: 1px;
	background: #cccccc;
	position: relative;
}
.waterServer .title .leftTitle{
	background: #fff;
	padding-right: 11px;
	position: absolute;
	left: 0;
	top: -9px;
	font-size: 18px;
	font-weight: bold;
	line-height: 1;
	color: #333333;
}
.waterServer .title .leftTitle img{
	width: 21px;
	height: 18px;
	margin-right: 12px;
}
.waterServer .title .rightTitle{
	position: absolute;
	right: 0;
	top: -13.5px;
	background: #fff;
	padding-left: 14px;
}
.waterServer .title .mareBtn{
	width: 50px;
	height: 27px;
	line-height: 27px;
	text-align: center;
	box-sizing: border-box;
	border-radius: 6px;
	border: solid 1px #00a0e9;
	font-size: 14px;
	color: #00a0e9;
	cursor: pointer;
	user-select: none;
}
.waterServer .server-list{
	display: flex;
	flex-wrap: wrap;
	margin-top: 30px;
}
.waterServer .server-list .server-item{
	position: relative;
	width: 279px;
	height: 174px;
	cursor: pointer;
}
.waterServer .server-list .server-item+.server-item{margin-left: 17px}
.waterServer .server-list .server-item img{
	width: 100%;
	height: 100%;
}
.waterServer .server-list .server-item .indexTitle{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 52px;
	background-color: rgba(255,255,255,0.8);
	text-align: center;
	line-height: 52px;
	color: #00a0e9;
	color: var(--theme);
	font-family: '微软雅黑';
	font-family: var(--fontFamily);
	letter-spacing: 2px;
	font-weight: bold;
	font-size: 16px;
	font-size: var(--navSize);
}

.boat-wrap{
	width: 100%;
	height: auto;
	display: flex;
	flex-wrap: wrap;
	margin-top: 23px;
}
.boat-wrap .boat-item{
	width: calc(50% - 16px);
	height: auto;
	flex: 1;
}
.boat-wrap .boat-item:last-child{
	margin-left: 32px;
}
.boat-wrap .boat-item .title{
	width: 100%;
	height: auto;
	border-bottom:solid 1px #cccccc;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.boat-wrap .boat-item .t-list{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	flex: 1;
}
.boat-wrap .boat-item .title .t-item{
	font-size: 18px;
	line-height: 1;
	color: #808080;
	padding-bottom: 16px;
	padding-top: 16px;
	border-bottom: 4px solid transparent;
	margin-bottom: -2px;
	cursor: pointer;
	user-select: none;
}
.boat-wrap .boat-item .title .t-item+.t-item{margin-left: 33px;}
.boat-wrap .boat-item .title .t-item.active{
	color: #333333;
	border-bottom-color: #00a0e9;
}
.boat-wrap .boat-item .title .moreInfo{
	color: #00a0e9;
	font-size: 14px;
	font-size: var(--hrefSize);
	cursor: pointer;
	user-select: none;
}
.boat-wrap .boat-item .title .moreInfo i{margin-left: 4px;font-size: 12px}
.boat-wrap .boat-item .content{
	width: 100%;
	height: auto;
}
.boat-wrap .boat-item .content .c-item{
	height: 47px;
	box-sizing: border-box;
	width: 100%;
	line-height: 47px;
}
.boat-wrap .boat-item .content .c-item div:hover{
	color: #00a0e9;
}
.boat-wrap .boat-item .content .c-item{
	height: 47px;
	box-sizing: border-box;
	width: 100%;
	line-height: 47px;
	display: flex;
	flex-wrap: wrap;
	cursor: pointer;
	border-bottom: 1px dashed #e5e5e5;
}
.boat-wrap .boat-item .content .c-item:last-child{border-bottom: 0}
.boat-wrap .boat-item .content .c-item .c-label{
	font-size: 14px;
	color: #333333;
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.boat-wrap .boat-item .content .c-item .c-date{
	font-size: 14px;
	color: #333333;
	margin-left: 12px;
}
.boat-wrap .boat-item .content .c-item.active .c-label{
	color: #00a0e9;
}

.boat-wrap .boat-item .content .th-item{
	font-weight: bold;
	padding-top: 6px;
}
.boat-wrap .boat-item .content .tr-item{
	display: flex;
	flex-wrap: wrap;
	height: 47px;
	box-sizing: border-box;
	line-height: 47px;
	border-bottom: 1px dashed #e5e5e5;
}
.boat-wrap .boat-item .content .tr-item:last-child{border-bottom: 0}
.boat-wrap .boat-item .content .tr-item .td-item{
	flex: 1;
	text-align: center;
}
.boat-wrap .boat-item .content .tr-item .td-item:first-child{
	text-align: left;
}

.ecode-wrap{
	width: 120px;
	height: 200px;
	background: #f9f9f9;
	position: fixed;
	right: 30px;
	bottom: 60px;
}
.ecode-wrap hr{
	margin: 0 auto;
	width: 90px;
}
.ecode-wrap .ecode-box{
	height: 100px;
	width: 100px;
	position: absolute;
	right: 122px;
	top: 0;
	box-sizing: border-box;
	padding: 5px;
	background: #f9f9f9;
	display: none;
}
.ecode-wrap .ecode-box img{
	width: 100%;
	height: 100%;
}

.ecode-wrap .ecode-box2{
	height: 100px;
	width: 100px;
	position: absolute;
	right: 122px;
	top: 0;
	box-sizing: border-box;
	padding: 5px;
	background: #f9f9f9;
	display: none;
}
.ecode-wrap .ecode-box2 img{
	width: 100%;
	height: 100%;
}

.ecode-wrap .ecode-item{
	width: 100%;
	height: calc(50% - 0.5px);
	margin: 0 auto;
	font-size: 14px;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	cursor: pointer;
}
.ecode-wrap .ecode-item img{margin-bottom: 13px}
.ecode-wrap .ecode-item div{
	white-space: nowrap;
	line-height: 1.5;
}
.ecode-wrap .ecode-item2{border-bottom: 0}

.ecode-wrap .ecode-item2{
	width: 100%;
	height: calc(50% - 0.5px);
	margin: 0 auto;
	font-size: 14px;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	cursor: pointer;
}
.ecode-wrap .ecode-item2 img{margin-bottom: 13px}
.ecode-wrap .ecode-item2 div{
	white-space: nowrap;
	line-height: 1.5;
}

.indexContItem{width: 1590px;background-color: #fff;background-color: var(--bgColor);padding: 0 32px;margin-bottom: 28px;}
@media screen and (max-width: 1600px) {
	.indexContItem{width: 1390px;}
}
@media screen and (max-width: 1400px) {
	.indexContItem{width: 1200px;}
}
/* 助航信息 */
.navigateInfo{height: 441px;}
/* 助航信息 */
.navigateInfo .inContent{display: flex;flex-wrap: wrap;align-items: center;}
.navigateInfo .weather{
	width: 634px;
	height: 293px;
	color: #fff;
	margin-right: 35px;
	/* 添加时删除 */

}
.navigateInfo .navInfoWrap{flex: 1;width: calc(100% - 669px);}
.navInfoWrap .navInfo-item{
	width: 100%;
	height: 47px;
	border-bottom: 1px dashed #e4e4e4;
	color: #333;
	font-size: 16px;
	font-size: var(--navSize);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	cursor: pointer;
	font-family: '微软雅黑';
	font-family: var(--fontFamily);
}
.navInfoWrap .navInfo-item p{flex: 1;}
.navInfoWrap .navInfo-item span{text-align: right;width: 100px;}
/* 船闸 *//* 航行 */
.boatSail{width: 1590px;height: 477px;margin-bottom: 28px;display: flex;flex-wrap: wrap;justify-content: space-between;}
@media screen and (max-width: 1600px) {
	.boatSail{width: 1390px;}
}
@media screen and (max-width: 1400px) {
	.boatSail{width: 1200px;}
}
.boatSail .boatSail-item{width: calc(50% - 14px);height: 100%;background-color: #fff;background-color: var(--bgColor);padding: 0 32px;}
/* 航行规则/船闸公告 */
.boatSail .boSaItem{
	width: 100%;
	height: 47px;
	border-bottom: 1px dashed #e4e4e4;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	font-family: '微软雅黑';
	font-family: var(--fontFamily);
	color: #333333;
	cursor: pointer;
	font-size: 16px;
	font-size: var(--navSize);
}
.boatSail .boSaItem p{flex: 1;}

/*.boatSail .boSaItem:nth-child(1) p{*/
/*	color: #00a0e9;*/
/*	color: var(--theme);*/
/*}*/

.boatSail .boSaItem span{text-align: right;width: 100px;}
/* 船闸开关时间/航行过闸调度规则 */
.inTable{font-size: 16px;font-size: var(--navSize);color: #333333;}
.inTable .inThead{font-weight: bold;}
.inTable .inTr{
	width: 100%;
	height: 47px;
	border-bottom: 1px dashed #e4e4e4;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	font-family: '微软雅黑';
	font-family: var(--fontFamily);
}
.inTable .inTd{text-align: center;width: 130px;}
.inTable .inTd:first-child{text-align: left;flex: 1;width: auto;}

/* 水上服务 */
.waterService{height: 596px;}
.waterService .inContent{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.waterService .inContent .leftContent{
	flex: 1;
	height: 455px;
	display: flex;
	flex-wrap: wrap;
	align-content: space-between;
	justify-content: space-between;
	margin-right: 31px;
}
.waterService .inContent .leftContent .leftItem{
	width: calc(50% - 16px);
	height: 210px;
	position: relative;
}
.waterService .inContent .leftContent .leftItem>img{width: 100%;height: 100%;}
.waterService .inContent .rightContent{width: 487px;height: 455px;position: relative;}
.waterService .inContent .rightContent>img{width: 100%;height: 100%;}
.waterService .inContent .indexTitle{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 52px;
	background-color: rgba(255,255,255,0.8);
	text-align: center;
	line-height: 52px;
	color: #00a0e9;
	color: var(--theme);
	font-family: '微软雅黑';
	font-family: var(--fontFamily);
	letter-spacing: 2px;
	font-weight: bold;
	font-size: 16px;
	font-size: var(--navSize);
}


.waterInfo{padding-top: 8px;height: 100%;box-sizing: border-box}
.waterInfo .tr-item{
	width: 100%;
	height: 40px;
	display: flex;
	flex-wrap: wrap;
}
.waterInfo .tr-item.th-item{
	/*background: #4081f7;
	color: #fff;*/
	box-sizing: border-box;
	padding-right: 17px;
	font-weight: 600;
}
.waterInfo .tr-item .td-item{
	width: 20%;
	text-align: center;
	line-height: 40px;
}
.waterInfo .water-tbody{
	height: calc(100% - 40px);
	overflow-x: hidden;
	overflow-y: scroll;
	font-size: 12px;
}

.waterInfo .water-tbody .tr-item .td-item{
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	box-sizing: border-box;
	padding: 0 5px;
}