*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
	/*使用padding不会改变大小*/
}
input[type="email"]::-webkit-calendar-picker-indicator {
/*去掉下拉箭头*/
	display:none;
}
body {
	background-color:rgb(255,250,232);
}
ul {
	/*去掉前面那点*/
	list-style: none;
}
/*设置textarea的\t为4空格*/
textarea {
	tab-size: 4 !important;
}
pre{
	tab-size: 4 !important;
}
/*去掉数字输入框的右边的箭头*/
 /* 谷歌 */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	appearance: none;
}
/* 火狐 */
input[type="number"]{
	-moz-appearance:textfield;
}
/*-------------------【{{}}模板指定】------------------------*/
.templatehtml{
	display: none;
}
/*----------------------------------【文字不换行】----------------------------------*/
.oneline{
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.twoline{
	text-indent: 2em;
	-webkit-box-orient: vertical;
	text-overflow: -o-ellipsis-lastline;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
}
/*----------------------------------【顶部】----------------------------------*/
.index-header {
	position: fixed;
	top: 0;
	left: 0;
	color: whitesmoke;
	background-color: #363636;
	width: 100px;
	height: 100%;
	z-index: 20;
}

.header-navbar{
	overflow-y: auto;
}
.header-navbar::-webkit-scrollbar {
	width: 6px;      /* 滚动条宽度（垂直滚动条） */
	height: 6px;     /* 滚动条高度（水平滚动条） */
}

.header-navbar::-webkit-scrollbar-track {
	background: #f1f1f1; /* 滚动条轨道背景 */
	border-radius: 6px;  /* 圆角 */
}

.header-navbar::-webkit-scrollbar-thumb {
	background-color: #888; /* 滚动条滑块颜色 */
	border-radius: 6px;     /* 圆角 */
	border: 1px solid #f1f1f1; /* 滑块边框（与轨道同色实现悬浮效果） */
}

.header-navbar::-webkit-scrollbar-thumb:hover {
	background-color: #555; /* 滑块悬停颜色 */
}

.tabs {
	-webkit-overflow-scrolling: touch;
	-webkit-touch-callout: none;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	font-size: 1rem;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	/*overflow: hidden;
    overflow-x: auto;*/
	white-space: nowrap;
	height: 100%;
}

/*.tabs>li{*/
/*	-webkit-box-flex: 1;!*所的占父元素宽度比*!*/
/*	-ms-flex-positive: 1;*/
/*	!*flex-shrink: 0;子元素相加大于父元素时收缩占比*!*/
/*	!*flex-grow: 1;!*同辈元素宽度比,受内容扩展*!*/
/*	-webkit-flex:1;!*同辈元素宽度比，收缩*!*/
/*	flex:1;*/
/*	border-right:2px solid white;*/
/*	display:flex;*/
/*	align-items: center;*/
/*	justify-content: center;*/
/*	list-style-type:none;*/
/*}*/
.tabs>li:last-child{
	border-right:none;
}
.tabs>li>a{
	color: white;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 1em;
  vertical-align: top;
  opacity: 0.9;
  text-decoration: none;
  cursor: pointer;
  font-size: 20px;
  font-weight: bold;
}
.tabs>li>a:hover {
  border-bottom:1px solid #dbdbdb;
  background-color: rgb(60,63,65);
  color:white;
  opacity: 1;
}
.tabs .icon{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	position: relative;
}
.tabs .icon span{
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	font-size: 16px;
	max-width:100px;
}
.signin-menu{
	padding-top:3px;
	border-radius:10px;
	overflow: hidden;
	display: none;
	position: absolute;
	z-index: 100;
	width: 100%;
	min-width:max-content;
	top: 100%;
	left: 0;
	animation: signin-menu 0.3s ease both;
	transform: translateY(50%);
	text-align: center;
}
@keyframes signin-menu {
	100% {
		transform: translateY(0);
	}
}
.signin-menu a:nth-child(1){
	border-top-left-radius:10px;
	border-top-right-radius:10px;
}
.signin-menu a{
	display: block;
	padding: 10px;
	border-bottom: 1px solid #C0C0C0;
	color: #000000;
	text-decoration: none;
	background-color: white;
	font-size: 18px;
}
.signin-menu a:hover{
	background-color: #C0C0C0;
}
/*----------------------------------【输入框提示】----------------------------------*/
.input-big {
	width: auto;
	margin-bottom: 15px;
	position: relative;
}
.input-big label {
	margin-left: 10px;
	display: block;
	font-size: 16px;
}
.input-big input {
	width: 300px;
	height: 30px;
	font-size: 16px;
	border: solid 2px rgba(0, 0, 0, 0.3);
	border-radius: 10px;
	outline: none;
	padding-left: 5px;
	margin: 10px;
}

.input-big input:hover {
	border-color: rgba(0, 0, 0, 1);
}

.input-big input:focus {
	border-color: rgba(26, 177, 136, 1);
}

.input-big input:not(:placeholder-shown) {
	border: 2px solid #00FF00;
}
/*密码输入框提示文字*/
.pass-tips{
	position: absolute;
	font-size: 16px;
	text-align: center;
	font-weight: bold;
	white-space: nowrap;
	top: 50%;
	/*transform: translateY(50%);*/
	margin-left: 10px;
}
.logon-tips{
	color: grey;
	position: absolute;
	font-size: 17px;
	text-align: center;
	font-weight: bold;
	white-space: nowrap;
	top: 0;
	left: 100%;
	margin-left: 10px;
	background-color: white;
	padding: 10px;
	border-radius: 10px;
}
.logon-tips::before{
	content: "";
	width: 0;
	display: inline-block;
	position: absolute;
	top: 4px;
	left: -32px;
	border: solid 17px rgba(0,0,0,0);
	border-right: solid 17px white;
}
/*----------------------------------【表单】----------------------------------*/
.input-r{
	outline: none;
	padding: 0 10px;
	margin: 10px;
	width: 200px;
	height: 30px;
	border: 2px solid #ddd;
	border-radius: 10px ;
	font-size: 15px;
	box-sizing: border-box;
	transition: 0.3s;
}
.input-container {
	position: relative;
	transition: 0.3s;
	width: 100%;
}
.input-container label{
    display: flex;/*弹性布局 */
	justify-content: space-between;/*水平*/
    align-items: center;/*垂直*/
}
.input-container input{
	border: none;
	outline: none;
	padding: 0 10px;
	margin: 10px;
	width: 200px;
	height: 30px;
	/*border: 2px solid #ddd;*/
	border-radius: 10px ;
	font-size: 15px;
	box-sizing: border-box;
	transition: 0.3s;
}

.input-container input:not(:-moz-placeholder-shown) {
	border: 1px solid #03a9f4;
}

.input-container input:not(:-ms-input-placeholder) {
	border: 1px solid #03a9f4;
}

.input-container input:not(:placeholder-shown) {
	border: 1px solid #03a9f4;
}

.input-container input:focus-within{
	transform: translateY(-4px);
	border-color: #bbb;
	box-shadow: 4px 4px 10px 2px #ddd;
}
.x-select{
	outline: none;
	padding-left: 5px;
	height: 30px;
	font-size: 16px;
	border-radius: 10px;
	background-color: transparent;
	color: #209cee;
	border: 1px solid #209cee;
}
.x-select:hover{
	background-color: #1496ed;
	border-color: transparent;
	color: #fff;
}
.x-select option{
	background-color: white;
	color: #209cee;
}
.x-label-input{
	margin: 4px 8px;
}

.x-label-input input[type="checkbox"]{
	width: 20px;
	height: 20px;
	margin-left: 2px;
	position: relative;
	bottom: -3px;
}

.x-label-input input:not([type="checkbox"]),
.x-label-input select{
	outline: none;
	padding-left: 4px;
	height: 30px;
	min-width: 120px;
	font-size: 16px;
	border-radius: 10px;
	background-color: transparent;
	border: 1px solid #209cee;
}

.x-label-input input:focus-within{
	border-color: #bbb;
	box-shadow: 0 0 4px 1px #209cee;
}
/*----------------------------------【圆形头像】----------------------------------*/
.avatar-user{
	width: 40px;
	height: 40px;
	border-radius: 100%;
	border: 2px solid white;
}
/*------------------------------------------------【弹窗】---------------------------------------------------*/
.x-dialog-bac{
	z-index: 60;
	top:-100%;
	width: 100vw;
	height: 100%;
	position: fixed;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: rgba(0, 0, 0, 0.3);
	transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	-webkit-transition:all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.x-dialog1{
	display: none;
	z-index: 60;
	width: max-content;
	height: max-content;
	position: relative;
	left: 50%;
	top: 50%;
	transform:translateX(-50%) translateY(-50%);
}
.x-dialog1::before{
	content: '';
	width: 100vw;
	height: 100%;
	position: fixed;
	top:0;
	left: 0;
	z-index: -1;
	background-color: rgba(0, 0, 0, 0.3);
}
/*----------------------------------【弹窗遮罩】----------------------------------*/
.shade-zhezhao1{
	position: fixed;
	z-index: 60;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.3);
}
.shade-zhezhao{
	display: none;
	position: fixed;
	z-index: 60;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.3);
}
/*----------------------------------【流光按钮】----------------------------------*/
.liuguang-a {
	/* 相对定位 */
	position: relative;
	padding: 20px;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 50px;
	font-weight: bold;
	color: #fff;
	/* 圆角属性 */
	border-radius: 50px;
	/* 背景渐变色 */
	background-image: linear-gradient(to right, #03a9f4, #f441a5, #ffeb3b, #09a8f4);
	/* 背景渐变色大小 */
	background-size: 400%;
	z-index: 1;
}
/* 下面设计 发光效果 */
.liuguang-a::before {
	content: '';
	position: absolute;
	top: -5px;
	bottom: -5px;
	left: -5px;
	right: -5px;
	border-radius: 50px;
	/* 背景渐变色 */
	background-image: linear-gradient(to right, #03a9f4, #f441a5, #ffeb3b, #09a8f4);
	/* 背景渐变色大小 */
	background-size: 400%;
	/* 元素的位置 底层或者顶层  -值表示底层 + 值表示顶层 */
	z-index: -1;
	/* 设置模糊度 显示发光效果 */
	filter: blur(20px);
	/*穿透伪元素点击*/
	pointer-events: none;
}

.liuguang-a:hover {
	/* 动画 名称 时间 infinite 是无限次播放 */
	animation: sun 8s infinite;
}

.liuguang-a:hover::before {
	animation: sun 8s infinite;
}

@keyframes sun {
	100% {
		/* 背景位置 */
		background-position: -400% 0;
	}
}
/*----------------------------------【布局】----------------------------------*/
/*100%长宽*/
.x-pmax{
	width: 100vw;
	height: 100vh;
}
.x-cmax{
	width: 100%;
	height: 100%;
}
/*垂直居中*/
.center-y{
	width: max-content;
	height: max-content;
	position: relative;
	top: 50%;
    transform: translateY(-50%);
}
/*水平居中*/
.center-x{
	width: max-content;
	height: max-content;
	position: relative;
	left: 50%;
    transform: translateX(-50%);
}
/*水平+垂直居中*/
.center-xy{
	width: max-content;
	height: max-content;
	max-height: 100%;
	max-width: 100%;
	position: relative;
	left: 50%;
	top: 50%;
	transform:translateX(-50%) translateY(-50%);
}
.center-dis{
	display: flex;/*弹性布局*/
	justify-content: center;/*水平居中*/
	align-items: center;/*垂直居中*/
}
.center-bg{
	background-color: white;
	padding: 10px;
	border-radius: 10px;
	text-align: center;
	width: 90%;
	overflow: auto;
}
/*----------------------------------【悬停发光】----------------------------------*/
 /*
<!-- javascript:void(0)是js的关键字,可以阻止连接跳转 -->
<a href="javascript:void(0);" class="faguang" style="--i: 1">悬停发光按钮</a>(--i: x)颜色
*/
.faguang {
	position: relative;
	width: 100px;
	height: 30px;
	margin: 10px;
	border: 2px solid transparent;
}

.faguang button{
	outline: none;/*去掉点击边框*/
	border: 0;
	cursor: pointer;
	background-color: transparent;
	width: 100%;
	height: 100%;
	color: #ff819a;
	font-size: 20px;
	transition: all 0.3s ease-in-out;
	filter: hue-rotate(calc(var(--i) * 60deg));
}

.faguang a{
	outline: none;
	display: inline-block;
	width: 100%;
	height: 100%;
	text-align: center;
	color: #ff819a;
	font-size: 20px;
	/* 取消下划线 */
	text-decoration: none;
	transition: all 0.3s ease-in-out;
	/* 改变各个元素的颜色,一句话就能搞定
	【hue-rotate】[颜色滤镜,改变度数来改变颜色（0-360deg）]
  	【calc】[自动计算的方法,返回i*60度的值]var获取i的值 */
	filter: hue-rotate(calc(var(--i) * 60deg));
}

.faguang:hover {
	background-color: #ff819a;
	color: #000;
	/* 加个发光效果和下面的倒影 */
	/* 模糊度加到了50px */
	box-shadow: 0 0 10px #ff819a;
	/* below 是下倒影 1px是倒影的元素相隔的距离 最后是个渐变的颜色 */
	-webkit-box-reflect: below 1px linear-gradient(transparent, rgba(0, 0, 0, 0.3));
	/* 设置一下过渡属性的延迟时间 */
	transition-delay: 0.3s;
	border-radius: 10px;
	border-color: white;
}

.faguang:hover>* {
	color: white;
	transition-delay: 0.3s;
}

.faguang::before,
.faguang::after {
	content: '';
	position: absolute;
	width: 10px;
	height: 10px;
	border: 2px solid #ff819a;
	transition: all 0.3s ease-in-out 0.3s;
	top: 0;
	border-bottom: 0;
	pointer-events: none;
}

.faguang *::before,
.faguang *::after {
	content: "";
	position: absolute;
	width: 10px;
	height: 10px;
	border: 2px solid #ff819a;
	transition: all 0.3s ease-in-out 0.3s;
	bottom: 0;
	border-top: 0;
	pointer-events: none;/*穿透伪元素点击*/
}

.faguang::before {
	border-top-left-radius: 10px;
}

.faguang::after {
	border-top-right-radius: 10px;
}

.faguang *::after {
	border-bottom-right-radius: 10px;
}

.faguang *::before {
	border-bottom-left-radius: 10px;
}

.faguang::before,
.faguang *::before {
	left: 0;
	border-right: 0;
}

.faguang::after,
.faguang *::after {
	right: 0;
	border-left: 0;
}
.faguang:hover::before,
.faguang *:hover::before,
.faguang:hover::after,
.faguang *:hover::after {
	width: 50%;
	height: 50%;
	/*border-radius: 10px;*/
	transition-delay: 0s;
}
/*----------------------------------【耳朵】----------------------------------*/
.left-ears,
.cat-ears::before{
	content: "";
	left: 0;
	top: -53px;
	position: absolute;
   	width: 2px;
    height: 0;
    border: solid 30px rgba(0,0,0,0);
    border-bottom: solid 30px whitesmoke;
}
.right-ears,
.cat-ears::after{
	content: "";
	right: 0;
	top: -53px;
	position: absolute;
   	width: 2px;
    height: 0;
    border: solid 30px rgba(0,0,0,0);
    border-bottom: solid 30px whitesmoke;
}
/*----------------------------------【卷轴弹窗】----------------------------------*/
.scroll-text{
	white-space: nowrap;/*文字不换行*/
	overflow: hidden;/*溢出隐藏*/
	display: flex;
	align-items: center;/*交叉轴上居中*/
	justify-content: center;/*主轴上居中*/
	flex-direction: column;/*主轴为垂直方向，起点在上沿*/
}
.scroll-text p,
.scroll-text span{
	position: relative;
	z-index: 10;
	font-size: 20px;
	font-weight: bold;/*加粗*/
	text-align: center;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	padding: 10px;
	margin-bottom: 10px;
}
.scroll-text button{
	font-size: 20px;
	height: 100%;
	width: 100%;
	background-color: whitesmoke;
	border: none;
	outline: none;/*点击后没有边框*/
	cursor: pointer;/*鼠标进入的鼠标样式*/
	color: #ff819a;
	margin-bottom: 0;
}
.scroll-text button:hover{
	background-color: #ff819a;
	color: white;
}
.scroll-text button:nth-child(1){
	border-bottom-left-radius:10px;
}
.scroll-text button:nth-child(2){
	border-bottom-right-radius:10px;
}
.scroll-bac{
	width: 390px;
	border-radius: 10px;
	background-color: whitesmoke;
	transition: all 0.3s;
	padding-top:10px;
	animation: scroll-bac 0.3s;
	position: relative;
	z-index: 1;
}
@keyframes scroll-bac {
  0% {
    width: 30px;
  }
  100% {
  	width: 390px;
  }
}
/*----------------------------------【滑动显示】----------------------------------*/
.slide-top {
	-webkit-animation: slide-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@-webkit-keyframes slide-top {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
  }
}
@keyframes slide-top {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
  }
}
.slide-bottom {
	-webkit-animation: slide-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@-webkit-keyframes slide-bottom {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(100px);
            transform: translateY(100px);
  }
}
@keyframes slide-bottom {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(100px);
            transform: translateY(100px);
  }
}
/*----------------------------------【鼠标下滑弹出菜单】----------------------------------*/
.slide-x{
	position: absolute;
	z-index: 999;
}
.slide-x>a{
	display: none;
	justify-content:center;/*水平居中*/
	align-items: center;/*垂直居中*/
	width: 40px;
	height: 40px;
	border:2px solid #000000;
	border-radius: 100%;
	padding: 5px;
	margin: 5px;
	text-decoration: none;
	background-clip: content-box;/*只填充内容区域*/
	background-color: whitesmoke;
	animation: slide-x 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;/*both;*/
	transform: translateY(0);
	/*transition: all 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);*/
	/*图标*/
	font-family:"calamus";/*字体，live2d.css,*/
    font-size: 30px;
    font-style: normal;/*字体normal：默认标准；italic：斜体；oblique：倾斜；inherit：父元素字体*/
    -webkit-font-smoothing: antialiased;/*抗锯齿*/
    -moz-osx-font-smoothing: grayscale;
}
.slide-x>a:nth-child(1)::before{
	content: "\e643";/*图标*/
	color: #000000;
}
.slide-x>a:nth-child(2)::before{
	content: "\e600";
	color: #000000;
}
.slide-x>a:nth-child(3)::before{
	content: "\21E9";
	color: #000000;
}
.slide-x>a:hover{
	border:2px solid aqua;
	background-color: rgb(255,255,204);
}
@keyframes slide-x {
  0% {
    transform: translateY(calc(var(--i) * 100px));/**/
  }
  100% {
    transform: translateY(0);
  }
}
/*----------------------------------【加载旋转样式】----------------------------------*/
.loadingxbg{
	width: 100vw;
	height: 100vh;
	background: rgba(0, 0, 0, 0.3);
	position: fixed;
}
.loadingx{
	position: fixed;
	top: 50%;
	left: 50%;
	transform:translateX(-50%) translateY(-50%);
	z-index: 999;
	display: flex;
	justify-content:center;/*水平居中*/
	align-items: center;/*垂直居中*/
	width: 55px;
	height: 55px;
	border-radius: 100%;
	padding: 5px;
	text-decoration: none;
}
/*[光球旋转模块]*/
.g-circle>div,
.g-circle {
	pointer-events: none;
	position: absolute;
	width: 60px;
	height: 60px;
	z-index: -1;
	border-radius: 50%;
	background: conic-gradient(#fc0 0%, transparent 30%, transparent);
}
.g-circle{
	animation: rotate 3s linear infinite;
}
.g-circle>div{
	transform: rotate(180deg);
}
.loadingx:hover .g-circle>div,
.loadingx:hover .g-circle{
	background: conic-gradient(aqua 0%, transparent 30%, transparent);
}
@keyframes rotate {
	100% {transform: rotate(-360deg);}
}
.g-circle>div::before,
.g-circle::before{
	content: "";
	position: absolute;
	width: 12px;
	height: 12px;
	top: 0;
	left: 50%;
	transform: translate(-50%, -3px);
	border-radius: 50%;
	background: #fc0;
	box-shadow: 0 0 4px 2px #fc0;
	pointer-events: none;/*穿透点击*/
}

/*[发光遮罩模块]*/
.g-circle>div::after {
	content: "";
	position: absolute;
	z-index: -1;
	top: 6px;
	left: 6px;
	bottom: 6px;
	right: 6px;
	background-color: black;
	border-radius: 50%;
	pointer-events: none;/*穿透点击*/
}
/*----------------------------------【按钮】----------------------------------*/
.button-btn{
	height: 2em;
    width: 5.5em;
	background-color: transparent;
    color: #209cee;
    outline: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #209cee;
    border-radius: 10px;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 1rem;
    line-height: 1;
    vertical-align: top;
    -webkit-touch-callout: none;
    cursor: pointer;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
}
.button-btn:hover{
  background-color: #1496ed !important;
  border-color: transparent;
  color: #fff;
}
/*圆形按钮*/
.circular-btn{
	border-radius: 100%;
    height: 30px;
    width: 30px;
}
/*----------------------------------【查看大图】----------------------------------*/
.viewpicturesmtable {
	padding: 0 !important;
}
.viewpicturesmtable div{
	height: 50px !important;
}
.viewpicturebtn {
	width: 100px;
	height: 100px;
	cursor: zoom-in;
}
.viewpicturebac {
	background: rgba(0, 0, 0, 0.5);
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 999;
	top: 0;
	left: 0;
}
.viewpicturebac img{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	max-width: 90%;
	max-height: 90%;
}
/*----------------------------------【单选按钮】----------------------------------*/
.radio-button {
	height: 30px;
	width: 50px;
	text-align: center;
	line-height: 26px;
	display: inline-block;
	position: relative;
	margin: 10px 20px;
}
.radio-button input {
	width: 100%;
	height: 100%;
	opacity: 0;
	outline: 0;
	position: absolute;
	top: 0;
	left: 0;
}
.radio-button label {
	width: 100%;
	height: 100%;
	pointer-events: none;
	display: block;
	position: absolute;
	border: solid 1px #C0C0C0;
	border-radius: 10px;
	font-size: 16px;
	top: 0;
	left: 0;
}
.radio-button input[type="radio"]:checked+label {
	color: white;
	background-color: rgb(29, 200, 240);
}