.message_pop{position:fixed; z-index:15; background:#fff; width:500px; top:50%; left:50%; transform:translate(-50%, -50%); transition:all 0.5s; opacity:0; visibility:hidden;}
.message_pop.active{opacity:1; visibility:visible;}
.message_pop_bg{position:fixed; z-index:14; background:rgba(0,0,0,0.4); width:100%; height:100%; transition:all 0.5s; opacity:0; visibility:hidden;}
.message_pop_bg.active{opacity:1; visibility:visible; top:0;}
.message_pop .message_pop_close{position:absolute; top:20px; right:10px; width:15px; height:17px; display:block;}
.message_pop .message_pop_close span.line{width:2px; height:20px; background:#9b9b9b; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%) rotate(-45deg);}
.message_pop .message_pop_close span.line:nth-child(2){transform:translate(-50%, -50%) rotate(45deg);}
.message_pop .message_pop_title{padding:50px 0; text-align:center;}
.message_pop .message_pop_title h2{font-size:22px; color:#666666;}
.message_pop .message_pop_title h2 span.name{color:#222222;}
.message_pop .message_pop_tab{display:flex; border-bottom:1px solid #e4e4e4;}
.message_pop .message_pop_tab > li{width:33.3333%; position:relative; text-align:center;}
.message_pop .message_pop_tab > li::after{content:""; width:100%; height:1px; background:#01bcd0; position:absolute; bottom:-1px; left:0; display:none;}
.message_pop .message_pop_tab > li.active::after{display:block;}
.message_pop .message_pop_tab > li > a{display:block; font-size:15px; color:#666666; line-height:40px;}
.message_pop .message_pop_tab > li.active > a{color:#01bcd0;}
.message_pop .message_pop_content{background:#f3f3f3; padding:20px 20px 50px 20px;}
.message_pop .message_pop_content .message_pop_cont{display:none;}
.message_pop .message_pop_content .message_pop_cont.active{display:block;}
.message_pop .message_pop_content .message_pop_head{margin-bottom:15px;}
.message_pop .message_pop_content .message_pop_head.center{text-align:center;}
.message_pop .message_pop_content .message_pop_head.center h5{font-size:14px; color:#666666;}
.message_pop .message_pop_content .message_pop_head.center h5 span.bold{font-weight:400; color:#222222;}
.message_pop .message_pop_content .message_pop_body{}
.message_pop .message_pop_content .message_pop_body ul.message_ul{}
.message_pop .message_pop_content .message_pop_body ul.message_ul li{display:block; margin-bottom:10px; background:#fff; padding:15px 20px; box-shadow:4px 3px 20px 0 rgba(50,50,50,0.07);}
.message_pop .message_pop_content .message_pop_body ul.message_ul li:last-child{margin-bottom:0;}
.message_pop .message_pop_content .message_pop_body ul.message_ul li > a{display:flex; justify-content:space-between; font-size:14px; color:#666666; line-height:1.5; height:1.5em;}
.message_pop .message_pop_content .message_pop_body ul.message_ul li > a span{display:block;}
.message_pop .message_pop_content .message_pop_body ul.message_ul li > a span.subject{overflow:hidden; text-overflow:ellipsis; width:50%;
display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical;  }
.message_pop .message_pop_content .message_pop_body .list-page{margin:30px auto 0 !important;}
.message_pop .message_pop_content .message_pop_body .pagination{}
.message_pop .message_pop_content .message_pop_head.write{display:flex; padding:15px 20px; background:#fff; box-shadow:4px 3px 20px 0 rgba(50,50,50,0.07);
align-items:center;}
.message_pop .message_pop_content .message_pop_head.write .left_text{width:70px; position:relative; font-size:14px; color:#222222;}
.message_pop .message_pop_content .message_pop_head.write .left_text::after{content:""; width:1px; height:13px; background:#acacac; position:absolute; right:0; top:2px;}
.message_pop .message_pop_content .message_pop_head.write .right_text{width:calc(100% - 70px); padding-left:20px;}
.message_pop .message_pop_content .message_pop_head.write .right_text input{width:100%; border:0; font-size:14px; color:#252525;}
.message_pop .message_pop_content .message_pop_head.write .right_text input::placeholder{color:#666666;}
.message_pop .message_pop_content .message_pop_body{}
.message_pop .message_pop_content .message_pop_body textarea{background:#fff; width:100%; height:200px; overflow:hidden; overflow-y:auto; box-shadow:4px 3px 20px 0 rgba(50,50,50,0.07); outline:none;
resize:none; padding:20px; font-size:14px; color:#252525; line-height:1.6;}
.message_pop .message_pop_content .message_pop_body textarea::placeholder{color:#999;}
.message_pop .message_pop_content .message_pop_body .message_btn{margin-top:45px; text-align:center;}
.message_pop .message_pop_content .message_pop_body .message_btn button{/*display:block;*/ width:100px; height:40px; line-height:40px; font-size:14px; color:#ffffff; font-weight:bold;
border:0; outline:none; box-shadow:none; background:#01bcd0; margin:0 auto; letter-spacing:5px;}
.message_pop .message_pop_content .message_pop_body .message_btn button.list { background:#707070; }
.message_pop .message_pop_view{display:none; background:#f5f5f5; padding:20px 20px 50px 20px}
.message_pop .message_pop_view .message_view_head{display:flex; justify-content:space-between; margin-bottom:20px; align-items:center; font-size:14px; color:#666666; white-space:nowrap;}
.message_pop .message_pop_view .message_view_head .bold{font-weight:400; color:#222222;}
.message_pop .message_pop_view .message_view_body{display:block; background:#fff; box-shadow:4px 3px 20px 0 rgba(50,50,50,0.07); overflow:hidden; overflow-y:auto; height:200px;
padding:20px;}
.message_pop .message_pop_view .message_view_body p{font-size:14px; color:#666666; line-height:1.6;}
.message_pop .message_pop_view .message_view_btn{margin-top:15px;}
.message_pop .message_pop_view .message_view_btn .message_delete{text-align:right;}
.message_pop .message_pop_view .message_view_btn .message_delete > a{display:inline-block; font-size:14px; color:#666666; padding-bottom:5px; border-bottom:1px solid #adadad;}
.message_pop .message_pop_view .message_view_btn .message_user{margin-top:15px; justify-content:center; align-items:center; display:flex;}
.message_pop .message_pop_view .message_view_btn .message_user > a{display:block; width:80px; height:40px; line-height:38px; text-align:center; background:#01bcd0; color:#fff;
font-weight:bold; font-size:14px; letter-spacing:5px;}
.message_pop .message_pop_view .message_view_btn .message_user > a.list{margin-left:10px; background:#707070;}

@media (max-width:768px){
	.message_pop{width:calc(100% - 30px); left:15px; transform:translateY(-50%);}
}
@media (max-width:480px){
	.message_pop .message_pop_close{position:absolute; top:15px; right:10px; width:12px; height:12px; }
	.message_pop .message_pop_close span.line{width:1px; height:14px;}
	.message_pop .message_pop_title{padding:30px 0;}
	.message_pop .message_pop_title h2{font-size:16px;}
	.message_pop .message_pop_tab > li > a{font-size:14px; line-height:35px;}
	.message_pop .message_pop_content{padding:15px 15px 30px 15px;}
	.message_pop .message_pop_content .message_pop_head{margin-bottom:15px;}
	.message_pop .message_pop_content .message_pop_head.center h5{font-size:13px; }
	.message_pop .message_pop_content .message_pop_body ul.message_ul li{margin-bottom:5px; padding:10px;}
	.message_pop .message_pop_content .message_pop_body ul.message_ul li > a{font-size:12px; line-height:1.5; height:1.5em;}
	.message_pop .message_pop_content .message_pop_body ul.message_ul li > a span.subject{width:70%;}
	.message_pop .message_pop_content .message_pop_body .list-page{margin:20px auto 0 !important;}
	.message_pop .message_pop_content .message_pop_head.write{padding:10px 15px;}
	.message_pop .message_pop_content .message_pop_head.write .left_text{width:60px; font-size:12px;}
	.message_pop .message_pop_content .message_pop_head.write .left_text::after{height:12px; top:2px;}
	.message_pop .message_pop_content .message_pop_head.write .right_text{width:calc(100% - 60px); padding-left:15px;}
	.message_pop .message_pop_content .message_pop_head.write .right_text input{font-size:12px;}
	.message_pop .message_pop_content .message_pop_body textarea{height:150px; padding:15px; font-size:12px;}
	.message_pop .message_pop_content .message_pop_body .message_btn{margin-top:20px;}
	.message_pop .message_pop_content .message_pop_body .message_btn button{width:80px; height:35px; line-height:32px; font-size:13px; letter-spacing:3px;}
	.message_pop .message_pop_view{display:none; background:#f5f5f5; padding:15px 15px 35px 15px}
	.message_pop .message_pop_view .message_view_head{margin-bottom:15px; font-size:13px; }
	.message_pop .message_pop_view .message_view_body{height:150px;	padding:15px;}
	.message_pop .message_pop_view .message_view_body p{font-size:12px; }
	.message_pop .message_pop_view .message_view_btn{margin-top:15px;}
	.message_pop .message_pop_view .message_view_btn .message_delete > a{font-size:12px; padding-bottom:3px;}
	.message_pop .message_pop_view .message_view_btn .message_user{margin-top:10px; }
	.message_pop .message_pop_view .message_view_btn .message_user > a{width:60px; height:35px; line-height:32px; font-size:13px; letter-spacing:3px;}
	.message_pop .message_pop_view .message_view_btn .message_user > a.list{margin-left:5px;}
}

.message_pop_view ul { max-height:300px; overflow:scroll;}
.message_pop_view li .info {padding:5px 0;}
.message_pop_view li .info.time { font-size:12px; }
.message_pop_view li .balloon { border-radius:5px; padding:3px 6px; }
.message_pop_view li.recv { text-align:left; }
.message_pop_view li.recv .balloon {display:inline-block; background:#000; color:#fff; line-height:1.6}
.message_pop_view li.send { text-align:right; }
.message_pop_view li.send .balloon {background:#01bcd0; color:#fff;}

.message_pop .loader {
	margin: 100px auto;
	font-size: 16px;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	position: relative;
	text-indent: -9999em;
	-webkit-animation: load5 1.1s infinite ease;
	animation: load5 1.1s infinite ease;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
}
@-webkit-keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -2.6em 0em 0em #8f8f8f, 1.8em -1.8em 0 0em rgba(143,143,143, 0.2), 2.5em 0em 0 0em rgba(143,143,143, 0.2), 1.75em 1.75em 0 0em rgba(143,143,143, 0.2), 0em 2.5em 0 0em rgba(143,143,143, 0.2), -1.8em 1.8em 0 0em rgba(143,143,143, 0.2), -2.6em 0em 0 0em rgba(143,143,143, 0.5), -1.8em -1.8em 0 0em rgba(143,143,143, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.7), 1.8em -1.8em 0 0em #8f8f8f, 2.5em 0em 0 0em rgba(143,143,143, 0.2), 1.75em 1.75em 0 0em rgba(143,143,143, 0.2), 0em 2.5em 0 0em rgba(143,143,143, 0.2), -1.8em 1.8em 0 0em rgba(143,143,143, 0.2), -2.6em 0em 0 0em rgba(143,143,143, 0.2), -1.8em -1.8em 0 0em rgba(143,143,143, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.5), 1.8em -1.8em 0 0em rgba(143,143,143, 0.7), 2.5em 0em 0 0em #8f8f8f, 1.75em 1.75em 0 0em rgba(143,143,143, 0.2), 0em 2.5em 0 0em rgba(143,143,143, 0.2), -1.8em 1.8em 0 0em rgba(143,143,143, 0.2), -2.6em 0em 0 0em rgba(143,143,143, 0.2), -1.8em -1.8em 0 0em rgba(143,143,143, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.2), 1.8em -1.8em 0 0em rgba(143,143,143, 0.5), 2.5em 0em 0 0em rgba(143,143,143, 0.7), 1.75em 1.75em 0 0em #8f8f8f, 0em 2.5em 0 0em rgba(143,143,143, 0.2), -1.8em 1.8em 0 0em rgba(143,143,143, 0.2), -2.6em 0em 0 0em rgba(143,143,143, 0.2), -1.8em -1.8em 0 0em rgba(143,143,143, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.2), 1.8em -1.8em 0 0em rgba(143,143,143, 0.2), 2.5em 0em 0 0em rgba(143,143,143, 0.5), 1.75em 1.75em 0 0em rgba(143,143,143, 0.7), 0em 2.5em 0 0em #8f8f8f, -1.8em 1.8em 0 0em rgba(143,143,143, 0.2), -2.6em 0em 0 0em rgba(143,143,143, 0.2), -1.8em -1.8em 0 0em rgba(143,143,143, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.2), 1.8em -1.8em 0 0em rgba(143,143,143, 0.2), 2.5em 0em 0 0em rgba(143,143,143, 0.2), 1.75em 1.75em 0 0em rgba(143,143,143, 0.5), 0em 2.5em 0 0em rgba(143,143,143, 0.7), -1.8em 1.8em 0 0em #8f8f8f, -2.6em 0em 0 0em rgba(143,143,143, 0.2), -1.8em -1.8em 0 0em rgba(143,143,143, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.2), 1.8em -1.8em 0 0em rgba(143,143,143, 0.2), 2.5em 0em 0 0em rgba(143,143,143, 0.2), 1.75em 1.75em 0 0em rgba(143,143,143, 0.2), 0em 2.5em 0 0em rgba(143,143,143, 0.5), -1.8em 1.8em 0 0em rgba(143,143,143, 0.7), -2.6em 0em 0 0em #8f8f8f, -1.8em -1.8em 0 0em rgba(143,143,143, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.2), 1.8em -1.8em 0 0em rgba(143,143,143, 0.2), 2.5em 0em 0 0em rgba(143,143,143, 0.2), 1.75em 1.75em 0 0em rgba(143,143,143, 0.2), 0em 2.5em 0 0em rgba(143,143,143, 0.2), -1.8em 1.8em 0 0em rgba(143,143,143, 0.5), -2.6em 0em 0 0em rgba(143,143,143, 0.7), -1.8em -1.8em 0 0em #8f8f8f;
  }
}
@keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -2.6em 0em 0em #8f8f8f, 1.8em -1.8em 0 0em rgba(143,143,143, 0.2), 2.5em 0em 0 0em rgba(143,143,143, 0.2), 1.75em 1.75em 0 0em rgba(143,143,143, 0.2), 0em 2.5em 0 0em rgba(143,143,143, 0.2), -1.8em 1.8em 0 0em rgba(143,143,143, 0.2), -2.6em 0em 0 0em rgba(143,143,143, 0.5), -1.8em -1.8em 0 0em rgba(143,143,143, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.7), 1.8em -1.8em 0 0em #8f8f8f, 2.5em 0em 0 0em rgba(143,143,143, 0.2), 1.75em 1.75em 0 0em rgba(143,143,143, 0.2), 0em 2.5em 0 0em rgba(143,143,143, 0.2), -1.8em 1.8em 0 0em rgba(143,143,143, 0.2), -2.6em 0em 0 0em rgba(143,143,143, 0.2), -1.8em -1.8em 0 0em rgba(143,143,143, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.5), 1.8em -1.8em 0 0em rgba(143,143,143, 0.7), 2.5em 0em 0 0em #8f8f8f, 1.75em 1.75em 0 0em rgba(143,143,143, 0.2), 0em 2.5em 0 0em rgba(143,143,143, 0.2), -1.8em 1.8em 0 0em rgba(143,143,143, 0.2), -2.6em 0em 0 0em rgba(143,143,143, 0.2), -1.8em -1.8em 0 0em rgba(143,143,143, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.2), 1.8em -1.8em 0 0em rgba(143,143,143, 0.5), 2.5em 0em 0 0em rgba(143,143,143, 0.7), 1.75em 1.75em 0 0em #8f8f8f, 0em 2.5em 0 0em rgba(143,143,143, 0.2), -1.8em 1.8em 0 0em rgba(143,143,143, 0.2), -2.6em 0em 0 0em rgba(143,143,143, 0.2), -1.8em -1.8em 0 0em rgba(143,143,143, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.2), 1.8em -1.8em 0 0em rgba(143,143,143, 0.2), 2.5em 0em 0 0em rgba(143,143,143, 0.5), 1.75em 1.75em 0 0em rgba(143,143,143, 0.7), 0em 2.5em 0 0em #8f8f8f, -1.8em 1.8em 0 0em rgba(143,143,143, 0.2), -2.6em 0em 0 0em rgba(143,143,143, 0.2), -1.8em -1.8em 0 0em rgba(143,143,143, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.2), 1.8em -1.8em 0 0em rgba(143,143,143, 0.2), 2.5em 0em 0 0em rgba(143,143,143, 0.2), 1.75em 1.75em 0 0em rgba(143,143,143, 0.5), 0em 2.5em 0 0em rgba(143,143,143, 0.7), -1.8em 1.8em 0 0em #8f8f8f, -2.6em 0em 0 0em rgba(143,143,143, 0.2), -1.8em -1.8em 0 0em rgba(143,143,143, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.2), 1.8em -1.8em 0 0em rgba(143,143,143, 0.2), 2.5em 0em 0 0em rgba(143,143,143, 0.2), 1.75em 1.75em 0 0em rgba(143,143,143, 0.2), 0em 2.5em 0 0em rgba(143,143,143, 0.5), -1.8em 1.8em 0 0em rgba(143,143,143, 0.7), -2.6em 0em 0 0em #8f8f8f, -1.8em -1.8em 0 0em rgba(143,143,143, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(143,143,143, 0.2), 1.8em -1.8em 0 0em rgba(143,143,143, 0.2), 2.5em 0em 0 0em rgba(143,143,143, 0.2), 1.75em 1.75em 0 0em rgba(143,143,143, 0.2), 0em 2.5em 0 0em rgba(143,143,143, 0.2), -1.8em 1.8em 0 0em rgba(143,143,143, 0.5), -2.6em 0em 0 0em rgba(143,143,143, 0.7), -1.8em -1.8em 0 0em #8f8f8f;
  }
}

.message_pop #captcha {margin-top:10px; width:100%}
.message_pop #captcha #captcha_key { width:calc(100% - 200px) !important; }
.message_pop #captcha.m_captcha audio { }

/*220414*/
/* .message_pop .message_pop_tab > li{width:50%;} */
.message_pop .message_pop_content .message_pop_body textarea{height:100px;}
.message_pop_view li.send .balloon{display:inline-block; line-height:1.6;}

@media (max-width:480px){
	.message_pop_view ul{max-height:120px;}
	.message_pop .message_pop_content .message_pop_body textarea{height:50px;}
	.message_pop #captcha #captcha_key{width:calc(100% - 151px) !important;}
}