@font-face {
	font-family: 'gusong';
	src: url('../fonts/上首古宋体.ttf');
}
body{
	padding: 0;
	margin: 0;
}
.page {
	width: 100%;
	height: 100vh;
	position: relative;
	background: #ccc;
}

/* 左侧文字弹窗 */
.left_word {
	position: absolute;
	left: 2%;
	top: 50%;
	transform: translateY(-50%);
	width: 18%;
	height: 90%;
	background: rgba(209, 214, 205, 0.8);
	padding: 20px 50px 20px 10px;
	z-index: 1000;
	display: none;
	overflow: auto;
}
.left_word .word_con h2{
	font-size: 28px;
	font-family: 'gusong';
	font-weight: normal;
	margin-bottom: 20px;
	color: rgb(51,44,12);
}
.left_word .word_con p{
	font-size: 18px;
	padding: 0;
	margin: 0;
	font-family: 'gusong';
	line-height: 2;
	color: #645929;
	text-align: left;
	word-break: break-all;
}
.left_word .kuang{
	width: 90%;
	margin: 0 auto;
	/* height: 150px; */
	border-radius: 5px;
	border: 1px solid rgb(170,181,146);
	margin-top: 30px;
}

/* 中间标签 */
.gis{
	position: absolute;
	left: 50%;
	top: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 15px 30px 15px 20px;
	background: rgb(63,116,159);
	border-radius: 5px;
	overflow: hidden;
	cursor: pointer;
	z-index: 1000;
}
.gis img{
	width: 25px;
	margin-right: 25px;
}
.tag-name{
	font-size: 20px;
	margin: 0;
	font-family: 'gusong';
	color: #faf2ce;
}

/* 右上板块 */
.right_ban{
	position: absolute;
	right: 0;
	top: -50px;
	z-index: 1000;
}
.right_ban>a{
	display: block;
	width: 50px;
}
.right_ban>a img{
	width: 100%;
}
.map_select{
	/* position: absolute; */
	right: 0;
	/* top: 10%; */
	/* height: 50%; */
	background: rgba(209, 214, 205, 0.80);
	padding: 30px 20px;
	z-index: 1000;
	overflow: auto;
	width: 274px;
	box-sizing: border-box;
	margin-bottom: 10px;
}
.map_select a{
	display: block;
	text-decoration: none;
	font-size: 16px;
	font-family: 'gusong';
	color: #645929;
	margin-bottom: 5px;
	padding-left: 30px;
	position: relative;
	color: #0078A8;
	margin-bottom: 20px;
	display: block;
	text-decoration: none;
	color: #645929;
	font-size: 20px;
	font-family: 'gusong';
	padding-left: 25px;
	position: relative;
}



.map_select a:last-child{

		margin-bottom:0;
}



.map_select a::before{
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	content: '';
	width: 20px;
	height: 20px;
	background: url(../images/map_icon_before_03.png) no-repeat;
	background-size: cover;
}
.map_select a.active::before{
	background: url(../images/map_icon_after_03.png) no-repeat;
	background-size: cover;
}

/* 右下角 */
.rtb{
	position: absolute;
	right: 15px;
	bottom: 20px;
	z-index: 1000;
}
.rtb .slide{
	padding: 15px 20px;
	background: rgba(209, 214, 205, 0.8);
	border-radius: 8px;
}
.rtb .slide .line{
	width: 250px;
	height: 4px;
	background: rgb(239,229,206);
	position: relative;
}
.rtb .slide .line .yuan{
	position: absolute;
	left: 2%;
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: rgb(132,141,112);
}

.level_select{
	background: rgba(209, 214, 205, 0.8);
	padding: 10px 20px;
	margin-top: 10px;
}
.level_select p{
	display: flex;
	align-items: center;
	margin-bottom: 10px;
	font: 12px
px
/1.5 "Helvetica Neue",Arial,Helvetica,sans-serif;
}
.level_select p span{
	display: block;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	margin-right: 15px;
}
.level_select p:nth-child(2) span{
	background: rgb(156,87,73);
}
.level_select p:nth-child(3) span{
	background: rgb(63,116,159);
}
.level_select p:nth-child(4) span{
	background: rgb(212,179,167);
}
.level_select p:nth-child(5) span{
	background: rgb(188,164,110);
}
.level_select p:nth-child(6) span{
	background: rgb(93,82,79);
}
.level_select p a{
	display: block;
	text-decoration: none;
	color: #645929;
	font-size: 20px;
	font-family: 'gusong';
	padding-left: 25px;
	position: relative;
}
.level_select p a::before{
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 15px;
	height: 15px;
	content: '';
	background: url(../images/xukuang_03.png) no-repeat;
	background-size: cover;
}
.level_select p a.active::before{
	background: url(../images/duikuang_03.png) no-repeat;
	background-size: cover;
}




::-webkit-scrollbar {
	width:6px;
}
/* 滚动槽 */
::-webkit-scrollbar-track {
	-webkit-box-shadow:inset006pxrgba(0,0,0,0.3);
	border-radius:10px;
}
/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
	border-radius:10px;
	background:rgba(0,0,0,0.1);
	-webkit-box-shadow:inset006pxrgba(0,0,0,0.5);
}
::-webkit-scrollbar-thumb:window-inactive {
	background:rgba(48, 45, 45, 0.4);
}

