1150 lines
21 KiB
CSS
1150 lines
21 KiB
CSS
.dot {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.setBetween {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.setRowCenter {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.setColumnCenter {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.setCenter {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.ra {
|
|
border-radius: 0.2rem;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.bs {
|
|
box-shadow: 0 0 0.5rem #ebebeb;
|
|
}
|
|
|
|
.a-hover:hover {
|
|
color: #3b52f6;
|
|
transform: translateX(0.2rem);
|
|
}
|
|
|
|
.img-cover img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
}
|
|
|
|
.sitemap {
|
|
background-color: #fafafb;
|
|
padding: 3rem 0;
|
|
display: none;
|
|
}
|
|
|
|
.sitemap .container {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.sitemap .container h3 {
|
|
font-size: 0.9rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.sitemap .container a {
|
|
display: block;
|
|
padding: 0.5rem 0;
|
|
}
|
|
|
|
.sitemap .container a:hover {
|
|
color: #3b52f6;
|
|
transform: translateX(0.2rem);
|
|
}
|
|
|
|
.sitemap {
|
|
display: block;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide {
|
|
background-color: #fff;
|
|
position: relative;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide>div {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide>.imgg img{
|
|
width: 100%;
|
|
}
|
|
|
|
.index-banner-txt {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: flex-end;
|
|
align-items: flex-start;
|
|
color: #2e2e2e;
|
|
position: absolute;
|
|
right: 3.4rem;
|
|
top: 3rem;
|
|
}
|
|
|
|
.index-banner-txt ins {
|
|
width: 100%;
|
|
font-size: 4.6rem;
|
|
line-height: 1;
|
|
text-decoration: none;
|
|
margin-bottom: 0 !important;
|
|
color: #00db6d;
|
|
text-align: right;
|
|
}
|
|
|
|
.index-banner-txt em {
|
|
font-size: 3.6rem;
|
|
line-height: 1;
|
|
margin-bottom: 1.2rem;
|
|
}
|
|
.index-banner-txt span{
|
|
width: 100%;
|
|
font-size: 1.5rem;
|
|
line-height: 1.2;
|
|
text-align: right;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.index-banner-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
height: 2.6rem;
|
|
padding: 0 0.9rem;
|
|
background-color: #00db6d;
|
|
color: #ffffff;
|
|
font-size: 0.9rem;
|
|
border-radius: 0.5rem;
|
|
position: absolute;
|
|
right: 3.4rem;
|
|
margin-top: 3.5rem;
|
|
bottom: 4rem;
|
|
transition: all .6s;
|
|
}
|
|
.index-banner-btn span{
|
|
padding-right: 1rem;
|
|
position: relative;
|
|
}
|
|
|
|
.index-banner-btn em{
|
|
margin-left: 0.3rem;
|
|
margin-top: 0.1rem;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 50%;
|
|
transform: scaleY(1.8) translateY(-32.5%);
|
|
transition: all .6s;
|
|
}
|
|
.index-banner-btn:hover{
|
|
opacity: 0.65 !important;
|
|
}
|
|
.index-banner-btn:hover em{
|
|
right: -0.3rem;
|
|
}
|
|
|
|
.index-banner-float{
|
|
height: 100%;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 2.7rem;
|
|
}
|
|
|
|
.index-banner-info{
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 18rem;
|
|
background-color: #03d068;
|
|
}
|
|
.index-banner-info .left{
|
|
width: 12rem;
|
|
margin-right: 8.5rem;
|
|
}
|
|
.index-banner-info .left h2{
|
|
font-size: 1.9rem;
|
|
line-height: 1.15;
|
|
color: #ffffff;
|
|
}
|
|
.index-banner-info .left span{
|
|
display: block;
|
|
font-size: 0.65rem;
|
|
color: #ffff1b;
|
|
margin-top: .4rem;
|
|
}
|
|
.index-banner-info .right{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
width: 42rem;
|
|
}
|
|
.index-banner-info .right .item{
|
|
width: calc(50% - 2.5rem);
|
|
}
|
|
.index-banner-info .right span{
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 1.2rem;
|
|
color: #ffff1b;
|
|
}
|
|
.index-banner-info .right span:before{
|
|
content: "";
|
|
width: 0.7rem;
|
|
height: 0.7rem;
|
|
border-radius: 100%;
|
|
background-color: #ffff1b;
|
|
margin-right: 0.5rem;
|
|
}
|
|
.index-banner-info .right em{
|
|
display: block;
|
|
margin-top: 1.2rem;
|
|
font-size: 0.75rem;
|
|
line-height: 1.2;
|
|
text-align: justify;
|
|
color: #fff;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide.slide1 .left a:hover {
|
|
background-color: #3b52f6;
|
|
color: #fff;
|
|
}
|
|
|
|
.index-banner .container {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
z-index: 10;
|
|
}
|
|
|
|
.index-banner .container .logo {
|
|
width: 38.3rem;
|
|
}
|
|
|
|
.index-banner .container>h2 {
|
|
font-size: 2.4rem;
|
|
color: #999;
|
|
margin-top: 0.9rem;
|
|
margin-bottom: 2rem;
|
|
}
|
|
|
|
.index-banner .container .search-con {
|
|
display: flex;
|
|
height: 2.4rem;
|
|
border-radius: 0.2rem;
|
|
border: 1px solid #3b52f6;
|
|
max-width: 32rem;
|
|
margin: 0 auto;
|
|
position: relative;
|
|
}
|
|
|
|
.index-banner .container .search-con>div {
|
|
height: 100%;
|
|
}
|
|
|
|
.index-banner .container .search-con .s-con:hover .bt::before {
|
|
display: block;
|
|
}
|
|
|
|
.index-banner .container .search-con .s-con:hover .content {
|
|
display: flex;
|
|
}
|
|
|
|
.index-banner .container .search-con .bt {
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
background-color: #3b52f6;
|
|
padding: 0 0.9rem;
|
|
cursor: pointer;
|
|
position: relative;
|
|
}
|
|
|
|
.index-banner .container .search-con .bt::before {
|
|
content: "";
|
|
position: absolute;
|
|
left: 50%;
|
|
top: calc(100% + 0.5rem);
|
|
border-bottom: 0.5rem solid #fff;
|
|
border-left: 0.5rem solid transparent;
|
|
border-right: 0.5rem solid transparent;
|
|
transform: translateX(-50%);
|
|
display: none;
|
|
}
|
|
|
|
.index-banner .container .search-con .bt>span {
|
|
margin-right: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .bt>span,
|
|
.index-banner .container .search-con .bt>.icon {
|
|
color: #fff;
|
|
}
|
|
|
|
.index-banner .container .search-con .content {
|
|
position: absolute;
|
|
top: 100%;
|
|
left: 50%;
|
|
width: 70rem;
|
|
display: none;
|
|
justify-content: space-between;
|
|
transform: translateX(-50%);
|
|
padding-top: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content h3 {
|
|
padding: 0 0.9rem;
|
|
height: 3rem;
|
|
line-height: 3rem;
|
|
margin: 0;
|
|
width: 20rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content .more-btn a {
|
|
padding: 0.3rem 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content nav {
|
|
background-color: #fafafb;
|
|
height: 35rem;
|
|
width: 20rem;
|
|
position: relative;
|
|
overflow: auto;
|
|
overflow-x: hidden;
|
|
padding-bottom: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content nav ul>li {
|
|
display: flex;
|
|
}
|
|
|
|
.index-banner .container .search-con .content nav ul>li>div {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 0.9rem 0.9rem;
|
|
flex-shrink: 0;
|
|
width: 100%;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.index-banner .container .search-con .content nav ul>li>div * {
|
|
color: #666;
|
|
}
|
|
|
|
.index-banner .container .search-con .content nav ul>li>div span {
|
|
font-size: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content nav ul>li>div:hover {
|
|
background-color: #fff;
|
|
}
|
|
|
|
.index-banner .container .search-con .content nav ul>li>div:hover * {
|
|
color: #3b52f6;
|
|
}
|
|
|
|
.index-banner .container .search-con .content nav ul .more-btn {
|
|
margin-top: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside {
|
|
width: 50rem;
|
|
background-color: #fff;
|
|
padding: 0 0.9rem;
|
|
flex-direction: column;
|
|
overflow: hidden;
|
|
z-index: 10;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside>div {
|
|
display: none;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside>div.active {
|
|
display: block;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .item {
|
|
display: none;
|
|
flex-direction: column;
|
|
height: 35rem;
|
|
padding-bottom: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .item.active {
|
|
display: flex;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .item .more-btn {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .courses-wrap ol>li {
|
|
width: 50%;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .courses-wrap ol>li>a {
|
|
display: block;
|
|
padding: 0.5rem 0;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .courses-wrap ol h5 {
|
|
font-size: 0.9rem;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .courses-wrap ol h5 em {
|
|
font-size: 0.6rem;
|
|
color: #3b52f6;
|
|
padding: 0.0.9rem 0.3rem;
|
|
border: 1px solid #3b52f6;
|
|
border-radius: 2rem;
|
|
margin-left: 0.5rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .courses-wrap ol p {
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .courses-wrap ol p span {
|
|
margin-right: 3rem;
|
|
font-size: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .courses-wrap ol p span:last-of-type {
|
|
margin-right: 0;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .courses-wrap ol p * {
|
|
color: #666;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .p-tit {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .p-tit h6 {
|
|
font-size: 0.9rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .p-tit p *,
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .p-tit p {
|
|
color: #999;
|
|
font-size: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .p-tit .t-logo {
|
|
max-width: 13rem;
|
|
width: 13rem;
|
|
height: 4.5rem;
|
|
background-color: #ccc;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .field {
|
|
height: 5rem;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .field .list {
|
|
padding: 0.5rem 0;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .field .list .icon {
|
|
color: #3b52f6;
|
|
font-size: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .field .list label {
|
|
font-size: 0.9rem;
|
|
margin: 0 0.3rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .field .list span {
|
|
color: #999;
|
|
font-size: 0.9rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li li {
|
|
width: 100%;
|
|
padding: 0.9rem 0;
|
|
padding-right: 4%;
|
|
border-bottom: 1px solid #ebebeb;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol>li .more-btn {
|
|
padding-bottom: 2rem;
|
|
margin-top: 2rem;
|
|
width: 100%;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol li {
|
|
width: 100%;
|
|
padding: 0.9rem 0;
|
|
padding-right: 4%;
|
|
border-bottom: 1px solid #ebebeb;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol li:last-of-type {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .program-wrap ol .more-btn {
|
|
padding-bottom: 2rem;
|
|
margin-top: 2rem;
|
|
width: 100%;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .tit {
|
|
position: relative;
|
|
border-bottom: 1px solid #ebebeb;
|
|
padding: 0.9rem 0;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .tit h4 {
|
|
font-size: 1.0.9rem;
|
|
margin: 0;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .tit i {
|
|
color: #3b52f6;
|
|
font-size: 1.3rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .tit p {
|
|
color: #666;
|
|
margin-top: 0.5rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .tit .close {
|
|
position: absolute;
|
|
top: 1.3rem;
|
|
right: 0;
|
|
width: 2rem;
|
|
height: 2rem;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside .tit .close i {
|
|
font-size: 1.3rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside ol {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
overflow: auto;
|
|
margin: 0.9rem 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside ol>li {
|
|
width: 100%;
|
|
}
|
|
|
|
.index-banner .container .search-con .content aside ol a:hover h5 {
|
|
color: #3b52f6;
|
|
}
|
|
|
|
.index-banner .container .search-con .inp {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 0 2%;
|
|
background-color: #fff;
|
|
overflow: hidden;
|
|
border-top-right-radius: 0.2rem;
|
|
border-bottom-right-radius: 0.2rem;
|
|
}
|
|
|
|
.index-banner .container .search-con .inp i {
|
|
color: #999;
|
|
}
|
|
|
|
.index-banner .container .search-con .inp input {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.index-banner .container .search-con>span {
|
|
position: absolute;
|
|
top: calc(100% + 0.2rem);
|
|
right: 0;
|
|
font-size: 0.9rem;
|
|
color: #666;
|
|
}
|
|
|
|
.main-title * {
|
|
text-align: center;
|
|
}
|
|
|
|
main .main-1{
|
|
padding-bottom: 7.5rem;
|
|
}
|
|
|
|
main .main-1 .container {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
main .main-1 .container .item {
|
|
width: calc(20% - 0.8rem);
|
|
height: 17.3rem;
|
|
margin-right: 1rem;
|
|
box-shadow: 0 0 0.5rem #ebebeb;
|
|
margin-bottom: 1.5rem;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
main .main-1 .container .item:nth-of-type(5n) {
|
|
margin-right: 0;
|
|
}
|
|
|
|
main .main-1 .container .item:nth-of-type(n + 11) {
|
|
display: none;
|
|
}
|
|
|
|
main .main-1 .container .item .img {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: #ccc;
|
|
}
|
|
|
|
main .main-1 .container .item .img img {
|
|
width: 100%;
|
|
min-height: 100%;
|
|
object-fit: cover;
|
|
}
|
|
|
|
main .main-1 .container .item .pull-bg{
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba(0, 0, 0, .5);
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 1;
|
|
transition: all .6s;
|
|
}
|
|
main .main-1 .container .item:hover .pull-bg{
|
|
background-color: rgba(0, 0, 0, .6);
|
|
}
|
|
|
|
main .main-1 .container .item .icon-more{
|
|
display: block;
|
|
width: 0.6rem;
|
|
height: 1.05rem;
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 0.9rem;
|
|
z-index: 2;
|
|
transform: translateY(-50%);
|
|
}
|
|
main .main-1 .container .item .icon-more img{
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
main .main-1 .container .item .text {
|
|
width: 7rem;
|
|
position: absolute;
|
|
left: 2.3rem;
|
|
bottom: 1.8rem;
|
|
z-index: 2;
|
|
}
|
|
|
|
main .main-1 .container .item .text h3 {
|
|
font-size: 0.8rem;
|
|
color: #00db6d;
|
|
margin-bottom: 0.4rem;
|
|
word-break: break-word;
|
|
text-align: left;
|
|
}
|
|
main .main-1 .container .item:nth-of-type(2) .text h3,
|
|
main .main-1 .container .item:nth-of-type(4) .text h3,
|
|
main .main-1 .container .item:nth-of-type(7) .text h3,
|
|
main .main-1 .container .item:nth-of-type(9) .text h3{
|
|
color: #ffff1b;
|
|
}
|
|
|
|
main .main-1 .container .item .text .par-con {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
main .main-1 .container .item .text .par-con .icon {
|
|
margin-right: 0.2rem;
|
|
display: none;
|
|
}
|
|
main .main-1 .container .item .text .par.w100,
|
|
main .main-1 .container .item .text .par.w100>span{
|
|
font-size: 0.5rem;
|
|
color: #ffffff;
|
|
padding: 0;
|
|
margin: 0;
|
|
height: 0.8rem;
|
|
line-height: 0.8rem;
|
|
}
|
|
main .main-1 .more-btn1{
|
|
display: none;
|
|
}
|
|
|
|
main .main-2 {
|
|
padding: 4.5rem 0 0;
|
|
background-color: #dedede;
|
|
}
|
|
main .main-2 .main-center{
|
|
max-width: 100%;
|
|
padding-top: 0.75rem;
|
|
}
|
|
main .main-2 .swiper-wrapper {
|
|
height: 32rem;
|
|
}
|
|
|
|
main .main-2 .container .item {
|
|
display: flex;
|
|
width: 100%;
|
|
height: 32rem;
|
|
overflow: hidden;
|
|
}
|
|
|
|
main .main-2 .container .item .img {
|
|
width: 66%;
|
|
height: 100%;
|
|
background-color: #ccc;
|
|
}
|
|
|
|
main .main-2 .container .item .img img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
}
|
|
|
|
main .main-2 .container .item .logo {
|
|
display: flex;
|
|
width: 50%;
|
|
height: 3rem;
|
|
margin: 0.5rem auto 0;
|
|
}
|
|
|
|
main .main-2 .container .item .logo img {
|
|
margin: auto;
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: scale-down;
|
|
}
|
|
|
|
main .main-2 .container .swiper-button{
|
|
display: none;
|
|
}
|
|
|
|
main .main-2 .container .more-btn1{
|
|
box-sizing: border-box;
|
|
height: 2.4rem;
|
|
padding: 0 0.8rem;
|
|
border: 0.15rem solid #ffff1b;
|
|
border-radius: 0.5rem;
|
|
position: absolute;
|
|
right: 2.8rem;
|
|
bottom: 2.5rem;
|
|
z-index: 999;
|
|
transition: all .6s;
|
|
}
|
|
main .main-2 .container .more-btn1 a{
|
|
display: flex;
|
|
align-items: center;
|
|
border: 0;
|
|
height: 100%;
|
|
color: #ffff1b;
|
|
padding-right: 1rem;
|
|
font-size: 0.9rem;
|
|
position: relative;
|
|
transition: all .6s;
|
|
}
|
|
main .main-2 .container .more-btn1 em{
|
|
margin-left: 0.3rem;
|
|
margin-top: 0.1rem;
|
|
transition: all .6s;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 50%;
|
|
transform: scaleY(1.8) translateY(-32.5%);
|
|
}
|
|
main .main-2 .container .more-btn1:hover{
|
|
opacity: .6;
|
|
}
|
|
main .main-2 .container .more-btn1:hover em{
|
|
right: -0.3rem;
|
|
}
|
|
|
|
main .main-2 .container .item .text {
|
|
box-sizing: border-box;
|
|
width: 34%;
|
|
padding: 3rem 2.5rem;
|
|
background-color: #7a7a7a;
|
|
}
|
|
|
|
main .main-2 .container .item .text p:first-child {
|
|
margin-bottom: 4rem !important;
|
|
}
|
|
|
|
main .main-2 .container .item .text em {
|
|
display: block;
|
|
font-size: 1rem;
|
|
color: #ffff1b;
|
|
margin-bottom: .4rem;
|
|
}
|
|
|
|
main .main-2 .container .item .text span {
|
|
max-width: 17rem;
|
|
line-height: 1.3;
|
|
color: #ffffff;
|
|
font-size: 1.25rem;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 5;
|
|
-webkit-box-orient: vertical;
|
|
}
|
|
|
|
.our-vision-bg{
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 20.5rem;
|
|
background-color: #00db6d;
|
|
}
|
|
.our-vision h3{
|
|
font-size: 1.9rem;
|
|
color: #ffff1b;
|
|
margin-bottom: 2rem;
|
|
}
|
|
.our-vision span{
|
|
display: block;
|
|
font-size: 0.85rem;
|
|
line-height: 1.5;
|
|
color: #ffffff;
|
|
}
|
|
|
|
main .main-3 {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 20.5rem;
|
|
background-color: #00db6d;
|
|
}
|
|
|
|
main .main-3 .main-title{
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
main .main-3 h2 {
|
|
font-size: 1.9rem;
|
|
color: #ffff1b;
|
|
margin-bottom: 2rem;
|
|
text-align: left;
|
|
}
|
|
|
|
main .main-3 p{
|
|
display: block;
|
|
max-width: 53rem;
|
|
font-size: 0.85rem;
|
|
line-height: 1.47;
|
|
color: #ffffff;
|
|
margin-bottom: 0 !important;
|
|
text-align: justify;
|
|
}
|
|
|
|
main .main-3 more-btn1{
|
|
display: none;
|
|
}
|
|
|
|
|
|
main .main-4{
|
|
padding: 6.4rem 0 4.5rem;
|
|
}
|
|
|
|
main .main-4 .main-title{
|
|
margin-bottom: 3.2rem;
|
|
}
|
|
|
|
main .main-4 .main-title h2{
|
|
margin-bottom: 0.75rem;
|
|
}
|
|
|
|
main .main-4 .container {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
main .main-4 .container .item {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
width: 100%;
|
|
height: 11.4rem;
|
|
margin-bottom: 2.2rem;
|
|
}
|
|
main .main-4 .container .item:nth-child(even){
|
|
flex-direction: row-reverse;
|
|
}
|
|
|
|
main .main-4 .container .item .img {
|
|
width: 59%;
|
|
height: 100%;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
main .main-4 .container .item .img img{
|
|
width: 100%;
|
|
min-height: 100%;
|
|
}
|
|
main .main-4 .container .item .pull-bg{
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba(0, 0, 0, .5);
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 1;
|
|
transition: all .6s;
|
|
}
|
|
main .main-4 .container .item:hover .pull-bg{
|
|
background-color: rgba(0, 0, 0, .6);
|
|
}
|
|
main .main-4 .container .item h3{
|
|
display: flex;
|
|
align-items: center;
|
|
max-width: 16.5rem;
|
|
height: 100%;
|
|
font-size: 1.5rem;
|
|
color: #ffffff;
|
|
position: absolute;
|
|
left: 2.6rem;
|
|
top: 0;
|
|
z-index: 2;
|
|
transition: all .6s;
|
|
}
|
|
main .main-4 .container .item:hover h3{
|
|
color: #ffff1b;
|
|
}
|
|
main .main-4 .container .item .txt{
|
|
box-sizing: border-box;
|
|
width: 41%;
|
|
padding: 1rem 0 1rem 3rem;
|
|
font-size: 0.85rem;
|
|
text-align: justify;
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 7;
|
|
word-break: break-all;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
-webkit-box-orient: vertical;
|
|
}
|
|
main .main-4 .container .item:nth-child(even) .txt{
|
|
padding: 1rem 3rem 1rem 0;
|
|
}
|
|
|
|
main .main-4 .more-btn{
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
max-width: 70rem;
|
|
height: 1rem;
|
|
margin: -0.2rem auto 0;
|
|
}
|
|
main .main-4 .more-btn>a{
|
|
border: 0;
|
|
color: #838383;
|
|
font-size: 0.85rem;
|
|
padding: 0 1rem 0 0;
|
|
text-align: left;
|
|
transition: all .6s;
|
|
position: relative;
|
|
}
|
|
main .main-4 .more-btn>a em{
|
|
display: inline-block;
|
|
margin-left: 0.4rem;
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 0;
|
|
transform: scaleY(1.8) translateY(-32.5%);
|
|
transition: all .6s;
|
|
}
|
|
main .main-4 .more-btn>a:hover{
|
|
background: none;
|
|
opacity: .65;
|
|
}
|
|
main .main-4 .more-btn>a:hover em{
|
|
right: -0.3rem;
|
|
}
|
|
|
|
|
|
@media screen and (min-width: 768px) and (max-width: 1024px) {
|
|
main .main-1 .container .item {
|
|
width: 15rem;
|
|
margin-right: calc((100% - 15rem * 3) / 2) !important;
|
|
}
|
|
|
|
main .main-1 .container .item:nth-of-type(3n) {
|
|
margin-right: 0 !important;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide.slide1 .left a {
|
|
padding: 1rem 3rem;
|
|
}
|
|
|
|
.swiper-wrapper .imgg {
|
|
width: 25rem;
|
|
}
|
|
|
|
main .main-1 .container .item .imgggg {
|
|
height: 9.5rem;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 820px) {
|
|
main .main-4 .container .item .t div span {
|
|
width: 5.5rem;
|
|
}
|
|
|
|
main .main-1 .container .item .imgg {
|
|
height: 9rem !important;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 768px) {
|
|
.wrapper #accordion {
|
|
height: calc(100% - 150px);
|
|
overflow: hidden;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide {
|
|
padding: 0.2rem 0.5rem;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide.slide1 {
|
|
padding: 4rem 0;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide.slide1>div {
|
|
padding: 0 0.9rem;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide.slide1 .left {
|
|
margin-right: 0.9rem;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide.slide1 .left em {
|
|
white-space: nowrap;
|
|
font-size: 0.9rem;
|
|
margin-bottom: 0.9rem;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide.slide1 .left a {
|
|
padding: 0.3rem 0.9rem;
|
|
font-size: 0.9rem;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide.slide1 .img {
|
|
display: none;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide.slide1 .left {
|
|
margin: auto;
|
|
}
|
|
|
|
.index-banner .swiper-container .swiper-slide.slide1 .left em {
|
|
margin: 0.9rem auto;
|
|
}
|
|
|
|
main .main-1 .container {
|
|
justify-content: space-between;
|
|
}
|
|
|
|
main .main-1 .container .item {
|
|
width: 48%;
|
|
margin-right: 0;
|
|
}
|
|
|
|
main .main-1 .container .item:nth-of-type(n + 7) {
|
|
display: none;
|
|
}
|
|
|
|
main .main-4 .container {
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
main .main-4 .container .item {
|
|
width: 100%;
|
|
margin-right: 0 !important;
|
|
margin-bottom: 4%;
|
|
}
|
|
|
|
main .main-4 .container .item:nth-of-type(n+4) {
|
|
display: none;
|
|
}
|
|
|
|
main .main-4 .container .item .t div em {
|
|
font-size: 0.7rem;
|
|
}
|
|
|
|
main .main-4 .container .item .t div span {
|
|
font-size: 0.6rem;
|
|
}
|
|
|
|
main .main-4 .container .item p {
|
|
text-align: left;
|
|
}
|
|
|
|
main .main-1 .container .item .imgg {
|
|
height: 7rem !important;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1025px) and (max-width: 1200px) {
|
|
main .main-1 .container .item .img {
|
|
height: 7rem !important;
|
|
}
|
|
}
|