@font-face { font-family: 'accid'; src: url("fonts/accid.woff2") format("woff2"), url("fonts/accid.woff") format("woff"), url("fonts/accid.ttf") format("truetype"), url("fonts/accid.eot") format("embedded-opentype"), url("fonts/accid.svg") format("svg"); } .acc { font-family: 'accid'; } @keyframes rotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } /* 100% { transform: rotate(0deg); } */ } @keyframes toBtn { 0 { opacity: 1; transform: translate(-50%, 0); } 100% { transform: translate(-50%, 1rem); opacity: 0; } } .index-container .swiper-slide img { width: 100%; object-fit: cover; } .index-pos { position: absolute; z-index: 10; left: 8.5%; top: 26%; width: 15rem; } .i-tit { width: 100%; border-bottom: 1px solid rgba(255, 255, 255, .25); padding-bottom: 1.7rem; margin-bottom: 0.7rem; } .i-tit div { margin-bottom: .75rem; } .i-tit div p { color: #FFFFFF; font-size: 1.8rem; font-weight: bold; margin-bottom: 0.6rem; line-height: 1; } .i-tit div span { color: #FFFFFF; font-size: 1.5rem; display: block; line-height: 1; text-indent: 1.8rem; font-weight: bold; } .i-tit>span { color: #FFFFFF; line-height: 1; color: rgba(255, 255, 255, .6); } .i-more { display: flex; align-items: center; justify-content: flex-end; } .i-more span { color: #FFFFFF; margin-right: 0.25rem; } .i-more img { width: 100%; object-fit: covere; } .i-more .arr { width: 0.85rem; margin-right: .5rem; } .i-more .point { width: 0.75rem; animation: rotate 5s linear infinite; } .i-more:hover { padding-bottom: .5rem; border-bottom: 1px solid 1px solid rgba(255, 255, 255, .25); } .index-container .swiper-button-prev { background: url(../img/4.png) no-repeat center; } .index-container .swiper-button-next { background: url(../img/5.png) no-repeat center; } .index-container .swiper-button-prev:hover { background: #0093D9 url(../img/4.png) no-repeat center; } .index-container .swiper-button-next:hover { background: #0093D9 url(../img/5.png) no-repeat center; } .index-container .swiper-button-prev, .index-container .swiper-button-next { width: 1.2rem; height: 1.2rem; border: 1px solid rgba(162, 159, 154, .5); border-radius: 50%; background-color: 13px 9px; transition: all .3s; } .index-container .swiper-button-prev::after, .index-container .swiper-button-next::after { font-size: 0; } .i-about { position: relative; background-color: #EFF4F7; padding: 2.35rem 0 2.3rem; } .i-about-pos { position: absolute; } .i-about-pos img { width: 100%; object-fit: cover; } .i-about-lf { width: 9.8rem; left: 0; bottom: 2.3rem; } .i-about-cent { width: 9.8rem; left: 10.3rem; bottom: 6.75rem; } .i-about-rg { width: 17.35rem; right: 0; top: 6.65rem; } .i-about-box { position: relative; display: flex; align-items: flex-start; justify-content: space-between; } .i-about-name { width: 25%; padding-right: 3.4rem; } .i-about-name .h1 { color: #333333; font-size: 1.2rem; line-height: 1; margin-bottom: 0.6rem; font-weight: bold; } .i-about-name .h2 { color: #0093D9; font-size: .75rem; line-height: 1; margin-bottom: 1.15rem; font-weight: bold; } .i-about-name .h3 { font-size: 1.8rem; font-weight: 400; color: #EFF4F7; line-height: .8; text-transform: uppercase; -webkit-text-stroke: 1px rgba(0, 147, 217, .5); text-stroke: 1px rgba(0, 147, 217, .5); } .i-about-cents { width: 75%; } .i-about-cent-cont { width: 54%; color: #333333; line-height: 1.7; margin-bottom: 0.4rem; } .i-about-cent-more { display: flex; align-items: center; justify-content: center; width: 1.2rem; height: 1.2rem; line-height: 1.2rem; text-align: center; background: #0093D9; border-radius: 50%; margin-bottom: 1.25rem; transition: all .3s; } .i-about-cent-more svg { width: 13px; height: auto; fill: #FFFFFF; transition: all .3s; } .i-about-cent-more:hover { background-color: #A1CC56; /* border: 1px solid #0093D9; */ } /* .i-about-cent-more:hover svg { fill: #0093D9; } */ .i-about-cent-img { width: 100%; position: relative; } .i-about-cent-img>img { width: 100%; } .i-about-cent-img-cont { position: absolute; left: 1.05rem; bottom: 2.7rem; width: 4rem; } .i-about-cent-img-cont div { width: .75rem; margin-bottom: .4rem; } .i-about-cent-img-cont div img { width: 100%; } .i-about-cent-img-cont p:nth-child(2) { color: #FFFFFF; font-weight: bold; line-height: 1.5; margin-bottom: 0.4rem; } .i-about-cent-img-cont p:nth-child(3) { color: rgba(255, 255, 255, .5); line-height: 1.1; word-break: break-all; } .i-about-num { position: absolute; top: 0; right: 0; padding-top: .75rem; width: 25%; border-top: 1px solid rgba(153, 153, 153, .5); display: flex; align-items: flex-start; justify-content: space-between; } .i-about-num>p { color: #999999; line-height: 1; } .i-about-num div { display: flex; align-items: flex-end; justify-content: flex-end; } .i-about-num div p { color: #0093D9; font-size: 3rem; line-height: .8; margin: 6px; font-style: italic; } .i-about-num div span { color: #0093D9; } .i-pro { padding-top: 2.25rem; position: relative; } .i-pro-icon { left: 0; top: 26%; width: 91.7%; } .i-pro-icon2 { right: 9.375%; bottom: 5.5rem; width: 9.8rem; } .i-pro-icon3 { right: 0; bottom: 1.8rem; width: 8.25rem; } .tac { text-align: center; } .i-pro-box .h1 { color: #333333; font-size: 1.2rem; font-weight: bold; margin-bottom: 0.65rem; line-height: 1; } .i-pro-box .h2 { font-size: 1.8rem; font-weight: 400; color: #EFF4F7; line-height: .8; text-transform: uppercase; -webkit-text-stroke: 1px rgba(0, 147, 217, .5); text-stroke: 1px rgba(0, 147, 217, .5); margin-bottom: 0.7rem; } .i-pro-box .h3 { color: #0093D9; line-height: 1; font-weight: bold; margin-bottom: 0.45rem; } .i-pro-cont { width: 39%; margin: 0 auto 1rem; } .swiper-box { width: 100%; position: relative; padding-top: 1.2rem; } .swiper-box .swiper-pagination { line-height: 1; width: 100%; top: 0; } .swiper-box .swiper-pagination-bullet { margin-right: 6px; background: #0093D9; } .swiper-box .swiper-pagination-bullet:last-child { margin-right: 0; } .swiper-box .swiper-pagination-bullet-active { background: #A1CC56; } .i-pro-container { background-color: #FFFFFF; } .i-pro-container .swiper-slide { width: 19.125%; height: 9.5rem; margin-right: 1.09375%; border: 1px solid #E3F0F7; box-shadow: 0px 2px 3px 0px rgba(0, 147, 217, 0.2); } .i-pro-container .swiper-slide:last-child { margin-right: 0; } .nor-swi { width: 100%; height: 100%; padding: 1rem .5rem; position: relative; transition: all .5s; } .nor-swi-tit { text-align: center; line-height: 1; color: #333333; transition: all .5s .2s; } .nor-swi-cont { position: absolute; bottom: 2.4rem; left: 0; width: 100%; transition: all .5s .4s; } .nor-swi-cont img { max-width: 100%; margin: 0 auto; object-fit: cover; } .nor-swi-more { position: absolute; left: 50%; bottom: 1rem; transform: translateX(-50%); width: 1rem; height: 1rem; line-height: 1rem; text-align: center; border: 1px solid #D2D2D2; border-radius: 50%; z-index: 2; display: flex; align-items: center; justify-content: center; transition: all .5s; } .nor-swi-more svg { width: 13px; fill: #CCCCCC; transition: all .5s; } .hov-swi { position: absolute; z-index: 1; width: 100%; height: 100%; left: 0; top: 0; padding: 1.6rem 0.85rem .5rem; transform: translateY(20px); transition: all .5s; opacity: 0; } .hov-swi-tit { color: #FFFFFF; line-height: 1; margin-bottom: .4rem; text-align: center; font-size: .75rem; opacity: 0; transform: translateY(20px); transition: all .5s .2s; } .hov-swi-cont { color: #FFFFFF; text-align: center; transition: all .5s .4s; transform: translateY(20px); opacity: 0; } .i-pro-container .swiper-slide:hover { border-color: transparent; } .i-pro-container .swiper-slide:hover .nor-swi, .i-pro-container .swiper-slide:hover .nor-swi-tit, .i-pro-container .swiper-slide:hover .nor-swi-cont { transform: translateY(20px); opacity: 0; } .i-pro-container .swiper-slide:hover .hov-swi, .i-pro-container .swiper-slide:hover .hov-swi-tit, .i-pro-container .swiper-slide:hover .hov-swi-cont { transform: translateY(0); opacity: 1; } .i-pro-container .swiper-slide:hover .nor-swi-more { background-color: #FFFFFF; } .i-pro-container .swiper-slide:hover .nor-swi-more svg { fill: #0093D9; } .i-case { position: relative; } .i-case-icon { bottom: 2rem; left: 0; width: 31.4%; } .i-case-icon2 { right: 0; top: -6.45rem; width: 63.3%; } .i-case { padding: 2rem 0 2.25rem; } .i-case-box { display: flex; align-items: flex-start; justify-content: space-between; } .i-case-lf { width: 50%; padding-right: .5rem; } .i-case-lf .h1 { color: #333333; font-size: 1.2rem; line-height: 1; font-weight: bold; margin-bottom: .5rem; } .i-case-lf .h2 { color: #0093D9; line-height: 1; font-weight: bold; margin-bottom: 1.25rem; } .i-case-lf .h3 { font-size: 1.8rem; font-weight: 400; color: #EFF4F7; line-height: .8; -webkit-text-stroke: 1px rgba(0, 147, 217, .5); text-stroke: 1px rgba(0, 147, 217, .5); margin-bottom: 0.7rem; } .i-case-cont { color: #333333; line-height: 0.6rem; margin-bottom: 2.85rem; } .i-case-lf-more { display: block; width: 100%; height: 11.25rem; position: relative; overflow: hidden; } .i-case-lf-more>img { width: 100%; height: 100%; object-fit: cover; transition: all .3s; } .i-case-lf-more:hover img { transform: scale(1.1); } .i-case-lf-more:hover .i-case-lf-more-intro { width: 46%; } .i-case-lf-more-intro { position: absolute; padding: 2.15rem 1.5rem 1.2rem .5rem; text-align: right; top: 0; right: 0; width: 43.6%; height: 100%; transition: all .3s; background-color: rgba(0, 147, 217, .85); -webkit-clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%); clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%); } .i-case-lf-more-intro .tit { color: #FFFFFF; font-size: 0.9rem; line-height: 1; margin-bottom: 0.6rem; font-weight: bold; } .i-case-lf-more-intro .sub { color: #FFFFFF; line-height: 1; margin-bottom: 1.1rem; } .i-case-lf-more-intro .btn { width: 1.2rem; height: 1.2rem; line-height: 1.2rem; text-align: center; background: #FFFFFF; border-radius: 50%; margin-left: calc(100% - 1.2rem); margin-bottom: 1.95rem; position: relative; display: flex; align-items: center; justify-content: center; transition: all .3s; } .i-case-lf-more-intro .btn:hover { transform: scale(1.1); /* background-color: #0093D9; border: 1px solid #FFFFFF; */ } /* .i-case-lf-more-intro .btn:hover svg { fill: #FFFFFF; } */ .i-case-lf-more-intro .btn svg { fill: #0093D9; width: 13px; } .i-case-lf-more-intro>.icon { width: 1.5rem; margin-left: calc(100% - 1.2rem); } .i-case-lf-more-intro>.icon img { width: 100%; object-fit: cover; } .i-case-rg { width: 50%; padding-left: .5rem; } .i-case-rg-ls { width: 100%; height: 11.25rem; position: relative; box-shadow: -5px 5px 10px rgba(0, 0, 0, .2); display: block; overflow: hidden; } .i-case-rg-ls>img { width: 100%; height: 100%; object-fit: cover; transition: all .3s; } .i-case-rg-ls-intro { position: absolute; width: 43.6%; height: 100%; left: 0; top: 0; background-color: rgba(161, 204, 86, .85); padding: 2.05rem 0 1.45rem 1.35rem; -webkit-clip-path: polygon(0 0, 80% 0%, 100% 100%, 0% 100%); clip-path: polygon(0 0, 80% 0%, 100% 100%, 0% 100%); transition: all .3s; } .i-case-rg-ls:hover img { transform: scale(1.1); } .i-case-rg-ls:hover .i-case-rg-ls-intro { width: 46%; } .i-case-rg-ls-intro .tit { color: #FFFFFF; font-size: 0.9rem; font-weight: bold; line-height: 1; margin-bottom: 0.6rem; } .i-case-rg-ls-intro .sub { color: #FFFFFF; line-height: 1; margin-bottom: .9rem; } .i-case-rg-ls-intro .btn { display: flex; align-items: center; justify-content: center; width: 1.2rem; height: 1.2rem; line-height: 1.2rem; text-align: center; background: #FFFFFF; border-radius: 50%; margin-bottom: 2.25rem; transition: all .3s; } .i-case-rg-ls-intro .btn:hover { transform: scale(1.1); } .i-case-rg-ls-intro .btn svg { width: 13px; fill: #A1CC56; } .i-case-rg-ls-intro .icon { width: 1.3rem; } .i-case-rg-ls-intro .icon img { width: 100%; } .i-case-rg-ls-other { margin-top: 1rem; } .i-case-rg-ls-other .i-case-rg-ls-intro { background-color: rgba(20, 105, 145, .85); } .i-case-rg-ls-other .i-case-rg-ls-intro .btn svg { fill: #146991; } .i-news { padding: 2rem 0 2.7rem; background-color: #F7F7F7; } .i-news-box { position: relative; } .i-news-box .h1 { color: #333333; font-size: 1.2rem; line-height: 1; font-weight: bold; margin-bottom: .5rem; } .i-news-box .h2 { font-size: 1.8rem; font-weight: 400; color: #EFF4F7; line-height: 1.5rem; text-transform: uppercase; -webkit-text-stroke: 1px rgba(0, 147, 217, .5); text-stroke: 1px rgba(0, 147, 217, .5); /* margin-bottom: 1.4rem; */ } .i-news-more { display: flex; align-items: center; justify-content: center; position: relative; top: -.5rem; margin: 0 auto; width: 1.2rem; height: 1.2rem; line-height: 1.2rem; text-align: center; background: #0093D9; border-radius: 50%; transition: all .3s; } .i-news-more:hover { transform: scale(1.1); background-color: #A1CC56; /* border: 1px solid #0093D9; */ } /* .i-news-more:hover svg { fill: #0093D9; } */ .i-news-more svg { width: 13px; fill: #FFFFFF; transition: all .3s; } .i-news-intro { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; } .i-news-lf { width: 50%; padding-right: .5rem; } .i-news-lf-ls { display: block; width: 100%; display: flex; align-items: flex-start; justify-content: space-between; padding-bottom: 0.7rem; border-bottom: 1px solid rgba(102, 102, 102, .1); margin-bottom: .75rem; } .i-news-lf-ls:last-child { padding-bottom: 0; border-bottom: none; margin-bottom: 0; } .i-news-lf-ls .img { width: 5.5rem; height: 4.5rem; margin-right: .75rem; overflow: hidden; } .i-news-lf-ls .img img { width: 100%; height: 100%; object-fit: cover; transition: all .3s; } .i-news-lf-ls .wrap { width: calc(100% - 6.25rem); padding-top: 0.25rem; } .i-news-lf-ls .wrap .tit { color: #333333; line-height: 1; margin-bottom: .5rem; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all .3s; } .i-news-lf-ls .wrap .time { color: #0093D9; font-weight: bold; line-height: 1; margin-bottom: 0.45rem; } .i-news-lf-ls .wrap .cont { color: #666666; line-height: 0.6rem; margin-bottom: 0.45rem; } .i-news-lf-ls .wrap .arr { width: 13px; height: auto; } .i-news-lf-ls .wrap .arr svg { width: 100%; fill: #666666; font-weight: bold; } .i-news-lf-ls:hover .img img { transform: scale(1.1); } .i-news-lf-ls:hover .wrap .tit { color: #0093D9; } .i-news-rg { width: 50%; padding-left: .5rem; } .i-news-rg-ls { width: 100%; display: block; position: relative; transition: all .3s; margin-bottom: 1.25rem; padding: 0 0.8rem; } .i-news-rg-ls:last-child { margin-bottom: 0; } .i-news-rg-ls::after { content: ''; position: absolute; top: 50%; right: 1rem; transform: translateY(-50%); background: url(../img/5.png) no-repeat center; width: 13px; height: 9px; transition: all .3s; } .i-news-rg-ls .time { color: #999999; font-weight: bold; line-height: 1; margin-bottom: 0.35rem; transition: all .3s; } .i-news-rg-ls .tit { color: #333333; font-weight: 500; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all .3s; } .i-news-rg-ls:hover { background-color: #0093D9; padding: .5rem 0.8rem; margin-bottom: .75rem; } .i-news-rg-ls:hover p { color: #FFFFFF; } .foot { border-top: 1px solid rgba(210, 229, 238, .5); } .foot-nav { padding: 1.25rem 0 1.5rem; display: flex; align-items: center; justify-content: flex-start; } .foot-nav-lf { margin-right: 5.4rem; display: flex; align-items: flex-start; justify-content: flex-start; } .foot-nav-lf .list { margin-right: 3.7rem; } .foot-nav-lf .list:first-child { margin-right: 2.35rem; } .foot-nav-lf .list:last-child { margin-right: 0; } .foot-nav-lf .list a { color: #999999; line-height: 1; margin-bottom: 10px; display: block; transition: all .3s; } .foot-nav-lf .list a:hover { color: #0093D9; } .foot-nav-lf .list a:first-child { color: #333333; margin-bottom: 0.65rem; } .foot-nav-lf .list a:last-child { margin-bottom: 0; } .foot-nav-code {} .vs-code { width: 3.25rem; margin: 0 auto 8px; } .vs-code img { width: 100%; } .foot-nav-code .sao { color: #333333; margin-bottom: 0.45rem; text-align: center; } .foot-nav-code .sao span { color: #0093D9; line-height: 0.6rem; } .foot-logo { width: 2.25rem; margin: 0 auto; } .foot-logo img { width: 100%; } .foot-btn { height: 2.2rem; background-color: #0093D9; padding: 0 8.5%; display: flex; align-items: center; justify-content: space-between; } .foot-btn-lf { color: #FFFFFF; } .foot-btn-lf a { display: inline-block; color: #FFFFFF; margin-right: .5rem; } .foot-btn-lf a span { color: #A1CC56; } .foot-btn-lf a img { display: inline-block; margin-right: 5px; } .foot-btn-lf a:last-child { opacity: .5; margin-right: 0; } .foot-btn-rg { display: flex; align-items: center; justify-content: flex-end; } .foot-btn-rg a { color: #FFFFFF; } .foot-url { width: 6.5rem; height: 1.1rem; background: #FFFFFF; border: 1px solid #E7E8E8; position: relative; margin-left: .75rem; } .foot-url::after { content: ''; position: absolute; top: 50%; right: .5rem; transform: translateY(-50%); border-bottom: 6px solid #333333; border-left: 4.5px solid transparent; border-right: 4.5px solid transparent; } .foot-url p { width: 100%; height: 100%; line-height: 1.1rem; padding-left: 0.7rem; color: #999999; cursor: pointer; } .foot-url-pos { position: absolute; bottom: 100%; left: 0; width: 100%; max-height: calc(3.2rem + 3px); overflow-y: auto; background-color: #FFFFFF; border: 1px solid #E7E8E8; display: none; } .foot-url-pos a { display: block; width: 100%; height: .8rem; line-height: .8rem; color: #999; padding-left: .7rem; border-bottom: 1px solid #E7E8E8; } .foot-url-pos a:last-child { border-bottom: none; } .banner {} .banner-img { width: 100%; position: relative; } .banner-img>img { width: 100%; object-fit: cover; } .banner-intro { position: absolute; top: 2.8rem; left: 8.5%; padding-bottom: 1.25rem; } .banner-intro::after { content: ''; position: absolute; width: 7.5rem; height: 1px; background-color: rgba(255, 255, 255, .25); left: 0; bottom: 0; } .banner-intro p { color: #FFFFFF; margin-bottom: 1rem; } .banner-intro p span { display: block; line-height: 1.5; margin-bottom: 0.65rem; font-size: 1.2rem; } .banner-intro p span:last-child { margin-bottom: 0; } .banner-intro div { width: .75rem; animation: rotate 5s linear infinite; } .banner-intro div img { width: 100%; object-fit: cover; } .pub-nav { background-color: #EFF4F7; height: 2.5rem; border: 1px solid #CBD9E1; } .nav-container { height: 100%; } .nav-container .swiper-slide { width: 14.25%; border-right: 1px solid #CBD9E1; text-align: center; transition: all .3s; cursor: pointer; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; padding-bottom: 0.35rem; color: #333; } .other-container .swiper-wrapper { justify-content: center; } .other-container .swiper-slide { line-height: 2.5rem; padding-bottom: 0; } .nav-container .swiper-slide::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 0; height: 4px; background: #0093D9; transition: all .3s; } .nav-container .swiper-slide:first-child { border-left: 1px solid #CBD9E1; } .nav-container .swiper-slide p { color: #333333; line-height: 1; margin-bottom: 7px; transition: all .3s; } .nav-container .swiper-slide div { position: relative; width: 0.9rem; height: 0.9rem; background: #DCE5EA; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: all .3s; } .nav-container .swiper-slide div img { max-width: 90%; max-height: 90%; object-fit: cover; } .nav-container .swiper-slide:hover, .nav-container .swiper-slide.cur { background-color: #FFFFFF; color: #0093D9; } .nav-container .swiper-slide:hover::after, .nav-container .swiper-slide.cur::after { width: 100%; } .nav-container .swiper-slide:hover p, .nav-container .swiper-slide.cur p { color: #0093D9; } .nav-container .swiper-slide:hover div, .nav-container .swiper-slide.cur div { background: #0093D9; } .nav-container .swiper-slide:hover div .normal-block, .nav-container .swiper-slide.cur div .normal-block { opacity: 0; } .nav-container .swiper-slide:hover div .hover-block, .nav-container .swiper-slide.cur div .hover-block { opacity: 1; } .pro {} .pro-box {} .system { padding: 2rem 0; display: flex; align-items: stretch; justify-content: space-between; } .system-lf { width: 50%; padding-right: .5rem; position: relative; } .system-lf .h1 { color: #333333; line-height: 1; margin-bottom: 0.375rem; font-size: .75rem; } .system-lf .h2 { line-height: 1; color: #CCCCCC; margin-bottom: 1.2rem; } .system-lf .cont { color: #666666; } .system-lf .swiper-box { position: absolute; bottom: 0; left: 0; width: 100%; padding: 0; } .system-lf .sys-container { width: 56%; margin-left: calc(44% - .5rem); } .sys-container .swiper-slide { width: 31%; height: 1.95rem; margin-right: 3.5%; } .sys-container .swiper-slide img { width: 100%; height: 100%; object-fit: cover; } .sys-container .swiper-slide-active::after { content: ''; position: absolute; width: calc(100% - 4px); height: calc(100% - 4px); top: 0; left: 0; border: 2px solid #0093D9; background-color: rgba(0, 147, 217, .2); transition: all .3s; } .sys-container .swiper-slide:last-child { margin-right: 0; } .sys-swi .swiper-button-prev, .sys-swi .swiper-button-next { width: 1rem; height: 1rem; border: 1px solid #D2D2D2; border-radius: 50%; color: #CCCCCC; top: .5rem; bottom: auto; left: auto; right: auto; margin: auto; } .sys-swi .swiper-button-prev { left: 0; } .sys-swi .swiper-button-next { left: 1.75rem; } .sys-swi .swiper-button-prev::after, .sys-swi .swiper-button-next::after { font-size: 14px; } .system-rg { width: 50%; height: 11.2rem; } .system-rg img { width: 100%; height: 100%; object-fit: cover; } .agent { padding-bottom: 1.3rem; display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap; } .agent-ls { width: 48.75%; margin-right: 2.5%; margin-bottom: 1.15rem; padding-top: 0.375rem; display: flex; align-items: flex-start; justify-content: flex-start; border-top: 1px solid #CCCCCC; } .agent-ls:nth-child(2n) { margin-right: 0; } .agent-ls-pic { width: 5.25rem; margin-right: 0.2rem; overflow: hidden; } .agent-ls-pic img { max-width: 100%; object-fit: cover; transition: all .3s; } .agent-ls-intro { padding-top: 0.7rem; width: calc(100% - 5.45rem); } .agent-ls-intro .h1 { line-height: 1; color: #333333; margin-bottom: 10px; } .agent-ls-intro .h2 { line-height: 1; color: #0093D9; margin-bottom: 0.4rem; } .agent-ls-intro .cont { color: #999999; line-height: 1.7; margin-bottom: 0.35rem; } .agent-ls-intro .btn { width: 1rem; height: 1rem; line-height: 1rem; text-align: center; border: 1px solid #D2D2D2; border-radius: 50%; transition: all .3s; } .agent-ls-intro .btn svg { width: 13px; fill: #CCCCCC; transition: all .3s; } .agent-ls:hover .agent-ls-pic img { transform: scale(1.1); } .agent-ls:hover .agent-ls-intro .btn { background-color: #0093D9; transform: scale(1.1); } .agent-ls:hover .agent-ls-intro .btn svg { fill: #FFFFFF; } .pro-btm { display: flex; align-items: center; justify-content: space-between; } .consult { width: 62.5%; height: 13.2rem; padding: 2rem 8.5%; } .consult .tit { color: #FFFFFF; font-size: .75rem; font-weight: bold; line-height: 1; margin-bottom: 0.8rem; } .consult .sub { color: #FFFFFF; line-height: 1; margin-bottom: 8px; } .consult .cont { color: #FFFFFF; line-height: 1.5; width: 90%; margin-bottom: 1.05rem; } .consult .btn { width: 4.4rem; height: 1.2rem; background-color: #0093D9; display: flex; align-items: center; justify-content: space-between; padding: 0 0.6rem 0 0.85rem; border-radius: 0.6rem; cursor: pointer; transition: all .3s; } .consult .btn p { color: #FFFFFF; transition: all .3s; } .consult .btn svg { width: 13px; fill: #FFFFFF; transition: all .3s; } .consult .btn:hover { background-color: #FFFFFF; border: 1px solid #0093D9; } .consult .btn:hover p { transform: translateX(5px); color: #0093D9; } .consult .btn:hover svg { transform: translateX(-5px); fill: #0093D9; } .pro-btm .infor { width: 37.5%; height: 13.2rem; background-color: #0093D9; position: relative; padding: 2rem 1.5rem; } .infor .tit { color: rgba(255, 255, 255, .7); line-height: 1; margin-bottom: 0.6rem; } .infor .sub { color: #FFFFFF; font-size: .75rem; font-weight: bold; line-height: 1; margin-bottom: 1.2rem; } .infor .list { display: flex; align-items: center; justify-content: flex-start; width: 83%; border-bottom: 1px solid rgba(255, 255, 255, .2); padding-bottom: 0.35rem; margin-bottom: 0.4rem; } .infor .list:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; } .infor .list p { color: rgba(255, 255, 255, .7); line-height: 1; margin-right: 1rem; width: 8em; } .infor .list span { color: #FFFFFF; font-weight: bold; line-height: 1; } .infor .plane { width: 3.2rem; position: absolute; bottom: 2.4rem; right: 6.25rem; } .infor .plane img { width: 100%; object-fit: cover; } .popup { position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, .5); z-index: 101; display: none; } .popup-bg { position: absolute; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; } .popup-form { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 51%; z-index: 2; } .popup-top { width: 100%; height: 1.65rem; background-color: #0093D9; display: flex; align-items: center; justify-content: space-between; padding: 0 0.7rem 0 .85rem; } .popup-top p { color: #FFFFFF; line-height: 1; } .popup-top div { width: 10px; cursor: pointer; } .popup-top div img { width: 100%; object-fit: cover; } .popup-form form { display: block; width: 100%; background-color: #FFFFFF; padding: 1rem; } .frs { z-index: 2; } .sec { z-index: 1; } .form-sel { width: 100%; height: 1.55rem; border: 1px solid #D6D6D6; margin-bottom: 8px; position: relative; } .form-sel-marg { margin-bottom: 0.7rem; } .form-sel::after { content: ''; position: absolute; top: 50%; right: .75rem; transform: translateY(-50%); border-top: 6px solid #333333; border-left: 5.5px solid transparent; border-right: 5.5px solid transparent; } .form-sel input { width: 100%; height: 100%; object-fit: cover; padding: 0 0.7rem; color: #333333; cursor: pointer; } .form-sel input::placeholder { color: #333333; } .form-sel .change { position: absolute; top: 100%; left: -1px; width: calc(100% + 2px); max-height: calc(6rem + 6px); overflow-y: auto; border: 1px solid #D6D6D6; background-color: #FFFFFF; display: none; } .form-sel .change::-webkit-scrollbar { width: 2px; } .form-sel .change::-webkit-scrollbar-thumb { background: #0093D9; } .form-sel .change span { display: block; line-height: 1rem; padding-left: 0.85rem; color: #666; border-bottom: 1px solid #D6D6D6; cursor: pointer; } .form-sel .change span:last-child { border-bottom: none; } .form-input { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; } .form-input div { width: 49%; height: 1.1rem; margin-right: 2%; margin-bottom: 0.45rem; position: relative; border: 1px solid #D6D6D6; } .form-input div::after { content: '*'; position: absolute; top: 50%; right: 0.9rem; transform: translateY(-50%); color: #FF0033; } .form-input div:nth-child(2n) { margin-right: 0; } .form-input div input { padding: 0 .75rem; width: 100%; height: 100%; } .form-other { height: 1.1rem; margin-bottom: 0.4rem; } .form-other .change { max-height: calc(2.4rem + 3px); } .form-other .change span { line-height: .8rem; } .form-trea { width: 100%; height: 3.75rem; color: #999999; border: 1px solid #D6D6D6; padding: 0.375rem .75rem; margin-bottom: .5rem; resize: none; } .popup-form .code { display: flex; align-items: center; justify-content: flex-start; margin-bottom: 1rem; } .popup-form .code input { width: 37%; height: 1.1rem; margin-right: 0.3rem; border: 1px solid #D6D6D6; padding: 0.375rem .75rem; color: #999; } .popup-form .code div { width: 2.85rem; height: 1.1rem; line-height: 1.1rem; text-align: center; background: #333333; color: #FFFFFF; } .submit { padding-top: 0.85rem; border-top: 1px solid #D6D6D6; display: flex; align-items: center; justify-content: center; } .submit div { width: 4.9rem; height: 1.2rem; line-height: 1.2rem; text-align: center; background: rgba(102, 102, 102, .25); border-radius: 4px; color: #FFFFFF; font-weight: bold; margin-right: 0.8rem; cursor: pointer; } .submit input { width: 4.9rem; height: 1.2rem; background: #0093D9; border-radius: 4px; color: #FFFFFF; font-weight: bold; } .info-banner { position: relative; } .info-banner>img { width: 100%; object-fit: cover; } .info-cont { position: absolute; left: 8.5%; bottom: 0; background-color: rgba(255, 255, 255, .8); width: 54.7%; } .info-cont .agent-ls { width: 77%; border-top: 6px solid #0093D9; padding: 0.6rem 0.35rem; } .info-cont .btn { transform: rotate(90deg); background-color: #0093D9; } .info-cont .btn svg { color: #FFFFFF; } .info-intro { display: flex; align-items: flex-start; justify-content: space-between; /* padding: 0 1.95rem 0 8.5%; */ } .info-intro-lf { width: 62.5%; background-color: #F7F7F7; padding: 1.4rem 0 2rem 4rem; } .info-intro-lf>.tit { color: #333333; line-height: 1; font-size: .75rem; margin-bottom: 0.85rem; } .ajax-box {} .ajax-wrap { margin-bottom: 1.15rem; } .ajax-wrap .list { margin-bottom: 1rem; padding-right: 1.95rem; } .ajax-wrap .list:last-child { margin-bottom: 0; } .ajax-wrap .list>.tit { color: #0093D9; line-height: 1; margin-bottom: 0.5rem; } .ajax-wrap .list .intro { width: 100%; border-top: 2px solid #DBDBDB; display: flex; align-items: flex-start; justify-content: space-between; position: relative; padding: .75rem 1.3rem 1.25rem 0.8rem; background-color: #FFFFFF; } .ajax-wrap .list .intro::after { content: ''; position: absolute; top: -2px; left: 0; width: 37.6%; height: 2px; background-color: #0093D9; } .ajax-wrap .list .intro .img { width: 7.75rem; margin-right: 1rem; } .ajax-wrap .list .intro .img img { width: 100%; } .ajax-wrap .list .intro .cont { width: calc(100% - 8.75rem); } .ajax-wrap .list .intro .cont .recommend { margin-bottom: 0.9rem; } .ajax-wrap .list .intro .cont .recommend>p { color: #333333; line-height: 1; margin-bottom: 0.2rem; font-weight: bold; } .ajax-wrap .list .intro .cont .recommend div { color: #666666; line-height: 1.7; } .ajax-wrap .list .intro .cont .type {} .ajax-wrap .list .intro .cont .type>p { color: #333333; margin-bottom: 0.45rem; font-weight: bold; } .ajax-wrap .list .intro .cont .type>div {} .ajax-wrap .list .intro .cont .type>div div { border-bottom: 1px solid #DBDBDB; padding: 8px; line-height: 1; } .ajax-wrap .list .intro .cont .type>div div span { display: inline-block; line-height: 1; } .ajax-wrap .list .intro .cont .type>div div span:nth-child(1) { color: #666666; width: 3.5rem; } .ajax-wrap .list .intro .cont .type>div div span:nth-child(2) { color: #0093D9; font-weight: bold; } .ajax-btn { width: max-content; margin: 0 auto; } .ajax-btn div { width: 1.2rem; height: 1.2rem; line-height: 1.2rem; text-align: center; background: #0093D9; border-radius: 50%; transform: rotate(90deg); margin: 0 auto .4rem; display: flex; align-items: center; justify-content: center; } .ajax-btn div svg { width: 13px; fill: #FFFFFF; } .ajax-btn p { color: #0093D9; line-height: 1; text-align: center; } .info-intro-rg { width: 37.5%; background-color: #FFFFFF; padding: ; } .sid-top { padding: 1rem 4rem 1rem 1.35rem; } .sid-top .icon { display: flex; align-items: center; justify-content: flex-start; margin-bottom: 0.25rem; } .sid-top .icon div { width: 2.95rem; margin-right: 0.25rem; } .sid-top .icon div img { width: 100%; object-fit: cover; } .sid-top .icon p { color: #333333; font-weight: bold; } .sid-top .pic { padding-left: 0.35rem; margin-bottom: 0.45rem; } .sid-top .pic img { width: 100%; object-fit: cover; } .sid-top .cont { padding-left: 0.35rem; width: 100%; color: #666666; line-height: 1.7; } .sid-down { border-top: 1px solid #E5E5E5; padding: 1.15rem 4rem 1.2rem 1.7rem; } .sid-down .top, .sid-video .top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; } .sid-down .top .tit, .sid-video .top .tit { color: #333333; line-height: 1; font-weight: bold; } .sid-down .top .icon, .sid-video .top .icon { display: flex; align-items: center; justify-content: flex-end; } .sid-down .top .icon p, .sid-video .top .icon p { color: #0093D9; margin-right: 0.25rem; } .sid-down .top .icon div, .sid-video .top .icon div { width: 0.45rem; height: 0.45rem; display: flex; align-items: center; justify-content: center; background: #0093D9; border-radius: 50%; } .sid-down .top .icon div svg, .sid-video .top .icon div svg { width: 8px; fill: #FFFFFF; } .sid-down .list { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 1.4rem; border: 1px solid rgba(162, 159, 154, .5); padding: 0 0.6rem; margin-bottom: .5rem; } .sid-down .list:last-child { margin-bottom: 0; } .sid-down .list p { color: #666666; max-width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .sid-down .list div { width: 0.7rem; height: 0.7rem; line-height: .7rem; text-align: center; background: #CCCCCC; border-radius: 50%; } .sid-down .list div img { display: inline-block; } .sid-video { border-top: 1px solid #E5E5E5; padding: 1.25rem 4rem 1rem 1.7rem; } .sid-video .top { margin-bottom: 0.55rem; } .sid-video .pic { width: 100%; margin-bottom: 0.65rem; position: relative; } .sid-video .pic .play { width: 1.45rem; cursor: pointer; } .sid-video .pic .play img { width: 100%; object-fit: cover; } .sid-video .pic img { width: 100%; object-fit: cover; } .sid-video .sub { color: #333333; line-height: 1; font-weight: bold; } .sid-book { border-top: 1px solid #E5E5E5; padding: 1rem 35% 0 1.7rem; } .sid-book p { color: #333333; line-height: 1; margin-bottom: 0.85rem; font-weight: bold; } .sid-book div { width: 100%; } .case { padding: 1.75rem 0 3rem; } .case-wrap { margin-bottom: 1.9rem; display: flex; align-content: center; justify-content: flex-start; flex-wrap: wrap; margin-bottom: 0.7rem; } .case-ls { display: block; width: 30.75%; margin-right: 3.875%; margin-bottom: 1.2rem; } .case-ls:nth-child(3n) { margin-right: 0; } .case-ls .pic { width: 100%; height: 7.1rem; overflow: hidden; } .case-ls .pic img { width: 100%; height: 100%; object-fit: cover; transition: all .3s; } .case-ls .cont { width: 100%; height: 4.15rem; background-color: #EFF4F7; padding: 1.1rem 0.8rem .5rem; position: relative; transition: all .3s; } .case-ls .cont::after { content: ''; position: absolute; bottom: 100%; left: 0; width: 100%; height: 1.25rem; background: url(../img/71.png) no-repeat center; opacity: 0; transition: all .3s; } .case-ls .cont .tit { color: #333333; line-height: 1; font-weight: bold; margin-bottom: 7px; transition: all .3s; } .case-ls .cont .intro { display: flex; align-items: flex-start; justify-content: space-between; } .case-ls .cont .intro .art { width: 75%; color: #666666; line-height: .6rem; max-height: 1.2rem; overflow: hidden; padding-top: 6px; transition: all .3s; } .case-ls .cont .intro .btn { display: flex; align-items: center; justify-content: center; width: 1.2rem; height: 1.2rem; line-height: 1.2rem; text-align: center; border: 1px solid rgba(153, 153, 153, .25); border-radius: 50%; transition: all .3s; } .case-ls .cont .intro .btn svg { width: 13px; fill: #999999; transition: all .3s; } .case-ls:hover .pic img { transform: scale(1.1); } .case-ls:hover .cont { background-color: #0093D9; } .case-ls:hover .cont::after { opacity: 1; } .case-ls:hover .cont .tit { color: #FFFFFF; } .case-ls:hover .cont .intro .art { color: #FFFFFF; } .case-ls:hover .cont .intro .btn { background-color: #FFFFFF; } .case-ls:hover .cont .intro .btn svg { fill: #0093D9; } .case-btn { width: max-content; margin: 0 auto; cursor: pointer; } .case-btn div { display: flex; align-items: center; justify-content: center; width: 1.2rem; height: 1.2rem; line-height: 1.2rem; text-align: center; background: #0093D9; border-radius: 50%; transform: rotate(90deg); margin: 0 auto .4rem; } .case-btn div svg { width: 13px; fill: #FFFFFF; text-align: center; } .case-info { width: 100%; } .case-info-banner { width: 100%; height: 4.5rem; background-color: #EFF4F7; padding-top: 1.5rem; position: relative; } .case-info-tit { color: #333333; font-weight: bold; line-height: 1; text-align: center; margin-bottom: .5rem; font-size: 1.2rem; } .case-info-sub { color: #0093D9; font-weight: bold; line-height: 1; text-align: center; } .case-info-banner .back { position: absolute; width: 3.1rem; height: 1rem; background: #0093D9; border-radius: 0.5rem; right: 8.5%; top: 1.45rem; display: flex; align-items: center; justify-content: center; } .case-info-banner .back p { color: #FFFFFF; font-weight: bold; line-height: 1; margin-right: 9px; } .case-info-banner .back div { width: 8px; } .case-info-banner .back div img { width: 100%; object-fit: cover; } .changefont { padding: .75rem 8.5%; display: flex; align-items: center; justify-content: flex-end; margin-bottom: .4rem; } .changefont p { color: #333333; line-height: 1; font-weight: bold; margin-right: 13px; } .changefont span { display: inline-block; width: 0.75rem; height: 0.75rem; line-height: .75rem; text-align: center; background: #FFFFFF; border: 1px solid #D2D2D2; margin-right: 0.25rem; color: rgba(51, 51, 51, .5); cursor: pointer; } .changefont span:last-child { margin-right: 0; } .changefont span.cur { color: #0093D9; opacity: 1; } .case-info-cont { width: 56.6%; margin: 0 auto 1.75rem; color: #666666; } .case-info-cont * { font-size: inherit !important; } .info-page { border-top: 1px solid #DBDBDB; display: flex; align-items: stretch; justify-content: space-between; } .info-page-lf { width: 50%; border-right: 1px solid #DBDBDB; padding-bottom: 1.5rem; } .info-page-lf a { display: block; padding: 1.15rem 0 1rem; width: 70%; position: relative; } .info-page-lf a::after { content: ''; position: absolute; bottom: 0; left: 0; width: 88%; height: 1px; background-color: #DBDBDB; } .info-page-lf a:last-child::after { display: none; } .info-page-lf a p { color: #666666; margin-bottom: 0.25rem; line-height: 1; } .info-page-lf a span { color: #0093D9; font-weight: bold; line-height: 1.5; } .info-page-rg { width: 50%; padding: 1.25rem 1.8rem; } .info-page-rg p { color: #666666; font-weight: bold; margin-bottom: .75rem; } .info-page-rg a { display: block; color: #999999; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: bold; margin-bottom: 0.6rem; } .info-page-rg a:last-child { margin-bottom: 0; } .news {} .news-top { background-color: #EFF4F7; } .news-hot { padding: 0.9rem 0 1.35rem; } .news-search { display: flex; align-items: center; justify-content: space-between; height: 1.65rem; border: 1px solid rgba(0, 0, 0, .2); background-color: #FFFFFF; margin-bottom: .75rem; } .news-search input { width: calc(100% - 1.9rem); height: 100%; background: none; padding: 0 .8rem; color: #999999; } .news-search input::placeholder { color: #999999; } .news-search div { width: 1.4rem; line-height: 1.65rem; height: 100%; padding-right: .9rem; cursor: pointer; } .news-search div img { width: 100%; display: inline-block; object-fit: cover; } .news-container {} .news-container .swiper-slide { width: 32.5%; margin-right: 1.25%; } .news-container .swiper-slide:last-child { margin-right: 0; } .news-container .swiper-slide .img { width: 100%; height: 9rem; margin-bottom: .75rem; overflow: hidden; } .news-container .swiper-slide .img img { width: 100%; height: 100%; object-fit: cover; transition: all .3s; } .news-container .swiper-slide .intro {} .news-container .swiper-slide .intro .tit { color: #333333; font-weight: bold; line-height: 1; margin-bottom: .25rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all .3s; } .news-container .swiper-slide .intro .cont { color: #666666; line-height: 1; margin-bottom: .3rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .news-container .swiper-slide:hover .img img { transform: scale(1.1); } .news-container .swiper-slide:hover .intro .tit { color: #0093D9; } .nowp { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .news-container .swiper-slide .intro .time { color: #0093D9; line-height: 1; font-weight: bold; } .news-hot .news-container .swiper-pagination { position: relative; bottom: 0; line-height: 1; margin-top: 0.7rem; } .news-hot .news-container .swiper-pagination .swiper-pagination-bullet { width: 0.3rem; height: 0.3rem; border: 2px solid rgba(102, 102, 102, .5); border-radius: 50%; transition: all .3s; margin-right: .5rem; margin-left: 0; background: none; } .news-hot .news-container .swiper-pagination .swiper-pagination-bullet:last-child { margin-right: 0; } .news-hot .news-container .swiper-pagination .swiper-pagination-bullet-active { width: 1rem; height: 0.3rem; background: #0093D9; border-radius: 5px; border: none; } .news-btm { padding: 1.9rem 0 2.3rem; } .news-btm .wrap { margin-bottom: 1.15rem; } .news-btm .wrap .list { display: flex; align-items: stretch; justify-content: space-between; margin-bottom: 0.4rem; } .news-btm .wrap .list:last-child { margin-bottom: 0; } .news-btm .wrap .list .pic { width: 7.75rem; height: 5rem; margin-right: 1rem; overflow: hidden; } .news-btm .wrap .list .pic img { width: 100%; height: 100%; object-fit: cover; transition: all .3s; } .news-btm .wrap .list .intro { width: calc(100% - 8.75rem); border-bottom: 1px solid rgba(214, 214, 214, .8); padding-top: .5rem; } .news-btm .wrap .list .intro .tit { color: #333333; line-height: 1; font-weight: bold; margin-bottom: .4rem; transition: all .3s; } .news-btm .wrap .list .intro .time { color: #0093D9; font-weight: bold; line-height: 1; margin-bottom: 0.7rem; } .news-btm .wrap .list .intro .cont { color: #666666; line-height: .75rem; max-height: 1.5rem; overflow: hidden; } .news-btm .wrap .list:hover .pic img { transform: scale(1.1); } .news-btm .wrap .list:hover .intro .tit { color: #0093D9; } .pub-page { display: flex; justify-content: center; align-items: center; } .pub-page .pagination { display: flex; justify-content: center; align-items: center; } .pub-page a { width: 1rem; height: 1rem; line-height: 1rem; text-align: center; color: #666666; transition: all .3s; margin-right: 3px; } .pub-page a:last-child { margin-right: 0; } .pub-page a:hover, .pub-page .active { background-color: #0093D9; color: #FFFFFF; } .ser {} .ser-top { padding: 1.8rem 0 1.5rem; } .ser-container {} .ser-container .swiper-slide { width: 31.25%; margin-right: 3.125%; padding: 0.25rem; border: 1px solid #EAEAEA; transition: all .3s; } .ser-container .swiper-slide:last-child { margin-right: 0; } .ser-container .swiper-slide .pic { width: 100%; height: 7.75rem; overflow: hidden; } .ser-container .swiper-slide .pic img { width: 100%; height: 100%; object-fit: cover; transition: all .3s; } .ser-container .swiper-slide .intro { width: 100%; padding: .9rem .5rem; display: flex; align-items: center; justify-content: space-between; } .ser-container .swiper-slide .intro .tit { color: #333333; line-height: 1; transition: all .3s; max-width: 70%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .ser-container .swiper-slide .intro .icon { display: flex; align-items: center; justify-content: flex-end; } .ser-container .swiper-slide .intro .icon p { color: #0093D9; margin-right: 0.25rem; line-height: 1; transition: all .3s; } .ser-container .swiper-slide .intro .icon div { width: 13px; } .ser-container .swiper-slide .intro .icon div img { width: 100%; object-fit: cover; } .ser-container .swiper-slide:hover { box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2); border: 1px solid #0093D9; } .ser-container .swiper-slide:hover .pic img { transform: scale(1.1); } .ser-container .swiper-slide:hover .intro .tit { color: #0093D9; } .ser-top .ser-container .swiper-pagination { position: relative; line-height: 1; bottom: 0; margin-top: 1.8rem; } .ser-top .ser-container .swiper-pagination .swiper-pagination-bullet { width: 11px; height: 11px; margin-right: 11px; margin-left: 0; background: #0093D9; opacity: 1; } .ser-top .ser-container .swiper-pagination .swiper-pagination-bullet:last-child { margin-right: 0; } .ser-top .ser-container .swiper-pagination .swiper-pagination-bullet-active { background: #999999; } .ser-btn { background: #F7F7F7; } .ser-btn .wrap { padding: 2.15rem 0 2.1rem; } .sec-box { display: flex; align-items: center; justify-content: center; margin-bottom: .5rem; } .sec-box .list { width: 31.25%; height: 1.65rem; border: 1px solid rgba(51, 51, 51, .2); margin-right: 11px; position: relative; transition: all .3s; z-index: 10; } .sec-box .list::after { content: ''; position: absolute; top: 50%; right: .9rem; transform: translateY(-50%); border-top: 8px solid #333333; border-left: 7.5px solid transparent; border-right: 7.5px solid transparent; transition: all .3s; } .sec-box .list:last-child { margin-right: 0; } .sec-box .list p { width: 100%; height: 100%; line-height: 1.65rem; padding-left: .8rem; transition: all .3s; cursor: pointer; } .sec-box .list .cont { position: absolute; top: 100%; left: -1px; width: calc(100% + 2px); max-height: calc(6rem + 6px); overflow-y: auto; background: #FFFFFF; border: 1px solid rgba(51, 51, 51, .2); display: none; } .sec-box .list .cont::-webkit-scrollbar { width: 2px; } .sec-box .list .cont span { display: block; width: 100%; line-height: 1rem; padding-left: .8rem; border-bottom: 1px solid rgba(51, 51, 51, .2); cursor: pointer; transition: all .3s; color: #666; } .sec-box .list .cont span:last-child { border-bottom: none; } .sec-box .list:hover { background-color: #0093D9; } .sec-box .list:hover::after { border-top: 8px solid #FFFFFF; } .sec-box .list:hover .tit { color: #FFFFFF; } .cont-box { /* background-color: #F7F7F7; */ } .cont-box .intro { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; margin-bottom: 1.1rem; } .cont-box .intro .li { width: 24.375%; margin-right: .83%; margin-bottom: .4rem; height: 2.5rem; background-color: #FFFFFF; border: 1px solid #EAEAEA; padding: 0.65rem 0.6rem 0; display: flex; align-items: flex-start; justify-content: flex-start; transition: all .3s; } .cont-box .intro .li:nth-child(4n) { margin-right: 0; } .cont-box .intro .li .pic { width: .4rem; margin-right: 0.35rem; } .cont-box .intro .li .pic img { width: 100%; object-fit: cover; } .cont-box .intro .li .cont { width: calc(100% - .8rem); } .cont-box .intro .li .cont .tit { line-height: 1; margin-bottom: 0.45rem; color: #333333; transition: all .3s; } .cont-box .intro .li .cont .icon { display: flex; align-items: center; justify-content: flex-start; line-height: 1; } .cont-box .intro .li .cont .icon p { color: #999999; line-height: 1; margin-right: 9px; font-weight: bold; transition: all .3s; } .cont-box .intro .li .cont .icon div { color: #999999; transition: all .3s; } .cont-box .intro .li:hover { border: 1px solid #0093D9; } .cont-box .intro .li:hover .tit, .cont-box .intro .li:hover .icon p, .cont-box .intro .li:hover .icon div { color: #0093D9; } .video {} .video .ser-top { position: relative; padding: 2.2rem 8.5% 1.5rem; } .video .ser-top .swiper-button-prev, .video .ser-top .swiper-button-next { width: 1rem; height: 1rem; border: 1px solid #D2D2D2; border-radius: 50%; color: #CCCCCC; } .video .ser-top .swiper-button-prev { left: 8.5%; } .video .ser-top .swiper-button-next { right: 8.5%; } .video .ser-top .swiper-button-prev::after, .video .ser-top .swiper-button-next::after { font-size: .4rem; } .video-container { width: 93.25%; margin: 0 auto; } .video-container .swiper-slide { width: 32%; margin-right: 2%; } .video-container .swiper-slide:last-child { margin-right: 0; } .video-container .swiper-slide .pic { width: 100%; height: 8.4rem; margin-bottom: .5rem; position: relative; overflow: hidden; } .video-container .swiper-slide .pic img { width: 100%; height: 100%; object-fit: cover; transition: all .3s; } .video-container .swiper-slide .pic .play { width: 1.45rem; cursor: pointer; } .video-container .swiper-slide .pic .play img { width: 100%; object-fit: cover; } .video-container .swiper-slide .intro { display: flex; align-items: center; justify-content: flex-start; } .video-container .swiper-slide .intro .icon { width: 0.55rem; margin-right: 0.25rem; } .video-container .swiper-slide .intro .icon img { width: 100%; object-fit: cover; } .video-container .swiper-slide .intro .tit { color: #333333; font-weight: bold; line-height: 1; transition: all .3s; } .video-container .swiper-slide:hover .pic>img { transform: scale(1.1); } .video-container .swiper-slide:hover .intro .tit { color: #0093D9; } .ser-top .video-container .swiper-pagination { position: relative; line-height: 1; bottom: 0; margin-top: 1.5rem; } .ser-top .video-container .swiper-pagination .swiper-pagination-bullet { width: 11px; height: 11px; margin-right: 11px; margin-left: 0; background: #0093D9; opacity: 1; } .ser-top .video-container .swiper-pagination .swiper-pagination-bullet:last-child { margin-right: 0; } .video-btm .wrap { padding: 2.15rem 0 2.7rem; } .video-btm .wrap .sec-box { margin-bottom: 0.85rem; } .cont-box-video .intro { margin-bottom: .5rem; display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; } .cont-box-video .intro .li { width: 23.5%; margin-right: 2%; margin-bottom: .9rem; } .cont-box-video .intro .li:nth-child(4n) { margin-right: 0; } .cont-box-video .intro .li .pic { position: relative; width: 100%; height: 6.5rem; overflow: hidden; } .cont-box-video .intro .li .pic .play { cursor: pointer; width: 1.45rem; } .cont-box-video .intro .li .pic img { width: 100%; height: 100%; object-fit: cover; transition: all .3s; } .cont-box-video .intro .li p { color: #333333; height: 1.7rem; line-height: 1.7rem; text-align: center; background-color: #FFFFFF; transition: all .3s; } .cont-box-video .intro .li:hover .pic img { transform: scale(1.1); } .cont-box-video .intro .li:hover p { color: #0093D9; } .center {} .center-box {} .cent-top { padding: 2rem 0 0; } .cent-top .tit { color: #333333; line-height: 1; margin-bottom: .6rem; } .cent-top .intro { line-height: 1.5; margin-bottom: 1.7rem; } .cent-top .cont { /* color: #666666; font-weight: 500; line-height: 2; width: 66.875%; margin: 0 auto 1.5rem; */ width: 100%; } .cent-top .cont .wrap { overflow: hidden; } .cent-top .cont .wrap .lf { float: left; width: 50%; height: 13rem; } .cent-top .cont .wrap .lf .swiper-container { height: 100%; } .cent-top .cont .wrap .lf img { width: 100%; height: 100%; object-fit: cover; } .cent-top .cont .wrap .rg { float: right; width: 50%; height: 13rem; background: linear-gradient(180deg, #83C16E, #0093D9); color: #fff; padding: 2rem 11.5% 0 1.6rem; } .cent-top .cont .wrap .rg .h1 { font-size: .75rem; line-height: 1; margin-bottom: .5rem; } .cent-top .cont .wrap .rg .h2 { line-height: 2; margin-bottom: 1rem; max-height: 80%; overflow-y: auto; padding-right: 5px; } .cent-top .cont .wrap .rg .h2::-webkit-scrollbar { width: 3px; } .cent-top .cont .wrap .rg .h2::-webkit-scrollbar-thumb { background: #0093D9; } .cent-top .cont .wrap .rg .li { line-height: 1.5; margin-bottom: .25rem; } .cent-top .cont .wrap:nth-child(2n) .lf { float: right; } .cent-top .cont .wrap:nth-child(2n) .rg { float: left; padding: 2rem 1.6rem 0 11.5%; } /* .swiper-box2 { position: relative; width: 100%; } .center .swiper-box2 .swiper-button-prev, .center .swiper-box2 .swiper-button-next { width: 1rem; height: 1rem; border: 1px solid #D2D2D2; border-radius: 50%; color: #CCCCCC; } .video .ser-top .swiper-button-prev { left: 8.5%; } .video .ser-top .swiper-button-next { right: 8.5%; } .center .swiper-box2 .swiper-button-prev::after, .center .swiper-box2 .swiper-button-next::after { font-size: .4rem; } .cent-container { width: 93.25%; margin: 0 auto; } .cent-container .swiper-slide { width: 55%; transition: all .3s; } .cent-container .swiper-slide div { width: 100%; height: 14rem; } .cent-container .swiper-slide div img { width: 100%; height: 100%; object-fit: cover; } .cent-container .swiper-slide p { height: 1.75rem; line-height: 1.75rem; text-align: center; color: #999999; } .cent-container .swiper-slide-active p { background-color: #0093D9; color: #FFFFFF; } */ .pub-form { background-color: #F7F7F7; } .pub-form .wrap { padding: 1.5rem 0 2.8rem; } .pub-form .wrap .tit { color: #333333; font-weight: bold; line-height: 1; margin-bottom: 1rem; } .form-box { display: flex; align-items: flex-start; justify-content: space-between; } .form-box .lf { width: 43.75%; padding-right: .75rem; } .form-box .lf .li { width: 100%; height: 1.1rem; border: 1px solid #D6D6D6; background-color: #FFFFFF; margin-bottom: 8px; position: relative; padding: 0 .75rem; } .form-box .lf .li::after { content: '*'; position: absolute; color: #FF0033; top: 50%; right: 0.95rem; transform: translateY(-50%); } .form-box .lf .li input { background: none; height: 100%; color: #999999; } .form-box .lf .no-li::after { display: none; } .form-box .lf .select { width: 100%; height: 1.1rem; border: 1px solid #D6D6D6; position: relative; background-color: #F9F9F9; position: relative; padding: 0 .75rem; } .form-box .lf .select::after { content: ''; position: absolute; top: 50%; right: 0.55rem; transform: translateY(-50%); border-top: 6px solid #333; border-left: 5.5px solid transparent; border-right: 5.5px solid transparent; } .form-box .lf .select input { width: 100%; height: 100%; background: none; cursor: pointer; color: #0093D9; } .form-box .lf .select input::placeholder { color: #0093D9; } .form-box .lf .select .change { position: absolute; top: calc(100% + 1px); left: -1px; width: calc(100% + 2px); max-height: calc(3rem + 3px); overflow-y: auto; background-color: #FFFFFF; border-left: 1px solid #EAEAEA; border-right: 1px solid #EAEAEA; display: none; } .form-box .lf .select .change::-webkit-scrollbar { width: 2px; } .form-box .lf .select .change span { display: block; line-height: 1rem; padding: 0 .75rem; color: #999; border-bottom: 1px solid #EAEAEA; cursor: pointer; } .form-box .rg { width: 56.25%; } .form-box .rg textarea { width: 100%; height: 6.4rem; resize: none; border: 1px solid #D6D6D6; padding: 0.35rem .75rem; color: #999999; margin-bottom: 0.7rem; } .form-box .rg .code { display: flex; align-items: center; justify-content: flex-start; margin-bottom: 1rem; } .form-box .rg .code input { width: 37%; height: 1.1rem; border: 1px solid #D6D6D6; margin-right: 0.3rem; padding: 0 .75rem; } .form-box .rg .code div { width: 2.85rem; height: 1.1rem; line-height: 1.1rem; text-align: center; background: #333333; color: #FFFFFF; } .form-box .rg .sub { display: flex; align-items: center; justify-content: flex-start; } .form-box .rg .sub input { width: 4.9rem; height: 1.2rem; background: #0093D9; border-radius: 4px; color: #FFFFFF; font-weight: bold; margin-left: .75rem; } .form-box .rg .sub div { width: 4.9rem; height: 1.2rem; line-height: 1.2rem; text-align: center; background: #666666; border-radius: 4px; color: #FFFFFF; font-weight: bold; cursor: pointer; } .tech { padding: 2rem 0 0; } .tech .tit { color: #333333; line-height: 1; margin-bottom: 0.85rem; } .tech-container { margin-bottom: 1.15rem; } .tech-container .tech-pagination { display: none; position: relative; line-height: 1; margin-top: 1rem; } .tech-container .tech-pagination .swiper-pagination-bullet-active { background: #0093D9; } .tech-container .swiper-slide { width: 19.375%; height: 5.5rem; margin-right: .625%; border: 1px solid #EAEAEA; padding-top: 1.05rem; transition: all .3s; cursor: pointer; } .tech-container .swiper-slide:last-child { margin-right: 0; } .tech-container .swiper-slide div { width: 1.75rem; height: 1.75rem; line-height: 1.75rem; text-align: center; background: #0093D9; border-radius: 50%; margin: 0 auto .6rem; position: relative; transition: all .3s; } .tech-container .swiper-slide div img { display: inline-block; transition: all .3s; } .tech-container .swiper-slide p { color: #333333; line-height: 1; font-weight: 500; transition: all .3s; } .tech-container .swiper-slide:hover, .tech-container .swiper-slide.cur { background-color: #0093D9; box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2); } .tech-container .swiper-slide:hover div, .tech-container .swiper-slide.cur div { background-color: #FFFFFF; } .tech-container .swiper-slide:hover div .normal-block, .tech-container .swiper-slide.cur div .normal-block { opacity: 0; } .tech-container .swiper-slide:hover div .hover-block, .tech-container .swiper-slide.cur div .hover-block { opacity: 1; } .tech-container .swiper-slide:hover p, .tech-container .swiper-slide.cur p { color: #FFFFFF; } .tech .cont { height: 17rem; padding: 3.15rem 5% 0; color: #FFFFFF; line-height: 2; } .sale {} .sale-box { padding: 2rem 0; } .sale-box .li { padding: 0 8.5%; margin-bottom: 1.3rem; } .sale-box .li:nth-child(2n) { background-color: #F7F7F7; padding: 1.45rem 8.5% 2.45rem; } .sale-box .li:last-child { margin-bottom: 0; } .sale-box .li .tit { color: #333333; line-height: 1; margin-bottom: .9rem; } .sale-box .li .wrap { display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap; } .sale-box .li .wrap .list { width: 32%; margin-right: 2%; } .sale-box .li .wrap .list:nth-child(3n) { margin-right: 0; } .sale-box .li .wrap .list .city { color: #0093D9; line-height: 1; margin-bottom: 0.45rem; padding-top: .4rem; border-top: 2px solid rgba(51, 51, 51, .1); position: relative; } .sale-box .li .wrap .list .city::after { content: ''; position: absolute; top: -2px; left: 0; width: 3rem; height: 2px; background-color: #0093D9; } .sale-box .li .wrap .list:first-child .city::after { width: 2rem; } .sale-box .li .wrap .list .box { width: 100%; height: 4.5rem; border: 1px solid #EAEAEA; padding: 0.8rem; } .sale-box .li .wrap .list .box .phone { display: flex; align-items: center; justify-content: flex-start; margin-bottom: .5rem; } .sale-box .li .wrap .list .box .phone:last-child { margin-bottom: 0; } .sale-box .li .wrap .list .box .phone>p { color: #333333; line-height: 1; } .sale-box .li .wrap .list .box .phone .icon { display: flex; align-items: center; justify-content: flex-start; margin-right: 0.35rem; } .sale-box .li .wrap .list .box .phone .icon div { width: 0.4rem; margin-right: 8px; } .sale-box .li .wrap .list .box .phone .icon div img { width: 100%; object-fit: cover; } .sale-box .li .wrap .list .box .phone .icon p { color: #666666; line-height: 1; } .about { padding: 2.5rem 0 3.35rem; position: relative; } .about-box { display: flex; align-items: flex-start; justify-content: space-between; } .about-box .lf { width: 25%; } .about-box .lf .h1 { color: #333333; font-size: 1.2rem; font-weight: bold; line-height: 1; margin-bottom: .6rem; } .about-box .lf .h2 { color: #0093D9; font-weight: bold; line-height: 1; margin-bottom: 1.15rem; } .about-box .lf .h3 { font-size: 1.8rem; font-weight: 400; color: #EFF4F7; line-height: .8; text-transform: uppercase; -webkit-text-stroke: 1px rgba(0, 147, 217, .5); text-stroke: 1px rgba(0, 147, 217, .5); margin-bottom: 2.1rem; } .about-box .lf .li { display: flex; align-items: flex-start; justify-content: space-between; padding-top: .75rem; border-top: 1px solid rgba(153, 153, 153, .5); margin-bottom: 2.75rem; } .about-box .lf .li .tit { color: #999999; line-height: 1; } .about-box .lf .li .cont { display: flex; align-items: flex-end; justify-content: flex-end; } .about-box .lf .li .cont p { color: #0093D9; line-height: .8; font-size: 3rem; margin-right: 6px; font-style: italic; } .about-box .lf .li .cont span { color: #0093D9; line-height: 1; } .about-box .lf .font-li .cont p { font-size: 1.8rem; } .about-icon { left: 0; top: 13rem; width: 8.05rem; } .about-icon2 { right: 0; top: 5.25rem; width: 9.65rem; } .about-box .rg { padding-top: 3rem; width: 75%; padding-left: 2.5rem; } .about-box .rg img { display: inline-block; } .about-box .rg .font { color: #333333; line-height: 2; width: 80%; } .about-box .rg .pic { width: 80%; display: flex; align-items: center; justify-content: flex-start; } .about-box .rg .pic img { margin-right: 10px; } .about-box .rg .pic img:last-child { margin-right: 0; margin-bottom: 0; } .res { padding: 2.75rem 0 2.5rem; } .res-box {} .res-tit { color: #333333; font-size: 0.9rem; line-height: 1; margin-bottom: 0.375rem; } .res-box .box {} .res-box .box .point { width: 0.25rem; margin: 0 auto 0.25rem; } .res-box .box .point img { width: 100%; object-fit: cover; } .res-box .box .point2 { width: 0.25rem; margin: 0 auto 0.25rem; } .res-box .box .point3 { width: 0.25rem; margin: 0 auto .4rem; } .res-box .box .point4 { width: 0.25rem; margin: 0 auto; } .res-box .box .more { width: max-content; text-align: center; margin: 0 auto 1.4rem; cursor: pointer; } .res-box .box .more div { width: 1.4rem; margin: 0 auto .4rem; } .res-box .box .more p { color: #666666; line-height: 1; font-weight: bold; } .res-box .box .h1 { color: #0093D9; font-size: .75rem; line-height: 1; font-weight: bold; margin-bottom: 1.15rem; } .res-box .box .h2 { font-size: 1.8rem; font-weight: 400; color: #EFF4F7; line-height: .8; text-transform: uppercase; -webkit-text-stroke: 1px rgba(0, 147, 217, .5); text-stroke: 1px rgba(0, 147, 217, .5); } .res-box .box .ajax { overflow: hidden; position: relative; } .res-box .box .ajax::after { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 0.25rem; height: 100%; background-color: #D6D6D6; z-index: -1; } .res-box .box .ajax::before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 1.25rem; height: 100%; background: url(../img/115.png) repeat center; } .res-box .box .ajax .li { float: left; width: 50%; min-height: 7.5rem; padding-bottom: 2rem; } .res-box .box .ajax .li .top { border-top: 1px solid rgba(51, 51, 51, .2); padding-top: 0.45rem; display: flex; align-items: flex-end; justify-content: flex-start; position: relative; margin-bottom: .6rem; position: relative; z-index: 2; } .res-box .box .ajax .li .top::after { content: ''; position: absolute; top: -1px; left: 0; width: 2.5rem; height: 1px; background-color: #0093D9; transition: all .3s; } .res-box .box .ajax .li .top::before { content: ''; position: absolute; top: -0.225rem; right: -0.225rem; width: 0.45rem; height: 0.45rem; background: url(../img/120.png) no-repeat center; background-size: 100% 100%; transition: all .3s; } .res-box .box .ajax .li .top p { color: #0093D9; line-height: 1; margin-right: 0.25rem; font-size: 0.9rem; font-weight: bold; } .res-box .box .ajax .li .top span { color: #0093D9; line-height: 1; } .res-box .box .ajax .li .list { border: 1px solid rgba(0, 0, 0, 0.1); padding: .4rem .3rem; width: 85%; display: flex; align-items: stretch; justify-content: flex-start; margin-bottom: .3rem; } .res-box .box .ajax .li .list:last-child { margin-bottom: 0; } .res-box .box .ajax .li .list .lf { width: 60%; margin-right: .4rem; display: flex; align-items: flex-start; justify-content: flex-start; } .res-box .box .ajax .li .list .lf img { width: 33.3%; display: inline-block; flex: 1; } .res-box .box .ajax .li .list .rg { padding-top: 0.25rem; color: #666666; font-weight: bold; line-height: 1.8; width: 40%; } .res-box .box .ajax .li:first-child { padding-top: .75rem; } .res-box .box .ajax .li:nth-child(2) { padding-top: 6.25rem; } .res-box .box .ajax .li:nth-child(2n) { float: right; min-height: 8.75rem; } .res-box .box .ajax .li:nth-child(2n) .top { justify-content: flex-end; } .res-box .box .ajax .li:nth-child(2n) .top::after { right: 0; left: auto; } .res-box .box .ajax .li:nth-child(2n) .top::before { left: -0.225rem; right: auto; } .res-box .box .ajax .li:nth-child(2n) .list { margin-left: 15%; } .res-box .box .ajax .li:hover .top::after { width: 99%; } .res-box .box .ajax .li:hover .top::before { transform: scale(1.1); } .res { padding: 2.75rem 0 4.25rem; } .res-box {} .res-box .tit { color: #333333; font-size: .9rem; line-height: 1; margin-bottom: .5rem; } .res-box .sub { color: #666666; line-height: 1; margin-bottom: 1.25rem; } .res-box .pic { position: relative; } .res-box .pic img { width: 62.5%; object-fit: cover; } .res-box .pic .pos { position: absolute; bottom: .9rem; right: 0; width: 50%; height: 11.25rem; background-color: #0093D9; padding: 2.1rem; } .res-box .pic .pos .tit { color: #FFFFFF; line-height: 1; margin-bottom: .6rem; } .res-box .pic .pos .cont { color: #FFFFFF; line-height: 1.8; } .office { width: 100%; position: relative; } .office img { width: 100%; } .office .map { position: absolute; width: .5rem; } .map-point1 { top: 30.1%; left: 60.4%; } .map-point2 { top: 34%; left: 61.7%; } .map-point3 { top: 41.7%; left: 59.6%; } .map-point4 { top: 41.67%; left: 63.75%; } .map-point5 { top: 43.21%; left: 58.39%; } .map-point6 { top: 44.74%; left: 62.19%; } .map-point7 { top: 45.77%; left: 57.5%; } .map-point8 { top: 48.97%; left: 59.95%; } .map-point9 { top: 51.67%; left: 61.3%; } .map-point10 { top: 52.82%; left: 63.39%; } .map-point11 { top: 53.59%; left: 60.1%; } .map-point12 { top: 54.23%; left: 60.94%; } .map-point13 { top: 73.72%; left: 53.65%; } .map-point14 { top: 84.1%; left: 59.53%; } .office-box { padding: 1.25rem 0 3.7rem; } .office-box .box {} .office-box .tit { color: #0093D9; border-top: 1px solid #CCCCCC; padding-top: .6rem; line-height: 1; font-weight: bold; position: relative; margin-bottom: 0.85rem; } .office-box .tit::after { content: ''; position: absolute; top: -1px; left: 0; width: 5rem; height: 1px; background-color: #0093D9; } .office-box .wrap { display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap; } .office-box .wrap .li { width: 30%; margin-bottom: 1.15rem; margin-right: 5%; border: 1px solid #EAEAEA; padding: .75rem; transition: all .3s; } .office-box .wrap .li:nth-child(3n) { margin-right: 0; } .office-box .wrap .li .h1 { color: #666666; line-height: 1.6; font-weight: bold; margin-bottom: 0.3rem; transition: all .3s; } .office-box .wrap .li .cont { color: #999999; font-weight: bold; line-height: 1.7; } .office-box .wrap .li:hover { border-color: #0093D9; } .office-box .wrap .li:hover .h1 { color: #0093D9; } .client { padding: 2.5rem 0 3.2rem; } .client-box { display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; } .client-box div { display: flex; align-items: center; justify-content: center; width: 16.6%; height: 3.1rem; background: #FFFFFF; border: 1px solid #CBD9E1; overflow: hidden; } .client-box div img { max-width: 90%; max-height: 90%; object-fit: cover; transition: all .3s; } .client-box div:hover img { transform: scale(1.1); } .speech { padding: 2.35rem 0 2.5rem; position: relative; } .speech .bg-box { position: absolute; left: 0; bottom: 0; width: 100%; height: 12.9rem; background-color: #EFF4F7; z-index: -1; } .speech-box { display: flex; align-items: flex-start; justify-content: space-between; } .speech-box .lf { width: 35%; padding-right: 2.5rem; } .speech-box .lf img { width: 100%; object-fit: cover; } .speech-box .rg { width: 65%; } .speech-box .rg .tit { color: #333333; line-height: 1; font-size: .9rem; margin-bottom: .5rem; } .speech-box .rg .sub { font-size: 1.8rem; font-weight: 400; color: #EFF4F7; line-height: .8; text-transform: uppercase; -webkit-text-stroke: 1px rgba(0, 147, 217, .5); text-stroke: 1px rgba(0, 147, 217, .5); margin-bottom: 0.9rem; } .speech-box .rg .wrap { text-align: right; margin-bottom: 2.2rem; } .speech-box .rg .wrap .h1 { color: #333333; font-size: .75rem; line-height: 1; margin-bottom: .5rem; position: relative; } .speech-box .rg .wrap .h1::after { content: ''; position: absolute; bottom: 0; right: 20%; width: 8.15rem; height: 1px; background-color: #666666; opacity: .1; } .speech-box .rg .wrap .h2 { line-height: 1; color: #666666; } .speech-box .rg .cont { color: #666666; line-height: 2; } .join {} .join-box { overflow: hidden; } .join-box .lf { width: 50%; float: right; overflow: hidden; } .join-box .lf img { width: 100%; object-fit: cover; transition: all .3s; } .join-box .rg { width: 50%; float: left; padding: 1.95rem 4rem; } .join-box .rg>p { color: #333333; line-height: 1; font-size: .9rem; margin-bottom: 1rem; transition: all .3s; } .join-box .rg div { color: #666666; line-height: 1.7; } .join-box:nth-child(2n) .lf { float: left; } .join-box:hover .lf img { transform: scale(1.1); } .join-box:hover .rg>p { color: #0093D9; } .state { background-color: #EFF4F7; padding: 2rem 0 6.25rem; } .state-tit { color: #333333; font-size: 0.9rem; line-height: 1; margin-bottom: 1rem; font-weight: bold; } .state-cont { color: #666666; line-height: 1.7; } .talent { padding-top: 1.25rem; padding-bottom: 4.9rem; } .talents-tops { padding-bottom: .55rem; border-bottom: 1px solid #cccfd5; position: relative; z-index: 2; } .talents-tops .talentstop-left { line-height: 2; color: #010d2c; } .talents-tops .talentstop-left span { color: #0093D9; font-family: Arial; font-weight: bold; } .talents-tops .talentstop-right { padding-top: .375rem; } .selectslist { font-size: 0; } .selectslist .selects { display: inline-block; vertical-align: top; position: relative; z-index: 1; } .selectslist .selects.on { z-index: 3; } .selectslist .selects:nth-child(n+2) { margin-left: .3rem; } .selectslist .selects-bots { position: absolute; top: 1.2rem; left: 0; width: 100%; line-height: 2; background: #f2f3f4; max-height: 4rem; overflow-y: auto; } .selectslist .selects-bots::-webkit-scrollbar { width: 2px; } .selectslist .selects-bots .i { padding: .1rem 0 .1rem .7rem; cursor: pointer; /* height: 1rem; */ /* line-height: 1rem; */ } .selectslist .selects-tops { height: 1.2rem; line-height: 1.2rem; border: 1px solid #dcdcdc; background: #f2f3f4; padding-left: .7rem; padding-right: 1rem; position: relative; width: 7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; color: #0093D9; } .selectslist .selects-tops:before { position: absolute; content: ""; width: 11px; height: 6px; top: 0; bottom: 0; right: .55rem; margin: auto; background: url(../img/i37.png) no-repeat center; background-size: 100%; } .selectslist .selects-bots { display: none; } .talentsbots-tops .li-tops, .talentsbots-tops { font-size: 0; } .applys { height: 1.1rem; line-height: 1.1rem; background: #0093D9; padding-left: .8rem; padding-right: 1.625rem; color: #fff; cursor: pointer; position: relative; display: block; } .applys:before { position: absolute; content: ""; width: .4rem; height: .4rem; right: .75rem; top: 0; bottom: 0; background: url(../img/i38.png) no-repeat center; background-size: 100%; margin: auto; } .talentsbots-bots { margin-bottom: 1rem; } .talents-bots { /*display: none;*/ padding-top: .75rem; } .talents-bots .pages { margin-top: 1.1rem; } .talents-bots .backs { cursor: pointer; color: #0093D9; line-height: 1; padding-top: .5rem; } .talents-bots .td { display: inline-block; vertical-align: top; padding-left: .9rem; padding-right: .5rem; overflow: hidden; } /* .talents-bots .td.td1 { width: 27.8%; } .talents-bots .td.td2 { width: 47%; } .talents-bots .td.td3 { width: 25.2%; } */ .talentsbots-bots .li-tops { border: 1px solid #e5e5e5; font-size: 0; transition: .5s ease-in-out; } .talentsbots-bots .li-tops .td { line-height: 1.8rem; height: 1.8rem; color: #333333; transition: .5s ease-in-out; width: 33.3%; } .talentsbots-bots .li:nth-child(n+2) { margin-top: .25rem; } .talentsbots-bots .li.active .li-tops { color: #fff; background: #0093D9; transition: .5s ease-in-out; } .talentsbots-bots .li.active .li-tops .td { color: #fff; transition: .5s ease-in-out; } .talentsbots-bots .words-bots { padding-top: .75rem; } .talentsbots-bots .words-bots .i { display: inline-block; vertical-align: top; width: 50%; position: relative; padding-right: 1%; } .talentsbots-bots .words-bots .i:nth-child(2) { padding-left: 1.25rem; } .talentsbots-bots .words-bots .i:nth-child(2):before { position: absolute; content: ""; width: 1px; height: 90%; left: 0; top: 2px; background: #d1d1d1; } .talentsbots-bots .words-bots .itemsbox { font-size: 0; display: flex; align-items: stretch; flex-wrap: wrap; margin-bottom: .95rem; } .talentsbots-bots .words-bots .tits { line-height: 1; color: #010d2c; } .talentsbots-bots .words-bots .txts { line-height: 2.14; color: #666666; margin-top: .3rem; } .talentsbots-bots .word-list { font-size: 0; padding-top: .75rem; padding-bottom: .55rem; border-bottom: 1px solid #e4e4e4; } .talentsbots-bots .word-list .i { display: inline-block; vertical-align: top; width: 20%; color: #999999; text-align: center; line-height: 2.14; position: relative; } .talentsbots-bots .word-list .i:before { position: absolute; content: ""; width: 1px; height: 100%; background-color: #d1d1d1; left: 0; top: 0; } .talentsbots-bots .word-list .i:nth-child(1):before { display: none; } .talentsbots-bots .word-list .i span { color: #333333; } .talentsbots-bots .li-bots { background: #f8f8f8; padding: 1.25rem; padding-top: 0; display: none; } .talentsbots-tops { margin-bottom: .3rem; } .talentsbots-tops .td { line-height: 1.75rem; height: 1.75rem; background: #f2f3f4; border-top: 1px solid #d9dce0; border-bottom: 1px solid #d9dce0; border-left: 1px solid #d9dce0; color: #333333; font-weight: bold; width: 33.3%; } .talentsbots-tops .td:last-child { border-right: 1px solid #d9dce0; } .i-next-page { position: absolute; bottom: 1rem; left: 50%; transform: translateX(-50%); width: 1.9rem; height: 1.9rem; background: rgba(255, 255, 255, .25); border-radius: 50%; display: flex; align-items: center; justify-content: center; z-index: 10; animation: toBtn 2s 0.2s linear infinite; } /* 鏁堟灉 */ .index-container .swiper-slide .i-tit div { transform: translateY(20px); transition: all .3s; opacity: 0; } .index-container .ani-slide .i-tit div { transform: translateY(0); opacity: 1; } .index-container .swiper-slide .i-tit>span { transform: translateY(20px); transition: all .3s .2s; opacity: 0; } .index-container .ani-slide .i-tit>span { transform: translateY(0); opacity: 1; } .index-container .swiper-slide .i-more { transform: translateY(20px); transition: all .3s .4s; opacity: 0; } .index-container .ani-slide .i-more { transform: translateY(0); opacity: 1; } /* 鏁堟灉 */