@charset "utf-8";
/*
* Author:luochou
* Date:2024.7.8
*/
body{background-color: #f8f8f8;}
.container{min-width:320px;width:100%;max-width:750px;margin:0 auto; background-color: #fff;}
.container img{max-width:100%;display:block;}
.container .tit{position: relative; height: .5rem; padding-top: .16rem;}
.container .tit small{position: absolute; left: 0; top:0; width: 100%;color: #f5f0f1; font-size: .5rem; line-height: .5rem; text-align: center;font-weight: bold;text-transform: uppercase;}
.container .tit span{position: relative; display: flex;display: -webkit-flex;justify-content: center;}
.container .tit span b{padding: 0 .14rem; color: #1a1a1a; font-size: .42rem; font-weight: 800; text-align: center; line-height: .5rem; white-space: nowrap;}
.container .tit i{position: relative; width:100%; height: .02rem; margin-top: .24rem; background-color: #f5f0f1;}
.container .tit em{position: absolute; top:50%; margin-top: -.04rem; width: .08rem; height: .08rem; background-color: #fe6790; border-radius: 50%;}
.container .tit .i1 em{right: 0;}
.container .tit .i2 em{left: 0;}
.item{padding:0 .3rem;}

.banner{position:relative;width:100%;overflow:hidden;}
.banner .swiper-slide{position:relative;}
.banner .swiper-slide img{width:100%;height:5rem;}
.banner .pagination{width:7.5rem;text-align:center;line-height:0;position:absolute;left:0;bottom:.2rem;z-index:1; display: none;}
.banner .pagination span{width:.16rem;height:.16rem;font-size:0;background-color:#cac9cb;border-radius:50%;opacity:1;margin:0 .1rem;display:inline-block;vertical-align:top;}
.banner .pagination .swiper-pagination-bullet-active{background-color:#b88a7a;}
/*f1Box*/
.f1Box{padding:.8rem .3rem .4rem;}
.f1Box ul{padding:.25rem 0 .3rem; display: flex;display: -webkit-flex;justify-content: space-between;}
.f1Box li{width:2rem; padding-bottom: .18rem; background-color: #faf5f6; border-radius: .1rem;}
.f1Box li h3{padding-top: .08rem; color: #fe6790; font-size: .3rem; line-height: .52rem; text-align: center;}
.f1Box li p{padding-top: .05rem;color: #1a1a1a; font-size: .24rem; text-align: center; line-height: .34rem;}
.f1Box li p span{position: relative;}
.f1Box li p span i{position: absolute; left: 0; bottom: 0; width: 100%; height: .03rem; background-color: #fe6790;}
.f1Box .btn{width: 2.8rem; height: .7rem; margin: 0 auto; background: #ff9519; background: -webkit-linear-gradient(#fd7226, #ff9519); background: linear-gradient(#fd7226, #ff9519); color: #fff; font-size: .32rem; font-weight: bold; text-align: center;display: flex;display: -webkit-flex;justify-content: center;align-items: center; border-radius: .35rem;}
/*f2Box*/
.f2Box{padding:.4rem 0;}
.f2Con{padding:.1rem 0 .52rem .26rem;display: flex;display: -webkit-flex;flex-wrap: wrap; gap:.42rem 0;}
.f2Con dl{position: relative; width: 3.28rem;}
.f2Con dd{position: absolute; left:.8rem;bottom:-.2rem;width: 2.25rem; height: 1.65rem; background-color: #fe6790; border-radius: .26rem 0 .26rem 0;display: flex;display: -webkit-flex;justify-content: center;align-items: center;flex-direction: column;}
.f2Con dd h3{color: #fff; font-size: .3rem; line-height: .4rem;}
.f2Con dd p{color: #fff; font-size: .24rem; line-height: .32rem;}
.f2Con dd p b{padding: 0 .04rem; font-weight: bold; font-size: .36rem;}
.f2Info{position: relative; padding:.2rem .28rem .52rem; background-color: #faf5f6; border-radius: .1rem;}
.f2Info p{color: #1a1a1a; font-size: .24rem; line-height: .44rem; text-align: center;}
.f2Info .btn{position: absolute; left: 50%; bottom:-.35rem; margin-left: -1.2rem; width: 2.4rem; height: .7rem;background: #ff9519; background: -webkit-linear-gradient(#fd7226, #ff9519); background: linear-gradient(#fd7226, #ff9519); color: #fff; font-size: .32rem; font-weight: bold; text-align: center;display: flex;display: -webkit-flex;justify-content: center;align-items: center; border-radius: .35rem;}
/*f3Box*/
.f3Box{padding:.72rem .3rem 0;}
.f3Con{padding-top: .24rem;}
.f3Con dl{margin-bottom: .3rem;}
.f3Con dt{width: 2.44rem; height: .6rem; padding-left: .2rem; border-radius: 0 .3rem 0 0; display: flex;display: -webkit-flex;align-items: center; background-color: #1a1a1a; color: #fff; font-size: .3rem; font-weight: bold;}
.f3Con dt span{padding-left: .1rem; margin-left: .1rem; border-left:1px solid #fff; font-size: .24rem; font-weight: normal; line-height: .26rem;}
.f3Con dd{padding:.19rem; border:1px solid #1a1a1a; background-color: #faf5f6; border-radius: 0 .18rem .18rem .18rem;}
.f3Con dd ul{display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;}
.f3Con dd li{position: relative; width: 2.88rem;}
.f3Con dd li .imgBox{position: relative;}
.f3Con dd li p{position: absolute; left: 0; bottom:.15rem; width: 100%; color: #fff; font-size: .24rem; line-height: .3rem; text-align: center;text-shadow:2px 2px 4px #fa396d;}
.f3Box .btn{width: 2.8rem; height: .7rem; margin: 0 auto; background: #ff9519; background: -webkit-linear-gradient(#fd7226, #ff9519); background: linear-gradient(#fd7226, #ff9519); color: #fff; font-size: .32rem; font-weight: bold; text-align: center;display: flex;display: -webkit-flex;justify-content: center;align-items: center; border-radius: .35rem;}
/*f4Box*/
.f4Box{padding:.72rem .3rem;}
.f4Info{position: relative; z-index: 2;} 
.f4Info h3{width: 2.4rem;  height: .4rem; margin: 0 auto; background-color: #fe6790; border-radius: .2rem; display: flex;display: -webkit-flex;justify-content: center;align-items: center; color: #fff; font-size: .24rem;}
.f4Info h3 i{padding: 0.05rem; font-weight: bold;}
.f4Info p{padding-top: .18rem; color: #282828; font-size: .24rem; line-height: .44rem; text-align: justify;}
.f4Box .imgBox{position: relative; margin-top: -.4rem;}

@keyframes pulse{
	0%{transform:scale(0.9)}
	50%{transform:scale(1)}
	100%{transform:scale(0.9)}
}
@-webkit-keyframes pulse{
	0%{-webkit-transform:scale(0.9)}
	50%{-webkit-transform:scale(1)}
	100%{-webkit-transform:scale(0.9)}
}