.banner-blog{background: url(http://pic.jnsudong.com/skin/sucms/images/banner-blog.jpg) no-repeat center}
.banner-contentWrap{width: 550px;margin: 0 auto;padding-top: 77px}
.blog-searchFrame{width: 490px;height: 46px;background: #fff;border-radius: 23px;padding: 0 30px}
.blog-searchFrame .searchAreaWrap{width: 440px;float: left}
.blog-searchFrame .searchInput{width: 100%;height: 45px;border: 0;padding: 0;outline: 0;color: #333;font-size: 16px;line-height: 45px;vertical-align: middle}
.blog-searchFrame .searchIconWrap{width: 50px;float: right;cursor: pointer;position: relative;right: -10px}
.blog-searchFrame .searchIconWrap .icon-search{position: absolute;top: -33px;right: 0;height: 26px;width: 26px;background: url(http://pic.jnsudong.com/skin/sucms/images/icon-search.png) no-repeat;display: inline-block;border: none}
#category-box{background: #fff;width: 100%;margin: 0 auto;overflow: hidden}
.category-box{width: 1200px;margin: 0 auto;padding: 65px 0 70px;text-align: center;overflow: hidden}
.category-item{width: 100px;margin: 0 50px;float: left}
.category-item h3{font-size: 16px;text-align: center;padding-top: 40px;font-weight: normal;line-height: 1}
.category-item-icon{width: 56px;height: 56px;margin: 0 auto}
.icon-prod2{background: url(http://pic.jnsudong.com/skin/sucms/images/icon-prod.png) no-repeat}
.icon-prod3{background: url(http://pic.jnsudong.com/skin/sucms/images/icon-prod.png) no-repeat}
.icon-prod4{background: url(http://pic.jnsudong.com/skin/sucms/images/icon-prod.png) no-repeat}
.icon-prod5{background: url(http://pic.jnsudong.com/skin/sucms/images/icon-prod.png) no-repeat}
.icon-prod6{background: url(http://pic.jnsudong.com/skin/sucms/images/icon-prod.png) no-repeat}
.icon-prod7{background: url(http://pic.jnsudong.com/skin/sucms/images/icon-prod.png) no-repeat}
.blog-title{width: 100%;padding: 10px 0 40px}
.blog-title h3{font-size: 24px;font-weight: normal;color: #333}
.blog-box{width: 100%;float: left;margin-bottom: 30px}
.blog-item{width: 380px;float: left;margin: 0 30px 30px 0;background: #fff;border-radius: 4px;padding: 20px;min-height: 344px}
.blog-item:hover{box-shadow: 0 0 15px 1px rgba(0,0,0,.1)}
.blog-item:nth-child(3n){ margin: 0 0 30px 0}
.blog-item h1{width: 100%;float: left;font-size: 20px;font-weight: normal;padding-left: 12px;border-left: solid #333 2px;margin-bottom: 30px}
.blog-item ul{width: 100%;float: left}
.blog-item li{width: 100%;float: left;margin-bottom: 20px}
.blog-item li p{font-size: 16px;line-height: 24px;height:24px;text-overflow:ellipsis;white-space:nowrap;display: inline-block}
.blog-item li .item-dot{display: inline-block;vertical-align: middle;height: 3px;width: 3px;border-radius: 50%;background: #666;margin-right: 10px}
.blog-item li:last-child{margin-bottom: 0}
/*列表页面样式*/
.blog-aside{width: 200px;float: left;background: #fff;border-radius: 4px}
.blog-aside ul{width: 100%;float: left;padding: 50px 0}
.blog-aside li{width: 100%;float: left;padding: 20px 0;text-align: center;font-size: 16px}
.blog-aside li a{color: #333;border-left: 2px solid #fff;padding: 0 15px;display: inline-block}
.blog-aside li a.active,.blog-aside li a:hover{color: #308ccf;border-left: 2px solid #308ccf}
.blog-main{width: 975px;margin-left: 25px;float: left;background: #fff;border-radius: 4px; min-height: 450px}
.blog-list{width: 100%;float: left;overflow: hidden}
.blog-list ul{width: 100%;float: left;margin-bottom: 35px}
.blog-list li{width: 100%;float: left;padding: 25px;border-bottom: 1px dashed #e1e8ec}
.blog-list li:hover{background: #f9f9f9}
.blog-list li:last-child{border-bottom: none}
.blog-list li .list-item{width: 100%;display: flex;justify-content: space-between}
.blog-list li .list-item h3{font-size: 16px;font-weight: normal;line-height: 24px}
.blog-list li .list-item h3 .item-dot{display: inline-block;vertical-align: middle;height: 3px;width: 3px;border-radius: 50%;background: #666;margin-right: 10px}
.blog-list li .list-item span{color: #999;font-size: 12px;line-height: 24px}
/*详情*/
.blog-detail{width: 100%;padding: 45px 45px 0 45px;/*overflow: hidden;*/}
.blog-detail-header{width: 100%;float: left;border-bottom: 1px dashed #e1e8ec}
.sub-menu{color: #333;font-size: 14px;padding: 10px 0;float: left}
#share{float: right}
.article-title{float: left;width: 100%;text-align: center;padding: 30px 0 20px}
.article-title h1{color: #333;font-size: 20px;font-weight: normal;line-height: 30px}
.article-intro{width: 100%;display: flex;align-items: center;justify-content: center;padding-bottom: 20px;border-bottom: 1px dashed #e1e8ec;color: #999;font-size: 13px}
.article-intro small{color: #666;padding: 0 5px;font-size: 14px}
.article-view{width: 100%;float: left;overflow: hidden;line-height: 24px;font-size: 15px;color: #666;min-height: 450px;padding-top: 20px;margin-bottom: 20px}
.article-view p{ margin:30px auto}
.article-tool{width: 100%;display: flex;align-items: center;justify-content: center;position: relative}
.article-tool button{margin: 0 10px}
.zan{position: absolute;top: -32px;left: 145px;bottom: 0;right: 0;color: #FF5722}
.blog-like{width: 100%;padding: 35px;border-top: 5px solid #f5f5f7;overflow: hidden}
.blog-like-header{width: 100%;padding-bottom: 18px;border-bottom: 1px dashed #e1e8ec}
.blog-like-header h3{display: inline-block;padding-left: 16px;border-left: solid #333 2px;font-size: 18px;height: 18px;line-height: 18px;font-weight: normal;color: #333}
.blog-like-section{width: 100%;padding: 25px 0}
.blog-like-section ul{width: 100%;float: left}
.blog-like-section li{width: 49.99999%;float: left;margin-bottom: 20px}
.blog-like-section li p{font-size: 16px;line-height: 24px;height:24px;text-overflow:ellipsis;white-space:nowrap;display: inline-block}
.blog-like-section li .item-dot{display: inline-block;vertical-align: middle;height: 3px;width: 3px;border-radius: 50%;background: #666;margin-right: 10px}
.blog-like-section li:last-child{margin-bottom: 0}
/*搜索*/
.search-box{width: 100%;float: left;padding: 0 10px;margin-bottom: 30px;background: #fff;border-radius: 4px;min-height: 450px}
.search-box .blog-list li{padding: 25px 15px}
.search_result{width: 100%;float: left;padding: 25px 15px;border-bottom: 1px dashed #e1e8ec}
.search_result .sub{color: #333;font-size: 16px}
.search_result .sub span{color: #999}
.search_result .sub span em{color: #f54546;margin: 0 5px;font-style: inherit}
/*打赏*/
.donation-wrap {background: rgba(0,0,0,.4)!important;position: fixed;height: 100%;width: 100%;top: 0;left: 0;display: none;z-index: 99999;font-size: 12px;-webkit-text-size-adjust: none;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale}
.isDisplay {display: block !important}
.donation-show {position: absolute;width: 100%;height: 100%;overflow: hidden}
.sang-box {background: #fff;width: 300px;height: 400px;position: fixed;left: 50%;margin-left: -150px;top: 50%;margin-top: -210px;border-radius: 10px;overflow: hidden;opacity: 1}
.sang-box p {padding: 0;margin: 0;font-size: 12px}
.sang-box {text-align: center}
.sang-box .close-popup {position: absolute;right: 14px;top: 14px;z-index: 999;color: #fff;border: 1px solid #fff;border-radius: 50%;height: 20px;width: 20px;line-height: 18px;font-size: 12px}
.sang-box .sang-userpic {margin-top: 60px}
.sang-box .sang-userpic img {border-radius: 10px;height: 70px;width: 70px;margin: 15px;margin-bottom: 0;display: inline-block}
.sang-box h3 {margin: 5px 0;font-weight: 400;font-size: 18px;color: #607fa6}
.sang-box .grid-paymoney {margin: 20px;border-top: 1px solid #ddd;padding-top: 20px}
.sang-box .grid-paymoney a {border: 2px solid #D85940;display: block;margin: 6px 0;color: #D85940;padding: 2px 5px;border-radius: 5px;cursor: pointer}
.sang-bg {background: #D85940;width: 110%;height: 180px;border-radius: 50%;position: absolute;top: -15%;left: -5%}
.sang-box .donation-content-block {position: relative;z-index: 99}
.grid-paymoney .donation-col-33 {width: 29.333333333333332%;margin-left: 4%;float: left}
.donation-row {overflow: hidden;margin-left: -4%}
.donation-content-block {margin: 10px 0;padding: 0 .75rem;color: #6d6d72}
.showIndicator-icon {position: fixed;z-index: 99999;left: 50%;top: 50%;margin-left: -25px;margin-top: -25px;border-radius: 5px;width: 50px;height: 50px;display: inline-block;background: rgba(0,0,0,.6) url(data:image/gif;base64,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) no-repeat center center;background-size: 50%}
.showIndicator {position: fixed;width: 100%;height: 100%;top: 0;left: 0;z-index: 999999}
.donation-toast {position: fixed;width: 100%;left: 0;top: 50%;margin-top: -30px;text-align: center;line-height: 24px;padding: 10px 0;display: none;z-index: 9999999}
.donation-toast span {display: inline-block;background: rgba(0,0,0,.8);border-radius: 5px;color: #fff;line-height: 40px;padding: 5px 10px;text-align: center;font-size: 14px}
.pay-othermoney {display: none}
.pay-othermoney input {border: none;background: none;border-bottom: 1px solid #ddd;outline: none;width: 100px;border-radius: 0;display: inline;font-size: 14px;padding: 0;line-height: 20px;height: auto}
.pay-othermoney a, .grid-paymoney-other {color: #607fa6;font-size: 14px}
.pay-othermoney a {padding: 0 5px}
.donation-footer {position: absolute;bottom: 10px;width: 100%;text-align: center;cursor: pointer}
.donation-wrap a {cursor: pointer}
.sang-record {position: absolute;left: 0;top: 0;width: 100%;height: 400px;contain: strict;will-change: transform;display: block;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-transition-property: -webkit-transform;transition-property: -webkit-transform;transition-property: transform;-webkit-transform: translate3d(0, 420px, 0);transform: translate3d(0, 420px, 0);background: #fff;z-index: 11000}
.sang-record.modal-in {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0)}
.sang-record.modal-in, .sang-record.modal-out {-webkit-transition-duration: .4s;transition-duration: .4s}
.sang-header {background: #D85940;line-height: 50px;font-size: 16px;color: #fff}
.sang-list {background: #fff;height: 370px;overflow: hidden;overflow-y: auto;-webkit-overflow-scrolling: touch;text-align: left;padding-bottom: 10px}
.sang-list ul {overflow: hidden}
.sang-list ul li {line-height: 40px;overflow: hidden;border-bottom: 1px dashed #ddd;padding: 8px 0;margin: 0 10px}
.sang-list ul li img {width: 40px;height: 40px;float: left;border-radius: 50%;margin-right: 10px}
.sang-list ul li span {float: right}
.sang-list ul p {text-align: center;padding: 10px;margin-top: 20px}
.do_load_more_record {padding: 0 15px;text-align: center;display: none;border: none;background: 0 0;width: 100%;outline: 0;line-height: 40px}
.donation-newbox {position: fixed;line-height: 30px;background: rgba(0,0,0,.7);color: #fff;top: 5px;right: -200px;border-radius: 2px;overflow: hidden;height: 30px;width: 200px;z-index: 9999999;font-size: 12px}
.donation-newbox img {width: 30px;height: 30px;float: left;margin-right: 10px}
.donation-qrcode-cover {position: fixed;background: rgba(0,0,0,0.5);width: 100%;height: 100%;top: 0;left: 0;z-index: 100000;display: none}
.donation-qrcode-inner {transition: all .3s ease;transform: scale(0, 0);position: fixed;z-index: 1000001;top: 50%;left: 50%;width: 200px;min-height: 220px;margin-top: -110px;margin-left: -100px;text-align: center;box-shadow: 0 -2px 25px 1px rgba(20,20,20,.3);background: #f7f7f7;border-radius: 0px;font-size: 12px}
.donation-qrcode-inner.active {transform: scale(1, 1)}
.donation-qrcode-inner img {width: 180px;height: 180px;margin: 10px}
.donation-qrcode-inner p {padding: 0;line-height: 20px;margin: 5px 0;color: #000;font-size: 15px}
.donation-qrcode-inner a {color: #c00;margin: 8px 0;display: block;cursor: pointer}
@media screen and (min-width: 1024px){html,    body {-webkit-user-select: initial;    -moz-user-select: initial;    -ms-user-select: initial;    user-select: initial;}}
@media screen and (max-width: 768px){.banner-contentWrap,.blog-searchFrame .searchAreaWrap,.blog-aside,
.blog-aside li a.active, .blog-aside li a:hover,.sub-menu,#share{width: 100%;}
.banner-contentWrap{padding-top: 65px;}
.blog-searchFrame{width: 80%;}
.blog-item{width: 100%;    margin: 0 0 30px;}
.blog-aside ul{padding:25px 0;}
.blog-main{width: 100%;    margin: 25px 0 0 0;}
.blog-list li{padding: 10px;}
.blog-list li .list-item h3{height:24px;    text-overflow:ellipsis;    white-space:nowrap;    overflow:hidden;    width: 80%;}
.blog-list li .list-item h3 .item-dot{margin-right: 5px;}
.blog-detail{padding: 15px 15px 0 15px;}
#share{padding-bottom: 10px;}
.social-share .social-share-icon{width: 24px !important;    height: 24px !important;    font-size: 16px !important;    line-height: 24px !important;}
.article-intro{font-size: 12px;}
.blog-like{padding: 25px;    border-top: 10px solid #f5f5f7;}
.blog-like-section li{width: 100%;    margin-bottom: 10px;}}
/* iPhone6 */
@media screen and (max-width: 375px){}
/* iPhone5、4 */
@media screen and (max-width: 320px){}