/*细边框*/
.pl-border-top:before{content:'';position:absolute;left:0;top:0;right:0;border-top:solid 1px #ccc;transform:scaleY(.5);-webkit-transform:scaleY(.5);transform-origin:0 0;-webkit-transform-origin:0 0;}
.pl-border-bottom:after{content:'';position:absolute;left:0;bottom:0;right:0;border-bottom:solid 1px #ccc;transform:scaleY(.5);-webkit-transform:scaleY(.5);transform-origin:0 100%;-webkit-transform-origin:0 100%;}
.pl-border-left:before{content:'';position:absolute;top:0;left:0;bottom:0;border-left:solid 1px #ccc;transform:scaleX(.5);-webkit-transform:scaleX(.5);transform-origin:0 0;-webkit-transform-origin:0 0;}
.pl-border-right:after{content:'';position:absolute;top:0;right:0;bottom:0;border-right:solid 1px #ccc;transform:scaleX(.5);-webkit-transform:scaleX(.5);transform-origin:100% 0;-webkit-transform-origin:100% 0;}
/*
    弹出框
*/
.popup-layer-wrapper {color:#333;font-size:14px;}
.popup-layer-wrapper .pl-mask-layer { position: fixed; left: 0; top: 0; right: 0; bottom: 0;background-color: rgba(0,0,0,.6);}
.popup-layer-wrapper .pl-mian-wrapper { position: fixed; left: 0; top: 0;}
.popup-layer-wrapper .pl-content{position:relative;}
.popup-layer-wrapper .pl-content[data-scroll='1']{overflow:auto;-webkit-overflow-scrolling:touch;}
.popup-layer-wrapper .pl-content .pl-msg{padding:12px 15px;color:#fff;}
.popup-layer-wrapper .pl-content .pl-alert{padding:20px;text-align:center;}
.popup-layer-wrapper .pl-content .pl-confirm{padding:15px 20px;}
.popup-layer-wrapper .pl-content .pl-prompt{padding:15px;}
.popup-layer-wrapper .pl-content .pl-prompt .pl-text{margin-bottom:10px;}
.popup-layer-wrapper .pl-content .pl-prompt .pl-input{padding:6px;box-shadow:0 0 0 1px #ddd,inset 1px 1px 1px rgba(0,0,0,.08);border-radius: 3px;}
.popup-layer-wrapper .pl-content .pl-prompt .pl-input input{line-height:20px;height:20px;border:none;font-size:14px;width:100%;outline:none;padding:0;text-indent:0;}
.popup-layer-wrapper .pl-content .pl-iframe{width:100%;height:100%;border:none;}
.popup-layer-wrapper .pl-flex{display:-webkit-flex;display:flex;}
.popup-layer-wrapper .pl-hide{display:none;}
.popup-layer-wrapper .pl-icon-close{background-repeat:no-repeat;background-size:100%;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAAANlBMVEUAAAAwMDAyMjIzMzMyMjIzMzMwMDAyMjIyMjIwMDAyMjIyMjIwMDAyMjIyMjIzMzMyMjIzMzP+IrNPAAAAEXRSTlMAEO/P0KAwkIBAn3Ag38CwYAvGWgYAAACvSURBVEjH7dU5DsQgEAVRg/dlFu5/2RmZoJKWkCqz7J8WL0PQPXt2iX1f/dQ6k7aypSiUUnJDp/5/aI9CqbplyxKlueqWHVIYx6qNRRuLNhZtLNpYtLFoY9HGoo1FG4s2Fm0sGis0Vmis0NZ2KZ94VbYv5/LkLNrYYRSauyE0dwMtLFpYtLFoY9HGoo1FG4sW9tS3/kOPoKyBDfUShCNX29R7FNbP0n7r5vfcPbvZfgg3F61rdSqTAAAAAElFTkSuQmCC);}
.popup-layer-wrapper .pl-icon-loading{background-repeat:no-repeat;background-size:100%;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAMAAACahl6sAAAAOVBMVEUAAAD///////////////////////////////////////////////////////////////////////8KOjVvAAAAEnRSTlMAENCAwECgYPCwIHCQMFDf4L+2baoTAAADWElEQVR42u3di3KbMBCF4RUSdwzxvv/Ddpo4Q5KdeliQ6qP2/A+A+SwHFLCwMMYYY4yxmpuW+9gHqb5Zf7fdpPJW/WiofUwGfRSl6lr9rJGq2yEqVUcIWoSgRQhahKBFCFqEoEUIWoSgRUip2lF1i6F6yKrvNeGvQuZNtVklY2FQIykOCaO+t0i+oqqRlIaERh+1kq2kRlIKYh2askOsxA/xO3SQbC1qJH6I17En2bqpkRSDWEeSfEUjKQWxDl0lY52RFIJYRycCIPkCwXBYiRsC4rASLwTFYSVOCIzDSnwQHIeVuCBADivxQJAcVuKAQDkcEgPBcnglO+QNzOGUhH3P0BxOyaKPWjiHR7LvYQ/o8EkkNqoj4ngcloDM232SWh1WUqvDSmp1/JTcq3X8lPRyquX1jh+SJGdqERzfJW9ypgjh2CWnR2TEcHyVzHKmCOLYJW9BztSiOETmD8dNzjWiOESmmMZezhYSiuNy7ZJiK4wxxhhjjDHGGPs/mu96qGFcBbjQ6PE6KdAajzXf5Fl39RQld5PjjVyefpnU1SCZC5vm+URE9dVK3hbny8NCNtU8Q7KqryB5U19J/tib8x3J3KC5Xr9VR0OQzHXqan123Do+JilI7ibXkDTytFt7rEkKdHNIEvSjb8I8pkMt0DMkxhhjjDHGGGOMZawft6abpPo6s1bBV4iN3uPrL+08HDpMl65kNa8e0u7qheDm2oogmMUKvSqCJMfyEQTJV4eOJzcBIOkyPIVl1tdLvjvGszcSXi7JtAyx924G1PFyiXXUKbGOOiU+x62dQCUux7qp6v2GKHE49n1s8SQux6SPtoAmMY6DZ+4e7O/E55Ckn0WsY5dxHIdAHYWNwwFBOp8YhwcCdGY0DhcE5xxvHD4IzGzFOJwQlHmXcXghIDNI43BDMObCxuGHQMzqF7NxPwTh/5PWbLocxEoKDIh1+CF+SZRsJeMoC5G+0JCMxlEQYiWSrdk4ykGsZJB8NcZRDGIlo1zM3o4Zg5SC2KK5hZSjMCfzOJoiEPuB7gWhKxCZupSWSSBK+o/89ikhaBGCFiFoEYIWIWgRghYhaBGCFiFoLaqKdA3h+q/dDSAXES7fWJml9pb38ajfITLNsX/9V98ZY4wxxtiFfgF3f/kpXeDmvAAAAABJRU5ErkJggg==)}
/*模块*/
/*内容层*/
.popup-layer-wrapper[data-mode=content] .pl-mian-wrapper{border-radius:8px;line-height:20px;box-shadow:0 0 10px rgba(0,0,0,.2)}
.popup-layer-wrapper[data-mode=content] .pl-mian-wrapper .pl-title-bar{position:relative;-webkit-user-select:none;}
.popup-layer-wrapper[data-mode=content] .pl-mian-wrapper .pl-title-text{padding:10px;flex:1;}
.popup-layer-wrapper[data-mode=content] .pl-mian-wrapper .pl-close-btn{padding:12px;}
.popup-layer-wrapper[data-mode=content] .pl-mian-wrapper .pl-close-btn .pl-icon{width:16px;height:16px;}
.popup-layer-wrapper[data-mode=content] .pl-mian-wrapper .pl-close-btn:active{opacity:.6;}
.popup-layer-wrapper[data-mode=content] .pl-mian-wrapper .pl-btn-list{position:relative;-webkit-user-select:none;overflow:auto;-webkit-overflow-scrolling:touch;}
.popup-layer-wrapper[data-mode=content] .pl-mian-wrapper .pl-btn-item{position:relative;padding:10px 20px;text-align:center;flex:1;color:#a3864a;white-space:nowrap;}
.popup-layer-wrapper[data-mode=content] .pl-mian-wrapper .pl-btn-item:last-child:after{display:none;}
.popup-layer-wrapper[data-mode=content] .pl-mian-wrapper .pl-btn-item:active{background:rgba(0,0,0,.03)}
/*加载提示层*/
.popup-layer-wrapper[data-mode=loading] .pl-mask-layer{background:rgba(0,0,0,.1);}
.popup-layer-wrapper[data-mode=loading] .pl-title-bar,
.popup-layer-wrapper[data-mode=loading] .pl-btn-list{display:none;}
.popup-layer-wrapper[data-mode=loading] .pl-content{background:rgba(0,0,0,.6);border-color:rgba(0,0,0,.6);color:#fff;border-radius:3px;line-height:20px;max-width:200px;text-align:center;}
/*.popup-layer-wrapper[data-mode=loading] .pl-loading{padding:0 10px;}*/
.popup-layer-wrapper[data-mode=loading] .pl-loading .pl-icon{width:1.3rem;height:1.3rem;animation:rotate_cw 1.5s linear infinite;-webkit-animation:rotate_cw 1.5s linear infinite;}
.popup-layer-wrapper[data-mode=loading] .pl-loading .pl-text{margin-top:10px;}
/*tips层*/
.popup-layer-wrapper[data-mode=tips]{position:absolute;}
.popup-layer-wrapper[data-mode=tips] .pl-mask-layer,
.popup-layer-wrapper[data-mode=tips] .pl-title-bar,
.popup-layer-wrapper[data-mode=tips] .pl-btn-list{display:none;}
.popup-layer-wrapper[data-mode=tips] .pl-content{position:relative;background:rgba(0,0,0,.6);border-color:rgba(0,0,0,.6);color:#fff;border-radius:3px;line-height:20px;padding:9px 15px;}
.popup-layer-wrapper[data-mode=tips] .pl-content:before{content:'';position:absolute;border-style:solid;border-color:transparent;}
.popup-layer-wrapper[data-mode=tips] .pl-content[data-direc=left-top]:before{right:-9px;top:15px;border-width:4px 5px 4px 4px;border-bottom-color:inherit;border-left-color:inherit;}
.popup-layer-wrapper[data-mode=tips] .pl-content[data-direc=left-bottom]:before{right:-9px;bottom:15px;border-width:4px 5px 4px 4px;border-top-color:inherit;border-left-color:inherit;}
.popup-layer-wrapper[data-mode=tips] .pl-content[data-direc=right-top]:before{left:-9px;top:15px;border-width:4px 5px 4px 4px;border-bottom-color:inherit;border-right-color:inherit;}
.popup-layer-wrapper[data-mode=tips] .pl-content[data-direc=right-bottom]:before{left:-9px;bottom:15px;border-width:4px 5px 4px 4px;border-top-color:inherit;border-right-color:inherit;}
.popup-layer-wrapper[data-mode=tips] .pl-content[data-direc=top-left]:before{bottom:-9px;left:15px;border-width:5px 4px 4px 4px;border-top-color:inherit;border-right-color:inherit;}
.popup-layer-wrapper[data-mode=tips] .pl-content[data-direc=top-right]:before{bottom:-9px;right:15px;border-width:5px 4px 4px 4px;border-top-color:inherit;border-left-color:inherit;}
.popup-layer-wrapper[data-mode=tips] .pl-content[data-direc=bottom-left]:before{top:-9px;left:15px;border-width:5px 4px 4px 4px;border-bottom-color:inherit;border-right-color:inherit;}
.popup-layer-wrapper[data-mode=tips] .pl-content[data-direc=bottom-right]:before{top:-9px;right:15px;border-width:5px 4px 4px 4px;border-bottom-color:inherit;border-left-color:inherit;}
/*动画*/
/*弹出*/
.popup-layer-wrapper[data-tran=popup][data-show='0'] .pl-mask-layer{opacity:0;transition:opacity .3s;-webkit-transition:opacity .3s;}
.popup-layer-wrapper[data-tran=popup][data-show='1'] .pl-mask-layer{opacity:1;transition:opacity .3s;-webkit-transition:opacity .3s;}
.popup-layer-wrapper[data-tran=popup][data-show='0'] .pl-mian-wrapper{opacity:0;transform:scale3d(.5,.5,1);-webkit-transform:scale3d(.5,.5,1);transition:transform .3s cubic-bezier(0, 0, .5, -1),opacity .3s;-webkit-transition:-webkit-transform .3s cubic-bezier(0, 0, .5, -1),opacity .3s;}
.popup-layer-wrapper[data-tran=popup][data-show='1'] .pl-mian-wrapper{opacity:1;transform:scale3d(1,1,1);-webkit-transform:scale3d(1,1,1);transition:transform .3s cubic-bezier(0, 0, 0, 1.5),opacity .3s;-webkit-transition:-webkit-transform .3s cubic-bezier(0, 0, 0, 1.5),opacity .3s;}
/*从左到右滑入*/
.popup-layer-wrapper[data-tran=left_rihgt_slide][data-show='0'] .pl-mask-layer{opacity:0;transition:opacity .3s;-webkit-transition:opacity .3s;}
.popup-layer-wrapper[data-tran=left_rihgt_slide][data-show='1'] .pl-mask-layer{opacity:1;transition:opacity .3s;-webkit-transition:opacity .3s;}
.popup-layer-wrapper[data-tran=left_rihgt_slide][data-show='0'] .pl-mian-wrapper{opacity:0;transform:translateX(-100%);-webkit-transform:translateX(-100%);transition:transform .4s,opacity .3s;-webkit-transition:-webkit-transform .4s,opacity .3s;}
.popup-layer-wrapper[data-tran=left_rihgt_slide][data-show='1'] .pl-mian-wrapper{opacity:1;transform:translateX(0);-webkit-transform:translateX(0);transition:transform .4s,opacity .3s;-webkit-transition:-webkit-transform .4s,opacity .3s;}
/*从右到左滑入*/
.popup-layer-wrapper[data-tran=rihgt_left_slide][data-show='0'] .pl-mask-layer{opacity:0;transition:opacity .3s;-webkit-transition:opacity .3s;}
.popup-layer-wrapper[data-tran=rihgt_left_slide][data-show='1'] .pl-mask-layer{opacity:1;transition:opacity .3s;-webkit-transition:opacity .3s;}
.popup-layer-wrapper[data-tran=rihgt_left_slide][data-show='0'] .pl-mian-wrapper{opacity:0;transform:translateX(100%);-webkit-transform:translateX(100%);transition:transform .4s,opacity .3s;-webkit-transition:-webkit-transform .4s,opacity .3s;}
.popup-layer-wrapper[data-tran=rihgt_left_slide][data-show='1'] .pl-mian-wrapper{opacity:1;transform:translateX(0);-webkit-transform:translateX(0);transition:transform .4s,opacity .3s;-webkit-transition:-webkit-transform .4s,opacity .3s;}
/*从上到下滑入*/
.popup-layer-wrapper[data-tran=top_bottom_slide][data-show='0'] .pl-mask-layer{opacity:0;transition:opacity .3s;-webkit-transition:opacity .3s;}
.popup-layer-wrapper[data-tran=top_bottom_slide][data-show='1'] .pl-mask-layer{opacity:1;transition:opacity .3s;-webkit-transition:opacity .3s;}
.popup-layer-wrapper[data-tran=top_bottom_slide][data-show='0'] .pl-mian-wrapper{opacity:0;transform:translateY(-100%);-webkit-transform:translateY(-100%);transition:transform .4s,opacity .3s;-webkit-transition:-webkit-transform .4s,opacity .3s;}
.popup-layer-wrapper[data-tran=top_bottom_slide][data-show='1'] .pl-mian-wrapper{opacity:1;transform:translateY(0);-webkit-transform:translateY(0);transition:transform .4s,opacity .3s;-webkit-transition:-webkit-transform .4s,opacity .3s;}
/*从下到上滑入*/
.popup-layer-wrapper[data-tran=bottom_top_slide][data-show='0'] .pl-mask-layer{opacity:0;transition:opacity .3s;-webkit-transition:opacity .3s;}
.popup-layer-wrapper[data-tran=bottom_top_slide][data-show='1'] .pl-mask-layer{opacity:1;transition:opacity .3s;-webkit-transition:opacity .3s;}
.popup-layer-wrapper[data-tran=bottom_top_slide][data-show='0'] .pl-mian-wrapper{opacity:0;transform:translateY(100%);-webkit-transform:translateY(100%);transition:transform .4s,opacity .3s;-webkit-transition:-webkit-transform .4s,opacity .3s;}
.popup-layer-wrapper[data-tran=bottom_top_slide][data-show='1'] .pl-mian-wrapper{opacity:1;transform:translateY(0);-webkit-transform:translateY(0);transition:transform .4s,opacity .3s;-webkit-transition:-webkit-transform .4s,opacity .3s;}
/*顺时针旋转*/
@keyframes rotate_cw {0%{transform:rotateZ(0);}100%{transform:rotateZ(360deg);}}
@-webkit-keyframes rotate_cw {0%{-webkit-transform:rotateZ(0);}100%{-webkit-transform:rotateZ(360deg);}}
/*逆时针旋转*/
@keyframes rotate_ccw {0%{transform:rotateZ(360deg);}100%{transform:rotateZ(0);}}
@-webkit-keyframes rotate_ccw {0%{-webkit-transform:rotateZ(360deg);}100%{-webkit-transform:rotateZ(0);}}