/* common */ * { margin: 0; padding: 0; font-style: normal; box-sizing: border-box; } ul, li { padding: 0; margin: 0; list-style: none; text-align: inherit; } html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; line-height: 1.6; } body { -webkit-touch-callout: none; font-family: Helvetica Neue, Helvetica, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif; background-color: #fff; line-height: inherit; color: #333; text-shadow: none; } b { font-weight: 400; } h1, h2, h3, h4, h5, h6 { font-weight: 400; font-size: 16px; } a { text-decoration: none; color: #607fa6; } .clearfix { zoom: 1; } .clearfix:before { /* clear */ display: table; content: ""; } .clearfix:after { /* clear */ display: table; content: ""; clear: both; } .cen { margin: 0 auto; } .fl { float: left !important; } .fr { float: right !important; } /* font setting */ .bold { font-weight: bold !important; } .align-cen { text-align: center !important; } .big { font-size: 20px !important; } /* font color */ /*gray*/ .color1 { color: #808080 !important; } /*red*/ .color2 { color: #ed2308 !important; } /*green*/ .color4 { color: #39b54a !important; } /*orange*/ .color3 { color: #ff8a00 !important; } /*blue*/ .color5 { color: #167efb !important; } /*violet*/ .color6 { color: #b06fbb !important; } /*white*/ .color7 { color: #fff !important; } .push { padding: 9px; box-sizing: border-box; margin: 10px 15px; background: #fbfbfb; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } .push li:first-child .item { margin: 0; } .push .item { width: 100%; height: 56px; margin-top: 15px; } .push .item img { width: 56px; height: 56px; border-radius: 2px; margin-right: 10px; } .push .item .content { line-height: 16px; width: calc(100% - 66px); width: -webkit-calc(100% - 66px); height: 100%; text-shadow: none; } .push .item .content h2 { font-size: 16px; color: #333; margin-bottom: 5px; line-height: 18px; } .push .item .content span { color: #8c8c8c; font-size: 12px; display: block; line-height: 18px; height: 33px; } .ad { box-sizing: border-box; margin: 10px 15px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; overflow: hidden; } .ad img { width: 100%; } /* conent */ .meipian-main { padding: 10px 0 30px; width: 100%; min-height: 100%; box-sizing: border-box; } .meipian-title { font-size: 24px; text-align: left; line-height: 33px; padding: 0px 0px 6px 0px; margin: 0 15px; } .meipian_meta { font-family: Helvetica Neue, Helvetica, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif; font-size: 16px; margin: 0 0 24px; line-height: 30px; padding: 0 15px; } .meipian_meta span { float: left; color: #8c8c8c; margin-right: 8px; } .meipian_meta .music { width: 100%; height: 42px; border-radius: 5px; margin: 10px 8px 0 0; background: #f4f4f4; padding: 0; line-height: 42px; cursor: pointer; } .meipian_meta .music i { float: left; width: 25px; height: 25px; background-size: contain; background-repeat: no-repeat; background-position: center; margin: 8px 10px 0 15px; } .meipian_meta .music i[play=on] { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAMAAAAp4XiDAAAASFBMVEUAAADV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXk2KSQAAAAF3RSTlMA+ea1nnRhSSQZDAbH89uMOPHaick3NvsdA+AAAACfSURBVEjH7ZXLDsIwDAQpARKKKaE85v//FMTFEkI1e/ABib2PlEwc7+qfV0qTEYbLqCKw3skI2E1GYLOXEc7bg4rAXGUESpMRhtMoIl8K5z3WFcSFqwjHZeF8zFQFxIXLiAuPkVg4S7l2BXHhMRILJ8xUExE/WPb1rctPmT4wpaUNv4vN/sjW05aSi81esHPVyyK7kuwu12t6iT/F/noenXJC+Cqv4ZgAAAAASUVORK5CYII="); } .meipian_meta .music i[play=stop] { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyAQMAAAAk8RryAAAABlBMVEUAAADV1dUk01kVAAAAAXRSTlMAQObYZgAAABZJREFUGNNjoBj8/8D4/8EojYMmFQAA4yaJHbwQ+QMAAAAASUVORK5CYII="); } .meipian_meta .music span { width: calc(100% - 70px); width: -webkit-calc(100% - 70px); margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .meipian-content .section { margin: 24px 0; width: 100%; padding: 0 15px; } .meipian-content .section .m-tb-4 { margin: 0px 0; } .meipian-content .section .text { font-size: 16px; line-height: 1.5; word-wrap: break-word; font-weight: normal; white-space: pre-wrap; text-align: justify; } .meipian-content .section img { margin-top: 4px; width: 100%; } .meipian-content .section .images { display: block; } .meipian-content .section .video { width: 100%; } .meipian_meta .admire i { float: left; width: 18px; height: 30px; background-size: contain; background-repeat: no-repeat; background-image: url(../img/default/like.png); background-position: center; display: inline-block; margin-right: 2px; } .full .text { margin: 0 0 4px; } .report { margin: 24px 0; } .report span { margin: 0; } .footer-button-download { text-align: center; height: 45px; line-height: 45px; color: #fff; display: block; border-radius: 8px; background: #3395ed; margin: 25px 15px 0; text-shadow: none; } .footer-button-download i { display: inline-block; width: 17px; height: 16px; background: url("../img/default/download_icon.png") no-repeat; background-size: 100% 100%; margin-right: 8px; } .meipian-bg { position: fixed; width: 100%; height: 100%; z-index: -1; margin: 0 auto; background: #fff; } .appreciate { width: 100%; height: auto; margin: 65px auto 60px; text-align: center; color: #8c8c8c; } .appreciate a { margin: 11px 0; display: inline-block; height: 39px; width: 86px; background: linear-gradient(top, #ffc948 0%, #f7b933 100%); background: -o-linear-gradient(top, #ffc948 0%, #f7b933 100%); background: -ms-linear-gradient(top, #ffc948 0%, #f7b933 100%); background: -moz-linear-gradient(top, #ffc948 0%, #f7b933 100%); background: -webkit-linear-gradient(top, #ffc948 0%, #f7b933 100%); border: 2px solid #e19e19; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; text-align: center; line-height: 35px; color: #c07604; text-shadow: none; } #btn-admire { margin: 7px 5px 0 0; width: 16px; height: 15px; background: url("../img/admireA.png") no-repeat; -webkit-background-size: cover; background-size: cover; cursor: pointer; } #btn-admire.scale { background: url("../img/admireB.png") no-repeat; background-size: cover; animation: scale1_5 1s; } .meipian_meta .admire { margin-left: 10px; } @keyframes scale1_5 { from { transform: scale(1); } to { transform: scale(2); opacity: 0; } } /* PC */ @media screen and (min-width: 1024px) { body { background-color: #fff; } .meipian { width: 750px; margin: 0 auto; min-height: 100%; } .meipian-main { padding: 30px 35px 30px 35px !important; } .meipian-bg { border-right: 1px solid #d9dadc; border-left: 1px solid #d9dadc; } .meipian-title { padding-bottom: 10px; margin-bottom: 14px; border-bottom: 1px solid #e7e7eb; } .meipian-bg { width: 750px !important; } } @media screen and (min-width: 1025px) { body { background-color: #e7e8eb; font-family: "Helvetica Neue", Helvetica, "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif; } } /*# sourceMappingURL=000.css.map */