/* 公用样式 */
.iconfont{font-size: 18px;margin-right: 5px}
.header {
    width: 100%;
	min-width: 1200px;
    height: 70px;
    background: #fff;
    position: fixed;
    z-index: 9;
}
.content {
    /* padding-top: 70px; */
}
.aside {
    position: fixed;
    width: 150px;
    height: 100%;
    background: #282e3b;
}
.main .header .welHeader{
    width: 100%;
    position: relative;
}
.main .header .welHeader .logo{
    width: 6.6875rem;
    height: 4.375rem;
    display: flex;
    align-items: center;
    margin-left: 20px;
}
.main .header .welHeader .userMessage{
	/* margin-left: 40px; */
    height: 100%;
    position: absolute;
    top: 0;
    right: 3.125rem;
    display: flex;
    align-items: center;
}
.main .header .welHeader .userMessage span{
    font-size: 1rem;
    color: #666666;
}
.main .header .welHeader .userMessage p{
    font-size: 1rem;
    color: #333;
    display: inline-block;
    margin: 0 1.3125rem;
    cursor: pointer;
}
.main .header .welHeader .userMessage p > img{
    margin-left: .8125rem;
    margin-top: -2px;
}
.main .header .welHeader .userMessage .signOut{
    display: inline-block;
    margin-left: 1.25rem;
    cursor: pointer;
}
.main .header .welHeader .msgBox{
    width: 12.5rem;
    position: absolute;
    right: 1.0625rem;
    top: 3.75rem;
    text-align: center;
    background-color: #fff;
    border-radius: 4px;
  box-shadow: 0 0 10px 0 rgba(0,0,0,0.20);
    visibility: hidden;
    z-index: 999;
}
.main .header .welHeader .msgBox::before{
       content: "";
        position: absolute;
        display: block;
        left: 50%;
		margin-left: -10px;
        top: -10px;
        border-left: 10px solid transparent;
        width: 0;
        height: 0;
        border-bottom: 10px solid #FFFFFF;
        border-right: 10px solid transparent;
}
.main .header .welHeader .msgBox li a{
    display: block;
    padding: .625rem;
    height: 1.875rem;
    line-height: 1.875rem;
    transition: color 0.3s ease;
}
/* .main .header .welHeader .msgBox li a:hover{
    color: #1E9FFF;
} */

/* -----侧边栏----- */
.aside ul{
    margin-top: 10px;
}
.aside li a{
    color: #fff;
    margin: 0 auto;
    display: block;
    text-align: left;
    letter-spacing: 2px;
    padding: .9375rem  .9375rem .9375rem 2rem;
    transition: all 0.2s;
    position: relative;
    overflow: hidden;
	/* font-size: 20px; */
}
.aside li a .iconfont{
	font-size: 20px;
}
.aside li:hover > a{
    color: #1E9FFF;
    background-color: #1a222f;
}
.aside li:hover > a::after{
    opacity: 1;
}
.aside li a::after{
    content: " ";
    width: 5px;
    height: 100%;
    position: absolute;
    background-color: #1E9FFF;
    top: 5px;
    left: 0px;
    margin-top: -0.3125rem;
    opacity: 0;
    transition: all 0.2s;
}
.aside .active a{
    color: #1E9FFF;
    background-color: #1a222f;
}
.aside .active a::after{opacity: 1;}

/* 侧边栏结束 */
.article{
   /* width: 100%;
    min-height: 92.75%; */
    /* position: absolute; */
    /* left: 10%; */
}
/*  --------------------主要用户信息-------------------- */
.content .changeUser{
    width: 100%;
    left: 0;
	top: 0px;
    position: fixed;
    overflow: hidden;
    transition: height 0.3s ease;
    z-index: 22;
    border-top: .0625rem solid #e9e9e9;
	padding-bottom: 5px;
}
.content .userMessage{
    width: 100%;
    position: relative;
    overflow: hidden;
}
.content .userMessage .currentUser{
    width: 100%;
    height: 5rem;
    background-color: #fff;
    display: flex;
    align-items: flex-start;
    position: relative;
    border-bottom: 1px solid #dedede;
}
.content .userMessage .currentUser .usericon{
    display: inline-flex;
    width: 3.9375rem;
    height: 5rem;
    margin-left:.625rem;
    align-items: center;
}
.content .userMessage .currentUser .title{
    display: inline-block;
    margin-left: 1.25rem;
    margin-top: 1.0625rem;
}
.content .userMessage .currentUser .title .username .beizhu{
    font-style: normal;
}
.content .userMessage .currentUser .title .zhuangtai {
    display: inline-block;
    width: 3.5rem;
    height: 1.375rem;
    border-radius:.6875rem; 
    background-color: #36c310;
    font-size: .875rem;
    text-align: center;
    color: white;
}

