/**
 * 作者：王成
 * 创建日期：2021年12月15日
 * 操作系统：MAC
 * 描述：地图页面的通用样式
 */
/* 通用样式 */
html,
body {
	height: 100%;
	padding: 0px;
	width: 100%;
}

/* body样式 */
body {
	margin: 0px;
	background: url(../img/map/map_back.jpg) no-repeat left top;
	background-size: 100% 100%;
}

/* 地图界面的按钮容器样式 */
.wc-map-div-btn {
	position: relative;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	background-color: rgba(0, 0, 0, 0.55);
	padding: 4px;
	border-width: 0px;
	margin-top: 4px;
}

/* 按钮内图标样式 */
.wc-map-div-btn span {
	font-size: 30px;
	color: #ffffff;
	background: linear-gradient(to bottom, rgb(255, 255, 0) 50%, rgb(76, 245, 255) 50%);
	-webkit-background-clip: text;
	color: transparent;
}

/* 本页独立导航栏样式 */
.cr-bar {
	background-color: rgba(255, 255, 255, 0) !important;
	border: solid 0px rgb(255, 255, 255) !important;
	box-shadow: none !important;
}

/* 查询输入框样式 */
.mui-search input {
	background-color: rgba(174, 186, 208, 0.85) !important;
	border: solid 1px rgba(170, 176, 198, 0.85) !important;
	color: rgb(33, 47, 100) !important;
	font-size: 13px !important;
	border-radius: 22px !important;
}

/* 输入框提示文字颜色 */
.mui-search .mui-placeholder {
	color: rgba(255, 255, 255, 0.65) !important;
	font-size: 12px;
}

/* 弹框的高度 */
.mui-popover {
	height: 300px;
}

/* 图层控制器 文字样式 */
.mui-checkbox label {
	font-size: 16px;
}

/* 图层控制器 图标样式 */
.mui-checkbox label span {
	font-size: 20px;
	margin-right: 5px;
}

/* 图层控制器 文字样式 */
.mui-radio label {
	font-size: 16px;
}

/* 图层控制器 图标样式 */
.mui-radio label span {
	font-size: 20px;
	margin-right: 5px;
}

/* 引入外部字体 */
@font-face {
	font-family: alFont;
	src: url('../fonts/iconfont.ttf');
}

/* 修改选中前图标 */
.mui-checkbox input[type=checkbox]:before {
	font-family: alFont;
	content: '\e63a';
}

/* 修改选中后图标 */
.mui-checkbox input[type=checkbox]:checked:before {
	font-family: alFont;
	content: '\e639';
}

/* 修改选中前图标 */
.mui-radio input[type=radio]:before {
	font-family: alFont;
	content: '\e63a';
}

/* 修改选中后图标 */
.mui-radio input[type=radio]:checked:before {
	font-family: alFont;
	content: '\e639';
}

/* 复选框上下中间对齐 */
.mui-checkbox input[type='checkbox'] {
	top: 7px;
}

/* 图层控制图层名称文字颜色 */
.mui-checkbox label {
	font-size: 14px !important;
	color: rgb(69, 69, 69);
}

/* 复选框上下中间对齐 */
.mui-radio input[type='radio'] {
	top: 7px;
}

/* 图层控制图层名称文字颜色 */
.mui-radio label {
	font-size: 14px !important;
	color: rgb(0, 69, 0);
}

/* 3D地图中定位图层的按钮样式 */
.cr-layer-control-location {
	display: inline-block;
	position: absolute;
	height: 26px;
	width: 26px;
	line-height: 26px;
	top: 6px;
	right: 50px;
	text-align: center;
	font-size: 18px !important;
	color: #ffffff;
	background: linear-gradient(to bottom, rgb(57, 124, 229) 50%, rgb(69, 69, 69) 50%);
	-webkit-background-clip: text;
	color: transparent;
}

/* 修改图层控制标题 */
h5 {
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	font-size: 15px;
	color: black;
	font-weight: bold;
}

/* 底部弹出框的标题样式 */
.mui-popover header {
	height: 40px;
	line-height: 40px;
	background-color: rgb(37, 109, 187) !important;
	font-size: 14px;
	font-weight: bold;
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
	text-align: center;
	color: rgb(255, 255, 255) !important;
}

