@font-face {
    font-family: MiSansVF;
    src: url(../fonts/MiSansVF.ttf);
}

* {
    text-transform: uppercase;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    background-color: #FFFFFF;
    font-family: MiSansVF;
    font-size: calc(100vw / 1125);
}

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

.logo-image {
    width: 385rem;
    height: 64rem;
}

.logo-link {
    text-decoration: none;
    padding: 10rem;
    margin-top: 18rem;
    border: 1rem solid #727272;
    border-radius: 10rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 21rem;

    /* font-weight: 900; */
    color: #231815;
}

.logo-link:hover {
    background-color: #000000;
    color: #FFFFFF;
}

.header {
    position: fixed;
    width: 100vw;
    top: 0;
    display: flex;
    flex-direction: column;
    background-color: #FFFFFF;
    z-index: 1;
}

.header-title {
    display: flex;
    justify-content: center;
    height: 70rem;
    border-bottom: 1rem solid #727272;
}

.header-title-logo {
    /* width: 201rem; */
    height: 33rem;
    margin-top: 25rem;
}

.header-subtitle {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100rem;
    border-bottom: 1rem solid #727272;
    font-size: 28rem;
    /* font-weight: 800; */
    color: #000000;
}

.header-subtitle-badge {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #FFFFFF;
    background-color: #000000;
    padding: 10rem 30rem;
    border-radius: 10rem;
}

.classification {
    position: fixed;
    top: 205rem;
    left: 35rem;
    display: flex;
    flex-direction: column;
    z-index: 1;
    /* font-weight: 400; */
    font-size: 22rem;
}

.classification-item {
    color: #040000;
    margin-bottom: 13rem;
    text-decoration: none;
    width: 115rem;
    height: 30rem;
    border-radius: 10rem;
    border: 1rem solid #727272;
    display: flex;
    justify-content: center;
    align-items: center;
}

.classification-item-active {
    color: #ffffff;
    background-color: #040000;
    margin-bottom: 13rem;
    text-decoration: none;
    width: 115rem;
    height: 30rem;
    border-radius: 10rem;
    border: 1rem solid #040000;
    display: flex;
    justify-content: center;
    align-items: center;
}

