.filtrate {

	display: flex;

	align-items: center;

	justify-content: space-between;

	margin: 60px 0;

}



.refine {

	display: flex;

	align-items: center;

	gap: 45px;

}



.refine h6 {

	/* font-family: Gilroy-Bold; */

	font-size: 16px;

	font-weight: normal;

	font-stretch: normal;

	line-height: 24px;

	letter-spacing: 2px;

	color: #603e71;

}



.refine form {

	width: 300px;

	height: 40px;

	background-color: #ffffff;

	border-radius: 4px;

	border: solid 1px #dcdcdc;

	box-sizing: border-box;

	display: flex;

	justify-content: space-between;

}



.refine input {

	width: calc(100% - 50px);

	height: 100%;

	background: none;

	border: none;

	text-indent: 1em;

}



.refine button {

	width: 50px;

	background: none;

	border: none;

}



.refine button .iconfont {

	color: #603e71;

	font-size: 20px;

	font-weight: bold;

}



.sort {

	display: flex;

	align-items: center;

	gap: 6px;

}



.sort div {

	position: relative;

	cursor: pointer;

}



.sort h5 {

	/* font-family: Gilroy-Bold; */

	font-size: 16px;

	font-weight: normal;

	font-stretch: normal;

	line-height: 24px;

	letter-spacing: 1px;

	color: #603e71;

	text-transform: uppercase;

}



.sort span {

	color: #603e71;

	font-size: 20px;

}



.sort ul {

	position: absolute;

	min-width: 100%;

	top: 100%;

	left: 50%;

	transform: translateX(-50%);

	background: #fff;

	box-sizing: border-box;

	border: 1px solid #dcdcdc;

	padding: 10px 0;

	display: none;

}



.sort div:hover ul {

	display: block;

}



.sort ul a {

	display: block;

	width: 100%;

	box-sizing: border-box;

	padding: 10px;

	color: #603e71;

}


.sort ul a:hover{
	background: #603E71;
	color: #fff;
}


.shopList {

	display: grid;

	grid-template-columns: repeat(3, 1fr);

	gap: 80px 30px;

}



.shopList a {

	display: block;

	width: 100%;

	position: relative;

}



.shopMg {

	width: 500px;

	overflow: hidden;

}



.shopMg img {

	display: block;

	width: 100%;

	transition: .4s;

}



a:hover .shopMg img {

	transform: scale(1.1);

}



.shopTxt {

	width: 100%;

	box-sizing: border-box;

	padding: 35px 20px;

}



.shopTxt h5 {

	text-align: center;

	/* font-family: Gilroy-Bold; */

	font-size: 18px;

	font-weight: normal;

	font-stretch: normal;

	line-height: 30px;

	letter-spacing: 0px;

	color: #313131;

}



.view {

	margin: 90px 0;

	display: flex;

	justify-content: space-between;

	align-items: flex-start;

}

.vewLeft {

	width: 800px;

	position: relative;

}


.vewLeft .swiper-button-next:after,

.vewLeft .swiper-rtl .swiper-button-prev:after,

.vewLeft .swiper-button-prev:after,

.vewLeft .swiper-rtl .swiper-button-next:after {

	font-size: 30px;

	color: #603E71;

	font-weight: bold;

}



.vewLeft .swiper-button-prev {

	left: 60px;
	background-color: rgba(255, 255, 255, 0.5); /* 半透明背景 */
	display: none;

}



.vewLeft .swiper-button-next {

	right: 60px;
	background-color: rgba(255, 255, 255, 0.5); /* 半透明背景 */
	display: none;

}



.vewRight {

	width: 550px;

}



.vewRight h3 {

	/* font-family: Gilroy-Bold; */

	font-size: 42px;

	font-weight: bold;

	font-stretch: normal;

	letter-spacing: 0px;

	color: #3e1553;

}



.vewRight h5 {

	font-size: 18px;

	font-weight: bold;

	letter-spacing: 0px;

	color: #313131;

	margin: 15px 0;

}



