*{box-sizing:border-box;color:#333;font-family:'微软雅黑','MicrosoftYaHei','黑体'}
html,body,div{font-size:16px;font-weight:normal;margin:0;padding:0}
html,body{width:100%;min-height:100%}
table,tr,td,ul,li{list-style:none;overflow:hidden;padding:0;margin:0}
a{color:#333;border:0;text-decoration:none;display:inline-block}
img{vertical-align:middle;width:100%;border:0;margin:0;padding:0}
input,textarea,select{background-color:#fff}
.btn_pointer{cursor:pointer}
.fl{float:left}
.fr{float:right}
.flex-box{display:flex}
.flex1{flex:1}
.pr{position:relative}
.pa{position:absolute}
.pf{position:fixed}
.tl{text-align:left}
.tc{text-align:center}
.tr{text-align:right}
.tj{text-align:justify}
.ellipsis1{-webkit-line-clamp:1;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;word-wrap:break-word;white-space:normal}
.ellipsis2{-webkit-line-clamp:2;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;word-wrap:break-word;white-space:normal}
.hide{display:none}
.block{display:block}
.bg_black{background-color:#000}
.logo_top{top:0;left:0;width:34%;z-index:100}

#pageVideo{font-size:32px;max-width:640px;height:100%;position:relative;background:url("/front_images/cswb/channel_104434/app_bg_3.jpg?v=2") #fff no-repeat center 0;background-size:100% 100%;margin:0 auto;padding:0}
#pageVideo .decorate_box{top:40%;width:100%;z-index:2}
#pageVideo #btnStart{width:94%;margin:0 auto}
#pageVideo .decorate_logo{width:50%;margin:50% auto 0}
#pageVideo #videoBox{position:relative;width:100%;height:100%;background-color:#000}
/*#pageVideo #videoBgMaskBox{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;background:rgba(255,0,0,.3);}*/
#pageVideo #myVideo{width:100%;height:100%}


#page1{font-size:32px;max-width:640px;height:100%;position:relative;background:url("/front_images/cswb/channel_104434/app_bg_1.jpg?v=2") #fff no-repeat center 0;background-size:100% 100%;margin:0 auto;padding:0}
#page1.bg2{background-image:url("/front_images/cswb/channel_104434/app_bg_2.jpg?v=2")}
#page1 .brush{width:30px;height:30px}
#page1 #appEditor{border:#cb2929 2px solid;background-color:#fff;position:relative;padding:2px}
#page1 .app-editor-item{top:2px;left:2px;position:absolute}
#page1 .app_warp .app_editor_inner{padding:45% 20% 0}
#page1 .editor_tips{margin-top:4px}
#page1 .btn_area{margin-top:5%}
#page1 #btnClear{margin-top:5px}
#page1 .btn_area_2 div{float:left;width:50%;padding:5%}

#page3{font-size:32px;max-width:640px;height:100%;position:relative;background:url("/front_images/cswb/channel_104434/app_bg_3.jpg?v=2") #fff no-repeat center 0;background-size:100% 100%;margin:0 auto;padding:0}
#page3 .app_warp .app_editor_inner{padding:35% 20% 0}
#page3 .bg_tian{background:url("/front_images/cswb/channel_104434/favicon_background.png") no-repeat center/100%}
#page3 .page3_tips{margin:20px 4px;font-size:20px;color:#8d1e1e}
#page3 .btn_area{}

#page4{font-size:32px;max-width:640px;height:100%;position:relative;background:url("/front_images/cswb/channel_104434/app_bg_4.jpg?v=2") #fff no-repeat center 0;background-size:100% 100%;margin:0 auto;padding:0}
#page4 .app_warp .app_editor_inner{padding:20% 12% 0}
#page4 .page4_tips{margin:20px 4px;font-size:20px;color:#fff}
#page4 .page4_tips2{margin:20px 0}
/*#page4 .btn_area .imgCode{width:35%}*/
#page4 .btn_area .imgCode{width:30%;background-color:#fff;padding:5px}
#page4 .btn_area .logoCenter{width:45%}
#page4 .qr_code_area{left:0;width:100%;bottom:10px}
#page4 .btn_area span{display:block;color:#fff;font-size:14px;text-shadow:-1px 0 #000,0 1px #000,1px 0 #000,0 -1px #000}
#page4 .btn_area div{margin-top:5px}

#page5{max-width:640px;height:100%;margin:0;padding:0}

.loading{top:0;left:0;right:0;bottom:0;font-size:16px;position:fixed;z-index:9000;background-color:rgba(0,0,0,.6);background-image:url("/front_images/cswb/channel_104434/loading.png");background-repeat:no-repeat;background-position:center;background-size:100% auto}

.view_layer{background-color:#000;opacity:.6;position:fixed;width:100%;height:54px;line-height:54px;bottom:0;left:0;border-radius:10px;color:#fff;font-size:12px;z-index:101}
#btn_close_view{color:#fff;position:absolute;width:24px;height:24px;top:0;right:0;font-size:30px;line-height:20px}


#mark_share{position:fixed;width:100%;height:100%;background-color:rgba(0,0,0,.7);z-index:3;top:0;left:0;display:none}
#mark_share .content{position:absolute;width:70%;left:15%;top:30%;text-align:center;border-radius:10px;border:2px dashed #fff;color:#fff;font-size:1.2rem;padding:20px}
#mark_share #btn_close_mark{position:absolute;width:40%;left:30%;text-align:center;border-radius:5px;background-color:#3bb4f2;color:#fff;top:50%;height:36px;line-height:36px}