#messages-box { padding: 50px 0; }
#messageList li { width: 50%; display: inline-block; margin-right: -4px; vertical-align: top; }
#messageList li .box { margin: 10px; padding: 30px 25px; border: 1px solid #e2e1e1; }
#messageList li .box h3 { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 20px; margin-bottom: 20px; }
#messageList li .box h3 a,#messageList li .box .message-catalog .cns p.lend-statu a { transition: all linear .2s; }
#messageList li .box h3 a:hover,#messageList li .box .message-catalog .cns p.lend-statu a:hover { opacity: 0.8; }
#messageList li .box .statu { margin: 10px 0; border-bottom: 1px solid #d6d6d6; padding-bottom: 15px; margin-bottom: 20px; position: relative; }
#messageList li .box .statu p { font-size: 16px; color: #4e4e4e; position: relative; }
#messageList li .box .statu p b { font-weight: normal; display: inline-block; }
#messageList li .box .statu p:after { content: ''; display: block; width: 100px; height: 3px; background: #434680; position: absolute; left: 0; top: calc(100% + 12px); }
#messageList li .box .message-catalog { overflow: hidden; }
#messageList li .box .message-catalog .cns { overflow: hidden; float: left; }
#messageList li .box .message-catalog .cns p { float: left; margin-right: 8px; display: flex; align-items: center; }
#messageList li .box .message-catalog .cns p a { display: inline-block; padding: 3px 15px; font-size: 15px; color: #ffffff; background-color: #585858; }
#messageList li .box .message-catalog .cns p.lend-statu a { color: #fff; background: #848484; }
#messageList li .box .message-catalog .cns p.lend-statu.end a { border: 2px solid #4cac8f; background: #4cac8f; }
#messageList li .box .message-catalog .views { float: right; color: #505050; font-size: 16px; }
#messageList li .box .message-catalog .views b { color: #f37746; font-size: 28px; margin-right: 5px; }
#messageList-detail >h3 { color: #4c4c4c; font-weight: normal; }
#messageList-detail >h3 b { color: #434582; }
#messageList-detail ul { margin: 20px 0; }
#messageList-detail li .list { overflow: hidden; border-bottom: 1px dotted #E6E5E6; font-size: 13pt; line-height: 120%; }
#messageList-detail li .list .subtitle { float: left; width: 150px; text-align: center; line-height: 50px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: #f9f9f9; }
#messageList-detail li .list .subcontent { float: left; width: calc(100% - 180px); margin-left: 30px; line-height: 50px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#messageList-detail .iwanna .unknow p { border: 2px solid #c9c9c9; padding: 15px 20px; display: inline-block; color: #5f5f5f; margin-right: 15px; }
#messageList-detail .iwanna .unknow a { display: inline-block; background: #4cac8f; color: #fff; padding: 10px 25px; }
#messageList-detail .iwanna .know p { font-size: 13pt; line-height: 120%; background: #4cac8f; display: inline-block; color: #fff; padding: 10px 15px; }
#messageList-creditor { margin-top: 50px; }
#messageList-creditor h3,#messageList-reply >h3 { font-size: 18pt; line-height: 110%; }
#messageList-creditor .message-board section { background: #f8f8f8; margin: 20px 0; overflow: hidden; }
#messageList-creditor .message-board .info { overflow: hidden; margin: 20px; }
#messageList-creditor .message-board .info .pic { background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; float: left; }
#messageList-creditor .message-board .info .pic img { width: 100%; }
#messageList-creditor .message-board .info .detail { float: left; margin-left: 20px; width: calc(100% - 290px); }
#messageList-creditor .message-board .info .creditor-detail { margin-top: 15px; }
#messageList-creditor .message-board .info .creditor-detail h4 { font-size: 13pt; line-height: 110%; }
#messageList-creditor .message-board .info .creditor-detail h5 { font-size: 12pt; line-height: 110%; font-weight: normal; color: #909090; }
#messageList-creditor .message-board .info .creditor-detail h4 a { display: inline-block; background: #eacb4e; color: #927b1c; padding: 2px 15px; }
#messageList-creditor .message-board .info .creditor-detail h4 a:hover { color: #ffffff; }
#messageList-creditor .message-board .info .creditor-detail h4 a img { vertical-align: middle; margin-right: 12px; width: 40px; margin-top: 5px; line-height: 100%; }
#messageList-creditor .message-board .info .creditor-detail p { text-align: right; color: #909090; }
#messageList-creditor .message-board .info .creditor-detail p b { color: #4cac8f; }


@media screen and (max-width:1440px) {   }

@media screen and (max-width:1280px) {
  #messageList li .box .statu p { font-size: 14px; }
}
@media screen and (min-width:1025px) {   }

@media screen and (max-width:1024px) {
  #messageList li { width: 100%; margin: 0; }
}
@media screen and (max-width:768px) {
  #messageList-creditor .message-board .info .pic { width: 160px; }
  #messageList-creditor .message-board .info .detail { width: calc(100% - 180px); }
  #messageList-creditor .message-board .info .creditor-detail { margin: 0; }
  #messageList-creditor .message-board .info .creditor-detail h4 a img { width: 30px; }
  #messageList-creditor .message-board .info .creditor-detail h5 { margin: 20px 0 11px; }
}
@media screen and (max-width:640px) {
  #messageList li .box .message-catalog .views b { font-size: 22px; }
  #messageList-creditor .message-board .info .pic { width: 100px; }
  #messageList-creditor .message-board .info .detail { width: calc(100% - 120px); }
  #messageList-creditor .message-board .info { margin: 10px; }
}
@media screen and (max-width:480px) {
  #messageList li .box h3 { font-size: 18px; margin-bottom: 10px; }
  #messageList li .box { padding: 20px; }
  #messageList li .box .message-catalog .views,#messageList li .box .message-catalog .cns { float: none; }
  #messageList li .box .message-catalog .views { text-align: right; margin-top: 10px; }
  #messageList-creditor .message-board .info .pic { width: 70px; }
  #messageList li .box .message-catalog .cns { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
  #messageList li .box .message-catalog .cns p { display: flex; flex-direction: column; align-items: flex-start; width: 100%; margin-right: 0; }
  #messageList-creditor .message-board .info .detail { width: calc(100% - 90px); }
  #messageList-creditor .message-board .info .creditor-detail h4 a { padding: 3px 10px; font-size: 10pt; }
  #messageList-creditor .message-board .info .creditor-detail h4 a img { width: 25px; vertical-align: middle; margin-top: 0; }
  #messageList-creditor .message-board .info .creditor-detail p,#messageList-creditor .message-board .info .creditor-detail h5 { font-size: 10pt; }
  #messageList-detail >h3 { font-size: 12pt; }
  #messageList-detail li .list .subtitle { width: 100px; }
  #messageList-detail li .list .subcontent { width: calc(100% - 120px); margin-left: 20px; }
  #messageList-creditor h3,#messageList-reply >h3 { font-size: 16pt; }
  #messageList-detail .iwanna .unknow,#messageList-detail .iwanna .know { text-align: center; }
  #messageList-detail .iwanna .unknow p { margin: 0 0 15px; }
  #messageList li .box .message-catalog .cns p a { font-size: 15px; padding: 6px 0; width: 100%; text-align: center; }
}
