@charset "utf-8";
/* CSS Document */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	font: 12px/2 微软雅黑, Verdana, Arial, Helvetica, sans-serif;
	position: relative;
}

p {
	margin: 0;
	padding: 0;
}

ul,
li {
	list-style: none;
}

img {
	border: 0;
}

button,
input,
optgroup,
option,
select,
textarea {
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: inherit;
	outline: 0;
}

blockquote,
body,
button,
dd,
div,
dl,
dt,
form,
h1,
h2,
h3,
h4,
h5,
h6,
input,
li,
ol,
p,
pre,
td,
textarea,
th,
ul {
	margin: 0;
	padding: 0;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.c-b,
.clear {
	clear: both;
}

.hide {
	display: none !important;
}

.pointer-none {
	pointer-events: none;
}

.text-center {
	text-align: center;
	justify-content: center;
}

*::-webkit-scrollbar {
	/*滚动条整体样式*/
	width: 4px;
	/*高宽分别对应横竖滚动条的尺寸*/
	height: 4px;
}

*::-webkit-scrollbar-thumb {
	/*滚动条里面小方块*/
	border-radius: 5px;
	-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
	background: rgba(0, 0, 0, 0.1);
}

*::-webkit-scrollbar-track {
	/*滚动条里面轨道*/
	-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
	border-radius: 5px;
	background: rgba(0, 0, 0, 0.1);
}

.flex-center {
	display: flex;
	justify-content: center;
}

.flex-start {
	display: flex;
	justify-content: start;
}

.flex-between {
	display: flex;
	justify-content: space-between;
}

.flex-around {
	display: flex;
	justify-content: space-around;
}

.flex-wrap {
	display: flex;
	flex-wrap: wrap;
}

.flex-row {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.flex-column {
	display: flex;
	flex-direction: column;
}

/*公用属性*/
.lg-form-flex {
	display: flex;
}

.lg-inline {
	display: inline-block;
	margin-right: 10px;
	position: relative;
}

.lg-inline-100 {
	display: inline-block;
	width: 100%;
}

.break {
	line-height: 38px;
	width: 10px;
	flex-shrink: 0;
}

/*颜色*/
:root {
	--info: #539bd9;
	--danger: #FF5722;
	--default: #fff;
	--primary: #23b365;
	--warn: #FFB800;
}

/*主框架*/
.lg-diy-wrap {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #F9FAFC;
}

/*主体*/
.lg-diy-body {
	display: flex;
	flex: 1;
	width: 100%;
	overflow: auto;
	background: #F9FAFC;
}

.lg-diy-left {
	width: 275px;
	overflow: auto;
	background: #FFFFFF;
	border-right: 1px solid #eee;
}

.lg-diy-center {
	flex: 1;
	justify-content: center;
	overflow: auto;
}

.lg-diy-right {
	width: 300px;
	overflow: auto;
	background: #FFFFFF;
	border-left: 1px solid #eee;
	transition: all ease .2s;
	animation-duration: .2s;
}


/*头部工具栏*/
.lg-diy-head {
	position: relative;
	background: #fff;
	height: 50px;
	line-height: 50px;
	border-bottom: 1px solid #eee;
	display: flex;
	justify-content: space-between;
}

	.lg-diy-head .back,
	.lg-diy-head .lg-diy-nav,
	.lg-diy-head .lg-diy-tools {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		height: 100%;
	}

	.lg-diy-head .back {
		font-size: 20px;
		font-weight: 600;
	}

		.lg-diy-head .back:before {
			margin: 0 10px;
			font-weight: 100;
		}

.lg-diy-top-nav {
}

	.lg-diy-top-nav li {
		font-size: 20px;
	}

		.lg-diy-top-nav li.act {
			font-weight: bold;
		}

.lg-diy-head .lg-diy-tools {
}

	.lg-diy-head .lg-diy-tools span {
		margin: 0 5px;
	}



/*侧边栏*/
.lg-diy-sidebar {
	width: 55px;
	overflow: auto;
	border-right: 1px solid #eee;
}

.lg-diy-sidebar-nav {
	padding: 15px 3px;
}

	.lg-diy-sidebar-nav li {
		padding: 6px;
		text-align: center;
		margin-bottom: 15px;
		cursor: pointer;
		border-radius: 5px;
	}

		.lg-diy-sidebar-nav li i {
			display: block;
			font-size: 20px;
		}

		.lg-diy-sidebar-nav li span {
			display: block;
			font-size: 14px;
		}

		.lg-diy-sidebar-nav li:hover {
			background: #eee;
		}

		.lg-diy-sidebar-nav li.act {
			color: #1E9FFF;
		}

/*按钮组*/
.lg-btn {
	display: inline-block;
	height: 38px;
	line-height: 38px;
	border: 1px solid transparent;
	padding: 0 18px;
	background-color: #23b365;
	color: #fff;
	white-space: nowrap;
	text-align: center;
	font-size: 14px;
	border-radius: 2px;
	cursor: pointer
}

	.lg-btn:hover {
		opacity: .8;
		color: #fff
	}

	.lg-btn:active {
		opacity: 1;
	}

	.lg-btn + .lg-btn {
		margin-left: 10px
	}

.lg-btn-container {
	font-size: 0
}

	.lg-btn-container .lg-btn {
		margin-right: 10px;
		margin-bottom: 10px
	}

		.lg-btn-container .lg-btn + .lg-btn {
			margin-left: 0
		}

.lg-table .lg-btn-container .lg-btn {
	margin-bottom: 9px
}

.lg-btn-radius {
	border-radius: 100px
}

.lg-btn .lg-icon {
	padding: 0 2px;
	vertical-align: middle\9;
	vertical-align: bottom
}

.lg-btn-primary {
	border-color: #d2d2d2;
	background: 0 0;
	color: #666
}

	.lg-btn-primary:hover {
		border-color: #23b365;
		color: #333
	}

.lg-btn-normal {
	background-color: #539bd9;
}

.lg-btn-warm {
	background-color: #FFB800
}

.lg-btn-danger {
	background-color: #FF5722
}

.lg-btn-checked {
	background-color: #5FB878
}

.lg-btn-disabled,
.lg-btn-disabled:active,
.lg-btn-disabled:hover {
	border-color: #eee !important;
	background-color: #FBFBFB !important;
	color: #d2d2d2 !important;
	cursor: not-allowed !important;
	opacity: 1
}

.lg-btn-lg {
	height: 44px;
	line-height: 42px;
	padding: 0 25px;
	font-size: 16px
}

.lg-btn-sm {
	height: 30px;
	line-height: 28px;
	padding: 0 10px;
	font-size: 12px
}

.lg-btn-xs {
	height: 22px;
	line-height: 20px;
	padding: 0 5px;
	font-size: 12px
}

	.lg-btn-xs i {
		font-size: 12px !important
	}

.lg-btn-group {
	vertical-align: middle;
	font-size: 0
}

	.lg-btn-group .lg-btn {
		margin-left: 0 !important;
		margin-right: 0 !important;
		border-left: 1px solid rgba(255, 255, 255, .5);
		border-radius: 0
	}

	.lg-btn-group .lg-btn-primary {
		border-left: none
	}

		.lg-btn-group .lg-btn-primary:hover {
			border-color: #d2d2d2;
			color: #23b365
		}

	.lg-btn-group .lg-btn:first-child {
		border-left: none;
		border-radius: 2px 0 0 2px
	}

	.lg-btn-group .lg-btn-primary:first-child {
		border-left: 1px solid #d2d2d2
	}

	.lg-btn-group .lg-btn:last-child {
		border-radius: 0 2px 2px 0
	}

	.lg-btn-group .lg-btn + .lg-btn {
		margin-left: 0
	}

	.lg-btn-group + .lg-btn-group {
		margin-left: 10px
	}

.lg-btn-fluid {
	width: 100%
}

.code-btn {
	display: block;
	border-color: #eee;
	background: 0 0;
	color: #666
}

	.code-btn:hover {
		opacity:0.8;
		color:#737373;
	}

.lg-form-smscode .lg-form-flex{
	flex-wrap:nowrap;
}
	.lg-form-smscode .lg-form-flex .lg-inline:nth-child(2) {
		width: 140px;
		flex-shrink:0;
	}
@media screen and (max-width:768px) {
	.lg-form-smscode .lg-form-flex .lg-inline:nth-child(1) {
		width: 100%;
		margin-right:10px;
	}
	.lg-form-smscode .lg-form-flex .lg-inline {
		margin-right:0;
		margin-bottom:0;
	}
}

	/*左侧操作栏*/
	.lg-field-group {
		padding: 15px 20px;
	}

		.lg-field-group .title {
			font-size: 16px;
			font-weight: bold;
			margin-bottom: 10px;
		}

	.lg-field-group-box {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

		.lg-field-group-box .field {
			display: flex;
			align-items: center;
			width: 108px;
			padding: 3px 0;
			margin-top: 12px;
			border: 1px solid #e6eaf0;
			border-radius: 4px;
			color: #494f57;
			font-size: 14px;
			cursor: pointer;
			background: #F9FAFC;
		}

			.lg-field-group-box .field.selected {
				cursor: not-allowed;
			}

			.lg-field-group-box .field span.text {
				width: 80%;
				white-space: nowrap;
				text-overflow: ellipsis;
				overflow: hidden;
			}

			.lg-field-group-box .field span.fa-check {
				visibility: hidden;
			}

			.lg-field-group-box .field.selected span.fa-check {
				visibility: visible;
				width: 10%;
				color: #4caf50;
			}

		.lg-field-group-box .field-block {
			width: 100%;
		}

		.lg-field-group-box .field i {
			padding: 0 10px;
			text-align: center;
		}

		.lg-field-group-box .field:hover {
			color: #000;
			border: 1px solid #ccc;
			background: #f9f9f9;
		}


	/*右侧操作栏*/
	.lg-diy-right {
	}

	.lg-menu {
		padding: 10px;
		border-bottom: 1px solid #eee;
		font-size: 16px;
		font-weight: bold;
	}

	.lg-field-nature {
		padding: 15px;
	}

	/*表单框架部分*/
	.lg-form {
		font: 14px/2 Helvetica Neue, Helvetica, PingFang SC, Tahoma, Arial, sans-serif;
	}

	.lg-form-background {
		width: 100%;
		padding: 30px;
		display: flex;
		justify-content: center;
		background: none;
		transition: all ease .2s;
		overflow: auto;
	}

	.lg-form-content {
		width: 100%;
	}

	.lg-form-banner {
		width: 100%;
		min-height: 50px;
		border-radius: 10px 10px 0 0;
		overflow: hidden;
	}

		.lg-form-banner img {
			width: 100%;
		}

	.lg-form-head {
		background: #fff;
		box-shadow: 0 3px 10px rgba(0 0 0/10%);
		padding: 15px;
		margin-bottom: 15px;
	}

	.lg-form-head-title {
		margin-bottom: 15px;
	}

		.lg-form-head-title span {
			font-size: 18px;
			font-weight: bold;
		}

		.lg-form-head-title input {
			border: 0;
			outline: none;
			font-size: 18px;
			font-weight: bold;
		}

	.lg-form-head-intro:hover {
		background: #f9f9f9;
	}

	.lg-form-head-intro span {
		font-size: 14px;
		color: #999;
	}

	.lg-form-head-intro textarea {
		border: 0;
		outline: none;
		font-size: 14px;
		color: #999;
		width: 100%;
	}

		.lg-form-head-title input:focus,
		.lg-form-head-intro textarea:focus {
			border: 1px solid #d2d2d2;
		}


	.lg-form-body {
		background: #fff;
		box-shadow: 0 3px 10px rgba(0 0 0/10%);
		padding: 20px;
	}

	.lg-form-foot {
		padding: 15px 0;
	}

	/*表单自动排版*/
	.lg-form-wrap-auto {
		display: flex;
		flex-wrap: wrap;
	}

	/*移动表单*/
	.choseClass {
		background: #f9f9f9;
	}

		.choseClass.ghost {
			opacity: 0.2;
		}

	/*表单字段容器*/
	.lg-form-box {
		width: 100%;
		padding: 10px;
		position: relative;
		box-sizing: border-box;
	}

		.lg-form-box:hover {
			background: #f9f9f9;
		}

		.lg-form-box.act {
			background: #eff3fd;
		}
	/*表单删除*/
	.lg-form-panel {
		position: absolute;
		top: 10px;
		right: 10px;
		z-index: 2;
		display: flex;
		align-items: center;
		justify-content: end;
		display: none;
	}

	.lg-form-panel-item {
		margin-left: 10px;
		position: relative;
		z-index: 2;
	}

	.lg-form-panel i {
		cursor: pointer;
		color: #999;
		font-size: 12px;
	}

		.lg-form-panel i:before {
			font-size: 18px;
			margin-right: 3px;
		}

		.lg-form-panel i:hover {
			color: #23b365;
		}

	.lg-form-box:hover .lg-form-panel {
		display: flex;
	}

	.lg-form-box-no-render {
		opacity: 0.5;
	}


	/*表单拖动*/
	.lg-form-drag {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		width: 100%;
		height: 42px;
		cursor: move;
	}

		.lg-form-drag:hover {
			background: none;
		}

	/*lg-no-render*/
	.lg-no-render {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #f8fdff;
		text-align: center;
		line-height: 40px;
	}

		.lg-no-render i.fa {
			color: #999;
		}


	/*表单项*/
	.lg-form-item {
		position: relative;
		margin-bottom: 25px;
	}

	/*表单标题*/
	.lg-form-title {
		display: flex;
		align-items: center;
	}

	.lg-form-title-item {
		position: relative;
		margin-bottom: 5px;
	}

		.lg-form-title-item span {
			margin-right: 10px;
		}

			.lg-form-title-item span.cn {
				font-size: 15px;
			}

			.lg-form-title-item span.en {
				color: #999;
			}

		.lg-form-title-item i {
			color: #FF5722;
			margin-right: 5px;
		}

		.lg-form-title-item .lg-tip-icon {
			color: #999;
			cursor: pointer;
			font-size: 16px;
			line-height: 2;
			display: none;
		}

			.lg-form-title-item .lg-tip-icon:hover,
			.lg-form-title-item .lg-tip-icon:active {
				color: #23b365;
			}

	/*字段容器*/
	.lg-form-control {
		width: 100%;
		position: relative;
	}

		.lg-form-control:after {
			display: block;
			content: "";
			clear: both;
		}

	/*表单提示*/
	.lg-form-tip {
		color: #999;
		position: relative;
		line-height: 2;
	}

	.lg-form-tip-bubble {
		display: none;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 9;
		width: auto;
		min-width: 200px;
		height: auto;
		line-height: 1.5;
		background: #eefaff;
		padding: 10px;
		box-shadow: 0 0 3px rgba(0 0 0/10%);
	}

		.lg-form-tip-bubble:after {
			display: block;
			content: "";
			width: 0;
			height: 0;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			border-top: 10px solid #eefaff;
			position: absolute;
			bottom: -10px;
			left: 0;
		}

	/*验证提示*/
	.lg-form-ver {
		display: none;
		line-height: 2;
		color: #FF5722;
	}

	.lg-ver-error .lg-form-ver {
		display: block;
	}

	.lg-ver-error .lg-form-tip {
		display: none;
	}

	/*表单样式*/
	.lg-input,
	.lg-select,
	.lg-textarea {
		border-color: #eee;
	}

	.lg-input,
	.lg-select,
	.lg-textarea {
		height: 38px;
		line-height: 1.3;
		line-height: 38px\9;
		border-width: 1px;
		border-style: solid;
		background-color: #fff;
		color: rgba(0, 0, 0, .85);
		border-radius: 2px
	}

		.lg-input::-webkit-input-placeholder,
		.lg-select::-webkit-input-placeholder,
		.lg-textarea::-webkit-input-placeholder {
			line-height: 1.3;
		}

	.lg-input,
	.lg-textarea {
		display: block;
		width: 100%;
		padding-left: 10px;
	}

		.lg-input:hover,
		.lg-textarea:hover {
			border-color: #eee !important
		}

		.lg-input:focus,
		.lg-textarea:focus {
			border-color: #d2d2d2 !important
		}

	.lg-textarea {
		min-height: 100px;
		height: auto;
		line-height: 20px;
		padding: 6px 10px;
		resize: vertical;
	}

	.lg-form-danger + .lg-form-select .lg-input,
	.lg-form-danger:focus,
	.lg-ver-error .lg-input,
	.lg-ver-error .lg-textarea {
		border-color: #FF5722 !important
	}


	/*添加表单项*/
	.lg-item-tool {
		display: flex;
		align-items: center;
		position: absolute;
		top: 0;
		right: 0;
		height: 36px;
		line-height: 36px;
		padding: 0 6px;
	}

		.lg-item-tool i {
			padding: 3px 6px;
			font-size: 18px;
			color: #999;
			border-radius: 2px;
			cursor: pointer;
		}

			.lg-item-tool i:hover {
				background: #f2f2f2;
			}

	.addoption {
		width: 100%;
		border: 1px dashed #ccc;
	}

		.addoption:before {
			margin: 0 10px 0 0;
		}

	.lg-form-option {
		margin-bottom: 10px;
	}
	/*添加表单项结束*/
	.lg-form-radio {
		display: flex;
		align-items: center;
		line-height: 28px;
		margin: 6px 6px 0 0;
		padding: 0 10px;
		cursor: pointer;
	}

		.lg-form-radio i {
			flex-shrink: 0;
			display: block;
			border: 1px solid #ccc;
			border-radius: 50%;
			box-sizing: border-box;
			width: 20px;
			height: 20px;
			margin-right: 5px;
			position: relative;
		}

			.lg-form-radio i:before {
				width: 10px;
				height: 10px;
				border-radius: 50%;
				background: #23b365;
				content: "";
				position: absolute;
				top: 4px;
				left: 4px;
				display: none;
			}

		.lg-form-radio span {
			flex-shrink: 0;
		}

		.lg-form-radio.lg-checked i,
		.lg-form-radio:hover i {
			border: 1px solid #23b365;
		}

		.lg-form-radio:hover span {
			color: #23b365;
		}

		.lg-form-radio.lg-checked i:before {
			display: block;
		}

	.lg-disabled {
		cursor: not-allowed !important;
	}

		.lg-disabled i {
			border: 1px solid #d2d2d2 !important;
		}

		.lg-disabled span {
			color: #d2d2d2 !important;
		}

	.lg-relation-input {
		width: 100%;
		margin: 10px 0 0 0;
	}

	.lg-form-check {
		display: flex;
		align-items: center;
		line-height: 28px;
		margin: 6px 6px 0 0;
		padding: 0 10px;
		cursor: pointer;
	}

		.lg-form-check i {
			display: block;
			border: 1px solid #ccc;
			box-sizing: border-box;
			width: 18px;
			height: 18px;
			border-radius: 2px;
			margin-right: 5px;
			text-align: center;
			position: relative;
		}

			.lg-form-check i:before {
				content: "";
				width: 10px;
				height: 5px;
				border-left: 1px solid #fff;
				border-bottom: 1px solid #fff;
				transform: rotate(-45deg);
				position: absolute;
				top: 3px;
				left: 3px;
			}

		.lg-form-check span {
			font-size: 14px;
		}

		.lg-form-check.lg-checked i {
			background: #23b365;
			border: 1px solid #23b365;
		}

			.lg-form-check.lg-checked i:before {
				display: block;
			}

		.lg-form-check:hover i {
			border: 1px solid #23b365;
		}

	.lg-form-check-box {
		display: flex;
	}


	.lg-form-switch {
		display: inline-block;
		position: relative;
		line-height: 22px;
		min-width: 45px;
		padding: 0 5px;
		margin: 0 0 0 10px;
		border: 1px solid #d2d2d2;
		border-radius: 20px;
		cursor: pointer;
		background-color: #fff;
		-webkit-transition: .1s linear;
		transition: .1s linear
	}

		.lg-form-switch i {
			position: absolute;
			left: 5px;
			top: 3px;
			width: 16px;
			height: 16px;
			border-radius: 20px;
			background-color: #d2d2d2;
			-webkit-transition: .1s linear;
			transition: .1s linear
		}

		.lg-form-switch span {
			position: relative;
			top: 0;
			width: 25px;
			margin-left: 21px;
			padding: 0 !important;
			text-align: center !important;
			color: #999 !important;
			font-style: normal !important;
			font-size: 12px
		}

	.lg-form-onswitch {
		border-color: #23b365;
		background-color: #23b365;
	}

		.lg-form-onswitch i {
			left: 100%;
			margin-left: -21px;
			background-color: #fff
		}

		.lg-form-onswitch span {
			margin-left: 0px;
			margin-right: 21px;
			color: #fff !important
		}

	.lg-form-select {
		position: relative;
		width: 100%;
	}

	.lg-select-title {
		position: relative;
	}

		.lg-select-title .lg-input {
			padding-right: 30px;
			white-space: nowrap;
			text-overflow: ellipsis;
			overflow: hidden;
		}

		.lg-select-title label {
			position: absolute;
			top: 5px;
			right: 5px;
			display: block;
			width: 26px;
			height: 26px;
			text-align: center;
			line-height: 26px;
			color: #999;
			cursor: pointer;
		}

	.lg-select-list {
		min-width: 100%;
		background: #fff;
		box-shadow: 1px 1px 4px rgb(0 0 0 / 8%);
		border-radius: 2px;
		border: 1px solid #eee;
		margin: 1px 0;
		padding: 5px 0;
		max-height: 200px;
		overflow: auto;
	}

		.lg-select-list .option {
			display: flex;
			align-items: center;
			min-height: 36px;
			line-height: 1.5;
			padding: 9px 10px;
			margin: 1px 0;
			border-radius: 2px;
			cursor: pointer;
			white-space: nowrap;
		}

			.lg-select-list .option:hover {
				background: #f9f9f9;
			}

			.lg-select-list .option.selected {
				background: #23b365;
				color: #fff;
			}

	.lg-multipleselect-list .option.selected {
		background: none;
		color: #23b365;
	}

		.lg-multipleselect-list .option.selected .lg-form-check i {
			background: #23b365;
			border: 1px solid #23b365;
		}

	.lg-like-input {
		display: flex;
		align-items: center;
	}

		.lg-like-input span {
			margin-right: 10px;
			background: #f2f2f2;
			padding: 3px 6px;
			border-radius: 2px;
		}

	.lg-select-list-position {
		min-width: 100%;
		position: absolute;
		top: 40px;
		left: 0;
		z-index: 4;
		animation: lg-select-upbit 0.3s forwards;
	}


	@keyframes lg-select-upbit {
		from {
			margin-top: 10px;
			opacity: 0;
		}

		to {
			margin-top: 0;
			opacity: 1;
		}
	}

	.lg-select-list .option .lg-form-check {
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
		width: 100%;
		margin: 0;
	}

	.lg-dress-select {
		background: #fff;
		box-shadow: 0 3px 6px rgba(0 0 0/18%);
		pointer-events: auto;
		display: inline-flex;
		flex-direction: column;
		border: 1px solid #eee;
		border-radius: 2px;
	}

	.lg-dress-btn {
		display: flex;
		justify-content: space-between;
	}

		.lg-dress-btn span {
			color: #737373;
			padding: 5px 10px;
			margin: 3px 5px;
			border-radius: 2px;
			cursor: pointer;
		}

	.lg-dress-list {
		display: flex;
		flex-direction: row;
		border-top: 1px solid #eee;
	}

	.lg-dress-depth {
		flex: 1;
	}

	.lg-dress-list ul {
		height: 160px;
		overflow: auto;
		overflow-x: hidden;
	}

		.lg-dress-list ul li {
			min-width: 111px;
		}

	.lg-dress-depth:nth-child(2),
	.lg-dress-depth:nth-child(3) {
		border-left: 1px solid #eee;
	}

	.lg-dress-select ul li {
		font-size: 14px;
		padding: 5px 24px 5px 8px;
		overflow: hidden;
		line-height: 22px;
		white-space: nowrap;
		text-overflow: ellipsis;
		cursor: pointer;
		transition: all .3s;
		position: relative;
	}

		.lg-dress-select ul li:hover {
			background: #f2f2f2;
		}

		.lg-dress-select ul li.selected {
			background: #fff9f0;
		}

		.lg-dress-select ul li span {
		}

			.lg-dress-select ul li span.fa {
				position: absolute;
				right: 8px;
				color: rgba(0, 0, 0, .45);
				font-size: 10px;
				line-height: 22px;
			}

	.lg-dress-selectul li.act span.txt {
		font-weight: bold;
	}

	.lg-dress-select .lg-dress-depth:nth-child(3) ul li span.fa {
		display: none;
	}


	.lg-input[type=range] {
		margin: 10px 0;
		padding-left: 0;
		height: 6px;
		/*横条的高度*/
		outline: none;
		-webkit-appearance: none;
		/*清除系统默认样式*/
		width: 100%;
		background: -webkit-linear-gradient(#23b365, #23b365) no-repeat, #ddd;
		background-size: 0% 100%;
		/*设置左右宽度比例*/
	}

		/*拖动块的样式*/
		.lg-input[type=range]::-webkit-slider-thumb {
			-webkit-appearance: none;
			/*清除系统默认样式*/
			height: 16px;
			/*拖动块高度*/
			width: 16px;
			/*拖动块宽度*/
			background: #fff;
			/*拖动块背景*/
			border-radius: 50%;
			/*外观设置为圆形*/
			border: solid 1px #ddd;
			/*设置边框*/
		}

	.lg-range-value {
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: relative;
		height: 16px;
		width: calc(100% - 25px);
		margin: 0 auto;
	}

		.lg-range-value p {
			display: none;
			width: 50px;
			text-align: center;
		}

		.lg-range-value .lg-range-value-text {
			display: block;
			position: absolute;
			top: 0;
			left: 50%;
			margin-left: -25px;
		}

	.lg-upload {
	}

	.lg-file-btn {
		border: 1px dashed #eee;
		display: flex;
		height: 38px;
		align-items: center;
		border-radius: 2px;
		margin-bottom: 10px;
		background: #fff;
		cursor: pointer;
	}

		.lg-file-btn .btn-file {
			width: 80px;
			text-align: center;
			line-height: 38px;
			font-size: 14px;
			cursor: pointer;
			color: #999;
		}

			.lg-file-btn .btn-file:before {
				margin-right: 10px;
			}

		.lg-file-btn:hover .btn-file {
			color: #23b365;
		}

	.lg-file-item {
		margin-bottom: 10px;
	}

	.lg-file-item-control {
		display: flex;
		align-items: center;
		justify-content: space-between;
		border: 1px dashed #eee;
		height: 38px;
		padding: 0 10px;
		background: #fff;
		position: relative;
	}

	.lg-file-item-text {
		display: flex;
		width: 90%;
		align-items: center;
		color: #737373;
	}

		.lg-file-item-text .file-icon {
			margin-right: 10px;
		}

		.lg-file-item-text .file-name {
			margin-right: 10px;
			cursor: pointer;
			white-space: nowrap;
			text-overflow: ellipsis;
			overflow: hidden;
		}

			.lg-file-item-text .file-name:hover {
				color: #23b365;
			}

	.lg-file-item-tool {
		flex-shrink: 0;
		width: 10%;
		display: flex;
		justify-content: end;
	}

		.lg-file-item-tool .file-del {
			cursor: pointer;
			text-align: center;
		}

			.lg-file-item-tool .file-del:hover {
				color: #23b365;
			}

	.lg-file-item progress[value] {
		width: 100%;
		height: 2px;
		padding: 0;
		margin: 0;
		border-radius: 0;
		background: gray;
		position: absolute;
		bottom: 0;
		left: 0;
	}

	.lg-file-item progress::-webkit-progress-bar {
		background-color: #eee;
	}

	.lg-file-item progress::-webkit-progress-value {
		background: #23b365;
	}

	.file-state.fa-check {
		color: #23b365;
	}

	.lg-file-item.lg-file-fail progress::-webkit-progress-value {
		background: #FF5722;
	}

	.lg-file-item.lg-file-fail .lg-form-tip {
		color: #FF5722;
	}

	.file-state.fa-close {
		color: #FF5722;
	}

	/*照片上传*/
	.lg-image-upload {
		display: flex;
		flex-wrap: wrap;
	}

	.lg-image-item {
		width: 145px;
		height: 180px;
		padding: 5px;
		border: 1px solid #eee;
		margin: 7px;
		overflow: hidden;
		position: relative;
	}

	.lg-form-image-alone .lg-image-item {
		margin: 7px 0
	}


	.lg-image-item .img {
		width: 100%;
		height: 100%;
		overflow: hidden;
	}

	.lg-image-item img {
		height: 100%;
		width: auto;
	}

	.lg-image-item .tools {
		position: absolute;
		top: 5px;
		left: 5px;
		width: calc(100% - 10px);
		height: calc(100% - 10px);
		background: rgba(0 0 0/50%);
		display: none;
		align-items: center;
		justify-content: center;
	}

		.lg-image-item .tools .del {
			position: absolute;
			top: 5px;
			right: 5px;
			font-size: 20px;
			color: #fff;
			cursor: pointer;
			opacity: 0.8;
		}

			.lg-image-item .tools .del:hover,
			.lg-image-item .tools .del:active {
				opacity: 1;
			}

		.lg-image-item .tools .rep {
			border: 1px solid #fff;
			color: #fff;
			padding: 3px 6px;
			border-radius: 5px;
			cursor: pointer;
		}

			.lg-image-item .tools .rep:hover,
			.lg-image-item .tools .rep:active {
				background: rgba(255 255 255/10%);
			}

	.lg-image-item:hover .tools {
		display: flex;
	}

	.lg-file-image-btn {
		border: 1px dashed #ccc;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
	}

		.lg-file-image-btn:hover {
			background: #f9f9f9;
		}

		.lg-file-image-btn span.fa {
			color: #ccc;
			text-align: center;
			font-size: 14px;
			line-height: 1.5;
		}

			.lg-file-image-btn span.fa:before {
				display: block;
				margin-bottom: 10px;
				font-size: 20px;
			}

	.lg-form-image-alone .lg-image-item {
		padding: 0;
	}

		.lg-form-image-alone .lg-image-item .img {
			position: absolute;
			top: 0;
			left: 0;
		}

	.lg-form-photo {
		width: 145px;
		height: 180px;
	}

	.lg-form-backgound {
		width: 192px;
		height: 380px;
	}

	.lg-form-intro {
	}

	.lg-form-intro-tips {
		border-left: 5px solid #23b365;
		background: #f5fdf5;
		padding: 10px;
	}

		.lg-form-intro-tips p {
			line-height: 1.5;
		}

	.lg-form-switch-check {
		padding: 0;
		margin: 0;
	}

	.lg-section {
		border-bottom: 1px solid #eee;
		margin-left: -10px;
		margin-right: -10px;
	}

	.lg-section-title {
		padding: 10px;
	}

		.lg-section-title span {
			display: inline-block;
			margin-right: 10px;
		}

			.lg-section-title span.cn {
				font-size: 20px;
				font-weight: bold;
			}

			.lg-section-title span.en {
				color: #999;
				font-size: 16px;
			}


	.lg-form-color {
		display: inline-block;
		width: auto;
	}

	input[type="color"] {
		border: 0;
		padding: 0;
		margin: 0;
		outline: none;
		background: none;
		width: 30px;
		height: 32px;
	}

	/*标签组*/
	.lg-tag-group {
		display: flex;
		flex-wrap: wrap;
	}

		.lg-tag-group .lg-tag-item {
			border: 1px dashed #ccc;
			margin-top: 6px;
			margin-right: 6px;
			padding: 0 6px;
			font-size: 14px;
			display: flex;
			align-items: center;
		}

			.lg-tag-group .lg-tag-item span {
			}

				.lg-tag-group .lg-tag-item span.fa {
					margin-left: 5px;
					cursor: pointer;
				}

					.lg-tag-group .lg-tag-item span.fa:hover {
						color: #23b365;
					}

		.lg-tag-group .lg-addTag {
			cursor: pointer;
			border: 0;
			border-radius: 3px;
			background: #23b365;
			color: #fff;
		}

			.lg-tag-group .lg-addTag span.fa {
				margin-right: 5px;
			}

		.lg-tag-group .lg-tag-item.lg-addTag:hover {
			opacity: 0.8;
		}

		.lg-tag-group .lg-tag-item.lg-addTag span.fa:hover {
			color: #fff;
		}


	/*field*/
	.lg-popup-title {
		line-height: 40px;
		font-size: 15px;
		font-weight: 600;
	}

	.lg-field {
		border: 1px solid #eee;
		border-bottom: 0;
		margin-bottom: 15px;
	}

		.lg-field legend {
			margin-left: 5px;
			background: #fff;
			padding: 0 5px;
			font-size: 16px;
		}

		.lg-field .lg-form-item {
			border-bottom: 1px solid #eee;
			border-radius: 0;
			margin-bottom: 0;
			padding: 6px 10px;
		}

		.lg-field .lg-form-title {
			font-weight: normal;
			font-size: 14px;
		}

	.lg-field-inline {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

		.lg-field-inline .lg-form-control {
			width: auto;
		}

	/*表单表格*/
	.lg-form-table-title {
		font-size: 16px;
		margin-bottom: 15px;
		padding-left: 10px;
		border-left: 4px solid#23b365;
	}

	.lg-form-table {
		width: 100%;
		overflow-x: auto;
	}

		.lg-form-table table {
			min-width: 100%;
			border: 1px solid #eee;
		}

		.lg-form-table th {
			background: #f2f2f2;
		}

		.lg-form-table td {
			padding: 3px 6px;
			border: 1px solid #eee;
			font-size: 12px;
			white-space: nowrap;
		}


	/*表单标识图标*/
	.lg-form-mark .lg-input {
		padding-left: 45px;
	}

	.lg-form-mark-icon {
		position: absolute;
		top: 0;
		left: 0;
		width: 36px;
		height: 36px;
		color: #999;
		text-align: center;
		line-height: 36px;
		border-right: 1px solid #eee;
	}


/*表单单个重置按钮*/
.lg-form-clear {
	position: absolute;
	right: 0;
	top: 0;
	width: 36px;
	height: 36px;
	color: #999;
	text-align: center;
	line-height: 36px;
	cursor: pointer;
	display: none;
}

.focus .lg-form-clear {
	display: block;
}

.lg-form-clear:hover {
	color: #23b365;
}

/*手机验证码*/
.lg-form-phone-code {
}

	.lg-form-phone-code .lg-relation-input .lg-inline:nth-child(1) {
		width: 100%;
		max-width: 182px;
	}

	.lg-form-phone-code .lg-relation-input .lg-inline:nth-child(2) {
		margin-right: 0;
	}

/*多级下拉*/
.lg-select-tree {
}

	.lg-select-tree li.option {
		display: block;
		padding: 0;
		min-height: unset;
	}

		.lg-select-tree li.option.lg-select-tip {
			padding: 9px 10px;
		}

	.lg-select-tree li .dp-option {
		display: flex;
		align-items: center;
		padding: 10px;
	}

	.lg-select-tree li label.fa {
		margin-right: 10px;
	}

	.lg-select-tree li.checked > .dp-option > label.fa {
		transform: rotate(90deg);
	}

	.lg-select-tree li.checked ul {
		display: block;
	}

.lg-select-dp1 {
	padding-left: 0px;
}

	.lg-select-dp1 li.option .dp-option {
		color: #999;
	}

.lg-select-dp2 {
	display: none;
	background: #fff;
}

	.lg-select-dp2 li.option .dp-option {
		padding-left: 20px;
		color: #666;
	}

.lg-select-dp3 {
	display: none;
	background: #fff;
}

	.lg-select-dp3 li.option .dp-option {
		width: 100%;
		padding-left: 40px;
		color: #333;
	}

.lg-select-dp2 li.option:hover {
	background: #f7f7f7;
}

	/*ul渲染*/
	.lg-form-extra-ul {
		display: flex;
		width: 100%;
	}

	.lg-form-extra-ul-wrap {
		flex-wrap: wrap;
	}

	.lg-form-extra-ul li {
		margin-bottom: 15px;
		flex: 1;
		font-size: 14px;
		line-height: 34px;
		text-align: center;
		border: 1px solid #ccc;
		cursor: pointer;
		flex-shrink: 0;
		position: relative;
		z-index: 1;
		margin-left: -1px;
	}

	.lg-form-extra-ul-wrap li {
		flex: unset;
		width: 33.33%;
	}

	.lg-form-extra-ul li.checked {
		background: #23b365;
		border: 1px solid #23b365;
		color: #fff;
	}

	/*表单布局---左右*/
	.lg-layout {
	}

	.lg-layout-row {
	}

		.lg-layout-row .lg-form-box {
		}

		.lg-layout-row .lg-form-item {
		}

	.lg-layout-row-auto .lg-form-item {
		margin-bottom: 0;
	}

	.lg-layout-row .lg-form-item .lg-form-block {
		display: flex;
	}

	.lg-layout-row .lg-form-item .lg-form-title {
		width: 120px;
		height: 38px;
		flex-shrink: 0;
		justify-content: end;
		align-items: center;
	}

	.lg-layout-row-auto .lg-form-item .lg-form-title {
		width: auto;
		max-width: 120px;
	}

	.lg-layout-row .lg-form-item .lg-form-title .lg-form-title-item {
		display: flex;
	}

	.lg-layout-row .lg-form-item .lg-form-title span {
		display: block;
	}

		.lg-layout-row .lg-form-item .lg-form-title span.cn {
			max-width: 70px;
			white-space: nowrap;
			text-overflow: ellipsis;
			overflow: hidden;
		}

		.lg-layout-row .lg-form-item .lg-form-title span.en {
			display: none;
		}

	.lg-layout-row .lg-form-item .lg-form-title i {
		display: block;
	}


	.lg-layout-row .lg-form-ver,
	.lg-layout-row .lg-form-tip {
		margin-left: 120px;
	}

	.lg-layout-row .lg-form-switch {
		margin-top: 6px;
		margin-right: 10px;
	}

	.lg-layout-row .lg-upload {
		width: 100%;
	}

	.lg-layout-row .lg-form-color {
		border: 1px solid #eee;
		height: 38px;
		padding: 0 10px;
		display: flex;
		align-items: center;
	}


	/*框形表单*/
	.lg-layout-row-pane {
	}

		.lg-layout-row-pane .lg-form-item .lg-form-title {
			border: 1px solid #eee;
			border-right: 0;
			background: #F9F9F9;
		}

		.lg-layout-row-pane .lg-form-item .lg-form-pane-border {
			border: 1px solid #eee;
		}

		/*框形表单特殊单项*/
		.lg-layout-row-pane .lg-form-item.pane .lg-form-ver,
		.lg-layout-row-pane .lg-form-item.pane .lg-form-tip {
			margin-left: 0px;
		}

		.lg-layout-row-pane .lg-form-item.pane .lg-form-block {
			display: flex;
			flex-direction: column;
		}

		.lg-layout-row-pane .lg-form-item.pane .lg-form-title {
			width: 100%;
			border: 1px solid #eee;
			border-bottom: 0;
			justify-content: start;
			padding-left: 16px;
		}

			.lg-layout-row-pane .lg-form-item.pane .lg-form-title span.cn {
				max-width: unset;
			}

		.lg-layout-row-pane .lg-form-item .lg-form-check-box {
			border: 1px solid #eee;
			min-height: 38px;
		}

		.lg-layout-row-pane .lg-form-radio, .lg-layout-row-pane .lg-form-check {
			margin: 0 6px 0 0;
		}

		.lg-layout-row-pane .lg-form-item.pane .lg-form-check-box {
			border: 1px solid #eee;
			padding: 10px;
		}

		.lg-layout-row-pane .lg-form-item.pane .lg-relation-input {
			margin-left: 0;
		}

		.lg-layout-row-pane .lg-form-item.pane .lg-upload,
		.lg-layout-row-pane .lg-form-item.pane .lg-tag-group {
			border: 1px solid #eee;
			padding: 10px;
		}

		.lg-layout-row-pane .lg-form-item.pane .lg-form-range {
			padding: 20px;
		}


	/*单项表单布局*/
	.lg-form-layout {
	}

	.lg-form-layout-row {
		display: flex;
		align-items: center;
	}

		.lg-form-layout-row .lg-form-title {
			flex-shrink: 0;
		}

		.lg-form-layout-row .lg-form-control {
			width: auto;
			max-width: 120px;
		}

	@media screen and (max-width:768px) {
		.lg-diy-head {
			display: none;
		}

		.lg-diy-sidebar {
			display: none;
		}

		.lg-diy-left {
			display: none;
		}

		.lg-diy-right {
			display: none;
		}

		.lg-form-background {
			padding: 10px;
		}

		.lg-form-flex {
			flex-wrap: wrap;
		}

			.lg-form-flex .lg-inline {
				margin-bottom: 10px;
				margin-right: 10px;
				text-align: center;
			}

		.break {
			line-height: 1;
		}
	}


	@media screen and (max-width:480px) {
		.lg-dress-select {
			width: 100%;
			min-height: 180px;
			position: fixed;
			bottom: 0;
			left: 0;
			box-shadow: 0 0 50px rgba(0 0 0/10%);
		}

		.lg-dress-btn {
			font-size: 16px;
		}

		.lg-dress-list {
			background: #f9f9f9;
		}

			.lg-dress-list ul {
				min-width: none;
			}

				.lg-dress-list ul li {
					min-width: 0;
				}

		.lg-dress-depth {
			width: 25%
		}

			.lg-dress-depth.act {
				width: 50%;
			}

		.lg-image-upload {
		}

			.lg-image-upload .lg-image-item {
				width: 87px;
				height: 108px;
				padding: 5px;
			}

				.lg-image-upload .lg-image-item .tools {
					display: flex;
				}

		.lg-image-item .tools .rep {
			padding: 3px;
			line-height: 1;
			font-size: 12px;
		}

		.lg-file-image-btn span.fa {
			font-size: 12px;
		}
	}

	.lg-form[skin='lg-form-theme-inline'] .lg-form-block {
		display: flex;
	}

		.lg-form[skin='lg-form-theme-inline'] .lg-form-block .lg-form-title {
			text-wrap: nowrap;
		}

	.lg-form[skin='lg-form-theme-inline'] .lg-input, .lg-form[skin='lg-form-theme-inline'] .lg-select, .lg-form[skin='lg-form-theme-inline'] .lg-textarea {
		min-width: none
	}