@charset "utf-8";
html, body {margin: 0;padding: 0;}
IMG {border-width:0;}
* {list-style-type: none;margin: 0;padding: 0;font-family: 'Open Sans', sans-serif;}
a { text-decoration: none !important;color: #555}
a:hover {
    text-decoration: none;
}
.banner{width: 100%;margin:0 auto}
.banner img{display: block;width: 100%;height: auto}
@font-face{
    font-family:"majalla";
    src: url(../fonts/majalla.ttf)
}
.row{padding: 0}


@media (min-width: 768px) {
    .box{max-width: 1500px;padding: 0 30px;margin:0 auto}
    .headBox{width:100%;margin:0 auto;}
    .topInfo{width: 100%;background:#333335;color: #fff;height: 42px;text-align:right;line-height: 42px;font-size: .9rem}
    .logo-container{background: #fff;width: 100%;height:90px;padding:.6rem 0}
    .logoBox{display: flex;justify-content: space-between;background: #fff;align-items: self-end}
    .logoBox .left{flex:1;font-size: .95rem;color: #454545;flex-direction: row;display: flex;margin-bottom: 5px}
    .logoBox .left .phone{display: flex;align-items: center;cursor: pointer;transition: all .3s}
    .logoBox .left .address{display: flex;align-items: center;margin-left:.5rem;transition: all .3s}
    .logoBox .left .address a{color: #454545}
    .logoBox .left .phone:hover {opacity: .8;transform: translateX(.2rem)}
    .logoBox .left .address:hover{opacity: .8;transform: translateX(.2rem)}
    .logoBox .logo{flex:1;justify-content: center;text-align: center}
    .logoBox .right{flex:1;text-align: right;display: flex;justify-content: flex-end;margin-bottom: 5px}
    .logoBox .right .icon{padding: 0 5px;margin-left: 5px}
    .logoBox .right .icon img{width: 26px;height: 26px}
    .headBox.scroll {position: fixed;z-index: 10;animation: ease-in nav .4s;top:0}
    .headBox.scroll .topInfo{display: none}
    @keyframes nav{
        0%{transform: translateY(-20px);opacity: 0;}
        100%{transform: translateY(0);opacity: 1;}
    }
    .banner .swiper-pagination-bullet {
        background: #fff !important;
        width: 12px !important;
        height: 12px !important;
        opacity:.8 !important;

    }
    .banner .swiper-pagination{display: flex;align-items: center;justify-content: center;margin-bottom: 20px}
    .banner .swiper-pagination-bullet-active {
        width: 15px !important;
        height: 15px !important;
        border: 1px solid #d2a972 !important;
        padding: 2px;
        background: #d2a972 !important;
        background-clip: content-box !important;
        opacity: 1 !important;
    }
/*category*/
    .category{width: 100%;padding: 1.5rem 0}
    .category ul{padding: 0}
    .category img{display: block;margin:1rem auto;transition:all .3s}
    .category p{color: #797979;font-size: 1rem;text-align: center}
    .category a{color: #797979}
    .category li a:hover p{color:#957127}
    .category li:hover img{transform: translateY(5px)}
/*    Advantages*/
    .advantages{width: 100%;background:url(../images/advantage-bg.png) no-repeat 20% 10% #faf6f1;padding: 50px 30px}
    .advantages .head{font-size:2.5rem;text-align: center;margin-bottom:1rem;font-family:majalla;text-transform: uppercase}
    .advantages .large{color: #957127}
    .advantages .info-box{width: 100%;margin:1rem auto 0;display: flex;justify-content: space-between}
    .advantages .info{margin:3rem auto; width: 30%}
    .advantages .info-head{font-size: 1.5rem;color: #957127;
        text-overflow:ellipsis;white-space: nowrap;overflow: hidden;margin-bottom: 1.2rem}
    .advantages .info-article{font-size: 1rem;line-height:2;color: #3f3f3f;}

/*    Shop by Category*/
    .shop-category{margin:3rem auto;overflow: hidden}
    .headline{text-align: center;color: #010101;font-size: 3rem;margin:1rem auto;font-family: majalla;text-transform: uppercase}
    .shop-category ul{display: grid; grid-template-columns:repeat(3,1fr);gap:40px;margin:2rem auto;}
    .shop-category  img{width: 100%;aspect-ratio:4/3;object-fit:cover;transition: all .3s;}
    .shop-category .img-box{overflow: hidden}
    .shop-category li h4{font-size:1.1rem;font-weight: normal;text-align: center;margin-top:1rem;padding: .5rem 0;}
    .shop-category a{color: #555}
    .shop-category li:hover img{transform: scale(1.2)}
    .shop-category li:hover a{color: #957127}
/*   custom made*/
    .made-bg{background: #f5ede1;padding: 1.5rem 0}
    .made-box{display: flex;align-items: center;justify-content: space-between;padding: 0 4%}
    .made-l{width: 52%}
    .made-r{width: 48%}
    .made-l-title{font-size: 1.2rem;color: #3b3b3b}
    .made-l-subtitle{font-size:.95rem;color: #3b3b3b}
    .made-button{border-radius: 5px;font-size: .95rem;margin-top: 2rem;
        background: #d2a972;color: #fff;display: inline-block;padding: 0.5rem 1.5rem}
/*    Most-Loved Engagement Rings*/
    .hot-selling{margin:3.5rem auto}
    .wrapper-box{width: 100%;margin:2rem auto;display: block;position: relative;overflow: hidden}
    .hot-selling .swiper{padding-top:4rem;margin-top:-5rem}
    .scroll-box{margin:1.5rem auto;}
    .hot-box{width: 100%;margin: 1rem auto;position: relative}
    .hot-box .heart{width:26px;height: 24px;top:1.2rem;right: 1.2rem;position: absolute;z-index: 2}
    .hot-box .img-box{box-shadow: 0px 6px 32px 0px #79797914;overflow: hidden;}
    .hot-box .img-box img{width: 100%;aspect-ratio: 1/1;object-fit: cover;transition: all .5s}
    .hot-box:hover .img-box img{transform: scale(1.2)}
    .hot-box .title{font-size:1rem;font-weight: normal;margin:1rem auto .5rem;color: #3d3d3d;display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 2;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;}
    .hot-box .price-box{font-size:1rem;color: #957127}
    .hot-box .price-box .price{font-weight: 700;color: #957127;font-size: 1.2rem}
    .scroll-box .swiper-button-next{width: 43px;height: 43px;background:url(../images/arrow-r.png) no-repeat center center;background-size: 100%;top:25px;}
    .scroll-box .swiper-button-prev{width: 43px;height: 43px;background:url(../images/arrow-l.png) no-repeat center center;background-size: 100%;top:25px;left:calc(100% - 120px)}
    .scroll-box .swiper-button-next:after, .swiper-button-prev:after{display: none}
/*    promise*/
    .promise{margin:2rem auto 2.5rem;overflow: hidden}
    .subhead{font-size: .95rem;line-height: 1.5;width:90%;max-width: 1200px;text-align: center;margin: 1rem  auto}
    .promise-article{width: 90%;max-width: 1280px;margin:3rem auto;
        display: flex;justify-content: space-between;align-items: center}
    .promise-article-info{display: inline-flex;align-items: center}
    .promise-article-info .r{font-size:1.2rem}
    .promise-article-info .r span{display: block}
    .promise-article-info img{width: 80px;height: 80px;}
/*     Boutique*/
    .boutique{width:100%;background: url("../images/boutique-bg.jpg")  center  center no-repeat #fbf9f7;
        background-size: cover; height: 530px;margin:3rem auto 4rem;overflow: hidden}
    .boutique-box{position: relative;max-width: 1500px;padding:0 30px;display: flex;justify-content: flex-end;margin: 0 auto}
    .boutique-box .right{width:370px;height:535px;background:#fbf9f7;padding: 3rem 1.5rem 3rem 3rem;box-sizing: border-box }
    .boutique-box .right-head{font-size:2.4rem;font-family: majalla;text-transform: uppercase}
    .boutique-box .right-name{font-size: 1.6rem;margin: 2rem auto}
    .boutique-box .right-article{font-size: 1rem; color: #323539}
    .boutique-l{position: absolute;width:530px;background:rgba(201,157,102, .8);color: #fff;bottom:2rem;left: 0;padding:1.8rem 2rem;}
    .boutique-l h3{font-size: 2.8rem;color: #fff;font-family: majalla}
    .boutique-l article{font-size: 1rem;color: #fff;}
    .boutique-l article .email{margin:.5rem auto;}

/*    bottom*/
    .bottom-box{width: 100%;background: #333335;padding: 2rem 0 0 0;overflow: hidden}
    .bottom-box .title-box{margin:2rem auto;color: #f8f2e7;max-width: 1200px;}
    .bottom-box .title-box .title{font-size: 2rem;margin:.5rem auto;text-align: center}
    .bottom-box .title-box .subtitle{font-size: 1rem;margin:.5rem auto;text-align: center}
    .bottom-form{display: flex;justify-content:center;align-items: center}
    .bottom-form input{width: 370px;border-radius:4px;border:solid 1px #666; color: #999;
        margin: 10px 20px;padding: 0 10px;height: 45px;background: none}
    .bottom-form .signup{width: 170px;border-radius: 5px;background: #8e7352;border: none;color: #fff;height: 45px}
    .bottom-menu{border-top: solid 1px #464647;border-bottom: solid 1px #464647;margin: 2rem auto 0}
    .bottom-menu .menu{display: flex;justify-content: space-between;margin: 3.5rem auto 0}
    .bottom-menu .menu ul{width: 23%;padding: 0}
    .bottom-menu .menu h2{font-size:1.2rem;color: #f2f2f2;font-weight: normal;padding: .5rem 0;margin-bottom: 1rem}
    .bottom-menu .menu li{font-size:1rem;color:#bababa;line-height:2}
    .bottom-menu .menu a{color: #bababa;padding: .6rem 0}
    .bottom-menu .menu .follow{margin-top: 2rem}
    .bottom-menu .menu .follow a{padding:.6rem .4rem}
    .copyright{font-size:.9rem;color: #aeaeae;text-align: right;padding: .8rem 0}
/*  top-search*/
    #aa{
        cursor:pointer;border: none;background: none;
    }
    .searchBox{
        display:none;
        position:fixed;
        width: 100%;background: #F8F2E7;
        padding: 1.5rem;
        min-height: 200px;
        border-radius:6px;
        box-shadow:0 4px 5px rgba(0,0,0,.05);
        z-index: 9;
    }

    .search-content{position: relative}
    .searchBox   .search-content .close{
        position:absolute;
        right:10px;
        top:6px;
        background:none;
        border:none;
        color:#000;
        font-size:3rem;
        cursor:pointer;
    }
    .search-form{width: 100%;}
    .search-form .input-box{width: 70%;height:2.3rem; border-bottom: solid 1px #ccc;display: flex;align-items: center;font-size: 1rem}
    .search-form .input-box img{width: 1.2rem;height: 1.2rem;margin-right: .5rem }
    .search-form .input-box input{width: 100%;background: none;height:2rem;outline:none;border: none;font-size: 1rem;}
    .search-info{margin:3rem auto 2rem;display: flex;justify-content: space-between}
    .search-info-l{width:35%;}
    .search-info-l h2{font-size: 1.1rem}
    .search-info-l li{font-size: .95rem;line-height:1.5;}
    .search-info-l li a{color: #444;padding: .3rem 0;display: block}
    .search-info-r{width: 60%;display: flex;justify-content: flex-end}
    .search-info-r ul,.search-info-l ul{margin-top: 1rem;padding: 0}
    .search-info-r .about{padding: 0 1rem}
    .search-info-r .about h2{font-size: 1.1rem}
    .search-info-r .about li a{color: #444;padding: .3rem 0;display: block;font-size: .95rem}
/*    list-product*/
    .inner-position{margin:1rem auto;font-size: 1rem; color: #323232}
    .inner-position a{color: #323232}
    .inner-position .bi-chevron-right{margin:0 .2rem}
    .introduce{background: #faf6f1;padding: 2rem 0}

    .content-wrapper {
        position: relative;
        overflow: hidden;
        transition: max-height 0.5s ease;
    }

    .content-wrapper.collapsed {
        max-height: 5.2rem;
    }
    .content-wrapper.expanded {
        max-height: 10rem;
    }
    .content {

        font-size: .9rem;
        line-height: 1.8;
        text-align: center;
        color: #666;
    }
    .toggle-btn {
     color: #957127;text-align: center;margin:1rem auto;display: block;
        border: solid 1px #957127;padding: .2rem 1rem;font-size: .95rem;background: none;border-radius: .5rem;
    }
    .toggle-btn:active {
        transform: translateY(0);
    }

    .content-wrapper.expanded .fade-overlay {
        opacity: 0;
    }
    .introduce .head{font-size:3rem;text-align:center;font-family: majalla}
    .introduce .article{font-size: .95rem;line-height: 1.6;text-align: center;color: #666}
/*    list-classify*/
    .list-classify{display: flex;justify-content: space-between;margin:1.5rem auto}
    .list-classify .group{padding: 0;width:24%;}
    .list-classify .group h2{font-size: .95rem;color:#957127;padding-left: 1rem;text-transform: uppercase}
    .list-classify .group-box{width: 80%;margin:0 auto;position: relative;overflow: hidden}
    .list-classify .group-box img{display: block;margin:0 auto;height:36px}
    .list-classify .group-box p{width: 100%;overflow: hidden;font-size: .8rem;
        text-overflow: ellipsis;white-space: nowrap;color: #555;text-align: center}

    .group .swiper-button-prev{background:url(../images/classify-arrowL.png) no-repeat left center;background-size: 100%;width: 16px;height: 28px}
    .group .swiper-button-next{background:url(../images/classify-arrowr.png) no-repeat left center;background-size: 100%;width: 16px;height: 28px}
    .group .swiper-button-next:after{display: none}
    .line-fill{width: 100%;min-height: 1px;background: #eee;margin: 1rem auto 1rem;padding: 0.8rem 30px;max-width: 1500px}
    .line-fill .selected-tags{display: flex;flex-wrap: wrap;align-items: center;gap: 0.5rem}
    .line-fill .tag{display: inline-flex;align-items: center;background: #f5f5f5;border: 1px solid #ddd;padding: 0.4rem 0.8rem;border-radius: 4px;font-size: 0.9rem;color: #333;transition: all 0.2s}
    .line-fill .tag:hover{background: #e8e8e8;border-color: #ccc}
    .line-fill .tag .remove-icon{margin-left: 0.5rem;cursor: pointer;font-size: 1.2rem;font-weight: bold;color: #999;transition: color 0.2s}
    .line-fill .tag .remove-icon:hover{color: #d9534f}
    .line-fill .clear-all{color: #d9534f;font-size: 0.9rem;text-decoration: none;padding: 0.4rem 0.8rem;transition: all 0.2s}
    .line-fill .clear-all:hover{color: #c9302c;text-decoration: underline}
/*     */
    .dropdown-search{display: flex;justify-content: space-between;}
    .dropdown-search .dropdown-menu{border: none;box-shadow: 0  0 10px 1px #eee}
    .dropdown-search .left{width:70%}
    .dropdown-search .right{width: 30%;display: flex;justify-content: flex-end}
    .dropdown-search .item{float:left;margin-right:30px}
    .dropdown-info{width:480px;padding:1rem;overflow: hidden}
    .dropdown-info ul{padding: 0}
    .dropdown-info li{width: 33.3%;padding: 0 1%;font-size: .95rem;float: left;margin: .1rem 0}
    .dropdown-info li a{color: #333;padding: .3rem;display: block}
    .dropdown-info li:hover{background:#f4e8da;}
    .dropdown-info li:hover a{color: #957127;font-weight: 700}
    .drop-price{width:200px;padding:1rem;overflow: hidden}
    .drop-price li{width: 100%;margin: .3rem 0}
    .dropdown-search .dropdown-toggle::after{background: url("../images/drop-arrow.png") center no-repeat;width: 18px;height: 10px;content: "";display: inline-block;border: none }
    .dropdown-search .dropdown-toggle.show::after{background: url("../images/drop-arrow.png") center no-repeat;width: 18px;height: 10px;transform: rotate(180deg);
        content: "";display: inline-block;border: none }
    .dropdown-search .nav-link {display: flex;align-items: center}
    .search-num{margin:1rem auto;padding: 1rem 30px; color: #957127;
        font-size: 1rem;border-top:solid 1px #eee;border-bottom: solid 1px #eee}
    .list-pro{margin:2rem auto}
    .list-pro ul{display:grid;grid-template-columns: repeat(4,1fr);padding:0;gap: 30px}
    .list-pro .hot-box{margin: 0}
/*  详情*/
    .detail-box{margin: 3rem auto;display:flex;justify-content: space-between}
    .detail-box-l{width:50%;}
    .detail-box-l .pic-remark{font-size: .85rem;text-align: center;color: #666;width: 90%;margin:1.5rem auto}
    .detail-box-l .share{width: 96%;margin:0 auto;display: flex;align-items: center;justify-content: center}
    .detail-box-l .share img{margin: 0 5px}
    .detail-box-l .share span{font-size: 1rem;color: #d2a973;margin-left: 1rem}
    .detail-box-r{width: 47%;}
    .select-box{background:#faf6f1;padding: 3rem 2rem}
    .select-box .title{font-size:1.5rem;line-height: 1.5;color: #333;font-weight: 700}
    .select-box .price{margin: 1rem auto}
    .select-box .price-line{font-size:1.5rem;text-decoration: line-through;color: #444}
    .select-box .price-discount{font-size: 1.6rem;color: #895806;font-weight: 700;margin-left: .2rem}
    .select-box .choose{width: 100%;border-bottom:solid 1px #f4e8da;padding:.8rem 0;
        display: flex;justify-content: space-between;align-items:center;overflow: hidden}
    .choose-l{width: 85px;font-size: .9rem;color: #333}
    .choose-r{width: calc(100% - 90px)}
    .choose-color{width: 100%;}
    .choose-color ul{padding: 0;display: flex;flex-wrap: wrap;margin-bottom: 0}
    .choose-color li{width: 8%;margin-right: 2%;cursor: pointer}
    .choose-color li img{width: 100%;aspect-ratio: 1/1;border-radius: 50px;}
    .choose-color li p{color: #3b3b3b;width:100%;font-size: .75rem;text-align: center;margin: 0;
        overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
    .choose-color li.active img{border: solid 1px #895806;padding: 1px}
    .choose-color li.active p{color:#895806;padding: 1px}
    .choose-block{width: 100%;}
    .choose-block ul{padding: 0;margin:0;display: flex;flex-wrap: wrap}
    .choose-block li{padding:.3rem 1rem;border:solid 1px #d2a972; unicode-bidi:
            normal!important;
        background:#faf6f1;font-size: .85rem;text-align: center;margin:0 .3rem .3rem 0;
        display: inline-block;cursor: pointer}
    .choose-block li.active{background: #d2a972;color: #fff;border: solid 1px #b28322;}
    .cart-price{width: 100%;background: #bc8945;padding: .5rem 0;color: #fff;border-radius: .3rem;
        font-size: 1.2rem;text-align: center;display: flex;align-items: center;border: none;justify-content: center}
    .cart-price img{width: 1.3rem;height: auto;margin-right: .5rem}
    .cart-price:hover{background: #ab7329;}
/*    Product Description*/
    .pro-description{
        background: #faf6f1;margin-top:2rem;width: 100%;padding: 1rem 0;
    }
    .pro-description .accordion-item{background:none;border:none}
    .pro-description .accordion-button{background: #f4e8da;font-weight: 700;color: #957127;font-size: 1.2rem}
    .pro-description .accordion-button:focus{border-color:#fff!important;box-shadow: none!important;}
    .pro-description .accordion-button:not(.collapsed){background: #f4e8da;font-weight: 700;color: #957127;}
    .accordion-button:not(.collapsed)::after{background-image: var(--bs-accordion-btn-icon)!important; }
    .description-list {margin:1rem auto;width: 98%}
    .description-list ul{padding: 0}
    .description-list li{display: flex;align-items: center;padding: .8rem 0;
        justify-content: space-between;border-bottom:solid 1px #f4e8da;}
    .description-list li .l{width: 180px;font-size: 1rem;color: #333}
    .description-list li .r{width: calc(100% - 210px);font-size: 1rem;color: #333;text-align: right}
    .description-list .total{font-weight: 700;color: #957127!important;}
    .description-info{margin: 2rem auto;width: 96%;}
    .description-info .title{font-size: 1.1rem;color: #333;margin-bottom: 1rem;font-weight: 600}
    .description-info .article{font-size: .9rem;color: #555;line-height:1.6}
    .pro-box{width: 100%;}
    .main-box{width: 80%;overflow: hidden;margin:0 auto}
    .pro-box .swiper-slide-thumb-active{border: solid 1px #d2a972!important;padding: 1px}
   .pro-box .swiper-button-next{width: 43px;height: 43px;background:url(../images/pro-arrowr.png) no-repeat center center;}
    .pro-box .swiper-button-prev{width: 43px;height: 43px;background:url(../images/pro-arrowl.png) no-repeat center center;}
    .pro-box .swiper-button-next:after, .pro-box  .swiper-button-prev:after{display: none}
    .main-swiper .swiper-slide img {
        transition: transform 0.3s ease;
        cursor: zoom-in;
    }

    .main-swiper .swiper-slide img:hover {
        transform: scale(1);
    }
    .gallery-container {
        margin: 0 auto;
        position: relative;
    }
    .main-swiper {
        width: 100%;
        margin: 0 auto;
    }
    .main-slide {
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }
    .main-slide img {
        width: 100%;
        aspect-ratio: 1/1;
        object-fit: cover;

        cursor: crosshair;
    }
    .thumbnail-swiper {
        width: 74%;
        margin: 1rem auto;
        padding: 10px;
    }
    .thumbnail-slide {
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        opacity: 0.6;
        transition: opacity 0.3s, border-color 0.3s;
    }
   .thumbnail-slide.swiper-slide-thumb-active{transition: all .3s}
    .thumbnail-slide:hover, .thumbnail-slide.swiper-slide-thumb-active {
        opacity: 1;
    }
    .thumbnail-slide img {
        width: 100%;
        aspect-ratio:  1/1;
        object-fit: cover;
    }
    .magnifier {
        position: absolute;
        left:100%;
        top: 0;
        width: 450px;
        height: 450px;
        border: 1px solid #ddd;
        background: #fff;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
        overflow: hidden;
        display: none;
        z-index: 10;
    }
    .magnifier img {
        position: absolute;
        max-width:800px;
        aspect-ratio: 1/1;
        object-fit: cover;
    }
/* ABOUT*/
    .inner-box{margin:3rem auto}
    .inner-title{font-size:2.2rem;text-align: left;border-bottom: solid 1px #dedede;font-family: majalla;
        margin:10px auto;padding:10px 15px 0 15px;color: #333;font-weight: bold}
    .inner-title::after{content: "";width: 70px;height:6px;border-radius:10px;display: block;margin:10px 0 -3px;background: #c99d66}
    .inner-content{font-size: .95rem;line-height: 1.8;color: #444;margin:2rem auto}
    /*    sign*/
    .sign-box{padding:2rem 20px;box-sizing: border-box;overflow: hidden;display: flex;align-items: center;justify-content: space-between;
        margin:25px auto;background:#c99d66;
        background-size: cover;color: #fff}
    .sign-l{width: 75%;padding-left:30px}
    .sign-r{width: 25%;text-align: center}
    .sign-title{font-size: 26px;text-transform: uppercase;font-weight: 700}
    .sign-info{font-size: 1rem;}
    .sign-btn{border: solid 1px #dedede;padding:10px 2.5rem;color: #fff;font-size:1rem;margin:0 auto;display: inline-block}
    .sign-btn:hover{background: #fff;color:#222}
/*    contact us*/
    .contactinfo{margin:2rem 0;}
    .contactinfo ul{width: 90%;float: right;padding: 45px 35px}
    .contactinfo .bt{font-size: 1.5rem;color: #000;line-height: 40px;margin:0 auto 30px}
    .contactinfo li{width:100%;overflow: hidden;margin:10px 0 25px}
    .contactinfo li .l{width:57px;float: left;}
    .contactinfo li .l img{max-width: 100%}
    .contactinfo li .r{width:calc(100% - 80px);float: right}
    .contactinfo li .r h2{font-size:1.1rem;margin:5px 0  0;color: #333}
    .contactinfo li .r p{font-size: 1rem;line-height: 26px;color: #555}
    /*form*/
    .formk{width:97%;overflow: hidden;margin:1.5rem 0 2rem}
    .formk h2{font-size: 1.1rem;background: #fdf8f2;color: #957127;padding: 1rem;border-radius: .3rem}
    .formk h3{font-size: .85rem;padding:.2rem 1rem .5rem;color: #555}
    .formk ul{overflow: hidden;padding: 0}
    .formk article{font-size: .9rem;text-align: center;padding:0 0 15px;width: 95%; line-height:1.8;margin-bottom: 20px}
    .formk .k{width: 100%;float: left;padding:3px 0  3px 20px;line-height: 35px;
        margin:5px 3% 5px 0;border-radius: 3px;border:solid 1px #7c7c7c}
    .formk .k1{width: 100%;float: left;padding-left: 20px;
        line-height: 35px;margin:5px 3% 5px 0;border-radius: 3px;border:solid 1px #7c7c7c;min-height: 100px}
    .formk .k2{width: 30%;float: left;padding-left:20px;line-height: 35px;margin:5px 3% 5px 0;border-radius: 3px;border:solid 1px #7c7c7c}
    .formk button {
        width:100%;
        text-align: center;
        line-height: 40px;
        background:#c99d66;
        font-size: 1rem;
        color: #fff;
        display: block;
        border-radius: 2px;
        border: none;
        margin-top: 1.5rem;
    }
    .formk input::placeholder{font-size: .9rem}
    .help-box{margin:2rem auto}
    .help-box .accordion-item{background:none;border:solid 1px #f2e7c3;margin-bottom: .5rem}
    .help-box .accordion-button{background: #f4e8da;font-weight: 700;color: #957127;font-size: .95rem;}
    .help-box .accordion-button:focus{border-color:#fff!important;box-shadow: none!important;}
    .help-box .accordion-button:not(.collapsed){background: #f4e8da;font-weight: 700;color: #957127;}
    .help-content{font-size: .85rem;line-height: 1.6;color: #555}
    .help-contact{margin:1.5rem auto;}
    .help-contact ul{padding: 1rem 1.5rem;margin-top: 2rem;border-radius: .8rem }
    .help-contact li{display: flex;justify-content: space-between;margin:1rem 0}
    .help-contact li .l{width:45px;float: left;}
    .help-contact li .l img{max-width: 100%}
    .help-contact li .r{width:calc(100% - 55px);float: right}
    .help-contact li .r h2{font-size:1.1rem;margin:5px 0 .3rem}
    .help-contact li .r p{font-size: .9rem;line-height: 1.5;color: #555}
    .promise-bg{background:url("../images/detail-promise.jpg") no-repeat center;padding:.1rem 0 0 0;background-size: cover}

}





@media (max-width: 1024px) {
    /*    Advantages*/
    .advantages{width: 100%;background:url(../images/advantage-bg.png) no-repeat 20% 10% #faf6f1;padding: 50px 0}
    .advantages .head{font-size:2.5rem;text-align: center;margin-bottom:1rem;font-family:majalla;text-transform: uppercase}
    .advantages .large{color: #957127}
    .advantages .info-box{width: 100%;margin:1rem auto 0;display: flex;justify-content: space-between}
    .advantages .info{margin:2rem auto; width: 32%}
    .advantages .info-head{font-size: 1.2rem;color: #957127;
        text-overflow:ellipsis;white-space: nowrap;overflow: hidden;margin-bottom: 1.2rem}
    .advantages .info-article{font-size: .95rem;line-height:1.5;color: #3f3f3f;}
    .phone-nav{width: 100%;margin:0 auto;height:3.4rem}
    .phone-top{position: fixed;width: 100%;padding: .2rem 1rem;box-shadow: 0 0 5px 2px #eee;
        top:0;left: 0;background: #fff;display: flex;justify-content: space-between;align-items: center;z-index: 20}
    .phone-l{display: flex;align-items: center}
    .phone-logo img{height:2.8rem;width: auto}
    .nav-toggle{font-size: 2.2rem;border:none;background: none}

    .phone-icon{flex:1;text-align: right;display: flex;justify-content: flex-end;margin-bottom: 5px}
    .phone-icon  .icon{padding: 0 5px;margin-left: 5px}
    .phone-icon  .icon img{width:1.4rem;height:1.4rem}

    .side-menu {
        position: fixed;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background:#fbf9f7;
        transition: left 0.3s ease;
        z-index: 1000;
    }
    .side-menu ul{padding: 0;width: 90%;margin: 0 auto;}
    .side-menu.active {
        left: 0;
    }
    .close-btn{font-size: 1.8rem;border:none;padding-left: 1rem;margin-top: .5rem;background: none}
    .side-menu li{display: flex;justify-content: space-between;align-items: center;border-bottom: solid 1px #dedede;padding: .8rem 0}
    .side-menu li .classify{color: #333;font-size: 1rem}
    .side-menu li a{color: #333}
    .menu-item{font-size: 1.2rem}
    .side-menu .phone{background:#f5ede1;padding:.8rem 1rem;font-size: 1rem;margin:1px auto;}
    .side-menu .phone a{color: #333}
    /* submenu */
    .sub-menu {
        position: fixed;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: #f5f5f5;
        transition: left 0.3s ease;
        z-index: 1001;
    }

    .sub-classify{width: 96%;margin:1rem auto;border-bottom: solid 1px #dedede}
    .sub-classify a{color:#333}
    .sub-classify h2{font-size:1rem;margin-bottom:1rem}
    .sub-classify ul{display: flex;padding:0;font-size: .9rem;justify-content: space-between;align-items: center;flex-wrap: wrap;}
    .sub-classify li{width: 48%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
    .sub-classify li a{display: flex;align-items: center;overflow: hidden;width: 100%;white-space: nowrap;text-overflow: ellipsis;padding: .3rem 0}
    .sub-classify .stone{font-size: .85rem}
    .sub-classify .stone img{width: 1.2rem;height: auto;}
    .back-btn{border: none;background: none;font-size: 1rem;padding:.5rem .3rem}
    .back-btn .bi-arrow-left{font-size: 1.2rem;}
        .sub-menu.active {
        left: 0;
    }
    /*phone-search*/
    .search-form1{width: 96%;margin:.5rem auto}
    .search-form1 .input-box{width: 100%;height:2.8rem; border-bottom: solid 1px #ccc;display: flex;align-items: center;font-size: 1rem}
    .search-form1 .input-box img{width: 1.2rem;height: 1.2rem;margin-right: .5rem }
    .search-form1 .input-box input{width: 80%;background: none;height:2.3rem;outline:none;border: none;font-size: 1rem;}
    .search-form1 .input-box button{width: 20%;font-size: .95rem;text-align: center;color: #fff;border: none;line-height: 2rem;
        border-radius: .5rem;background: #957127}

}
@media (max-width: 767.98px) {

    .phone-nav{width: 100%;margin:0 auto;height:3.4rem}
    .phone-top{position: fixed;width: 100%;padding: .2rem 1rem;box-shadow: 0 0 5px 2px #eee;
        top:0;left: 0;background: #fff;display: flex;justify-content: space-between;align-items: center;z-index: 20}
    .phone-l{display: flex;align-items: center}
    .phone-logo img{height:2.8rem;width: auto}
    .nav-toggle{font-size: 2.2rem;border:none;background: none}

    .phone-icon{flex:1;text-align: right;display: flex;justify-content: flex-end;margin-bottom: 5px}
    .phone-icon  .icon{padding: 0 5px;margin-left: 5px}
    .phone-icon  .icon img{width:1.4rem;height:1.4rem}

    .side-menu {
        position: fixed;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background:#fbf9f7;
        transition: left 0.3s ease;
        z-index: 1000;
    }
    .side-menu ul{padding: 0;width: 90%;margin: 0 auto;}
    .side-menu.active {
        left: 0;
    }
    .close-btn{font-size: 1.8rem;border:none;padding-left: 1rem;margin-top: .5rem;background: none}
    .side-menu li{display: flex;justify-content: space-between;align-items: center;border-bottom: solid 1px #dedede;padding: .8rem 0}
    .side-menu li .classify{color: #333;font-size: 1rem}
    .side-menu li a{color: #333}
    .menu-item{font-size: 1.2rem}
    .side-menu .phone{background:#f5ede1;padding:.8rem 1rem;font-size: 1rem;margin:1px auto;}
    .side-menu .phone a{color: #333}

    /* submenu */
    .sub-menu {
        position: fixed;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: #f5f5f5;
        transition: left 0.3s ease;
        z-index: 1001;
    }
    .sub-classify{width: 96%;margin:1rem auto;border-bottom: solid 1px #dedede}
    .sub-classify a{color:#333}
    .sub-classify h2{font-size:1rem;margin-bottom:1rem}
    .sub-classify ul{display: flex;padding:0;font-size: .9rem;justify-content: space-between;align-items: center;flex-wrap: wrap;}
    .sub-classify li{width: 48%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
    .sub-classify li a{display: flex;align-items: center;overflow: hidden;width: 100%;white-space: nowrap;text-overflow: ellipsis;padding: .3rem 0}
    .sub-classify .stone{font-size: .85rem}
    .sub-classify .stone img{width: 1.2rem;height: auto;}
    .back-btn{border: none;background: none;font-size: 1rem;padding:.5rem .3rem}
    .back-btn .bi-arrow-left{font-size: 1.2rem;}
    .sub-menu.active {
        left: 0;
    }
    /*phone-search*/
    .search-form1{width: 96%;margin:.5rem auto}
    .search-form1 .input-box{width: 100%;height:2.8rem; border-bottom: solid 1px #ccc;display: flex;align-items: center;font-size: 1rem}
    .search-form1 .input-box img{width: 1.2rem;height: 1.2rem;margin-right: .5rem }
    .search-form1 .input-box input{width: 80%;background: none;height:2.3rem;outline:none;border: none;font-size: 1rem;}
    .search-form1 .input-box button{width: 20%;font-size: .95rem;text-align: center;color: #fff;border: none;line-height: 2rem;
        border-radius: .5rem;background: #957127}

    .banner{width: 100%;}
    .banner img{width:100%;object-fit: cover;}
    .banner .swiper-pagination{display: flex;align-items: center;justify-content: center;margin-bottom:8px}
    .banner .swiper-pagination-bullet-active {
        width: 15px !important;
        height: 15px !important;
        border: 1px solid #d2a972 !important;
        padding: 2px;
        background: #d2a972 !important;
        background-clip: content-box !important;
        opacity: 1 !important;
    }
    .box{padding: 0 20px}
    .line-fill{padding: 0.8rem 20px}
    /*category*/
    .category{width: 100%;padding:1rem 1.5rem }
    .category ul{padding: 0}
    .category img{display: block;margin:1rem auto;transition:all .3s}
    .category p{color: #797979;font-size: .9rem;text-align: center;margin-bottom: .2rem}
    .category a{color: #797979}
    .category li a:hover p{color:#957127}
    .category li:hover img{transform: translateY(5px)}
    /*    Advantages*/
    .advantages{width: 100%;background:url(../images/advantage-bg.png) no-repeat 20% 10% #faf6f1;padding: 30px 20px}
    .advantages .head{font-size:2rem;text-align: center;margin-bottom:1rem;font-family:majalla;text-transform:uppercase;line-height: 1}
    .advantages .large{color: #957127}
    .advantages .info-box{width: 100%;margin:0 auto 0;display: block;}
    .advantages .info{margin:1.5rem auto; width: 100%}
    .advantages .info-head{font-size: 1.2rem;color: #957127;
        text-overflow:ellipsis;white-space: nowrap;overflow: hidden;margin-bottom: .5rem}
    .advantages .info-article{font-size: .9rem;line-height:1.5;color: #3f3f3f;}

    /*    Shop by Category*/
    .shop-category{margin:1.5rem auto 0;overflow: hidden}
    .headline{text-align: center;color: #010101;font-size: 1.9rem;margin:1rem auto;font-family: majalla;text-transform: uppercase;padding: 0 .5rem;line-height: 1}
    .shop-category ul{display: grid; grid-template-columns:repeat(2,1fr);gap:20px;margin:2rem auto;padding: 0 10px}
    .shop-category  img{width: 100%;aspect-ratio:4/3;object-fit:cover;transition: all .3s;}
    .shop-category .img-box{overflow: hidden}
    .shop-category li h4{font-size:.9rem;font-weight: normal;text-align: center;padding: .5rem 0;}
    .shop-category a{color: #555}
    .shop-category li:hover img{transform: scale(1.2)}
    .shop-category li:hover a{color: #957127}
    /*   custom made*/
    .made-bg{background: #f5ede1;padding: 1.5rem 0}
    .made-box{display: block;align-items: center;justify-content: space-between;padding: 0 4%}
    .made-l{width: 100%;margin:0 auto}
    .made-l img{width: 60%;margin:0 auto;display: block}
    .made-r{display: block;width: 75%;margin:0 auto}
    .made-r img{width: 80%}
    .made-l-title{font-size: 1.05rem;color: #3b3b3b;line-height: 1.2;margin-top: 1rem}
    .made-l-subtitle{font-size:.9rem;color: #444;margin-top: 1rem}
    .made-button{border-radius: 5px;font-size: .95rem;margin: 1rem auto;line-height: 1.2;text-align: center;
        background: #d2a972;color: #fff;display:block;padding: 0.5rem 1.5rem;width: 90%}
    /*    Most-Loved Engagement Rings*/
    .hot-selling{margin:2rem auto 0}
    .wrapper-box{width: 98%;margin:1rem auto;display: block;position: relative;overflow: hidden}
    .hot-selling .swiper{margin:0 auto;padding-bottom: 50px}
    .scroll-box{margin:0rem auto;}
    .hot-box{width: 100%;margin: 1rem auto;position: relative}
    .hot-box .heart{width:26px;height: 24px;top:1.2rem;right: 1.2rem;position: absolute;z-index: 2}
    .hot-box .img-box{box-shadow: 0px 6px 32px 0px #79797914;overflow: hidden;}
    .hot-box .img-box img{width: 100%;aspect-ratio: 1/1;object-fit: cover;transition: all .5s}
    .hot-box:hover .img-box img{transform: scale(1.2)}
    .hot-box .title{font-size:.9rem;font-weight: normal;margin:1rem auto .5rem;color: #3d3d3d;   display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 2;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;}
    .hot-box .price-box{font-size:1rem;color: #957127}
    .hot-box .price-box .price{font-weight: 700;color: #957127;font-size: 1.2rem}
    .scroll-box .swiper-button-next{width: 43px;height: 43px;background:url(../images/arrow-r.png) no-repeat center center;background-size: 100%;top:calc(100% - 50px);left:calc(70% - 50px)}
    .scroll-box .swiper-button-prev{width: 43px;height: 43px;background:url(../images/arrow-l.png) no-repeat center center;background-size: 100%;top:calc(100% - 50px);left:calc(50% - 50px)}
    .scroll-box .swiper-button-next:after, .swiper-button-prev:after{display: none}
    /*    promise*/
    .promise{margin:0.5rem auto;overflow: hidden}
    .subhead{font-size: .9rem;line-height: 1.5;width:90%;max-width: 1200px;text-align: center;margin: .8rem  auto}
    .promise-article{width: 90%;max-width: 1280px;margin:1rem auto;
        display: block;justify-content: space-between;align-items: center}
    .promise-article-info{display: inline-flex;align-items: center}
    .promise-article-info .r{font-size:1.05rem;margin-left: 10px}
    .promise-article-info .r span{display:inline-block}
    .promise-article-info img{width: 45px;height: 45px;}
    /*     Boutique*/
    .boutique{width:100%;background: url("../images/boutique-bg.jpg")  center  center no-repeat #fbf9f7;
        background-size: cover; height:120vw;margin:0rem auto 2rem;overflow: hidden}
    .boutique-box{position: relative;max-width: 1500px;padding:0 30px;margin: 0 auto;height: 100%}
    .boutique-box .right{display:none }
    .boutique-box .right-head{display: none}
    .boutique-box .right-name{display: none}
    .boutique-box .right-article{font-size: 1rem; color: #323539}
    .boutique-l{position: absolute;width：98%;background:rgba(201,157,102, .8);color: #fff;bottom:2rem;left: 0;padding:1.8rem 2rem;z-index: 15}
    .boutique-l h3{font-size: 2.8rem;color: #fff;font-family: majalla}
    .boutique-l article{font-size: 1rem;color: #fff;}
    .boutique-l article .email{margin:.5rem auto;}

    /*    bottom*/
    .bottom-box{width: 100%;background: #333335;padding: 2rem 0 0 0;overflow: hidden}
    .bottom-box .title-box{margin:1.2rem auto 1.2rem;color: #f8f2e7;max-width: 1200px;}
    .bottom-box .title-box .title{font-size:1.6rem;margin:.5rem auto;text-align: center}
    .bottom-box .title-box .subtitle{font-size: .85rem;margin:.5rem auto;text-align: center;padding: 0 .5rem;box-sizing: border-box}
    .bottom-form{display: block;width: 90%;margin:0 auto}
    .bottom-form input{width: 100%;border-radius:4px;border:solid 1px #666; color: #999;
        margin: 10px auto;padding: 0 10px;height: 45px;background: none}
    .bottom-form .signup{width: 100%;border-radius: 5px;background: #8e7352;border: none;color: #fff;height: 45px;margin:0 auto}
    .bottom-menu{border-top: solid 1px #464647;border-bottom: solid 1px #464647;margin: 2rem auto 0}
    .bottom-menu .menu{display: grid;}
    .bottom-menu .menu ul{width: 100%;padding: 0;display: none}
    .bottom-menu .menu h2{font-size:1.2rem;color: #f2f2f2;font-weight: normal;padding: .5rem 0;margin: 1rem 0}
    .bottom-menu .menu li{font-size:.9rem;color:#bababa;line-height:1.8}
    .bottom-menu .menu a{color: #bababa;padding: .6rem 0}
    .bottom-menu ul:last-child{display: block}
    .bottom-menu .menu .follow{margin-top:1rem}
    .bottom-menu .menu .follow a{padding:.6rem .4rem}
    .copyright{font-size:.9rem;color: #aeaeae;text-align: right;padding: .8rem 1rem;text-align: center}
    /*    list-product*/
    .inner-position{margin:1rem auto;font-size: .9rem; color: #323232}
    .inner-position a{color: #323232}
    .inner-position .bi-chevron-right{margin:0 .2rem}
    .introduce{background: #faf6f1;padding: 1rem 0}
    .content-wrapper {
        position: relative;
        overflow: hidden;
        transition: max-height 0.5s ease;
    }
    .content-wrapper.collapsed {
        max-height: 4.6rem;
    }
    .content-wrapper.expanded {
        max-height: 10rem;
    }
    .content {

        font-size: .9rem;
        line-height: 1.6;
        text-align: center;
        color: #666;
    }
    .toggle-btn {
        color: #957127;text-align: center;margin:.3rem auto;display: block;
        border: solid 1px #957127;padding: .1rem 1rem;font-size: .9rem;background: none;border-radius: .5rem;
    }
    .toggle-btn:active {
        transform: translateY(0);
    }
    .content-wrapper.expanded .fade-overlay {
        opacity: 0;
    }
    .introduce .head{font-size:2rem;text-align:center;font-family: majalla}
    .introduce .article{font-size: .95rem;line-height: 1.6;text-align: center;color: #666}
    /*    list-classify*/
    .list-classify{display:block;margin:1rem auto}
    .list-classify .group{padding: 0;width:100%;}
    .list-classify .group:nth-of-type(2){display: none}
    .list-classify .group:nth-of-type(3){display: none}
    .list-classify .group:nth-of-type(4){display: none}
    .list-classify .group h2{font-size: .95rem;color:#957127;padding-left: 1rem;text-transform: uppercase}
    .list-classify .group-box{width: 80%;margin:0 auto;position: relative;overflow: hidden}
    .list-classify .group-box img{display: block;margin:0 auto;height:36px}
    .list-classify .group-box p{width: 100%;overflow: hidden;font-size: .8rem;
        text-overflow: ellipsis;white-space: nowrap;color: #555;text-align: center}

    .group .swiper-button-prev{background:url(../images/classify-arrowL.png) no-repeat left center;background-size: 100%;width: 16px;height: 28px}
    .group .swiper-button-next{background:url(../images/classify-arrowr.png) no-repeat left center;background-size: 100%;width: 16px;height: 28px}
    .group .swiper-button-next:after{display: none}
    .line-fill{width: 100%;min-height: 1px;background: #eee;margin: 1rem auto 1rem;padding: 0.8rem 30px;max-width: 1500px}
    .line-fill .selected-tags{display: flex;flex-wrap: wrap;align-items: center;gap: 0.5rem}
    .line-fill .tag{display: inline-flex;align-items: center;background: #f5f5f5;border: 1px solid #ddd;padding: 0.4rem 0.8rem;border-radius: 4px;font-size: 0.9rem;color: #333;transition: all 0.2s}
    .line-fill .tag:hover{background: #e8e8e8;border-color: #ccc}
    .line-fill .tag .remove-icon{margin-left: 0.5rem;cursor: pointer;font-size: 1.2rem;font-weight: bold;color: #999;transition: color 0.2s}
    .line-fill .tag .remove-icon:hover{color: #d9534f}
    .line-fill .clear-all{color: #d9534f;font-size: 0.9rem;text-decoration: none;padding: 0.4rem 0.8rem;transition: all 0.2s}
    .line-fill .clear-all:hover{color: #c9302c;text-decoration: underline}
    /*     */
    .dropdown-search{display: flex;justify-content: space-between;}
    .dropdown-search .dropdown-menu{border: none;box-shadow: 0  0 10px 1px #eee}
    .dropdown-search .left{width:70%}
    .dropdown-search .right{width: 30%;display: flex;justify-content: flex-end}
    .dropdown-search .item{float:left;margin-right:30px}
    .dropdown-search .item:nth-of-type(2){display: none}
    .dropdown-info{width:480px;padding:1rem;overflow: hidden}
    .dropdown-info ul{padding: 0}
    .dropdown-info li{width: 33.3%;padding: 0 1%;font-size: .95rem;float: left;margin: .1rem 0}
    .dropdown-info li a{color: #333;padding: .3rem;display: block}
    .dropdown-info li:hover{background:#f4e8da;}
    .dropdown-info li:hover a{color: #957127;font-weight: 700}
    .drop-price{width:200px;padding:1rem;overflow: hidden}
    .drop-price li{width: 100%;margin: .3rem 0}
    .dropdown-search .dropdown-toggle::after{background: url("../images/drop-arrow.png") center no-repeat;width: 18px;height: 10px;content: "";display: inline-block;border: none }
    .dropdown-search .dropdown-toggle.show::after{background: url("../images/drop-arrow.png") center no-repeat;width: 18px;height: 10px;transform: rotate(180deg);
        content: "";display: inline-block;border: none }
    .dropdown-search .nav-link {display: flex;align-items: center}
    .search-num{margin:1rem auto;padding: .5rem 30px; color: #957127;
        font-size: .9rem;border-top:solid 1px #eee;border-bottom: solid 1px #eee}
    .list-pro{margin:2rem auto}
    .list-pro ul{display:grid;grid-template-columns: repeat(2,1fr);padding:0;gap:1.5rem}
    .list-pro .hot-box{margin: 0}
    /*  详情*/
    .detail-box{margin: 2rem auto;padding: 0}
    .detail-box-l{width:100%;}
    .detail-box-l .pic-remark{display: none}
    .detail-box-l .share{display:none}
    .detail-box-l .share img{margin: 0 5px}
    .detail-box-r{width: 100%;}
    .select-box{background:#faf6f1;padding:2rem 1rem}
    .select-box .title{font-size:1.3rem;line-height: 1.5;color: #333;font-weight: 700}
    .select-box .price{margin: 1rem auto}
    .select-box .price-line{font-size:1.3rem;text-decoration: line-through;color: #444}
    .select-box .price-discount{font-size: 1.6rem;color: #895806;font-weight: 700;margin-left: .2rem}
    .select-box .choose{width: 100%;border-bottom:solid 1px #f4e8da;padding:.8rem 0;
        display: flex;justify-content: space-between;align-items:center;overflow: hidden}
    .choose-l{width: 85px;font-size: .85rem;color: #333}
    .choose-r{width: calc(100% - 90px)}
    .choose-color{width: 100%;}
    .choose-color ul{padding: 0;display: flex;flex-wrap: wrap;margin-bottom: 0}
    .choose-color li{width:13%;margin-right: 3%;cursor: pointer;margin-bottom: .3rem}
    .choose-color li img{width: 100%;aspect-ratio: 1/1;border-radius: 50px;}
    .choose-color li p{color: #3b3b3b;width:100%;font-size: .75rem;text-align: center;margin: 0;
        overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
    .choose-color li.active img{border: solid 1px #895806;padding: 1px}
    .choose-color li.active p{color:#895806;padding: 1px}
    .choose-block{width: 100%;}
    .choose-block ul{padding: 0;margin:0;display: flex;flex-wrap: wrap}
    .choose-block li{padding:.2rem 1rem;border:solid 1px #d2a972; display: flex;align-items: center;text-align: center;justify-content: center;
        background:#faf6f1;font-size: .85rem;margin:0 .3rem .3rem 0;
        cursor: pointer}
    .choose-block li.active{background: #d2a972;color: #fff;border: solid 1px #b28322;}
    .cart-price{width: 100%;background: #bc8945;padding: .5rem 0;color: #fff;border-radius: .3rem;
        font-size: 1.2rem;text-align: center;display: flex;align-items: center;border: none;justify-content: center}
    .cart-price img{width: 1.3rem;height: auto;margin-right: .5rem}
    .cart-price:hover{background: #ab7329;}
    /*    Product Description*/
    .pro-description{
        background: #faf6f1;margin-top:2rem;width: 100%;padding: 1rem 0;
    }
    .pro-description .accordion-item{background:none;border:none}
    .pro-description .accordion-button{background: #f4e8da;font-weight: 700;color: #957127;font-size: 1.1rem}
    .pro-description .accordion-button:focus{border-color:#fff!important;box-shadow: none!important;}
    .pro-description .accordion-button:not(.collapsed){background: #f4e8da;font-weight: 700;color: #957127;}
    .accordion-button:not(.collapsed)::after{background-image: var(--bs-accordion-btn-icon)!important; }
    .description-list {margin:1rem auto;width: 98%}
    .description-list ul{padding: 0}
    .description-list li{display: flex;align-items: center;padding: .8rem 0;
        justify-content: space-between;border-bottom:solid 1px #f4e8da;}
    .description-list li .l{width: 180px;font-size: .9rem;color: #333}
    .description-list li .r{width: calc(100% - 210px);font-size: .9rem;color: #333;text-align: right}
    .description-list .total{font-weight: 700;color: #957127!important;}
    .description-info{margin: 2rem auto;width: 96%;}
    .description-info .title{font-size: 1.1rem;color: #333;margin-bottom: 1rem;font-weight: 600}
    .description-info .article{font-size: .9rem;color: #555;line-height:1.6}
/*    */
    .pro-box{width: 100%;}
    .pro-box .main-box{width: 82%;overflow: hidden;margin:0 auto}
    .pro-box .swiper-slide-thumb-active{border: solid 1px #957127;padding: 1px}
    .pro-box .swiper-button-next{width: 43px;height: 43px;background:url(../images/pro-arrowr.png) no-repeat right center;}
    .pro-box .swiper-button-prev{width: 43px;height: 43px;background:url(../images/pro-arrowl.png) no-repeat left center;}
    .pro-box .swiper-button-next:after, .pro-box  .swiper-button-prev:after{display: none}
    .main-swiper {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }
    .main-slide img {
        width: 100%;
        aspect-ratio: 1/1;
        object-fit: cover;

        cursor: crosshair;
    }
    .thumbnail-swiper {
        width: 80%;
        margin: 1rem auto;
        padding: 0 2px;
    }
    .thumbnail-slide {
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        opacity: 0.6;
        transition: opacity 0.3s, border-color 0.3s;
    }
    .thumbnail-slide.swiper-slide-thumb-active{transition: all .3s}
    .thumbnail-slide:hover, .thumbnail-slide.swiper-slide-thumb-active {
        opacity: 1;
    }
    .thumbnail-slide img {
        width: 100%;
        aspect-ratio:  1/1;
        object-fit: cover;
    }
    .magnifier{display: none}
    /* ABOUT*/
    .inner-box{margin:1.8rem auto}
    .inner-title{font-size:2rem;text-align: left;border-bottom: solid 1px #dedede;font-family: majalla;
        margin:10px auto;padding:0 15px 0 15px;color: #333;font-weight: bold}
    .inner-title::after{content: "";width: 60px;height:5px;border-radius:10px;display: block;margin:2px 0 -3px;background: #c99d66}
    .inner-content{font-size: .85rem;line-height: 1.8;color: #444;margin:1rem auto}
    /*    sign*/
    .sign-box{padding:20px;box-sizing: border-box;overflow: hidden;display: block;
        margin:1.2rem auto;background:#c99d66;
        background-size: cover;color: #fff}
    .sign-l{width: 100%;margin: 0 auto;}
    .sign-r{width: 100%;text-align: center}
    .sign-title{font-size:1rem;text-transform: uppercase;font-weight: 700;margin-top:.5rem}
    .sign-info{font-size: .85rem;line-height: 1.2rem}
    .sign-btn{border: solid 1px #fafafa;width: 95%;padding: .3rem 0;
        color: #fff;font-size: 1rem;margin:1rem auto;display: inline-block}
    .sign-btn:hover{background: #fff;color:#222}
    /*    contact us*/
    .contactinfo{margin:.5rem 0;}
    .contactinfo ul{width: 100%;float: right;padding:.5rem 1rem}
    .contactinfo .bt{font-size: 1.5rem;color: #000;line-height: 40px;margin:0 auto 30px}
    .contactinfo li{width:100%;overflow: hidden;margin:10px 0 1rem}
    .contactinfo li .l{width:50px;float: left;}
    .contactinfo li .l img{max-width: 100%}
    .contactinfo li .r{width:calc(100% - 55px);float: right}
    .contactinfo li .r h2{font-size:1rem;margin:5px 0  0}
    .contactinfo li .r p{font-size: .9rem;line-height: 26px}
    /*form*/
    .formk{width:100%;overflow: hidden;margin:1.5rem 0 2rem}
    .formk h2{font-size: 1rem;background: #fdf8f2;color: #957127;padding:.5rem 1rem;border-radius: .3rem}
    .formk h3{font-size: .85rem;padding: .3rem 1rem;}
    .formk ul{overflow: hidden;padding: 0}
    .formk article{font-size: .9rem;text-align: center;padding:0 0 15px;width: 95%; line-height:1.8;margin-bottom: 20px}
    .formk .k{width: 100%;float: left;padding:3px 0  3px 20px;line-height: 35px;font-size: .9rem;
        margin:5px 3% 5px 0;border-radius: 3px;border:solid 1px #7c7c7c}
    .formk .k1{width: 100%;float: left;padding-left: 20px;font-size: .9rem;
        line-height: 35px;margin:5px 3% 5px 0;border-radius: 3px;border:solid 1px #7c7c7c;min-height:80px}
    .formk .k2{width: 30%;float: left;font-size: .9rem;padding-left:20px;line-height: 35px;margin:5px 3% 5px 0;border-radius: 3px;border:solid 1px #7c7c7c}
    .formk button {
        width:100%;
        text-align: center;
        line-height: 40px;
        background:#c99d66;
        font-size: 1rem;
        color: #fff;
        display: block;
        border-radius: 2px;
        border: none;
        margin-top: 1.5rem;
    }
    .formk input::placeholder{font-size: .9rem}
    .help-box{margin:2rem auto}
    .help-box .accordion-item{background:none;border:solid 1px #f2e7c3;margin-bottom: .5rem}
    .help-box .accordion-button{background: #f4e8da;font-weight: 700;color: #957127;font-size: .95rem;}
    .help-box .accordion-button:focus{border-color:#fff!important;box-shadow: none!important;}
    .help-box .accordion-button:not(.collapsed){background: #f4e8da;font-weight: 700;color: #957127;}
    .help-content{font-size: .85rem;line-height: 1.6;color: #555}
    .help-contact{margin:1.5rem auto;display: none}
    .help-contact ul{padding: 1rem 1.5rem;margin-top: 2rem;border-radius: .8rem }
    .help-contact li{display: flex;justify-content: space-between;margin:1rem 0}
    .help-contact li .l{width:45px;float: left;}
    .help-contact li .l img{max-width: 100%}
    .help-contact li .r{width:calc(100% - 55px);float: right}
    .help-contact li .r h2{font-size:1.1rem;margin:5px 0 .3rem}
    .help-contact li .r p{font-size: .9rem;line-height: 1.5;color: #555}
    .help .col-12{padding: 0}
    .promise-bg{background:url("../images/detail-promise.jpg") no-repeat right;padding:.1rem 0 0 0;background-size: cover}


}

/*页码*/
.list-page {
    text-align: center;
    width: 98%;
    margin: 1rem auto;display: flex;justify-content: center;
}

.pagination a {

    color: #0b112a !important
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 3;
    color: #fff !important;
    cursor: default;
    background-color: #333 !important;
    border-color: #ddd !important;
}
/*顶部*/
.cd-top {
    display: inline-block;
    height: 40px;
    width: 40px;
    position: fixed;
    bottom: 40px;
    right: 10px;
    border: solid 1px #3d3d3d;
    border-radius: 40px;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.05);
    /* image replacement properties */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    z-index: 28;
    background: rgba(255, 255, 255) url(../images/drop-arrow.png) no-repeat center 50%;
    transform: rotate(180deg);

    opacity: 1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
.cd-top.cd-is-visible {
    /* the button becomes visible */
    visibility: visible;
    opacity: 1;
}
.cd-top.cd-fade-out {
    opacity: .8;
}
.no-touch .cd-top:hover {
    background-color:#fff;
    opacity: 1;
}
@media only screen and (min-width: 768px) {
    .cd-top {
        right: 20px;
        bottom: 20px;
    }
}
@media only screen and (min-width: 1024px) {
    .cd-top {
        height: 55px;
        width: 55px;
        right: 30px;
        bottom: 30px;
        border-radius: 55px;
        border: solid 1px #3d3d3d;
    }
}

/* 多选功能：高亮已选中的选项 */
.list-classify .swiper-slide a.selected {
    background: #f4e8da;
    border-radius: 8px;
}
.list-classify .swiper-slide a.selected p {
    color: #957127;
    font-weight: 700;
}
.dropdown-info li a.selected {
    background: #f4e8da;
    color: #957127 !important;
    font-weight: 700;
}