.tag-self{
	position: relative;
	padding-left: 35px;
	display: flex;
	align-items: center;
	justify-content: center;
	white-space: nowrap;
	padding: 12px 30px 12px 20px;
	background: rgb(63,116,159);
	border-radius: 8px;
	overflow: hidden;
	cursor: pointer;
	z-index: 1000;
	margin-left: 10px;
	margin-top: -30px;
	z-index: 1000000;
}

.tag-self::before{
	content: '';
	display: inline-block;
	width: 25px;
	height: 1px;
	padding: 8px 0;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	background-color: #d2d2d2;
	background-clip: content-box;
	margin-right: 28px;
}


.tag-point{

	display: block;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    margin-right: 15px;
}


.tag-1{
	background: rgb(156,87,73);
}

.tag-2{
	background: rgb(63,116,159);
}



.tag-3{
	background: rgb(212,179,167);
}
.tag-4{
	background: rgb(188,164,110);
}
.tag-5{
	background: rgb(93,82,79);
}

.grotto-img{
	width: 100%;
}

.left-close{
	position: absolute;
	top: 15px;
	right: 15px;
	cursor: pointer;
}

.cam{
	position: absolute;
	top: -50px;
	z-index: 1000;
	right: 74px;
}

.cam>a{
	display: block;
	width: 50px;
}
.cam>a img{
	width: 100%;
}


.tag-active{
	display: block!important;
}



.cam2{
	visibility: hidden;
	position: fixed;
	
}

.gif{
	animation: run-gif 2s steps(1,end) infinite;
	height: 200px;
	width: 200px;
	background-size: 100% 100%;
	margin-top: -30px;
	margin-left: -30px;
}
@keyframes run-gif{
	0%{
		background-image: url(../images/cam/骆驼动画0000.png);
	}
	2%{
		background-image: url(../images/cam/骆驼动画0001.png);
	}
	4%{
		background-image: url(../images/cam/骆驼动画0002.png);
	}
	6%{
		background-image: url(../images/cam/骆驼动画0003.png);
	}
	7%{
		background-image: url(../images/cam/骆驼动画0004.png);
	}
	10%{
		background-image: url(../images/cam/骆驼动画0005.png);
	}
	12%{
		background-image: url(../images/cam/骆驼动画0006.png);
	}
	14%{
		background-image: url(../images/cam/骆驼动画0007.png);
	}
	16%{
		background-image: url(../images/cam/骆驼动画0008.png);
	}
	18%{
		background-image: url(../images/cam/骆驼动画0009.png);
	}
	20%{
		background-image: url(../images/cam/骆驼动画0010.png);
	}
	22%{
		background-image: url(../images/cam/骆驼动画0011.png);
	}
	24%{
		background-image: url(../images/cam/骆驼动画0012.png);
	}
	26%{
		background-image: url(../images/cam/骆驼动画0013.png);
	}
	28%{
		background-image: url(../images/cam/骆驼动画0014.png);
	}
	30%{
		background-image: url(../images/cam/骆驼动画0015.png);
	}
	32%{
		background-image: url(../images/cam/骆驼动画0016.png);
	}
	34%{
		background-image: url(../images/cam/骆驼动画0017.png);
	}
	36%{
		background-image: url(../images/cam/骆驼动画0018.png);
	}
	38%{
		background-image: url(../images/cam/骆驼动画0019.png);
	}
	40%{
		background-image: url(../images/cam/骆驼动画0020.png);
	}
	42%{
		background-image: url(../images/cam/骆驼动画0021.png);
	}
	44%{
		background-image: url(../images/cam/骆驼动画0022.png);
	}
	46%{
		background-image: url(../images/cam/骆驼动画0023.png);
	}
	48%{
		background-image: url(../images/cam/骆驼动画0024.png);
	}
	50%{
		background-image: url(../images/cam/骆驼动画0025.png);
	}
	52%{
		background-image: url(../images/cam/骆驼动画0026.png);
	}
	54%{
		background-image: url(../images/cam/骆驼动画0027.png);
	}
	56%{
		background-image: url(../images/cam/骆驼动画0028.png);
	}
	58%{
		background-image: url(../images/cam/骆驼动画0029.png);
	}
	60%{
		background-image: url(../images/cam/骆驼动画0030.png);
	}
	62%{
		background-image: url(../images/cam/骆驼动画0031.png);
	}
	64%{
		background-image: url(../images/cam/骆驼动画0032.png);
	}
	66%{
		background-image: url(../images/cam/骆驼动画0033.png);
	}
	68%{
		background-image: url(../images/cam/骆驼动画0034.png);
	}
	70%{
		background-image: url(../images/cam/骆驼动画0035.png);
	}
	72%{
		background-image: url(../images/cam/骆驼动画0036.png);
	}
	74%{
		background-image: url(../images/cam/骆驼动画0037.png);
	}
	76%{
		background-image: url(../images/cam/骆驼动画0038.png);
	}
	78%{
		background-image: url(../images/cam/骆驼动画0039.png);
	}
	80%{
		background-image: url(../images/cam/骆驼动画0040.png);
	}
	82%{
		background-image: url(../images/cam/骆驼动画0041.png);
	}
	84%{
		background-image: url(../images/cam/骆驼动画0042.png);
	}
	86%{
		background-image: url(../images/cam/骆驼动画0043.png);
	}
	88%{
		background-image: url(../images/cam/骆驼动画0044.png);
	}
	90%{
		background-image: url(../images/cam/骆驼动画0045.png);
	}
	96%{
		background-image: url(../images/cam/骆驼动画0046.png);
	}
	
	100%{
		background-image: url(../images/cam/骆驼动画0047.png);
	}
}