body { min-width: 1308px; } .w { width: 1308px; margin: 0 auto; } .nav-bg { position: fixed; width: 100%; height: 55px; background: url("../images/navbg.png"); z-index: 200; } .nav { position: relative; width: 1308px; left: 50%; margin-left: -654px; height: 55px; background: url("../images/nav.png"); background-size: 100% 100%; position: fixed; z-index: 100; } .bg1 { height: 800px; width: 100%; background: url("../images/bg1.png"); background-size: 100% 100%; } .logo { margin-left: 130px; padding-top: 3px; display: inline-block; position: relative; top: -14px; } .logo a { display: inline-block; text-indent: -3000px; } .logo img { margin-top: -50px; } .nav-ul { display: inline-block; } .nav-ul .pitch { color: #ff6600; } .nav-ul li { line-height: 66px; float: left; width: 110px; text-align: center; font-size: 14px; color: #1d1d1d; } .nav-ul li span { float: right; color: #EDEDED; font-weight: 500; } .content1 { padding-top: 140px; margin-left: 245px; } .content1 div { float: left; } .content1 .text1 { margin-left: 72px; height: 299px; margin-top: 40px; } .content1 .down { float: none; margin-left: 120px; margin-top: 380px; height: 62px; } .content1 .down img { margin-right: 35px; } .yameng { position: absolute; bottom: -60px; left: -400px; transition: 0.7s; z-index: 50; } .hot { opacity: 0; position: absolute; bottom: 175px; left: 22px; width: 450px; transition: 0.7s; } .hotact { opacity: 1; transform: translateX(30px); } .banner2 { display: inline-block; margin-top: 339px; margin-left: 520px; position: relative; } .banner2 h2 { color: #1d1d1d; font-size: 50px; margin-bottom: 10px; } .banner2 p { color: #1d1d1d; font-size: 24px; } .banner2 .circular { position: absolute; display: none; } .banner2 .circular1 { width: 13px; height: 13px; background: #FD660B; border-radius: 50%; top: -81px; left: 443px; } .banner2 .circular2 { width: 26px; height: 26px; background: #FD660B; border-radius: 50%; top: -73px; left: 537px; } .banner2 .circular3 { width: 47px; height: 47px; background: #FD660B; border-radius: 50%; top: 266px; left: 377px; } .banner2 .circular4 { width: 26px; height: 26px; border-radius: 50%; background: #FFF001; top: 181px; left: 428px; } .banner2 .circular5 { width: 52px; height: 52px; background: #FFF001; border-radius: 50%; top: 210px; left: 530px; } .banner2 .add1 { display: block; opacity: 0; font-size: 22px; color: #FF6200; font-weight: 700; top: 220px; left: 285px; transition: 2s; } .banner2 .add1act { opacity: 1; transform: rotate(720deg); } .banner2 .add2 { display: block; opacity: 0; font-size: 22px; color: #FF6200; font-weight: 700; top: 159px; left: 650px; transition: 3s; } .banner2 .add2act { opacity: 1; transform: rotate(1440deg); } .banner3 { height: 800px; width: 100%; background: url("../images/bg.png"); background-size: 100% 100%; } .text3 { position: relative; display: inline-block; padding-top: 302px; float: left; } .text3 .circular-3 { position: absolute; z-index: 500; display: none; } .text3 .circular31 { position: absolute; width: 22px; height: 22px; border-radius: 50%; background: #FEE4C3; top: 200px; left: 196px; } .text3 .circular32 { position: absolute; width: 12px; height: 12px; border-radius: 50%; background: #FEE4C3; top: 190px; left: 320px; } .text3 .circular33 { position: absolute; width: 31px; height: 31px; border-radius: 50%; background: #FF972C; top: 525px; left: 185px; } .text3 .circular34 { position: absolute; width: 20px; height: 20px; border-radius: 50%; background: #FFF000; top: 595px; left: 212px; } .text3 .circular35 { position: absolute; width: 39px; height: 39px; border-radius: 50%; background: #FFDEC3; top: 560px; left: 325px; } .text3 .add31 { display: block; opacity: 0; position: absolute; font-size: 22px; color: #ffffff; font-weight: 700; top: 497px; left: 118px; transition: 3s; color: #1d1d1d; } .text3 .add31act { transform: rotate(720deg); color: #ffffff; opacity: 1; } .text3 .add32 { display: block; opacity: 0; position: absolute; font-size: 22px; color: #ffffff; font-weight: 700; top: 410px; left: 468px; transition: 4s; color: #1d1d1d; } .text3 .add32act { transform: rotate(720deg); color: #ffffff; opacity: 1; } .text3 h2 { color: #1d1d1d; font-size: 50px; margin-bottom: 10px; color: #ffffff; } .text3 p { color: #1d1d1d; font-size: 24px; color: #ffffff; } .gift { position: absolute; opacity: 0; top: 425px; left: 135px; transition: 0.7s; } .giftact { opacity: 1; transform: translateX(30px); } .r-banner3 { padding-top: 100px; float: left; padding-left: 75px; position: relative; } .r-banner3 .showgirl2 { opacity: 0; position: absolute; bottom: 70px; left: 706px; transition: 1.5s; } .r-banner3 .showgirl2act { opacity: 1; transform: translateX(-200px) rotate(-365deg); } .r-banner3 .btn3 { position: absolute; bottom: -42px; left: 163px; } .l-banner { float: left; padding-top: 150px; position: relative; margin-left: 125px; width: 520px; height: 527px; } .l-banner img { position: absolute; left: -43px; top: -118px; transition: 0.7s; } .text4 { position: relative; float: left; padding-top: 345px; margin-left: 55px; } .text4 h2 { font-size: 50px; margin-bottom: 10px; color: #1d1d1d; } .text4 p { font-size: 24px; color: #1d1d1d; } .circular-4 { position: absolute; z-index: 500; } .circular41 { position: absolute; width: 11px; height: 11px; border-radius: 50%; background: #FF6400; top: 290px; left: 225px; } .circular42 { position: absolute; width: 20px; height: 20px; border-radius: 50%; background: #FF6400; top: 294px; left: 325px; } .circular43 { position: absolute; width: 19px; height: 19px; border-radius: 50%; background: #FFF001; top: 578px; left: 286px; } .circular44 { position: absolute; width: 38px; height: 38px; border-radius: 50%; background: #FFF001; top: 600px; left: 369px; } .circular45 { position: absolute; width: 35px; height: 35px; border-radius: 50%; background: #FF6400; top: 640px; left: 218px; } .add41 { position: absolute; font-size: 22px; color: #FF6400; font-weight: 700; top: 613px; left: 96px; } .add42 { position: absolute; font-size: 22px; color: #FF6400; font-weight: 700; top: 554px; left: 468px; } .text5 { padding-top: 60px; display: inline-block; margin-left: 364px; position: relative; } .text5 h2 { color: #ffffff; font-size: 50px; margin-bottom: 10px; } .text5 p { color: #ffffff; font-size: 24px; } .moregirl { width: 960px; margin: 0 auto; padding-top: 28px; height: 480px; } .moregirl li { float: left; width: 24.5%; margin-right: 0.5%; background: pink; height: 49%; margin-bottom: 0.5%; } .moregirl li img { width: 100%; } .circular-5 { position: absolute; z-index: 500; } .circular51 { position: absolute; width: 18px; height: 18px; border-radius: 50%; background: #FFF001; top: 466px; left: -349px; } .circular52 { position: absolute; width: 30px; height: 30px; border-radius: 50%; background: #FF992B; top: 636px; left: -515px; } .circular53 { position: absolute; width: 22px; height: 22px; border-radius: 50%; background: #FFD4C1; top: 267px; left: 886px; } .circular54 { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: #FFD4C1; top: 253px; left: 1036px; } .circular55 { position: absolute; width: 38px; height: 38px; border-radius: 50%; background: #FFD4C1; top: 644px; left: 1071px; } .add51 { position: absolute; font-size: 25px; color: #FBFFFB; font-weight: 700; top: 162px; left: -496px; } .add52 { position: absolute; font-size: 27px; color: #FBFFFB; font-weight: 700; top: 109px; left: -85px; } .banner6 { position: relative; } .banner6 .erwei { width: 280px; height: 280px; margin: 0 auto; padding-top: 155px; position: relative; } .banner6 .erwei .erweilogo { position: absolute; bottom: 105px; left: 105px; } .banner6 .erwei .erwei-boder { width: 276px; height: 276px; border-radius: 8px; border: 3px solid #FF4501; } .banner6 .erwei .erwei-boder img { margin-left: 13px; margin-top: 13px; border-radius: 8px; width: 250px; } .banner6 .phonedown { width: 600px; margin: 0 auto; padding-top: 50px; } .banner6 .phonedown img { width: 46%; cursor: pointer; } .banner6 .yabobottom { width: 600px; margin: 0 auto; text-align: center; padding-top: 100px; font-size: 15px; } .showgirl { position: absolute; left: 110px; bottom: -94px; } .money { position: absolute; width: 450px; height: 254px; background: #ffffff; opacity: 0.9; top: 518px; left: 38px; border-radius: 18px; background: url("../images/drawing.png"); background-size: 100% 100%; } .video { position: absolute; top: 197px; left: 258px; z-index: 100; } .phone1 { position: relative; } .phone1 p { text-align: center; color: #ffffff; margin-top: 10px; font-size: 28px; font-family: "Microsoft YaHei"; } .Ornaments { position: absolute; z-index: 555; } .Ornaments1 { top: 296px; left: 126px; } .Ornaments2 { top: 373px; left: 160px; } .Ornaments3 { top: 412px; left: 444px; } .Ornaments4 { top: 549px; left: 206px; } .Ornaments5 { top: 275px; left: 471px; } .w2 { width: 1105px; margin: 0 auto; padding-top: 20px; overflow: hidden; } .J-content { height: 790px; background: #ffffff; border-radius: 18px; } .d-content { background: #ffffff; border-radius: 18px; } .J-new { font-size: 25px; margin-top: 40px; margin-left: 15px; margin-bottom: 20px; font-weight: 700; } .J-content-top { height: 77px; border-bottom: 1px solid #ECECEC; } .J-content-top ul { width: 375px; text-align: center; } .J-content-top ul li { width: 33%; font-size: 19px; float: left; line-height: 72px; cursor: pointer; } .J-content-top ul li .J-content-top-act { display: inline-block; width: 60px; height: 74px; border-bottom: 4px solid #FF6501; } .J-content-con > div { height: 100px; padding-left: 31px; } .J-content-con .J-title { padding-top: 28px; } .J-content-con .J-title .j-hd { display: inline-block; width: 45px; height: 25px; border-radius: 12px; background: linear-gradient(to right, #FF9607, #FF6A00); text-align: center; line-height: 25px; color: #ffffff; } .J-content-con .J-title .j-bt { padding-left: 8px; font-size: 17px; } .J-content-con .J-title .j-sj { float: right; padding-right: 40px; color: #A0A0A0; font-size: 14px; } .J-content-con .J-fbt { padding-top: 12px; color: #A0A0A0; font-size: 14px; } .yabobottom2 { font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif; width: 650px; margin: 0 auto; text-align: center; padding-top: 300px; font-size: 15px; padding-bottom: 30px; } .yabobottom2 p { margin-bottom: 10px; } .page__hd { text-align: center; } .page__hd h1 { margin-top: 50px; font-size: 30px; } .page__hd p { margin-top: 18px; font-size: 17px; color: #999999; font-weight: 700; margin-bottom: 40px; } .content-box { margin-left: 57px; margin-right: 57px; padding-top: 30px; border-top: 1px solid #EDEDED; } .content-box p { font-size: 15px; margin-top: 0; margin-bottom: .72em; overflow: hidden; font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif; color: #262626; } .content-box .d-img { margin-top: 40px; text-align: center; } .d-bot { padding-top: 30px; margin-left: 57px; margin-right: 57px; font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif; height: 78px; line-height: 32px; } .d-bot .d-red { color: #FE6404; font-size: 20px; } .d-bot .d-good { float: right; font-size: 20px; } .d-bot .d-good img { margin-right: 10px; } .d-message-w { margin-left: 45px; margin-right: 45px; } .d-message { margin-top: 40px; background: #ffffff; border-radius: 18px; height: 830px; overflow: hidden; } .d-message-top { position: relative; margin-top: 55px; text-align: center; font-size: 26px; height: 50px; } .d-message-top h2 { font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif; position: absolute; display: inline-block; width: 150px; z-index: 50; top: -2px; left: 50%; margin-left: -75px; background: #ffffff; } .d-message-top:after { width: 100%; height: 0; border-top: 1px dotted #cacaca; position: absolute; content: ""; top: 16px; left: 0; z-index: 1; } .face { display: inline-block; margin: 0 10px 0 10px; } .face img { width: 55px; border-radius: 50%; margin-top: -50px; } .user-box { display: inline-block; width: 930px; } .user-box { position: relative; } .user-box h2 { font-size: 14px; } .user-box .likebox { width: auto; height: 100%; position: absolute; right: 0; top: 0; color: #666; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .user-box .likebox a { width: 16px; height: 16px; display: inline-block; } .user-box .likebox .unlike { background: url(https://zhiboweb.ishuaji.cn/simper/article/img/11.png); background-size: 100% 100%; width: 25px; height: 25px; background-position-y: top; } .user-box .likebox .num { font-size: 20px; } .user-msg { color: #333333; font-size: 14px; line-height: 2em; } .date { color: #999999; font-size: 14px; } .msg-box { padding-bottom: 25px; border-bottom: 1px solid #ECECEC; padding-top: 32px; } body .yourclass { border-radius: 21px; overflow: hidden; overflow-x: hidden; overflow-y: hidden; } body .yourclass .layui-layer-close2 { width: 15px; height: 15px; right: -2px; top: -2px; background: url("../images/out.png") no-repeat; background-size: 100% 100%; } body .yourclass .layui-layer-close2:hover { color: #ffffff; } .bian { display: none; } .gzh { position: absolute; left: 425px; top: 55px; display: none; } .ranking-w { width: 1125px; margin: 0 auto; padding-top: 105px; } .ranking-div { width: 520px; height: 1110px; float: left; margin-bottom: 50px; } .charm { margin-right: 40px; } .charm .charm-top { width: 524px; } .charm .charm-top h2 { position: relative; font-size: 28px; text-indent: 24px ; } .charm .charm-top h2 .Bar { height: 28px; width: 6px; border-radius: 5px; background: #ff6600; top: 8px; left: 6px; position: absolute; } .Regal { margin-left: 40px; } .Celebrity { margin-right: 40px; } .family { margin-left: 40px; } .ranking-top-ul { height: 50px; width: 510px; margin-left: 7px; margin-right: 7px; line-height: 50px; margin-top: 25px; border-bottom: 1px solid #EEEEEE; } .ranking-top-ul li { float: left; width: 32.7%; text-align: center; font-size: 16px; } .yabo { color: #ff6600; } .charm-best { position: relative; width: 524px; height: 270px; margin-top: 28px; background: url("../images/list-top.png") no-repeat; } .charm-best .charm-best1 { position: absolute; top: 45px; left: 215px; } .charm-best .charm-best2 { position: absolute; top: 75px; left: 40px; } .charm-best .charm-best3 { position: absolute; top: 75px; right: 50px; } .charm-best .best-face { border-radius: 50%; width: 95px; height: 95px; } .charm-best .best-face2 { border-radius: 50%; width: 80px; height: 80px; } .img-position { position: relative; } .best-king { position: absolute; top: -14px; left: -7px; } .charm-best-name { position: absolute; font-size: 18px; color: #343434; width: 155px; text-align: center; bottom: -45px; left: -30px; } .Medals1 { position: absolute; top: -45px; right: -30px; } .Medals2 { position: absolute; top: -45px; right: -35px; } .Medals3 { position: absolute; top: -45px; right: -30px; } .charm-bottom { width: 519px; height: 694px; background: #ffffff; border-radius: 6px; margin-top: 10px; } .charm-bottom-ul li { position: relative; height: 95px; border-bottom: 1px solid #E5E5E5; margin-left: 60px; } .charm-bottom-ul .li-end { border: none; } .charm-li-mun { position: absolute; left: -60px; display: inline-block; width: 60px; height: 95px; line-height: 95px; text-align: center; font-size: 18px; color: #AAAAAA; font-weight: 700; } .charm-best-num { position: absolute; font-size: 18px; color: #343434; width: 155px; text-align: center; bottom: -75px; left: -30px; } .charm-li-face { display: inline-block; height: 95px; line-height: 95px; } .charm-li-face .charm-name { font-size: 18px; margin-left: 15px; } .charm-li-face .face { width: 65px; height: 65px; border-radius: 50%; vertical-align: middle; margin: 0; } .charm-rich { display: inline-block; line-height: 95px; font-size: 18px; float: right; margin-right: 30px; } .charm-top h2 { position: relative; font-size: 28px; text-indent: 24px; } .charm-top h2 .Bar { height: 28px; width: 6px; border-radius: 5px; background: #ff6600; top: 8px; left: 6px; position: absolute; } .us-box { height: 845px; position: relative; border-radius: 15px; background: #ffffff; margin-bottom: 50px; top: 70px; } .w2 { width: 1200px; margin: 0 auto; } .us-l { width: 50%; float: left; margin-top: 40px; margin-left: 35px; } .us-l h2 { font-size: 24px; color: #666666; } .us-l span { color: #FF6700; margin-left: 5px; } .us-l p { font-size: 14px; line-height: 24px; } .us-r { width: 45%; float: left; margin-top: 40px; } .us-r h2 { font-size: 24px; color: #666666; } .us-r span { color: #FF6700; margin-left: 5px; } .us-r p { font-size: 14px; line-height: 24px; } .us-jz { margin-top: 56px; margin-bottom: 26px; } .us-hz { margin-top: 56px; margin-bottom: 26px; } .us-ts { margin-bottom: 25px; } .b-tips { position: absolute; bottom: 10px; text-align: center; width: 100%; } .play-tips { font-size: 22px; margin-left: 20px; margin-right: 20px; }