@media (max-width:2400px) { .sale_cont{position: absolute;left: 330px;right: 20px;top: 30px; bottom: 30px;} .Sale_menu ul{width: 100%; height: 40px;} .Sale_menu li{float: left;width: 100px; height: 40px; text-align: center; font-size: 14px; line-height: 40px; margin-right:3px; color: #808080; border-radius:4px 4px 0 0; cursor: pointer; box-sizing: border-box;} .Sale_menu li.active{ color: #FFFFFF; height: 40px ;background: #1F2533;border-radius: 4px;box-shadow: 0 0 3px 3px rgba(31, 37, 51, 0.4); } .saleChartCont{width: 100%; height: 95%; box-sizing: border-box;} .personal{width: 100%;height: 100%;} .PersonalData{width: 100%;height: 350px;background: white;margin-top: 10px} .PersonalData_l{width: 100%;height: 368px;overflow-x: auto;padding: 20px} .PersonalData_l .l_top{width: 700px;height: 118px;} .l_top .tx_img{width: 94px;height: 94px;border-radius: 50%;overflow: hidden;float: left} .l_top .img{width: 60px;height: 60px; margin-left: 10px; /* margin-left: 90px; */ float: left;margin-top: 15px} .p_name{margin-left: 17px;margin-top: 25px;float: left} .p_name span:nth-child(1){font-size: 18px;color: #333333;display: block} .p_name span:nth-child(2){font-size: 12px;color: #333333;margin-top: 5px;display: block} .l_top .royalty{margin-left: 30px;float: left;margin-top: 17px;display: flex;flex-direction: column} .l_top .royalty .tc{display: flex; flex-direction: column; align-items: flex-start} .l_top .royalty .tc span:nth-child(1){font-size: 14px;color: #333333;margin-top: 8px;margin-right: 5px} .l_top .royalty .tc span:nth-child(2){font-size: 36px;color: #333333;font-weight: bold} .order{width: 700px;height: 205px;background: #F5F5F5;margin-top: 5px;padding: 20px} .l_title{width: 100%;height: 30px} .table_t{width: 100%;height: 35px} .table_t span{width: 24.5%;height: 35px;display: inline-block;float: left;text-align: center;font-size: 12px;color: #666666;line-height: 30px} .table_c{width: 100%;height: 95px;overflow: auto;background: white} .table_c .table_cont{width: 100%;height: 35px;;border-bottom: 1px solid #D2D2D2} .table_c .table_cont span{width: 24.5%;height: 35px;;display: inline-block;float: left;text-align: center;line-height: 30px} .PersonalData_r{width: 100%;height: 350px;overflow-x: auto;} .PersonalData_r .r_box{width: 770px;margin-top: 15px} .PersonalData_r .r_box .r_box_t{width: 100%;height: 130px;} .PersonalData_r .r_box .r_box_b{width: 100%;height: 130px;margin-top: 15px} .c_view{width: 28%;height: 127px;border-radius: 8px;border: 1px solid #E5E5E5;position: relative;margin-left: 35px;overflow: hidden;float: left;} .view_c{width: 100%;height: 127px;position: absolute;top: 0;left: 0;padding: 20px;} .view_t:hover{box-shadow: 0 0 10px 10px rgba(229, 156, 151, 0.2);border-radius: 4px;border:1px solid #F89291;} .view_b:hover{box-shadow: 0 0 10px 10px rgba(236, 236, 255, 0.5);border-radius: 4px;border:1px solid #8F96EB;} .c_view span{font-size: 14px;color: #333333;display: inline-block} .c_view div{margin-top: 15px;} /*.c_view div span:nth-child(1){font-size: 36px;color: #333333}*/ /*.semicircle_t{width: 200px;height: 200px;border-radius: 50%;position: absolute;top: 20px;right: -100px;background: #FFE4EB}*/ .semicircle_t{width: 100px;height: 100px;border-radius: 100px 0 0 0 ;position: absolute;bottom: 0px;right: 0px;background: #FFE4EB;transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s;-o-transition:all .5s; } /*.view_t:hover .semicircle_t{background: #FFF0EF}*/ .view_t:hover .semicircle_t{background: #FFF0EF;width: 110%;height: 130%;} .view_b:hover .semicircle_b{background: #F1F5FF;width: 110%;height: 130%;} /*.semicircle_b{width: 200px;height: 200px;border-radius: 50%;position: absolute;top: 20px;right: -100px;background: #ECECFF}*/ .semicircle_b{width: 100px;height: 100px;border-radius: 100px 0 0 0;position: absolute;bottom: 0;right: 0;background: #ECECFF;transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s;-o-transition:all .5s;} .view_t i{position: absolute;bottom:15px;right: 15px;font-size: 45px;color: #F89291} .view_b i{position: absolute;bottom:15px;right: 15px;font-size: 45px;color: #8F96EB} .dataanalysis{width: 100%;height: 405px;margin-top: 20px} .data_l{width: 100%;height: 380px;background: white;padding: 20px;overflow-x: auto} .data_c{width: 100%;height: 380px;background: white;overflow-x: auto;padding: 0 20px} .data_title{width: 800px;height: 40px;position: relative} .data_title span{font-size: 20px;color: #333333;display: inline-block;float: left} .tagging{position: absolute;top: 0;right: 0;display: flex;flex-direction: row;align-items: center} .yuan_o{width: 14px;height: 14px;border-radius: 50%;margin-left: 10px;float: left;margin-top: 2px; background: -webkit-linear-gradient(90deg, #FBA299, #F36C5E); background: linear-gradient(90deg, #FBA299, #F36C5E);} .yuan_t{width: 14px;height: 14px;border-radius: 50%;margin-left: 10px;float: left;margin-top: 2px; background: -webkit-linear-gradient(90deg, #5DE7B3, #00B26F); background: linear-gradient(90deg, #5DE7B3, #00B26F);} .yuan_tr{width: 14px;height: 14px;border-radius: 50%;margin-left: 10px;float: left;margin-top: 2px; background: -webkit-linear-gradient(90deg, #96D1FF, #1698FD); background: linear-gradient(90deg, #96D1FF, #1698FD);} .tagging span{font-size: 14px;color: #333333;margin-left: 10px;float: left;display: inline-block} .D_data{width: 800px;height: 45px;position: relative;line-height: 45px} .D_data .zname{font-size: 14px;color: #333333;float: left;display: inline-block;width: 60px} .Progress{width: 86%;height: 12px;border-radius: 6px;float: left;margin: 17px 0 0 40px;overflow: hidden; background: -webkit-linear-gradient(90deg, #ECECEC, #D3D3D3); background: linear-gradient(90deg, #ECECEC, #D3D3D3);} .Progress div{;height: 12px;border-radius: 6px;} .bugou{ background: -webkit-linear-gradient(90deg, #FBA299, #F36C5E); background: linear-gradient(90deg, #FBA299, #F36C5E);} .jiayou{ background: -webkit-linear-gradient(90deg, #5DE7B3, #00B26F); background: linear-gradient(90deg, #5DE7B3, #00B26F);} .chaobang{ background: -webkit-linear-gradient(90deg, #96D1FF, #1698FD); background: linear-gradient(90deg, #96D1FF, #1698FD);} .mean{position: absolute;top: -15px;right: 10px} .mean span{font-size: 12px;color: #666666;display: inline-block;float: left} .data_r{width: 250px;height: 380px;overflow-x: auto;padding: 0 10px;} .data_r .r_box{width: 100%;height: 20%;background: white;margin-top: 10px} .data_r .r_box .icon_f{width: 60px;height: 60px;margin: 5px;float: left;position: relative;margin-top: 10px;} .data_r .r_box .icon_f i{font-size: 30px;position: absolute;top:15px;left: 15px} .data_r .r_box:hover{box-shadow: 0 0 3px 3px rgba(184, 184, 184, 0.4);} .data_r .r_name{width: 50%;height: 50px;margin-top: 6px;margin-left: 26px;position: relative;line-height:73px;float: left} .data_r .r_name span{font-size: 14px;color: #333333} .r_name .tishi{position: absolute;top:0;right: 0;text-align: center;line-height: 0px} /*.r_name .tishi span{font-size: 14px;color: white}*/ .paneldata{width: 100%;height: 100%;display: flex;flex-direction: row;justify-content: space-between} .paneldata_l{width: 100%;height: 100%;overflow-x: auto} .groupmembers{width: 1280px;height: 400px;margin-top: 10px;background: white;padding: 20px;} .grouptiday{width: 1250px;height: 30%;display: flex;flex-direction: row;} .g_icon{width: 54px;height: 54px;border-radius: 50%;display: flex;flex-direction: column;justify-content: center;align-items: center;margin-top: 10px} .receive{margin-left: 20px;display: flex;flex-direction: column;margin-top: 10px} .gain{width: 90px;height: 52px;border-radius: 5px;background: #F5F5F5; display: flex;flex-direction: column;align-items: center;justify-content: center;margin-left: 30px;margin-top: 10px} .sj{display: flex;flex-direction: row;align-items: center} .sj span{font-size: 14px;} .weekdata{width: 380px;height: 100%;border-radius: 5px;background: #F9F9F9;border:1px solid #A1A1A1;margin-left: 50px;display: flex;flex-direction: row;padding: 15px;} .weekdata_box{width: 30%;height: 100%;display: flex;flex-direction: column;align-items: center} .weekdata_box2{width: 40%;height: 100%;display: flex;flex-direction: column;align-items: center} .weekdata_box span{display: block;} .weekdata_box span:nth-child(1){font-size: 14px;color: #333333} .weekdata_box .w_da{font-size: 20px;color: #333333} .w_d{display: flex;flex-direction: row;align-items: center;margin-top: 3px} .w_d span{font-size: 14px} .line{width: 100%;height:5px ;position: relative;border-top: 2px dashed #DCDCDC;margin-top: 20px} .line_title{width: 100px;height: 20px;background: white;line-height: 20px;position: absolute;top:-10px;left: 50%;text-align: center;margin-left: -50px} .line_title span{font-size: 16px;color: #333333;} .ranking{width: 1260px;height: 220px;margin-top: 20px;overflow-x: auto ;overflow-y: hidden;white-space: nowrap} .rankbox{width: 190px;height: 100%;background: #F9F9F9;padding: 10px;margin:0 10px 10px 10px;display: inline-table} .rankbox .xz_tx{width: 50px;height: 50px;border-radius: 50%;margin-top: 20px;position: relative;margin-left: 60px} .rankbox .xz_tx i{font-size: 30px} .rankbox img{width: 50px;height: 50px;border-radius: 50%;} .rankbox_b{width: 100%;height: 70px;display: flex;flex-direction: row} .today{width: 50%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: space-around;} .today span:nth-child(1){font-size: 12px;color: #888888;} .today span:nth-child(2){font-size: 18px;color: #333333;} .paneldata_r{float: right;width: 100%;height: 770px} .paneldata_r_box{width: 100%;height:98%;background: white;padding: 20px;margin-top: 10px} .paneldata_r_box .c_view{width: 100%;height: 124px;border-radius: 8px;border: 1px solid #E5E5E5;position: relative;overflow: hidden;margin-left: 0;margin-top: 15px} .paneldata_r_box .c_view .view_g{width: 100%;height: 100%;padding: 20px;position: relative;} /*.paneldata_r_box .c_view:hover{box-shadow: 0 0 3px 3px rgba(229, 156, 151, 0.4);border-radius: 4px;;}*/ .paneldata_r_box .view_g span{font-size: 14px;color: #333333;display: inline-block} .paneldata_r_box .view_g div{margin-top: 10px;} .paneldata_r_box .view_g div span:nth-child(1){font-size: 30px;color: #333333} /*.paneldata_r_box .banyuan{width: 200px;height: 200px;border-radius: 50%;position: absolute;top: 20px;right: -100px;}*/ .paneldata_r_box .banyuan{width: 100px;height: 100px;border-radius: 100px 0 0 0;position: absolute;bottom: 0px;right: 0px;transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s;-o-transition:all .5s;} .paneldata_r_box .gz1 i{position: absolute;bottom:15px;right: 15px;font-size: 40px} .paneldata_r_box .gz2 i{position: absolute;bottom:15px;right: 15px;font-size: 40px} .paneldata_r_box .gz3 i{position: absolute;bottom:15px;right: 15px;font-size: 40px} .paneldata_r_box .gz4 i{position: absolute;bottom:15px;right: 15px;font-size: 40px} .paneldata_r_box .gz5 i{position: absolute;bottom:15px;right: 15px;font-size: 30px;color: #96ADEB} .paneldata_r_box .gz1:hover{box-shadow: 0 0 3px 3px rgba(165, 152, 238, 0.4);border-radius: 4px;border: 1px solid #A598EE;} .paneldata_r_box .gz2:hover{box-shadow: 0 0 3px 3px rgba(219, 241, 209, 0.4);border-radius: 4px;border: 1px solid #98D482;} .paneldata_r_box .gz3:hover{box-shadow: 0 0 3px 3px rgba(227, 239, 246, 0.4);border-radius: 4px;border: 1px solid #68A3C2;} .paneldata_r_box .gz4:hover{box-shadow: 0 0 3px 3px rgba(236, 236, 255, 0.4);border-radius: 4px;border: 1px solid #8F96EB;} .paneldata_r_box .gz5:hover{box-shadow: 0 0 3px 3px rgba(241, 245, 255, 0.4);border-radius: 4px;border: 1px solid #96ADEB;} .paneldata_r_box .c_view:hover .banyuan{width: 110%;height: 135%} /*.paneldata_r_box .gz5 i{position: absolute;top:75px;right: 10px;font-size: 30px;color: #96ADEB}*/ .tubiao{width: 1280px;height: 340px;background: white;margin-top: 20px;padding: 20px 20px 0 20px;overflow-x: auto} .tb_box{width: 1260px;height: 285px;} .topsanjiao{ width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 10px solid #00B26F; } .bottomsanjiao{ width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 10px solid #F36C5E; } .jryj{margin-top: 20px} .view-f span:nth-child(1){font-size: 27px;color: #333333} .view-f span:nth-child(2){font-size: 14px;color: #999999;margin-left: 5px} .view-tf span{font-size: 20px;color: #333333 } #xzts{position: absolute;bottom:15px;right: 15px;font-size: 35px;color: #F89291} .grouptiday .g_sks{background: #ECECFF;margin-left: 18px} .grouptiday .g_sks i {font-size: 20px} .grouptiday .g_bms{background: #C0EBD1;margin-left: 70px} .grouptiday .g_bms i{font-size: 25px} .grouptiday .g_skuan{background: #FFE5E8;margin-left: 70px} .grouptiday .g_skuan i{font-size: 25px} .receive span:nth-child(1){font-size: 14px;color: #333333;display: inline-block} .receive span:nth-child(2){font-size: 36px;color: #333333} .p_dw{font-size: 14px;color: #999999} .pr_s span:nth-child(1){font-size: 36px;color: #333333} .pr_s span:nth-child(2){font-size: 14px;color: #999999;margin-left: 5px} } @media (max-width: 1680px) { .saleChartCont{ /*zoom: 85%;*/ } .D_data .zname{font-size: 14px;color: #333333;float: left;display: inline-block;width: 72px} .data_r .r_name{width: 55%;height: 50px;margin-top: 6px;margin-left: 17px;position: relative;line-height:73px;float: left} .line_title{width: 120px;height: 20px;background: white;line-height: 20px;position: absolute;top:-10px;left: 50%;text-align: center;margin-left: -50px} } @media (max-width: 1440px) { .saleChartCont{ /*zoom: 69%;*/ } .D_data .zname{font-size: 14px;color: #333333;float: left;display: inline-block;width: 80px} .Progress{width: 84%;height: 12px;border-radius: 6px;float: left;margin: 17px 0 0 40px;overflow: hidden;} .line_title{width: 130px;height: 20px;background: white;line-height: 20px;position: absolute;top:-10px;left: 50%;text-align: center;margin-left: -50px} .data_r .r_name{width: 60%;height: 50px;margin-top: 6px;margin-left: 5px;position: relative;line-height:73px;float: left} .r_name .tishi{position: absolute;top:0;right: 0;line-height: 40px;text-align: center} .weekdata{width: 405px;height: 100%;border-radius: 5px;background: #F9F9F9;border:1px solid #A1A1A1;margin-left: 10px;display: flex;flex-direction: row;padding: 15px;} } @media (max-width: 1366px) { .saleChartCont{ /*zoom: 64%;*/ } .PersonalData_l{width: 100%;height: 355px;overflow-x: auto;padding: 20px} .D_data .zname{font-size: 14px;color: #333333;float: left;display: inline-block;width: 80px} .order{width: 730px;height: 205px;background: #F5F5F5;margin-top: 5px;padding: 20px} .Progress{width: 84%;height: 12px;border-radius: 6px;float: left;margin: 17px 0 0 40px;overflow: hidden;} .receive{margin-left: 10px;display: flex;flex-direction: column;margin-top: 10px} .weekdata{width: 410px;height: 100%;border-radius: 5px;background: #F9F9F9;border:1px solid #A1A1A1;margin-left: 20px;display: flex;flex-direction: row;padding: 15px;} } @media (max-width: 1280px) { .saleChartCont{ /*zoom: 59%;*/ } .order{width: 750px;height: 205px;background: #F5F5F5;margin-top: 5px;padding: 20px} .data_r .r_name{width: 62%;height: 50px;margin-top: 6px;margin-left: 5px;position: relative;line-height:73px;float: left} .D_data .zname{font-size: 14px;color: #333333;float: left;display: inline-block;width: 85px} .line_title{width: 140px;height: 20px;background: white;line-height: 20px;position: absolute;top:-10px;left: 50%;text-align: center;margin-left: -50px} .Progress{width: 81%;height: 12px;border-radius: 6px;float: left;margin: 17px 0 0 40px;overflow: hidden;} .weekdata{width: 453px;height: 100%;border-radius: 5px;background: #F9F9F9;border:1px solid #A1A1A1;margin-left: 20px;display: flex;flex-direction: row;padding: 10px;} .grouptiday .g_bms{background: #C0EBD1;margin-left: 40px} .grouptiday .g_skuan{background: #FFE5E8;margin-left: 40px} }