.vewRight h6 {

	/* font-family: Gilroy-Bold; */

	font-size: 25px;

	font-weight: bold;

	letter-spacing: 0px;

	color: #603e71;

}



.attribute {

	border-top: 1px solid #ccc;

	border-bottom: 1px solid #ccc;

	margin: 15px 0 0;

	padding: 1px 0 30px;

}



.attribute>div {

	margin: 20px 0 0;

}



.choice {

	display: flex;

	flex-wrap: wrap;

}



.color {

	gap: 60px;

}



.size {

	gap: 15px;

}



.choice label {

	display: flex;

	align-items: center;

	position: relative;

}



.choice input {

	position: absolute;

	opacity: 0;

}



.choice p {

	font-size: 18px;

	font-weight: normal;

	font-stretch: normal;

	letter-spacing: 0px;

	color: #313131;

}



.color label:hover p {

	text-decoration: underline;

}



.colMg {

	height: 50px;

	margin-right: 15px;

}



.colMg img {

	display: block;

	height: 100%;

}



.color p {

	order: 3;

}



.color input:checked+p {

	text-decoration: underline;

}



.size .btn {

	width: 40px;

	height: 40px;

	border: solid 1px #dcdcdc;

	box-sizing: border-box;

	display: flex;

	align-items: center;

	justify-content: center;

	font-size: 18px;

	font-weight: normal;

	font-stretch: normal;

	letter-spacing: 0px;

	color: #959595;

	background: #fff;

	

}



.color .colorbtn{

	display: flex;

	justify-content: space-between;

	align-items: center;

	padding: 5px;

}

.btn{cursor: pointer;}



.size label:hover p,

.size .btn.red,.color .colorbtn.red {

	border: solid 2px #313131;

	color: #333;

}


.labor .fund{
	display: flex;

	justify-content: space-between;
}

.labor .shopCarStar_box{
	display: flex;

	justify-content: left;
}



.labor {

	width: 100%;

}



.labor>div {

	align-items: center;

	gap: 10px;

}



.labor h5 {

	margin: 0;

}



.fund {

	width: 120px;

	height: 40px;

	border: solid 1px #dcdcdc;

	box-sizing: border-box;

}



.fund input,

.fund button {

	width: 33.33%;

	background: none;

	border: none;

	font-size: 18px;

	font-weight: normal;

	font-stretch: normal;

	letter-spacing: 0px;

	color: #313131;

	text-align: center;

}



.fund input {

	border-left: 1px solid #dcdcdc;

	box-sizing: border-box;

	border-right: 1px solid #dcdcdc;

}



.bags {

	display: block;

	padding: 15px 20px;

	border: none;

	background: #603E71;

	border-radius: 5px;

	/* font-family: Gilroy-Bold; */

	font-size: 18px;

	font-weight: normal;

	font-stretch: normal;

	letter-spacing: 0px;

	color: #ffffff;

}



.bags .iconfont {

	font-size: 22px;

	margin-right: 10px;

}



.tuck {

	width: 60px;

	height: 60px;

	border: solid 1px #603e71;

	box-sizing: border-box;

	background: none;

	transition: .5s;

}



.tuck:hover,

.tuck.active {

	background: #603E71;

}



.tuck .iconfont {

	font-size: 30px;

	color: #603e71;

}



.tuck:hover .iconfont,

.tuck.active .iconfont {

	color: #fff;

}



.explain {

	margin: 25px 0;

}



.expTlt {

	display: flex;

	align-items: center;

	justify-content: space-between;

	padding: 0 0 15px;

	margin: 0 0 15px;

	border-bottom: 1px solid #dbdbdb;

}



.expTlt .iconfont {

	font-size: 22px;

}



.expTlt.active .iconfont {

	transform: rotate(180deg);

}

.expCont p {

	font-size: 16px;

	font-weight: normal;

	letter-spacing: 0px;

	color: #313131;

	line-height: 25px;

}



.expCont img {

	max-height: 145px;

}



.expMg {

	display: flex;

	gap: 40px;

}



