a:hover { text-decoration: none; } .head_wrap { width: 100%; height: 50px; background: #fff; position: relative; z-index: 99; opacity: 0.5 } .logo { width: 180px; display: block; height: 50px; line-height: 50px; margin-left: 20px; } .logo img { width: 100%; } .navbar { margin-bottom: 0; min-height: 50px } .navbar-nav li.active a { color: #305DC8; } .navbar-nav li a { color: #18181A; } .nav>li>a:hover { text-decoration: none; background-color: transparent; color: #305DC8; } .navbar-toggle .icon-bar { background-color: #eee; } .navbar-toggle { background-color: #fff; } .flex_div_between { display: flex; justify-content: space-between; flex-wrap: nowrap; } .flex_div_center { display: flex; justify-content: center; flex-wrap: nowrap; } .flex_div_wrap { display: flex; justify-content: space-between; flex-wrap: wrap; } .flex_div { display: flex; flex-wrap: nowrap; } .fixed-top { position: fixed; top: 0; right: 0; left: 0; z-index: 1030; box-shadow: 0 1px 6px rgb(0 0 0 / 20%); } /* 通用底部 */ .footer { height: 60px; line-height: 60px; border-top: 1px solid #f1f1f1; text-align: center; margin-top: 20px; } /* banner */ .tilt-component { overflow: hidden; position: relative; } .banner_wrap { width: 100%; /* height: 584px; */ height: 292px; background: url('../imgs/banner.jpg') no-repeat; background-size: cover; } .banner_content { animation: slogan-up .5s linear; /* margin-top: 160px; */ margin-top: 80px; } .banner_content .main-content-1 { font-size: 44px; font-weight: 600; letter-spacing: 4.4px; line-height: 60px; color: #1d1e20; } .banner_content .main-content-1-sub { margin-top: 9px; font-size: 16px; line-height: 28px; font-weight: 400; color: #6c6f75; letter-spacing: 1px; } .index-content { background: #fff; padding-top: 60px; } .scale_img { animation: 4s linear 3.7s infinite normal none running; transition-duration: 3s; } .mian_title { font-size: 32px; line-height: 1.5; font-weight: 600; color: #1d1e20; } .sub_title { margin-top: 10px; font-size: 16px; line-height: 28px; font-weight: 400; color: #6c6f75; } @keyframes arrow-up { 0% { transform: translate(-15px, 14px); } 50% { transform: translate(0, 0); } 100% { transform: translate(15px, -14px); } } @keyframes slogan-up { 0% { opacity: 0; transform: translate(0, 50px); } 100% { opacity: 1; transform: translate(0, 0); } } /* 产品列表 */ .card { position: relative; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; min-width: 0; word-wrap: break-word; background-color: #fff; background-clip: border-box; border: 1px solid rgba(0, 0, 0, 0.125); border-radius: 0.25rem; box-shadow: 0 1px 6px rgb(0 0 0 / 20%); padding: 16px; margin-bottom: 20px; transition: 0.5s linear; } .card:hover { transform: scale(1.02); } .card-body { -ms-flex: 1 1 auto; flex: 1 1 auto; min-height: 1px; padding: 1.25rem; } .card-title { /* margin-bottom: 0.75rem; */ margin-bottom: 20px; color: #333; } .card-subtitle { margin-top: 10px; margin-bottom: 15px; color: #999; font-size: 12px; } .card-text { margin-bottom: 15px; color: #666; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .card-link:hover { text-decoration: none; } .card-link+.card-link { margin-left: 1.25rem; } /* 产品详情 banner位置开始*/ .top { background-color: #fff; background-size: cover; background-repeat: no-repeat; background-position: center; color: #212326; height: 584px; position: relative; margin-top: 0; user-select: none; } .normal-width, .top-normal-width { width: 1000px; margin-left: auto; margin-right: auto; } .product-top { padding: 40px 0; margin-top: 30px; } .product-top .top-content { margin-top: 100px; display: inline-block; width: auto; } .product-top .product-top-logo { display: inline-block; margin-bottom: 30px; } .product-top .product-top-title { /* width: 442px; */ width: 100%; font-size: 44px; font-weight: 600; letter-spacing: 4.4px; line-height: 60px; color: #1d1e20; /* color: #fff; */ } .product-top .product-top-subtitle { /* width: 442px; */ width: 100%; font-size: 16px; line-height: 28px; font-weight: 400; letter-spacing: 1px; color: #6c6f75; margin-top: 10px; /* color: #fff; */ } .top-content .top-content-try { margin-top: 20px; } .top-content .top-content-try .top-content-concat-button.top, .top-content .top-content-try .top-content-try-button.top { box-shadow: 0 20px 24px 0 rgb(255 105 74 / 15%), 0 8px 16px 0 rgb(252 101 69 / 5%); } .top-content .top-content-try .top-content-concat-button, .top-content .top-content-try .top-content-try-button { width: 120px; height: 44px; border-radius: 3px; background-image: linear-gradient(to right, #ff6a4c, #f24e24 100%); cursor: pointer; display: inline-block; line-height: 44px; text-align: center; color: #fff; vertical-align: top; font-size: 18px; } .product-top .product-project-image { float: right; /* width: 488px; height: 488px; */ width: 100%; margin: auto; text-align: center; } .product-top .product-project-image img { width: 100%; } /* 产品详情 banner位置结束*/ /* 产品功能介绍开始 */ /* 产品功能介绍结束 */ .index-pc { display: block; } .index-mobile { display: none; } /* 列表banner */ /* .solution-top-bg { background-image: url('../imgs/solutions-bg-086e2e8ce1.png'), linear-gradient(182deg, #fff, #e6f0ff); background-size: cover; background-position: center; overflow: hidden; } */ .solution-top-bg { width: 100%; height: 300px; background: linear-gradient(to right, #2e77e5, #004cbf); /* margin-top: 60px; */ position: relative; color: #fff; } .solution-top { max-width: 1440px; margin: auto; /* height: 510px; */ height: 300px; position: relative; } .solution-top .solutions-top-bg { position: absolute; bottom: 0; z-index: 0; } /* .solution-top .top-content { position: relative; text-align: center; padding-top: 80px; width: 720px; z-index: 1; } */ .solution-top .top-content { position: absolute; text-align: center; padding-top: 80px; width: 720px; z-index: 1; left: 50%; margin-left: -360px; } .solution-top .solutions-top-bg.left-bg { left: 0; } .solution-top .solutions-top-bg.right-bg { right: 0; } .solution-top .top-content .top-title { font-size: 44px; font-weight: 500; line-height: 60px; letter-spacing: 4.4px; text-align: center; /* color: #1d1e20; */ margin-bottom: 10px; color: #fff; } .top-content { animation: slogan-up .5s linear; } .solution-top .top-content .top-subtitle { font-size: 16px; line-height: 28px; text-align: center; font-weight: 400; /* color: #6c6f75; */ margin: auto auto 20px; color: #fff; } /* 适用场景开始 */ #solutions .solution-matrix { margin-top: 20px; } #solutions .product-matrix-and-scene { padding: 80px 0 0; } #solutions .product-matrix-and-scene .product-scene-card { width: 40%; vertical-align: top; height: auto; margin-top: 30px; display: inline-block; position: relative; } #solutions .product-matrix-and-scene .product-scene-card:nth-child(2n) { margin-left: 12%; } #solutions .content-title { font-size: 32px; font-weight: 600; line-height: 1.5; text-align: center; color: #1d1e20; } #solutions .product-matrix-and-scene .product-scene-card .product-scene-card-img { margin-bottom: 20px; } #solutions .product-matrix-and-scene .product-scene-card .product-scene-card-img img { object-fit: contain; vertical-align: top; } #solutions .product-scene-card-title { font-size: 20px; height: 30px; line-height: 1.5; letter-spacing: 1.2px; color: #1d1e20; font-weight: 500; } #solutions .product-matrix-and-scene .product-scene-card .product-scene-card-intro { height: 72px; margin-bottom: 30px; font-size: 14px; line-height: 24px; color: #45464a; font-weight: 400; margin-top: 10px; } #solutions .product-matrix-and-scene .product-scene-card:nth-child(2n) { margin-left: 12%; } /* 适用场景结束 */ /* 意义开始 */ .about-us { margin-bottom: 60px; } .introduction-title { height: 48px; font-size: 32px; font-weight: 600; line-height: 1.5; letter-spacing: 2.56px; color: #1d1e20; margin: 0 0 20px; text-align: center; } .introduction-line { height: 1px; background: #dadde3; width: 100%; } .about-us .about-us-content { margin-left: auto; margin-right: auto; } .about-us .content .content-text { font-size: 16px; line-height: 28px; color: #1d1e20; font-weight: 400; margin-top: 20px; } .about-us .content .content-text:first-child { margin-top: 40px; } .introduction-title.normal { margin-top: 60px; } /* 意义结束 */ @media screen and (min-width: 768px) and (max-width: 991px) { /* 产品详情 banner位置开始*/ .product-top { height: auto; padding: 50px 30px 0; margin-top: 10px; } .normal-width { width: 100%; } .product-top .top-content { margin-top: auto; } .product-top .product-top-logo { margin-bottom: 20px; } .solution-top-bg { background-position: center bottom; background-repeat: no-repeat; } .solution-top { height: 410px; } .solution-top .solutions-top-bg.left-bg { left: -40px; } .solution-top .solutions-top-bg { width: 280px; height: 268px; } .solution-top .solutions-top-bg.right-bg { right: -40px; } .solution-top .top-content { padding-top: 110px; width: 100%; } .solution-top .top-content .top-title { font-size: 32px; line-height: 60px; letter-spacing: 1px; } .solution-top .top-content .top-subtitle { width: 495px; font-size: 14px; line-height: 24px; color: #727c86; } .index-pc { display: none; } .index-mobile { display: block; } /* 产品详情 banner位置结束*/ /* 产品功能介绍开始 */ /* 产品功能介绍结束 */ /* 场景开始 */ #solutions .product-matrix-and-scene { padding: 50px 30px; } #solutions .content-title { font-size: 24px; letter-spacing: 1px; text-align: left; } #solutions .solution-matrix { margin-top: 10px; } #solutions .product-matrix-and-scene .product-scene-card { width: 42%; } #solutions .product-matrix-and-scene .product-scene-card:nth-child(2n) { margin-right: 0; margin-left: 7%; } #solutions .product-matrix-and-scene .product-scene-card .product-scene-card-img { width: 56px; height: 45px; margin-top: auto; } #solutions .product-scene-card-title { font-size: 16px; line-height: 28px; letter-spacing: .8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #solutions .product-scene-card-intro { font-size: 14px; line-height: 24px; color: #575a61; height: auto; margin-bottom: 10px; } /* 场景结束 */ /* 意义开始 */ .introduction-title { font-size: 24px; font-weight: 600; line-height: 48px; letter-spacing: 2px; margin: 0 0 10px; text-align: left; } .about-us .introduction-line { display: none; } .about-us .about-us-content.intro .content .content-text { margin-top: 10px; font-size: 14px; line-height: 24px; } .introduction-title.normal { margin-top: 50px; } /* 意义结束 */ } @media screen and (min-width: 200px) and (max-width: 767px) { /* 产品详情 banner位置开始*/ .navbar-collapse { background: #fff; } .navbar { right: -20%; } .product-top { height: auto; padding: 30px 20px 0; margin-top: 0; } .normal-width { /* width: 555px; */ width: 100%; } .product-top .top-content { margin-top: auto; } .product-top .product-top-logo { margin-bottom: 20px; } .product-top .product-top-title { font-size: 24px; letter-spacing: 2.4px; } .product-top .product-top-subtitle { font-size: 12px; } .product-top .product-project-image img { width: 100%; } .index-pc { display: none; } .index-mobile { display: block; } .solution-top { height: 440px; } .solution-top .solutions-top-bg.left-bg { left: -100px; } .solution-top .solutions-top-bg.right-bg { right: -100px; } .solution-top .top-content .top-title.special { width: 330px; } .solution-top .top-content { width: 335px; position: relative; text-align: center; padding-top: 160px; z-index: 1; } .solution-top .top-content .top-title { font-size: 32px; line-height: 40px; margin: auto auto 10px; } .solution-top .top-content .top-subtitle { width: 335px; } /* 产品详情 banner位置结束*/ /* 产品功能介绍开始 */ /* 产品功能介绍结束 */ /* 场景开始 */ #solutions .product-matrix-and-scene { padding: 50px 20px 0; } #solutions .content-title { font-size: 24px; letter-spacing: 1px; text-align: left; } #solutions .solution-matrix { margin-top: 10px; } #solutions .product-matrix-and-scene .product-scene-card { width: 45%; height: 300px; margin-right: 0; } #solutions .product-matrix-and-scene .product-scene-card:nth-child(2n) { margin-left: 8%; margin-right: 0; } #solutions .product-matrix-and-scene .product-scene-card .product-scene-card-img { width: 56px; height: 45px; margin-top: auto; } #solutions .product-scene-card-title { letter-spacing: 0; height: auto; font-size: 16px; line-height: 28px; } /* #solutions .product-scene-card-title { font-size: 16px; line-height: 28px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } */ #solutions .product-scene-card-intro { font-size: 14px; line-height: 24px; color: #575a61; height: auto; margin-bottom: 10px; } #solutions .product-scene-card-intro { letter-spacing: 0; } /* 场景结束 */ .about-us { padding: 0 10px; } .introduction-title { font-size: 24px; font-weight: 600; line-height: 48px; letter-spacing: 2px; margin: 0 0 10px; text-align: left; } .about-us .introduction-line { display: none; } .about-us .about-us-content.intro .content .content-text { margin-top: 10px; font-size: 14px; line-height: 24px; } }