@font-face {
    font-family: 'iconfont';
    src: url('/iconfont/iconfont.woff2?t=1705108683799') format('woff2'),
         url('/iconfont/iconfont.woff?t=1705108683799') format('woff'),
         url('/iconfont/iconfont.ttf?t=1705108683799') format('truetype');
}
.icon {
    cursor: pointer;
    font-size: 18px !important;
}
.icon:hover {
    color: #4a90a4;
}
.iconfont {
    font-family: "iconfont" !important;
    font-size: .18rem;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.box .lk {
    color: #4a90a4;
}
.box .lk:hover {
    text-decoration: underline;
}

.scrollbox .tr {
    margin: 0.1rem 0;
    border: 1px solid #e9e9e9;
}
.scrollbox .tr:hover {
    border-color: #4a90a4;
}

.anniu{font-size: 0.18rem;color:#4a90a4;width: 3rem;line-height: 0.36rem;border:1px solid #4a90a4;text-align: center;background-color: #fff;margin:0 auto;display: block;cursor: pointer;}
.anniu.this{color:#fff;background-color: #4a90a4;}
.anniu:hover{color:#fff;background-color: #3d7a8b;border-color:#3d7a8b;}

.hidden {
    display: none;
}
.full {
    width: 100%;
}
.block {
    display: block;
}
.title {
    font-weight: bold;
    font-size: 16px;
    margin-top: 0.2rem;    
}
.indent {
    text-indent: 2em;
    margin: 10px 0;
}
.page {
    display: inline-block;
    padding: 10px 0;
    text-align: center;
    width: 100%;
}
.page a {
    color: #4a90a4;
    display: inline-block;
    padding: 8px 16px;
    text-decoration: none;
    transition: background-color 0.3s;
    border: 1px solid #ddd;
    margin: 0 4px;
    border-radius: 4px;
}
.page a.active {
    background-color: #4a90a4;
    color: white;
    border: 1px solid #4a90a4;
}
.page a:hover:not(.active) {
    background-color: #4a90a4;
}
.page a.next {
    background-color: #4a90a4;
    color: white;
    border: 1px solid #4a90a4;
}
.page a.next:hover {
    color: darkred;
}

.code {
    line-height: 0.38rem;
    border-radius: .1rem;
    border: 1px solid #e9e9e9;
    font-size: 0.18rem;
    text-align: center;
}

.popup-title {
    height: 0.45rem;
    font-size: larger;
    font-weight: bold;
    text-align: center;
}

#popup, #loginModal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5);
    animation: fadeIn 0.5s;
}

.popup-content {
    background-color: #fff;
    margin: 10% auto;
    padding: 20px;
    border-radius: 10px;
    width: 80%;
    max-width: 750px;
    min-height: 350px;
    position: relative;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    animation: slideIn 0.5s;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideIn {
    from { transform: translateY(-50px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.data-row, .header-row {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    padding: 10px;
    border-bottom: 1px solid #ddd;
}

.header-row {
    font-weight: bold;
    background-color: #f0f0f0;
}

.header-row span, .data-row span {
    padding: 0 10px;
}

.header-row .image-container, .data-row .image-container {
    width: 40%;
    display: flex;
    justify-content: flex-start;
}

.header-row .design-name, .data-row .design-name {
    flex: 1;
}
.header-row .date, .data-row .date {
    flex: 0.5;
}
.header-row .actions, .data-row .actions {
    flex: 0.5;
    text-align: center;
}

.data-row:last-child {
    border-bottom: none;
}

.image-container img {
    width: 75px;
    height: auto;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.delete-btn, .edit-icon {
    cursor: pointer;
    font-size: 24px;
    transition: color 0.3s;
}
/*
.delete-btn {
    color: red;
}*/
.delete-btn:hover {
    color: darkred;
}

.edit-icon img {
    width: 24px;
    height: auto;
    vertical-align: middle;
    cursor: pointer;
}
.edit-icon {
    width: 20px;
    margin-right: 5px;
}

.popup-close-btn {
    position: absolute;
    top: 0;
    right: 20px;
    font-size: 32px;
    cursor: pointer;
    color: red;
    transition: color 0.3s;
}
.popup-close-btn:hover {
    color: darkred;
}

.txt a {
    color: #4a90a4;
}


*{box-sizing:border-box;color:#000;font-size: .18rem;}
body,input,h1,h2,h3,h4,h5,h6,p,textarea,table,div,ul,li,select,td,th,em,span,i,button,code{margin:0;padding:0;color:inherit;line-height: inherit; font-family:sans-serif;/* font-size: inherit; */}
img{border:0;display: inline-block;max-width:100%;vertical-align: middle;height: auto;}
.fl{float:left;}
.fr{float:right;}
ul,li{ list-style:none; }
a,p,span,i,em{ text-decoration:none; color:inherit;font-size: inherit;}
pre{word-break: break-word;}
:focus{outline:none!important;border-color:inherit;}
.clearfix{*zoom: 1;}
.clearfix:before,.clearfix:after
{display: table;line-height: 0;content: "";}
.clearfix:after{clear: both;}
table{border-collapse:collapse;border-spacing:0;width:100%}
h3,h4,h5,h6{font-weight: normal;}
em,i{font-style:normal;}
input[type="button"], input[type="submit"], input[type="reset"],input[type="text"] {-webkit-appearance: none;}
input[type="button"]{border:none;}
textarea {  -webkit-appearance: none;}  
.auto{margin:0 auto;max-width: 14rem;width: 90%;}
:hover{transition: all .2s;}
.img_hover_wrap{overflow: hidden;}
.img_hover{transition: all .3s;}
.img_hover:hover{transform: scale(1.05,1.05);}
.img_traslate{transition: all .3s;}
.img_traslate:hover{transform: translateY(-10px);}
.img_rotate{transition: all .3s;}
.img_rotate:hover{transform:rotate(-360deg);}
.bold{font-weight: bold;}
.normal{font-weight: normal!important;}
.center{text-align: center!important;}
.img{/* width: 100%; */display: block;    height: auto;}
.ellipsis{overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.ele{position:relative;}
.ele:before,.ele:after{content:'';display: inline-block;vertical-align: middle;}
.ipt{display: block;/*! border:none; */line-height: 0.28rem;border-radius: .1rem;border: 1px solid #e9e9e9;font-size: 0.18rem;/*! text-align: center; */min-height: 0.45rem;padding: 0.1rem;}
.ipt_button{cursor: pointer;}
.item_scale .icon{transition: all .3s;}
.item_scale:hover .icon{transform: scale(1.08,1.08);}
.text-left{text-align: left!important;}
.text-right{text-align: right!important;}
.clamp{overflow: hidden;text-overflow: ellipsis;display: -webkit-box!important;/* display: -ms-flexbox; */-webkit-box-orient: vertical;/*-webkit-line-clamp: 3;*/}	
.clamp1{overflow: hidden;text-overflow: ellipsis;display: -webkit-box!important; -webkit-box-orient: vertical;-webkit-line-clamp: 1;}
.clamp2{overflow: hidden;text-overflow: ellipsis;display: -webkit-box!important; -webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.clamp3{overflow: hidden;text-overflow: ellipsis;display: -webkit-box!important; -webkit-box-orient: vertical;-webkit-line-clamp: 3;}
body{background: #fff;overflow-x: hidden;}

.item .imgbox{overflow: hidden;}
.item .img{transition: all 1s;display: block;}
.item:hover .imgbox .img{transform: scale(1.1,1.1);}

.zoomimg{position:relative;overflow: hidden;height: 0;display: block;}
.zoomimg .img{display: block;position:absolute;width: 100%;height: 100%;left: 0;top: 0;}

.flipx .icon{transition: all .3s;}
.flipx:hover .icon{transform:scaleX(-1);}
.scale .icon{transition: all .3s;}
.scale:hover .icon{transform: scale(1.1,1.1);}

.underline:hover{text-decoration: underline;}
label{-webkit-tap-highlight-color: rgba(255,0,0,0);} 



.flex{display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex;}
.flex-align-start{align-items: flex-start;}
.flex-align-center {-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;}
.flex-align-end{align-items: flex-end;}
.flex-pack-center {-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;}
.flex-pack-justify {-webkit-box-pack: justify;-webkit-justify-content: pace-between;-ms-flex-pack: justify;justify-content: space-between;}
.flex-pack-start{justify-content: flex-start;}
.flex-pack-end{justify-content: flex-end;}
.flex-v {-webkit-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; }
.flex-w{flex-wrap:wrap;}
.flex-1{flex:1;overflow: hidden;}
.flex-11{flex:1;}
html{font-size: 5.2083vw;}

.relative{position: relative;}

::-webkit-scrollbar{width: 5px;height: 6px;} 
::-webkit-scrollbar-track {background-color: transparent;} 
::-webkit-scrollbar-thumb { background-color:#e5e5e5;border-radius:3px;} 
::-webkit-scrollbar-button { display:none;} 
::-webkit-scrollbar-resizer {display:none;}


.c-main{color:#4a90a4!important;}

.btn{font-size: 0.18rem;color:#fff;background-color: #4a90a4;text-align: center;border:none;cursor: pointer;}
.btn:hover{background-color: #3d7a8b;}

.head{position: sticky;width: 100%;left: 0;top: 0;background-color: #fff;z-index:100;}
.head .wrap{height: 100%;display: flex;align-items: center;justify-content: space-between;}
.head .l,.head .r{display: flex;align-items: center;}

.hd-t{height: 0.44rem;background-color: #000000;}
.hd-t .wz{font-size: 0.18rem;color:#fff;}
.hd-t .wz::before{content:'';display: inline-block;vertical-align: middle;width: 0.22rem;height: 0.22rem;margin-right: 0.06rem;}
.hd-t .ico1::before{content:'\e786';font-family:'iconfont';font-size:0.18rem;color:rgba(255,255,255,.95);margin-right:0.06rem;}
.hd-t .ico2::before{background:url(../images/icon_02.png) no-repeat center;background-size:contain;}
.hd-t .x{margin:0 .15rem;width: 1px;height: 0.2rem;background-color: rgba(255,255,255,.3);}

.hd-t .lk{font-size: 0.18rem;color:rgba(255,255,255,.7);}
.hd-t a:hover{color:#fff;}
.hd-t .sign{background:url(../images/profile.png) no-repeat left center;background-size:.22rem;padding-left: 0.25rem;}


.hd-t .lang{margin-left:.15rem;position: relative;}
.hd-t .lang .font{font-size: .18rem;color:#fff;cursor: pointer;line-height: .44rem;background-color: #2f2f2f;padding:0 .08rem;}
.hd-t .lang .ic{width: .2rem;margin-right: .08rem;}
.hd-t .lang .drop{position: absolute;width: .8rem;left: 50%;margin-left:-.35rem;background-color: #fff;padding:.1rem 0;display: none;border-radius:0 0 .1rem .1rem;z-index:100;border:1px solid #efefef;}
.hd-t .lang .drop .lk{font-size: .18rem;color:#000;line-height: .36rem;padding:0 0 0 .1rem;cursor: pointer;display: block;}
.hd-t .lang .drop .lk:hover{color:#4a90a4;background-color: #f4f4f4;}
.hd-t .lang:hover .drop{display: block;}

.hd-b{height: 0.8rem;box-shadow:0 0 .1rem #e5e5e5;}
.hd-b .wrap{position: relative;}
.hd-logo{}
.hd-logo .img{height: 0.5rem;width: auto;}


.hd-nav{margin-left: 0.3rem;}
.hd-nav li{display: inline-block;vertical-align: middle;margin-right: 0.1rem;}
.hd-nav li>a{font-size: 0.18rem;line-height: 0.8rem;display: block;}
.hd-nav li.has>a::after{content:'\e7b9';font-family: 'iconfont';margin-left: 0.07rem;transform: rotate(90deg);display: inline-block;vertical-align: middle;}
.hd-nav li.cur>a,.hd-nav li:hover>a{color: #4a90a4;}
.hd-nav li:hover .drop{opacity: 1;visibility: visible;transform: scaleY(1);}


.hd-nav .drop{background-color: #fff;position: absolute;width: 10.8rem;right: 0;border-radius:0 0 .1rem .1rem;box-shadow:0 0 .13rem rgba(4,0,0,.04);border:1px solid #efefef;border-top:none;transform: scaleY(0);visibility: hidden;opacity: 0;transition: all .3s ease 0s;transform-origin: center top;}
.hd-nav .drop .dropbox{display: flex;padding:.25rem .4rem;justify-content: space-between;}
.hd-nav .drop .col{width: 23%;}
.hd-nav .drop .tit{font-size: 0.18rem;font-weight: bold;border-bottom:1px solid #efefef;line-height: 0.3rem;margin-bottom: 0.1rem;}
.hd-nav .drop .lks{}
.hd-nav .drop .lk{display: block;font-size: 0.18rem;color:#666666;line-height: 0.24rem;}
.hd-nav .drop .lk:hover{color: #4a90a4;}
.hd-nav .drop .bq{display: inline-block;vertical-align: middle;background-color: #4a90a4;border-radius:.04rem;padding:0 .06rem;color:#fff;line-height: 0.2rem;height:.2rem;margin-left: 0.05rem;}
.hd-nav .drop .lks+.tit{margin-top: 0.1rem;}


.hd-sear{width: 4.1rem;height: 0.4rem;background-color: #f4f4f4;border-radius:.26rem;display: flex;align-items: center;}
.hd-sear .ipt-txt{flex:1;overflow: hidden;padding:0 .25rem;font-size: 0.18rem;background-color: transparent;}
.hd-sear .submit{width: 0.56rem;height: 0.32rem;background-color: #4a90a4;border-radius:.26rem;display: flex;align-items: center;justify-content: center;border:none;cursor: pointer;font-size: 0.18rem;margin-right: 0.03rem;}
.hd-sear .submit::after{content:'\e802';font-family: 'iconfont';color:#fff;}

.hd-cart{margin-left: 0.15rem;}
.hd-cart .font{width: 0.4rem;height: 0.4rem;background-color: #000000;border-radius:50%;display: flex;align-items: center;justify-content: center;position: relative;font-size: 0.2rem;cursor: pointer;}
.hd-cart .font::before{content:'\e607';font-family: 'iconfont';color:#fff;}
.hd-cart .font i{width: 0.2rem;height: 0.2rem;background-color: #4a90a4;font-size: 0.12rem;color:#fff;border-radius:50%;position: absolute;top: -0.06rem;right: -0.06rem;display: flex;align-items: center;justify-content: center;}
.hd-cart .font:hover{background-color: #4a90a4;}
.hd-cart .font:hover i{background-color: #000000;}

.hd-cart-drop{position: fixed;width: 100%;height: 100%;left: 0;top: 0;z-index:110;background: rgba(0,0,0,.6);display: none;top: 0;}  /* display: none; */
.hd-cart-drop .dropbox{background-color: #fff;width: 6.4rem;position: absolute;right: 0;top: 0;bottom: 0;padding: 0.3rem;display: flex;flex-direction: column;}
.hd-cart-drop .scrollbox{flex:1;overflow-y: scroll;width: calc(100% + 0.2rem);padding-right: 0.15rem;}
.hd-cart-drop .close{width: 0.3rem;height: 0.3rem;display: flex;align-items: center;justify-content: center;font-size: 0.2rem;color:#999899;position: absolute;right: 0.3rem;top: 0.2rem;font-weight: bold;cursor: pointer;z-index:100;}
.hd-cart-drop .close::before{content:'\e668';font-family: 'iconfont';}
.hd-cart-drop .close:hover{color:#4a90a4;}

.hd-cart-drop .bt{font-size: 0.18rem;color:#4a90a4;font-weight: bold;border-bottom:1px solid #efefef;padding-bottom: 0.06rem;position: relative;margin-bottom: 0.25rem;}
.hd-cart-drop .bt::after{content:'';position: absolute;left: 0;bottom: 0;width: 0.62rem;height: 1px;background-color: #4a90a4;}

.hd-cart-drop .toptxt{font-size: 0.18rem;color:#666666;margin-bottom: 0.15rem;}

.hd-cart-drop .list{}
.hd-cart-drop .list .item{border-bottom:0.5px solid #e9e9e9;display: flex;align-items: center;line-height: 0.25rem;font-size: 0.18rem;text-align: center;padding:.2rem .05rem;}  /*margin-bottom: 0.2rem;border-radius:.2rem;*/
.hd-cart-drop .list .item>div{padding:0 .05rem;}
.hd-cart-drop .list .pic{max-width: 90%;margin:0 auto;max-height: .75rem;width: auto;}
.hd-cart-drop .list .title:hover{color:#4a90a4;}
.hd-cart-drop .list .dot{width: 0.22rem;height: 0.22rem;margin-right: 0.07rem;display: inline-block;vertical-align: middle;}
.hd-cart-drop .list .delete{width: 0.3rem;height: 0.3rem;display: flex;align-items: center;justify-content: center;font-size: 0.24rem;margin:0 auto;cursor: pointer;}
.hd-cart-drop .list .delete::before{content:'\e869';font-family: 'iconfont';}
.hd-cart-drop .list .delete:hover{color:#4a90a4;}

.hd-cart-drop .list .w1{width: 20%;}
.hd-cart-drop .list .w2{width: 25%;}
.hd-cart-drop .list .w3{width: 20%;}
.hd-cart-drop .list .w4{width: 25%;}
.hd-cart-drop .list .w5{width: 10%;}

.hd-cart-drop .list .item:hover{border-color:#ccc;}

.hd-cart-drop .xz-box{padding:.2rem 0;display: flex;}
.hd-cart-drop .xz-box .lbox{flex:1;overflow: hidden;}
.hd-cart-drop .xz-box .rbox{}
.hd-cart-drop .xz-box .fz{font-size: 0.18rem;color:#666666;margin-bottom: 0.1rem;}
.hd-cart-drop .xz-box .total{font-size: 0.22rem;color:#4a90a4;font-weight: bold;}
.hd-cart-drop .xz-box .tags{}
.hd-cart-drop .xz-box .tag{display: inline-block;vertical-align: middle;font-size: 0.18rem;color:#4a90a4;min-width: .8rem;line-height: 0.4rem;border-radius:.1rem;border:1px solid #4a90a4;margin-right: 0.15rem;text-align: center;cursor: pointer;}
.hd-cart-drop .xz-box .tag.checked{color:#fff;background-color: #4a90a4;}

.hd-cart-drop .di-box{display: flex;align-items: center;padding:.15rem 0 0;border-top:1px solid #e9e9e9;}
.hd-cart-drop .di-box .txt{font-size: 0.18rem;color:#666666;line-height: 0.22rem;flex:1;overflow: hidden;}
.hd-cart-drop .di-box .savebtn{width: 1.6rem;line-height: 0.4rem;border-radius:.1rem;font-size: 0.18rem;}

.foot{background-color: #1e1e1e;margin-top: 20px;}
.ft-t{padding:.4rem 0 0;display: flex;}
.ft-t .info{width: 26%;}
.ft-t .smlogo{height: .5rem;width: auto;}
.ft-t .social{display: flex;align-items: center;margin-top: .2rem;max-width: 2rem;flex-wrap: wrap;margin-left: -0.25rem;}
.ft-t .social .icon{width: .3rem;margin:0 0 .25rem .25rem;}
.ft-t .social img{width: 100%;}
.ft-t .social .icon:hover{opacity: .75;}


.ft-t .menus{flex:1;overflow: hidden;display: flex;justify-content: space-between;}
.ft-t .menus .col{}
.ft-t .menus .tit{font-size: .18rem;color:#fff;display: block;margin-bottom: .1rem;font-weight: bold;}
.ft-t .menus .lks{}
.ft-t .menus .lk{display: block;font-size: .18rem;color:rgba(255,255,255,.4);line-height: 2.1;}
.ft-t .menus .lk:hover{color:#fff;}

.ft-c{text-align: center;margin:.4rem 0 .15rem;font-size: 0;}
.ft-c .imgbox{display: inline-block;vertical-align: middle;margin:0 .03rem .03rem;}
.ft-c .img{height: .3rem;width: auto;}

.ft-b{text-align: center;font-size: .18rem;color:rgba(255,255,255,.4);line-height: .24rem;padding:.18rem 0;border-top:1px solid rgba(255,255,255,.1);}

.idx-top{padding:.3rem 0 .15rem;}
.idx-top .list{display: flex;flex-wrap: wrap;margin-left: -1%;}
.idx-top .list .item{width: 9%;margin:0 0 .25rem 1%;}
.idx-top .list .imgbox{border:1px solid #e9e9e9;border-radius:.16rem;height: 1.3rem;}
.idx-top .list .title{font-size: 0.18rem;line-height: 0.2rem;text-align: center;margin-top: 0.08rem;}
.idx-top .list .item:hover .imgbox{border-color:#ddd;}
.idx-top .list .item:hover .title{color:#4a90a4;}

.idx-tt{margin-bottom: 0.2rem;align-items: center;justify-content: space-between;}
.idx-tt .bt{font-size: 0.36rem;font-weight: bold;}

.idx-filter{margin-bottom: 0.6rem;}
.idx-filter .menu{border-bottom:1px solid #f7f7f7;}
.idx-filter .lk{display: inline-block;vertical-align: middle;font-size: 0.18rem;line-height: 0.3rem;font-weight: bold;margin-right: 0.55rem;padding-bottom: 0.05rem;position: relative;}
.idx-filter .lk:last-child{margin-right: 0;}
.idx-filter .lk::after{content:'';position: absolute;width: 0.65rem;height: 1px;background-color: #999999;left: 0;bottom: 0;}
.idx-filter .lk.checked,.idx-filter .lk:hover{color:#4a90a4;}
.idx-filter .lk.checked::after,.idx-filter .lk:hover::after{background-color: #4a90a4;}


.idx-trend .sort{font-size: 0.18rem;color:#666666;display: flex;align-items: center;}
.idx-trend .sort .select{width: 1.8rem;margin-left: 0.15rem;}
.idx-trend .sort .layui-form-select .layui-input{height: 0.46rem;line-height: 0.46rem;color:#333;padding:0 .2rem;border-radius:.23rem;}
.idx-trend .sort .layui-form-select .layui-edge{right: 0.15rem;}
.idx-trend .sort .layui-form-select dl{top: 0.5rem;}

.layui-form-select dl dd.layui-this{background-color: #4a90a4;}

.idx-trend{margin-bottom: 0.45rem;padding-top: 0.45rem;}
.idx-trend .list{display: flex;flex-wrap: wrap;margin-left: -1.5%;}
.idx-trend .list .item{background-color: #f4f4f4;padding: 10px;width: 23.5%;margin:0 0 1.5% 1.5%;display: flex;flex-direction: column;min-height: 0;}
.idx-trend .list .topbox{position: relative;height: 3.7rem;display: flex;justify-content: center;align-items: center;flex-shrink: 0;} 
.idx-trend .list .imgbox{background-color: #f4f4f4;padding:.1rem;position: relative;height: 100%;width: 100%;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.idx-trend .list .imgbox .img{max-width: 100%;max-height: 100%;width: auto;height: auto;object-fit: contain;display: block;}
.idx-trend .list .info{display: flex;flex-direction: column;flex: 1;margin-top: 0.1rem;min-height: 0;}
.idx-trend .list .dots{position: absolute;right: 0.15rem;top: 0.15rem;}
.idx-trend .list .dot{width: 0.2rem;height: 0.2rem;background-color: #fff;display: flex;align-items: center;justify-content: center;border:1px solid #fff;border-radius:50%;margin-bottom: 0.1rem;}
.idx-trend .list .dot i{width: 0.12rem;height: 0.12rem;display: block;border-radius:50%;}
.idx-trend .list .dot.checked{border-color:#c0c0c0;}


.idx-trend .list .font{font-size: 0.18rem;color:#4a90a4;position: absolute;width: 100%;padding:0 .1rem;left: 0;bottom: 0;line-height: 1.6;z-index:2;}
.idx-trend .list .title{font-size: 0.18rem;color:#000000;font-weight: bold;-webkit-line-clamp: 1;line-height: 1.4;margin-top: 0.1rem;}
.idx-trend .list .row1{display: flex;align-items: center;justify-content: flex-start;margin-top: 0.05rem;flex-wrap: wrap;gap: 0.05rem 0;}
.idx-trend .list .wz{display: flex;align-items: center;flex:1;overflow: hidden;min-width: 0;flex-wrap: wrap;gap: 0 0.1rem;justify-content: flex-start;}
.idx-trend .list .wz span{font-size: 0.18rem;color:#666666;line-height: 1.5;}
.idx-trend .list .wz .sizes-list{display: inline-block;max-width: 3.5rem;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;flex-shrink: 1;cursor: help;}
.idx-trend .list .wz .no-minimum{flex-shrink: 0;white-space: nowrap;}
.idx-trend .list .wz .fz.sold-count{font-size: 0.18rem;color:#666666;flex-shrink: 0;white-space: nowrap;}
.idx-trend .list .wz .x{width: 1px;height: 0.12rem;background-color: #dfdfdf;margin:0 .1rem;display: block;flex-shrink: 0;}

.idx-trend .list .open,
.idx-trend .list .startdesign {
    width: 1rem;
    height: 0.28rem;
    border: 1px solid #000;
    border-radius: .26rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.idx-trend .list .open::after,
.idx-trend .list .startdesign::after {
    font-family: 'iconfont';
    font-size: 0.2rem;
}

.idx-trend .list .open::after {
    content: '\e802';
}

.idx-trend .list .startdesign::after {
    content: '\e623';
}

.idx-trend .list .open:hover,
.idx-trend .list .startdesign:hover {
    background-color: #4a90a4;
    border-color: #4a90a4;
}

.idx-trend .list .open:hover::after,
.idx-trend .list .startdesign:hover::after {
    color: #fff;
}


.idx-trend .list .row2{font-size: 0.18rem;color:#666666;display: flex;align-items: center;margin-top: 0.04rem;}
.idx-trend .list .stars{font-size: 0;margin-right: 0.1rem;}
.idx-trend .list .star{font-size: 0.18rem;color:#c5c5c5;}
.idx-trend .list .star.this{color:#7ab0bd;}

.idx-trend .list .row3{display: flex;align-items: center;justify-content: flex-start;margin-top: auto;padding-top: 0.15rem;flex-shrink: 0;gap: 0.15rem;}
.idx-trend .list .price{display: flex;align-items: center;justify-content: flex-start;flex-shrink: 0;}
.idx-trend .list .price .anniu{width: 100%;text-align: center;box-sizing: border-box;}
.idx-trend .list .price1{font-size: 0.18rem;font-weight: bold;}
.idx-trend .list .price2{font-size: 0.18rem;color:#999999;text-decoration: line-through;margin-left: 0.15rem;}
.idx-trend .list .fz{font-size: 0.18rem;color:#666666;}
.idx-trend .list .item .title:hover{color:#4a90a4;}

.idx-trend .readmore{font-size: 0.18rem;width: 2rem;height: 0.5rem;margin:.25rem auto 0;display: flex;align-items: center;justify-content: center;border:1px solid #000;}
.idx-trend .readmore::after{content:'\e7b9';font-family: 'iconfont';font-size: 0.13rem;margin-left: 0.05rem;line-height: 1;margin-top: 0.03rem;}
.idx-trend .readmore:hover{color:#fff;background-color: #4a90a4;border-color:#4a90a4;}


.idx-xw{margin-bottom: 1rem;}
.idx-xw .list{display: flex;flex-wrap: wrap;margin-left: -1.5%;}
.idx-xw .list .item{width: 31.8%;margin:0 0 1.5% 1.5%;}
.idx-xw .list .imgbox{height: 2.35rem;}
.idx-xw .list .title{font-size: 0.18rem;font-weight: bold;line-height: 0.24rem;-webkit-line-clamp: 2;margin-top: 0.1rem;}
.idx-xw .list .fz{font-size: 0.18rem;color:#797979;margin-top: 0.04rem;}
.idx-xw .list .txt{font-size: 0.18rem;color:#666666;line-height: 0.2rem;margin-top: 0.08rem;-webkit-line-clamp: 2;}
.idx-xw .list .item:hover .title{color: #4a90a4;}

.login-sec{padding:.6rem 0;}

.login-box{width: 8rem;height: 6.3rem;background:url(../images/login_02.png) no-repeat center;background-size:100% 100%;padding:1rem 0 0;margin:0 auto;width: 90%;}
.login-box .box{text-align: center;max-width: 4.55rem;margin:0 auto;}
.login-box .smlogo{height: 0.55rem;width: auto;display: block;margin:0 auto;}
.login-box .title{font-size: 0.36rem;margin-top: 0.3rem;font-weight: bold;}
.login-box .txt{font-size: 0.18rem;line-height: 0.2rem;margin-top: 0.2rem;}
.login-box .form{margin-top: 0.25rem;display: block;}
.login-box .ipt-txt{width: 100%;font-size: 0.18rem;line-height: 0.45rem;padding:0 .2rem;border:1px solid #e9e9e9;margin-top: 0.2rem;}
.login-box .submit{line-height: 0.45rem;margin-top: 0.25rem;width: 100%;}

.login-box .other{margin-top: 0.25rem;}
.login-box .other .fz{font-size: 0.18rem;color:#313131;}
.login-box .other .icon{width: 0.34rem;display: block;margin:.1rem auto 0;}
.login-box .tips{margin-top: 0.2rem;font-size: 0.18rem;line-height: 1.6;}

.login-bot{margin-top: 0.45rem;}
.login-bot .desc{font-size: 0.18rem;text-align: center;margin-bottom: 0.2rem;}
.login-bot .list{display: flex;flex-wrap: wrap;border:1px solid #f7f7f7;}
.login-bot .list li{width: 25%;padding:.2rem .15rem;}
.login-bot .list .icon{height: 0.4rem;width: auto;display: block;margin:0 auto;}
.login-bot .list .fz{font-size: 0.18rem;margin-top: 0.15rem;text-align: center;}
.login-bot .list li:nth-child(odd){background-color: #f7f7f7;}

.inner-ban {
    position: relative;
    overflow: hidden;
    position: relative;
}

.img_full {    
    height: 100%; /* Fill the container height */   /* width: 100%; */
    object-fit: cover; /* Preserve aspect ratio and cover the container */
}

.swiper-slide .box {position: absolute;width: 100%;left: 0;top: 35%;transform: translate(0,-50%);}
.swiper-slide .title{font-size: 0.32rem;line-height: 1.2;}
.swiper-slide .txt{font-size: .18rem;margin-top: 0.05rem;}
.swiper-slide a:hover{color: #4a90a4;}

.crumb{font-size: 0.18rem;color:#333333;line-height: 0.5rem;text-transform: uppercase;}
.crumb *{font-size: inherit;}
.crumb .box{}
.crumb .box::before{content:'\e604';display: inline-block;vertical-align: middle;color:#4a90a4;font-family: 'iconfont';margin-top: -0.03rem;margin-right: 0.02rem;}
.crumb a:hover,.crumb span{color:#4a90a4;}

.help-main{padding:.3rem 0 1rem;}
.help-main .wrap{display: flex;align-items: flex-start;}
.help-l{width: 3.2rem;margin-right: 0.25rem;}
.help-r{flex:1;overflow: hidden;}


.help-side{}
.help-side .bt{font-size: 0.22rem;font-weight: bold;margin-bottom: 0.15rem;}
.help-side .box{}
.help-side .list{}
.help-side .list li{margin-bottom: 0.1rem;}
.help-side .list .tit{font-size: 0.18rem;color:#000;padding:0 0 0 .16rem;line-height: 0.4rem;position: relative;cursor: pointer;}
.help-side .list .tit::after{content:'\e6b0';position: absolute;right: .12rem;top: 50%;font-family: 'iconfont';transform: translate(0,-50%);}

.help-side .list .drop{border-bottom:1px dashed #e5e5e5;padding-bottom: 0.15rem;display: none;padding-top: 1px;}
.help-side .list .lk{display: block;font-size: 0.18rem;color:#666666;line-height: 0.36rem;padding-left: 0.3rem;position: relative;margin-top: 2px;}
.help-side .list .lk::before{content:'';position: absolute;left: 0;top: 0;height: 0;transition: all .3s;width: 2px;background-color: #4a90a4;}
.help-side .list .lk.this,.help-side .list .lk:hover{color:#4a90a4;background-color: #e8f2f5;}
.help-side .list .lk.this::before,.help-side .list .lk:hover::before{height: 100%;}

.help-side .list li.cur .tit,.help-side .list li:hover .tit{color:#fff;background-color: #4a90a4;}
.help-side .list li.cur .tit::after{content:'\eaf5';}
.help-side .list li.cur .drop{display: block;}


.help-tmp{display: flex;align-items: flex-start;margin-bottom: 0.1rem;}
.help-tmp .wz{line-height: 0.3rem;font-size: 0.18rem;}
.help-tmp .wz::before{content:'\e6eb';display: inline-block;vertical-align: middle;margin-right: 0.05rem;font-family: 'iconfont';color: #4a90a4;margin-top: -0.02rem;font-size: 0.18rem;}

.help-tmp .lks{flex:1;overflow: hidden;font-size: 0;}
.help-tmp .lk{display: inline-block;vertical-align: middle;font-size: 0.18rem;color:#4a90a4;line-height: 0.28rem;border:1px solid #4a90a4;padding:0 .1rem;margin:0 0 .1rem .1rem;}
.help-tmp .lk::after{content:'\e630';display: inline-block;vertical-align: middle;margin-left: 0.05rem;font-family: 'iconfont';}
.help-tmp .lk:hover{color:#fff;background-color: #4a90a4;}

.help-pics{padding: 0.2rem;border:1px solid #e5e5e5;}
.help-pics .list{margin-left: -2%;margin-top: -2%;}
.help-pics .item{background-color: #f4f4f4;display: block;float: left;padding:.1rem;width: 23%;margin:2% 0 0 2%;height: 2.55rem;}
.help-pics .imgbox{max-width: 2rem;height: 2rem;display: block;margin:0 auto;}
.help-pics .imgbox .img{object-fit: contain;width: 100%;height: 100%;max-width: 100%;max-height: 100%;}
.help-pics .title{font-size: 0.18rem;text-align: center;-webkit-line-clamp: 1;margin-top: 0.1rem;}

.help-pics .item:first-child{width: 48%;height: 5.3rem;}
.help-pics .item:first-child .imgbox{max-width: 4rem;height: 4rem;margin:.4rem auto .45rem;}
.help-pics .item:hover .title{color: #4a90a4;}

.help-faq{margin-top: 0.2rem;padding: 0.15rem;background-color: #f7f7f7;}
.help-faq .mod{margin-bottom: 0.15rem;}
.help-faq .title{font-size: 0.24rem;line-height: 1.4;}
.help-faq .txt{font-size: 0.18rem;color:#666666;line-height: 1.4;}
.help-faq .row{margin-top: 0.1rem;}
.help-faq .smtit{font-size: 0.2rem;line-height: 1.4;}
.help-faq .smtit::before{content:'';display: inline-block;vertical-align: middle;width: 0.04rem;height: 0.04rem;background-color: #000;border-radius:50%;margin-right: 0.1rem;margin-left: 0.1rem;}

.help-faq .t-tit{font-size: 0.18rem;line-height: 1.4;cursor: pointer;position: relative;padding-right: 0.6rem;}
.help-faq .t-tit::after{content:'\e6b0';position: absolute;right: 0;top: 50%;font-family: 'iconfont';transform: translate(0,-50%);}
.help-faq .hang{margin-top: 0.1rem;}
.help-faq .hang .txt{padding-left: 0.1rem;margin-top: 0.05rem;}
.help-faq .hang .drop{display: none;}
.help-faq .hang.cur .drop{display: block;}
.help-faq .hang.cur .t-tit::after{content:'\eaf5';}
.help-faq .hang:hover .t-tit{color: #4a90a4;}

.cp-top{padding:.15rem 0 .5rem;}
.cp-top .detail{display: flex;align-items: flex-start;}
.cp-top .lbox{width: 5.2rem;margin-right: 0.6rem;display: flex;align-items: flex-start;}
.cp-top .rbox{flex:1;overflow: hidden;}

.cp-top .slide2{flex:1;overflow: hidden;position: relative;}
.cp-top .slide2 .item{height: 5.3rem;display: flex;align-items: center;justify-content: center;}
.cp-top .slide2 .item .img{max-width: 90%;max-height: 90%;}

.cp-top .slide1 .swiper-slide-thumb-active .item{border-color:#4a90a4;}

.cp-top .arrs{}
.cp-top .arrs .arr{width: 0.4rem;height: 0.4rem;background:url(../images/cp_03.png) no-repeat center;background-size:contain;position: absolute;z-index: 80;cursor: pointer;}
.cp-top .arrs .arr:hover{background-image:url(../images/cp_03-1.png)}

.cp-top .slide1 .arrs .arr{width: 0.26rem;height: 0.26rem;left: 50%;margin-left: -0.13rem;}
.cp-top .slide1 .arrs .prev{transform: rotate(90deg);top: -0.1rem;}
.cp-top .slide1 .arrs .next{transform: rotate(-90deg);bottom: -0.1rem;}


.cp-top .slide2 .arrs .arr{top: 50%;margin-top: -0.2rem;}
.cp-top .slide2 .arrs .prev{left: 0.1rem;}
.cp-top .slide2 .arrs .next{transform: rotate(180deg);right: 0.1rem;}

#galpop-close{right: -20px;}


.cp-top .title{font-size: 0.30rem;font-weight: bold;line-height: 1.4;}
.cp-top .ys{font-size: 0.18rem;color:#666666;}
.cp-top .sm{margin-top: 0.15rem;display: flex;align-items: center;margin-bottom: 0.2rem;font-size: 0.18rem;color:#4a90a4;}
.cp-top .sm .stars{margin-right: 0.15rem;font-size: 0;}
.cp-top .sm .star{color:#d1d3d6;font-size: 0.18rem;}
.cp-top .sm .star.this{color:#7ab0bd;}

.cp-top .row{display: flex;align-items: center;margin-bottom: 0.15rem;}
.cp-top .row .smtit{font-size: 0.18rem;font-weight: bold;min-width: 1.75rem;}
.cp-top .row .smb{flex:1;overflow: hidden;font-size: 0.18rem;color:#666666;display: flex;align-items: center;}
.cp-top .row .k{min-width: 0.32rem;height: 0.32rem;border:1px solid #e9e9e9;display: block;margin-right: 0.15rem;}

.cp-top .row .smc{min-width: 1.3rem;overflow: hidden;font-size: 0.18rem;color:#4a90a4;display: flex;align-items: center;font-weight: bold;}

.cp-top .size .opts{}
.cp-top .size .opt{padding: 0 0.08rem;display: inline-block;vertical-align: middle;min-width: 0.32rem;height: 0.32rem;border:1px solid #e9e9e9;cursor: pointer;margin:0 .1rem 0 0;font-size: 0.18rem;color:#666666;text-align: center;line-height: 0.32rem;}
.cp-top .size .opt.checked{color:#fff;background-color: #4a90a4;border-color:#4a90a4;}


.colors .opts{font-size: 0;}
.colors .opt{display: inline-block;vertical-align: middle;min-width: 0.38rem;height: 0.38rem;border:1px solid #e9e9e9;cursor: pointer;margin:0 0 2px 2px;text-align: center;line-height: 0.38rem;position: relative;}
.colors .opt::after{content:'\e786';position: absolute;width: 100%;height: 100%;left: 0;top: 0;display: flex;align-items: center;justify-content: center;color:#4a90a4;font-family: 'iconfont';font-size: 0.18rem;display: none;}
.colors .opt.checked::after{display: block;}

.cp-top .anniu{margin-top: 0.2rem;width: 2.35rem;line-height: 0.5rem;}

.cp-top .list{display: flex;justify-content: space-between;flex-wrap: wrap;margin-top: 0.5rem;}
.cp-top .list li{padding:.15rem .15rem;background-color: #f7f7f7;width: 23.5%;text-align: center;}
.cp-top .list .icon{height: 0.6rem;width: auto;display: block;margin:0 auto;}
.cp-top .list .fz1{font-size: 0.18rem;font-weight: bold;margin-top: 0.1rem;}
.cp-top .list .fz2{font-size: 0.18rem;color:#666666;margin-top: 0.05rem;}

.cp-top .tips{margin-top: 0.55rem;}
.cp-top .tips .smtit{font-size: 0.18rem;font-weight: bold;margin-bottom: 0.05rem;}
.cp-top .tips .txt{font-size: 0.18rem;color:#666666;line-height: 1.4;margin-bottom: 0.15rem;max-width: 6rem;}

.cp-deli{padding:.55rem 0;}
.cp-deli .mod{margin-bottom: 0.2rem;}
.cp-deli .t-tit{font-size: 0.18rem;font-weight: bold;margin-bottom: 0.06rem;}
.cp-deli .list{display: flex;justify-content: space-between;margin-top: 0.15rem;}
.cp-deli .list li{width: 31.3%;padding:.35rem .2rem;display: flex;align-items: center;justify-content: center;background-color: #f7f7f7;margin-bottom: .1rem;}
.cp-deli .list .icon{height: 0.8rem;width: auto;margin-right: 0.15rem;}
.cp-deli li:hover .icon {transform: scale(1.2);transition: transform 0.3s ease;}
.cp-deli .list .info{text-align: left;}
.cp-deli .list .title{font-size: 0.18rem;}
.cp-deli .list .font{font-size: 0.18rem;color:#666666;}

.cp-deli .txt{font-size: 0.18rem;color:#666666;line-height: 0.3rem;}
.cp-deli .txt p::before{display: inline-block;vertical-align: middle;width: 0.08rem;height: 0.08rem;background-color: #000;margin-right: 0.12rem;border-radius:50%;}
.cp-deli .anniu{width: 3.1rem;line-height: 0.5rem;}


.cp-rela{padding:.5rem 0;}
.cp-rela .mod{padding-bottom: 0.3rem;}
.cp-rela .mod:last-child{margin-bottom: 0;}
.cp-rela .list{display: flex;flex-wrap: wrap;justify-content: space-between;}
.cp-rela .list .item{width: 1.9rem;margin-bottom: 0.3rem;}
.cp-rela .list .imgbox{height: 1.9rem;}

.step-body{height: 100vh;display: flex;flex-direction: column;background:url(../images/step_04.jpg) no-repeat center;background-size:cover;}

.step-bar{height: 0.6rem;background-color: #fff;padding:0 .1rem;border-bottom:1px solid #ececeb;display: flex;align-items: center;justify-content: space-between;}
.step-bar .l,.step-bar .r{display: flex;align-items: center;}
.step-bar .menu{display: flex;align-items: center;}
.step-bar .menu .x{width: 0.65rem;height: 1px;border-top:1px dashed #efefef;}
.step-bar .menu .lk{display: inline-block;vertical-align: middle;background-color: #f4f4f4;border-radius:.19rem;padding: 0.03rem .2rem 0.03rem 0.03rem;line-height: 0.32rem;}
.step-bar .menu .ico{width: 0.32rem;margin-right: 0.1rem;background-color: #999999;border-radius:50%;}
.step-bar .menu .lk:hover,.step-bar .menu .lk.cur{color:#4a90a4;}
.step-bar .menu .lk:hover .ico,.step-bar .menu .lk.cur .ico{background-color: #4a90a4;}


.step-bar .ann{font-size: 0.18rem;color:#999899;line-height: 0.4rem;display: inline-block;vertical-align: middle;padding:0 .18rem;background-color: #f4f4f4;border-radius:.2rem;margin-left: 0.2rem;}
.step-bar .ann i{margin-right: 0.06rem;}
.step-bar .ann.this{color:#fff;background-color: #4a90a4;}
.step-bar .ann:hover{color:#fff;background-color: #4a90a4;}

.step-sec{
    display: flex !important;
    flex-direction: row !important;
    gap: 0.2rem;
    align-items: stretch;
    width: 100%;
}
.step-sec .lbox{display: flex;align-items: center;justify-content: center;flex:1;overflow: hidden;}
.step-sec .rbox{width: 6.3rem;background-color: #fff;margin:.3rem 0;}
.step-sec .pic{max-width: 7.6rem;display: block;width: 90%;}


.step-cs{width: 6.3rem;padding:.25rem .4rem .3rem .3rem;border-radius:.1rem;display: flex;flex-direction: column;position: relative;}
.step-cs .bt{font-size: 0.18rem;color:#4a90a4;font-weight: bold;padding-bottom: 0.05rem;position: relative;margin-bottom: 0.25rem;}
.step-cs .bt::after{content:'';position: absolute;left: 0;bottom: 0;height: 1px;width: 0.66rem;background-color: #4a90a4;}
.step-cs .nextstep{font-size: 0.18rem;max-width: 3.3rem;width: 100%;height: 0.4rem;display: flex;align-items: center;justify-content: center;margin:.3rem auto 0;border-radius:.1rem;}
.step-cs .scroll{flex:1;overflow-y:scroll;width:calc(100% + 0.3rem);padding-right: 0.3rem;}
.step-cs .close{width: 0.3rem;height: 0.3rem;display: flex;align-items: center;justify-content: center;position: absolute;right: 0.15rem;top: 0.15rem;font-size: 0.18rem;cursor: pointer;font-weight: bold;}
.step-cs .close::after{content:'\e668';font-family: 'iconfont';}
.step-cs .close:hover{color: #4a90a4;}

.step2-xz{display: flex;align-items: flex-start;}
.step2-xz .arrow{line-height: 0.3rem;font-size: 0.18rem;color:#999;margin-right: 0.2rem;transform: rotate(180deg);}
.step2-xz .arrow::before{content:'\e630';font-family: 'iconfont';}
.step2-xz .info{flex:1;overflow: hidden;}
.step2-xz .title{font-size: 0.24rem;font-weight: bold;line-height: 0.3rem;}
.step2-xz .txt{font-size: 0.18rem;color:#666666;line-height: 0.2rem;margin-top: 0.06rem;}

.step2-cp{padding:.2rem .2rem .2rem 0;border:1px solid #e9e9e9;border-radius:.1rem;display: flex;align-items: flex-start;margin-top: 0.2rem;}
.step2-cp .arrow{width: 0.4rem;height: 0.9rem;display: flex;font-size: 0.18rem;align-items: center;justify-content: center;}
.step2-cp .arrow::before{content:'\e7b9';font-family: 'iconfont';transform: rotate(90deg);}
.step2-cp .list{flex:1;overflow: hidden;}


.step2-cp .row{margin-bottom: 0.2rem;display: flex;align-items: center;}
.step2-cp .row:last-child{margin-bottom: 0;}
.step2-cp .imgbox{width: 0.9rem;height: 0.9rem;margin-right: 0.15rem;border:1px solid #e9e9e9;border-radius:.16rem;display: block;overflow: hidden;}
.step2-cp .info{flex:1;overflow: hidden;}
.step2-cp .tt{display: flex;align-items: center;}
.step2-cp .title{font-size: 0.18rem;-webkit-line-clamp: 1;flex:1;overflow: hidden;}
.step2-cp .wz{font-size: 0.18rem;margin-left: 0.2rem;}
.step2-cp .fz{font-size: 0.18rem;margin-top: 0.03rem;}
.step2-cp .row:hover .title{color:#4a90a4;}

.step2-size{}
.step2-size .row{margin-top: 0.2rem;}
.step2-size .tit{font-size: 0.18rem;margin-bottom: 0.15rem;margin-left: 0.3rem;font-weight: bold;}
.step2-size .list{display: flex;flex-wrap: wrap;}
.step2-size .list li{text-align: center;width: 13%;}
.step2-size .list .fz{font-size: 0.18rem;margin-bottom: 0.05rem;}
.step2-size .list .num{width: 0.6rem;border-radius:.1rem;border:1px solid #e9e9e9;font-size: 0.18rem;margin:0 auto;text-align: center;}

.step3-tip{font-size: 0.18rem;color:#4a90a4;line-height: 0.2rem;padding:.23rem .2rem;background-color: #d4e8ec;border-radius:.1rem;margin-top: 0.2rem;}

.initial{
    position: relative;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    max-width: 60%;
    width: auto;
}

.step-side {
    width: 7.5rem;
    flex-shrink: 0;
    position: relative;
    min-height: 5rem;
    padding: 0.2rem;
    background-color: #fff;
    border-radius: 0.1rem;
    box-shadow: 0 0 .13rem rgba(0,0,0,.04);
    display: flex;
    flex-direction: column;
    overflow: visible;
    align-self: flex-start;
}

.step-side > .step1-side {
    overflow: visible;
}

.step1-top {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 0.08rem;
    margin-bottom: 0.2rem;
    padding-bottom: 0.2rem;
    border-bottom: 1px solid #efefef;
}

.step1-side {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    width: 100%;
    overflow: visible;
    align-items: stretch;
    min-height: 5.5rem;
}

/* 标签栏 - 横向排列所有图标按钮 */
.step1-tabs-wrapper {
    display: flex;
    flex-direction: row;
    gap: 0.1rem;
    margin-bottom: 0.2rem;
    flex-wrap: wrap;
    border-bottom: 2px solid #efefef;
    padding-bottom: 0.1rem;
}

/* 内容区域 - 显示当前激活的内容 */
.step1-content-wrapper {
    position: relative;
    flex: 1;
    min-height: 5rem;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.btn2 {
    padding: 0 0.08rem;
    vertical-align: middle;
    height: 0.32rem;
    margin: 0.1rem;
}

/* Mod 容器 - 在标签栏中横向排列 */
.step1-tabs-wrapper .mod{
    position: relative;
    display: inline-flex;
    flex-direction: column;
    margin-right: 0.1rem;
    margin-bottom: 0;
}

/* 标签页按钮 - 横向排列 */
.step1-tabs-wrapper .bigicon{
    height: 0.7rem;
    min-width: 0.7rem;
    background-color: #f5f6fa;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    border-radius: 0.08rem 0.08rem 0 0;
    transition: all 0.3s;
    box-sizing: border-box;
    flex-shrink: 0;
    padding: 0 0.15rem;
    border-bottom: 2px solid transparent;
}
.step1-tabs-wrapper .bigicon:hover{
    background-color: #e8e9ed;
}
.step1-tabs-wrapper .bigicon::before{
    display: none;
}
.step1-tabs-wrapper .bigicon .ico{
    width: 0.32rem;
    display: block;
}
.step1-tabs-wrapper .bigicon .ico-h{
    display: none;
}

/* 激活状态的标签按钮 */
.step1-tabs-wrapper .mod.cur .bigicon{
    background-color: #fff;
    border-bottom-color: #4a90a4;
    box-shadow: 0 -2px 4px rgba(255, 112, 0, 0.1);
}
.step1-tabs-wrapper .mod.cur .ico-h{
    display: block;
}
.step1-tabs-wrapper .mod.cur .ico-s{
    display: none;
}

/* 内容面板 - 在下方显示，根据内容自适应高度 */
.step1-content-wrapper .drop{
    background-color: #fff;
    padding: 0.2rem;
    position: relative;
    width: 100%;
    min-height: 5rem;
    max-height: calc(100vh - 3rem);
    overflow-y: auto;
    overflow-x: hidden;
    box-sizing: border-box;
    border-radius: 0 0 0.1rem 0.1rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    display: none;
}
.step1-content-wrapper .drop[style*="display: inline"],
.step1-content-wrapper .drop[style*="display:inline"]{
    display: block !important;
}
.step1-side .drop::-webkit-scrollbar {
    width: 0.06rem;
}
.step1-side .drop::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 0.03rem;
}
.step1-side .drop::-webkit-scrollbar-thumb {
    background: #4a90a4;
    border-radius: 0.03rem;
}
.step1-side .drop::-webkit-scrollbar-thumb:hover {
    background: #3d7a8b;
}
.step1-side .bt{
    font-size: 0.18rem;
    color:#4a90a4;
    font-weight: bold;
    padding-bottom: 0.1rem;
    border-bottom: 2px solid #4a90a4;
    margin-bottom: 0.2rem;
    position: relative;
}
.step1-side .drop h1.bt{
    font-size: 0.2rem;
    margin-bottom: 0.25rem;
}
.step1-side .drop h5.bt{
    font-size: 0.18rem;
    margin-bottom: 0.2rem;
}


.step1-skin .toptxt{margin-bottom: 0.2rem;}
.step1-skin .toptxt .title{font-size: 0.24rem;font-weight: bold;}
.step1-skin .toptxt .txt{font-size: 0.18rem;color:#666666;margin-top: 0.06rem;}

.step1-skin .classic{border:1px solid #e9e9e9;border-radius:.1rem;padding:.12rem .2rem .15rem;}
.step1-skin .classic .tt{display: flex;align-items: center;justify-content: space-between;margin-bottom: 0.1rem;}
.step1-skin .classic .font{font-size: 0.18rem;color:#333333;}
.step1-skin .classic .font::after{content:'\e7b9';font-family: 'iconfont';margin-left: 0.05rem;font-size: 0.18rem;transform: rotate(90deg);display: inline-block;vertical-align: middle;}
.step1-skin .classic .tt .ic{width: 0.28rem;height: 0.28rem;}
.step1-skin .classic .list{display: flex;flex-wrap: wrap;margin:-3% 0 0 -3%;}
.step1-skin .classic .list .item{width: 30.3%;margin:3% 0 0 3%;display: block;}
.step1-skin .classic .list .imgbox{height: 0.9rem;border:1px solid #e9e9e9;border-radius:.16rem;}
.step1-skin .classic .list .title{font-size: 0.18rem;text-align: center;margin-top: 0.06rem;}
.step1-skin .classic .list .item:hover .imgbox{border-color:#4a90a4;}

.drop .addbtn{
    font-size: 0.18rem;
    color: #ffffff;
    border: 1px solid #4a90a4;
    border-radius: 0.1rem;
    height: 35px;
    align-items: center;
    justify-content: center;
    margin-top: 0.2rem;
    background-color: #4a90a4;
    width: 100%;
    cursor: pointer;
}
.drop .addbtn::before{content:'\e6b0';margin-right: 0.05rem;font-family: 'iconfont';font-size: 0.18rem;}
.drop .addbtn:hover{
    background-color: #3d7a8b;
    border-color: #3d7a8b;
}

.step1-slide{position: absolute;left: 5.15rem;top: 0.3rem;border-radius:.1rem;background-color: rgba(255,255,255,.6);box-shadow:0 0 .13rem rgba(0,0,0,.04);width: 7rem;padding:.2rem .3rem;}
.step1-slide .item{display: block;}
.step1-slide .imgbox{height: 0.95rem;border:1px solid #e9e9e9;border-radius:.16rem;width:.95rem;overflow: hidden;}
.step1-slide .title{font-size: 0.18rem;text-align: center;margin-top: 0.06rem;text-align: center;-webkit-line-clamp: 1;}
.step1-slide .item:hover .imgbox{border-color:#4a90a4;}

.step1-slide .swiper-container{position: static;}
.step1-slide .swiper-button{width: 0.32rem;height: 0.32rem;background:url(../images/cp_03-2.png) no-repeat center;background-size:contain;margin-top: -0.16rem;}
.step1-slide .swiper-button-prev{left: -0.16rem;}
.step1-slide .swiper-button-next{right: -0.16rem;transform: rotate(180deg);}
.step1-slide .swiper-button:hover{background-image:url(../images/cp_03-1.png);}



.step1-cart{position: absolute;right: 0.2rem;bottom: 0.3rem;background-color: #fff;width: 3.9rem;border-radius:0 .1rem .1rem 0;padding:.18rem .2rem;box-shadow:0 0 .13rem rgba(0,0,0,.04);}
.step1-cart .title{font-size: 0.18rem;color:#000000;font-weight: bold;-webkit-line-clamp: 1;line-height: 1.4;margin-top: 0.1rem;}
.step1-cart .row1{display: flex;align-items: center;margin-top: 0.05rem;}
.step1-cart .wz{display: flex;align-items: center;flex:1;overflow: hidden;}
.step1-cart .wz span{font-size: 0.18rem;color:#666666;}
.step1-cart .wz .x{width: 1px;height: 0.12rem;background-color: #dfdfdf;margin:0 .1rem;display: block;}
.step1-cart .addtocart{width: 0.5rem;height: 0.24rem;border:1px solid #000;border-radius:.26rem;margin-left: 0.3rem;display: block;cursor: pointer;display: flex;align-items: center;justify-content: center;}
.step1-cart .addtocart::after{content:'\e607';font-family: 'iconfont';font-size: 0.2rem;}

.step1-cart .row2{font-size: 0.18rem;color:#666666;display: flex;align-items: center;margin-top: 0.04rem;}
.step1-cart .stars{font-size: 0;margin-right: 0.1rem;}
.step1-cart .star{font-size: 0.18rem;color:#c5c5c5;}
.step1-cart .star.this{color:#7ab0bd;}

.step1-cart .row3{display: flex;align-items: center;justify-content: space-between;margin-top: 0.08rem;}
.step1-cart .price{display: flex;align-items: center;justify-content: space-between;}
.step1-cart .price1{font-size: 0.18rem;font-weight: bold;}
.step1-cart .price2{font-size: 0.18rem;color:#999999;text-decoration: line-through;margin-left: 0.15rem;}
.step1-cart .fz{font-size: 0.18rem;color:#666666;}
.step1-cart .title:hover{color:#4a90a4;}
.step1-cart .addtocart:hover{background-color: #4a90a4;border-color:#4a90a4;}
.step1-cart .addtocart:hover::after{color:#fff;}


.step1-yf{width: 0.6rem;position: absolute;right: 0.1rem;top: 0.1rem;border-radius:.1rem;box-shadow:0 0 .13rem rgba(0,0,0,.04);overflow: hidden;z-index: 10;}
.step1-yf .item:hover .img{transform: scale(1.08,1.08);}

.step-cz{width: 1.2rem;position: absolute;right: 0.1rem;top: 5rem;}
.step1-top .lk {
  display: flex;
  align-items: center;    
  justify-content: center;
  font-size: 0.18rem;
  height: 0.32rem;
  border-radius: 0.06rem;
  padding: 0 0.12rem;
  color: #fff;
  background-color: #4a90a4;
  border: 1px solid #4a90a4;
  cursor: pointer;
  transition: all 0.3s;
  white-space: nowrap;
  flex: 0 0 auto;
}
.step1-top .lk.home{
  background-color: #666;
  border-color: #666;
}
.step1-top .lk.home:hover{
  background-color: #555;
  border-color: #555;
}
.step1-top .lk:hover{
  color:#fff;
  background-color: #3d7a8b;
  border-color:#3d7a8b;
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* .cart-main{padding:.4rem 0 .9rem;} */
.cart-main .wrap{display: flex;}
.cart-l{flex:1;}
.cart-r{width: 4.2rem;margin-left: 0.2rem;}


.cart-ad{padding:.22rem 0;background-repeat:no-repeat;background-position:left center;background-size:cover;margin-bottom: 0.2rem;position: relative;}
.cart-ad .info{text-align: center;max-width: 80%;margin-left: 1rem;}
.cart-ad .title{font-size: 0.24rem;font-weight: bold;}
.cart-ad .txt{font-size: 0.18rem;margin-top: 0.05rem;}
.cart-ad .arrow{width: 1rem;height: 1rem;background:url(../images/shopping_cart.png) no-repeat;position: absolute;top: 50%;margin-top: -0.23rem;left: 0.2rem;}  /* right: 0.1rem; */

.cart-sec{padding: 0.2rem;border:1px solid #e5e5e5;margin-bottom: 0.2rem;}
.cart-sec .top-tt{display: flex;align-items: center;margin-bottom: 0.15rem;}  /* justify-content: space-between; */
.cart-sec .top-tt .bt{font-size: 0.24rem;font-weight: bold;}
.cart-sec .top-tt .lks{font-size: 0.18rem;}
.cart-sec .top-tt .lk{color:#4a90a4;}
.cart-sec .top-tt .lk:hover{text-decoration: underline;}



.cart-table{}
.cart-table *{font-size: 0.18rem;}
.cart-table .thead{padding:.2rem .15rem;background-color: #f7f7f7;line-height: 0.2rem;font-weight: bold;display: flex;align-items: center;}

.cart-table .tr{margin-top: 0.1rem;margin-bottom: 0.1rem;border: 1px solid #e9e9e9;}
.cart-table .box{display: flex;align-items: center;padding:.23rem .15rem;border-bottom:0.5px solid #e9e9e9;}
.cart-table .dot{width: 0.2rem;height: 0.2rem;margin-right: 0.06rem;display: inline-block;vertical-align: middle;}
.cart-table .box>div{padding:0 .05rem;}
.cart-table .picbox{display: flex;align-items: center;}
.cart-table .picbox .imgbox{flex:1;overflow: hidden;}
.cart-table .pic{max-width: 100%;}
.cart-table .editicon{width: 0.24rem;height: 0.24rem;display: inline-block;vertical-align: middle;cursor: pointer;}
.cart-table .editicon::before{content:'\e623';font-family: 'iconfont';}
.cart-table .editicon:hover{color:#4a90a4;}

.addcolor{display: flex;align-items: center;margin-top: 0.1rem;cursor: pointer;}
.addcolor::before{width: 0.16rem;height: 0.16rem;background:url(../images/step_12.png) no-repeat center;background-size:contain;margin-right: 0.05rem;content:'';}
.addcolor:hover{text-decoration: underline;color:#4a90a4;}

.cart-table .sel{width: 0.2rem;height: 0.2rem;border:1px solid #e4e4e4;margin-right: 0.1rem;display: inline-block;vertical-align: middle;appearance: none;-webkit-appearance: none;}
.cart-table .sel:checked{background:url(../images/icon_05.png) no-repeat center;background-size:cover;border:none;}

.cart-table .bot{display: flex;justify-content: flex-end;margin: 0.2rem 0.3rem;}

.cart-table .delete::before{content:'\e869';font-family: 'iconfont';}
.cart-table .delete:hover{color:#4a90a4;}

.cart-table .edit::before{content:'\e623';font-family: 'iconfont';}
.cart-table .edit:hover{color:#4a90a4;}

.row3 .edit::before{content:'\e623';font-family: 'iconfont';}
.row3 .edit:hover{color:#4a90a4;}

.actions{display: flex;}
.actions .edit::before{content:'\e623';font-family: 'iconfont';}
.actions .edit:hover{color:#4a90a4;}

.actions .delete::before{content:'\e869';font-family: 'iconfont';}
.actions .delete:hover{color:#4a90a4;}

.icon{width: 0.3rem;height: 0.3rem;display: flex;align-items: center;justify-content: center;cursor: pointer;font-size: 0.2rem;}

.addcar{font-size: 0.18rem;width: 1.45rem;line-height: 0.36rem;margin-left:0.1rem}

.cart-table .w1{width: 25%;}
.cart-table .w2{flex:1;text-align: center;}
.cart-table .w3{width: 15%;text-align: center;}
.cart-table .w4{width: 10%;text-align: center;}
.cart-table .w5{width: 15%;text-align: center;}
.cart-table .w6{width: 15%;text-align: center;}
.cart-table .w7{width: 10%;text-align: center;}
.cart-table .w8{width: 5%;text-align: center;}

.cart-table .xs{display: none;}

.numbox{display: flex;align-items: center;border:1px solid #efefef;background-color: #fff;max-width: 1rem;overflow: hidden;margin:0 auto;}
.numbox .sub,.numbox .add{width: .3rem;height: .3rem;background-color: #ededed;display: flex;align-items: center;justify-content: center;}
.numbox .add::before{content:'\e6b0';font-family: 'iconfont';}
.numbox .sub::before{content:'\eaf5';font-family: 'iconfont';}
.numbox .sub:hover,.numbox .add:hover{background-color: #4a90a4;color:#fff;}
.numbox .input{flex:1;overflow: hidden;text-align: center;background-color: #fff;width: 40%;}
.numbox .sub.dark,.numbox .add.dark{opacity: .4;}


.cart-mod{border:1px solid #e9e9e9;padding:0 .1rem;margin-bottom: 0.2rem;}
.cart-mod .t-tit{font-size: 0.24rem;font-weight: bold;height: 0.8rem;display: flex;align-items: center;border-bottom:1px solid #e9e9e9;}
.cart-mod .t-tit .icon{width: 0.32rem;margin-right: 0.15rem;}


.cart-opts{}
.cart-opts .opts{padding: 0.1rem;}
.cart-opts .opts .opt{font-size: 0.18rem;padding:.1rem 0;/*! border-top:1px solid #e9e9e9; */display: flex;align-items: center;line-height: 1.4;}
.cart-opts .opts .sel{width: 0.2rem;height: 0.2rem;border:1px solid #e4e4e4;margin-right: 0.15rem;display: inline-block;vertical-align: middle;appearance: none;-webkit-appearance: none;}
.cart-opts .opts .sel:checked{background:url(../images/icon_05.png) no-repeat center;background-size:cover;border:none;}
.cart-opts .opts .info{flex:1;overflow: hidden;}
.cart-opts .opts .fz1{}
.cart-opts .opts .fz2{color:#999999;}
.cart-opts .opts .wz{margin-left: 0.3rem;}
.cart-opts .opts .opt:first-child{border-top:0;}

.cart-opts .showmore{font-size: 0.18rem;text-align: center;line-height: .3rem;display: block;cursor: pointer;margin: .05rem 0 0.15rem;}
.cart-opts .showmore:hover{color: #4a90a4;}

.cart-summ .txt{padding:.15rem 0;border-bottom:1px solid #e9e9e9;font-size: 0.18rem;line-height: 1.5;}
.cart-summ .txt p{display: flex;justify-content: space-between;padding:.03rem 0;min-height: 1em;}
.cart-summ .txt:last-child{border-bottom:0;}

.cart-di{}
.cart-di .wz{font-size: 0.18rem;text-align: center;margin:.17rem 0;}

.cp-top .slide1{width: 0.8rem;margin-right: 0.25rem;position: relative;}

.cp-top .slide1 .item{/* height: 0.8rem; */border:1px solid #e9e9e9;border-radius:.16rem;overflow: hidden;}


@media screen and (min-width: 1200px) {
  .cp-top .slide1 .swiper-container{height: 5.3rem;}
  
  /* 确保大屏幕时左右布局 */
  .step-sec{
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
  }
  .initial{
    flex: 1;
    max-width: 60%;
    width: auto;
  }
  .step-side{
    width: 7.5rem;
    flex-shrink: 0;
    flex-grow: 0;
  }
}


/* 确保 1000px 以上都是左右布局 */
@media screen and (min-width: 1000px) {
  .step-sec{
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
  }
  .initial{
    flex: 1;
    max-width: 60%;
    width: auto;
  }
  .step-side{
    width: 7.5rem;
    flex-shrink: 0;
    flex-grow: 0;
  }
}

@media screen and (min-width:992px) and (max-width:1199px){

    .step-side{/* width: 4.5rem; */}
    .step-side .drop{/* width: 3.7rem; */}
    
	.auto{width: 10.5rem;}
	html{/* font-size: 5.5rem!important; */}
	
	.hd-sear{width: 2.2rem;}
	.hd-sear .submit{width: 0.4rem;}
	
	.hd-nav .drop{width: 100%;}
	
	.ft-t .info{width: 20%;}

	.idx-top .list .item{width: 15.666%;}
	
	.idx-filter .lk{margin-right: 0.3rem;}

	.help-pics .item{height: 2.59rem;}

	.cp-top .lbox{flex-direction: column-reverse;width: 4.8rem;margin-right: 0.4rem;}
	.cp-top .slide1{width: 100%;}
	.cp-top .slide1 .arrs{display: none;}
	
	.cp-top .slide2{flex:initial;width: 100%;}
	
	.colors .opt{min-width: 0.3rem;height: 0.3rem;}
	
	.cp-top .list .icon{height: 0.4rem;}
	
	.cp-top .tips{margin-top: 0.3rem;}

	.step-bar{padding:0 .2rem;}
	.step-bar .menu .x{display: none;}
	.step-bar .menu .lk{margin-right: 0.1rem;}
	.step-bar .ann{margin-left: 0.1rem;}
	
	
	.step-sec .rbox{width: 4.6rem;}
	
	.step2-cp .tt{display: block;}
	.step2-cp .wz{margin-left: 0;}
	
	.step2-size .list .num{max-width: 0.5rem;width: 90%;margin:0 auto;line-height: 0.3rem;}

	.step-body.step1{min-height: 100vh;overflow-y: scroll;display: block;}
	.step-body.step1 .step-sec{
		display: flex !important;
		flex-direction: row !important;
		gap: 0.2rem;
		align-items: stretch;
		width: 100%;
	}
	
	.initial{
		position: relative;
		flex: 1;
		max-width: 60%;
		width: auto;
		min-width: 0;
	}
	
	.step-side{
		width: 7.5rem;
		flex-shrink: 0;
		flex-grow: 0;
	}
	
	.step1-side .bigicon{height: 0.9rem;}
	
	.step1-slide{display: none;}	
	
	.step1-cart{display: block;position: static;width: 100%;}
	
	.cart-r{width: 3.2rem;}

}


@media screen and (min-width:768px) and (max-width:991px){
	.auto{padding:0 3%;width: 100%;}
	html{font-size: 6.2rem!important;}

	.sj-menu{position:absolute;right: 2%;top: 50%;width: .4rem;height: .4rem;margin-top: 0;display: flex;align-items: center;justify-content: center;z-index:100;}
	.sj-menu::after{content:'\e678';font-family: 'iconfont';font-size: 0.34rem;color:#000;}
	.sj-menu.close::after{content:'\e668';}
	
	.head{border-bottom:1px solid #efefef;}
	.hd-t .l *{display: none;}
	.hd-sear{width: 2.8rem;}
	.hd-sear .submit{width: 0.4rem;}
	
	.hd-b .wrap{position: static;}
	.hd-b .r{margin-right: 0.6rem;}
	
	.hd-nav{position: fixed;width: 100%;left: 0;top: 1.25rem;bottom: 0;overflow-y: scroll;background-color: #fff;display: none;overflow-x: hidden;margin-left: 0;}
	.hd-nav li{display: block;margin: 0;border-bottom:1px solid #efefef;position: relative;}
	.hd-nav li>a{font-size: 0.18rem;line-height: 0.7rem;padding:0 4%;}
	.hd-nav li.has>a::after{display: none;}
	
	.hd-nav .arrow{position: absolute;right: 0;top: 0;width: 0.7rem;height: 0.7rem;display: flex;align-items: center;justify-content: center;}
	.hd-nav .arrow::after{content:'\e7b9';font-family: 'iconfont';font-size: 0.26rem;color:#000;transform: rotate(90deg);}
	.hd-nav .arrow.this::after{transform: rotate(-90deg);}
	.hd-nav .drop{opacity: 1;visibility: visible;transform: scaleY(1);width: 100%;position: static;background-color: transparent;padding: 0;display: none;margin-left: 0;box-shadow:none;border-top:1px solid #efefef;border:none;border-top:1px solid #efefef;}
	.hd-nav .drop .dropbox{display: block;padding: 0 0 0 .5rem;}
	.hd-nav .drop .col{width: 100%;}
	.hd-nav .drop .tit{border-bottom:1px solid #efefef;line-height: 0.5rem;}
	.hd-nav .drop .lk{color:#000;line-height: 0.5rem;border-bottom:1px solid #efefef;padding:0 0 0 .25rem;text-align: left;}

	.ft-t{display: block;}
	.ft-t .social{max-width: 100%;margin: 0;justify-content: center;margin:.2rem 0 .4rem;}
	.ft-t .social .icon{display: inline-block;vertical-align: middle;margin:0 .15rem;}
	.ft-t .info{width: 100%;text-align: center;}
	.ft-t .menus .col{width: 23%;}
	.ft-t .menus .lk{line-height: 1.8;font-size: 0.18rem;}
	
	.ft-b{font-size: 0.18rem;}

	.idx-top{margin-bottom: 0.2rem;}
	.idx-top .list{display: block;overflow-x: scroll;white-space: nowrap;width: 103%;}
	.idx-top .list .item{width: 1.3rem;display: inline-block;vertical-align: top;margin-bottom: 0.1rem;}
	.idx-top .list .title{-webkit-line-clamp: 2;white-space: break-spaces;font-size: 0.18rem;}
	
	.idx-tt .bt{font-size: 0.3rem;}
	
	.idx-filter{margin-bottom: 0.4rem;}
	.idx-filter .menu{border:none;}
	.idx-filter .lk{margin-right: 0.3rem;line-height: 0.4rem;}
	.idx-filter .lk::after{display: none;}
	
	.idx-trend .list{margin:0 0 -2% -2%;}
	.idx-trend .list .item{width: 31.3%;margin:0 0 2% 2%;}

	.idx-xw{margin-bottom: 0.6rem;}

	.login-box{width: 100%;height: auto;background:none;padding:.2rem 0 .35rem;}
	.login-box .box{max-width: 4.8rem;}
	.login-box .title{font-size: 0.3rem;}

	.inner-ban{height: 3rem;}
	.swiper-slide .title{font-size: 0.32rem;}
	.swiper-slide .txt{margin-top: 0.2rem;}
	
	.help-main{padding:.3rem 0 .6rem;}
	.help-main .wrap{display: block;}
	.help-l{width: 100%;margin: 0;}
	
	.help-side .bt::after{content:'\e7b9';font-family: 'iconfont';display: inline-block;vertical-align: middle;transform: rotate(90deg);font-size: 0.18rem;margin-left: 0.1rem;}
	.help-side .box{background-color: rgba(0,0,0,.3);position: fixed;width: 100%;height: 100%;left: 0;top: 0;z-index:110;display: none;}
	.help-side .list{background-color: #fff;width: 40%;position: absolute;right: 0;top: 0;bottom: 0;padding: 0.15rem;overflow-y: scroll!important;}

	.help-tmp{display: block;}
	.help-tmp .wz{display: block;margin-bottom: 0.1rem;font-size: 0.18rem;}
	
	.help-pics{padding: 0;border:0;}
	.help-pics .item{height: 2.2rem;}
	.help-pics .imgbox{height: 1.6rem;}
	
	.help-pics .item:first-child{height: 4.53rem;}
	.help-pics .item:first-child .imgbox{height: 3rem;}
	
	.help-faq .title{font-size: 0.22rem;}

	.cp-top .detail{display: block;}
	.cp-top .lbox{width: 90%;margin: 0 auto;}
	.cp-top .rbox{flex:initial;margin-top: 0.3rem;}
	.cp-top .slide2 .item{height: 4.3rem;}
	.cp-top .slide1 .swiper-container{height: 4.3rem;}
	
	.cp-top .title{font-size: 0.3rem;}
	.colors .opt{min-width: 0.3rem;height: 0.3rem;}
	.colors .opt::after{font-size: 0.18rem;}
	
	.cp-top .list .icon{height: 0.4rem;}
	
	.cp-top .tips{margin-top: 0.3rem;}
	
	.cp-deli .list li{padding: 0.2rem 0.15rem;}
	.cp-deli .list .icon{height: 0.44rem;}
	.cp-deli .txt{line-height: 1.8;}
	.cp-deli .txt p::before{width: 0.06rem;height: 0.06rem;}
	
	.cp-rela .list{justify-content: flex-start;margin-left: -2%;}
	.cp-rela .list .item{width: 31.3%;margin:0 0 2% 2%;}
	.cp-rela .list .imgbox{height: 2.2rem;}

	.step-body{height: auto;display: block;}	
	.step-bar .l, .step-bar .r{justify-content: center;}
	.step-bar .menu{margin-bottom: 0.2rem;}
	.step-bar .menu .x{width: 0.5rem;}
	.step-bar .menu .lk{margin-right: 0.1rem;}
	.step-bar .ann{margin-left: 0.1rem;}
	
	.step-sec{
		display: flex;
		flex-direction: column;
		gap: 0.2rem;
		align-items: stretch;
	}
	.step-sec .rbox{width: 100%;}
	.step-sec .pic{max-width: 5rem;width: 80%;}
	
	.step-sec .rbox{margin: 0;}
	
	.step-cs .bt{font-size: 0.2rem;}
	
	.step2-xz .title{font-size: 0.2rem;}
	
	.step2-cp .tt{display: block;}
	.step2-cp .wz{margin-left: 0;}
	
	.step2-size .list li{margin-right: 0.15rem;}
	.step2-size .list .num{max-width: 0.45rem;width: 90%;margin:0 auto;line-height: 0.32rem;}
	
	.initial{
		position: relative;
		flex: 0 0 auto;
		max-width: 100%;
		width: 100%;
		margin-left: 0;
		order: 1;
	}
	
	.step-side{
		position: relative;
		width: 100%;
		flex-shrink: 0;
		min-height: 5.5rem;
		display: flex;
		flex-direction: column;
		order: 2;
	}
	.step1-side{display: flex;flex-direction: row;}
	.step1-side .mod{
		width: 0.8rem;
		flex-shrink: 0;
		position: relative;
	}
	.step1-side .drop{
		position: absolute;
		left: 0.9rem;
		top: 0;
		width: calc(100% - 0.9rem);
		border-left: 1px solid #efefef;
		margin-left: 0;
	}

	.step1-slide{display: none;top: 0;}
	.step1-side .bigicon{height: 0.8rem;}
	
	.step1-cart{display: block;top: 4.5rem;bottom:auto;right: 0;width: 3.3rem;border-radius:.1rem 0 0 .1rem;}
	
	.step1-skin .classic .list .item{width: 0.9rem;}
	
	.cart-main{padding:.2rem 0 0.6rem;}
	.cart-main .wrap{display: block;}
	.cart-r{width: 100%;margin:.25rem 0 0;}
	
	.cart-ad .arrow{width: 0.32rem;height: 0.32rem;}
	
	.cart-sec{padding: 0;border:none;}
	
	.cart-table *{font-size: 0.15rem;}
	
	.cart-mod .t-tit{font-size: 0.22rem;height: 0.7rem;}
	
}

@media screen and (max-width:767px){
	.auto{padding:0 4%;width: 100%;}
	html{font-size: 6.2rem!important;}
	
	
	.sj-menu{position:absolute;right: 2%;top: 50%;width: .4rem;height: .4rem;margin-top: 0;display: flex;align-items: center;justify-content: center;z-index:100;}
	.sj-menu::after{content:'\e678';font-family: 'iconfont';font-size: 0.32rem;color:#000;}
	.sj-menu.close::after{content:'\e668';font-size: 0.3rem;}
	
	.head{}
	.hd-t{height: 0.4rem;}
	.hd-t .l *{display: none;}
	.hd-t .x{height: 0.16rem;margin:0 .1rem;}
	.hd-t .lk{font-size: 0.18rem;}
	.hd-t .lang{z-index:101;}
	.hd-t .lang .font{line-height: 0.4rem;}
	
	.hd-sear{display: none;}
	
	.hd-logo .img{height: 0.45rem;}
	
	.hd-b{height: 0.7rem;box-shadow:none;border-bottom:1px solid #efefef;}
	.hd-b .wrap{position: static;}
	.hd-b .r{margin-right: 0.5rem;}
	.hd-cart .font{width: 0.38rem;height: 0.38rem;}
	
	
	.hd-cart-drop{display: none;}
	.hd-cart-drop .dropbox{width: 90%;padding: 0.2rem;}
	.hd-cart-drop .bt{margin-bottom: 0.15rem;}
	
	.hd-cart-drop .list .item{flex-wrap: wrap;border:none;padding:.2rem 0;border-bottom:1px solid #efefef;border-radius:0;margin-bottom: 0;}
	.hd-cart-drop .list .item:last-child{border-bottom:0;}
	.hd-cart-drop .list .item>div{text-align: left;}
	.hd-cart-drop .list .dot{width: 0.16rem;height: 0.16rem;margin-top: -0.02rem;}
	.hd-cart-drop .list .delete{font-size: 0.2rem;}

	.hd-cart-drop .list .w1{width: 30%;}
	.hd-cart-drop .list .w2{width: 70%;}
	.hd-cart-drop .list .w3{width: 30%;margin-top: 0.1rem;}
	.hd-cart-drop .list .w4{width: 50%;margin-top: 0.1rem;}
	.hd-cart-drop .list .w5{width: 20%;margin-top: 0.1rem;}
	
	.hd-cart-drop .xz-box{display: block;padding:.15rem .2rem;border-top:1px solid #efefef;width: calc(100% + 0.4rem);margin-left: -0.2rem;}
	.hd-cart-drop .xz-box .lbox{margin-bottom: 0.15rem;}
	.hd-cart-drop .xz-box .tag{min-width: .5rem;line-height: 0.28rem;font-size: 0.18rem;margin-right: 0.06rem;border-radius:.06rem;}
	.hd-cart-drop .xz-box .total{font-size: 0.18rem;line-height: 1;}
	.hd-cart-drop .xz-box .rbox{display: flex;align-items: center;justify-content: space-between;}
	.hd-cart-drop .xz-box .rbox .fz{margin-bottom: 0;}
	.hd-cart-drop .di-box .txt{line-height: 0.2rem;}
	
	
	.hd-nav{position: fixed;width: 100%;left: 0;top: 1.1rem;bottom: 0;overflow-y: scroll;background-color: #fff;display: none;overflow-x: hidden;margin-left: 0;}
	.hd-nav li{display: block;margin: 0;border-bottom:1px solid #efefef;position: relative;}
	.hd-nav li>a{font-size: 0.17rem;line-height: 0.6rem;padding:0 4%;}
	.hd-nav li.has>a::after{display: none;}
	
	.hd-nav .arrow{position: absolute;right: 0;top: 0;width: 0.6rem;height: 0.6rem;display: flex;align-items: center;justify-content: center;}
	.hd-nav .arrow::after{content:'\e7b9';font-family: 'iconfont';font-size: 0.2rem;color:#000;transform: rotate(90deg);}
	.hd-nav .arrow.this::after{transform: rotate(-90deg);}
	.hd-nav .drop{opacity: 1;visibility: visible;transform: scaleY(1);width: 100%;position: static;background-color: transparent;padding: 0;display: none;margin-left: 0;box-shadow:none;border-top:1px solid #efefef;border:none;border-top:1px solid #efefef;}
	.hd-nav .drop .dropbox{display: block;padding: 0 0 0 .3rem;}
	.hd-nav .drop .col{width: 100%;}
	.hd-nav .drop .tit{border-bottom:1px solid #efefef;line-height: 0.5rem;}
	.hd-nav .drop .lk{color:#000;line-height: 0.5rem;border-bottom:1px solid #efefef;padding:0 0 0 .15rem;text-align: left;}

	.ft-t{display: block;}
	.ft-t .social{max-width: 100%;margin: 0;justify-content: center;margin:.2rem 0 .3rem;}
	.ft-t .social .icon{display: inline-block;vertical-align: middle;margin:0 .15rem;}
	.ft-t .info{width: 100%;text-align: center;}
	.ft-t .menus{display: block;}
	.ft-t .menus .col{width: 100%;padding:.1rem 0;}
	.ft-t .menus .tit{font-size: 0.17rem;margin-bottom: .05rem;}
	.ft-t .menus .lks{margin-left:-.18rem;}
	.ft-t .menus .lk{line-height: 1.8;font-size: 0.15rem;display: inline-block;vertical-align: middle;margin:0 0 0 .18rem;}
	
	.ft-b{font-size: 0.18rem;line-height: 0.22rem;}

	.idx-top{margin-bottom: 0.2rem;}
	.idx-top .list{display: block;overflow-x: scroll;white-space: nowrap;width: 104%;margin-left: 0;}
	.idx-top .list::-webkit-scrollbar{ display: none;} 
	.idx-top .list .item{width: 1rem;display: inline-block;vertical-align: top;margin:0 .1rem 0 0;}
	.idx-top .list .title{-webkit-line-clamp: 2;white-space: break-spaces;font-size: 0.15rem;}
	.idx-top .list .imgbox{height: 1rem;}
	
	.idx-tt .bt{font-size: 0.24rem;}
	
	.idx-filter{margin-bottom: 0.4rem;}
	.idx-filter .menu{white-space: nowrap;overflow-x: scroll;width: 104%;}
	.idx-filter .menu::-webkit-scrollbar{ display: none;} 
	.idx-filter .lk{margin-right: 0.25rem;line-height: 0.4rem;font-size: 0.18rem;font-weight: normal;padding-bottom: 0;}
	.idx-filter .lk::after{display: none;}
	
	.idx-trend .sort .select{width: 1.5rem;}
	.idx-trend .sort em{display: none;}
	.idx-trend .list{margin:0;justify-content: space-between;}
	.idx-trend .list .item{width: 100%;margin:0 0 .25rem 0;}
	.idx-trend .list .imgbox{height: 2.8rem;padding:.15rem;}
	.idx-trend .list .imgbox .img{max-height: 100%;max-width: 100%;object-fit: contain;}
	.idx-trend .list .font{font-size: 0.18rem;text-align: center;}
	.idx-trend .readmore{font-size: 0.18rem;width: 1.6rem;height: 0.44rem;margin-top: 0.15rem;}
	
	.idx-xw{margin-bottom: 0.4rem;}
	.idx-xw .list{margin:0;justify-content: space-between;}
	.idx-xw .list .item{width: 100%;margin:0 0 .25rem;}

	.login-box{width: 100%;height: auto;background:none;padding:0;}
	.login-box .box{max-width: 94%;}
	.login-box .smlogo{display: none;}
	.login-box .title{font-size: 0.25rem;}
	.login-box .ipt-txt{font-size: 0.15rem;}
	.login-box .submit{font-size: 0.18rem;}
	
	.login-bot .desc{font-size: 0.18rem;margin-bottom: 0.1rem;}
	.login-bot .list li{width: 50%;background:#fff!important;}
	.login-bot .list li:nth-child(2),.login-bot .list li:nth-child(3){background-color: #f7f7f7!important;}
	.login-bot .list .fz{font-size: 0.18rem;margin-top: 0.1rem;}
	.login-bot .list .icon{height: 0.3rem;}

	.inner-ban{height: 2.4rem;}
	.swiper-slide .title{font-size: 0.25rem;}
	.swiper-slide .txt{margin-top: 0.1rem;font-size: 0.15rem;}
	
	.help-main{padding:.3rem 0 .6rem;}
	.help-main .wrap{display: block;}
	.help-l{width: 100%;margin: 0;}
	
	.help-side .bt::after{content:'\e7b9';font-family: 'iconfont';display: inline-block;vertical-align: middle;transform: rotate(90deg);font-size: 0.18rem;margin-left: 0.1rem;}
	.help-side .box{background-color: rgba(0,0,0,.3);position: fixed;width: 100%;height: 100%;left: 0;top: 0;z-index:110;display: none;}
	.help-side .list{background-color: #fff;width: 80%;position: absolute;right: 0;top: 0;bottom: 0;padding: 0.15rem;overflow-y: scroll!important;}

	.help-tmp{display: block;}
	.help-tmp .wz{display: block;margin-bottom: 0.1rem;font-size: 0.17rem;}
	.help-tmp .lk{font-size: 0.15rem;}
	
	
	.help-pics{padding: 0;border:0;}
	.help-pics .list{margin: 0;display: flex;flex-wrap: wrap;justify-content: space-between;}
	.help-pics .item{height: auto!important;width: 48%;float:none;margin:0 0 4%;}
	.help-pics .imgbox{height: 1.3rem;}
	.help-pics .title{font-size: 0.18rem;}
	
	.help-pics .item:first-child{height: 4.53rem;width: 100%;}
	.help-pics .item:first-child .imgbox{height: 2.8rem;margin: .1rem 0;}
	.help-pics .item:first-child .title{font-size: 0.18rem;}
	.help-pics .item:first-child .img{}
	
	.help-faq .title{font-size: 0.2rem;}
	.help-faq .txt{font-size: 0.15rem;}
	.help-faq .smtit{font-size: 0.18rem;}
	.help-faq .t-tit{font-size: 0.17rem;}
	
	.cp-top .detail{display: block;}
	.cp-top .lbox{width: 100%;margin: 0 auto;}
	.cp-top .rbox{flex:initial;margin-top: 0.3rem;}
	
	.cp-top .slide2 .item{height: 3rem;}
	.cp-top .slide1{width: 0.68rem;margin-right: 0.15rem;}
	.cp-top .slide1 .swiper-container{height: 3rem;}
	.cp-top .slide1 .item{border-radius:.1rem;}
	.cp-top .arrs .arr{width: 0.3rem;height: 0.3rem;}
	
	.cp-top .title{font-size: 0.22rem;}
	.cp-top .row{display: block;}
	.cp-top .row .smtit{margin-bottom: 0.1rem;font-size: 0.18rem;}
	.cp-top .row .smb .k{min-width: 0.22rem;height: 0.22rem;margin-right: 0.1rem;}
	
	.cp-top .size .opt{min-width: 0.3rem;height: 0.3rem;font-size: 0.18rem;line-height: 0.3rem;}
	
	.colors .opt{min-width: 0.3rem;height: 0.3rem;}
	.colors .opt::after{font-size: 0.18rem;}
	
	.cp-top .anniu{font-size: 0.18rem;width: 2rem;line-height: 0.42rem;}
	
	.cp-top .list{flex-wrap: wrap;justify-content: space-between;margin-top: 0.3rem;}
	.cp-top .list li{width: 48%;margin:0 0 4%;}
	.cp-top .list .icon{height: 0.36rem;}
	.cp-top .list .fz1{font-size: 0.18rem;margin-top: 0.05rem;}
	
	.cp-top .tips{margin-top: 0.3rem;}
	
	.cp-deli .list{display:block;}
	.cp-deli .list li{padding: 0.2rem 0.15rem .2rem .3rem;width: 100%;justify-content: flex-start;}
	.cp-deli .list .icon{height: 0.4rem;}
	.cp-deli .txt{line-height: 1.8;font-size: 0.15rem;}
	.cp-deli .txt p::before{width: 0.06rem;height: 0.06rem;}
	
	.cp-top .tips .txt{font-size: 0.15rem;}
	
	.cp-deli .anniu{width: 2.6rem;line-height: 0.42rem;font-size: 0.18rem;}
	
	.cp-rela{padding:.5rem 0 .2rem;}
	.cp-rela .list{justify-content: space-between;margin:0;}
	.cp-rela .list .item{width: 48%;margin:0 0 4%;}
	.cp-rela .list .imgbox{height: 2.2rem;}

	.step-body{height: auto;display: block;}
	.step-bar .l, .step-bar .r{display: block;}
	.step-bar .menu{margin-bottom: 0.2rem;justify-content: space-between;display: flex;}
	.step-bar .menu .x{display: none;}
	.step-bar .menu .ico{margin:0 auto .1rem;display: block;}
	.step-bar .menu .lk{margin:0;display: block;background:none;text-align: center;line-height: 1.3;padding: 0;}
	.step-bar .r{display: flex;justify-content: space-between;}
	.step-bar .ann{margin: 0;padding:0 .12rem;font-size: 0.15rem;line-height: 0.34rem;}
	
	.step-sec{
		display: flex;
		flex-direction: column;
		gap: 0.2rem;
		align-items: stretch;
	}
	.step-sec .rbox{width: 100%;}
	.step-sec .pic{max-width: 5rem;width: 80%;}
	
	.step-sec .rbox{margin: 0;}
	.step-cs{border-radius:0;padding:.2rem;}
	.step-cs .bt{font-size: 0.2rem;}
	
	.step2-xz .title{font-size: 0.2rem;}
	
	.step2-cp .tt{display: block;}
	.step2-cp .wz{margin-left: 0;}
	
	.step2-size .list li{margin-right: 0.15rem;}
	.step2-size .list .num{max-width: 0.45rem;width: 90%;margin:0 auto;line-height: 0.32rem;border-radius:.06rem;}

	.step3-tip{padding: 0.15rem 0.18rem;}

	.initial{
		position: relative;
		flex: 0 0 auto;
		max-width: 100%;
		width: 100%;
		order: 1;
	}
	
	.step-side{
		position: relative;
		width: 100%;
		flex-shrink: 0;
		top: 0;
		min-height: 7.5rem;
		display: flex;
		flex-direction: column;
		order: 2;
	}
	.step1-side{display: flex;flex-direction: row;}
	.step1-side .mod{
		width: 0.8rem;
		flex-shrink: 0;
		position: relative;
	}
	.step1-side .drop{
		position: absolute;
		left: 0.9rem;
		top: 0;
		width: calc(100% - 0.9rem);
		border-left: 1px solid #efefef;
		margin-left: 0;
		border-radius: 0;
	}
	
	.step1-slide{display: none;top: 0;}
	.step1-side .bigicon{height: 0.65rem;}
	.step1-side .bigicon .ico{width: 0.3rem;}
	
	.step1-cart{display: block;bottom:0;right: 0;width: 100%;border-radius:0;position: static;}
	
	.step1-skin .classic{padding: 0;border:0;}
	.step1-skin .classic .list .item{width: 0.9rem;}
	.step1-skin .toptxt .title{font-size: 0.2rem;}

	.cart-main{padding:.2rem 0 0.6rem;}
	.cart-main .wrap{display: block;}
	.cart-r{width: 100%;margin:0;}
	
	.cart-ad .title{font-size: 0.2rem;}
	.cart-ad .txt{line-height: 1.2;}
	.cart-ad .arrow{display: none;}

	.cart-sec{padding: 0;border:none;}
	.cart-sec .top-tt{margin-bottom: 0.07rem;}
	.cart-sec .top-tt .bt{font-size: 0.2rem;}
	.cart-sec .top-tt .lks{font-size: 0.18rem;}
	
	.cart-table .thead{display: none;}
	.cart-table .box{flex-wrap: wrap;padding:.15rem .1rem;}
	.cart-table .xs{display: inline-block;}
	.cart-table .dot{width: 0.16rem;height: 0.16rem;}
	.cart-table .editicon{vertical-align: baseline;}
	
	
	.numbox{max-width: .9rem;}
	.numbox .sub, .numbox .add{width: 0.26rem;height: 0.26rem;}
	
	.cart-table *{font-size: 0.15rem;}
	.cart-table .box>div{padding: 0;text-align: left!important;line-height: 0.26rem;}
	.cart-table .w1{width: 40%;}
	.cart-table .w2{flex:initial;width: 60%;}
	
	.cart-table .w3{width: 35%;}
	.cart-table .w4{width: 45%;}
	.cart-table .w5{min-width: 30%;}
	
	.cart-table .w6{width: 25%;}
	.cart-table .w7{width: 43%;}
	.cart-table .w8{width: 5%;}
	.cart-table .numbox{margin-left: 0;}
	
	.cart-mod{margin: 0;padding:.2rem 0;border:none;    border-bottom: 1px solid #e9e9e9;}
	.cart-mod .t-tit{font-size: 0.2rem;height: 0.5rem;}
	.cart-mod .t-tit .icon{width: 0.26rem;margin-right: 0.08rem;}
	
	.cart-opts .opts .sel{width: 0.18rem;height: 0.18rem;}
	.cart-opts .showmore{margin-bottom: 0;}
	
	.cart-di{margin-top: 0.2rem;}
	.cart-di .wz{margin:.12rem 0;}
	
}

.auto {
    max-width: 1200px;
    margin: auto;
}

.order-item {
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #f9f9f9;
    padding: 15px;
    margin-bottom: 20px;
}

.order-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 10px;
}

.order-thumbnails {
    display: flex;
    gap: 10px;
}

.thumbnail {
    width: 50px;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
}

.thumbnail img {
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
}

.order-info {
    margin-left: 20px;
    flex-grow: 1;
}

.order-info span {
    display: block;
    margin-bottom: 5px;
}

.toggle-details {
    padding: 5px 10px;
    cursor: pointer;
}

.order-details {
    display: none;
    padding-top: 10px;
}

.order-details table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 10px;
}

.order-details th, .order-details td {
    padding: 10px;
    border: 1px solid #ddd;
    text-align: left;
}

.order-details img {
    width: 50px;
    object-fit: cover;
}

.thumbnail-container {
    display: flex;
    gap: 10px;
}

.shipping-info p {
    margin: 5px 0;
}

.order-item:last-child {
    border-bottom: none;
}

.continue-payment {
    padding: 10px 20px;
    margin: 10px auto;
    display: block;
    text-align: center;
}

.pf-top {
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.pf-top .auto {
    display: flex;
    align-items: center;
}

.logoutBtn {
    margin-left: 15px;
    text-decoration: none;
    color: #d9534f;
    font-size: 0.9em;
}

.logoutBtn:hover {
    text-decoration: underline;
}

.profile-pic {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    margin-right: 15px;
}

.profile-info {
    flex-grow: 1;
}

.tt {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.name {
    font-size: 1.2em;
    font-weight: bold;
    color: #333;
}

.editBtn {
    text-decoration: none;
    color: #007BFF;
    font-size: 0.9em;
}

.editBtn:hover {
    text-decoration: underline;
}

.font {
    color: #666;
    font-size: 0.9em;
}

.progress {
    margin-bottom: 10px;
}

.profile-fz {
    display: flex;
    justify-content: space-between;
    font-size: 0.9em;
    color: #333;
}

.bar {
    background: #e0e0e0;
    border-radius: 5px;
    height: 10px;
    overflow: hidden;
}

.bar i {
    display: block;
    height: 100%;
    background: #4caf50;
}

.ts {
    font-size: 0.9em;
    color: #007BFF;
}

.ts a {
    color: #007BFF;
    text-decoration: underline;
}

.ts a:hover {
    text-decoration: none;
}

.edit-form {
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    margin-top: 15px;
}

.edit-form h3 {
    font-weight: bold;
    text-align: center;
    margin-bottom: 15px;
}

.form-layout {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.form-group {
    flex: 1 1 auto;
}

label {
    display: block;
    margin-bottom: 5px;
}

.form-buttons {
    display: flex;
    justify-content: flex-start;
}

.container {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 100vh;
    justify-content: center;
}

.cart-dropdown {
    position: relative;
    display: inline-block;
}

.cart-dropdown-button {
    width: 3.1rem;
    background-color: #4a90a4;
    color: white;
    border: none;
    padding: 0 10px;
    cursor: pointer;
    align-items: center;
    justify-content: space-between;
    text-align: center;
    text-decoration: none;
    line-height: 0.36rem;
    margin-left: 0.1rem;
}

.cart-dropdown-button::after {
    content: '▼';
    margin-left: 5px;
    font-size: 10px;
}

.cart-dropdown-button:hover {
    background-color: #4a90a4;
}

.cart-dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 120px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    border-radius: 4px;
}

.cart-dropdown-content div {
    color: black;
    padding: 8px 10px;
    text-decoration: none;
    display: block;
    cursor: pointer;
    text-align: left;
}

.cart-dropdown-content div:hover {
    background-color: #4a90a4;
}

.show {
    display: block;
}

#discountCode {
    margin-right: 0.1rem;
}

.home {
    background-image: url('/images/home.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px; /
}

.actions > * {
    margin-right: 3px;
}