.divide {

	display: flex;

	justify-content: center;

}



.divide img {

	display: block;

	width: 65%;

	max-width: 995px;

}



.like {

	margin-top: -80px;

}



.like h4 {

	font-size: 18px;

	font-weight: normal;

	font-stretch: normal;

	line-height: 36px;

	letter-spacing: 0px;

	color: #313131;

}



.likList {

	display: grid;

	grid-template-columns: repeat(5, 1fr);

	gap: 70px;

	margin: 35px 0 0;

}



.likList a {

	display: block;

}



.likMg {

	width: 100%;

	overflow: hidden;

}



.likMg img {

	display: block;

	width: 100%;

	transition: .4s;

}



.likList a:hover img {

	transform: scale(1.05);

}



.likTxt {

	width: 100%;

	box-sizing: border-box;

	padding: 25px;

}



.likTxt h5 {

	text-align: center;

	font-size: 16px;

	font-weight: normal;

	font-stretch: normal;

	letter-spacing: 0px;

	color: #313131;

}



/* WishList */

.wishTop {

	margin: 80px 0 30px;

}



.wishTop h3 {

	text-align: center;

	/* font-family: Gilroy-Bold; */

	font-size: 36px;

	font-weight: normal;

	font-stretch: normal;

	letter-spacing: 0px;

	color: #603e71;

	margin: 0 0 50px;

}



.wisBox {

	display: flex;

	align-items: center;

	justify-content: space-between;

}



.wisBox h4 {

	font-size: 16px;

	font-weight: normal;

	font-stretch: normal;

	line-height: 30px;

	letter-spacing: 0px;

	color: #7d7d7d;

}



.wisBox h4 b {

	/* font-family: Gilroy-Bold; */

	color: #603e71;

}



.lookup {

	display: flex;

	align-items: center;

	gap: 30px;

}



.lookup form {

	width: 300px;

	height: 40px;

	background-color: #ffffff;

	border-radius: 4px;

	border: solid 1px #dcdcdc;

	box-sizing: border-box;

	display: flex;

}



.lookup form input {

	width: calc(100% - 50px);

	text-indent: 1.2em;

	font-size: 16px;

	border: none;

	background: none;

}



.lookup form button {

	width: 50px;

	border: none;

	background: none;

}



.lookup form button .iconfont {

	color: #603E71;

	font-weight: bold;

	font-size: 20px;

}



.lookup label {

	display: flex;

	align-items: center;

	gap: 10px;

	position: relative;

}



.lookup label input {

	position: absolute;

	opacity: 0;

}



.lookup label span {

	display: flex;

	align-items: center;

	justify-content: center;

	box-sizing: border-box;

	width: 16px;

	height: 16px;

	border: 1px solid #dcdcdc;

	color: #fff;

}



.lookup label input:checked+span {

	color: #000;

}



.lookup>button {

	border: none;

	background: none;

	font-size: 16px;

	letter-spacing: 0px;

	color: #000000;

	cursor: pointer;

}



.shopList li {

	position: relative;

}



.chose {

	position: absolute;

	top: 14px;

	right: 14px;

}



.chose input {

	position: absolute;

	opacity: 0;

}



.chose span {

	display: flex;

	align-items: center;

	justify-content: center;

	box-sizing: border-box;

	width: 16px;

	height: 16px;

	border: 1px solid #dcdcdc;

	background: #fff;

	color: #fff;

}



.chose input:checked+span {

	color: #000;

}



.chose .iconfont {

	font-size: 14px;

}



.shopList.vishList .shopTxt {

	padding: 35px 0;

}



.shopTxt .choice {

	display: flex;

	justify-content: space-between;

	margin: 30px 0 0;

}



.shopTxt .choice button {

	box-sizing: border-box;

	padding: 10px 15px;

	border: none;

	background: none;

}



.shopTxt .choice button:first-child {

	width: 130px;

	/* font-family: Gilroy-Bold; */

	font-size: 16px;

	font-weight: normal;

	font-stretch: normal;

	letter-spacing: 0px;

	color: #603e71;

	border: 1px solid #3e1553;

}



