html {overflow-x: hidden;}
html, body, div {
  margin: 0;
  padding: 0;
  border: 0;
  outline: none;
}
body{
  display: block;line-height: 1;
  width: 100%;height: calc(100vh - 20px);
  background-image: url("/system_index/image/tb_bck20220706.png");
  background-size: cover;
  background-repeat: no-repeat;position: relative;
}
.logo_bck{width: 100%;height: 100px;margin-top: 20px;}
.logo_bck_f1{float: left;padding: 10px;background: rgb(0, 100, 255, .1);transform: skewX(-10deg);border-radius: 3px;}
.logo_bck_f2{float: left;padding: 10px;background: rgb(0, 100, 255, .7);}
.logo_txt{font-size: 2.0em;color: #FFF;font-family: '黑体';font-weight: 500;transform: skewX(10deg);border-radius: 3px;}


.container{background: #FFF;padding: 5px;border-radius: 5px;}
.section{background: #F1F2F3;border-radius: 5px;padding: 10px;}

.courseName {border: 1px solid #01AAED;border-left: 10px solid #01AAED;padding: 20px 10px;}

.course_list{border: 1px solid #01AAED;border-top: 0px;padding: 10px 10px 0px 10px;}
.course_list ul{list-style: unset;}
.course_list ul li{
  display: block;padding: 15px 20px;margin-bottom: 10px;
  border: 0px solid #ccc;border-radius: 5px;cursor: pointer;background: #ffffff;font-size: 1.1em;color: #01AAED;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.course_list ul li:hover{
  background: #0acffe;color: #FFFFFF;
}

.questionName {border: 1px solid #01AAED;border-left: 10px solid #01AAED;padding: 20px 10px;}
.question_list{border: 0px solid #01AAED;border-top: 0px;padding: 10px 10px 0px 10px;}
.question_list ul{list-style: unset;}
.question_list ul li{
  display: block;padding: 15px 20px;margin-bottom: 10px;
  border: 0px solid #ccc;border-radius: 5px;cursor: pointer;background: #ffffff;font-size: 1.1em;color: #01AAED;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.question_list ul li:hover{
  background: #0acffe;color: #FFFFFF;
}

.selected{
  background: #0acffe !important;color: #FFFFFF !important;
}
.course_media{width: 100%; height: 100%; object-fit: cover;}
.category_name {
  height: 63px;
  line-height: 63px;
  color: #18191C;
  font-size: 1.4em;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.service_sec{
  border: 1px solid #0acffe;border-radius: 5px;margin-bottom: 10px;
}
.service_btn{
  color: #FFFFFF;font-size: 1.1em;
  text-align: center;line-height: 38px;background: #01AAED;
  cursor: pointer;border-radius: 5px;
}
.service_itm{
  text-align: center;color: #666666;line-height: 30px;cursor:pointer;
}

.chat-history {
  height: 300px;margin-bottom: 10px;
  overflow: auto;overflow-x: hidden;
  background: #F1F2F3;
  border-radius: 5px;
  padding: 10px;
  /*display: table-cell;*/
  /*vertical-align: bottom;*/
}
.chat{
  max-width: 70%;padding: 10px 15px;border-radius: 20px;
  line-height: 20px;font-size: 1.2em;letter-spacing: 1px;margin-bottom: 15px
}
.tips_chat{
  clear: both;width: 100%;text-align: center;color: #01AAED;font-size: 12px;margin-bottom: 10px;
}
.our_chat{
  float: left;background-color: rgba(221,221,221,.6);color: #000000;
}
.your_chat{
  float: right;background-color: rgba(22,106,255,.8);color: #fff;
}
.chat_txt_sec{
  position: relative;height: 45px;padding: 10px 20px;border-radius: 20px;background: #FFFFFF;
}
.chat_voice{
  position: absolute;left: 15px;top: 50%;font-size: 3em;color: #01AAED;transform: translateY(-50%);cursor: pointer;
}
.icon_voice{width: 25px;height: 20px;float: left;}
.record_min{float: left;color: #FFFFFF;}
.chat_voice_dis{
  position: absolute;left: 15px;top: 20px;z-index: 10;font-size: 1em;color: #F25B5A;transform: translateY(-50%);cursor: pointer;display: none;
}
.chat_txt_ipt{
  /*position: relative;margin: auto;display: block;
  width: 55%;height: 43px;border: 0;font-size: 1.2em;text-align: center;*/
}
.chat_touch{
  position: relative;top: -47px;z-index: 100;margin: auto;display: none;
  width: 55%;height: 50px;border: 2px solid #FFFFFF;border-radius: 5px;
  font-size: 1.2em;line-height: 50px;text-align: center;
  background: #F1F2F3;
}
.chat_txt_send{
  /*position: absolute;right: 15px;top: 50%;zindex: 100;font-size: 3em;color: #01AAED;transform: translateY(-50%);cursor: pointer;*/
}
.chat_show_hide{
  position: absolute;right: 0px;width: 60px;height: 60px;border-radius: 50px;background: #01AAED;cursor: pointer;text-align: center;line-height: 60px;
}

.layui-form-item {
  margin-bottom: 10px;
  clear: both;
  *zoom: 1;
}
.layui-textarea {
  min-height: 70px;
  height: auto;
  line-height: 20px;
  padding: 6px 10px;
  resize: unset;
  border: 0px;
}

.ai_draw_img {max-width: 95%;border-radius: 5px;}

/**-滚动条样式  start-**/
.chat-history::-webkit-scrollbar-track {
  -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
  border-radius:10px;
  background-color:#F5F5F5;
}
.chat-history::-webkit-scrollbar {
  width:5px;
  height: 10px;
  background-color:#F5F5F5;
}
.chat-history::-webkit-scrollbar-thumb {
  border-radius:5px;
  -webkit-box-shadow:inset 0 0 6px hsla(0,0%,100%,.7);
  background-color:#000000;
}

.layui-textarea::-webkit-scrollbar-track {
   -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
   border-radius:10px;
   background-color:#F5F5F5;
}
.layui-textarea::-webkit-scrollbar {
  width:5px;
  height: 10px;
  background-color:#F5F5F5;
}
.layui-textarea::-webkit-scrollbar-thumb {
  border-radius:5px;
  -webkit-box-shadow:inset 0 0 6px hsla(0,0%,100%,.7);
  background-color:#000000;
}
/**-滚动条样式  end-**/
/**-音频播放-**/
.audio_play_public_sec{
  position: absolute;z-index: 99999;top: 20px;left: calc((100vw - 500px));display: none;
  width: 300px;height: 90px;background: rgb(241, 243, 244, .9);border-radius: 5px;
}
.audio_play_public_sec_clsbtn{
  position: absolute;z-index:100;top: 5px;right: 5px;cursor: pointer;
}
.audio_play_public_sec_question_s{
  padding: 15px 20px 5px 20px;
}
.audio_play_public_sec_question{
  color: #666;white-space:nowrap;width: 100%;overflow:hidden;text-overflow:ellipsis;
}
.audio_play_public_sec_p_e{
  width: 100%;
}