/**index.wxss**/ .bg { width: 100%; min-height: 100%; background-color: #fff; } .swiper { width: 710rpx; height: 280rpx; /* box-sizing: border-box; */ /* padding-left: 20rpx; */ /* padding-right: 20rpx; */ box-shadow: 0 10rpx 30rpx rgba(0,0,0,0.3); margin: 0 auto; border-radius: 10rpx; } .swiperImage { width: 100%; height: 280rpx; border-radius: 10rpx; overflow: hidden; } .swiper-container { position: relative; background: url('http://fohow.oss-cn-shenzhen.aliyuncs.com/neverse/homebg.png') no-repeat #fff fixed top; background-size: contain; } .swiper-dots { position: absolute; left: 0; right: 0; bottom: 20rpx; display: flex; justify-content: center; } .swiper-dot { margin: 0 8rpx; width: 24rpx; height: 7rpx; background: #fff; /* opacity: 0.5; */ border-radius: 30%; transition: all .6s; } .swiper-active { background: #eab86a; } .column { margin-top: 20rpx; background-color: #fff; padding-bottom: 20rpx; } .first-project { /* padding-top: 20rpx; */ padding: 20rpx 20rpx 0; display: flex; } .first-project__image { margin-right: 12rpx; float: left; display: block; width: 350rpx; height: 210rpx; /* border-radius: 8rpx; */ /* border: 1rpx solid #dddddd; */ } .first-project__image:nth-child(2) { margin-right: 0rpx; } .second-project { /* padding-top: 20rpx; */ box-sizing: border-box; padding: 20rpx 20rpx 0; display: flex; } .second-project__image { margin-right: 13rpx; float: left; display: block; width: 170rpx; height: 188rpx; /* border-radius: 8rpx; */ /* border: 1rpx solid #dddddd; */ } .second-project__image:nth-child(4) { margin-right: 0rpx; } .recommend { margin: 20rpx; border-radius: 5rpx; overflow: hidden; } .recommend-title { display: block; height: 57rpx; background-color: #c8d1d8; font-size: 30rpx; line-height: 57rpx; color: #ffffff; text-shadow: 0rpx 0rpx 10rpx #a6b2bc; font-weight: bold; text-align: center; } .recommend-bg { padding: 10rpx; height: 354rpx; border-top: 3rpx solid #bac5ce; background-color: #f3f3f3; } .recommend-image { float: left; display: block; width: 250rpx; height: 250rpx; } .recommend-info { float: left; display: block; width: 404rpx; padding: 0 18rpx; height: 250rpx; background-color: #ffffff; } .recommend-projectTitle { padding-top: 26rpx; margin-bottom: 28rpx; line-height: 48rpx; color: #4c4c4c; -webkit-line-clamp: 2; font-size: 28rpx; } .recommend-price { line-height: 36rpx; font-size: 36rpx; color: #eab86a; font-weight: bold; } .recommend-point { padding-top: 18rpx; font-size: 24rpx; color: #a6bfd4; } .recommend-more { width: 240rpx; height: 64rpx; margin: 20rpx auto 0; line-height: 64rpx; border-radius: 64rpx; text-align: center; font-size: 28rpx; color: #fff; background: -webkit-linear-gradient(left, #ff5c5c , #ff9b74); background: linear-gradient(to right, #ff5c5c , #ff9b74); } .projects { padding-top: 10rpx; background-color: #fff; position: relative; } .projects-title { font-size: 28rpx; padding-bottom: 20rpx; font-weight: bold; text-align: center; color: #d9dee3; } .projectbg { background-color: #fff; padding-bottom: 1rpx; } .project { position: relative; margin: 0 auto; width: 710rpx; height: auto; background-color: #f7f7f7; margin-bottom: 20rpx; border-radius: 8rpx; } .project1 { position: relative; margin: 0 auto; width: 710rpx; /* height: 580rpx; */ background-color: #ffffff; margin-bottom: 20rpx; border-radius: 10rpx; overflow: hidden; } .project-left { float: left; width: 390rpx; padding-left: 20rpx; padding-top: 15rpx; } .project-describe { width: 710rpx; /* height: 130rpx; */ padding: 20rpx 20rpx 0 20rpx; box-sizing: border-box; } .project-title { font-size: 28rpx; color: #2b2b2b; line-height: 36rpx; height: 72rpx; -webkit-line-clamp: 2; } .project-title1 { font-size: 30rpx; color: #2b2b2b; -webkit-line-clamp: 1; } .project-right { float: right; margin-right: 10rpx; margin-top: 10rpx; display: block; width: 258rpx; height: 258rpx; /*border: 1rpx solid #dddddd;*/ } .project-image { display: block; width: 100%; height: 378rpx; } .project-count { padding-top: 15rpx; font-size: 24rpx; color: #bbbbbb; } .project-count1 { float: right; padding-top: 20rpx; font-size: 24rpx; color: #bbbbbb; } .project-price { padding-top: 90rpx; font-size: 28rpx; color: #eab86a; } .project-price1 { float: left; padding-top: 10rpx; font-size: 28rpx; color: #4c4c4c; padding-bottom:20rpx; } .project-point { color: #eab86a; /* color: #bbbbbb; */ font-size: 24rpx; margin-top: 4rpx; margin-left: 10rpx; } .project-out { position: absolute; right: 20rpx; bottom: 20rpx; width: 66rpx; height: 66rpx; background-image: url('https://fohow.oss-cn-shenzhen.aliyuncs.com/xcx/sellout.png'); background-size: 100% 100%; z-index: 10; } .project-green { position: absolute; right: 10rpx; top: 10rpx; width: 48rpx; height: 48rpx; background-image: url('https://fohow.oss-cn-shenzhen.aliyuncs.com/xcx/green.png'); background-size: 100% 100%; z-index: 10; } .project-no { position: absolute; left: 10rpx; top: 10rpx; background: #8fcd85; z-index: 10; font-size: 25rpx; color: #fff; height: 35rpx; width: 96rpx; text-align: center; line-height: 35rpx; } .project-jizhu { position: absolute; left: 10rpx; top: 10rpx; background: #ffb468; z-index: 10; font-size: 25rpx; color: #fff; height: 35rpx; width: 96rpx; text-align: center; line-height: 35rpx; } .project-jieshu { position: absolute; left: 10rpx; top: 10rpx; background: red; z-index: 10; font-size: 25rpx; color: #fff; height: 35rpx; width: 96rpx; text-align: center; line-height: 35rpx; } .project-chenggong { position: absolute; left: 10rpx; top: 10rpx; background: skyblue; z-index: 10; font-size: 25rpx; color: #fff; height: 35rpx; width: 96rpx; text-align: center; line-height: 35rpx; } .project-tuikuan { position: absolute; left: 10rpx; top: 10rpx; background: brown; z-index: 10; font-size: 25rpx; color: #fff; height: 35rpx; width: 96rpx; text-align: center; line-height: 35rpx; } .project-jindu { height: 80rpx; width: 710rpx; background: #f9f9f9; position: relative; /* padding: 32rpx 140rpx 0 100rpx; */ box-sizing: border-box; color: #fe7554; display:-webkit-box; display:flex; align-items:center; } .jindu { font-size: 30rpx; color: #ff9262; padding-left: 20rpx; padding-bottom:5rpx; /* position: absolute; top: 20rpx; left: 20rpx; */ /* float: left; */ flex:1; } .jindu-percent{ font-size: 30rpx; color: #ff9262; flex:1; padding-left: 20rpx; padding-right: 20rpx; padding-bottom:5rpx; /* position: absolute; top: 20rpx; right: 10rpx; */ /* float: right; */ } .kefu-icon{ position: fixed; bottom: 10rpx; right: 10rpx; z-index: 999; width: 132rpx; height: 132rpx; } .project-price { padding-top: 90rpx; font-size: 28rpx; color: #eab86a; } .selectitem { /* height: 216rpx; */ background: #fff; display: flex; box-sizing: border-box; padding: 40rpx 40rpx 0rpx; width: 100%; overflow: hidden; } .selectitem-index { display: inline-block; } .item-index { width: 96rpx; height: 96rpx; background: #fff; /* border-radius: 35%; */ margin-right: 50rpx; margin-bottom: 20rpx; /* display: inline-block; */ } .item-index:nth-child(5) { margin-right: 0; } .item-name { font-size: 20rpx; color: #000; text-align: center; width: 96rpx; } .seckill { width: 100%; /* display: none; */ } .seckill-top { position: relative; } .seckill-title { width: 710rpx; height: 66rpx; background: -webkit-linear-gradient(left, #fff, #fff1ee, #ffe4dd); background: -o-linear-gradient(right, #fff, #fff1ee, #ffe4dd); background: -moz-linear-gradient(right, #fff, #fff1ee, #ffe4dd); background: linear-gradient(to right, #fff, #fff1ee, #ffe4dd); margin: 30rpx auto 20rpx; border-radius: 5rpx; box-sizing: border-box; padding: 0 20rpx; } .seckill-img { display: block; width: 220rpx; height: 70rpx; position: absolute; left: 20rpx; top: -3rpx; } .time-text { color: #594848; font-size: 28rpx; float: right; line-height: 66rpx; height: 66rpx; padding-right: 20rpx; } .time-click { float: right; /* line-height: 58rpx; */ margin-top: 13rpx; /* height: 58rpx; */ font-size: 20rpx; color: #fff; } .time-item { float: right; margin-right: 5rpx } .time-kuang { background: #594848; height: 42rpx; width: 39rpx; text-align: center; line-height: 42rpx; font-size: 24rpx; } .time-kuang1 { background: #594848; height: 42rpx; width: 59rpx; text-align: center; line-height: 42rpx; margin-left: 10rpx; font-size: 24rpx; } .time-color { color: #614f4f; font-size: 24rpx; } .seckill-scrol { height: 90rpx; width: 100%; border-bottom: 1rpx solid #ddd; margin-bottom: 30rpx; } .time-nav { height: 90rpx; overflow: hidden; white-space: nowrap; } .time-part { display: inline-block; width: 20%; color: #4c4c4c; position: relative; height: 90rpx; } .part-text { /* color: #4c4c4c; */ font-size: 30rpx; font-weight: 600; text-align: center; } .part-text1 { /* color: #4c4c4c; */ font-size: 24rpx; text-align: center; } .seckill-teambuy { height: 402rpx; width: 710rpx; background: #f7f7f7; margin: 0 auto; border-radius: 10rpx; box-sizing: border-box; padding: 13rpx 13rpx 20rpx; margin-bottom: 20rpx; } .teambuy-buyimg { display: block; width: 454rpx; height: 242rpx; background: #8fcd85; float: left; } .teambuy-top { margin-bottom: 10rpx; } .teambuy-top-right { width: 230rpx; height: 242rpx; background: #fff; float: right } .teambuy-buytext { color: #999999; font-size: 26rpx; text-align: center; padding-top: 30rpx; padding-bottom: 30rpx; } .teambuy-buytext1 { color: #eab86a; font-weight: 600; text-align: center; font-size: 36rpx; padding-bottom: 30rpx; } .teambuy-buytext2 { color: #999999; text-align: center; font-size: 22rpx; text-decoration: line-through; } .teambuy-bottom-title { /* height: 75rpx; */ width: 454rpx; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; font-size: 28rpx; color: #4c4c4c; margin-bottom: 15rpx; } .teambuy-bottom-shopcar { display: block; height: 22rpx; width: 24rpx; float: left; margin-right: 20rpx; padding-top: 5rpx; } .teambuy-bottom-shoptext { float: left; color: #999999; font-size: 22rpx; } .teambuy-bottom-left { float: left; } .teambuy-bottom-right { float: right; margin-right: 20rpx; } .teambuy-bottom-btn { width: 196rpx; height: 76rpx; background: -webkit-linear-gradient(left, #ff5f5d, #ff7f6a, #ff9973); background: -o-linear-gradient(right, #ff5f5d, #ff7f6a, #ff9973); background: -moz-linear-gradient(right, #ff5f5d, #ff7f6a, #ff9973); background: linear-gradient(to right, #ff5f5d, #ff7f6a, #ff9973); border-radius: 50rpx; font-size: 31rpx; color: #fff; text-align: center; line-height: 76rpx; margin-top: 30rpx; } .seckill-project { height: 288rpx; width: 710rpx; background: #f7f7f7; box-sizing: border-box; padding: 13rpx; /* padding-right: 0; */ margin: 0 auto; margin-bottom: 38rpx; } .seckill-project-img { display: block; height: 264rpx; width: 265rpx; background: #fff; } .seckill-project-left { float: left; } .seckill-project-right { float: right; padding-left: 10rpx; /* box-sizing: border-box; */ } .seckill-project-text { color: #999999; text-align: center; font-size: 26rpx; } .seckill-project-text1 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; width: 400rpx; height: 75rpx; font-size: 28rpx; color: #4c4c4c; margin-top: 20rpx; margin-bottom: 20rpx; } .seckill-project-text2 { font-size: 24rpx; color: #999999; margin-bottom: 30rpx; } .seckill-project-moneypart { float: left; } .seckill-project-btnpart { float: right; margin-right: 20rpx; } .seckill-moneypart-text { color: #eab86a; font-weight: 600; font-size: 32rpx; } .seckill-moneypart-text1 { color: #999999; font-size: 32rpx; font-size: 20rpx; text-decoration: line-through; } .seckill-project-btn { width: 196rpx; height: 76rpx; background: -webkit-linear-gradient(left, #ff5f5d, #ff7f6a, #ff9973); background: -o-linear-gradient(right, #ff5f5d, #ff7f6a, #ff9973); background: -moz-linear-gradient(right, #ff5f5d, #ff7f6a, #ff9973); background: linear-gradient(to right, #ff5f5d, #ff7f6a, #ff9973); border-radius: 50rpx; font-size: 31rpx; color: #fff; text-align: center; line-height: 76rpx; } .teamshopping { position: relative; margin-bottom: 30rpx; } .teamshopping-title { width: 710rpx; height: 66rpx; background: -webkit-linear-gradient(left, #fff, #f3f3f3, #e5e5e5); background: -o-linear-gradient(right, #fff, #f3f3f3, #e5e5e5); background: -moz-linear-gradient(right, #fff, #f3f3f3, #e5e5e5); background: linear-gradient(to right, #fff, #f3f3f3, #e5e5e5); margin: 30rpx auto 30rpx; border-radius: 5rpx; box-sizing: border-box; padding: 0 20rpx; } .teamshopping-titleimg { display:block; width:220rpx; height:70rpx; position:absolute; left:20rpx; top:-3rpx; } .teamshopping-item { /* height: 436rpx; */ width: 710rpx; background: #f7f7f7; margin: 0 auto 20rpx; box-sizing: border-box; padding: 13rpx; border-radius:10rpx; position: relative; } .teamshopping-img { display: block; height: 242rpx; width: 456rpx; background: #a6bfd4; } .teamshopping-topleft { float: left; } .teamshopping-topright { position: relative; float: right; background: #fff; width: 230rpx; height: 242rpx; } .teamshopping-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; width: 684rpx; /* height: 75rpx; */ font-size: 28rpx; color: #4c4c4c; margin-top: 20rpx; margin-bottom: 20rpx; } .teamshopping-text { color: #bbbbbb; font-size: 24rpx; float: left; padding-right: 45rpx; padding-top: 12.5rpx; } .teamshopping-text1 { color: #4c4c4c; font-size: 24rpx; float: left; /* padding-right: 205rpx; */ padding-top: 12.5rpx; } .teamshopping-text2 { color: #999999; font-size: 24rpx; float: right; padding-top: 12.5rpx; padding-right: 10rpx; } .teamshopping-text3 { color: #4c4c4c; font-size: 35rpx; float: left; font-weight: 600; padding-right: 10rpx; } .newprojects-title { width: 710rpx; height: 66rpx; background: -webkit-linear-gradient(left, #fff, #f3f3f3, #e5e5e5); background: -o-linear-gradient(right, #fff, #f3f3f3, #e5e5e5); background: -moz-linear-gradient(right, #fff, #f3f3f3, #e5e5e5); background: linear-gradient(to right, #fff, #f3f3f3, #e5e5e5); margin: 0 auto 30rpx; border-radius: 5rpx; box-sizing: border-box; padding: 0 20rpx; } .newprojects-titleimg { display:block; width:220rpx; height:70rpx; position:absolute; left:20rpx; top:6rpx; } .circle { width: 160rpx; height: 160rpx; position: absolute; right: 26rpx; top: 20rpx; border-radius: 50%; background: #ff7655; /* background: -webkit-linear-gradient(#ff7555, #ff865a, #ff9f62); background: -o-linear-gradient(#ff7555, #ff865a ,#ff9f62); background: -moz-linear-gradient(#ff7555, #ff865a, #ff9f62); background: linear-gradient(#ff7555, #ff865a, #ff9f62); */ overflow: hidden; } .clip_left,.clip_right{ width:160rpx; height:160rpx; position: absolute; top: 0rpx; left: 0rpx; } .circle_left, .circle_right{ width:160rpx; height:160rpx; position: absolute; border-radius: 50%; top: 0rpx; left: 0rpx; } .mask { width: 120rpx; height: 120rpx; border-radius: 50%; left: 21rpx; top: 21rpx; background: #FFF; position: absolute; text-align: center; line-height: 120rpx; font-size: 28rpx; } .circle_right,.clip_right { clip:rect(0,auto,auto,80rpx); } .circle_left , .clip_left{ clip:rect(0,80rpx,auto,0); } .circle_left{ background: #eee; } .circle_right{ background: #eee; } .end{ font-size: 25rpx; color: #bbbbbb; /* float: right; */ /* margin-top: 27rpx; */ /* margin-right: 65rpx; */ position: absolute; right:65rpx; top:193rpx; } .project-no { position: absolute; left: 13rpx; top: 13rpx; background: -webkit-linear-gradient(left, #2fbd2d, #56cd33, #7cde38); background: -o-linear-gradient(right, #2fbd2d, #56cd33, #7cde38); background: -moz-linear-gradient(right, #2fbd2d, #56cd33, #7cde38); background: linear-gradient(to right, #2fbd2d, #56cd33, #7cde38); z-index: 10; font-size: 25rpx; color: #fff; height: 35rpx; width: 96rpx; text-align: center; line-height: 35rpx; } .project-jizhu { position: absolute; left: 13rpx; top: 13rpx; background: -webkit-linear-gradient(left, #ff5d5d, #ff7e69, #ff9a73); background: -o-linear-gradient(right, #ff5d5d, #ff7e69, #ff9a73); background: -moz-linear-gradient(right, #ff5d5d, #ff7e69, #ff9a73); background: linear-gradient(to right, #ff5d5d, #ff7e69, #ff9a73); z-index: 10; font-size: 25rpx; color: #fff; height: 35rpx; width: 96rpx; text-align: center; line-height: 35rpx; } .project-chenggong { position: absolute; left: 13rpx; top: 13rpx; background: -webkit-linear-gradient(left, #845f44, #a4835d, #c2a374); background: -o-linear-gradient(right, #845f44, #a4835d, #c2a374); background: -moz-linear-gradient(right, #845f44, #a4835d, #c2a374); background: linear-gradient(to right, #845f44, #a4835d, #c2a374); z-index: 10; font-size: 25rpx; color: #fff; height: 35rpx; width: 96rpx; text-align: center; line-height: 35rpx; } .active { color: #eab86a; /* border-bottom: 1rpx solid #eab86a; */ /* border-width: 32rpx; */ } .part-bottom { position:absolute; /* width:50%; */ height:6rpx; width:32rpx; margin: 10rpx auto 0; background:#eab86a; left: 50%; bottom: 0; transform: translate(-50%); } .othercolor { color:#eab86a; background:#fff; font-weight:600; border:1rpx solid #cccccc; } .othercolor1 { color:#c68987; background:#fff; border:1rpx solid #cccccc; } .othercolor2 { color: #fff; background:-webkit-linear-gradient(left, #d8dfe5, #aab6c2); background:linear-gradient(to right, #d8dfe5, #aab6c2); border:1rpx solid #cccccc; } .project-miaosha { width: 60rpx; height: 28rpx; display: inline-block; float: left; padding-top: 95rpx; padding-right: 10rpx; } .project-stop { height: 38rpx; width: 258rpx; background: #ffefe4; color: #ff9434; position: absolute; right: 10rpx; bottom: 13rpx; font-size: 20rpx; text-align: center; line-height: 38rpx; } .seckill-no-img { display: block; width: 710rpx; height: 288rpx; margin: 30rpx auto 40rpx; } .seckill-no-text { text-align: center; color: #999; font-size: 24rpx; margin-bottom: 60rpx; } .project-video{ width:100%; position: relative; } .video-box{} .video-box .project-title{ font-size: 18px; padding: 10px 15px; line-height: normal; height: auto; } .video-box .project-price{ float: none !important; padding: 0 15px; font-size: 18px; } .video-box .project-count{ padding: 5px 15px; } .video-buybtn{ position: absolute; bottom: 15px; right: 20px; padding: 0px 20px; background: #eab86a; color: #FFF; border-radius: 45px; font-size: 14px; } .playImg{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 94rpx; height: 94rpx; }