.jianjie{ /*margin-top: -23px;*/ z-index: 999; position: relative; } div.about-us-area .content{ /*font-size: 18px;*/ line-height: 48px; height: 250px; -o-text-overflow: ellipsis; text-overflow: ellipsis; text-align: justify; text-indent: 2em; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp: 5; line-clamp: 5; } div.service-case-area{ padding-top: 30px; } div.service-case-area1{ background-image: url("/template/default/index/img/index-service-bg.png"); background-position: 50% 100%; height: 656px; /*padding-left: 350px;*/ /*padding-top: 60px;*/ } div.service-case-area1 .service_case_img{ width: 384px; height: 72px; margin-left: -33px; } div.service-case-area1 .service_case_img1{ width: 100%; height: auto; margin-left: -1.8em; } div.service-case-area1 .ser-ca_more{ font-size: 18px; font-family: PingFang SC; font-weight: 400; color: #FEFEFF; } div.service-case-area .content>div.box{ height: 200px; border: 1px solid #99CDF0; margin-right: 10px; margin-top: 10px; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; /*加上曲线效果 cubic-bezier*/ /*cubic-bezier(.62,-0.91,.45,1.97) (x1,y1,x2,y2) x的值在【0,1】,y值任意 */ -webkit-animation: moving 1s cubic-bezier(.62,-0.91,.45,1.97); animation: moving 1s cubic-bezier(.62,-0.91,.45,1.97); /*清除抖动*/ -webkit-animation-fill-mode: both; animation-fill-mode: both; } div.service-case-area .content>div.box_xs{ /*height: 124px;*/ border: 1px solid #99CDF0; margin-right: 10px; margin-top: 10px; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; /*加上曲线效果 cubic-bezier*/ /*cubic-bezier(.62,-0.91,.45,1.97) (x1,y1,x2,y2) x的值在【0,1】,y值任意 */ -webkit-animation: moving 1s cubic-bezier(.62,-0.91,.45,1.97); animation: moving 1s cubic-bezier(.62,-0.91,.45,1.97); /*清除抖动*/ -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes moving { from{ opacity: 0; -webkit-transform: translateY(100%); } to{ opacity: 1; -webkit-transform: translateY(0%); } } @-webkit-keyframes moving { from{ opacity: 0; transform: translateY(100%); } to{ opacity: 1; transform: translateY(0%); } } div.service-case-area .content>div.box:first-child, div.service-case-area .content>div.box_xs:first-child{ -webkit-animation-delay: 0s; animation-delay: 0s; } div.service-case-area .content>div.box:nth-child(2), div.service-case-area .content>div.box_xs:nth-child(2){ -webkit-animation-delay: .1s; animation-delay: .1s; } div.service-case-area .content>div.box:nth-child(3), div.service-case-area .content>div.box_xs:nth-child(3){ -webkit-animation-delay: .2s; animation-delay: .2s; } div.service-case-area .content>div.box:nth-child(4), div.service-case-area .content>div.box_xs:nth-child(4){ -webkit-animation-delay: .3s; animation-delay: .3s; } div.service-case-area .content>div.box > h4 > a, div.service-case-area .content>div.box_xs > h4 > a{ padding-top: 10px; color: white; } div.service-case-area .content>div.box > div, div.service-case-area .content>div.box_xs > div{ padding: 10px 2px 10px 2px; color: white; } div.service-case-area .content>div.box:hover, div.service-case-area .content>div.current{ background-color: whitesmoke; } div.service-case-area .content>div.box:hover > h4 > a, div.service-case-area .content>div.current > h4 > a{ /*color: var(--color-0093e9);*/ color: #0e8adb; } div.service-case-area .content>div.box:hover > div, div.service-case-area .content>div.current > div{ color: #0e8adb; } div.news-area{ margin-top: 50px; padding-bottom: 50px; } div.news-area div[data-navid]{ padding-top: 20px; } .list-group-item{ border: 0; border-bottom: 1px solid rgb(207 219 238 / 30%); margin-bottom: 0; } div.news-area div[data-navid] li.list-group-item{ padding: 15px; } div.news-area div[data-navid] li.list-group-item a{ text-overflow: ellipsis; overflow:hidden; white-space:nowrap; width: 374px; display: inline-block; } #news-picture{ width: 100%; height: 375px; } .sevice_list_title, .sevice_list_title1{ font-size: 24px; padding-top: 10px; font-family: PingFang SC; font-weight: 800; color: #E8EFFD; line-height: 90px; } .sevice_list_title1{ line-height: 2em; font-size: 1.25em; } .servide_list_item,.servide_list_item_xs{ font-size: 16px; font-family: PingFang SC; font-weight: 400; text-overflow: -o-ellipsis-lastline; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; color: #E8EFFD; overflow: hidden; line-height: 36px; } .servide_list_item_xs{ font-size: 1em; line-height: 2em; height: 5em; } .clss_w49{ width: 48.66%; } .per48{ width: 48%; } .nav>li>a:focus, .nav>li>a:hover{ background: none !important; } .fz18{ font-size: 18px !important; font-family: PingFang SC; font-weight: 400; color: #0C1B3E; } .mb150{ margin-bottom: 150px; } .mb56{ margin-bottom: 56px; } .nav-pills>li>a{ font-size: 24px; font-family: PingFang SC; font-weight: bold; color: #0A1736; } .nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover, .nav-pills>li.active>a{ color: #0E8ADB; background: none; } .nav-pills>li.active>a:after{ display: block; content: ""; width: 24px; height: 4px; margin: 6px auto 0; background: linear-gradient(-23deg, #1DD5E6 0%, #0E8ADB 100%); border-radius: 2px; } .paddingT18{ padding-top: 18px; } @media (max-width:768px){ .mb150 { margin-bottom: 1rem;} .nav-pills>li>a{ font-size: 0.91rem; padding: 0.9em 0 0 0; /*padding: 0.8em 0.8em;*/ } div.news-area div[data-navid] li.list-group-item a{ width:70%; } .nav-pills{ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Chrome */ display: flex; } .nav-pills>li{ -webkit-box-flex: 1; /* OLD - iOS 6-, Safari 3.1-6 */ -moz-box-flex: 1; /* OLD - Firefox 19- */ /*width: 20%; !* For old syntax, otherwise collapses. *!*/ -webkit-flex: 1; /* Chrome */ -ms-flex: 1; /* IE 10 */ flex: 1; text-align: center; } div.news-area div[data-navid] li.list-group-item span{ width: 25%; text-overflow: ellipsis; overflow:hidden; white-space:nowrap; } .contact-us-area p{ padding-left: 20px; display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Chrome */ display: flex; } .contact-us-area p.copy{ padding-left: 20px; } }