.content {
    margin-top: 165rem;
    margin-bottom: 150rem;
    width: 100vw;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.content-h1 {
    font-family: MiSans, MiSans;
    font-weight: 800;
    font-size: 33rem;
    color: #060001;
    font-style: normal;
    text-transform: none;
    text-align: center;
    margin-top: 50rem;
}

.content-h2 {
    font-family: MiSans, MiSans;
    font-weight: 600;
    font-size: 18rem;
    color: #060001;
    font-style: normal;
    text-transform: none;
    text-align: center;
    margin-top: 46rem;
    margin-bottom: 46rem;
}

.content-images {
    display: flex;
    align-items: center;
    /*justify-content: space-evenly;*/
    margin: 5rem 0;
}

.content-images-item {
    width: calc(50% - 10rem);
    margin: 0 5rem;
}

.page-container {
    background-color: #ffffff;
    width: 100%;
    height: calc(100vh - 315rem);
    overflow: scroll;
    scroll-snap-type: y mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.page-container::-webkit-scrollbar {
    display: none;
}

.page {
    /* scroll-snap-align: start; */
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.main-video {
    width: 100%;
    /* height: max(630rem, calc(100vh - 90rem)); */
    /* scroll-snap-align: start; */
    object-fit: cover;
    /* display: block; */
}

.home-big-title-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* 垂直居中两行 */
    align-items: center;
    /* 水平居中 */
    height: 200rem;
    text-align: center;
    /* 防止某些字体渲染偏移 */
    gap: 10rem;
    /* 两行之间的间距（现代浏览器支持） */
}

.home-big-title {
    font-family: MiSans, MiSans;
    font-weight: 800;
    /* font-size: 49rem; */
    font-size: 30rem;
    color: #060001;
    font-style: normal;
    text-transform: none;
    text-align: center;
}

.home-big-title-down-content {
    font-family: MiSans, MiSans;
    font-weight: 600;
    /* font-size: 31rem; */
    font-size: 20rem;
    color: #060001;
    font-style: normal;
    text-transform: none;
    text-align: center;
}

/* home product title -- start */
.subtitle-new {
    display: flex;
    justify-content: center;
    align-items: center;
    border-top: 1rem solid #040000;
    height: 65rem;
}

.subtitle-new-inside {
    /* width: 181rem; */
    /* height: 31rem; */
    font-family: MiSansVF, MiSansVF;
    font-weight: 600;
    font-size: 25rem;
    color: #040000;
    /* letter-spacing: 38rem; */
    text-align: left;
    font-style: normal;
    text-transform: none;
}

/* home product title -- end */

/* view more -- start */
.dock-title-new {
    display: flex;
    justify-content: center;
    align-items: center;
    /* height: 90rem; */
    height: 80rem;
}

.dock-title-new-inside {
    font-family: MiSansVF, MiSansVF;
    font-weight: 600;
    font-size: 35rem;
    color: #040000;
    text-align: left;
    font-style: normal;
    text-transform: none;
    border-bottom: 1rem solid #040000;
}

.view-more-link {
    color: #040000;
    text-decoration: none;
}

.navbar-top {
    position: relative;
    height: 150rem;
}

/* view more -- end */

/* anniversary -- start */
.subtitle {
    height: 80rem;
    border-bottom: 1rem solid #040000;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10rem;
    color: #040000;
}

.subtitle-classification {
    /* height: 29rem; */
    padding: 0 50rem;
    background-color: #040000;
    border-radius: 10rem;
    font-size: 28rem;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
}

.anniversary-big-title-container {
    height: 300rem;
}

.anniversary-big-title {
    font-family: MiSans, MiSans;
    font-weight: 800;
    /* font-size: 33rem; */
    font-size: 14rem;
    color: #060001;
    font-style: normal;
    text-transform: none;
    text-align: center;
    /* margin-top: 140rem; */
    /* margin-top: 140rem; */
}

.anniversary-big-title-down-content {
    font-family: MiSans, MiSans;
    font-weight: 600;
    /* font-size: 18rem; */
    font-size: 10rem;
    color: #060001;
    font-style: normal;
    text-transform: none;
    text-align: center;
    /* margin-top: 46rem; */
    margin-top: 10rem;
}

.anniversary-main-content {
    margin: 0 75rem;
}

.main-big-image-container-anniversary {
    margin: 10rem 0;
}

.main-big-image-container-anniversary-bottom-image {
    display: flex;
    align-items: center;
    /* 垂直居中 */
    justify-content: center;
    /* 水平居中 */
    margin-top: 100rem;
    margin-bottom: 50rem;
}

.main-big-image-container-anniversary-bottom-image-item {
    width: 50%;
}

.anniversary-main-half-image {
    margin: 0 5rem;
}

.anniversary-main-text {
    border-top: 1rem solid #040000;
    text-align: center;
    font-family: MiSans, MiSans;
    color: #060001;
    font-style: normal;
    margin-top: 50rem;
}

.anniversary-main-text-1 {
    text-transform: none;
    font-weight: 800;
    font-size: 33rem;
    margin-top: 40rem;
    margin-bottom: 50rem;
}

.anniversary-main-text-2 {
    text-transform: none;
    font-size: 23rem;
}

.anniversary-main-text-3 {
    text-transform: none;
    font-size: 16rem;
    margin-top: 50rem;
    margin-bottom: 70rem;
}

.anniversary-main-text-4 {
    text-transform: none;
    font-weight: 600;
    font-size: 20rem;
    margin-bottom: 20rem;
}

.anniversary-main-text-5 {
    text-transform: none;
    font-weight: 800;
    font-size: 33rem;
    margin-top: 50rem;
}

.anniversary-main-text-6 {
    text-transform: none;
    font-weight: 800;
    font-size: 23rem;
    margin-top: 10rem;
}

.anniversary-main-text-3-container {
    display: flex;
    align-items: center;
    /* 垂直居中 */
    justify-content: center;
    /* 水平居中 */
    margin-bottom: 20rem;
}

.anniversary-main-text-3-container-left {
    text-transform: none;
    text-align: right;
    width: 50%;
    margin-right: 50rem;
}

.anniversary-main-text-3-container-right {
    text-transform: none;
    text-align: left;
    width: 50%;
    margin-left: 50rem;
}

/* anniversary -- end */


.page-title {
    /* font-weight: 600; */
    font-size: 24rem;
    color: #070002;
}

.page-image2 {
    width: 903rem;
    margin-top: 150rem;
    margin-bottom: 150rem;
}

.page-sign {
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-sign-text {
    /* font-weight: 900; */
    font-size: 10rem;
    color: #040000;
}

.page-sign-image {
    margin-left: -20rem;
    width: 127rem;
    height: 77rem;
}

.page-image3 {
    width: 100%;
}

.page-sign-icon {
    height: 65rem;
    margin-top: 150rem;
    margin-left: 65rem;
    margin-right: 65rem;
    margin-bottom: 110rem;
}

.page-title1 {
    /* font-weight: 900; */
    font-size: 18rem;
    color: #040000;
    margin-bottom: 16rem;
}

.page-image {
    width: 50%;
}

.page-image1 {
    margin-top: 10%;
    width: 120rem;
    height: 20rem;
}

.footer-services {
    margin-top: 50rem;
    margin-bottom: 50rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-services-item {
    margin: 0 20rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.footer-services-button {
    width: 100rem;
    height: 40rem;
    border-radius: 10rem;
    background-color: #040000;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.footer-services-image {
    height: 29rem;
}

.footer-services-text {
    margin-top: 13rem;
    font-size: 20rem;
    color: #231815;
}

.footer-services-button .footer-services-tooltip1 {
    position: absolute;
    z-index: 1;
    bottom: 150%;
    left: 50%;
    width: 200rem;
    height: 200rem;
    margin-left: -100rem;
    visibility: hidden;
    border-radius: 10rem;
    background-color: #ffffff;
    border: solid 1rem #040000;
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer-services-tooltip-image {
    width: 190rem;
    display: block;
}

.footer-services-button .footer-services-tooltip::after {
    content: " ";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -10rem;
    border-width: 10rem;
    border-style: solid;
    border-color: #040000 transparent transparent transparent;
}

.footer-services-button .footer-services-tooltip1::after {
    content: " ";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -10rem;
    border-width: 10rem;
    border-style: solid;
    border-color: #040000 transparent transparent transparent;
}

.footer-services-button:hover .footer-services-tooltip {
    visibility: visible;
}

.footer-services-button:hover .footer-services-tooltip1 {
    visibility: visible;
}

.page-content-shoes-container {
    width: 100vw;
    /* height: 100%; */
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    border-top: 0.5rem solid #727272;
}

.content-shoes-container {
    margin-top: 165rem;
    margin-bottom: 150rem;
    width: 100vw;
    height: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    border-top: 0.5rem solid #727272;
}

.content-shoes {
    width: 50%;
    /* height: calc((110vh - 30rem) / 2); */
    /* min-height: min-content; */
    border-right: 0.5rem solid #727272;
    border-bottom: 0.5rem solid #727272;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

.content-shoes-image {
    width: 70%;
    object-fit: scale-down;
    margin-top: 150rem;
}

.content-clothes-image {
    width: 70%;
    object-fit: scale-down;
    margin-bottom: 20rem;
    margin-top: 150rem;
}

.content-shoes-details {
    display: flex;
    flex-direction: column;
    max-width: 60%;
    min-height: 15%;
    margin-top: 20rem;
    margin-bottom: 150rem;
    font-weight: 600;
}

.content-shoes-details-brand {
    font-size: 20rem;
    /* font-weight: bold; */
    color: #231815;
}

.content-shoes-details-name {
    font-size: 20rem;
    color: #231815;
}

.content-shoes-details-usd {
    /* font-weight: bold; */
    font-size: 28rem;
    color: #231815;
    margin-top: 55rem;
    margin-bottom: 40rem;
}

.content-shoes-details-item-color-black {
    width: 24rem;
    height: 24rem;
    margin-bottom: 12rem;
    margin-right: 4rem;
    border: 1rem solid #727272;
    border-radius: 5rem;
    background-color: #000000;
}

.content-shoes-details-item-color-yellow {
    width: 24rem;
    height: 24rem;
    margin-bottom: 12rem;
    border: 1rem solid #727272;
    border-radius: 5rem;
    background-color: #F8C800;
}

.content-shoes-details-item-color-sand {
    width: 24rem;
    height: 24rem;
    margin-bottom: 12rem;
    border: 1rem solid #727272;
    border-radius: 5rem;
    background-color: #B9B09D;
}

.content-shoes-details-item-color-white {
    width: 24rem;
    height: 24rem;
    margin-bottom: 12rem;
    border: 1rem solid #727272;
    border-radius: 5rem;
    background-color: #F2F1F1;
}

.shoes-details-container {
    margin-top: 165rem;
    margin-bottom: 150rem;
    width: 100vw;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.shoes-details-image {
    width: 650rem;
    height: 650rem;
    object-fit: scale-down;
}

.clothes-details-image {
    margin-top: 145rem;
    width: 650rem;
    height: 650rem;
    object-fit: scale-down;
}

.shoes-details-image-container {
    margin-top: 30rem;
    width: 90%;
    display: flex;
    justify-content: center;
    /* overflow: scroll;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none; */
}

.clothes-details-image-container {
    margin-top: 30rem;
    display: flex;
    justify-content: center;
}

.shoes-details-image-container-item {
    width: 190rem;
    height: 95rem;
    opacity: 0.3;
    margin: 0 10rem;
}

.shoes-details-image-container-item-active {
    width: 190rem;
    height: 95rem;
    border: 1rem solid #727272;
    margin: 0 10rem;
}

.clothes-details-image-container-item {
    width: 160rem;
    height: 160rem;
    margin: 0 20rem;
    opacity: 0.3;
}

.clothes-details-image-container-item-active {
    width: 160rem;
    height: 160rem;
    margin: 0 20rem;
    border: 1rem solid #727272;
}

.shoes-details-image-container-item-image {
    width: 100%;
    height: 100%;
    object-fit: scale-down;
}

.shoes-details-content {
    margin-top: 80rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    border-top: 1rem solid #727272;
}

.clothes-details-content {
    margin-top: 80rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    border-top: 1rem solid #727272;
}

.shoes-details-content-title {
    font-size: 18rem;
    /* font-weight: 900; */
    color: #231815;
    line-height: 26rem;
}

.shoes-details-content-text {
    font-size: 18rem;
    font-family: OPPOSans;
    color: #231815;
    line-height: 30rem;
}

.shoes-details-card {
    width: 395rem;
    height: 210rem;
    margin-top: 50rem;
    border: 1rem solid #727272;
    border-radius: 10rem;
    position: relative;
}

.shoes-details-card-badge {
    position: absolute;
    top: 10rem;
    left: 10rem;
    padding-bottom: 12rem;
    font-size: 24rem;

    /* font-weight: 900; */
    color: #231815;
    display: flex;
    align-items: center;
}

.shoes-details-card-image {
    width: 100%;
    height: 100%;
    object-fit: scale-down;
}

.shoes-details-size-list {
    margin-top: 50rem;
    display: flex;
    justify-content: space-between;
}

.shoes-details-size-box {
    width: 50rem;
    height: 50rem;
    border: 1rem solid #727272;
    border-radius: 5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15rem;

    /* font-weight: 900; */
    color: #000000;
    line-height: 30rem;
}

.shoes-details-size-box-wider {
    width: 100rem;
    height: 50rem;
    border: 1rem solid #727272;
    border-radius: 5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15rem;

    /* font-weight: 900; */
    color: #000000;
    line-height: 30rem;
}

.clothes-details-size-list {
    margin-top: 30rem;
    display: flex;
    justify-content: space-between;
}

.clothes-details-size-box {
    width: 120rem;
    height: 50rem;
    border: 1rem solid #727272;
    border-radius: 5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15rem;

    /* font-weight: 900; */
    color: #000000;
    line-height: 30rem;
}

.shoes-details-buy {
    margin-top: 50rem;
    height: 50rem;
    width: 100%;
    background-color: #000000;
    color: #FFFFFF;
    border-radius: 10rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15rem;

    /* font-weight: 900; */
    color: #FFFFFF;
    line-height: 30rem;
}

.clothes-details-buy {
    margin-top: 30rem;
    height: 50rem;
    width: 100%;
    background-color: #000000;
    color: #FFFFFF;
    border-radius: 10rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15rem;

    /* font-weight: 900; */
    color: #FFFFFF;
    line-height: 30rem;
}

.clothes-details-size-table {
    margin-top: 30rem;
    width: 100%;
}

.clothes-details-size-table-row {
    margin-bottom: 10rem;
    display: flex;
    justify-content: space-between;
}

.clothes-details-size-table-row-lable {
    width: 95rem;
    height: 40rem;
    border-radius: 5rem;
    background-color: #000000;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12rem;
    font-family: OPPOSans;
    line-height: 24rem;
}

.clothes-details-size-table-row-item {
    width: 95rem;
    height: 40rem;
    border: 1rem solid #727272;
    border-radius: 5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12rem;

    /* font-weight: 900; */
    line-height: 24rem;
}

.shoes-details-mask {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #FFFFFF;
    opacity: 0.7;
}

.shoes-details-mask-close {
    position: absolute;
    top: 0;
    right: 0;
    width: 20rem;
    height: 20rem;
}

.shoes-details-mask-close::before,
.shoes-details-mask-close::after {
    position: absolute;
    left: 50%;
    width: 2rem;
    height: 100%;
    margin-left: (2rem / -2);
    content: '';
    background: #000000;
}

.shoes-details-mask-close::before {
    transform: rotate(-45deg);
}

.shoes-details-mask-close::after {
    transform: rotate(45deg);
}

.shoes-details-mask-content {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 10;
}

.shoes-details-mask-content-text {
    font-size: 18rem;

    /* font-weight: 900; */
    text-align: center;
    color: #231815;
}

.shoes-details-mask-content-button {
    width: 250rem;
    height: 65rem;
    margin-top: 25rem;
    border-radius: 10rem;
    background-color: #000000;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 27rem;

    /* font-weight: 900; */
    line-height: 53rem;
    text-decoration: none;
}

.content-chrislv-title {
    font-size: 36rem;

    /* font-weight: 900; */
    color: #231815;
    margin-top: 145rem;
    margin-bottom: 125rem;
}

.content-chrislv-paragraph {
    width: 920rem;
    font-size: 18rem;

    /* font-weight: 900; */
    color: #231815;
    line-height: 36rem;
    margin-bottom: 30rem;
}

.right-align {
    text-align: right;
    margin-top: 145rem;
}

.question-id {
    width: calc(100% - 80rem);
    font-size: 18rem;

    /* font-weight: 900; */
    color: #231815;
    line-height: 24rem;
}

.question {
    margin-top: 40rem;
    width: calc(100% - 130rem);
    font-size: 18rem;

    /* font-weight: 900; */
    color: #231815;
    line-height: 40rem;
}

.answer {
    margin-top: 30rem;
    margin-bottom: 125rem;
    width: calc(100% - 130rem);
    font-size: 18rem;

    /* font-weight: 900; */
    color: #231815;
    line-height: 40rem;
}

.answer-text-button {
    display: inline;
    padding: 10rem 10rem;
    background-color: #000000;
    color: #FFFFFF;
    border-radius: 10rem;
    font-size: 18rem;

    /* font-weight: 900; */
    line-height: 40rem;
}

.address-engtext {
    font-size: 18rem;

    /* font-weight: 900; */
    color: #231815;
    line-height: 60rem;
}

.address-text {
    margin-top: 45rem;
    font-size: 18rem;

    /* font-weight: 900; */
    color: #231815;
}

.address-image {
    margin-top: 65rem;
    margin-bottom: 150rem;
    width: 200rem;
    height: 200rem;
}

.content-services {
    margin-top: 165rem;
    margin-bottom: 150rem;
    width: 100vw;
    height: calc(100vh - 315rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.services-content-text {
    font-size: 36rem;
    font-family: OPPOSans;
    color: #231815;
}

.services-content-engtext {
    margin-top: 26rem;
    font-size: 24rem;

    /* font-weight: 900; */
    color: #231815;
}

.services-content-im {
    margin-top: 138rem;
    display: flex;
    justify-content: center;
}

.services-content-im-item {
    margin: 0 21rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.services-content-im-button {
    width: 257rem;
    height: 102rem;
    border-radius: 20rem;
    background-color: #000000;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.services-content-im-image {
    height: 70rem;
}

.services-content-im-text {
    margin-top: 15rem;
    font-size: 25rem;
    font-family: OPPOSans;
    color: #231815;
}

.services-content-im-button .services-content-im-tooltip {
    position: absolute;
    z-index: 1;
    bottom: 150%;
    left: 50%;
    width: 250rem;
    height: 500rem;
    margin-left: -125rem;
    visibility: hidden;
    border-radius: 20rem;
    background-color: #ffffff;
    border: solid 1rem #000000;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.services-content-im-button .services-content-im-tooltip1 {
    position: absolute;
    z-index: 1;
    bottom: 150%;
    left: 50%;
    width: 250rem;
    height: 250rem;
    margin-left: -125rem;
    visibility: hidden;
    border-radius: 20rem;
    background-color: #ffffff;
    border: solid 1rem #000000;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.services-content-im-tooltip-image {
    width: 240rem;
    height: 240rem;
    display: block;
    border-radius: 20rem;
}

.services-content-im-button .services-content-im-tooltip::after {
    content: " ";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -20rem;
    border-width: 20rem;
    border-style: solid;
    border-color: #000000 transparent transparent transparent;
}

.services-content-im-button .services-content-im-tooltip1::after {
    content: " ";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -20rem;
    border-width: 20rem;
    border-style: solid;
    border-color: #000000 transparent transparent transparent;
}

.services-content-im-button:hover .services-content-im-tooltip {
    visibility: visible;
}

.services-content-im-button:hover .services-content-im-tooltip1 {
    visibility: visible;
}

.footer {
    position: fixed;
    width: 100vw;
    height: 150rem;
    bottom: 0;
    border-top: 1rem solid #727272;
    display: flex;
    justify-content: space-around;
    align-items: center;
    background-color: #FFFFFF;
    z-index: 1;
}

.footer-tabbar {
    border: 1rem solid #727272;
    border-radius: 10rem;
    height: 55rem;
    padding: 0 50rem;
    font-size: 22rem;
    /* font-weight: 600; */
    text-decoration: none;
    color: #040000;
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer-tabbar-disabled {
    border: 1rem solid #727272;
    border-radius: 10rem;
    height: 55rem;
    padding: 0 50rem;
    font-size: 22rem;
    /* font-weight: 600; */
    text-decoration: none;
    color: #727272;
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer-tabbar:hover {
    background-color: #000000;
    color: #FFFFFF;
}

.footer-tabbar-dropdown {
    position: relative;
}

.footer-tabbar-dropdown-navbar {
    visibility: hidden;
    position: absolute;
    width: 100%;
    height: 200rem;
    bottom: 100rem;
    background-color: #FFFFFF;
    border: 1rem solid #727272;
    border-top-left-radius: 10rem;
    border-top-right-radius: 10rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    z-index: 1;
}

.footer-tabbar-dropdown-navbar-item {
    width: calc(100% - 10rem);
    height: 40rem;
    border: 1rem solid #727272;
    border-radius: 10rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 18rem;
    /* font-weight: 600; */
    color: #070002;
}

.footer-tabbar-dropdown-navbar-item:hover {
    background-color: #070002;
    color: #FFFFFF;
}

.footer-tabbar-dropdown:hover .footer-tabbar-dropdown-navbar {
    visibility: visible;
}

.content-top {
    margin-top: 50rem;
}

.event-list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.event-list-box {
    width: calc(100% - 70rem);
    margin-top: 100rem;
    margin-bottom: 15rem;
    padding-left: 65rem;
    padding-right: 30rem;
    padding-top: 35rem;
    padding-bottom: 45rem;
    border: 1rem solid #727272;
    border-radius: 20rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.event-list-box-title {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.event-list-box-title-left {
    display: flex;
    font-weight: 600;
    font-size: 23rem;
    color: #040000;
    border-bottom: 1rem solid #727272;
}

.event-list-box-title-date {
    margin-right: 35rem;
}

.event-list-box-title-name {
}

.event-list-box-title-right::after {
    content: '';
    display: inline-block;
    width: 8rem;
    height: 8rem;
    border-top: 2rem solid #040000;
    border-right: 2rem solid #040000;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.event-list-box-title-right-extend::after {
    content: '';
    display: inline-block;
    width: 8rem;
    height: 8rem;
    border-top: 2rem solid #040000;
    border-right: 2rem solid #040000;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.event-list-box-introduction {
    /* font-weight: 400; */
    font-size: 18rem;
    color: #040000;
    margin-top: 15rem;
    width: 100%;
}

.event-list-box-images {
    margin-top: 20rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.event-list-box-images-item {
    width: calc(100% / 4 - 10rem);
    height: 135rem;
}

.event-list-box-detail-text {
    /* font-weight: 400; */
    font-size: 18rem;
    color: #040000;
    margin-top: 50rem;
    margin-bottom: 50rem;
}

.event-list-box-detail-image {
    width: 100%;
    margin-bottom: 20rem;
}

.event-list-box-detail-image-box {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20rem;
}

.event-list-box-detail-image-box-item {
    /* height: 365rem; */
    width: calc(100% / 2 - 10rem);
}

.event-list-box-detail-image-box-item1 {
    /* height: 600rem; */
    width: calc(100% / 3 - 10rem);
}

.events-video {
    width: 100%;
    height: 600rem;
    margin-top: 15rem;
    margin-bottom: 15rem;
    position: relative;
    border: 1rem solid #ffffff;
}

.events-video-active {
    z-index: 999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: fixed;
}

.events-video-play-new {
    position: absolute;
    left: calc(50% - 50rem);
    bottom: calc(50% - 50rem);
    width: 100rem;
    height: 100rem;
    opacity: 0.5;
    z-index: 10;
}

.events-video-play {
    position: absolute;
    left: 60rem;
    bottom: 30rem;
    width: 24rem;
    height: 24rem;
    opacity: 0.5;
    z-index: 10;
}

.events-video-play:hover {
}

.events-video-sound {
    position: absolute;
    left: 30rem;
    bottom: 30rem;
    width: 24rem;
    height: 24rem;
    opacity: 0.5;
    z-index: 10;
}

.events-video-sound:hover {
}

.events-video-full-screen {
    position: absolute;
    right: 30rem;
    bottom: 30rem;
    width: 24rem;
    height: 24rem;
    opacity: 0.5;
    z-index: 10;
}

.events-video-full-screen:hover {
}

.events-video-play-image {
    width: 100%;
    height: 100%;
}

.events-video-widget {
    width: 100%;
    height: 100%;
    /* object-fit: cover; */
}

.video-container {
    background-color: #040000;
}

.content-offline-stores {
    margin-top: 165rem;
    margin-bottom: 300rem;
    width: 100vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

.offline-stores-list-row {
    width: 100%;
    height: calc(100% / 3);
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1rem solid #727272;
    padding: 0 95rem;
}

.offline-stores {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 14rem;
    color: #040000;
}

.offline-stores-name {
    /* font-weight: 800; */
}

.offline-stores-info {
    /* font-weight: 400; */
    margin-top: 20rem;
}

.offline-stores-image-list {
    margin-top: 23rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.offline-stores-image-list-item {
    height: 150rem;
    width: calc(100% / 4 - 10rem);
}

.main-contact-us-box {
    margin-top: 50rem;
    width: 849rem;
    height: 44rem;
    padding-left: 45rem;
    padding-right: 15rem;
    border: 1rem solid #040000;
    border-radius: 10rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.main-contact-us-box-title {
    /* font-weight: 400; */
    font-size: 20rem;
    color: #040000;
    text-transform: none;
}

.main-contact-us-box-icon {
    width: 70rem;
    height: 30rem;
    border-radius: 10rem;
    border: 1rem solid #040000;
    background-color: #040000;
    display: flex;
    justify-content: center;
    align-items: center;
}

.main-contact-us-box-icon-image {
    height: 16rem;
}

.main-contact-us-image {
    margin-top: 40rem;
    width: 150rem;
    height: 150rem;
}

.clothes-details-right-info-close {
    position: absolute;
    top: 30rem;
    right: 240rem;
    width: 16rem;
    height: 16rem;
}

.clothes-details-right-info-close::before,
.clothes-details-right-info-close::after {
    position: absolute;
    left: 50%;
    width: 2rem;
    height: 100%;
    margin-left: calc(2rem / -2);
    content: '';
    background: #000;
}

.clothes-details-right-info-close::before {
    transform: rotate(-45deg);
}

.clothes-details-right-info-close::after {
    transform: rotate(45deg);
}

.clothes-details-right-info {
    padding-left: 240rem;
    height: 390rem;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

.clothes-details-right-info-brand {
    font-weight: 600;
    font-size: 22rem;
}

.clothes-details-right-info-name {
    font-weight: 600;
    font-size: 20rem;
    margin-top: 5rem;
}

.clothes-details-right-info-rmb {
    font-weight: 600;
    font-size: 22rem;
}

.clothes-details-right-info-material {
    /* font-weight: 400; */
    font-size: 14rem;
}

.clothes-details-right-info-code {
    /* font-weight: 400; */
    font-size: 18rem;
    margin-top: 5rem;
}

.clothes-details-right-detail {
    border-top: 1rem solid #727272;
    border-bottom: 1rem solid #727272;
    /* font-weight: 400; */
    font-size: 14rem;
    color: #231815;
}

.clothes-details-right-detail-title {
    height: 60rem;
    padding-left: 240rem;
    padding-right: 240rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 18rem;
}

.clothes-details-right-detail-info {
    margin-bottom: 20rem;
    padding-left: 240rem;
    padding-right: 240rem;
    /* font-weight: 400; */
    font-size: 15rem;
    color: #231815;
}

.clothes-details-right-detail-info-item {
    padding-bottom: 10rem;
}

.clothes-details-right-detail-icon::after {
    content: '';
    display: inline-block;
    width: 8rem;
    height: 8rem;
    border-top: 2rem solid #000;
    border-right: 2rem solid #000;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.clothes-details-right-detail-extend-icon::after {
    content: '';
    display: inline-block;
    width: 8rem;
    height: 8rem;
    border-top: 2rem solid #000;
    border-right: 2rem solid #000;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.clothes-details-right-size-list {
    padding-left: 240rem;
    padding-right: 240rem;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.clothes-details-right-size-box {
    margin-top: 50rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.clothes-details-right-size-box-item {
    width: 100rem;
    height: 40rem;
    /* margin-right: 30rem; */
    border: 1rem solid #040000;
    border-radius: 5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16rem;
    /* font-weight: 900; */
    color: #040000;
    line-height: 24rem;
}

.shoes-details-right-size-box-item {
    width: 40rem;
    height: 40rem;
    border: 1rem solid #040000;
    border-radius: 5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16rem;
    /* font-weight: 900; */
    color: #040000;
}

.clothes-details-right-size-guide {
    /* font-weight: 600; */
    font-size: 18rem;
    text-decoration: underline;
    color: #231815;
    margin-top: 20rem;
    display: flex;
}

.shoes-details-right-size-guide {
    /* font-weight: 600; */
    font-size: 18rem;
    text-decoration: underline;
    color: #231815;
    margin-top: 20rem;
    display: flex;
}

.clothes-details-right-buy {
    margin-top: 40rem;
    padding-left: 240rem;
    padding-right: 240rem;
    display: flex;
}

.clothes-details-right-buy-button {
    height: 40rem;
    width: 380rem;
    border-radius: 5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #7C7C7C;
    color: #FFFFFF;
    font-size: 12rem;
    /* font-weight: 900; */
}

.clothes-details-right-buy-cart {
    margin-left: 10rem;
    height: 40rem;
    width: 240rem;
    border-radius: 5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #7C7C7C;
    color: #FFFFFF;
    font-size: 12rem;
    /* font-weight: 900; */
}

.clothes-details-right-buy-cart-icon {
    margin-right: 10rem;
}

.clothes-details-right-prompt {
    margin-top: 35rem;
    padding-left: 240rem;
    padding-right: 240rem;
    /* font-weight: 600; */
    font-size: 18rem;
    color: #231815;
}

.clothes-details-right-services {
    margin-top: 45rem;
    margin-bottom: 45rem;
    display: flex;
    justify-content: center;
}

.clothes-details-right-size-table {
    margin-top: 30rem;
    /* width: calc(100% - 30rem); */
}

.clothes-details-right-size-table-row {
    margin-bottom: 5rem;
    display: flex;
    /* justify-content: space-between; */
}

.shoes-details-right-size-table-row-lable {
    width: 100rem;
    height: 30rem;
    border-radius: 3rem;
    background-color: #040000;
    color: #FFFFFF;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* font-weight: 900; */
    font-size: 10rem;
    color: #FFFFFF;
}

.shoes-details-right-size-table-row-item {
    width: 50rem;
    height: 28rem;
    border: 1rem solid #040000;
    border-radius: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    /* font-weight: 900; */
    font-size: 15rem;
    color: #040000;
    margin-left: 2rem;
    margin-right: 2rem;
}

.clothes-details-right-size-table-row-lable {
    width: 150rem;
    height: 30rem;
    border-radius: 3rem;
    background-color: #040000;
    color: #FFFFFF;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* font-weight: 900; */
    font-size: 10rem;
    color: #FFFFFF;
}

.clothes-details-right-size-table-row-item {
    width: 100rem;
    height: 28rem;
    border: 1rem solid #040000;
    border-radius: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    /* font-weight: 900; */
    font-size: 15rem;
    color: #040000;
    margin-left: 2rem;
    margin-right: 2rem;
}

.clothes-details-right-mask {
    position: absolute;
    right: 0;
    top: 0;
    width: 800rem;
    height: calc(100vh - 1268rem);
    background-color: #FFFFFF;
    border-left: 1rem solid #727272;
    border-bottom: 1rem solid #727272;
}

.shoes-details-right-mask {
    position: absolute;
    right: 0;
    top: 0;
    width: 800rem;
    height: calc(100vh - 1170rem);
    background-color: #FFFFFF;
    border-left: 1rem solid #727272;
    border-bottom: 1rem solid #727272;
}

.shoes-details-right-mask-close {
    position: absolute;
    top: 15rem;
    left: 15rem;
    width: 16rem;
    height: 16rem;
}

.shoes-details-right-mask-close::before,
.shoes-details-right-mask-close::after {
    position: absolute;
    left: 50%;
    width: 2rem;
    height: 100%;
    margin-left: (2rem / -2);
    content: '';
    background: #000;
}

.shoes-details-right-mask-close::before {
    transform: rotate(-45deg);
}

.shoes-details-right-mask-close::after {
    transform: rotate(45deg);
}

.shoes-details-right-mask-title {
    /* font-weight: bold; */
    font-size: 14rem;
    color: #231815;
    padding-left: 30rem;
    padding-top: 70rem;
    padding-bottom: 10rem;
    border-bottom: 1rem solid #727272;
}

.shoes-details-right-mask-container {
    height: calc(100% - 100rem);
    overflow: scroll;
    scroll-snap-type: y mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.shoes-details-right-mask-container::-webkit-scrollbar {
    display: none;
}


.shoes-details-right-mask-list {
    height: 250rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-bottom: 1rem solid #727272;
}

.shoes-details-right-mask-list-title {
    /* font-weight: bold; */
    font-size: 16rem;
    color: #231815;
}

.clothes-details-left-main {
    width: 650rem;
    height: 650rem;
}

.clothes-details-left-main-image {
    width: 100%;
    height: 100%;
    object-fit: scale-down;
}

.clothes-details-left-icon {
    margin-top: 30rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.clothes-details-left-icon-item {
    width: 20rem;
    height: 10rem;
    margin-left: 2rem;
    margin-right: 2rem;
    border: 1rem solid #040000;
    border-radius: 5rem;
}

.clothes-details-left-icon-item-active {
    width: 20rem;
    height: 10rem;
    margin-left: 2rem;
    margin-right: 2rem;
    border: 1rem solid #040000;
    border-radius: 5rem;
    background-color: #040000;
}

.clothes-details-left-thumb {
    margin-top: 30rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.clothes-details-left-thumb-item {
    width: 153rem;
    height: 153rem;
    /* padding: 15rem; */
    margin: 0 15rem;
    opacity: 0.6;
}

.clothes-details-left-thumb-item-active {
    width: 153rem;
    height: 153rem;
    /* padding: 15rem; */
    margin: 0 15rem;
    border: 1rem solid #040000;
}

.clothes-details-left-thumb-item-image {
    width: 100%;
    height: 100%;
    object-fit: scale-down;
}

/* 图片布局：一行显示，根据数量自动平分 */
.image-grid {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 8rem;
    width: 100%;
    overflow: hidden;
    margin-bottom: 20rem;
}

.image-grid-cover-extra {
    margin-top: 40rem;
}

.image-grid-flod-extra {
    margin-top: 40rem;
}

.image-grid img {
    display: block;
    height: auto;
    border-radius: 4rem;
    object-fit: cover;
    transition: transform 0.3s ease;
}

/* .image-grid img:hover {
    transform: scale(1.03);
} */

/* 图片数量适配（1-6张） */
.image-grid[data-count="1"] img {
    width: 100%;
}

.image-grid[data-count="2"] img {
    width: calc(50% - 10rem);
}

.image-grid[data-count="3"] img {
    width: calc(100% / 3 - 10rem);
}

.image-grid[data-count="4"] img {
    width: calc(25% - 10rem);
}

.image-grid[data-count="5"] img {
    width: calc(20% - 6.4rem);
}

.image-grid[data-count="6"] img {
    width: calc(100% / 6 - 6.67rem);
}

/* 线下店  start */
.offline-stores-container {
    width: 1200rem;
    /* border-bottom: 1rem solid #040000; */
    padding-bottom: 50rem;
}

.offline-stores {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 20rem;
    color: #040000;
}

.offline-stores-name {
    margin-top: 50rem;
    font-weight: 800;
}

.offline-stores-info {
    font-weight: 400;
    /* margin-top: 20rem; */
    text-transform: none;
}

.offline-stores-affiliated {
    font-family: MiSans, MiSans;
    font-weight: 500;
    font-size: 36rem;
    color: #000000;
    text-align: left;
    font-style: normal;
    text-transform: none;
    margin-top: 100rem;
}

.offline-stores-affiliated-list-row {
    display: flex;
    align-items: center;
    /* 垂直居中 */
    justify-content: center;
    /* 水平居中 */
    flex-direction: column;
    gap: 40rem;
    margin-top: 50rem;
    margin-bottom: 50rem;
    /* border: 1rem solid #ccc; */
    font-size: 16rem;
}

.store-group {
    display: flex;
    justify-content: start;
    justify-items: start;
    gap: 20rem;
    width: 100%;
    /* border: 1rem solid #ccc; */
    box-sizing: border-box;
}

.store-item {
    flex: 1;
    padding: 20rem;
    height: 100rem;
    width: 50%;
    max-width: 600rem;
}

.store-group:last-child {
    justify-content: left;
}

.store-location {
    display: flex;
    align-items: center;
    gap: 10rem;
    margin-bottom: 10rem;
}

.store-province {
    font-family: SourceHanSansSC, SourceHanSansSC;
    font-weight: 200;
    font-size: 29rem;
    color: #040000;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.store-mall {
    font-family: SourceHanSansSC, SourceHanSansSC;
    font-weight: 200;
    font-size: 24rem;
    color: #040000;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.store-address {
    font-family: SourceHanSansSC, SourceHanSansSC;
    font-weight: 200;
    font-size: 16rem;
    color: #040000;
    text-align: left;
    font-style: normal;
    text-transform: none;
}
/* 线下店  end */

/* 音乐视频  start */
.music-video-logo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 20rem 0;
    padding: 0 7%;
    width: 100%;
}

.music-video-logo-img {
    /* width: 182rem; */
    height: 100rem;
}

.music-video-logo-text {
    font-weight: 250;
    font-size: 20rem;
    font-family: MiSansVF, MiSansVF;
    color: #000000;
    text-transform: none;
}

.main-video {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.main-video-item {
    height: 100%;
    width: 86%;
    margin-top: 60rem;
}

.events-video-bottom-txt {
    display: flex;
    align-items: flex-end;
    margin-top: 20rem;
}

.events-video-bottom-txt-left {
    font-weight: bold;
    font-size: 33rem;
    font-family: MiSansVF, MiSansVF;
    color: #000000;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.events-video-bottom-txt-middle {
    font-weight: 500;
    font-size: 16rem;
    font-family: MiSansVF, MiSansVF;
    color: #000000;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.events-video-bottom-txt-right {
    font-weight: 500;
    font-size: 16rem;
    font-family: MiSansVF, MiSansVF;
    color: #000000;
    text-align: left;
    font-style: normal;
    text-transform: none;
}
/* 音乐视频 end */
.d-none {
    display: none !important;
}