.yshChatAi {
	width: 1200px;
	height: 641px;
	margin: 0 auto 22px;
	border-radius: 20px;
	border: 2px solid #ffffff;
	transition: width .5s;
	align-items: flex-start
}

.yshChatAi .aiAreaLeft {
	width: 920px
}

.yshChatAi .aiAreaLeft .aiTitle {
	height: 70px;
	padding-left: 30px;
	line-height: 70px;
	border-bottom: 1px solid #ebebf5;
	font-weight: 700;
	font-size: 20px;
	color: #5b6277
}

.yshChatAi .aiAraeRight {
	position: relative;
	width: 296px;
	height: 657px
}

.yshChatAi .aiAraeRight img {
position: absolute;
    top: 6px;
    right: 12px;
    width: 296px;
    height: 620px;
}

.yshChatAi .conInput {
	position: relative;
	width: 840px;
	height: 60px;
	margin-top: 20px;
	box-shadow: 0 4px 12px #94b5d333;
	border-radius: 50px;
	transition: height .3s ease
}

.yshChatAi .conInput .el-input .el-input__wrapper {
	width: 100%;
	height: 60px;
	padding: 0 60px 0 32px;
	border-radius: 50px;
	font-size: 16px;
	background: #ffffff;
	--el-input-focus-border-color: 1px solid #346aff;
	box-shadow: none
}

.yshChatAi .charArea {
	height: 440px;
	background: #fff;
	border-radius: 12px
}

.yshChatAi .charArea ul {
	padding-right: 10px
}

.yshChatAi .charArea .loading .loading-image {
	width: 30px;
	height: 30px;
	-webkit-transform: rotate 360deg;
	animation: rotation 1s linear infinite;
	-moz-animation: rotation 1s linear infinite;
	-webkit-animation: rotation 1s linear infinite;
	-o-animation: rotation 1s linear infinite
}

.yshChatAi .charArea .messageAi {
	align-items: flex-start
}

.yshChatAi .charArea .messageAi>img {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	margin-right: 12px
}

.yshChatAi .charArea .messageAi>.messageAiBox {
	width: 840px
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml {
	padding: 16px 20px;
	font-size: 14px;
	color: #131313;
	position: relative;
	display: inline-block
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .chat-stat {
	font-size: 16px
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body {
	font-size: 16px;
	background: #fff!important;
	color: #131313
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body * {
	text-decoration: none;
	color: #131313
}

@keyframes blink {
	0% {
		opacity: .1
	}

	to {
		opacity: 1
	}
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body ul,.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body ol {
	padding: 5px 0 5px 20px
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body ul li,.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body ol li {
	position: relative;
	margin-bottom: 8px;
	line-height: 24px
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body ul li:after,.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body ol li:after {
	content: "";
	position: absolute;
	top: 7px;
	left: -18px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(0,0,0,.5)
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body h3 {
	padding-top: 10px;
	margin-bottom: 10px;
	font-size: 18px
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body>p {
	padding: 10px 0
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .markdown-body p {
	line-height: 24px;
	font-size: 16px
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .chat-grid-wrap {
	display: flex
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .chat-grid-wrap .emoji {
	width: 25px;
	height: 25px;
	vertical-align: middle
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .chat-grid-wrap .chat-grid-input {
	line-height: 25px
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml .chat-grid-wrap .zzh_hyperlink {
	color: #346aff!important;
	text-decoration: underline
}

.yshChatAi .charArea .messageAi>.flex_column .messageHtml * {
	margin: 0;
	padding: 0
}

.yshChatAi .chatBox {
	padding: 20px 40px
}

.yshChatAi .chatBox .loadCon {
	width: 100%;
	height: 440px
}

.yshChatAi .chatBox .loadCon .loadingBox {
	width: 200px;
	height: 80px
}

.yshChatAi .chatBox .loadCon .loadingBox img {
	width: 109px;
	height: 10px
}

.yshChatAi .chatBox .loadCon .loadingBox span {
	margin-top: 20px;
	line-height: 21px;
	font-weight: 500;
	font-size: 16px;
	color: #797f94
}

.yshChatAi .chatBox .empty {
	width: 100%;
	height: 440px;
	padding-top: 100px
}

.yshChatAi .chatBox .empty img {
	width: 197px;
	height: 172px
}

.yshChatAi .chatBox .empty span {
	margin-top: 6px;
	font-weight: 500;
	font-size: 16px;
	color: #797f94
}

.yshChatAi .chatBox .aiInput .inputRight {
	display: flex;
	align-items: center;
	position: absolute;
	bottom: 0;
	right: 6px;
	height: 60px
}

.yshChatAi .chatBox .aiInput .inputRight .send {
	width: 50px;
	height: 50px
}

.yshChatAi .chatBox .aiInput .inputRight .send.disable {
	cursor: not-allowed;
	pointer-events: none
}

@keyframes moveLeftToRight {
	0% {
		opacity: 1;
		transform: translate(0) scale(.6)
	}

	48% {
		opacity: .5;
		transform: translate(4.5px) scale(.9)
	}

	52% {
		opacity: .5;
		transform: translate(4.5px) scale(.9)
	}

	to {
		opacity: .2;
		transform: translate(12px) scale(.6)
	}
}

@keyframes moveRightToLeft {
	0% {
		opacity: .2;
		transform: translate(0) scale(.6)
	}

	48% {
		opacity: 0;
		transform: translate(-4.5px) scale(.3)
	}

	52% {
		opacity: 0;
		transform: translate(-4.5px) scale(.3)
	}

	to {
		opacity: 1;
		transform: translate(-12px) scale(.6)
	}
}

@-webkit-keyframes rotation {
	0% {
		-webkit-transform: rotate(0deg)
	}

	to {
		-webkit-transform: rotate(360deg)
	}
}

.chat[data-v-c76badd2] {
	padding-bottom: 50px
}

.chat .textItem[data-v-c76badd2]:last-child {
	margin-bottom: 30px;
	border: none
}

.chat .recommendedServices[data-v-c76badd2] {
	position: relative;
	padding-top: 30px;
	border-radius: 20px;
	background: #fff
}

.chat .recommendedServices .productTitle[data-v-c76badd2] {
	position: absolute;
	top: 20px;
	left: 30px;
	font-size: 20px;
	color: #fc4b37
}

.chat .recommendedServices .productTitle img[data-v-c76badd2] {
	width: 31px;
	margin-right: 12px
}

.chat .recommendedServices .top[data-v-c76badd2] {
	position: absolute;
	top: 20px;
	right: 30px;
	font-size: 20px;
	color: #fc4b37
}

.chat .recommendedServices .top[data-v-c76badd2]:hover {
	opacity: .6
}

.chat .recommendedServices .top img[data-v-c76badd2] {
	width: 20px;
	margin-right: 6px
}

.chat .viewDetail[data-v-c76badd2] {
	width: 130px;
	margin: 30px auto 0;
	font-size: 16px;
	color: #131313;
	cursor: pointer
}

.chat .viewDetail img[data-v-c76badd2] {
	width: 16px;
	height: 16px;
	margin-left: 10px
}

.chat .recommendedSkeleton[data-v-c76badd2] {
	display: flex;
	flex-wrap: wrap
}

.chat .recommendedSkeleton .el-skeleton__item[data-v-c76badd2] {
	width: 291px;
	height: 110px;
	border-radius: 10px;
	margin-bottom: 15px
}

.chat .recommendedSkeleton .el-skeleton__item[data-v-c76badd2]:nth-child(5n) {
	margin-right: 0
}