|
|
@ -0,0 +1,423 @@ |
|
|
|
ul,li{ |
|
|
|
list-style: none; |
|
|
|
} |
|
|
|
.yxj-flex { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
.yxj-center { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
} |
|
|
|
.yxj-col { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
flex-direction: column; |
|
|
|
} |
|
|
|
.yxj-space { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
.yxj-wrapper { |
|
|
|
display: flex; |
|
|
|
flex-wrap: wrap; |
|
|
|
align-content: flex-start; |
|
|
|
} |
|
|
|
.yxj-overflow { |
|
|
|
white-space: nowrap; |
|
|
|
overflow: hidden; |
|
|
|
text-overflow: ellipsis; |
|
|
|
} |
|
|
|
.yxj-full { |
|
|
|
width: 100vw; |
|
|
|
height: 100vh; |
|
|
|
overflow-y: auto; |
|
|
|
box-sizing: border-box; |
|
|
|
} |
|
|
|
.yxj-border{ |
|
|
|
border-bottom: 1px solid #e7e7e7; |
|
|
|
} |
|
|
|
.yxj-container{ |
|
|
|
width: 1200px; |
|
|
|
margin: 0 auto; |
|
|
|
/* overflow: hidden; */ |
|
|
|
} |
|
|
|
.zlxc-container{ |
|
|
|
min-width: 1000px; |
|
|
|
max-width: 1200px; |
|
|
|
margin: 0 auto; |
|
|
|
} |
|
|
|
.flex { |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
.deposit .el-form { |
|
|
|
width: 488px; |
|
|
|
margin: 0 auto; |
|
|
|
} |
|
|
|
.deposit .el-dialog { |
|
|
|
border-radius: 4px; |
|
|
|
} |
|
|
|
.deposit .el-dialog__header { |
|
|
|
padding: 28px 28px 20px 28px; |
|
|
|
} |
|
|
|
.deposit .el-dialog__title { |
|
|
|
line-height: 28px; |
|
|
|
font-size: 20px; |
|
|
|
color: #333; |
|
|
|
} |
|
|
|
.deposit .el-input__inner { |
|
|
|
height: 50px; |
|
|
|
line-height: 50px; |
|
|
|
font-size: 16px; |
|
|
|
color: #666; |
|
|
|
} |
|
|
|
.deposit .el-form-item:first-of-type { |
|
|
|
margin-bottom: 48px; |
|
|
|
} |
|
|
|
.deposit .el-form-item:nth-of-type(2) { |
|
|
|
margin-bottom: 33px; |
|
|
|
} |
|
|
|
.deposit .el-form-item:last-of-type { |
|
|
|
margin-bottom: 3px; |
|
|
|
} |
|
|
|
.deposit .el-form .el-button--primary { |
|
|
|
width: 100%; |
|
|
|
height: 45px; |
|
|
|
line-height: 45px; |
|
|
|
text-align: center; |
|
|
|
background-color: #d9534f; |
|
|
|
border-radius: 22px; |
|
|
|
color: #ffffff; |
|
|
|
cursor: pointer; |
|
|
|
padding: 0; |
|
|
|
border: none; |
|
|
|
font-size: 18px; |
|
|
|
} |
|
|
|
.home .swiper-area li.is-active .el-carousel__button { |
|
|
|
background-color: #ee1c24; |
|
|
|
} |
|
|
|
.home .swiper-area li .el-carousel__button { |
|
|
|
background-color: #979797; |
|
|
|
} |
|
|
|
.join .main-area li.is-active .el-carousel__button { |
|
|
|
background-color: #ee1c24; |
|
|
|
} |
|
|
|
.join .main-area li .el-carousel__button { |
|
|
|
background-color: #979797; |
|
|
|
} |
|
|
|
.swiper-pagination-bullet-active { |
|
|
|
background-color: #cd1134; |
|
|
|
opacity: 1; |
|
|
|
} |
|
|
|
|
|
|
|
.banner-item { |
|
|
|
display: block; |
|
|
|
width: 100%; |
|
|
|
height: 397px; |
|
|
|
} |
|
|
|
.swiper-wrapper .swiper-slide { |
|
|
|
position: relative; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
/* .swiper-wrapper .swiper-slide.swiper-slide-active .banner-item:hover, |
|
|
|
.banner-area img:hover{ |
|
|
|
cursor: pointer; |
|
|
|
transition: all 5s; |
|
|
|
transform: scale(1.1) translateZ(0); |
|
|
|
animation-timing-function: linear; |
|
|
|
} */ |
|
|
|
.swiper-wrapper .swiper-slide .sinfo{ |
|
|
|
position: absolute; |
|
|
|
bottom: 0; |
|
|
|
right: 0; |
|
|
|
padding: 0 25px 0 23px; |
|
|
|
min-width: 389px; |
|
|
|
height: 43px; |
|
|
|
line-height: 43px; |
|
|
|
font-size: 16px; |
|
|
|
color: #FFFFFF; |
|
|
|
background: rgba(215, 0, 15, 0.9); |
|
|
|
box-sizing: border-box; |
|
|
|
} |
|
|
|
.bullet-active { |
|
|
|
background-color: #cc0000; |
|
|
|
opacity: 1; |
|
|
|
} |
|
|
|
.swiper-area { |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
.swiper-pagination { |
|
|
|
position: relative; |
|
|
|
/* margin-top: 18px; */ |
|
|
|
} |
|
|
|
.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets{ |
|
|
|
bottom: 30px; |
|
|
|
} |
|
|
|
.swiper-pagination-bullet{ |
|
|
|
width: 16px; |
|
|
|
height: 16px; |
|
|
|
background: transparent; |
|
|
|
border: 2px solid transparent; |
|
|
|
opacity: 1; |
|
|
|
position: relative; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
box-sizing: border-box; |
|
|
|
} |
|
|
|
.swiper-pagination-bullet::before{ |
|
|
|
content: ''; |
|
|
|
width: 6px; |
|
|
|
height: 6px; |
|
|
|
border-radius: 50%; |
|
|
|
background: #ffffff; |
|
|
|
position: absolute; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
bottom: 0; |
|
|
|
right: 0; |
|
|
|
margin: auto; |
|
|
|
} |
|
|
|
.swiper-pagination-bullet-active { |
|
|
|
/* background-color: #cc0000; */ |
|
|
|
border-color: #ffffff; |
|
|
|
opacity: 1; |
|
|
|
} |
|
|
|
|
|
|
|
.banner-area{ |
|
|
|
width: 100%; |
|
|
|
} |
|
|
|
.banner-area img{ |
|
|
|
width: 100%; |
|
|
|
} |
|
|
|
.title-wrapper{ |
|
|
|
text-align: center; |
|
|
|
margin-bottom: 38px; |
|
|
|
} |
|
|
|
.title-label{ |
|
|
|
margin: 0; |
|
|
|
margin-bottom: 15px; |
|
|
|
font-size: 20px; |
|
|
|
font-weight: 600; |
|
|
|
color: #333333; |
|
|
|
line-height: 36px; |
|
|
|
letter-spacing: 1px; |
|
|
|
} |
|
|
|
.title-label>span{ |
|
|
|
display: inline-block; |
|
|
|
padding-bottom: 3px; |
|
|
|
border-bottom: 1px solid #1989FA; |
|
|
|
} |
|
|
|
.sub-title-label{ |
|
|
|
font-size: 14px; |
|
|
|
font-weight: 400; |
|
|
|
color: #515151; |
|
|
|
line-height: 25px; |
|
|
|
} |
|
|
|
.sub-title-label>span{ |
|
|
|
display: inline-block; |
|
|
|
width: 852px; |
|
|
|
} |
|
|
|
|
|
|
|
.yxj-btn{ |
|
|
|
position: relative; |
|
|
|
border: 1px solid #333333; |
|
|
|
color: #333333; |
|
|
|
transition: all .5s ease; |
|
|
|
} |
|
|
|
|
|
|
|
.yxj-btn::after{ |
|
|
|
background: #1989FA; |
|
|
|
position: absolute; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
width: 0; |
|
|
|
height: 100%; |
|
|
|
content: ''; |
|
|
|
opacity: 0; |
|
|
|
transition: all .5s ease; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.swiper-button-prev, .swiper-button-next{ |
|
|
|
outline: none; |
|
|
|
} |
|
|
|
|
|
|
|
.swiper-button{ |
|
|
|
padding: 20px; |
|
|
|
width: 100px; |
|
|
|
height: 100px; |
|
|
|
margin-top: -85px; |
|
|
|
transition: all .3s; |
|
|
|
} |
|
|
|
.swiper-button.swiper-button-prev{ |
|
|
|
background-image: url('../assets/images/swiper_left.png'); |
|
|
|
background-size: 90px 90px; |
|
|
|
margin-left: -200px; |
|
|
|
} |
|
|
|
.swiper-button.swiper-button-next{ |
|
|
|
background-image: url('../assets/images/swiper_right.png'); |
|
|
|
background-size: 90px 90px; |
|
|
|
margin-right: -200px; |
|
|
|
} |
|
|
|
.swiper-area:hover .swiper-button.swiper-button-prev, |
|
|
|
.swiper-area:hover .swiper-button.swiper-button-next{ |
|
|
|
margin-left: 0; |
|
|
|
margin-right: 0; |
|
|
|
} |
|
|
|
:focus{ |
|
|
|
outline: none; |
|
|
|
} |
|
|
|
.el-message-box button.el-button--primary{ |
|
|
|
border-color: #4497F8; |
|
|
|
background: #4497F8; |
|
|
|
} |
|
|
|
.el-message-box button.el-button--primary:hover{ |
|
|
|
border-color: #4497F8; |
|
|
|
background: #4497F8; |
|
|
|
opacity: 0.6; |
|
|
|
} |
|
|
|
@media only screen and (min-width: 1200px) { |
|
|
|
.swiper-area{ |
|
|
|
min-width: 1200px; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
.yxj-btn:hover{ |
|
|
|
border-color: #1989FA!important; |
|
|
|
color: #FFFFFF!important; |
|
|
|
} |
|
|
|
.yxj-btn:hover::after{ |
|
|
|
opacity: 1; |
|
|
|
width: 100%; |
|
|
|
z-index: -1; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
@media only screen and (max-width: 1199px) { |
|
|
|
/* -webkit-tap-highlight-color:transparent; |
|
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); |
|
|
|
tap-highlight-color: rgba(0, 0, 0, 0); */ |
|
|
|
.swiper-wrapper .swiper-slide .sinfo{ |
|
|
|
min-width: 100%; |
|
|
|
max-width: 100%; |
|
|
|
padding: 0 5px; |
|
|
|
height: 24px; |
|
|
|
line-height: 24px; |
|
|
|
font-size: 10px; |
|
|
|
text-align: center; |
|
|
|
overflow: hidden; |
|
|
|
text-overflow: ellipsis; |
|
|
|
white-space: nowrap; |
|
|
|
} |
|
|
|
.yxj-container{ |
|
|
|
width: 100%; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
.swiper-pagination{ |
|
|
|
margin-top: 10px; |
|
|
|
} |
|
|
|
.swiper-pagination-bullet{ |
|
|
|
width: 6px; |
|
|
|
height: 6px; |
|
|
|
} |
|
|
|
.page-container{ |
|
|
|
padding: 60px 0; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
.page-container.swer{ |
|
|
|
margin-top: -29px; |
|
|
|
} |
|
|
|
.page-container .mobile-qr{ |
|
|
|
padding: 0 32px; |
|
|
|
margin: 0 auto; |
|
|
|
margin-bottom: 48px; |
|
|
|
} |
|
|
|
.page-container .mobile-qr.sm{ |
|
|
|
margin-bottom: 44px; |
|
|
|
} |
|
|
|
.page-container .mobile-qr:hover{ |
|
|
|
box-shadow: none; |
|
|
|
} |
|
|
|
.page-container .mobile-qr:last-child{ |
|
|
|
margin-bottom: 0; |
|
|
|
} |
|
|
|
.page-container .mobile-qr .wx-tips, |
|
|
|
.content-title{ |
|
|
|
position: relative; |
|
|
|
text-align: left; |
|
|
|
color: #333333; |
|
|
|
border-left: 3px solid #1989FA; |
|
|
|
font-weight: 600; |
|
|
|
padding-left: 8px; |
|
|
|
margin: 2.5px 0 12px; |
|
|
|
font-size: 17px; |
|
|
|
line-height: 20px; |
|
|
|
} |
|
|
|
.page-container .mobile-qr .wx-label>p{ |
|
|
|
color: #666666; |
|
|
|
line-height: 27px; |
|
|
|
font-size: 14px; |
|
|
|
text-align: left; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/* 弹性盒子公共样式 */ |
|
|
|
/* 排列方向-横向排列 */ |
|
|
|
.flex { |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
|
|
|
|
/* 纵向排列 */ |
|
|
|
.flex2 { |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
} |
|
|
|
|
|
|
|
/* 水平居中,垂直居中 */ |
|
|
|
.fcc { |
|
|
|
display: flex; |
|
|
|
justify-content: center; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
.floatLeft{ |
|
|
|
float: left; |
|
|
|
} |
|
|
|
/* 两端对齐 */ |
|
|
|
.jc-sb { |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
|
|
|
|
/* 分散对齐 */ |
|
|
|
.jc-sa { |
|
|
|
justify-content: space-around; |
|
|
|
} |
|
|
|
|
|
|
|
/* 垂直居中 */ |
|
|
|
.aic { |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
/* 水平居中 */ |
|
|
|
.jcc { |
|
|
|
justify-content: center; |
|
|
|
} |
|
|
|
.mt-25 { |
|
|
|
margin-top: 25px; |
|
|
|
} |
|
|
|
.mt-12 { |
|
|
|
margin-top: 12px; |
|
|
|
} |
|
|
|
.ml-25 { |
|
|
|
margin-left: 25px; |
|
|
|
} |
|
|
|
.mr-25 { |
|
|
|
margin-right: 25px; |
|
|
|
} |
|
|
|
.div-25{ |
|
|
|
height: 25px; |
|
|
|
} |
|
|
|
.div-50{ |
|
|
|
height: 50px; |
|
|
|
} |