.shopTxt .choice button:last-child {

	background: #3e1553;

	/* font-family: Gilroy-Bold; */

	font-size: 16px;

	font-weight: normal;

	font-stretch: normal;

	line-height: 20px;

	letter-spacing: 0px;

	color: #ffffff;

}



.shopTxt .choice button .iconfont {

	font-size: 20px;

	font-weight: bold;

}



@media screen and (max-width:1680px) {



	.vewLeft {

		width: 55%;

		position: relative;

	}



	.vewRight {

		width: 42%;

	}



	.vewRight h3 {

		font-size: 40px;

	}



	.bags {

		padding: 15px;

	}



	.attribute {

		margin: 15px 0 0;

		padding: 1px 0 30px;

	}



	.vewRight h5 {

		font-size: 25px;

		margin: 15px 0;

		color: #603e71;

	}



	.expTlt {

		padding: 0 0 10px;

		margin: 0 0 10px;

	}





}



@media screen and (max-width:1440px) {



	.shopList {

		grid-template-columns: repeat(3, 1fr);

		gap: 60px 70px;

	}



	.shopTxt .choice button:first-child {

		width: 100px;

	}



}



@media screen and (max-width:1280px) {



	.shopList {

		grid-template-columns: repeat(3, 1fr);

		gap: 50px 60px;

	}



	.vewRight h3 {

		font-size: 30px;

	}



	.color {

		gap: 30px;

	}



	.colMg {

		height: 30px;

		margin-right: 5px;

	}



	.choice p {

		font-size: 16px;

	}



	.attribute>div {

		flex-wrap: wrap;

		gap: 10px;

	}



	.likList {

		display: grid;

		grid-template-columns: repeat(5, 1fr);

		gap: 30px;

		margin: 35px 0 0;

	}



	.shopTxt .choice button:last-child {

		font-size: 13px;

	}



	.shopTxt .choice button {

		padding: 10px;

	}



	.shopTxt .choice button:first-child {

		width: 70px;

		font-size: 14px;

	}



}





@media screen and (max-width: 1024px) {



	.shopList {

		grid-template-columns: repeat(3, 1fr);

		gap: 40px 35px;

	}



	.shopTxt {

		width: 100%;

		box-sizing: border-box;

		padding: 15px 10px;

	}



	.shopTxt h5 {

		font-size: 16px;

	}



	.view {

		margin: 30px 0 0;

		flex-wrap: wrap;

		gap: 20px;

	}



	.view>div {

		width: 100%;

	}



	.vewLeft .swiper-button-next {
		right: 0px;
	}



	.vewLeft .swiper-button-prev {
		left: 0px;
	}



	.likList {

		grid-template-columns: repeat(3, 1fr);

		gap: 10px 20px;

		margin: 25px 0 0;

	}



	.like {

		margin: 50px 0 30px;

	}



	.shopTxt .choice {

		gap: 10px;

	}



	.shopTxt .choice>button {

		width: 100% !important;

	}



}





@media screen and (max-width:768px) {



	.filtrate {

		flex-wrap: wrap;

		gap: 15px;

	}



	.refine {

		gap: 15px;

	}



	.refine form {

		width: 250px;

	}



	.shopList {

		grid-template-columns: repeat(2, 1fr);

		gap: 20px 15px;

	}



	.shopTxt h5 {

		font-size: 12px;

		line-height: 25px;

	}



	.likList {

		grid-template-columns: repeat(2, 1fr);

		gap: 10px 20px;

		margin: 25px 0 0;

	}



	.vewRight h3 {

		font-size: 24px;

	}



	.wisBox,

	.lookup {

		flex-wrap: wrap;

	}



}

/* show页面的点击图片展示全屏图片蒙版 */

.mask{
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 50vw;
    background-color: rgba(0, 0, 0, 0.8);
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.mask img{
	width: 100%;
	height: 100%;
}