youhuiquan/choujiang/goods/css/detail.css

#container{background: #F4F4F4;min-height: 100vh;padding-bottom: 0.5rem;}
/*banner及详情*/
.swiper-container{
    width: 3.75rem;
    height: 3.75rem;
    overflow: hidden;
    position: relative;
}
.swiper-wrapper{
    width: 100%;
    height: 100%;
}
.swiper-slide img{
    width: 100%;
}
.swiper-pagination-bullet.swiper-pagination-bullet-active{
    width: 0.1rem;
    height: 0.03rem;
    background: #fff;
    border-radius: 0;
}
.commodity{
  /* width: 100%; */
  background: #ffffff;
}
.commodity_img{
  width:3.75rem;
  height:3.75rem;
}
.commodity_info{
  /* width: 100%; */
  /* height: 1.215rem; */
  padding: 0 0.15rem;
  padding-bottom: 0.05rem;
}
.commodity_info .info_top{
  color: #FF014F;
  font-size: 0.14rem;
  /* padding-bottom: 0.125rem;
  padding-top: 0.135rem; */
   padding-bottom: 0.025rem;
  padding-top: 0.035rem;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.commodity_new_price em{
  font-size: 0.19rem;
  padding: 0 0.01rem;
}
.commodity_coupon{
  display: block;
  width: 0.64rem;
  height: 0.14rem;
  color: #ffffff;
  font-size: 0.11rem;
  margin-top: 0.12rem;
  margin-left: 0.13rem;
  margin-bottom: 0.09rem;
  background: url(../imgs/quan.png) no-repeat ;
  background-size:0.64rem 0.14rem; 
}
.commodity_coupon em:nth-child(1){
  display: block;
  float: left;
  width: 0.195rem;
  height: 0.14rem;
  line-height: 0.14rem;
  text-align: center;
}
.commodity_coupon em:nth-child(2){
  display: block;
  width: 0.445rem;
  height: 0.14rem;
  float: left;
  line-height: 0.14rem;
  text-align: center;
} 
.info_cen{
  font-size: 0.11rem;
  color: #BEBDBD;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.info_cen_old_price em{
  text-decoration: line-through;
}
.info_name{
  font-size:0.14rem;
  max-height: 0.55rem;
  padding-bottom: 0.1rem;
  columns: #333333;
  padding-top: 0.06rem;
  line-height: 0.27rem;
  display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}
.info_name .icon{
  width:0.155rem;
  height:0.155rem;
  margin-top: 0.02rem;
  margin-right: 0.02rem;
  display: inline-block;
  vertical-align: sub;
}
 /* 店铺 */
.shop{
  height: 0.69rem;
  /* width: 100%; */
  /* margin: 0.05rem 0; */
  margin-top: 0.05rem;
  background: #fff;
  padding: 0 0.15rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.shop_img{
  width: 0.47rem;
  height: 0.47rem;
  margin-top: 0.11rem;
}
.shop_info{
  display: block;
  width: 2.805rem;
  display: flex;
  flex-direction: column;
}
.shop_name{
  font-size: 0.16rem;
  color: #333333;
  line-height: 0.35rem;
}
.shop_about{
  font-size:0.12rem;
  color:#919090;
  line-height:0.315rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
/* 宝贝详情 */
.baby_details{
  /* width: 100%; */
  height: auto;
  background: #fff;
  margin: 0.05rem 0;
}
.baby_details .tit{
  color:transparent;
  background:linear-gradient(69deg,rgba(137,118,251,1) 0%, rgba(60,193,248,1) 99.462890625%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}
.baby_img{
  /* width: 100%; */
}
/*宝贝详情*/
.commodityDetails{
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0.05rem;
}
.commodityDetails .title{
  font-size: 0.14rem;
  color: #333;
  text-align: center;
  line-height: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 0.18rem;
}
.commodityDetails img{
  margin-left: 0.1rem;
  width: 0.15rem;
  height: 0.15rem;
  vertical-align: middle;
  -webkit-animation: start 1.5s infinite ease-in-out;
  animation: start 1.5s infinite ease-in-out;
}
@-webkit-keyframes start {
	0% {transform: translate(-0.06rem,0);}
	50% {transform: translate(0,0);}
	100% {transform: translate(-0.06rem,0px);}
}
@-moz-keyframes start {
	0% {transform: translate(-0.06rem,0);}
	50% {transform: translate(0,0);}
	100% {transform: translate(-0.06rem,0px);}
}
@keyframes start {
	0% {transform: translate(-0.06rem,0);}
	50% {transform: translate(0,0);}
	100% {transform: translate(-0.06rem,0px);}
}
/*相关推荐*/
#tuijian ul{
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#tuijian .title{
	text-align: center;
	font-size: 0.14rem;
	line-height: 0.5rem;
	margin-top: 0.05rem;
	background: #ffffff;
}
.goods_item{
  width:1.85rem;
  /*height:3.025rem;*/
  background:#ffffff;
  border:0.005rem solid #E7E7E7;
  border-radius:0.05rem;
  margin-bottom: 0.03rem;
}
.goods_img{
  width:100%;
  height:1.8rem;
  background: #CCCCCC;
  border-radius:0.05rem 0.05rem 0 0;
}
.goods_name{
  /* height: 0.69rem; */
  height: 0.32rem;
  font-size: 0.13rem;
  padding: 0 0.06rem;
  padding-top: 0.1rem;
  line-height: 0.18rem;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.goods_name .icon{
  width:0.14rem;
  height:0.14rem;
  margin-top: 0.02rem;
  margin-right: 0.02rem;
  display: inline-block;
  vertical-align: sub;
}
.quan{
    padding: 0 0 0 0.06rem;
    height: 35px;
    display: flex;
    align-items: center;
}
.goods_coupon{
  width: 0.64rem;
  height: 0.14rem;
  color: #ffffff;
  font-size: 0.11rem;
  background: url(../imgs/quan.png) no-repeat ;
  background-size:0.64rem 0.14rem; 
}
.goods_coupon span:nth-child(1){
  display: block;
  float: left;
  width: 0.195rem;
  height: 0.14rem;
  line-height: 0.14rem;
  text-align: center;
}
.goods_coupon span:nth-child(2){
  display: block;
  width: 0.445rem;
  height: 0.14rem;
  float: left;
  line-height: 0.14rem;
  text-align: center;
}
.goods_price{
  font-size: 0.1rem;
  color: #FF014F;
  padding-left: 0.05rem;
  padding-bottom: 0.15rem;
}
.goods_price .new_price{
  font-size: 0.15rem;
  padding-left: 0.03rem;
  padding-right: 0.1rem;
}
.goods_price .old_price{
  color: #BEBDBD;
  text-decoration: line-through;
}
.loading {
  font-size: 0.12rem;
  color: #333;
  text-align: center;
  line-height: 0.3rem;
  cursor: pointer;
  margin: 0.2rem auto 0;
  /*box-shadow: 0 0 0.04rem rgba(0, 0, 0, 0.1);*/
}
/*立即购买*/
#bottomTab{
	width: 100%;
	background:linear-gradient(132deg,rgba(251,109,36,1) 0%,rgba(251,109,36,1) 0%,rgba(254,15,63,1) 100%);
	font-size: 0.16rem;
	text-align: center;
	line-height: 0.5rem;
	position: fixed;
	bottom: 0;
	color: #ffffff;
}