.courselive {
  width: 750rpx;
  height: 403rpx;
}

.functionalarea {
  display: flex;
  flex-flow: row wrap;
  align-content: flex-start;
  width: 750rpx;
  height: 550rpx;
}

.areaitem {
  margin-top: 60rpx;
  text-align: center;
  width: 33%;
  height: 170rpx;
}

.areaitem image {
  width: 120rpx;
  height: 170rpx;
}

.messagearea text {

  display: block;
  font-size: 40rpx;
  font-weight: 600rpx;
  margin-left: 60rpx;
}

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

.headleft {
  margin-left: 60rpx;
  margin-top: 50rpx;
  width: 140rpx;
  height: 140rpx;
  border-radius: 50%;
  overflow: hidden;
}

.headleft image {

  width: 130rpx;
  height: 133rpx;
}

.headright {
  margin-top: 80rpx;
  margin-left: 23rpx;
  width: 200rpx;
  height: 142rpx;
}

.headrightup text {

  font-size: 30rpx;
  font-weight: 400rpx;
}

.headrightdown {
  font-size: 30rpx;
  margin-top: 10rpx;
}

.msseagemiddle {
  margin: 0 60rpx;
}

.mssagemiddledown {
  margin: 25rpx auto;
}

.mssagemiddledown image {

  width: 100%;
  height: 265rpx;
}

.mssagemiddledownone image {
    width: 100%;
  }

.messageend {

  margin: 0 60rpx;
  display: flex;
  flex-direction: row;
  justify-content: space-between;

}

.messageendleft {
  width: 150rpx;
  height: 30rpx;
}

.messageendleft image {
  width: 100rpx;
  height: 30rpx;
}

.messageendmiddle {
  width: 150rpx;
  height: 30rpx;
}

.messageendmiddle image {
  width: 35rpx;
  height: 30rpx;
}

.messageendmiddle text {

  font-size: 28rpx;
  padding-left: 23rpx;
}

.messageendright {

  width: 150rpx;
  height: 30rpx;
}

.messageendright image {
  width: 35rpx;
  height: 30rpx;

}

.messageendright text {

  font-size: 28rpx;
  padding-left: 23rpx;
}

.feigexian {

  margin: 0 60rpx;
  margin-top: 60rpx;
  border-bottom: 2rpx solid #ada2a2;
}

.areaclass {

  width: 540rpx;
  height: 193rpx;
  margin: 0 auto;
  margin-top: 80rpx;
  background-color: #f0f0f1;
  border-radius: 5%;
}

.areafooter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 540rpx;
  height: 60rpx;
  margin: 0 auto;
  margin-top: 10rpx;
}

.areafooterleft image {

  width: 26rpx;
  height: 26rpx;

}

.areafooterright text {
  font-size: 28rpx;
  font-weight: 600;
  color: #217ced;
}

.vipimage image {
  width: 37rpx;
  height: 33rpx;
  position: relative;
  left: -32rpx;
  top: 148rpx;
}

/* 社区头部 */
.communityhead {

  width: 690rpx;
  height: 210rpx;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  display: none;
}

.communityheadleft {

  width: 75rpx;
  height: 195rpx;
  background-size: 100% 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.communityheadleft image{

  width: 75rpx;
  height: 195rpx;
}
.communityheadmiddle{
  width: 450rpx;
  height: 195rpx;
  border-radius: 5%;
  margin-left:20rpx;
  background-color: #D3FDFF;
}
.communityheadmiddle text{
  display: block;
   color:#02BBC2;
   font-size: 28rpx;
   font-weight: 400;
   padding-top:32rpx;
   padding-left: 32rpx;
}

.containerclass{

  display: flex;
  display: none;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  width: 690rpx;
  height: 180rpx;
  margin-top:65rpx;
  margin-bottom:50rpx;
  border: 1rpx solid #d6cfcf;
  border-radius: 2%;
  box-shadow: 3px 3px 3px 3px rgb(236, 234, 234);
}
.containerclass image{
   margin-left: 20rpx;
  width: 89rpx;
  height: 108rpx;
  margin-right: 20rpx;
}

.communityheadright {
  width: 140rpx;
  height: 195rpx;
  margin-left: 20rpx;
}
.communityheadright image {
  width: 140rpx;
  height: 195rpx;
}

.communityheadleftitem1 {
  width: 240rpx;
  margin-left: 55rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.communityheadleftitem2 {
  width: 80rpx;
  height: 180rpx;
}

.communityheadleftitem2 image {
  width: 80rpx;
  height: 175rpx;
}

.messageitem {
  width: 240rpx;
  height: 38rpx;
  /* border: 1rpx solid #1ccfd6; */
  color: #1ccfd6;
  margin-bottom: 10rpx;
  text-align: center;
  overflow: hidden;
}

/* 社区头部 */

/* 社区滑动 */
.curriculumup {
  width: 680rpx;
  height: 55rpx;
  margin: 0 auto;
  margin-top: 40rpx;
  display: none;
}

.curriculumupstart {
  float: left;
  width: 680rpx;
  height: 55rpx;
}

.curriculumupend {
  float: left;
  width: 50rpx;
  height: 50rpx;
}

.scroll-box {
  white-space: nowrap;
  height: 100%;
}

.card-box {
  display: inline-block;
  margin-right: 10rpx;
}

.card image {
  height: 55rpx;
  line-height: 55rpx;
  width: 211rpx;
}

.lineclass {
  width: 685rpx;
  margin: 2rpx auto;
  border-bottom: 1rpx solid #dcdcdc;
}

/* 社区滑动 */

/* 补充留言信息右边 */
.itemright {
  width: 200rpx;
  margin-top: 50rpx;
  margin-left: 30rpx;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.itemright image {

   margin-left: 10rpx;
   width: 70rpx;
   height: 35rpx;
}

/* 补充留言信息右边 */

.header_view_hide{
  display: none;
}
.header_view_show{
   display: block;
}

.round-click{
  height: 61rpx;
  width: 54rpx;
  position: fixed;
  bottom: 150rpx;
  right: 20rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9;
}
.round-click image{
  height: 61rpx; 
  line-height: 61rpx;
  width: 54rpx;
}
 
.areaclass{
  width: 540rpx;
  min-height: 300rpx;
  margin: 0 auto;
  margin-top: 80rpx;
  background-color: #f0f0f1;
  border-radius: 5%;
}
.areaclass textarea{
  width: 540rpx;
  min-height: 300rpx;
}


.areafooter{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 540rpx;
  height: 60rpx;
  margin: 0 auto;
  margin-top: 10rpx;
}
.areafooterleft image{

  width: 52rpx;
  height: 52rpx;

}
.areafooterright text{
   font-size: 28rpx;
   font-weight: 600;
   color: #217ced;
}
.areafooterright{
  width: 120rpx;
  height: 56rpx;
}
.areafooterright button{

  width: 120rpx;
  height: 50rpx;
  line-height: 50rpx;
  font-size: 28rpx;
  font-weight: 600;
  color: #217ced;
  border:none;
}