.content .userMessage .currentUser .title .zhuangtai_offline {
    display: inline-block;
    width: 3.5rem;
    height: 1.375rem;
    border-radius:.6875rem;
    background-color: #e42626;
    font-size: .875rem;
    text-align: center;
    color: white;
}

.content .userMessage .currentUser .title .zhuangtai > span{
    display: inline-block;
    width: .375rem;
    height: .375rem;
    border-radius: .1875rem;
    background-color: white;
}
.content .userMessage .currentUser .zhangdan{
    position: absolute;
    top: 20px;
    right: 8rem;
    color: #666;
}
.content .userMessage .currentUser .zhangdan p{
    font-size: .875rem;
}
.content .userMessage .currentUser a{
    color: #e42626;
}
.content .userMessage .currentUser a:hover{
    text-decoration: none;
}

.content .userMessage .acordeon__head{
    position: absolute;
    right: 3.125rem;
    top: 20px;
    width: 3.125rem;
    height: 1.25rem;
    text-align: center;
    line-height: 1.25rem;
    font-size: 1rem;
    color: #1E9FFF;
    cursor: pointer;
}
.content .userMessage .acordeon__body {
    background: #1a252f;
    height: 0;
    transition: height .4s ease-in-out;
    position: relative;
  }
  .content .userMessage .acordeon__body__menu {
    list-style: none;
    border-bottom: 0.5px solid #dcdcdc;
  }
  .content .userMessage .acordeon__body__menu li .currentUser{
    position: relative;
    padding-left: 20px;
  }
  .content .userMessage .acordeon__body__menu li .currentUser:hover{
      background-color: #f8f8f8;
  }
  .content .userMessage .acordeon__body__menu li .currentUser .changeBtn{
      width: 5.625rem;
      height: 1.875rem;
      border: .0625rem solid #c6c6c6;
      text-align: center;
      line-height: 1.875rem;
      color: #666;
      font-size:12px;
      border-radius: .1875rem;
      position: absolute;
      right: 3.125rem;
      top: 1.5625rem;
      cursor: pointer;
  }
  .content .userMessage .acordeon__body__menu .currentUser .title h4{
      font-size: 14px;
  }
  .content .userMessage .acordeon__body__menu .currentUser .title p{
      font-size: 12px;
      margin-top: .625rem;
  }

/* --------------------主要用户信息-------------------- */
.content .userMessage .acordeon__head{
    position: absolute;
    right: 3.125rem;
    top: 20px;
    width: 3.125rem;
    height: 1.25rem;
    text-align: center;
    line-height: 1.25rem;
    font-size: 1rem;
    color: #1E9FFF;
    cursor: pointer;
}
.content .userMessage .acordeon__body {
    background: #1a252f;
    height: 0;
    transition: height .4s ease-in-out;
    position: relative;
  }
  .content .userMessage .acordeon__body__menu {
    list-style: none;
    border-bottom: 0.5px solid #dcdcdc;
  }
  .content .userMessage .acordeon__body__menu:after{
      content: " ";
      width: 100%;
      height: 1px;
      position: absolute;
      background-color: #dedede;
      bottom: 0;
      transform: scaleY(0.5);
  }
  .content .userMessage .acordeon__body__menu li .currentUser{
    position: relative;
    padding-left: 20px;
    border-bottom: 1px solid #dedede;
  }
  .content .userMessage .acordeon__body__menu li .currentUser:hover{
      background-color: #f8f8f8;
  }
  .content .userMessage .acordeon__body__menu li .currentUser .layui-btn{
      width: 5.625rem;
      border: .0625rem solid #c6c6c6;
      background-color: #fff;
      color: #666;
      font-size:12px;
      border-radius: .1875rem;
      position: absolute;
      right: 3.125rem;
      top: 1.5625rem;
  }
  .content .userMessage .acordeon__body__menu .currentUser .title h4{
      font-size: 14px;
  }
  .content .userMessage .acordeon__body__menu .currentUser .title p{
      font-size: 12px;
      margin-top: .625rem;
  }

/* --------------------主要用户信息结束-------------------- */

