/* 绉诲姩绔 */ /* @media screen and (max-width: 760px) and (min-height: 890px) { .esc-container header.pc-header { display: none; } .esc-container .mobile-header { display: block; } } */ @media screen and (max-width: 960px) { .esc-container header.pc-header, .esc-container .store { display: none; } .esc-container .mobile-header { display: block; height: 47px; background: #000; display: flex; padding: 0; align-items: center; justify-content: center; } .esc-container .mobile-header .nav-btn { display: flex; flex-direction: column; cursor: pointer; width: 17px; position: absolute; right: 15px; } .esc-container .mobile-header .nav-btn img { width: 100%; } .esc-container .mobile-header .logo img { width: 130px; /* height: 23px; */ } .esc-container .banner .swiper-wrapper .swiper-slide { padding-top: 130px; box-sizing: border-box; } .esc-container .banner .swiper-wrapper .swiper-slide p { font-size: 19px; font-family: HarmonyOS Sans SC; font-weight: 500; color: #000000; line-height: 28px; } .esc-container .banner .swiper-wrapper .swiper-slide a { width: 101px; height: 29px; border: 1px solid #000000; border-radius: 14px; font-size: 11px; font-family: HarmonyOS Sans SC; font-weight: 400; color: #000000; line-height: 29px; } .esc-container .banner .swiper-wrapper .swiper-slide:nth-child(2) .yuyue-container{ display: flex;flex-direction: row; position: absolute; bottom: 117px; } .esc-container .banner .swiper-wrapper .swiper-slide:nth-child(2) .yuyue-container a{ font-size: 11px; font-family: Source Han Sans CN; height: 29px; background: #FEFEFE; border-radius: 14px; color: #000000; border: solid 2px #FEFEFE; } .esc-container .banner .swiper-wrapper .swiper-slide:nth-child(2) .yuyue-container a:hover{ height: 29px; background: #000000; border-radius: 14px; color: #FEFEFE; border: solid 2px #000000; } .esc-container .banner { margin-top: -47px; } .esc-container .banner .swiper-wrapper .swiper-slide:last-child { background: url(../mobileImg/banner1.png); background-position: center; background-repeat: no-repeat; background-size: cover; text-align: center; width: 100%; /* background-size: 100% 100%; */ } .esc-container .banner .swiper-wrapper .swiper-slide:first-child { background: url(../mobileImg/banner2-n-v4.png); background-position: center; background-repeat: no-repeat; background-size: cover; text-align: center; width: 100%; /* background-size: 100% 100%; */ } .esc-container .banner .swiper-wrapper .swiper-slide:nth-child(2) { background: url(../mobileImg/banner2-new.png); background-position: center; background-repeat: no-repeat; background-size: cover; text-align: center; width: 100%; /* background-size: 100% 100%; */ } .banner .mySwiper0{ display: none; } .banner .mySwiper-mobile0{ display: block; } .pc-left, .pc-right, .esc-container .real-time .content.pc-content { display: none; } .esc-container .mobile-left, .esc-container .mobile-right { display: block; } .mobile-left.swiper-button-next, .mobile-right.swiper-button-prev { top: 92%; } .esc-container .swiper-button-next, .esc-container .swiper-rtl .swiper-button-prev { right: 73%; } .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction { /* bottom: 43px; */ top: 92%; left: 134px; width: 100%; } .esc-container .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 27px; height: 10px; background: #ef7c1c; border-radius: 5px; } .esc-container .banner .swiper-wrapper .swiper-slide:first-child span { margin-top: 0; font-size: 12px; } .esc-container .banner .swiper-wrapper .swiper-slide:first-child span.coupon_des_title_height { font-size: 24px; font-weight: bold; } .esc-container .banner .swiper-wrapper .swiper-slide:first-child div.coupon_des_intro { font-size: 11px; width: 100%; text-align: center; right: 0; bottom: 117px; } .esc-container .swiper-pagination-bullet { width: 10px; height: 10px; } .esc-container .swiper-pagination-bullet { margin-right: 10px !important; } .esc-container .banner .swiper-wrapper .swiper-slide span { font-size: 14px; font-family: HarmonyOS Sans SC; font-weight: 300; color: #000000; /* line-height: 24px; */ } .esc-container #yuyue-btn1 { display: block; } .esc-container #yuyue1 { display: none; } .esc-container .banner .swiper-wrapper .swiper-slide #yuyue-btn { display: none; } .esc-container .banner .swiper-wrapper .swiper-slide:last-child p { margin-bottom: 20px; } .esc-container .banner .swiper-wrapper .swiper-slide:first-child p { margin-bottom: 4px; font-size: 20px; font-weight: 500; } .esc-container .banner .swiper-wrapper .swiper-slide a.active { background: #000; color: #fff; } .esc-container .video, .esc-container .activity { padding-top: 59px; } .esc-container .video .title { font-size: 21px; font-family: HarmonyOS Sans SC; font-weight: 500; color: #ffffff; line-height: 15px; } .esc-container .more { font-size: 10px; font-family: Source Han Sans CN; font-weight: 300; color: #ffffff; line-height: 7px; margin-top: 16px; } .esc-container .video main video { margin-top: 17px; } .esc-container .sec-title { font-size: 19px; font-family: HarmonyOS Sans SC; font-weight: 500; color: #ffffff; line-height: 13px; } .esc-container .sec-title p { margin-bottom: 0; } .esc-container .sec-title .line { width: 30px; height: 2px; background: #bea013; margin-top: 11px; } .esc-container .activity main { margin-top: 40px; flex-direction: column; } .esc-container .activity main .left, .esc-container .activity main .right { width: 100%; } .esc-container .activity main .right { margin-top: 36px; } .esc-container .real-time .content { width: 100%; flex-direction: column; } .esc-container .real-time .content .left, .esc-container .real-time .content .right { width: 100%; } .esc-container .real-time .content .right { width: 92%; margin: 29px auto 0 auto; color: #fff; } .esc-container .real-time .content .right h5 { font-size: 16px; font-family: Source Han Sans CN; font-weight: 500; color: #ffffff; line-height: 16px; margin-bottom: 28px; } .esc-container .real-time .content .right p { font-size: 14px; font-family: Source Han Sans CN; font-weight: 400; color: #ffffff; line-height: 20px; margin-bottom: 47px; } .esc-container .real-time .content .right .detail { border: 1px solid #ffffff; border-radius: 18px; width: 100%; display: block; text-align: center; font-size: 11px; margin-bottom: 35px; font-family: HarmonyOS Sans SC; font-weight: 400; color: #fff; height: 38px; line-height: 38px; } .brand { display: block; padding-top: 60px; box-sizing: border-box; background: #fff; padding-bottom: 40px; height: 100vh; } .esc-container .swiper-slide img.xiao { display: block; } .esc-container .swiper-slide img.chang { display: none; } .brand .swiper-wrapper { color: #fff; margin-top: 38px; width: 100%; } .esc-container .brand .swiper { height: auto; } .esc-container .brand .sec-title { color: #000; } .brand .swiper-wrapper h5 { font-size: 16px; font-family: Source Han Sans CN; font-weight: 500; color: #000000; line-height: 25px; text-align: left; margin: 29px 0 26px 0; } .brand .swiper-wrapper p { font-size: 14px; font-family: Source Han Sans CN; font-weight: 400; color: #262626; line-height: 20px; margin-bottom: 80px; text-align: left; } .brand .swiper-wrapper .more { height: 38px; border: 1px solid #000000; border-radius: 18px; width: 100%; display: block; font-size: 11px; font-family: HarmonyOS Sans SC; font-weight: 400; color: #000000; text-align: center; line-height: 38px; margin-top: 0; margin-top: -40px; } .brand .swiper-wrapper .more.active { background: #000; color: #fff; } .brand .mySwiper3.swiper { width: 90%; } .esc-container .brand .swiper-pagination-bullet { background: #ffffff; border: 1px solid #ef7c1c; /* border-radius: 50%; */ } .esc-container .brand .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #ef7c1c; } .brand .swiper-horizontal > .swiper-pagination-bullets, .brand .swiper-pagination-bullets.swiper-pagination-horizontal, .brand .swiper-pagination-custom, .brand .swiper-pagination-fraction { left: 0; bottom: 10px; } .esc-container .real-time .content.mobile-content { display: flex; } .esc-container .real-time .content.mobile-content .swiper-horizontal > .swiper-pagination-bullets, .esc-container .real-time .content.mobile-content .swiper-pagination-bullets.swiper-pagination-horizontal, .esc-container .real-time .content.mobile-content .swiper-pagination-custom, .swiper-pagination-fraction { left: -35%; bottom: 6px; } .esc-container .pc-share { display: none; } .esc-container .mobile { display: block; } .swiper { width: 100%; height: 100%; } .swiper-slide { text-align: center; font-size: 18px; background: #fff; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } /* html, body { position: relative; height: 100%; } body { background: #eee; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 14px; color: #000; margin: 0; padding: 0; } */ .esc-container main.mobile-share { position: relative; height: auto !important; padding-bottom: 100px; box-sizing: border-box; } .esc-container .mobile-share .swiper { width: 100%; height: 100%; } .mobile-share .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .mobile-share .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; } .mobile-share .swiper-slide { width: 80%; margin-right: 20px; } /* .mobile-share .swiper-slide:nth-child(2n) { width: 60%; } .mobile-share .swiper-slide:nth-child(3n) { width: 40%; } */ .mobile-share .swiper-button-next, .mobile-share .swiper-button-prev { top: 88%; } .esc-container .mobile-share .swiper-button-next, .esc-container .mobile-share .swiper-rtl .swiper-button-prev { right: 36%; } .esc-container .mobile-share .swiper-button-prev, .esc-container .mobile-share .swiper-rtl .swiper-button-next { left: 36%; } .esc-container .share { padding-top: 60px; /* padding-bottom: 76px; */ box-sizing: border-box; } footer.mobile-footer .a-link:last-child { margin-top: 65px; } footer.mobile-footer { display: block; box-sizing: border-box; } footer.mobile-footer .link-box { padding-left: 20px; box-sizing: border-box; } footer.mobile-footer .logo img { width: 200px; margin: 76px auto 49px auto; } footer.mobile-footer .a-link { display: flex; align-items: center; } footer.mobile-footer .back { margin-bottom: 65px; } footer.mobile-footer .a-link a { font-size: 12px; font-family: Source Han Sans CN; font-weight: 400; color: #ffffff; line-height: 33px; } footer.mobile-footer .a-link .line { width: 1px; height: 9px; border: 1px solid #ffffff; margin: 0 14px; } footer.mobile-footer .mobile-bottom { display: flex; font-size: 12px; font-family: Source Han Sans CN; font-weight: 400; color: #666666; margin: 14px 0 24px 0; } footer.mobile-footer .mobile-bottom a { font-size: 12px; font-family: Source Han Sans CN; font-weight: 400; color: #666666; } footer.mobile-footer .mobile-bottom a:first-child { display: block; } footer.mobile-footer .mobile-bottom1 p { font-size: 10px; font-family: Source Han Sans CN; font-weight: 400; color: #666666; margin-bottom: 14px; } footer.mobile-footer .mobile-bottom1 a{ font-size: 10px; font-family: Source Han Sans CN; color: #666666; } footer.mobile-footer .mobile-bottom1 p:nth-child(2) { margin: 0; } footer.pc-footer { display: none; } .esc-container .fixed { position: fixed; right: 13px; top: 66%; /* z-index: 9999; */ } .esc-container .fixed img { width: 35px; height: 35px; } .esc-container .fixed .back { margin-top: 10px; } .esc-container .banner .swiper-wrapper .swiper-slide { justify-content: flex-start; } .esc-container .swiper-button-prev.mobile-right, .esc-container .swiper-rtl .swiper-button-next.mobile-left { left: 5%; } .mobile-share .swiper-slide .share-bottom { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 80px; } .mobile-share .swiper-slide .share-bottom h5 { font-size: 15px; font-family: Source Han Sans CN; font-weight: bold; color: #000000; margin-bottom: 0; } .mobile-share .swiper-slide .share-bottom p { font-size: 13px; font-family: Source Han Sans CN; font-weight: 400; color: #000000; margin: 0; margin-top: 12px; } /* 澶撮儴鏍峰紡 */ .mobile-nav { background: #fff; position: absolute; z-index: 9999999; top: 47px; right: 0; height: 100vh; overflow: scroll; padding-bottom: 100px; box-sizing: border-box; width: 100%; padding-top: 10px; box-sizing: border-box; } .mobile-nav .ul1 { width: 90%; margin: 0 auto; } .mobile-nav .ul1 .li1, .mobile-nav .ul2 .li2 { padding-bottom: 19px; box-sizing: border-box; padding-top: 19px; border-bottom: 1px solid #f6f6f6; } .mobile-nav .ul2 .li2:nth-child(2) { border: none; padding-bottom: 0; } .mobile-nav .ul1 .li1 p, .mobile-na .ul2 .li2 p { display: flex; justify-content: space-between; margin: 0; } .mobile-nav .ul1 .li1 p span, .mobile-nav .ul2 .li2 p span { font-size: 15px; font-family: Source Han Sans CN; font-weight: 400; color: #000000; line-height: 13px; } .mobile-nav .ul2 .li2 p span { color: #333; font-size: 13px; } .mobile-nav .ul1 .li1 p img, .mobile-nav .ul2 .li2 p img { width: 9px; height: 5px; } .mobile-nav .more { display: flex; margin-top: 0; /* align-items: center; */ color: #000; font-size: 12px; font-family: Source Han Sans CN; font-weight: 400; color: #666666; justify-content: flex-start; } .mobile-nav .more img { margin-left: 13px; width: 5px; height: 9px; } .mobile-nav, .ul2, .li2 .main { display: none; } .mobile-nav.show, .ul2.show { display: block; } #pages.show { height: 100vh; overflow: hidden; } .li2 .main.show { display: block; margin-top: 23px; } .li2 .main.show .main-content { overflow-x: scroll; /* -webkit-overflow-scrolling: touch; */ display: -webkit-box; padding-bottom: 22px; box-sizing: border-box; } .li2 .main.show .main-content a { display: block; margin-right: 14px; width: 60%; } .li2 .main.show .main-content a:nth-child(2) { margin-right: 0; } .li2 .main.show .main-content a img { width: 100%; } .li2 .main.show .main-content a p { font-size: 13px; font-family: Source Han Sans CN; font-weight: 400; color: #000000; margin: 0; margin-top: 19px; } .li2 .main.show .main-content > div { /* width: 233px; */ width: 64%; margin-right: 16px; } .li2 .main.show .main-content > div a { display: block; width: 100%; height: 100%; } .main.show .more { border-top: 1px solid #f6f6f6; padding-top: 17px; } .ul2 .li2 a { color: #333; font-size: 13px; } .mobile-left1, .mobile-right1, .mobile-share { display: block; } .esc-container .mobile-content .swiper-button-next, .esc-container .mobile-content .swiper-rtl .swiper-button-prev { right: 11%; } .mobile-content .swiper-button-next, .mobile-content .swiper-button-prev { top: 50%; } .esc-container .mySwiper .swiper-button-next.mobile-left, .esc-container .mySwiper .swiper-button-prev.mobile-right { display: block; } .esc-container .banner .swiper-button-next.pc-left, .esc-container .banner .swiper-button-prev.pc-right { display: none; } .esc-container .banner .swiper:hover .swiper-button-next.pc-left, .esc-container .banner .swiper:hover .swiper-button-prev.pc-right { display: none; } .esc-container .swiper-button-prev { display: block; } .esc-container .swiper-button-next { display: block; } .esc-container .activity main.pc-activity { display: none; } .esc-container .activity main.mobile-activity { display: flex; } .swiper-button-prev.mobile-right { display: block; } .swiper-button-next.mobile-left { display: block; } .swiper-button-prev.pc-right { display: none; } .swiper-button-next.pc-left { display: none; } .mobile-nav .ul1 .li1 p.nav1 { margin-bottom: 10px; } /* .esc-container .mobile-header; */ } @media screen and (max-width: 760px) and (min-height: 840px) { .esc-container .banner .swiper-wrapper .swiper-slide:last-child { height: 100vh; background-image: url('../mobileImg/bannerchang1.png'); background-position: center; background-repeat: no-repeat; background-size: cover; text-align: center; } .esc-container .banner .swiper-wrapper .swiper-slide:first-child { height: 100vh; background-image: url('../mobileImg/banner2-v4.png'); background-position: center; background-repeat: no-repeat; background-size: cover; text-align: center; } .esc-container .banner .swiper-wrapper .swiper-slide:nth-child(2) { height: 100vh; background-image: url('../mobileImg/bannerchang2-v2.png'); background-position: center; background-repeat: no-repeat; background-size: cover; text-align: center; } .esc-container .banner .swiper-wrapper .swiper-slide:nth-child(2) div.coupon_des_intro { bottom: 197px; } .esc-container .banner .swiper-wrapper .swiper-slide:nth-child(2) .yuyue-container { bottom: 197px; } .esc-container .swiper-slide img.xiao { display: none; } .esc-container .swiper-slide img.chang { display: block; } .brand .swiper-wrapper p { margin-bottom: 120px; } }