/*partners 子页面 */
.partners-son-banner{
position: relative;
aspect-ratio: auto;
height: 26.1vw; /*1920*500*/
background-repeat: no-repeat;
background-position: center bottom;
background-size: cover;
}
.partners-son-intro>div{
column-gap: 50px;
align-items: flex-start;
}
.partners-son-intro>div>div{
border-radius: 10px;
flex-shrink: 0;
/*border: 1px solid #ededed;*/
}
.partners-son-intro .left{
width: 35%;
padding: 4rem;
align-items: center;
border: 1px solid #ededed;
}
.partners-son-intro .left .img{
text-align: center;
}
.partners-son-intro .left .img img{
border: 10px solid #e5e5e5;
border-radius: 50%;
width: 120px;
display: inline-block;
}
.partners-son-intro .left .text p{
margin-bottom: 5px;
position: relative;
padding-left: 30px;
}
.partners-son-intro .left .text a{
margin-right: 10px;
position: relative;
width: 20px;
height: 20px;
display: inline-block;
margin-top: 15px;
}
.partners-son-intro .left .text i{
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 20px;
height: 20px;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
.partners-son-intro .left .text i.addr{
background-image: url('data:image/svg+xml;utf-8,');
}
.partners-son-intro .left .text i.serviced{
background-image: url('data:image/svg+xml;utf-8,');
}
/*社交媒体*/
.partners-son-intro .left .text a.ico-web i{
background-image: url('data:image/svg+xml;utf-8,');
}
.partners-son-intro .left .text a.ico-linkedin i{
background-image: url('data:image/svg+xml;utf-8, ');
}
.partners-son-intro .left .text a.ico-twitter i{
background-image: url('data:image/svg+xml;utf-8, ');
}
.partners-son-intro .left .text a.ico-medium i{
background-image: url('data:image/svg+xml;utf-8, ');
}
.partners-son-intro .left .text a.ico-youtube i{
background-image: url('data:image/svg+xml;utf-8, ');
}
.partners-son-intro .left .text a.ico-instagram i{
background-image: url('data:image/svg+xml;utf-8, ');
}
.partners-son-intro .left .text a.ico-facebook i{
background-image: url('data:image/svg+xml;utf-8, ');
}
.partners-son-intro .right{
width: 65%;
padding: 2rem;
}
.partners-son-intro .right p{
margin-bottom: 1rem;
}
.partners-son-intro .right p strong{
font-family: var(--font-bold);
text-align: justify;
}
.partners-son-product .content{
column-gap: 2rem;
row-gap: 2rem;
align-items: center;
}
.partners-son-product .content>div{
width: 50%;
}
.partners-son-powered .title{
column-gap: 3rem;
}
.partners-son-powered .title img{
width: 240px;
}
.partners-son-powered .content{
column-gap: 3rem;
row-gap: 3rem;
align-items: center;
}
.partners-son-powered .content>div{
width: 50%;
}
.partners-son-powered .content .text p.point{
position: relative;
padding-left: 1rem;
}
.partners-son-powered .content .text p.point::before{
position: absolute;
width: 5px;
height: 5px;
border-radius: 4px;
background-color: var(--color-darkblue);
content: '';
top: 11px;
transform: translateY(-50%);
left: 0;
}
.partners-son-relate .list{
justify-content: center;
/*flex-wrap: wrap;*/
column-gap: 1rem;
}
.partners-son-relate .list .item{
max-width: calc(100%/3);
text-align: center;
color: var(--color-darkblue);
}
.partners-son-relate .list img{
transition: all 0.3s;
}
.partners-son-relate .list a:hover img{
transform: scale(1.02);
}
.partners-son-contact .content{
column-gap: 3rem;
row-gap: 3rem;
}
.partners-son-contact .content .left{
width: 30%;
}
.partners-son-contact .content .left img{
width: 70%;
}
.partners-son-contact .content .right{
width: 70%;
}
.partners-son-contact .content .right .email-button{
display: inline-block;
padding: 8px 2rem;
border-radius: 10px;
border: 2px solid var(--color-darkblue);
color: var(--color-darkblue);
transition: all 0.3s;
}
.partners-son-contact .content .right .email-button:hover{
background-color: var(--color-darkblue);
color: #fff;
}
@media (max-width: 1360px) {
.partners-son-product .content{
flex-wrap: wrap;
}
.partners-son-product .content>div{
width: 100%;
}
.partners-son-powered .title{
flex-direction: column;
align-items: center;
}
.partners-son-powered .content{
flex-wrap: wrap;
}
.partners-son-relate .list{
flex-wrap: wrap;
}
.partners-son-powered .content>div{
width: 100%;
}
.partners-son-contact .content{
flex-wrap: wrap;
}
.partners-son-contact .content .left,
.partners-son-contact .content .right{
width: 100%;
}
}