You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
671 lines
13 KiB
671 lines
13 KiB
/* 移动端适配 */
|
|
/* */
|
|
@media (max-width: 480px) {
|
|
.nav-container {
|
|
height: 54px;
|
|
}
|
|
|
|
.section-container {
|
|
padding-top: 54px;
|
|
}
|
|
|
|
.nav-menu {
|
|
top: 54px;
|
|
height: calc(100vh - 54px);
|
|
}
|
|
|
|
.nav-logo {
|
|
font-size: 1rem;
|
|
}
|
|
|
|
.section {
|
|
padding: 10px 20px;
|
|
}
|
|
|
|
.section h2 {
|
|
font-size: 1.8rem;
|
|
}
|
|
}
|
|
@media (max-width: 768px) {
|
|
/* 字体包 */
|
|
/* 优设标题黑 - 通常用于标题 */
|
|
@font-face {
|
|
font-family: "YouSheBiaoTiHei";
|
|
src: url("../fonts/优设标题黑.ttf") format("truetype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
/* 思源黑体 - 常规体 */
|
|
@font-face {
|
|
font-family: "normal Source Han Sans SC";
|
|
src: url("../fonts/SourceHanSansSC-Regular.otf") format("opentype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
/* 思源黑体 - 粗体 */
|
|
@font-face {
|
|
font-family: "bold Source Han Sans SC";
|
|
src: url("../fonts/SourceHanSansSC-Bold.otf") format("opentype");
|
|
font-weight: bold;
|
|
font-style: normal;
|
|
}
|
|
/* 仅手机端显示 */
|
|
.only-phone {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
/* 仅pc显示 */
|
|
.only-pc {
|
|
display: none;
|
|
}
|
|
/* 菜单栏(汉堡侧边栏) */
|
|
.nav-menu {
|
|
position: fixed;
|
|
top: 54px;
|
|
left: -100%;
|
|
width: 30%;
|
|
height: calc(100vh - 54px);
|
|
background-color: #ffffff;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
padding-top: 20px;
|
|
}
|
|
|
|
.nav-menu.active {
|
|
left: 0;
|
|
}
|
|
|
|
.nav-item {
|
|
margin: 15px 0;
|
|
}
|
|
|
|
.menu-toggle {
|
|
display: block;
|
|
}
|
|
|
|
.menu-toggle.active span:nth-child(1) {
|
|
transform: rotate(45deg) translate(5px, 5px);
|
|
}
|
|
|
|
.menu-toggle.active span:nth-child(2) {
|
|
opacity: 0;
|
|
}
|
|
|
|
.menu-toggle.active span:nth-child(3) {
|
|
transform: rotate(-45deg) translate(7px, -6px);
|
|
}
|
|
|
|
.section h2 {
|
|
font-size: 2rem;
|
|
}
|
|
/* -------------------- */
|
|
|
|
/* 在移动端隐藏文字 */
|
|
.grid-item h2,
|
|
.grid-item p {
|
|
display: none;
|
|
}
|
|
/* -------------------- */
|
|
|
|
/* 背景图操作 */
|
|
#section1 {
|
|
background-image: url(../images/website/深色banner@2x.png);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
#section2 {
|
|
background-image: url(../images/website/公司介绍m.png);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
#section3 {
|
|
background-image: url(.././images/website/公司资质BG.png);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
#section4 {
|
|
background-image: url(../images/website/服务内容m.png);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
#section5 {
|
|
background-image: url(../images/website/行业案例m.png);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
#section6 {
|
|
background-image: url(../images/website/联系我们m.png);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
}
|
|
/* -------------------- */
|
|
|
|
/* 首页模块 */
|
|
/* phone */
|
|
.banner {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 2rem;
|
|
.bannerone {
|
|
width: 15.85rem;
|
|
height: 3.56rem;
|
|
background-image: url(../images/website/banner标题.png);
|
|
background-size: 100% 100%;
|
|
}
|
|
.text-content {
|
|
width: 12.25rem;
|
|
height: 2.19rem;
|
|
font-family: "bold Source Han Sans SC";
|
|
font-weight: bold;
|
|
font-size: 1.45rem;
|
|
text-wrap: nowrap;
|
|
color: #ffffff;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
}
|
|
/* 公司介绍模块 */
|
|
.jsmobile {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 3%;
|
|
}
|
|
.mobileintro-title {
|
|
font-family: Arial;
|
|
font-weight: bold;
|
|
color: #333333;
|
|
width: 100%;
|
|
height: auto;
|
|
display: flex;
|
|
justify-content: center;
|
|
font-weight: bold;
|
|
font-size: 3.5vw;
|
|
color: #333333;
|
|
}
|
|
|
|
.mobileintro-title2 {
|
|
width: 100%;
|
|
height: auto;
|
|
display: flex;
|
|
justify-content: center;
|
|
font-family: "bold Source Han Sans SC", sans-serif;
|
|
font-weight: bold;
|
|
font-size: 7vw;
|
|
color: #333333;
|
|
}
|
|
|
|
.mobileintro-content {
|
|
width: 100%;
|
|
height: auto;
|
|
font-family: "normal Source Han Sans SC", sans-serif;
|
|
font-weight: normal;
|
|
font-size: 4vw;
|
|
color: #333333;
|
|
text-align: left;
|
|
}
|
|
|
|
.mobileintro-content span {
|
|
color: #2136ff;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.mobileintro-content2 {
|
|
width: 100%;
|
|
height: auto;
|
|
font-family: "normal Source Han Sans SC", sans-serif;
|
|
font-size: 4vw;
|
|
color: #333333;
|
|
text-align: left;
|
|
}
|
|
|
|
.mobileintro-content2 span {
|
|
color: #2136ff;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.mobileintro-grid {
|
|
width: 100%;
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
gap: 2.82%;
|
|
justify-items: center;
|
|
}
|
|
|
|
.mobileintro-grid-item {
|
|
width: 100%;
|
|
height: 120%;
|
|
background-image: url(../images/website/产品BG@2x.png);
|
|
background-size: 100% 100%;
|
|
background-repeat: no-repeat;
|
|
display: flex;
|
|
justify-content: center;
|
|
/* align-items: center; */
|
|
}
|
|
|
|
.itemword {
|
|
font-family: "normal Source Han Sans SC", sans-serif;
|
|
font-size: 3vw;
|
|
color: #ffffff;
|
|
line-height: 30px;
|
|
}
|
|
|
|
.mobileintro-content3 {
|
|
width: 100%;
|
|
height: auto;
|
|
font-family: "normal Source Han Sans SC", sans-serif;
|
|
font-weight: normal;
|
|
font-size: 4vw;
|
|
color: #333333;
|
|
text-align: left;
|
|
}
|
|
|
|
.mobileintro-content3 span {
|
|
color: #2136ff;
|
|
}
|
|
|
|
.mobileintro-content4 {
|
|
width: 100%;
|
|
height: auto;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.mobileintro-content4img {
|
|
width: 14vw;
|
|
height: 12vw;
|
|
background-image: url(../images/website/橄榄叶左m.png);
|
|
background-size: 100% 100%;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
.mobileintro-contentword {
|
|
width: 115%;
|
|
height: auto;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.mobileintrowordone {
|
|
width: 100%;
|
|
/* margin-left: -50px; */
|
|
height: auto;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-family: "bold normal Source Han Sans SC", sans-serif;
|
|
font-weight: bold;
|
|
font-size: 1rem;
|
|
color: #333333;
|
|
}
|
|
|
|
.wordtwo {
|
|
width: auto;
|
|
height: auto;
|
|
font-family: Arial;
|
|
font-weight: bold;
|
|
font-size: 2rem;
|
|
color: #2136ff;
|
|
}
|
|
|
|
.introduce-content4img2 {
|
|
width: 14vw;
|
|
height: 12vw;
|
|
background-image: url(../images/website/橄榄叶右m.png);
|
|
background-size: 100% 100%;
|
|
background-repeat: no-repeat;
|
|
}
|
|
/* =========== */
|
|
/* 公司资质 */
|
|
.zzphone {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 10%;
|
|
.mobileaptitude-title {
|
|
width: 100%;
|
|
height: auto;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-family: Arial;
|
|
font-weight: bold;
|
|
font-size: 3.5vw;
|
|
color: #ffffff;
|
|
margin-top: 1%;
|
|
}
|
|
|
|
.mobileaptitude-title2 {
|
|
width: 100%;
|
|
height: auto;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-family: "bold Source Han Sans SC", sans-serif;
|
|
font-size: 7vw;
|
|
color: #ffffff;
|
|
margin-top: 1%;
|
|
}
|
|
|
|
.mobileaptitude-content {
|
|
font-family: "normal Source Han Sans SC", sans-serif;
|
|
color: #ffffff;
|
|
width: 100%;
|
|
height: auto;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-size: 4vw;
|
|
margin-top: 1%;
|
|
}
|
|
.mobileaptitude-contentword {
|
|
width: 100%;
|
|
height: auto;
|
|
}
|
|
|
|
.mobileaptitude-content span {
|
|
color: #fff000;
|
|
}
|
|
|
|
.mobileaptitude-image {
|
|
width: 100%;
|
|
height: 30%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-top: 2%;
|
|
}
|
|
|
|
.mobileaptitude-image img {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
/* ----服务内容模块---- */
|
|
.fwphone {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-direction: column;
|
|
gap: 4%;
|
|
}
|
|
.mobilesectionfirst-title {
|
|
width: 100%;
|
|
height: auto;
|
|
font-family: Arial;
|
|
font-weight: bold;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-size: 3.5vw;
|
|
color: #333333;
|
|
}
|
|
|
|
.mobilesectionsecond-title {
|
|
width: 100%;
|
|
height: auto;
|
|
font-family: "bold Source Han Sans SC", sans-serif;
|
|
font-weight: bold;
|
|
font-size: 7vw;
|
|
color: #333333;
|
|
text-wrap: nowrap;
|
|
}
|
|
|
|
.mobilesection-contentsgird {
|
|
width: 100%;
|
|
height: 40%;
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 49%);
|
|
grid-template-rows: repeat(4, 20%);
|
|
gap: 3%;
|
|
}
|
|
|
|
.mobilesection-contentsgird .grid-item:first-child {
|
|
background-image: url(../images/website/人工智能m.png);
|
|
}
|
|
|
|
.mobilesection-contentsgird .grid-item.grid-item:nth-child(2) {
|
|
background-image: url(../images/website/数据建库m.png);
|
|
}
|
|
|
|
.mobilesection-contentsgird .grid-item.grid-item:nth-child(3) {
|
|
background-image: url(../images/website/软件研发m.png);
|
|
}
|
|
|
|
.mobilesection-contentsgird .grid-item.grid-item:nth-child(4) {
|
|
background-image: url(../images/website/方案咨询m.png);
|
|
}
|
|
|
|
.mobilesection-contentsgird .grid-item.grid-item:nth-child(5) {
|
|
background-image: url(../images/website/大数据分析m.png);
|
|
}
|
|
|
|
.mobilesection-contentsgird .grid-item.grid-item:nth-child(6) {
|
|
background-image: url(../images/website/地图服务m.png);
|
|
}
|
|
|
|
.mobilesection-contentsgird .grid-item.grid-item:nth-child(7) {
|
|
background-image: url(../images/website/物联网感知m.png);
|
|
}
|
|
|
|
.mobilesection-contentsgird .grid-item.grid-item:nth-child(8) {
|
|
background-image: url(../images/website/BIM应用m.png);
|
|
}
|
|
|
|
.mobilesection-contentsgird .grid-item {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-size: 100% 100%;
|
|
background-repeat: no-repeat;
|
|
display: flex;
|
|
align-items: center;
|
|
padding-left: 9%;
|
|
font-family: "bold Source Han Sans SC", sans-serif;
|
|
font-weight: bold;
|
|
font-size: 1.26rem;
|
|
color: #e1edfb;
|
|
}
|
|
|
|
.section-center1 {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
/* =============== */
|
|
|
|
/* ==行业案例== */
|
|
.anli {
|
|
height: 70%;
|
|
width: 100%;
|
|
display: flex;
|
|
text-align: center;
|
|
flex-direction: column;
|
|
color: #ffffff;
|
|
gap: 16px;
|
|
.anlien {
|
|
font-family: Arial;
|
|
color: #ffffff;
|
|
font-weight: bold;
|
|
}
|
|
.anliword {
|
|
font-family: "bold Source Han Sans SC", sans-serif;
|
|
font-weight: bold;
|
|
font-size: 1.7rem;
|
|
}
|
|
}
|
|
/* ============ */
|
|
/* 联系我们 */
|
|
.m-phone {
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 100%;
|
|
height: calc(100vh - 54px);
|
|
}
|
|
|
|
.m-header {
|
|
margin-top: 1%;
|
|
color: #FFFFFF;
|
|
width: 100%;
|
|
height: 20%;
|
|
display: flex;
|
|
justify-content: center;
|
|
flex-direction: column;
|
|
.m-title-en{
|
|
width: 100%;
|
|
display: flex;
|
|
font-size: 3.5vw;
|
|
justify-content: center;
|
|
}
|
|
.m-title-cn{
|
|
width: 100%;
|
|
display: flex;
|
|
font-size: 7vw;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
|
|
.m-content {
|
|
height: 80%;
|
|
width: 100%;
|
|
display: flex;
|
|
padding: 0% 10% 0 10%;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.m-left,
|
|
.m-right {
|
|
height: 50%;
|
|
width: 100%;
|
|
}
|
|
|
|
.m-right{
|
|
margin-top: 15%;
|
|
}
|
|
|
|
|
|
.m-map {
|
|
width: 100%;
|
|
height: 80%;
|
|
background-image: url(../images/website/地图.png);
|
|
background-size: 100% 100%;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
|
|
}
|
|
|
|
.m-info {
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 0.8rem 0;
|
|
font-size: 0.95rem;
|
|
color: #ffffff;
|
|
a{
|
|
color: #ffffff;
|
|
border: none;
|
|
}
|
|
}
|
|
|
|
.m-icon {
|
|
width: 1.2rem;
|
|
height: 1.2rem;
|
|
margin-right: 0.6rem;
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
.m-icon-loc {
|
|
background-image: url(../images/website/定位.png);
|
|
}
|
|
|
|
.m-icon-phone {
|
|
background-image: url(../images/website/电话.png);
|
|
}
|
|
|
|
.m-scan-text {
|
|
font-size: 1rem;
|
|
margin-bottom: 1rem;
|
|
color: #333;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.m-scan-group {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.m-scan-item {
|
|
text-align: center;
|
|
flex: 1;
|
|
max-width: 45%;
|
|
}
|
|
|
|
.m-wechat,
|
|
.m-miniprogram {
|
|
width: 100%;
|
|
aspect-ratio: 1/1;
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.m-wechat {
|
|
background-image: url(../images/website/公众号@2x.png);
|
|
}
|
|
|
|
.m-miniprogram {
|
|
background-image: url(../images/website/小程序@2x.png);
|
|
}
|
|
|
|
.m-scan-label {
|
|
font-size: 0.85rem;
|
|
margin-top: 0.5rem;
|
|
color: #ffffff;
|
|
}
|
|
|
|
/* Footer */
|
|
.m-footer {
|
|
width: 100%;
|
|
text-align: center;
|
|
background-color: #000728;
|
|
color: white;
|
|
padding: 1%;
|
|
}
|
|
|
|
.m-copyright {
|
|
font-size: 0.75rem;
|
|
line-height: 1.4;
|
|
background-color: #000728;
|
|
}
|
|
|
|
.m-copyright a {
|
|
text-decoration: none;
|
|
color: #ffffff;
|
|
}
|
|
|
|
}
|