|
|
@@ -1,4 +1,4 @@
|
|
|
-*{
|
|
|
+* {
|
|
|
margin: 0;
|
|
|
padding: 0;
|
|
|
}
|
|
|
@@ -7,23 +7,25 @@ html {
|
|
|
-webkit-text-size-adjust: 100%;
|
|
|
-ms-text-size-adjust: 100%;
|
|
|
/* 解决IOS默认滑动很卡的情况 */
|
|
|
- -webkit-overflow-scrolling : touch;
|
|
|
+ -webkit-overflow-scrolling: touch;
|
|
|
}
|
|
|
-body{
|
|
|
+
|
|
|
+body {
|
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
|
|
font-size: .16rem;
|
|
|
-}
|
|
|
+}
|
|
|
+
|
|
|
/* 禁止缩放表单 */
|
|
|
input[type="submit"], input[type="reset"], input[type="button"], input {
|
|
|
resize: none;
|
|
|
border: none;
|
|
|
}
|
|
|
|
|
|
-ol,li,ul,dl,dt,dd{
|
|
|
- list-style:none;
|
|
|
+ol, li, ul, dl, dt, dd {
|
|
|
+ list-style: none;
|
|
|
}
|
|
|
|
|
|
-img{
|
|
|
+img {
|
|
|
height: auto;
|
|
|
object-fit: cover;
|
|
|
}
|
|
|
@@ -33,43 +35,46 @@ em, i {
|
|
|
}
|
|
|
|
|
|
textarea {
|
|
|
- resize:none;
|
|
|
+ resize: none;
|
|
|
}
|
|
|
|
|
|
p {
|
|
|
- word-wrap:break-word;
|
|
|
+ word-wrap: break-word;
|
|
|
}
|
|
|
-a{
|
|
|
+
|
|
|
+a {
|
|
|
text-decoration: none;
|
|
|
color: inherit;
|
|
|
outline: none;
|
|
|
-moz-outline-style: none;
|
|
|
}
|
|
|
+
|
|
|
a:active, a:focus {
|
|
|
outline: none;
|
|
|
}
|
|
|
|
|
|
-.textEllipsis{
|
|
|
+.textEllipsis {
|
|
|
text-overflow: ellipsis;
|
|
|
white-space: nowrap;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
-.sectionContainer{
|
|
|
+.sectionContainer {
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
}
|
|
|
-.elementorContainer{
|
|
|
- max-width: 13.2rem;
|
|
|
+
|
|
|
+.elementorContainer {
|
|
|
+ max-width: 13.2rem;
|
|
|
flex: 1;
|
|
|
-moz-box-sizing: border-box;
|
|
|
- -webkit-box-sizing: border-box;
|
|
|
+ -webkit-box-sizing: border-box;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
|
|
|
|
|
|
/* <-- start 头部模块 */
|
|
|
-.headerContainer{
|
|
|
+.headerContainer {
|
|
|
width: 100%;
|
|
|
background-color: #FFF;
|
|
|
position: sticky;
|
|
|
@@ -77,18 +82,20 @@ a:active, a:focus {
|
|
|
left: 0;
|
|
|
right: 0;
|
|
|
z-index: 99;
|
|
|
- -webkit-box-shadow: 0 .02rem .05rem rgba(0,0,0,.03);
|
|
|
- box-shadow: 0 .02rem .05rem rgba(0,0,0,.03);
|
|
|
+ -webkit-box-shadow: 0 .02rem .05rem rgba(0, 0, 0, .03);
|
|
|
+ box-shadow: 0 .02rem .05rem rgba(0, 0, 0, .03);
|
|
|
}
|
|
|
-.warnContainer{
|
|
|
- background-color: #434344;
|
|
|
+
|
|
|
+.warnContainer {
|
|
|
+ background-color: #434344;
|
|
|
width: 100%;
|
|
|
height: .5rem;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
}
|
|
|
-.warnContainer .warnText{
|
|
|
+
|
|
|
+.warnContainer .warnText {
|
|
|
max-width: 13.2rem;
|
|
|
word-break: break-all;
|
|
|
line-height: 1.4;
|
|
|
@@ -96,8 +103,9 @@ a:active, a:focus {
|
|
|
font-size: .16rem;
|
|
|
color: rgba(255, 255, 255, .7);
|
|
|
}
|
|
|
+
|
|
|
/* PC端头部 */
|
|
|
-#computerEndHeader{
|
|
|
+#computerEndHeader {
|
|
|
width: 13.2rem;
|
|
|
height: .7rem;
|
|
|
margin: 0 auto;
|
|
|
@@ -106,17 +114,20 @@ a:active, a:focus {
|
|
|
align-items: center;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
-#computerEndHeader .computerLogo{
|
|
|
+
|
|
|
+#computerEndHeader .computerLogo {
|
|
|
color: rgba(79, 73, 222, 1);
|
|
|
font-weight: bold;
|
|
|
font-size: .28rem;
|
|
|
padding-right: .5rem;
|
|
|
}
|
|
|
-#computerEndHeader .computerLogo img{
|
|
|
+
|
|
|
+#computerEndHeader .computerLogo img {
|
|
|
height: .36rem;
|
|
|
width: auto;
|
|
|
}
|
|
|
-.headNavContainer{
|
|
|
+
|
|
|
+.headNavContainer {
|
|
|
flex: 1;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
@@ -124,7 +135,8 @@ a:active, a:focus {
|
|
|
overflow: hidden;
|
|
|
|
|
|
}
|
|
|
-.headNavItem{
|
|
|
+
|
|
|
+.headNavItem {
|
|
|
height: .7rem;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
@@ -132,7 +144,8 @@ a:active, a:focus {
|
|
|
position: relative;
|
|
|
margin-right: .36rem;
|
|
|
}
|
|
|
-.headNavItem .headNavTitle{
|
|
|
+
|
|
|
+.headNavItem .headNavTitle {
|
|
|
padding: 0 .28rem;
|
|
|
font-weight: bold;
|
|
|
color: #333333;
|
|
|
@@ -143,11 +156,12 @@ a:active, a:focus {
|
|
|
min-width: 1.5rem;
|
|
|
}
|
|
|
|
|
|
-.headNavItem.active .headNavTitle{
|
|
|
+.headNavItem.active .headNavTitle {
|
|
|
color: #FFFFFF;
|
|
|
font-size: .24rem;
|
|
|
}
|
|
|
-.headNavItem.active .back{
|
|
|
+
|
|
|
+.headNavItem.active .back {
|
|
|
position: absolute;
|
|
|
width: 100%;
|
|
|
height: 116%;
|
|
|
@@ -157,59 +171,69 @@ a:active, a:focus {
|
|
|
background-color: rgba(79, 73, 222, 1);
|
|
|
z-index: 1;
|
|
|
}
|
|
|
-.headIconContainer{
|
|
|
+
|
|
|
+.headIconContainer {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
height: 100%;
|
|
|
}
|
|
|
-.headIconContainer .headIconItem{
|
|
|
+
|
|
|
+.headIconContainer .headIconItem {
|
|
|
padding: 0 .2rem;
|
|
|
height: .7rem;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
}
|
|
|
-.headIconContainer .headIconItem img{
|
|
|
+
|
|
|
+.headIconContainer .headIconItem img {
|
|
|
height: .24rem;
|
|
|
}
|
|
|
-.headIconContainer .headIconItem .cart img{
|
|
|
+
|
|
|
+.headIconContainer .headIconItem .cart img {
|
|
|
height: .28rem;
|
|
|
}
|
|
|
|
|
|
|
|
|
/* 移动端头部 */
|
|
|
-#mobileEndHeader{
|
|
|
+#mobileEndHeader {
|
|
|
display: none;
|
|
|
position: relative;
|
|
|
}
|
|
|
-.mobileEndHeaderConten{
|
|
|
+
|
|
|
+.mobileEndHeaderConten {
|
|
|
padding: 0 .24rem;
|
|
|
- height:.9rem;
|
|
|
+ height: .9rem;
|
|
|
display: flex;
|
|
|
flex: 1;
|
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
|
}
|
|
|
-.mobileEndHeaderConten .mobileLogo{
|
|
|
+
|
|
|
+.mobileEndHeaderConten .mobileLogo {
|
|
|
color: rgba(79, 73, 222, 1);
|
|
|
font-weight: bold;
|
|
|
font-size: .28rem;
|
|
|
padding-right: .5rem;
|
|
|
}
|
|
|
-.mobileEndHeaderConten .mobileLogo img{
|
|
|
+
|
|
|
+.mobileEndHeaderConten .mobileLogo img {
|
|
|
height: .4rem;
|
|
|
- width: auto;
|
|
|
+ width: auto;
|
|
|
}
|
|
|
-.mobileUserIconList{
|
|
|
+
|
|
|
+.mobileUserIconList {
|
|
|
display: flex;
|
|
|
flex: 1;
|
|
|
align-items: center;
|
|
|
justify-content: flex-end;
|
|
|
padding-right: .24rem;
|
|
|
-}
|
|
|
-.mobileUserIcon img{
|
|
|
+}
|
|
|
+
|
|
|
+.mobileUserIcon img {
|
|
|
height: .3rem;
|
|
|
}
|
|
|
+
|
|
|
#mobileMenuBot {
|
|
|
height: .4rem;
|
|
|
display: flex;
|
|
|
@@ -224,6 +248,7 @@ a:active, a:focus {
|
|
|
background-color: #666666;
|
|
|
border-radius: .08rem;
|
|
|
}
|
|
|
+
|
|
|
#mobileMenuLink:before,
|
|
|
#mobileMenuLink:after {
|
|
|
content: '';
|
|
|
@@ -274,10 +299,11 @@ a:active, a:focus {
|
|
|
.open #mobileMenuLink:after {
|
|
|
background: #666666;
|
|
|
}
|
|
|
-.mobileMenuFixed{
|
|
|
- position: absolute;
|
|
|
+
|
|
|
+.mobileMenuFixed {
|
|
|
+ position: absolute;
|
|
|
background: white;
|
|
|
- border-radius: .12rem;
|
|
|
+ border-radius: .12rem;
|
|
|
min-width: 3rem;
|
|
|
max-width: 5rem;
|
|
|
padding: .12rem .24rem;
|
|
|
@@ -286,13 +312,16 @@ a:active, a:focus {
|
|
|
z-index: 999;
|
|
|
display: none;
|
|
|
}
|
|
|
-.mobileMenuItem{
|
|
|
+
|
|
|
+.mobileMenuItem {
|
|
|
border-bottom: .01rem solid #dfdfdf;
|
|
|
}
|
|
|
-.mobileMenuFixed .mobileMenuItem:last-child{
|
|
|
+
|
|
|
+.mobileMenuFixed .mobileMenuItem:last-child {
|
|
|
border: none;
|
|
|
}
|
|
|
-.mobileMenuItem .menuItemTitle{
|
|
|
+
|
|
|
+.mobileMenuItem .menuItemTitle {
|
|
|
height: .8rem;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
@@ -300,15 +329,17 @@ a:active, a:focus {
|
|
|
overflow: hidden;
|
|
|
text-overflow: ellipsis;
|
|
|
white-space: nowrap;
|
|
|
- color: #434343;
|
|
|
+ color: #434343;
|
|
|
}
|
|
|
-.mobileMenuItem.active .menuItemTitle{
|
|
|
+
|
|
|
+.mobileMenuItem.active .menuItemTitle {
|
|
|
color: rgba(79, 73, 222, 1);
|
|
|
}
|
|
|
+
|
|
|
/* end 头部模块 --> */
|
|
|
|
|
|
/* start 年龄提示模块 --> */
|
|
|
-.maskContainer{
|
|
|
+.maskContainer {
|
|
|
position: fixed;
|
|
|
width: 100vw;
|
|
|
height: 100vh;
|
|
|
@@ -320,7 +351,8 @@ a:active, a:focus {
|
|
|
background-color: rgba(0, 0, 0, .5);
|
|
|
display: none;
|
|
|
}
|
|
|
-.ageReminderBox{
|
|
|
+
|
|
|
+.ageReminderBox {
|
|
|
width: 7rem;
|
|
|
background-color: #FFF;
|
|
|
height: 3.8rem;
|
|
|
@@ -329,7 +361,8 @@ a:active, a:focus {
|
|
|
top: 30%;
|
|
|
position: absolute;
|
|
|
}
|
|
|
-.ageReminderBack{
|
|
|
+
|
|
|
+.ageReminderBack {
|
|
|
position: absolute;
|
|
|
z-index: 1;
|
|
|
height: 100%;
|
|
|
@@ -337,26 +370,29 @@ a:active, a:focus {
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
}
|
|
|
-.ageReminderInfo{
|
|
|
+
|
|
|
+.ageReminderInfo {
|
|
|
position: relative;
|
|
|
z-index: 2;
|
|
|
margin-left: .32rem;
|
|
|
padding-top: 1rem;
|
|
|
color: #fff;
|
|
|
}
|
|
|
-.ageReminderInfo h3{
|
|
|
+
|
|
|
+.ageReminderInfo h3 {
|
|
|
line-height: 1.4;
|
|
|
font-size: .36rem;
|
|
|
max-width: 60%;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
|
|
|
-.ageReminderInfo .ageReminderButBox{
|
|
|
+.ageReminderInfo .ageReminderButBox {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
padding-top: .32rem;
|
|
|
}
|
|
|
-.ageReminderInfo .ageReminderButBox .ageRBut{
|
|
|
+
|
|
|
+.ageReminderInfo .ageReminderButBox .ageRBut {
|
|
|
color: rgba(237, 109, 244, 1);
|
|
|
background-color: #fff;
|
|
|
display: flex;
|
|
|
@@ -371,46 +407,54 @@ a:active, a:focus {
|
|
|
margin-right: .32rem;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
+
|
|
|
/* end 年龄提示模块 --> */
|
|
|
|
|
|
/* <-- start 底部模块 */
|
|
|
-.footerContainer{
|
|
|
+.footerContainer {
|
|
|
width: 100%;
|
|
|
background-color: rgba(32, 32, 32, 1);
|
|
|
position: relative;
|
|
|
z-index: 10;
|
|
|
}
|
|
|
-.warningContainer{
|
|
|
+
|
|
|
+.warningContainer {
|
|
|
background-color: gray;
|
|
|
}
|
|
|
-.warningBox{
|
|
|
+
|
|
|
+.warningBox {
|
|
|
padding: .16rem 0;
|
|
|
color: rgba(255, 255, 255, .8);
|
|
|
font-size: .15rem;
|
|
|
line-height: 1.4;
|
|
|
}
|
|
|
-.footerConter{
|
|
|
+
|
|
|
+.footerConter {
|
|
|
color: #FFF;
|
|
|
padding-top: .3rem;
|
|
|
padding-bottom: .24rem;
|
|
|
display: flex;
|
|
|
}
|
|
|
-.leftText{
|
|
|
- max-width: 2rem;
|
|
|
+
|
|
|
+.leftText {
|
|
|
+ max-width: 7rem;
|
|
|
margin-right: .8rem;
|
|
|
}
|
|
|
-.leftText .ltK{
|
|
|
+
|
|
|
+.leftText .ltK {
|
|
|
font-weight: bold;
|
|
|
font-size: .18rem;
|
|
|
word-break: break-all;
|
|
|
padding-bottom: .06rem;
|
|
|
}
|
|
|
-.leftText .ltV{
|
|
|
+
|
|
|
+.leftText .ltV {
|
|
|
font-size: .14rem;
|
|
|
color: rgba(255, 255, 255, .6);
|
|
|
word-break: break-all;
|
|
|
}
|
|
|
-.footerInuptBox{
|
|
|
+
|
|
|
+.footerInuptBox {
|
|
|
background: #FFF;
|
|
|
flex: 1;
|
|
|
height: .5rem;
|
|
|
@@ -421,123 +465,154 @@ a:active, a:focus {
|
|
|
max-width: 5rem;
|
|
|
margin-right: 1.5rem;
|
|
|
}
|
|
|
-.footerInuptBox .mailIcon{
|
|
|
+
|
|
|
+.footerInuptBox .mailIcon {
|
|
|
width: .38rem;
|
|
|
height: .38rem;
|
|
|
}
|
|
|
-.footerInupt{
|
|
|
+
|
|
|
+.footerInupt {
|
|
|
flex: 1;
|
|
|
height: 100%;
|
|
|
outline: none;
|
|
|
font-size: .18rem;
|
|
|
margin: 0 .12rem;
|
|
|
}
|
|
|
-.footerInuptBox .arrowIcon{
|
|
|
+
|
|
|
+.footerInuptBox .arrowIcon {
|
|
|
height: .19rem;
|
|
|
width: auto;
|
|
|
}
|
|
|
-.fLinkContainer{
|
|
|
+
|
|
|
+.fLinkContainer {
|
|
|
flex: 1;
|
|
|
display: flex;
|
|
|
justify-content: flex-end;
|
|
|
padding-right: .5rem;
|
|
|
}
|
|
|
-.fLinkBox{
|
|
|
+
|
|
|
+.fLinkBox {
|
|
|
padding: 0 .24rem;
|
|
|
}
|
|
|
-.fLinkTitle{
|
|
|
+
|
|
|
+.fLinkTitle {
|
|
|
font-size: .15rem;
|
|
|
color: #666666;
|
|
|
font-weight: 400;
|
|
|
margin-bottom: .04rem;
|
|
|
}
|
|
|
-.fLinkItem{
|
|
|
+
|
|
|
+.fLinkTitle span {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.fLinkItem {
|
|
|
font-size: .14rem;
|
|
|
color: #fff;
|
|
|
padding: .02rem 0;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
-.footerIconContainer{
|
|
|
+
|
|
|
+.footerIconContainer {
|
|
|
max-width: 4rem;
|
|
|
}
|
|
|
-.footerIconList{
|
|
|
+
|
|
|
+.footerIconList {
|
|
|
overflow-x: scroll;
|
|
|
white-space: nowrap;
|
|
|
}
|
|
|
+
|
|
|
.footerIconList::-webkit-scrollbar {
|
|
|
display: none;
|
|
|
}
|
|
|
-.footerIconItem{
|
|
|
+
|
|
|
+.footerIconItem {
|
|
|
margin-right: .1rem;
|
|
|
display: inline-flex;
|
|
|
}
|
|
|
-.footerIconItem img{
|
|
|
+
|
|
|
+.footerIconItem img {
|
|
|
width: .48rem;
|
|
|
- height: .48rem;
|
|
|
+ height: .48rem;
|
|
|
border-radius: 50%;
|
|
|
}
|
|
|
-.footerVlsaImg{
|
|
|
+
|
|
|
+.footerVlsaImg {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
padding-top: .1rem;
|
|
|
}
|
|
|
-.footerVlsaItem{
|
|
|
+
|
|
|
+.footerVlsaItem {
|
|
|
font-size: 0;
|
|
|
}
|
|
|
-.footerVlsaImg img{
|
|
|
+
|
|
|
+.footerVlsaImg img {
|
|
|
width: .4rem;
|
|
|
height: .26rem;
|
|
|
}
|
|
|
-.acceptContainer{
|
|
|
+
|
|
|
+.acceptContainer {
|
|
|
background-color: #fff;
|
|
|
}
|
|
|
-.acceptBox{
|
|
|
+
|
|
|
+.acceptBox {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
padding: .16rem 0;
|
|
|
}
|
|
|
-.acceptLeftInfo{
|
|
|
+
|
|
|
+.acceptLeftInfo {
|
|
|
max-width: 3.6rem;
|
|
|
}
|
|
|
-.acceptLeftInfo .weAcc{
|
|
|
+
|
|
|
+.acceptLeftInfo .weAcc {
|
|
|
font-size: .14rem;
|
|
|
color: #434343;
|
|
|
}
|
|
|
-.aLImgBox{
|
|
|
+
|
|
|
+.aLImgBox {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
gap: .08rem;
|
|
|
padding-top: .08rem;
|
|
|
}
|
|
|
-.aLImgItem{
|
|
|
+
|
|
|
+.aLImgItem {
|
|
|
font-size: 0;
|
|
|
}
|
|
|
-.aLImgItem img{
|
|
|
+
|
|
|
+.aLImgItem img {
|
|
|
width: 2.5rem;
|
|
|
height: .3rem;
|
|
|
}
|
|
|
-.weText{
|
|
|
+
|
|
|
+.weText {
|
|
|
font-size: .14rem;
|
|
|
color: #434343;
|
|
|
line-height: 1.4;
|
|
|
word-break: break-all;
|
|
|
padding-top: .3rem;
|
|
|
}
|
|
|
-.acceptRightInfo{
|
|
|
+
|
|
|
+.acceptRightInfo {
|
|
|
display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
+ flex-wrap: wrap;
|
|
|
justify-content: flex-end;
|
|
|
gap: .16rem;
|
|
|
flex: 1;
|
|
|
padding-left: .24rem;
|
|
|
}
|
|
|
-.aRImgItem{
|
|
|
+
|
|
|
+.aRImgItem {
|
|
|
font-size: 0;
|
|
|
}
|
|
|
-.aRImgItem img{
|
|
|
+
|
|
|
+.aRImgItem img {
|
|
|
width: 1.3rem;
|
|
|
height: .7rem;
|
|
|
}
|
|
|
+
|
|
|
#toastContainer {
|
|
|
position: fixed;
|
|
|
top: 40%;
|
|
|
@@ -557,35 +632,38 @@ a:active, a:focus {
|
|
|
}
|
|
|
|
|
|
|
|
|
-
|
|
|
/* <-- start 个人中心菜单 */
|
|
|
-.navContainer{
|
|
|
+.navContainer {
|
|
|
background-color: #E8EEF6;
|
|
|
width: 3.4rem;
|
|
|
padding-bottom: 1rem;
|
|
|
-moz-box-sizing: border-box;
|
|
|
- -webkit-box-sizing: border-box;
|
|
|
+ -webkit-box-sizing: border-box;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
-.navItem{
|
|
|
+
|
|
|
+.navItem {
|
|
|
padding-left: .24rem;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
-.navItem .navItemFlex{
|
|
|
+
|
|
|
+.navItem .navItemFlex {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
height: .6rem;
|
|
|
padding-right: .22rem;
|
|
|
}
|
|
|
-.navItem .navItemFlex.active .navTitle{
|
|
|
+
|
|
|
+.navItem .navItemFlex.active .navTitle {
|
|
|
color: #fff;
|
|
|
background-color: rgba(79, 73, 222, 1);
|
|
|
}
|
|
|
-.navItem .navItemFlex img{
|
|
|
+
|
|
|
+.navItem .navItemFlex img {
|
|
|
width: .4rem;
|
|
|
}
|
|
|
|
|
|
-.navItem .navItemFlex .navTitle{
|
|
|
+.navItem .navItemFlex .navTitle {
|
|
|
font-weight: 400;
|
|
|
color: #434343;
|
|
|
font-size: .17rem;
|
|
|
@@ -599,11 +677,13 @@ a:active, a:focus {
|
|
|
white-space: nowrap;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
-.sunNavBox{
|
|
|
+
|
|
|
+.sunNavBox {
|
|
|
margin-left: .4rem;
|
|
|
padding-right: .22rem;
|
|
|
}
|
|
|
-.sunNavItem{
|
|
|
+
|
|
|
+.sunNavItem {
|
|
|
height: .5rem;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
@@ -612,7 +692,8 @@ a:active, a:focus {
|
|
|
border-radius: .04rem;
|
|
|
margin: .05rem 0;
|
|
|
}
|
|
|
-.sunNavItem .sunNavTitle{
|
|
|
+
|
|
|
+.sunNavItem .sunNavTitle {
|
|
|
font-weight: 400;
|
|
|
font-size: .17rem;
|
|
|
text-overflow: ellipsis;
|
|
|
@@ -620,251 +701,328 @@ a:active, a:focus {
|
|
|
overflow: hidden;
|
|
|
flex: 1;
|
|
|
}
|
|
|
-.sunNavItem.active{
|
|
|
+
|
|
|
+.sunNavItem.active {
|
|
|
color: #fff;
|
|
|
background-color: rgba(79, 73, 222, 1);
|
|
|
}
|
|
|
+
|
|
|
/* end 个人中心菜单 --> */
|
|
|
|
|
|
|
|
|
@media (max-width: 1499px) {
|
|
|
- .navContainer{
|
|
|
+ .navContainer {
|
|
|
width: 3rem;
|
|
|
}
|
|
|
- .navItem{
|
|
|
+
|
|
|
+ .navItem {
|
|
|
padding-left: .16rem;
|
|
|
}
|
|
|
- .navItem .navItemFlex{
|
|
|
+
|
|
|
+ .navItem .navItemFlex {
|
|
|
padding-right: .16rem;
|
|
|
}
|
|
|
- .navItem .navItemFlex img{
|
|
|
+
|
|
|
+ .navItem .navItemFlex img {
|
|
|
width: .34rem;
|
|
|
}
|
|
|
- .navItem .navItemFlex .navTitle{
|
|
|
+
|
|
|
+ .navItem .navItemFlex .navTitle {
|
|
|
height: .46rem;
|
|
|
font-size: .16rem;
|
|
|
}
|
|
|
- .sunNavBox{
|
|
|
+
|
|
|
+ .sunNavBox {
|
|
|
margin-left: .34rem;
|
|
|
padding-right: .16rem;
|
|
|
}
|
|
|
- .sunNavItem{
|
|
|
+
|
|
|
+ .sunNavItem {
|
|
|
height: .46rem;
|
|
|
}
|
|
|
- .sunNavItem .sunNavTitle{
|
|
|
+
|
|
|
+ .sunNavItem .sunNavTitle {
|
|
|
font-size: .16rem;
|
|
|
}
|
|
|
- .navContainer{
|
|
|
+
|
|
|
+ .navContainer {
|
|
|
padding-bottom: .5rem;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
@media (max-width: 1320px) {
|
|
|
- #computerEndHeader{
|
|
|
+ #computerEndHeader {
|
|
|
width: auto;
|
|
|
}
|
|
|
- .computerLogo{
|
|
|
+
|
|
|
+ .computerLogo {
|
|
|
margin-left: .12rem;
|
|
|
}
|
|
|
- .headIconContainer{
|
|
|
+
|
|
|
+ .headIconContainer {
|
|
|
margin-right: .12rem;
|
|
|
}
|
|
|
- .headNavItem .headNavTitle{
|
|
|
+
|
|
|
+ .headNavItem .headNavTitle {
|
|
|
font-size: .22rem;
|
|
|
}
|
|
|
- .headNavItem.active .headNavTitle{
|
|
|
+
|
|
|
+ .headNavItem.active .headNavTitle {
|
|
|
font-size: .26rem;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
@media (max-width: 1199px) {
|
|
|
- .warnContainer{
|
|
|
+ .warnContainer {
|
|
|
height: auto;
|
|
|
}
|
|
|
- .warnContainer .warnText{
|
|
|
+
|
|
|
+ .warnContainer .warnText {
|
|
|
font-size: .2rem;
|
|
|
padding: .06rem .24rem;
|
|
|
}
|
|
|
- #computerEndHeader{
|
|
|
+
|
|
|
+ #computerEndHeader {
|
|
|
display: none;
|
|
|
}
|
|
|
- #mobileEndHeader{
|
|
|
+
|
|
|
+ #mobileEndHeader {
|
|
|
display: flex;
|
|
|
}
|
|
|
- .footerContainer{
|
|
|
+
|
|
|
+ .footerContainer {
|
|
|
height: auto;
|
|
|
}
|
|
|
- .footerConter{
|
|
|
+
|
|
|
+ .footerConter {
|
|
|
display: block;
|
|
|
padding: .24rem .12rem;
|
|
|
}
|
|
|
- .leftText{
|
|
|
+
|
|
|
+ .leftText {
|
|
|
max-width: none;
|
|
|
margin-right: 0;
|
|
|
margin-bottom: .32rem;
|
|
|
}
|
|
|
- .leftText .ltK{
|
|
|
+
|
|
|
+ .leftText .ltK {
|
|
|
font-size: .2rem;
|
|
|
}
|
|
|
- .leftText .ltV{
|
|
|
+
|
|
|
+ .leftText .ltV {
|
|
|
font-size: .18rem;
|
|
|
}
|
|
|
- .footerInuptBox{
|
|
|
+
|
|
|
+ .footerInuptBox {
|
|
|
max-width: 6rem;
|
|
|
margin-right: 0;
|
|
|
height: .6rem;
|
|
|
margin-bottom: .32rem;
|
|
|
}
|
|
|
- .footerIconContainer{
|
|
|
+
|
|
|
+ .footerIconContainer {
|
|
|
max-width: none;
|
|
|
}
|
|
|
- .footerIconList{
|
|
|
+
|
|
|
+ .footerIconList {
|
|
|
white-space: normal;
|
|
|
overflow-x: hidden;
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
margin-bottom: .12rem;
|
|
|
}
|
|
|
- .footerIconItem{
|
|
|
+
|
|
|
+ .footerIconItem {
|
|
|
display: block;
|
|
|
margin-right: .24rem;
|
|
|
}
|
|
|
- .acceptBox{
|
|
|
+
|
|
|
+ .acceptBox {
|
|
|
display: block;
|
|
|
}
|
|
|
- .acceptLeftInfo{
|
|
|
+
|
|
|
+ .acceptLeftInfo {
|
|
|
max-width: none;
|
|
|
}
|
|
|
- .acceptLeftInfo .weAcc{
|
|
|
+
|
|
|
+ .acceptLeftInfo .weAcc {
|
|
|
font-size: .16rem;
|
|
|
}
|
|
|
- .aLImgItem img{
|
|
|
+
|
|
|
+ .aLImgItem img {
|
|
|
width: .6rem;
|
|
|
height: .35rem;
|
|
|
}
|
|
|
- .weText{
|
|
|
+
|
|
|
+ .weText {
|
|
|
font-size: .16rem;
|
|
|
}
|
|
|
- .acceptRightInfo{
|
|
|
+
|
|
|
+ .acceptRightInfo {
|
|
|
justify-content: flex-start;
|
|
|
padding-left: 0;
|
|
|
padding-top: .4rem;
|
|
|
}
|
|
|
- .fLinkContainer{
|
|
|
- justify-content: flex-start;
|
|
|
+
|
|
|
+ .fLinkContainer {
|
|
|
padding-right: 0;
|
|
|
margin-bottom: .4rem;
|
|
|
+ display: block;
|
|
|
}
|
|
|
- .fLinkBox{
|
|
|
+
|
|
|
+ .fLinkBox {
|
|
|
padding: 0;
|
|
|
margin-right: .4rem;
|
|
|
+ display: flex;
|
|
|
+ align-items: baseline;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ padding-top: .12rem;
|
|
|
+ gap: .08rem .16rem;
|
|
|
}
|
|
|
- .fLinkTitle{
|
|
|
+
|
|
|
+ .fLinkTitle {
|
|
|
font-size: .2rem;
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fLinkTitle span {
|
|
|
+ display: inline-block;
|
|
|
}
|
|
|
- .fLinkItem{
|
|
|
+
|
|
|
+ .fLinkItem {
|
|
|
font-size: .18rem;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
@media (max-width: 999px) {
|
|
|
- .navContainer{
|
|
|
+ .navContainer {
|
|
|
width: 2.4rem;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
@media (max-width: 899px) {
|
|
|
- .ageReminderBox{
|
|
|
+ .ageReminderBox {
|
|
|
width: 6rem;
|
|
|
height: 3rem;
|
|
|
}
|
|
|
- .ageReminderInfo{
|
|
|
+
|
|
|
+ .ageReminderInfo {
|
|
|
padding-top: .6rem;
|
|
|
}
|
|
|
- .ageReminderInfo h3{
|
|
|
+
|
|
|
+ .ageReminderInfo h3 {
|
|
|
font-size: .3rem;
|
|
|
}
|
|
|
- .ageReminderInfo .ageReminderButBox .ageRBut{
|
|
|
+
|
|
|
+ .ageReminderInfo .ageReminderButBox .ageRBut {
|
|
|
font-size: .2rem;
|
|
|
min-width: 1rem;
|
|
|
}
|
|
|
|
|
|
- .leftText .ltK{
|
|
|
+ .leftText .ltK {
|
|
|
font-size: .22rem;
|
|
|
}
|
|
|
- .leftText .ltV{
|
|
|
+
|
|
|
+ .leftText .ltV {
|
|
|
font-size: .2rem;
|
|
|
}
|
|
|
|
|
|
- .footerIconItem img{
|
|
|
+ .footerIconItem img {
|
|
|
width: .5rem;
|
|
|
height: .5rem;
|
|
|
}
|
|
|
- .footerVlsaImg img{
|
|
|
+
|
|
|
+ .footerVlsaImg img {
|
|
|
height: .4rem;
|
|
|
}
|
|
|
- #toastContainer{
|
|
|
+
|
|
|
+ #toastContainer {
|
|
|
font-size: .24rem;
|
|
|
padding: .1rem .16rem;
|
|
|
}
|
|
|
- .footerConter{
|
|
|
+
|
|
|
+ .footerConter {
|
|
|
padding: .24rem;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
@media (max-width: 750px) {
|
|
|
- .navContainer{
|
|
|
+ .navContainer {
|
|
|
width: 2.2rem;
|
|
|
}
|
|
|
- .navItem{
|
|
|
+
|
|
|
+ .navItem {
|
|
|
padding-left: .12rem;
|
|
|
}
|
|
|
- .navItem .navItemFlex{
|
|
|
+
|
|
|
+ .navItem .navItemFlex {
|
|
|
padding-right: .12rem;
|
|
|
}
|
|
|
- .navItem .navItemFlex img{
|
|
|
+
|
|
|
+ .navItem .navItemFlex img {
|
|
|
width: .34rem;
|
|
|
}
|
|
|
- .navItem .navItemFlex .navTitle{
|
|
|
+
|
|
|
+ .navItem .navItemFlex .navTitle {
|
|
|
height: .6rem;
|
|
|
font-size: .2rem;
|
|
|
}
|
|
|
- .sunNavBox{
|
|
|
+
|
|
|
+ .sunNavBox {
|
|
|
margin-left: .34rem;
|
|
|
padding-right: .12rem;
|
|
|
}
|
|
|
- .sunNavItem{
|
|
|
+
|
|
|
+ .sunNavItem {
|
|
|
height: .6rem;
|
|
|
}
|
|
|
- .sunNavItem .sunNavTitle{
|
|
|
+
|
|
|
+ .sunNavItem .sunNavTitle {
|
|
|
font-size: .2rem;
|
|
|
}
|
|
|
- .warningBox{
|
|
|
+
|
|
|
+ .warningBox {
|
|
|
font-size: .2rem;
|
|
|
}
|
|
|
- .acceptBox{
|
|
|
+
|
|
|
+ .acceptBox {
|
|
|
display: block;
|
|
|
}
|
|
|
- .acceptLeftInfo{
|
|
|
+
|
|
|
+ .acceptLeftInfo {
|
|
|
max-width: none;
|
|
|
+ margin-left: .5rem;
|
|
|
}
|
|
|
- .acceptLeftInfo .weAcc{
|
|
|
+
|
|
|
+ .acceptLeftInfo .weAcc {
|
|
|
font-size: .2rem;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
- .aLImgItem img{
|
|
|
+
|
|
|
+ .aLImgBox {
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .aLImgItem img {
|
|
|
width: 2.7rem;
|
|
|
height: .4rem;
|
|
|
}
|
|
|
- .weText{
|
|
|
+
|
|
|
+ .weText {
|
|
|
font-size: .2rem;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
- .aRImgItem img{
|
|
|
+
|
|
|
+ .aRImgItem img {
|
|
|
width: 1.5rem;
|
|
|
- height: 0.75rem;
|
|
|
- }
|
|
|
- .aRImgItemLast img{
|
|
|
- width: 2.0rem;
|
|
|
- height: 0.75rem;
|
|
|
+ height: .75rem;
|
|
|
}
|
|
|
- .fLinkTitle{
|
|
|
+
|
|
|
+ .fLinkTitle {
|
|
|
font-size: .24rem;
|
|
|
}
|
|
|
- .fLinkItem{
|
|
|
+
|
|
|
+ .fLinkItem {
|
|
|
font-size: .22rem;
|
|
|
}
|
|
|
}
|