@font-face { font-family: jiangxi; src: url("../fonts/jiangxi.ttf"); } [v-cloak] { display: none; } body { /* background: pink; */ background: #F2F2F2; background: #FFFFFF; background: #f5f5f5; font-size: 16px; } .pointer { cursor: pointer; } .down-header { top: 0 !important; } .down-header #navbar { width: 100% !important; padding: 0 160px !important; } .down-header .search-opt { right: 15% !important; } .down-header .wechat-opt { right: 11% !important; } .down-header .phone-opt { right: 5.5% !important; } #header { width: 100%; position: fixed; top: 40px; z-index: 999; transition: all 0.3s ease-in-out; } #header #navbar { transition: all 0.3s ease-in-out; margin: auto; width: 83%; height: 100px; background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(10px); /* padding: 20px 60px; */ padding: 0 60px; display: flex; align-items: center; justify-content: center; } #header #navbar .navbar-min { width: 100%; height: 100%; display: flex; justify-content: space-between; align-items: center; } #header #navbar .navbar-min .navbar-logo { width: 206px; height: 60px; } #header #navbar .navbar-min .navbar-menu { display: flex; height: 100%; } #header #navbar .navbar-min .navbar-menu>ul, #header #navbar .navbar-min .navbar-menu li { padding: 0; margin: 0; list-style: none; } #header #navbar .navbar-min .navbar-menu>ul { position: relative; } #header #navbar .navbar-min .navbar-menu>ul>div { padding-left: 24px; padding-right: 24px; height: 100%; color: black; font-size: 18px; font-weight: 400; display: flex; align-items: center; cursor: pointer; transition: all 0.3s ease-in-out; } #header #navbar .navbar-min .navbar-menu>ul>li { display: none; position: absolute; background: transparent; top: 100%; left: -30%; padding: 25px 0 10px 0; width: 150%; } #header #navbar .navbar-min .navbar-menu>ul>li>div { border-radius: 4px; background: white; padding: 10px 0; } #header #navbar .navbar-min .navbar-menu>ul>li>div>div { padding: 14px 40px; text-align: center; font-size: 14px; font-weight: 400; color: #545454; cursor: pointer; } #header #navbar .navbar-min .navbar-menu>ul>li>div>div:hover, #header #navbar .navbar-min .navbar-menu>ul>li>div .sub-navbar-active { color: #0076c2; } #header #navbar .navbar-min .navbar-menu>ul>li::after { content: ""; border-bottom: 25px solid #fff; border-right: 20px solid transparent; border-left: 20px solid transparent; position: absolute; left: 42%; top: 8px; } #header #navbar .navbar-min .navbar-menu>ul:hover>div { background: #0076c2; color: #ffffff; } #header #navbar .navbar-min .navbar-menu>ul:hover>li { display: block; } #header #navbar .navbar-min .navbar-menu .navbar-active { background: #0076c2; color: #ffffff; } #header #navbar .navbar-opt { display: flex; height: 100%; } #header #navbar .navbar-opt .navbar-opt-item { display: flex; align-items: center; margin-left: 40px; height: 100%; } #header #navbar .navbar-opt .navbar-opt-item>img { width: 36px; height: 36px; cursor: pointer; } #header #navbar .navbar-opt .navbar-opt-search:hover .search-opt { display: block; } #header #navbar .navbar-opt .search-opt { position: absolute; padding-top: 28px; top: 100%; right: 12%; display: none; } #header #navbar .navbar-opt .search-opt>div { border-radius: 4px; background: white; padding: 15px 20px; display: flex; align-items: center; } #header #navbar .navbar-opt .search-opt>div>img { height: 20px; width: 20px; } #header #navbar .navbar-opt .search-opt>div .input { margin: 0 20px; border-left: 1px solid #e6e6e6; border-right: 1px solid #e6e6e6; } #header #navbar .navbar-opt .search-opt>div .input>input { outline-style: none; border: 0; /*清除自带的2px的边框*/ padding: 0 20px; /*清除自带的padding间距*/ height: 17px; width: 195px; } #header #navbar .navbar-opt .search-opt>div .input>input::-webkit-input-placeholder { font-size: 14px; font-weight: 400; letter-spacing: 0px; color: #b5b5b5; } #header #navbar .navbar-opt .search-opt>div .search-text { font-size: 16px; font-weight: 400; color: #6e6e6e; margin: 0; padding: 0; border: none; outline: none; background: transparent; } #header #navbar .navbar-opt .search-opt>div::after { content: ""; border-bottom: 25px solid #fff; border-right: 20px solid transparent; border-left: 20px solid transparent; position: absolute; left: 82%; top: 8px; } #header #navbar .navbar-opt .navbar-opt-wechat:hover .wechat-opt { display: block; } #header #navbar .navbar-opt .wechat-opt { position: absolute; padding-top: 28px; top: 100%; right: 7%; display: none; } #header #navbar .navbar-opt .wechat-opt>div { padding: 5px; background: white; } #header #navbar .navbar-opt .wechat-opt>div>img { height: 70px; width: 70px; } #header #navbar .navbar-opt .wechat-opt>div::after { content: ""; border-bottom: 25px solid #fff; border-right: 20px solid transparent; border-left: 20px solid transparent; position: absolute; left: 26%; top: 8px; } #header #navbar .navbar-opt .navbar-opt-phone:hover .phone-opt { display: block; } #header #navbar .navbar-opt .phone-opt { position: absolute; padding-top: 28px; top: 100%; right: 0; display: none; } #header #navbar .navbar-opt .phone-opt>div { background: white; border-radius: 4px; } #header #navbar .navbar-opt .phone-opt>div>div { padding: 12px 24px; font-size: 18px; font-weight: 400; line-height: 26.06px; color: #000000; text-align: center; } #header #navbar .navbar-opt .phone-opt>div::after { content: ""; border-bottom: 25px solid #fff; border-right: 20px solid transparent; border-left: 20px solid transparent; position: absolute; left: 45%; top: 8px; } #footer .footer-main { background: #555555; } #footer .footer-main .up { padding: 30px 0 40px 0; width: 73%; display: flex; justify-content: space-between; margin: auto; } #footer .footer-main .up>div:nth-child(1) { display: flex; padding-top: 10px; } #footer .footer-main .up>div:nth-child(1)>img { height: 53px; width: 53px; } #footer .footer-main .up>div:nth-child(1)>div { color: white; margin-left: 10px; text-align: left; } #footer .footer-main .up>div:nth-child(1)>div>div:nth-child(1) { font-size: 18px; } #footer .footer-main .up>div:nth-child(1)>div>div:nth-child(2) { font-size: 24px; } #footer .footer-main .up>div:nth-child(1)>div>div:nth-child(3)>img { height: 29px; width: 29px; /* background: white; */ object-fit: contain; } #footer .footer-main .up>div:nth-child(2) { padding: 0 108px; border-left: 1px solid #757575; border-right: 1px solid #757575; position: relative; } #footer .footer-main .up>div:nth-child(2)>img { height: 134px; width: 134px; } #footer .footer-main .up>div:nth-child(2)>div { color: #fff; margin-top: 5px; text-align: center; position: absolute; left: 34%; } #footer .footer-main .up>div:nth-child(3) { color: white; } #footer .footer-main .up>div:nth-child(3)>div:nth-child(1) { padding: 24px 10px 24px 0px; } #footer .footer-main .up>div:nth-child(3)>div:nth-child(1)>a { margin-left: 35px; font-size: 18px; color: white; cursor: pointer; } #footer .footer-main .up>div:nth-child(3)>div:nth-child(2) { text-align: center; display: flex; justify-content: space-around; align-items: center; } .outlink a { color: white; } #footer .down { justify-content: space-between; align-items: center; padding: 0 83px; height: 34px; background: #424242; display: flex; color: #8c8c8c; } #floatbtn { position: fixed; top: 40%; right: 60px; display: flex; flex-direction: column; align-items: center; border-radius: 10px; background: rgba(0, 0, 0, 0.2); backdrop-filter: blur(2px); padding: 10px; z-index: 999; } #floatbtn>img { height: 40px; width: 40px; } #floatbtn>div { margin-top: 10px; font-size: 18px; font-weight: 400; color: #ffffff; writing-mode: vertical-rl; letter-spacing: 10px; line-height: 0; } .swiper-frame { position: relative; overflow: hidden; height: 100vh; background-image: url(../img/home-bg.png); } .swiper-frame .swiper-slide { text-align: center; overflow: hidden; } .banner-video-btn { position: relative; cursor: pointer; width: 260px; height: 70px; border-radius: 10px; /* background: #ffffff; */ display: flex; justify-content: space-between; align-items: center; padding: 0 20px; position: absolute; left: 42.5%; /* bottom: 32%; */ bottom: 252px; z-index: 2; } .banner-video-btn>span { font-size: 18px; font-weight: 400; letter-spacing: 10px; line-height: 24.7px; color: rgba(255, 255, 255, 1); } .banner-video-btn>img { width: 90px; height: 90px; /* background: rgba(0, 118, 194, 1); */ /* border: 10px solid rgba(0, 118, 194, 0.3); */ /* border-radius: 50%; */ position: absolute; left: 32%; top: -10px; z-index: 2; } .banner-video { position: fixed; left: -1000px; top: 18%; z-index: 2; transition: left 0.3s ease-in-out; } .banner-video>video { border-radius: 20px; width: 640px; height: 360px; border: 20px solid rgba(0, 118, 194, 0.4); object-fit: cover; } .banner-out { left: 32% !important; transition: left 0.3s ease-in-out; } .banner-close { left: -1000px !important; transition: left 0.3s ease-in-out; } .swiper-banner { height: 100vh; width: 100%; } .swiper-banner .slide-inner { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-size: cover; background-position: center; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; color: #fff; } .swiper-banner .slide-inner .banner-title { color: #ffffff; padding-bottom: 5%; font-family: jiangxi; } .swiper-banner .slide-inner img { /* width: 1170px; */ height: 366px; object-fit: contain; } .swiper-banner .slide-inner .banner-title>div:nth-child(1) { font-size: 72px; font-weight: 400; letter-spacing: 10px; line-height: 94.25px; } .swiper-banner .slide-inner .banner-title>div:nth-child(2) { font-size: 36px; font-weight: 400; letter-spacing: 4px; line-height: 47.12px; margin-top: 12px; } .banner-industry { position: absolute; width: 100%; bottom: 0; left: 0; z-index: 2; display: flex; justify-content: center; background: linear-gradient(0deg, rgba(0, 0, 0, 0.3) 0%, rgba(255, 255, 255, 0) 100%); backdrop-filter: blur(1px); } .banner-industry>div { width: 152px; height: 181px; background: linear-gradient(0deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%); backdrop-filter: blur(6px); display: flex; flex-direction: column; justify-content: center; align-items: center; margin-left: 98px; } .banner-industry>div>img { width: 60px; height: 60px; } .banner-industry>div>span { font-size: 18px; font-weight: 400; line-height: 24.7px; color: #ffffff; text-align: center; margin-top: 14px; } .banner-industry>div:nth-child(1) { margin-left: 0; } .banner-industry>div:hover { background: #0076c2; backdrop-filter: blur(6px); } .column-layout { padding: 182px 260px 0 260px; text-align: left; } .column-title { display: flex; align-items: center; justify-content: space-between; /* padding-left: 40px; */ } .column-title>div:nth-child(1) { position: relative; } .column-title>div:nth-child(1)>div:nth-child(1) { font-size: 30px; font-weight: 500; line-height: 42px; color: #0076c2; } .column-title>div:nth-child(1)>div:nth-child(2) { font-size: 20px; font-weight: 400; line-height: 28px; color: #c9c9c9; } /* .column-title>div:nth-child(1)::after { content: ""; width: 20px; height: 5px; background: #0096e0; position: absolute; top: 20px; left: -40px; } */ .column-title .column-title-more { font-size: 18px; font-weight: 400; color: #808080; text-decoration: none; } .column-title .column-title-more>img { height: 20px; width: 20px; transform: rotate(180deg); } .column-title-nav { display: flex; justify-content: space-between; width: 755px; padding-bottom: 18px; border-bottom: 1px solid #cccccc; position: relative; } .column-title .column-title-nav .column-title-nav-item { text-align: center; } .zixun-icon { width: 30px; height: 30px; /* background-image: url(../img/zixun-1.png); */ margin: auto; } .zixun-title { font-size: 18px; font-weight: 400; line-height: 25px; margin-top: 6px; color: #525252; } .information-active div { color: #0076c2 !important; } .zixun-item-1 { background-image: url(../img/zixun-1.png); } .zixun-item-2 { background-image: url(../img/zixun-3.png); } .zixun-item-3 { background-image: url(../img/zixun-4.png); } .zixun-item-4 { background-image: url(../img/zixun-5.png); } .information-active .zixun-item-1 { background-image: url(../img/zixun-1-1.png) !important; } .information-active .zixun-item-2 { background-image: url(../img/zixun-3-1.png) !important; } .information-active .zixun-item-3 { background-image: url(../img/zixun-4-1.png) !important; } .information-active .zixun-item-4 { background-image: url(../img/zixun-5-1.png) !important; } .column-layout { /* background-image: url(../img/home-bg.png); */ } .column-title-nav::after { content: ""; border-bottom: 10px solid #0076c2; border-left: 7px solid transparent; border-right: 7px solid transparent; position: absolute; left: 4%; bottom: 0; transition: left 0.3s ease-in-out; } .column-title-nav-1::after { left: 4% !important; } .column-title-nav-2::after { left: 34% !important; } .column-title-nav-3::after { left: 64% !important; } .column-title-nav-4::after { left: 95% !important; } .column-title-nav-5::after { left: 94% !important; } .column-2 { display: flex; justify-content: space-between; } .column-2 .column-2-left { flex: 1; margin-right: 80px; } .column-2 .column-2-left .column-2-left-main { margin-top: 80px; } .column-2 .column-2-left .column-2-left-main .column-2-data-box { display: flex; justify-content: space-between; margin-bottom: 80px; } .column-2 .column-2-left .column-2-left-main .column-2-data-box .column-2-data>div:nth-child(1) { font-size: 60px; font-weight: 400; line-height: 82.32px; color: #000000; } .column-2 .column-2-left .column-2-left-main .column-2-data-box .column-2-data>div:nth-child(2) { font-size: 18px; font-weight: 400; line-height: 24.7px; color: rgba(0, 0, 0, 0.6); } .column-2 .column-2-left .column-2-left-main .column-2-text { font-size: 18px; font-weight: 400; letter-spacing: 1px; line-height: 30px; color: #000000; } .column-2 .column-2-left .column-2-left-main .column-2-text>p { text-align: justify !important; } .column-2 .column-2-right { width: 319px; height: 700px; } .column-3 .column-3-main { margin-top: 76px; display: flex; } .column-3 .column-3-main .column-3-main-left { width: 708px; height: 435px; margin-right: 60px; } .column-3 .column-3-main .column-3-main-left .column-3-swiper { height: 100%; width: 100%; } .column-3 .column-3-main .column-3-main-left .column-3-swiper .swiper-slide { background-color: aqua; } .column-3 .column-3-main .column-3-main-left .column-3-swiper .swiper-text { width: 100%; height: 98px; background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.01) 100%); backdrop-filter: blur(1px); position: absolute; bottom: 0; left: 0; display: flex; justify-content: space-between; align-items: end; padding: 16px 31px; z-index: 9; font-size: 18px; font-weight: 400; letter-spacing: 0px; color: #ffffff; } .column-3 .column-3-main .column-3-main-left .column-3-swiper .swiper-text .column-3-pagination { display: flex; } .column-3 .column-3-main .column-3-main-left .column-3-swiper .swiper-text .column-3-pagination .column-3-pagination-item { width: 8px; height: 6px; border-radius: 20px; background: rgba(255, 255, 255, 0.6); margin-right: 4px; transition: all 0.3s ease-in-out; cursor: pointer; } .column-3 .column-3-main .column-3-main-left .column-3-swiper .swiper-text .column-3-pagination .column-3-pagination-active { width: 30px; height: 6px; border-radius: 20px; background: #ffffff; } .column-3 .column-3-main .column-3-main-right { flex: 1; display: flex; flex-direction: column; /* justify-content: space-between; */ } .column-3 .column-3-main .column-3-main-right .column-3-news { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; min-height: 82px; } .column-3 .column-3-main .column-3-main-right .column-3-news>div:nth-child(1) { width: 64%; } .column-3 .column-3-main .column-3-main-right .column-3-news>div:nth-child(1)>div:nth-child(1) { font-size: 18px; font-weight: 400; /* line-height: 25px; */ color: #474747; margin-bottom: 12px; } .column-3 .column-3-main .column-3-main-right .column-3-news>div:nth-child(1)>div:nth-child(2) { font-size: 16px; font-weight: 400; line-height: 22px; color: #b5b5b5; } .column-3 .column-3-main .column-3-main-right .column-3-news>div:nth-child(2) { text-align: center; } .column-3 .column-3-main .column-3-main-right .column-3-news>div:nth-child(2)>div:nth-child(1) { font-size: 36px; font-weight: 400; line-height: 50px; color: #dedede; } .column-3 .column-3-main .column-3-main-right .column-3-news>div:nth-child(2)>div:nth-child(2) { font-size: 14px; font-weight: 400; line-height: 20px; color: #cccccc; } .column-3 .column-3-main .column-3-main-right .column-3-news:last-child { margin-bottom: 0; } .column-3-news:hover div { color: #0076c2 !important; } .head { width: 100%; height: 764px; background: url(https://img.js.design/assets/img/645b4abe729082cbc15bf319.jpeg#90feea02b21d263a6efbaed0fa9e9b05); background-repeat: no-repeat; background-size: cover; position: relative; } .head .head-slogan { position: absolute; left: 160px; top: 40%; color: #ffffff; font-family: jiangxi; } .head .head-slogan>div:nth-child(1) { font-size: 72px; font-weight: 400; letter-spacing: 10px; line-height: 94.25px; } .head .head-slogan>div:nth-child(2) { font-size: 36px; font-weight: 400; letter-spacing: 4px; line-height: 47.12px; margin-top: 12px; } .head .head-menu { display: flex; align-items: flex-end; position: absolute; bottom: 0; padding-left: 160px; padding-right: 102px; /* background: black; */ background: rgba(0, 80, 133, 1); /* padding-top: 9px; */ height: 100px; } .head .head-menu>a { font-size: 24px; font-weight: 400; line-height: 100px; color: #ffffff; width: 156px; height: 100px; text-align: center; /* background: black; */ background: rgba(0, 80, 133, 1); cursor: pointer; transition: all 0.3s ease-in-out; text-decoration: none; } .head .head-menu .head-menu-active, .head .head-menu>a:hover { height: 109px; line-height: 109px; /* background: #0076c2; */ background: white; color: rgba(0, 118, 194, 1); } /* 关于金和 */ .main { width: calc(100% - 260px * 2); margin: auto; margin-top: 80px; margin-bottom: 80px; } .fazhan-box { width: 100%; height: 446px; background-image: url(../img/fazhan-bg.png); background-size: contain; background-repeat: no-repeat; position: relative; } .fazhan-box .swiper-fazhan { height: 100%; width: 100%; } .fazhan-box .swiper-fazhan .fanzhan-item { position: absolute; text-align: center; font-weight: 400; width: 260px; display: flex; flex-direction: column; } .fazhan-box .swiper-fazhan .fanzhan-item>div:nth-child(1) { font-size: 18px; color: #000000; margin: 14px 0; } .fazhan-box .swiper-fazhan .fanzhan-item>div:nth-child(2) { font-size: 16px; line-height: 21.95px; color: #5c5c5c; } .fazhan-box .swiper-fazhan .fanzhan-item:nth-child(1) { bottom: 25px; } .fazhan-box .swiper-fazhan .fanzhan-item:nth-child(2) { left: 164px; top: 160px; flex-direction: column-reverse; } .fazhan-box .swiper-fazhan .fanzhan-item:nth-child(3) { bottom: 0; left: 487px; top: 190px; } .fazhan-box .swiper-fazhan .fanzhan-item:nth-child(4) { left: 723px; top: 96px; flex-direction: column-reverse; } .fazhan-box .swiper-fazhan .fanzhan-item:nth-child(5) { left: 1070px; top: 162px; } .swiper-btn { width: 100%; display: flex; justify-content: flex-end; } .swiper-btn>div { width: 104px; height: 47px; opacity: 1; border-radius: 10px; border: 1px solid #0076c2; background-image: url(../img/jiantou.svg); background-repeat: no-repeat; background-position: center; } .swiper-btn .swiper-fazhan-next { transform: rotate(180deg); margin-right: 20px; } .swiper-btn .swiper-fazhan-disabled { opacity: 0.2; } .fazhan-main { margin-bottom: 160px !important; } .directorate-box { margin-top: 80px; width: 100%; } .directorate-box>div:nth-child(1) { display: flex; padding-bottom: 80px; border-bottom: 1px solid #ededed; } .directorate-box>div:nth-child(1) .left { width: 315px; height: 408px; margin-right: 80px; position: relative; } .directorate-box>div:nth-child(1) .left>img { height: 100%; width: 100%; object-fit: contain; } .directorate-box>div:nth-child(1) .left>div { height: 70px; background: #0076c2; font-size: 24px; font-weight: 400; line-height: 70px; color: #ffffff; text-align: center; position: absolute; bottom: 0; left: 0; width: 100%; } .directorate-box>div:nth-child(1) .right { width: calc(100% - 395px); } .directorate-box>div:nth-child(1) .right>div:nth-child(1)>div:nth-child(1) { font-size: 48px; font-weight: 500; line-height: 29px; color: #daeef9; } .directorate-box>div:nth-child(1) .right>div:nth-child(1)>div:nth-child(2) { font-size: 24px; font-weight: 400; line-height: 32.93px; color: #666666; } .directorate-box>div:nth-child(1) .right>div:nth-child(2) { font-size: 18px; font-weight: 400; letter-spacing: 1px; line-height: 30px; color: #6e6e6e; text-align: justify; margin-top: 30px; overflow: hidden; white-space: normal; word-break: break-all; } .directorate-box>div:nth-child(1) .right>div:nth-child(2) span { text-wrap: wrap !important; } .directorate-box>div:nth-child(2) { text-align: center; margin-top: 80px; } .directorate-box>div:nth-child(2)>div:nth-child(1)>div:nth-child(1) { font-size: 48px; font-weight: 500; line-height: 29px; color: #daeef9; } .directorate-box>div:nth-child(2)>div:nth-child(1)>div:nth-child(2) { font-size: 24px; font-weight: 400; line-height: 32.93px; color: #666666; } .directorate-box>div:nth-child(2)>div:nth-child(2) { margin-top: 80px; display: flex; justify-content: space-between; } .directorate-box>div:nth-child(2)>div:nth-child(2) .directorate-item { width: 292px; height: 560px; text-decoration: none; } .directorate-box>div:nth-child(2)>div:nth-child(2) .directorate-item>img { height: 260px; width: 100%; object-fit: cover; } .directorate-box>div:nth-child(2)>div:nth-child(2) .directorate-item>div:nth-child(2) { height: 80px; font-size: 20px; font-weight: 400; line-height: 80px; color: #000000; text-align: center; background: #d5dde3; position: relative; } .directorate-box>div:nth-child(2)>div:nth-child(2) .directorate-item>div:nth-child(2)::after { content: ""; position: absolute; bottom: -12px; left: calc(50% - 25px); border-top: 12px solid #d5dde3; border-left: 25px solid transparent; border-right: 25px solid transparent; } .directorate-box>div:nth-child(2)>div:nth-child(2) .directorate-item>div:nth-child(3) { height: 220px; padding: 35px; text-align: center; /* display: flex; flex-direction: column; justify-content: space-around; */ overflow: hidden; white-space: normal; word-break: break-all; background: #f0f0f0; } .directorate-box>div:nth-child(2)>div:nth-child(2) .directorate-item>div:nth-child(3)>div:nth-child(1) { font-size: 18px; font-weight: 400; line-height: 24.7px; color: #6e6e6e; } .directorate-box>div:nth-child(2)>div:nth-child(2) .directorate-item>div:nth-child(3)>div:nth-child(2) { font-size: 16px; font-weight: 400; line-height: 24px; color: #787878; margin-top: 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; line-clamp: 4; -webkit-box-orient: vertical; } .directorate-box>div:nth-child(2)>div:nth-child(2) .directorate-item>div:nth-child(3)>div:nth-child(2) p { text-indent: 0 !important; text-align: justify !important; } .directorate-box>div:nth-child(2)>div:nth-child(2) .directorate-item>div:nth-child(3)>div:nth-child(2) p img { display: none !important; } .common-box { margin-top: 80px; display: flex; } .common-box .left { width: 200px; margin-right: 60px; } .common-box .left .menu>a>div { width: 200px; height: 80px; font-size: 18px; font-weight: 400; line-height: 80px; color: #8c8c8c; text-align: center; border: 1px solid #787878; /* padding-left: 30px; */ position: relative; cursor: pointer; margin-top: -1px; } .common-box .left .menu>a { text-decoration: none; } /* .common-box .left .menu>a>div::after { content: ""; position: absolute; left: 20px; top: 38px; width: 18px; height: 2px; background: #8c8c8c; } */ .common-box .left .menu .menu-active { background: #0076c2; border: 1px solid #0076c2; color: white; } .common-box .left .menu .menu-active::after { background: white; } .common-box .left .concat { margin-top: 30px; } .common-box .left .concat>div:nth-child(1) { font-size: 20px; font-weight: 400; color: #000000; } .common-box .left .concat>div:nth-child(2) { margin-top: 20px; display: flex; align-items: center; padding: 15px 0; border-top: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0; } .common-box .left .concat>div:nth-child(2)>img { width: 40px; height: 40px; margin-right: 16px; } .common-box .left .concat>div:nth-child(2)>div:nth-child(2) { font-size: 18px; font-weight: 400; line-height: 24.7px; color: #787878; } .common-box .right { width: calc(100% - 260px); } .common-box .right .art-content { position: relative; margin-top: 60px; padding: 40px 429px 46px 40px; background: #fafafa; white-space: normal; word-break: break-all; min-height: 318px; } .common-box .right .art-content>img { position: absolute; right: 0; top: -142px; width: 354px; height: 460px; } .common-box .right .art-content span { text-wrap: wrap !important; text-align: justify; } .common-box .right .organizational { width: 100%; height: 395px; background: #fafafa; margin-top: 100px; display: none; } .common-box .right .organizational>img { height: 100%; width: 100%; } .title-opt { display: flex; align-items: center; justify-content: space-between; } .title-opt .toggle-btn { /* >div:nth-child(1) {} */ } .title-opt .toggle-btn>div { height: 42px; width: 30px; margin: 0 5px; background-image: url(../img/prev.svg); background-size: 100% 100%; display: inline-block; } .title-opt .toggle-btn>div:hover { background-image: url(../img/prev-hover.svg); } .title-opt .toggle-btn>div:nth-child(2) { transform: rotate(180deg); } .art-title>div:nth-child(1) { font-size: 48px; font-weight: 500; line-height: 29px; color: #daeef9; } .art-title>div:nth-child(2) { font-size: 24px; font-weight: 400; line-height: 32.93px; color: #666666; } .main-top-40 { margin-top: 40px; } .main-top-60 { margin-top: 60px; } .main-top-80 { margin-top: 80px; } .main-top-100 { margin-top: 100px; } .technology-box>img { width: 100%; height: 225px; } .technology-box .technology-data { width: calc(100% - 40px); height: 250px; box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.2); backdrop-filter: blur(10px); margin: auto; display: flex; justify-content: space-between; align-items: center; margin-top: -55px; } .technology-box .technology-data .technology-data-item { color: #000000; font-weight: 400; padding: 0 80px; /* border-right: 1px solid rgba(168, 168, 168, 1); */ position: relative; padding-top: 20px; } .technology-box .technology-data .technology-data-item>div:nth-child(1) { font-size: 40px; } .technology-box .technology-data .technology-data-item>div:nth-child(1)>span { font-size: 18px; color: #000000; } .technology-box .technology-data .technology-data-item>div:nth-child(2) { font-size: 18px; font-weight: 400; color: rgba(0, 0, 0, 0.6); margin-top: 10px; } .technology-box .technology-data .technology-data-item::after { content: ""; height: 60px; width: 1px; background: #a8a8a8; position: absolute; top: 40px; right: 0; } .technology-box .technology-data .technology-data-item:last-child::after { width: 0; } .technology-box .technology-text { margin-top: 60px; font-size: 18px; font-weight: 400; letter-spacing: 1px; line-height: 30px; color: #6e6e6e; text-align: center; } .column-title .time { font-size: 18px; font-weight: 400; color: #525252; text-align: center; padding-bottom: 27px; border-bottom: 1px solid #cccccc; } .column-title .time>span:nth-child(1) { margin-left: 12px; } .column-title .time>span { margin-right: 40px; cursor: pointer; } .column-title .time .time-active { color: #0076c2; position: relative; } .column-title .time .time-active:after { content: ""; position: absolute; bottom: -32px; left: 50%; border-bottom: 10px solid #0076c2; border-left: 7px solid transparent; border-right: 7px solid transparent; } .rongyu-box { display: flex; flex-wrap: wrap; } .rongyu-box .rongyu-box-layout { width: calc(100% / 4); margin-bottom: 40px; } .rongyu-item { background: white; width: 330px; height: 340px; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: auto; cursor: pointer; } .rongyu-item>div:nth-child(1) { padding: 18px 11px; background: #f5f5f5; text-align: center; } .rongyu-item>div:nth-child(1)>img { width: 278px; height: 188px; } .rongyu-item>div:nth-child(2) { font-size: 18px; font-weight: 400; line-height: 24.7px; color: #000000; text-align: center; margin: 20px 15px 6px 15px; } .line-1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .line-1-1 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; } .line-2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } .line-3 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; } .wenhua-box { display: grid; grid-template-columns: auto auto auto auto auto; justify-content: space-between; } .wenhua-box>div { margin-bottom: 40px; width: 251px; height: 227px; border-radius: 20px; background: #ffffff; box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.04); font-weight: 400; display: flex; flex-direction: column; justify-content: center; align-items: center; } .wenhua-box>div>img { height: 30px; width: 30px; } .wenhua-box>div>div:nth-child(2) { font-size: 18px; color: #000000; text-align: center; margin: 20px 0 10px 0; } .wenhua-box>div>div:nth-child(3) { font-size: 16px; color: #525252; } .wenhua-box>div:nth-child(5) { grid-column: 5; grid-row: 1 / span 2; width: 251px; height: 494px; } .wenhua-title { margin-bottom: 60px; } .wenhua-box-1 { background: #0076c2; padding: 60px 0; margin-bottom: 80px; min-height: 586px; position: relative; } .wenhua-box-1 .wenhua-box-1-main { width: calc(100% - 260px * 2); margin: auto; font-size: 18px; font-weight: 400; color: #ffffff; } .wenhua-box-1 .wenhua-box-1-main>img { width: 686px; height: 716px; position: absolute; right: 260px; bottom: 0; } .wenhua-box-1 .wenhua-box-1-main p { margin-bottom: 24px !important; } .wenhua-box-1 .wenhua-box-1-main span { font-size: 18px !important; font-weight: 400 !important; color: #ffffff !important; } .gongyi-box>img { width: 100%; height: 225px; } .gongyi-box>div { font-size: 18px; font-weight: 400; letter-spacing: 1px; line-height: 30px; color: #6e6e6e; text-align: center; overflow: hidden; word-wrap: break-word; } .gongyi-box-list { margin-top: 100px; } .list-item::before { content: ""; height: calc(100% - 52px); width: 1px; background: #0076c2; position: absolute; left: calc(127px / 2); top: 52px; } .list-item:last-child::before { width: 0; } .list-item::after { content: ""; width: 40px; height: 4px; background: #b6cfe0; position: absolute; left: calc(127px + 20px); top: 26px; } .list-item { display: flex; /* height: 100%; */ position: relative; } .list-item>div:nth-child(1) { width: 127px; height: 52px; margin-right: 80px; background: #0076c2; font-size: 20px; font-weight: 500; line-height: 52px; color: #ffffff; text-align: center; } .list-item>div:nth-child(2) { width: calc(100% - 207px); background: #fafafa; margin-bottom: 60px; padding: 30px; display: flex; justify-content: space-between; } .list-item>div:nth-child(2)>div:nth-child(1)>div:nth-child(1) { font-size: 20px; font-weight: 400; line-height: 28px; color: #0076c2; padding-left: 26px; position: relative; } .list-item>div:nth-child(2)>div:nth-child(1)>div:nth-child(1)::after { content: ""; width: 6px; height: 100%; background: #0076c2; position: absolute; left: 0; top: 0; } .list-item>div:nth-child(2)>div:nth-child(1)>div:nth-child(2) { font-size: 18px; font-weight: 400; letter-spacing: 1px; line-height: 30px; color: #6e6e6e; text-align: justify; margin-top: 30px; margin-right: 60px; } .list-item>div:nth-child(2)>img { width: 443px; height: 238px; } .rongyu-list { padding: 30px 30px 75px 30px; background: #F8F8F8; display: flex; flex-wrap: wrap; } .rongyu-list .rongyu-box-layout { width: calc(100% / 3); margin-bottom: 30px; } .xiangmu-list .list-item::before { content: ""; height: calc(100% - 52px); width: 1px; background: #0076c2; position: absolute; left: calc(127px / 2); top: 52px; } .xiangmu-list .list-item:last-child::before { width: 0; } .xiangmu-list .list-item::after { content: ""; width: 40px; height: 4px; background: #b6cfe0; position: absolute; left: calc(127px + 20px); top: 26px; } .xiangmu-list .list-item { text-decoration: none; } .xiangmu-list .list-item>div:nth-child(2)>img { width: 200px; height: 238px; } .jiancai-zhanshi .swiper { width: 100%; height: 100%; } .jiancai-zhanshi .jiancai-zhanshi-item { display: inline-block; cursor: pointer; text-decoration: none; } .jiancai-zhanshi .jiancai-zhanshi-item>img { width: 337px; height: 433px; } .jiancai-zhanshi .jiancai-zhanshi-item>div { display: flex; align-items: center; width: 337px; border-top: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0; } .jiancai-zhanshi .jiancai-zhanshi-item>div>div:nth-child(1) { font-size: 18px; color: #999; width: 55%; } .jiancai-zhanshi .jiancai-zhanshi-item>div>div:nth-child(2) { width: 45%; display: flex; align-items: center; justify-content: space-between; } .jiancai-zhanshi .jiancai-zhanshi-item>div>div:nth-child(2)>div:nth-child(1) { font-family: "Helvetica"; font-size: 54px; color: #e3e3e3; } .jiancai-zhanshi .jiancai-zhanshi-item>div>div:nth-child(2)>div:nth-child(2) { height: 20px; width: 20px; background-image: url(../img/youjiantou.svg); background-size: 100% 100%; } .jiancai-zhanshi .jiancai-zhanshi-item:hover { display: inline-block; } .jiancai-zhanshi .jiancai-zhanshi-item:hover>div { border-top: 1px solid #0A8AD5; border-bottom: 1px solid #0A8AD5; } .jiancai-zhanshi .jiancai-zhanshi-item:hover>div>div:nth-child(1) { color: #0A8AD5; } .jiancai-zhanshi .jiancai-zhanshi-item:hover>div>div:nth-child(2)>div:nth-child(1) { color: #0A8AD5; } .jiancai-zhanshi .jiancai-zhanshi-item:hover>div>div:nth-child(2)>div:nth-child(2) { background-image: url(../img/youjiantou-hover.svg); } .chanpin-box { padding: 106px 160px; } .chanpin-box .chanpin-list-layout { width: 24%; display: inline-block; } .chanpin-list .chanpin-item { cursor: pointer; margin-bottom: 60px; display: inline-block; text-decoration: none; } .chanpin-list .chanpin-item>img { width: 340px; height: 340px; border-radius: 10px; background: #cccccc; } .chanpin-list .chanpin-item>div { margin-top: 20px; font-size: 18px; font-weight: 400; color: #000000; text-align: center; } .zixun-main { background-image: url(../img/zixun-bg.png); padding: 80px 260px; width: 100%; margin: 0; } .zixun-box { margin-top: 20px; } .page { text-align: center; } .zixun-item { display: flex; justify-content: space-between; align-items: center; cursor: pointer; border-bottom: 1px solid #e6e6e6; padding-bottom: 60px; text-decoration: none; } .zixun-item>div:nth-child(1) { display: flex; align-items: center; } .zixun-item>div:nth-child(1)>img { width: 315px; height: 210px; } .zixun-item>div:nth-child(1)>div:nth-child(2) { width: 700px; margin-left: 60px; } .zixun-item>div:nth-child(1)>div:nth-child(2)>div:nth-child(1) { font-size: 20px; font-weight: 400; color: #474747; margin-bottom: 20px; } .zixun-item>div:nth-child(1)>div:nth-child(2)>div:nth-child(2) { font-size: 18px; font-weight: 400; letter-spacing: 1px; line-height: 30px; color: #9e9e9e; text-align: justify; } .zixun-item>div:nth-child(2) { text-align: center; padding-left: 100px; border-left: 4px solid #e6e6e6; } .zixun-item>div:nth-child(2)>div:nth-child(1) { font-size: 48px; font-weight: 400; color: #dedede; } .zixun-item>div:nth-child(2)>div:nth-child(2) { font-size: 24px; font-weight: 400; color: #cccccc; } .zixun-item:hover { text-decoration: none; border-bottom: 1px solid #0A8AD5; } .zixun-item:hover>div:nth-child(1)>div:nth-child(2)>div:nth-child(1) { color: #0A8AD5; } .zixun-item:hover>div:nth-child(1)>div:nth-child(2)>div:nth-child(2) { color: #0A8AD5; } .zixun-item:hover>div:nth-child(2) { border-left: 4px solid #0A8AD5; } .zixun-item:hover>div:nth-child(2)>div:nth-child(1) { color: #0A8AD5; } .zixun-item:hover>div:nth-child(2)>div:nth-child(2) { font-size: 24px; font-weight: 400; color: #0A8AD5; } .lianxiqiye>div:nth-child(1) { height: 530px; } .lianxiqiye>div { width: 894px; height: 400px; position: relative; /* background-size: cover; */ } .lianxiqiye>div>div:nth-child(1) { background: #0076c2; box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.04); display: flex; padding: 10px 30px; position: absolute; top: 147px; left: 125px; } .lianxiqiye>div>div:nth-child(1)>img { width: 60px; height: 50px; margin-right: 10px; background: black; object-fit: none; } .lianxiqiye>div>div:nth-child(1)>div>div:nth-child(1) { font-size: 18px; font-weight: 500; color: #ffffff; } .lianxiqiye>div>div:nth-child(1)>div>div:nth-child(2) { font-size: 14px; font-weight: 400; color: rgba(255, 255, 255, 0.8); } .lianxiqiye>div>div:nth-child(2) { padding: 40px 60px 40px 70px; background: white; position: absolute; top: 40px; right: -253px; background: #ffffff; box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.04); } .lianxiqiye>div>div:nth-child(2)>div { border-bottom: 1px solid #dedede; padding-bottom: 20px; padding-top: 20px; padding-right: 109px; } .lianxiqiye>div>div:nth-child(2)>div>img { width: 18px; height: 18px; } .lianxiqiye>div>div:nth-child(2)>div>div:nth-child(2) { font-size: 18px; font-weight: 400; color: #696969; margin: 15px 0; } .lianxiqiye>div>div:nth-child(2)>div>div:nth-child(3) { font-size: 18px; font-weight: 400; color: #898989; } .lianxiqiye>div>div:nth-child(2)>div:nth-child(1) { padding-top: 0; } .lianxiqiye>div>div:nth-child(2)>div:last-child { border-bottom: 0; padding-bottom: 0; } .zaixianliuyan { padding: 40px 60px 77px 60px; background: white; } .zaixianliuyan .submit { width: 272px; height: 47px; border-radius: 10px; background: #0076c2; font-size: 18px; font-weight: 400; line-height: 47px; color: #ffffff; text-align: center; margin: auto; margin-top: 60px; cursor: pointer; } .zaixianliuyan .submit:hover { opacity: 0.6; } .zaixianliuyan .zaixianliuyan-layout { display: flex; justify-content: space-between; } .zaixianliuyan .item { width: calc((100% - 60px)/2); } .zaixianliuyan .item>div:nth-child(1) { font-size: 18px; font-weight: 400; color: #8c8c8c; margin-bottom: 14px; } .zaixianliuyan .item>div:nth-child(2) { padding: 12px 21px; background: #f9f9f9; border: 1px solid #e6e6e6; display: flex; /* align-items: center; */ } .zaixianliuyan .item>div:nth-child(2)>img { height: 24px; width: 24px; margin-right: 24px; object-fit: none; } .zaixianliuyan .item>div:nth-child(2)>input { background: none; outline: none; border: none; width: calc(100% - 48px); padding: 3px 0; } .zaixianliuyan .item>div:nth-child(2)>input:focus { border: none; } .zaixianliuyan .item-textarea { width: 100%; } .zaixianliuyan .item-textarea>div:nth-child(2) { display: flex; } .zaixianliuyan .item-textarea>div:nth-child(2)>textarea { width: 100%; } .zaixianliuyan .item-textarea>div:nth-child(2)>textarea { background: none; outline: none; border: none; } .zaixianliuyan .item-textarea>div:nth-child(2)>textarea:focus { border: none; } input, textarea { font-size: 18px; } input::placeholder, textarea::placeholder { font-size: 18px; font-weight: 400; line-height: 24.7px; color: #c9c9c9; } .detail-box { background-color: white; } .detail-box .detail-head { height: 518px; width: 100%; background-image: url(../img/chanyeBanner.png); position: relative; } .detail-box .detail-head>div { width: 100%; position: absolute; padding: 20px 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.5); } .detail-box .detail-head>div>div { color: #fff; font-size: 18px; text-decoration: none; } .detail-box .detail-head>div>div>a { color: #fff; font-size: 18px; text-decoration: none; } .detail-box .detail-head>div>div>span { margin: 0 5px; } .detail-box .detail-main { background-color: #f4f4f4; padding: 42px 50px 36px; } .detail-box .detail-main .detail-main-title { padding-bottom: 26px; border-bottom: 2px solid #dedede; text-align: center; color: #666; } .detail-box .detail-main .detail-main-title>div:nth-child(1) { font-size: 24px; margin-bottom: 10px; } .detail-box .detail-main .detail-main-title>div:nth-child(2) span { color: #666; font-size: 14px; margin: 0 10px; } .detail-main-title .tool { display: flex; align-items: center; justify-content: flex-end; } .detail-main-title .tool div { height: 31px; width: 31px; background: #DADADA; border-radius: 50%; margin-left: 20px; cursor: pointer; display: flex; align-items: center; justify-content: center; } .detail-main-title .tool div:hover { background: rgb(49, 141, 191); } .detail-main-title .tool div img { height: 22px; width: 22px; } .qrcode-wechat { padding: 10px; position: fixed; top: 50%; left: calc(50% - 95px); background: white; width: 190px; z-index: 9999; display: none; } .qrcode-wechat>div:nth-child(1) { font-size: 12px; font-weight: bold; text-align: left; line-height: 16px; color: #000; display: flex; justify-content: space-between; align-items: center; } .qrcode-wechat>div:nth-child(1)>img { height: 16px; width: 16px; } .qrcode-wechat>div:nth-child(3) { font-size: 12px; text-align: left; color: #666; text-align: justify; } #qrcode { /* height: 150px; width: 150px; */ padding: 15px 10px; } .detail-box .detail-main .detail-main-content { padding-top: 25px; margin-bottom: 46px; text-align: justify; } .detail-main-content img { width: 800px; /* height: 640px; */ margin: auto; } .search-box { margin-bottom: 181px !important; } .search-box .search-head { width: 100%; height: 600px; background-image: url(../img/search-bg.png); background-size: cover; display: flex; justify-content: center; align-items: center; } .search-box .search-head>div { text-align: center; } .search-box .search-head>div>div:nth-child(1) { font-size: 60px; font-weight: 400; color: #ffffff; } .search-box .search-head>div>div:nth-child(2) { font-size: 36px; font-weight: 400; color: rgba(255, 255, 255, 0.7); } .search-box .search { width: 100%; text-align: center; margin-top: -78px; } .search-box .search>form>div { padding: 50px 100px; background: #ffffff; box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.1); display: inline-flex; } .search-box .search>form>div .search-input { width: 1260px; height: 100px; border-radius: 10px; background: #ededed; border: 1px solid #666666; font-size: 24px; padding: 32px 50px; } .search-box .search>form>div .search-input::placeholder { font-size: 24px; font-weight: 400; color: #878787; } .search-box .search>form>div>button { width: 100px; height: 100px; opacity: 1; border-radius: 10px; background: #0076c2; background-image: url(../img/search-1.png); margin: 0; padding: 0; border: none; outline: none; margin-left: 30px; } .search-box .search>form>div>button:hover { opacity: 0.6; } .search-box .search-result>div:nth-child(1) { font-size: 18px; font-weight: 400; color: #7a7a7a; text-align: center; } .search-box .search-result .result-list>a { text-decoration: none; } .search-box .search-result .result-list>a>div { display: block !important; font-size: 18px; font-weight: 400; color: #696969; padding: 80px 0 30px 0; border-bottom: 1px solid #d6d6d6; } .search-box .search-result .result-list>a>div>span { font-weight: 500; color: #0076c2; } #mobile-header, .mobile-frame, .mobile-fazhan-box, .scroll-menu, .mobile-zixun-box, .menu-btn, .mobile-zixun-box, .mobile-zixun-concat, .wenhua-btn { display: none; } table { width: 100% !important; } td { border: 1px solid black !important; }