|
...
|
...
|
@@ -12,11 +12,109 @@ swiper{ |
|
|
|
width: 519rpx;
|
|
|
|
height: 577rpx;
|
|
|
|
margin: 190rpx auto;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
.index_zhutu {
|
|
|
|
width: 314rpx;
|
|
|
|
height: 347rpx;
|
|
|
|
position: absolute;
|
|
|
|
left: 110rpx;
|
|
|
|
bottom: 85rpx;
|
|
|
|
}
|
|
|
|
.image0 {
|
|
|
|
position: absolute;
|
|
|
|
}
|
|
|
|
.imgPolytope image {
|
|
|
|
.fenxi {
|
|
|
|
width:57rpx;
|
|
|
|
height:28rpx;
|
|
|
|
/* opacity: 0.5; */
|
|
|
|
top: 156rpx;
|
|
|
|
right: 12rpx;
|
|
|
|
}
|
|
|
|
.jiaohu {
|
|
|
|
width:69rpx;
|
|
|
|
height:34rpx;
|
|
|
|
left: 0;
|
|
|
|
top: 120rpx;
|
|
|
|
}
|
|
|
|
.xiezuo {
|
|
|
|
width:53rpx;
|
|
|
|
height:26rpx;
|
|
|
|
top: 0;
|
|
|
|
left: 210rpx;
|
|
|
|
}
|
|
|
|
.guankong {
|
|
|
|
width:62rpx;
|
|
|
|
height:31rpx;
|
|
|
|
right: 0;
|
|
|
|
top: 360rpx;
|
|
|
|
}
|
|
|
|
.image01 {
|
|
|
|
width: 78rpx;
|
|
|
|
height: 68rpx;
|
|
|
|
top: 197rpx;
|
|
|
|
left: 58rpx;
|
|
|
|
z-index: -1;
|
|
|
|
}
|
|
|
|
.image02 {
|
|
|
|
width: 56rpx;
|
|
|
|
height: 47rpx;
|
|
|
|
right: 116rpx;
|
|
|
|
top: 110rpx;
|
|
|
|
}
|
|
|
|
.image03 {
|
|
|
|
left: 20rpx;
|
|
|
|
bottom: 112rpx;
|
|
|
|
width: 103rpx;
|
|
|
|
height: 84rpx;
|
|
|
|
}
|
|
|
|
.image04 {
|
|
|
|
right: 60rpx;
|
|
|
|
bottom: 115rpx;
|
|
|
|
width: 100rpx;
|
|
|
|
height: 85rpx;
|
|
|
|
}
|
|
|
|
.image05 {
|
|
|
|
left: 10rpx;
|
|
|
|
top: 289rpx;
|
|
|
|
width: 58rpx;
|
|
|
|
height: 48rpx;
|
|
|
|
}
|
|
|
|
.image06 {
|
|
|
|
left: 200rpx;
|
|
|
|
bottom: 0;
|
|
|
|
width: 97rpx;
|
|
|
|
height: 82rpx;
|
|
|
|
}
|
|
|
|
.image07 {
|
|
|
|
left: 100rpx;
|
|
|
|
bottom: 0;
|
|
|
|
width: 57rpx;
|
|
|
|
height: 47rpx;
|
|
|
|
}
|
|
|
|
.image08 {
|
|
|
|
top: 80rpx;
|
|
|
|
left: 224rpx;
|
|
|
|
width: 56rpx;
|
|
|
|
height: 47rpx;
|
|
|
|
}
|
|
|
|
.image09 {
|
|
|
|
top: 248rpx;
|
|
|
|
right: 34rpx;
|
|
|
|
width: 92rpx;
|
|
|
|
height: 77rpx;
|
|
|
|
z-index: -1;
|
|
|
|
}
|
|
|
|
.image10 {
|
|
|
|
bottom: 19rpx;
|
|
|
|
right: 110rpx;
|
|
|
|
width: 66rpx;
|
|
|
|
height: 55rpx;
|
|
|
|
}
|
|
|
|
/* .imgPolytope image {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
} */
|
|
|
|
.index_title{
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
...
|
...
|
@@ -38,10 +136,64 @@ swiper{ |
|
|
|
transform: translateX(1000px);
|
|
|
|
}
|
|
|
|
|
|
|
|
.drop_img{
|
|
|
|
display: none;
|
|
|
|
/* 动画 */
|
|
|
|
@keyframes heart{
|
|
|
|
from{transform:translate(0,0)}
|
|
|
|
to{transform:translate(0,24rpx)}
|
|
|
|
}
|
|
|
|
@keyframes heart01{
|
|
|
|
from{transform:translate(0,0)}
|
|
|
|
to{transform:translate(0,20rpx)}
|
|
|
|
}
|
|
|
|
@keyframes heart02 {
|
|
|
|
from{transform: translate(0,0)}
|
|
|
|
to{transform: translate(0,30rpx)}
|
|
|
|
}
|
|
|
|
.fenxi.heart{
|
|
|
|
animation: heart 1.3s ease-in-out 2.7s infinite alternate;
|
|
|
|
}
|
|
|
|
.guankong.heart{
|
|
|
|
animation: heart 2s ease-in-out 4s infinite alternate;
|
|
|
|
}
|
|
|
|
.xiezuo.heart{
|
|
|
|
animation: heart 1.9s ease-in-out 2.6s infinite alternate;
|
|
|
|
}
|
|
|
|
.jiaohu.heart{
|
|
|
|
animation: heart 1.6s ease-in-out 2.2s infinite alternate;
|
|
|
|
}
|
|
|
|
.image01.heart01{
|
|
|
|
animation: heart01 1.7s ease-in-out 3.3s infinite alternate;
|
|
|
|
}
|
|
|
|
.image02.heart01{
|
|
|
|
animation: heart01 2s ease-in-out 3s infinite alternate;
|
|
|
|
}
|
|
|
|
.image03.heart01{
|
|
|
|
animation: heart01 1s ease-in-out 2.5s infinite alternate;
|
|
|
|
}
|
|
|
|
.image04.heart{
|
|
|
|
animation: heart 1.8s ease-in-out 2.7s infinite alternate;
|
|
|
|
}
|
|
|
|
.image05.heart01{
|
|
|
|
animation: heart01 2.1s ease-in-out 3.5s infinite alternate;
|
|
|
|
}
|
|
|
|
.image06.heart02{
|
|
|
|
animation: heart02 2.6s ease-in-out 3s infinite alternate;
|
|
|
|
}
|
|
|
|
.image07.heart02{
|
|
|
|
animation: heart02 1.6s ease-in-out 3.1s infinite alternate;
|
|
|
|
}
|
|
|
|
.image08.heart02{
|
|
|
|
animation: heart02 1.4s ease-in-out 2.9s infinite alternate;
|
|
|
|
}
|
|
|
|
.image09.heart01{
|
|
|
|
animation: heart01 2.8s ease-in-out 3.6s infinite alternate;
|
|
|
|
}
|
|
|
|
.image10.heart02{
|
|
|
|
animation: heart 2.3s ease-in-out 3.5s infinite alternate;
|
|
|
|
}
|
|
|
|
.drop_img.heart{
|
|
|
|
animation: heart 1.1s ease-in-out 2.5s infinite alternate;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 第二屏 */
|
|
|
|
|
|
|
|
/* pages/case/case.wxss */
|
|
...
|
...
|
@@ -50,58 +202,66 @@ swiper{ |
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
background: #F0EEED;
|
|
|
|
position: relative;
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
}
|
|
|
|
.case_wrap .case_banner_box {
|
|
|
|
width: 100%;
|
|
|
|
height: 540rpx;
|
|
|
|
background: #fff;
|
|
|
|
position: relative;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding-top: 20rpx;
|
|
|
|
}
|
|
|
|
.case_wrap .case_banner_box swiper {
|
|
|
|
width: 100%;
|
|
|
|
height: 487rpx;
|
|
|
|
}
|
|
|
|
.case_wrap .case_banner_box image {
|
|
|
|
.bg {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
height: 476rpx;
|
|
|
|
background: url("http://pjq0ww1cj.bkt.clouddn.com/bg.png") no-repeat center;
|
|
|
|
background-size: 100%;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
.dots{
|
|
|
|
/* width: 156rpx; */
|
|
|
|
/* height: 36rpx; */
|
|
|
|
display: flex;
|
|
|
|
flex-direction: row;
|
|
|
|
position: absolute;
|
|
|
|
left: 320rpx;
|
|
|
|
bottom: 20rpx;
|
|
|
|
/* margin-top: -18rpx; */
|
|
|
|
}
|
|
|
|
/*未选中时的小圆点样式 */
|
|
|
|
.dot{
|
|
|
|
width: 16rpx;
|
|
|
|
height: 16rpx;
|
|
|
|
border-radius: 50%;
|
|
|
|
margin-right: 26rpx;
|
|
|
|
background-color:#CCCCCC;
|
|
|
|
}
|
|
|
|
/*选中以后的小圆点样式 */
|
|
|
|
.active{
|
|
|
|
width: 16rpx;
|
|
|
|
height: 16rpx;
|
|
|
|
border-radius:8rpx;
|
|
|
|
background-color: #FB7F47;
|
|
|
|
.case_wrap .case_banner_box image {
|
|
|
|
width: 690rpx;
|
|
|
|
height: 429rpx;
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
|
|
|
right: 0;
|
|
|
|
top: 0;
|
|
|
|
bottom: 0;
|
|
|
|
margin: auto;
|
|
|
|
border-radius: 10rpx;
|
|
|
|
}
|
|
|
|
.min_bg {
|
|
|
|
width:590rpx;
|
|
|
|
height:344rpx;
|
|
|
|
background:rgba(18,142,238,0.1);
|
|
|
|
border-radius:10rpx;
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
|
|
|
/* top: 0; */
|
|
|
|
bottom: 22rpx;
|
|
|
|
right: 0;
|
|
|
|
margin: auto;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*案例css */
|
|
|
|
.case_box {
|
|
|
|
width: 100%;
|
|
|
|
height: 647rpx;
|
|
|
|
/* height: 647rpx; */
|
|
|
|
background: #fff;
|
|
|
|
position: absolute;
|
|
|
|
flex: 1;
|
|
|
|
margin-top: 20rpx;
|
|
|
|
/* position: absolute;
|
|
|
|
bottom: 0;
|
|
|
|
left: 0;
|
|
|
|
left: 0; */
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
/* padding-bottom: 40rpx; */
|
|
|
|
}
|
|
|
|
.case_title {
|
|
|
|
width: 100%;
|
|
...
|
...
|
@@ -118,7 +278,7 @@ background-color: #FB7F47; |
|
|
|
.case_title_content .case_contnet_line {
|
|
|
|
position: absolute;
|
|
|
|
width:100%;
|
|
|
|
height:1rpx;
|
|
|
|
height:2rpx;
|
|
|
|
background:linear-gradient(90deg,rgba(240,131,12,1),rgba(230,0,18,1));
|
|
|
|
opacity:0.5;
|
|
|
|
left: 0;
|
|
...
|
...
|
@@ -133,7 +293,7 @@ background-color: #FB7F47; |
|
|
|
position: absolute;
|
|
|
|
top: 0;
|
|
|
|
left: 50%;
|
|
|
|
margin-left: -76rpx;
|
|
|
|
margin-left: -72rpx;
|
|
|
|
background-color: #fff;
|
|
|
|
color: #000000;
|
|
|
|
font-size: 30rpx;
|
|
...
|
...
|
@@ -169,11 +329,25 @@ background-color: #FB7F47; |
|
|
|
left: 50%; */
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 第三屏 */
|
|
|
|
.app_lication_banner {
|
|
|
|
/* 跳转按钮 */
|
|
|
|
.jump_btns {
|
|
|
|
box-sizing: border-box;
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
position: relative;
|
|
|
|
padding: 0 31rpx;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
}
|
|
|
|
.jump_btn {
|
|
|
|
width: 330rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
border-radius: 10rpx;
|
|
|
|
background: -moz-linear-gradient( 65deg, rgb(250,117,81) 0%, rgb(253,144,52) 55%, rgb(255,170,22) 100%);
|
|
|
|
background: -webkit-linear-gradient( 65deg, rgb(250,117,81) 0%, rgb(253,144,52) 55%, rgb(255,170,22) 100%);
|
|
|
|
background: -ms-linear-gradient( 65deg, rgb(250,117,81) 0%, rgb(253,144,52) 55%, rgb(255,170,22) 100%);
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 28rpx;
|
|
|
|
}
|
|
|
|
swiper {
|
|
|
|
width: 100%;
|
|
...
|
...
|
@@ -184,56 +358,11 @@ swiper image { |
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.dots{
|
|
|
|
/* width: 156rpx; */
|
|
|
|
height: 36rpx;
|
|
|
|
display: flex;
|
|
|
|
flex-direction: row;
|
|
|
|
position: absolute;
|
|
|
|
left: 325rpx;
|
|
|
|
bottom: 100rpx;
|
|
|
|
}
|
|
|
|
/*未选中时的小圆点样式 */
|
|
|
|
.dot{
|
|
|
|
width: 16rpx;
|
|
|
|
height: 16rpx;
|
|
|
|
border-radius: 50%;
|
|
|
|
margin-right: 26rpx;
|
|
|
|
background-color:#CCCCCC;
|
|
|
|
}
|
|
|
|
/*选中以后的小圆点样式 */
|
|
|
|
.active{
|
|
|
|
width: 16rpx;
|
|
|
|
height: 16rpx;
|
|
|
|
border-radius:8rpx;
|
|
|
|
background-color: #FB7F47;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 跳转下一页 */
|
|
|
|
.drop_img {
|
|
|
|
position: absolute;
|
|
|
|
bottom: 40rpx;
|
|
|
|
left: 50%;
|
|
|
|
margin-left: -146rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.aboutUs{
|
|
|
|
height: 70rpx;
|
|
|
|
width: 220rpx;
|
|
|
|
font-size: 28rpx;
|
|
|
|
color: #FFF;
|
|
|
|
background-color: #FFA333;
|
|
|
|
border-radius: 35rpx;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
|
|
|
position: fixed;
|
|
|
|
bottom: 100rpx;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
-webkit-transform: translateX(-50%);
|
|
|
|
z-index: 15;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
...
|
...
|
|