/* 坐标查询弹框 */
.wc-popover-coord-input {
	height: 180px !important;
	background-color: rgb(230, 230, 230) !important;
	border-top-right-radius: 10px !important;
	border-top-left-radius: 10px !important;
}

/* 案件查询底部弹出框 */
.wc-popover-case {
	height: 260px !important;
	background-color: rgb(230, 230, 230) !important;
	border-top-right-radius: 10px !important;
	border-top-left-radius: 10px !important;
}

/* 行样式 */
.wc-row {
	display: flex;
	flex-direction: row;
	align-items: center;
	margin-top: 10px;
	border-radius: 5px;
	margin-left: 10px;
	margin-right: 10px;
	width: calc(100% - 20px);
}

/* 输入行样式 */
.wc-input-row {
	border: solid 1px rgba(41, 90, 254, 0.6) !important;
	height: 30px !important;
}

/* 输入行图标样式 */
.wc-input-row span:nth-child(1) {
	color: rgb(255, 255, 255);
	font-size: 14px;
	margin-left: 10px;
	margin-right: 5px;
	background: linear-gradient(to bottom, rgb(0, 0, 244) 50%, rgb(205, 197, 0) 50%);
	-webkit-background-clip: text;
	color: transparent;
}

/* 输入行文字标签样式 */
.wc-input-row span:nth-child(2) {
	color: rgb(41, 90, 254);
	font-size: 14px;
	margin-right: 10px;
}

/* 输入行输入容器样式 */
.wc-input-row .mui-input-row {
	width: calc(100% - 100px) !important;
	margin: 0px !important;
}

/* 输入行输入框样式 */
.wc-input-row .mui-input-row .mui-input {
	margin: 0px !important;
	background-color: rgba(255, 255, 255, 0) !important;
	border: solid 1px rgba(255, 255, 255, 0.0) !important;
	font-size: 14px !important;
}

/* 输入框提示文字样式 */
.wc-input-row .mui-input-row .mui-input::placeholder{
	font-size: 14px;
}

/**
 * 
 */

/* 地图窗口样式 */
.map3d {
	position: relative;
	background-color: rgb(128, 128, 128);
	height: calc(100vh - 0px);
	width: calc(100vw - 0px);
}

/* 底部信息栏样式 */
.divButtomInfo {
	position: absolute;
	bottom: 10px;
	left: 10px;
	width: 160px;
	height: 110px;
	background-color: rgba(0, 0, 0, 0.45);
	border-radius: 5px;
	font-size: 12px;
	color: rgba(255, 255, 255, 1.0);
	display: flex;
	flex-direction: column;
	padding: 5px;
}

/* 3D 地图底部展示信息内部div样式 */
.divButtomInfo>div {
	height: 25px;
	line-height: 25px;
}

/* 3D 地图底部展示信息内部div 内部标签标题样式 */
.divButtomInfo>div>span:nth-child(1) {
	display: inline-block;
	width: 45px;
	text-align: right;
	margin-right: 5px;
	font-family: 'TTTGB-Medium';
}

/* 3D 地图底部展示信息内部div 内部标签值样式 */
.divButtomInfo>div>span:nth-child(2) {
	color: yellowgreen;
	font-family: 'TTTGB-Medium';
}

/* 三维地图 气泡窗口 容器样式 */
.cr-popup {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 110px;
	height: 50px;
	border: 0px solid rgb(255, 0, 0);
	position: absolute;
	background-color: rgba(174, 186, 208, 0.65);
	border-radius: 10px;
	top: -300px;
	left: -500px;
}

/* 三维地图 气泡窗口 小箭头样式 */
.cr-popup .arrow {
	position: absolute;
	width: 30px;
	height: 30px;
	bottom: -30px;
	left: 45px;
}

/* 三维地图 气泡窗口 小箭头样式 */
.cr-popup .arrow * {
	display: block;
	border-width: 10px;
	position: absolute;
	border-style: dashed dashed dashed dashed;
	font-size: 0;
	line-height: 0;
}

/* 三维地图 气泡窗口 小箭头样式 */
.cr-popup .arrow em {
	border-color: rgba(174, 186, 208, 0.65) transparent transparent transparent;
}

/* 案件查询按钮样式 */
.wc-btn-case-query {
	position: relative;
	border-radius: 3px;
	margin-left: 3px;
	margin-right: 3px;
	height: 34px !important;
	background-color: rgb(115, 140, 238) !important;
	border: solid 0px rgb(255, 255, 255) !important;
}

