.x-pay {
		background-color: #007aff;

		&-title {
			height: 45px;
			padding: 0 10px;
			background-color: $gl-themeColor;
			@include flexRowSpaceBetween;

			&-right,
			&-left {
				width: 22px;
				height: 22px;

				&-image {
					width: 22px;
					height: 22px;
					flex-direction: row;
					align-items: center;
				}
			}

			&-center {
				@include styleFont(#ffffff,16);
			}
		}

		&-price {
			height: 35px;
			background-color: #ffffff;

			&-text {
				text-align: center;
				line-height: 35px;
				color: $gl-themeColor;
				font-size: 18px;
				font-weight: 700;
			}
		}

		&-ul {
			background-color: #ffffff;

			&-list {
				height: 60px;
				padding: 0 20px;
				@include flexRowSpaceBetween;
				@include borderTop(#e9e9e9);
				background-color: #ffffff;

				&-left {
					width: 25px;
					height: 25px;
					margin-right: 20px;
					border-radius: 50%;
				}

				&-center {
					&-title {
						@include styleFont(#333,16);
					}

					&-text {
						margin-top: 5px;
						@include styleFont(#999,12);
					}
				}

				&-right {
					width: 24px;
					height: 24px;
					border-radius: 50%;
					margin-left: 20px;
					align-items: center;
					justify-content: center;
					&-noSelect{
						width: 22px;
						height: 22px;
						border-radius: 50%;
						border-width: 1px;
						border-color: #999999;
					}
					&-active {
						border-width: 0px;
					}
				}
			}
		}

		&-bottom {
			background-color: #FFFFFF;

			&-text {
				background-color: $gl-themeColor;
				height: 45px;
				text-align: center;
				line-height: 45px;
				@include styleFont(#ffffff,14);
			}

			&-safe {
				height: 30px;
			}
		}
	}

	/* 支付密码 */
	.x-pay-tool {
		background-color: #ffffff;
		&-safe{
			height: 30px;
		}
		&-title {
			height: 40px;
			background-color: #ffffff;
			@include borderBotton(#dcdfe6);
			@include flexRowSpaceBetween;
			padding: 0 15px;

			&-right,
			&-left {
				width: 23px;
				height: 23px;
				align-items: center;
				justify-content: center;
				border-radius: 50%;
			}

			&-right {
				border-radius: 50%;

				&-image {
					width: 23px;
					height: 23px;
				}
			}

			&-center {
				font-size: 15px;
				font-weight: 600;
			}
		}

		&-case {
			padding: 15px;
			padding-bottom: 3px;
			background-color: #ffffff;

			&-ul {
				border-radius: 3px;
				border-width: 1px;
				border-style: solid;
				border-color: #dcdfe6;
				flex-direction: row;

				&-list {
					height: 40px;
					align-items: center;
					justify-content: center;

					&-border {
						border-left-width: 1px;
						border-left-color: #dcdfe6;
						border-left-style: solid;
					}

					&-dont {
						width: 12px;
						height: 12px;
						background-color: gray;
						border-radius: 50%;
					}
				}
			}
		}

		&-link {
			height: 30px;
			background-color: #ffffff;
			flex-direction: row;
			justify-content: center;

			&-text {
				@include styleFont(#979797,13);
				padding: 0 5px;
			}
		}

		&-keyboard {
			padding: 0 10px;

			&-ul {
				@include borderTop(#dcdfe6);
				@include  flexRowWrap;

				&-list {
					height: 40px;
					border-bottom-width: 1px;
					border-right-width: 1px;
					border-style: solid;
					border-color: #dcdfe6;

					&-border {
						border-right-width: 0;
					}

					&-text {
						line-height: 40px;
						text-align: center;
						font-size: 20px;
						font-weight: 600;
					}

					&-del {
						line-height: 40px;
						text-align: center;
						@include styleFont(#361759,20);
					}
				}
			}

			&-bang {
				background-color: #f2f6fc;
			}
		}
	}

	.hoverClss {
		background-color: #575962;
	}