body{font-size:18px}[class^=".demo_"]{font-size:16px}[data-template]{display:none;width:0;height:0;border:0;padding:0;margin:0}.demo_hidden::-webkit-scrollbar{display:none}.demo_toast{position:absolute;bottom:10%;transform:translateX(-50%) scale(0);padding:10px;line-height:1.3;border-radius:5px;max-width:80%;height:auto;word-break:break-all;left:50%;background-color:rgba(0,0,0,.6);color:#fff;text-align:center;width:auto;transition:all .8s;opacity:0;z-index:2200;overflow:hidden}.demo_toast.show{opacity:1;transform:scale(1) translateX(-50%)}.demo_toast.pc{max-width:300px}.demo_toast.em{max-width:6rem}.demo_checkbox{display:inline-block;user-select:none}.demo_checkbox+.demo_checkbox{margin-left:8px}.demo_checkbox input[type=checkbox],.demo_checkbox input[type=radio]{width:0;height:0;display:none;opacity:0}.demo_checkbox input[type=checkbox]+label,.demo_checkbox input[type=radio]+label{position:relative;box-sizing:border-box;display:block;line-height:40px;height:40px;cursor:pointer;transition:all .3s}.demo_checkbox input[type=checkbox]+label i,.demo_checkbox input[type=radio]+label i{width:20px;height:20px;border:1px solid #eee;box-sizing:border-box;position:relative;display:inline-block;vertical-align:middle;border-radius:2px;transition:all .3s}.demo_checkbox input[type=checkbox]+label i::before,.demo_checkbox input[type=radio]+label i::before{opacity:0;transition:all .3s;content:'';width:60%;height:60%;position:absolute;left:0;right:0;bottom:0;top:0;margin:auto;background-color:#57ccdf}.demo_checkbox input[type=checkbox]:checked+label,.demo_checkbox input[type=radio]:checked+label{color:#57ccdf}.demo_checkbox input[type=checkbox]:checked+label i,.demo_checkbox input[type=radio]:checked+label i{border-color:#57ccdf}.demo_checkbox input[type=checkbox]:checked+label i::before,.demo_checkbox input[type=radio]:checked+label i::before{opacity:1}.demo_checkbox input[type=checkbox]:disabled+label,.demo_checkbox input[type=radio]:disabled+label{color:#999;cursor:default}.demo_checkbox input[type=radio]+label i{border-radius:50%}.demo_checkbox input[type=radio]+label i::before{border-radius:50%}.demo_checkbox label i{margin-right:5px}.demo_checkbox label.check i::before{width:70%;height:40%;background-color:transparent;border:1px solid #57ccdf}.demo_carousel{height:100%;width:100%;position:relative}.demo_carousel .dn{display:none;opacity:0}.demo_carousel .demo_carousel_dot{position:absolute;left:0;top:0;width:100%;box-sizing:border-box;top:auto;bottom:0;text-align:center;z-index:20;font-size:0;overflow:hidden}.demo_carousel .demo_carousel_dot li{display:inline-block;margin:2px;cursor:pointer;transition:all .3s;width:5px;height:5px;border-radius:3px;background-color:#fff}.demo_carousel .demo_carousel_dot li.active{width:15px}.demo_carousel .demo_carousel_next,.demo_carousel .demo_carousel_prev{position:absolute;left:0;top:0;width:100%;bottom:0;margin:auto;font-size:14px;width:30px;height:30px;background-color:rgba(255,255,255,.8);text-align:center;color:#999;z-index:22;border-radius:30%;border:0;box-sizing:border-box;transition:all .3s}.demo_carousel .demo_carousel_prev{left:10px;transform:translateX(-100%) scale(0)}.demo_carousel .demo_carousel_next{left:auto;right:10px;transform:translateX(100%) scale(0)}.demo_carousel.hidden{overflow:hidden}.demo_carousel.hidden .demo_carousel_dot{bottom:10px;height:10px}.demo_carousel.hidden:hover .demo_carousel_next,.demo_carousel.hidden:hover .demo_carousel_prev{transform:translateX(0) scale(1);opacity:1}.demo_carousel.visible{overflow:visible}.demo_carousel.visible .demo_carousel_dot{bottom:-20px;height:10px}.demo_carousel.visible .demo_carousel_dot li{background-color:rgba(233,175,68,.8)}.demo_carousel .item{height:100%;position:absolute;left:0;top:0;width:100%;box-sizing:border-box;transition:all .5s;background-color:#f0f0f0}.demo_carousel .item img{max-width:100%;max-height:100%;display:block;margin:0 auto}.demo_carousel .item:hover{cursor:pointer}.demo_carousel .item.blur .before{position:absolute;left:0;top:0;box-sizing:border-box;z-index:-1;width:100%;height:100%;filter:blur(10px)}.demo_carousel .item .text{position:absolute;left:0;top:0;width:100%;box-sizing:border-box;top:auto;bottom:0;height:30px;line-height:30px;font-size:14px;padding:0 10px;background-color:rgba(25,26,26,.3);color:#eee;z-index:15}.demo_form section{margin-bottom:5px;display:flex}.demo_form section>.label,.demo_form section>label{width:100px;height:40px;line-height:40px;text-align:right;box-sizing:border-box;padding-right:8px;font-size:15px;color:#666;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.demo_form section article{flex:1}.demo_form section article .err{font-size:12px;color:tomato;text-align:left;text-indent:10px;margin:5px 0 0;min-height:12px;display:block}.demo_form section article button,.demo_form section article input{width:100%}.demo_form section article .error{border-color:tomato!important}.demo_form section article .more{display:flex}.demo_form section article .more button,.demo_form section article .more input{flex:1}.demo_form section article .more button+button,.demo_form section article .more button+input,.demo_form section article .more input+button,.demo_form section article .more input+input{margin-left:10px}.demo_form section article button.r{width:auto;float:right;display:block}.demo_form section article button.r+.r{margin-right:10px}.demo_form section button,.demo_form section input{box-sizing:border-box;height:40px;line-height:40px}.demo_form section input{width:100%}.demo_form section button{border:0}.demo_model{z-index:86402;position:fixed;left:0;right:0;top:0;bottom:0;margin:auto}.demo_model .title{height:35px;line-height:35px;font-size:15px;width:100%;box-sizing:border-box;border-bottom:1px solid #ccc;padding:0 40px 0 10px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;user-select:none;font-weight:700}.demo_model .close{position:absolute;right:0;top:0;width:35px;height:35px;line-height:35px;color:#999;font-size:18px;text-align:center;cursor:pointer;transition:all .2s}.demo_model .close::before{position:absolute;content:'x';width:100%;height:100%;left:0;top:0}.demo_model .close:hover{color:#ff9582}.demo_model.alert,.demo_model.model{width:300px;box-shadow:0 0 10px rgba(0,0,0,.5);border-radius:3px;transition:all .5s;transform:translateY(0)}.demo_model.alert .msg,.demo_model.model .msg{padding:10px;font-size:14px;line-height:20px;min-height:20px;box-sizing:border-box;padding-right:40px}.demo_model.alert.lang,.demo_model.model.lang{width:500px}.demo_model.alert.small,.demo_model.model.small{width:150px}.demo_model.alert.auto,.demo_model.model.auto{width:80%}.demo_model.alert.hidden,.demo_model.model.hidden{transform:translateY(-100vh)}.demo_model.alert.error,.demo_model.model.error{background-color:#fef0f0;color:#f56c6c}.demo_model.alert.success,.demo_model.model.success{background-color:#f0f9eb;color:#67c23a}.demo_model.alert.warning,.demo_model.model.warning{background-color:#fdf6ec;color:#e6a23c}.demo_model.model{min-height:75px;bottom:auto;top:50%;transform:translateY(-50%);background-color:#fff;color:#909399}.demo_model.model .btn{margin-top:5px;padding:5px;text-align:center;display:flex;justify-content:center}.demo_model.model .btn button{min-width:60px;box-sizing:border-box}.demo_model.model .btn button+button{margin-left:10px}.demo_model.model.popup .msg{text-align:center;text-indent:25px}.demo_model.model.popup .btn{margin-top:15px;padding:0;border-top:1px solid #eee}.demo_model.model.popup .btn button{flex:1;margin:0;border:0}.demo_model.model.popup .btn button+button{border-left:1px solid #eee}.demo_model.alert{min-height:40px;bottom:auto;top:80px;background-color:#f4f4f5;color:#909399}.demo_model.alert .title{border:0}.demo_loading{z-index:86401;position:fixed;left:0;right:0;top:0;bottom:0;margin:auto;width:100%;height:100%;background-color:rgba(224,224,224,.3)}.demo_loading::before{position:absolute;left:0;top:0;width:100%;box-sizing:border-box;right:0;bottom:0;margin:auto;width:50px;height:50px;border-radius:50%;content:'';border:2px solid rgba(39,180,245,.7);border-top:0;border-left:0;animation:rsLoading 1s linear infinite}.demo_loading.light{background-color:rgba(15,14,14,.3)}.demo_loading.circle::before{animation:rsCircle 1s linear infinite;border:10px solid rgba(39,180,245,.7);width:100px;height:100px}.demo_loading.load::before{width:0;height:0;border:0;border-top:10px dotted rgba(39,180,245,.7);animation:rsLoad 1s linear infinite;border-radius:0}.demo_loading.circle_load::before{animation:rsCircleDotted 1.5s linear infinite;border:0;border-top:3px dotted rgba(39,180,245,.7)}.demo_loading.square::before{width:0;height:0;animation:rsSquare 1.5s linear infinite;border:0;border:5px solid rgba(39,180,245,.7)}.demo_loading.model::before{animation-play-state:paused;opacity:0;display:none}.demo_loading.web{width:140px;height:140px;background:rgba(51,51,51,.5);box-sizing:border-box;padding:40px;border-radius:8px;color:#fff}.demo_loading.web::before{content:'';width:60px;height:60px;border-radius:50%;border:4px solid #fff;border-color:#fff transparent transparent;animation:rsWeb 1.2s ease-in infinite}.demo_fixed{width:100%;height:100%;position:absolute;left:0;top:0;z-index:-1}.demo_btn{position:relative;z-index:10}.demo_btn::before{content:'';position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;z-index:9;transition:all .5s;background-color:tomato}.demo_btn[data-bgc=success]::before{background-color:#6dda40}.demo_btn[data-bgc=primary]::before{background-color:#229ffd}.demo_btn[data-bgc=info]::before{background-color:#5bc0de}.demo_btn[data-bgc=warning]::before{background-color:#feae1b}.demo_btn[data-bgc=default]::before{background-color:#ebebeb}.demo_btn:hover{color:#fff}.demo_btn:hover::before{opacity:1}.demo_btn>*{position:relative;z-index:11;transition:all .8s;color:inherit}.demo_btn.cover::before{background-color:transparent}.demo_btn.cover i{position:absolute;width:100%;height:100%;z-index:10;box-sizing:border-box;border:1px solid transparent;left:0;top:0;transition:all .5s}.demo_btn.cover i:nth-child(1){border-top-color:tomato;transform:translateX(-100%)}.demo_btn.cover i:nth-child(2){border-right-color:tomato;transform:translateY(-100%)}.demo_btn.cover i:nth-child(3){border-bottom-color:tomato;transform:translateX(100%)}.demo_btn.cover i:nth-child(4){border-left-color:tomato;transform:translateY(100%)}.demo_btn.cover:hover{color:tomato}.demo_btn.cover:hover i{transform:translateX(0) translateY(0)}.demo_btn.border::before{filter:opacity(.3);transform:skewX(-45deg) translateX(-200%);width:40%;transition:all 1s}.demo_btn.border:hover::before{transform:skewX(-45deg) translateX(400%)}.demo_btn.rotate::before{transform:rotate(360deg) scale(0)}.demo_btn.rotate:hover::before{transform:rotate(0) scale(1)}.demo_btn.left::before{transform:translateX(-100%)}.demo_btn.left:hover::before{transform:translateX(0)}.demo_btn.right::before{transform:translateX(100%)}.demo_btn.right:hover::before{transform:translateX(0)}.demo_btn.top::before{transform:translateY(-100%)}.demo_btn.top:hover::before{transform:translateY(0)}.demo_btn.bottom::before{transform:translateY(100%)}.demo_btn.bottom:hover::before{transform:translateY(0)}.demo_btn.scale::before{transform:scale(0)}.demo_btn.scale:hover::before{transform:scale(1)}.demo_frame{position:fixed;left:0;top:0;right:0;bottom:0;width:80%;height:80%;z-index:900;margin:auto;border-radius:5px;overflow:hidden;transition:all .8s;opacity:1;transform:translateX(0) scale(1);background-color:#fff}.demo_frame.shadow{box-shadow:0 0 10px #cecece}.demo_frame.shadow_top{box-shadow:-5px -5px 10px #cecece}.demo_frame.shadow_bottom{box-shadow:0 10px 10px #cecece}.demo_frame.shadow_left{box-shadow:-10px 0 10px #cecece}.demo_frame.shadow_right{box-shadow:5px 5px 10px #cecece}.demo_frame.hidden{opacity:0;transform:translateX(-100%) scale(.1)}.demo_frame.auto .frame_header{opacity:0;height:0}.demo_frame.auto .close{position:absolute;right:0;top:0;width:40px;height:40px;line-height:40px;text-align:center;color:#999;font-size:14px;cursor:pointer;transition:all .3s;z-index:40}.demo_frame.auto .close:hover{color:tomato}.demo_frame.auto .frame_main{height:100%}.demo_frame .frame_header{position:relative;height:40px;border-bottom:1px solid #eee;box-sizing:border-box;line-height:39px;padding:0 10px;user-select:none;color:#222}.demo_frame .frame_header b{display:inline-block;max-width:calc(100% - 40px);font-size:16px;font-weight:700}.demo_frame .frame_header .close{position:absolute;right:0;top:0;width:40px;height:40px;text-align:center;color:#999;font-size:14px;cursor:pointer;transition:all .3s}.demo_frame .frame_header .close:hover{color:tomato}.demo_frame .frame_main{height:calc(100% - 40px);position:relative;overflow:hidden;z-index:30;box-sizing:border-box;background-color:#fdfdfd}.demo_frame .frame_main>.content{position:relative;padding:8px;box-sizing:border-box}.demo_frame .frame_main>iframe{display:block;width:100%;height:100%}.demo_frame .frame_foot{position:absolute;bottom:0;left:0;width:100%;height:40px;background-color:#eee;z-index:50}.demo_page{height:100px;padding:30px 0;box-sizing:border-box;max-width:360px;margin:0 auto;user-select:none}.demo_page .next,.demo_page .prev,.demo_page li{height:40px;float:left;border-radius:5px;overflow:hidden;position:relative;margin:0 5px;color:#222;transition:all .5s;border:1px solid rgba(153,153,153,.3);line-height:40px;text-align:center;font-size:13px;box-sizing:border-box}.demo_page .next,.demo_page .prev{width:60px}.demo_page .next.disabled,.demo_page .prev.disabled{background-color:rgba(238,238,238,.5);color:rgba(102,102,102,.6);cursor:default}.demo_page li{width:40px;margin:0}.demo_page li+li{margin-left:5px}.demo_page li.active{background-color:#3a9af5;color:#fff}.demo_page li a{display:block;width:100%;height:100%;color:inherit}.demo_page ul{transition:all .5s}.demo_page .page_item{float:left;max-width:220px;overflow:hidden;position:relative}.demo_document{position:relative;overflow:hidden;height:100%;width:100%}.demo_document .flex,.demo_document.flex{display:flex}.demo_document .flex .f1,.demo_document.flex .f1{flex:1}.demo_document .flex .f2,.demo_document.flex .f2{flex:2}.demo_document .flex.warp,.demo_document.flex.warp{flex-wrap:wrap}.demo_document .nav{width:200px;background-color:#fdfdfd}.demo_document .nav ul{box-sizing:border-box;width:100%}.demo_document .nav li span{padding-left:15px;cursor:pointer;height:40px;line-height:40px;text-align:left;display:block;width:100%;border-bottom:1px solid rgba(204,204,204,.2);font-weight:700;color:#333;position:relative;box-sizing:border-box;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.demo_document .nav li span::before{position:absolute;left:6px;top:0;width:2px;height:15px;margin:auto;bottom:0;content:'';background-color:#4af09d;opacity:0}.demo_document .nav li span:hover::before{opacity:1}.demo_document .nav .t1 li span,.demo_document .nav .t2 li span{height:auto;line-height:1;padding:5px 0;font-weight:400;color:#666}.demo_document .nav .t1 li span{padding-left:30px}.demo_document .nav .t2 li span{padding-left:45px}.demo_document .main{flex:1;width:calc(100% - 200px);box-shadow:0 0 10px rgba(122,122,122,.6) inset;border-radius:5px;padding:5px}.demo_document .main iframe{display:block;width:100%;height:100%}.demo_document .contents{width:100%}.demo_document .show{margin:10px;margin:0 auto;border:1px solid rgba(136,135,135,.2);overflow:hidden;position:relative}.demo_document .show .item{background-color:#eee}.demo_document .show .item:nth-child(2n){background-color:#a1dbe2}.demo_document .name{font-size:18px;text-align:center;padding:10px;box-sizing:border-box;margin-bottom:10px}.demo_document .text{word-break:break-all;font-size:14px;color:#666;line-height:1.2;text-indent:40px}.demo_document p.text{margin-bottom:45px}.demo_document .h30{color:#666;font-size:14px;margin-bottom:10px}.demo_document .h30 b,.demo_document .h30 button{height:30px;line-height:30px}.demo_document .h30 b+button{margin-left:10px}.demo_document pre{white-space:pre-wrap;background-color:rgba(5,5,5,.9);box-sizing:border-box;color:#fff;font-size:13px;padding:10px;border-radius:8px;overflow:hidden;margin:10px 0}.demo_document .show_sl_click{display:inline-block;color:#40e0d0;transition:all .3s;font-size:15px;margin:20px 0}.demo_document .show_sl_click:hover{color:#57ccdf}.demo_document .w100{width:100%;max-width:1200px;margin:0 auto}.demo_document .main,.demo_document .nav{height:100%;position:relative;overflow:hidden;box-sizing:border-box}.demo_delay{display:inline-block;animation-duration:.5s;animation-iteration-count:1;animation-timing-function:linear}.demo_delay.animate{animation-name:delayTop}.demo_delay.left{animation-name:delayLeft}.demo_delay.right{animation-name:delayRight}.demo_delay.ease{animation-timing-function:ease}.demo_delay.ease-in{animation-timing-function:ease-in}.demo_delay.time3{animation-duration:.3s}.demo_delay.time8{animation-duration:.8s}.demo_delay.time10{animation-duration:1s}.demo_delay.time15{animation-duration:1.5s}.demo_tab{height:100%;display:block;box-sizing:border-box;position:relative;overflow:hidden}.demo_tab .tab{display:flex;height:40px}.demo_tab .list{height:calc(100% - 40px)}.demo_tab [data-tab]{display:block;text-align:center;cursor:pointer;font-size:16px;line-height:40px;height:40px;border-bottom:1px solid transparent;transition:all .3s;color:#444;flex:1;box-sizing:border-box}.demo_tab [data-tab].active{border-bottom-color:#feae1b;color:#222}.demo_tab [data-tab-list]{opacity:0;position:absolute;left:0;top:0;width:100%;height:100%;transform:translateY(100%);transition:all .5s;z-index:-1}.demo_tab [data-tab-list].show{z-index:10;opacity:1;position:relative;transform:translateY(0)}.demo_progress{display:block;background-color:#f9f9f9;height:10px;position:relative;overflow:hidden;z-index:1000}.demo_progress .run{height:100%;position:absolute;left:0;top:0;width:0;transition:all .5s;z-index:1001;background:#34d834}.demo_right{position:fixed;width:150px;height:auto;z-index:80000;min-height:40px;background-color:#fff;left:-100vw;top:-100vh;border:1px solid #ccc;border-radius:5px;box-shadow:0 0 5px #ccc;user-select:none!important}.demo_right .close{position:absolute;width:20px;height:20px;left:-10px;top:-10px;background-color:#fff;border:1px solid #ccc;border-radius:50%;font-size:12px;text-align:center;line-height:20px;color:#999;cursor:pointer}.demo_right .close:hover{color:tomato}.demo_right .before{position:absolute;left:0;top:0;right:0;bottom:0;margin:auto;font-size:30px;color:#999;opacity:.3;width:30px;height:30px}.demo_right .tab{position:relative;overflow:hidden;box-sizing:border-box;padding:10px 5px}.demo_right .tab.scroll{height:156px}.demo_right li{height:26px;line-height:26px;border-bottom:1px solid #eee;padding:0 5px;box-sizing:border-box;font-size:12px;cursor:default;position:relative;transition:all .3s}.demo_right li::before{opacity:0;transition:all .3s;left:-5px;top:0;width:calc(100% + 10px);height:100%;background-color:#eee;content:'';position:absolute}.demo_right li:last-child{border-bottom:0}.demo_right li:hover{color:#40e0d0}.demo_right li:hover::before{opacity:.5}.demo_right li span{position:relative;display:block;width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}@media screen and (max-width:750px){.demo_carousel .demo_carousel_next,.demo_carousel .demo_carousel_prev{opacity:1;transform:translateX(0) scale(1)}}@keyframes rsLoading{0%{transform:rotate(0)}50%{transform:rotate(180deg);border-color:rgba(0,255,255,.5)}100%{transform:rotate(360deg)}}@keyframes rsWeb{0%{transform:rotate(0)}90%{transform:rotate(320deg)}100%{transform:rotate(359deg)}}@keyframes rsCircle{0%{transform:scale(0);opacity:0}50%{transform:scale(1);opacity:.8}100%{transform:scale(2);opacity:.1}}@keyframes rsLoad{0%{width:10px;transform:rotate(0)}50%{width:100px;transform:rotate(180deg)}100%{width:10px;transform:rotate(360deg)}}@keyframes rsCircleDotted{0%{transform:scale(0) rotate(0);opacity:0}25%{transform:scale(.5) rotate(90deg);opacity:.5}50%{transform:scale(1) rotate(180deg);opacity:1}75%{transform:scale(1.5) rotate(270deg);opacity:.5}100%{transform:scale(2) rotate(360deg);opacity:0}}@keyframes rsSquare{0%{width:0;height:0;opacity:0}50%{border-radius:0;transform:rotate(180deg);opacity:1;border-color:#42b983;border-style:dotted}100%{width:80px;height:80px;opacity:0;transform:rotate(360deg)}}@keyframes delayTop{0%{opacity:0;transform:translateY(200%)}100%{opacity:1;transform:translateY(0)}}@keyframes delayLeft{0%{opacity:0;transform:translateX(-200%)}100%{opacity:1;transform:translateX(0)}}@keyframes delayRight{0%{opacity:0;transform:translateX(200%)}100%{opacity:1;transform:translateX(0)}}
|