/* 启动开关 */
.layui-form-onswitch {
    background-color: #22b3eb;
    border-color: #22b3eb;
}
/* 弹窗遮罩层 */
.mask{
    width: 100%;
    background-color: rgba(0, 0, 0,0.5);
    /* position: absolute; */
    position: fixed;
	z-index: 26;
    top: 0%;
    left: 0;
    display: none;
}
#mask .maskBox{
    width: 100%;
    /* height: inherit; */
	height: 600px;
    position: relative;
}
/* 删除弹窗遮罩 */
.mask .maskBox .deleteMessage{
    width: 490px;
    height: 280px;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -140px;
    margin-left: -245px;
    border-radius: .3125rem;
    transition: all 0.3s;
}
.mask .maskBox .deleteMessage .title{
    height: 3.75rem;
    background-color: #f1f1f1;
    line-height: 3.75rem;
    padding: 0 28px;
    border-top-right-radius: .3125rem;
    border-top-left-radius: .3125rem;
}
.mask .maskBox .deleteMessage p{
    text-align: center;
    margin-top: 60px;
}
.mask .maskBox .deleteMessage .confirm{
    width: 110px;
	height: 36px;
    background-color: #1E9FFF;
    color: #fff;
}
.mask .maskBox .deleteMessage .cancel{
    width: 110px;
    height: 36px;
    color: #333333;
    border: solid 1px #d3d3d3;
    background-color: #fff;
}
.mask .maskBox .deleteMessage .btn{
    margin-top: 80px;
    text-align: center;
}

