/**newIndex.wxss**/

.pointerEvents{
    pointer-events: none;
}
/deep/.el-carousel__container{
	height: 100%!important;
}
.bookingSheet{
	height: 100%;
}
.contentBox{
	position: relative;
    width: 100vw;
	height: 100%;
    overflow: hidden;
    box-sizing: border-box;
	background-color: white;
	.bg1{
		position: absolute;
		left: 0px;
		top: 0px;
		width: 100vw;
		height: 759.1px;
		background: linear-gradient(180.00deg, #adb7c3 0%, #aba29c54 55.17%, #00000017 100%);
		z-index: 1;
	}
	.bg2{
		position: absolute;
		left: 0px;
		top: 0px;
		width: 100vw;
		height: 100%;
		background: linear-gradient(180.00deg, #aeb6c1 0%, #adb7c3 16.75%, #d1c8b9 78%, #d7cebf 100%);
		// z-index: 2;
	}
	.bg4{
		position: absolute;
		left: 0px;
		top: 0px;
		width: 100vw;
		height: 760px;
		background-image: url('https://dm.static.elab-plus.com/miniProgram/role_top_bg.png');
		background-size:cover;
		background-repeat: no-repeat;
		// z-index: 2;
	}
	.bg3{
		position: absolute;
		left: 0px;
		top: 0px;
		width: 100vw;
		height: 100vh;
		background-image: url('https://dm.static.elab-plus.com/miniProgram/role_bg1.png');
		background-size:cover;
		background-repeat: no-repeat;
		// z-index: 2;
	}
	.role-info{
		position: absolute;
		height: 44px;
		left:50%;
		top: 86px;
		transform: translateX(-50%);
		font-family: "Verdana Bold";
		font-weight: 700;
		font-size: 32px;
		color: #fff;
		z-index: 9;
	}
	.master-pic{
	    position: relative;
	    width: 100%;
	    height:750px;
	    margin-top: 162px;
		margin-bottom: 20px;
	    // padding: 10px;
	    box-sizing: border-box;
	    // background-color: #171717;
		.master-pic-swiper{
			width: 100%;
			height: 100%;
		}
		.master-pic-item{
			width: 100%;
			height: 100%;
			.master-pic-img{
			    width: 550px;
			    height: 750px;
			    display: block;
				object-fit: contain;
			}
		}
	}
    .tabList{
		position: relative;
		width: 100%;
		height: 100px;
		// top:926px;
		overflow-x: auto;
		overflow-y: hidden;
		margin-bottom: 30px;
		z-index: 9;
		.tab-content{
			position: absolute;
		}
		.tab-content::-webkit-scrollbar {
		    width: 0;
		    height: 0;
		    color: transparent;
			display: none;
		}
        .tab-item{
			// width:190px;
			width:max-content;
            margin-right: 20px;
            font-family: "Verdana";
            font-weight: 400;
            font-size: 24px;
            color: #1d1d1d;
			text-align:center;
			padding:2px;
			box-sizing: border-box;
			margin-right: 60px;
			&:first-child{
				margin-left: 100px;
			}
			&:last-child{
				margin-right: 0px;
			}
            
			.tab-text{
				font-family: "Verdana";
				font-weight: 400;
				font-size: 36px;
				color: rgba(39, 39, 39, 0.5);
			}
			&.tabActive .tab-text{
				color: #272727;
			}
			.tab-info{
				position: relative;
				width: 40px;
				height: 40px;
				font-size: 20px;
				background: #d2c9ba;
				border: 2px solid #fff;
				border-radius: 50%;
				box-sizing: border-box;
				color: #fff;
				&.select {
					background: #ff870f;
				}
				i{
					font-size: 14px;
				}
			}
			.tab-info::after{
				position: absolute;
				content: '';
				left: 60px;
				width: 110px;
				height: 1px;
				background: #999;
				opacity: 1;
			}
			&:last-child .tab-info::after{
				width: 0px;
			}
			.tab-info::before{
				position: absolute;
				content: '';
				right: 60px;
				width: 110px;
				height: 1px;
				background: #999;
				opacity: 1;
			}
			&:first-child .tab-info::before{
				width: 0px;
			}
        }
    }
	.swiper-view{
		position: relative;
		width: 100%;
		height: 138px;
		// top:926px;
		overflow-x: auto;
		overflow-y: hidden;
		margin-bottom: 20px;
		z-index: 9;
		.tab-content{
			position: absolute;
			width: 100%;
		}
		.jc{
			justify-content: center;
		}
		.pd{
			padding-left: 40px;
		}
		.tab-item{
			// width:190px;
			width:max-content;
		    font-family: "Verdana";
		    font-weight: 400;
		    font-size: 0px;
		    color: rgba(69, 69, 69, 0.6);
			text-align:center;
			box-sizing: border-box;
			margin-right: 40px;
			&:first-child{
				// margin-left: 40px;
			}
			&:last-child{
				margin-right: 0px;
			}
			.tab-img{
				width: 84px;
				height: 84px;
				object-fit: contain;
				margin-bottom: 14px;
				border-radius: 50%;
				border: transparent 4px solid;
				box-sizing: border-box;
			}
			.tab-img-bg{
				width: 84px;
				height: 84px;
				margin-bottom: 14px;
				border-radius: 50%;
				border: transparent 4px solid;
				box-sizing: border-box;
				background-position: center top;
				background-size:300%;
				background-repeat: no-repeat;
			}
			
			.tab-text{
				width: max-content;
				font-family: "Verdana";
				font-weight: 400;
				font-size: 28px;
				color: rgba(69, 69, 69, 0.6);
			}
			&.tabActive .tab-text{
				color: rgba(69, 69, 69, 1);
			}
			&.tabActive .tab-img{
				border-color: rgba(249, 135, 15, 1);
			}
			&.tabActive .tab-img-bg{
				border-color: rgba(249, 135, 15, 1);
			}
		}
	}
    .question{
		position: fixed;
		left: 0px;
		width: 100%;
		bottom: 190px;
		font-family: "Verdana";
		font-weight: 400;
		height: 34px;
		font-size: 24px;
		color: rgba(78, 78, 78, 0.47);
	}
}
.bottom-view{
    position: fixed;
    width: 470px;
    height: 92px;
	left: 140px;
	bottom: 68px;
    border-radius: 46px;
    background: rgba(11, 12, 11, 0.2);
    box-sizing: border-box;
	z-index: 3;
	font-family: "Verdana Bold";
	font-weight: 700;
	font-size: 30px;
	color: rgba(255, 247, 235, 0.6);
	&.active{
		background: #0b0c0b;
		color: #fff7eb;
	}
}
::-webkit-scrollbar {
    width: 0;
    height: 0;
    color: transparent;
	display: none;
}
@media screen and (max-height: 750px){
	.master-pic{
		margin-top: 102px!important;
	}
	.question{
		bottom: 130px!important;
	}
	.bottom-view{
		bottom: 30px!important;
	}
}