webs/fengxiao/css/technicalSupport.css

264 lines
4.9 KiB
CSS

* ,body{
margin: 0;
padding: 0;
/* box-sizing: border-box; */
}
.banner{
width: 100%;
height: 100vh;
/* background: linear-gradient(to bottom, #3A8DFF 0%, #AEE6FF 60%, #F1F1F1 100%),
url(../imgs/support/bg.png); */
background: linear-gradient(
to bottom,
#3478FD 0%,
#BED0F4 88%,
#f1f1f1 100%
);
/* background: url(../imgs/support/bg.png) no-repeat bottom; */
background-size: 100% 80%;
background-repeat: no-repeat;
background-size: cover;
background-position: top, center;
box-sizing: border-box;
background-blend-mode: multiply;
margin-top: 12vh;
}
.banner-content{
width: 100%;
height: 100%;
background-image: url(../imgs/support/bg.png);
background-size: 112% 72%;
background-position: 76% 123%;
background-repeat: no-repeat;
box-sizing: border-box;
position: relative;
}
.banner-content-text{
position: absolute;
top: 8vw;
left: 33vw;
width: 30%;
height: 50%;
/* background: palegoldenrod; */
}
.banner-content-text p:nth-child(1){
font-size: 5vw;
font-weight: 300;
color: #fff;
}
.banner-content-text p:nth-child(2){
font-size: 1.25vw;
margin-top: 2vh;
color: rgba(0,0,0,0.6);
line-height: 5vh;
font-weight: 450;
/* color: #fff; */
}
.banner-content-list {
width: 100%;
height: 90vh;
background: linear-gradient(
to bottom,
#f1f1f1 0%,
#C0E1F5 100%
);
position: relative;
}
.banner-content-list h2{
font-size: 2.5vw;
font-weight: 400;
text-align: center;
text-decoration: underline;
text-underline-offset: 0.5vw;
text-decoration-thickness: 0.1vw;
color: rgba(0, 0, 0, 0.8);
}
.content-listBOX{
width: 80%;
height: 80%;
/* background: palegoldenrod; */
margin-top: 5vh;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
}
.content-listBOX-item{
width: 23vw;
height: 80%;
/* background: palegoldenrod; */
list-style: none;
border-radius: 1vw;
box-shadow: 8px 5px 10px 5px rgba(0,0,0,0.1);
background: #fff;
padding: 2vw;
box-sizing: border-box;
text-align: center;
}
.content-listBOX-item img{
width: 10vw;
height: 8vw;
margin: 0 auto;
}
.content-listBOX-item h3{
font-size: 1.5vw;
font-weight: 500;
margin-top: 1vh;
}
.content-listBOX-item p{
font-size: 0.85vw;
font-weight: 400;
width: 80%;
text-align: justify;
margin: 0 auto;
margin-top: 2vh;
color: rgba(0,0,0,0.8);
}
/* ---------------大模型训练-------------------------- */
.largeModel{
width: 100%;
height: 80vh;
font-size: 40px;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(
to bottom,
#367BFC 0%,
#5DB6EE 100%
);
}
.largeModel-bg{
width: 100%;
height: 100%;
background: url(../imgs/support/left.png) ,url(../imgs/support/right.png);
background-size: 50% 148%,39% 132%;
background-repeat: no-repeat;
background-position: -60% 54%,134% 3%;
color: #fff;
}
.largeModel-bg h2{
font-size: 3.5vw;
font-weight: 400;
text-align: center;
margin-top: 5vh;
}
.largeModel-bg h4{
font-size: 1vw;
font-weight: 400;
text-align: center;
color: rgba(255,255,255,0.8);
}
.largeModel-bg-content{
width: 58%;
height: 55%;
background: #fff;
margin: 0 auto;
margin-top: 5vh;
border-radius: 1vw;
padding: 2vw;
box-sizing: border-box;
}
.largeModel-bg-content h3{
font-size: 1.8vw;
font-weight: 600;
text-align: center;
color: rgba(0,0,0,0.8);
}
.largeModel-bg-content p{
font-size: 1vw;
font-weight: 400;
text-align: center;
color: rgba(0,0,0,0.8);
margin-top: 1vh;
}
.largeModel-bg-content-list{
width: 80%;
height: 40%;
display: flex;
justify-content: left;
align-items: center;
color: rgba(0,0,0,0.8);
flex-wrap: wrap;
margin: 0 auto;
padding-left: 2vw;
/* background: palegoldenrod; */
margin-top: 5vh;
}
.largeModel-bg-content-list li{
/* list-style-type: disc; */
width: 25%;
font-size: 1vw;
font-weight: 400;
margin-left: 1vw;
position: relative;
padding-left: 1.5vw;
list-style: none;
}
.largeModel-bg-content-list li::before {
content: "";
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 0.6vw;
height: 0.6vw;
background-color: #367BFC;
border-radius: 50%;
}
/* ------------------------- */
.serviceBox{
width: 100%;
height: 30vh;
background: #f1f1f1;
}
.serviceBox-content{
width: 60%;
height: 100%;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
}