
/*通用*/
/*#ea5703;*/
.space_top_1{ padding-top:1em;}
.space_top_2{ padding-top: 2em;}
.space_top_3{ padding-top: 3em;}
.space_top_4{ padding-top: 4vh;}
.space_memu{ padding-top:5em}

.mainpage{opacity: 0;pointer-events:auto;position: relative;z-index: 2; margin-bottom: 96vh;top:0 }
.header{opacity: 0}


.menu .sub-menu-parent:hover ul{opacity: 1;visibility:visible;-webkit-transition: all 0.4s ease 0s;-moz-transition: all 0.4s ease 0s;transition: all 0.4s ease 0s;padding-top:0.5rem;transition-delay: 0.3s;}
.menu .sub-menu-parent:hover {}
.menu .sub-menu-parent:hover ul{}
.menu .sub-menu-parent:hover ul li:hover a{font-weight: 400;}

.lang{position: fixed;right: 3%;line-height: 50px;font-size: 1.4rem;top: 0;z-index: 333;color: #FFF;}
.lang a{color: #FFF;padding-left: 5px}
.lang a:hover,.lang a.active{font-weight: 400}
.lang a:nth-child(1){margin-right: 5px}
.sub-menu-parent { position: relative; }

.sub-menu { white-space:nowrap;
  visibility: hidden; /* hides sub-menu */
  opacity: 0;
  position: absolute;
  top: 100%; 
  left: 0;
  width: 100%;padding-top: -4rem;
  /*transform: translateY(-2em);*/
  z-index: -1;
  transition: all 0.2s ease-in-out 0s, visibility 0s linear 0.2s, z-index 0s linear 0.01s;
	width: 60px;text-align: left;
}
.sub-menu li{float: left;line-height: 2;width: 100%;}


.sub_menu{margin:1.5rem 0 0 3%;z-index:5;top: 0;font-size: 1.5rem;display: flex;justify-content: space-between;}
.sub_menu li{float: left;flex: 1;margin-right: 4rem;}
.sub_memu li a{border-bottom: 1px solid rgba(255,255,255,0)}
.sub_menu li:hover a,.sub_menu li.active a{font-weight: 400;border-bottom: 1px solid var(--color-text)}


.brand_nav{width: 100%;text-align: center;}
.brand_nav a{line-height: 10rem;font-size: 1.5rem;margin:0 2rem;border-bottom: 1px solid rgba(231,182,183,0)}
.brand_nav a:hover,.brand_nav a.active{border-bottom: 1px solid var(--color-text)}



@media screen and (max-width:1000px){
/*	.top_banner{display: none}*/
	.mainpage{}
	.lang{display: none;opacity: 0}
	.lang a{display: none;}
	.top_banner{}
	.sub_menu{font-size: 1.3rem;margin:1.5rem 0 0 6%;}
	.sub_menu li{float: none;line-height: 2;}
	
}


.float_title{position: absolute;z-index: 11; bottom: 5rem;text-align: center;width: 100%;color: #FFF;}
.float_title a{color: #FFF;}
.float_titleC{position: absolute;z-index: 11; bottom: 5rem;text-align: center;width: 100%;color:var(--color-text);font-weight: 700}
.float_titleC a{color:var(--color-text);}

/* Keyframes for rolling effect */
@keyframes rolling-underline {
    0% {
        transform: translateX(-100%);
    }
    50% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(100%);
    }
}


.home_fullmovie{position: relative;}
/*.home_fullslide{position: relative;height: 100vh;}*/



.home_style{clear: both;overflow: hidden;padding-top: 8rem}
.home_style h3{text-align: center;padding: 60px 0;}
.home_style ul li{float: left;width:calc(50% - 75px);margin-left: 50px;position: relative;background:#FFF;}
.home_style ul li a{position: absolute;opacity: 0;z-index: -1;left: 50%;top: 50%;transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);color: #FFF;font-size: 1.6rem;padding: 1rem 4rem;border: 1px solid #FFF;}
.home_style ul li:nth-child(2n){margin-right:50px;}
.home_style ul li:nth-child(1),.home_style ul li:nth-child(2){margin-bottom: 2%;}
.home_style ul li h5{position: absolute;left: 2rem; top: 2rem;}
.home_style ul li:hover h5{opacity: 0}
.home_style ul li:hover img{opacity: 0}
.home_style ul li:hover{background: var(--color-menu-bg);}
.home_style ul li:hover a{opacity: 1;z-index: 2;}

.text_white{color:#FFF;}
.text_color{color:var(--color-text);}

@media screen and (max-width:760px){
	.home_style ul{margin: 0 6%;}
	.home_style ul li{width:48%;margin:0 4% 0 0;}
	.home_style ul li:nth-child(2n){margin-right: 0;}
	.home_style ul li h5{position: relative;left: 0;top: 1rem}
	.home_style ul li:nth-child(1),.home_style ul li:nth-child(2){margin-bottom:10%;}
	
	.home_style ul li:hover img{opacity: 1}
	.home_style ul li:hover a{opacity: 0;}
	.home_style ul li:hover h5{opacity: 1}
	
	.home_style ul li:hover{background: none;}
	
	.float_title,.float_titleC{bottom: 2rem;}
		
	
}


.home_news{clear: both;padding: 0 14% 5vh 14% ;width: 100%;margin-bottom: 35vh;overflow: hidden}
.home_news>div{display:-webkit-box;}
.home_news h3{text-align: center;padding: 100px 0;}
.home_news .box_video{width: 35%;float: left;}
.home_news .box_info{width: 65%;float: right;position: relative;}

.home_news .box_info .center_box{position: absolute;left: 45%;top: 50%;transform: translate(-30%, -50%);-webkit-transform: translate(-30%, -50%);-moz-transform: translate(-30%, -50%);-ms-transform: translate(-30%, -50%);text-align: center;}
.home_news .box_info .center_box h4{font-weight: 400;}
.home_news .box_info .center_box article{margin: 44px 0;text-align: left}
.home_news .box_info .center_box a{font-size:1.6rem;font-weight: 400;}
.home_news .box_info .center_box a:hover{}


.home_news>div{display: flex;align-items: stretch;}

@media screen and (max-width:760px){
	.home_news{clear: both;padding: 0 0 5vh 0 ;}
	.home_news>div{display:block}
	.home_news .box_video{width: 100%}
	.home_news .box_info{width:100%;float: left;padding-top: 8rem;width:88%;margin: 0 6%;}
	.home_news .box_info .center_box{position: relative;left: 0;top:0;transform: translate(0, 0);-webkit-transform: translate(0, 0);-moz-transform: translate(0, 0);-ms-transform: translate(0, 0);}
	.home_news>div{flex-direction: column;}
}



.home_product{padding: 10rem 10%;overflow: hidden;}
.home_product ul{}
.home_product ul li{background: #F9F9F9;text-align: center;padding:3rem 0;}

.home_product h5{max-width: 400px;text-align: center;font-weight: 300;margin-top: 1.5rem;font-size: 1.3rem;}
.home_product ul li:hover img{transform: scale(1.05);}
.home_product .swiper-slide img {max-width: 400px;}



.home_product .swiper-button-prev, .home_product .swiper-rtl .swiper-button-next{color: var(--color-text); padding-left:30%;z-index: 20}
.home_product .swiper-button-next, .home_product .swiper-rtl .swiper-button-prev{color:var(--color-text); padding-right:30%;z-index: 20}
.home_product .swiper-button-next:after,.home_product .swiper-button-prev:after{font-size:1.5rem;width: 10%;}

@media screen and (max-width:1024px){
	
	.home_product{padding: 10rem 4%;}
	
}
@media screen and (max-width:760px){
	.home_product .swiper-slide {width: 70%;padding-left: 6%;}
	.home_product .swiper-slide img{background: #F9F9F9;}				
	.home_product .swiper-slide h5{line-height: 3;}
}



@media screen and (max-width:760px){
	.home_product{}
}	

.home_bigbox{clear: both;margin:8rem 0;overflow: hidden;position: relative;clear: both}
.smalllogo{height: 20px; width: 50%; background: url("../Images/logoC.svg") no-repeat left top;background-size:auto 100%;margin:0 0 5px 50px;}







.home_join{clear: both;text-align: center;padding-top:12rem;padding-bottom: 80px;}
.home_join a{font-size: 1.4rem;line-height: 2;padding-right: 2rem; background: url("../Images/icon/icon_body.svg") no-repeat right center;background-size: auto 1.4rem;}



.ad{margin: 10rem 0;}




.topimg{margin-top: 4rem;}

.list4{ overflow: hidden;clear: both;}
.list4>ul{overflow: hidden;padding-bottom: 10rem}
.list4>ul>li{width: calc(25% - 37.5px); margin-right: 50px; float: left;margin-top: 50px;padding-bottom: 20px;cursor:pointer;}
.list4>ul>li:nth-child(4n){margin-right: 0;}
.list4>ul>li:nth-child(4n+1){clear: both}
.list4>ul>li h5{font-size: 1.4rem;margin-top: 2rem;overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;}
.list4>ul>li p{font-size: 1.4rem;}
.list4>ul>li p::before{content: '￥'}



@media screen and (max-width:760px){
	.list4>ul>li{width: calc(50% - 5px); margin-right: 10px;}
	.list4>ul>li:nth-child(2n){margin-right: 0}
}	



.list3 .inlogo{background: url("../Images/logoC.svg") no-repeat center center;background-size: 20rem auto;width: 100%;height: 10rem;margin-top: 15rem}


.list3{ overflow: hidden;clear: both;}
.list3>ul{overflow: hidden;padding-bottom: 10rem;margin: 0 10%;width: 80%;}
.list3>ul>li{width: calc(33.333% - 33.333px); margin-right: 50px; float: left;margin-top: 50px;padding-bottom: 10px;}
.list3>ul>li:nth-child(3n){margin-right: 0}
.list3>ul>li:nth-child(3n+1){clear: both}
.list3>ul>li h5{font-size: 1.3rem;float: left;line-height: 3;}
.list3>ul>li p{font-size: 1.3rem;float: right;line-height:3;}
.list3>ul>li p::before{content: '￥'}


@media screen and (max-width:760px){
	.list3 .inlogo{margin-top: 5rem}
	.list3>ul{overflow: hidden;padding-bottom: 10rem;margin: 0 6%;width: 88%;}
	.list3>ul>li{width: calc(50% - 10px); margin-right: 20px;}
	.list3>ul>li:nth-child(3n){margin-right: 20px;}
	.list3>ul>li:nth-child(2n){margin-right: 0}
	
	
	.list3>ul>li:nth-child(3n+1){clear:none}
	
}	


.list3_bag{ overflow: hidden;clear: both;}
.list3_bag>ul{overflow: hidden;padding-bottom: 10rem;margin: 0 10%;width: 80%;}
.list3_bag>ul>li{width: calc(33.333% - 33.333px); margin-right: 50px; float: left;margin-top: 50px;padding-bottom: 10px;}
.list3_bag>ul>li img{background: #f5f5f5;cursor:pointer;}
.list3_bag>ul>li:nth-child(3n){margin-right: 0}
.list3_bag>ul>li:nth-child(3n+1){clear: both}
.list3_bag>ul>li h5{font-size: 1.3rem;margin-top: 2rem;}
.list3_bag>ul>li p{font-size: 1.3rem;}
.list3_bag>ul>li p::after{content: ' RMB'}




@media screen and (max-width:760px){
	.list3_bag>ul{overflow: hidden;padding-bottom: 10rem;margin: 0 6%;width: 88%;}
	.list3_bag>ul>li{width: calc(50% - 10px); margin-right: 20px;}
	.list3_bag>ul>li:nth-child(3n){margin-right: 20px;}
	.list3_bag>ul>li:nth-child(2n){margin-right: 0}
	
	
	.list3_bag>ul>li:nth-child(3n+1){clear:none}
	
}	



.image-container { position: relative; aspect-ratio: 3/4; /* 保持容器 16:9 比例 */overflow: hidden;cursor:pointer;background: #f1f1f1;}
.image-container img {  width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0;transition: opacity 0.3s ease;background: #ECE0D4 }
.image-container img.hidden { opacity: 0; }


.link{margin: 0 auto;clear: both;overflow: hidden; text-align: center;font-size: 1.4rem;}
.link span{width: 600px;border-bottom: 1px solid var(--color-text);line-height: 100px;height: 100px;display: block;margin: 0 auto;}
.link a{}

.gototop{margin: 0 auto;clear: both;overflow: hidden; text-align: center}
.gototop span{line-height: 100px;height: 100px;display: block;margin: 0 auto;}
.gototop a{font-size: 1.4rem;background: url("../Images/icon/icon_gotop.svg") no-repeat center center;background-size: auto 2.2rem;padding-top:4.5rem}



@media screen and (max-width:760px){
	.link span{width: 100%}
}	










.colorcircle_right{width: 50%;overflow: hidden;float: right;}
.colorcircle_right li{width: 14px;height: 14px;float: right;margin-right: 5px;border-radius: 8px;cursor:pointer;}
.colorcircle_right li:hover{border: 1px solid var(--color-text);}


.colorcircle_left{width: 50%;overflow: hidden;float: left;clear: both}
.colorcircle_left li{width: 14px;height: 14px;float: left;margin-right: 5px;border-radius: 8px;cursor:pointer;}
.colorcircle_left li:hover{border: 1px solid var(--color-text);}



.bottom_space{width:100%;height:110vh;opacity: 1;pointer-events:none;background: rgba(107,94,94,0.5);clear: both;}
.bottom_box{padding:30px 3% 0 3%;position:fixed;bottom:0;width: 100%;height:600px;z-index: 0;margin-top: calc(100vh - 690px)}

.coverbottom{background: #FFF;}

@media screen and (max-width:760px){
	
	.colorcircle_right li{width: 10px;height: 10px;float: right;margin-right: 5px;border-radius: 5px;cursor:pointer;margin-top: 6px;}
	
	
	.bottom_box{height: 470px}
}


.bottom{width: 100%;clear: both;position: relative;z-index:1; border-bottom: 1px solid var(--color-text);border-top: 1px solid var(--color-text);
border-top: 1px solid #dddddd;border-bottom: 1px solid #dddddd}
.bottom ul{background: #FFF;padding: 50px 25px;font-size: 1.3rem;}
.bottom ul li{margin-bottom: 3rem;} 
.bottom ul li:nth-child(2){margin-top: -2rem;}
.bottom ul li:nth-child(3) a{padding-right: 25px; background: url("../Images/icon/icon_zoom.svg") no-repeat right center;background-size: auto 1.7rem;display: inline-block}
.bottom ul li:nth-last-child(1){margin-bottom:0;}
.bottom ul li a{margin-right: 2rem;border-bottom: 1px solid rgba(255,255,255,0)}
.bottom ul li:nth-child(5){margin-top: -2rem;}
.bottom ul li:nth-child(5) a{width:24px;height: 24px;display:inline-block;}
.bottom ul li:nth-child(5) a:hover{transform: scale(1.2);}
.bottom ul li:nth-child(5) a:nth-child(1){ background: url("../Images/icon/icon_XiaoHongShu2.svg") no-repeat center center; background-size: 100% auto;}
.bottom ul li:nth-child(5) a:nth-child(2){ background: url("../Images/icon/icon_XinLang.svg") no-repeat center center; background-size: 100% auto;}
.bottom ul li:nth-child(5) a:nth-child(3){ background: url("../Images/icon/icon_WeiXin.svg") no-repeat center center; background-size: 100% auto;}
.bottom ul li:nth-child(5) a:nth-child(4){ background: url("../Images/icon/icon_DouYin.svg") no-repeat center center; background-size: 100% auto;}
.bottom ul li:nth-child(5) a:nth-child(5){ background: url("../Images/icon/icon_INS.svg") no-repeat center center; background-size: 100% auto;}
.bottom ul li:nth-child(5) a:nth-child(6){ background: url("../Images/icon/icon_taobao.svg") no-repeat center center; background-size: 100% auto;}

.bottom ul li:nth-child(1) a:hover,.bottom ul li:nth-child(2) a:hover,.bottom ul li:nth-child(3) a:hover,.bottom ul li:nth-child(4) a:hover{border-bottom: 1px solid var(--color-text)}

.bottom ul li:nth-child(1) a,.bottom ul li:nth-child(3) a,.bottom ul li:nth-child(4) a{font-weight: 400}

.bottom .graphics{position: absolute;right: 4%;bottom:4%;width: 120px; height: 120px;background: url("../Images/bottom_Graphics.svg") no-repeat center center; background-size: 100% auto;z-index: 2;}




.bottom_logo{width:100%;text-align: center;overflow: hidden;clear: both;}
.bottom_logo img{width:31.25%;padding: 10vh 0}


@media screen and (max-width:760px){
	
	.bottom_box .graphics{width: 100%; height: 10rem;background: url("../Images/bottom_Graphics.svg") no-repeat center center; background-size: 18% auto;}
	.bottom ul{background: #FFF;padding: 30px 0;font-size: 1.1rem;}
	.bottom ul li:nth-child(5) a{width:18px;height: 18px;display:inline-block}
	.bottom ul li{margin-bottom: 2.5rem;}
	.bottom ul li:nth-child(5){margin-bottom: -1rem;}
	.bottom_logo img{width:50%;padding: 6vh 0}
	
	
	
}




.about_box{}
.about_box li{width: calc(50% - 25px);float: left;margin-right: 50px;min-height: 400px;margin-bottom:50px;}
.about_box li:nth-child(2n){margin-right: 0;}
.about_box li:nth-child(1){font-size: 2rem; text-align: center;padding-top: 160px;font-weight: 400}
.about_box li:nth-child(2){padding-right: 10%;padding-top:  160px;}
.about_box li:nth-child(3){text-align: right;}
.about_box li:nth-child(3) img{max-height: 80vh;width: auto;max-width: 100%;}
.about_box li:nth-child(4){text-align: left;}
.about_box li:nth-child(4) img{max-height: 80vh;width: auto;max-width: 100%;}

.about_member{}
.about_member .wrapper li{width: calc(50% - 25px);float: left;margin-right: 50px;margin-bottom:50px;font-size: 2rem; text-align: center;padding-top: 100px;min-height: 200px;}
.about_member .wrapper li:nth-child(2n){margin-right: 0;}


.vipcard {width: 950px;overflow: hidden;margin: 0 auto;}
.vipcard h5{line-height: 2;padding: 1rem;}
.vipcard h5 span{border-bottom: 1px solid var(--color-text);padding-bottom: 3px}
.vipcard li{float: left;width: calc(50% - 25px);margin-right: 50px;}
.vipcard li:nth-child(2n){margin-right: 0;}

.vipcard li div{width:450px;height: 250px;border-radius: 20px;padding-top: 130px; text-align: center;font-size: 2rem;}

.vipcard article{margin: 2rem 0}
.vipcard h6{font-size: 10px;opacity: 0.4;clear: both;margin-top: 3rem;}

.card_fen{background: #f7e4e1 url(../Images/logoC.svg) no-repeat center center;background-size: auto 15px;background-position: center 100px}
.card_yin{background: rgba(0,0,0,0.15) url(../Images/logoC.svg) no-repeat center center;background-size: auto 15px;background-position: center 100px}
.card_jin{background: #54372d url(../Images/logoP.svg) no-repeat center center;background-size: auto 15px;color: #FFF;background-position: center 100px}
.card_hei{background: #030303 url(../Images/logoC.svg) no-repeat center center;background-size: auto 15px;background-position: center 100px}


@media screen and (max-width:760px){
	.about_box li{width: 100% ;float: left;margin-right:0;min-height: auto;margin-bottom:3rem;}
	.about_box li:nth-child(1){font-size: 1.6rem; text-align: left;padding-top:10rem;}
	.about_box li:nth-child(2){padding-right: 0;padding-top: 0;}
	.about_box li:nth-child(3),.about_box li:nth-child(4){width: calc(50% - 0.5rem);float: left;margin-right: 1rem;}
	.about_box li:nth-child(4n){margin-right: 0}
	
	.about_member .wrapper li{text-align: left;min-height:auto}
	.vipcard {width: 100%;}
	.vipcard li div{width:350px;height: 220px;border-radius: 20px;padding-top: 130px; text-align: center;font-size: 1.6rem;}
	.vipcard li{margin-right:2rem;width: 80%;}
	.card_fen,.card_yin,.card_jin,.card_hei{background-position: center 100px;background-size: auto 15px;}
	
	
}



.top_slide{margin: 70px 0 0 0; position: relative;}
.top_slide .swiper{margin:0}

.top_slide h3{text-align: center;margin: 0 0 3rem 0}

.stores_box{padding-top:13rem;background: #FFF;clear: both;}
.stores_box>h5{/*margin: 0 0 0 6%;*/text-align: center}
.stores_box .center{width: 80%;margin: 4rem 10%;}

.stores_box .top_slide .swiper{margin:0 10%}

.page_box{padding-top:13rem;background: #FFF;clear: both;}
.page_box>h5{margin: 0 0 0 3%;font-size: 1.8rem;}



.map{width:100%;height:100vh;position: relative;overflow: hidden;background: #fff;}
#container { width: calc(100% - 420px); height: 100vh;float: left;}
.content{height: calc(100vh - 150px);margin-top: 20px;}

.storelist{width: 420px;padding-left:30px;display: inline-block;position: relative;padding-right: 3%;}
.map .storesearch{position: relative}
form.storesearch {border-bottom: 1px solid #DDD;padding-bottom: 3rem;}
form.storesearch input[type="text"]{background:none;width: 100%;height: 4rem;margin: 1rem 0; border: 1px solid #DDD;}
form.storesearch input[type="submit"]{width: 40px;height: 30px;background: url("../Images/icon/icon_Search.svg") no-repeat center center;background-size: 100% 18px;position: absolute;right: 3px;padding: 0;border: 0;margin-top: 1.5rem;position: absolute;border-left: 1px solid #DDD}

.storelist li{margin: 15px 0;line-height: 2;cursor:pointer;padding: 1rem 2rem 1rem 0;}
.storelist li.active,.storelist li:hover{background: #F5F5F5}
.storelist li h5{line-height: 1.5}
.storelist li h5 span{background: url("../Images/icon/icon_store.svg") no-repeat;background-size: 100% 18px;background-position: left;width:4rem;height: 3rem;;display: block;float: left}
.storelist li p{padding-left: 4rem;min-height: 8rem;line-height: 1.5}

.title_box{overflow: hidden;clear: both}
.title_box h5{margin: 0 0 0 3%;font-size: 1.5rem;/*font-weight: 200*/}
.title_box h5 span{}

@media screen and (max-width:1000px){
	.title_box h5{margin: 0 0 0 6%;}
}

@media screen and (max-width:760px){
	.top_slide{margin: 8rem 0 0 0;}
	.top_slide .swiper{margin: 0}
	.stores_box{height:auto;padding-top:8rem;}
	.stores_box .center{width: 70%;margin: 4rem 15%;}
	.map{width:100%;height:auto;}
	#container { width: 100%; height: 60vh;float: left;}
	.content{height:auto;margin-top: 20px; height: 60vh;}
	.storelist form{padding-bottom: 1rem;padding-top: 2rem;}
	.storelist{width:100%;padding-left:3%;padding-right: 3%;padding-bottom:5rem;}
	.storelist li p{padding-left: 4rem;min-height:auto;font-size: 1.3rem;}
	
	.page_box{padding-top:7rem;}
	.title_box h5{margin: 0 0 0 6%;}
	.title_box h5 span{padding-left: 0;clear: both;display: block;width: 80%;font-weight: normal;font-size: 80%;margin-top: 1rem;}
	
	.storelist form input[type="submit"]{}
}






.topdoubleimg{clear: both;width: 100%;overflow: hidden;margin-top: 7rem;}
.topdoubleimg li{float: left;width: calc(50% - 25px);margin-right: 50px;}
.topdoubleimg li:nth-child(2n){margin-right: 0}         



@media screen and (max-width:760px){
	.topdoubleimg{margin-top: 1rem;}
	.topdoubleimg li{width: calc(50% - 10px);margin-right: 20px;}
}



.bag_guide{margin: 10rem 0 10rem 0;overflow: hidden}
.bag_guide ul{width: 50%;margin: 0 25%;}
.bag_guide ul li{width: calc(33.333% - 16.666px);float: left;margin-right: 25px;}
.bag_guide ul li:nth-child(3n){margin-right: 0}
.bag_guide p{line-height:3}







.brand_box{clear: both;padding-bottom: 10rem;}
.brand_box ul{margin: 20rem 6% 0 6%;overflow: hidden;}
.brand_box li:nth-child(1){width: 55%;float: left;text-align: center;padding: 15rem 10%;}
.brand_box li:nth-child(1) img{padding:0 20%;}
.brand_box li:nth-child(1) .brand_text{padding: 4rem 10%;}
.brand_box li:nth-child(1) .brand_text h4{line-height: 3;}
.brand_box li:nth-child(2){width: 45%;float: right}

.brand_video{}


.goback{clear: both;overflow: hidden;width: 100%;font-size: 1.4rem; text-align: center;display: block;margin: 10rem 0;}

@media screen and (max-width:768px){
	.brand_box ul{margin: 10rem 0}
	.brand_box li:nth-child(1) img{padding:0;}
	.brand_box li:nth-child(1){width: 100%;padding: 0 6%;overflow: hidden;padding-bottom: 5rem;}
	.brand_box li:nth-child(2){width: 100%;}
}



.theme_box{margin-top: 10rem;}
.theme_box .title{text-align: center;padding: 4rem 0;overflow: hidden;width: 100%;}
.theme_box .title h4 a,.theme_box .title h5 a{;border-bottom: 1px solid var(--color-text)}

.theme_box .topimg{margin: 0 3%;}

.theme_list{overflow: hidden;padding:10vh 10%;display: flex;}
.theme_list li{width: calc(25% - 22.5px);float: left;position: relative;margin-right: 30px;}
.theme_list li:nth-child(4n){margin-right: 0}
.theme_list li p{position: absolute;bottom: 2rem; width: 100%;text-align: center;z-index: 2;font-size: 1.3rem;}

.theme_list2{overflow:hidden;padding: 0 10%; }
.theme_list2>ul{padding: 5rem 0;overflow:hidden;display: flex;flex-wrap: wrap; /* 允许换行 */}
.theme_list2>ul>li{width: 50%;box-sizing: border-box;float: left;display: flex; /* 让 li 内部的内容高度一致 */align-items: stretch; /* 让内容填充整个 li */ }
.theme_list2>ul>li:nth-child(1),.theme_list2>ul>li:nth-child(2){margin-bottom: 15vh;}
.theme_list2>ul>li>ul{padding-right: 30px;clear: both;overflow: hidden;}

.theme_list2>ul>li:nth-child(1){width: 48%;margin-right: 9.5%;}
.theme_list2>ul>li:nth-child(2){width: 40%;padding-top:calc(2vh + 4rem)}
.theme_list2>ul>li:nth-child(3){padding: 0;width: 40%;}
.theme_list2>ul>li:nth-child(4){margin-left: 12%;width: 48%;}

.theme_list2>ul>li>ul>li{width: calc(50% - 5px);float: left;margin-right: 10px;text-align: center}
.theme_list2>ul>li>ul>li p{padding: 2rem 0}
.theme_list2>ul>li>ul>li:nth-child(2n){margin-right: 0}

.theme_list2>ul>li:nth-child(2){position: relative;}
.theme_list2>ul>li>.title{position: absolute;bottom:2vh}


.theme_list2 .title h5{font-size: 1.3rem;line-height: 2}
.themeSwiper01{height: 80%;width: 80%;float: left}




.swiper-pagination-bullet-active{background:var(--color-text) }
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin-right: 1rem}
.swiper-pagination-bullet{width: 0.7rem; height: 0.7rem;}

video {  width: 100%; /* 宽度适应外层 div */ height: auto; /* 高度自适应视频比例 */ display: block; /* 避免底部出现间隙 */ min-height: auto }




@media screen and (max-width:768px){
	.themeSwiper02{margin: 0 10%;}
	.themeSwiper02 .swiper-slide{position: relative;}
	.themeSwiper02 .swiper-slide p{position: absolute;width: 100%;bottom: 4rem;text-align: center}
	
	.theme_box .topimg{margin: 0}
	
	.theme_list li{width:calc(50% - 15px);margin-bottom: 5%}
	.theme_list li:nth-child(2n){margin-right: 0}
	.theme_list{padding:10vh 0;}
	
	.theme_list2{padding: 0}
	
	.theme_list2>ul>li{width: 100%;}
	.theme_list2>ul>li>.title{position: absolute;bottom: -7rem}
	
	.theme_list2>ul>li>ul{padding-right: 0}
	.theme_list2>ul>li:nth-child(1){width: 100%;margin-right:0;}
	.theme_list2>ul>li:nth-child(2){width: 100%;padding-top: 3vh}
	.theme_list2>ul>li:nth-child(3){padding: 0 3%;width: 100%;}
	.theme_list2>ul>li:nth-child(4){margin-left:0;width: 100%;}
	
	.theme_list2>ul>li:nth-child(3){padding: 0}
	
	.theme_list li p{font-size: 1rem;}
	
	
}






a.underline{text-decoration: none;position: relative; display: inline-block; /* Ensures the width matches the text content */overflow: hidden; /* Hide overflowing underline */}

/* Adding the underline effect */
a.underline::after { content: "";position: absolute; left: 0; bottom: 0; width: 100%; /* Full width of the text */ height: 1.5px; background: white; opacity: 1; /* Default underline is visible */transition: transform 0.5s ease, opacity 0.3s ease; /* Smooth hover effect */}

/* Hover effect: trigger animation */
a.underline:hover::after { opacity: 1; /* Make the underline visible */animation: rolling-underline 0.8s linear infinite; /* Start rolling animation */}


a.underlineC{text-decoration: none;position: relative; display: inline-block; /* Ensures the width matches the text content */overflow: hidden; /* Hide overflowing underline */}

/* Adding the underline effect */
a.underlineC::after { content: "";position: absolute; left: 0; bottom: 0; width: 100%; /* Full width of the text */ height: 1px; background: var(--color-text); opacity: 1; /* Default underline is visible */transition: transform 0.5s ease, opacity 0.3s ease; /* Smooth hover effect */}

/* Hover effect: trigger animation */
a.underlineC:hover::after { opacity: 1; /* Make the underline visible */animation: rolling-underline 0.8s linear infinite; /* Start rolling animation */}



a.underlineC2{line-height: 1.5; text-decoration: none;position: relative; display: inline-block; /* Ensures the width matches the text content */overflow: hidden; /* Hide overflowing underline */}

/* Adding the underline effect */
a.underlineC2::after { content: "";position: absolute; left: 0; bottom: 0; width: 100%; /* Full width of the text */ height: 0px; background: var(--color-text); opacity: 1; /* Default underline is visible */transition: transform 0.5s ease, opacity 0.3s ease; /* Smooth hover effect */}

/* Hover effect: trigger animation */
a.underlineC2:hover::after,.active a.underlineC2::after { opacity: 1; height: 1px; /* Make the underline visible */animation: rolling-underline 0.8s linear infinite; /* Start rolling animation */}

.popup{ display: none; text-align: center;overflow: hidden}
#popup_weixin{text-align: center;padding: 5rem 0 10rem 0}
#popup_weixin img{width: 150px;padding-bottom: 1rem}
.popup img{ width:100%;}
.layui-layer-setwin{bottom:2rem;}
.popup .content{padding: 5vh 3%;height: 80vh;width: 100%;overflow: auto; margin-left: 20px;}


.sku_box{text-align:left;font-size:1.4rem; color: var(--color-text);position: fixed;width: 20%;right: 50px;max-width: 400px;bottom: 170px;z-index: 10;padding-left: 5px}






.newtheme{margin-top: 10rem; display: block; background: #fff;}
.newtheme .single{position: relative;margin: 10vh 0;clear: both;overflow: hidden}
.newtheme .single .swiper{}
.newtheme .single .swiper h5{text-align: center;}
.newtheme .single .text{min-height: 50vh;}
.newtheme .single .swiper_product{margin: 0 10%;}


@media screen and (max-width:768px){
	.newtheme .single{}
	.newtheme .single .swiper_product .swiper-slide{width: 70%;padding-left: 6%;}
	.newtheme .single .text{min-height: 50vh;}
	.newtheme .single .swiper_product{margin: 0 10%;}
	.newtheme .single .text{margin: 0 6%;}
	.newtheme .single .float_title{margin: 0 6%;width: 88%}
}


.text{text-align: center;display: flex;justify-content: center;    /* 水平居中 */align-items: center;        /* 垂直居中 */           /* 指定高度才能垂直居中 */ text-align: center; }
.text_box ul{display: flex;           /* 让 li 横向排列 */ justify-content: center; /* 水平居中 */ list-style: none;        /* 去掉前面的圆点 */ padding: 0; margin: 0;margin-top: 3rem;clear: both}
.text_box ul li{margin: 0 1rem;font-size: 1.3rem;}
.text_box ul li a{border-bottom: 1px solid var(--color-text)}
.float_title .text_box ul li a{border-bottom: 1px solid #FFF}
.text_box h3{line-height: 2;}
.text_box article{margin: 44px 20%;width: 60%;}
.newtheme .double{min-height: 50vh;margin-bottom: 10vh;margin: 0 3%;}

.double .swiper_product ul li{width: 50%;float: left;padding: 5px;display: inline-block}
.swiper_product h5{text-align: center;font-weight: 300;margin-top: 1.5rem;font-size: 1.3rem;}/*
.double .swiper_product .swiper-button-prev, .swiper-rtl .swiper-button-next{top: auto;bottom: -20px;}
.double .swiper_product .swiper-button-next, .swiper-rtl .swiper-button-prev{top: auto;bottom: -16px;}*/

li .text_box{padding-top: 5rem;}
li.text .text_box{padding-top:0;}

.newtheme .double>ul{ display: flex;}
.newtheme .double>ul>li{width: 50%;flex: 1;text-align: center;}
.newtheme .double>ul>li:nth-child(1){padding-right:5rem}
.newtheme .double>ul>li:nth-child(2){padding-left: 5rem;}
.newtheme .double>ul>li>.swiper .swiper-slide{padding: 0 15%;}
.newtheme .double>ul>li>.swiper{margin-top:15%;}

.newtheme .double:nth-last-child(1){padding-bottom: 10vh;}

@media screen and (max-width:768px){
	.text_box ul li{margin: 0 1rem;font-size: 1.2rem;}
	.newtheme .double>ul{ display: block}
	.newtheme .double>ul>li{width: 100%;}
	.newtheme .double>ul>li:nth-child(1){padding-right:0;margin-bottom: 10vh;}
	.newtheme .double>ul>li:nth-child(2){padding-left: 0;}
	
	.text_box article{margin: 44px 0;width: 100%;font-size: 1.2rem;}
}


.joryadog {
      position: absolute;
      pointer-events: none;
      animation: floatShrinkFade 2s ease-out forwards;
	z-index: 1000;
    }

@keyframes floatShrinkFade {
      0% {
        opacity: 0;
        transform: translate(0, 0) scale(0);
      }
		25% {
        opacity: 1;
        transform: translate(0, 0) scale(1);
      }
      70% {
        transform: translate(calc(-10px + 20px * var(--r)), calc(-10px + 20px * var(--r))) scale(1);
      }
      100% {
        opacity: 0;
        transform: translate(calc(-20px + 40px * var(--r)), calc(-20px + 40px * var(--r))) scale(0);
      }
    }



/* 黑白效果
html {
        filter: grayscale(100%); 
        -webkit-filter: grayscale(100%); 
        -moz-filter: grayscale(100%); 
        -ms-filter: grayscale(100%); 
        -o-filter: grayscale(100%); 
        -webkit-filter: grayscale(1);
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: gray;}*/