/* 三维地图 气泡提示信息窗口 容器样式 */
.cr-tooltip-popup {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 180px;
	height: 40px;
	border: 0px solid rgb(255, 0, 0);
	position: absolute;
	background-color: rgba(174, 186, 208, 0.65);
	border-radius: 20px;
	top: 200px;
	left: 300px;
}

/* 三维地图 气泡提示信息窗口 标题样式 */
.cr-tooltip-popup .title {
	color: rgb(255, 255, 255);
	font-size: 10px;
	font-family: 'TTTGB-Medium';
}

/* 三维地图 气泡提示信息窗口 上标样式 */
.cr-tooltip-popup>div>sup {
	color: rgb(255, 255, 0);
	font-size: 5px !important;
	top: -6px;
	font-family: 'TTTGB-Medium';
}

/* 三维地图 气泡提示信息窗口 小箭头样式 */
.cr-tooltip-popup .arrow {
	position: absolute;
	width: 30px;
	height: 30px;
	bottom: -30px;
	left: calc(calc(180px - 20px) / 2);
	/* 这很重要 主要是为了计算小箭头的位置 */
}

/* 三维地图 气泡提示信息窗口 竖线样式 */
.cr-tooltip-popup .line {
	position: absolute;
	width: 30px;
	height: 50px;
	background-color: rgba(0, 0, 0, 0.0);
	bottom: -60px;
	border-right: dashed 2px rgb(255, 255, 0);
	left: calc(calc(180px) / 2 - 29px);
}

/* 三维地图 气泡提示信息窗口 底部小圆圈样式 */
.cr-tooltip-popup .circle {
	position: absolute;
	width: 10px;
	height: 10px;
	background-color: rgba(0, 0, 0, 0.0);
	bottom: calc(-60px - 10px);
	left: calc(calc(180px - 10px) / 2);
	border: solid 2px rgb(255, 255, 0);
	border-radius: 10px;
}

/* 三维地图 气泡提示信息窗口 小箭头样式 */
.cr-tooltip-popup .arrow * {
	display: block;
	border-width: 10px;
	position: absolute;
	border-style: dashed dashed dashed dashed;
	font-size: 0;
	line-height: 0;
}

/* 三维地图 气泡提示信息窗口 小箭头样式 */
.cr-tooltip-popup .arrow em {
	border-color: rgba(174, 186, 208, 0.65) transparent transparent transparent;
}


/**
 * 三维地图标签样式
 */


/* 三维标签 容器样式 */
.jt-tooltip-popup {
	position: absolute;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 120px;
	height: 90px;
	top: 200px;
	left: 300px;
}

/* 三维标签 容器样式 */
.jt-tooltip-popup>div:nth-child(1) {
	border: 0px solid rgb(255, 0, 0);
	width: 100%;
	height: 30px;
	background-image: linear-gradient(to right, rgba(171, 108, 190, 0.65), rgba(138, 227, 196, 0.65));
	border-radius: 5px;
	border: dashed 1px rgb(255, 255, 0);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	line-height: 12px;
}

/* 三维标签 容器内部标题样式 */
.jt-tooltip-popup .title {
	color: rgb(10, 10, 10);
	font-size: 10px;
	font-family: 'TTTGB-Medium';
	text-decoration: underline;
}

/* 三维标签 容器内部状态样式 */
.jt-tooltip-popup .state {
	color: rgb(255, 255, 255);
	font-size: 10px;
	font-family: 'TTTGB-Medium';
}

/* 三维标签 容器内部面积样式 */
.jt-tooltip-popup .area {
	color: rgb(120, 55, 190);
	font-size: 10px;
	font-family: 'TTTGB-Medium';
	margin-left: 5px;
}


/* 三维标签 竖线样式 */
.jt-tooltip-popup>div:nth-child(2) {
	width: 1px;
	height: 50px;
	background-color: rgba(0, 0, 0, 0.0);
	border-right: dashed 2px rgb(255, 255, 0);
}

/* 三维标签 底部小圆圈样式 */
.jt-tooltip-popup>div:nth-child(3) {
	width: 10px;
	height: 10px;
	background-color: rgba(0, 0, 0, 0.0);
	bottom: calc(-50px - 10px);
	left: calc(calc(180px - 10px) / 2);
	border: solid 2px rgb(255, 255, 0);
	border-radius: 10px;
}