

body,html{
    overflow: hidden;
}

.SYN-top{position:fixed;width:100%;height:60px;top:20px;left:0px;z-index:100;padding:0px 10px;}
/*暂无公众号*/
.SYN-nothing{border:1px solid #f3f3f3;height:50px;width:100%;border-radius:3px;display:none;background-color:#e6e6e6;line-height:48px;text-align:left;padding-left:10px;}
.SYN-nothing i{font-size:30px;vertical-align:middle;color:#aaa;}
.SYN-nothing span{font-size:14px;vertical-align:middle;margin-left:10px;color:#333;}
/*微信公众号选择*/
.SYN-gzh{border:1px solid #f3f3f3;height:50px;width:100%;border-radius:3px;z-index:100;position:relative;display:none;}
.SYN-gzh .p1{float:left;width:30px;margin-top:10px;margin-left:10px;}
.SYN-gzh .p2{float:left;line-height:48px;margin-left:10px;width:calc(100% - 125px);}
.SYN-gzh .p3{background-color:#21ab51;height:28px;line-height:28px;width:60px;text-align:center;color:#fff;margin:10px 10px 0 0;border-radius:3px;cursor:pointer;float:right;}
.SYN-gzh .p1 img{width:30px;height:30px;border-radius:50%;}

/*公众号列表*/
.SYN-gzhlist{position:fixed;top:78px;left:10px;z-index:200;background-color:#fff;right:10px;box-shadow:0px 0px 5px #ddd;border-radius:4px;display:none;}
.SYN-gzhlist-li{height:51px;position:relative;border-bottom:1px solid #f3f3f3;}
.SYN-gzhlist-li .p1{float:left;width:30px;margin-top:10px;margin-left:10px;}
.SYN-gzhlist-li .p2{float:left;line-height:48px;margin-left:10px;width:calc(100% - 80px);}
.SYN-gzhlist-li .p3{position:absolute;width:30px;height:30px;line-height:30px;right:0px;text-align:center;top:10px;font-size:16px;color:#fff;}
.SYN-gzhlist-li .p1 img{width:30px;height:30px;border-radius:50%;}
.SYN-gzhlist .add .p3{color:#21ab51;}
.SYN-gzhlist-add{height:50px;padding-top:10px;}
.SYN-gzhlist-add p{width:100px;height:30px;margin:0 auto;background-color:#ff4d4d;color:#fff;cursor:pointer;text-align:center;line-height:30px;border-radius:3px;}
.SYN-gzhlist-bg{position:fixed;z-index:199;width:100%;height:100%;top:0px;left:0px;display:none;}
/*公众号授权提示*/
.SYN-power-bg{position:fixed;z-index:210;width:100%;height:100%;top:0px;left:0px;background-color:rgba(0,0,0,0.6);padding:10px;display:none;}
.SYN-power{background-color:#fff;width:100%;margin:0 auto;border-radius:5px;}
.SYN-power .p1{height:51px;line-height:50px;padding:0px 15px;font-size:22px;border-bottom:1px solid #e7e8eb;margin-bottom:15px;color:#333;}
.SYN-power .p2{padding:0px 15px;margin-bottom:10px;font-size:14px;letter-spacing:1px;text-align:justify;color:#666;}
.SYN-power .p3{height:61px;margin-top:15px;border-top:1px solid #e7e8eb;padding-top:14px;}
.SYN-power .p3 span{float:right;height:32px;line-height:32px;margin-right:10px;cursor:pointer;padding:0px 15px;border-radius:3px;color:#fff;font-size:14px;}
.SYN-power .sp1{background-color:#21ab51;}
.SYN-power .sp2{background-color:#ff4d4d;}
/*主体内容*/
.SYN-body{width: 100%;position: relative;top: 80px;height: calc(100% - 150px);overflow-x: hidden;overflow-y: auto;padding: 5px 10px 0;}
/*文章列表*/
.SYN-ul{background-color:#fff;margin:0 auto;box-shadow:0px 0px 5px #ddd;background-color:#fff;padding:5px 15px;display:none;}
.SYN-li{position:relative;cursor:pointer;padding:10px 0px;}
/*操作按钮*/
.SYN-li .d1{position:absolute;font-size:0px;text-align:center;color:#999;}
.SYN-li .d1 p{display:inline-block;font-size:12px;width:20px;height:20px;line-height:20px;margin-right:15px;background-color:#f3f3f3;border-radius:2px;cursor:pointer;}
/*只有一个*/
.SYN-li:first-child:last-child .p1{line-height:22px;color:#353535;margin:0 0 10px;font-size:16px;text-align:justify;letter-spacing:1px;position:static;background-color:#fff;padding:0px;}
.SYN-li:first-child .p2{background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-color:#F6F8F9;padding-bottom:56.25%;border-radius:3px;}
.SYN-li:first-child:last-child .d1{bottom:18px;left:10px;top:auto;}
.SYN-li:first-child:last-child .p3{display:inline-block;}
.SYN-li:first-child:last-child .p4{display:none;}
.SYN-li:first-child:last-child .p5{display:none;}
.SYN-li:first-child:last-child .p6{display:inline-block;}
/*有多个第一个*/
.SYN-li:first-child .p1{position:absolute;bottom:10px;width:100%;text-align:justify;color:#fff;left:0px;background-color:rgba(0,0,0,0.55);padding: 8px 12px;font-size:16px;}
.SYN-li:first-child .d1{top:18px;left:10px;}
.SYN-li:first-child .p3{display:inline-block;}
.SYN-li:first-child .p4{display:none;}
.SYN-li:first-child .p5{display:inline-block;}
.SYN-li:first-child .p6{display:inline-block;}
/*有多个的第二个到其他*/
.SYN-li:nth-child(n+2){border-top:1px solid #ddd;height:84px;width:100%;}
.SYN-li:nth-child(n+2) .d1{bottom:10px;left:0px;}
.SYN-li:nth-child(n+2) .p1{color:#444;overflow:hidden;line-height:20px;float:left;height:20px;width:calc(100% - 70px);font-size:15px;font-weight:bold;}
.SYN-li:nth-child(n+2) .p2{width:60px;height:60px;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;float:right;border-radius:3px;}
.SYN-li:nth-child(n+2) .p3{display:inline-block;}
.SYN-li:nth-child(n+2) .p4{display:inline-block;}
.SYN-li:nth-child(n+2) .p5{display:inline-block;}
.SYN-li:nth-child(n+2) .p6{display:inline-block;}
/*有多个最后一个*/
.SYN-li:last-child .p3{display:inline-block;}
.SYN-li:last-child .p4{display:inline-block;}
.SYN-li:last-child .p5{display:none;}
.SYN-li:last-child .p6{display:inline-block;}
/*没有文章时*/
.SYN-artnone{position:relative;padding-bottom:50%;background-color:#e6e6e6;border-radius:4px;cursor:pointer;}
.SYN-artnone p{position:absolute;left:0px;width:100%;height:30px;top:50%;margin-top:-15px;text-align:center;font-size:18px;color:#fff;line-height:30px;}
.SYN-artnone p i{margin-right:15px;font-size:24px;position:relative;top:3px;}
/*添加文章*/
.SYN-add,.SYN-foot{height:42px;text-align:center;margin-top:15px;line-height:42px;border-radius:3px;font-size:16px;cursor:pointer;}
.SYN-add i,.SYN-foot i{margin-right:8px;font-size:18px;position:relative;top:1px;}
.SYN-add{background-color:#f3f3f3;color:#999;display:none;}
.SYN-foot{background-color:#21ab51;color:#fff;display:none;}



/*文章弹窗*/
.ARTC-body{position:fixed;width:100%;height:100%;z-index:1000;background-color:#fff;top:0px;left:0px;display:none;}
/*分组*/
.ARTC-group{position:fixed;background-color:#fff;height:40px;line-height:40px;top:0px;z-index:100;padding:0px 10px;width:100%;}
.ARTC-group-ul{overflow-y:hidden;overflow-x:auto;width:100%;height:40px;word-break:keep-all;white-space:nowrap;}
.ARTC-group li{height:100%;position:relative;color:#333;font-size:16px;padding:0px 15px;display:inline-block;vertical-align:middle;}
.ARTC-group li span{position:absolute;height:4px;width:20px;background-color:#21AB51;border-radius:5px;bottom:0px;left:50%;margin-left:-10px;display:none;}
.ARTC-group .add{color:#21AB51;font-weight:bold;}
.ARTC-group .add span{display:block;}
/*搜索*/
.ARTC-seach{position:fixed;background-color:#f3f3f3;height:56px;top:40px;z-index:100;padding:10px 10px 0px;width:100%;}
.ARTC-seach-main{float:left;height:36px;background-color:#fff;width:calc(100% - 66px);border-radius:20px;position:relative;}
.ARTC-seach .p1{float:left;width:calc(100% - 81px);height:36px;padding:0px 10px 0px 20px;}
.ARTC-seach .p1 input{width:100%;height:100%;}
.ARTC-seach .p2{float:left;height:20px;width:1px;background-color:#ddd;margin-top:8px;}
.ARTC-seach .p3{float:right;width:80px;text-align:center;line-height:36px;height:36px;letter-spacing:1px;color:#666;cursor:pointer;}
.ARTC-seach .p4{float:right;height:36px;text-align:center;color:#21AB51;width:60px;line-height:36px;cursor:pointer;}
.ARTC-seach .p4 i{margin-left:5px;}
/*文章列表*/
.ARTC-main{width:100%;height:100%;background-color:#f3f3f3;padding-top:86px;}
.ARTC-list{overflow-x:hidden;overflow-y:auto;padding:10px 10px 0px;position:relative;width:100%;height:100%;}
.ARTC-list li{padding:10px 0px 0px;background-color:#fff;margin-bottom:10px;position:relative;border-radius:3px;overflow:hidden;height:145px;}
.ARTC-list p{position:absolute;}
.ARTC-list .p01{width:80px;height:80px;top:10px;left:10px;background-size:cover;background-position:50% 50%;border-radius:3px;}
.ARTC-list .p02{height:20px;line-height:20px;color:#333;font-size:16px;top:15px;left:100px;font-weight:bold;}
.ARTC-list .p03{height:20px;line-height:20px;color:#aaa;font-size:12px;top:50px;left:100px;}
.ARTC-list .p04{height:20px;line-height:20px;color:#aaa;font-size:12px;top:70px;left:100px;}
.ARTC-list .p05{height:1px;width:100%;bottom:40px;left:0px;background-color:#f3f3f3;}
.ARTC-list .p06{text-align:center;line-height:40px;bottom:0px;height:40px;width:100%;font-size:18px;color:#21AB51;}
.ARTC-list .p07{text-align:center;line-height:40px;bottom:0px;height:40px;width:100%;font-size:18px;background-color:#21AB51;color:#fff;display:none;}
.ARTC-list .add .p06{display:none;}
.ARTC-list .add .p07{display:block;}
/*确定按钮*/
.ARTC-sure{position:fixed;width:50px;height:50px;border-radius:50%;box-shadow:0px 0px 12px #ddd;bottom:40px;right:20px;text-align:center;line-height:50px;font-size:16px;color:#fff;cursor:pointer;background-color:#21ab51;}


/*同步失败时弹出图片*/
.TongImg{max-height:300px;width:100%;}
.TongImg-ul{width:100%;height:100%;overflow-x:hidden;overflow-y:auto;text-align:center;font-size:0px;padding:15px 8px;}
.TongImg-ul li{width:50%;display:inline-block;vertical-align:top;font-size:14px;padding:15px 8px;}
.TongImg-ul .p1{padding-bottom:100%;background-color:#f3f3f3;width:100%;position:relative;}
.TongImg-ul .sp1{position:absolute;width:100%;left:0px;height:100%;padding:2px;}
.TongImg-ul .sp1 img{position:absolute;left:50%;top:50%;max-width:100%;max-height:100%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);}
.TongImg-ul .sp2{position:absolute;left:0px;height:20px;top:50%;margin-top:-10px;line-height:20px;width:100%;color:#aaa;font-size:16px;}
.TongImg-ul .p2{height:20px;line-height:20px;margin-top:5px;color:#666;}
/*同步失败错误提示*/
.TongFail{text-align:center;padding:30px;}
.TongFail .p1{line-height:20px;font-size:15px;color:#666;}
.TongFail .p2{line-height:20px;font-size:14px;color:#666;margin-top:10px;}



/*图片弹窗*/
.iframe-body{position:fixed;z-index:1000;top:0px;left:0px;width:100%;height:100%;background-color:#fff;display:none;}
.iframe-body iframe{width:100%;height:100%;}


/* 同步弹窗 */
.sync-bg{
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background-color: rgba(0, 0, 0, 0.6);
}
.sync-title{
    position: relative;
    font-size: 14px;
    text-align: center;
    height: 34px;
    line-height: 24px;
    color: #666;
    padding: 0 0 10px;
    border-bottom: 1px solid #eee;
    margin: 0 -10px 10px;
}
.sync-title span{
    position: absolute;
    right: 10px;
    top: 0;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    color: #f35858;
    cursor: pointer;
    font-size: 18px;
}
.sync-preview-cont{
    position: fixed;
    left: 50%;
    top: 50%;
    font-size: 0;
    padding: 10px 10px 0;
    background-color: #fff;
    border-radius: 5px;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    text-align: center;
}
.sync-preview-cont.snm_1{width: 50%;}
.sync-preview-cont.snm_2{width: 80%;}
.sync-preview-cont.snm_3{width: 90%;}
.sync-preview-cont.snm_4{width: 70%;}
.sync-preview-cont.snm_1 .sync-preview-lists{width: 80%;}
.sync-preview-cont.snm_2 .sync-preview-lists{width: 50%;}
.sync-preview-cont.snm_3 .sync-preview-lists{width: calc(100% / 3);}
.sync-preview-cont.snm_4 .sync-preview-lists{width: 50%;}
.sync-preview-lists{padding: 0 5px;margin: 0 0 10px;display: inline-block;vertical-align: middle;text-align: center;}
.sync-preview-lists .p1{font-size:13px;color:#333;}
.sync-preview-lists .p2{margin-top:2px;}
.sync-preview-lists .p3{display:flex;justify-content:space-between;align-items:center;font-size:14px;margin-top:2px;padding:0px 4px;}
.sync-preview-lists .p3 span{cursor:pointer;color: #326abd;}
.sync-preview-lists .p3 a{color: #326abd;}