/* 素材库内容添加弹窗 */
.mask .addWindow{
    width: 750px;
    height: 850px;
    background-color: #fff;
    border-radius: .3125rem;
    /*position: absolute;*/
    /*top: 50%;*/
    /*left: 50%;*/
    /*margin-top: -425px;*/
    /*margin-left: -375px;*/
	/* top: 50%;
	margin-top: -375px; */
    margin-top: 100px;
    margin-left: 20%;
}
.mask .addWindow .title{
    padding: 1.25rem;
}
.mask .addWindow .title .close{
    float: right;
    clear: both;
    margin-top: -25px;
    transform: rotate(45deg);
    transition: all 0.3s;
    cursor: pointer;
}
.mask .addWindow .title .iconfont{
    font-size: 1.65rem;
    margin-right: 0;
}
.mask .addWindow .title .close:hover{
    transform: rotate(275deg)
}
.mask .addWindow .addContent{
    width: 640px;
    min-height: 200px;
    margin: 0 auto;
    margin-top: 1.25rem;
    text-align: center;
    border: 1px solid #e7e6eb; 
    position: relative;
}
.mask .addWindow .addContent .layui_addimg textarea{
	width: 100%;
	background: #f8f8f8;
	font-size: 0.875rem;
	padding: 1.025rem 1.2375rem;
	height:7.5rem;
	box-sizing: border-box;
}
.mask .addWindow .addContent .layui_addimg .addimg_t{border-bottom: 1px solid  #e7e6eb;width: 100%;text-align: right;}
.mask .addWindow .addContent .layui_addimg .addimg_t img{width: 17px;height: 17px;float: left;margin-left: 25px;margin-top: 5px;}
.mask .addWindow .addContent .layui_addimg .addimg_t .addimg_ts{font-size: 0.875rem;color:#b6b6b6;padding-right: 1.25rem;line-height: 1.875rem;display: inline-block;}
/* .mask .addWindow .addContent .layui_addimg .add_imgs{width: 11.625rem;height: 11.625rem;border: 1px solid #e8e7ec;background: #f8f8f8;} */
.mask .addWindow .addContent .layui_addimg .add_imgs{padding-top: 8px ;padding-left: 20px;height: 250px;overflow-y: scroll;}
.mask .addWindow .addContent .layui_addimg .add_imgs li{width:180px;height: 182px;margin: 0 22px 27px 0;border: 1px solid #e8e7ec;vertical-align: middle;}
.mask .addWindow .addContent .layui_addimg .add_imgs li:hover{box-shadow: 0 0 5px #21b3ed;}
.mask .addWindow .addContent .layui_addimg .add_imgs li img{border: 1px solid #e8e7ec;width: 100%;height: 100%;}
.mask .addWindow .addContent .layui_addimg .add_imgs .addimg{background: #f8f8f8;text-align: center;line-height: 182px;}
.mask .addWindow .addContent .layui_addimg .add_imgs .addimg img{width: 60px;height: 60px;border: none;}

.mask .addWindow .addContent textarea{
    width: 625px;
    padding: .625rem;
    border: 1px solid #e7e6eb; 
    border-top:0;
    border-left: 0;
    border-right: 0; 
    color: #999999;
}
.mask .addWindow .addContent .expression{
    text-align: left;
    padding: .625rem 1.25rem .625rem 1.25rem; 
    border-bottom: 1px solid #e7e6eb; 
    color: #999999;
}
.mask .addWindow .addContent .expression p{
    float: right;
}
.mask .addWindow .addContent ul{
    text-align: left;
    width: 100%;
}
.mask .addWindow .addContent ul li{
    width: 11.25rem;
    height: 11.25rem;
    display: inline-block;
    background-color: #1E9FFF;
    margin:20px 0 0 20px;
}
.mask .addWindow .addContent .uploadimg{
    width: 120px;
    height: 40px;
    margin-left: 1.25rem;
    margin-top: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    background-color: #1E9FFF;
}
.mask .addWindow .addContent .layui-form .layui-input-block .uploadimg{
    margin-left: 0;
}
.mask .addWindow .addContent .layui-form .layui-input-block input[type=text]:hover{
    box-shadow: 0 0 .3125rem #1E9FFF;
}
.mask .addWindow .addContent .layui-form .layui-input-block input[type=text]:focus{
    box-shadow: 0 0 .3125rem #1E9FFF;
    border: 1px solid #1E9FFF !important;
}

.mask .addWindow .addContent .anniu{
    position: absolute;
    left: 50%;
    bottom: -60px;
    margin-left: -100px;
}
.mask .addWindow .addContent .anniu .layui-btn{
    width: 6.25rem;
	height: 2.1875rem;
    border-radius: .375rem;
    line-height: 0;
    font-size: .75rem;
}
.mask .addWindow .addContent .layui-form{
    margin-top: 15px;
}
.mask .addWindow .addContent .anniu .determine{
    background-color: #1E9FFF;
}
.mask .addWindow .addContent .anniu .cancel{
    background-color: #fff;
    color: #333;
    border: solid 1px #e7e6eb;
    background-color: #fbfbfb;
}
/* 弹出层 */
/* 弹出页编辑弹出层 */
.editMask{
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0,0.7);
    display: none;
}
.editMask .editBox{
    width: 100%;
    height: 100%;
    position: relative;
}
/* 文字弹窗 */
.editMask .editBox .editTxt,
.editMask .editBox .editImg,
.editMask .editBox .editVoice,
.editMask .editBox .editLink,
.editMask .editBox .editMingp{
    width: 600px;
    min-height: 700px;
    background-color: #fff;
    border-radius: 6px;
    position: absolute;
    bottom: 15%;
    left: 50%;
    margin-left: -300px;
}
.editMask .editBox .editTxt{
    display: none;
}
.editMask .editBox .editImg{
    display: none;
    padding-bottom: 120px;
    box-sizing: border-box;
}
.editMask .editBox .editVoice{
    display: none;
    padding-bottom: 180px;
    box-sizing: border-box;
}
.editMask .editBox .editLink{
    display: none;
    padding-bottom: 180px;
    box-sizing: border-box;
}
.editMask .editBox .editMingp{
    display: none;
    padding-bottom: 180px;
    box-sizing: border-box;
}
/* 分页 */
.editMask .editBox .editMingp  .page,
.editMask .editBox .editImg  .page,
.editMask .editBox .editVoice  .page,
.editMask .editBox .editLink .page{
    position: absolute;
    right: 1.25rem;
    bottom: 120px;
    margin-top: 1.875rem
}



/* 添加图片 */
#test1{
    background-color: #1E9FFF;
}
.editMask .editBox .editOption{
    padding: .625rem 1.25rem;
    position: relative;
}
.editMask .editBox .editOption p{
    display: inline-flex;
    font-size: .875rem;
    color: #444;
    align-items: center;
}
.editMask .editBox .editOption p input[type=text]{
    width: 200px;
    height: 30px;
    border-radius: 4px;
    border: 1px solid #e9e9e9;
    padding-left: 25px;
    transition: all 0.2s;
    margin-left: 10px;
}
.editMask .editBox .editOption .search{
    position: absolute;
    left: 65px;
    transition: all 0.2s;
}
.editMask .editBox .editOption p input[type=text]:hover{
    box-shadow: 0 0 5px #1E9FFF;
}
.editMask .editBox .editOption p input[type=text]:focus{
    box-shadow: 0 0 5px #1E9FFF;
    border: 1px solid #1E9FFF;
}
.editMask .editBox .editOption p input[type=text]:focus + .search{
    color: #1E9FFF;
}

.editMask .editBox .active{
    border: 1px solid #1E9FFF !important;
    box-shadow: 0 0 3px #1E9FFF;
}
.editMask .editBox .editTitle{
    padding: 1.25rem;
    color: #333;
    font-size: 1rem;
    position: relative;
    display: flex;
    justify-content: space-between;
}
.editMask .editBox .editTitle::after{
    content: "";
    width: 90%;
    height: .0625rem;
    background-color: #e9e9e9;
    border: none;
    position: absolute;
    bottom: -0.3125rem;
    left: 5%;
}
.editMask .editBox .editTitle > .close{
    font-size: 1.55rem;
    float: right;
    transform: rotate(45deg);
    cursor: pointer;
}
.editMask .editTitle .close{
    float: right;
}
.editMask .editTitle .close:hover{
    transform: rotate(135deg);
    -ms-transform:rotate(135deg); /* IE 9 */
    -webkit-transform:rotate(135deg); /* Safari and Chrome */
}
.editMask .editTitle .close{
    transform: rotate(45deg);
    -ms-transform:rotate(45deg); /* IE 9 */
    -webkit-transform:rotate(45deg); /* Safari and Chrome */
    transition: all 0.3s;
    cursor: pointer;
}
.editMask .editTxt .inputTxt{
    text-align: center;
}
.editMask .editTxt .inputTxt textarea{
    width: 500px;
    padding: .625rem;
    margin-top: 20px;
    border: .0625rem solid #e9e9e9;
}
.editMask .editTxt .inputTxt .expression{
    width: 500px;
    padding: .625rem;
    border: .0625rem solid #e9e9e9;
    border-top: 0;
    margin: 0 auto;
    margin-top: -0.3125rem;
    display: flex;
    justify-content: space-between;
}
.editMask .editTxt .inputTxt .expression .iconfont{
    color: #999999;
    font-size: 1.125rem;
}
.editMask .editTxt .inputTxt .expression p{
    color: #999999;
    font-size:12px;
}
.editMask .editButton{
    left: 50%;
    margin-left: -100px;
    position: absolute;
    bottom: 30px;

}
.editMask .editButton button{
    width: 100px;
	height: 37px;
    border-radius: 6px;
    transition: all 0.2s;
}
.editMask .editButton .sure{
    background-color: #1E9FFF;
}
.editMask .editButton .cancel{
    background-color: #fbfbfb;
    border: solid 1px #e7e6eb;
    color: #666666;
}
.editMask .editButton .sure:hover,
.editMask .editButton .cancel:hover{
    box-shadow: 0 0 .3125rem #1E9FFF;
    border: .0625rem solid #1E9FFF;
}

.editImg .inputImg{
    padding: 1.25rem;
    margin: 0 .625rem;
}
.editImg .inputImg ul{
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    padding-bottom: 30px;
}
.editImg .inputImg ul li{
    display: inline-block;
    width: 100px;
    height: 120px;
    margin: 10px 17px;
}
.editImg .inputImg ul li .Images{
    width: 100%;
    height: 100%;
    position: relative;
    text-align: center;
    border: 1px solid #e9e9e9;
}
.editImg .inputImg ul li .Images img{
    width: 100%;
    display: block;
}
.editImg .inputImg ul li .Images span{
    width: 100%;
    display: block;
    position: absolute;
    bottom: 0;
    color: #999999;
}
.editMask .editBox .editImg  .page{
    bottom: 71px;
}

/* 添加语音 */
.editVoice .inputVoice{
    padding: 10px;
    margin: 0 .625rem;
}
.editVoice .inputVoice li{
    border-bottom: 1px solid #e9e9e9;
    display: flex;
    align-items: center;
    padding: 5px 0;
    position: relative;
}
.editVoice .inputVoice li .layui-form{
    display: inline-block;
    margin-left: 20px;
}
.editVoice .inputVoice li .voice{
    display: inline-block;
    width: 200px;
    height: 40px;
    background-color: #95ec69;
    border-radius: 10px;
    color: #666;
    padding-left: 10px;
    display: flex;
    align-items: center;
    cursor: pointer;
}
.editVoice .inputVoice li .voice .iconfont{
    transform: rotate(180deg)
}
.editVoice .inputVoice li .discription{
    position: absolute;
    right: 20px;
}
/* 添加链接 */
.editLink .inputLink{
    padding: 10px;
    margin: 0 .625rem;
}
.editLink .inputLink ul li{
    display: inline-block;
    margin-top: 5px;
    cursor: pointer;
}
.editLink .inputLink .link{
    width: 250px;
    height: 100px;
    padding: 10px;
    border: 1px solid #e9e9e9;
    position: relative;
    border-radius: 5px;
}

.editLink .inputLink .link p {
    font-size: 12px;
    color: #444;
}
.editLink .inputLink .link span{
    font-size: 10px;
    color: #999999;
    display: inline-block;
}
.editLink .inputLink .link .thumbnail{
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: absolute;
    right: 10px;
}
.editLink .inputLink .link .paragraph > img{
    width: 60px;
    height: 60px;
}
.editLink .inputLink .link .paragraph{
    width: 170px;
    height: 54px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    position: absolute;
    left: 10px;
    bottom: 10px;
}
/* 添加名片 */
.editMingp .inputMingp{
    padding: 10px;
    margin: 0 .625rem;
}
.editMingp .inputMingp ul li{
    display: inline-block;
    margin-top: 5px;
    margin-left: 6px;
    cursor: pointer;
}
.editMingp .inputMingp .Mingp{
    width: 250px;
    height: 100px;
    padding: 10px;
    border: 1px solid #e9e9e9;
    position: relative;
    border-radius: 5px;
}
.editMingp .inputMingp .Mingp .message{
    height: 80px;
    border-bottom: 1px solid #e9e9e9;
    position: relative;
}
.editMingp .inputMingp .Mingp .message .headicon{
    width: 60px;
    height: 60px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 3px;
    overflow: hidden;
}
.editMingp .inputMingp .Mingp .message .headicon > img{
    width: 60px;
    height: 60px;
}
.editMingp .inputMingp .Mingp .message p{
    height: min-content;
    display: block;
    font-size: 14px;
    color: #444;
    position: absolute;
    top: 10px;
    left: 80px;
}
.editMingp .inputMingp .Mingp .message .wxhao{
    height: min-content;
    display: block;
    position: absolute;
    top: 35px;
    left: 80px;
}
.editMingp .inputMingp .Mingp i{
    margin-left: 10px;
    font-size: 12px;
}

/* 弹出页编辑弹出层 */

/* 页面公共样式 */
/* 路径导航 */
.html_route {
    height: 2.75rem;
    padding-left: 1.25rem;
    line-height: 2.75rem;
    font-size: .875rem;
    background-color: white;
    margin-top: 1.25rem;
    border-top-left-radius: .3125rem;
    border-top-right-radius: .3125rem;
    position: relative;
}
.html_route a {
    /* color: #22b3eb; */
    color: #1E9FFF;
}
.html_route::after{
    content: "";
    width: 100%;
    height: .0625rem;
    border: none;
    background-color: #ededed;
    position: absolute;
    bottom: 0;
    left: 0;
}

	.operation{margin-left: 28px;}
	.operation img{width: 18px;height: 18px;vertical-align: middle;}
	.operation span{font-size: 14px;color: #B3B3B3;line-height: 18px;}
	.chbox{display: inline-block;margin-left: 28px;position: relative;cursor: pointer;font-size: 14px;color: #B3B3B3;}
	.chbox .cobox{background: #FFFFFF;position: absolute;left: 130px;top: -10px;padding: 20px;z-index: 1;box-shadow: 0 0 10px 0 rgba(0,0,0,0.10);}
	.chbox .cobox:after{content: "";position: absolute;display: block;left: -10px;top: 20px;border-bottom: 10px solid transparent;width: 0;height: 0;  
    border-right: 10px solid #FFFFFF;  
    border-top: 10px solid transparent;}
	.chbox img{width: 18px;height: 18px;}
	.chbox .cobox img{width: 160px;height: 160px;margin-bottom: 12px;}
	.chbox .cobox p{font-size: 18px;color: #333333;width: 100%;text-align: center;line-height: 1;}
	











/* 页面标题 */
.sendTask .title,
.groupForward .title,
.groupManage .title,
.keywords_reply .title,
.welcome .title,
.hongbao .title{
    height: 4.25rem;
    position: relative;
    padding: 1.25rem;
    background-color: #ffffff;
    margin-bottom: 1.25rem;
    border-bottom-left-radius: .3125rem;
    border-bottom-right-radius: .3125rem;
}
.sendTask .title p,
.groupForward .title p,
.groupManage .title p,
.keywords_reply .title p,
.welcome .title p,
.hongbao .title p{
    font-size: .875rem;
    margin-top: .625rem;
    color: #666;
}
.sendTask .title p span,
.groupForward .title p span,
.groupManage .title p span,
.keywords_reply .title p span,
.welcome .title p span,
.hongbao .title p span{
    color: #e42626;
}
.sendTask .title .layui-form,
.groupForward .title .layui-form,
.groupManage .title .layui-form,
.keywords_reply .title .layui-form,
.welcome .title .layui-form,
.hongbao .title .layui-form{
    position: absolute;
    right: 3%;
    top: 9px;
}

/* 个人名片 */
.mingpian{
    margin-top: 2.5rem;
    width: 21.6875rem;
    height: 6.75rem;
    padding:1.25rem;
    border: 1px solid #e9e9e9;
    border-radius: .3125rem;
    position: relative;
}
.mingpian p{
    width: 14.375rem;
    overflow: auto;
    margin-top: .625rem;
    color: #999999;
}
.mingpian h5{
    width: 250px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    text-overflow:ellipsis;
    overflow: hidden;
}
.mingpian span{
    position: absolute;
    top: 1.25rem;
    right: 1.25rem;
}

/* 返回按键 */
.back{
    cursor: pointer;
    display: block;
    margin-bottom: 1.25rem;
}
.back span{
    font-size: 1.25rem
}

/* 选择的好友 */
.wechatmsg {
    position: relative;
    padding: 1.25rem;
    border-radius: .3125rem;
    background-color: #fff;
    margin-bottom: 1.25rem;
}
.wechatmsg h5{
    margin-bottom: 1.25rem;
}
.wechatmsg h5 i{
    color: #e42626;
}
.wechatmsg .layui-btn{
    width: 5.625rem;
	height: 1.875rem;
	background-color: #ffffff;
	border-radius: 4px;
    border: solid 1px #cccccc;
    position: absolute;
    font-size: 14px;
    color: #333333;
    line-height: 0;
    padding: 0;
    top: 15px;
    left: 11.25rem;
}
.wechatmsg ul{
    margin-left: 2.5rem;
}
.wechatmsg ul li{
    width: 4.375rem;
    height: 4.375rem;
    display: inline-block;
    position: relative;
    border: .0625rem solid #e7e6eb;
    margin-right: 2.25rem;
    transition: all 0.3s;
}
.wechatmsg ul li:hover{
    border: 1px solid #1E9FFF;
    box-shadow: 0 0 .3125rem #22b3eb;
}
.wechatmsg li:hover > .close{
    color: #e63131;
}
.wechatmsg li img {
    display: inline-block;
}
.wechatmsg li .close{
    display: inline-block;
    position: absolute;
    top: -0.75rem;
    right: -1.25rem;
    cursor: pointer;
    transform: rotate(45deg);
    color: #999999;
    font-size: 24px;
    transition: all 0.2s;
}
.wechatmsg .buton_add_wechat{
    width: 4.375rem;
    cursor: pointer;
}
.wechatmsg .buton_add_wechat .iconfont{
    width: 4.375rem;
    height: 4.375rem;
    display:inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #f8f8f8;
}
.wechatmsg .buton_add_wechat p{
    font-size: .875rem;
    width: 4.375rem;
    overflow: hidden;
}



/* 单选框 发送设置、联系人、好友的选择 */
.radioBox{
    margin-top: 1.25rem;
}
.radioBox .layui-form-label{
    font-size: 1rem;
}
.radioBox .layui-form-radio>i:hover, .layui-form-radioed>i{
    color: #1E9FFF;
}
.radioBox .layui-form .layui-input-block{
    margin-left: 1.25rem;
}


/* select样式重置 */
.replyGroup .layui-form-select,
.keyWord .layui-form-select{
    width: 50%;
}
.replyGroup .layui-form  .layui-input-block,
.keyWord .layui-form .layui-input-block{
    margin-left: 1.25rem;
    min-height: 2.25rem;
}
.addWindow .layui-form .layui-input-block{
    margin-left: 4.25rem;
}
.replyGroup .layui-form .layui-form-item .layui-form-label,
.keyWord .layui-form .layui-form-item .layui-form-label,
.addWindow .layui-form .layui-form-item .layui-form-label{
    width: auto !important;
    text-align: left;
}
.layui-form-select dl dd.layui-this{
    background-color: #1E9FFF;
}



/* 媒体查询 */
@media screen and (max-width: 1430px) {
    .aside li a{
        padding: .9375rem .9375rem .9375rem 1rem;
    }
}

/* 新增头部修改样式 */
.newclearfix:before{content: "";display: table;}
.newclearfix:after{content: "";height: 0;visibility: hidden;clear: both;display: block;}
.user_nologin{width: 100%;background: #ffffff;padding: 10px 0 10px 10px;}
.user_nologin .no_ing{width: 60px;height: 60px;float: left;}
.user_nologin .no_notice{font-size: 17px;color: #666;line-height: 60px;float: left;margin-left: 20px;}
.user_login{padding: 10px 0 10px 10px;width: 100%;background: #ffffff;z-index: 1;}
.user_login .lo_img{width: 60px;height: 60px;float: left;}
.user_login .user_info{font-size: 17px;color: #000000;float: left;margin-left: 20px;padding-top: 7px;}
.user_login .user_wxid{font-size: 14px;color: #999999;margin-top: 2px;}
.user_login .user_state{display: inline-block;margin-left: 50px;padding: 3px 12px 3px 18px;background: #36C30F;border-radius: 15px;font-size: 12px;color: #FFFFFF;margin-top: 17px;position: relative;}
.user_login .user_state:before{content: '';width: 4px;height: 4px;border-radius: 100%;position: absolute;background: #ffffff;top: 9px;left: 10px;}
.user_login .user_oprate{float: right;margin-right: 50px;line-height: 60px;text-align: right;font-size: 14px;}
.user_login .user_oprate .user_time{color: #333;display: inline-block;margin-right: 10px;}
.user_login .user_oprate .user_xu{color: #FF584E;display: inline-block;cursor: pointer;}
.user_login .user_oprate .user_fen{color: #717171;display: inline-block;margin: 0 30px;cursor: pointer;}
.user_login .user_oprate .user_qie{color: #1E9FFF;display: inline-block;cursor: pointer;}
.user_duo{width: 100%;background: #ffffff;overflow: hidden;padding-bottom: 0;transition: all linear .3s;box-shadow: 0 7px 7px -7px #CCCCCC;box-sizing: border-box;display: flex;flex-wrap: wrap;}
.user_duo .user_duo_item{width: 28.0%;padding: 30px 0px 30px 30px;margin-left: 20px;border: 1px solid #EEEEEE;border-radius: 4px;float: left;position: relative;margin-bottom: 20px;}
.user_duo .user_duo_item .user_duo_img{width: 60px;height: 60px;display: inline-block;margin-right: 20px;}
.user_duo .user_duo_item .user_duo_info{font-size: 17px;color: #000000;display: inline-block;vertical-align: middle;width: 70%;}
.user_duo .user_duo_item .user_duo_time{color: #666666;font-size: 14px;padding-top: 6px;}
.user_duo .user_duo_item .user_duo_qie{color: #1E9FFF;font-size: 16px;vertical-align: middle;position: absolute;top: 48px;right: 20px;display: none;cursor: pointer;}
.user_duo .user_duo_item:hover{box-shadow: 0 0 5px 0 #1E9FFF;}
.user_duo .user_duo_item:hover .user_duo_qie{display: block;}

.func_tit{font-size: 14px;color: #666;margin-bottom: 10px;}
/* .func_box{} */
.func_box .func_item{width: 18%;margin-right: 20px;margin-bottom: 20px;background: #FFFFFF;text-align: center;padding: 24px 0;float: left;cursor: pointer;}
.func_box .func_item:hover{background: #f7f7f7;}
.func_box .func_item:nth-child(5n){margin-right: 0;}
.func_box .func_item img{width: 40px;height: 40px;display: inline-block;margin-bottom: 10px;}
.func_box .func_item .func_name{color: #333333;font-size: 14px;}



.user_state_offline {
    display: inline-block;
    margin-left: 50px;
    padding: 3px 12px 3px 18px;
    background: #e63131;
    border-radius: 15px;
    font-size: 12px;
    color: #FFFFFF;
    margin-top: 17px;
    position: relative;
}


.textarea:focus{
	box-shadow:0 0 5px #21b3ed ;
}
.textarea:hover{
	box-shadow:0 0 5px #21b3ed ;
}









