@charset "utf-8";
/* reset */
html{ -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body{ -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; font-size: 12px; color: #333; font-family: 'mag-songti', -apple-system-font, Helvetica Neue, Helvetica, sans-serif !important; max-width: 640px; margin: 0 auto;  }

a{ text-decoration: none; outline:0 none; }

p,ul,h1,h2,h3,h4,h5,h6,dl,dd,table,form{ margin: 0; padding: 0;}

input,textarea,select,button{ border:0 none; outline:0 none; -webkit-appearance: none; appearance: none; box-shadow: none; font-size: 14px; background-color: #fff; padding: 0; font-family: inherit; }

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder{ color: #999;}
textarea{ resize:none; }

table{ border-collapse: collapse; border-spacing: 0;}
ul,ol,dl{ list-style: none; }
img{ border: 0 none; overflow: hidden; display: inline-block; }
em,i{ font-style: normal; font-weight: normal; }
audio:not([controls]){display: none; height: 0; }
/* 清除浮动 */
.ly-cf:before,
.ly-cf:after{ content: " "; display: table; }
.ly-cf:after{ clear:both; }
.ly-fl{ float: left; }
.ly-fr{ float: right; }
/* Vue渲染节点必加的属性 */
[v-cloak]{ display: none; }
/* 由于iOS 9 \ Android 4.4 一些系统还不支持CSS变量，暂时先不使用 */
/* 文本灰色 */
.ly-gray-dark{ color:#222; }
.ly-gray{ color:#666; }
.ly-gray-light{ color:#999; }
.ly-gray-lighter{ color:#bebebe; }
.ly-gray-lightest{ color:#dedede; }
.ly-link{ color:#586B94; }
/* 标题文字大小 */
@media screen and (max-width:321px){
  .ly-h1{ font-size: 22px; line-height: 30px; }
  .ly-h2{ font-size: 16px; line-height: 22px; }
  .ly-h3{ font-size: 14px; line-height: 20px; }
  .ly-h4{ font-size: 13px; line-height: 16px; }
  .ly-h5{ font-size: 11px; line-height: 15px; }
  .ly-h6{ font-size: 10px; line-height: 14px; }
}
@media screen and (min-width:321px){
  .ly-h1{ font-size: 24px; line-height: 34px; }
  .ly-h2{ font-size: 18px; line-height: 25px; }
  .ly-h3{ font-size: 16px; line-height: 22px; }
  .ly-h4{ font-size: 14px; line-height: 20px; }
  .ly-h5{ font-size: 12px; line-height: 16px; }
  .ly-h6{ font-size: 11px; line-height: 15px; }
}
/* flex示例，可根据情况自行定义 */
.ly-flex{ display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; -webkit-justify-content: space-between; justify-content: space-between;}
/* 单行及多行文本结尾省略号处理 */
.ly-hide-txt{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ly-clamp-txt{ overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
/* 一般访问数、日期等居左 居右的元素 */
.ly-info{ overflow: hidden; line-height: 24px; color:#999; position: relative; }
.ly-info-item{ float: left; margin: 0 12px 0 0; }
/* 水平垂直居中，根据情况可分别扩展为水平、垂直居中 */
.ly-hvcenter{ position: absolute; top: 50%; left:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%); }
.ly-vcenter{ position: absolute; top: 50%; -webkit-transform:translate(0, -50%); transform:translate(0, -50%); }
/* iphonex 底部安全区，一般用于固定在底部的元素 */
.ly-iphonex-safe{ padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); background-color: #fff; }
.ly-btn,
.ly-sline-t,
.ly-sline-b,
.ly-sline-l,
.ly-sline-r,
.ly-sline-four,
.ly-click-hlg,
.ly-arrow-line,
.ly-arrow-filled{ position: relative; }
/* 按钮的样式 根据项目做相应的修改 */
.ly-btn{ overflow: hidden; border:0 none; text-align: center; border-radius: 6px; -webkit-transition:all 0.2s; transition:all 0.2s; height: 30px; padding: 0 10px; box-sizing: border-box; }
.ly-btn:after{ content: " "; position: absolute; width: 100%; height: 100%; left: 0; top: 0;  -webkit-transition: all 0.2s; transition: all 0.2s; background-color: rgba(0,0,0,0); }
.ly-btn:active:after{ background-color: rgba(0,0,0,.1); }
.ly-btn.has-border{ overflow: visible; }
.ly-btn.has-border:before{ content:" "; position: absolute; left:0; top:0; width:200%; height:200%;  -webkit-transform:scale(0.5); transform:scale(0.5); -webkit-transform-origin: 0 0; transform-origin: 0 0; border:1px solid rgba(0, 0, 0, .3); border-radius: 10px; }
.ly-btn.mid{ width:90px; height: 30px; }
.ly-btn.big{ width:100%; height: 42px; font-size: 16px;}
.ly-btn.disabled{ color:#999; background-color: #efefef; }
.ly-btn.theme{ background-color: #FFE443; color:#4E1C17; }
/* 元素点击带有高亮的样式 */
.ly-click-hlg:after{ content: " "; position: absolute; width: 100%; height: 100%; left: 0; top: 0;  -webkit-transition: all 0.2s; transition: all 0.2s; background-color: rgba(0,0,0,0); }
.ly-click-hlg:active:after{ background-color: rgba(0,0,0,.1);}
/* 半像素细线 */
.ly-sline-t:before{ content:" "; position: absolute; left:0; top:0; width:100%; height:0;-webkit-transform:scaleY(0.5); transform:scaleY(0.5); border-top:1px solid rgba(0, 0, 0, .3); }
.ly-sline-b:before{ content:" "; position: absolute; left:0; bottom:0; width:100%; height:0; -webkit-transform:scaleY(0.5); transform:scaleY(0.5);  border-bottom:1px solid rgba(0, 0, 0, .3);}
.ly-sline-l:before{ content:" "; position: absolute; left:0; top:0; width:0; height:100%; -webkit-transform:scaleX(0.5); transform:scaleX(0.5); border-left:1px solid rgba(0, 0, 0, .3); }
.ly-sline-r:before{ content:" "; position: absolute; right:0; top:0; width:0; height:100%;  -webkit-transform:scaleX(0.5); transform:scaleX(0.5); border-right:1px solid rgba(0, 0, 0, .3); }
.ly-sline-four:before{ content:" "; position: absolute; left:0; top:0; width:200%; height:200%;  -webkit-transform:scale(0.5); transform:scale(0.5); -webkit-transform-origin: 0 0; transform-origin: 0 0; border:1px solid rgba(0, 0, 0, .3); }
/* 边框三角 */
.ly-arrow-line:before{ content:" "; position: absolute; right: 0; top:50%; width: 6px; height: 6px; border-top:1px solid #aaa; border-right: 1px solid #aaa; -webkit-transform: rotate(45deg) translate(0, -50%); transform: rotate(45deg) translate(0, -50%); }
/* 边框三角 - 填充 */
.ly-arrow-filled:before{ content:" "; position: absolute; right: 0; width:0; height: 0; border:5px solid rgba(0, 0, 0, 0); border-top-color: #666; }
/* 遮罩层 一般控制弹框显示隐藏，遮罩层就嵌套弹框，为父子结构 */
.ly-overlay{ position:fixed; left:0; top:0; right:0; bottom:0; background-color:rgba(0,0,0,0.7); z-index: 300;}
/* 弹出框 */
.ly-dialog{ text-align: center; border-radius: 5px; width: 2.5rem; padding:24px 28px; background-color: #fff; }
/* 遮罩层过渡效果 使用Vue transition组件, <transition name="ly-overlay-fade">/transition> */
.ly-overlay-fade-enter-active,
.ly-overlay-fade-leave-active { -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease;}
.ly-overlay-fade-enter,
.ly-overlay-fade-leave-active{ opacity: 0; }
/* 富文本样式 */
.ly-html-data *{ max-width: 100% !important;  }
.ly-html-data{ word-wrap: break-word; line-height: 1.6; color: #333; font-size: 14px; text-align: justify; word-break: break-all; overflow: hidden; }
.ly-html-data img{ margin-bottom:10px; }
/* 带有滚动条的元素，包括横向、纵向 */
.ly-horizontal-scrollerbar{ overflow:hidden; overflow-x:scroll; -webkit-overflow-scrolling:touch; }
.ly-vertical-scrollerbar{ overflow:hidden; overflow-y:scroll; -webkit-overflow-scrolling:touch; }
.ly-horizontal-scrollerbar::-webkit-scrollbar,
.ly-horizontal-scrollerbar::-webkit-scrollbar-track-piece,
.ly-vertical-scrollerbar::-webkit-scrollbar-track-piece,
.ly-vertical-scrollerbar::-webkit-scrollbar{ background-color:transparent; display: none; opacity: 0; }

.ly-hscroller{ white-space: nowrap; }
.ly-hscroller .item{ display: inline-block; margin:0 20px; padding: 30px; border:1px solid #ccc; }

.img-box{ display: block; position: relative; overflow: hidden; }
.faceimg{ border-radius: 100%; background-color: #F1F1F1; }
.img-emoj{ width:20px; vertical-align:top; margin:0 1px; }
.img-spread{ display: block; width: 100%; }
.ly-img{ background-size: cover; background-position: center; background-color: #EFEFEF; overflow: hidden; position:relative; }
.img-with-text{ position: relative; }
.img-with-text .ly-img{ float: left; margin-right: 12px; }
.img-with-text .title{ font-size: 16px; }

@-webkit-keyframes loadingRotateAnimation
{
   0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
   100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
.loadingRotateAnimation{
  -webkit-animation: loadingRotateAnimation 1s infinite linear;
  animation: loadingRotateAnimation 1s infinite linear;
}
.list-btm-loadstatus{ color:#aaa; text-align: center; line-height: 16px; margin-top: 20px; }
.list-btm-loadstatus .icon-load{ display: inline-block; width: 12px; height: 12px; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAAAXNSR0IArs4c6QAAA0lJREFUSA2tls1LG0EYxnfX1YqCGm+NIPRStR5NycUeItiL4gqif4SnetH/QKgXPflHCIVsjw2YQ0SU6kGhUr8IRpOe/Ch+kGg0/T1bV0yNtTYZePednXnf55lnZnZmTeOJkkgkXl9dXQ3e3Nz0EtpaKBSCmMF7Bp/CYli0r69v629Q5mOdEHQBNoX13AIb8veNvvvv86Zpjvf396+WwnxABJC9sLAwgx8FSP3H1F28e319vVFVVZUREPUgSjuJGaDfwQdoplqYbWho+BCJRPKK80sR0fr6euD09PQTSRESsgRN19XVfQyFQj/9hFI+Fos1ZrPZCXLGyK0lJm7b9hDqjv34OyKC7MXFxS/4CFOQxg92d3ev+IH/4l3XDZEXhawFH29ubn7vK7N8gOXl5RkIIpZlpfHh55IIx3GcFaY2DIkGGjk8PJzx8T1FS0tLXYB/ZSQ5iN6Fw+FnKfHBfC9ll5eXCTBfgPl2ZGRk1VNEwxRBJqOZLpdEZFKGm2bDSIiwDXNtba0tl8t9h+wYe/XUwivpX8rc3FwjapLEaje2Wfl83oHAwNxKkWggTJd2qsta6eMetCDoFZEa9ahkgeQzJPq4em1IWtkABrZRSRJhgf1NisQhoqAaq6urvS9e9UoVBq/zUHBBEVUK9wHO8PCwD17Q9s6IDHZP2YPo8hpe3q7RD22GlIiQ+KY8zJLZnZo6yFIIsWKYiJySoWU0crrrZNdmiFmcsq4UUZzd3d3GMnCLUiEQlq4PLUvUam9v36SiSyvA+TRRFF3Gi64NSAIQCnvLP73HIStgY6gKlYHvpZ6fnwtjDBPmuBo9oo6OjlVYZ3mv5SCM7u/vt6jzf8rFxYVydSfVYrM1NTXFVzsS7e3t7XmssLOzc5BKpZ6tTEq4oQ+wwtnZ2bww/cH6U6edkYd9CB+ns4XDNrG3tzd5dHT05AZRzMnJyaRyUCFF8fr6emHd/Tf4X65PrG1uJ5NJ3bajNJrMsa4PV7sTkA0G4x1VtAWxTmwA06cR0DpT935O8HckAn9ApEYV1HThdGn1kCTF2qae/7Oudy5N73erqampeE0ERnmU6He3YaTT6TaUOJB4P5B4KRFhhrpOlRgqXX6xNv2cUv4XWjLNpKtYSHoAAAAASUVORK5CYII=") no-repeat left top; background-size: 12px 12px; margin-right: 3px; position: relative; top:1px;}
.list-btm-loadstatus .icon-load.loading{ -webkit-animation: loadingRotateAnimation 1s infinite linear; animation: loadingRotateAnimation 1s infinite linear; }
.list-btm-loadstatus .icon-load.loaded{ display: none; }

.ly-row{ position: relative; overflow: hidden; }/* 可在Html中添加半像素类 */
.ly-row:last-child:before{ border: 0 none; }
.ly-justify-field{ text-align: justify; overflow: hidden; line-height: 44px; width:62px; height: 44px; float:left; font-size: 14px; }
.ly-justify-field:after{ display: inline-block; content:''; width:100%; height: 100%; text-align: justify; overflow: hidden; }
.ly-justify-val{ position: relative; overflow: hidden; line-height: 24px; padding: 10px 0 10px 18px; color:#666; font-size: 14px; }
.ly-justify-val:after{ content: '：'; position: absolute; left: 3px; top:10px; }

/* 适配iPhone 5 小屏幕手机 */
@media only screen and (max-width: 320px){
  
}

.post-imgs{ clear: both; overflow: hidden; padding: 12px 0 0 0; position: relative; }
.post-imgs .item{ width: 0.59rem; height: 0.59rem; float: left; margin: 0 8px 8px 0; background-color: #F2F2F2; position: relative; }
.post-imgs .item.btn-upload{ background: url("") no-repeat center center; background-size: 16px 16px; }
.post-imgs .item.btn-upload:after{ content: " "; position: absolute; left: 0; top: 0; width: 200%; height: 200%; transform: scale(0.5); -webkit-transform: scale(0.5); transform-origin: 0 0; -webkit-transform-origin: 0 0; border: 1px solid rgba(0, 0, 0, 0.1); border: 1px dashed #ccc; }
.post-imgs .icon-delete{ position: absolute; right: -3px; top: -3px; width: 18px; height: 18px; border-radius: 0.9rem; background: rgba(0, 0, 0, 0.7) url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAALxJREFUKBWNktERgjAQRGMBfFIBvxZhFzZgD/xSiLXQhA492INjfJtxUWNOvZnlCLePO0JSznlACxrTj8DToxkdE5ctuiLFFLHUBJ1kIubi42aPQpjaKyS4XxtE8FfIdA3/BQXwBVjxPp7NdcZ4QDcRhODnN9Vmr2VC3j3Dk+vN/IDOZIVgdQ53u7wEgzoZUi7jkeNfFUEeqwnzsEMfnQw5V/CoI7dDinU8m+uMx2MvAjdIcFcbW2t8OtvDHQhefiVPNd51AAAAAElFTkSuQmCC") no-repeat center center; background-size: 7px 7px; }
.post-imgs .ly-img{ width: 0.59rem; height: 0.59rem; }
.post-imgs .ipt-file{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; z-index: 1; }

.countdown{ font-size: 0; }
.countdown .label,
.countdown .num,
.countdown .divider{ font-size: 12px; }
.countdown .num{ display: inline-block; width: 18px; line-height: 18px; color:#fff; background-color: #333; text-align: center; }
.countdown .divider{ margin:0 4px; }






