/*Body*/ body{ font-family: DINPro,'PingFang SC',miui,'Hiragino Sans GB','Microsoft Yahei',sans-serif; line-height: 1.5; color: #666; } img, picture { display: block; max-width: 100%; height: auto; } .rc-main { padding:0 1.25rem; box-sizing:border-box; margin:0 auto; } .ts-remove { text-decoration: line-through; } .ts-product-list{ li{ img{ width: 320px; height:auto; object-fit: contain; display: flex; margin: 0 auto; } } .active{ color: #E2001A; cursor: pointer; } .unactive{ color:#999999; cursor: pointer; } } .rc-age{ display: flex; h2{ color:#333333; } ol{ display: flex; align-items: center; flex-wrap: nowrap; text-align: center; width: 86%; } li{ flex-shrink: 0; } } .rc-mubu{ height: 100%; background: #333333; opacity: 0.6; position: absolute; bottom: 0; width: 100%; z-index: 8; } .ts-scrollable{ overflow-y:hidden; overflow-x:auto; white-space: nowrap; &::-webkit-scrollbar{ display:none; } } .online{ width:100%; background:#d7d7d7; margin-top:1.5rem; height:.06rem; &.bold{ height:.32rem; background:#f6f6f6; } } /*Body end*/ /* 头部 */ .rc-fixright{ width: 3.75rem; height: auto; position: fixed; right: 0; top: 30%; ul{ width: 60px; height: 181px; box-shadow: 0px 0px 6px rgb(0 0 0 / 10%); background-color: white; display: flex; flex-direction: column; li{ width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 0.18rem; } li:last-child{ margin-bottom: 0.2rem; } } img{ width: 1.25rem; height: auto; display: block; } span{ font-size: 0.12rem; color: #666666; } .tuntop{ width: 100%; height: 60px; background: #FFFFFF; box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.1); opacity: 1; display: block; color: #666666; font-size: 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; margin-top: 8px; img{ width: 0.22rem; height: 0.22rem; display: block; } } } /* 手机端 */ @media screen and (max-width: 768px) { html { font-size:100px; } .rc-md-up { display: none!important; } .rc-main{ width:100%; } .rc-top{ margin-top: 74px; } .rc-list__header { background: none; padding: .5rem 0; border-bottom: none; } .rc-home-header{ width: 100%; .rc-main { box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; height: 70px; background-color: #fff; .rc-center{ display: none; } } .c-left img{ width: 19px; height: 14px; display: block; } .c-right img{ width: 97px; height: 35px; display: block; } .rc-search img{ width: 19px; height: 19px; display: block; } &.fixed{ position:fixed; top: 0; left: 0; z-index:3; } } .rc-age{ h2{ font-size: 16px; margin-right:.1rem; } ol{ font-size: 12px; } li{ width: .64rem; height: 26px; line-height: 26px; border-radius: 100px; margin-left: 9px; } } .ts-scrollable{ .active{ border: 2px solid #E2001A; } .unactive{ border: 2px solid #d7d7d7; } } } /* pc端 */ @media screen and (min-width: 769px) { html { font-size:16px; } .rc-top{ margin-top: 124px; } .ts-list--four-column { -webkit-column-count: 4; column-count: 4; } .rc-list__header{ background: none; padding: .5rem 0; border-bottom: none; } .rc-padding--sm { padding: 2rem; } .rc-margin-bottom--xs { margin-bottom: .5rem; } .rc-header { -webkit-box-shadow: none; box-shadow: none; } .rc-header__logo { width: 120px; } .rc-header__nav--primary { height: 80px; } .rc-list--inline .list__item, .rc-list--inline .rc-list__item { margin-right: 32px; } .rc-btn--action, .rc-btn--icon, .rc-btn--icon--xs, .rc-input__submit--micro, .rc-input__submit--search { min-width: 48px; height: 48px; } .rc-md-down { display: none!important; } .ts-list--four-column, .ts-list--four-column .list, .ts-list--four-column .rc-list { page-break-inside: avoid; break-inside: avoid; } .rc-main { width:100%; max-width:1400px; } .rc-list--inline:not([role=tablist]):not([role=menubar]) { -ms-flex-wrap: wrap; flex-wrap: wrap; } .layout-container, .rc-layout-container { margin-left: -1rem; margin-right: -1rem; } .rc-fixright{ width:5.5rem; background: #FFFFFF; box-shadow: 0px 0px .62rem rgba(0, 0, 0, 0.16); border-radius: .25rem; display: flex; flex-direction: column; align-items: center; ul{ width:100%; height: 100%; li{ margin-top: .5rem; height:4.125rem; img{ width:22px; height:auto; } } } } .rc-home-header{ height:120px ; .rc-main { width: 100%; margin: 0 auto; // position: fixed; top: 0; background: white; display: flex; justify-content: space-between; align-items: center; flex-direction: column; height: 120px; ul { display: flex; align-items: center; margin-bottom: 20px; li { margin-right: 25px; color: #666666; cursor: pointer; font-size: 16px; } } } .c-left{ display: none; } .rc-search{ display: none; } .c-left img { width: 19px; height: 14px; display: block; } .c-right img{ width: 120px; height: 45px; display: block; } } .ts-scrollable{ .rc-age{ h2 { font-size: 20px; color: #333333; } li { margin-left: 40px; width: 100px; height: 40px; line-height: 40px; font-size: 18px; } } } } @media (max-width: 960px) { .rc-lg-up { display: none!important; } } @media (min-width: 1024px) { .rc-xl-down { display: none!important; } }